@principal-ade/panel-layouts 0.4.0 → 0.4.2
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/dist/index.d.ts +26 -1
- package/dist/index.esm.js +117 -114
- package/dist/index.js +17 -17
- package/package.json +10 -11
- package/dist/index.css +0 -1
- package/dist/styles.css +0 -1
package/dist/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";require('./index.css');var Fe=Object.defineProperty;var qe=(o,e,t)=>e in o?Fe(o,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):o[e]=t;var se=(o,e,t)=>qe(o,typeof e!="symbol"?e+"":e,t);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const ne=require("@principal-ade/panels"),i=require("react"),s=require("react/jsx-runtime"),U=require("@principal-ade/industry-theme");class je{constructor(){se(this,"storageKey","panel-layouts")}async load(e){try{const t=localStorage.getItem(`${this.storageKey}:${e}`);return t?JSON.parse(t):null}catch(t){return console.error(`Failed to load panel layout for ${e}:`,t),null}}async save(e,t){try{localStorage.setItem(`${this.storageKey}:${e}`,JSON.stringify(t))}catch(r){console.error(`Failed to save panel layout for ${e}:`,r)}}}function Oe(o){const{viewKey:e,defaultSizes:t,panelType:r,adapter:a=new je}=o,[c,l]=i.useState(t),[n,m]=i.useState(o.collapsed),d=i.useRef(o.collapsed),b=i.useRef({}),p=i.useRef(null),h=i.useRef(null);i.useEffect(()=>{(async()=>{const w=await a.load(e);w!=null&&w.sizes&&(l(w.sizes),v(w.sizes))})()},[e]);const v=i.useCallback(S=>{"left"in S&&S.left>0&&(b.current.left=S.left),"middle"in S&&S.middle>0&&(b.current.middle=S.middle),"right"in S&&S.right>0&&(b.current.right=S.right)},[]),g=i.useCallback(S=>{const w=b.current[S];if(w&&w>0)return w;if(S==="left"&&"left"in t&&t.left>0)return t.left;if(S==="right"&&"right"in t&&t.right>0)return t.right},[t]),u=i.useRef(t);i.useEffect(()=>{("left"in t&&t.left!==u.current.left||"middle"in t&&"middle"in u.current&&t.middle!==u.current.middle||"right"in t&&t.right!==u.current.right)&&(l(t),v(t),u.current=t)},[t,v]),i.useEffect(()=>{const S=o.collapsed.left!==d.current.left,w="right"in o.collapsed&&"right"in d.current&&o.collapsed.right!==d.current.right;(S||w)&&(m(o.collapsed),d.current={...o.collapsed})},[o.collapsed.left,o.collapsed.right]);const f=i.useCallback(async S=>{try{await a.save(e,{sizes:S})}catch(w){console.error(`Failed to save panel preferences for ${e}:`,w)}},[e,a]),x=i.useCallback(S=>{const w={...S};let k=!0;if("left"in S){const T=!!(n!=null&&n.left),E=S.left;if(T){const j=g("left");j!==void 0&&j>0?w.left=j:k=!1}else E===0&&(k=!1)}if(r==="three-panel"&&"right"in S){const T=!!(n!=null&&n.right),E=S.right;if(T){const j=g("right");j!==void 0&&j>0?w.right=j:k=!1}else E===0&&(k=!1)}if(l(w),v(w),p.current&&(clearTimeout(p.current),p.current=null),!k){h.current=null;return}h.current=w,p.current=setTimeout(()=>{const T=h.current;T&&(f(T),h.current=null),p.current=null},500)},[n,g,r,f,v]);i.useEffect(()=>()=>{if(p.current){const S=h.current;S&&(f(S),h.current=null),clearTimeout(p.current),p.current=null}},[f]);const $=i.useCallback(async()=>{},[]),M=i.useCallback(async()=>{},[]),A=i.useCallback(async()=>{},[]),I=i.useCallback(async()=>{},[]);return r==="three-panel"?{type:"three-panel",sizes:c,collapsed:n,handlePanelResize:x,handleLeftCollapseComplete:$,handleLeftExpandComplete:M,handleRightCollapseComplete:A,handleRightExpandComplete:I}:{type:"two-panel",sizes:c,collapsed:n,handlePanelResize:x,handleLeftCollapseComplete:$,handleLeftExpandComplete:M}}class Ie{constructor(){se(this,"PRESETS_KEY","panel-layouts:workspace-presets");se(this,"REPO_STATE_PREFIX","panel-layouts:repo-state:")}async loadWorkspacePresets(){try{const e=localStorage.getItem(this.PRESETS_KEY);return e?JSON.parse(e):{}}catch(e){return console.error("Failed to load workspace presets:",e),{}}}async saveWorkspacePresets(e){try{localStorage.setItem(this.PRESETS_KEY,JSON.stringify(e))}catch(t){throw console.error("Failed to save workspace presets:",t),t}}async loadRepositoryState(e){try{const t=`${this.REPO_STATE_PREFIX}${e}`,r=localStorage.getItem(t);return r?JSON.parse(r):null}catch(t){return console.error(`Failed to load repository state for ${e}:`,t),null}}async saveRepositoryState(e,t){try{const r=`${this.REPO_STATE_PREFIX}${e}`;localStorage.setItem(r,JSON.stringify(t))}catch(r){throw console.error(`Failed to save repository state for ${e}:`,r),r}}async loadAllRepositoryStates(){try{const e={};for(let t=0;t<localStorage.length;t++){const r=localStorage.key(t);if(r&&r.startsWith(this.REPO_STATE_PREFIX)){const a=r.substring(this.REPO_STATE_PREFIX.length),c=localStorage.getItem(r);if(c)try{e[a]=JSON.parse(c)}catch(l){console.error(`Failed to parse repository state for ${a}:`,l)}}}return e}catch(e){return console.error("Failed to load all repository states:",e),{}}}}class _{static setAdapter(e){this.adapter=e}static async getWorkspaceLayouts(){const e=this.getBuiltInWorkspaceLayouts();return{...await this.adapter.loadWorkspacePresets(),...e}}static async getWorkspaceLayout(e){return(await this.getWorkspaceLayouts())[e]||null}static async createWorkspaceLayout(e){const t=await this.adapter.loadWorkspacePresets(),r=this.generateWorkspaceId(e.name),a={id:r,name:e.name,description:e.description,layout:e.layout,defaultSizes:e.defaultSizes,defaultCollapsed:e.defaultCollapsed,createdAt:Date.now(),updatedAt:Date.now(),isBuiltIn:!1},c={...t,[r]:a};return await this.adapter.saveWorkspacePresets(c),a}static async updateWorkspaceLayout(e,t){const r=await this.adapter.loadWorkspacePresets(),a=r[e];if(!a)return console.error(`Workspace layout ${e} not found`),null;if(a.isBuiltIn)return console.error(`Cannot update built-in workspace layout ${e}`),null;const c={...a,...t,id:e,createdAt:a.createdAt,updatedAt:Date.now()},l={...r,[e]:c};return await this.adapter.saveWorkspacePresets(l),c}static async deleteWorkspaceLayout(e){const t=await this.adapter.loadWorkspacePresets(),r=t[e];if(!r)return console.error(`Workspace layout ${e} not found`),!1;if(r.isBuiltIn)return console.error(`Cannot delete built-in workspace layout ${e}`),!1;const a={...t};return delete a[e],await this.adapter.saveWorkspacePresets(a),!0}static async getRepositoryState(e){return await this.adapter.loadRepositoryState(e)}static async setRepositoryState(e,t){await this.adapter.saveRepositoryState(e,t)}static async updateRepositorySizes(e,t){const r=await this.getRepositoryState(e);r&&await this.setRepositoryState(e,{...r,sizes:t})}static async updateRepositoryCollapsed(e,t){const r=await this.getRepositoryState(e);r&&await this.setRepositoryState(e,{...r,collapsed:t})}static hasStateDeviation(e,t){const r=t.defaultSizes?JSON.stringify(e.sizes)!==JSON.stringify(t.defaultSizes):!1,a=t.defaultCollapsed?JSON.stringify(e.collapsed)!==JSON.stringify(t.defaultCollapsed):!1;return{hasSizeDeviation:r,hasCollapsedDeviation:a}}static async updateWorkspaceFromRepositoryState(e,t){const r=await this.getWorkspaceLayout(e),a=await this.getRepositoryState(t);if(!r||!a||r.isBuiltIn){console.error("Cannot update built-in workspace or workspace/state not found");return}await this.updateWorkspaceLayout(e,{defaultSizes:a.sizes,defaultCollapsed:a.collapsed})}static async resetRepositoryToWorkspaceDefaults(e,t){const r=await this.getWorkspaceLayout(t);if(!r){console.error(`Workspace ${t} not found`);return}const a=await this.getRepositoryState(e);a&&await this.setRepositoryState(e,{...a,sizes:r.defaultSizes||{left:20,middle:45,right:35},collapsed:r.defaultCollapsed||{left:!1,right:!1}})}static isLayoutMatchingWorkspace(e,t){return this.areLayoutsEqual(e,t.layout)}static async findMatchingWorkspace(e){const t=await this.getWorkspaceLayouts();for(const[r,a]of Object.entries(t))if(this.isLayoutMatchingWorkspace(e,a))return r;return null}static areLayoutsEqual(e,t){return JSON.stringify(e)===JSON.stringify(t)}static generateWorkspaceId(e){return`${e.toLowerCase().replace(/[^a-z0-9]+/g,"-")}-${Date.now()}`}static getBuiltInWorkspaceLayouts(){const e=Date.now();return{"project-management":{id:"project-management",name:"Project Management",description:"Tasks, dependencies, issues, file tree, docs, drawings, multi terminal, city visualization, code viewer, markdown slides, and excalidraw",layout:{left:{type:"tabs",panels:["tasks","dependencies","gitIssues","fileTree","docs","drawings"],config:{defaultActiveTab:0,tabPosition:"top"}},middle:"multiTerminal",right:{type:"tabs",panels:["cityVisualization","codeViewer","markdownViewer","excalidrawDiagram"],config:{defaultActiveTab:0,tabPosition:"top"}}},defaultSizes:{left:20,middle:45,right:35},defaultCollapsed:{left:!1,right:!1},createdAt:e,updatedAt:e,isBuiltIn:!0},"code-review":{id:"code-review",name:"Code Review",description:"Git changes, pull requests, and file tree on left, git diff and code viewer in middle, city map on right",layout:{left:{type:"tabs",panels:["gitChanges","gitPullRequests","fileTree"],config:{defaultActiveTab:0,tabPosition:"top"}},middle:{type:"tabs",panels:["gitDiff","codeViewer"],config:{defaultActiveTab:0,tabPosition:"top"}},right:"cityVisualization"},defaultSizes:{left:20,middle:50,right:30},defaultCollapsed:{left:!1,right:!1},createdAt:e,updatedAt:e,isBuiltIn:!0},documentation:{id:"documentation",name:"Documentation",description:"Docs, markdown viewer, and code viewer",layout:{left:"docs",middle:"markdownViewer",right:"codeViewer"},defaultSizes:{left:20,middle:50,right:30},defaultCollapsed:{left:!1,right:!0},createdAt:e,updatedAt:e,isBuiltIn:!0},"agent-work":{id:"agent-work",name:"Agent Work",description:"Tasks, agent sessions, file tree, agent context, git changes, docs, multi terminal, city map, agent events, code viewer, and markdown slides",layout:{left:{type:"tabs",panels:["tasks","agentSessions","fileTree","agentContext","gitChanges","docs"],config:{defaultActiveTab:0,tabPosition:"top"}},middle:"multiTerminal",right:{type:"tabs",panels:["cityVisualization","agentEvents","codeViewer","markdownViewer"],config:{defaultActiveTab:0,tabPosition:"top"}}},defaultSizes:{left:20,middle:45,right:35},defaultCollapsed:{left:!1,right:!1},createdAt:e,updatedAt:e,isBuiltIn:!0},"quality-check":{id:"quality-check",name:"Quality Check",description:"Package information, tools, and dependencies on left; city visualization map in middle; multi terminal and code viewer on right (collapsed)",layout:{left:{type:"tabs",panels:["packageInfo","tools","dependencies"],config:{defaultActiveTab:0,tabPosition:"top"}},middle:"cityVisualization",right:{type:"tabs",panels:["multiTerminal","codeViewer"],config:{defaultActiveTab:0,tabPosition:"top"}}},defaultSizes:{left:20,middle:45,right:35},defaultCollapsed:{left:!1,right:!0},createdAt:e,updatedAt:e,isBuiltIn:!0},drawing:{id:"drawing",name:"Drawing",description:"Drawings and docs, excalidraw diagram, multi terminal and markdown viewer",layout:{left:{type:"tabs",panels:["drawings","docs"],config:{defaultActiveTab:0,tabPosition:"top"}},middle:"excalidrawDiagram",right:{type:"tabs",panels:["multiTerminal","markdownViewer"],config:{defaultActiveTab:0,tabPosition:"top"}}},defaultSizes:{left:20,middle:50,right:30},defaultCollapsed:{left:!1,right:!0},createdAt:e,updatedAt:e,isBuiltIn:!0},"old-school":{id:"old-school",name:"Old School",description:"File tree, search, git changes, and docs on left; code viewer and markdown viewer in middle; multi terminal and city map on right (collapsed)",layout:{left:{type:"tabs",panels:["fileTree","search","gitChanges","docs"],config:{defaultActiveTab:0,tabPosition:"top"}},middle:{type:"tabs",panels:["codeViewer","markdownViewer"],config:{defaultActiveTab:0,tabPosition:"top"}},right:{type:"tabs",panels:["multiTerminal","cityVisualization"],config:{defaultActiveTab:0,tabPosition:"top"}}},defaultSizes:{left:20,middle:50,right:30},defaultCollapsed:{left:!1,right:!0},createdAt:e,updatedAt:e,isBuiltIn:!0},"principal-office":{id:"principal-office",name:"Principal Office",description:"Alexandria docs on left, MDX editor in middle, multi terminal on right",layout:{left:"docs",middle:"mdxEditor",right:"multiTerminal"},defaultSizes:{left:20,middle:50,right:30},defaultCollapsed:{left:!1,right:!1},createdAt:e,updatedAt:e,isBuiltIn:!0}}}static async initializeWorkspaceLayouts(){const e=await this.adapter.loadWorkspacePresets();Object.keys(e).length}}se(_,"adapter",new Ie);function Ne(o={}){const{repositoryKey:e,autoInitialize:t=!1,defaultWorkspaceId:r}=o,[a,c]=i.useState({}),[l,n]=i.useState(null),[m,d]=i.useState(null),[b,p]=i.useState(!0),[h,v]=i.useState(null),g=i.useCallback(async()=>{try{p(!0),v(null);const k=await _.getWorkspaceLayouts();if(c(k),e){let T=await _.getRepositoryState(e);if(!T&&t){const E=r||"project-management",j=await _.getWorkspaceLayout(E);j&&(T={workspaceId:E,sizes:j.defaultSizes||{left:20,middle:45,right:35},collapsed:j.defaultCollapsed||{left:!1,right:!1}},await _.setRepositoryState(e,T))}if(n(T),T!=null&&T.workspaceId){const E=await _.getWorkspaceLayout(T.workspaceId);d(E)}else d(null)}}catch(k){v(k),console.error("Failed to load workspace data:",k)}finally{p(!1)}},[e,t,r]);i.useEffect(()=>{g()},[g]);const u=i.useCallback(async k=>await _.getWorkspaceLayout(k),[]),f=i.useCallback(async k=>{const T=await _.createWorkspaceLayout(k);return await g(),T},[g]),x=i.useCallback(async(k,T)=>{const E=await _.updateWorkspaceLayout(k,T);return await g(),E},[g]),$=i.useCallback(async k=>{const T=await _.deleteWorkspaceLayout(k);return T&&await g(),T},[g]),M=i.useCallback(async k=>{if(!e){console.error("Cannot apply workspace without repositoryKey");return}const T=await _.getWorkspaceLayout(k);if(!T){console.error(`Workspace ${k} not found`);return}const E={workspaceId:k,sizes:T.defaultSizes||{left:20,middle:45,right:35},collapsed:T.defaultCollapsed||{left:!1,right:!1}};await _.setRepositoryState(e,E),await g()},[e,g]),A=i.useCallback(async k=>{if(!e){console.error("Cannot update sizes without repositoryKey");return}await _.updateRepositorySizes(e,k),await g()},[e,g]),I=i.useCallback(async k=>{if(!e){console.error("Cannot update collapsed without repositoryKey");return}await _.updateRepositoryCollapsed(e,k),await g()},[e,g]),S=i.useCallback(async()=>{if(!e||!(l!=null&&l.workspaceId)){console.error("Cannot reset without repositoryKey and active workspace");return}await _.resetRepositoryToWorkspaceDefaults(e,l.workspaceId),await g()},[e,l==null?void 0:l.workspaceId,g]),w=i.useCallback(async()=>{await g()},[g]);return{workspaces:a,repositoryState:l,activeWorkspace:m,loading:b,error:h,getWorkspace:u,createWorkspace:f,updateWorkspace:x,deleteWorkspace:$,applyWorkspace:M,updateSizes:A,updateCollapsed:I,resetToDefaults:S,refresh:w}}function Ve(o={}){const{initialFocus:e=null,collapsed:t={},panelType:r="three-panel",onFocusChange:a,events:c,getPanelId:l}=o,[n,m]=i.useState(e),d=i.useCallback(u=>{const f=n;if(m(u),a==null||a(u),c&&l){if(f){const $=l(f);$&&c.emit({type:"panel:blur",source:"panel-layouts",timestamp:Date.now(),payload:{panelId:$,panelSlot:f,nextPanelId:l(u)}})}const x=l(u);x&&c.emit({type:"panel:focus",source:"panel-layouts",timestamp:Date.now(),payload:{panelId:x,panelSlot:u,source:"keyboard-shortcut"}})}},[n,a,c,l]),b=i.useCallback(()=>{const u=n;if(m(null),a==null||a(null),c&&l&&u){const f=l(u);f&&c.emit({type:"panel:blur",source:"panel-layouts",timestamp:Date.now(),payload:{panelId:f,panelSlot:u}})}},[n,a,c,l]),p=i.useCallback(()=>{const u=[];return t.left||u.push("left"),u.push("middle"),r==="three-panel"&&!t.right&&u.push("right"),u},[t,r]),h=i.useCallback(()=>{const u=p();if(u.length===0)return;if(n===null){d(u[0]);return}const f=u.indexOf(n);if(f===-1){d(u[0]);return}const x=(f+1)%u.length;d(u[x])},[n,p,d]),v=i.useCallback(()=>{const u=p();if(u.length===0)return;if(n===null){d(u[u.length-1]);return}const f=u.indexOf(n);if(f===-1){d(u[u.length-1]);return}const x=f===0?u.length-1:f-1;d(u[x])},[n,p,d]),g=i.useCallback(u=>n===u,[n]);return{focusedPanel:n,setFocus:d,clearFocus:b,focusNext:h,focusPrevious:v,isFocused:g}}function Be(o){const{enabled:e=!0,focusedPanel:t,collapsed:r,panelType:a,setFocus:c,onExpand:l,onCollapse:n}=o,m=i.useRef(t),d=i.useRef(r),b=i.useRef(a);i.useEffect(()=>{m.current=t},[t]),i.useEffect(()=>{d.current=r},[r]),i.useEffect(()=>{b.current=a},[a]);const p=i.useCallback(h=>{if(!h.altKey||h.ctrlKey||h.metaKey||h.shiftKey)return;const v=h.code,g=m.current,u=d.current,f=b.current;v==="Digit1"||v==="Numpad1"?(h.preventDefault(),u.left?l("left"):g!=="left"?c("left"):(n("left"),c("middle"))):v==="Digit2"||v==="Numpad2"?(h.preventDefault(),c("middle")):(v==="Digit3"||v==="Numpad3")&&f==="three-panel"&&(h.preventDefault(),u.right?l("right"):g!=="right"?c("right"):(n("right"),c("middle")))},[c,l,n]);i.useEffect(()=>{if(e)return window.addEventListener("keydown",p),()=>{window.removeEventListener("keydown",p)}},[e,p])}function Ke(o,e,t,r){i.useEffect(()=>{const a=e.on("panel:focus",l=>{l.payload.panelId===o&&t()});let c;return r&&(c=e.on("panel:blur",l=>{l.payload.panelId===o&&r()})),()=>{a(),c==null||c()}},[o,e,t,r])}const He=({isFocused:o,className:e="",style:t={}})=>{if(!o)return null;const r={position:"absolute",top:0,left:0,right:0,bottom:0,pointerEvents:"none",border:"2px solid var(--panel-focus-border-color, #0066cc)",borderRadius:"4px",boxShadow:"0 0 0 1px var(--panel-focus-shadow-color, rgba(0, 102, 204, 0.2))",zIndex:1e3,transition:"opacity 0.15s ease-in-out",...t};return s.jsx("div",{className:`panel-focus-indicator ${e}`,style:r,role:"presentation","aria-hidden":"true"})},ve="focus-mode-overlay-keyframes",Qe=()=>{if(typeof document>"u"||document.getElementById(ve))return;const o=document.createElement("style");o.id=ve,o.textContent=`
|
|
1
|
+
"use strict";var Fe=Object.defineProperty;var Oe=(o,e,t)=>e in o?Fe(o,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):o[e]=t;var re=(o,e,t)=>Oe(o,typeof e!="symbol"?e+"":e,t);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const ee=require("@principal-ade/panels"),i=require("react"),s=require("react/jsx-runtime"),U=require("@principal-ade/industry-theme");class Te{constructor(){re(this,"storageKey","panel-layouts")}async load(e){try{const t=localStorage.getItem(`${this.storageKey}:${e}`);return t?JSON.parse(t):null}catch(t){return console.error(`Failed to load panel layout for ${e}:`,t),null}}async save(e,t){try{localStorage.setItem(`${this.storageKey}:${e}`,JSON.stringify(t))}catch(r){console.error(`Failed to save panel layout for ${e}:`,r)}}}function qe(o){const{viewKey:e,defaultSizes:t,panelType:r,adapter:a=new Te}=o,[c,l]=i.useState(t),[n,m]=i.useState(o.collapsed),d=i.useRef(o.collapsed),b=i.useRef({}),p=i.useRef(null),h=i.useRef(null);i.useEffect(()=>{(async()=>{const w=await a.load(e);w!=null&&w.sizes&&(l(w.sizes),v(w.sizes))})()},[e]);const v=i.useCallback(S=>{"left"in S&&S.left>0&&(b.current.left=S.left),"middle"in S&&S.middle>0&&(b.current.middle=S.middle),"right"in S&&S.right>0&&(b.current.right=S.right)},[]),g=i.useCallback(S=>{const w=b.current[S];if(w&&w>0)return w;if(S==="left"&&"left"in t&&t.left>0)return t.left;if(S==="right"&&"right"in t&&t.right>0)return t.right},[t]),u=i.useRef(t);i.useEffect(()=>{("left"in t&&t.left!==u.current.left||"middle"in t&&"middle"in u.current&&t.middle!==u.current.middle||"right"in t&&t.right!==u.current.right)&&(l(t),v(t),u.current=t)},[t,v]),i.useEffect(()=>{const S=o.collapsed.left!==d.current.left,w="right"in o.collapsed&&"right"in d.current&&o.collapsed.right!==d.current.right;(S||w)&&(m(o.collapsed),d.current={...o.collapsed})},[o.collapsed.left,o.collapsed.right]);const f=i.useCallback(async S=>{try{await a.save(e,{sizes:S})}catch(w){console.error(`Failed to save panel preferences for ${e}:`,w)}},[e,a]),x=i.useCallback(S=>{const w={...S};let k=!0;if("left"in S){const j=!!(n!=null&&n.left),E=S.left;if(j){const T=g("left");T!==void 0&&T>0?w.left=T:k=!1}else E===0&&(k=!1)}if(r==="three-panel"&&"right"in S){const j=!!(n!=null&&n.right),E=S.right;if(j){const T=g("right");T!==void 0&&T>0?w.right=T:k=!1}else E===0&&(k=!1)}if(l(w),v(w),p.current&&(clearTimeout(p.current),p.current=null),!k){h.current=null;return}h.current=w,p.current=setTimeout(()=>{const j=h.current;j&&(f(j),h.current=null),p.current=null},500)},[n,g,r,f,v]);i.useEffect(()=>()=>{if(p.current){const S=h.current;S&&(f(S),h.current=null),clearTimeout(p.current),p.current=null}},[f]);const $=i.useCallback(async()=>{},[]),M=i.useCallback(async()=>{},[]),P=i.useCallback(async()=>{},[]),I=i.useCallback(async()=>{},[]);return r==="three-panel"?{type:"three-panel",sizes:c,collapsed:n,handlePanelResize:x,handleLeftCollapseComplete:$,handleLeftExpandComplete:M,handleRightCollapseComplete:P,handleRightExpandComplete:I}:{type:"two-panel",sizes:c,collapsed:n,handlePanelResize:x,handleLeftCollapseComplete:$,handleLeftExpandComplete:M}}class Ie{constructor(){re(this,"PRESETS_KEY","panel-layouts:workspace-presets");re(this,"REPO_STATE_PREFIX","panel-layouts:repo-state:")}async loadWorkspacePresets(){try{const e=localStorage.getItem(this.PRESETS_KEY);return e?JSON.parse(e):{}}catch(e){return console.error("Failed to load workspace presets:",e),{}}}async saveWorkspacePresets(e){try{localStorage.setItem(this.PRESETS_KEY,JSON.stringify(e))}catch(t){throw console.error("Failed to save workspace presets:",t),t}}async loadRepositoryState(e){try{const t=`${this.REPO_STATE_PREFIX}${e}`,r=localStorage.getItem(t);return r?JSON.parse(r):null}catch(t){return console.error(`Failed to load repository state for ${e}:`,t),null}}async saveRepositoryState(e,t){try{const r=`${this.REPO_STATE_PREFIX}${e}`;localStorage.setItem(r,JSON.stringify(t))}catch(r){throw console.error(`Failed to save repository state for ${e}:`,r),r}}async loadAllRepositoryStates(){try{const e={};for(let t=0;t<localStorage.length;t++){const r=localStorage.key(t);if(r&&r.startsWith(this.REPO_STATE_PREFIX)){const a=r.substring(this.REPO_STATE_PREFIX.length),c=localStorage.getItem(r);if(c)try{e[a]=JSON.parse(c)}catch(l){console.error(`Failed to parse repository state for ${a}:`,l)}}}return e}catch(e){return console.error("Failed to load all repository states:",e),{}}}}class _{static setAdapter(e){this.adapter=e}static async getWorkspaceLayouts(){const e=this.getBuiltInWorkspaceLayouts();return{...await this.adapter.loadWorkspacePresets(),...e}}static async getWorkspaceLayout(e){return(await this.getWorkspaceLayouts())[e]||null}static async createWorkspaceLayout(e){const t=await this.adapter.loadWorkspacePresets(),r=this.generateWorkspaceId(e.name),a={id:r,name:e.name,description:e.description,layout:e.layout,defaultSizes:e.defaultSizes,defaultCollapsed:e.defaultCollapsed,createdAt:Date.now(),updatedAt:Date.now(),isBuiltIn:!1},c={...t,[r]:a};return await this.adapter.saveWorkspacePresets(c),a}static async updateWorkspaceLayout(e,t){const r=await this.adapter.loadWorkspacePresets(),a=r[e];if(!a)return console.error(`Workspace layout ${e} not found`),null;if(a.isBuiltIn)return console.error(`Cannot update built-in workspace layout ${e}`),null;const c={...a,...t,id:e,createdAt:a.createdAt,updatedAt:Date.now()},l={...r,[e]:c};return await this.adapter.saveWorkspacePresets(l),c}static async deleteWorkspaceLayout(e){const t=await this.adapter.loadWorkspacePresets(),r=t[e];if(!r)return console.error(`Workspace layout ${e} not found`),!1;if(r.isBuiltIn)return console.error(`Cannot delete built-in workspace layout ${e}`),!1;const a={...t};return delete a[e],await this.adapter.saveWorkspacePresets(a),!0}static async getRepositoryState(e){return await this.adapter.loadRepositoryState(e)}static async setRepositoryState(e,t){await this.adapter.saveRepositoryState(e,t)}static async updateRepositorySizes(e,t){const r=await this.getRepositoryState(e);r&&await this.setRepositoryState(e,{...r,sizes:t})}static async updateRepositoryCollapsed(e,t){const r=await this.getRepositoryState(e);r&&await this.setRepositoryState(e,{...r,collapsed:t})}static hasStateDeviation(e,t){const r=t.defaultSizes?JSON.stringify(e.sizes)!==JSON.stringify(t.defaultSizes):!1,a=t.defaultCollapsed?JSON.stringify(e.collapsed)!==JSON.stringify(t.defaultCollapsed):!1;return{hasSizeDeviation:r,hasCollapsedDeviation:a}}static async updateWorkspaceFromRepositoryState(e,t){const r=await this.getWorkspaceLayout(e),a=await this.getRepositoryState(t);if(!r||!a||r.isBuiltIn){console.error("Cannot update built-in workspace or workspace/state not found");return}await this.updateWorkspaceLayout(e,{defaultSizes:a.sizes,defaultCollapsed:a.collapsed})}static async resetRepositoryToWorkspaceDefaults(e,t){const r=await this.getWorkspaceLayout(t);if(!r){console.error(`Workspace ${t} not found`);return}const a=await this.getRepositoryState(e);a&&await this.setRepositoryState(e,{...a,sizes:r.defaultSizes||{left:20,middle:45,right:35},collapsed:r.defaultCollapsed||{left:!1,right:!1}})}static isLayoutMatchingWorkspace(e,t){return this.areLayoutsEqual(e,t.layout)}static async findMatchingWorkspace(e){const t=await this.getWorkspaceLayouts();for(const[r,a]of Object.entries(t))if(this.isLayoutMatchingWorkspace(e,a))return r;return null}static areLayoutsEqual(e,t){return JSON.stringify(e)===JSON.stringify(t)}static generateWorkspaceId(e){return`${e.toLowerCase().replace(/[^a-z0-9]+/g,"-")}-${Date.now()}`}static getBuiltInWorkspaceLayouts(){const e=Date.now();return{"project-management":{id:"project-management",name:"Project Management",description:"Tasks, dependencies, issues, file tree, docs, drawings, multi terminal, city visualization, code viewer, markdown slides, and excalidraw",layout:{left:{type:"tabs",panels:["tasks","dependencies","gitIssues","fileTree","docs","drawings"],config:{defaultActiveTab:0,tabPosition:"top"}},middle:"multiTerminal",right:{type:"tabs",panels:["cityVisualization","codeViewer","markdownViewer","excalidrawDiagram"],config:{defaultActiveTab:0,tabPosition:"top"}}},defaultSizes:{left:20,middle:45,right:35},defaultCollapsed:{left:!1,right:!1},createdAt:e,updatedAt:e,isBuiltIn:!0},"code-review":{id:"code-review",name:"Code Review",description:"Git changes, pull requests, and file tree on left, git diff and code viewer in middle, city map on right",layout:{left:{type:"tabs",panels:["gitChanges","gitPullRequests","fileTree"],config:{defaultActiveTab:0,tabPosition:"top"}},middle:{type:"tabs",panels:["gitDiff","codeViewer"],config:{defaultActiveTab:0,tabPosition:"top"}},right:"cityVisualization"},defaultSizes:{left:20,middle:50,right:30},defaultCollapsed:{left:!1,right:!1},createdAt:e,updatedAt:e,isBuiltIn:!0},documentation:{id:"documentation",name:"Documentation",description:"Docs, markdown viewer, and code viewer",layout:{left:"docs",middle:"markdownViewer",right:"codeViewer"},defaultSizes:{left:20,middle:50,right:30},defaultCollapsed:{left:!1,right:!0},createdAt:e,updatedAt:e,isBuiltIn:!0},"agent-work":{id:"agent-work",name:"Agent Work",description:"Tasks, agent sessions, file tree, agent context, git changes, docs, multi terminal, city map, agent events, code viewer, and markdown slides",layout:{left:{type:"tabs",panels:["tasks","agentSessions","fileTree","agentContext","gitChanges","docs"],config:{defaultActiveTab:0,tabPosition:"top"}},middle:"multiTerminal",right:{type:"tabs",panels:["cityVisualization","agentEvents","codeViewer","markdownViewer"],config:{defaultActiveTab:0,tabPosition:"top"}}},defaultSizes:{left:20,middle:45,right:35},defaultCollapsed:{left:!1,right:!1},createdAt:e,updatedAt:e,isBuiltIn:!0},"quality-check":{id:"quality-check",name:"Quality Check",description:"Package information, tools, and dependencies on left; city visualization map in middle; multi terminal and code viewer on right (collapsed)",layout:{left:{type:"tabs",panels:["packageInfo","tools","dependencies"],config:{defaultActiveTab:0,tabPosition:"top"}},middle:"cityVisualization",right:{type:"tabs",panels:["multiTerminal","codeViewer"],config:{defaultActiveTab:0,tabPosition:"top"}}},defaultSizes:{left:20,middle:45,right:35},defaultCollapsed:{left:!1,right:!0},createdAt:e,updatedAt:e,isBuiltIn:!0},drawing:{id:"drawing",name:"Drawing",description:"Drawings and docs, excalidraw diagram, multi terminal and markdown viewer",layout:{left:{type:"tabs",panels:["drawings","docs"],config:{defaultActiveTab:0,tabPosition:"top"}},middle:"excalidrawDiagram",right:{type:"tabs",panels:["multiTerminal","markdownViewer"],config:{defaultActiveTab:0,tabPosition:"top"}}},defaultSizes:{left:20,middle:50,right:30},defaultCollapsed:{left:!1,right:!0},createdAt:e,updatedAt:e,isBuiltIn:!0},"old-school":{id:"old-school",name:"Old School",description:"File tree, search, git changes, and docs on left; code viewer and markdown viewer in middle; multi terminal and city map on right (collapsed)",layout:{left:{type:"tabs",panels:["fileTree","search","gitChanges","docs"],config:{defaultActiveTab:0,tabPosition:"top"}},middle:{type:"tabs",panels:["codeViewer","markdownViewer"],config:{defaultActiveTab:0,tabPosition:"top"}},right:{type:"tabs",panels:["multiTerminal","cityVisualization"],config:{defaultActiveTab:0,tabPosition:"top"}}},defaultSizes:{left:20,middle:50,right:30},defaultCollapsed:{left:!1,right:!0},createdAt:e,updatedAt:e,isBuiltIn:!0},"principal-office":{id:"principal-office",name:"Principal Office",description:"Alexandria docs on left, MDX editor in middle, multi terminal on right",layout:{left:"docs",middle:"mdxEditor",right:"multiTerminal"},defaultSizes:{left:20,middle:50,right:30},defaultCollapsed:{left:!1,right:!1},createdAt:e,updatedAt:e,isBuiltIn:!0}}}static async initializeWorkspaceLayouts(){const e=await this.adapter.loadWorkspacePresets();Object.keys(e).length}}re(_,"adapter",new Ie);function Ne(o={}){const{repositoryKey:e,autoInitialize:t=!1,defaultWorkspaceId:r}=o,[a,c]=i.useState({}),[l,n]=i.useState(null),[m,d]=i.useState(null),[b,p]=i.useState(!0),[h,v]=i.useState(null),g=i.useCallback(async()=>{try{p(!0),v(null);const k=await _.getWorkspaceLayouts();if(c(k),e){let j=await _.getRepositoryState(e);if(!j&&t){const E=r||"project-management",T=await _.getWorkspaceLayout(E);T&&(j={workspaceId:E,sizes:T.defaultSizes||{left:20,middle:45,right:35},collapsed:T.defaultCollapsed||{left:!1,right:!1}},await _.setRepositoryState(e,j))}if(n(j),j!=null&&j.workspaceId){const E=await _.getWorkspaceLayout(j.workspaceId);d(E)}else d(null)}}catch(k){v(k),console.error("Failed to load workspace data:",k)}finally{p(!1)}},[e,t,r]);i.useEffect(()=>{g()},[g]);const u=i.useCallback(async k=>await _.getWorkspaceLayout(k),[]),f=i.useCallback(async k=>{const j=await _.createWorkspaceLayout(k);return await g(),j},[g]),x=i.useCallback(async(k,j)=>{const E=await _.updateWorkspaceLayout(k,j);return await g(),E},[g]),$=i.useCallback(async k=>{const j=await _.deleteWorkspaceLayout(k);return j&&await g(),j},[g]),M=i.useCallback(async k=>{if(!e){console.error("Cannot apply workspace without repositoryKey");return}const j=await _.getWorkspaceLayout(k);if(!j){console.error(`Workspace ${k} not found`);return}const E={workspaceId:k,sizes:j.defaultSizes||{left:20,middle:45,right:35},collapsed:j.defaultCollapsed||{left:!1,right:!1}};await _.setRepositoryState(e,E),await g()},[e,g]),P=i.useCallback(async k=>{if(!e){console.error("Cannot update sizes without repositoryKey");return}await _.updateRepositorySizes(e,k),await g()},[e,g]),I=i.useCallback(async k=>{if(!e){console.error("Cannot update collapsed without repositoryKey");return}await _.updateRepositoryCollapsed(e,k),await g()},[e,g]),S=i.useCallback(async()=>{if(!e||!(l!=null&&l.workspaceId)){console.error("Cannot reset without repositoryKey and active workspace");return}await _.resetRepositoryToWorkspaceDefaults(e,l.workspaceId),await g()},[e,l==null?void 0:l.workspaceId,g]),w=i.useCallback(async()=>{await g()},[g]);return{workspaces:a,repositoryState:l,activeWorkspace:m,loading:b,error:h,getWorkspace:u,createWorkspace:f,updateWorkspace:x,deleteWorkspace:$,applyWorkspace:M,updateSizes:P,updateCollapsed:I,resetToDefaults:S,refresh:w}}function Be(o={}){const{initialFocus:e=null,collapsed:t={},panelType:r="three-panel",onFocusChange:a,events:c,getPanelId:l}=o,[n,m]=i.useState(e),d=i.useCallback(u=>{const f=n;if(m(u),a==null||a(u),c&&l){if(f){const $=l(f);$&&c.emit({type:"panel:blur",source:"panel-layouts",timestamp:Date.now(),payload:{panelId:$,panelSlot:f,nextPanelId:l(u)}})}const x=l(u);x&&c.emit({type:"panel:focus",source:"panel-layouts",timestamp:Date.now(),payload:{panelId:x,panelSlot:u,source:"keyboard-shortcut"}})}},[n,a,c,l]),b=i.useCallback(()=>{const u=n;if(m(null),a==null||a(null),c&&l&&u){const f=l(u);f&&c.emit({type:"panel:blur",source:"panel-layouts",timestamp:Date.now(),payload:{panelId:f,panelSlot:u}})}},[n,a,c,l]),p=i.useCallback(()=>{const u=[];return t.left||u.push("left"),u.push("middle"),r==="three-panel"&&!t.right&&u.push("right"),u},[t,r]),h=i.useCallback(()=>{const u=p();if(u.length===0)return;if(n===null){d(u[0]);return}const f=u.indexOf(n);if(f===-1){d(u[0]);return}const x=(f+1)%u.length;d(u[x])},[n,p,d]),v=i.useCallback(()=>{const u=p();if(u.length===0)return;if(n===null){d(u[u.length-1]);return}const f=u.indexOf(n);if(f===-1){d(u[u.length-1]);return}const x=f===0?u.length-1:f-1;d(u[x])},[n,p,d]),g=i.useCallback(u=>n===u,[n]);return{focusedPanel:n,setFocus:d,clearFocus:b,focusNext:h,focusPrevious:v,isFocused:g}}function Ve(o){const{enabled:e=!0,focusedPanel:t,collapsed:r,panelType:a,setFocus:c,onExpand:l,onCollapse:n}=o,m=i.useRef(t),d=i.useRef(r),b=i.useRef(a);i.useEffect(()=>{m.current=t},[t]),i.useEffect(()=>{d.current=r},[r]),i.useEffect(()=>{b.current=a},[a]);const p=i.useCallback(h=>{if(!h.altKey||h.ctrlKey||h.metaKey||h.shiftKey)return;const v=h.code,g=m.current,u=d.current,f=b.current;v==="Digit1"||v==="Numpad1"?(h.preventDefault(),u.left?l("left"):g!=="left"?c("left"):(n("left"),c("middle"))):v==="Digit2"||v==="Numpad2"?(h.preventDefault(),c("middle")):(v==="Digit3"||v==="Numpad3")&&f==="three-panel"&&(h.preventDefault(),u.right?l("right"):g!=="right"?c("right"):(n("right"),c("middle")))},[c,l,n]);i.useEffect(()=>{if(e)return window.addEventListener("keydown",p),()=>{window.removeEventListener("keydown",p)}},[e,p])}function Ke(o,e,t,r){i.useEffect(()=>{const a=e.on("panel:focus",l=>{l.payload.panelId===o&&t()});let c;return r&&(c=e.on("panel:blur",l=>{l.payload.panelId===o&&r()})),()=>{a(),c==null||c()}},[o,e,t,r])}const He=({isFocused:o,className:e="",style:t={}})=>{if(!o)return null;const r={position:"absolute",top:0,left:0,right:0,bottom:0,pointerEvents:"none",border:"2px solid var(--panel-focus-border-color, #0066cc)",borderRadius:"4px",boxShadow:"0 0 0 1px var(--panel-focus-shadow-color, rgba(0, 102, 204, 0.2))",zIndex:1e3,transition:"opacity 0.15s ease-in-out",...t};return s.jsx("div",{className:`panel-focus-indicator ${e}`,style:r,role:"presentation","aria-hidden":"true"})},ve="focus-mode-overlay-keyframes",Qe=()=>{if(typeof document>"u"||document.getElementById(ve))return;const o=document.createElement("style");o.id=ve,o.textContent=`
|
|
2
2
|
@keyframes focus-overlay-vignette-drift {
|
|
3
3
|
0%, 100% {
|
|
4
4
|
background-position: 50% 50%;
|
|
@@ -42,25 +42,25 @@
|
|
|
42
42
|
to { background-position: 0px 150px; }
|
|
43
43
|
}
|
|
44
44
|
|
|
45
|
-
`,document.head.appendChild(o)},Je=({active:o,variant:e="soft-fade",effects:t=[],opacity:r=.95,animationDuration:a=300,cascadeDelay:c=0,color:l,hideOnHover:n=!0,className:m="",style:d={}})=>{const{theme:b}=U.useTheme(),[p,h]=i.useState(!1),[v,g]=i.useState(!1),u=i.useRef(null);i.useEffect(()=>{Qe()},[]),i.useEffect(()=>{if(!n||!o){g(!1);return}const Y=
|
|
46
|
-
radial-gradient(circle, ${
|
|
47
|
-
radial-gradient(circle, ${
|
|
48
|
-
radial-gradient(circle, ${
|
|
49
|
-
radial-gradient(circle, ${
|
|
50
|
-
`,backgroundSize:"150px 150px",backgroundPosition:"10px 20px, 60px 80px, 110px 40px, 40px 120px",animation:p?"focus-overlay-snowfall-1 4s linear infinite":"none"},Q={...
|
|
45
|
+
`,document.head.appendChild(o)},Je=({active:o,variant:e="soft-fade",effects:t=[],opacity:r=.95,animationDuration:a=300,cascadeDelay:c=0,color:l,hideOnHover:n=!0,className:m="",style:d={}})=>{const{theme:b}=U.useTheme(),[p,h]=i.useState(!1),[v,g]=i.useState(!1),u=i.useRef(null);i.useEffect(()=>{Qe()},[]),i.useEffect(()=>{if(!n||!o){g(!1);return}const Y=B=>{if(u.current){const R=u.current.getBoundingClientRect(),X=B.clientX>=R.left&&B.clientX<=R.right&&B.clientY>=R.top&&B.clientY<=R.bottom;g(X)}};return document.addEventListener("mousemove",Y),()=>document.removeEventListener("mousemove",Y)},[n,o]),i.useEffect(()=>{if(o){const Y=setTimeout(()=>h(!0),c);return()=>clearTimeout(Y)}else h(!1)},[o,c]);const f=l||b.colors.background,x=()=>{switch(e){case"soft-fade":return{backgroundColor:f,opacity:p?r:0,transition:`opacity ${a}ms ease-out`};case"cascading-fade":return{backgroundColor:f,opacity:p?r:0,transition:`opacity ${a}ms ease-out`,transitionDelay:p?"0ms":`${c}ms`};default:return{backgroundColor:f,opacity:p?r:0,transition:`opacity ${a}ms ease-out`}}},$=n&&v,M={position:"absolute",top:0,left:0,right:0,bottom:0,pointerEvents:"none",zIndex:999,overflow:"hidden",...x(),...$?{opacity:0}:{},...d},P=t.includes("vignette-drift"),I=t.includes("radial-breathing"),S=t.includes("snowfall"),w=(Y,B)=>{const R=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(Y);if(!R)return`rgba(255, 255, 255, ${B})`;const X=parseInt(R[1],16),O=parseInt(R[2],16),H=parseInt(R[3],16);return`rgba(${X}, ${O}, ${H}, ${B})`},k=b.colors.primary,j={position:"absolute",top:0,left:0,right:0,bottom:0,pointerEvents:"none",opacity:p?1:0,transition:`opacity ${a}ms ease-out`,background:`radial-gradient(circle at 50% 50%, ${w(k,.12)} 0%, ${w(k,.06)} 25%, transparent 50%)`,backgroundSize:"150% 150%",animation:p?"focus-overlay-vignette-drift 12s ease-in-out infinite":"none"},E={position:"absolute",top:0,left:0,right:0,bottom:0,pointerEvents:"none",opacity:p?1:0,transition:`opacity ${a}ms ease-out`,background:`radial-gradient(circle at center, ${w(k,.15)} 0%, ${w(k,.06)} 30%, transparent 55%)`,animation:p?"focus-overlay-radial-breathing 4s ease-in-out infinite":"none"},T=w(k,.6),C=w(k,.4),A=w(k,.25),q={position:"absolute",top:0,left:0,right:0,bottom:0,pointerEvents:"none",opacity:p?1:0,transition:`opacity ${a}ms ease-out`},te={...q,background:`
|
|
46
|
+
radial-gradient(circle, ${T} 0%, ${T} 3px, transparent 3px),
|
|
47
|
+
radial-gradient(circle, ${T} 0%, ${T} 3px, transparent 3px),
|
|
48
|
+
radial-gradient(circle, ${T} 0%, ${T} 3px, transparent 3px),
|
|
49
|
+
radial-gradient(circle, ${T} 0%, ${T} 3px, transparent 3px)
|
|
50
|
+
`,backgroundSize:"150px 150px",backgroundPosition:"10px 20px, 60px 80px, 110px 40px, 40px 120px",animation:p?"focus-overlay-snowfall-1 4s linear infinite":"none"},Q={...q,background:`
|
|
51
51
|
radial-gradient(circle, ${C} 0%, ${C} 2px, transparent 2px),
|
|
52
52
|
radial-gradient(circle, ${C} 0%, ${C} 2px, transparent 2px),
|
|
53
53
|
radial-gradient(circle, ${C} 0%, ${C} 2px, transparent 2px),
|
|
54
54
|
radial-gradient(circle, ${C} 0%, ${C} 2px, transparent 2px),
|
|
55
55
|
radial-gradient(circle, ${C} 0%, ${C} 2px, transparent 2px)
|
|
56
|
-
`,backgroundSize:"150px 150px",backgroundPosition:"30px 10px, 90px 60px, 15px 100px, 120px 30px, 70px 130px",animation:p?"focus-overlay-snowfall-2 7s linear infinite":"none"},N={...
|
|
57
|
-
radial-gradient(circle, ${
|
|
58
|
-
radial-gradient(circle, ${
|
|
59
|
-
radial-gradient(circle, ${
|
|
60
|
-
radial-gradient(circle, ${
|
|
61
|
-
radial-gradient(circle, ${
|
|
62
|
-
radial-gradient(circle, ${
|
|
63
|
-
`,backgroundSize:"150px 150px",backgroundPosition:"20px 5px, 80px 45px, 45px 90px, 130px 20px, 5px 70px, 100px 110px",animation:p?"focus-overlay-snowfall-3 12s linear infinite":"none"};return s.jsxs("div",{ref:u,className:`focus-mode-overlay focus-mode-overlay--${e} ${m}`,style:M,role:"presentation","aria-hidden":"true","data-active":o,"data-variant":e,children:[A&&s.jsx("div",{className:"focus-mode-overlay__vignette-drift",style:T}),I&&s.jsx("div",{className:"focus-mode-overlay__radial-breathing",style:E}),S&&s.jsxs(s.Fragment,{children:[s.jsx("div",{className:"focus-mode-overlay__snowfall-layer-3",style:N}),s.jsx("div",{className:"focus-mode-overlay__snowfall-layer-2",style:Q}),s.jsx("div",{className:"focus-mode-overlay__snowfall-layer-1",style:ee})]})]})},ce=({value:o,onChange:e,onSubmit:t,onClose:r,onHistoryPrevious:a,onHistoryNext:c,mode:l,status:n,placeholder:m="What would you like to do?",disabled:d=!1,autoFocus:b=!0,agentAvailable:p=!0,showAutocomplete:h=!1,autocompleteItemCount:v=0,onAutocompleteNext:g,onAutocompletePrevious:u,onAutocompleteAccept:f})=>{const{theme:x}=U.useTheme(),$=i.useRef(null);i.useEffect(()=>{b&&$.current&&$.current.focus()},[b]);const M=I=>{switch(I.stopPropagation(),I.key){case"Enter":I.preventDefault(),h&&v===1&&f?f(!0):t();break;case"Escape":I.preventDefault(),r();break;case"Tab":h&&f&&(I.preventDefault(),f());break;case"ArrowUp":I.preventDefault(),h&&u?u():a();break;case"ArrowDown":I.preventDefault(),h&&g?g():c();break}},A=n==="thinking"||n==="executing";return s.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px",padding:"12px 16px",backgroundColor:x.colors.background,borderBottom:`1px solid ${x.colors.border}`},children:[s.jsx("span",{style:{color:l==="quick-command"?x.colors.info:p?x.colors.primary:x.colors.textMuted,fontFamily:x.fonts.monospace,fontSize:x.fontSizes[1],userSelect:"none",display:"flex",alignItems:"center"},children:l==="quick-command"?s.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[s.jsx("polyline",{points:"4 17 10 11 4 5"}),s.jsx("line",{x1:"12",y1:"19",x2:"20",y2:"19"})]}):p?s.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[s.jsx("rect",{x:"3",y:"11",width:"18",height:"10",rx:"2"}),s.jsx("circle",{cx:"12",cy:"5",r:"2"}),s.jsx("path",{d:"M12 7v4"}),s.jsx("line",{x1:"8",y1:"16",x2:"8",y2:"16"}),s.jsx("line",{x1:"16",y1:"16",x2:"16",y2:"16"})]}):">"}),s.jsx("input",{ref:$,"data-agent-command-palette-input":!0,type:"text",value:o,onChange:I=>e(I.target.value),onKeyDown:M,placeholder:m,disabled:d||A,style:{flex:1,backgroundColor:"transparent",border:"none",outline:"none",color:x.colors.text,fontFamily:x.fonts.monospace,fontSize:x.fontSizes[1],caretColor:x.colors.primary}}),A&&s.jsxs("span",{style:{color:x.colors.info,fontSize:x.fontSizes[0],display:"flex",alignItems:"center",gap:"4px"},children:[s.jsx("span",{style:{display:"inline-block",width:"8px",height:"8px",borderRadius:"50%",backgroundColor:x.colors.info,animation:"pulse 1s ease-in-out infinite"}}),n==="thinking"?"Thinking...":"Executing..."]}),!A&&s.jsx("kbd",{style:{padding:"2px 6px",backgroundColor:x.colors.backgroundSecondary,borderRadius:"3px",border:`1px solid ${x.colors.border}`,fontSize:x.fontSizes[0],color:x.colors.textMuted},children:"Alt+P"})]})};ce.displayName="AgentCommandInput";const Ge=({status:o})=>{const{theme:e}=U.useTheme(),t={display:"inline-flex",alignItems:"center",justifyContent:"center",width:"16px",height:"16px",fontSize:e.fontSizes[0]};switch(o){case"pending":return s.jsx("span",{style:{...t,color:e.colors.textMuted},children:"○"});case"running":return s.jsx("span",{style:{...t,color:e.colors.info,animation:"spin 1s linear infinite"},children:"◐"});case"success":return s.jsx("span",{style:{...t,color:e.colors.success},children:"✓"});case"error":return s.jsx("span",{style:{...t,color:e.colors.error},children:"✗"})}},Ue=o=>{const e=Object.entries(o);return e.length===0?"":e.map(([t,r])=>t==="args"&&Array.isArray(r)?r.join(", "):typeof r=="string"?`"${r}"`:JSON.stringify(r)).join(", ")},Ye=({tool:o,compact:e})=>{const{theme:t}=U.useTheme(),r=Ue(o.args);return s.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px",padding:e?"4px 0":"8px 0",fontFamily:t.fonts.monospace,fontSize:t.fontSizes[1]},children:[s.jsx(Ge,{status:o.status}),s.jsxs("span",{style:{color:t.colors.text},children:[o.name,r&&s.jsxs("span",{style:{color:t.colors.textMuted},children:["(",r,")"]})]}),o.status==="running"&&s.jsx("span",{style:{marginLeft:"auto",color:t.colors.info,fontSize:t.fontSizes[0]},children:"[running]"}),o.status==="success"&&s.jsx("span",{style:{marginLeft:"auto",color:t.colors.success,fontSize:t.fontSizes[0]},children:"[done]"}),o.status==="error"&&s.jsx("span",{style:{marginLeft:"auto",color:t.colors.error,fontSize:t.fontSizes[0]},title:o.error,children:"[error]"})]})},de=({tools:o,compact:e=!1})=>{const{theme:t}=U.useTheme();return o.length===0?null:s.jsx("div",{style:{padding:e?"8px 16px":"12px 16px",backgroundColor:t.colors.backgroundSecondary,borderRadius:"4px",margin:"8px 16px"},children:o.map(r=>s.jsx(Ye,{tool:r,compact:e},r.id))})};de.displayName="ToolExecutionList";const ue=({response:o,streaming:e=!1})=>{const{theme:t}=U.useTheme();if(!o)return null;const r=o.toLowerCase().startsWith("error"),a=o.toLowerCase().startsWith("done")||o.toLowerCase().startsWith("executed");return s.jsxs("div",{style:{padding:"12px 16px",color:r?t.colors.error:a?t.colors.success:t.colors.text,fontSize:t.fontSizes[1],display:"flex",alignItems:"center",gap:"8px"},children:[a&&s.jsx("span",{children:"✓"}),r&&s.jsx("span",{children:"✗"}),s.jsxs("span",{children:[o,e&&s.jsx("span",{style:{display:"inline-block",width:"2px",height:"14px",backgroundColor:t.colors.primary,marginLeft:"2px",animation:"blink 1s step-end infinite"}})]})]})};ue.displayName="AgentResponseDisplay";function Te({text:o,matchedIndices:e,highlightColor:t}){if(!e.length)return s.jsx(s.Fragment,{children:o});const r=new Set(e),a=o.split("");return s.jsx(s.Fragment,{children:a.map((c,l)=>s.jsx("span",{style:{color:r.has(l)?t:"inherit",fontWeight:r.has(l)?600:"inherit"},children:c},l))})}const pe=({matches:o,argumentMatches:e=[],currentArg:t,isEnteringArgs:r=!1,selectedIndex:a,onSelect:c,maxVisible:l=6})=>{const{theme:n}=U.useTheme(),m=i.useRef(null),d=i.useRef(null);if(i.useEffect(()=>{d.current&&m.current&&d.current.scrollIntoView({block:"nearest",behavior:"smooth"})},[a]),r&&e.length>0){const v=40*l;return s.jsxs("div",{ref:m,style:{maxHeight:`${v}px`,overflowY:"auto",borderTop:`1px solid ${n.colors.border}`},children:[t&&s.jsxs("div",{style:{padding:"8px 16px",fontSize:n.fontSizes[0],color:n.colors.textMuted,backgroundColor:n.colors.backgroundSecondary,borderBottom:`1px solid ${n.colors.border}`},children:[s.jsx("span",{style:{color:n.colors.textSecondary},children:t.name}),t.description&&s.jsxs("span",{style:{marginLeft:"8px"},children:["— ",t.description]})]}),e.map((g,u)=>{const f=u===a;return s.jsxs("div",{ref:f?d:void 0,onClick:()=>c(u),style:{display:"flex",alignItems:"center",gap:"12px",padding:"8px 16px",cursor:"pointer",backgroundColor:f?n.colors.backgroundSecondary:"transparent",borderLeft:f?`2px solid ${n.colors.primary}`:"2px solid transparent",transition:"background-color 100ms ease"},onMouseEnter:x=>{f||(x.currentTarget.style.backgroundColor=n.colors.backgroundSecondary)},onMouseLeave:x=>{f||(x.currentTarget.style.backgroundColor="transparent")},children:[s.jsx("span",{style:{fontFamily:n.fonts.monospace,fontSize:n.fontSizes[1],color:n.colors.text,flex:1},children:s.jsx(Te,{text:g.option,matchedIndices:g.matchedIndices,highlightColor:n.colors.primary})}),f&&s.jsx("kbd",{style:{padding:"2px 6px",backgroundColor:n.colors.backgroundTertiary,borderRadius:"3px",border:`1px solid ${n.colors.border}`,fontSize:n.fontSizes[0],color:n.colors.textMuted,flexShrink:0},children:"Tab"})]},`${g.option}-${u}`)})]})}if(o.length===0)return null;const p=48*l;return s.jsx("div",{ref:m,style:{maxHeight:`${p}px`,overflowY:"auto",borderTop:`1px solid ${n.colors.border}`},children:o.map((h,v)=>{const g=v===a,u=h.command;return s.jsxs("div",{ref:g?d:void 0,onClick:()=>c(v),style:{display:"flex",alignItems:"center",gap:"12px",padding:"10px 16px",cursor:"pointer",backgroundColor:g?n.colors.backgroundSecondary:"transparent",borderLeft:g?`2px solid ${n.colors.primary}`:"2px solid transparent",transition:"background-color 100ms ease"},onMouseEnter:f=>{g||(f.currentTarget.style.backgroundColor=n.colors.backgroundSecondary)},onMouseLeave:f=>{g||(f.currentTarget.style.backgroundColor="transparent")},children:[s.jsx("span",{style:{color:n.colors.info,fontFamily:n.fonts.monospace,fontSize:n.fontSizes[1],flexShrink:0},children:"/"}),s.jsxs("div",{style:{flex:1,minWidth:0},children:[s.jsxs("div",{style:{fontFamily:n.fonts.monospace,fontSize:n.fontSizes[1],color:n.colors.text},children:[s.jsx(Te,{text:u.name,matchedIndices:h.matchedOn===u.name?h.matchedIndices:[],highlightColor:n.colors.primary}),h.matchedOn!==u.name&&s.jsxs("span",{style:{color:n.colors.textMuted,marginLeft:"8px",fontSize:n.fontSizes[0]},children:["(alias: ",h.matchedOn,")"]})]}),s.jsx("div",{style:{fontSize:n.fontSizes[0],color:n.colors.textMuted,marginTop:"2px",whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"},children:u.description})]}),u.args&&u.args.length>0&&s.jsx("div",{style:{fontSize:n.fontSizes[0],color:n.colors.textMuted,fontFamily:n.fonts.monospace,flexShrink:0},children:u.args.map((f,x)=>s.jsxs("span",{children:[x>0&&" ",s.jsx("span",{style:{color:f.required?n.colors.warning:n.colors.textMuted},children:f.required?`<${f.name}>`:`[${f.name}]`})]},f.name))}),g&&s.jsx("kbd",{style:{padding:"2px 6px",backgroundColor:n.colors.backgroundTertiary,borderRadius:"3px",border:`1px solid ${n.colors.border}`,fontSize:n.fontSizes[0],color:n.colors.textMuted,flexShrink:0},children:"Tab"})]},`${u.name}-${v}`)})})};pe.displayName="QuickCommandAutocomplete";const Ae=({palette:o,config:e})=>{const{theme:t}=U.useTheme(),r=i.useRef(null),{isOpen:a,close:c,query:l,setQuery:n,mode:m,status:d,pendingTools:b,completedTools:p,agentResponse:h,submit:v,historyPrevious:g,historyNext:u,suggestions:f,agentAvailable:x,quickCommandMatches:$,argumentOptionMatches:M,parsedQuery:A,currentArgDef:I,selectedAutocompleteIndex:S,autocompleteItemCount:w,autocompleteNext:k,autocompletePrevious:T,autocompleteAccept:E,showAutocomplete:j}=o;i.useEffect(()=>{if(!a)return;const q=D=>{r.current&&!r.current.contains(D.target)&&c()},H=setTimeout(()=>{document.addEventListener("mousedown",q)},100);return()=>{clearTimeout(H),document.removeEventListener("mousedown",q)}},[a,c]);const[C,P]=i.useState(!1),[O,ee]=i.useState(!1);if(i.useEffect(()=>{if(a)ee(!0),requestAnimationFrame(()=>{requestAnimationFrame(()=>{P(!0)})});else{P(!1);const q=setTimeout(()=>{ee(!1)},150);return()=>clearTimeout(q)}},[a]),!O)return null;const Q=x?(e==null?void 0:e.placeholder)||"What would you like to do?":"Quick command mode (agent unavailable)",N=[...p,...b],Y=N.length>0,V=h&&d!=="idle",R=x&&!l&&d==="idle"&&f.length>0,X=!x&&m!=="quick-command"&&d==="idle";return s.jsxs(s.Fragment,{children:[s.jsx("div",{style:{position:"fixed",inset:0,zIndex:999},onClick:c}),s.jsxs("div",{ref:r,className:e==null?void 0:e.className,style:{position:"fixed",bottom:0,left:0,right:0,maxHeight:"50vh",backgroundColor:t.colors.background,borderTop:`1px solid ${t.colors.border}`,boxShadow:t.shadows[2],zIndex:1e3,display:"flex",flexDirection:"column-reverse",overflow:"hidden",transform:C?"translateY(0)":"translateY(100%)",transition:"transform 150ms ease-out",...e==null?void 0:e.style},children:[s.jsxs("div",{children:[s.jsx(ce,{value:l,onChange:n,onSubmit:v,onClose:c,onHistoryPrevious:g,onHistoryNext:u,mode:m,status:d,placeholder:Q,agentAvailable:x,showAutocomplete:j,autocompleteItemCount:w,onAutocompleteNext:k,onAutocompletePrevious:T,onAutocompleteAccept:E}),s.jsxs("div",{style:{padding:"8px 16px",borderTop:`1px solid ${t.colors.border}`,display:"flex",gap:"16px",fontSize:t.fontSizes[0],color:t.colors.textMuted,backgroundColor:t.colors.background},children:[s.jsxs("span",{children:[s.jsx("kbd",{style:{padding:"2px 6px",backgroundColor:t.colors.backgroundSecondary,borderRadius:"3px",border:`1px solid ${t.colors.border}`},children:"Enter"})," ","Execute"]}),s.jsxs("span",{children:[s.jsx("kbd",{style:{padding:"2px 6px",backgroundColor:t.colors.backgroundSecondary,borderRadius:"3px",border:`1px solid ${t.colors.border}`},children:"Esc"})," ","Close"]}),s.jsxs("span",{children:[s.jsx("kbd",{style:{padding:"2px 6px",backgroundColor:t.colors.backgroundSecondary,borderRadius:"3px",border:`1px solid ${t.colors.border}`},children:"↑↓"})," ","History"]}),s.jsxs("span",{style:{marginLeft:"auto"},children:[s.jsx("kbd",{style:{padding:"2px 6px",backgroundColor:t.colors.backgroundSecondary,borderRadius:"3px",border:`1px solid ${t.colors.border}`},children:"/"})," ","Quick command"]})]})]}),s.jsxs("div",{style:{overflow:"auto"},children:[Y&&s.jsx(de,{tools:N,compact:N.length>3}),V&&s.jsx(ue,{response:h,streaming:d==="thinking"}),R&&s.jsxs("div",{style:{padding:"12px 16px",display:"flex",gap:"8px",flexWrap:"wrap"},children:[s.jsx("span",{style:{color:t.colors.textMuted,fontSize:t.fontSizes[0],marginRight:"4px"},children:"Try:"}),f.map((q,H)=>s.jsxs("button",{onClick:()=>{n(q)},style:{padding:"4px 10px",backgroundColor:t.colors.backgroundSecondary,border:`1px solid ${t.colors.border}`,borderRadius:"12px",color:t.colors.textSecondary,fontSize:t.fontSizes[0],cursor:"pointer",transition:"background-color 150ms ease"},onMouseEnter:D=>{D.currentTarget.style.backgroundColor=t.colors.backgroundTertiary},onMouseLeave:D=>{D.currentTarget.style.backgroundColor=t.colors.backgroundSecondary},children:['"',q,'"']},H))]}),X&&s.jsxs("div",{style:{padding:"12px 16px",fontSize:t.fontSizes[0],color:t.colors.warning,display:"flex",alignItems:"center",gap:"8px"},children:[s.jsx("span",{children:"Agent unavailable."}),s.jsxs("span",{style:{color:t.colors.textMuted},children:["Use quick commands (start with ",s.jsx("kbd",{style:{padding:"2px 6px",backgroundColor:t.colors.backgroundSecondary,borderRadius:"3px",border:`1px solid ${t.colors.border}`},children:"/"}),")"]})]}),j&&s.jsx(pe,{matches:$,argumentMatches:M,currentArg:I,isEnteringArgs:A.isEnteringArgs,selectedIndex:S,onSelect:q=>{var D;if(A.isEnteringArgs){const B=M[q];if(B){let Z=`/${A.commandName}`;for(const te of A.enteredArgs)Z+=` ${te}`;Z+=` ${B.option}`;const ae=A.currentArgIndex+1;((D=A.command)==null?void 0:D.args)&&ae<A.command.args.length&&(Z+=" "),n(Z)}return}const H=$[q];if(H){const B=H.command;let Z=`/${B.name}`;B.args&&B.args.length>0&&(Z+=" "),n(Z)}}})]})]}),s.jsx("style",{children:`
|
|
56
|
+
`,backgroundSize:"150px 150px",backgroundPosition:"30px 10px, 90px 60px, 15px 100px, 120px 30px, 70px 130px",animation:p?"focus-overlay-snowfall-2 7s linear infinite":"none"},N={...q,background:`
|
|
57
|
+
radial-gradient(circle, ${A} 0%, ${A} 1.5px, transparent 1.5px),
|
|
58
|
+
radial-gradient(circle, ${A} 0%, ${A} 1.5px, transparent 1.5px),
|
|
59
|
+
radial-gradient(circle, ${A} 0%, ${A} 1.5px, transparent 1.5px),
|
|
60
|
+
radial-gradient(circle, ${A} 0%, ${A} 1.5px, transparent 1.5px),
|
|
61
|
+
radial-gradient(circle, ${A} 0%, ${A} 1.5px, transparent 1.5px),
|
|
62
|
+
radial-gradient(circle, ${A} 0%, ${A} 1.5px, transparent 1.5px)
|
|
63
|
+
`,backgroundSize:"150px 150px",backgroundPosition:"20px 5px, 80px 45px, 45px 90px, 130px 20px, 5px 70px, 100px 110px",animation:p?"focus-overlay-snowfall-3 12s linear infinite":"none"};return s.jsxs("div",{ref:u,className:`focus-mode-overlay focus-mode-overlay--${e} ${m}`,style:M,role:"presentation","aria-hidden":"true","data-active":o,"data-variant":e,children:[P&&s.jsx("div",{className:"focus-mode-overlay__vignette-drift",style:j}),I&&s.jsx("div",{className:"focus-mode-overlay__radial-breathing",style:E}),S&&s.jsxs(s.Fragment,{children:[s.jsx("div",{className:"focus-mode-overlay__snowfall-layer-3",style:N}),s.jsx("div",{className:"focus-mode-overlay__snowfall-layer-2",style:Q}),s.jsx("div",{className:"focus-mode-overlay__snowfall-layer-1",style:te})]})]})},ce=({value:o,onChange:e,onSubmit:t,onClose:r,onHistoryPrevious:a,onHistoryNext:c,mode:l,status:n,placeholder:m="What would you like to do?",disabled:d=!1,autoFocus:b=!0,agentAvailable:p=!0,showAutocomplete:h=!1,autocompleteItemCount:v=0,onAutocompleteNext:g,onAutocompletePrevious:u,onAutocompleteAccept:f})=>{const{theme:x}=U.useTheme(),$=i.useRef(null);i.useEffect(()=>{b&&$.current&&$.current.focus()},[b]);const M=I=>{switch(I.stopPropagation(),I.key){case"Enter":I.preventDefault(),h&&v===1&&f?f(!0):t();break;case"Escape":I.preventDefault(),r();break;case"Tab":h&&f&&(I.preventDefault(),f());break;case"ArrowUp":I.preventDefault(),h&&u?u():a();break;case"ArrowDown":I.preventDefault(),h&&g?g():c();break}},P=n==="thinking"||n==="executing";return s.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px",padding:"12px 16px",backgroundColor:x.colors.background,borderBottom:`1px solid ${x.colors.border}`},children:[s.jsx("span",{style:{color:l==="quick-command"?x.colors.info:p?x.colors.primary:x.colors.textMuted,fontFamily:x.fonts.monospace,fontSize:x.fontSizes[1],userSelect:"none",display:"flex",alignItems:"center"},children:l==="quick-command"?s.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[s.jsx("polyline",{points:"4 17 10 11 4 5"}),s.jsx("line",{x1:"12",y1:"19",x2:"20",y2:"19"})]}):p?s.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[s.jsx("rect",{x:"3",y:"11",width:"18",height:"10",rx:"2"}),s.jsx("circle",{cx:"12",cy:"5",r:"2"}),s.jsx("path",{d:"M12 7v4"}),s.jsx("line",{x1:"8",y1:"16",x2:"8",y2:"16"}),s.jsx("line",{x1:"16",y1:"16",x2:"16",y2:"16"})]}):">"}),s.jsx("input",{ref:$,"data-agent-command-palette-input":!0,type:"text",value:o,onChange:I=>e(I.target.value),onKeyDown:M,placeholder:m,disabled:d||P,style:{flex:1,backgroundColor:"transparent",border:"none",outline:"none",color:x.colors.text,fontFamily:x.fonts.monospace,fontSize:x.fontSizes[1],caretColor:x.colors.primary}}),P&&s.jsxs("span",{style:{color:x.colors.info,fontSize:x.fontSizes[0],display:"flex",alignItems:"center",gap:"4px"},children:[s.jsx("span",{style:{display:"inline-block",width:"8px",height:"8px",borderRadius:"50%",backgroundColor:x.colors.info,animation:"pulse 1s ease-in-out infinite"}}),n==="thinking"?"Thinking...":"Executing..."]}),!P&&s.jsx("kbd",{style:{padding:"2px 6px",backgroundColor:x.colors.backgroundSecondary,borderRadius:"3px",border:`1px solid ${x.colors.border}`,fontSize:x.fontSizes[0],color:x.colors.textMuted},children:"Alt+P"})]})};ce.displayName="AgentCommandInput";const Ge=({status:o})=>{const{theme:e}=U.useTheme(),t={display:"inline-flex",alignItems:"center",justifyContent:"center",width:"16px",height:"16px",fontSize:e.fontSizes[0]};switch(o){case"pending":return s.jsx("span",{style:{...t,color:e.colors.textMuted},children:"○"});case"running":return s.jsx("span",{style:{...t,color:e.colors.info,animation:"spin 1s linear infinite"},children:"◐"});case"success":return s.jsx("span",{style:{...t,color:e.colors.success},children:"✓"});case"error":return s.jsx("span",{style:{...t,color:e.colors.error},children:"✗"})}},Ue=o=>{const e=Object.entries(o);return e.length===0?"":e.map(([t,r])=>t==="args"&&Array.isArray(r)?r.join(", "):typeof r=="string"?`"${r}"`:JSON.stringify(r)).join(", ")},Ye=({tool:o,compact:e})=>{const{theme:t}=U.useTheme(),r=Ue(o.args);return s.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px",padding:e?"4px 0":"8px 0",fontFamily:t.fonts.monospace,fontSize:t.fontSizes[1]},children:[s.jsx(Ge,{status:o.status}),s.jsxs("span",{style:{color:t.colors.text},children:[o.name,r&&s.jsxs("span",{style:{color:t.colors.textMuted},children:["(",r,")"]})]}),o.status==="running"&&s.jsx("span",{style:{marginLeft:"auto",color:t.colors.info,fontSize:t.fontSizes[0]},children:"[running]"}),o.status==="success"&&s.jsx("span",{style:{marginLeft:"auto",color:t.colors.success,fontSize:t.fontSizes[0]},children:"[done]"}),o.status==="error"&&s.jsx("span",{style:{marginLeft:"auto",color:t.colors.error,fontSize:t.fontSizes[0]},title:o.error,children:"[error]"})]})},de=({tools:o,compact:e=!1})=>{const{theme:t}=U.useTheme();return o.length===0?null:s.jsx("div",{style:{padding:e?"8px 16px":"12px 16px",backgroundColor:t.colors.backgroundSecondary,borderRadius:"4px",margin:"8px 16px"},children:o.map(r=>s.jsx(Ye,{tool:r,compact:e},r.id))})};de.displayName="ToolExecutionList";const ue=({response:o,streaming:e=!1})=>{const{theme:t}=U.useTheme();if(!o)return null;const r=o.toLowerCase().startsWith("error"),a=o.toLowerCase().startsWith("done")||o.toLowerCase().startsWith("executed");return s.jsxs("div",{style:{padding:"12px 16px",color:r?t.colors.error:a?t.colors.success:t.colors.text,fontSize:t.fontSizes[1],display:"flex",alignItems:"center",gap:"8px"},children:[a&&s.jsx("span",{children:"✓"}),r&&s.jsx("span",{children:"✗"}),s.jsxs("span",{children:[o,e&&s.jsx("span",{style:{display:"inline-block",width:"2px",height:"14px",backgroundColor:t.colors.primary,marginLeft:"2px",animation:"blink 1s step-end infinite"}})]})]})};ue.displayName="AgentResponseDisplay";function je({text:o,matchedIndices:e,highlightColor:t}){if(!e.length)return s.jsx(s.Fragment,{children:o});const r=new Set(e),a=o.split("");return s.jsx(s.Fragment,{children:a.map((c,l)=>s.jsx("span",{style:{color:r.has(l)?t:"inherit",fontWeight:r.has(l)?600:"inherit"},children:c},l))})}const pe=({matches:o,argumentMatches:e=[],currentArg:t,isEnteringArgs:r=!1,selectedIndex:a,onSelect:c,maxVisible:l=6})=>{const{theme:n}=U.useTheme(),m=i.useRef(null),d=i.useRef(null);if(i.useEffect(()=>{d.current&&m.current&&d.current.scrollIntoView({block:"nearest",behavior:"smooth"})},[a]),r&&e.length>0){const v=40*l;return s.jsxs("div",{ref:m,style:{maxHeight:`${v}px`,overflowY:"auto",borderTop:`1px solid ${n.colors.border}`},children:[t&&s.jsxs("div",{style:{padding:"8px 16px",fontSize:n.fontSizes[0],color:n.colors.textMuted,backgroundColor:n.colors.backgroundSecondary,borderBottom:`1px solid ${n.colors.border}`},children:[s.jsx("span",{style:{color:n.colors.textSecondary},children:t.name}),t.description&&s.jsxs("span",{style:{marginLeft:"8px"},children:["— ",t.description]})]}),e.map((g,u)=>{const f=u===a;return s.jsxs("div",{ref:f?d:void 0,onClick:()=>c(u),style:{display:"flex",alignItems:"center",gap:"12px",padding:"8px 16px",cursor:"pointer",backgroundColor:f?n.colors.backgroundSecondary:"transparent",borderLeft:f?`2px solid ${n.colors.primary}`:"2px solid transparent",transition:"background-color 100ms ease"},onMouseEnter:x=>{f||(x.currentTarget.style.backgroundColor=n.colors.backgroundSecondary)},onMouseLeave:x=>{f||(x.currentTarget.style.backgroundColor="transparent")},children:[s.jsx("span",{style:{fontFamily:n.fonts.monospace,fontSize:n.fontSizes[1],color:n.colors.text,flex:1},children:s.jsx(je,{text:g.option,matchedIndices:g.matchedIndices,highlightColor:n.colors.primary})}),f&&s.jsx("kbd",{style:{padding:"2px 6px",backgroundColor:n.colors.backgroundTertiary,borderRadius:"3px",border:`1px solid ${n.colors.border}`,fontSize:n.fontSizes[0],color:n.colors.textMuted,flexShrink:0},children:"Tab"})]},`${g.option}-${u}`)})]})}if(o.length===0)return null;const p=48*l;return s.jsx("div",{ref:m,style:{maxHeight:`${p}px`,overflowY:"auto",borderTop:`1px solid ${n.colors.border}`},children:o.map((h,v)=>{const g=v===a,u=h.command;return s.jsxs("div",{ref:g?d:void 0,onClick:()=>c(v),style:{display:"flex",alignItems:"center",gap:"12px",padding:"10px 16px",cursor:"pointer",backgroundColor:g?n.colors.backgroundSecondary:"transparent",borderLeft:g?`2px solid ${n.colors.primary}`:"2px solid transparent",transition:"background-color 100ms ease"},onMouseEnter:f=>{g||(f.currentTarget.style.backgroundColor=n.colors.backgroundSecondary)},onMouseLeave:f=>{g||(f.currentTarget.style.backgroundColor="transparent")},children:[s.jsx("span",{style:{color:n.colors.info,fontFamily:n.fonts.monospace,fontSize:n.fontSizes[1],flexShrink:0},children:"/"}),s.jsxs("div",{style:{flex:1,minWidth:0},children:[s.jsxs("div",{style:{fontFamily:n.fonts.monospace,fontSize:n.fontSizes[1],color:n.colors.text},children:[s.jsx(je,{text:u.name,matchedIndices:h.matchedOn===u.name?h.matchedIndices:[],highlightColor:n.colors.primary}),h.matchedOn!==u.name&&s.jsxs("span",{style:{color:n.colors.textMuted,marginLeft:"8px",fontSize:n.fontSizes[0]},children:["(alias: ",h.matchedOn,")"]})]}),s.jsx("div",{style:{fontSize:n.fontSizes[0],color:n.colors.textMuted,marginTop:"2px",whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"},children:u.description})]}),u.args&&u.args.length>0&&s.jsx("div",{style:{fontSize:n.fontSizes[0],color:n.colors.textMuted,fontFamily:n.fonts.monospace,flexShrink:0},children:u.args.map((f,x)=>s.jsxs("span",{children:[x>0&&" ",s.jsx("span",{style:{color:f.required?n.colors.warning:n.colors.textMuted},children:f.required?`<${f.name}>`:`[${f.name}]`})]},f.name))}),g&&s.jsx("kbd",{style:{padding:"2px 6px",backgroundColor:n.colors.backgroundTertiary,borderRadius:"3px",border:`1px solid ${n.colors.border}`,fontSize:n.fontSizes[0],color:n.colors.textMuted,flexShrink:0},children:"Tab"})]},`${u.name}-${v}`)})})};pe.displayName="QuickCommandAutocomplete";const Pe=({palette:o,config:e})=>{const{theme:t}=U.useTheme(),r=i.useRef(null),{isOpen:a,close:c,query:l,setQuery:n,mode:m,status:d,pendingTools:b,completedTools:p,agentResponse:h,submit:v,historyPrevious:g,historyNext:u,suggestions:f,agentAvailable:x,quickCommandMatches:$,argumentOptionMatches:M,parsedQuery:P,currentArgDef:I,selectedAutocompleteIndex:S,autocompleteItemCount:w,autocompleteNext:k,autocompletePrevious:j,autocompleteAccept:E,showAutocomplete:T}=o;i.useEffect(()=>{if(!a)return;const O=D=>{r.current&&!r.current.contains(D.target)&&c()},H=setTimeout(()=>{document.addEventListener("mousedown",O)},100);return()=>{clearTimeout(H),document.removeEventListener("mousedown",O)}},[a,c]);const[C,A]=i.useState(!1),[q,te]=i.useState(!1);if(i.useEffect(()=>{if(a)te(!0),requestAnimationFrame(()=>{requestAnimationFrame(()=>{A(!0)})});else{A(!1);const O=setTimeout(()=>{te(!1)},150);return()=>clearTimeout(O)}},[a]),!q)return null;const Q=x?(e==null?void 0:e.placeholder)||"What would you like to do?":"Quick command mode (agent unavailable)",N=[...p,...b],Y=N.length>0,B=h&&d!=="idle",R=x&&!l&&d==="idle"&&f.length>0,X=!x&&m!=="quick-command"&&d==="idle";return s.jsxs(s.Fragment,{children:[s.jsx("div",{style:{position:"fixed",inset:0,zIndex:999},onClick:c}),s.jsxs("div",{ref:r,className:e==null?void 0:e.className,style:{position:"fixed",bottom:0,left:0,right:0,maxHeight:"50vh",backgroundColor:t.colors.background,borderTop:`1px solid ${t.colors.border}`,boxShadow:t.shadows[2],zIndex:1e3,display:"flex",flexDirection:"column-reverse",overflow:"hidden",transform:C?"translateY(0)":"translateY(100%)",transition:"transform 150ms ease-out",...e==null?void 0:e.style},children:[s.jsxs("div",{children:[s.jsx(ce,{value:l,onChange:n,onSubmit:v,onClose:c,onHistoryPrevious:g,onHistoryNext:u,mode:m,status:d,placeholder:Q,agentAvailable:x,showAutocomplete:T,autocompleteItemCount:w,onAutocompleteNext:k,onAutocompletePrevious:j,onAutocompleteAccept:E}),s.jsxs("div",{style:{padding:"8px 16px",borderTop:`1px solid ${t.colors.border}`,display:"flex",gap:"16px",fontSize:t.fontSizes[0],color:t.colors.textMuted,backgroundColor:t.colors.background},children:[s.jsxs("span",{children:[s.jsx("kbd",{style:{padding:"2px 6px",backgroundColor:t.colors.backgroundSecondary,borderRadius:"3px",border:`1px solid ${t.colors.border}`},children:"Enter"})," ","Execute"]}),s.jsxs("span",{children:[s.jsx("kbd",{style:{padding:"2px 6px",backgroundColor:t.colors.backgroundSecondary,borderRadius:"3px",border:`1px solid ${t.colors.border}`},children:"Esc"})," ","Close"]}),s.jsxs("span",{children:[s.jsx("kbd",{style:{padding:"2px 6px",backgroundColor:t.colors.backgroundSecondary,borderRadius:"3px",border:`1px solid ${t.colors.border}`},children:"↑↓"})," ","History"]}),s.jsxs("span",{style:{marginLeft:"auto"},children:[s.jsx("kbd",{style:{padding:"2px 6px",backgroundColor:t.colors.backgroundSecondary,borderRadius:"3px",border:`1px solid ${t.colors.border}`},children:"/"})," ","Quick command"]})]})]}),s.jsxs("div",{style:{overflow:"auto"},children:[Y&&s.jsx(de,{tools:N,compact:N.length>3}),B&&s.jsx(ue,{response:h,streaming:d==="thinking"}),R&&s.jsxs("div",{style:{padding:"12px 16px",display:"flex",gap:"8px",flexWrap:"wrap"},children:[s.jsx("span",{style:{color:t.colors.textMuted,fontSize:t.fontSizes[0],marginRight:"4px"},children:"Try:"}),f.map((O,H)=>s.jsxs("button",{onClick:()=>{n(O)},style:{padding:"4px 10px",backgroundColor:t.colors.backgroundSecondary,border:`1px solid ${t.colors.border}`,borderRadius:"12px",color:t.colors.textSecondary,fontSize:t.fontSizes[0],cursor:"pointer",transition:"background-color 150ms ease"},onMouseEnter:D=>{D.currentTarget.style.backgroundColor=t.colors.backgroundTertiary},onMouseLeave:D=>{D.currentTarget.style.backgroundColor=t.colors.backgroundSecondary},children:['"',O,'"']},H))]}),X&&s.jsxs("div",{style:{padding:"12px 16px",fontSize:t.fontSizes[0],color:t.colors.warning,display:"flex",alignItems:"center",gap:"8px"},children:[s.jsx("span",{children:"Agent unavailable."}),s.jsxs("span",{style:{color:t.colors.textMuted},children:["Use quick commands (start with ",s.jsx("kbd",{style:{padding:"2px 6px",backgroundColor:t.colors.backgroundSecondary,borderRadius:"3px",border:`1px solid ${t.colors.border}`},children:"/"}),")"]})]}),T&&s.jsx(pe,{matches:$,argumentMatches:M,currentArg:I,isEnteringArgs:P.isEnteringArgs,selectedIndex:S,onSelect:O=>{var D;if(P.isEnteringArgs){const V=M[O];if(V){let Z=`/${P.commandName}`;for(const oe of P.enteredArgs)Z+=` ${oe}`;Z+=` ${V.option}`;const ae=P.currentArgIndex+1;((D=P.command)==null?void 0:D.args)&&ae<P.command.args.length&&(Z+=" "),n(Z)}return}const H=$[O];if(H){const V=H.command;let Z=`/${V.name}`;V.args&&V.args.length>0&&(Z+=" "),n(Z)}}})]})]}),s.jsx("style",{children:`
|
|
64
64
|
@keyframes pulse {
|
|
65
65
|
0%, 100% { opacity: 1; }
|
|
66
66
|
50% { opacity: 0.5; }
|
|
@@ -73,11 +73,11 @@
|
|
|
73
73
|
0%, 100% { opacity: 1; }
|
|
74
74
|
50% { opacity: 0; }
|
|
75
75
|
}
|
|
76
|
-
`})]})};Ae.displayName="AgentCommandPalette";function re(o,e){const t=o.toLowerCase(),r=e.toLowerCase();if(!t)return{score:0,matchedIndices:[]};const a=[];let c=0,l=0,n=0,m=-1;for(let d=0;d<r.length&&c<t.length;d++)r[d]===t[c]&&(a.push(d),m===d-1?(n++,l+=n*2):n=1,d===0&&(l+=10),d>0&&/[_\-\s]/.test(e[d-1])&&(l+=5),l+=1,m=d,c++);return c<t.length?null:(l-=e.length*.1,t===r&&(l+=20),r.startsWith(t)&&(l+=15),{score:l,matchedIndices:a})}function Pe(o,e,t=10){const r=o.replace(/^\//,"").trim();if(!r)return[];const a=[];for(const c of e){const l=re(r,c.name);if(l){a.push({command:c,score:l.score,matchedIndices:l.matchedIndices,matchedOn:c.name});continue}if(c.aliases)for(const n of c.aliases){const m=re(r,n);if(m){a.push({command:c,score:m.score-2,matchedIndices:m.matchedIndices,matchedOn:n});break}}}return a.sort((c,l)=>l.score-c.score).slice(0,t)}function Xe(o,e){const r=o.replace(/^\//,"").split(/\s+/),a=r[0]||"",c=o.endsWith(" ")&&o.trim().length>0,l=e.find(m=>{var d;return m.name.toLowerCase()===a.toLowerCase()||((d=m.aliases)==null?void 0:d.some(b=>b.toLowerCase()===a.toLowerCase()))})||null;if(!l)return{commandName:a,command:null,enteredArgs:[],currentArgValue:"",currentArgIndex:-1,isEnteringArgs:!1};const n=r.slice(1);if(c)return{commandName:l.name,command:l,enteredArgs:n,currentArgValue:"",currentArgIndex:n.length,isEnteringArgs:!0};if(n.length>0){const m=n.slice(0,-1),d=n[n.length-1];return{commandName:l.name,command:l,enteredArgs:m,currentArgValue:d,currentArgIndex:m.length,isEnteringArgs:!0}}return{commandName:l.name,command:l,enteredArgs:[],currentArgValue:"",currentArgIndex:-1,isEnteringArgs:!1}}function Ze(o,e,t=10){if(!e.length)return[];if(!o)return e.slice(0,t).map(a=>({option:a,score:0,matchedIndices:[]}));const r=[];for(const a of e){const c=re(o,a);c&&r.push({option:a,score:c.score,matchedIndices:c.matchedIndices})}return r.sort((a,c)=>c.score-a.score).slice(0,t)}const et=["hide sidebars","show terminal","focus editor"];function tt({events:o,keyboard:e={key:"p",altKey:!0},config:t={},onExecuteTool:r,initialSuggestions:a=et,agentAvailable:c=!0,quickCommands:l=[]}={}){const[n,m]=i.useState(!1),[d,b]=i.useState(""),[p,h]=i.useState("natural"),[v,g]=i.useState("idle"),[u,f]=i.useState([]),[x,$]=i.useState([]),[M,A]=i.useState(""),[I,S]=i.useState([]),[w,k]=i.useState(-1),T=i.useMemo(()=>a,[a]),[E,j]=i.useState(-1),C=i.useMemo(()=>p!=="quick-command"||!l.length?{commandName:"",command:null,enteredArgs:[],currentArgValue:"",currentArgIndex:-1,isEnteringArgs:!1}:Xe(d,l),[d,p,l]),P=i.useMemo(()=>p!=="quick-command"||!l.length||C.isEnteringArgs?[]:Pe(d,l),[d,p,l,C.isEnteringArgs]),O=i.useMemo(()=>{var L;if(!C.isEnteringArgs||!((L=C.command)!=null&&L.args))return[];const y=C.command.args[C.currentArgIndex];return y!=null&&y.options?Ze(C.currentArgValue,y.options):[]},[C]),ee=i.useMemo(()=>{var y;return!C.isEnteringArgs||!((y=C.command)!=null&&y.args)?null:C.command.args[C.currentArgIndex]||null},[C]),Q=i.useMemo(()=>p!=="quick-command"||v!=="idle"||d.length===0?!1:P.length>0||O.length>0,[p,v,d.length,P.length,O.length]),N=i.useMemo(()=>C.isEnteringArgs?O.length:P.length,[C.isEnteringArgs,O.length,P.length]);i.useEffect(()=>{j(N>0?0:-1)},[N]);const Y=i.useCallback(y=>{b(y),h(y.startsWith("/")?"quick-command":"natural")},[]),V=i.useCallback(()=>{m(!0),c?(b(""),h("natural")):(b("/"),h("quick-command")),g("idle"),f([]),$([]),A(""),k(-1),o==null||o.emit({type:"agent-command-palette:opened",source:"agent-command-palette",timestamp:Date.now(),payload:{}})},[o,c]),R=i.useCallback(()=>{m(!1),o==null||o.emit({type:"agent-command-palette:closed",source:"agent-command-palette",timestamp:Date.now(),payload:{}})},[o]),X=i.useCallback(()=>{n?R():V()},[n,V,R]),q=i.useCallback(()=>{b(""),h("natural"),g("idle"),f([]),$([]),A(""),k(-1)},[]),H=i.useCallback(y=>{const L={...y,status:"pending"};return f(W=>[...W,L]),L},[]),D=i.useCallback((y,L,W,J)=>{f(F=>{const K=F.find(G=>G.id===y);if(!K)return F;const z={...K,status:L,result:W,error:J};return L==="success"||L==="error"?($(G=>[...G,z]),F.filter(G=>G.id!==y)):F.map(G=>G.id===y?z:G)})},[]),B=i.useCallback(async y=>{const L=y.replace(/^\//,"").trim().split(/\s+/),W=L[0],J=L.slice(1);if(!W)return;g("executing");const F=`quick-${Date.now()}`;H({id:F,name:W,args:{args:J}}),D(F,"running");try{if(r){const z=await r(W,{args:J});D(F,"success",String(z))}else D(F,"success","Tool executed (no handler)");S(z=>[{query:y,timestamp:Date.now(),toolsExecuted:[W],success:!0},...z.slice(0,(t.maxHistoryEntries||50)-1)]),g("complete"),A(`Executed: ${W}`);const K=t.autoCloseDelay??1e3;K>0&&setTimeout(()=>R(),K)}catch(K){const z=K instanceof Error?K.message:"Unknown error";D(F,"error",void 0,z),g("error"),A(`Error: ${z}`)}},[r,H,D,t.autoCloseDelay,t.maxHistoryEntries,R]),Z=i.useCallback(()=>{if(d.trim()){if(p==="quick-command"){B(d);return}if(!c){A("Agent unavailable. Use quick commands (start with /)."),g("error");return}g("thinking"),o==null||o.emit({type:"agent-command-palette:submit",source:"agent-command-palette",timestamp:Date.now(),payload:{query:d,mode:p}}),S(y=>[{query:d,timestamp:Date.now(),toolsExecuted:[],success:!0},...y.slice(0,(t.maxHistoryEntries||50)-1)])}},[d,p,B,o,t.maxHistoryEntries,c]),ae=i.useCallback(()=>{if(I.length===0)return;const y=w<I.length-1?w+1:w;k(y),I[y]&&(b(I[y].query),h(I[y].query.startsWith("/")?"quick-command":"natural"))},[I,w]),Se=i.useCallback(()=>{if(w<=0){k(-1),b(""),h("natural");return}const y=w-1;k(y),I[y]&&(b(I[y].query),h(I[y].query.startsWith("/")?"quick-command":"natural"))},[I,w]),te=i.useCallback(y=>{const{key:L="p",altKey:W=!0,ctrlKey:J=!1,metaKey:F=!1,shiftKey:K=!1}=e,z=y.altKey===W&&y.ctrlKey===J&&y.metaKey===F&&y.shiftKey===K;if((W?y.code===`Key${L.toUpperCase()}`:y.key.toLowerCase()===L.toLowerCase())&&z){const oe=y.target;if(!oe.closest("[data-agent-command-palette-input]")&&(oe.tagName==="INPUT"||oe.tagName==="TEXTAREA"||oe.isContentEditable))return;y.preventDefault(),X()}},[e,X]);i.useEffect(()=>(window.addEventListener("keydown",te),()=>window.removeEventListener("keydown",te)),[te]);const _e=i.useCallback(()=>{Q&&j(y=>y<N-1?y+1:0)},[Q,N]),Me=i.useCallback(()=>{Q&&j(y=>y>0?y-1:N-1)},[Q,N]),De=i.useCallback((y=!1)=>{var F;if(!Q||E<0)return;if(C.isEnteringArgs){const K=O[E];if(!K)return;let z=`/${C.commandName}`;for(const Ce of C.enteredArgs)z+=` ${Ce}`;z+=` ${K.option}`;const G=C.currentArgIndex+1;((F=C.command)==null?void 0:F.args)&&G<C.command.args.length?(z+=" ",b(z),j(-1)):(b(z),j(-1),y&&setTimeout(()=>B(z),0));return}const L=P[E];if(!L)return;const W=L.command;let J=`/${W.name}`;W.args&&W.args.length>0?(J+=" ",b(J),j(-1)):(b(J),j(-1),y&&setTimeout(()=>B(J),0))},[Q,E,C,O,P,B]);return{agentAvailable:c,isOpen:n,open:V,close:R,toggle:X,query:d,setQuery:Y,mode:p,status:v,setStatus:g,pendingTools:u,completedTools:x,agentResponse:M,setAgentResponse:A,submit:Z,executeQuickCommand:B,addPendingTool:H,updateToolStatus:D,history:I,historyPrevious:ae,historyNext:Se,suggestions:T,clear:q,quickCommandMatches:P,argumentOptionMatches:O,parsedQuery:C,currentArgDef:ee,selectedAutocompleteIndex:E,autocompleteItemCount:N,autocompleteNext:_e,autocompletePrevious:Me,autocompleteAccept:De,showAutocomplete:Q}}const fe={name:"get_visible_panels",description:"Get the current visibility state of all panel slots (left, middle, right). Returns which panels are active in each slot and whether side panels are collapsed.",inputs:{type:"object",properties:{},required:[]},outputs:{type:"object",properties:{left:{type:"object",properties:{panelId:{type:"string",description:"The ID of the panel in the left slot"},collapsed:{type:"boolean",description:"Whether the left panel is collapsed"},size:{type:"number",description:"Width percentage of the left panel"}}},middle:{type:"object",properties:{panelId:{type:"string",description:"The ID of the panel in the middle slot"},size:{type:"number",description:"Width percentage of the middle panel"}}},right:{type:"object",properties:{panelId:{type:"string",description:"The ID of the panel in the right slot"},collapsed:{type:"boolean",description:"Whether the right panel is collapsed"},size:{type:"number",description:"Width percentage of the right panel"}}},workspaceId:{type:"string",description:"The ID of the currently active workspace layout"}}},tags:["panel","layout","visibility","state","query"],tool_call_template:{call_template_type:"panel_event",event_type:"panel:get-visibility"}},ge={name:"get_panel_state",description:"Get the current state of a specific panel. Returns panel-specific state data if the panel supports state queries.",inputs:{type:"object",properties:{panelId:{type:"string",description:'The ID of the panel to query state from (e.g., "file-tree", "terminal")'}},required:["panelId"]},outputs:{type:"object",properties:{panelId:{type:"string",description:"The queried panel ID"},hasState:{type:"boolean",description:"Whether the panel supports state queries"},state:{type:"object",description:"The panel state (shape depends on the panel)"}}},tags:["panel","state","query"],tool_call_template:{call_template_type:"panel_event",event_type:"panel:get-state"}},me={name:"list_panels_with_state",description:"Get a list of all panels that support state queries. Use this to discover which panels can be queried with get_panel_state.",inputs:{type:"object",properties:{},required:[]},outputs:{type:"object",properties:{panels:{type:"array",items:{type:"object",properties:{panelId:{type:"string",description:"The panel ID"},name:{type:"string",description:"The panel display name"},description:{type:"string",description:"Description of the state this panel provides"}}},description:"List of panels that support state queries"}}},tags:["panel","state","query","discovery"],tool_call_template:{call_template_type:"panel_event",event_type:"panel:list-state-panels"}},he={name:"toggle_panel",description:"Collapse or expand a side panel to give more space to the main content area.",inputs:{type:"object",properties:{panel:{type:"string",enum:["left","right"],description:'Which panel to toggle: "left" or "right"'}},required:["panel"]},outputs:{type:"object",properties:{success:{type:"boolean"},panel:{type:"string"},action:{type:"string"}}},tags:["panel","layout","toggle","collapse","expand","sidebar"],tool_call_template:{call_template_type:"panel_event",event_type:"panel:toggle"}},ye={name:"collapse_all_panels",description:"Collapse both left and right panels to maximize the main content area. Useful for focus mode.",inputs:{type:"object",properties:{},required:[]},outputs:{type:"object",properties:{success:{type:"boolean"},action:{type:"string"}}},tags:["panel","layout","collapse","focus","maximize"],tool_call_template:{call_template_type:"panel_event",event_type:"panel:collapse-all"}},xe={name:"expand_all_panels",description:"Expand both left and right panels to show all content. Restores the default layout.",inputs:{type:"object",properties:{},required:[]},outputs:{type:"object",properties:{success:{type:"boolean"},action:{type:"string"}}},tags:["panel","layout","expand","restore","show"],tool_call_template:{call_template_type:"panel_event",event_type:"panel:expand-all"}},be={name:"switch_panel",description:"Change which content is displayed in a panel slot (left, middle, or right).",inputs:{type:"object",properties:{slot:{type:"string",enum:["left","middle","right"],description:'Which slot to change: "left", "middle", or "right"'},panel:{type:"string",description:"The panel ID to display in the slot"}},required:["slot","panel"]},outputs:{type:"object",properties:{success:{type:"boolean"},slot:{type:"string"},panel:{type:"string"}}},tags:["panel","layout","switch","navigation","view"],tool_call_template:{call_template_type:"panel_event",event_type:"panel:switch"}},ke={name:"focus_panel",description:"Set focus to a specific panel slot for keyboard navigation.",inputs:{type:"object",properties:{slot:{type:"string",enum:["left","middle","right"],description:'Which slot to focus: "left", "middle", or "right"'}},required:["slot"]},outputs:{type:"object",properties:{success:{type:"boolean"},slot:{type:"string"}}},tags:["panel","focus","navigation","keyboard"],tool_call_template:{call_template_type:"panel_event",event_type:"panel:focus"}},we={name:"reset_layout",description:"Reset panel sizes to the default layout configuration.",inputs:{type:"object",properties:{},required:[]},outputs:{type:"object",properties:{success:{type:"boolean"},action:{type:"string"}}},tags:["panel","layout","reset","default","restore"],tool_call_template:{call_template_type:"panel_event",event_type:"panel:reset-layout"}},$e=[fe,ge,me,he,ye,xe,be,ke,we],ot=[fe,ge,me],st=[he,ye,xe,be,ke,we],rt={id:"panel-layouts",name:"Panel Layouts",description:"Generic panel layout and state query operations",tools:$e};function Ee(o){const e={};if(o.inputs.properties)for(const[t,r]of Object.entries(o.inputs.properties)){const a=r;e[t]={type:a.type||"string",description:a.description,...a.enum&&{enum:a.enum}}}return{name:o.name,description:o.description,parameters:{type:"object",properties:e,required:o.inputs.required||[]}}}function nt(o){return{functionDeclarations:o.map(Ee)}}function Le(o){return{type:"function",function:{name:o.name,description:o.description,parameters:o.inputs}}}function at(o){return o.map(Le)}function ze(o){return{name:o.name,description:o.description,input_schema:o.inputs}}function it(o){return o.map(ze)}function Re(o){return{name:o.name,description:o.description,parameters:o.inputs}}function lt(o){return o.map(Re)}function ct(o,e={}){const{header:t="You have access to the following tools:",includeParameters:r=!0}=e,a=o.map(c=>{let l=`- ${c.name}: ${c.description}`;if(r&&c.inputs.properties){const n=Object.entries(c.inputs.properties).map(([m,d])=>{var h;const b=d,p=(h=c.inputs.required)!=null&&h.includes(m)?" (required)":"";return` - ${m}: ${b.description||b.type}${p}`}).join(`
|
|
76
|
+
`})]})};Pe.displayName="AgentCommandPalette";function ne(o,e){const t=o.toLowerCase(),r=e.toLowerCase();if(!t)return{score:0,matchedIndices:[]};const a=[];let c=0,l=0,n=0,m=-1;for(let d=0;d<r.length&&c<t.length;d++)r[d]===t[c]&&(a.push(d),m===d-1?(n++,l+=n*2):n=1,d===0&&(l+=10),d>0&&/[_\-\s]/.test(e[d-1])&&(l+=5),l+=1,m=d,c++);return c<t.length?null:(l-=e.length*.1,t===r&&(l+=20),r.startsWith(t)&&(l+=15),{score:l,matchedIndices:a})}function Ae(o,e,t=10){const r=o.replace(/^\//,"").trim();if(!r)return[];const a=[];for(const c of e){const l=ne(r,c.name);if(l){a.push({command:c,score:l.score,matchedIndices:l.matchedIndices,matchedOn:c.name});continue}if(c.aliases)for(const n of c.aliases){const m=ne(r,n);if(m){a.push({command:c,score:m.score-2,matchedIndices:m.matchedIndices,matchedOn:n});break}}}return a.sort((c,l)=>l.score-c.score).slice(0,t)}function Xe(o,e){const r=o.replace(/^\//,"").split(/\s+/),a=r[0]||"",c=o.endsWith(" ")&&o.trim().length>0,l=e.find(m=>{var d;return m.name.toLowerCase()===a.toLowerCase()||((d=m.aliases)==null?void 0:d.some(b=>b.toLowerCase()===a.toLowerCase()))})||null;if(!l)return{commandName:a,command:null,enteredArgs:[],currentArgValue:"",currentArgIndex:-1,isEnteringArgs:!1};const n=r.slice(1);if(c)return{commandName:l.name,command:l,enteredArgs:n,currentArgValue:"",currentArgIndex:n.length,isEnteringArgs:!0};if(n.length>0){const m=n.slice(0,-1),d=n[n.length-1];return{commandName:l.name,command:l,enteredArgs:m,currentArgValue:d,currentArgIndex:m.length,isEnteringArgs:!0}}return{commandName:l.name,command:l,enteredArgs:[],currentArgValue:"",currentArgIndex:-1,isEnteringArgs:!1}}function Ze(o,e,t=10){if(!e.length)return[];if(!o)return e.slice(0,t).map(a=>({option:a,score:0,matchedIndices:[]}));const r=[];for(const a of e){const c=ne(o,a);c&&r.push({option:a,score:c.score,matchedIndices:c.matchedIndices})}return r.sort((a,c)=>c.score-a.score).slice(0,t)}const et=["hide sidebars","show terminal","focus editor"];function tt({events:o,keyboard:e={key:"p",altKey:!0},config:t={},onExecuteTool:r,initialSuggestions:a=et,agentAvailable:c=!0,quickCommands:l=[]}={}){const[n,m]=i.useState(!1),[d,b]=i.useState(""),[p,h]=i.useState("natural"),[v,g]=i.useState("idle"),[u,f]=i.useState([]),[x,$]=i.useState([]),[M,P]=i.useState(""),[I,S]=i.useState([]),[w,k]=i.useState(-1),j=i.useMemo(()=>a,[a]),[E,T]=i.useState(-1),C=i.useMemo(()=>p!=="quick-command"||!l.length?{commandName:"",command:null,enteredArgs:[],currentArgValue:"",currentArgIndex:-1,isEnteringArgs:!1}:Xe(d,l),[d,p,l]),A=i.useMemo(()=>p!=="quick-command"||!l.length||C.isEnteringArgs?[]:Ae(d,l),[d,p,l,C.isEnteringArgs]),q=i.useMemo(()=>{var L;if(!C.isEnteringArgs||!((L=C.command)!=null&&L.args))return[];const y=C.command.args[C.currentArgIndex];return y!=null&&y.options?Ze(C.currentArgValue,y.options):[]},[C]),te=i.useMemo(()=>{var y;return!C.isEnteringArgs||!((y=C.command)!=null&&y.args)?null:C.command.args[C.currentArgIndex]||null},[C]),Q=i.useMemo(()=>p!=="quick-command"||v!=="idle"||d.length===0?!1:A.length>0||q.length>0,[p,v,d.length,A.length,q.length]),N=i.useMemo(()=>C.isEnteringArgs?q.length:A.length,[C.isEnteringArgs,q.length,A.length]);i.useEffect(()=>{T(N>0?0:-1)},[N]);const Y=i.useCallback(y=>{b(y),h(y.startsWith("/")?"quick-command":"natural")},[]),B=i.useCallback(()=>{m(!0),c?(b(""),h("natural")):(b("/"),h("quick-command")),g("idle"),f([]),$([]),P(""),k(-1),o==null||o.emit({type:"agent-command-palette:opened",source:"agent-command-palette",timestamp:Date.now(),payload:{}})},[o,c]),R=i.useCallback(()=>{m(!1),o==null||o.emit({type:"agent-command-palette:closed",source:"agent-command-palette",timestamp:Date.now(),payload:{}})},[o]),X=i.useCallback(()=>{n?R():B()},[n,B,R]),O=i.useCallback(()=>{b(""),h("natural"),g("idle"),f([]),$([]),P(""),k(-1)},[]),H=i.useCallback(y=>{const L={...y,status:"pending"};return f(W=>[...W,L]),L},[]),D=i.useCallback((y,L,W,J)=>{f(F=>{const K=F.find(G=>G.id===y);if(!K)return F;const z={...K,status:L,result:W,error:J};return L==="success"||L==="error"?($(G=>[...G,z]),F.filter(G=>G.id!==y)):F.map(G=>G.id===y?z:G)})},[]),V=i.useCallback(async y=>{const L=y.replace(/^\//,"").trim().split(/\s+/),W=L[0],J=L.slice(1);if(!W)return;g("executing");const F=`quick-${Date.now()}`;H({id:F,name:W,args:{args:J}}),D(F,"running");try{if(r){const z=await r(W,{args:J});D(F,"success",String(z))}else D(F,"success","Tool executed (no handler)");S(z=>[{query:y,timestamp:Date.now(),toolsExecuted:[W],success:!0},...z.slice(0,(t.maxHistoryEntries||50)-1)]),g("complete"),P(`Executed: ${W}`);const K=t.autoCloseDelay??1e3;K>0&&setTimeout(()=>R(),K)}catch(K){const z=K instanceof Error?K.message:"Unknown error";D(F,"error",void 0,z),g("error"),P(`Error: ${z}`)}},[r,H,D,t.autoCloseDelay,t.maxHistoryEntries,R]),Z=i.useCallback(()=>{if(d.trim()){if(p==="quick-command"){V(d);return}if(!c){P("Agent unavailable. Use quick commands (start with /)."),g("error");return}g("thinking"),o==null||o.emit({type:"agent-command-palette:submit",source:"agent-command-palette",timestamp:Date.now(),payload:{query:d,mode:p}}),S(y=>[{query:d,timestamp:Date.now(),toolsExecuted:[],success:!0},...y.slice(0,(t.maxHistoryEntries||50)-1)])}},[d,p,V,o,t.maxHistoryEntries,c]),ae=i.useCallback(()=>{if(I.length===0)return;const y=w<I.length-1?w+1:w;k(y),I[y]&&(b(I[y].query),h(I[y].query.startsWith("/")?"quick-command":"natural"))},[I,w]),Se=i.useCallback(()=>{if(w<=0){k(-1),b(""),h("natural");return}const y=w-1;k(y),I[y]&&(b(I[y].query),h(I[y].query.startsWith("/")?"quick-command":"natural"))},[I,w]),oe=i.useCallback(y=>{const{key:L="p",altKey:W=!0,ctrlKey:J=!1,metaKey:F=!1,shiftKey:K=!1}=e,z=y.altKey===W&&y.ctrlKey===J&&y.metaKey===F&&y.shiftKey===K;if((W?y.code===`Key${L.toUpperCase()}`:y.key.toLowerCase()===L.toLowerCase())&&z){const se=y.target;if(!se.closest("[data-agent-command-palette-input]")&&(se.tagName==="INPUT"||se.tagName==="TEXTAREA"||se.isContentEditable))return;y.preventDefault(),X()}},[e,X]);i.useEffect(()=>(window.addEventListener("keydown",oe),()=>window.removeEventListener("keydown",oe)),[oe]);const _e=i.useCallback(()=>{Q&&T(y=>y<N-1?y+1:0)},[Q,N]),Me=i.useCallback(()=>{Q&&T(y=>y>0?y-1:N-1)},[Q,N]),De=i.useCallback((y=!1)=>{var F;if(!Q||E<0)return;if(C.isEnteringArgs){const K=q[E];if(!K)return;let z=`/${C.commandName}`;for(const Ce of C.enteredArgs)z+=` ${Ce}`;z+=` ${K.option}`;const G=C.currentArgIndex+1;((F=C.command)==null?void 0:F.args)&&G<C.command.args.length?(z+=" ",b(z),T(-1)):(b(z),T(-1),y&&setTimeout(()=>V(z),0));return}const L=A[E];if(!L)return;const W=L.command;let J=`/${W.name}`;W.args&&W.args.length>0?(J+=" ",b(J),T(-1)):(b(J),T(-1),y&&setTimeout(()=>V(J),0))},[Q,E,C,q,A,V]);return{agentAvailable:c,isOpen:n,open:B,close:R,toggle:X,query:d,setQuery:Y,mode:p,status:v,setStatus:g,pendingTools:u,completedTools:x,agentResponse:M,setAgentResponse:P,submit:Z,executeQuickCommand:V,addPendingTool:H,updateToolStatus:D,history:I,historyPrevious:ae,historyNext:Se,suggestions:j,clear:O,quickCommandMatches:A,argumentOptionMatches:q,parsedQuery:C,currentArgDef:te,selectedAutocompleteIndex:E,autocompleteItemCount:N,autocompleteNext:_e,autocompletePrevious:Me,autocompleteAccept:De,showAutocomplete:Q}}const fe={name:"get_visible_panels",description:"Get the current visibility state of all panel slots (left, middle, right). Returns which panels are active in each slot and whether side panels are collapsed.",inputs:{type:"object",properties:{},required:[]},outputs:{type:"object",properties:{left:{type:"object",properties:{panelId:{type:"string",description:"The ID of the panel in the left slot"},collapsed:{type:"boolean",description:"Whether the left panel is collapsed"},size:{type:"number",description:"Width percentage of the left panel"}}},middle:{type:"object",properties:{panelId:{type:"string",description:"The ID of the panel in the middle slot"},size:{type:"number",description:"Width percentage of the middle panel"}}},right:{type:"object",properties:{panelId:{type:"string",description:"The ID of the panel in the right slot"},collapsed:{type:"boolean",description:"Whether the right panel is collapsed"},size:{type:"number",description:"Width percentage of the right panel"}}},workspaceId:{type:"string",description:"The ID of the currently active workspace layout"}}},tags:["panel","layout","visibility","state","query"],tool_call_template:{call_template_type:"panel_event",event_type:"panel:get-visibility"}},ge={name:"get_panel_state",description:"Get the current state of a specific panel. Returns panel-specific state data if the panel supports state queries.",inputs:{type:"object",properties:{panelId:{type:"string",description:'The ID of the panel to query state from (e.g., "file-tree", "terminal")'}},required:["panelId"]},outputs:{type:"object",properties:{panelId:{type:"string",description:"The queried panel ID"},hasState:{type:"boolean",description:"Whether the panel supports state queries"},state:{type:"object",description:"The panel state (shape depends on the panel)"}}},tags:["panel","state","query"],tool_call_template:{call_template_type:"panel_event",event_type:"panel:get-state"}},me={name:"list_panels_with_state",description:"Get a list of all panels that support state queries. Use this to discover which panels can be queried with get_panel_state.",inputs:{type:"object",properties:{},required:[]},outputs:{type:"object",properties:{panels:{type:"array",items:{type:"object",properties:{panelId:{type:"string",description:"The panel ID"},name:{type:"string",description:"The panel display name"},description:{type:"string",description:"Description of the state this panel provides"}}},description:"List of panels that support state queries"}}},tags:["panel","state","query","discovery"],tool_call_template:{call_template_type:"panel_event",event_type:"panel:list-state-panels"}},he={name:"toggle_panel",description:"Collapse or expand a side panel to give more space to the main content area.",inputs:{type:"object",properties:{panel:{type:"string",enum:["left","right"],description:'Which panel to toggle: "left" or "right"'}},required:["panel"]},outputs:{type:"object",properties:{success:{type:"boolean"},panel:{type:"string"},action:{type:"string"}}},tags:["panel","layout","toggle","collapse","expand","sidebar"],tool_call_template:{call_template_type:"panel_event",event_type:"panel:toggle"}},ye={name:"collapse_all_panels",description:"Collapse both left and right panels to maximize the main content area. Useful for focus mode.",inputs:{type:"object",properties:{},required:[]},outputs:{type:"object",properties:{success:{type:"boolean"},action:{type:"string"}}},tags:["panel","layout","collapse","focus","maximize"],tool_call_template:{call_template_type:"panel_event",event_type:"panel:collapse-all"}},xe={name:"expand_all_panels",description:"Expand both left and right panels to show all content. Restores the default layout.",inputs:{type:"object",properties:{},required:[]},outputs:{type:"object",properties:{success:{type:"boolean"},action:{type:"string"}}},tags:["panel","layout","expand","restore","show"],tool_call_template:{call_template_type:"panel_event",event_type:"panel:expand-all"}},be={name:"switch_panel",description:"Change which content is displayed in a panel slot (left, middle, or right).",inputs:{type:"object",properties:{slot:{type:"string",enum:["left","middle","right"],description:'Which slot to change: "left", "middle", or "right"'},panel:{type:"string",description:"The panel ID to display in the slot"}},required:["slot","panel"]},outputs:{type:"object",properties:{success:{type:"boolean"},slot:{type:"string"},panel:{type:"string"}}},tags:["panel","layout","switch","navigation","view"],tool_call_template:{call_template_type:"panel_event",event_type:"panel:switch"}},ke={name:"focus_panel",description:"Set focus to a specific panel slot for keyboard navigation.",inputs:{type:"object",properties:{slot:{type:"string",enum:["left","middle","right"],description:'Which slot to focus: "left", "middle", or "right"'}},required:["slot"]},outputs:{type:"object",properties:{success:{type:"boolean"},slot:{type:"string"}}},tags:["panel","focus","navigation","keyboard"],tool_call_template:{call_template_type:"panel_event",event_type:"panel:focus"}},we={name:"reset_layout",description:"Reset panel sizes to the default layout configuration.",inputs:{type:"object",properties:{},required:[]},outputs:{type:"object",properties:{success:{type:"boolean"},action:{type:"string"}}},tags:["panel","layout","reset","default","restore"],tool_call_template:{call_template_type:"panel_event",event_type:"panel:reset-layout"}},$e=[fe,ge,me,he,ye,xe,be,ke,we],ot=[fe,ge,me],st=[he,ye,xe,be,ke,we],rt={id:"panel-layouts",name:"Panel Layouts",description:"Generic panel layout and state query operations",tools:$e};function Ee(o){const e={};if(o.inputs.properties)for(const[t,r]of Object.entries(o.inputs.properties)){const a=r;e[t]={type:a.type||"string",description:a.description,...a.enum&&{enum:a.enum}}}return{name:o.name,description:o.description,parameters:{type:"object",properties:e,required:o.inputs.required||[]}}}function nt(o){return{functionDeclarations:o.map(Ee)}}function Le(o){return{type:"function",function:{name:o.name,description:o.description,parameters:o.inputs}}}function at(o){return o.map(Le)}function ze(o){return{name:o.name,description:o.description,input_schema:o.inputs}}function it(o){return o.map(ze)}function Re(o){return{name:o.name,description:o.description,parameters:o.inputs}}function lt(o){return o.map(Re)}function ct(o,e={}){const{header:t="You have access to the following tools:",includeParameters:r=!0}=e,a=o.map(c=>{let l=`- ${c.name}: ${c.description}`;if(r&&c.inputs.properties){const n=Object.entries(c.inputs.properties).map(([m,d])=>{var h;const b=d,p=(h=c.inputs.required)!=null&&h.includes(m)?" (required)":"";return` - ${m}: ${b.description||b.type}${p}`}).join(`
|
|
77
77
|
`);n&&(l+=`
|
|
78
78
|
${n}`)}return l});return`${t}
|
|
79
79
|
|
|
80
80
|
${a.join(`
|
|
81
81
|
|
|
82
|
-
`)}`}const dt=({size:o=18})=>s.jsxs("svg",{width:o,height:o,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[s.jsx("rect",{width:"18",height:"18",x:"3",y:"3",rx:"2"}),s.jsx("path",{d:"M9 3v18"})]}),ut=({size:o=18})=>s.jsxs("svg",{width:o,height:o,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[s.jsx("rect",{width:"18",height:"18",x:"3",y:"3",rx:"2"}),s.jsx("path",{d:"M9 3v18"}),s.jsx("path",{d:"m16 15-3-3 3-3"})]}),pt=({size:o=18})=>s.jsxs("svg",{width:o,height:o,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[s.jsx("rect",{width:"18",height:"18",x:"3",y:"3",rx:"2"}),s.jsx("path",{d:"M15 3v18"})]}),ft=({size:o=18})=>s.jsxs("svg",{width:o,height:o,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[s.jsx("rect",{width:"18",height:"18",x:"3",y:"3",rx:"2"}),s.jsx("path",{d:"M15 3v18"}),s.jsx("path",{d:"m8 9 3 3-3 3"})]}),ie=({isCollapsed:o,onToggle:e,side:t="left",iconSize:r=18,style:a,shortcutHint:c="Cmd/Ctrl+B",title:l,className:n})=>{const{theme:m}=U.useTheme(),d=()=>t==="right"?o?s.jsx(pt,{size:r}):s.jsx(ft,{size:r}):o?s.jsx(dt,{size:r}):s.jsx(ut,{size:r}),b=()=>`${o?"Show":"Hide"} ${t==="right"?"Right Panel":"Sidebar"}${c?` (${c})`:""}`;return s.jsx("button",{onClick:e,title:l??b(),className:n,style:{background:"transparent",border:"none",color:o?m.colors.textSecondary:m.colors.primary,cursor:"pointer",padding:"6px",borderRadius:"4px",display:"flex",alignItems:"center",justifyContent:"center",transition:"all 0.2s",width:"32px",height:"32px",...a},onMouseEnter:p=>{p.currentTarget.style.backgroundColor=m.colors.backgroundTertiary,p.currentTarget.style.color=m.colors.primary},onMouseLeave:p=>{p.currentTarget.style.backgroundColor="transparent",p.currentTarget.style.color=o?m.colors.textSecondary:m.colors.primary},children:d()})},gt=({size:o=14})=>s.jsxs("svg",{width:o,height:o,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[s.jsx("path",{d:"M8 3 4 7l4 4"}),s.jsx("path",{d:"M4 7h16"}),s.jsx("path",{d:"m16 21 4-4-4-4"}),s.jsx("path",{d:"M20 17H4"})]}),mt=({size:o=14})=>s.jsxs("svg",{width:o,height:o,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[s.jsx("path",{d:"m16 3 4 4-4 4"}),s.jsx("path",{d:"M20 7H4"}),s.jsx("path",{d:"m8 21-4-4 4-4"}),s.jsx("path",{d:"M4 17h16"})]}),le=({onSwitch:o,variant:e="left-middle",iconSize:t=14,style:r,title:a,className:c})=>{const{theme:l}=U.useTheme(),n=()=>e==="left-middle"?"Switch left and middle panels":"Switch right and middle panels",m=e==="left-middle"?gt:mt;return s.jsx("button",{onClick:o,title:a??n(),className:c,style:{background:"transparent",border:"none",color:l.colors.textSecondary,cursor:"pointer",padding:"6px",borderRadius:"4px",display:"flex",alignItems:"center",justifyContent:"center",transition:"all 0.2s",width:"32px",height:"32px",...r},onMouseEnter:d=>{d.currentTarget.style.backgroundColor=l.colors.backgroundTertiary,d.currentTarget.style.color=l.colors.text},onMouseLeave:d=>{d.currentTarget.style.backgroundColor="transparent",d.currentTarget.style.color=l.colors.textSecondary},children:s.jsx(m,{size:t})})},ht=({size:o=14})=>s.jsxs("svg",{width:o,height:o,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[s.jsx("rect",{width:"18",height:"18",x:"3",y:"3",rx:"2"}),s.jsx("path",{d:"M3 9h18"}),s.jsx("path",{d:"M9 21V9"})]}),We=({onConfigure:o,iconSize:e=14,style:t,title:r="Configure panel layout",className:a})=>{const{theme:c}=U.useTheme();return s.jsx("button",{onClick:o,title:r,className:a,style:{background:"transparent",border:"none",color:c.colors.textSecondary,cursor:"pointer",padding:"6px",borderRadius:"4px",display:"flex",alignItems:"center",justifyContent:"center",transition:"all 0.2s",width:"32px",height:"32px",...t},onMouseEnter:l=>{l.currentTarget.style.backgroundColor=c.colors.backgroundTertiary,l.currentTarget.style.color=c.colors.text},onMouseLeave:l=>{l.currentTarget.style.backgroundColor="transparent",l.currentTarget.style.color=c.colors.textSecondary},children:s.jsx(ht,{size:e})})},yt=({leftSidebarCollapsed:o=!1,onToggleLeftSidebar:e,showLeftSidebarControl:t=!1,rightSidebarCollapsed:r=!1,onToggleRightSidebar:a,showRightSidebarControl:c=!1,onSwitchLeftMiddlePanels:l,showSwitchLeftMiddle:n=!1,onSwitchRightMiddlePanels:m,showSwitchRightMiddle:d=!1,onConfigurePanels:b,showConfigureButton:p=!1,gap:h=4,style:v,className:g,iconSize:u,leftCollapseButtonProps:f,rightCollapseButtonProps:x,leftMiddleSwitchButtonProps:$,rightMiddleSwitchButtonProps:M,configureButtonProps:
|
|
82
|
+
`)}`}const dt=({size:o=18})=>s.jsxs("svg",{width:o,height:o,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[s.jsx("rect",{width:"18",height:"18",x:"3",y:"3",rx:"2"}),s.jsx("path",{d:"M9 3v18"})]}),ut=({size:o=18})=>s.jsxs("svg",{width:o,height:o,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[s.jsx("rect",{width:"18",height:"18",x:"3",y:"3",rx:"2"}),s.jsx("path",{d:"M9 3v18"}),s.jsx("path",{d:"m16 15-3-3 3-3"})]}),pt=({size:o=18})=>s.jsxs("svg",{width:o,height:o,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[s.jsx("rect",{width:"18",height:"18",x:"3",y:"3",rx:"2"}),s.jsx("path",{d:"M15 3v18"})]}),ft=({size:o=18})=>s.jsxs("svg",{width:o,height:o,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[s.jsx("rect",{width:"18",height:"18",x:"3",y:"3",rx:"2"}),s.jsx("path",{d:"M15 3v18"}),s.jsx("path",{d:"m8 9 3 3-3 3"})]}),ie=({isCollapsed:o,onToggle:e,side:t="left",iconSize:r=18,style:a,shortcutHint:c="Cmd/Ctrl+B",title:l,className:n})=>{const{theme:m}=U.useTheme(),d=()=>t==="right"?o?s.jsx(pt,{size:r}):s.jsx(ft,{size:r}):o?s.jsx(dt,{size:r}):s.jsx(ut,{size:r}),b=()=>`${o?"Show":"Hide"} ${t==="right"?"Right Panel":"Sidebar"}${c?` (${c})`:""}`;return s.jsx("button",{onClick:e,title:l??b(),className:n,style:{background:"transparent",border:"none",color:o?m.colors.textSecondary:m.colors.primary,cursor:"pointer",padding:"6px",borderRadius:"4px",display:"flex",alignItems:"center",justifyContent:"center",transition:"all 0.2s",width:"32px",height:"32px",...a},onMouseEnter:p=>{p.currentTarget.style.backgroundColor=m.colors.backgroundTertiary,p.currentTarget.style.color=m.colors.primary},onMouseLeave:p=>{p.currentTarget.style.backgroundColor="transparent",p.currentTarget.style.color=o?m.colors.textSecondary:m.colors.primary},children:d()})},gt=({size:o=14})=>s.jsxs("svg",{width:o,height:o,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[s.jsx("path",{d:"M8 3 4 7l4 4"}),s.jsx("path",{d:"M4 7h16"}),s.jsx("path",{d:"m16 21 4-4-4-4"}),s.jsx("path",{d:"M20 17H4"})]}),mt=({size:o=14})=>s.jsxs("svg",{width:o,height:o,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[s.jsx("path",{d:"m16 3 4 4-4 4"}),s.jsx("path",{d:"M20 7H4"}),s.jsx("path",{d:"m8 21-4-4 4-4"}),s.jsx("path",{d:"M4 17h16"})]}),le=({onSwitch:o,variant:e="left-middle",iconSize:t=14,style:r,title:a,className:c})=>{const{theme:l}=U.useTheme(),n=()=>e==="left-middle"?"Switch left and middle panels":"Switch right and middle panels",m=e==="left-middle"?gt:mt;return s.jsx("button",{onClick:o,title:a??n(),className:c,style:{background:"transparent",border:"none",color:l.colors.textSecondary,cursor:"pointer",padding:"6px",borderRadius:"4px",display:"flex",alignItems:"center",justifyContent:"center",transition:"all 0.2s",width:"32px",height:"32px",...r},onMouseEnter:d=>{d.currentTarget.style.backgroundColor=l.colors.backgroundTertiary,d.currentTarget.style.color=l.colors.text},onMouseLeave:d=>{d.currentTarget.style.backgroundColor="transparent",d.currentTarget.style.color=l.colors.textSecondary},children:s.jsx(m,{size:t})})},ht=({size:o=14})=>s.jsxs("svg",{width:o,height:o,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[s.jsx("rect",{width:"18",height:"18",x:"3",y:"3",rx:"2"}),s.jsx("path",{d:"M3 9h18"}),s.jsx("path",{d:"M9 21V9"})]}),We=({onConfigure:o,iconSize:e=14,style:t,title:r="Configure panel layout",className:a})=>{const{theme:c}=U.useTheme();return s.jsx("button",{onClick:o,title:r,className:a,style:{background:"transparent",border:"none",color:c.colors.textSecondary,cursor:"pointer",padding:"6px",borderRadius:"4px",display:"flex",alignItems:"center",justifyContent:"center",transition:"all 0.2s",width:"32px",height:"32px",...t},onMouseEnter:l=>{l.currentTarget.style.backgroundColor=c.colors.backgroundTertiary,l.currentTarget.style.color=c.colors.text},onMouseLeave:l=>{l.currentTarget.style.backgroundColor="transparent",l.currentTarget.style.color=c.colors.textSecondary},children:s.jsx(ht,{size:e})})},yt=({leftSidebarCollapsed:o=!1,onToggleLeftSidebar:e,showLeftSidebarControl:t=!1,rightSidebarCollapsed:r=!1,onToggleRightSidebar:a,showRightSidebarControl:c=!1,onSwitchLeftMiddlePanels:l,showSwitchLeftMiddle:n=!1,onSwitchRightMiddlePanels:m,showSwitchRightMiddle:d=!1,onConfigurePanels:b,showConfigureButton:p=!1,gap:h=4,style:v,className:g,iconSize:u,leftCollapseButtonProps:f,rightCollapseButtonProps:x,leftMiddleSwitchButtonProps:$,rightMiddleSwitchButtonProps:M,configureButtonProps:P})=>t&&e||n&&l||p&&b||d&&m||c&&a?s.jsxs("div",{className:g,style:{display:"flex",alignItems:"center",gap:`${h}px`,...v},children:[t&&e&&s.jsx(ie,{isCollapsed:o,onToggle:e,side:"left",iconSize:u??18,...f}),n&&l&&s.jsx(le,{onSwitch:l,variant:"left-middle",iconSize:u??14,...$}),p&&b&&s.jsx(We,{onConfigure:b,iconSize:u??14,...P}),d&&m&&s.jsx(le,{onSwitch:m,variant:"right-middle",iconSize:u??14,...M}),c&&a&&s.jsx(ie,{isCollapsed:r,onToggle:a,side:"right",iconSize:u??18,...x})]}):null;Object.defineProperty(exports,"EditableConfigurablePanelLayout",{enumerable:!0,get:()=>ee.EditableConfigurablePanelLayout});Object.defineProperty(exports,"PanelBoundsProvider",{enumerable:!0,get:()=>ee.PanelBoundsProvider});Object.defineProperty(exports,"ResponsiveConfigurablePanelLayout",{enumerable:!0,get:()=>ee.ResponsiveConfigurablePanelLayout});Object.defineProperty(exports,"mapThemeToPanelVars",{enumerable:!0,get:()=>ee.mapThemeToPanelVars});Object.defineProperty(exports,"mapThemeToTabVars",{enumerable:!0,get:()=>ee.mapThemeToTabVars});Object.defineProperty(exports,"usePanelBounds",{enumerable:!0,get:()=>ee.usePanelBounds});Object.defineProperty(exports,"usePanelOffset",{enumerable:!0,get:()=>ee.usePanelOffset});exports.AgentCommandInput=ce;exports.AgentCommandPalette=Pe;exports.AgentResponseDisplay=ue;exports.FocusIndicator=He;exports.FocusModeOverlay=Je;exports.LocalStoragePersistenceAdapter=Te;exports.LocalStorageWorkspaceAdapter=Ie;exports.PanelCollapseButton=ie;exports.PanelConfigureButton=We;exports.PanelControls=yt;exports.PanelSwitchButton=le;exports.QuickCommandAutocomplete=pe;exports.ToolExecutionList=de;exports.WorkspaceLayoutService=_;exports.collapseAllPanelsTool=ye;exports.expandAllPanelsTool=xe;exports.focusPanelTool=ke;exports.fuzzyMatch=ne;exports.generateToolsSystemPrompt=ct;exports.getPanelStateTool=ge;exports.getVisiblePanelsTool=fe;exports.layoutActionTools=st;exports.layoutTools=$e;exports.layoutToolsMetadata=rt;exports.listPanelsWithStateTool=me;exports.resetLayoutTool=we;exports.searchQuickCommands=Ae;exports.stateQueryTools=ot;exports.switchPanelTool=be;exports.togglePanelTool=he;exports.toolToAIFunction=Re;exports.toolToAnthropicFormat=ze;exports.toolToGeminiFunction=Ee;exports.toolToOpenAIFunction=Le;exports.toolsToAIFunctions=lt;exports.toolsToAnthropicFormat=it;exports.toolsToGeminiFormat=nt;exports.toolsToOpenAIFormat=at;exports.useAgentCommandPalette=tt;exports.usePanelFocus=Be;exports.usePanelFocusListener=Ke;exports.usePanelKeyboardShortcuts=Ve;exports.usePanelPersistence=qe;exports.useWorkspace=Ne;
|
|
83
83
|
//# sourceMappingURL=index.js.map
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@principal-ade/panel-layouts",
|
|
3
|
-
"version": "0.4.
|
|
3
|
+
"version": "0.4.2",
|
|
4
4
|
"description": "Pre-built panel layout components and workspace management for the Panel Framework",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"module": "dist/index.esm.js",
|
|
@@ -11,8 +11,7 @@
|
|
|
11
11
|
"require": "./dist/index.js",
|
|
12
12
|
"types": "./dist/index.d.ts"
|
|
13
13
|
},
|
|
14
|
-
"./index.css": "./dist/index.css"
|
|
15
|
-
"./styles.css": "./dist/styles.css"
|
|
14
|
+
"./index.css": "./dist/index.css"
|
|
16
15
|
},
|
|
17
16
|
"files": [
|
|
18
17
|
"dist",
|
|
@@ -20,8 +19,7 @@
|
|
|
20
19
|
"LICENSE"
|
|
21
20
|
],
|
|
22
21
|
"sideEffects": [
|
|
23
|
-
"dist/index.css"
|
|
24
|
-
"dist/styles.css"
|
|
22
|
+
"dist/index.css"
|
|
25
23
|
],
|
|
26
24
|
"scripts": {
|
|
27
25
|
"dev": "vite",
|
|
@@ -55,16 +53,17 @@
|
|
|
55
53
|
"access": "public"
|
|
56
54
|
},
|
|
57
55
|
"peerDependencies": {
|
|
56
|
+
"@principal-ade/industry-theme": "^0.1.7",
|
|
58
57
|
"@principal-ade/panel-framework-core": "^0.5.1",
|
|
58
|
+
"@principal-ade/panels": "^1.0.58",
|
|
59
59
|
"react": ">=19.0.0",
|
|
60
|
-
"react-dom": ">=19.0.0"
|
|
61
|
-
|
|
62
|
-
"dependencies": {
|
|
63
|
-
"@principal-ade/industry-theme": "^0.1.7",
|
|
64
|
-
"@principal-ade/panels": "^1.0.52",
|
|
65
|
-
"react-resizable-panels": "^3.0.0"
|
|
60
|
+
"react-dom": ">=19.0.0",
|
|
61
|
+
"react-resizable-panels": "^4.7.4"
|
|
66
62
|
},
|
|
67
63
|
"devDependencies": {
|
|
64
|
+
"@principal-ade/industry-theme": "^0.1.7",
|
|
65
|
+
"@principal-ade/panels": "^1.0.58",
|
|
66
|
+
"react-resizable-panels": "^4.7.4",
|
|
68
67
|
"@eslint/js": "^9.39.0",
|
|
69
68
|
"@storybook/addon-docs": "^10.0.2",
|
|
70
69
|
"@storybook/react-vite": "^10.0.2",
|
package/dist/index.css
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
.animated-resizable-layout{width:100%;height:100%;position:relative;background-color:var(--panel-background)}.hybrid-panel{overflow:auto;height:100%;background-color:var(--panel-background)}.resize-handle{width:8px;background-color:var(--panel-handle);display:flex;justify-content:center;align-items:center;cursor:col-resize;position:relative;transition:background-color .2s,opacity .3s,width .3s}.resize-handle.collapsed{opacity:0;pointer-events:none}.resize-handle:hover{background-color:var(--panel-handle-hover)}.resize-handle:active{background-color:var(--panel-handle-active)}.handle-bar{height:100%;width:100%;display:flex;align-items:center;justify-content:center;position:relative}.collapse-toggle{position:absolute;background:var(--panel-button-bg);border:1px solid var(--panel-button-border);padding:4px 8px;cursor:pointer;color:var(--panel-button-icon);font-size:14px;outline:none;display:flex;align-items:center;justify-content:center;border-radius:4px;z-index:10;transition:all .2s;box-shadow:0 2px 4px #0000001a}.animated-vertical-layout{width:100%;height:100%;position:relative;background-color:var(--panel-background)}.vertical-panel{overflow:auto;width:100%;background-color:var(--panel-background)}.panel-content-wrapper{width:100%;height:100%;overflow:auto}.vertical-resize-handle{height:8px;background-color:var(--panel-handle);display:flex;justify-content:center;align-items:center;cursor:row-resize;position:relative;transition:background-color .2s,opacity .3s,height .3s}.vertical-resize-handle.collapsed{opacity:0;pointer-events:none}.vertical-resize-handle:hover{background-color:var(--panel-handle-hover)}.vertical-resize-handle:active{background-color:var(--panel-handle-active)}.handle-bar{width:100%;height:100%;display:flex;align-items:center;justify-content:center;gap:8px;position:relative}.collapse-toggle{background:var(--panel-button-bg);border:1px solid var(--panel-button-border);padding:4px 8px;cursor:pointer;color:var(--panel-button-icon);font-size:14px;outline:none;display:flex;align-items:center;justify-content:center;border-radius:4px;z-index:10;transition:all .2s;box-shadow:0 2px 4px #0000001a}.collapse-toggle:hover:not(:disabled){background-color:var(--panel-button-hover);box-shadow:0 2px 6px #00000026}.collapse-toggle:active:not(:disabled){opacity:.8}.tab-group{display:flex;height:100%;width:100%;overflow:hidden}.tab-group.tab-position-top,.tab-group.tab-position-bottom{flex-direction:column}.tab-group.tab-position-left,.tab-group.tab-position-right{flex-direction:row}.tab-list{display:flex;background:var(--tab-list-bg, #f5f5f5);border-bottom:1px solid var(--tab-border, #ddd);gap:0;padding:0;flex-shrink:0;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-ms-overflow-style:none}.tab-list::-webkit-scrollbar{display:none}.tab-position-top .tab-list,.tab-position-bottom .tab-list{width:100%}.tab-list.centered{justify-content:flex-start}@media (min-width: 0){.tab-list.centered{justify-content:center}.tab-list.centered:has(.tab-button:nth-child(n)){justify-content:flex-start}}.tab-position-bottom .tab-list{border-bottom:none;border-top:none}.tab-position-left .tab-list,.tab-position-right .tab-list{flex-direction:column;border-bottom:none;border-right:none;width:auto;min-width:120px}.tab-position-top .tab-button,.tab-position-bottom .tab-button{flex:1 1 0;min-width:40px;max-width:100%}.tab-button{background:var(--tab-bg, #fff);border:1px solid var(--tab-border, #ddd);border-radius:0;padding:8px 16px;cursor:pointer;font-family:var(--tab-font-family, inherit);font-size:var(--tab-font-size, 14px);font-weight:var(--tab-font-weight, 500);color:var(--tab-text, #333);transition:all .2s ease;white-space:nowrap;display:flex;align-items:center;justify-content:center;gap:6px;height:39px;line-height:1;box-sizing:border-box;container-type:inline-size}.tab-position-top .tab-button{border-bottom:none;border-top:none;border-left:none}.tab-position-top .tab-button:last-child{border-right:none}.tab-position-bottom .tab-button{border-top:none;border-bottom:none;border-left:none}.tab-position-bottom .tab-button:last-child{border-right:none}.tab-position-left .tab-button{border-right:none;border-bottom:none}.tab-position-left .tab-button:last-child{border-bottom:1px solid var(--tab-border, #ddd)}.tab-position-right .tab-button{border-left:none;border-bottom:none}.tab-position-right .tab-button:last-child{border-bottom:1px solid var(--tab-border, #ddd)}.tab-icon{display:inline-flex;align-items:center;justify-content:center}.tab-label{display:none}@container (min-width: 100px){.tab-label{display:inline}.tab-icon{display:none}}.tab-button:hover{background:var(--tab-bg-hover, #f9f9f9)}.tab-button.active{background:var(--tab-bg-active, #007bff);color:var(--tab-text-active, #fff);border-color:var(--tab-border-active, #007bff)}.tab-button:focus-visible{outline:2px solid var(--tab-focus, #007bff);outline-offset:2px}.tab-content{flex:1;overflow:auto;background:var(--tab-content-bg, #fff)}.tab-group-empty{display:flex;align-items:center;justify-content:center;height:100%;color:var(--tab-empty-text, #999);font-style:italic}.three-panel-layout{height:100%;width:100%;display:flex;flex-direction:column;position:relative;background-color:var(--panel-background);box-sizing:border-box}.three-panel-item{display:flex;flex-direction:column;overflow:hidden;position:relative;background-color:var(--panel-background);box-sizing:border-box}.three-panel-item[data-edit-mode=true]{background-color:var(--panel-accent-bg);border-radius:12px}.three-panel-item.collapsible-panel{will-change:flex}.three-panel-item.collapsible-panel.animating{pointer-events:none}.three-panel-item.collapsible-panel.collapsed{flex:0!important;min-width:0!important;max-width:0!important;width:0!important;overflow:hidden!important;visibility:hidden}.three-panel-item.middle-panel{flex:1;min-width:200px}.panel-content-wrapper{flex:1;overflow-x:hidden;overflow-y:auto;will-change:opacity;box-sizing:border-box}.resize-handle{position:relative;display:flex;align-items:center;justify-content:center;width:1px!important;cursor:col-resize;background:var(--panel-border);overflow:visible!important}.resize-handle:before{content:"";position:absolute;top:0;right:-10px;bottom:0;left:-10px;background:transparent}.resize-handle:after{content:"";position:absolute;top:0;right:-10px;bottom:0;left:-10px;background:var(--panel-handle);opacity:0;transition:opacity .2s ease;z-index:-1}.resize-handle:hover:after{opacity:1}.resize-handle:hover{background:var(--panel-handle-hover)}.resize-handle:active:after{opacity:1;background:var(--panel-handle-active)}.resize-handle:active{background:var(--panel-handle-active)}.resize-handle.collapsed{width:0!important;visibility:hidden}.resize-handle.left-handle.collapsed{margin-right:-1px}.resize-handle.right-handle.collapsed{margin-left:-1px}.handle-bar{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center;z-index:2}.collapse-toggle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:20px;height:40px;background:var(--panel-button-bg);border:1px solid var(--panel-button-border);border-radius:4px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:12px;color:var(--panel-button-icon);transition:all .2s ease;z-index:10;padding:0;line-height:1}.collapse-toggle:hover{background:var(--panel-button-hover)}.collapse-toggle:active{opacity:.8}.collapse-toggle:disabled{opacity:.5;cursor:not-allowed}@media (max-width: 768px){.resize-handle:before{left:-8px;right:-8px}.resize-handle:after{left:-8px;right:-8px}.collapse-toggle{width:24px;height:48px;font-size:14px}}.snap-carousel-container{display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-behavior:smooth;gap:var(--snap-carousel-gap, 0px);padding:0;margin:0;width:100%;height:100%;background-color:var(--panel-background);box-sizing:border-box;position:relative;left:0;transform:none;container-type:inline-size;-ms-overflow-style:none;scrollbar-width:none}.snap-carousel-container::-webkit-scrollbar{display:none}.snap-carousel-container.swipe-disabled{touch-action:pan-y pinch-zoom;overscroll-behavior-x:none}.snap-carousel-panel{flex:0 0 auto;scroll-snap-align:start;scroll-snap-stop:always;width:var(--snap-carousel-panel-width, 33.33%);height:100%;box-sizing:border-box;overflow:hidden}@media (max-width: 540px){.snap-carousel-panel{min-width:280px}}.mobile-tab-layout{display:flex;flex-direction:column;height:100%;width:100%;overflow:hidden}.mobile-tab-content{flex:1;overflow:hidden;min-height:0}.mobile-tab-nav{display:flex;background:var(--tab-list-bg, #f5f5f5);border-top:1px solid var(--tab-border, #ddd);flex-shrink:0;padding:0;margin:0}.mobile-tab-button{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;background:transparent;border:none;padding:14px 4px;padding-bottom:calc(14px + min(12px,env(safe-area-inset-bottom,0px)));cursor:pointer;font-family:var(--tab-font-family, inherit);font-size:var(--tab-font-size, 11px);font-weight:var(--tab-font-weight, 500);color:var(--tab-text, #666);transition:color .2s ease;min-width:0}.mobile-tab-button:hover{color:var(--tab-text-hover, #333)}.mobile-tab-button.active{color:var(--mobile-tab-text-active, #007bff)}.mobile-tab-button .tab-icon{display:flex;align-items:center;justify-content:center;font-size:24px;color:var(--tab-icon-color, #999);transition:color .2s ease}.mobile-tab-button.active .tab-icon{color:var(--mobile-tab-icon-active, #007bff)}.mobile-tab-button .tab-label{display:block;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;line-height:1.2;color:inherit;opacity:1}.mobile-tab-button:focus-visible{outline:2px solid var(--tab-focus, #007bff);outline-offset:-2px;z-index:1}@keyframes wiggle{0%{transform:rotate(0)}25%{transform:rotate(1deg)}50%{transform:rotate(0)}75%{transform:rotate(-1deg)}to{transform:rotate(0)}}@keyframes scaleIn{0%{transform:scale(.95);opacity:0}to{transform:scale(1);opacity:1}}@keyframes pulse{0%,to{box-shadow:0 0 #3b82f666}50%{box-shadow:0 0 0 8px #3b82f600}}.editable-panel-layout{position:relative;width:100%;height:100%}.editable-panel-layout.edit-mode-active{background:#0000000d}[data-slot][data-edit-mode=true]{transform:scale(.95);transform-origin:center center;cursor:grab;will-change:transform;transition:transform .3s cubic-bezier(.4,0,.2,1)}[data-slot][data-edit-mode=true]:active{cursor:grabbing}[data-slot][data-dragging=true]{cursor:grabbing!important;transform:scale(.95)!important;transition:none!important}.edit-mode-active [data-slot][data-edit-mode=true]{transform-origin:center center}.slot-with-overlay{position:relative;width:100%;height:100%}.slot-with-overlay.dragging{opacity:0;pointer-events:none}.slot-edit-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:transparent;border:none;pointer-events:auto;cursor:grab;z-index:100;display:flex;flex-direction:column;align-items:center;justify-content:center}.slot-edit-overlay:hover{background:#3b82f608}.slot-edit-overlay:active{cursor:grabbing}.drag-indicator,.slot-position-label{display:none}.edit-mode-toggle{position:absolute;top:16px;right:16px;z-index:1000;padding:8px 16px;border-radius:8px;border:1px solid #e5e7eb;background:#fff;color:#374151;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease;box-shadow:0 2px 4px #0000001a}.edit-mode-toggle:hover{background:#f9fafb;box-shadow:0 4px 6px #0000001a}.edit-mode-toggle.active{background:#3b82f6;color:#fff;border-color:#2563eb}.edit-mode-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0000004d;z-index:998;animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.edit-mode-configurator{position:relative;z-index:999;padding:20px;animation:scaleIn .3s ease}.panel-slot{position:relative;min-height:120px;border:2px dashed transparent;border-radius:12px;transition:all .3s ease;padding:12px}.panel-slot.edit-mode{border-color:#d1d5db;background:#ffffff80}.panel-slot.drag-over{border-color:#3b82f6;background:#3b82f61a;box-shadow:0 0 0 4px #3b82f61a}.panel-slot.empty{display:flex;align-items:center;justify-content:center;color:#9ca3af;font-size:14px}.draggable-panel{position:relative;padding:12px 16px;margin:8px 0;border-radius:8px;background:#fff;border:1px solid #e5e7eb;cursor:grab;transition:all .2s ease;-webkit-user-select:none;user-select:none}.draggable-panel:hover{border-color:#3b82f6;box-shadow:0 2px 8px #0000001a}.draggable-panel.dragging{opacity:.5;cursor:grabbing}.draggable-panel.edit-mode{animation:wiggle .4s ease-in-out infinite;transform-origin:center}.draggable-panel.edit-mode:nth-child(odd){animation-delay:.1s}.draggable-panel.edit-mode:nth-child(2n){animation-delay:.2s}.remove-button{position:absolute;top:-6px;right:-6px;width:20px;height:20px;border-radius:50%;background:#ef4444;color:#fff;border:2px solid white;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:12px;font-weight:700;opacity:0;transform:scale(0);transition:all .2s ease;z-index:10;box-shadow:0 2px 4px #0003}.draggable-panel.edit-mode .remove-button{opacity:1;transform:scale(1);animation:pulse 2s infinite}.remove-button:hover{background:#dc2626;transform:scale(1.1)}.panel-label{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:500;color:#374151}.panel-icon{width:20px;height:20px;display:flex;align-items:center;justify-content:center}.drag-handle{display:none;width:24px;height:24px;opacity:.4;cursor:grab}.edit-mode .drag-handle{display:flex;align-items:center;justify-content:center}.drag-overlay{padding:12px 16px;border-radius:8px;background:#fff;border:2px solid #3b82f6;box-shadow:0 8px 16px #0003;cursor:grabbing;opacity:.9}.panel-group{border:2px solid #e5e7eb;border-radius:12px;padding:8px;background:#fff}.panel-group.edit-mode{animation:wiggle .5s ease-in-out infinite;border-color:#3b82f6}.panel-group-header{display:flex;justify-content:space-between;align-items:center;padding:8px;border-bottom:1px solid #e5e7eb;margin-bottom:8px}.panel-group-title{font-size:12px;font-weight:600;color:#6b7280;text-transform:uppercase}.available-panels{background:#fff;border-radius:12px;padding:16px;box-shadow:0 4px 6px #0000001a}.available-panels-title{font-size:16px;font-weight:600;color:#374151;margin-bottom:12px}.available-panels-list{display:flex;flex-direction:column;gap:8px}.slot-label{font-size:12px;font-weight:600;color:#6b7280;text-transform:uppercase;margin-bottom:8px;display:flex;align-items:center;gap:8px}.slot-indicator{width:8px;height:8px;border-radius:50%;background:#d1d5db}.slot-indicator.active{background:#3b82f6}.action-buttons{position:fixed;bottom:24px;left:50%;transform:translate(-50%);z-index:1001;display:flex;gap:12px;padding:12px 24px;background:#fff;border-radius:12px;box-shadow:0 8px 16px #00000026;animation:scaleIn .3s ease}.action-button{padding:10px 20px;border-radius:8px;border:1px solid #e5e7eb;background:#fff;color:#374151;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease}.action-button:hover{background:#f9fafb}.action-button.primary{background:#3b82f6;color:#fff;border-color:#2563eb}.action-button.primary:hover{background:#2563eb}@media (max-width: 768px){.edit-mode-toggle{top:8px;right:8px;padding:6px 12px;font-size:12px}.action-buttons{bottom:16px;padding:10px 16px}.action-button{padding:8px 16px;font-size:13px}}@media (prefers-color-scheme: dark){.edit-mode-toggle{background:#1f2937;color:#f9fafb;border-color:#374151}.edit-mode-toggle:hover{background:#374151}.draggable-panel{background:#1f2937;color:#f9fafb;border-color:#374151}.available-panels{background:#1f2937}.panel-label{color:#f9fafb}.action-buttons{background:#1f2937}.action-button{background:#1f2937;color:#f9fafb;border-color:#374151}.action-button:hover{background:#374151}}.panel-configurator{display:flex;flex-direction:column;gap:2rem;padding:1.5rem;background:var(--configurator-bg);border-radius:8px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}.configurator-section{display:flex;flex-direction:column;gap:1rem}.section-title{margin:0;font-size:.875rem;font-weight:600;color:var(--configurator-title);text-transform:uppercase;letter-spacing:.05em;text-align:center}.slots-container{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;width:75%;margin:0 auto;align-items:start}.slot{position:relative;aspect-ratio:1 / 1.3;width:100%;padding:2.5rem 1rem 1rem;background:var(--slot-bg);border:2px solid var(--slot-border);border-radius:6px;cursor:pointer;transition:all .2s ease;display:flex;flex-direction:column;gap:.5rem;overflow:hidden;box-sizing:border-box}.slot:hover{border-color:var(--slot-border-hover);box-shadow:0 2px 4px #0000000d}.slot.selected{border-color:var(--slot-border-selected);background:var(--slot-bg-selected);box-shadow:0 0 0 3px var(--slot-bg-selected)}.slot.empty{border-style:dashed}.slot-label{font-size:.75rem;font-weight:600;color:var(--slot-label);text-transform:capitalize;text-align:left}.slot[data-position=middle] .slot-label,.slot[data-position=middle] .slot-panel-name,.slot[data-position=middle] .slot-empty-state{text-align:center}.slot[data-position=right] .slot-label,.slot[data-position=right] .slot-panel-name,.slot[data-position=right] .slot-empty-state{text-align:right}.slot-content{flex:1;display:flex;flex-direction:column;gap:.5rem;overflow-y:auto;min-height:0}.slot-panel-name{font-weight:600;color:var(--slot-content-text);font-size:.875rem}.slot-preview{flex:1;display:flex;align-items:center;justify-content:center;padding:.5rem;background:var(--slot-preview-bg);border-radius:4px;border:1px solid var(--slot-preview-border);font-size:.75rem;color:var(--slot-preview-text)}.slot-empty-state{flex:1;display:flex;align-items:center;justify-content:center;color:var(--slot-empty-text);font-size:.875rem;font-style:italic;min-height:0}.slot-clear-btn{position:absolute;top:.25rem;right:.25rem;width:24px;height:24px;padding:0;background:var(--clear-btn-bg);color:var(--clear-btn-text);border:none;border-radius:4px;cursor:pointer;font-size:1.25rem;line-height:1;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s ease}.slot:hover .slot-clear-btn{opacity:1}.slot-clear-btn:hover{background:var(--clear-btn-hover);transform:scale(1.1)}.available-panels{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.75rem;width:75%;margin:0 auto}.available-panel{min-height:80px;padding:.75rem;background:var(--panel-bg);border:2px solid var(--panel-border);border-radius:6px;cursor:pointer;transition:all .2s ease;display:flex;flex-direction:column;gap:.5rem}.available-panel:hover{border-color:var(--panel-border-hover);box-shadow:0 2px 4px #0000000d;transform:translateY(-2px)}.available-panel.selected{border-color:var(--panel-border-selected);background:var(--panel-bg-selected);box-shadow:0 0 0 3px var(--panel-bg-selected)}.available-panel.in-use{opacity:.5;border-style:dashed}.available-panel.in-use:hover{transform:translateY(0);opacity:.6}.panel-label{font-weight:600;color:var(--panel-label-text);font-size:.875rem}.panel-preview{flex:1;display:flex;align-items:center;justify-content:center;padding:.5rem;background:var(--panel-preview-bg);border-radius:4px;font-size:.75rem;color:var(--panel-preview-text)}.selection-hint{padding:.75rem 1rem;background:var(--hint-bg);border:1px solid var(--hint-border);border-radius:6px;color:var(--hint-text);font-size:.875rem;text-align:center}.available-panel.multi-selected{border-color:var(--panel-border-selected);background:var(--panel-bg-selected);box-shadow:0 0 0 2px var(--panel-bg-selected)}.multi-select-badge{margin-left:.5rem;padding:.25rem .5rem;background:var(--panel-border-selected);color:#fff;font-size:.75rem;border-radius:12px;font-weight:400}.multi-select-hint{background:var(--panel-bg-selected);border-color:var(--panel-border-selected)}.slot.tab-group{border-style:solid}.group-content{position:relative;overflow-y:auto;min-height:0}.group-badge{font-size:.75rem;font-weight:600;color:var(--panel-border-selected);margin-bottom:.5rem}.group-panels{display:flex;flex-direction:column;gap:.25rem;flex:1;overflow-y:auto;min-height:0}.group-panel-label{font-size:.75rem;color:var(--slot-content-text);padding:.25rem .5rem;background:var(--slot-preview-bg);border-radius:3px;border-left:3px solid var(--panel-border-selected)}.slot-panel-label{font-weight:600;color:var(--slot-content-text);font-size:.875rem;text-align:center}.create-tab-group-btn{margin-top:.5rem;padding:.5rem .75rem;background:var(--panel-border-selected);color:#fff;border:none;border-radius:4px;font-size:.75rem;font-weight:600;cursor:pointer;transition:all .2s ease}.create-tab-group-btn:hover{transform:scale(1.05);box-shadow:0 2px 4px #0000001a}.tab-mode-toggle{position:absolute;top:.5rem;left:.5rem;padding:.25rem .5rem;background:var(--slot-bg);border:1px solid var(--slot-border);border-radius:4px;font-size:.85rem;cursor:pointer;transition:all .2s ease;z-index:10;opacity:.7;color:var(--slot-content-text)}.tab-mode-toggle svg{display:block}.tab-mode-toggle:hover{opacity:1;border-color:var(--slot-border-hover);background:var(--slot-preview-bg)}.tab-mode-toggle.active{opacity:1;background:var(--panel-border-selected);color:#fff;border-color:var(--panel-border-selected)}.tab-config-controls{margin-bottom:.5rem}.tab-config-label{display:flex;align-items:center;gap:.5rem;font-size:.75rem;color:var(--slot-label)}.tab-config-label select{padding:.25rem .5rem;border:1px solid var(--slot-border);border-radius:3px;background:var(--slot-bg);color:var(--slot-content-text);font-size:.7rem;cursor:pointer}.group-panel-item{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.25rem .5rem;background:var(--slot-preview-bg);border-radius:3px;border-left:3px solid var(--panel-border-selected)}.group-panel-label{flex:1;font-size:.75rem;color:var(--slot-content-text);display:flex;align-items:center;gap:.25rem}.default-badge{color:var(--panel-border-selected);font-size:.9em}.remove-from-group-btn{width:18px;height:18px;padding:0;background:var(--clear-btn-bg);color:var(--clear-btn-text);border:none;border-radius:3px;cursor:pointer;font-size:1rem;line-height:1;display:flex;align-items:center;justify-content:center;opacity:.7;transition:all .2s ease}.remove-from-group-btn:hover{opacity:1;transform:scale(1.1)}.usage-hint{padding:.75rem 1rem;background:var(--slot-preview-bg);border:1px solid var(--slot-border);border-radius:6px;color:var(--hint-text);font-size:.875rem;text-align:center}
|
package/dist/styles.css
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
.animated-resizable-layout{width:100%;height:100%;position:relative;background-color:var(--panel-background)}.hybrid-panel{overflow:auto;height:100%;background-color:var(--panel-background)}.resize-handle{width:8px;background-color:var(--panel-handle);display:flex;justify-content:center;align-items:center;cursor:col-resize;position:relative;transition:background-color .2s,opacity .3s,width .3s}.resize-handle.collapsed{opacity:0;pointer-events:none}.resize-handle:hover{background-color:var(--panel-handle-hover)}.resize-handle:active{background-color:var(--panel-handle-active)}.handle-bar{height:100%;width:100%;display:flex;align-items:center;justify-content:center;position:relative}.collapse-toggle{position:absolute;background:var(--panel-button-bg);border:1px solid var(--panel-button-border);padding:4px 8px;cursor:pointer;color:var(--panel-button-icon);font-size:14px;outline:none;display:flex;align-items:center;justify-content:center;border-radius:4px;z-index:10;transition:all .2s;box-shadow:0 2px 4px #0000001a}.animated-vertical-layout{width:100%;height:100%;position:relative;background-color:var(--panel-background)}.vertical-panel{overflow:auto;width:100%;background-color:var(--panel-background)}.panel-content-wrapper{width:100%;height:100%;overflow:auto}.vertical-resize-handle{height:8px;background-color:var(--panel-handle);display:flex;justify-content:center;align-items:center;cursor:row-resize;position:relative;transition:background-color .2s,opacity .3s,height .3s}.vertical-resize-handle.collapsed{opacity:0;pointer-events:none}.vertical-resize-handle:hover{background-color:var(--panel-handle-hover)}.vertical-resize-handle:active{background-color:var(--panel-handle-active)}.handle-bar{width:100%;height:100%;display:flex;align-items:center;justify-content:center;gap:8px;position:relative}.collapse-toggle{background:var(--panel-button-bg);border:1px solid var(--panel-button-border);padding:4px 8px;cursor:pointer;color:var(--panel-button-icon);font-size:14px;outline:none;display:flex;align-items:center;justify-content:center;border-radius:4px;z-index:10;transition:all .2s;box-shadow:0 2px 4px #0000001a}.collapse-toggle:hover:not(:disabled){background-color:var(--panel-button-hover);box-shadow:0 2px 6px #00000026}.collapse-toggle:active:not(:disabled){opacity:.8}.tab-group{display:flex;height:100%;width:100%;overflow:hidden}.tab-group.tab-position-top,.tab-group.tab-position-bottom{flex-direction:column}.tab-group.tab-position-left,.tab-group.tab-position-right{flex-direction:row}.tab-list{display:flex;background:var(--tab-list-bg, #f5f5f5);border-bottom:1px solid var(--tab-border, #ddd);gap:0;padding:0;flex-shrink:0;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-ms-overflow-style:none}.tab-list::-webkit-scrollbar{display:none}.tab-position-top .tab-list,.tab-position-bottom .tab-list{width:100%}.tab-list.centered{justify-content:flex-start}@media (min-width: 0){.tab-list.centered{justify-content:center}.tab-list.centered:has(.tab-button:nth-child(n)){justify-content:flex-start}}.tab-position-bottom .tab-list{border-bottom:none;border-top:none}.tab-position-left .tab-list,.tab-position-right .tab-list{flex-direction:column;border-bottom:none;border-right:none;width:auto;min-width:120px}.tab-position-top .tab-button,.tab-position-bottom .tab-button{flex:1 1 0;min-width:40px;max-width:100%}.tab-button{background:var(--tab-bg, #fff);border:1px solid var(--tab-border, #ddd);border-radius:0;padding:8px 16px;cursor:pointer;font-family:var(--tab-font-family, inherit);font-size:var(--tab-font-size, 14px);font-weight:var(--tab-font-weight, 500);color:var(--tab-text, #333);transition:all .2s ease;white-space:nowrap;display:flex;align-items:center;justify-content:center;gap:6px;height:39px;line-height:1;box-sizing:border-box;container-type:inline-size}.tab-position-top .tab-button{border-bottom:none;border-top:none;border-left:none}.tab-position-top .tab-button:last-child{border-right:none}.tab-position-bottom .tab-button{border-top:none;border-bottom:none;border-left:none}.tab-position-bottom .tab-button:last-child{border-right:none}.tab-position-left .tab-button{border-right:none;border-bottom:none}.tab-position-left .tab-button:last-child{border-bottom:1px solid var(--tab-border, #ddd)}.tab-position-right .tab-button{border-left:none;border-bottom:none}.tab-position-right .tab-button:last-child{border-bottom:1px solid var(--tab-border, #ddd)}.tab-icon{display:inline-flex;align-items:center;justify-content:center}.tab-label{display:none}@container (min-width: 100px){.tab-label{display:inline}.tab-icon{display:none}}.tab-button:hover{background:var(--tab-bg-hover, #f9f9f9)}.tab-button.active{background:var(--tab-bg-active, #007bff);color:var(--tab-text-active, #fff);border-color:var(--tab-border-active, #007bff)}.tab-button:focus-visible{outline:2px solid var(--tab-focus, #007bff);outline-offset:2px}.tab-content{flex:1;overflow:auto;background:var(--tab-content-bg, #fff)}.tab-group-empty{display:flex;align-items:center;justify-content:center;height:100%;color:var(--tab-empty-text, #999);font-style:italic}.three-panel-layout{height:100%;width:100%;display:flex;flex-direction:column;position:relative;background-color:var(--panel-background);box-sizing:border-box}.three-panel-item{display:flex;flex-direction:column;overflow:hidden;position:relative;background-color:var(--panel-background);box-sizing:border-box}.three-panel-item[data-edit-mode=true]{background-color:var(--panel-accent-bg);border-radius:12px}.three-panel-item.collapsible-panel{will-change:flex}.three-panel-item.collapsible-panel.animating{pointer-events:none}.three-panel-item.collapsible-panel.collapsed{flex:0!important;min-width:0!important;max-width:0!important;width:0!important;overflow:hidden!important;visibility:hidden}.three-panel-item.middle-panel{flex:1;min-width:200px}.panel-content-wrapper{flex:1;overflow-x:hidden;overflow-y:auto;will-change:opacity;box-sizing:border-box}.resize-handle{position:relative;display:flex;align-items:center;justify-content:center;width:1px!important;cursor:col-resize;background:var(--panel-border);overflow:visible!important}.resize-handle:before{content:"";position:absolute;inset:0 -10px;background:transparent}.resize-handle:after{content:"";position:absolute;inset:0 -10px;background:var(--panel-handle);opacity:0;transition:opacity .2s ease;z-index:-1}.resize-handle:hover:after{opacity:1}.resize-handle:hover{background:var(--panel-handle-hover)}.resize-handle:active:after{opacity:1;background:var(--panel-handle-active)}.resize-handle:active{background:var(--panel-handle-active)}.resize-handle.collapsed{width:0!important;visibility:hidden}.resize-handle.left-handle.collapsed{margin-right:-1px}.resize-handle.right-handle.collapsed{margin-left:-1px}.handle-bar{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center;z-index:2}.collapse-toggle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:20px;height:40px;background:var(--panel-button-bg);border:1px solid var(--panel-button-border);border-radius:4px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:12px;color:var(--panel-button-icon);transition:all .2s ease;z-index:10;padding:0;line-height:1}.collapse-toggle:hover{background:var(--panel-button-hover)}.collapse-toggle:active{opacity:.8}.collapse-toggle:disabled{opacity:.5;cursor:not-allowed}@media (max-width: 768px){.resize-handle:before{left:-8px;right:-8px}.resize-handle:after{left:-8px;right:-8px}.collapse-toggle{width:24px;height:48px;font-size:14px}}.snap-carousel-container{display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-behavior:smooth;gap:var(--snap-carousel-gap, 0px);padding:0;margin:0;width:100%;height:100%;background-color:var(--panel-background);box-sizing:border-box;position:relative;left:0;transform:none;container-type:inline-size;-ms-overflow-style:none;scrollbar-width:none}.snap-carousel-container::-webkit-scrollbar{display:none}.snap-carousel-container.swipe-disabled{touch-action:pan-y pinch-zoom;overscroll-behavior-x:none}.snap-carousel-panel{flex:0 0 auto;scroll-snap-align:start;scroll-snap-stop:always;width:var(--snap-carousel-panel-width, 33.33%);height:100%;box-sizing:border-box;overflow:hidden}@media (max-width: 540px){.snap-carousel-panel{min-width:280px}}.mobile-tab-layout{display:flex;flex-direction:column;height:100%;width:100%;overflow:hidden}.mobile-tab-content{flex:1;overflow:hidden;min-height:0}.mobile-tab-nav{display:flex;background:var(--tab-list-bg, #f5f5f5);border-top:1px solid var(--tab-border, #ddd);flex-shrink:0;padding:0;margin:0}.mobile-tab-button{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;background:transparent;border:none;padding:14px 4px;padding-bottom:calc(14px + min(12px,env(safe-area-inset-bottom,0px)));cursor:pointer;font-family:var(--tab-font-family, inherit);font-size:var(--tab-font-size, 11px);font-weight:var(--tab-font-weight, 500);color:var(--tab-text, #666);transition:color .2s ease;min-width:0}.mobile-tab-button:hover{color:var(--tab-text-hover, #333)}.mobile-tab-button.active{color:var(--mobile-tab-text-active, #007bff)}.mobile-tab-button .tab-icon{display:flex;align-items:center;justify-content:center;font-size:24px;color:var(--tab-icon-color, #999);transition:color .2s ease}.mobile-tab-button.active .tab-icon{color:var(--mobile-tab-icon-active, #007bff)}.mobile-tab-button .tab-label{display:block;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;line-height:1.2;color:inherit;opacity:1}.mobile-tab-button:focus-visible{outline:2px solid var(--tab-focus, #007bff);outline-offset:-2px;z-index:1}@keyframes wiggle{0%{transform:rotate(0)}25%{transform:rotate(1deg)}50%{transform:rotate(0)}75%{transform:rotate(-1deg)}to{transform:rotate(0)}}@keyframes scaleIn{0%{transform:scale(.95);opacity:0}to{transform:scale(1);opacity:1}}@keyframes pulse{0%,to{box-shadow:0 0 #3b82f666}50%{box-shadow:0 0 0 8px #3b82f600}}.editable-panel-layout{position:relative;width:100%;height:100%}.editable-panel-layout.edit-mode-active{background:#0000000d}[data-slot][data-edit-mode=true]{transform:scale(.95);transform-origin:center center;cursor:grab;will-change:transform;transition:transform .3s cubic-bezier(.4,0,.2,1)}[data-slot][data-edit-mode=true]:active{cursor:grabbing}[data-slot][data-dragging=true]{cursor:grabbing!important;transform:scale(.95)!important;transition:none!important}.edit-mode-active [data-slot][data-edit-mode=true]{transform-origin:center center}.slot-with-overlay{position:relative;width:100%;height:100%}.slot-with-overlay.dragging{opacity:0;pointer-events:none}.slot-edit-overlay{position:absolute;inset:0;background:transparent;border:none;pointer-events:auto;cursor:grab;z-index:100;display:flex;flex-direction:column;align-items:center;justify-content:center}.slot-edit-overlay:hover{background:#3b82f608}.slot-edit-overlay:active{cursor:grabbing}.drag-indicator,.slot-position-label{display:none}.edit-mode-toggle{position:absolute;top:16px;right:16px;z-index:1000;padding:8px 16px;border-radius:8px;border:1px solid #e5e7eb;background:#fff;color:#374151;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease;box-shadow:0 2px 4px #0000001a}.edit-mode-toggle:hover{background:#f9fafb;box-shadow:0 4px 6px #0000001a}.edit-mode-toggle.active{background:#3b82f6;color:#fff;border-color:#2563eb}.edit-mode-overlay{position:fixed;inset:0;background:#0000004d;z-index:998;animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.edit-mode-configurator{position:relative;z-index:999;padding:20px;animation:scaleIn .3s ease}.panel-slot{position:relative;min-height:120px;border:2px dashed transparent;border-radius:12px;transition:all .3s ease;padding:12px}.panel-slot.edit-mode{border-color:#d1d5db;background:#ffffff80}.panel-slot.drag-over{border-color:#3b82f6;background:#3b82f61a;box-shadow:0 0 0 4px #3b82f61a}.panel-slot.empty{display:flex;align-items:center;justify-content:center;color:#9ca3af;font-size:14px}.draggable-panel{position:relative;padding:12px 16px;margin:8px 0;border-radius:8px;background:#fff;border:1px solid #e5e7eb;cursor:grab;transition:all .2s ease;-webkit-user-select:none;user-select:none}.draggable-panel:hover{border-color:#3b82f6;box-shadow:0 2px 8px #0000001a}.draggable-panel.dragging{opacity:.5;cursor:grabbing}.draggable-panel.edit-mode{animation:wiggle .4s ease-in-out infinite;transform-origin:center}.draggable-panel.edit-mode:nth-child(odd){animation-delay:.1s}.draggable-panel.edit-mode:nth-child(2n){animation-delay:.2s}.remove-button{position:absolute;top:-6px;right:-6px;width:20px;height:20px;border-radius:50%;background:#ef4444;color:#fff;border:2px solid white;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:12px;font-weight:700;opacity:0;transform:scale(0);transition:all .2s ease;z-index:10;box-shadow:0 2px 4px #0003}.draggable-panel.edit-mode .remove-button{opacity:1;transform:scale(1);animation:pulse 2s infinite}.remove-button:hover{background:#dc2626;transform:scale(1.1)}.panel-label{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:500;color:#374151}.panel-icon{width:20px;height:20px;display:flex;align-items:center;justify-content:center}.drag-handle{display:none;width:24px;height:24px;opacity:.4;cursor:grab}.edit-mode .drag-handle{display:flex;align-items:center;justify-content:center}.drag-overlay{padding:12px 16px;border-radius:8px;background:#fff;border:2px solid #3b82f6;box-shadow:0 8px 16px #0003;cursor:grabbing;opacity:.9}.panel-group{border:2px solid #e5e7eb;border-radius:12px;padding:8px;background:#fff}.panel-group.edit-mode{animation:wiggle .5s ease-in-out infinite;border-color:#3b82f6}.panel-group-header{display:flex;justify-content:space-between;align-items:center;padding:8px;border-bottom:1px solid #e5e7eb;margin-bottom:8px}.panel-group-title{font-size:12px;font-weight:600;color:#6b7280;text-transform:uppercase}.available-panels{background:#fff;border-radius:12px;padding:16px;box-shadow:0 4px 6px #0000001a}.available-panels-title{font-size:16px;font-weight:600;color:#374151;margin-bottom:12px}.available-panels-list{display:flex;flex-direction:column;gap:8px}.slot-label{font-size:12px;font-weight:600;color:#6b7280;text-transform:uppercase;margin-bottom:8px;display:flex;align-items:center;gap:8px}.slot-indicator{width:8px;height:8px;border-radius:50%;background:#d1d5db}.slot-indicator.active{background:#3b82f6}.action-buttons{position:fixed;bottom:24px;left:50%;transform:translate(-50%);z-index:1001;display:flex;gap:12px;padding:12px 24px;background:#fff;border-radius:12px;box-shadow:0 8px 16px #00000026;animation:scaleIn .3s ease}.action-button{padding:10px 20px;border-radius:8px;border:1px solid #e5e7eb;background:#fff;color:#374151;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease}.action-button:hover{background:#f9fafb}.action-button.primary{background:#3b82f6;color:#fff;border-color:#2563eb}.action-button.primary:hover{background:#2563eb}@media (max-width: 768px){.edit-mode-toggle{top:8px;right:8px;padding:6px 12px;font-size:12px}.action-buttons{bottom:16px;padding:10px 16px}.action-button{padding:8px 16px;font-size:13px}}@media (prefers-color-scheme: dark){.edit-mode-toggle{background:#1f2937;color:#f9fafb;border-color:#374151}.edit-mode-toggle:hover{background:#374151}.draggable-panel{background:#1f2937;color:#f9fafb;border-color:#374151}.available-panels{background:#1f2937}.panel-label{color:#f9fafb}.action-buttons{background:#1f2937}.action-button{background:#1f2937;color:#f9fafb;border-color:#374151}.action-button:hover{background:#374151}}.panel-configurator{display:flex;flex-direction:column;gap:2rem;padding:1.5rem;background:var(--configurator-bg);border-radius:8px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}.configurator-section{display:flex;flex-direction:column;gap:1rem}.section-title{margin:0;font-size:.875rem;font-weight:600;color:var(--configurator-title);text-transform:uppercase;letter-spacing:.05em;text-align:center}.slots-container{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;width:75%;margin:0 auto;align-items:start}.slot{position:relative;aspect-ratio:1 / 1.3;width:100%;padding:2.5rem 1rem 1rem;background:var(--slot-bg);border:2px solid var(--slot-border);border-radius:6px;cursor:pointer;transition:all .2s ease;display:flex;flex-direction:column;gap:.5rem;overflow:hidden;box-sizing:border-box}.slot:hover{border-color:var(--slot-border-hover);box-shadow:0 2px 4px #0000000d}.slot.selected{border-color:var(--slot-border-selected);background:var(--slot-bg-selected);box-shadow:0 0 0 3px var(--slot-bg-selected)}.slot.empty{border-style:dashed}.slot-label{font-size:.75rem;font-weight:600;color:var(--slot-label);text-transform:capitalize;text-align:left}.slot[data-position=middle] .slot-label,.slot[data-position=middle] .slot-panel-name,.slot[data-position=middle] .slot-empty-state{text-align:center}.slot[data-position=right] .slot-label,.slot[data-position=right] .slot-panel-name,.slot[data-position=right] .slot-empty-state{text-align:right}.slot-content{flex:1;display:flex;flex-direction:column;gap:.5rem;overflow-y:auto;min-height:0}.slot-panel-name{font-weight:600;color:var(--slot-content-text);font-size:.875rem}.slot-preview{flex:1;display:flex;align-items:center;justify-content:center;padding:.5rem;background:var(--slot-preview-bg);border-radius:4px;border:1px solid var(--slot-preview-border);font-size:.75rem;color:var(--slot-preview-text)}.slot-empty-state{flex:1;display:flex;align-items:center;justify-content:center;color:var(--slot-empty-text);font-size:.875rem;font-style:italic;min-height:0}.slot-clear-btn{position:absolute;top:.25rem;right:.25rem;width:24px;height:24px;padding:0;background:var(--clear-btn-bg);color:var(--clear-btn-text);border:none;border-radius:4px;cursor:pointer;font-size:1.25rem;line-height:1;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s ease}.slot:hover .slot-clear-btn{opacity:1}.slot-clear-btn:hover{background:var(--clear-btn-hover);transform:scale(1.1)}.available-panels{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.75rem;width:75%;margin:0 auto}.available-panel{min-height:80px;padding:.75rem;background:var(--panel-bg);border:2px solid var(--panel-border);border-radius:6px;cursor:pointer;transition:all .2s ease;display:flex;flex-direction:column;gap:.5rem}.available-panel:hover{border-color:var(--panel-border-hover);box-shadow:0 2px 4px #0000000d;transform:translateY(-2px)}.available-panel.selected{border-color:var(--panel-border-selected);background:var(--panel-bg-selected);box-shadow:0 0 0 3px var(--panel-bg-selected)}.available-panel.in-use{opacity:.5;border-style:dashed}.available-panel.in-use:hover{transform:translateY(0);opacity:.6}.panel-label{font-weight:600;color:var(--panel-label-text);font-size:.875rem}.panel-preview{flex:1;display:flex;align-items:center;justify-content:center;padding:.5rem;background:var(--panel-preview-bg);border-radius:4px;font-size:.75rem;color:var(--panel-preview-text)}.selection-hint{padding:.75rem 1rem;background:var(--hint-bg);border:1px solid var(--hint-border);border-radius:6px;color:var(--hint-text);font-size:.875rem;text-align:center}.available-panel.multi-selected{border-color:var(--panel-border-selected);background:var(--panel-bg-selected);box-shadow:0 0 0 2px var(--panel-bg-selected)}.multi-select-badge{margin-left:.5rem;padding:.25rem .5rem;background:var(--panel-border-selected);color:#fff;font-size:.75rem;border-radius:12px;font-weight:400}.multi-select-hint{background:var(--panel-bg-selected);border-color:var(--panel-border-selected)}.slot.tab-group{border-style:solid}.group-content{position:relative;overflow-y:auto;min-height:0}.group-badge{font-size:.75rem;font-weight:600;color:var(--panel-border-selected);margin-bottom:.5rem}.group-panels{display:flex;flex-direction:column;gap:.25rem;flex:1;overflow-y:auto;min-height:0}.group-panel-label{font-size:.75rem;color:var(--slot-content-text);padding:.25rem .5rem;background:var(--slot-preview-bg);border-radius:3px;border-left:3px solid var(--panel-border-selected)}.slot-panel-label{font-weight:600;color:var(--slot-content-text);font-size:.875rem;text-align:center}.create-tab-group-btn{margin-top:.5rem;padding:.5rem .75rem;background:var(--panel-border-selected);color:#fff;border:none;border-radius:4px;font-size:.75rem;font-weight:600;cursor:pointer;transition:all .2s ease}.create-tab-group-btn:hover{transform:scale(1.05);box-shadow:0 2px 4px #0000001a}.tab-mode-toggle{position:absolute;top:.5rem;left:.5rem;padding:.25rem .5rem;background:var(--slot-bg);border:1px solid var(--slot-border);border-radius:4px;font-size:.85rem;cursor:pointer;transition:all .2s ease;z-index:10;opacity:.7;color:var(--slot-content-text)}.tab-mode-toggle svg{display:block}.tab-mode-toggle:hover{opacity:1;border-color:var(--slot-border-hover);background:var(--slot-preview-bg)}.tab-mode-toggle.active{opacity:1;background:var(--panel-border-selected);color:#fff;border-color:var(--panel-border-selected)}.tab-config-controls{margin-bottom:.5rem}.tab-config-label{display:flex;align-items:center;gap:.5rem;font-size:.75rem;color:var(--slot-label)}.tab-config-label select{padding:.25rem .5rem;border:1px solid var(--slot-border);border-radius:3px;background:var(--slot-bg);color:var(--slot-content-text);font-size:.7rem;cursor:pointer}.group-panel-item{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.25rem .5rem;background:var(--slot-preview-bg);border-radius:3px;border-left:3px solid var(--panel-border-selected)}.group-panel-label{flex:1;font-size:.75rem;color:var(--slot-content-text);display:flex;align-items:center;gap:.25rem}.default-badge{color:var(--panel-border-selected);font-size:.9em}.remove-from-group-btn{width:18px;height:18px;padding:0;background:var(--clear-btn-bg);color:var(--clear-btn-text);border:none;border-radius:3px;cursor:pointer;font-size:1rem;line-height:1;display:flex;align-items:center;justify-content:center;opacity:.7;transition:all .2s ease}.remove-from-group-btn:hover{opacity:1;transform:scale(1.1)}.usage-hint{padding:.75rem 1rem;background:var(--slot-preview-bg);border:1px solid var(--slot-border);border-radius:6px;color:var(--hint-text);font-size:.875rem;text-align:center}
|