2024-10-28 18:29:38 +00:00
var _ _defProp = Object . defineProperty ;
var _ _name = ( target , value ) => _ _defProp ( target , "name" , { value , configurable : true } ) ;
2024-11-16 01:17:15 +00:00
import { d as defineComponent , u as useSettingStore , r as ref , a as useTitleEditorStore , b as useCanvasStore , w as watch , L as LGraphGroup , c as app , e as LGraphNode , o as onMounted , f as onUnmounted , g as openBlock , h as createElementBlock , i as createVNode , E as EditableText , n as normalizeStyle , j as createCommentVNode , k as LiteGraph , _ as _export _sfc , B as BaseStyle , s as script$e , l as resolveComponent , m as mergeProps , p as renderSlot , q as computed , t as resolveDirective , v as withDirectives , x as createBlock , y as withCtx , z as unref , A as createBaseVNode , C as normalizeClass , D as script$f , F as useCommandStore , G as useDialogStore , S as SettingDialogHeader , H as SettingDialogContent , I as onBeforeUnmount , J as resolveDynamicComponent , K as useWorkspaceStore , M as useKeybindingStore , N as Fragment , O as renderList , T as Teleport , P as pushScopeId , Q as popScopeId , R as script$g , U as getWidth , V as findSingle , W as getOuterHeight , X as getOffset , Y as getOuterWidth , Z as getHeight , $ as script$h , a0 as script$i , a1 as Ripple , a2 as getAttribute , a3 as focus , a4 as equals , a5 as useBottomPanelStore , a6 as toDisplayString , a7 as script$j , a8 as getVNodeProp , a9 as isArray , aa as useSidebarTabStore , ab as vShow , ac as isNotEmpty , ad as UniqueComponentId , ae as ZIndex , af as resolveFieldData , ag as OverlayEventBus , ah as isEmpty , ai as addStyle , aj as relativePosition , ak as absolutePosition , al as ConnectedOverlayScrollHandler , am as isTouchDevice , an as findLastIndex , ao as script$k , ap as script$l , aq as script$m , ar as script$n , as as script$o , at as script$p , au as Transition , av as createSlots , aw as createTextVNode , ax as useNodeFrequencyStore , ay as useNodeBookmarkStore , az as highlightQuery , aA as script$q , aB as formatNumberWithSuffix , aC as NodeSourceType , aD as useI18n , aE as useNodeDefStore , aF as NodePreview , aG as NodeSearchFilter , aH as script$r , aI as SearchFilterChip , aJ as watchEffect , aK as toRaw , aL as LinkReleaseTriggerAction , aM as useEventListener , aN as nextTick , aO as getColorPalette , aP as BadgePosition , aQ as LGraphBadge , aR as _ , aS as defaultColorPalette , aT as NodeBadgeMode , aU as markRaw , aV as useModelToNodeStore , aW as useWorkflowStore , aX as setStorageValue , aY as usePragmaticDroppable , aZ as ComfyNodeDefImpl , a _ as ComfyModelDef , a$ as LGraph , b0 as LLink , b1 as DragAndScale , b2 as LGraphCanvas , b3 as ContextMenu , b4 as ChangeTracker , b5 as script$s , b6 as script$t , b7 as script$u , b8 as script$v , b9 as script$w , ba as normalizeProps , bb as ToastEventBus , bc as setAttribute , bd as TransitionGroup , be as useToast , bf as useToastStore , bg as useExecutionStore , bh as useTitle , bi as withModifiers , bj as script$x , bk as workflowService , bl as resolve , bm as script$y , bn as script$z , bo as isPrintableCharacter , bp as guardReactiveProps , bq as useMenuItemStore , br as script$C , bs as nestedPosition , bt as useQueueSettingsStore , bu as storeToRefs , bv as isRef , bw as script$D , bx as useQueuePendingTaskCountStore , by as useLocalStorage , bz as useDraggable , bA as watchDebounced , bB as inject , bC as useElementBounding , bD as lodashExports , bE as useEventBus , bF as provide , bG as script$E , bH as api , bI as i18n , bJ as useModelStore } from "./index-B6dYHNhg.js" ;
import { s as script$A , a as script$B } from "./index-MX9DEi8Q.js" ;
const _sfc _main$r = /* @__PURE__ */ defineComponent ( {
2024-10-28 18:29:38 +00:00
_ _name : "TitleEditor" ,
setup ( _ _props ) {
const settingStore = useSettingStore ( ) ;
const showInput = ref ( false ) ;
const editedTitle = ref ( "" ) ;
const inputStyle = ref ( {
position : "fixed" ,
left : "0px" ,
top : "0px" ,
width : "200px" ,
height : "20px" ,
fontSize : "12px"
} ) ;
const titleEditorStore = useTitleEditorStore ( ) ;
const canvasStore = useCanvasStore ( ) ;
const previousCanvasDraggable = ref ( true ) ;
const onEdit = /* @__PURE__ */ _ _name ( ( newValue ) => {
if ( titleEditorStore . titleEditorTarget && newValue . trim ( ) !== "" ) {
titleEditorStore . titleEditorTarget . title = newValue . trim ( ) ;
app . graph . setDirtyCanvas ( true , true ) ;
}
showInput . value = false ;
titleEditorStore . titleEditorTarget = null ;
canvasStore . canvas . allow _dragcanvas = previousCanvasDraggable . value ;
} , "onEdit" ) ;
watch (
( ) => titleEditorStore . titleEditorTarget ,
( target ) => {
if ( target === null ) {
return ;
}
editedTitle . value = target . title ;
showInput . value = true ;
previousCanvasDraggable . value = canvasStore . canvas . allow _dragcanvas ;
canvasStore . canvas . allow _dragcanvas = false ;
if ( target instanceof LGraphGroup ) {
const group = target ;
const [ x , y ] = group . pos ;
const [ w , h ] = group . size ;
const [ left , top ] = app . canvasPosToClientPos ( [ x , y ] ) ;
inputStyle . value . left = ` ${ left } px ` ;
inputStyle . value . top = ` ${ top } px ` ;
const width = w * app . canvas . ds . scale ;
const height = group . titleHeight * app . canvas . ds . scale ;
inputStyle . value . width = ` ${ width } px ` ;
inputStyle . value . height = ` ${ height } px ` ;
const fontSize = group . font _size * app . canvas . ds . scale ;
inputStyle . value . fontSize = ` ${ fontSize } px ` ;
} else if ( target instanceof LGraphNode ) {
const node = target ;
const [ x , y ] = node . getBounding ( ) ;
const canvasWidth = node . width ;
const canvasHeight = LiteGraph . NODE _TITLE _HEIGHT ;
const [ left , top ] = app . canvasPosToClientPos ( [ x , y ] ) ;
inputStyle . value . left = ` ${ left } px ` ;
inputStyle . value . top = ` ${ top } px ` ;
const width = canvasWidth * app . canvas . ds . scale ;
const height = canvasHeight * app . canvas . ds . scale ;
inputStyle . value . width = ` ${ width } px ` ;
inputStyle . value . height = ` ${ height } px ` ;
const fontSize = 12 * app . canvas . ds . scale ;
inputStyle . value . fontSize = ` ${ fontSize } px ` ;
}
}
) ;
const canvasEventHandler = /* @__PURE__ */ _ _name ( ( event ) => {
if ( ! settingStore . get ( "Comfy.Group.DoubleClickTitleToEdit" ) ) {
return ;
}
if ( event . detail . subType === "group-double-click" ) {
const group = event . detail . group ;
const [ x , y ] = group . pos ;
const e = event . detail . originalEvent ;
const relativeY = e . canvasY - y ;
if ( relativeY > group . titleHeight ) {
return ;
}
titleEditorStore . titleEditorTarget = group ;
}
} , "canvasEventHandler" ) ;
const extension = {
name : "Comfy.NodeTitleEditor" ,
nodeCreated ( node ) {
const originalCallback = node . onNodeTitleDblClick ;
node . onNodeTitleDblClick = function ( e , ... args ) {
if ( ! settingStore . get ( "Comfy.Node.DoubleClickTitleToEdit" ) ) {
return ;
}
titleEditorStore . titleEditorTarget = this ;
if ( typeof originalCallback === "function" ) {
originalCallback . call ( this , e , ... args ) ;
}
} ;
}
} ;
onMounted ( ( ) => {
document . addEventListener ( "litegraph:canvas" , canvasEventHandler ) ;
app . registerExtension ( extension ) ;
} ) ;
onUnmounted ( ( ) => {
document . removeEventListener ( "litegraph:canvas" , canvasEventHandler ) ;
} ) ;
return ( _ctx , _cache ) => {
return showInput . value ? ( openBlock ( ) , createElementBlock ( "div" , {
key : 0 ,
class : "group-title-editor node-title-editor" ,
style : normalizeStyle ( inputStyle . value )
} , [
createVNode ( EditableText , {
isEditing : showInput . value ,
modelValue : editedTitle . value ,
onEdit
} , null , 8 , [ "isEditing" , "modelValue" ] )
] , 4 ) ) : createCommentVNode ( "" , true ) ;
} ;
}
} ) ;
2024-11-16 01:17:15 +00:00
const TitleEditor = /* @__PURE__ */ _export _sfc ( _sfc _main$r , [ [ "__scopeId" , "data-v-8a100d5a" ] ] ) ;
2024-10-28 18:29:38 +00:00
var theme$8 = /* @__PURE__ */ _ _name ( function theme ( _ref ) {
var dt = _ref . dt ;
return "\n.p-overlaybadge {\n position: relative;\n}\n\n.p-overlaybadge .p-badge {\n position: absolute;\n top: 0;\n right: 0;\n transform: translate(50%, -50%);\n transform-origin: 100% 0;\n margin: 0;\n outline-width: " . concat ( dt ( "overlaybadge.outline.width" ) , ";\n outline-style: solid;\n outline-color: " ) . concat ( dt ( "overlaybadge.outline.color" ) , ";\n}\n" ) ;
} , "theme" ) ;
2024-10-29 18:14:06 +00:00
var classes$b = {
2024-10-28 18:29:38 +00:00
root : "p-overlaybadge"
} ;
var OverlayBadgeStyle = BaseStyle . extend ( {
name : "overlaybadge" ,
theme : theme$8 ,
2024-10-29 18:14:06 +00:00
classes : classes$b
2024-10-28 18:29:38 +00:00
} ) ;
2024-10-29 18:14:06 +00:00
var script$1$b = {
2024-10-28 18:29:38 +00:00
name : "OverlayBadge" ,
2024-10-29 18:14:06 +00:00
"extends" : script$e ,
2024-10-28 18:29:38 +00:00
style : OverlayBadgeStyle ,
provide : /* @__PURE__ */ _ _name ( function provide2 ( ) {
return {
$pcOverlayBadge : this ,
$parentInstance : this
} ;
} , "provide" )
} ;
2024-10-29 18:14:06 +00:00
var script$d = {
2024-10-28 18:29:38 +00:00
name : "OverlayBadge" ,
2024-10-29 18:14:06 +00:00
"extends" : script$1$b ,
2024-10-28 18:29:38 +00:00
inheritAttrs : false ,
components : {
2024-10-29 18:14:06 +00:00
Badge : script$e
2024-10-28 18:29:38 +00:00
}
} ;
2024-11-16 01:17:15 +00:00
function render$j ( _ctx , _cache , $props , $setup , $data , $options ) {
2024-10-28 18:29:38 +00:00
var _component _Badge = resolveComponent ( "Badge" ) ;
return openBlock ( ) , createElementBlock ( "div" , mergeProps ( {
"class" : _ctx . cx ( "root" )
} , _ctx . ptmi ( "root" ) ) , [ renderSlot ( _ctx . $slots , "default" ) , createVNode ( _component _Badge , mergeProps ( _ctx . $props , {
pt : _ctx . ptm ( "pcBadge" )
} ) , null , 16 , [ "pt" ] ) ] , 16 ) ;
}
2024-11-16 01:17:15 +00:00
_ _name ( render$j , "render$j" ) ;
script$d . render = render$j ;
const _sfc _main$q = /* @__PURE__ */ defineComponent ( {
2024-10-28 18:29:38 +00:00
_ _name : "SidebarIcon" ,
props : {
icon : String ,
selected : Boolean ,
tooltip : {
type : String ,
default : ""
} ,
class : {
type : String ,
default : ""
} ,
iconBadge : {
type : [ String , Function ] ,
default : ""
}
} ,
emits : [ "click" ] ,
setup ( _ _props , { emit : _ _emit } ) {
const props = _ _props ;
const emit = _ _emit ;
const overlayValue = computed (
( ) => typeof props . iconBadge === "function" ? props . iconBadge ( ) || "" : props . iconBadge
) ;
const shouldShowBadge = computed ( ( ) => ! ! overlayValue . value ) ;
return ( _ctx , _cache ) => {
const _directive _tooltip = resolveDirective ( "tooltip" ) ;
2024-10-29 18:14:06 +00:00
return withDirectives ( ( openBlock ( ) , createBlock ( unref ( script$f ) , {
2024-10-28 18:29:38 +00:00
class : normalizeClass ( props . class ) ,
text : "" ,
pt : {
root : {
class : ` side-bar-button ${ props . selected ? "p-button-primary side-bar-button-selected" : "p-button-secondary" } ` ,
"aria-label" : props . tooltip
}
} ,
onClick : _cache [ 0 ] || ( _cache [ 0 ] = ( $event ) => emit ( "click" , $event ) )
} , {
icon : withCtx ( ( ) => [
2024-10-29 18:14:06 +00:00
shouldShowBadge . value ? ( openBlock ( ) , createBlock ( unref ( script$d ) , {
2024-10-28 18:29:38 +00:00
key : 0 ,
value : overlayValue . value
} , {
default : withCtx ( ( ) => [
createBaseVNode ( "i" , {
class : normalizeClass ( props . icon + " side-bar-button-icon" )
} , null , 2 )
] ) ,
_ : 1
} , 8 , [ "value" ] ) ) : ( openBlock ( ) , createElementBlock ( "i" , {
key : 1 ,
class : normalizeClass ( props . icon + " side-bar-button-icon" )
} , null , 2 ) )
] ) ,
_ : 1
} , 8 , [ "class" , "pt" ] ) ) , [
[ _directive _tooltip , { value : props . tooltip , showDelay : 300 , hideDelay : 300 } ]
] ) ;
} ;
}
} ) ;
2024-11-16 01:17:15 +00:00
const SidebarIcon = /* @__PURE__ */ _export _sfc ( _sfc _main$q , [ [ "__scopeId" , "data-v-caa3ee9c" ] ] ) ;
const _sfc _main$p = /* @__PURE__ */ defineComponent ( {
2024-10-28 18:29:38 +00:00
_ _name : "SidebarThemeToggleIcon" ,
setup ( _ _props ) {
const settingStore = useSettingStore ( ) ;
const currentTheme = computed ( ( ) => settingStore . get ( "Comfy.ColorPalette" ) ) ;
const icon = computed (
( ) => currentTheme . value !== "light" ? "pi pi-moon" : "pi pi-sun"
) ;
const commandStore = useCommandStore ( ) ;
const toggleTheme = /* @__PURE__ */ _ _name ( ( ) => {
commandStore . execute ( "Comfy.ToggleTheme" ) ;
} , "toggleTheme" ) ;
return ( _ctx , _cache ) => {
return openBlock ( ) , createBlock ( SidebarIcon , {
icon : icon . value ,
onClick : toggleTheme ,
tooltip : _ctx . $t ( "sideToolbar.themeToggle" ) ,
class : "comfy-vue-theme-toggle"
} , null , 8 , [ "icon" , "tooltip" ] ) ;
} ;
}
} ) ;
2024-11-16 01:17:15 +00:00
const _sfc _main$o = /* @__PURE__ */ defineComponent ( {
2024-10-28 18:29:38 +00:00
_ _name : "SidebarSettingsToggleIcon" ,
setup ( _ _props ) {
const dialogStore = useDialogStore ( ) ;
const showSetting = /* @__PURE__ */ _ _name ( ( ) => {
dialogStore . showDialog ( {
headerComponent : SettingDialogHeader ,
component : SettingDialogContent
} ) ;
} , "showSetting" ) ;
return ( _ctx , _cache ) => {
return openBlock ( ) , createBlock ( SidebarIcon , {
icon : "pi pi-cog" ,
class : "comfy-settings-btn" ,
onClick : s howSetting ,
tooltip : _ctx . $t ( "settings" )
} , null , 8 , [ "tooltip" ] ) ;
} ;
}
} ) ;
2024-11-16 01:17:15 +00:00
const _sfc _main$n = /* @__PURE__ */ defineComponent ( {
2024-10-29 18:14:06 +00:00
_ _name : "ExtensionSlot" ,
props : {
extension : { }
} ,
setup ( _ _props ) {
const props = _ _props ;
const mountCustomExtension = /* @__PURE__ */ _ _name ( ( extension , el ) => {
extension . render ( el ) ;
} , "mountCustomExtension" ) ;
onBeforeUnmount ( ( ) => {
if ( props . extension . type === "custom" && props . extension . destroy ) {
props . extension . destroy ( ) ;
}
} ) ;
return ( _ctx , _cache ) => {
return _ctx . extension . type === "vue" ? ( openBlock ( ) , createBlock ( resolveDynamicComponent ( _ctx . extension . component ) , { key : 0 } ) ) : ( openBlock ( ) , createElementBlock ( "div" , {
key : 1 ,
ref : /* @__PURE__ */ _ _name ( ( el ) => {
if ( el )
mountCustomExtension (
props . extension ,
el
) ;
} , "ref" )
} , null , 512 ) ) ;
} ;
}
} ) ;
2024-11-16 01:17:15 +00:00
const _withScopeId$6 = /* @__PURE__ */ _ _name ( ( n ) => ( pushScopeId ( "data-v-e0812a25" ) , n = n ( ) , popScopeId ( ) , n ) , "_withScopeId$6" ) ;
const _hoisted _1$n = { class : "side-tool-bar-end" } ;
const _hoisted _2$k = {
2024-10-28 18:29:38 +00:00
key : 0 ,
class : "sidebar-content-container h-full overflow-y-auto overflow-x-hidden"
} ;
2024-11-16 01:17:15 +00:00
const _sfc _main$m = /* @__PURE__ */ defineComponent ( {
2024-10-28 18:29:38 +00:00
_ _name : "SideToolbar" ,
setup ( _ _props ) {
const workspaceStore = useWorkspaceStore ( ) ;
const settingStore = useSettingStore ( ) ;
const teleportTarget = computed (
( ) => settingStore . get ( "Comfy.Sidebar.Location" ) === "left" ? ".comfyui-body-left" : ".comfyui-body-right"
) ;
const isSmall = computed (
( ) => settingStore . get ( "Comfy.Sidebar.Size" ) === "small"
) ;
const tabs = computed ( ( ) => workspaceStore . getSidebarTabs ( ) ) ;
const selectedTab = computed ( ( ) => workspaceStore . sidebarTab . activeSidebarTab ) ;
const onTabClick = /* @__PURE__ */ _ _name ( ( item3 ) => {
workspaceStore . sidebarTab . toggleSidebarTab ( item3 . id ) ;
} , "onTabClick" ) ;
const keybindingStore = useKeybindingStore ( ) ;
const getTabTooltipSuffix = /* @__PURE__ */ _ _name ( ( tab ) => {
const keybinding = keybindingStore . getKeybindingByCommandId (
` Workspace.ToggleSidebarTab. ${ tab . id } `
) ;
return keybinding ? ` ( ${ keybinding . combo . toString ( ) } ) ` : "" ;
} , "getTabTooltipSuffix" ) ;
return ( _ctx , _cache ) => {
return openBlock ( ) , createElementBlock ( Fragment , null , [
( openBlock ( ) , createBlock ( Teleport , { to : teleportTarget . value } , [
createBaseVNode ( "nav" , {
class : normalizeClass ( "side-tool-bar-container" + ( isSmall . value ? " small-sidebar" : "" ) )
} , [
( openBlock ( true ) , createElementBlock ( Fragment , null , renderList ( tabs . value , ( tab ) => {
return openBlock ( ) , createBlock ( SidebarIcon , {
key : tab . id ,
icon : tab . icon ,
iconBadge : tab . iconBadge ,
tooltip : tab . tooltip + getTabTooltipSuffix ( tab ) ,
selected : tab . id === selectedTab . value ? . id ,
class : normalizeClass ( tab . id + "-tab-button" ) ,
onClick : /* @__PURE__ */ _ _name ( ( $event ) => onTabClick ( tab ) , "onClick" )
} , null , 8 , [ "icon" , "iconBadge" , "tooltip" , "selected" , "class" , "onClick" ] ) ;
} ) , 128 ) ) ,
2024-11-16 01:17:15 +00:00
createBaseVNode ( "div" , _hoisted _1$n , [
createVNode ( _sfc _main$p ) ,
createVNode ( _sfc _main$o )
2024-10-28 18:29:38 +00:00
] )
] , 2 )
] , 8 , [ "to" ] ) ) ,
2024-11-16 01:17:15 +00:00
selectedTab . value ? ( openBlock ( ) , createElementBlock ( "div" , _hoisted _2$k , [
createVNode ( _sfc _main$n , { extension : selectedTab . value } , null , 8 , [ "extension" ] )
2024-10-28 18:29:38 +00:00
] ) ) : createCommentVNode ( "" , true )
] , 64 ) ;
} ;
}
} ) ;
2024-11-16 01:17:15 +00:00
const SideToolbar = /* @__PURE__ */ _export _sfc ( _sfc _main$m , [ [ "__scopeId" , "data-v-e0812a25" ] ] ) ;
2024-10-29 18:14:06 +00:00
var classes$a = {
root : "p-tablist" ,
content : /* @__PURE__ */ _ _name ( function content ( _ref ) {
var instance = _ref . instance ;
return [ "p-tablist-content" , {
"p-tablist-viewport" : instance . $pcTabs . scrollable
} ] ;
} , "content" ) ,
tabList : "p-tablist-tab-list" ,
activeBar : "p-tablist-active-bar" ,
prevButton : "p-tablist-prev-button p-tablist-nav-button" ,
nextButton : "p-tablist-next-button p-tablist-nav-button"
} ;
var TabListStyle = BaseStyle . extend ( {
name : "tablist" ,
classes : classes$a
} ) ;
var script$1$a = {
name : "BaseTabList" ,
"extends" : script$g ,
props : { } ,
style : TabListStyle ,
provide : /* @__PURE__ */ _ _name ( function provide3 ( ) {
return {
$pcTabList : this ,
$parentInstance : this
} ;
} , "provide" )
} ;
var script$c = {
name : "TabList" ,
"extends" : script$1$a ,
inheritAttrs : false ,
inject : [ "$pcTabs" ] ,
data : /* @__PURE__ */ _ _name ( function data ( ) {
return {
isPrevButtonEnabled : false ,
isNextButtonEnabled : true
} ;
} , "data" ) ,
resizeObserver : void 0 ,
watch : {
showNavigators : /* @__PURE__ */ _ _name ( function showNavigators ( newValue ) {
newValue ? this . bindResizeObserver ( ) : this . unbindResizeObserver ( ) ;
} , "showNavigators" ) ,
activeValue : {
flush : "post" ,
handler : /* @__PURE__ */ _ _name ( function handler ( ) {
this . updateInkBar ( ) ;
} , "handler" )
}
} ,
mounted : /* @__PURE__ */ _ _name ( function mounted ( ) {
var _this = this ;
this . $nextTick ( function ( ) {
_this . updateInkBar ( ) ;
} ) ;
if ( this . showNavigators ) {
this . updateButtonState ( ) ;
this . bindResizeObserver ( ) ;
}
} , "mounted" ) ,
updated : /* @__PURE__ */ _ _name ( function updated ( ) {
this . showNavigators && this . updateButtonState ( ) ;
} , "updated" ) ,
beforeUnmount : /* @__PURE__ */ _ _name ( function beforeUnmount ( ) {
this . unbindResizeObserver ( ) ;
} , "beforeUnmount" ) ,
methods : {
onScroll : /* @__PURE__ */ _ _name ( function onScroll ( event ) {
this . showNavigators && this . updateButtonState ( ) ;
event . preventDefault ( ) ;
} , "onScroll" ) ,
onPrevButtonClick : /* @__PURE__ */ _ _name ( function onPrevButtonClick ( ) {
var content2 = this . $refs . content ;
var width = getWidth ( content2 ) ;
var pos = content2 . scrollLeft - width ;
content2 . scrollLeft = pos <= 0 ? 0 : pos ;
} , "onPrevButtonClick" ) ,
onNextButtonClick : /* @__PURE__ */ _ _name ( function onNextButtonClick ( ) {
var content2 = this . $refs . content ;
var width = getWidth ( content2 ) - this . getVisibleButtonWidths ( ) ;
var pos = content2 . scrollLeft + width ;
var lastPos = content2 . scrollWidth - width ;
content2 . scrollLeft = pos >= lastPos ? lastPos : pos ;
} , "onNextButtonClick" ) ,
bindResizeObserver : /* @__PURE__ */ _ _name ( function bindResizeObserver ( ) {
var _this2 = this ;
this . resizeObserver = new ResizeObserver ( function ( ) {
return _this2 . updateButtonState ( ) ;
} ) ;
this . resizeObserver . observe ( this . $refs . list ) ;
} , "bindResizeObserver" ) ,
unbindResizeObserver : /* @__PURE__ */ _ _name ( function unbindResizeObserver ( ) {
var _this$resizeObserver ;
( _this$resizeObserver = this . resizeObserver ) === null || _this$resizeObserver === void 0 || _this$resizeObserver . unobserve ( this . $refs . list ) ;
this . resizeObserver = void 0 ;
} , "unbindResizeObserver" ) ,
updateInkBar : /* @__PURE__ */ _ _name ( function updateInkBar ( ) {
var _this$$refs = this . $refs , content2 = _this$$refs . content , inkbar = _this$$refs . inkbar , tabs = _this$$refs . tabs ;
var activeTab = findSingle ( content2 , '[data-pc-name="tab"][data-p-active="true"]' ) ;
if ( this . $pcTabs . isVertical ( ) ) {
inkbar . style . height = getOuterHeight ( activeTab ) + "px" ;
inkbar . style . top = getOffset ( activeTab ) . top - getOffset ( tabs ) . top + "px" ;
} else {
inkbar . style . width = getOuterWidth ( activeTab ) + "px" ;
inkbar . style . left = getOffset ( activeTab ) . left - getOffset ( tabs ) . left + "px" ;
}
} , "updateInkBar" ) ,
updateButtonState : /* @__PURE__ */ _ _name ( function updateButtonState ( ) {
var _this$$refs2 = this . $refs , list = _this$$refs2 . list , content2 = _this$$refs2 . content ;
var scrollLeft = content2 . scrollLeft , scrollTop = content2 . scrollTop , scrollWidth = content2 . scrollWidth , scrollHeight = content2 . scrollHeight , offsetWidth = content2 . offsetWidth , offsetHeight = content2 . offsetHeight ;
var _ref = [ getWidth ( content2 ) , getHeight ( content2 ) ] , width = _ref [ 0 ] , height = _ref [ 1 ] ;
if ( this . $pcTabs . isVertical ( ) ) {
this . isPrevButtonEnabled = scrollTop !== 0 ;
this . isNextButtonEnabled = list . offsetHeight >= offsetHeight && parseInt ( scrollTop ) !== scrollHeight - height ;
} else {
this . isPrevButtonEnabled = scrollLeft !== 0 ;
this . isNextButtonEnabled = list . offsetWidth >= offsetWidth && parseInt ( scrollLeft ) !== scrollWidth - width ;
}
} , "updateButtonState" ) ,
getVisibleButtonWidths : /* @__PURE__ */ _ _name ( function getVisibleButtonWidths ( ) {
var _this$$refs3 = this . $refs , prevBtn = _this$$refs3 . prevBtn , nextBtn = _this$$refs3 . nextBtn ;
return [ prevBtn , nextBtn ] . reduce ( function ( acc , el ) {
return el ? acc + getWidth ( el ) : acc ;
} , 0 ) ;
} , "getVisibleButtonWidths" )
} ,
computed : {
templates : /* @__PURE__ */ _ _name ( function templates ( ) {
return this . $pcTabs . $slots ;
} , "templates" ) ,
activeValue : /* @__PURE__ */ _ _name ( function activeValue ( ) {
return this . $pcTabs . d _value ;
} , "activeValue" ) ,
showNavigators : /* @__PURE__ */ _ _name ( function showNavigators2 ( ) {
return this . $pcTabs . scrollable && this . $pcTabs . showNavigators ;
} , "showNavigators" ) ,
prevButtonAriaLabel : /* @__PURE__ */ _ _name ( function prevButtonAriaLabel ( ) {
return this . $primevue . config . locale . aria ? this . $primevue . config . locale . aria . previous : void 0 ;
} , "prevButtonAriaLabel" ) ,
nextButtonAriaLabel : /* @__PURE__ */ _ _name ( function nextButtonAriaLabel ( ) {
return this . $primevue . config . locale . aria ? this . $primevue . config . locale . aria . next : void 0 ;
} , "nextButtonAriaLabel" )
} ,
components : {
ChevronLeftIcon : script$h ,
ChevronRightIcon : script$i
} ,
directives : {
ripple : Ripple
}
} ;
2024-11-16 01:17:15 +00:00
var _hoisted _1$m = [ "aria-label" , "tabindex" ] ;
var _hoisted _2$j = [ "aria-orientation" ] ;
var _hoisted _3$g = [ "aria-label" , "tabindex" ] ;
function render$i ( _ctx , _cache , $props , $setup , $data , $options ) {
2024-10-29 18:14:06 +00:00
var _directive _ripple = resolveDirective ( "ripple" ) ;
return openBlock ( ) , createElementBlock ( "div" , mergeProps ( {
ref : "list" ,
"class" : _ctx . cx ( "root" )
} , _ctx . ptmi ( "root" ) ) , [ $options . showNavigators && $data . isPrevButtonEnabled ? withDirectives ( ( openBlock ( ) , createElementBlock ( "button" , mergeProps ( {
key : 0 ,
ref : "prevButton" ,
"class" : _ctx . cx ( "prevButton" ) ,
"aria-label" : $options . prevButtonAriaLabel ,
tabindex : $options . $pcTabs . tabindex ,
onClick : _cache [ 0 ] || ( _cache [ 0 ] = function ( ) {
return $options . onPrevButtonClick && $options . onPrevButtonClick . apply ( $options , arguments ) ;
} )
} , _ctx . ptm ( "prevButton" ) , {
"data-pc-group-section" : "navigator"
} ) , [ ( openBlock ( ) , createBlock ( resolveDynamicComponent ( $options . templates . previcon || "ChevronLeftIcon" ) , mergeProps ( {
"aria-hidden" : "true"
2024-11-16 01:17:15 +00:00
} , _ctx . ptm ( "prevIcon" ) ) , null , 16 ) ) ] , 16 , _hoisted _1$m ) ) , [ [ _directive _ripple ] ] ) : createCommentVNode ( "" , true ) , createBaseVNode ( "div" , mergeProps ( {
2024-10-29 18:14:06 +00:00
ref : "content" ,
"class" : _ctx . cx ( "content" ) ,
onScroll : _cache [ 1 ] || ( _cache [ 1 ] = function ( ) {
return $options . onScroll && $options . onScroll . apply ( $options , arguments ) ;
} )
} , _ctx . ptm ( "content" ) ) , [ createBaseVNode ( "div" , mergeProps ( {
ref : "tabs" ,
"class" : _ctx . cx ( "tabList" ) ,
role : "tablist" ,
"aria-orientation" : $options . $pcTabs . orientation || "horizontal"
} , _ctx . ptm ( "tabList" ) ) , [ renderSlot ( _ctx . $slots , "default" ) , createBaseVNode ( "span" , mergeProps ( {
ref : "inkbar" ,
"class" : _ctx . cx ( "activeBar" ) ,
role : "presentation" ,
"aria-hidden" : "true"
2024-11-16 01:17:15 +00:00
} , _ctx . ptm ( "activeBar" ) ) , null , 16 ) ] , 16 , _hoisted _2$j ) ] , 16 ) , $options . showNavigators && $data . isNextButtonEnabled ? withDirectives ( ( openBlock ( ) , createElementBlock ( "button" , mergeProps ( {
2024-10-29 18:14:06 +00:00
key : 1 ,
ref : "nextButton" ,
"class" : _ctx . cx ( "nextButton" ) ,
"aria-label" : $options . nextButtonAriaLabel ,
tabindex : $options . $pcTabs . tabindex ,
onClick : _cache [ 2 ] || ( _cache [ 2 ] = function ( ) {
return $options . onNextButtonClick && $options . onNextButtonClick . apply ( $options , arguments ) ;
} )
} , _ctx . ptm ( "nextButton" ) , {
"data-pc-group-section" : "navigator"
} ) , [ ( openBlock ( ) , createBlock ( resolveDynamicComponent ( $options . templates . nexticon || "ChevronRightIcon" ) , mergeProps ( {
"aria-hidden" : "true"
2024-11-16 01:17:15 +00:00
} , _ctx . ptm ( "nextIcon" ) ) , null , 16 ) ) ] , 16 , _hoisted _3$g ) ) , [ [ _directive _ripple ] ] ) : createCommentVNode ( "" , true ) ] , 16 ) ;
2024-10-29 18:14:06 +00:00
}
2024-11-16 01:17:15 +00:00
_ _name ( render$i , "render$i" ) ;
script$c . render = render$i ;
2024-10-29 18:14:06 +00:00
var classes$9 = {
root : /* @__PURE__ */ _ _name ( function root ( _ref ) {
var instance = _ref . instance , props = _ref . props ;
return [ "p-tab" , {
"p-tab-active" : instance . active ,
"p-disabled" : props . disabled
} ] ;
} , "root" )
} ;
var TabStyle = BaseStyle . extend ( {
name : "tab" ,
classes : classes$9
} ) ;
var script$1$9 = {
name : "BaseTab" ,
"extends" : script$g ,
props : {
value : {
type : [ String , Number ] ,
"default" : void 0
} ,
disabled : {
type : Boolean ,
"default" : false
} ,
as : {
type : [ String , Object ] ,
"default" : "BUTTON"
} ,
asChild : {
type : Boolean ,
"default" : false
}
} ,
style : TabStyle ,
provide : /* @__PURE__ */ _ _name ( function provide4 ( ) {
return {
$pcTab : this ,
$parentInstance : this
} ;
} , "provide" )
} ;
var script$b = {
name : "Tab" ,
"extends" : script$1$9 ,
inheritAttrs : false ,
inject : [ "$pcTabs" , "$pcTabList" ] ,
methods : {
onFocus : /* @__PURE__ */ _ _name ( function onFocus ( ) {
this . $pcTabs . selectOnFocus && this . changeActiveValue ( ) ;
} , "onFocus" ) ,
onClick : /* @__PURE__ */ _ _name ( function onClick ( ) {
this . changeActiveValue ( ) ;
} , "onClick" ) ,
onKeydown : /* @__PURE__ */ _ _name ( function onKeydown ( event ) {
switch ( event . code ) {
case "ArrowRight" :
this . onArrowRightKey ( event ) ;
break ;
case "ArrowLeft" :
this . onArrowLeftKey ( event ) ;
break ;
case "Home" :
this . onHomeKey ( event ) ;
break ;
case "End" :
this . onEndKey ( event ) ;
break ;
case "PageDown" :
this . onPageDownKey ( event ) ;
break ;
case "PageUp" :
this . onPageUpKey ( event ) ;
break ;
case "Enter" :
case "NumpadEnter" :
case "Space" :
this . onEnterKey ( event ) ;
break ;
}
} , "onKeydown" ) ,
onArrowRightKey : /* @__PURE__ */ _ _name ( function onArrowRightKey ( event ) {
var nextTab = this . findNextTab ( event . currentTarget ) ;
nextTab ? this . changeFocusedTab ( event , nextTab ) : this . onHomeKey ( event ) ;
event . preventDefault ( ) ;
} , "onArrowRightKey" ) ,
onArrowLeftKey : /* @__PURE__ */ _ _name ( function onArrowLeftKey ( event ) {
var prevTab = this . findPrevTab ( event . currentTarget ) ;
prevTab ? this . changeFocusedTab ( event , prevTab ) : this . onEndKey ( event ) ;
event . preventDefault ( ) ;
} , "onArrowLeftKey" ) ,
onHomeKey : /* @__PURE__ */ _ _name ( function onHomeKey ( event ) {
var firstTab = this . findFirstTab ( ) ;
this . changeFocusedTab ( event , firstTab ) ;
event . preventDefault ( ) ;
} , "onHomeKey" ) ,
onEndKey : /* @__PURE__ */ _ _name ( function onEndKey ( event ) {
var lastTab = this . findLastTab ( ) ;
this . changeFocusedTab ( event , lastTab ) ;
event . preventDefault ( ) ;
} , "onEndKey" ) ,
onPageDownKey : /* @__PURE__ */ _ _name ( function onPageDownKey ( event ) {
this . scrollInView ( this . findLastTab ( ) ) ;
event . preventDefault ( ) ;
} , "onPageDownKey" ) ,
onPageUpKey : /* @__PURE__ */ _ _name ( function onPageUpKey ( event ) {
this . scrollInView ( this . findFirstTab ( ) ) ;
event . preventDefault ( ) ;
} , "onPageUpKey" ) ,
onEnterKey : /* @__PURE__ */ _ _name ( function onEnterKey ( event ) {
this . changeActiveValue ( ) ;
event . preventDefault ( ) ;
} , "onEnterKey" ) ,
findNextTab : /* @__PURE__ */ _ _name ( function findNextTab ( tabElement ) {
var selfCheck = arguments . length > 1 && arguments [ 1 ] !== void 0 ? arguments [ 1 ] : false ;
var element = selfCheck ? tabElement : tabElement . nextElementSibling ;
return element ? getAttribute ( element , "data-p-disabled" ) || getAttribute ( element , "data-pc-section" ) === "inkbar" ? this . findNextTab ( element ) : findSingle ( element , '[data-pc-name="tab"]' ) : null ;
} , "findNextTab" ) ,
findPrevTab : /* @__PURE__ */ _ _name ( function findPrevTab ( tabElement ) {
var selfCheck = arguments . length > 1 && arguments [ 1 ] !== void 0 ? arguments [ 1 ] : false ;
var element = selfCheck ? tabElement : tabElement . previousElementSibling ;
return element ? getAttribute ( element , "data-p-disabled" ) || getAttribute ( element , "data-pc-section" ) === "inkbar" ? this . findPrevTab ( element ) : findSingle ( element , '[data-pc-name="tab"]' ) : null ;
} , "findPrevTab" ) ,
findFirstTab : /* @__PURE__ */ _ _name ( function findFirstTab ( ) {
return this . findNextTab ( this . $pcTabList . $refs . content . firstElementChild , true ) ;
} , "findFirstTab" ) ,
findLastTab : /* @__PURE__ */ _ _name ( function findLastTab ( ) {
return this . findPrevTab ( this . $pcTabList . $refs . content . lastElementChild , true ) ;
} , "findLastTab" ) ,
changeActiveValue : /* @__PURE__ */ _ _name ( function changeActiveValue ( ) {
this . $pcTabs . updateValue ( this . value ) ;
} , "changeActiveValue" ) ,
changeFocusedTab : /* @__PURE__ */ _ _name ( function changeFocusedTab ( event , element ) {
focus ( element ) ;
this . scrollInView ( element ) ;
} , "changeFocusedTab" ) ,
scrollInView : /* @__PURE__ */ _ _name ( function scrollInView ( element ) {
var _element$scrollIntoVi ;
element === null || element === void 0 || ( _element$scrollIntoVi = element . scrollIntoView ) === null || _element$scrollIntoVi === void 0 || _element$scrollIntoVi . call ( element , {
block : "nearest"
} ) ;
} , "scrollInView" )
} ,
computed : {
active : /* @__PURE__ */ _ _name ( function active ( ) {
var _this$$pcTabs ;
return equals ( ( _this$$pcTabs = this . $pcTabs ) === null || _this$$pcTabs === void 0 ? void 0 : _this$$pcTabs . d _value , this . value ) ;
} , "active" ) ,
id : /* @__PURE__ */ _ _name ( function id ( ) {
var _this$$pcTabs2 ;
return "" . concat ( ( _this$$pcTabs2 = this . $pcTabs ) === null || _this$$pcTabs2 === void 0 ? void 0 : _this$$pcTabs2 . id , "_tab_" ) . concat ( this . value ) ;
} , "id" ) ,
ariaControls : /* @__PURE__ */ _ _name ( function ariaControls ( ) {
var _this$$pcTabs3 ;
return "" . concat ( ( _this$$pcTabs3 = this . $pcTabs ) === null || _this$$pcTabs3 === void 0 ? void 0 : _this$$pcTabs3 . id , "_tabpanel_" ) . concat ( this . value ) ;
} , "ariaControls" ) ,
attrs : /* @__PURE__ */ _ _name ( function attrs ( ) {
return mergeProps ( this . asAttrs , this . a11yAttrs , this . ptmi ( "root" , this . ptParams ) ) ;
} , "attrs" ) ,
asAttrs : /* @__PURE__ */ _ _name ( function asAttrs ( ) {
return this . as === "BUTTON" ? {
type : "button" ,
disabled : this . disabled
} : void 0 ;
} , "asAttrs" ) ,
a11yAttrs : /* @__PURE__ */ _ _name ( function a11yAttrs ( ) {
return {
id : this . id ,
tabindex : this . active ? this . $pcTabs . tabindex : - 1 ,
role : "tab" ,
"aria-selected" : this . active ,
"aria-controls" : this . ariaControls ,
"data-pc-name" : "tab" ,
"data-p-disabled" : this . disabled ,
"data-p-active" : this . active ,
onFocus : this . onFocus ,
onKeydown : this . onKeydown
} ;
} , "a11yAttrs" ) ,
ptParams : /* @__PURE__ */ _ _name ( function ptParams ( ) {
return {
context : {
active : this . active
}
} ;
} , "ptParams" )
} ,
directives : {
ripple : Ripple
}
} ;
2024-11-16 01:17:15 +00:00
function render$h ( _ctx , _cache , $props , $setup , $data , $options ) {
2024-10-29 18:14:06 +00:00
var _directive _ripple = resolveDirective ( "ripple" ) ;
return ! _ctx . asChild ? withDirectives ( ( openBlock ( ) , createBlock ( resolveDynamicComponent ( _ctx . as ) , mergeProps ( {
key : 0 ,
"class" : _ctx . cx ( "root" ) ,
onClick : $options . onClick
} , $options . attrs ) , {
"default" : withCtx ( function ( ) {
return [ renderSlot ( _ctx . $slots , "default" ) ] ;
} ) ,
_ : 3
} , 16 , [ "class" , "onClick" ] ) ) , [ [ _directive _ripple ] ] ) : renderSlot ( _ctx . $slots , "default" , {
key : 1 ,
"class" : normalizeClass ( _ctx . cx ( "root" ) ) ,
active : $options . active ,
a11yAttrs : $options . a11yAttrs ,
onClick : $options . onClick
} ) ;
}
2024-11-16 01:17:15 +00:00
_ _name ( render$h , "render$h" ) ;
script$b . render = render$h ;
const _hoisted _1$l = { class : "flex flex-col h-full" } ;
const _hoisted _2$i = { class : "w-full flex justify-between" } ;
const _hoisted _3$f = { class : "tabs-container" } ;
2024-10-29 18:14:06 +00:00
const _hoisted _4$5 = { class : "font-bold" } ;
const _hoisted _5$4 = { class : "flex-grow h-0" } ;
2024-11-16 01:17:15 +00:00
const _sfc _main$l = /* @__PURE__ */ defineComponent ( {
2024-10-29 18:14:06 +00:00
_ _name : "BottomPanel" ,
setup ( _ _props ) {
const bottomPanelStore = useBottomPanelStore ( ) ;
return ( _ctx , _cache ) => {
2024-11-16 01:17:15 +00:00
return openBlock ( ) , createElementBlock ( "div" , _hoisted _1$l , [
2024-10-29 18:14:06 +00:00
createVNode ( unref ( script$j ) , {
value : unref ( bottomPanelStore ) . activeBottomPanelTabId ,
"onUpdate:value" : _cache [ 1 ] || ( _cache [ 1 ] = ( $event ) => unref ( bottomPanelStore ) . activeBottomPanelTabId = $event )
} , {
default : withCtx ( ( ) => [
createVNode ( unref ( script$c ) , { "pt:tabList" : "border-none" } , {
default : withCtx ( ( ) => [
2024-11-16 01:17:15 +00:00
createBaseVNode ( "div" , _hoisted _2$i , [
createBaseVNode ( "div" , _hoisted _3$f , [
2024-10-29 18:14:06 +00:00
( openBlock ( true ) , createElementBlock ( Fragment , null , renderList ( unref ( bottomPanelStore ) . bottomPanelTabs , ( tab ) => {
return openBlock ( ) , createBlock ( unref ( script$b ) , {
key : tab . id ,
value : tab . id ,
class : "p-3 border-none"
} , {
default : withCtx ( ( ) => [
createBaseVNode ( "span" , _hoisted _4$5 , toDisplayString ( tab . title . toUpperCase ( ) ) , 1 )
] ) ,
_ : 2
} , 1032 , [ "value" ] ) ;
} ) , 128 ) )
] ) ,
createVNode ( unref ( script$f ) , {
class : "justify-self-end" ,
icon : "pi pi-times" ,
severity : "secondary" ,
size : "small" ,
text : "" ,
onClick : _cache [ 0 ] || ( _cache [ 0 ] = ( $event ) => unref ( bottomPanelStore ) . bottomPanelVisible = false )
} )
] )
] ) ,
_ : 1
} )
] ) ,
_ : 1
} , 8 , [ "value" ] ) ,
createBaseVNode ( "div" , _hoisted _5$4 , [
2024-11-16 01:17:15 +00:00
unref ( bottomPanelStore ) . bottomPanelVisible && unref ( bottomPanelStore ) . activeBottomPanelTab ? ( openBlock ( ) , createBlock ( _sfc _main$n , {
2024-10-29 18:14:06 +00:00
key : 0 ,
extension : unref ( bottomPanelStore ) . activeBottomPanelTab
} , null , 8 , [ "extension" ] ) ) : createCommentVNode ( "" , true )
] )
] ) ;
} ;
}
} ) ;
2024-10-28 18:29:38 +00:00
var theme$7 = /* @__PURE__ */ _ _name ( function theme2 ( _ref ) {
var dt = _ref . dt ;
return "\n.p-splitter {\n display: flex;\n flex-wrap: nowrap;\n border: 1px solid " . concat ( dt ( "splitter.border.color" ) , ";\n background: " ) . concat ( dt ( "splitter.background" ) , ";\n border-radius: " ) . concat ( dt ( "border.radius.md" ) , ";\n color: " ) . concat ( dt ( "splitter.color" ) , ";\n}\n\n.p-splitter-vertical {\n flex-direction: column;\n}\n\n.p-splitter-gutter {\n flex-grow: 0;\n flex-shrink: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 1;\n background: " ) . concat ( dt ( "splitter.gutter.background" ) , ";\n}\n\n.p-splitter-gutter-handle {\n border-radius: " ) . concat ( dt ( "splitter.handle.border.radius" ) , ";\n background: " ) . concat ( dt ( "splitter.handle.background" ) , ";\n transition: outline-color " ) . concat ( dt ( "splitter.transition.duration" ) , ", box-shadow " ) . concat ( dt ( "splitter.transition.duration" ) , ";\n outline-color: transparent;\n}\n\n.p-splitter-gutter-handle:focus-visible {\n box-shadow: " ) . concat ( dt ( "splitter.handle.focus.ring.shadow" ) , ";\n outline: " ) . concat ( dt ( "splitter.handle.focus.ring.width" ) , " " ) . concat ( dt ( "splitter.handle.focus.ring.style" ) , " " ) . concat ( dt ( "splitter.handle.focus.ring.color" ) , ";\n outline-offset: " ) . concat ( dt ( "splitter.handle.focus.ring.offset" ) , ";\n}\n\n.p-splitter-horizontal.p-splitter-resizing {\n cursor: col-resize;\n user-select: none;\n}\n\n.p-splitter-vertical.p-splitter-resizing {\n cursor: row-resize;\n user-select: none;\n}\n\n.p-splitter-horizontal > .p-splitter-gutter > .p-splitter-gutter-handle {\n height: " ) . concat ( dt ( "splitter.handle.size" ) , ";\n width: 100%;\n}\n\n.p-splitter-vertical > .p-splitter-gutter > .p-splitter-gutter-handle {\n width: " ) . concat ( dt ( "splitter.handle.size" ) , ";\n height: 100%;\n}\n\n.p-splitter-horizontal > .p-splitter-gutter {\n cursor: col-resize;\n}\n\n.p-splitter-vertical > .p-splitter-gutter {\n cursor: row-resize;\n}\n\n.p-splitterpanel {\n flex-grow: 1;\n overflow: hidden;\n}\n\n.p-splitterpanel-nested {\n display: flex;\n}\n\n.p-splitterpanel .p-splitter {\n flex-grow: 1;\n border: 0 none;\n}\n" ) ;
} , "theme" ) ;
var classes$8 = {
2024-10-29 18:14:06 +00:00
root : /* @__PURE__ */ _ _name ( function root2 ( _ref2 ) {
2024-10-28 18:29:38 +00:00
var props = _ref2 . props ;
return [ "p-splitter p-component" , "p-splitter-" + props . layout ] ;
} , "root" ) ,
gutter : "p-splitter-gutter" ,
gutterHandle : "p-splitter-gutter-handle"
} ;
var inlineStyles$4 = {
2024-10-29 18:14:06 +00:00
root : /* @__PURE__ */ _ _name ( function root3 ( _ref3 ) {
2024-10-28 18:29:38 +00:00
var props = _ref3 . props ;
return [ {
display : "flex" ,
"flex-wrap" : "nowrap"
} , props . layout === "vertical" ? {
"flex-direction" : "column"
} : "" ] ;
} , "root" )
} ;
var SplitterStyle = BaseStyle . extend ( {
name : "splitter" ,
theme : theme$7 ,
classes : classes$8 ,
inlineStyles : inlineStyles$4
} ) ;
var script$1$8 = {
name : "BaseSplitter" ,
2024-10-29 18:14:06 +00:00
"extends" : script$g ,
2024-10-28 18:29:38 +00:00
props : {
layout : {
type : String ,
"default" : "horizontal"
} ,
gutterSize : {
type : Number ,
"default" : 4
} ,
stateKey : {
type : String ,
"default" : null
} ,
stateStorage : {
type : String ,
"default" : "session"
} ,
step : {
type : Number ,
"default" : 5
}
} ,
style : SplitterStyle ,
2024-10-29 18:14:06 +00:00
provide : /* @__PURE__ */ _ _name ( function provide5 ( ) {
2024-10-28 18:29:38 +00:00
return {
$pcSplitter : this ,
$parentInstance : this
} ;
} , "provide" )
} ;
function _toConsumableArray$2 ( r ) {
return _arrayWithoutHoles$2 ( r ) || _iterableToArray$2 ( r ) || _unsupportedIterableToArray$2 ( r ) || _nonIterableSpread$2 ( ) ;
}
_ _name ( _toConsumableArray$2 , "_toConsumableArray$2" ) ;
function _nonIterableSpread$2 ( ) {
throw new TypeError ( "Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method." ) ;
}
_ _name ( _nonIterableSpread$2 , "_nonIterableSpread$2" ) ;
function _unsupportedIterableToArray$2 ( r , a ) {
if ( r ) {
if ( "string" == typeof r ) return _arrayLikeToArray$2 ( r , a ) ;
var t = { } . toString . call ( r ) . slice ( 8 , - 1 ) ;
return "Object" === t && r . constructor && ( t = r . constructor . name ) , "Map" === t || "Set" === t ? Array . from ( r ) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/ . test ( t ) ? _arrayLikeToArray$2 ( r , a ) : void 0 ;
}
}
_ _name ( _unsupportedIterableToArray$2 , "_unsupportedIterableToArray$2" ) ;
function _iterableToArray$2 ( r ) {
if ( "undefined" != typeof Symbol && null != r [ Symbol . iterator ] || null != r [ "@@iterator" ] ) return Array . from ( r ) ;
}
_ _name ( _iterableToArray$2 , "_iterableToArray$2" ) ;
function _arrayWithoutHoles$2 ( r ) {
if ( Array . isArray ( r ) ) return _arrayLikeToArray$2 ( r ) ;
}
_ _name ( _arrayWithoutHoles$2 , "_arrayWithoutHoles$2" ) ;
function _arrayLikeToArray$2 ( r , a ) {
( null == a || a > r . length ) && ( a = r . length ) ;
for ( var e = 0 , n = Array ( a ) ; e < a ; e ++ ) n [ e ] = r [ e ] ;
return n ;
}
_ _name ( _arrayLikeToArray$2 , "_arrayLikeToArray$2" ) ;
var script$a = {
name : "Splitter" ,
"extends" : script$1$8 ,
inheritAttrs : false ,
emits : [ "resizestart" , "resizeend" , "resize" ] ,
dragging : false ,
mouseMoveListener : null ,
mouseUpListener : null ,
touchMoveListener : null ,
touchEndListener : null ,
size : null ,
gutterElement : null ,
startPos : null ,
prevPanelElement : null ,
nextPanelElement : null ,
nextPanelSize : null ,
prevPanelSize : null ,
panelSizes : null ,
prevPanelIndex : null ,
timer : null ,
2024-10-29 18:14:06 +00:00
data : /* @__PURE__ */ _ _name ( function data2 ( ) {
2024-10-28 18:29:38 +00:00
return {
prevSize : null
} ;
} , "data" ) ,
2024-10-29 18:14:06 +00:00
mounted : /* @__PURE__ */ _ _name ( function mounted2 ( ) {
2024-10-28 18:29:38 +00:00
var _this = this ;
if ( this . panels && this . panels . length ) {
var initialized = false ;
if ( this . isStateful ( ) ) {
initialized = this . restoreState ( ) ;
}
if ( ! initialized ) {
var children = _toConsumableArray$2 ( this . $el . children ) . filter ( function ( child ) {
return child . getAttribute ( "data-pc-name" ) === "splitterpanel" ;
} ) ;
var _panelSizes = [ ] ;
this . panels . map ( function ( panel , i ) {
var panelInitialSize = panel . props && panel . props . size ? panel . props . size : null ;
var panelSize = panelInitialSize || 100 / _this . panels . length ;
_panelSizes [ i ] = panelSize ;
children [ i ] . style . flexBasis = "calc(" + panelSize + "% - " + ( _this . panels . length - 1 ) * _this . gutterSize + "px)" ;
} ) ;
this . panelSizes = _panelSizes ;
this . prevSize = parseFloat ( _panelSizes [ 0 ] ) . toFixed ( 4 ) ;
}
}
} , "mounted" ) ,
2024-10-29 18:14:06 +00:00
beforeUnmount : /* @__PURE__ */ _ _name ( function beforeUnmount2 ( ) {
2024-10-28 18:29:38 +00:00
this . clear ( ) ;
this . unbindMouseListeners ( ) ;
} , "beforeUnmount" ) ,
methods : {
isSplitterPanel : /* @__PURE__ */ _ _name ( function isSplitterPanel ( child ) {
return child . type . name === "SplitterPanel" ;
} , "isSplitterPanel" ) ,
onResizeStart : /* @__PURE__ */ _ _name ( function onResizeStart ( event , index , isKeyDown ) {
this . gutterElement = event . currentTarget || event . target . parentElement ;
this . size = this . horizontal ? getWidth ( this . $el ) : getHeight ( this . $el ) ;
if ( ! isKeyDown ) {
this . dragging = true ;
this . startPos = this . layout === "horizontal" ? event . pageX || event . changedTouches [ 0 ] . pageX : event . pageY || event . changedTouches [ 0 ] . pageY ;
}
this . prevPanelElement = this . gutterElement . previousElementSibling ;
this . nextPanelElement = this . gutterElement . nextElementSibling ;
if ( isKeyDown ) {
this . prevPanelSize = this . horizontal ? getOuterWidth ( this . prevPanelElement , true ) : getOuterHeight ( this . prevPanelElement , true ) ;
this . nextPanelSize = this . horizontal ? getOuterWidth ( this . nextPanelElement , true ) : getOuterHeight ( this . nextPanelElement , true ) ;
} else {
this . prevPanelSize = 100 * ( this . horizontal ? getOuterWidth ( this . prevPanelElement , true ) : getOuterHeight ( this . prevPanelElement , true ) ) / this . size ;
this . nextPanelSize = 100 * ( this . horizontal ? getOuterWidth ( this . nextPanelElement , true ) : getOuterHeight ( this . nextPanelElement , true ) ) / this . size ;
}
this . prevPanelIndex = index ;
this . $emit ( "resizestart" , {
originalEvent : event ,
sizes : this . panelSizes
} ) ;
this . $refs . gutter [ index ] . setAttribute ( "data-p-gutter-resizing" , true ) ;
this . $el . setAttribute ( "data-p-resizing" , true ) ;
} , "onResizeStart" ) ,
onResize : /* @__PURE__ */ _ _name ( function onResize ( event , step , isKeyDown ) {
var newPos , newPrevPanelSize , newNextPanelSize ;
if ( isKeyDown ) {
if ( this . horizontal ) {
newPrevPanelSize = 100 * ( this . prevPanelSize + step ) / this . size ;
newNextPanelSize = 100 * ( this . nextPanelSize - step ) / this . size ;
} else {
newPrevPanelSize = 100 * ( this . prevPanelSize - step ) / this . size ;
newNextPanelSize = 100 * ( this . nextPanelSize + step ) / this . size ;
}
} else {
if ( this . horizontal ) newPos = event . pageX * 100 / this . size - this . startPos * 100 / this . size ;
else newPos = event . pageY * 100 / this . size - this . startPos * 100 / this . size ;
newPrevPanelSize = this . prevPanelSize + newPos ;
newNextPanelSize = this . nextPanelSize - newPos ;
}
if ( this . validateResize ( newPrevPanelSize , newNextPanelSize ) ) {
this . prevPanelElement . style . flexBasis = "calc(" + newPrevPanelSize + "% - " + ( this . panels . length - 1 ) * this . gutterSize + "px)" ;
this . nextPanelElement . style . flexBasis = "calc(" + newNextPanelSize + "% - " + ( this . panels . length - 1 ) * this . gutterSize + "px)" ;
this . panelSizes [ this . prevPanelIndex ] = newPrevPanelSize ;
this . panelSizes [ this . prevPanelIndex + 1 ] = newNextPanelSize ;
this . prevSize = parseFloat ( newPrevPanelSize ) . toFixed ( 4 ) ;
}
this . $emit ( "resize" , {
originalEvent : event ,
sizes : this . panelSizes
} ) ;
} , "onResize" ) ,
onResizeEnd : /* @__PURE__ */ _ _name ( function onResizeEnd ( event ) {
if ( this . isStateful ( ) ) {
this . saveState ( ) ;
}
this . $emit ( "resizeend" , {
originalEvent : event ,
sizes : this . panelSizes
} ) ;
this . $refs . gutter . forEach ( function ( gutter ) {
return gutter . setAttribute ( "data-p-gutter-resizing" , false ) ;
} ) ;
this . $el . setAttribute ( "data-p-resizing" , false ) ;
this . clear ( ) ;
} , "onResizeEnd" ) ,
repeat : /* @__PURE__ */ _ _name ( function repeat ( event , index , step ) {
this . onResizeStart ( event , index , true ) ;
this . onResize ( event , step , true ) ;
} , "repeat" ) ,
setTimer : /* @__PURE__ */ _ _name ( function setTimer ( event , index , step ) {
var _this2 = this ;
if ( ! this . timer ) {
this . timer = setInterval ( function ( ) {
_this2 . repeat ( event , index , step ) ;
} , 40 ) ;
}
} , "setTimer" ) ,
clearTimer : /* @__PURE__ */ _ _name ( function clearTimer ( ) {
if ( this . timer ) {
clearInterval ( this . timer ) ;
this . timer = null ;
}
} , "clearTimer" ) ,
onGutterKeyUp : /* @__PURE__ */ _ _name ( function onGutterKeyUp ( ) {
this . clearTimer ( ) ;
this . onResizeEnd ( ) ;
} , "onGutterKeyUp" ) ,
onGutterKeyDown : /* @__PURE__ */ _ _name ( function onGutterKeyDown ( event , index ) {
switch ( event . code ) {
case "ArrowLeft" : {
if ( this . layout === "horizontal" ) {
this . setTimer ( event , index , this . step * - 1 ) ;
}
event . preventDefault ( ) ;
break ;
}
case "ArrowRight" : {
if ( this . layout === "horizontal" ) {
this . setTimer ( event , index , this . step ) ;
}
event . preventDefault ( ) ;
break ;
}
case "ArrowDown" : {
if ( this . layout === "vertical" ) {
this . setTimer ( event , index , this . step * - 1 ) ;
}
event . preventDefault ( ) ;
break ;
}
case "ArrowUp" : {
if ( this . layout === "vertical" ) {
this . setTimer ( event , index , this . step ) ;
}
event . preventDefault ( ) ;
break ;
}
}
} , "onGutterKeyDown" ) ,
onGutterMouseDown : /* @__PURE__ */ _ _name ( function onGutterMouseDown ( event , index ) {
this . onResizeStart ( event , index ) ;
this . bindMouseListeners ( ) ;
} , "onGutterMouseDown" ) ,
onGutterTouchStart : /* @__PURE__ */ _ _name ( function onGutterTouchStart ( event , index ) {
this . onResizeStart ( event , index ) ;
this . bindTouchListeners ( ) ;
event . preventDefault ( ) ;
} , "onGutterTouchStart" ) ,
onGutterTouchMove : /* @__PURE__ */ _ _name ( function onGutterTouchMove ( event ) {
this . onResize ( event ) ;
event . preventDefault ( ) ;
} , "onGutterTouchMove" ) ,
onGutterTouchEnd : /* @__PURE__ */ _ _name ( function onGutterTouchEnd ( event ) {
this . onResizeEnd ( event ) ;
this . unbindTouchListeners ( ) ;
event . preventDefault ( ) ;
} , "onGutterTouchEnd" ) ,
bindMouseListeners : /* @__PURE__ */ _ _name ( function bindMouseListeners ( ) {
var _this3 = this ;
if ( ! this . mouseMoveListener ) {
this . mouseMoveListener = function ( event ) {
return _this3 . onResize ( event ) ;
} ;
document . addEventListener ( "mousemove" , this . mouseMoveListener ) ;
}
if ( ! this . mouseUpListener ) {
this . mouseUpListener = function ( event ) {
_this3 . onResizeEnd ( event ) ;
_this3 . unbindMouseListeners ( ) ;
} ;
document . addEventListener ( "mouseup" , this . mouseUpListener ) ;
}
} , "bindMouseListeners" ) ,
bindTouchListeners : /* @__PURE__ */ _ _name ( function bindTouchListeners ( ) {
var _this4 = this ;
if ( ! this . touchMoveListener ) {
this . touchMoveListener = function ( event ) {
return _this4 . onResize ( event . changedTouches [ 0 ] ) ;
} ;
document . addEventListener ( "touchmove" , this . touchMoveListener ) ;
}
if ( ! this . touchEndListener ) {
this . touchEndListener = function ( event ) {
_this4 . resizeEnd ( event ) ;
_this4 . unbindTouchListeners ( ) ;
} ;
document . addEventListener ( "touchend" , this . touchEndListener ) ;
}
} , "bindTouchListeners" ) ,
validateResize : /* @__PURE__ */ _ _name ( function validateResize ( newPrevPanelSize , newNextPanelSize ) {
if ( newPrevPanelSize > 100 || newPrevPanelSize < 0 ) return false ;
if ( newNextPanelSize > 100 || newNextPanelSize < 0 ) return false ;
var prevPanelMinSize = getVNodeProp ( this . panels [ this . prevPanelIndex ] , "minSize" ) ;
if ( this . panels [ this . prevPanelIndex ] . props && prevPanelMinSize && prevPanelMinSize > newPrevPanelSize ) {
return false ;
}
var newPanelMinSize = getVNodeProp ( this . panels [ this . prevPanelIndex + 1 ] , "minSize" ) ;
if ( this . panels [ this . prevPanelIndex + 1 ] . props && newPanelMinSize && newPanelMinSize > newNextPanelSize ) {
return false ;
}
return true ;
} , "validateResize" ) ,
unbindMouseListeners : /* @__PURE__ */ _ _name ( function unbindMouseListeners ( ) {
if ( this . mouseMoveListener ) {
document . removeEventListener ( "mousemove" , this . mouseMoveListener ) ;
this . mouseMoveListener = null ;
}
if ( this . mouseUpListener ) {
document . removeEventListener ( "mouseup" , this . mouseUpListener ) ;
this . mouseUpListener = null ;
}
} , "unbindMouseListeners" ) ,
unbindTouchListeners : /* @__PURE__ */ _ _name ( function unbindTouchListeners ( ) {
if ( this . touchMoveListener ) {
document . removeEventListener ( "touchmove" , this . touchMoveListener ) ;
this . touchMoveListener = null ;
}
if ( this . touchEndListener ) {
document . removeEventListener ( "touchend" , this . touchEndListener ) ;
this . touchEndListener = null ;
}
} , "unbindTouchListeners" ) ,
clear : /* @__PURE__ */ _ _name ( function clear ( ) {
this . dragging = false ;
this . size = null ;
this . startPos = null ;
this . prevPanelElement = null ;
this . nextPanelElement = null ;
this . prevPanelSize = null ;
this . nextPanelSize = null ;
this . gutterElement = null ;
this . prevPanelIndex = null ;
} , "clear" ) ,
isStateful : /* @__PURE__ */ _ _name ( function isStateful ( ) {
return this . stateKey != null ;
} , "isStateful" ) ,
getStorage : /* @__PURE__ */ _ _name ( function getStorage ( ) {
switch ( this . stateStorage ) {
case "local" :
return window . localStorage ;
case "session" :
return window . sessionStorage ;
default :
throw new Error ( this . stateStorage + ' is not a valid value for the state storage, supported values are "local" and "session".' ) ;
}
} , "getStorage" ) ,
saveState : /* @__PURE__ */ _ _name ( function saveState ( ) {
if ( isArray ( this . panelSizes ) ) {
this . getStorage ( ) . setItem ( this . stateKey , JSON . stringify ( this . panelSizes ) ) ;
}
} , "saveState" ) ,
restoreState : /* @__PURE__ */ _ _name ( function restoreState ( ) {
var _this5 = this ;
var storage = this . getStorage ( ) ;
var stateString = storage . getItem ( this . stateKey ) ;
if ( stateString ) {
this . panelSizes = JSON . parse ( stateString ) ;
var children = _toConsumableArray$2 ( this . $el . children ) . filter ( function ( child ) {
return child . getAttribute ( "data-pc-name" ) === "splitterpanel" ;
} ) ;
children . forEach ( function ( child , i ) {
child . style . flexBasis = "calc(" + _this5 . panelSizes [ i ] + "% - " + ( _this5 . panels . length - 1 ) * _this5 . gutterSize + "px)" ;
} ) ;
return true ;
}
return false ;
} , "restoreState" )
} ,
computed : {
panels : /* @__PURE__ */ _ _name ( function panels ( ) {
var _this6 = this ;
var panels2 = [ ] ;
this . $slots [ "default" ] ( ) . forEach ( function ( child ) {
if ( _this6 . isSplitterPanel ( child ) ) {
panels2 . push ( child ) ;
} else if ( child . children instanceof Array ) {
child . children . forEach ( function ( nestedChild ) {
if ( _this6 . isSplitterPanel ( nestedChild ) ) {
panels2 . push ( nestedChild ) ;
}
} ) ;
}
} ) ;
return panels2 ;
} , "panels" ) ,
gutterStyle : /* @__PURE__ */ _ _name ( function gutterStyle ( ) {
if ( this . horizontal ) return {
width : this . gutterSize + "px"
} ;
else return {
height : this . gutterSize + "px"
} ;
} , "gutterStyle" ) ,
horizontal : /* @__PURE__ */ _ _name ( function horizontal ( ) {
return this . layout === "horizontal" ;
} , "horizontal" ) ,
getPTOptions : /* @__PURE__ */ _ _name ( function getPTOptions ( ) {
var _this$$parentInstance ;
return {
context : {
nested : ( _this$$parentInstance = this . $parentInstance ) === null || _this$$parentInstance === void 0 ? void 0 : _this$$parentInstance . nestedState
}
} ;
} , "getPTOptions" )
}
} ;
2024-11-16 01:17:15 +00:00
var _hoisted _1$k = [ "onMousedown" , "onTouchstart" , "onTouchmove" , "onTouchend" ] ;
var _hoisted _2$h = [ "aria-orientation" , "aria-valuenow" , "onKeydown" ] ;
function render$g ( _ctx , _cache , $props , $setup , $data , $options ) {
2024-10-28 18:29:38 +00:00
return openBlock ( ) , createElementBlock ( "div" , mergeProps ( {
"class" : _ctx . cx ( "root" ) ,
style : _ctx . sx ( "root" ) ,
"data-p-resizing" : false
} , _ctx . ptmi ( "root" , $options . getPTOptions ) ) , [ ( openBlock ( true ) , createElementBlock ( Fragment , null , renderList ( $options . panels , function ( panel , i ) {
return openBlock ( ) , createElementBlock ( Fragment , {
key : i
} , [ ( openBlock ( ) , createBlock ( resolveDynamicComponent ( panel ) , {
tabindex : "-1"
} ) ) , i !== $options . panels . length - 1 ? ( openBlock ( ) , createElementBlock ( "div" , mergeProps ( {
key : 0 ,
ref _for : true ,
ref : "gutter" ,
"class" : _ctx . cx ( "gutter" ) ,
role : "separator" ,
tabindex : "-1" ,
onMousedown : /* @__PURE__ */ _ _name ( function onMousedown ( $event ) {
return $options . onGutterMouseDown ( $event , i ) ;
} , "onMousedown" ) ,
onTouchstart : /* @__PURE__ */ _ _name ( function onTouchstart ( $event ) {
return $options . onGutterTouchStart ( $event , i ) ;
} , "onTouchstart" ) ,
onTouchmove : /* @__PURE__ */ _ _name ( function onTouchmove ( $event ) {
return $options . onGutterTouchMove ( $event , i ) ;
} , "onTouchmove" ) ,
onTouchend : /* @__PURE__ */ _ _name ( function onTouchend ( $event ) {
return $options . onGutterTouchEnd ( $event , i ) ;
} , "onTouchend" ) ,
"data-p-gutter-resizing" : false
} , _ctx . ptm ( "gutter" ) ) , [ createBaseVNode ( "div" , mergeProps ( {
"class" : _ctx . cx ( "gutterHandle" ) ,
tabindex : "0" ,
style : [ $options . gutterStyle ] ,
"aria-orientation" : _ctx . layout ,
"aria-valuenow" : $data . prevSize ,
onKeyup : _cache [ 0 ] || ( _cache [ 0 ] = function ( ) {
return $options . onGutterKeyUp && $options . onGutterKeyUp . apply ( $options , arguments ) ;
} ) ,
2024-10-29 18:14:06 +00:00
onKeydown : /* @__PURE__ */ _ _name ( function onKeydown2 ( $event ) {
2024-10-28 18:29:38 +00:00
return $options . onGutterKeyDown ( $event , i ) ;
} , "onKeydown" ) ,
ref _for : true
2024-11-16 01:17:15 +00:00
} , _ctx . ptm ( "gutterHandle" ) ) , null , 16 , _hoisted _2$h ) ] , 16 , _hoisted _1$k ) ) : createCommentVNode ( "" , true ) ] , 64 ) ;
2024-10-28 18:29:38 +00:00
} ) , 128 ) ) ] , 16 ) ;
}
2024-11-16 01:17:15 +00:00
_ _name ( render$g , "render$g" ) ;
script$a . render = render$g ;
2024-10-28 18:29:38 +00:00
var classes$7 = {
2024-10-29 18:14:06 +00:00
root : /* @__PURE__ */ _ _name ( function root4 ( _ref ) {
2024-10-28 18:29:38 +00:00
var instance = _ref . instance ;
return [ "p-splitterpanel" , {
"p-splitterpanel-nested" : instance . isNested
} ] ;
} , "root" )
} ;
var SplitterPanelStyle = BaseStyle . extend ( {
name : "splitterpanel" ,
classes : classes$7
} ) ;
var script$1$7 = {
name : "BaseSplitterPanel" ,
2024-10-29 18:14:06 +00:00
"extends" : script$g ,
2024-10-28 18:29:38 +00:00
props : {
size : {
type : Number ,
"default" : null
} ,
minSize : {
type : Number ,
"default" : null
}
} ,
style : SplitterPanelStyle ,
2024-10-29 18:14:06 +00:00
provide : /* @__PURE__ */ _ _name ( function provide6 ( ) {
2024-10-28 18:29:38 +00:00
return {
$pcSplitterPanel : this ,
$parentInstance : this
} ;
} , "provide" )
} ;
var script$9 = {
name : "SplitterPanel" ,
"extends" : script$1$7 ,
inheritAttrs : false ,
2024-10-29 18:14:06 +00:00
data : /* @__PURE__ */ _ _name ( function data3 ( ) {
2024-10-28 18:29:38 +00:00
return {
nestedState : null
} ;
} , "data" ) ,
computed : {
isNested : /* @__PURE__ */ _ _name ( function isNested ( ) {
var _this = this ;
return this . $slots [ "default" ] ( ) . some ( function ( child ) {
_this . nestedState = child . type . name === "Splitter" ? true : null ;
return _this . nestedState ;
} ) ;
} , "isNested" ) ,
getPTOptions : /* @__PURE__ */ _ _name ( function getPTOptions2 ( ) {
return {
context : {
nested : this . isNested
}
} ;
} , "getPTOptions" )
}
} ;
2024-11-16 01:17:15 +00:00
function render$f ( _ctx , _cache , $props , $setup , $data , $options ) {
2024-10-28 18:29:38 +00:00
return openBlock ( ) , createElementBlock ( "div" , mergeProps ( {
ref : "container" ,
"class" : _ctx . cx ( "root" )
} , _ctx . ptmi ( "root" , $options . getPTOptions ) ) , [ renderSlot ( _ctx . $slots , "default" ) ] , 16 ) ;
}
2024-11-16 01:17:15 +00:00
_ _name ( render$f , "render$f" ) ;
script$9 . render = render$f ;
const _sfc _main$k = /* @__PURE__ */ defineComponent ( {
2024-10-28 18:29:38 +00:00
_ _name : "LiteGraphCanvasSplitterOverlay" ,
setup ( _ _props ) {
const settingStore = useSettingStore ( ) ;
const sidebarLocation = computed (
( ) => settingStore . get ( "Comfy.Sidebar.Location" )
) ;
const sidebarPanelVisible = computed (
2024-10-29 18:14:06 +00:00
( ) => useSidebarTabStore ( ) . activeSidebarTab !== null
) ;
const bottomPanelVisible = computed (
( ) => useBottomPanelStore ( ) . bottomPanelVisible
2024-10-28 18:29:38 +00:00
) ;
return ( _ctx , _cache ) => {
return openBlock ( ) , createBlock ( unref ( script$a ) , {
2024-10-29 18:14:06 +00:00
class : "splitter-overlay-root splitter-overlay" ,
2024-11-16 01:17:15 +00:00
"pt:gutter" : sidebarPanelVisible . value ? "" : "hidden" ,
stateKey : "sidebar-splitter" ,
stateStorage : "local"
2024-10-28 18:29:38 +00:00
} , {
default : withCtx ( ( ) => [
sidebarLocation . value === "left" ? withDirectives ( ( openBlock ( ) , createBlock ( unref ( script$9 ) , {
key : 0 ,
class : "side-bar-panel" ,
minSize : 10 ,
size : 20
} , {
default : withCtx ( ( ) => [
renderSlot ( _ctx . $slots , "side-bar-panel" , { } , void 0 , true )
] ) ,
_ : 3
} , 512 ) ) , [
[ vShow , sidebarPanelVisible . value ]
] ) : createCommentVNode ( "" , true ) ,
2024-10-29 18:14:06 +00:00
createVNode ( unref ( script$9 ) , { size : 100 } , {
2024-10-28 18:29:38 +00:00
default : withCtx ( ( ) => [
2024-10-29 18:14:06 +00:00
createVNode ( unref ( script$a ) , {
2024-11-16 01:17:15 +00:00
class : "splitter-overlay max-w-full" ,
2024-10-29 18:14:06 +00:00
layout : "vertical" ,
2024-11-16 01:17:15 +00:00
"pt:gutter" : bottomPanelVisible . value ? "" : "hidden" ,
stateKey : "bottom-panel-splitter" ,
stateStorage : "local"
2024-10-29 18:14:06 +00:00
} , {
default : withCtx ( ( ) => [
createVNode ( unref ( script$9 ) , { class : "graph-canvas-panel relative" } , {
default : withCtx ( ( ) => [
renderSlot ( _ctx . $slots , "graph-canvas-panel" , { } , void 0 , true )
] ) ,
_ : 3
} ) ,
withDirectives ( createVNode ( unref ( script$9 ) , { class : "bottom-panel" } , {
default : withCtx ( ( ) => [
renderSlot ( _ctx . $slots , "bottom-panel" , { } , void 0 , true )
] ) ,
_ : 3
} , 512 ) , [
[ vShow , bottomPanelVisible . value ]
] )
] ) ,
_ : 3
} , 8 , [ "pt:gutter" ] )
2024-10-28 18:29:38 +00:00
] ) ,
_ : 3
} ) ,
sidebarLocation . value === "right" ? withDirectives ( ( openBlock ( ) , createBlock ( unref ( script$9 ) , {
key : 1 ,
class : "side-bar-panel" ,
minSize : 10 ,
size : 20
} , {
default : withCtx ( ( ) => [
renderSlot ( _ctx . $slots , "side-bar-panel" , { } , void 0 , true )
] ) ,
_ : 3
} , 512 ) ) , [
[ vShow , sidebarPanelVisible . value ]
] ) : createCommentVNode ( "" , true )
] ) ,
_ : 3
} , 8 , [ "pt:gutter" ] ) ;
} ;
}
} ) ;
2024-11-16 01:17:15 +00:00
const LiteGraphCanvasSplitterOverlay = /* @__PURE__ */ _export _sfc ( _sfc _main$k , [ [ "__scopeId" , "data-v-7c3279c1" ] ] ) ;
2024-10-28 18:29:38 +00:00
var theme$6 = /* @__PURE__ */ _ _name ( function theme3 ( _ref ) {
var dt = _ref . dt ;
return "\n.p-autocomplete {\n display: inline-flex;\n}\n\n.p-autocomplete-loader {\n position: absolute;\n top: 50%;\n margin-top: -0.5rem;\n right: " . concat ( dt ( "autocomplete.padding.x" ) , ";\n}\n\n.p-autocomplete:has(.p-autocomplete-dropdown) .p-autocomplete-loader {\n right: calc(" ) . concat ( dt ( "autocomplete.dropdown.width" ) , " + " ) . concat ( dt ( "autocomplete.padding.x" ) , ");\n}\n\n.p-autocomplete:has(.p-autocomplete-dropdown) .p-autocomplete-input {\n flex: 1 1 auto;\n width: 1%;\n}\n\n.p-autocomplete:has(.p-autocomplete-dropdown) .p-autocomplete-input,\n.p-autocomplete:has(.p-autocomplete-dropdown) .p-autocomplete-input-multiple {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n}\n\n.p-autocomplete-dropdown {\n cursor: pointer;\n display: inline-flex;\n cursor: pointer;\n user-select: none;\n align-items: center;\n justify-content: center;\n overflow: hidden;\n position: relative;\n width: " ) . concat ( dt ( "autocomplete.dropdown.width" ) , ";\n border-top-right-radius: " ) . concat ( dt ( "autocomplete.dropdown.border.radius" ) , ";\n border-bottom-right-radius: " ) . concat ( dt ( "autocomplete.dropdown.border.radius" ) , ";\n background: " ) . concat ( dt ( "autocomplete.dropdown.background" ) , ";\n border: 1px solid " ) . concat ( dt ( "autocomplete.dropdown.border.color" ) , ";\n border-left: 0 none;\n color: " ) . concat ( dt ( "autocomplete.dropdown.color" ) , ";\n transition: background " ) . concat ( dt ( "autocomplete.transition.duration" ) , ", color " ) . concat ( dt ( "autocomplete.transition.duration" ) , ", border-color " ) . concat ( dt ( "autocomplete.transition.duration" ) , ", outline-color " ) . concat ( dt ( "autocomplete.transition.duration" ) , ", box-shadow " ) . concat ( dt ( "autocomplete.transition.duration" ) , ";\n outline-color: transparent;\n}\n\n.p-autocomplete-dropdown:not(:disabled):hover {\n background: " ) . concat ( dt ( "autocomplete.dropdown.hover.background" ) , ";\n border-color: " ) . concat ( dt ( "autocomplete.dropdown.hover.border.color" ) , ";\n color: " ) . concat ( dt ( "autocomplete.dropdown.hover.color" ) , ";\n}\n\n.p-autocomplete-dropdown:not(:disabled):active {\n background: " ) . concat ( dt ( "autocomplete.dropdown.active.background" ) , ";\n border-color: " ) . concat ( dt ( "autocomplete.dropdown.active.border.color" ) , ";\n color: " ) . concat ( dt ( "autocomplete.dropdown.active.color" ) , ";\n}\n\n.p-autocomplete-dropdown:focus-visible {\n box-shadow: " ) . concat ( dt ( "autocomplete.dropdown.focus.ring.shadow" ) , ";\n outline: " ) . concat ( dt ( "autocomplete.dropdown.focus.ring.width" ) , " " ) . concat ( dt ( "autocomplete.dropdown.focus.ring.style" ) , " " ) . concat ( dt ( "autocomplete.dropdown.focus.ring.color" ) , ";\n outline-offset: " ) . concat ( dt ( "autocomplete.dropdown.focus.ring.offset" ) , ";\n}\n\n.p-autocomplete .p-autocomplete-overlay {\n min-width: 100%;\n}\n\n.p-autocomplete-overlay {\n position: absolute;\n overflow: auto;\n top: 0;\n left: 0;\n background: " ) . concat ( dt ( "autocomplete.overlay.background" ) , ";\n color: " ) . concat ( dt ( "autocomplete.overlay.color" ) , ";\n border: 1px solid " ) . concat ( dt ( "autocomplete.overlay.border.color" ) , ";\n border-radius: " ) . concat ( dt ( "autocomplete.overlay.border.radius" ) , ";\n box-shadow: " ) . concat ( dt ( "autocomplete.overlay.shadow" ) , ";\n}\n\n.p-autocomplete-list {\n margin: 0;\n padding: 0;\n list-style-type: none;\n display: flex;\n flex-direction: column;\n gap: " ) . concat ( dt ( "autocomplete.list.gap" ) , ";\n padding: " ) . concat ( dt ( "autocomplete.list.padding" ) , ";\n}\n\n.p-autocomplete-option {\n cursor: pointer;\n white-space: nowrap;\n position: relative;\n overflow: hidden;\n display: flex;\n align-items: center;\n padding: " ) . concat ( dt ( "autocomplete.option.padding" ) , ";\n border: 0 none;\n color: " ) . concat ( dt ( "autocomplete.option.color" ) , ";\n background: transparent;\n transition: background " ) . concat ( dt ( "autocomplete.transition.duration" ) , ", color " ) . concat ( dt ( "autocomplete.transition.duration" ) , ", border-color " ) . concat ( dt ( "autocomplete.transition.duration" ) , ";\n border-radius: "
} , "theme" ) ;
var inlineStyles$3 = {
root : {
position : "relative"
}
} ;
var classes$6 = {
2024-10-29 18:14:06 +00:00
root : /* @__PURE__ */ _ _name ( function root5 ( _ref2 ) {
2024-10-28 18:29:38 +00:00
var instance = _ref2 . instance , props = _ref2 . props ;
return [ "p-autocomplete p-component p-inputwrapper" , {
"p-disabled" : props . disabled ,
"p-invalid" : props . invalid ,
"p-focus" : instance . focused ,
"p-inputwrapper-filled" : props . modelValue || isNotEmpty ( instance . inputValue ) ,
"p-inputwrapper-focus" : instance . focused ,
"p-autocomplete-open" : instance . overlayVisible ,
"p-autocomplete-fluid" : instance . hasFluid
} ] ;
} , "root" ) ,
pcInput : "p-autocomplete-input" ,
inputMultiple : /* @__PURE__ */ _ _name ( function inputMultiple ( _ref3 ) {
var props = _ref3 . props , instance = _ref3 . instance ;
return [ "p-autocomplete-input-multiple" , {
"p-variant-filled" : props . variant ? props . variant === "filled" : instance . $primevue . config . inputStyle === "filled" || instance . $primevue . config . inputVariant === "filled"
} ] ;
} , "inputMultiple" ) ,
chipItem : /* @__PURE__ */ _ _name ( function chipItem ( _ref4 ) {
var instance = _ref4 . instance , i = _ref4 . i ;
return [ "p-autocomplete-chip-item" , {
"p-focus" : instance . focusedMultipleOptionIndex === i
} ] ;
} , "chipItem" ) ,
pcChip : "p-autocomplete-chip" ,
chipIcon : "p-autocomplete-chip-icon" ,
inputChip : "p-autocomplete-input-chip" ,
loader : "p-autocomplete-loader" ,
dropdown : "p-autocomplete-dropdown" ,
overlay : "p-autocomplete-overlay p-component" ,
list : "p-autocomplete-list" ,
optionGroup : "p-autocomplete-option-group" ,
option : /* @__PURE__ */ _ _name ( function option ( _ref5 ) {
var instance = _ref5 . instance , _option = _ref5 . option , i = _ref5 . i , getItemOptions = _ref5 . getItemOptions ;
return [ "p-autocomplete-option" , {
"p-autocomplete-option-selected" : instance . isSelected ( _option ) ,
"p-focus" : instance . focusedOptionIndex === instance . getOptionIndex ( i , getItemOptions ) ,
"p-disabled" : instance . isOptionDisabled ( _option )
} ] ;
} , "option" ) ,
emptyMessage : "p-autocomplete-empty-message"
} ;
var AutoCompleteStyle = BaseStyle . extend ( {
name : "autocomplete" ,
theme : theme$6 ,
classes : classes$6 ,
inlineStyles : inlineStyles$3
} ) ;
var script$1$6 = {
name : "BaseAutoComplete" ,
2024-10-29 18:14:06 +00:00
"extends" : script$g ,
2024-10-28 18:29:38 +00:00
props : {
modelValue : null ,
suggestions : {
type : Array ,
"default" : null
} ,
optionLabel : null ,
optionDisabled : null ,
optionGroupLabel : null ,
optionGroupChildren : null ,
scrollHeight : {
type : String ,
"default" : "14rem"
} ,
dropdown : {
type : Boolean ,
"default" : false
} ,
dropdownMode : {
type : String ,
"default" : "blank"
} ,
multiple : {
type : Boolean ,
"default" : false
} ,
loading : {
type : Boolean ,
"default" : false
} ,
variant : {
type : String ,
"default" : null
} ,
invalid : {
type : Boolean ,
"default" : false
} ,
disabled : {
type : Boolean ,
"default" : false
} ,
placeholder : {
type : String ,
"default" : null
} ,
dataKey : {
type : String ,
"default" : null
} ,
minLength : {
type : Number ,
"default" : 1
} ,
delay : {
type : Number ,
"default" : 300
} ,
appendTo : {
type : [ String , Object ] ,
"default" : "body"
} ,
forceSelection : {
type : Boolean ,
"default" : false
} ,
completeOnFocus : {
type : Boolean ,
"default" : false
} ,
inputId : {
type : String ,
"default" : null
} ,
inputStyle : {
type : Object ,
"default" : null
} ,
inputClass : {
type : [ String , Object ] ,
"default" : null
} ,
panelStyle : {
type : Object ,
"default" : null
} ,
panelClass : {
type : [ String , Object ] ,
"default" : null
} ,
overlayStyle : {
type : Object ,
"default" : null
} ,
overlayClass : {
type : [ String , Object ] ,
"default" : null
} ,
dropdownIcon : {
type : String ,
"default" : null
} ,
dropdownClass : {
type : [ String , Object ] ,
"default" : null
} ,
loader : {
type : String ,
"default" : null
} ,
loadingIcon : {
type : String ,
"default" : null
} ,
removeTokenIcon : {
type : String ,
"default" : null
} ,
chipIcon : {
type : String ,
"default" : null
} ,
virtualScrollerOptions : {
type : Object ,
"default" : null
} ,
autoOptionFocus : {
type : Boolean ,
"default" : false
} ,
selectOnFocus : {
type : Boolean ,
"default" : false
} ,
focusOnHover : {
type : Boolean ,
"default" : true
} ,
searchLocale : {
type : String ,
"default" : void 0
} ,
searchMessage : {
type : String ,
"default" : null
} ,
selectionMessage : {
type : String ,
"default" : null
} ,
emptySelectionMessage : {
type : String ,
"default" : null
} ,
emptySearchMessage : {
type : String ,
"default" : null
} ,
tabindex : {
type : Number ,
"default" : 0
} ,
typeahead : {
type : Boolean ,
"default" : true
} ,
ariaLabel : {
type : String ,
"default" : null
} ,
ariaLabelledby : {
type : String ,
"default" : null
} ,
fluid : {
type : Boolean ,
"default" : null
}
} ,
style : AutoCompleteStyle ,
2024-10-29 18:14:06 +00:00
provide : /* @__PURE__ */ _ _name ( function provide7 ( ) {
2024-10-28 18:29:38 +00:00
return {
$pcAutoComplete : this ,
$parentInstance : this
} ;
} , "provide" )
} ;
function _typeof$1$1 ( o ) {
"@babel/helpers - typeof" ;
return _typeof$1$1 = "function" == typeof Symbol && "symbol" == typeof Symbol . iterator ? function ( o2 ) {
return typeof o2 ;
} : function ( o2 ) {
return o2 && "function" == typeof Symbol && o2 . constructor === Symbol && o2 !== Symbol . prototype ? "symbol" : typeof o2 ;
} , _typeof$1$1 ( o ) ;
}
_ _name ( _typeof$1$1 , "_typeof$1$1" ) ;
function _toConsumableArray$1 ( r ) {
return _arrayWithoutHoles$1 ( r ) || _iterableToArray$1 ( r ) || _unsupportedIterableToArray$1 ( r ) || _nonIterableSpread$1 ( ) ;
}
_ _name ( _toConsumableArray$1 , "_toConsumableArray$1" ) ;
function _nonIterableSpread$1 ( ) {
throw new TypeError ( "Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method." ) ;
}
_ _name ( _nonIterableSpread$1 , "_nonIterableSpread$1" ) ;
function _unsupportedIterableToArray$1 ( r , a ) {
if ( r ) {
if ( "string" == typeof r ) return _arrayLikeToArray$1 ( r , a ) ;
var t = { } . toString . call ( r ) . slice ( 8 , - 1 ) ;
return "Object" === t && r . constructor && ( t = r . constructor . name ) , "Map" === t || "Set" === t ? Array . from ( r ) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/ . test ( t ) ? _arrayLikeToArray$1 ( r , a ) : void 0 ;
}
}
_ _name ( _unsupportedIterableToArray$1 , "_unsupportedIterableToArray$1" ) ;
function _iterableToArray$1 ( r ) {
if ( "undefined" != typeof Symbol && null != r [ Symbol . iterator ] || null != r [ "@@iterator" ] ) return Array . from ( r ) ;
}
_ _name ( _iterableToArray$1 , "_iterableToArray$1" ) ;
function _arrayWithoutHoles$1 ( r ) {
if ( Array . isArray ( r ) ) return _arrayLikeToArray$1 ( r ) ;
}
_ _name ( _arrayWithoutHoles$1 , "_arrayWithoutHoles$1" ) ;
function _arrayLikeToArray$1 ( r , a ) {
( null == a || a > r . length ) && ( a = r . length ) ;
for ( var e = 0 , n = Array ( a ) ; e < a ; e ++ ) n [ e ] = r [ e ] ;
return n ;
}
_ _name ( _arrayLikeToArray$1 , "_arrayLikeToArray$1" ) ;
var script$8 = {
name : "AutoComplete" ,
"extends" : script$1$6 ,
inheritAttrs : false ,
emits : [ "update:modelValue" , "change" , "focus" , "blur" , "item-select" , "item-unselect" , "option-select" , "option-unselect" , "dropdown-click" , "clear" , "complete" , "before-show" , "before-hide" , "show" , "hide" ] ,
inject : {
$pcFluid : {
"default" : null
}
} ,
outsideClickListener : null ,
resizeListener : null ,
scrollHandler : null ,
overlay : null ,
virtualScroller : null ,
searchTimeout : null ,
dirty : false ,
2024-10-29 18:14:06 +00:00
data : /* @__PURE__ */ _ _name ( function data4 ( ) {
2024-10-28 18:29:38 +00:00
return {
id : this . $attrs . id ,
clicked : false ,
focused : false ,
focusedOptionIndex : - 1 ,
focusedMultipleOptionIndex : - 1 ,
overlayVisible : false ,
searching : false
} ;
} , "data" ) ,
watch : {
"$attrs.id" : /* @__PURE__ */ _ _name ( function $attrsId ( newValue ) {
this . id = newValue || UniqueComponentId ( ) ;
} , "$attrsId" ) ,
suggestions : /* @__PURE__ */ _ _name ( function suggestions ( ) {
if ( this . searching ) {
this . show ( ) ;
this . focusedOptionIndex = this . overlayVisible && this . autoOptionFocus ? this . findFirstFocusedOptionIndex ( ) : - 1 ;
this . searching = false ;
}
this . autoUpdateModel ( ) ;
} , "suggestions" )
} ,
2024-10-29 18:14:06 +00:00
mounted : /* @__PURE__ */ _ _name ( function mounted3 ( ) {
2024-10-28 18:29:38 +00:00
this . id = this . id || UniqueComponentId ( ) ;
this . autoUpdateModel ( ) ;
} , "mounted" ) ,
2024-10-29 18:14:06 +00:00
updated : /* @__PURE__ */ _ _name ( function updated2 ( ) {
2024-10-28 18:29:38 +00:00
if ( this . overlayVisible ) {
this . alignOverlay ( ) ;
}
} , "updated" ) ,
2024-10-29 18:14:06 +00:00
beforeUnmount : /* @__PURE__ */ _ _name ( function beforeUnmount3 ( ) {
2024-10-28 18:29:38 +00:00
this . unbindOutsideClickListener ( ) ;
this . unbindResizeListener ( ) ;
if ( this . scrollHandler ) {
this . scrollHandler . destroy ( ) ;
this . scrollHandler = null ;
}
if ( this . overlay ) {
ZIndex . clear ( this . overlay ) ;
this . overlay = null ;
}
} , "beforeUnmount" ) ,
methods : {
getOptionIndex : /* @__PURE__ */ _ _name ( function getOptionIndex ( index , fn ) {
return this . virtualScrollerDisabled ? index : fn && fn ( index ) [ "index" ] ;
} , "getOptionIndex" ) ,
getOptionLabel : /* @__PURE__ */ _ _name ( function getOptionLabel ( option2 ) {
return this . optionLabel ? resolveFieldData ( option2 , this . optionLabel ) : option2 ;
} , "getOptionLabel" ) ,
getOptionValue : /* @__PURE__ */ _ _name ( function getOptionValue ( option2 ) {
return option2 ;
} , "getOptionValue" ) ,
getOptionRenderKey : /* @__PURE__ */ _ _name ( function getOptionRenderKey ( option2 , index ) {
return ( this . dataKey ? resolveFieldData ( option2 , this . dataKey ) : this . getOptionLabel ( option2 ) ) + "_" + index ;
} , "getOptionRenderKey" ) ,
getPTOptions : /* @__PURE__ */ _ _name ( function getPTOptions3 ( option2 , itemOptions , index , key ) {
return this . ptm ( key , {
context : {
selected : this . isSelected ( option2 ) ,
focused : this . focusedOptionIndex === this . getOptionIndex ( index , itemOptions ) ,
disabled : this . isOptionDisabled ( option2 )
}
} ) ;
} , "getPTOptions" ) ,
isOptionDisabled : /* @__PURE__ */ _ _name ( function isOptionDisabled ( option2 ) {
return this . optionDisabled ? resolveFieldData ( option2 , this . optionDisabled ) : false ;
} , "isOptionDisabled" ) ,
isOptionGroup : /* @__PURE__ */ _ _name ( function isOptionGroup ( option2 ) {
return this . optionGroupLabel && option2 . optionGroup && option2 . group ;
} , "isOptionGroup" ) ,
getOptionGroupLabel : /* @__PURE__ */ _ _name ( function getOptionGroupLabel ( optionGroup ) {
return resolveFieldData ( optionGroup , this . optionGroupLabel ) ;
} , "getOptionGroupLabel" ) ,
getOptionGroupChildren : /* @__PURE__ */ _ _name ( function getOptionGroupChildren ( optionGroup ) {
return resolveFieldData ( optionGroup , this . optionGroupChildren ) ;
} , "getOptionGroupChildren" ) ,
getAriaPosInset : /* @__PURE__ */ _ _name ( function getAriaPosInset ( index ) {
var _this = this ;
return ( this . optionGroupLabel ? index - this . visibleOptions . slice ( 0 , index ) . filter ( function ( option2 ) {
return _this . isOptionGroup ( option2 ) ;
} ) . length : index ) + 1 ;
} , "getAriaPosInset" ) ,
show : /* @__PURE__ */ _ _name ( function show ( isFocus ) {
this . $emit ( "before-show" ) ;
this . dirty = true ;
this . overlayVisible = true ;
this . focusedOptionIndex = this . focusedOptionIndex !== - 1 ? this . focusedOptionIndex : this . autoOptionFocus ? this . findFirstFocusedOptionIndex ( ) : - 1 ;
isFocus && focus ( this . multiple ? this . $refs . focusInput : this . $refs . focusInput . $el ) ;
} , "show" ) ,
hide : /* @__PURE__ */ _ _name ( function hide ( isFocus ) {
var _this2 = this ;
var _hide = /* @__PURE__ */ _ _name ( function _hide2 ( ) {
_this2 . $emit ( "before-hide" ) ;
_this2 . dirty = isFocus ;
_this2 . overlayVisible = false ;
_this2 . clicked = false ;
_this2 . focusedOptionIndex = - 1 ;
isFocus && focus ( _this2 . multiple ? _this2 . $refs . focusInput : _this2 . $refs . focusInput . $el ) ;
} , "_hide" ) ;
setTimeout ( function ( ) {
_hide ( ) ;
} , 0 ) ;
} , "hide" ) ,
2024-10-29 18:14:06 +00:00
onFocus : /* @__PURE__ */ _ _name ( function onFocus2 ( event ) {
2024-10-28 18:29:38 +00:00
if ( this . disabled ) {
return ;
}
if ( ! this . dirty && this . completeOnFocus ) {
this . search ( event , event . target . value , "focus" ) ;
}
this . dirty = true ;
this . focused = true ;
if ( this . overlayVisible ) {
this . focusedOptionIndex = this . focusedOptionIndex !== - 1 ? this . focusedOptionIndex : this . overlayVisible && this . autoOptionFocus ? this . findFirstFocusedOptionIndex ( ) : - 1 ;
this . scrollInView ( this . focusedOptionIndex ) ;
}
this . $emit ( "focus" , event ) ;
} , "onFocus" ) ,
onBlur : /* @__PURE__ */ _ _name ( function onBlur ( event ) {
this . dirty = false ;
this . focused = false ;
this . focusedOptionIndex = - 1 ;
this . $emit ( "blur" , event ) ;
} , "onBlur" ) ,
onKeyDown : /* @__PURE__ */ _ _name ( function onKeyDown ( event ) {
if ( this . disabled ) {
event . preventDefault ( ) ;
return ;
}
switch ( event . code ) {
case "ArrowDown" :
this . onArrowDownKey ( event ) ;
break ;
case "ArrowUp" :
this . onArrowUpKey ( event ) ;
break ;
case "ArrowLeft" :
this . onArrowLeftKey ( event ) ;
break ;
case "ArrowRight" :
this . onArrowRightKey ( event ) ;
break ;
case "Home" :
this . onHomeKey ( event ) ;
break ;
case "End" :
this . onEndKey ( event ) ;
break ;
case "PageDown" :
this . onPageDownKey ( event ) ;
break ;
case "PageUp" :
this . onPageUpKey ( event ) ;
break ;
case "Enter" :
case "NumpadEnter" :
this . onEnterKey ( event ) ;
break ;
case "Escape" :
this . onEscapeKey ( event ) ;
break ;
case "Tab" :
this . onTabKey ( event ) ;
break ;
case "Backspace" :
this . onBackspaceKey ( event ) ;
break ;
}
this . clicked = false ;
} , "onKeyDown" ) ,
onInput : /* @__PURE__ */ _ _name ( function onInput ( event ) {
var _this3 = this ;
if ( this . typeahead ) {
if ( this . searchTimeout ) {
clearTimeout ( this . searchTimeout ) ;
}
var query = event . target . value ;
if ( ! this . multiple ) {
this . updateModel ( event , query ) ;
}
if ( query . length === 0 ) {
this . hide ( ) ;
this . $emit ( "clear" ) ;
} else {
if ( query . length >= this . minLength ) {
this . focusedOptionIndex = - 1 ;
this . searchTimeout = setTimeout ( function ( ) {
_this3 . search ( event , query , "input" ) ;
} , this . delay ) ;
} else {
this . hide ( ) ;
}
}
}
} , "onInput" ) ,
onChange : /* @__PURE__ */ _ _name ( function onChange ( event ) {
var _this4 = this ;
if ( this . forceSelection ) {
var valid = false ;
if ( this . visibleOptions && ! this . multiple ) {
var value = this . multiple ? this . $refs . focusInput . value : this . $refs . focusInput . $el . value ;
var matchedValue = this . visibleOptions . find ( function ( option2 ) {
return _this4 . isOptionMatched ( option2 , value || "" ) ;
} ) ;
if ( matchedValue !== void 0 ) {
valid = true ;
! this . isSelected ( matchedValue ) && this . onOptionSelect ( event , matchedValue ) ;
}
}
if ( ! valid ) {
if ( this . multiple ) this . $refs . focusInput . value = "" ;
else this . $refs . focusInput . $el . value = "" ;
this . $emit ( "clear" ) ;
! this . multiple && this . updateModel ( event , null ) ;
}
}
} , "onChange" ) ,
onMultipleContainerFocus : /* @__PURE__ */ _ _name ( function onMultipleContainerFocus ( ) {
if ( this . disabled ) {
return ;
}
this . focused = true ;
} , "onMultipleContainerFocus" ) ,
onMultipleContainerBlur : /* @__PURE__ */ _ _name ( function onMultipleContainerBlur ( ) {
this . focusedMultipleOptionIndex = - 1 ;
this . focused = false ;
} , "onMultipleContainerBlur" ) ,
onMultipleContainerKeyDown : /* @__PURE__ */ _ _name ( function onMultipleContainerKeyDown ( event ) {
if ( this . disabled ) {
event . preventDefault ( ) ;
return ;
}
switch ( event . code ) {
case "ArrowLeft" :
this . onArrowLeftKeyOnMultiple ( event ) ;
break ;
case "ArrowRight" :
this . onArrowRightKeyOnMultiple ( event ) ;
break ;
case "Backspace" :
this . onBackspaceKeyOnMultiple ( event ) ;
break ;
}
} , "onMultipleContainerKeyDown" ) ,
onContainerClick : /* @__PURE__ */ _ _name ( function onContainerClick ( event ) {
this . clicked = true ;
if ( this . disabled || this . searching || this . loading || this . isInputClicked ( event ) || this . isDropdownClicked ( event ) ) {
return ;
}
if ( ! this . overlay || ! this . overlay . contains ( event . target ) ) {
focus ( this . multiple ? this . $refs . focusInput : this . $refs . focusInput . $el ) ;
}
} , "onContainerClick" ) ,
onDropdownClick : /* @__PURE__ */ _ _name ( function onDropdownClick ( event ) {
var query = void 0 ;
if ( this . overlayVisible ) {
this . hide ( true ) ;
} else {
var target = this . multiple ? this . $refs . focusInput : this . $refs . focusInput . $el ;
focus ( target ) ;
query = target . value ;
if ( this . dropdownMode === "blank" ) this . search ( event , "" , "dropdown" ) ;
else if ( this . dropdownMode === "current" ) this . search ( event , query , "dropdown" ) ;
}
this . $emit ( "dropdown-click" , {
originalEvent : event ,
query
} ) ;
} , "onDropdownClick" ) ,
onOptionSelect : /* @__PURE__ */ _ _name ( function onOptionSelect ( event , option2 ) {
var isHide = arguments . length > 2 && arguments [ 2 ] !== void 0 ? arguments [ 2 ] : true ;
var value = this . getOptionValue ( option2 ) ;
if ( this . multiple ) {
this . $refs . focusInput . value = "" ;
if ( ! this . isSelected ( option2 ) ) {
this . updateModel ( event , [ ] . concat ( _toConsumableArray$1 ( this . modelValue || [ ] ) , [ value ] ) ) ;
}
} else {
this . updateModel ( event , value ) ;
}
this . $emit ( "item-select" , {
originalEvent : event ,
value : option2
} ) ;
this . $emit ( "option-select" , {
originalEvent : event ,
value : option2
} ) ;
isHide && this . hide ( true ) ;
} , "onOptionSelect" ) ,
onOptionMouseMove : /* @__PURE__ */ _ _name ( function onOptionMouseMove ( event , index ) {
if ( this . focusOnHover ) {
this . changeFocusedOptionIndex ( event , index ) ;
}
} , "onOptionMouseMove" ) ,
onOverlayClick : /* @__PURE__ */ _ _name ( function onOverlayClick ( event ) {
OverlayEventBus . emit ( "overlay-click" , {
originalEvent : event ,
target : this . $el
} ) ;
} , "onOverlayClick" ) ,
onOverlayKeyDown : /* @__PURE__ */ _ _name ( function onOverlayKeyDown ( event ) {
switch ( event . code ) {
case "Escape" :
this . onEscapeKey ( event ) ;
break ;
}
} , "onOverlayKeyDown" ) ,
onArrowDownKey : /* @__PURE__ */ _ _name ( function onArrowDownKey ( event ) {
if ( ! this . overlayVisible ) {
return ;
}
var optionIndex = this . focusedOptionIndex !== - 1 ? this . findNextOptionIndex ( this . focusedOptionIndex ) : this . clicked ? this . findFirstOptionIndex ( ) : this . findFirstFocusedOptionIndex ( ) ;
this . changeFocusedOptionIndex ( event , optionIndex ) ;
event . preventDefault ( ) ;
} , "onArrowDownKey" ) ,
onArrowUpKey : /* @__PURE__ */ _ _name ( function onArrowUpKey ( event ) {
if ( ! this . overlayVisible ) {
return ;
}
if ( event . altKey ) {
if ( this . focusedOptionIndex !== - 1 ) {
this . onOptionSelect ( event , this . visibleOptions [ this . focusedOptionIndex ] ) ;
}
this . overlayVisible && this . hide ( ) ;
event . preventDefault ( ) ;
} else {
var optionIndex = this . focusedOptionIndex !== - 1 ? this . findPrevOptionIndex ( this . focusedOptionIndex ) : this . clicked ? this . findLastOptionIndex ( ) : this . findLastFocusedOptionIndex ( ) ;
this . changeFocusedOptionIndex ( event , optionIndex ) ;
event . preventDefault ( ) ;
}
} , "onArrowUpKey" ) ,
2024-10-29 18:14:06 +00:00
onArrowLeftKey : /* @__PURE__ */ _ _name ( function onArrowLeftKey2 ( event ) {
2024-10-28 18:29:38 +00:00
var target = event . currentTarget ;
this . focusedOptionIndex = - 1 ;
if ( this . multiple ) {
if ( isEmpty ( target . value ) && this . hasSelectedOption ) {
focus ( this . $refs . multiContainer ) ;
this . focusedMultipleOptionIndex = this . modelValue . length ;
} else {
event . stopPropagation ( ) ;
}
}
} , "onArrowLeftKey" ) ,
2024-10-29 18:14:06 +00:00
onArrowRightKey : /* @__PURE__ */ _ _name ( function onArrowRightKey2 ( event ) {
2024-10-28 18:29:38 +00:00
this . focusedOptionIndex = - 1 ;
this . multiple && event . stopPropagation ( ) ;
} , "onArrowRightKey" ) ,
2024-10-29 18:14:06 +00:00
onHomeKey : /* @__PURE__ */ _ _name ( function onHomeKey2 ( event ) {
2024-10-28 18:29:38 +00:00
var currentTarget = event . currentTarget ;
var len = currentTarget . value . length ;
currentTarget . setSelectionRange ( 0 , event . shiftKey ? len : 0 ) ;
this . focusedOptionIndex = - 1 ;
event . preventDefault ( ) ;
} , "onHomeKey" ) ,
2024-10-29 18:14:06 +00:00
onEndKey : /* @__PURE__ */ _ _name ( function onEndKey2 ( event ) {
2024-10-28 18:29:38 +00:00
var currentTarget = event . currentTarget ;
var len = currentTarget . value . length ;
currentTarget . setSelectionRange ( event . shiftKey ? 0 : len , len ) ;
this . focusedOptionIndex = - 1 ;
event . preventDefault ( ) ;
} , "onEndKey" ) ,
2024-10-29 18:14:06 +00:00
onPageUpKey : /* @__PURE__ */ _ _name ( function onPageUpKey2 ( event ) {
2024-10-28 18:29:38 +00:00
this . scrollInView ( 0 ) ;
event . preventDefault ( ) ;
} , "onPageUpKey" ) ,
2024-10-29 18:14:06 +00:00
onPageDownKey : /* @__PURE__ */ _ _name ( function onPageDownKey2 ( event ) {
2024-10-28 18:29:38 +00:00
this . scrollInView ( this . visibleOptions . length - 1 ) ;
event . preventDefault ( ) ;
} , "onPageDownKey" ) ,
2024-10-29 18:14:06 +00:00
onEnterKey : /* @__PURE__ */ _ _name ( function onEnterKey2 ( event ) {
2024-10-28 18:29:38 +00:00
if ( ! this . typeahead ) {
if ( this . multiple ) {
this . updateModel ( event , [ ] . concat ( _toConsumableArray$1 ( this . modelValue || [ ] ) , [ event . target . value ] ) ) ;
this . $refs . focusInput . value = "" ;
}
} else {
if ( ! this . overlayVisible ) {
this . focusedOptionIndex = - 1 ;
this . onArrowDownKey ( event ) ;
} else {
if ( this . focusedOptionIndex !== - 1 ) {
this . onOptionSelect ( event , this . visibleOptions [ this . focusedOptionIndex ] ) ;
}
this . hide ( ) ;
}
}
} , "onEnterKey" ) ,
onEscapeKey : /* @__PURE__ */ _ _name ( function onEscapeKey ( event ) {
this . overlayVisible && this . hide ( true ) ;
event . preventDefault ( ) ;
} , "onEscapeKey" ) ,
onTabKey : /* @__PURE__ */ _ _name ( function onTabKey ( event ) {
if ( this . focusedOptionIndex !== - 1 ) {
this . onOptionSelect ( event , this . visibleOptions [ this . focusedOptionIndex ] ) ;
}
this . overlayVisible && this . hide ( ) ;
} , "onTabKey" ) ,
onBackspaceKey : /* @__PURE__ */ _ _name ( function onBackspaceKey ( event ) {
if ( this . multiple ) {
if ( isNotEmpty ( this . modelValue ) && ! this . $refs . focusInput . value ) {
var removedValue = this . modelValue [ this . modelValue . length - 1 ] ;
var newValue = this . modelValue . slice ( 0 , - 1 ) ;
this . $emit ( "update:modelValue" , newValue ) ;
this . $emit ( "item-unselect" , {
originalEvent : event ,
value : removedValue
} ) ;
this . $emit ( "option-unselect" , {
originalEvent : event ,
value : removedValue
} ) ;
}
event . stopPropagation ( ) ;
}
} , "onBackspaceKey" ) ,
onArrowLeftKeyOnMultiple : /* @__PURE__ */ _ _name ( function onArrowLeftKeyOnMultiple ( ) {
this . focusedMultipleOptionIndex = this . focusedMultipleOptionIndex < 1 ? 0 : this . focusedMultipleOptionIndex - 1 ;
} , "onArrowLeftKeyOnMultiple" ) ,
onArrowRightKeyOnMultiple : /* @__PURE__ */ _ _name ( function onArrowRightKeyOnMultiple ( ) {
this . focusedMultipleOptionIndex ++ ;
if ( this . focusedMultipleOptionIndex > this . modelValue . length - 1 ) {
this . focusedMultipleOptionIndex = - 1 ;
focus ( this . $refs . focusInput ) ;
}
} , "onArrowRightKeyOnMultiple" ) ,
onBackspaceKeyOnMultiple : /* @__PURE__ */ _ _name ( function onBackspaceKeyOnMultiple ( event ) {
if ( this . focusedMultipleOptionIndex !== - 1 ) {
this . removeOption ( event , this . focusedMultipleOptionIndex ) ;
}
} , "onBackspaceKeyOnMultiple" ) ,
onOverlayEnter : /* @__PURE__ */ _ _name ( function onOverlayEnter ( el ) {
ZIndex . set ( "overlay" , el , this . $primevue . config . zIndex . overlay ) ;
addStyle ( el , {
position : "absolute" ,
top : "0" ,
left : "0"
} ) ;
this . alignOverlay ( ) ;
} , "onOverlayEnter" ) ,
onOverlayAfterEnter : /* @__PURE__ */ _ _name ( function onOverlayAfterEnter ( ) {
this . bindOutsideClickListener ( ) ;
this . bindScrollListener ( ) ;
this . bindResizeListener ( ) ;
this . $emit ( "show" ) ;
} , "onOverlayAfterEnter" ) ,
onOverlayLeave : /* @__PURE__ */ _ _name ( function onOverlayLeave ( ) {
this . unbindOutsideClickListener ( ) ;
this . unbindScrollListener ( ) ;
this . unbindResizeListener ( ) ;
this . $emit ( "hide" ) ;
this . overlay = null ;
} , "onOverlayLeave" ) ,
onOverlayAfterLeave : /* @__PURE__ */ _ _name ( function onOverlayAfterLeave ( el ) {
ZIndex . clear ( el ) ;
} , "onOverlayAfterLeave" ) ,
alignOverlay : /* @__PURE__ */ _ _name ( function alignOverlay ( ) {
var target = this . multiple ? this . $refs . multiContainer : this . $refs . focusInput . $el ;
if ( this . appendTo === "self" ) {
relativePosition ( this . overlay , target ) ;
} else {
this . overlay . style . minWidth = getOuterWidth ( target ) + "px" ;
absolutePosition ( this . overlay , target ) ;
}
} , "alignOverlay" ) ,
bindOutsideClickListener : /* @__PURE__ */ _ _name ( function bindOutsideClickListener ( ) {
var _this5 = this ;
if ( ! this . outsideClickListener ) {
this . outsideClickListener = function ( event ) {
if ( _this5 . overlayVisible && _this5 . overlay && _this5 . isOutsideClicked ( event ) ) {
_this5 . hide ( ) ;
}
} ;
document . addEventListener ( "click" , this . outsideClickListener ) ;
}
} , "bindOutsideClickListener" ) ,
unbindOutsideClickListener : /* @__PURE__ */ _ _name ( function unbindOutsideClickListener ( ) {
if ( this . outsideClickListener ) {
document . removeEventListener ( "click" , this . outsideClickListener ) ;
this . outsideClickListener = null ;
}
} , "unbindOutsideClickListener" ) ,
bindScrollListener : /* @__PURE__ */ _ _name ( function bindScrollListener ( ) {
var _this6 = this ;
if ( ! this . scrollHandler ) {
this . scrollHandler = new ConnectedOverlayScrollHandler ( this . $refs . container , function ( ) {
if ( _this6 . overlayVisible ) {
_this6 . hide ( ) ;
}
} ) ;
}
this . scrollHandler . bindScrollListener ( ) ;
} , "bindScrollListener" ) ,
unbindScrollListener : /* @__PURE__ */ _ _name ( function unbindScrollListener ( ) {
if ( this . scrollHandler ) {
this . scrollHandler . unbindScrollListener ( ) ;
}
} , "unbindScrollListener" ) ,
bindResizeListener : /* @__PURE__ */ _ _name ( function bindResizeListener ( ) {
var _this7 = this ;
if ( ! this . resizeListener ) {
this . resizeListener = function ( ) {
if ( _this7 . overlayVisible && ! isTouchDevice ( ) ) {
_this7 . hide ( ) ;
}
} ;
window . addEventListener ( "resize" , this . resizeListener ) ;
}
} , "bindResizeListener" ) ,
unbindResizeListener : /* @__PURE__ */ _ _name ( function unbindResizeListener ( ) {
if ( this . resizeListener ) {
window . removeEventListener ( "resize" , this . resizeListener ) ;
this . resizeListener = null ;
}
} , "unbindResizeListener" ) ,
isOutsideClicked : /* @__PURE__ */ _ _name ( function isOutsideClicked ( event ) {
return ! this . overlay . contains ( event . target ) && ! this . isInputClicked ( event ) && ! this . isDropdownClicked ( event ) ;
} , "isOutsideClicked" ) ,
isInputClicked : /* @__PURE__ */ _ _name ( function isInputClicked ( event ) {
if ( this . multiple ) return event . target === this . $refs . multiContainer || this . $refs . multiContainer . contains ( event . target ) ;
else return event . target === this . $refs . focusInput . $el ;
} , "isInputClicked" ) ,
isDropdownClicked : /* @__PURE__ */ _ _name ( function isDropdownClicked ( event ) {
return this . $refs . dropdownButton ? event . target === this . $refs . dropdownButton || this . $refs . dropdownButton . contains ( event . target ) : false ;
} , "isDropdownClicked" ) ,
isOptionMatched : /* @__PURE__ */ _ _name ( function isOptionMatched ( option2 , value ) {
var _this$getOptionLabel ;
return this . isValidOption ( option2 ) && ( ( _this$getOptionLabel = this . getOptionLabel ( option2 ) ) === null || _this$getOptionLabel === void 0 ? void 0 : _this$getOptionLabel . toLocaleLowerCase ( this . searchLocale ) ) === value . toLocaleLowerCase ( this . searchLocale ) ;
} , "isOptionMatched" ) ,
isValidOption : /* @__PURE__ */ _ _name ( function isValidOption ( option2 ) {
return isNotEmpty ( option2 ) && ! ( this . isOptionDisabled ( option2 ) || this . isOptionGroup ( option2 ) ) ;
} , "isValidOption" ) ,
isValidSelectedOption : /* @__PURE__ */ _ _name ( function isValidSelectedOption ( option2 ) {
return this . isValidOption ( option2 ) && this . isSelected ( option2 ) ;
} , "isValidSelectedOption" ) ,
isEquals : /* @__PURE__ */ _ _name ( function isEquals ( value1 , value2 ) {
return equals ( value1 , value2 , this . equalityKey ) ;
} , "isEquals" ) ,
isSelected : /* @__PURE__ */ _ _name ( function isSelected ( option2 ) {
var _this8 = this ;
var optionValue = this . getOptionValue ( option2 ) ;
return this . multiple ? ( this . modelValue || [ ] ) . some ( function ( value ) {
return _this8 . isEquals ( value , optionValue ) ;
} ) : this . isEquals ( this . modelValue , this . getOptionValue ( option2 ) ) ;
} , "isSelected" ) ,
findFirstOptionIndex : /* @__PURE__ */ _ _name ( function findFirstOptionIndex ( ) {
var _this9 = this ;
return this . visibleOptions . findIndex ( function ( option2 ) {
return _this9 . isValidOption ( option2 ) ;
} ) ;
} , "findFirstOptionIndex" ) ,
findLastOptionIndex : /* @__PURE__ */ _ _name ( function findLastOptionIndex ( ) {
var _this10 = this ;
return findLastIndex ( this . visibleOptions , function ( option2 ) {
return _this10 . isValidOption ( option2 ) ;
} ) ;
} , "findLastOptionIndex" ) ,
findNextOptionIndex : /* @__PURE__ */ _ _name ( function findNextOptionIndex ( index ) {
var _this11 = this ;
var matchedOptionIndex = index < this . visibleOptions . length - 1 ? this . visibleOptions . slice ( index + 1 ) . findIndex ( function ( option2 ) {
return _this11 . isValidOption ( option2 ) ;
} ) : - 1 ;
return matchedOptionIndex > - 1 ? matchedOptionIndex + index + 1 : index ;
} , "findNextOptionIndex" ) ,
findPrevOptionIndex : /* @__PURE__ */ _ _name ( function findPrevOptionIndex ( index ) {
var _this12 = this ;
var matchedOptionIndex = index > 0 ? findLastIndex ( this . visibleOptions . slice ( 0 , index ) , function ( option2 ) {
return _this12 . isValidOption ( option2 ) ;
} ) : - 1 ;
return matchedOptionIndex > - 1 ? matchedOptionIndex : index ;
} , "findPrevOptionIndex" ) ,
findSelectedOptionIndex : /* @__PURE__ */ _ _name ( function findSelectedOptionIndex ( ) {
var _this13 = this ;
return this . hasSelectedOption ? this . visibleOptions . findIndex ( function ( option2 ) {
return _this13 . isValidSelectedOption ( option2 ) ;
} ) : - 1 ;
} , "findSelectedOptionIndex" ) ,
findFirstFocusedOptionIndex : /* @__PURE__ */ _ _name ( function findFirstFocusedOptionIndex ( ) {
var selectedIndex = this . findSelectedOptionIndex ( ) ;
return selectedIndex < 0 ? this . findFirstOptionIndex ( ) : selectedIndex ;
} , "findFirstFocusedOptionIndex" ) ,
findLastFocusedOptionIndex : /* @__PURE__ */ _ _name ( function findLastFocusedOptionIndex ( ) {
var selectedIndex = this . findSelectedOptionIndex ( ) ;
return selectedIndex < 0 ? this . findLastOptionIndex ( ) : selectedIndex ;
} , "findLastFocusedOptionIndex" ) ,
search : /* @__PURE__ */ _ _name ( function search ( event , query , source ) {
if ( query === void 0 || query === null ) {
return ;
}
if ( source === "input" && query . trim ( ) . length === 0 ) {
return ;
}
this . searching = true ;
this . $emit ( "complete" , {
originalEvent : event ,
query
} ) ;
} , "search" ) ,
removeOption : /* @__PURE__ */ _ _name ( function removeOption ( event , index ) {
var _this14 = this ;
var removedOption = this . modelValue [ index ] ;
2024-10-29 18:14:06 +00:00
var value = this . modelValue . filter ( function ( _2 , i ) {
2024-10-28 18:29:38 +00:00
return i !== index ;
} ) . map ( function ( option2 ) {
return _this14 . getOptionValue ( option2 ) ;
} ) ;
this . updateModel ( event , value ) ;
this . $emit ( "item-unselect" , {
originalEvent : event ,
value : removedOption
} ) ;
this . $emit ( "option-unselect" , {
originalEvent : event ,
value : removedOption
} ) ;
this . dirty = true ;
focus ( this . multiple ? this . $refs . focusInput : this . $refs . focusInput . $el ) ;
} , "removeOption" ) ,
changeFocusedOptionIndex : /* @__PURE__ */ _ _name ( function changeFocusedOptionIndex ( event , index ) {
if ( this . focusedOptionIndex !== index ) {
this . focusedOptionIndex = index ;
this . scrollInView ( ) ;
if ( this . selectOnFocus ) {
this . onOptionSelect ( event , this . visibleOptions [ index ] , false ) ;
}
}
} , "changeFocusedOptionIndex" ) ,
2024-10-29 18:14:06 +00:00
scrollInView : /* @__PURE__ */ _ _name ( function scrollInView2 ( ) {
2024-10-28 18:29:38 +00:00
var _this15 = this ;
var index = arguments . length > 0 && arguments [ 0 ] !== void 0 ? arguments [ 0 ] : - 1 ;
this . $nextTick ( function ( ) {
2024-10-29 18:14:06 +00:00
var id2 = index !== - 1 ? "" . concat ( _this15 . id , "_" ) . concat ( index ) : _this15 . focusedOptionId ;
var element = findSingle ( _this15 . list , 'li[id="' . concat ( id2 , '"]' ) ) ;
2024-10-28 18:29:38 +00:00
if ( element ) {
element . scrollIntoView && element . scrollIntoView ( {
block : "nearest" ,
inline : "start"
} ) ;
} else if ( ! _this15 . virtualScrollerDisabled ) {
_this15 . virtualScroller && _this15 . virtualScroller . scrollToIndex ( index !== - 1 ? index : _this15 . focusedOptionIndex ) ;
}
} ) ;
} , "scrollInView" ) ,
autoUpdateModel : /* @__PURE__ */ _ _name ( function autoUpdateModel ( ) {
if ( this . selectOnFocus && this . autoOptionFocus && ! this . hasSelectedOption ) {
this . focusedOptionIndex = this . findFirstFocusedOptionIndex ( ) ;
this . onOptionSelect ( null , this . visibleOptions [ this . focusedOptionIndex ] , false ) ;
}
} , "autoUpdateModel" ) ,
updateModel : /* @__PURE__ */ _ _name ( function updateModel ( event , value ) {
this . $emit ( "update:modelValue" , value ) ;
this . $emit ( "change" , {
originalEvent : event ,
value
} ) ;
} , "updateModel" ) ,
flatOptions : /* @__PURE__ */ _ _name ( function flatOptions ( options ) {
var _this16 = this ;
return ( options || [ ] ) . reduce ( function ( result , option2 , index ) {
result . push ( {
optionGroup : option2 ,
group : true ,
index
} ) ;
var optionGroupChildren = _this16 . getOptionGroupChildren ( option2 ) ;
optionGroupChildren && optionGroupChildren . forEach ( function ( o ) {
return result . push ( o ) ;
} ) ;
return result ;
} , [ ] ) ;
} , "flatOptions" ) ,
overlayRef : /* @__PURE__ */ _ _name ( function overlayRef ( el ) {
this . overlay = el ;
} , "overlayRef" ) ,
listRef : /* @__PURE__ */ _ _name ( function listRef ( el , contentRef ) {
this . list = el ;
contentRef && contentRef ( el ) ;
} , "listRef" ) ,
virtualScrollerRef : /* @__PURE__ */ _ _name ( function virtualScrollerRef ( el ) {
this . virtualScroller = el ;
} , "virtualScrollerRef" )
} ,
computed : {
visibleOptions : /* @__PURE__ */ _ _name ( function visibleOptions ( ) {
return this . optionGroupLabel ? this . flatOptions ( this . suggestions ) : this . suggestions || [ ] ;
} , "visibleOptions" ) ,
inputValue : /* @__PURE__ */ _ _name ( function inputValue ( ) {
if ( isNotEmpty ( this . modelValue ) ) {
if ( _typeof$1$1 ( this . modelValue ) === "object" ) {
var label = this . getOptionLabel ( this . modelValue ) ;
return label != null ? label : this . modelValue ;
} else {
return this . modelValue ;
}
} else {
return "" ;
}
} , "inputValue" ) ,
hasSelectedOption : /* @__PURE__ */ _ _name ( function hasSelectedOption ( ) {
return isNotEmpty ( this . modelValue ) ;
} , "hasSelectedOption" ) ,
equalityKey : /* @__PURE__ */ _ _name ( function equalityKey ( ) {
return this . dataKey ;
} , "equalityKey" ) ,
searchResultMessageText : /* @__PURE__ */ _ _name ( function searchResultMessageText ( ) {
return isNotEmpty ( this . visibleOptions ) && this . overlayVisible ? this . searchMessageText . replaceAll ( "{0}" , this . visibleOptions . length ) : this . emptySearchMessageText ;
} , "searchResultMessageText" ) ,
searchMessageText : /* @__PURE__ */ _ _name ( function searchMessageText ( ) {
return this . searchMessage || this . $primevue . config . locale . searchMessage || "" ;
} , "searchMessageText" ) ,
emptySearchMessageText : /* @__PURE__ */ _ _name ( function emptySearchMessageText ( ) {
return this . emptySearchMessage || this . $primevue . config . locale . emptySearchMessage || "" ;
} , "emptySearchMessageText" ) ,
selectionMessageText : /* @__PURE__ */ _ _name ( function selectionMessageText ( ) {
return this . selectionMessage || this . $primevue . config . locale . selectionMessage || "" ;
} , "selectionMessageText" ) ,
emptySelectionMessageText : /* @__PURE__ */ _ _name ( function emptySelectionMessageText ( ) {
return this . emptySelectionMessage || this . $primevue . config . locale . emptySelectionMessage || "" ;
} , "emptySelectionMessageText" ) ,
selectedMessageText : /* @__PURE__ */ _ _name ( function selectedMessageText ( ) {
return this . hasSelectedOption ? this . selectionMessageText . replaceAll ( "{0}" , this . multiple ? this . modelValue . length : "1" ) : this . emptySelectionMessageText ;
} , "selectedMessageText" ) ,
listAriaLabel : /* @__PURE__ */ _ _name ( function listAriaLabel ( ) {
return this . $primevue . config . locale . aria ? this . $primevue . config . locale . aria . listLabel : void 0 ;
} , "listAriaLabel" ) ,
focusedOptionId : /* @__PURE__ */ _ _name ( function focusedOptionId ( ) {
return this . focusedOptionIndex !== - 1 ? "" . concat ( this . id , "_" ) . concat ( this . focusedOptionIndex ) : null ;
} , "focusedOptionId" ) ,
focusedMultipleOptionId : /* @__PURE__ */ _ _name ( function focusedMultipleOptionId ( ) {
return this . focusedMultipleOptionIndex !== - 1 ? "" . concat ( this . id , "_multiple_option_" ) . concat ( this . focusedMultipleOptionIndex ) : null ;
} , "focusedMultipleOptionId" ) ,
ariaSetSize : /* @__PURE__ */ _ _name ( function ariaSetSize ( ) {
var _this17 = this ;
return this . visibleOptions . filter ( function ( option2 ) {
return ! _this17 . isOptionGroup ( option2 ) ;
} ) . length ;
} , "ariaSetSize" ) ,
virtualScrollerDisabled : /* @__PURE__ */ _ _name ( function virtualScrollerDisabled ( ) {
return ! this . virtualScrollerOptions ;
} , "virtualScrollerDisabled" ) ,
panelId : /* @__PURE__ */ _ _name ( function panelId ( ) {
return this . id + "_panel" ;
} , "panelId" ) ,
hasFluid : /* @__PURE__ */ _ _name ( function hasFluid ( ) {
return isEmpty ( this . fluid ) ? ! ! this . $pcFluid : this . fluid ;
} , "hasFluid" )
} ,
components : {
2024-10-29 18:14:06 +00:00
InputText : script$k ,
VirtualScroller : script$l ,
Portal : script$m ,
ChevronDownIcon : script$n ,
SpinnerIcon : script$o ,
Chip : script$p
2024-10-28 18:29:38 +00:00
} ,
directives : {
ripple : Ripple
}
} ;
function _typeof$4 ( o ) {
"@babel/helpers - typeof" ;
return _typeof$4 = "function" == typeof Symbol && "symbol" == typeof Symbol . iterator ? function ( o2 ) {
return typeof o2 ;
} : function ( o2 ) {
return o2 && "function" == typeof Symbol && o2 . constructor === Symbol && o2 !== Symbol . prototype ? "symbol" : typeof o2 ;
} , _typeof$4 ( o ) ;
}
_ _name ( _typeof$4 , "_typeof$4" ) ;
function ownKeys$3 ( e , r ) {
var t = Object . keys ( e ) ;
if ( Object . getOwnPropertySymbols ) {
var o = Object . getOwnPropertySymbols ( e ) ;
r && ( o = o . filter ( function ( r2 ) {
return Object . getOwnPropertyDescriptor ( e , r2 ) . enumerable ;
} ) ) , t . push . apply ( t , o ) ;
}
return t ;
}
_ _name ( ownKeys$3 , "ownKeys$3" ) ;
function _objectSpread$3 ( e ) {
for ( var r = 1 ; r < arguments . length ; r ++ ) {
var t = null != arguments [ r ] ? arguments [ r ] : { } ;
r % 2 ? ownKeys$3 ( Object ( t ) , true ) . forEach ( function ( r2 ) {
_defineProperty$4 ( e , r2 , t [ r2 ] ) ;
} ) : Object . getOwnPropertyDescriptors ? Object . defineProperties ( e , Object . getOwnPropertyDescriptors ( t ) ) : ownKeys$3 ( Object ( t ) ) . forEach ( function ( r2 ) {
Object . defineProperty ( e , r2 , Object . getOwnPropertyDescriptor ( t , r2 ) ) ;
} ) ;
}
return e ;
}
_ _name ( _objectSpread$3 , "_objectSpread$3" ) ;
function _defineProperty$4 ( e , r , t ) {
return ( r = _toPropertyKey$4 ( r ) ) in e ? Object . defineProperty ( e , r , { value : t , enumerable : true , configurable : true , writable : true } ) : e [ r ] = t , e ;
}
_ _name ( _defineProperty$4 , "_defineProperty$4" ) ;
function _toPropertyKey$4 ( t ) {
var i = _toPrimitive$4 ( t , "string" ) ;
return "symbol" == _typeof$4 ( i ) ? i : i + "" ;
}
_ _name ( _toPropertyKey$4 , "_toPropertyKey$4" ) ;
function _toPrimitive$4 ( t , r ) {
if ( "object" != _typeof$4 ( t ) || ! t ) return t ;
var e = t [ Symbol . toPrimitive ] ;
if ( void 0 !== e ) {
var i = e . call ( t , r || "default" ) ;
if ( "object" != _typeof$4 ( i ) ) return i ;
throw new TypeError ( "@@toPrimitive must return a primitive value." ) ;
}
return ( "string" === r ? String : Number ) ( t ) ;
}
_ _name ( _toPrimitive$4 , "_toPrimitive$4" ) ;
2024-11-16 01:17:15 +00:00
var _hoisted _1$j = [ "aria-activedescendant" ] ;
var _hoisted _2$g = [ "id" , "aria-label" , "aria-setsize" , "aria-posinset" ] ;
var _hoisted _3$e = [ "id" , "placeholder" , "tabindex" , "disabled" , "aria-label" , "aria-labelledby" , "aria-expanded" , "aria-controls" , "aria-activedescendant" , "aria-invalid" ] ;
2024-10-28 18:29:38 +00:00
var _hoisted _4$4 = [ "disabled" , "aria-expanded" , "aria-controls" ] ;
var _hoisted _5$3 = [ "id" ] ;
var _hoisted _6$2 = [ "id" , "aria-label" ] ;
var _hoisted _7$1 = [ "id" ] ;
var _hoisted _8$1 = [ "id" , "aria-label" , "aria-selected" , "aria-disabled" , "aria-setsize" , "aria-posinset" , "onClick" , "onMousemove" , "data-p-selected" , "data-p-focus" , "data-p-disabled" ] ;
2024-11-16 01:17:15 +00:00
function render$e ( _ctx , _cache , $props , $setup , $data , $options ) {
2024-10-28 18:29:38 +00:00
var _component _InputText = resolveComponent ( "InputText" ) ;
var _component _Chip = resolveComponent ( "Chip" ) ;
var _component _SpinnerIcon = resolveComponent ( "SpinnerIcon" ) ;
var _component _VirtualScroller = resolveComponent ( "VirtualScroller" ) ;
var _component _Portal = resolveComponent ( "Portal" ) ;
var _directive _ripple = resolveDirective ( "ripple" ) ;
return openBlock ( ) , createElementBlock ( "div" , mergeProps ( {
ref : "container" ,
"class" : _ctx . cx ( "root" ) ,
style : _ctx . sx ( "root" ) ,
onClick : _cache [ 11 ] || ( _cache [ 11 ] = function ( ) {
return $options . onContainerClick && $options . onContainerClick . apply ( $options , arguments ) ;
} )
} , _ctx . ptmi ( "root" ) ) , [ ! _ctx . multiple ? ( openBlock ( ) , createBlock ( _component _InputText , {
key : 0 ,
ref : "focusInput" ,
id : _ctx . inputId ,
type : "text" ,
"class" : normalizeClass ( [ _ctx . cx ( "pcInput" ) , _ctx . inputClass ] ) ,
style : normalizeStyle ( _ctx . inputStyle ) ,
value : $options . inputValue ,
placeholder : _ctx . placeholder ,
tabindex : ! _ctx . disabled ? _ctx . tabindex : - 1 ,
fluid : $options . hasFluid ,
disabled : _ctx . disabled ,
invalid : _ctx . invalid ,
variant : _ctx . variant ,
autocomplete : "off" ,
role : "combobox" ,
"aria-label" : _ctx . ariaLabel ,
"aria-labelledby" : _ctx . ariaLabelledby ,
"aria-haspopup" : "listbox" ,
"aria-autocomplete" : "list" ,
"aria-expanded" : $data . overlayVisible ,
"aria-controls" : $options . panelId ,
"aria-activedescendant" : $data . focused ? $options . focusedOptionId : void 0 ,
onFocus : $options . onFocus ,
onBlur : $options . onBlur ,
onKeydown : $options . onKeyDown ,
onInput : $options . onInput ,
onChange : $options . onChange ,
unstyled : _ctx . unstyled ,
pt : _ctx . ptm ( "pcInput" )
} , null , 8 , [ "id" , "class" , "style" , "value" , "placeholder" , "tabindex" , "fluid" , "disabled" , "invalid" , "variant" , "aria-label" , "aria-labelledby" , "aria-expanded" , "aria-controls" , "aria-activedescendant" , "onFocus" , "onBlur" , "onKeydown" , "onInput" , "onChange" , "unstyled" , "pt" ] ) ) : createCommentVNode ( "" , true ) , _ctx . multiple ? ( openBlock ( ) , createElementBlock ( "ul" , mergeProps ( {
key : 1 ,
ref : "multiContainer" ,
"class" : _ctx . cx ( "inputMultiple" ) ,
tabindex : "-1" ,
role : "listbox" ,
"aria-orientation" : "horizontal" ,
"aria-activedescendant" : $data . focused ? $options . focusedMultipleOptionId : void 0 ,
onFocus : _cache [ 5 ] || ( _cache [ 5 ] = function ( ) {
return $options . onMultipleContainerFocus && $options . onMultipleContainerFocus . apply ( $options , arguments ) ;
} ) ,
onBlur : _cache [ 6 ] || ( _cache [ 6 ] = function ( ) {
return $options . onMultipleContainerBlur && $options . onMultipleContainerBlur . apply ( $options , arguments ) ;
} ) ,
onKeydown : _cache [ 7 ] || ( _cache [ 7 ] = function ( ) {
return $options . onMultipleContainerKeyDown && $options . onMultipleContainerKeyDown . apply ( $options , arguments ) ;
} )
} , _ctx . ptm ( "inputMultiple" ) ) , [ ( openBlock ( true ) , createElementBlock ( Fragment , null , renderList ( _ctx . modelValue , function ( option2 , i ) {
return openBlock ( ) , createElementBlock ( "li" , mergeProps ( {
key : "" . concat ( i , "_" ) . concat ( $options . getOptionLabel ( option2 ) ) ,
id : $data . id + "_multiple_option_" + i ,
"class" : _ctx . cx ( "chipItem" , {
i
} ) ,
role : "option" ,
"aria-label" : $options . getOptionLabel ( option2 ) ,
"aria-selected" : true ,
"aria-setsize" : _ctx . modelValue . length ,
"aria-posinset" : i + 1 ,
ref _for : true
} , _ctx . ptm ( "chipItem" ) ) , [ renderSlot ( _ctx . $slots , "chip" , mergeProps ( {
"class" : _ctx . cx ( "pcChip" ) ,
value : option2 ,
index : i ,
removeCallback : /* @__PURE__ */ _ _name ( function removeCallback ( event ) {
return $options . removeOption ( event , i ) ;
} , "removeCallback" ) ,
ref _for : true
} , _ctx . ptm ( "pcChip" ) ) , function ( ) {
return [ createVNode ( _component _Chip , {
"class" : normalizeClass ( _ctx . cx ( "pcChip" ) ) ,
label : $options . getOptionLabel ( option2 ) ,
removeIcon : _ctx . chipIcon || _ctx . removeTokenIcon ,
removable : "" ,
unstyled : _ctx . unstyled ,
onRemove : /* @__PURE__ */ _ _name ( function onRemove2 ( $event ) {
return $options . removeOption ( $event , i ) ;
} , "onRemove" ) ,
pt : _ctx . ptm ( "pcChip" )
} , {
removeicon : withCtx ( function ( ) {
return [ renderSlot ( _ctx . $slots , _ctx . $slots . chipicon ? "chipicon" : "removetokenicon" , {
"class" : normalizeClass ( _ctx . cx ( "chipIcon" ) ) ,
index : i ,
removeCallback : /* @__PURE__ */ _ _name ( function removeCallback ( event ) {
return $options . removeOption ( event , i ) ;
} , "removeCallback" )
} ) ] ;
} ) ,
_ : 2
} , 1032 , [ "class" , "label" , "removeIcon" , "unstyled" , "onRemove" , "pt" ] ) ] ;
2024-11-16 01:17:15 +00:00
} ) ] , 16 , _hoisted _2$g ) ;
2024-10-28 18:29:38 +00:00
} ) , 128 ) ) , createBaseVNode ( "li" , mergeProps ( {
"class" : _ctx . cx ( "inputChip" ) ,
role : "option"
} , _ctx . ptm ( "inputChip" ) ) , [ createBaseVNode ( "input" , mergeProps ( {
ref : "focusInput" ,
id : _ctx . inputId ,
type : "text" ,
style : _ctx . inputStyle ,
"class" : _ctx . inputClass ,
placeholder : _ctx . placeholder ,
tabindex : ! _ctx . disabled ? _ctx . tabindex : - 1 ,
disabled : _ctx . disabled ,
autocomplete : "off" ,
role : "combobox" ,
"aria-label" : _ctx . ariaLabel ,
"aria-labelledby" : _ctx . ariaLabelledby ,
"aria-haspopup" : "listbox" ,
"aria-autocomplete" : "list" ,
"aria-expanded" : $data . overlayVisible ,
"aria-controls" : $data . id + "_list" ,
"aria-activedescendant" : $data . focused ? $options . focusedOptionId : void 0 ,
"aria-invalid" : _ctx . invalid || void 0 ,
onFocus : _cache [ 0 ] || ( _cache [ 0 ] = function ( ) {
return $options . onFocus && $options . onFocus . apply ( $options , arguments ) ;
} ) ,
onBlur : _cache [ 1 ] || ( _cache [ 1 ] = function ( ) {
return $options . onBlur && $options . onBlur . apply ( $options , arguments ) ;
} ) ,
onKeydown : _cache [ 2 ] || ( _cache [ 2 ] = function ( ) {
return $options . onKeyDown && $options . onKeyDown . apply ( $options , arguments ) ;
} ) ,
onInput : _cache [ 3 ] || ( _cache [ 3 ] = function ( ) {
return $options . onInput && $options . onInput . apply ( $options , arguments ) ;
} ) ,
onChange : _cache [ 4 ] || ( _cache [ 4 ] = function ( ) {
return $options . onChange && $options . onChange . apply ( $options , arguments ) ;
} )
2024-11-16 01:17:15 +00:00
} , _ctx . ptm ( "input" ) ) , null , 16 , _hoisted _3$e ) ] , 16 ) ] , 16 , _hoisted _1$j ) ) : createCommentVNode ( "" , true ) , $data . searching || _ctx . loading ? renderSlot ( _ctx . $slots , _ctx . $slots . loader ? "loader" : "loadingicon" , {
2024-10-28 18:29:38 +00:00
key : 2 ,
"class" : normalizeClass ( _ctx . cx ( "loader" ) )
} , function ( ) {
return [ _ctx . loader || _ctx . loadingIcon ? ( openBlock ( ) , createElementBlock ( "i" , mergeProps ( {
key : 0 ,
"class" : [ "pi-spin" , _ctx . cx ( "loader" ) , _ctx . loader , _ctx . loadingIcon ] ,
"aria-hidden" : "true"
} , _ctx . ptm ( "loader" ) ) , null , 16 ) ) : ( openBlock ( ) , createBlock ( _component _SpinnerIcon , mergeProps ( {
key : 1 ,
"class" : _ctx . cx ( "loader" ) ,
spin : "" ,
"aria-hidden" : "true"
} , _ctx . ptm ( "loader" ) ) , null , 16 , [ "class" ] ) ) ] ;
} ) : createCommentVNode ( "" , true ) , renderSlot ( _ctx . $slots , _ctx . $slots . dropdown ? "dropdown" : "dropdownbutton" , {
toggleCallback : /* @__PURE__ */ _ _name ( function toggleCallback ( event ) {
return $options . onDropdownClick ( event ) ;
} , "toggleCallback" )
} , function ( ) {
return [ _ctx . dropdown ? ( openBlock ( ) , createElementBlock ( "button" , mergeProps ( {
key : 0 ,
ref : "dropdownButton" ,
type : "button" ,
"class" : [ _ctx . cx ( "dropdown" ) , _ctx . dropdownClass ] ,
disabled : _ctx . disabled ,
"aria-haspopup" : "listbox" ,
"aria-expanded" : $data . overlayVisible ,
"aria-controls" : $options . panelId ,
onClick : _cache [ 8 ] || ( _cache [ 8 ] = function ( ) {
return $options . onDropdownClick && $options . onDropdownClick . apply ( $options , arguments ) ;
} )
} , _ctx . ptm ( "dropdown" ) ) , [ renderSlot ( _ctx . $slots , "dropdownicon" , {
"class" : normalizeClass ( _ctx . dropdownIcon )
} , function ( ) {
return [ ( openBlock ( ) , createBlock ( resolveDynamicComponent ( _ctx . dropdownIcon ? "span" : "ChevronDownIcon" ) , mergeProps ( {
"class" : _ctx . dropdownIcon
} , _ctx . ptm ( "dropdownIcon" ) ) , null , 16 , [ "class" ] ) ) ] ;
} ) ] , 16 , _hoisted _4$4 ) ) : createCommentVNode ( "" , true ) ] ;
} ) , createBaseVNode ( "span" , mergeProps ( {
role : "status" ,
"aria-live" : "polite" ,
"class" : "p-hidden-accessible"
} , _ctx . ptm ( "hiddenSearchResult" ) , {
"data-p-hidden-accessible" : true
} ) , toDisplayString ( $options . searchResultMessageText ) , 17 ) , createVNode ( _component _Portal , {
appendTo : _ctx . appendTo
} , {
"default" : withCtx ( function ( ) {
return [ createVNode ( Transition , mergeProps ( {
name : "p-connected-overlay" ,
onEnter : $options . onOverlayEnter ,
onAfterEnter : $options . onOverlayAfterEnter ,
onLeave : $options . onOverlayLeave ,
onAfterLeave : $options . onOverlayAfterLeave
} , _ctx . ptm ( "transition" ) ) , {
"default" : withCtx ( function ( ) {
return [ $data . overlayVisible ? ( openBlock ( ) , createElementBlock ( "div" , mergeProps ( {
key : 0 ,
ref : $options . overlayRef ,
id : $options . panelId ,
"class" : [ _ctx . cx ( "overlay" ) , _ctx . panelClass , _ctx . overlayClass ] ,
style : _objectSpread$3 ( _objectSpread$3 ( _objectSpread$3 ( { } , _ctx . panelStyle ) , _ctx . overlayStyle ) , { } , {
"max-height" : $options . virtualScrollerDisabled ? _ctx . scrollHeight : ""
} ) ,
onClick : _cache [ 9 ] || ( _cache [ 9 ] = function ( ) {
return $options . onOverlayClick && $options . onOverlayClick . apply ( $options , arguments ) ;
} ) ,
onKeydown : _cache [ 10 ] || ( _cache [ 10 ] = function ( ) {
return $options . onOverlayKeyDown && $options . onOverlayKeyDown . apply ( $options , arguments ) ;
} )
} , _ctx . ptm ( "overlay" ) ) , [ renderSlot ( _ctx . $slots , "header" , {
value : _ctx . modelValue ,
suggestions : $options . visibleOptions
} ) , createVNode ( _component _VirtualScroller , mergeProps ( {
ref : $options . virtualScrollerRef
} , _ctx . virtualScrollerOptions , {
style : {
height : _ctx . scrollHeight
} ,
items : $options . visibleOptions ,
tabindex : - 1 ,
disabled : $options . virtualScrollerDisabled ,
pt : _ctx . ptm ( "virtualScroller" )
} ) , createSlots ( {
content : withCtx ( function ( _ref ) {
var styleClass = _ref . styleClass , contentRef = _ref . contentRef , items = _ref . items , getItemOptions = _ref . getItemOptions , contentStyle = _ref . contentStyle , itemSize = _ref . itemSize ;
return [ createBaseVNode ( "ul" , mergeProps ( {
ref : /* @__PURE__ */ _ _name ( function ref2 ( el ) {
return $options . listRef ( el , contentRef ) ;
} , "ref" ) ,
id : $data . id + "_list" ,
"class" : [ _ctx . cx ( "list" ) , styleClass ] ,
style : contentStyle ,
role : "listbox" ,
"aria-label" : $options . listAriaLabel
} , _ctx . ptm ( "list" ) ) , [ ( openBlock ( true ) , createElementBlock ( Fragment , null , renderList ( items , function ( option2 , i ) {
return openBlock ( ) , createElementBlock ( Fragment , {
key : $options . getOptionRenderKey ( option2 , $options . getOptionIndex ( i , getItemOptions ) )
} , [ $options . isOptionGroup ( option2 ) ? ( openBlock ( ) , createElementBlock ( "li" , mergeProps ( {
key : 0 ,
id : $data . id + "_" + $options . getOptionIndex ( i , getItemOptions ) ,
style : {
height : itemSize ? itemSize + "px" : void 0
} ,
"class" : _ctx . cx ( "optionGroup" ) ,
role : "option" ,
ref _for : true
} , _ctx . ptm ( "optionGroup" ) ) , [ renderSlot ( _ctx . $slots , "optiongroup" , {
option : option2 . optionGroup ,
index : $options . getOptionIndex ( i , getItemOptions )
} , function ( ) {
return [ createTextVNode ( toDisplayString ( $options . getOptionGroupLabel ( option2 . optionGroup ) ) , 1 ) ] ;
} ) ] , 16 , _hoisted _7$1 ) ) : withDirectives ( ( openBlock ( ) , createElementBlock ( "li" , mergeProps ( {
key : 1 ,
id : $data . id + "_" + $options . getOptionIndex ( i , getItemOptions ) ,
style : {
height : itemSize ? itemSize + "px" : void 0
} ,
"class" : _ctx . cx ( "option" , {
option : option2 ,
i ,
getItemOptions
} ) ,
role : "option" ,
"aria-label" : $options . getOptionLabel ( option2 ) ,
"aria-selected" : $options . isSelected ( option2 ) ,
"aria-disabled" : $options . isOptionDisabled ( option2 ) ,
"aria-setsize" : $options . ariaSetSize ,
"aria-posinset" : $options . getAriaPosInset ( $options . getOptionIndex ( i , getItemOptions ) ) ,
2024-10-29 18:14:06 +00:00
onClick : /* @__PURE__ */ _ _name ( function onClick2 ( $event ) {
2024-10-28 18:29:38 +00:00
return $options . onOptionSelect ( $event , option2 ) ;
} , "onClick" ) ,
onMousemove : /* @__PURE__ */ _ _name ( function onMousemove ( $event ) {
return $options . onOptionMouseMove ( $event , $options . getOptionIndex ( i , getItemOptions ) ) ;
} , "onMousemove" ) ,
"data-p-selected" : $options . isSelected ( option2 ) ,
"data-p-focus" : $data . focusedOptionIndex === $options . getOptionIndex ( i , getItemOptions ) ,
"data-p-disabled" : $options . isOptionDisabled ( option2 ) ,
ref _for : true
} , $options . getPTOptions ( option2 , getItemOptions , i , "option" ) ) , [ renderSlot ( _ctx . $slots , "option" , {
option : option2 ,
index : $options . getOptionIndex ( i , getItemOptions )
} , function ( ) {
return [ createTextVNode ( toDisplayString ( $options . getOptionLabel ( option2 ) ) , 1 ) ] ;
} ) ] , 16 , _hoisted _8$1 ) ) , [ [ _directive _ripple ] ] ) ] , 64 ) ;
} ) , 128 ) ) , ! items || items && items . length === 0 ? ( openBlock ( ) , createElementBlock ( "li" , mergeProps ( {
key : 0 ,
"class" : _ctx . cx ( "emptyMessage" ) ,
role : "option"
} , _ctx . ptm ( "emptyMessage" ) ) , [ renderSlot ( _ctx . $slots , "empty" , { } , function ( ) {
return [ createTextVNode ( toDisplayString ( $options . searchResultMessageText ) , 1 ) ] ;
} ) ] , 16 ) ) : createCommentVNode ( "" , true ) ] , 16 , _hoisted _6$2 ) ] ;
} ) ,
_ : 2
} , [ _ctx . $slots . loader ? {
name : "loader" ,
fn : withCtx ( function ( _ref2 ) {
var options = _ref2 . options ;
return [ renderSlot ( _ctx . $slots , "loader" , {
options
} ) ] ;
} ) ,
key : "0"
} : void 0 ] ) , 1040 , [ "style" , "items" , "disabled" , "pt" ] ) , renderSlot ( _ctx . $slots , "footer" , {
value : _ctx . modelValue ,
suggestions : $options . visibleOptions
} ) , createBaseVNode ( "span" , mergeProps ( {
role : "status" ,
"aria-live" : "polite" ,
"class" : "p-hidden-accessible"
} , _ctx . ptm ( "hiddenSelectedMessage" ) , {
"data-p-hidden-accessible" : true
} ) , toDisplayString ( $options . selectedMessageText ) , 17 ) ] , 16 , _hoisted _5$3 ) ) : createCommentVNode ( "" , true ) ] ;
} ) ,
_ : 3
} , 16 , [ "onEnter" , "onAfterEnter" , "onLeave" , "onAfterLeave" ] ) ] ;
} ) ,
_ : 3
} , 8 , [ "appendTo" ] ) ] , 16 ) ;
}
2024-11-16 01:17:15 +00:00
_ _name ( render$e , "render$e" ) ;
script$8 . render = render$e ;
const _sfc _main$j = {
2024-10-28 18:29:38 +00:00
name : "AutoCompletePlus" ,
extends : script$8 ,
emits : [ "focused-option-changed" ] ,
mounted ( ) {
if ( typeof script$8 . mounted === "function" ) {
script$8 . mounted . call ( this ) ;
}
this . $watch (
( ) => this . focusedOptionIndex ,
( newVal , oldVal ) => {
this . $emit ( "focused-option-changed" , newVal ) ;
}
) ;
}
} ;
const _withScopeId$5 = /* @__PURE__ */ _ _name ( ( n ) => ( pushScopeId ( "data-v-37f672ab" ) , n = n ( ) , popScopeId ( ) , n ) , "_withScopeId$5" ) ;
2024-11-16 01:17:15 +00:00
const _hoisted _1$i = { class : "option-container flex justify-between items-center px-2 py-0 cursor-pointer overflow-hidden w-full" } ;
const _hoisted _2$f = { class : "option-display-name font-semibold flex flex-col" } ;
const _hoisted _3$d = { key : 0 } ;
2024-10-28 18:29:38 +00:00
const _hoisted _4$3 = /* @__PURE__ */ _withScopeId$5 ( ( ) => /* @__PURE__ */ createBaseVNode ( "i" , { class : "pi pi-bookmark-fill text-sm mr-1" } , null , - 1 ) ) ;
const _hoisted _5$2 = [
_hoisted _4$3
] ;
const _hoisted _6$1 = [ "innerHTML" ] ;
const _hoisted _7 = /* @__PURE__ */ _withScopeId$5 ( ( ) => /* @__PURE__ */ createBaseVNode ( "span" , null , " " , - 1 ) ) ;
const _hoisted _8 = [ "innerHTML" ] ;
const _hoisted _9 = {
key : 0 ,
class : "option-category font-light text-sm text-gray-400 overflow-hidden text-ellipsis whitespace-nowrap"
} ;
const _hoisted _10 = { class : "option-badges" } ;
2024-11-16 01:17:15 +00:00
const _sfc _main$i = /* @__PURE__ */ defineComponent ( {
2024-10-28 18:29:38 +00:00
_ _name : "NodeSearchItem" ,
props : {
nodeDef : { } ,
currentQuery : { }
} ,
setup ( _ _props ) {
const settingStore = useSettingStore ( ) ;
const showCategory = computed (
( ) => settingStore . get ( "Comfy.NodeSearchBoxImpl.ShowCategory" )
) ;
const showIdName = computed (
( ) => settingStore . get ( "Comfy.NodeSearchBoxImpl.ShowIdName" )
) ;
const showNodeFrequency = computed (
( ) => settingStore . get ( "Comfy.NodeSearchBoxImpl.ShowNodeFrequency" )
) ;
const nodeFrequencyStore = useNodeFrequencyStore ( ) ;
const nodeFrequency = computed (
( ) => nodeFrequencyStore . getNodeFrequency ( props . nodeDef )
) ;
const nodeBookmarkStore = useNodeBookmarkStore ( ) ;
const isBookmarked = computed (
( ) => nodeBookmarkStore . isBookmarked ( props . nodeDef )
) ;
const props = _ _props ;
return ( _ctx , _cache ) => {
2024-11-16 01:17:15 +00:00
return openBlock ( ) , createElementBlock ( "div" , _hoisted _1$i , [
createBaseVNode ( "div" , _hoisted _2$f , [
2024-10-28 18:29:38 +00:00
createBaseVNode ( "div" , null , [
2024-11-16 01:17:15 +00:00
isBookmarked . value ? ( openBlock ( ) , createElementBlock ( "span" , _hoisted _3$d , _hoisted _5$2 ) ) : createCommentVNode ( "" , true ) ,
2024-10-28 18:29:38 +00:00
createBaseVNode ( "span" , {
innerHTML : unref ( highlightQuery ) ( _ctx . nodeDef . display _name , _ctx . currentQuery )
} , null , 8 , _hoisted _6$1 ) ,
_hoisted _7 ,
2024-10-29 18:14:06 +00:00
showIdName . value ? ( openBlock ( ) , createBlock ( unref ( script$q ) , {
2024-10-28 18:29:38 +00:00
key : 1 ,
severity : "secondary"
} , {
default : withCtx ( ( ) => [
createBaseVNode ( "span" , {
innerHTML : unref ( highlightQuery ) ( _ctx . nodeDef . name , _ctx . currentQuery )
} , null , 8 , _hoisted _8 )
] ) ,
_ : 1
} ) ) : createCommentVNode ( "" , true )
] ) ,
showCategory . value ? ( openBlock ( ) , createElementBlock ( "div" , _hoisted _9 , toDisplayString ( _ctx . nodeDef . category . replaceAll ( "/" , " > " ) ) , 1 ) ) : createCommentVNode ( "" , true )
] ) ,
createBaseVNode ( "div" , _hoisted _10 , [
2024-10-29 18:14:06 +00:00
_ctx . nodeDef . experimental ? ( openBlock ( ) , createBlock ( unref ( script$q ) , {
2024-10-28 18:29:38 +00:00
key : 0 ,
value : _ctx . $t ( "experimental" ) ,
severity : "primary"
} , null , 8 , [ "value" ] ) ) : createCommentVNode ( "" , true ) ,
2024-10-29 18:14:06 +00:00
_ctx . nodeDef . deprecated ? ( openBlock ( ) , createBlock ( unref ( script$q ) , {
2024-10-28 18:29:38 +00:00
key : 1 ,
value : _ctx . $t ( "deprecated" ) ,
severity : "danger"
} , null , 8 , [ "value" ] ) ) : createCommentVNode ( "" , true ) ,
2024-10-29 18:14:06 +00:00
showNodeFrequency . value && nodeFrequency . value > 0 ? ( openBlock ( ) , createBlock ( unref ( script$q ) , {
2024-10-28 18:29:38 +00:00
key : 2 ,
value : unref ( formatNumberWithSuffix ) ( nodeFrequency . value , { roundToInt : true } ) ,
severity : "secondary"
} , null , 8 , [ "value" ] ) ) : createCommentVNode ( "" , true ) ,
2024-10-29 18:14:06 +00:00
_ctx . nodeDef . nodeSource . type !== unref ( NodeSourceType ) . Unknown ? ( openBlock ( ) , createBlock ( unref ( script$p ) , {
2024-10-28 18:29:38 +00:00
key : 3 ,
class : "text-sm font-light"
} , {
default : withCtx ( ( ) => [
createTextVNode ( toDisplayString ( _ctx . nodeDef . nodeSource . displayText ) , 1 )
] ) ,
_ : 1
} ) ) : createCommentVNode ( "" , true )
] )
] ) ;
} ;
}
} ) ;
2024-11-16 01:17:15 +00:00
const NodeSearchItem = /* @__PURE__ */ _export _sfc ( _sfc _main$i , [ [ "__scopeId" , "data-v-37f672ab" ] ] ) ;
2024-10-28 18:29:38 +00:00
const _withScopeId$4 = /* @__PURE__ */ _ _name ( ( n ) => ( pushScopeId ( "data-v-2d409367" ) , n = n ( ) , popScopeId ( ) , n ) , "_withScopeId$4" ) ;
2024-11-16 01:17:15 +00:00
const _hoisted _1$h = { class : "comfy-vue-node-search-container" } ;
const _hoisted _2$e = {
2024-10-28 18:29:38 +00:00
key : 0 ,
class : "comfy-vue-node-preview-container"
} ;
2024-11-16 01:17:15 +00:00
const _hoisted _3$c = /* @__PURE__ */ _withScopeId$4 ( ( ) => /* @__PURE__ */ createBaseVNode ( "h3" , null , "Add node filter condition" , - 1 ) ) ;
2024-10-28 18:29:38 +00:00
const _hoisted _4$2 = { class : "_dialog-body" } ;
2024-11-16 01:17:15 +00:00
const _sfc _main$h = /* @__PURE__ */ defineComponent ( {
2024-10-28 18:29:38 +00:00
_ _name : "NodeSearchBox" ,
props : {
filters : { } ,
searchLimit : { default : 64 }
} ,
emits : [ "addFilter" , "removeFilter" , "addNode" ] ,
setup ( _ _props , { emit : _ _emit } ) {
const settingStore = useSettingStore ( ) ;
const { t } = useI18n ( ) ;
const enableNodePreview = computed (
( ) => settingStore . get ( "Comfy.NodeSearchBoxImpl.NodePreview" )
) ;
const props = _ _props ;
const nodeSearchFilterVisible = ref ( false ) ;
const inputId = ` comfy-vue-node-search-box-input- ${ Math . random ( ) } ` ;
const suggestions2 = ref ( [ ] ) ;
const hoveredSuggestion = ref ( null ) ;
const currentQuery = ref ( "" ) ;
const placeholder = computed ( ( ) => {
return props . filters . length === 0 ? t ( "searchNodes" ) + "..." : "" ;
} ) ;
const nodeDefStore = useNodeDefStore ( ) ;
const nodeFrequencyStore = useNodeFrequencyStore ( ) ;
const search2 = /* @__PURE__ */ _ _name ( ( query ) => {
const queryIsEmpty = query === "" && props . filters . length === 0 ;
currentQuery . value = query ;
suggestions2 . value = queryIsEmpty ? nodeFrequencyStore . topNodeDefs : [
... nodeDefStore . nodeSearchService . searchNode ( query , props . filters , {
limit : props . searchLimit
} )
] ;
} , "search" ) ;
const emit = _ _emit ;
const reFocusInput = /* @__PURE__ */ _ _name ( ( ) => {
const inputElement = document . getElementById ( inputId ) ;
if ( inputElement ) {
inputElement . blur ( ) ;
inputElement . focus ( ) ;
}
} , "reFocusInput" ) ;
onMounted ( reFocusInput ) ;
const onAddFilter = /* @__PURE__ */ _ _name ( ( filterAndValue ) => {
nodeSearchFilterVisible . value = false ;
emit ( "addFilter" , filterAndValue ) ;
reFocusInput ( ) ;
} , "onAddFilter" ) ;
const onRemoveFilter = /* @__PURE__ */ _ _name ( ( event , filterAndValue ) => {
event . stopPropagation ( ) ;
event . preventDefault ( ) ;
emit ( "removeFilter" , filterAndValue ) ;
reFocusInput ( ) ;
} , "onRemoveFilter" ) ;
const setHoverSuggestion = /* @__PURE__ */ _ _name ( ( index ) => {
if ( index === - 1 ) {
hoveredSuggestion . value = null ;
return ;
}
const value = suggestions2 . value [ index ] ;
hoveredSuggestion . value = value ;
} , "setHoverSuggestion" ) ;
return ( _ctx , _cache ) => {
2024-11-16 01:17:15 +00:00
return openBlock ( ) , createElementBlock ( "div" , _hoisted _1$h , [
enableNodePreview . value ? ( openBlock ( ) , createElementBlock ( "div" , _hoisted _2$e , [
2024-10-28 18:29:38 +00:00
hoveredSuggestion . value ? ( openBlock ( ) , createBlock ( NodePreview , {
nodeDef : hoveredSuggestion . value ,
key : hoveredSuggestion . value ? . name || ""
} , null , 8 , [ "nodeDef" ] ) ) : createCommentVNode ( "" , true )
] ) ) : createCommentVNode ( "" , true ) ,
2024-10-29 18:14:06 +00:00
createVNode ( unref ( script$f ) , {
2024-10-28 18:29:38 +00:00
icon : "pi pi-filter" ,
severity : "secondary" ,
class : "_filter-button" ,
onClick : _cache [ 0 ] || ( _cache [ 0 ] = ( $event ) => nodeSearchFilterVisible . value = true )
} ) ,
2024-10-29 18:14:06 +00:00
createVNode ( unref ( script$r ) , {
2024-10-28 18:29:38 +00:00
visible : nodeSearchFilterVisible . value ,
"onUpdate:visible" : _cache [ 1 ] || ( _cache [ 1 ] = ( $event ) => nodeSearchFilterVisible . value = $event ) ,
class : "_dialog"
} , {
header : withCtx ( ( ) => [
2024-11-16 01:17:15 +00:00
_hoisted _3$c
2024-10-28 18:29:38 +00:00
] ) ,
default : withCtx ( ( ) => [
createBaseVNode ( "div" , _hoisted _4$2 , [
createVNode ( NodeSearchFilter , { onAddFilter } )
] )
] ) ,
_ : 1
} , 8 , [ "visible" ] ) ,
2024-11-16 01:17:15 +00:00
createVNode ( _sfc _main$j , {
2024-10-28 18:29:38 +00:00
"model-value" : props . filters ,
class : "comfy-vue-node-search-box" ,
scrollHeight : "40vh" ,
placeholder : placeholder . value ,
"input-id" : inputId ,
"append-to" : "self" ,
suggestions : suggestions2 . value ,
"min-length" : 0 ,
delay : 100 ,
loading : ! unref ( nodeFrequencyStore ) . isLoaded ,
onComplete : _cache [ 2 ] || ( _cache [ 2 ] = ( $event ) => search2 ( $event . query ) ) ,
onOptionSelect : _cache [ 3 ] || ( _cache [ 3 ] = ( $event ) => emit ( "addNode" , $event . value ) ) ,
onFocusedOptionChanged : _cache [ 4 ] || ( _cache [ 4 ] = ( $event ) => setHoverSuggestion ( $event ) ) ,
"complete-on-focus" : "" ,
"auto-option-focus" : "" ,
"force-selection" : "" ,
multiple : "" ,
optionLabel : "display_name"
} , {
option : withCtx ( ( { option : option2 } ) => [
createVNode ( NodeSearchItem , {
nodeDef : option2 ,
currentQuery : currentQuery . value
} , null , 8 , [ "nodeDef" , "currentQuery" ] )
] ) ,
chip : withCtx ( ( { value } ) => [
createVNode ( SearchFilterChip , {
onRemove : /* @__PURE__ */ _ _name ( ( $event ) => onRemoveFilter ( $event , value ) , "onRemove" ) ,
text : value [ 1 ] ,
badge : value [ 0 ] . invokeSequence . toUpperCase ( ) ,
"badge-class" : value [ 0 ] . invokeSequence + "-badge"
} , null , 8 , [ "onRemove" , "text" , "badge" , "badge-class" ] )
] ) ,
_ : 1
} , 8 , [ "model-value" , "placeholder" , "suggestions" , "loading" ] )
] ) ;
} ;
}
} ) ;
2024-11-16 01:17:15 +00:00
const NodeSearchBox = /* @__PURE__ */ _export _sfc ( _sfc _main$h , [ [ "__scopeId" , "data-v-2d409367" ] ] ) ;
2024-10-28 18:29:38 +00:00
class ConnectingLinkImpl {
static {
_ _name ( this , "ConnectingLinkImpl" ) ;
}
2024-11-16 01:17:15 +00:00
constructor ( node , slot , input , output , pos , afterRerouteId ) {
2024-10-28 18:29:38 +00:00
this . node = node ;
this . slot = slot ;
this . input = input ;
this . output = output ;
this . pos = pos ;
2024-11-16 01:17:15 +00:00
this . afterRerouteId = afterRerouteId ;
2024-10-28 18:29:38 +00:00
}
static createFromPlainObject ( obj ) {
return new ConnectingLinkImpl (
obj . node ,
obj . slot ,
obj . input ,
obj . output ,
2024-11-16 01:17:15 +00:00
obj . pos ,
obj . afterRerouteId
2024-10-28 18:29:38 +00:00
) ;
}
get type ( ) {
2024-11-16 01:17:15 +00:00
const result = this . input ? this . input . type : this . output ? . type ? ? null ;
2024-10-28 18:29:38 +00:00
return result === - 1 ? null : result ;
}
/ * *
* Which slot type is release and need to be reconnected .
* - 'output' means we need a new node ' s outputs slot to connect with this link
* /
get releaseSlotType ( ) {
return this . output ? "input" : "output" ;
}
connectTo ( newNode ) {
const newNodeSlots = this . releaseSlotType === "output" ? newNode . outputs : newNode . inputs ;
if ( ! newNodeSlots ) return ;
const newNodeSlot = newNodeSlots . findIndex (
( slot ) => LiteGraph . isValidConnection ( slot . type , this . type )
) ;
if ( newNodeSlot === - 1 ) {
console . warn (
` Could not find slot with type ${ this . type } on node ${ newNode . title } . This should never happen `
) ;
return ;
}
if ( this . releaseSlotType === "input" ) {
2024-11-16 01:17:15 +00:00
this . node . connect ( this . slot , newNode , newNodeSlot , this . afterRerouteId ) ;
2024-10-28 18:29:38 +00:00
} else {
2024-11-16 01:17:15 +00:00
newNode . connect ( newNodeSlot , this . node , this . slot , this . afterRerouteId ) ;
2024-10-28 18:29:38 +00:00
}
}
}
2024-11-16 01:17:15 +00:00
const _sfc _main$g = /* @__PURE__ */ defineComponent ( {
2024-10-28 18:29:38 +00:00
_ _name : "NodeSearchBoxPopover" ,
setup ( _ _props ) {
const settingStore = useSettingStore ( ) ;
const visible = ref ( false ) ;
const dismissable = ref ( true ) ;
const triggerEvent = ref ( null ) ;
const getNewNodeLocation = /* @__PURE__ */ _ _name ( ( ) => {
if ( triggerEvent . value === null ) {
return [ 100 , 100 ] ;
}
const originalEvent = triggerEvent . value . detail . originalEvent ;
return [ originalEvent . canvasX , originalEvent . canvasY ] ;
} , "getNewNodeLocation" ) ;
const nodeFilters = ref ( [ ] ) ;
const addFilter = /* @__PURE__ */ _ _name ( ( filter ) => {
nodeFilters . value . push ( filter ) ;
} , "addFilter" ) ;
const removeFilter = /* @__PURE__ */ _ _name ( ( filter ) => {
nodeFilters . value = nodeFilters . value . filter (
( f ) => toRaw ( f ) !== toRaw ( filter )
) ;
} , "removeFilter" ) ;
const clearFilters = /* @__PURE__ */ _ _name ( ( ) => {
nodeFilters . value = [ ] ;
} , "clearFilters" ) ;
const closeDialog = /* @__PURE__ */ _ _name ( ( ) => {
visible . value = false ;
} , "closeDialog" ) ;
const addNode = /* @__PURE__ */ _ _name ( ( nodeDef ) => {
const node = app . addNodeOnGraph ( nodeDef , { pos : getNewNodeLocation ( ) } ) ;
const eventDetail = triggerEvent . value . detail ;
if ( eventDetail . subType === "empty-release" ) {
eventDetail . linkReleaseContext . links . forEach ( ( link ) => {
ConnectingLinkImpl . createFromPlainObject ( link ) . connectTo ( node ) ;
} ) ;
}
window . setTimeout ( ( ) => {
closeDialog ( ) ;
} , 100 ) ;
} , "addNode" ) ;
const newSearchBoxEnabled = computed (
( ) => settingStore . get ( "Comfy.NodeSearchBoxImpl" ) === "default"
) ;
const showSearchBox = /* @__PURE__ */ _ _name ( ( e ) => {
if ( newSearchBoxEnabled . value ) {
if ( e . detail . originalEvent ? . pointerType === "touch" ) {
setTimeout ( ( ) => {
showNewSearchBox ( e ) ;
} , 128 ) ;
} else {
showNewSearchBox ( e ) ;
}
} else {
canvasStore . canvas . showSearchBox ( e . detail . originalEvent ) ;
}
} , "showSearchBox" ) ;
const nodeDefStore = useNodeDefStore ( ) ;
const showNewSearchBox = /* @__PURE__ */ _ _name ( ( e ) => {
if ( e . detail . linkReleaseContext ) {
const links = e . detail . linkReleaseContext . links ;
if ( links . length === 0 ) {
console . warn ( "Empty release with no links! This should never happen" ) ;
return ;
}
const firstLink = ConnectingLinkImpl . createFromPlainObject ( links [ 0 ] ) ;
const filter = nodeDefStore . nodeSearchService . getFilterById (
firstLink . releaseSlotType
) ;
const dataType = firstLink . type ;
addFilter ( [ filter , dataType ] ) ;
}
visible . value = true ;
triggerEvent . value = e ;
dismissable . value = false ;
setTimeout ( ( ) => {
dismissable . value = true ;
} , 300 ) ;
} , "showNewSearchBox" ) ;
const showContextMenu = /* @__PURE__ */ _ _name ( ( e ) => {
const links = e . detail . linkReleaseContext . links ;
if ( links . length === 0 ) {
console . warn ( "Empty release with no links! This should never happen" ) ;
return ;
}
const firstLink = ConnectingLinkImpl . createFromPlainObject ( links [ 0 ] ) ;
const mouseEvent = e . detail . originalEvent ;
const commonOptions = {
e : mouseEvent ,
allow _searchbox : true ,
showSearchBox : /* @__PURE__ */ _ _name ( ( ) => showSearchBox ( e ) , "showSearchBox" )
} ;
2024-11-16 01:17:15 +00:00
const connectionOptions = firstLink . output ? {
nodeFrom : firstLink . node ,
slotFrom : firstLink . output ,
afterRerouteId : firstLink . afterRerouteId
} : {
nodeTo : firstLink . node ,
slotTo : firstLink . input ,
afterRerouteId : firstLink . afterRerouteId
} ;
2024-10-28 18:29:38 +00:00
canvasStore . canvas . showConnectionMenu ( {
... connectionOptions ,
... commonOptions
} ) ;
} , "showContextMenu" ) ;
const canvasStore = useCanvasStore ( ) ;
watchEffect ( ( ) => {
if ( canvasStore . canvas ) {
LiteGraph . release _link _on _empty _shows _menu = false ;
canvasStore . canvas . allow _searchbox = false ;
}
} ) ;
const canvasEventHandler = /* @__PURE__ */ _ _name ( ( e ) => {
if ( e . detail . subType === "empty-double-click" ) {
showSearchBox ( e ) ;
} else if ( e . detail . subType === "empty-release" ) {
handleCanvasEmptyRelease ( e ) ;
} else if ( e . detail . subType === "group-double-click" ) {
const group = e . detail . group ;
const [ x , y ] = group . pos ;
const relativeY = e . detail . originalEvent . canvasY - y ;
if ( relativeY > group . titleHeight ) {
showSearchBox ( e ) ;
}
}
} , "canvasEventHandler" ) ;
const linkReleaseAction = computed ( ( ) => {
return settingStore . get ( "Comfy.LinkRelease.Action" ) ;
} ) ;
const linkReleaseActionShift = computed ( ( ) => {
return settingStore . get ( "Comfy.LinkRelease.ActionShift" ) ;
} ) ;
const handleCanvasEmptyRelease = /* @__PURE__ */ _ _name ( ( e ) => {
const originalEvent = e . detail . originalEvent ;
const shiftPressed = originalEvent . shiftKey ;
const action = shiftPressed ? linkReleaseActionShift . value : linkReleaseAction . value ;
switch ( action ) {
case LinkReleaseTriggerAction . SEARCH _BOX :
showSearchBox ( e ) ;
break ;
case LinkReleaseTriggerAction . CONTEXT _MENU :
showContextMenu ( e ) ;
break ;
case LinkReleaseTriggerAction . NO _ACTION :
default :
break ;
}
} , "handleCanvasEmptyRelease" ) ;
onMounted ( ( ) => {
document . addEventListener ( "litegraph:canvas" , canvasEventHandler ) ;
} ) ;
onUnmounted ( ( ) => {
document . removeEventListener ( "litegraph:canvas" , canvasEventHandler ) ;
} ) ;
return ( _ctx , _cache ) => {
return openBlock ( ) , createElementBlock ( "div" , null , [
2024-10-29 18:14:06 +00:00
createVNode ( unref ( script$r ) , {
2024-10-28 18:29:38 +00:00
visible : visible . value ,
"onUpdate:visible" : _cache [ 0 ] || ( _cache [ 0 ] = ( $event ) => visible . value = $event ) ,
modal : "" ,
"dismissable-mask" : dismissable . value ,
onHide : clearFilters ,
pt : {
root : {
class : "invisible-dialog-root" ,
role : "search"
} ,
mask : { class : "node-search-box-dialog-mask" } ,
transition : {
enterFromClass : "opacity-0 scale-75" ,
// 100ms is the duration of the transition in the dialog component
enterActiveClass : "transition-all duration-100 ease-out" ,
leaveActiveClass : "transition-all duration-100 ease-in" ,
leaveToClass : "opacity-0 scale-75"
}
}
} , {
container : withCtx ( ( ) => [
createVNode ( NodeSearchBox , {
filters : nodeFilters . value ,
onAddFilter : addFilter ,
onRemoveFilter : removeFilter ,
onAddNode : addNode
} , null , 8 , [ "filters" ] )
] ) ,
_ : 1
} , 8 , [ "visible" , "dismissable-mask" ] )
] ) ;
} ;
}
} ) ;
2024-11-16 01:17:15 +00:00
const _sfc _main$f = /* @__PURE__ */ defineComponent ( {
2024-10-28 18:29:38 +00:00
_ _name : "NodeTooltip" ,
setup ( _ _props ) {
let idleTimeout ;
const nodeDefStore = useNodeDefStore ( ) ;
const tooltipRef = ref ( ) ;
const tooltipText = ref ( "" ) ;
const left = ref ( ) ;
const top = ref ( ) ;
const hideTooltip = /* @__PURE__ */ _ _name ( ( ) => tooltipText . value = null , "hideTooltip" ) ;
const showTooltip = /* @__PURE__ */ _ _name ( async ( tooltip ) => {
if ( ! tooltip ) return ;
left . value = app . canvas . mouse [ 0 ] + "px" ;
top . value = app . canvas . mouse [ 1 ] + "px" ;
tooltipText . value = tooltip ;
await nextTick ( ) ;
const rect = tooltipRef . value . getBoundingClientRect ( ) ;
if ( rect . right > window . innerWidth ) {
left . value = app . canvas . mouse [ 0 ] - rect . width + "px" ;
}
if ( rect . top < 0 ) {
top . value = app . canvas . mouse [ 1 ] + rect . height + "px" ;
}
} , "showTooltip" ) ;
const onIdle = /* @__PURE__ */ _ _name ( ( ) => {
const { canvas } = app ;
const node = canvas . node _over ;
if ( ! node ) return ;
const ctor = node . constructor ;
const nodeDef = nodeDefStore . nodeDefsByName [ node . type ] ;
if ( ctor . title _mode !== LiteGraph . NO _TITLE && canvas . graph _mouse [ 1 ] < node . pos [ 1 ] ) {
return showTooltip ( nodeDef . description ) ;
}
if ( node . flags ? . collapsed ) return ;
const inputSlot = canvas . isOverNodeInput (
node ,
canvas . graph _mouse [ 0 ] ,
canvas . graph _mouse [ 1 ] ,
[ 0 , 0 ]
) ;
if ( inputSlot !== - 1 ) {
const inputName = node . inputs [ inputSlot ] . name ;
return showTooltip ( nodeDef . input . getInput ( inputName ) ? . tooltip ) ;
}
const outputSlot = canvas . isOverNodeOutput (
node ,
canvas . graph _mouse [ 0 ] ,
canvas . graph _mouse [ 1 ] ,
[ 0 , 0 ]
) ;
if ( outputSlot !== - 1 ) {
return showTooltip ( nodeDef . output . all ? . [ outputSlot ] ? . tooltip ) ;
}
2024-11-16 01:17:15 +00:00
const widget = app . canvas . getWidgetAtCursor ( ) ;
2024-10-28 18:29:38 +00:00
if ( widget && ! widget . element ) {
return showTooltip (
widget . tooltip ? ? nodeDef . input . getInput ( widget . name ) ? . tooltip
) ;
}
} , "onIdle" ) ;
const onMouseMove = /* @__PURE__ */ _ _name ( ( e ) => {
hideTooltip ( ) ;
clearTimeout ( idleTimeout ) ;
if ( e . target . nodeName !== "CANVAS" ) return ;
idleTimeout = window . setTimeout ( onIdle , 500 ) ;
} , "onMouseMove" ) ;
useEventListener ( window , "mousemove" , onMouseMove ) ;
useEventListener ( window , "click" , hideTooltip ) ;
return ( _ctx , _cache ) => {
return tooltipText . value ? ( openBlock ( ) , createElementBlock ( "div" , {
key : 0 ,
ref _key : "tooltipRef" ,
ref : tooltipRef ,
class : "node-tooltip" ,
style : normalizeStyle ( { left : left . value , top : top . value } )
} , toDisplayString ( tooltipText . value ) , 5 ) ) : createCommentVNode ( "" , true ) ;
} ;
}
} ) ;
2024-11-16 01:17:15 +00:00
const NodeTooltip = /* @__PURE__ */ _export _sfc ( _sfc _main$f , [ [ "__scopeId" , "data-v-c2e0098f" ] ] ) ;
const _sfc _main$e = /* @__PURE__ */ defineComponent ( {
2024-10-29 18:14:06 +00:00
_ _name : "NodeBadge" ,
setup ( _ _props ) {
const settingStore = useSettingStore ( ) ;
const nodeSourceBadgeMode = computed (
( ) => settingStore . get ( "Comfy.NodeBadge.NodeSourceBadgeMode" )
) ;
const nodeIdBadgeMode = computed (
( ) => settingStore . get ( "Comfy.NodeBadge.NodeIdBadgeMode" )
) ;
const nodeLifeCycleBadgeMode = computed (
( ) => settingStore . get ( "Comfy.NodeBadge.NodeLifeCycleBadgeMode" )
) ;
watch ( [ nodeSourceBadgeMode , nodeIdBadgeMode , nodeLifeCycleBadgeMode ] , ( ) => {
app . graph ? . setDirtyCanvas ( true , true ) ;
} ) ;
const colorPalette = computed (
( ) => getColorPalette ( settingStore . get ( "Comfy.ColorPalette" ) )
) ;
const nodeDefStore = useNodeDefStore ( ) ;
function badgeTextVisible ( nodeDef , badgeMode ) {
return ! ( badgeMode === NodeBadgeMode . None || nodeDef ? . isCoreNode && badgeMode === NodeBadgeMode . HideBuiltIn ) ;
}
_ _name ( badgeTextVisible , "badgeTextVisible" ) ;
onMounted ( ( ) => {
app . registerExtension ( {
name : "Comfy.NodeBadge" ,
nodeCreated ( node ) {
node . badgePosition = BadgePosition . TopRight ;
const badge = computed ( ( ) => {
const nodeDef = nodeDefStore . fromLGraphNode ( node ) ;
return new LGraphBadge ( {
text : _ . truncate (
[
badgeTextVisible ( nodeDef , nodeIdBadgeMode . value ) ? ` # ${ node . id } ` : "" ,
badgeTextVisible ( nodeDef , nodeLifeCycleBadgeMode . value ) ? nodeDef ? . nodeLifeCycleBadgeText ? ? "" : "" ,
badgeTextVisible ( nodeDef , nodeSourceBadgeMode . value ) ? nodeDef ? . nodeSource ? . badgeText ? ? "" : ""
] . filter ( ( s ) => s . length > 0 ) . join ( " " ) ,
{
length : 31
}
) ,
2024-11-16 01:17:15 +00:00
fgColor : colorPalette . value ? . colors ? . litegraph _base ? . BADGE _FG _COLOR || defaultColorPalette . colors . litegraph _base . BADGE _FG _COLOR ,
bgColor : colorPalette . value ? . colors ? . litegraph _base ? . BADGE _BG _COLOR || defaultColorPalette . colors . litegraph _base . BADGE _BG _COLOR
2024-10-29 18:14:06 +00:00
} ) ;
} ) ;
node . badges . push ( ( ) => badge . value ) ;
}
} ) ;
} ) ;
return ( _ctx , _cache ) => {
return openBlock ( ) , createElementBlock ( "div" ) ;
} ;
}
} ) ;
2024-11-16 01:17:15 +00:00
const _hoisted _1$g = {
2024-10-28 18:29:38 +00:00
viewBox : "0 0 1024 1024" ,
width : "1.2em" ,
height : "1.2em"
} ;
2024-11-16 01:17:15 +00:00
const _hoisted _2$d = /* @__PURE__ */ createBaseVNode ( "path" , {
2024-10-28 18:29:38 +00:00
fill : "currentColor" ,
d : "M921.088 103.232L584.832 889.024L465.52 544.512L121.328 440.48zM1004.46.769c-6.096 0-13.52 1.728-22.096 5.36L27.708 411.2c-34.383 14.592-36.56 42.704-4.847 62.464l395.296 123.584l129.36 403.264c9.28 15.184 20.496 22.72 31.263 22.72c11.936 0 23.296-9.152 31.04-27.248l408.272-953.728C1029.148 16.368 1022.86.769 1004.46.769"
} , null , - 1 ) ;
2024-11-16 01:17:15 +00:00
const _hoisted _3$b = [
_hoisted _2$d
2024-10-28 18:29:38 +00:00
] ;
2024-11-16 01:17:15 +00:00
function render$d ( _ctx , _cache ) {
return openBlock ( ) , createElementBlock ( "svg" , _hoisted _1$g , [ ... _hoisted _3$b ] ) ;
2024-10-28 18:29:38 +00:00
}
2024-11-16 01:17:15 +00:00
_ _name ( render$d , "render$d" ) ;
const _ _unplugin _components _1$2 = markRaw ( { name : "simple-line-icons-cursor" , render : render$d } ) ;
const _hoisted _1$f = {
2024-10-28 18:29:38 +00:00
viewBox : "0 0 24 24" ,
width : "1.2em" ,
height : "1.2em"
} ;
2024-11-16 01:17:15 +00:00
const _hoisted _2$c = /* @__PURE__ */ createBaseVNode ( "path" , {
2024-10-28 18:29:38 +00:00
fill : "currentColor" ,
d : "M10.05 23q-.75 0-1.4-.337T7.575 21.7L1.2 12.375l.6-.575q.475-.475 1.125-.55t1.175.3L7 13.575V4q0-.425.288-.712T8 3t.713.288T9 4v13.425l-3.7-2.6l3.925 5.725q.125.2.35.325t.475.125H17q.825 0 1.413-.587T19 19V5q0-.425.288-.712T20 4t.713.288T21 5v14q0 1.65-1.175 2.825T17 23zM11 12V2q0-.425.288-.712T12 1t.713.288T13 2v10zm4 0V3q0-.425.288-.712T16 2t.713.288T17 3v9zm-2.85 4.5"
} , null , - 1 ) ;
2024-11-16 01:17:15 +00:00
const _hoisted _3$a = [
_hoisted _2$c
2024-10-28 18:29:38 +00:00
] ;
2024-11-16 01:17:15 +00:00
function render$c ( _ctx , _cache ) {
return openBlock ( ) , createElementBlock ( "svg" , _hoisted _1$f , [ ... _hoisted _3$a ] ) ;
2024-10-28 18:29:38 +00:00
}
2024-11-16 01:17:15 +00:00
_ _name ( render$c , "render$c" ) ;
const _ _unplugin _components _0$2 = markRaw ( { name : "material-symbols-pan-tool-outline" , render : render$c } ) ;
2024-10-28 18:29:38 +00:00
var theme$5 = /* @__PURE__ */ _ _name ( function theme4 ( _ref ) {
_ref . dt ;
return "\n.p-buttongroup .p-button {\n margin: 0;\n}\n\n.p-buttongroup .p-button:not(:last-child),\n.p-buttongroup .p-button:not(:last-child):hover {\n border-right: 0 none;\n}\n\n.p-buttongroup .p-button:not(:first-of-type):not(:last-of-type) {\n border-radius: 0;\n}\n\n.p-buttongroup .p-button:first-of-type:not(:only-of-type) {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n}\n\n.p-buttongroup .p-button:last-of-type:not(:only-of-type) {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n}\n\n.p-buttongroup .p-button:focus {\n position: relative;\n z-index: 1;\n}\n" ;
} , "theme" ) ;
var classes$5 = {
root : "p-buttongroup p-component"
} ;
var ButtonGroupStyle = BaseStyle . extend ( {
name : "buttongroup" ,
theme : theme$5 ,
classes : classes$5
} ) ;
var script$1$5 = {
name : "BaseButtonGroup" ,
2024-10-29 18:14:06 +00:00
"extends" : script$g ,
2024-10-28 18:29:38 +00:00
style : ButtonGroupStyle ,
2024-10-29 18:14:06 +00:00
provide : /* @__PURE__ */ _ _name ( function provide8 ( ) {
2024-10-28 18:29:38 +00:00
return {
$pcButtonGroup : this ,
$parentInstance : this
} ;
} , "provide" )
} ;
var script$7 = {
name : "ButtonGroup" ,
"extends" : script$1$5 ,
inheritAttrs : false
} ;
2024-11-16 01:17:15 +00:00
function render$b ( _ctx , _cache , $props , $setup , $data , $options ) {
2024-10-28 18:29:38 +00:00
return openBlock ( ) , createElementBlock ( "span" , mergeProps ( {
"class" : _ctx . cx ( "root" ) ,
role : "group"
} , _ctx . ptmi ( "root" ) ) , [ renderSlot ( _ctx . $slots , "default" ) ] , 16 ) ;
}
2024-11-16 01:17:15 +00:00
_ _name ( render$b , "render$b" ) ;
script$7 . render = render$b ;
const _sfc _main$d = /* @__PURE__ */ defineComponent ( {
2024-10-28 18:29:38 +00:00
_ _name : "GraphCanvasMenu" ,
setup ( _ _props ) {
const { t } = useI18n ( ) ;
const commandStore = useCommandStore ( ) ;
const canvasStore = useCanvasStore ( ) ;
const settingStore = useSettingStore ( ) ;
const linkHidden = computed (
( ) => settingStore . get ( "Comfy.LinkRenderMode" ) === LiteGraph . HIDDEN _LINK
) ;
let interval = null ;
const repeat2 = /* @__PURE__ */ _ _name ( ( command ) => {
if ( interval ) return ;
const cmd = /* @__PURE__ */ _ _name ( ( ) => commandStore . execute ( command ) , "cmd" ) ;
cmd ( ) ;
interval = window . setInterval ( cmd , 100 ) ;
} , "repeat" ) ;
const stopRepeat = /* @__PURE__ */ _ _name ( ( ) => {
if ( interval ) {
clearInterval ( interval ) ;
interval = null ;
}
} , "stopRepeat" ) ;
return ( _ctx , _cache ) => {
2024-10-29 18:14:06 +00:00
const _component _i _material _symbols58pan _tool _outline = _ _unplugin _components _0$2 ;
2024-11-16 01:17:15 +00:00
const _component _i _simple _line _icons58cursor = _ _unplugin _components _1$2 ;
2024-10-28 18:29:38 +00:00
const _directive _tooltip = resolveDirective ( "tooltip" ) ;
return openBlock ( ) , createBlock ( unref ( script$7 ) , { class : "p-buttongroup-vertical absolute bottom-[10px] right-[10px] z-[1000] pointer-events-auto" } , {
default : withCtx ( ( ) => [
2024-10-29 18:14:06 +00:00
withDirectives ( createVNode ( unref ( script$f ) , {
2024-10-28 18:29:38 +00:00
severity : "secondary" ,
icon : "pi pi-plus" ,
onMousedown : _cache [ 0 ] || ( _cache [ 0 ] = ( $event ) => repeat2 ( "Comfy.Canvas.ZoomIn" ) ) ,
onMouseup : stopRepeat
} , null , 512 ) , [
[
_directive _tooltip ,
unref ( t ) ( "graphCanvasMenu.zoomIn" ) ,
void 0 ,
{ left : true }
]
] ) ,
2024-10-29 18:14:06 +00:00
withDirectives ( createVNode ( unref ( script$f ) , {
2024-10-28 18:29:38 +00:00
severity : "secondary" ,
icon : "pi pi-minus" ,
onMousedown : _cache [ 1 ] || ( _cache [ 1 ] = ( $event ) => repeat2 ( "Comfy.Canvas.ZoomOut" ) ) ,
onMouseup : stopRepeat
} , null , 512 ) , [
[
_directive _tooltip ,
unref ( t ) ( "graphCanvasMenu.zoomOut" ) ,
void 0 ,
{ left : true }
]
] ) ,
2024-10-29 18:14:06 +00:00
withDirectives ( createVNode ( unref ( script$f ) , {
2024-10-28 18:29:38 +00:00
severity : "secondary" ,
icon : "pi pi-expand" ,
2024-11-16 01:17:15 +00:00
onClick : _cache [ 2 ] || ( _cache [ 2 ] = ( ) => unref ( commandStore ) . execute ( "Comfy.Canvas.FitView" ) )
2024-10-28 18:29:38 +00:00
} , null , 512 ) , [
[
_directive _tooltip ,
2024-11-16 01:17:15 +00:00
unref ( t ) ( "graphCanvasMenu.fitView" ) ,
2024-10-28 18:29:38 +00:00
void 0 ,
{ left : true }
]
] ) ,
2024-10-29 18:14:06 +00:00
withDirectives ( ( openBlock ( ) , createBlock ( unref ( script$f ) , {
2024-10-28 18:29:38 +00:00
severity : "secondary" ,
onClick : _cache [ 3 ] || ( _cache [ 3 ] = ( ) => unref ( commandStore ) . execute ( "Comfy.Canvas.ToggleLock" ) )
} , {
icon : withCtx ( ( ) => [
unref ( canvasStore ) . canvas ? . read _only ? ( openBlock ( ) , createBlock ( _component _i _material _symbols58pan _tool _outline , { key : 0 } ) ) : ( openBlock ( ) , createBlock ( _component _i _simple _line _icons58cursor , { key : 1 } ) )
] ) ,
_ : 1
} ) ) , [
[
_directive _tooltip ,
unref ( t ) (
"graphCanvasMenu." + ( unref ( canvasStore ) . canvas ? . read _only ? "panMode" : "selectMode" )
) + " (Space)" ,
void 0 ,
{ left : true }
]
] ) ,
2024-10-29 18:14:06 +00:00
withDirectives ( createVNode ( unref ( script$f ) , {
2024-10-28 18:29:38 +00:00
severity : "secondary" ,
icon : linkHidden . value ? "pi pi-eye-slash" : "pi pi-eye" ,
onClick : _cache [ 4 ] || ( _cache [ 4 ] = ( ) => unref ( commandStore ) . execute ( "Comfy.Canvas.ToggleLinkVisibility" ) ) ,
"data-testid" : "toggle-link-visibility-button"
} , null , 8 , [ "icon" ] ) , [
[
_directive _tooltip ,
unref ( t ) ( "graphCanvasMenu.toggleLinkVisibility" ) ,
void 0 ,
{ left : true }
]
] )
] ) ,
_ : 1
} ) ;
} ;
}
} ) ;
2024-11-16 01:17:15 +00:00
const GraphCanvasMenu = /* @__PURE__ */ _export _sfc ( _sfc _main$d , [ [ "__scopeId" , "data-v-94481f39" ] ] ) ;
const _sfc _main$c = /* @__PURE__ */ defineComponent ( {
2024-10-28 18:29:38 +00:00
_ _name : "GraphCanvas" ,
emits : [ "ready" ] ,
setup ( _ _props , { emit : _ _emit } ) {
const emit = _ _emit ;
const canvasRef = ref ( null ) ;
const settingStore = useSettingStore ( ) ;
const nodeDefStore = useNodeDefStore ( ) ;
const workspaceStore = useWorkspaceStore ( ) ;
const canvasStore = useCanvasStore ( ) ;
const modelToNodeStore = useModelToNodeStore ( ) ;
const betaMenuEnabled = computed (
( ) => settingStore . get ( "Comfy.UseNewMenu" ) !== "Disabled"
) ;
const canvasMenuEnabled = computed (
( ) => settingStore . get ( "Comfy.Graph.CanvasMenu" )
) ;
const tooltipEnabled = computed ( ( ) => settingStore . get ( "Comfy.EnableTooltips" ) ) ;
watchEffect ( ( ) => {
const canvasInfoEnabled = settingStore . get ( "Comfy.Graph.CanvasInfo" ) ;
if ( canvasStore . canvas ) {
canvasStore . canvas . show _info = canvasInfoEnabled ;
}
} ) ;
watchEffect ( ( ) => {
const zoomSpeed = settingStore . get ( "Comfy.Graph.ZoomSpeed" ) ;
if ( canvasStore . canvas ) {
canvasStore . canvas . zoom _speed = zoomSpeed ;
}
} ) ;
2024-11-16 01:17:15 +00:00
watchEffect ( ( ) => {
LiteGraph . snaps _for _comfy = settingStore . get ( "Comfy.Node.AutoSnapLinkToSlot" ) ;
} ) ;
watchEffect ( ( ) => {
LiteGraph . snap _highlights _node = settingStore . get (
"Comfy.Node.SnapHighlightsNode"
) ;
} ) ;
watchEffect ( ( ) => {
LGraphNode . keepAllLinksOnBypass = settingStore . get (
"Comfy.Node.BypassAllLinksOnDelete"
) ;
} ) ;
watchEffect ( ( ) => {
LiteGraph . middle _click _slot _add _default _node = settingStore . get (
"Comfy.Node.MiddleClickRerouteNode"
) ;
} ) ;
2024-10-28 18:29:38 +00:00
watchEffect ( ( ) => {
nodeDefStore . showDeprecated = settingStore . get ( "Comfy.Node.ShowDeprecated" ) ;
} ) ;
watchEffect ( ( ) => {
nodeDefStore . showExperimental = settingStore . get (
"Comfy.Node.ShowExperimental"
) ;
} ) ;
watchEffect ( ( ) => {
const spellcheckEnabled = settingStore . get ( "Comfy.TextareaWidget.Spellcheck" ) ;
const textareas = document . querySelectorAll ( "textarea.comfy-multiline-input" ) ;
textareas . forEach ( ( textarea ) => {
textarea . spellcheck = spellcheckEnabled ;
textarea . focus ( ) ;
textarea . blur ( ) ;
} ) ;
} ) ;
2024-11-16 01:17:15 +00:00
watchEffect ( ( ) => {
const linkRenderMode = settingStore . get ( "Comfy.LinkRenderMode" ) ;
if ( canvasStore . canvas ) {
canvasStore . canvas . links _render _mode = linkRenderMode ;
canvasStore . canvas . setDirty (
/* fg */
false ,
/* bg */
true
) ;
}
} ) ;
watchEffect ( ( ) => {
const linkMarkerShape = settingStore . get ( "Comfy.Graph.LinkMarkers" ) ;
const { canvas } = canvasStore ;
if ( canvas ) {
canvas . linkMarkerShape = linkMarkerShape ;
canvas . setDirty ( false , true ) ;
}
} ) ;
watchEffect ( ( ) => {
const reroutesEnabled = settingStore . get ( "Comfy.RerouteBeta" ) ;
const { canvas } = canvasStore ;
if ( canvas ) {
canvas . reroutesEnabled = reroutesEnabled ;
canvas . setDirty ( false , true ) ;
}
} ) ;
2024-10-28 18:29:38 +00:00
watchEffect ( ( ) => {
if ( ! canvasStore . canvas ) return ;
2024-11-16 01:17:15 +00:00
if ( canvasStore . canvas . state . draggingCanvas ) {
2024-10-28 18:29:38 +00:00
canvasStore . canvas . canvas . style . cursor = "grabbing" ;
return ;
}
2024-11-16 01:17:15 +00:00
if ( canvasStore . canvas . state . readOnly ) {
2024-10-28 18:29:38 +00:00
canvasStore . canvas . canvas . style . cursor = "grab" ;
return ;
}
canvasStore . canvas . canvas . style . cursor = "default" ;
} ) ;
2024-11-16 01:17:15 +00:00
const workflowStore = useWorkflowStore ( ) ;
watchEffect ( ( ) => {
if ( workflowStore . activeWorkflow ) {
const workflow = workflowStore . activeWorkflow ;
setStorageValue ( "Comfy.PreviousWorkflow" , workflow . key ) ;
}
} ) ;
2024-10-28 18:29:38 +00:00
usePragmaticDroppable ( ( ) => canvasRef . value , {
onDrop : /* @__PURE__ */ _ _name ( ( event ) => {
const loc = event . location . current . input ;
const dndData = event . source . data ;
if ( dndData . type === "tree-explorer-node" ) {
const node = dndData . data ;
if ( node . data instanceof ComfyNodeDefImpl ) {
const nodeDef = node . data ;
const pos = app . clientPosToCanvasPos ( [
loc . clientX - 20 ,
loc . clientY
] ) ;
app . addNodeOnGraph ( nodeDef , { pos } ) ;
} else if ( node . data instanceof ComfyModelDef ) {
const model = node . data ;
const pos = app . clientPosToCanvasPos ( [ loc . clientX , loc . clientY ] ) ;
const nodeAtPos = app . graph . getNodeOnPos ( pos [ 0 ] , pos [ 1 ] ) ;
let targetProvider = null ;
let targetGraphNode = null ;
if ( nodeAtPos ) {
const providers = modelToNodeStore . getAllNodeProviders (
model . directory
) ;
for ( const provider of providers ) {
if ( provider . nodeDef . name === nodeAtPos . comfyClass ) {
targetGraphNode = nodeAtPos ;
targetProvider = provider ;
}
}
}
if ( ! targetGraphNode ) {
const provider = modelToNodeStore . getNodeProvider ( model . directory ) ;
if ( provider ) {
targetGraphNode = app . addNodeOnGraph ( provider . nodeDef , {
pos
} ) ;
targetProvider = provider ;
}
}
if ( targetGraphNode ) {
const widget = targetGraphNode . widgets . find (
( widget2 ) => widget2 . name === targetProvider . key
) ;
if ( widget ) {
widget . value = model . file _name ;
}
}
}
}
} , "onDrop" )
} ) ;
2024-11-16 01:17:15 +00:00
const comfyAppReady = ref ( false ) ;
2024-10-28 18:29:38 +00:00
onMounted ( async ( ) => {
window [ "LiteGraph" ] = LiteGraph ;
window [ "LGraph" ] = LGraph ;
window [ "LLink" ] = LLink ;
window [ "LGraphNode" ] = LGraphNode ;
window [ "LGraphGroup" ] = LGraphGroup ;
window [ "DragAndScale" ] = DragAndScale ;
window [ "LGraphCanvas" ] = LGraphCanvas ;
window [ "ContextMenu" ] = ContextMenu ;
window [ "LGraphBadge" ] = LGraphBadge ;
app . vueAppReady = true ;
workspaceStore . spinner = true ;
2024-11-16 01:17:15 +00:00
ChangeTracker . init ( app ) ;
2024-10-28 18:29:38 +00:00
await app . setup ( canvasRef . value ) ;
canvasStore . canvas = app . canvas ;
workspaceStore . spinner = false ;
window [ "app" ] = app ;
window [ "graph" ] = app . graph ;
2024-11-16 01:17:15 +00:00
comfyAppReady . value = true ;
2024-10-28 18:29:38 +00:00
emit ( "ready" ) ;
} ) ;
return ( _ctx , _cache ) => {
return openBlock ( ) , createElementBlock ( Fragment , null , [
( openBlock ( ) , createBlock ( Teleport , { to : ".graph-canvas-container" } , [
2024-11-16 01:17:15 +00:00
comfyAppReady . value && betaMenuEnabled . value && ! unref ( workspaceStore ) . focusMode ? ( openBlock ( ) , createBlock ( LiteGraphCanvasSplitterOverlay , { key : 0 } , {
2024-10-28 18:29:38 +00:00
"side-bar-panel" : withCtx ( ( ) => [
createVNode ( SideToolbar )
] ) ,
2024-10-29 18:14:06 +00:00
"bottom-panel" : withCtx ( ( ) => [
2024-11-16 01:17:15 +00:00
createVNode ( _sfc _main$l )
2024-10-29 18:14:06 +00:00
] ) ,
2024-10-28 18:29:38 +00:00
"graph-canvas-panel" : withCtx ( ( ) => [
canvasMenuEnabled . value ? ( openBlock ( ) , createBlock ( GraphCanvasMenu , { key : 0 } ) ) : createCommentVNode ( "" , true )
] ) ,
_ : 1
} ) ) : createCommentVNode ( "" , true ) ,
createVNode ( TitleEditor ) ,
! betaMenuEnabled . value && canvasMenuEnabled . value ? ( openBlock ( ) , createBlock ( GraphCanvasMenu , { key : 1 } ) ) : createCommentVNode ( "" , true ) ,
createBaseVNode ( "canvas" , {
ref _key : "canvasRef" ,
ref : canvasRef ,
id : "graph-canvas" ,
tabindex : "1"
} , null , 512 )
] ) ) ,
2024-11-16 01:17:15 +00:00
createVNode ( _sfc _main$g ) ,
2024-10-29 18:14:06 +00:00
tooltipEnabled . value ? ( openBlock ( ) , createBlock ( NodeTooltip , { key : 0 } ) ) : createCommentVNode ( "" , true ) ,
2024-11-16 01:17:15 +00:00
createVNode ( _sfc _main$e )
2024-10-28 18:29:38 +00:00
] , 64 ) ;
} ;
}
} ) ;
2024-11-16 01:17:15 +00:00
const _sfc _main$b = /* @__PURE__ */ defineComponent ( {
_ _name : "MenuHamburger" ,
setup ( _ _props ) {
const workspaceState = useWorkspaceStore ( ) ;
const settingStore = useSettingStore ( ) ;
const exitFocusMode = /* @__PURE__ */ _ _name ( ( ) => {
workspaceState . focusMode = false ;
} , "exitFocusMode" ) ;
watchEffect ( ( ) => {
if ( settingStore . get ( "Comfy.UseNewMenu" ) !== "Disabled" ) {
return ;
}
if ( workspaceState . focusMode ) {
app . ui . menuContainer . style . display = "none" ;
} else {
app . ui . menuContainer . style . display = "block" ;
}
} ) ;
const menuSetting = computed ( ( ) => settingStore . get ( "Comfy.UseNewMenu" ) ) ;
const positionCSS = computed (
( ) => (
// 'Bottom' menuSetting shows the hamburger button in the bottom right corner
// 'Disabled', 'Top' menuSetting shows the hamburger button in the top right corner
menuSetting . value === "Bottom" ? { bottom : "0px" , right : "0px" } : { top : "0px" , right : "0px" }
)
) ;
return ( _ctx , _cache ) => {
const _directive _tooltip = resolveDirective ( "tooltip" ) ;
return withDirectives ( ( openBlock ( ) , createBlock ( unref ( script$f ) , {
class : "comfy-menu-hamburger" ,
style : normalizeStyle ( positionCSS . value ) ,
icon : "pi pi-bars" ,
severity : "secondary" ,
text : "" ,
size : "large" ,
onClick : exitFocusMode
} , null , 8 , [ "style" ] ) ) , [
[ vShow , unref ( workspaceState ) . focusMode ] ,
[ _directive _tooltip , { value : _ctx . $t ( "menu.showMenu" ) , showDelay : 300 } ]
] ) ;
} ;
}
} ) ;
const MenuHamburger = /* @__PURE__ */ _export _sfc ( _sfc _main$b , [ [ "__scopeId" , "data-v-2ddd26e8" ] ] ) ;
2024-10-28 18:29:38 +00:00
function _typeof$3 ( o ) {
"@babel/helpers - typeof" ;
return _typeof$3 = "function" == typeof Symbol && "symbol" == typeof Symbol . iterator ? function ( o2 ) {
return typeof o2 ;
} : function ( o2 ) {
return o2 && "function" == typeof Symbol && o2 . constructor === Symbol && o2 !== Symbol . prototype ? "symbol" : typeof o2 ;
} , _typeof$3 ( o ) ;
}
_ _name ( _typeof$3 , "_typeof$3" ) ;
function _defineProperty$3 ( e , r , t ) {
return ( r = _toPropertyKey$3 ( r ) ) in e ? Object . defineProperty ( e , r , { value : t , enumerable : true , configurable : true , writable : true } ) : e [ r ] = t , e ;
}
_ _name ( _defineProperty$3 , "_defineProperty$3" ) ;
function _toPropertyKey$3 ( t ) {
var i = _toPrimitive$3 ( t , "string" ) ;
return "symbol" == _typeof$3 ( i ) ? i : i + "" ;
}
_ _name ( _toPropertyKey$3 , "_toPropertyKey$3" ) ;
function _toPrimitive$3 ( t , r ) {
if ( "object" != _typeof$3 ( t ) || ! t ) return t ;
var e = t [ Symbol . toPrimitive ] ;
if ( void 0 !== e ) {
var i = e . call ( t , r || "default" ) ;
if ( "object" != _typeof$3 ( i ) ) return i ;
throw new TypeError ( "@@toPrimitive must return a primitive value." ) ;
}
return ( "string" === r ? String : Number ) ( t ) ;
}
_ _name ( _toPrimitive$3 , "_toPrimitive$3" ) ;
var theme$4 = /* @__PURE__ */ _ _name ( function theme5 ( _ref ) {
var dt = _ref . dt ;
return "\n.p-toast {\n width: " . concat ( dt ( "toast.width" ) , ";\n white-space: pre-line;\n word-break: break-word;\n}\n\n.p-toast-message {\n margin: 0 0 1rem 0;\n}\n\n.p-toast-message-icon {\n flex-shrink: 0;\n font-size: " ) . concat ( dt ( "toast.icon.size" ) , ";\n width: " ) . concat ( dt ( "toast.icon.size" ) , ";\n height: " ) . concat ( dt ( "toast.icon.size" ) , ";\n}\n\n.p-toast-message-content {\n display: flex;\n align-items: flex-start;\n padding: " ) . concat ( dt ( "toast.content.padding" ) , ";\n gap: " ) . concat ( dt ( "toast.content.gap" ) , ";\n}\n\n.p-toast-message-text {\n flex: 1 1 auto;\n display: flex;\n flex-direction: column;\n gap: " ) . concat ( dt ( "toast.text.gap" ) , ";\n}\n\n.p-toast-summary {\n font-weight: " ) . concat ( dt ( "toast.summary.font.weight" ) , ";\n font-size: " ) . concat ( dt ( "toast.summary.font.size" ) , ";\n}\n\n.p-toast-detail {\n font-weight: " ) . concat ( dt ( "toast.detail.font.weight" ) , ";\n font-size: " ) . concat ( dt ( "toast.detail.font.size" ) , ";\n}\n\n.p-toast-close-button {\n display: flex;\n align-items: center;\n justify-content: center;\n overflow: hidden;\n position: relative;\n cursor: pointer;\n background: transparent;\n transition: background " ) . concat ( dt ( "toast.transition.duration" ) , ", color " ) . concat ( dt ( "toast.transition.duration" ) , ", outline-color " ) . concat ( dt ( "toast.transition.duration" ) , ", box-shadow " ) . concat ( dt ( "toast.transition.duration" ) , ";\n outline-color: transparent;\n color: inherit;\n width: " ) . concat ( dt ( "toast.close.button.width" ) , ";\n height: " ) . concat ( dt ( "toast.close.button.height" ) , ";\n border-radius: " ) . concat ( dt ( "toast.close.button.border.radius" ) , ";\n margin: -25% 0 0 0;\n right: -25%;\n padding: 0;\n border: none;\n user-select: none;\n}\n\n.p-toast-message-info,\n.p-toast-message-success,\n.p-toast-message-warn,\n.p-toast-message-error,\n.p-toast-message-secondary,\n.p-toast-message-contrast {\n border-width: " ) . concat ( dt ( "toast.border.width" ) , ";\n border-style: solid;\n backdrop-filter: blur(" ) . concat ( dt ( "toast.blur" ) , ");\n border-radius: " ) . concat ( dt ( "toast.border.radius" ) , ";\n}\n\n.p-toast-close-icon {\n font-size: " ) . concat ( dt ( "toast.close.icon.size" ) , ";\n width: " ) . concat ( dt ( "toast.close.icon.size" ) , ";\n height: " ) . concat ( dt ( "toast.close.icon.size" ) , ";\n}\n\n.p-toast-close-button:focus-visible {\n outline-width: " ) . concat ( dt ( "focus.ring.width" ) , ";\n outline-style: " ) . concat ( dt ( "focus.ring.style" ) , ";\n outline-offset: " ) . concat ( dt ( "focus.ring.offset" ) , ";\n}\n\n.p-toast-message-info {\n background: " ) . concat ( dt ( "toast.info.background" ) , ";\n border-color: " ) . concat ( dt ( "toast.info.border.color" ) , ";\n color: " ) . concat ( dt ( "toast.info.color" ) , ";\n box-shadow: " ) . concat ( dt ( "toast.info.shadow" ) , ";\n}\n\n.p-toast-message-info .p-toast-detail {\n color: " ) . concat ( dt ( "toast.info.detail.color" ) , ";\n}\n\n.p-toast-message-info .p-toast-close-button:focus-visible {\n outline-color: " ) . concat ( dt ( "toast.info.close.button.focus.ring.color" ) , ";\n box-shadow: " ) . concat ( dt ( "toast.info.close.button.focus.ring.shadow" ) , ";\n}\n\n.p-toast-message-info .p-toast-close-button:hover {\n background: " ) . concat ( dt ( "toast.info.close.button.hover.background" ) , ";\n}\n\n.p-toast-message-success {\n background: " ) . concat ( dt ( "toast.success.background" ) , ";\n border-color: " ) . concat ( dt ( "toast.success.border.color" ) , ";\n color: " ) . concat ( dt ( "toast.success.color" ) , ";\n box-shadow: " ) . concat ( dt ( "toast.success.shadow" ) , ";\n}\n\n.p-toast-message-success .p-toast-detail {\n color: " ) . concat ( dt ( "toast.success.detail.color" ) , ";\n}\n\n.p-toast-message-success .p-toast-close-button:focus-visible {\n outline-color: " ) . concat ( dt ( "toast.success.close.button.focus.ring.color" ) , ";\n box-shadow: " ) . concat ( dt ( "toast.success.close.button.focus.ring.shadow" ) , ";\n}\n\n.p-toast-message-success .p-toast-close-button:hover {\n background: " ) . concat ( dt ( "toast.success.close.button.hover.background" ) , " ; \ n } \ n \ n . p - toast - message - warn { \ n background :
} , "theme" ) ;
var inlineStyles$2 = {
2024-10-29 18:14:06 +00:00
root : /* @__PURE__ */ _ _name ( function root6 ( _ref2 ) {
2024-10-28 18:29:38 +00:00
var position = _ref2 . position ;
return {
position : "fixed" ,
top : position === "top-right" || position === "top-left" || position === "top-center" ? "20px" : position === "center" ? "50%" : null ,
right : ( position === "top-right" || position === "bottom-right" ) && "20px" ,
bottom : ( position === "bottom-left" || position === "bottom-right" || position === "bottom-center" ) && "20px" ,
left : position === "top-left" || position === "bottom-left" ? "20px" : position === "center" || position === "top-center" || position === "bottom-center" ? "50%" : null
} ;
} , "root" )
} ;
var classes$4 = {
2024-10-29 18:14:06 +00:00
root : /* @__PURE__ */ _ _name ( function root7 ( _ref3 ) {
2024-10-28 18:29:38 +00:00
var props = _ref3 . props ;
return [ "p-toast p-component p-toast-" + props . position ] ;
} , "root" ) ,
message : /* @__PURE__ */ _ _name ( function message ( _ref4 ) {
var props = _ref4 . props ;
return [ "p-toast-message" , {
"p-toast-message-info" : props . message . severity === "info" || props . message . severity === void 0 ,
"p-toast-message-warn" : props . message . severity === "warn" ,
"p-toast-message-error" : props . message . severity === "error" ,
"p-toast-message-success" : props . message . severity === "success" ,
"p-toast-message-secondary" : props . message . severity === "secondary" ,
"p-toast-message-contrast" : props . message . severity === "contrast"
} ] ;
} , "message" ) ,
messageContent : "p-toast-message-content" ,
messageIcon : /* @__PURE__ */ _ _name ( function messageIcon ( _ref5 ) {
var props = _ref5 . props ;
return [ "p-toast-message-icon" , _defineProperty$3 ( _defineProperty$3 ( _defineProperty$3 ( _defineProperty$3 ( { } , props . infoIcon , props . message . severity === "info" ) , props . warnIcon , props . message . severity === "warn" ) , props . errorIcon , props . message . severity === "error" ) , props . successIcon , props . message . severity === "success" ) ] ;
} , "messageIcon" ) ,
messageText : "p-toast-message-text" ,
summary : "p-toast-summary" ,
detail : "p-toast-detail" ,
closeButton : "p-toast-close-button" ,
closeIcon : "p-toast-close-icon"
} ;
var ToastStyle = BaseStyle . extend ( {
name : "toast" ,
theme : theme$4 ,
classes : classes$4 ,
inlineStyles : inlineStyles$2
} ) ;
var script$2$2 = {
name : "BaseToast" ,
2024-10-29 18:14:06 +00:00
"extends" : script$g ,
2024-10-28 18:29:38 +00:00
props : {
group : {
type : String ,
"default" : null
} ,
position : {
type : String ,
"default" : "top-right"
} ,
autoZIndex : {
type : Boolean ,
"default" : true
} ,
baseZIndex : {
type : Number ,
"default" : 0
} ,
breakpoints : {
type : Object ,
"default" : null
} ,
closeIcon : {
type : String ,
"default" : void 0
} ,
infoIcon : {
type : String ,
"default" : void 0
} ,
warnIcon : {
type : String ,
"default" : void 0
} ,
errorIcon : {
type : String ,
"default" : void 0
} ,
successIcon : {
type : String ,
"default" : void 0
} ,
closeButtonProps : {
type : null ,
"default" : null
}
} ,
style : ToastStyle ,
2024-10-29 18:14:06 +00:00
provide : /* @__PURE__ */ _ _name ( function provide9 ( ) {
2024-10-28 18:29:38 +00:00
return {
$pcToast : this ,
$parentInstance : this
} ;
} , "provide" )
} ;
var script$1$4 = {
name : "ToastMessage" ,
hostName : "Toast" ,
2024-10-29 18:14:06 +00:00
"extends" : script$g ,
2024-10-28 18:29:38 +00:00
emits : [ "close" ] ,
closeTimeout : null ,
props : {
message : {
type : null ,
"default" : null
} ,
templates : {
type : Object ,
"default" : null
} ,
closeIcon : {
type : String ,
"default" : null
} ,
infoIcon : {
type : String ,
"default" : null
} ,
warnIcon : {
type : String ,
"default" : null
} ,
errorIcon : {
type : String ,
"default" : null
} ,
successIcon : {
type : String ,
"default" : null
} ,
closeButtonProps : {
type : null ,
"default" : null
}
} ,
2024-10-29 18:14:06 +00:00
mounted : /* @__PURE__ */ _ _name ( function mounted4 ( ) {
2024-10-28 18:29:38 +00:00
var _this = this ;
if ( this . message . life ) {
this . closeTimeout = setTimeout ( function ( ) {
_this . close ( {
message : _this . message ,
type : "life-end"
} ) ;
} , this . message . life ) ;
}
} , "mounted" ) ,
2024-10-29 18:14:06 +00:00
beforeUnmount : /* @__PURE__ */ _ _name ( function beforeUnmount4 ( ) {
2024-10-28 18:29:38 +00:00
this . clearCloseTimeout ( ) ;
} , "beforeUnmount" ) ,
methods : {
close : /* @__PURE__ */ _ _name ( function close ( params ) {
this . $emit ( "close" , params ) ;
} , "close" ) ,
onCloseClick : /* @__PURE__ */ _ _name ( function onCloseClick ( ) {
this . clearCloseTimeout ( ) ;
this . close ( {
message : this . message ,
type : "close"
} ) ;
} , "onCloseClick" ) ,
clearCloseTimeout : /* @__PURE__ */ _ _name ( function clearCloseTimeout ( ) {
if ( this . closeTimeout ) {
clearTimeout ( this . closeTimeout ) ;
this . closeTimeout = null ;
}
} , "clearCloseTimeout" )
} ,
computed : {
iconComponent : /* @__PURE__ */ _ _name ( function iconComponent ( ) {
return {
2024-10-29 18:14:06 +00:00
info : ! this . infoIcon && script$s ,
success : ! this . successIcon && script$t ,
warn : ! this . warnIcon && script$u ,
error : ! this . errorIcon && script$v
2024-10-28 18:29:38 +00:00
} [ this . message . severity ] ;
} , "iconComponent" ) ,
closeAriaLabel : /* @__PURE__ */ _ _name ( function closeAriaLabel ( ) {
return this . $primevue . config . locale . aria ? this . $primevue . config . locale . aria . close : void 0 ;
} , "closeAriaLabel" )
} ,
components : {
2024-10-29 18:14:06 +00:00
TimesIcon : script$w ,
InfoCircleIcon : script$s ,
CheckIcon : script$t ,
ExclamationTriangleIcon : script$u ,
TimesCircleIcon : script$v
2024-10-28 18:29:38 +00:00
} ,
directives : {
ripple : Ripple
}
} ;
function _typeof$1 ( o ) {
"@babel/helpers - typeof" ;
return _typeof$1 = "function" == typeof Symbol && "symbol" == typeof Symbol . iterator ? function ( o2 ) {
return typeof o2 ;
} : function ( o2 ) {
return o2 && "function" == typeof Symbol && o2 . constructor === Symbol && o2 !== Symbol . prototype ? "symbol" : typeof o2 ;
} , _typeof$1 ( o ) ;
}
_ _name ( _typeof$1 , "_typeof$1" ) ;
function ownKeys$1 ( e , r ) {
var t = Object . keys ( e ) ;
if ( Object . getOwnPropertySymbols ) {
var o = Object . getOwnPropertySymbols ( e ) ;
r && ( o = o . filter ( function ( r2 ) {
return Object . getOwnPropertyDescriptor ( e , r2 ) . enumerable ;
} ) ) , t . push . apply ( t , o ) ;
}
return t ;
}
_ _name ( ownKeys$1 , "ownKeys$1" ) ;
function _objectSpread$1 ( e ) {
for ( var r = 1 ; r < arguments . length ; r ++ ) {
var t = null != arguments [ r ] ? arguments [ r ] : { } ;
r % 2 ? ownKeys$1 ( Object ( t ) , true ) . forEach ( function ( r2 ) {
_defineProperty$1 ( e , r2 , t [ r2 ] ) ;
} ) : Object . getOwnPropertyDescriptors ? Object . defineProperties ( e , Object . getOwnPropertyDescriptors ( t ) ) : ownKeys$1 ( Object ( t ) ) . forEach ( function ( r2 ) {
Object . defineProperty ( e , r2 , Object . getOwnPropertyDescriptor ( t , r2 ) ) ;
} ) ;
}
return e ;
}
_ _name ( _objectSpread$1 , "_objectSpread$1" ) ;
function _defineProperty$1 ( e , r , t ) {
return ( r = _toPropertyKey$1 ( r ) ) in e ? Object . defineProperty ( e , r , { value : t , enumerable : true , configurable : true , writable : true } ) : e [ r ] = t , e ;
}
_ _name ( _defineProperty$1 , "_defineProperty$1" ) ;
function _toPropertyKey$1 ( t ) {
var i = _toPrimitive$1 ( t , "string" ) ;
return "symbol" == _typeof$1 ( i ) ? i : i + "" ;
}
_ _name ( _toPropertyKey$1 , "_toPropertyKey$1" ) ;
function _toPrimitive$1 ( t , r ) {
if ( "object" != _typeof$1 ( t ) || ! t ) return t ;
var e = t [ Symbol . toPrimitive ] ;
if ( void 0 !== e ) {
var i = e . call ( t , r || "default" ) ;
if ( "object" != _typeof$1 ( i ) ) return i ;
throw new TypeError ( "@@toPrimitive must return a primitive value." ) ;
}
return ( "string" === r ? String : Number ) ( t ) ;
}
_ _name ( _toPrimitive$1 , "_toPrimitive$1" ) ;
2024-11-16 01:17:15 +00:00
var _hoisted _1$e = [ "aria-label" ] ;
2024-10-29 18:14:06 +00:00
function render$1$3 ( _ctx , _cache , $props , $setup , $data , $options ) {
2024-10-28 18:29:38 +00:00
var _directive _ripple = resolveDirective ( "ripple" ) ;
return openBlock ( ) , createElementBlock ( "div" , mergeProps ( {
"class" : [ _ctx . cx ( "message" ) , $props . message . styleClass ] ,
role : "alert" ,
"aria-live" : "assertive" ,
"aria-atomic" : "true"
} , _ctx . ptm ( "message" ) ) , [ $props . templates . container ? ( openBlock ( ) , createBlock ( resolveDynamicComponent ( $props . templates . container ) , {
key : 0 ,
message : $props . message ,
closeCallback : $options . onCloseClick
} , null , 8 , [ "message" , "closeCallback" ] ) ) : ( openBlock ( ) , createElementBlock ( "div" , mergeProps ( {
key : 1 ,
"class" : [ _ctx . cx ( "messageContent" ) , $props . message . contentStyleClass ]
} , _ctx . ptm ( "messageContent" ) ) , [ ! $props . templates . message ? ( openBlock ( ) , createElementBlock ( Fragment , {
key : 0
} , [ ( openBlock ( ) , createBlock ( resolveDynamicComponent ( $props . templates . messageicon ? $props . templates . messageicon : $props . templates . icon ? $props . templates . icon : $options . iconComponent && $options . iconComponent . name ? $options . iconComponent : "span" ) , mergeProps ( {
"class" : _ctx . cx ( "messageIcon" )
} , _ctx . ptm ( "messageIcon" ) ) , null , 16 , [ "class" ] ) ) , createBaseVNode ( "div" , mergeProps ( {
"class" : _ctx . cx ( "messageText" )
} , _ctx . ptm ( "messageText" ) ) , [ createBaseVNode ( "span" , mergeProps ( {
"class" : _ctx . cx ( "summary" )
} , _ctx . ptm ( "summary" ) ) , toDisplayString ( $props . message . summary ) , 17 ) , createBaseVNode ( "div" , mergeProps ( {
"class" : _ctx . cx ( "detail" )
} , _ctx . ptm ( "detail" ) ) , toDisplayString ( $props . message . detail ) , 17 ) ] , 16 ) ] , 64 ) ) : ( openBlock ( ) , createBlock ( resolveDynamicComponent ( $props . templates . message ) , {
key : 1 ,
message : $props . message
} , null , 8 , [ "message" ] ) ) , $props . message . closable !== false ? ( openBlock ( ) , createElementBlock ( "div" , normalizeProps ( mergeProps ( {
key : 2
} , _ctx . ptm ( "buttonContainer" ) ) ) , [ withDirectives ( ( openBlock ( ) , createElementBlock ( "button" , mergeProps ( {
"class" : _ctx . cx ( "closeButton" ) ,
type : "button" ,
"aria-label" : $options . closeAriaLabel ,
onClick : _cache [ 0 ] || ( _cache [ 0 ] = function ( ) {
return $options . onCloseClick && $options . onCloseClick . apply ( $options , arguments ) ;
} ) ,
autofocus : ""
} , _objectSpread$1 ( _objectSpread$1 ( { } , $props . closeButtonProps ) , _ctx . ptm ( "closeButton" ) ) ) , [ ( openBlock ( ) , createBlock ( resolveDynamicComponent ( $props . templates . closeicon || "TimesIcon" ) , mergeProps ( {
"class" : [ _ctx . cx ( "closeIcon" ) , $props . closeIcon ]
2024-11-16 01:17:15 +00:00
} , _ctx . ptm ( "closeIcon" ) ) , null , 16 , [ "class" ] ) ) ] , 16 , _hoisted _1$e ) ) , [ [ _directive _ripple ] ] ) ] , 16 ) ) : createCommentVNode ( "" , true ) ] , 16 ) ) ] , 16 ) ;
2024-10-28 18:29:38 +00:00
}
2024-10-29 18:14:06 +00:00
_ _name ( render$1$3 , "render$1$3" ) ;
script$1$4 . render = render$1$3 ;
2024-10-28 18:29:38 +00:00
function _toConsumableArray ( r ) {
return _arrayWithoutHoles ( r ) || _iterableToArray ( r ) || _unsupportedIterableToArray ( r ) || _nonIterableSpread ( ) ;
}
_ _name ( _toConsumableArray , "_toConsumableArray" ) ;
function _nonIterableSpread ( ) {
throw new TypeError ( "Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method." ) ;
}
_ _name ( _nonIterableSpread , "_nonIterableSpread" ) ;
function _unsupportedIterableToArray ( r , a ) {
if ( r ) {
if ( "string" == typeof r ) return _arrayLikeToArray ( r , a ) ;
var t = { } . toString . call ( r ) . slice ( 8 , - 1 ) ;
return "Object" === t && r . constructor && ( t = r . constructor . name ) , "Map" === t || "Set" === t ? Array . from ( r ) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/ . test ( t ) ? _arrayLikeToArray ( r , a ) : void 0 ;
}
}
_ _name ( _unsupportedIterableToArray , "_unsupportedIterableToArray" ) ;
function _iterableToArray ( r ) {
if ( "undefined" != typeof Symbol && null != r [ Symbol . iterator ] || null != r [ "@@iterator" ] ) return Array . from ( r ) ;
}
_ _name ( _iterableToArray , "_iterableToArray" ) ;
function _arrayWithoutHoles ( r ) {
if ( Array . isArray ( r ) ) return _arrayLikeToArray ( r ) ;
}
_ _name ( _arrayWithoutHoles , "_arrayWithoutHoles" ) ;
function _arrayLikeToArray ( r , a ) {
( null == a || a > r . length ) && ( a = r . length ) ;
for ( var e = 0 , n = Array ( a ) ; e < a ; e ++ ) n [ e ] = r [ e ] ;
return n ;
}
_ _name ( _arrayLikeToArray , "_arrayLikeToArray" ) ;
var messageIdx = 0 ;
var script$6 = {
name : "Toast" ,
"extends" : script$2$2 ,
inheritAttrs : false ,
emits : [ "close" , "life-end" ] ,
2024-10-29 18:14:06 +00:00
data : /* @__PURE__ */ _ _name ( function data5 ( ) {
2024-10-28 18:29:38 +00:00
return {
messages : [ ]
} ;
} , "data" ) ,
styleElement : null ,
2024-10-29 18:14:06 +00:00
mounted : /* @__PURE__ */ _ _name ( function mounted5 ( ) {
2024-10-28 18:29:38 +00:00
ToastEventBus . on ( "add" , this . onAdd ) ;
ToastEventBus . on ( "remove" , this . onRemove ) ;
ToastEventBus . on ( "remove-group" , this . onRemoveGroup ) ;
ToastEventBus . on ( "remove-all-groups" , this . onRemoveAllGroups ) ;
if ( this . breakpoints ) {
this . createStyle ( ) ;
}
} , "mounted" ) ,
2024-10-29 18:14:06 +00:00
beforeUnmount : /* @__PURE__ */ _ _name ( function beforeUnmount5 ( ) {
2024-10-28 18:29:38 +00:00
this . destroyStyle ( ) ;
if ( this . $refs . container && this . autoZIndex ) {
ZIndex . clear ( this . $refs . container ) ;
}
ToastEventBus . off ( "add" , this . onAdd ) ;
ToastEventBus . off ( "remove" , this . onRemove ) ;
ToastEventBus . off ( "remove-group" , this . onRemoveGroup ) ;
ToastEventBus . off ( "remove-all-groups" , this . onRemoveAllGroups ) ;
} , "beforeUnmount" ) ,
methods : {
add : /* @__PURE__ */ _ _name ( function add ( message2 ) {
if ( message2 . id == null ) {
message2 . id = messageIdx ++ ;
}
this . messages = [ ] . concat ( _toConsumableArray ( this . messages ) , [ message2 ] ) ;
} , "add" ) ,
remove : /* @__PURE__ */ _ _name ( function remove ( params ) {
var index = this . messages . findIndex ( function ( m ) {
return m . id === params . message . id ;
} ) ;
if ( index !== - 1 ) {
this . messages . splice ( index , 1 ) ;
this . $emit ( params . type , {
message : params . message
} ) ;
}
} , "remove" ) ,
onAdd : /* @__PURE__ */ _ _name ( function onAdd ( message2 ) {
if ( this . group == message2 . group ) {
this . add ( message2 ) ;
}
} , "onAdd" ) ,
onRemove : /* @__PURE__ */ _ _name ( function onRemove ( message2 ) {
this . remove ( {
message : message2 ,
type : "close"
} ) ;
} , "onRemove" ) ,
onRemoveGroup : /* @__PURE__ */ _ _name ( function onRemoveGroup ( group ) {
if ( this . group === group ) {
this . messages = [ ] ;
}
} , "onRemoveGroup" ) ,
onRemoveAllGroups : /* @__PURE__ */ _ _name ( function onRemoveAllGroups ( ) {
this . messages = [ ] ;
} , "onRemoveAllGroups" ) ,
onEnter : /* @__PURE__ */ _ _name ( function onEnter ( ) {
this . $refs . container . setAttribute ( this . attributeSelector , "" ) ;
if ( this . autoZIndex ) {
ZIndex . set ( "modal" , this . $refs . container , this . baseZIndex || this . $primevue . config . zIndex . modal ) ;
}
} , "onEnter" ) ,
onLeave : /* @__PURE__ */ _ _name ( function onLeave ( ) {
var _this = this ;
if ( this . $refs . container && this . autoZIndex && isEmpty ( this . messages ) ) {
setTimeout ( function ( ) {
ZIndex . clear ( _this . $refs . container ) ;
} , 200 ) ;
}
} , "onLeave" ) ,
createStyle : /* @__PURE__ */ _ _name ( function createStyle ( ) {
if ( ! this . styleElement && ! this . isUnstyled ) {
var _this$$primevue ;
this . styleElement = document . createElement ( "style" ) ;
this . styleElement . type = "text/css" ;
setAttribute ( this . styleElement , "nonce" , ( _this$$primevue = this . $primevue ) === null || _this$$primevue === void 0 || ( _this$$primevue = _this$$primevue . config ) === null || _this$$primevue === void 0 || ( _this$$primevue = _this$$primevue . csp ) === null || _this$$primevue === void 0 ? void 0 : _this$$primevue . nonce ) ;
document . head . appendChild ( this . styleElement ) ;
var innerHTML = "" ;
for ( var breakpoint in this . breakpoints ) {
var breakpointStyle = "" ;
for ( var styleProp in this . breakpoints [ breakpoint ] ) {
breakpointStyle += styleProp + ":" + this . breakpoints [ breakpoint ] [ styleProp ] + "!important;" ;
}
innerHTML += "\n @media screen and (max-width: " . concat ( breakpoint , ") {\n .p-toast[" ) . concat ( this . attributeSelector , "] {\n " ) . concat ( breakpointStyle , "\n }\n }\n " ) ;
}
this . styleElement . innerHTML = innerHTML ;
}
} , "createStyle" ) ,
destroyStyle : /* @__PURE__ */ _ _name ( function destroyStyle ( ) {
if ( this . styleElement ) {
document . head . removeChild ( this . styleElement ) ;
this . styleElement = null ;
}
} , "destroyStyle" )
} ,
computed : {
attributeSelector : /* @__PURE__ */ _ _name ( function attributeSelector ( ) {
return UniqueComponentId ( ) ;
} , "attributeSelector" )
} ,
components : {
ToastMessage : script$1$4 ,
2024-10-29 18:14:06 +00:00
Portal : script$m
2024-10-28 18:29:38 +00:00
}
} ;
function _typeof$2 ( o ) {
"@babel/helpers - typeof" ;
return _typeof$2 = "function" == typeof Symbol && "symbol" == typeof Symbol . iterator ? function ( o2 ) {
return typeof o2 ;
} : function ( o2 ) {
return o2 && "function" == typeof Symbol && o2 . constructor === Symbol && o2 !== Symbol . prototype ? "symbol" : typeof o2 ;
} , _typeof$2 ( o ) ;
}
_ _name ( _typeof$2 , "_typeof$2" ) ;
function ownKeys$2 ( e , r ) {
var t = Object . keys ( e ) ;
if ( Object . getOwnPropertySymbols ) {
var o = Object . getOwnPropertySymbols ( e ) ;
r && ( o = o . filter ( function ( r2 ) {
return Object . getOwnPropertyDescriptor ( e , r2 ) . enumerable ;
} ) ) , t . push . apply ( t , o ) ;
}
return t ;
}
_ _name ( ownKeys$2 , "ownKeys$2" ) ;
function _objectSpread$2 ( e ) {
for ( var r = 1 ; r < arguments . length ; r ++ ) {
var t = null != arguments [ r ] ? arguments [ r ] : { } ;
r % 2 ? ownKeys$2 ( Object ( t ) , true ) . forEach ( function ( r2 ) {
_defineProperty$2 ( e , r2 , t [ r2 ] ) ;
} ) : Object . getOwnPropertyDescriptors ? Object . defineProperties ( e , Object . getOwnPropertyDescriptors ( t ) ) : ownKeys$2 ( Object ( t ) ) . forEach ( function ( r2 ) {
Object . defineProperty ( e , r2 , Object . getOwnPropertyDescriptor ( t , r2 ) ) ;
} ) ;
}
return e ;
}
_ _name ( _objectSpread$2 , "_objectSpread$2" ) ;
function _defineProperty$2 ( e , r , t ) {
return ( r = _toPropertyKey$2 ( r ) ) in e ? Object . defineProperty ( e , r , { value : t , enumerable : true , configurable : true , writable : true } ) : e [ r ] = t , e ;
}
_ _name ( _defineProperty$2 , "_defineProperty$2" ) ;
function _toPropertyKey$2 ( t ) {
var i = _toPrimitive$2 ( t , "string" ) ;
return "symbol" == _typeof$2 ( i ) ? i : i + "" ;
}
_ _name ( _toPropertyKey$2 , "_toPropertyKey$2" ) ;
function _toPrimitive$2 ( t , r ) {
if ( "object" != _typeof$2 ( t ) || ! t ) return t ;
var e = t [ Symbol . toPrimitive ] ;
if ( void 0 !== e ) {
var i = e . call ( t , r || "default" ) ;
if ( "object" != _typeof$2 ( i ) ) return i ;
throw new TypeError ( "@@toPrimitive must return a primitive value." ) ;
}
return ( "string" === r ? String : Number ) ( t ) ;
}
_ _name ( _toPrimitive$2 , "_toPrimitive$2" ) ;
2024-11-16 01:17:15 +00:00
function render$a ( _ctx , _cache , $props , $setup , $data , $options ) {
2024-10-28 18:29:38 +00:00
var _component _ToastMessage = resolveComponent ( "ToastMessage" ) ;
var _component _Portal = resolveComponent ( "Portal" ) ;
return openBlock ( ) , createBlock ( _component _Portal , null , {
"default" : withCtx ( function ( ) {
return [ createBaseVNode ( "div" , mergeProps ( {
ref : "container" ,
"class" : _ctx . cx ( "root" ) ,
style : _ctx . sx ( "root" , true , {
position : _ctx . position
} )
} , _ctx . ptmi ( "root" ) ) , [ createVNode ( TransitionGroup , mergeProps ( {
name : "p-toast-message" ,
tag : "div" ,
onEnter : $options . onEnter ,
onLeave : $options . onLeave
} , _objectSpread$2 ( { } , _ctx . ptm ( "transition" ) ) ) , {
"default" : withCtx ( function ( ) {
return [ ( openBlock ( true ) , createElementBlock ( Fragment , null , renderList ( $data . messages , function ( msg ) {
return openBlock ( ) , createBlock ( _component _ToastMessage , {
key : msg . id ,
message : msg ,
templates : _ctx . $slots ,
closeIcon : _ctx . closeIcon ,
infoIcon : _ctx . infoIcon ,
warnIcon : _ctx . warnIcon ,
errorIcon : _ctx . errorIcon ,
successIcon : _ctx . successIcon ,
closeButtonProps : _ctx . closeButtonProps ,
unstyled : _ctx . unstyled ,
onClose : _cache [ 0 ] || ( _cache [ 0 ] = function ( $event ) {
return $options . remove ( $event ) ;
} ) ,
pt : _ctx . pt
} , null , 8 , [ "message" , "templates" , "closeIcon" , "infoIcon" , "warnIcon" , "errorIcon" , "successIcon" , "closeButtonProps" , "unstyled" , "pt" ] ) ;
} ) , 128 ) ) ] ;
} ) ,
_ : 1
} , 16 , [ "onEnter" , "onLeave" ] ) ] , 16 ) ] ;
} ) ,
_ : 1
} ) ;
}
2024-11-16 01:17:15 +00:00
_ _name ( render$a , "render$a" ) ;
script$6 . render = render$a ;
2024-10-29 18:14:06 +00:00
const _sfc _main$a = /* @__PURE__ */ defineComponent ( {
2024-10-28 18:29:38 +00:00
_ _name : "GlobalToast" ,
setup ( _ _props ) {
const toast = useToast ( ) ;
const toastStore = useToastStore ( ) ;
const settingStore = useSettingStore ( ) ;
watch (
( ) => toastStore . messagesToAdd ,
( newMessages ) => {
if ( newMessages . length === 0 ) {
return ;
}
newMessages . forEach ( ( message2 ) => {
toast . add ( message2 ) ;
} ) ;
toastStore . messagesToAdd = [ ] ;
} ,
{ deep : true }
) ;
watch (
( ) => toastStore . messagesToRemove ,
( messagesToRemove ) => {
if ( messagesToRemove . length === 0 ) {
return ;
}
messagesToRemove . forEach ( ( message2 ) => {
toast . remove ( message2 ) ;
} ) ;
toastStore . messagesToRemove = [ ] ;
} ,
{ deep : true }
) ;
watch (
( ) => toastStore . removeAllRequested ,
( requested ) => {
if ( requested ) {
toast . removeAllGroups ( ) ;
toastStore . removeAllRequested = false ;
}
}
) ;
function updateToastPosition ( ) {
const styleElement = document . getElementById ( "dynamic-toast-style" ) || createStyleElement ( ) ;
const rect = document . querySelector ( ".graph-canvas-container" ) . getBoundingClientRect ( ) ;
styleElement . textContent = `
. p - toast . p - component . p - toast - top - right {
top : $ { rect . top + 20 } px ! important ;
right : $ { window . innerWidth - ( rect . left + rect . width ) + 20 } px ! important ;
}
` ;
}
_ _name ( updateToastPosition , "updateToastPosition" ) ;
function createStyleElement ( ) {
const style = document . createElement ( "style" ) ;
style . id = "dynamic-toast-style" ;
document . head . appendChild ( style ) ;
return style ;
}
_ _name ( createStyleElement , "createStyleElement" ) ;
watch (
( ) => settingStore . get ( "Comfy.UseNewMenu" ) ,
( ) => nextTick ( updateToastPosition ) ,
{ immediate : true }
) ;
watch (
( ) => settingStore . get ( "Comfy.Sidebar.Location" ) ,
( ) => nextTick ( updateToastPosition ) ,
{ immediate : true }
) ;
return ( _ctx , _cache ) => {
return openBlock ( ) , createBlock ( unref ( script$6 ) ) ;
} ;
}
} ) ;
2024-10-29 18:14:06 +00:00
const _sfc _main$9 = /* @__PURE__ */ defineComponent ( {
2024-10-28 18:29:38 +00:00
_ _name : "UnloadWindowConfirmDialog" ,
setup ( _ _props ) {
const settingStore = useSettingStore ( ) ;
const handleBeforeUnload = /* @__PURE__ */ _ _name ( ( event ) => {
if ( settingStore . get ( "Comfy.Window.UnloadConfirmation" ) ) {
event . preventDefault ( ) ;
return true ;
}
return void 0 ;
} , "handleBeforeUnload" ) ;
onMounted ( ( ) => {
window . addEventListener ( "beforeunload" , handleBeforeUnload ) ;
} ) ;
onBeforeUnmount ( ( ) => {
window . removeEventListener ( "beforeunload" , handleBeforeUnload ) ;
} ) ;
return ( _ctx , _cache ) => {
return openBlock ( ) , createElementBlock ( "div" ) ;
} ;
}
} ) ;
const DEFAULT _TITLE = "ComfyUI" ;
const TITLE _SUFFIX = " - ComfyUI" ;
2024-10-29 18:14:06 +00:00
const _sfc _main$8 = /* @__PURE__ */ defineComponent ( {
2024-10-28 18:29:38 +00:00
_ _name : "BrowserTabTitle" ,
setup ( _ _props ) {
const executionStore = useExecutionStore ( ) ;
const executionText = computed (
( ) => executionStore . isIdle ? "" : ` [ ${ executionStore . executionProgress } %] `
) ;
const settingStore = useSettingStore ( ) ;
const betaMenuEnabled = computed (
( ) => settingStore . get ( "Comfy.UseNewMenu" ) !== "Disabled"
) ;
const workflowStore = useWorkflowStore ( ) ;
const isUnsavedText = computed (
2024-11-16 01:17:15 +00:00
( ) => workflowStore . activeWorkflow ? . isModified ? " *" : ""
2024-10-28 18:29:38 +00:00
) ;
const workflowNameText = computed ( ( ) => {
2024-11-16 01:17:15 +00:00
const workflowName = workflowStore . activeWorkflow ? . filename ;
2024-10-28 18:29:38 +00:00
return workflowName ? isUnsavedText . value + workflowName + TITLE _SUFFIX : DEFAULT _TITLE ;
} ) ;
const nodeExecutionTitle = computed (
( ) => executionStore . executingNode && executionStore . executingNodeProgress ? ` ${ executionText . value } [ ${ executionStore . executingNodeProgress } %] ${ executionStore . executingNode . type } ` : ""
) ;
const workflowTitle = computed (
( ) => executionText . value + ( betaMenuEnabled . value ? workflowNameText . value : DEFAULT _TITLE )
) ;
const title = computed ( ( ) => nodeExecutionTitle . value || workflowTitle . value ) ;
useTitle ( title ) ;
return ( _ctx , _cache ) => {
return openBlock ( ) , createElementBlock ( "div" ) ;
} ;
}
} ) ;
2024-11-16 01:17:15 +00:00
const _withScopeId$3 = /* @__PURE__ */ _ _name ( ( n ) => ( pushScopeId ( "data-v-9eb975c3" ) , n = n ( ) , popScopeId ( ) , n ) , "_withScopeId$3" ) ;
const _hoisted _1$d = { class : "workflow-label text-sm max-w-[150px] truncate inline-block" } ;
const _hoisted _2$b = { class : "relative" } ;
const _hoisted _3$9 = {
2024-10-28 18:29:38 +00:00
key : 0 ,
class : "status-indicator"
} ;
2024-10-29 18:14:06 +00:00
const _sfc _main$7 = /* @__PURE__ */ defineComponent ( {
2024-10-28 18:29:38 +00:00
_ _name : "WorkflowTabs" ,
props : {
class : { }
} ,
setup ( _ _props ) {
const props = _ _props ;
2024-11-16 01:17:15 +00:00
const workspaceStore = useWorkspaceStore ( ) ;
2024-10-28 18:29:38 +00:00
const workflowStore = useWorkflowStore ( ) ;
const workflowToOption = /* @__PURE__ */ _ _name ( ( workflow ) => ( {
2024-11-16 01:17:15 +00:00
value : workflow . path ,
workflow
2024-10-28 18:29:38 +00:00
} ) , "workflowToOption" ) ;
const options = computed (
( ) => workflowStore . openWorkflows . map ( workflowToOption )
) ;
const selectedWorkflow = computed (
( ) => workflowStore . activeWorkflow ? workflowToOption ( workflowStore . activeWorkflow ) : null
) ;
const onWorkflowChange = /* @__PURE__ */ _ _name ( ( option2 ) => {
if ( ! option2 ) {
return ;
}
if ( selectedWorkflow . value ? . value === option2 . value ) {
return ;
}
2024-11-16 01:17:15 +00:00
workflowService . openWorkflow ( option2 . workflow ) ;
2024-10-28 18:29:38 +00:00
} , "onWorkflowChange" ) ;
const onCloseWorkflow = /* @__PURE__ */ _ _name ( ( option2 ) => {
2024-11-16 01:17:15 +00:00
workflowService . closeWorkflow ( option2 . workflow , {
warnIfUnsaved : ! workspaceStore . shiftDown
} ) ;
2024-10-28 18:29:38 +00:00
} , "onCloseWorkflow" ) ;
return ( _ctx , _cache ) => {
const _directive _tooltip = resolveDirective ( "tooltip" ) ;
2024-10-29 18:14:06 +00:00
return openBlock ( ) , createBlock ( unref ( script$x ) , {
2024-10-28 18:29:38 +00:00
class : normalizeClass ( [ "workflow-tabs bg-transparent flex flex-wrap" , props . class ] ) ,
modelValue : selectedWorkflow . value ,
"onUpdate:modelValue" : onWorkflowChange ,
options : options . value ,
optionLabel : "label" ,
dataKey : "value"
} , {
option : withCtx ( ( { option : option2 } ) => [
2024-11-16 01:17:15 +00:00
withDirectives ( ( openBlock ( ) , createElementBlock ( "span" , _hoisted _1$d , [
createTextVNode ( toDisplayString ( option2 . workflow . filename ) , 1 )
2024-10-28 18:29:38 +00:00
] ) ) , [
2024-11-16 01:17:15 +00:00
[
_directive _tooltip ,
option2 . workflow . key ,
void 0 ,
{ bottom : true }
]
2024-10-28 18:29:38 +00:00
] ) ,
2024-11-16 01:17:15 +00:00
createBaseVNode ( "div" , _hoisted _2$b , [
! unref ( workspaceStore ) . shiftDown && option2 . workflow . isModified ? ( openBlock ( ) , createElementBlock ( "span" , _hoisted _3$9 , "•" ) ) : createCommentVNode ( "" , true ) ,
2024-10-29 18:14:06 +00:00
createVNode ( unref ( script$f ) , {
2024-10-28 18:29:38 +00:00
class : "close-button p-0 w-auto" ,
icon : "pi pi-times" ,
text : "" ,
severity : "secondary" ,
size : "small" ,
onClick : withModifiers ( ( $event ) => onCloseWorkflow ( option2 ) , [ "stop" ] )
} , null , 8 , [ "onClick" ] )
] )
] ) ,
_ : 1
} , 8 , [ "class" , "modelValue" , "options" ] ) ;
} ;
}
} ) ;
2024-11-16 01:17:15 +00:00
const WorkflowTabs = /* @__PURE__ */ _export _sfc ( _sfc _main$7 , [ [ "__scopeId" , "data-v-9eb975c3" ] ] ) ;
2024-10-28 18:29:38 +00:00
var theme$3 = /* @__PURE__ */ _ _name ( function theme6 ( _ref ) {
var dt = _ref . dt ;
return "\n.p-menubar {\n display: flex;\n align-items: center;\n background: " . concat ( dt ( "menubar.background" ) , ";\n border: 1px solid " ) . concat ( dt ( "menubar.border.color" ) , ";\n border-radius: " ) . concat ( dt ( "menubar.border.radius" ) , ";\n color: " ) . concat ( dt ( "menubar.color" ) , ";\n padding: " ) . concat ( dt ( "menubar.padding" ) , ";\n gap: " ) . concat ( dt ( "menubar.gap" ) , ";\n}\n\n.p-menubar-start,\n.p-megamenu-end {\n display: flex;\n align-items: center;\n}\n\n.p-menubar-root-list,\n.p-menubar-submenu {\n display: flex;\n margin: 0;\n padding: 0;\n list-style: none;\n outline: 0 none;\n}\n\n.p-menubar-root-list {\n align-items: center;\n flex-wrap: wrap;\n gap: " ) . concat ( dt ( "menubar.gap" ) , ";\n}\n\n.p-menubar-root-list > .p-menubar-item > .p-menubar-item-content {\n border-radius: " ) . concat ( dt ( "menubar.base.item.border.radius" ) , ";\n}\n\n.p-menubar-root-list > .p-menubar-item > .p-menubar-item-content > .p-menubar-item-link {\n padding: " ) . concat ( dt ( "menubar.base.item.padding" ) , ";\n}\n\n.p-menubar-item-content {\n transition: background " ) . concat ( dt ( "menubar.transition.duration" ) , ", color " ) . concat ( dt ( "menubar.transition.duration" ) , ";\n border-radius: " ) . concat ( dt ( "menubar.item.border.radius" ) , ";\n color: " ) . concat ( dt ( "menubar.item.color" ) , ";\n}\n\n.p-menubar-item-link {\n cursor: pointer;\n display: flex;\n align-items: center;\n text-decoration: none;\n overflow: hidden;\n position: relative;\n color: inherit;\n padding: " ) . concat ( dt ( "menubar.item.padding" ) , ";\n gap: " ) . concat ( dt ( "menubar.item.gap" ) , ";\n user-select: none;\n outline: 0 none;\n}\n\n.p-menubar-item-label {\n line-height: 1;\n}\n\n.p-menubar-item-icon {\n color: " ) . concat ( dt ( "menubar.item.icon.color" ) , ";\n}\n\n.p-menubar-submenu-icon {\n color: " ) . concat ( dt ( "menubar.submenu.icon.color" ) , ";\n margin-left: auto;\n font-size: " ) . concat ( dt ( "menubar.submenu.icon.size" ) , ";\n width: " ) . concat ( dt ( "menubar.submenu.icon.size" ) , ";\n height: " ) . concat ( dt ( "menubar.submenu.icon.size" ) , ";\n}\n\n.p-menubar-item.p-focus > .p-menubar-item-content {\n color: " ) . concat ( dt ( "menubar.item.focus.color" ) , ";\n background: " ) . concat ( dt ( "menubar.item.focus.background" ) , ";\n}\n\n.p-menubar-item.p-focus > .p-menubar-item-content .p-menubar-item-icon {\n color: " ) . concat ( dt ( "menubar.item.icon.focus.color" ) , ";\n}\n\n.p-menubar-item.p-focus > .p-menubar-item-content .p-menubar-submenu-icon {\n color: " ) . concat ( dt ( "menubar.submenu.icon.focus.color" ) , ";\n}\n\n.p-menubar-item:not(.p-disabled) > .p-menubar-item-content:hover {\n color: " ) . concat ( dt ( "menubar.item.focus.color" ) , ";\n background: " ) . concat ( dt ( "menubar.item.focus.background" ) , ";\n}\n\n.p-menubar-item:not(.p-disabled) > .p-menubar-item-content:hover .p-menubar-item-icon {\n color: " ) . concat ( dt ( "menubar.item.icon.focus.color" ) , ";\n}\n\n.p-menubar-item:not(.p-disabled) > .p-menubar-item-content:hover .p-menubar-submenu-icon {\n color: " ) . concat ( dt ( "menubar.submenu.icon.focus.color" ) , ";\n}\n\n.p-menubar-item-active > .p-menubar-item-content {\n color: " ) . concat ( dt ( "menubar.item.active.color" ) , ";\n background: " ) . concat ( dt ( "menubar.item.active.background" ) , ";\n}\n\n.p-menubar-item-active > .p-menubar-item-content .p-menubar-item-icon {\n color: " ) . concat ( dt ( "menubar.item.icon.active.color" ) , ";\n}\n\n.p-menubar-item-active > .p-menubar-item-content .p-menubar-submenu-icon {\n color: " ) . concat ( dt ( "menubar.submenu.icon.active.color" ) , ";\n}\n\n.p-menubar-submenu {\n display: none;\n position: absolute;\n min-width: 12.5rem;\n z-index: 1;\n background: " ) . concat ( dt ( "menubar.submenu.background" ) , ";\n border: 1px solid " ) . concat ( dt ( "menubar.submenu.border.color" ) , ";\n border-radius: " ) . concat ( dt ( "menubar.border.radius" ) , ";\n box-shadow: " ) . concat ( dt ( "menubar.submenu.shadow" ) , ";\n color: " ) . concat ( dt ( "menubar.submenu.color" ) , ";\n flex-direction: column;\n padding: " ) . concat ( dt ( "menubar.submenu.padding" ) , ";\n gap: " ) . concat ( dt ( " men
} , "theme" ) ;
var inlineStyles$1 = {
submenu : /* @__PURE__ */ _ _name ( function submenu ( _ref2 ) {
var instance = _ref2 . instance , processedItem = _ref2 . processedItem ;
return {
display : instance . isItemActive ( processedItem ) ? "flex" : "none"
} ;
} , "submenu" )
} ;
var classes$3 = {
2024-10-29 18:14:06 +00:00
root : /* @__PURE__ */ _ _name ( function root8 ( _ref3 ) {
2024-10-28 18:29:38 +00:00
var instance = _ref3 . instance ;
return [ "p-menubar p-component" , {
"p-menubar-mobile" : instance . queryMatches ,
"p-menubar-mobile-active" : instance . mobileActive
} ] ;
} , "root" ) ,
start : "p-menubar-start" ,
button : "p-menubar-button" ,
rootList : "p-menubar-root-list" ,
item : /* @__PURE__ */ _ _name ( function item ( _ref4 ) {
var instance = _ref4 . instance , processedItem = _ref4 . processedItem ;
return [ "p-menubar-item" , {
"p-menubar-item-active" : instance . isItemActive ( processedItem ) ,
"p-focus" : instance . isItemFocused ( processedItem ) ,
"p-disabled" : instance . isItemDisabled ( processedItem )
} ] ;
} , "item" ) ,
itemContent : "p-menubar-item-content" ,
itemLink : "p-menubar-item-link" ,
itemIcon : "p-menubar-item-icon" ,
itemLabel : "p-menubar-item-label" ,
submenuIcon : "p-menubar-submenu-icon" ,
submenu : "p-menubar-submenu" ,
separator : "p-menubar-separator" ,
end : "p-menubar-end"
} ;
var MenubarStyle = BaseStyle . extend ( {
name : "menubar" ,
theme : theme$3 ,
classes : classes$3 ,
inlineStyles : inlineStyles$1
} ) ;
var script$2$1 = {
name : "BaseMenubar" ,
2024-10-29 18:14:06 +00:00
"extends" : script$g ,
2024-10-28 18:29:38 +00:00
props : {
model : {
type : Array ,
"default" : null
} ,
buttonProps : {
type : null ,
"default" : null
} ,
breakpoint : {
type : String ,
"default" : "960px"
} ,
ariaLabelledby : {
type : String ,
"default" : null
} ,
ariaLabel : {
type : String ,
"default" : null
}
} ,
style : MenubarStyle ,
2024-10-29 18:14:06 +00:00
provide : /* @__PURE__ */ _ _name ( function provide10 ( ) {
2024-10-28 18:29:38 +00:00
return {
$pcMenubar : this ,
$parentInstance : this
} ;
} , "provide" )
} ;
var script$1$3 = {
name : "MenubarSub" ,
hostName : "Menubar" ,
2024-10-29 18:14:06 +00:00
"extends" : script$g ,
2024-10-28 18:29:38 +00:00
emits : [ "item-mouseenter" , "item-click" , "item-mousemove" ] ,
props : {
items : {
type : Array ,
"default" : null
} ,
root : {
type : Boolean ,
"default" : false
} ,
popup : {
type : Boolean ,
"default" : false
} ,
mobileActive : {
type : Boolean ,
"default" : false
} ,
templates : {
type : Object ,
"default" : null
} ,
level : {
type : Number ,
"default" : 0
} ,
menuId : {
type : String ,
"default" : null
} ,
focusedItemId : {
type : String ,
"default" : null
} ,
activeItemPath : {
type : Object ,
"default" : null
}
} ,
list : null ,
methods : {
getItemId : /* @__PURE__ */ _ _name ( function getItemId ( processedItem ) {
return "" . concat ( this . menuId , "_" ) . concat ( processedItem . key ) ;
} , "getItemId" ) ,
getItemKey : /* @__PURE__ */ _ _name ( function getItemKey ( processedItem ) {
return this . getItemId ( processedItem ) ;
} , "getItemKey" ) ,
getItemProp : /* @__PURE__ */ _ _name ( function getItemProp ( processedItem , name , params ) {
return processedItem && processedItem . item ? resolve ( processedItem . item [ name ] , params ) : void 0 ;
} , "getItemProp" ) ,
getItemLabel : /* @__PURE__ */ _ _name ( function getItemLabel ( processedItem ) {
return this . getItemProp ( processedItem , "label" ) ;
} , "getItemLabel" ) ,
getItemLabelId : /* @__PURE__ */ _ _name ( function getItemLabelId ( processedItem ) {
return "" . concat ( this . menuId , "_" ) . concat ( processedItem . key , "_label" ) ;
} , "getItemLabelId" ) ,
getPTOptions : /* @__PURE__ */ _ _name ( function getPTOptions4 ( processedItem , index , key ) {
return this . ptm ( key , {
context : {
item : processedItem . item ,
index ,
active : this . isItemActive ( processedItem ) ,
focused : this . isItemFocused ( processedItem ) ,
disabled : this . isItemDisabled ( processedItem ) ,
level : this . level
}
} ) ;
} , "getPTOptions" ) ,
isItemActive : /* @__PURE__ */ _ _name ( function isItemActive ( processedItem ) {
return this . activeItemPath . some ( function ( path ) {
return path . key === processedItem . key ;
} ) ;
} , "isItemActive" ) ,
isItemVisible : /* @__PURE__ */ _ _name ( function isItemVisible ( processedItem ) {
return this . getItemProp ( processedItem , "visible" ) !== false ;
} , "isItemVisible" ) ,
isItemDisabled : /* @__PURE__ */ _ _name ( function isItemDisabled ( processedItem ) {
return this . getItemProp ( processedItem , "disabled" ) ;
} , "isItemDisabled" ) ,
isItemFocused : /* @__PURE__ */ _ _name ( function isItemFocused ( processedItem ) {
return this . focusedItemId === this . getItemId ( processedItem ) ;
} , "isItemFocused" ) ,
isItemGroup : /* @__PURE__ */ _ _name ( function isItemGroup ( processedItem ) {
return isNotEmpty ( processedItem . items ) ;
} , "isItemGroup" ) ,
onItemClick : /* @__PURE__ */ _ _name ( function onItemClick ( event , processedItem ) {
this . getItemProp ( processedItem , "command" , {
originalEvent : event ,
item : processedItem . item
} ) ;
this . $emit ( "item-click" , {
originalEvent : event ,
processedItem ,
isFocus : true
} ) ;
} , "onItemClick" ) ,
onItemMouseEnter : /* @__PURE__ */ _ _name ( function onItemMouseEnter ( event , processedItem ) {
this . $emit ( "item-mouseenter" , {
originalEvent : event ,
processedItem
} ) ;
} , "onItemMouseEnter" ) ,
onItemMouseMove : /* @__PURE__ */ _ _name ( function onItemMouseMove ( event , processedItem ) {
this . $emit ( "item-mousemove" , {
originalEvent : event ,
processedItem
} ) ;
} , "onItemMouseMove" ) ,
getAriaPosInset : /* @__PURE__ */ _ _name ( function getAriaPosInset2 ( index ) {
return index - this . calculateAriaSetSize . slice ( 0 , index ) . length + 1 ;
} , "getAriaPosInset" ) ,
getMenuItemProps : /* @__PURE__ */ _ _name ( function getMenuItemProps ( processedItem , index ) {
return {
action : mergeProps ( {
"class" : this . cx ( "itemLink" ) ,
tabindex : - 1 ,
"aria-hidden" : true
} , this . getPTOptions ( processedItem , index , "itemLink" ) ) ,
icon : mergeProps ( {
"class" : [ this . cx ( "itemIcon" ) , this . getItemProp ( processedItem , "icon" ) ]
} , this . getPTOptions ( processedItem , index , "itemIcon" ) ) ,
label : mergeProps ( {
"class" : this . cx ( "itemLabel" )
} , this . getPTOptions ( processedItem , index , "itemLabel" ) ) ,
submenuicon : mergeProps ( {
"class" : this . cx ( "submenuIcon" )
} , this . getPTOptions ( processedItem , index , "submenuIcon" ) )
} ;
} , "getMenuItemProps" )
} ,
computed : {
calculateAriaSetSize : /* @__PURE__ */ _ _name ( function calculateAriaSetSize ( ) {
var _this = this ;
return this . items . filter ( function ( processedItem ) {
return _this . isItemVisible ( processedItem ) && _this . getItemProp ( processedItem , "separator" ) ;
} ) ;
} , "calculateAriaSetSize" ) ,
getAriaSetSize : /* @__PURE__ */ _ _name ( function getAriaSetSize ( ) {
var _this2 = this ;
return this . items . filter ( function ( processedItem ) {
return _this2 . isItemVisible ( processedItem ) && ! _this2 . getItemProp ( processedItem , "separator" ) ;
} ) . length ;
} , "getAriaSetSize" )
} ,
components : {
2024-10-29 18:14:06 +00:00
AngleRightIcon : script$y ,
AngleDownIcon : script$z
2024-10-28 18:29:38 +00:00
} ,
directives : {
ripple : Ripple
}
} ;
var _hoisted _1$1$2 = [ "id" , "aria-label" , "aria-disabled" , "aria-expanded" , "aria-haspopup" , "aria-level" , "aria-setsize" , "aria-posinset" , "data-p-active" , "data-p-focused" , "data-p-disabled" ] ;
2024-11-16 01:17:15 +00:00
var _hoisted _2$a = [ "onClick" , "onMouseenter" , "onMousemove" ] ;
var _hoisted _3$8 = [ "href" , "target" ] ;
2024-10-28 18:29:38 +00:00
var _hoisted _4$1 = [ "id" ] ;
var _hoisted _5$1 = [ "id" ] ;
2024-10-29 18:14:06 +00:00
function render$1$2 ( _ctx , _cache , $props , $setup , $data , $options ) {
2024-10-28 18:29:38 +00:00
var _component _MenubarSub = resolveComponent ( "MenubarSub" , true ) ;
var _directive _ripple = resolveDirective ( "ripple" ) ;
return openBlock ( ) , createElementBlock ( "ul" , mergeProps ( {
"class" : $props . level === 0 ? _ctx . cx ( "rootList" ) : _ctx . cx ( "submenu" )
} , $props . level === 0 ? _ctx . ptm ( "rootList" ) : _ctx . ptm ( "submenu" ) ) , [ ( openBlock ( true ) , createElementBlock ( Fragment , null , renderList ( $props . items , function ( processedItem , index ) {
return openBlock ( ) , createElementBlock ( Fragment , {
key : $options . getItemKey ( processedItem )
} , [ $options . isItemVisible ( processedItem ) && ! $options . getItemProp ( processedItem , "separator" ) ? ( openBlock ( ) , createElementBlock ( "li" , mergeProps ( {
key : 0 ,
id : $options . getItemId ( processedItem ) ,
style : $options . getItemProp ( processedItem , "style" ) ,
"class" : [ _ctx . cx ( "item" , {
processedItem
} ) , $options . getItemProp ( processedItem , "class" ) ] ,
role : "menuitem" ,
"aria-label" : $options . getItemLabel ( processedItem ) ,
"aria-disabled" : $options . isItemDisabled ( processedItem ) || void 0 ,
"aria-expanded" : $options . isItemGroup ( processedItem ) ? $options . isItemActive ( processedItem ) : void 0 ,
"aria-haspopup" : $options . isItemGroup ( processedItem ) && ! $options . getItemProp ( processedItem , "to" ) ? "menu" : void 0 ,
"aria-level" : $props . level + 1 ,
"aria-setsize" : $options . getAriaSetSize ,
"aria-posinset" : $options . getAriaPosInset ( index ) ,
ref _for : true
} , $options . getPTOptions ( processedItem , index , "item" ) , {
"data-p-active" : $options . isItemActive ( processedItem ) ,
"data-p-focused" : $options . isItemFocused ( processedItem ) ,
"data-p-disabled" : $options . isItemDisabled ( processedItem )
} ) , [ createBaseVNode ( "div" , mergeProps ( {
"class" : _ctx . cx ( "itemContent" ) ,
2024-10-29 18:14:06 +00:00
onClick : /* @__PURE__ */ _ _name ( function onClick2 ( $event ) {
2024-10-28 18:29:38 +00:00
return $options . onItemClick ( $event , processedItem ) ;
} , "onClick" ) ,
onMouseenter : /* @__PURE__ */ _ _name ( function onMouseenter ( $event ) {
return $options . onItemMouseEnter ( $event , processedItem ) ;
} , "onMouseenter" ) ,
onMousemove : /* @__PURE__ */ _ _name ( function onMousemove ( $event ) {
return $options . onItemMouseMove ( $event , processedItem ) ;
} , "onMousemove" ) ,
ref _for : true
} , $options . getPTOptions ( processedItem , index , "itemContent" ) ) , [ ! $props . templates . item ? withDirectives ( ( openBlock ( ) , createElementBlock ( "a" , mergeProps ( {
key : 0 ,
href : $options . getItemProp ( processedItem , "url" ) ,
"class" : _ctx . cx ( "itemLink" ) ,
target : $options . getItemProp ( processedItem , "target" ) ,
tabindex : "-1" ,
ref _for : true
} , $options . getPTOptions ( processedItem , index , "itemLink" ) ) , [ $props . templates . itemicon ? ( openBlock ( ) , createBlock ( resolveDynamicComponent ( $props . templates . itemicon ) , {
key : 0 ,
item : processedItem . item ,
"class" : normalizeClass ( _ctx . cx ( "itemIcon" ) )
} , null , 8 , [ "item" , "class" ] ) ) : $options . getItemProp ( processedItem , "icon" ) ? ( openBlock ( ) , createElementBlock ( "span" , mergeProps ( {
key : 1 ,
"class" : [ _ctx . cx ( "itemIcon" ) , $options . getItemProp ( processedItem , "icon" ) ] ,
ref _for : true
} , $options . getPTOptions ( processedItem , index , "itemIcon" ) ) , null , 16 ) ) : createCommentVNode ( "" , true ) , createBaseVNode ( "span" , mergeProps ( {
id : $options . getItemLabelId ( processedItem ) ,
"class" : _ctx . cx ( "itemLabel" ) ,
ref _for : true
} , $options . getPTOptions ( processedItem , index , "itemLabel" ) ) , toDisplayString ( $options . getItemLabel ( processedItem ) ) , 17 , _hoisted _4$1 ) , $options . getItemProp ( processedItem , "items" ) ? ( openBlock ( ) , createElementBlock ( Fragment , {
key : 2
} , [ $props . templates . submenuicon ? ( openBlock ( ) , createBlock ( resolveDynamicComponent ( $props . templates . submenuicon ) , {
key : 0 ,
root : $props . root ,
active : $options . isItemActive ( processedItem ) ,
"class" : normalizeClass ( _ctx . cx ( "submenuIcon" ) )
} , null , 8 , [ "root" , "active" , "class" ] ) ) : ( openBlock ( ) , createBlock ( resolveDynamicComponent ( $props . root ? "AngleDownIcon" : "AngleRightIcon" ) , mergeProps ( {
key : 1 ,
"class" : _ctx . cx ( "submenuIcon" ) ,
ref _for : true
2024-11-16 01:17:15 +00:00
} , $options . getPTOptions ( processedItem , index , "submenuIcon" ) ) , null , 16 , [ "class" ] ) ) ] , 64 ) ) : createCommentVNode ( "" , true ) ] , 16 , _hoisted _3$8 ) ) , [ [ _directive _ripple ] ] ) : ( openBlock ( ) , createBlock ( resolveDynamicComponent ( $props . templates . item ) , {
2024-10-28 18:29:38 +00:00
key : 1 ,
item : processedItem . item ,
root : $props . root ,
hasSubmenu : $options . getItemProp ( processedItem , "items" ) ,
label : $options . getItemLabel ( processedItem ) ,
props : $options . getMenuItemProps ( processedItem , index )
2024-11-16 01:17:15 +00:00
} , null , 8 , [ "item" , "root" , "hasSubmenu" , "label" , "props" ] ) ) ] , 16 , _hoisted _2$a ) , $options . isItemVisible ( processedItem ) && $options . isItemGroup ( processedItem ) ? ( openBlock ( ) , createBlock ( _component _MenubarSub , {
2024-10-28 18:29:38 +00:00
key : 0 ,
id : $options . getItemId ( processedItem ) + "_list" ,
menuId : $props . menuId ,
role : "menu" ,
style : normalizeStyle ( _ctx . sx ( "submenu" , true , {
processedItem
} ) ) ,
focusedItemId : $props . focusedItemId ,
items : processedItem . items ,
mobileActive : $props . mobileActive ,
activeItemPath : $props . activeItemPath ,
templates : $props . templates ,
level : $props . level + 1 ,
"aria-labelledby" : $options . getItemLabelId ( processedItem ) ,
pt : _ctx . pt ,
unstyled : _ctx . unstyled ,
onItemClick : _cache [ 0 ] || ( _cache [ 0 ] = function ( $event ) {
return _ctx . $emit ( "item-click" , $event ) ;
} ) ,
onItemMouseenter : _cache [ 1 ] || ( _cache [ 1 ] = function ( $event ) {
return _ctx . $emit ( "item-mouseenter" , $event ) ;
} ) ,
onItemMousemove : _cache [ 2 ] || ( _cache [ 2 ] = function ( $event ) {
return _ctx . $emit ( "item-mousemove" , $event ) ;
} )
} , null , 8 , [ "id" , "menuId" , "style" , "focusedItemId" , "items" , "mobileActive" , "activeItemPath" , "templates" , "level" , "aria-labelledby" , "pt" , "unstyled" ] ) ) : createCommentVNode ( "" , true ) ] , 16 , _hoisted _1$1$2 ) ) : createCommentVNode ( "" , true ) , $options . isItemVisible ( processedItem ) && $options . getItemProp ( processedItem , "separator" ) ? ( openBlock ( ) , createElementBlock ( "li" , mergeProps ( {
key : 1 ,
id : $options . getItemId ( processedItem ) ,
"class" : [ _ctx . cx ( "separator" ) , $options . getItemProp ( processedItem , "class" ) ] ,
style : $options . getItemProp ( processedItem , "style" ) ,
role : "separator" ,
ref _for : true
} , _ctx . ptm ( "separator" ) ) , null , 16 , _hoisted _5$1 ) ) : createCommentVNode ( "" , true ) ] , 64 ) ;
} ) , 128 ) ) ] , 16 ) ;
}
2024-10-29 18:14:06 +00:00
_ _name ( render$1$2 , "render$1$2" ) ;
script$1$3 . render = render$1$2 ;
2024-10-28 18:29:38 +00:00
var script$5 = {
name : "Menubar" ,
"extends" : script$2$1 ,
inheritAttrs : false ,
emits : [ "focus" , "blur" ] ,
matchMediaListener : null ,
2024-10-29 18:14:06 +00:00
data : /* @__PURE__ */ _ _name ( function data6 ( ) {
2024-10-28 18:29:38 +00:00
return {
id : this . $attrs . id ,
mobileActive : false ,
focused : false ,
focusedItemInfo : {
index : - 1 ,
level : 0 ,
parentKey : ""
} ,
activeItemPath : [ ] ,
dirty : false ,
query : null ,
queryMatches : false
} ;
} , "data" ) ,
watch : {
"$attrs.id" : /* @__PURE__ */ _ _name ( function $attrsId2 ( newValue ) {
this . id = newValue || UniqueComponentId ( ) ;
} , "$attrsId" ) ,
activeItemPath : /* @__PURE__ */ _ _name ( function activeItemPath ( newPath ) {
if ( isNotEmpty ( newPath ) ) {
this . bindOutsideClickListener ( ) ;
this . bindResizeListener ( ) ;
} else {
this . unbindOutsideClickListener ( ) ;
this . unbindResizeListener ( ) ;
}
} , "activeItemPath" )
} ,
outsideClickListener : null ,
container : null ,
menubar : null ,
2024-10-29 18:14:06 +00:00
mounted : /* @__PURE__ */ _ _name ( function mounted6 ( ) {
2024-10-28 18:29:38 +00:00
this . id = this . id || UniqueComponentId ( ) ;
this . bindMatchMediaListener ( ) ;
} , "mounted" ) ,
2024-10-29 18:14:06 +00:00
beforeUnmount : /* @__PURE__ */ _ _name ( function beforeUnmount6 ( ) {
2024-10-28 18:29:38 +00:00
this . mobileActive = false ;
this . unbindOutsideClickListener ( ) ;
this . unbindResizeListener ( ) ;
this . unbindMatchMediaListener ( ) ;
if ( this . container ) {
ZIndex . clear ( this . container ) ;
}
this . container = null ;
} , "beforeUnmount" ) ,
methods : {
getItemProp : /* @__PURE__ */ _ _name ( function getItemProp2 ( item3 , name ) {
return item3 ? resolve ( item3 [ name ] ) : void 0 ;
} , "getItemProp" ) ,
getItemLabel : /* @__PURE__ */ _ _name ( function getItemLabel2 ( item3 ) {
return this . getItemProp ( item3 , "label" ) ;
} , "getItemLabel" ) ,
isItemDisabled : /* @__PURE__ */ _ _name ( function isItemDisabled2 ( item3 ) {
return this . getItemProp ( item3 , "disabled" ) ;
} , "isItemDisabled" ) ,
isItemVisible : /* @__PURE__ */ _ _name ( function isItemVisible2 ( item3 ) {
return this . getItemProp ( item3 , "visible" ) !== false ;
} , "isItemVisible" ) ,
isItemGroup : /* @__PURE__ */ _ _name ( function isItemGroup2 ( item3 ) {
return isNotEmpty ( this . getItemProp ( item3 , "items" ) ) ;
} , "isItemGroup" ) ,
isItemSeparator : /* @__PURE__ */ _ _name ( function isItemSeparator ( item3 ) {
return this . getItemProp ( item3 , "separator" ) ;
} , "isItemSeparator" ) ,
getProccessedItemLabel : /* @__PURE__ */ _ _name ( function getProccessedItemLabel ( processedItem ) {
return processedItem ? this . getItemLabel ( processedItem . item ) : void 0 ;
} , "getProccessedItemLabel" ) ,
isProccessedItemGroup : /* @__PURE__ */ _ _name ( function isProccessedItemGroup ( processedItem ) {
return processedItem && isNotEmpty ( processedItem . items ) ;
} , "isProccessedItemGroup" ) ,
toggle : /* @__PURE__ */ _ _name ( function toggle ( event ) {
var _this = this ;
if ( this . mobileActive ) {
this . mobileActive = false ;
ZIndex . clear ( this . menubar ) ;
this . hide ( ) ;
} else {
this . mobileActive = true ;
ZIndex . set ( "menu" , this . menubar , this . $primevue . config . zIndex . menu ) ;
setTimeout ( function ( ) {
_this . show ( ) ;
} , 1 ) ;
}
this . bindOutsideClickListener ( ) ;
event . preventDefault ( ) ;
} , "toggle" ) ,
show : /* @__PURE__ */ _ _name ( function show2 ( ) {
focus ( this . menubar ) ;
} , "show" ) ,
hide : /* @__PURE__ */ _ _name ( function hide2 ( event , isFocus ) {
var _this2 = this ;
if ( this . mobileActive ) {
this . mobileActive = false ;
setTimeout ( function ( ) {
focus ( _this2 . $refs . menubutton ) ;
} , 0 ) ;
}
this . activeItemPath = [ ] ;
this . focusedItemInfo = {
index : - 1 ,
level : 0 ,
parentKey : ""
} ;
isFocus && focus ( this . menubar ) ;
this . dirty = false ;
} , "hide" ) ,
2024-10-29 18:14:06 +00:00
onFocus : /* @__PURE__ */ _ _name ( function onFocus3 ( event ) {
2024-10-28 18:29:38 +00:00
this . focused = true ;
this . focusedItemInfo = this . focusedItemInfo . index !== - 1 ? this . focusedItemInfo : {
index : this . findFirstFocusedItemIndex ( ) ,
level : 0 ,
parentKey : ""
} ;
this . $emit ( "focus" , event ) ;
} , "onFocus" ) ,
onBlur : /* @__PURE__ */ _ _name ( function onBlur2 ( event ) {
this . focused = false ;
this . focusedItemInfo = {
index : - 1 ,
level : 0 ,
parentKey : ""
} ;
this . searchValue = "" ;
this . dirty = false ;
this . $emit ( "blur" , event ) ;
} , "onBlur" ) ,
onKeyDown : /* @__PURE__ */ _ _name ( function onKeyDown2 ( event ) {
var metaKey = event . metaKey || event . ctrlKey ;
switch ( event . code ) {
case "ArrowDown" :
this . onArrowDownKey ( event ) ;
break ;
case "ArrowUp" :
this . onArrowUpKey ( event ) ;
break ;
case "ArrowLeft" :
this . onArrowLeftKey ( event ) ;
break ;
case "ArrowRight" :
this . onArrowRightKey ( event ) ;
break ;
case "Home" :
this . onHomeKey ( event ) ;
break ;
case "End" :
this . onEndKey ( event ) ;
break ;
case "Space" :
this . onSpaceKey ( event ) ;
break ;
case "Enter" :
case "NumpadEnter" :
this . onEnterKey ( event ) ;
break ;
case "Escape" :
this . onEscapeKey ( event ) ;
break ;
case "Tab" :
this . onTabKey ( event ) ;
break ;
case "PageDown" :
case "PageUp" :
case "Backspace" :
case "ShiftLeft" :
case "ShiftRight" :
break ;
default :
if ( ! metaKey && isPrintableCharacter ( event . key ) ) {
this . searchItems ( event , event . key ) ;
}
break ;
}
} , "onKeyDown" ) ,
onItemChange : /* @__PURE__ */ _ _name ( function onItemChange ( event ) {
var processedItem = event . processedItem , isFocus = event . isFocus ;
if ( isEmpty ( processedItem ) ) return ;
var index = processedItem . index , key = processedItem . key , level = processedItem . level , parentKey = processedItem . parentKey , items = processedItem . items ;
var grouped = isNotEmpty ( items ) ;
var activeItemPath3 = this . activeItemPath . filter ( function ( p ) {
return p . parentKey !== parentKey && p . parentKey !== key ;
} ) ;
grouped && activeItemPath3 . push ( processedItem ) ;
this . focusedItemInfo = {
index ,
level ,
parentKey
} ;
this . activeItemPath = activeItemPath3 ;
grouped && ( this . dirty = true ) ;
isFocus && focus ( this . menubar ) ;
} , "onItemChange" ) ,
onItemClick : /* @__PURE__ */ _ _name ( function onItemClick2 ( event ) {
var originalEvent = event . originalEvent , processedItem = event . processedItem ;
var grouped = this . isProccessedItemGroup ( processedItem ) ;
2024-10-29 18:14:06 +00:00
var root12 = isEmpty ( processedItem . parent ) ;
2024-10-28 18:29:38 +00:00
var selected = this . isSelected ( processedItem ) ;
if ( selected ) {
var index = processedItem . index , key = processedItem . key , level = processedItem . level , parentKey = processedItem . parentKey ;
this . activeItemPath = this . activeItemPath . filter ( function ( p ) {
return key !== p . key && key . startsWith ( p . key ) ;
} ) ;
this . focusedItemInfo = {
index ,
level ,
parentKey
} ;
2024-10-29 18:14:06 +00:00
this . dirty = ! root12 ;
2024-10-28 18:29:38 +00:00
focus ( this . menubar ) ;
} else {
if ( grouped ) {
this . onItemChange ( event ) ;
} else {
2024-10-29 18:14:06 +00:00
var rootProcessedItem = root12 ? processedItem : this . activeItemPath . find ( function ( p ) {
2024-10-28 18:29:38 +00:00
return p . parentKey === "" ;
} ) ;
this . hide ( originalEvent ) ;
this . changeFocusedItemIndex ( originalEvent , rootProcessedItem ? rootProcessedItem . index : - 1 ) ;
this . mobileActive = false ;
focus ( this . menubar ) ;
}
}
} , "onItemClick" ) ,
onItemMouseEnter : /* @__PURE__ */ _ _name ( function onItemMouseEnter2 ( event ) {
if ( this . dirty ) {
this . onItemChange ( event ) ;
}
} , "onItemMouseEnter" ) ,
onItemMouseMove : /* @__PURE__ */ _ _name ( function onItemMouseMove2 ( event ) {
if ( this . focused ) {
this . changeFocusedItemIndex ( event , event . processedItem . index ) ;
}
} , "onItemMouseMove" ) ,
menuButtonClick : /* @__PURE__ */ _ _name ( function menuButtonClick ( event ) {
this . toggle ( event ) ;
} , "menuButtonClick" ) ,
menuButtonKeydown : /* @__PURE__ */ _ _name ( function menuButtonKeydown ( event ) {
( event . code === "Enter" || event . code === "NumpadEnter" || event . code === "Space" ) && this . menuButtonClick ( event ) ;
} , "menuButtonKeydown" ) ,
onArrowDownKey : /* @__PURE__ */ _ _name ( function onArrowDownKey2 ( event ) {
var processedItem = this . visibleItems [ this . focusedItemInfo . index ] ;
2024-10-29 18:14:06 +00:00
var root12 = processedItem ? isEmpty ( processedItem . parent ) : null ;
if ( root12 ) {
2024-10-28 18:29:38 +00:00
var grouped = this . isProccessedItemGroup ( processedItem ) ;
if ( grouped ) {
this . onItemChange ( {
originalEvent : event ,
processedItem
} ) ;
this . focusedItemInfo = {
index : - 1 ,
parentKey : processedItem . key
} ;
this . onArrowRightKey ( event ) ;
}
} else {
var itemIndex = this . focusedItemInfo . index !== - 1 ? this . findNextItemIndex ( this . focusedItemInfo . index ) : this . findFirstFocusedItemIndex ( ) ;
this . changeFocusedItemIndex ( event , itemIndex ) ;
}
event . preventDefault ( ) ;
} , "onArrowDownKey" ) ,
onArrowUpKey : /* @__PURE__ */ _ _name ( function onArrowUpKey2 ( event ) {
var _this3 = this ;
var processedItem = this . visibleItems [ this . focusedItemInfo . index ] ;
2024-10-29 18:14:06 +00:00
var root12 = isEmpty ( processedItem . parent ) ;
if ( root12 ) {
2024-10-28 18:29:38 +00:00
var grouped = this . isProccessedItemGroup ( processedItem ) ;
if ( grouped ) {
this . onItemChange ( {
originalEvent : event ,
processedItem
} ) ;
this . focusedItemInfo = {
index : - 1 ,
parentKey : processedItem . key
} ;
var itemIndex = this . findLastItemIndex ( ) ;
this . changeFocusedItemIndex ( event , itemIndex ) ;
}
} else {
var parentItem = this . activeItemPath . find ( function ( p ) {
return p . key === processedItem . parentKey ;
} ) ;
if ( this . focusedItemInfo . index === 0 ) {
this . focusedItemInfo = {
index : - 1 ,
parentKey : parentItem ? parentItem . parentKey : ""
} ;
this . searchValue = "" ;
this . onArrowLeftKey ( event ) ;
this . activeItemPath = this . activeItemPath . filter ( function ( p ) {
return p . parentKey !== _this3 . focusedItemInfo . parentKey ;
} ) ;
} else {
var _itemIndex = this . focusedItemInfo . index !== - 1 ? this . findPrevItemIndex ( this . focusedItemInfo . index ) : this . findLastFocusedItemIndex ( ) ;
this . changeFocusedItemIndex ( event , _itemIndex ) ;
}
}
event . preventDefault ( ) ;
} , "onArrowUpKey" ) ,
2024-10-29 18:14:06 +00:00
onArrowLeftKey : /* @__PURE__ */ _ _name ( function onArrowLeftKey3 ( event ) {
2024-10-28 18:29:38 +00:00
var _this4 = this ;
var processedItem = this . visibleItems [ this . focusedItemInfo . index ] ;
var parentItem = processedItem ? this . activeItemPath . find ( function ( p ) {
return p . key === processedItem . parentKey ;
} ) : null ;
if ( parentItem ) {
this . onItemChange ( {
originalEvent : event ,
processedItem : parentItem
} ) ;
this . activeItemPath = this . activeItemPath . filter ( function ( p ) {
return p . parentKey !== _this4 . focusedItemInfo . parentKey ;
} ) ;
event . preventDefault ( ) ;
} else {
var itemIndex = this . focusedItemInfo . index !== - 1 ? this . findPrevItemIndex ( this . focusedItemInfo . index ) : this . findLastFocusedItemIndex ( ) ;
this . changeFocusedItemIndex ( event , itemIndex ) ;
event . preventDefault ( ) ;
}
} , "onArrowLeftKey" ) ,
2024-10-29 18:14:06 +00:00
onArrowRightKey : /* @__PURE__ */ _ _name ( function onArrowRightKey3 ( event ) {
2024-10-28 18:29:38 +00:00
var processedItem = this . visibleItems [ this . focusedItemInfo . index ] ;
var parentItem = processedItem ? this . activeItemPath . find ( function ( p ) {
return p . key === processedItem . parentKey ;
} ) : null ;
if ( parentItem ) {
var grouped = this . isProccessedItemGroup ( processedItem ) ;
if ( grouped ) {
this . onItemChange ( {
originalEvent : event ,
processedItem
} ) ;
this . focusedItemInfo = {
index : - 1 ,
parentKey : processedItem . key
} ;
this . onArrowDownKey ( event ) ;
}
} else {
var itemIndex = this . focusedItemInfo . index !== - 1 ? this . findNextItemIndex ( this . focusedItemInfo . index ) : this . findFirstFocusedItemIndex ( ) ;
this . changeFocusedItemIndex ( event , itemIndex ) ;
event . preventDefault ( ) ;
}
} , "onArrowRightKey" ) ,
2024-10-29 18:14:06 +00:00
onHomeKey : /* @__PURE__ */ _ _name ( function onHomeKey3 ( event ) {
2024-10-28 18:29:38 +00:00
this . changeFocusedItemIndex ( event , this . findFirstItemIndex ( ) ) ;
event . preventDefault ( ) ;
} , "onHomeKey" ) ,
2024-10-29 18:14:06 +00:00
onEndKey : /* @__PURE__ */ _ _name ( function onEndKey3 ( event ) {
2024-10-28 18:29:38 +00:00
this . changeFocusedItemIndex ( event , this . findLastItemIndex ( ) ) ;
event . preventDefault ( ) ;
} , "onEndKey" ) ,
2024-10-29 18:14:06 +00:00
onEnterKey : /* @__PURE__ */ _ _name ( function onEnterKey3 ( event ) {
2024-10-28 18:29:38 +00:00
if ( this . focusedItemInfo . index !== - 1 ) {
var element = findSingle ( this . menubar , 'li[id="' . concat ( "" . concat ( this . focusedItemId ) , '"]' ) ) ;
var anchorElement = element && findSingle ( element , 'a[data-pc-section="itemlink"]' ) ;
anchorElement ? anchorElement . click ( ) : element && element . click ( ) ;
var processedItem = this . visibleItems [ this . focusedItemInfo . index ] ;
var grouped = this . isProccessedItemGroup ( processedItem ) ;
! grouped && ( this . focusedItemInfo . index = this . findFirstFocusedItemIndex ( ) ) ;
}
event . preventDefault ( ) ;
} , "onEnterKey" ) ,
onSpaceKey : /* @__PURE__ */ _ _name ( function onSpaceKey ( event ) {
this . onEnterKey ( event ) ;
} , "onSpaceKey" ) ,
onEscapeKey : /* @__PURE__ */ _ _name ( function onEscapeKey2 ( event ) {
if ( this . focusedItemInfo . level !== 0 ) {
var _focusedItemInfo = this . focusedItemInfo ;
this . hide ( event , false ) ;
this . focusedItemInfo = {
index : Number ( _focusedItemInfo . parentKey . split ( "_" ) [ 0 ] ) ,
level : 0 ,
parentKey : ""
} ;
}
event . preventDefault ( ) ;
} , "onEscapeKey" ) ,
onTabKey : /* @__PURE__ */ _ _name ( function onTabKey2 ( event ) {
if ( this . focusedItemInfo . index !== - 1 ) {
var processedItem = this . visibleItems [ this . focusedItemInfo . index ] ;
var grouped = this . isProccessedItemGroup ( processedItem ) ;
! grouped && this . onItemChange ( {
originalEvent : event ,
processedItem
} ) ;
}
this . hide ( ) ;
} , "onTabKey" ) ,
bindOutsideClickListener : /* @__PURE__ */ _ _name ( function bindOutsideClickListener2 ( ) {
var _this5 = this ;
if ( ! this . outsideClickListener ) {
this . outsideClickListener = function ( event ) {
var isOutsideContainer = _this5 . container && ! _this5 . container . contains ( event . target ) ;
var isOutsideTarget = ! ( _this5 . target && ( _this5 . target === event . target || _this5 . target . contains ( event . target ) ) ) ;
if ( isOutsideContainer && isOutsideTarget ) {
_this5 . hide ( ) ;
}
} ;
document . addEventListener ( "click" , this . outsideClickListener ) ;
}
} , "bindOutsideClickListener" ) ,
unbindOutsideClickListener : /* @__PURE__ */ _ _name ( function unbindOutsideClickListener2 ( ) {
if ( this . outsideClickListener ) {
document . removeEventListener ( "click" , this . outsideClickListener ) ;
this . outsideClickListener = null ;
}
} , "unbindOutsideClickListener" ) ,
bindResizeListener : /* @__PURE__ */ _ _name ( function bindResizeListener2 ( ) {
var _this6 = this ;
if ( ! this . resizeListener ) {
this . resizeListener = function ( event ) {
if ( ! isTouchDevice ( ) ) {
_this6 . hide ( event , true ) ;
}
_this6 . mobileActive = false ;
} ;
window . addEventListener ( "resize" , this . resizeListener ) ;
}
} , "bindResizeListener" ) ,
unbindResizeListener : /* @__PURE__ */ _ _name ( function unbindResizeListener2 ( ) {
if ( this . resizeListener ) {
window . removeEventListener ( "resize" , this . resizeListener ) ;
this . resizeListener = null ;
}
} , "unbindResizeListener" ) ,
bindMatchMediaListener : /* @__PURE__ */ _ _name ( function bindMatchMediaListener ( ) {
var _this7 = this ;
if ( ! this . matchMediaListener ) {
var query = matchMedia ( "(max-width: " . concat ( this . breakpoint , ")" ) ) ;
this . query = query ;
this . queryMatches = query . matches ;
this . matchMediaListener = function ( ) {
_this7 . queryMatches = query . matches ;
_this7 . mobileActive = false ;
} ;
this . query . addEventListener ( "change" , this . matchMediaListener ) ;
}
} , "bindMatchMediaListener" ) ,
unbindMatchMediaListener : /* @__PURE__ */ _ _name ( function unbindMatchMediaListener ( ) {
if ( this . matchMediaListener ) {
this . query . removeEventListener ( "change" , this . matchMediaListener ) ;
this . matchMediaListener = null ;
}
} , "unbindMatchMediaListener" ) ,
isItemMatched : /* @__PURE__ */ _ _name ( function isItemMatched ( processedItem ) {
var _this$getProccessedIt ;
return this . isValidItem ( processedItem ) && ( ( _this$getProccessedIt = this . getProccessedItemLabel ( processedItem ) ) === null || _this$getProccessedIt === void 0 ? void 0 : _this$getProccessedIt . toLocaleLowerCase ( ) . startsWith ( this . searchValue . toLocaleLowerCase ( ) ) ) ;
} , "isItemMatched" ) ,
isValidItem : /* @__PURE__ */ _ _name ( function isValidItem ( processedItem ) {
return ! ! processedItem && ! this . isItemDisabled ( processedItem . item ) && ! this . isItemSeparator ( processedItem . item ) && this . isItemVisible ( processedItem . item ) ;
} , "isValidItem" ) ,
isValidSelectedItem : /* @__PURE__ */ _ _name ( function isValidSelectedItem ( processedItem ) {
return this . isValidItem ( processedItem ) && this . isSelected ( processedItem ) ;
} , "isValidSelectedItem" ) ,
isSelected : /* @__PURE__ */ _ _name ( function isSelected2 ( processedItem ) {
return this . activeItemPath . some ( function ( p ) {
return p . key === processedItem . key ;
} ) ;
} , "isSelected" ) ,
findFirstItemIndex : /* @__PURE__ */ _ _name ( function findFirstItemIndex ( ) {
var _this8 = this ;
return this . visibleItems . findIndex ( function ( processedItem ) {
return _this8 . isValidItem ( processedItem ) ;
} ) ;
} , "findFirstItemIndex" ) ,
findLastItemIndex : /* @__PURE__ */ _ _name ( function findLastItemIndex ( ) {
var _this9 = this ;
return findLastIndex ( this . visibleItems , function ( processedItem ) {
return _this9 . isValidItem ( processedItem ) ;
} ) ;
} , "findLastItemIndex" ) ,
findNextItemIndex : /* @__PURE__ */ _ _name ( function findNextItemIndex ( index ) {
var _this10 = this ;
var matchedItemIndex = index < this . visibleItems . length - 1 ? this . visibleItems . slice ( index + 1 ) . findIndex ( function ( processedItem ) {
return _this10 . isValidItem ( processedItem ) ;
} ) : - 1 ;
return matchedItemIndex > - 1 ? matchedItemIndex + index + 1 : index ;
} , "findNextItemIndex" ) ,
findPrevItemIndex : /* @__PURE__ */ _ _name ( function findPrevItemIndex ( index ) {
var _this11 = this ;
var matchedItemIndex = index > 0 ? findLastIndex ( this . visibleItems . slice ( 0 , index ) , function ( processedItem ) {
return _this11 . isValidItem ( processedItem ) ;
} ) : - 1 ;
return matchedItemIndex > - 1 ? matchedItemIndex : index ;
} , "findPrevItemIndex" ) ,
findSelectedItemIndex : /* @__PURE__ */ _ _name ( function findSelectedItemIndex ( ) {
var _this12 = this ;
return this . visibleItems . findIndex ( function ( processedItem ) {
return _this12 . isValidSelectedItem ( processedItem ) ;
} ) ;
} , "findSelectedItemIndex" ) ,
findFirstFocusedItemIndex : /* @__PURE__ */ _ _name ( function findFirstFocusedItemIndex ( ) {
var selectedIndex = this . findSelectedItemIndex ( ) ;
return selectedIndex < 0 ? this . findFirstItemIndex ( ) : selectedIndex ;
} , "findFirstFocusedItemIndex" ) ,
findLastFocusedItemIndex : /* @__PURE__ */ _ _name ( function findLastFocusedItemIndex ( ) {
var selectedIndex = this . findSelectedItemIndex ( ) ;
return selectedIndex < 0 ? this . findLastItemIndex ( ) : selectedIndex ;
} , "findLastFocusedItemIndex" ) ,
searchItems : /* @__PURE__ */ _ _name ( function searchItems ( event , _char ) {
var _this13 = this ;
this . searchValue = ( this . searchValue || "" ) + _char ;
var itemIndex = - 1 ;
var matched = false ;
if ( this . focusedItemInfo . index !== - 1 ) {
itemIndex = this . visibleItems . slice ( this . focusedItemInfo . index ) . findIndex ( function ( processedItem ) {
return _this13 . isItemMatched ( processedItem ) ;
} ) ;
itemIndex = itemIndex === - 1 ? this . visibleItems . slice ( 0 , this . focusedItemInfo . index ) . findIndex ( function ( processedItem ) {
return _this13 . isItemMatched ( processedItem ) ;
} ) : itemIndex + this . focusedItemInfo . index ;
} else {
itemIndex = this . visibleItems . findIndex ( function ( processedItem ) {
return _this13 . isItemMatched ( processedItem ) ;
} ) ;
}
if ( itemIndex !== - 1 ) {
matched = true ;
}
if ( itemIndex === - 1 && this . focusedItemInfo . index === - 1 ) {
itemIndex = this . findFirstFocusedItemIndex ( ) ;
}
if ( itemIndex !== - 1 ) {
this . changeFocusedItemIndex ( event , itemIndex ) ;
}
if ( this . searchTimeout ) {
clearTimeout ( this . searchTimeout ) ;
}
this . searchTimeout = setTimeout ( function ( ) {
_this13 . searchValue = "" ;
_this13 . searchTimeout = null ;
} , 500 ) ;
return matched ;
} , "searchItems" ) ,
changeFocusedItemIndex : /* @__PURE__ */ _ _name ( function changeFocusedItemIndex ( event , index ) {
if ( this . focusedItemInfo . index !== index ) {
this . focusedItemInfo . index = index ;
this . scrollInView ( ) ;
}
} , "changeFocusedItemIndex" ) ,
2024-10-29 18:14:06 +00:00
scrollInView : /* @__PURE__ */ _ _name ( function scrollInView3 ( ) {
2024-10-28 18:29:38 +00:00
var index = arguments . length > 0 && arguments [ 0 ] !== void 0 ? arguments [ 0 ] : - 1 ;
2024-10-29 18:14:06 +00:00
var id2 = index !== - 1 ? "" . concat ( this . id , "_" ) . concat ( index ) : this . focusedItemId ;
var element = findSingle ( this . menubar , 'li[id="' . concat ( id2 , '"]' ) ) ;
2024-10-28 18:29:38 +00:00
if ( element ) {
element . scrollIntoView && element . scrollIntoView ( {
block : "nearest" ,
inline : "start"
} ) ;
}
} , "scrollInView" ) ,
createProcessedItems : /* @__PURE__ */ _ _name ( function createProcessedItems ( items ) {
var _this14 = this ;
var level = arguments . length > 1 && arguments [ 1 ] !== void 0 ? arguments [ 1 ] : 0 ;
var parent = arguments . length > 2 && arguments [ 2 ] !== void 0 ? arguments [ 2 ] : { } ;
var parentKey = arguments . length > 3 && arguments [ 3 ] !== void 0 ? arguments [ 3 ] : "" ;
var processedItems3 = [ ] ;
items && items . forEach ( function ( item3 , index ) {
var key = ( parentKey !== "" ? parentKey + "_" : "" ) + index ;
var newItem = {
item : item3 ,
index ,
level ,
key ,
parent ,
parentKey
} ;
newItem [ "items" ] = _this14 . createProcessedItems ( item3 . items , level + 1 , newItem , key ) ;
processedItems3 . push ( newItem ) ;
} ) ;
return processedItems3 ;
} , "createProcessedItems" ) ,
containerRef : /* @__PURE__ */ _ _name ( function containerRef ( el ) {
this . container = el ;
} , "containerRef" ) ,
menubarRef : /* @__PURE__ */ _ _name ( function menubarRef ( el ) {
this . menubar = el ? el . $el : void 0 ;
} , "menubarRef" )
} ,
computed : {
processedItems : /* @__PURE__ */ _ _name ( function processedItems ( ) {
return this . createProcessedItems ( this . model || [ ] ) ;
} , "processedItems" ) ,
visibleItems : /* @__PURE__ */ _ _name ( function visibleItems ( ) {
var _this15 = this ;
var processedItem = this . activeItemPath . find ( function ( p ) {
return p . key === _this15 . focusedItemInfo . parentKey ;
} ) ;
return processedItem ? processedItem . items : this . processedItems ;
} , "visibleItems" ) ,
focusedItemId : /* @__PURE__ */ _ _name ( function focusedItemId ( ) {
return this . focusedItemInfo . index !== - 1 ? "" . concat ( this . id ) . concat ( isNotEmpty ( this . focusedItemInfo . parentKey ) ? "_" + this . focusedItemInfo . parentKey : "" , "_" ) . concat ( this . focusedItemInfo . index ) : null ;
} , "focusedItemId" )
} ,
components : {
MenubarSub : script$1$3 ,
2024-10-29 18:14:06 +00:00
BarsIcon : script$A
2024-10-28 18:29:38 +00:00
}
} ;
function _typeof ( o ) {
"@babel/helpers - typeof" ;
return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol . iterator ? function ( o2 ) {
return typeof o2 ;
} : function ( o2 ) {
return o2 && "function" == typeof Symbol && o2 . constructor === Symbol && o2 !== Symbol . prototype ? "symbol" : typeof o2 ;
} , _typeof ( o ) ;
}
_ _name ( _typeof , "_typeof" ) ;
function ownKeys ( e , r ) {
var t = Object . keys ( e ) ;
if ( Object . getOwnPropertySymbols ) {
var o = Object . getOwnPropertySymbols ( e ) ;
r && ( o = o . filter ( function ( r2 ) {
return Object . getOwnPropertyDescriptor ( e , r2 ) . enumerable ;
} ) ) , t . push . apply ( t , o ) ;
}
return t ;
}
_ _name ( ownKeys , "ownKeys" ) ;
function _objectSpread ( e ) {
for ( var r = 1 ; r < arguments . length ; r ++ ) {
var t = null != arguments [ r ] ? arguments [ r ] : { } ;
r % 2 ? ownKeys ( Object ( t ) , true ) . forEach ( function ( r2 ) {
_defineProperty ( e , r2 , t [ r2 ] ) ;
} ) : Object . getOwnPropertyDescriptors ? Object . defineProperties ( e , Object . getOwnPropertyDescriptors ( t ) ) : ownKeys ( Object ( t ) ) . forEach ( function ( r2 ) {
Object . defineProperty ( e , r2 , Object . getOwnPropertyDescriptor ( t , r2 ) ) ;
} ) ;
}
return e ;
}
_ _name ( _objectSpread , "_objectSpread" ) ;
function _defineProperty ( e , r , t ) {
return ( r = _toPropertyKey ( r ) ) in e ? Object . defineProperty ( e , r , { value : t , enumerable : true , configurable : true , writable : true } ) : e [ r ] = t , e ;
}
_ _name ( _defineProperty , "_defineProperty" ) ;
function _toPropertyKey ( t ) {
var i = _toPrimitive ( t , "string" ) ;
return "symbol" == _typeof ( i ) ? i : i + "" ;
}
_ _name ( _toPropertyKey , "_toPropertyKey" ) ;
function _toPrimitive ( t , r ) {
if ( "object" != _typeof ( t ) || ! t ) return t ;
var e = t [ Symbol . toPrimitive ] ;
if ( void 0 !== e ) {
var i = e . call ( t , r || "default" ) ;
if ( "object" != _typeof ( i ) ) return i ;
throw new TypeError ( "@@toPrimitive must return a primitive value." ) ;
}
return ( "string" === r ? String : Number ) ( t ) ;
}
_ _name ( _toPrimitive , "_toPrimitive" ) ;
2024-11-16 01:17:15 +00:00
var _hoisted _1$c = [ "aria-haspopup" , "aria-expanded" , "aria-controls" , "aria-label" ] ;
function render$9 ( _ctx , _cache , $props , $setup , $data , $options ) {
2024-10-28 18:29:38 +00:00
var _component _BarsIcon = resolveComponent ( "BarsIcon" ) ;
var _component _MenubarSub = resolveComponent ( "MenubarSub" ) ;
return openBlock ( ) , createElementBlock ( "div" , mergeProps ( {
ref : $options . containerRef ,
"class" : _ctx . cx ( "root" )
} , _ctx . ptmi ( "root" ) ) , [ _ctx . $slots . start ? ( openBlock ( ) , createElementBlock ( "div" , mergeProps ( {
key : 0 ,
"class" : _ctx . cx ( "start" )
} , _ctx . ptm ( "start" ) ) , [ renderSlot ( _ctx . $slots , "start" ) ] , 16 ) ) : createCommentVNode ( "" , true ) , renderSlot ( _ctx . $slots , _ctx . $slots . button ? "button" : "menubutton" , {
id : $data . id ,
"class" : normalizeClass ( _ctx . cx ( "button" ) ) ,
toggleCallback : /* @__PURE__ */ _ _name ( function toggleCallback ( event ) {
return $options . menuButtonClick ( event ) ;
} , "toggleCallback" )
} , function ( ) {
var _ctx$$primevue$config ;
return [ _ctx . model && _ctx . model . length > 0 ? ( openBlock ( ) , createElementBlock ( "a" , mergeProps ( {
key : 0 ,
ref : "menubutton" ,
role : "button" ,
tabindex : "0" ,
"class" : _ctx . cx ( "button" ) ,
"aria-haspopup" : _ctx . model . length && _ctx . model . length > 0 ? true : false ,
"aria-expanded" : $data . mobileActive ,
"aria-controls" : $data . id ,
"aria-label" : ( _ctx$$primevue$config = _ctx . $primevue . config . locale . aria ) === null || _ctx$$primevue$config === void 0 ? void 0 : _ctx$$primevue$config . navigation ,
onClick : _cache [ 0 ] || ( _cache [ 0 ] = function ( $event ) {
return $options . menuButtonClick ( $event ) ;
} ) ,
onKeydown : _cache [ 1 ] || ( _cache [ 1 ] = function ( $event ) {
return $options . menuButtonKeydown ( $event ) ;
} )
} , _objectSpread ( _objectSpread ( { } , _ctx . buttonProps ) , _ctx . ptm ( "button" ) ) ) , [ renderSlot ( _ctx . $slots , _ctx . $slots . buttonicon ? "buttonicon" : "menubuttonicon" , { } , function ( ) {
return [ createVNode ( _component _BarsIcon , normalizeProps ( guardReactiveProps ( _ctx . ptm ( "buttonicon" ) ) ) , null , 16 ) ] ;
2024-11-16 01:17:15 +00:00
} ) ] , 16 , _hoisted _1$c ) ) : createCommentVNode ( "" , true ) ] ;
2024-10-28 18:29:38 +00:00
} ) , createVNode ( _component _MenubarSub , {
ref : $options . menubarRef ,
id : $data . id + "_list" ,
role : "menubar" ,
items : $options . processedItems ,
templates : _ctx . $slots ,
root : true ,
mobileActive : $data . mobileActive ,
tabindex : "0" ,
"aria-activedescendant" : $data . focused ? $options . focusedItemId : void 0 ,
menuId : $data . id ,
focusedItemId : $data . focused ? $options . focusedItemId : void 0 ,
activeItemPath : $data . activeItemPath ,
level : 0 ,
"aria-labelledby" : _ctx . ariaLabelledby ,
"aria-label" : _ctx . ariaLabel ,
pt : _ctx . pt ,
unstyled : _ctx . unstyled ,
onFocus : $options . onFocus ,
onBlur : $options . onBlur ,
onKeydown : $options . onKeyDown ,
onItemClick : $options . onItemClick ,
onItemMouseenter : $options . onItemMouseEnter ,
onItemMousemove : $options . onItemMouseMove
} , null , 8 , [ "id" , "items" , "templates" , "mobileActive" , "aria-activedescendant" , "menuId" , "focusedItemId" , "activeItemPath" , "aria-labelledby" , "aria-label" , "pt" , "unstyled" , "onFocus" , "onBlur" , "onKeydown" , "onItemClick" , "onItemMouseenter" , "onItemMousemove" ] ) , _ctx . $slots . end ? ( openBlock ( ) , createElementBlock ( "div" , mergeProps ( {
key : 1 ,
"class" : _ctx . cx ( "end" )
} , _ctx . ptm ( "end" ) ) , [ renderSlot ( _ctx . $slots , "end" ) ] , 16 ) ) : createCommentVNode ( "" , true ) ] , 16 ) ;
}
2024-11-16 01:17:15 +00:00
_ _name ( render$9 , "render$9" ) ;
script$5 . render = render$9 ;
2024-10-28 18:29:38 +00:00
const _withScopeId$2 = /* @__PURE__ */ _ _name ( ( n ) => ( pushScopeId ( "data-v-9646ca0a" ) , n = n ( ) , popScopeId ( ) , n ) , "_withScopeId$2" ) ;
2024-11-16 01:17:15 +00:00
const _hoisted _1$b = [ "href" ] ;
const _hoisted _2$9 = { class : "p-menubar-item-label" } ;
const _hoisted _3$7 = {
2024-10-28 18:29:38 +00:00
key : 1 ,
class : "ml-auto border border-surface rounded text-muted text-xs p-1 keybinding-tag"
} ;
2024-10-29 18:14:06 +00:00
const _sfc _main$6 = /* @__PURE__ */ defineComponent ( {
2024-10-28 18:29:38 +00:00
_ _name : "CommandMenubar" ,
setup ( _ _props ) {
const settingStore = useSettingStore ( ) ;
const dropdownDirection = computed (
( ) => settingStore . get ( "Comfy.UseNewMenu" ) === "Top" ? "down" : "up"
) ;
const menuItemsStore = useMenuItemStore ( ) ;
const items = menuItemsStore . menuItems ;
return ( _ctx , _cache ) => {
return openBlock ( ) , createBlock ( unref ( script$5 ) , {
model : unref ( items ) ,
class : "top-menubar border-none p-0 bg-transparent" ,
pt : {
rootList : "gap-0 flex-nowrap w-auto" ,
submenu : ` dropdown-direction- ${ dropdownDirection . value } ` ,
item : "relative"
}
} , {
item : withCtx ( ( { item : item3 , props } ) => [
createBaseVNode ( "a" , mergeProps ( { class : "p-menubar-item-link" } , props . action , {
href : item3 . url ,
target : "_blank"
} ) , [
item3 . icon ? ( openBlock ( ) , createElementBlock ( "span" , {
key : 0 ,
class : normalizeClass ( [ "p-menubar-item-icon" , item3 . icon ] )
} , null , 2 ) ) : createCommentVNode ( "" , true ) ,
2024-11-16 01:17:15 +00:00
createBaseVNode ( "span" , _hoisted _2$9 , toDisplayString ( item3 . label ) , 1 ) ,
item3 ? . comfyCommand ? . keybinding ? ( openBlock ( ) , createElementBlock ( "span" , _hoisted _3$7 , toDisplayString ( item3 . comfyCommand . keybinding . combo . toString ( ) ) , 1 ) ) : createCommentVNode ( "" , true )
] , 16 , _hoisted _1$b )
2024-10-28 18:29:38 +00:00
] ) ,
_ : 1
} , 8 , [ "model" , "pt" ] ) ;
} ;
}
} ) ;
2024-10-29 18:14:06 +00:00
const CommandMenubar = /* @__PURE__ */ _export _sfc ( _sfc _main$6 , [ [ "__scopeId" , "data-v-9646ca0a" ] ] ) ;
2024-10-28 18:29:38 +00:00
var theme$2 = /* @__PURE__ */ _ _name ( function theme7 ( _ref ) {
var dt = _ref . dt ;
return "\n.p-panel {\n border: 1px solid " . concat ( dt ( "panel.border.color" ) , ";\n border-radius: " ) . concat ( dt ( "panel.border.radius" ) , ";\n background: " ) . concat ( dt ( "panel.background" ) , ";\n color: " ) . concat ( dt ( "panel.color" ) , ";\n}\n\n.p-panel-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: " ) . concat ( dt ( "panel.header.padding" ) , ";\n background: " ) . concat ( dt ( "panel.header.background" ) , ";\n color: " ) . concat ( dt ( "panel.header.color" ) , ";\n border-style: solid;\n border-width: " ) . concat ( dt ( "panel.header.border.width" ) , ";\n border-color: " ) . concat ( dt ( "panel.header.border.color" ) , ";\n border-radius: " ) . concat ( dt ( "panel.header.border.radius" ) , ";\n}\n\n.p-panel-toggleable .p-panel-header {\n padding: " ) . concat ( dt ( "panel.toggleable.header.padding" ) , ";\n}\n\n.p-panel-title {\n line-height: 1;\n font-weight: " ) . concat ( dt ( "panel.title.font.weight" ) , ";\n}\n\n.p-panel-content {\n padding: " ) . concat ( dt ( "panel.content.padding" ) , ";\n}\n\n.p-panel-footer {\n padding: " ) . concat ( dt ( "panel.footer.padding" ) , ";\n}\n" ) ;
} , "theme" ) ;
var classes$2 = {
2024-10-29 18:14:06 +00:00
root : /* @__PURE__ */ _ _name ( function root9 ( _ref2 ) {
2024-10-28 18:29:38 +00:00
var props = _ref2 . props ;
return [ "p-panel p-component" , {
"p-panel-toggleable" : props . toggleable
} ] ;
} , "root" ) ,
header : "p-panel-header" ,
title : "p-panel-title" ,
headerActions : "p-panel-header-actions" ,
pcToggleButton : "p-panel-toggle-button" ,
contentContainer : "p-panel-content-container" ,
content : "p-panel-content" ,
footer : "p-panel-footer"
} ;
var PanelStyle = BaseStyle . extend ( {
name : "panel" ,
theme : theme$2 ,
classes : classes$2
} ) ;
var script$1$2 = {
name : "BasePanel" ,
2024-10-29 18:14:06 +00:00
"extends" : script$g ,
2024-10-28 18:29:38 +00:00
props : {
header : String ,
toggleable : Boolean ,
collapsed : Boolean ,
toggleButtonProps : {
type : Object ,
"default" : /* @__PURE__ */ _ _name ( function _default ( ) {
return {
severity : "secondary" ,
text : true ,
rounded : true
} ;
} , "_default" )
}
} ,
style : PanelStyle ,
2024-10-29 18:14:06 +00:00
provide : /* @__PURE__ */ _ _name ( function provide11 ( ) {
2024-10-28 18:29:38 +00:00
return {
$pcPanel : this ,
$parentInstance : this
} ;
} , "provide" )
} ;
var script$4 = {
name : "Panel" ,
"extends" : script$1$2 ,
inheritAttrs : false ,
emits : [ "update:collapsed" , "toggle" ] ,
2024-10-29 18:14:06 +00:00
data : /* @__PURE__ */ _ _name ( function data7 ( ) {
2024-10-28 18:29:38 +00:00
return {
id : this . $attrs . id ,
d _collapsed : this . collapsed
} ;
} , "data" ) ,
watch : {
"$attrs.id" : /* @__PURE__ */ _ _name ( function $attrsId3 ( newValue ) {
this . id = newValue || UniqueComponentId ( ) ;
} , "$attrsId" ) ,
collapsed : /* @__PURE__ */ _ _name ( function collapsed ( newValue ) {
this . d _collapsed = newValue ;
} , "collapsed" )
} ,
2024-10-29 18:14:06 +00:00
mounted : /* @__PURE__ */ _ _name ( function mounted7 ( ) {
2024-10-28 18:29:38 +00:00
this . id = this . id || UniqueComponentId ( ) ;
} , "mounted" ) ,
methods : {
toggle : /* @__PURE__ */ _ _name ( function toggle2 ( event ) {
this . d _collapsed = ! this . d _collapsed ;
this . $emit ( "update:collapsed" , this . d _collapsed ) ;
this . $emit ( "toggle" , {
originalEvent : event ,
value : this . d _collapsed
} ) ;
} , "toggle" ) ,
onKeyDown : /* @__PURE__ */ _ _name ( function onKeyDown3 ( event ) {
if ( event . code === "Enter" || event . code === "NumpadEnter" || event . code === "Space" ) {
this . toggle ( event ) ;
event . preventDefault ( ) ;
}
} , "onKeyDown" )
} ,
computed : {
buttonAriaLabel : /* @__PURE__ */ _ _name ( function buttonAriaLabel ( ) {
return this . toggleButtonProps && this . toggleButtonProps . ariaLabel ? this . toggleButtonProps . ariaLabel : this . header ;
} , "buttonAriaLabel" )
} ,
components : {
2024-10-29 18:14:06 +00:00
PlusIcon : script$B ,
MinusIcon : script$C ,
Button : script$f
2024-10-28 18:29:38 +00:00
} ,
directives : {
ripple : Ripple
}
} ;
2024-11-16 01:17:15 +00:00
var _hoisted _1$a = [ "id" ] ;
var _hoisted _2$8 = [ "id" , "aria-labelledby" ] ;
function render$8 ( _ctx , _cache , $props , $setup , $data , $options ) {
2024-10-28 18:29:38 +00:00
var _component _Button = resolveComponent ( "Button" ) ;
return openBlock ( ) , createElementBlock ( "div" , mergeProps ( {
"class" : _ctx . cx ( "root" )
} , _ctx . ptmi ( "root" ) ) , [ createBaseVNode ( "div" , mergeProps ( {
"class" : _ctx . cx ( "header" )
} , _ctx . ptm ( "header" ) ) , [ renderSlot ( _ctx . $slots , "header" , {
id : $data . id + "_header" ,
"class" : normalizeClass ( _ctx . cx ( "title" ) )
} , function ( ) {
return [ _ctx . header ? ( openBlock ( ) , createElementBlock ( "span" , mergeProps ( {
key : 0 ,
id : $data . id + "_header" ,
"class" : _ctx . cx ( "title" )
2024-11-16 01:17:15 +00:00
} , _ctx . ptm ( "title" ) ) , toDisplayString ( _ctx . header ) , 17 , _hoisted _1$a ) ) : createCommentVNode ( "" , true ) ] ;
2024-10-28 18:29:38 +00:00
} ) , createBaseVNode ( "div" , mergeProps ( {
"class" : _ctx . cx ( "headerActions" )
} , _ctx . ptm ( "headerActions" ) ) , [ renderSlot ( _ctx . $slots , "icons" ) , _ctx . toggleable ? ( openBlock ( ) , createBlock ( _component _Button , mergeProps ( {
key : 0 ,
id : $data . id + "_header" ,
"class" : _ctx . cx ( "pcToggleButton" ) ,
"aria-label" : $options . buttonAriaLabel ,
"aria-controls" : $data . id + "_content" ,
"aria-expanded" : ! $data . d _collapsed ,
unstyled : _ctx . unstyled ,
onClick : $options . toggle ,
onKeydown : $options . onKeyDown
} , _ctx . toggleButtonProps , {
pt : _ctx . ptm ( "pcToggleButton" )
} ) , {
icon : withCtx ( function ( slotProps ) {
return [ renderSlot ( _ctx . $slots , _ctx . $slots . toggleicon ? "toggleicon" : "togglericon" , {
collapsed : $data . d _collapsed
} , function ( ) {
return [ ( openBlock ( ) , createBlock ( resolveDynamicComponent ( $data . d _collapsed ? "PlusIcon" : "MinusIcon" ) , mergeProps ( {
"class" : slotProps [ "class" ]
} , _ctx . ptm ( "pcToggleButton" ) [ "icon" ] ) , null , 16 , [ "class" ] ) ) ] ;
} ) ] ;
} ) ,
_ : 3
} , 16 , [ "id" , "class" , "aria-label" , "aria-controls" , "aria-expanded" , "unstyled" , "onClick" , "onKeydown" , "pt" ] ) ) : createCommentVNode ( "" , true ) ] , 16 ) ] , 16 ) , createVNode ( Transition , mergeProps ( {
name : "p-toggleable-content"
} , _ctx . ptm ( "transition" ) ) , {
"default" : withCtx ( function ( ) {
return [ withDirectives ( createBaseVNode ( "div" , mergeProps ( {
id : $data . id + "_content" ,
"class" : _ctx . cx ( "contentContainer" ) ,
role : "region" ,
"aria-labelledby" : $data . id + "_header"
} , _ctx . ptm ( "contentContainer" ) ) , [ createBaseVNode ( "div" , mergeProps ( {
"class" : _ctx . cx ( "content" )
} , _ctx . ptm ( "content" ) ) , [ renderSlot ( _ctx . $slots , "default" ) ] , 16 ) , _ctx . $slots . footer ? ( openBlock ( ) , createElementBlock ( "div" , mergeProps ( {
key : 0 ,
"class" : _ctx . cx ( "footer" )
2024-11-16 01:17:15 +00:00
} , _ctx . ptm ( "footer" ) ) , [ renderSlot ( _ctx . $slots , "footer" ) ] , 16 ) ) : createCommentVNode ( "" , true ) ] , 16 , _hoisted _2$8 ) , [ [ vShow , ! $data . d _collapsed ] ] ) ] ;
2024-10-28 18:29:38 +00:00
} ) ,
_ : 3
} , 16 ) ] , 16 ) ;
}
2024-11-16 01:17:15 +00:00
_ _name ( render$8 , "render$8" ) ;
script$4 . render = render$8 ;
const _hoisted _1$9 = {
viewBox : "0 0 24 24" ,
width : "1.2em" ,
height : "1.2em"
} ;
const _hoisted _2$7 = /* @__PURE__ */ createBaseVNode ( "path" , {
fill : "none" ,
stroke : "currentColor" ,
"stroke-linecap" : "round" ,
"stroke-linejoin" : "round" ,
"stroke-width" : "2" ,
d : "M6 4v16m4-16l10 8l-10 8z"
} , null , - 1 ) ;
const _hoisted _3$6 = [
_hoisted _2$7
] ;
function render$7 ( _ctx , _cache ) {
return openBlock ( ) , createElementBlock ( "svg" , _hoisted _1$9 , [ ... _hoisted _3$6 ] ) ;
}
_ _name ( render$7 , "render$7" ) ;
const _ _unplugin _components _3 = markRaw ( { name : "lucide-step-forward" , render : render$7 } ) ;
const _hoisted _1$8 = {
viewBox : "0 0 24 24" ,
width : "1.2em" ,
height : "1.2em"
} ;
const _hoisted _2$6 = /* @__PURE__ */ createBaseVNode ( "path" , {
fill : "none" ,
stroke : "currentColor" ,
"stroke-linecap" : "round" ,
"stroke-linejoin" : "round" ,
"stroke-width" : "2" ,
d : "m13 19l9-7l-9-7zM2 19l9-7l-9-7z"
} , null , - 1 ) ;
const _hoisted _3$5 = [
_hoisted _2$6
] ;
function render$6 ( _ctx , _cache ) {
return openBlock ( ) , createElementBlock ( "svg" , _hoisted _1$8 , [ ... _hoisted _3$5 ] ) ;
}
_ _name ( render$6 , "render$6" ) ;
const _ _unplugin _components _2 = markRaw ( { name : "lucide-fast-forward" , render : render$6 } ) ;
const _hoisted _1$7 = {
viewBox : "0 0 24 24" ,
width : "1.2em" ,
height : "1.2em"
} ;
const _hoisted _2$5 = /* @__PURE__ */ createBaseVNode ( "path" , {
fill : "none" ,
stroke : "currentColor" ,
"stroke-linecap" : "round" ,
"stroke-linejoin" : "round" ,
"stroke-width" : "2" ,
d : "m6 3l14 9l-14 9z"
} , null , - 1 ) ;
const _hoisted _3$4 = [
_hoisted _2$5
] ;
function render$5 ( _ctx , _cache ) {
return openBlock ( ) , createElementBlock ( "svg" , _hoisted _1$7 , [ ... _hoisted _3$4 ] ) ;
}
2024-10-29 18:14:06 +00:00
_ _name ( render$5 , "render$5" ) ;
2024-11-16 01:17:15 +00:00
const _ _unplugin _components _1$1 = markRaw ( { name : "lucide-play" , render : render$5 } ) ;
2024-10-29 18:14:06 +00:00
const _hoisted _1$6 = {
2024-10-28 18:29:38 +00:00
viewBox : "0 0 24 24" ,
width : "1.2em" ,
height : "1.2em"
} ;
2024-10-29 18:14:06 +00:00
const _hoisted _2$4 = /* @__PURE__ */ createBaseVNode ( "g" , {
2024-10-28 18:29:38 +00:00
fill : "none" ,
stroke : "currentColor" ,
"stroke-linecap" : "round" ,
"stroke-linejoin" : "round" ,
"stroke-width" : "2"
} , [
/* @__PURE__ */ createBaseVNode ( "path" , { d : "M16 12H3m13 6H3m7-12H3m18 12V8a2 2 0 0 0-2-2h-5" } ) ,
/* @__PURE__ */ createBaseVNode ( "path" , { d : "m16 8l-2-2l2-2" } )
] , - 1 ) ;
2024-10-29 18:14:06 +00:00
const _hoisted _3$3 = [
_hoisted _2$4
2024-10-28 18:29:38 +00:00
] ;
2024-10-29 18:14:06 +00:00
function render$4 ( _ctx , _cache ) {
return openBlock ( ) , createElementBlock ( "svg" , _hoisted _1$6 , [ ... _hoisted _3$3 ] ) ;
2024-10-28 18:29:38 +00:00
}
2024-10-29 18:14:06 +00:00
_ _name ( render$4 , "render$4" ) ;
const _ _unplugin _components _0$1 = markRaw ( { name : "lucide-list-start" , render : render$4 } ) ;
2024-10-28 18:29:38 +00:00
var theme$1 = /* @__PURE__ */ _ _name ( function theme8 ( _ref ) {
var dt = _ref . dt ;
return "\n.p-tieredmenu {\n background: " . concat ( dt ( "tieredmenu.background" ) , ";\n color: " ) . concat ( dt ( "tieredmenu.color" ) , ";\n border: 1px solid " ) . concat ( dt ( "tieredmenu.border.color" ) , ";\n border-radius: " ) . concat ( dt ( "tieredmenu.border.radius" ) , ";\n min-width: 12.5rem;\n}\n\n.p-tieredmenu-root-list,\n.p-tieredmenu-submenu {\n margin: 0;\n padding: " ) . concat ( dt ( "tieredmenu.list.padding" ) , ";\n list-style: none;\n outline: 0 none;\n display: flex;\n flex-direction: column;\n gap: " ) . concat ( dt ( "tieredmenu.list.gap" ) , ";\n}\n\n.p-tieredmenu-submenu {\n position: absolute;\n min-width: 100%;\n z-index: 1;\n background: " ) . concat ( dt ( "tieredmenu.background" ) , ";\n color: " ) . concat ( dt ( "tieredmenu.color" ) , ";\n border: 1px solid " ) . concat ( dt ( "tieredmenu.border.color" ) , ";\n border-radius: " ) . concat ( dt ( "tieredmenu.border.radius" ) , ";\n box-shadow: " ) . concat ( dt ( "tieredmenu.shadow" ) , ";\n}\n\n.p-tieredmenu-item {\n position: relative;\n}\n\n.p-tieredmenu-item-content {\n transition: background " ) . concat ( dt ( "tieredmenu.transition.duration" ) , ", color " ) . concat ( dt ( "tieredmenu.transition.duration" ) , ";\n border-radius: " ) . concat ( dt ( "tieredmenu.item.border.radius" ) , ";\n color: " ) . concat ( dt ( "tieredmenu.item.color" ) , ";\n}\n\n.p-tieredmenu-item-link {\n cursor: pointer;\n display: flex;\n align-items: center;\n text-decoration: none;\n overflow: hidden;\n position: relative;\n color: inherit;\n padding: " ) . concat ( dt ( "tieredmenu.item.padding" ) , ";\n gap: " ) . concat ( dt ( "tieredmenu.item.gap" ) , ";\n user-select: none;\n outline: 0 none;\n}\n\n.p-tieredmenu-item-label {\n line-height: 1;\n}\n\n.p-tieredmenu-item-icon {\n color: " ) . concat ( dt ( "tieredmenu.item.icon.color" ) , ";\n}\n\n.p-tieredmenu-submenu-icon {\n color: " ) . concat ( dt ( "tieredmenu.submenu.icon.color" ) , ";\n margin-left: auto;\n font-size: " ) . concat ( dt ( "tieredmenu.submenu.icon.size" ) , ";\n width: " ) . concat ( dt ( "tieredmenu.submenu.icon.size" ) , ";\n height: " ) . concat ( dt ( "tieredmenu.submenu.icon.size" ) , ";\n}\n\n.p-tieredmenu-item.p-focus > .p-tieredmenu-item-content {\n color: " ) . concat ( dt ( "tieredmenu.item.focus.color" ) , ";\n background: " ) . concat ( dt ( "tieredmenu.item.focus.background" ) , ";\n}\n\n.p-tieredmenu-item.p-focus > .p-tieredmenu-item-content .p-tieredmenu-item-icon {\n color: " ) . concat ( dt ( "tieredmenu.item.icon.focus.color" ) , ";\n}\n\n.p-tieredmenu-item.p-focus > .p-tieredmenu-item-content .p-tieredmenu-submenu-icon {\n color: " ) . concat ( dt ( "tieredmenu.submenu.icon.focus.color" ) , ";\n}\n\n.p-tieredmenu-item:not(.p-disabled) > .p-tieredmenu-item-content:hover {\n color: " ) . concat ( dt ( "tieredmenu.item.focus.color" ) , ";\n background: " ) . concat ( dt ( "tieredmenu.item.focus.background" ) , ";\n}\n\n.p-tieredmenu-item:not(.p-disabled) > .p-tieredmenu-item-content:hover .p-tieredmenu-item-icon {\n color: " ) . concat ( dt ( "tieredmenu.item.icon.focus.color" ) , ";\n}\n\n.p-tieredmenu-item:not(.p-disabled) > .p-tieredmenu-item-content:hover .p-tieredmenu-submenu-icon {\n color: " ) . concat ( dt ( "tieredmenu.submenu.icon.focus.color" ) , ";\n}\n\n.p-tieredmenu-item-active > .p-tieredmenu-item-content {\n color: " ) . concat ( dt ( "tieredmenu.item.active.color" ) , ";\n background: " ) . concat ( dt ( "tieredmenu.item.active.background" ) , ";\n}\n\n.p-tieredmenu-item-active > .p-tieredmenu-item-content .p-tieredmenu-item-icon {\n color: " ) . concat ( dt ( "tieredmenu.item.icon.active.color" ) , ";\n}\n\n.p-tieredmenu-item-active > .p-tieredmenu-item-content .p-tieredmenu-submenu-icon {\n color: " ) . concat ( dt ( "tieredmenu.submenu.icon.active.color" ) , ";\n}\n\n.p-tieredmenu-separator {\n border-top: 1px solid " ) . concat ( dt ( "tieredmenu.separator.border.color" ) , ";\n}\n\n.p-tieredmenu-overlay {\n box-shadow: " ) . concat ( dt ( "tieredmenu.shadow" ) , ";\n}\n\n.p-tieredmenu-enter-from,\n.p-tieredmenu-leave-active {\n opacity: 0;\n}\n\n.p-tieredmenu-enter-active {\n transition: opacity 250ms;\n}\n" ) ;
} , "theme" ) ;
var inlineStyles = {
submenu : /* @__PURE__ */ _ _name ( function submenu2 ( _ref2 ) {
var instance = _ref2 . instance , processedItem = _ref2 . processedItem ;
return {
display : instance . isItemActive ( processedItem ) ? "flex" : "none"
} ;
} , "submenu" )
} ;
var classes$1 = {
2024-10-29 18:14:06 +00:00
root : /* @__PURE__ */ _ _name ( function root10 ( _ref3 ) {
2024-10-28 18:29:38 +00:00
_ref3 . instance ;
var props = _ref3 . props ;
return [ "p-tieredmenu p-component" , {
"p-tieredmenu-overlay" : props . popup
} ] ;
} , "root" ) ,
start : "p-tieredmenu-start" ,
rootList : "p-tieredmenu-root-list" ,
item : /* @__PURE__ */ _ _name ( function item2 ( _ref4 ) {
var instance = _ref4 . instance , processedItem = _ref4 . processedItem ;
return [ "p-tieredmenu-item" , {
"p-tieredmenu-item-active" : instance . isItemActive ( processedItem ) ,
"p-focus" : instance . isItemFocused ( processedItem ) ,
"p-disabled" : instance . isItemDisabled ( processedItem )
} ] ;
} , "item" ) ,
itemContent : "p-tieredmenu-item-content" ,
itemLink : "p-tieredmenu-item-link" ,
itemIcon : "p-tieredmenu-item-icon" ,
itemLabel : "p-tieredmenu-item-label" ,
submenuIcon : "p-tieredmenu-submenu-icon" ,
submenu : "p-tieredmenu-submenu" ,
separator : "p-tieredmenu-separator" ,
end : "p-tieredmenu-end"
} ;
var TieredMenuStyle = BaseStyle . extend ( {
name : "tieredmenu" ,
theme : theme$1 ,
classes : classes$1 ,
inlineStyles
} ) ;
var script$2 = {
name : "BaseTieredMenu" ,
2024-10-29 18:14:06 +00:00
"extends" : script$g ,
2024-10-28 18:29:38 +00:00
props : {
popup : {
type : Boolean ,
"default" : false
} ,
model : {
type : Array ,
"default" : null
} ,
appendTo : {
type : [ String , Object ] ,
"default" : "body"
} ,
autoZIndex : {
type : Boolean ,
"default" : true
} ,
baseZIndex : {
type : Number ,
"default" : 0
} ,
disabled : {
type : Boolean ,
"default" : false
} ,
tabindex : {
type : Number ,
"default" : 0
} ,
ariaLabelledby : {
type : String ,
"default" : null
} ,
ariaLabel : {
type : String ,
"default" : null
}
} ,
style : TieredMenuStyle ,
2024-10-29 18:14:06 +00:00
provide : /* @__PURE__ */ _ _name ( function provide12 ( ) {
2024-10-28 18:29:38 +00:00
return {
$pcTieredMenu : this ,
$parentInstance : this
} ;
} , "provide" )
} ;
var script$1$1 = {
name : "TieredMenuSub" ,
hostName : "TieredMenu" ,
2024-10-29 18:14:06 +00:00
"extends" : script$g ,
2024-10-28 18:29:38 +00:00
emits : [ "item-click" , "item-mouseenter" , "item-mousemove" ] ,
container : null ,
props : {
menuId : {
type : String ,
"default" : null
} ,
focusedItemId : {
type : String ,
"default" : null
} ,
items : {
type : Array ,
"default" : null
} ,
visible : {
type : Boolean ,
"default" : false
} ,
level : {
type : Number ,
"default" : 0
} ,
templates : {
type : Object ,
"default" : null
} ,
activeItemPath : {
type : Object ,
"default" : null
} ,
tabindex : {
type : Number ,
"default" : 0
}
} ,
methods : {
getItemId : /* @__PURE__ */ _ _name ( function getItemId2 ( processedItem ) {
return "" . concat ( this . menuId , "_" ) . concat ( processedItem . key ) ;
} , "getItemId" ) ,
getItemKey : /* @__PURE__ */ _ _name ( function getItemKey2 ( processedItem ) {
return this . getItemId ( processedItem ) ;
} , "getItemKey" ) ,
getItemProp : /* @__PURE__ */ _ _name ( function getItemProp3 ( processedItem , name , params ) {
return processedItem && processedItem . item ? resolve ( processedItem . item [ name ] , params ) : void 0 ;
} , "getItemProp" ) ,
getItemLabel : /* @__PURE__ */ _ _name ( function getItemLabel3 ( processedItem ) {
return this . getItemProp ( processedItem , "label" ) ;
} , "getItemLabel" ) ,
getItemLabelId : /* @__PURE__ */ _ _name ( function getItemLabelId2 ( processedItem ) {
return "" . concat ( this . menuId , "_" ) . concat ( processedItem . key , "_label" ) ;
} , "getItemLabelId" ) ,
getPTOptions : /* @__PURE__ */ _ _name ( function getPTOptions5 ( processedItem , index , key ) {
return this . ptm ( key , {
context : {
item : processedItem . item ,
index ,
active : this . isItemActive ( processedItem ) ,
focused : this . isItemFocused ( processedItem ) ,
disabled : this . isItemDisabled ( processedItem )
}
} ) ;
} , "getPTOptions" ) ,
isItemActive : /* @__PURE__ */ _ _name ( function isItemActive2 ( processedItem ) {
return this . activeItemPath . some ( function ( path ) {
return path . key === processedItem . key ;
} ) ;
} , "isItemActive" ) ,
isItemVisible : /* @__PURE__ */ _ _name ( function isItemVisible3 ( processedItem ) {
return this . getItemProp ( processedItem , "visible" ) !== false ;
} , "isItemVisible" ) ,
isItemDisabled : /* @__PURE__ */ _ _name ( function isItemDisabled3 ( processedItem ) {
return this . getItemProp ( processedItem , "disabled" ) ;
} , "isItemDisabled" ) ,
isItemFocused : /* @__PURE__ */ _ _name ( function isItemFocused2 ( processedItem ) {
return this . focusedItemId === this . getItemId ( processedItem ) ;
} , "isItemFocused" ) ,
isItemGroup : /* @__PURE__ */ _ _name ( function isItemGroup3 ( processedItem ) {
return isNotEmpty ( processedItem . items ) ;
} , "isItemGroup" ) ,
onEnter : /* @__PURE__ */ _ _name ( function onEnter2 ( ) {
nestedPosition ( this . container , this . level ) ;
} , "onEnter" ) ,
onItemClick : /* @__PURE__ */ _ _name ( function onItemClick3 ( event , processedItem ) {
this . getItemProp ( processedItem , "command" , {
originalEvent : event ,
item : processedItem . item
} ) ;
this . $emit ( "item-click" , {
originalEvent : event ,
processedItem ,
isFocus : true
} ) ;
} , "onItemClick" ) ,
onItemMouseEnter : /* @__PURE__ */ _ _name ( function onItemMouseEnter3 ( event , processedItem ) {
this . $emit ( "item-mouseenter" , {
originalEvent : event ,
processedItem
} ) ;
} , "onItemMouseEnter" ) ,
onItemMouseMove : /* @__PURE__ */ _ _name ( function onItemMouseMove3 ( event , processedItem ) {
this . $emit ( "item-mousemove" , {
originalEvent : event ,
processedItem
} ) ;
} , "onItemMouseMove" ) ,
getAriaSetSize : /* @__PURE__ */ _ _name ( function getAriaSetSize2 ( ) {
var _this = this ;
return this . items . filter ( function ( processedItem ) {
return _this . isItemVisible ( processedItem ) && ! _this . getItemProp ( processedItem , "separator" ) ;
} ) . length ;
} , "getAriaSetSize" ) ,
getAriaPosInset : /* @__PURE__ */ _ _name ( function getAriaPosInset3 ( index ) {
var _this2 = this ;
return index - this . items . slice ( 0 , index ) . filter ( function ( processedItem ) {
return _this2 . isItemVisible ( processedItem ) && _this2 . getItemProp ( processedItem , "separator" ) ;
} ) . length + 1 ;
} , "getAriaPosInset" ) ,
getMenuItemProps : /* @__PURE__ */ _ _name ( function getMenuItemProps2 ( processedItem , index ) {
return {
action : mergeProps ( {
"class" : this . cx ( "itemLink" ) ,
tabindex : - 1 ,
"aria-hidden" : true
} , this . getPTOptions ( processedItem , index , "itemLink" ) ) ,
icon : mergeProps ( {
"class" : [ this . cx ( "itemIcon" ) , this . getItemProp ( processedItem , "icon" ) ]
} , this . getPTOptions ( processedItem , index , "itemIcon" ) ) ,
label : mergeProps ( {
"class" : this . cx ( "itemLabel" )
} , this . getPTOptions ( processedItem , index , "itemLabel" ) ) ,
submenuicon : mergeProps ( {
"class" : this . cx ( "submenuIcon" )
} , this . getPTOptions ( processedItem , index , "submenuIcon" ) )
} ;
} , "getMenuItemProps" ) ,
containerRef : /* @__PURE__ */ _ _name ( function containerRef2 ( el ) {
this . container = el ;
} , "containerRef" )
} ,
components : {
2024-10-29 18:14:06 +00:00
AngleRightIcon : script$y
2024-10-28 18:29:38 +00:00
} ,
directives : {
ripple : Ripple
}
} ;
var _hoisted _1$1$1 = [ "tabindex" ] ;
2024-10-29 18:14:06 +00:00
var _hoisted _2$3 = [ "id" , "aria-label" , "aria-disabled" , "aria-expanded" , "aria-haspopup" , "aria-level" , "aria-setsize" , "aria-posinset" , "data-p-active" , "data-p-focused" , "data-p-disabled" ] ;
var _hoisted _3$2 = [ "onClick" , "onMouseenter" , "onMousemove" ] ;
2024-10-28 18:29:38 +00:00
var _hoisted _4 = [ "href" , "target" ] ;
var _hoisted _5 = [ "id" ] ;
var _hoisted _6 = [ "id" ] ;
2024-10-29 18:14:06 +00:00
function render$1$1 ( _ctx , _cache , $props , $setup , $data , $options ) {
2024-10-28 18:29:38 +00:00
var _component _AngleRightIcon = resolveComponent ( "AngleRightIcon" ) ;
var _component _TieredMenuSub = resolveComponent ( "TieredMenuSub" , true ) ;
var _directive _ripple = resolveDirective ( "ripple" ) ;
return openBlock ( ) , createBlock ( Transition , mergeProps ( {
name : "p-tieredmenu" ,
onEnter : $options . onEnter
} , _ctx . ptm ( "menu.transition" ) ) , {
"default" : withCtx ( function ( ) {
return [ ( $props . level === 0 ? true : $props . visible ) ? ( openBlock ( ) , createElementBlock ( "ul" , mergeProps ( {
key : 0 ,
ref : $options . containerRef ,
"class" : $props . level === 0 ? _ctx . cx ( "rootList" ) : _ctx . cx ( "submenu" ) ,
tabindex : $props . tabindex
} , $props . level === 0 ? _ctx . ptm ( "rootList" ) : _ctx . ptm ( "submenu" ) ) , [ ( openBlock ( true ) , createElementBlock ( Fragment , null , renderList ( $props . items , function ( processedItem , index ) {
return openBlock ( ) , createElementBlock ( Fragment , {
key : $options . getItemKey ( processedItem )
} , [ $options . isItemVisible ( processedItem ) && ! $options . getItemProp ( processedItem , "separator" ) ? ( openBlock ( ) , createElementBlock ( "li" , mergeProps ( {
key : 0 ,
id : $options . getItemId ( processedItem ) ,
style : $options . getItemProp ( processedItem , "style" ) ,
"class" : [ _ctx . cx ( "item" , {
processedItem
} ) , $options . getItemProp ( processedItem , "class" ) ] ,
role : "menuitem" ,
"aria-label" : $options . getItemLabel ( processedItem ) ,
"aria-disabled" : $options . isItemDisabled ( processedItem ) || void 0 ,
"aria-expanded" : $options . isItemGroup ( processedItem ) ? $options . isItemActive ( processedItem ) : void 0 ,
"aria-haspopup" : $options . isItemGroup ( processedItem ) && ! $options . getItemProp ( processedItem , "to" ) ? "menu" : void 0 ,
"aria-level" : $props . level + 1 ,
"aria-setsize" : $options . getAriaSetSize ( ) ,
"aria-posinset" : $options . getAriaPosInset ( index ) ,
ref _for : true
} , $options . getPTOptions ( processedItem , index , "item" ) , {
"data-p-active" : $options . isItemActive ( processedItem ) ,
"data-p-focused" : $options . isItemFocused ( processedItem ) ,
"data-p-disabled" : $options . isItemDisabled ( processedItem )
} ) , [ createBaseVNode ( "div" , mergeProps ( {
"class" : _ctx . cx ( "itemContent" ) ,
2024-10-29 18:14:06 +00:00
onClick : /* @__PURE__ */ _ _name ( function onClick2 ( $event ) {
2024-10-28 18:29:38 +00:00
return $options . onItemClick ( $event , processedItem ) ;
} , "onClick" ) ,
onMouseenter : /* @__PURE__ */ _ _name ( function onMouseenter ( $event ) {
return $options . onItemMouseEnter ( $event , processedItem ) ;
} , "onMouseenter" ) ,
onMousemove : /* @__PURE__ */ _ _name ( function onMousemove ( $event ) {
return $options . onItemMouseMove ( $event , processedItem ) ;
} , "onMousemove" ) ,
ref _for : true
} , $options . getPTOptions ( processedItem , index , "itemContent" ) ) , [ ! $props . templates . item ? withDirectives ( ( openBlock ( ) , createElementBlock ( "a" , mergeProps ( {
key : 0 ,
href : $options . getItemProp ( processedItem , "url" ) ,
"class" : _ctx . cx ( "itemLink" ) ,
target : $options . getItemProp ( processedItem , "target" ) ,
tabindex : "-1" ,
ref _for : true
} , $options . getPTOptions ( processedItem , index , "itemLink" ) ) , [ $props . templates . itemicon ? ( openBlock ( ) , createBlock ( resolveDynamicComponent ( $props . templates . itemicon ) , {
key : 0 ,
item : processedItem . item ,
"class" : normalizeClass ( _ctx . cx ( "itemIcon" ) )
} , null , 8 , [ "item" , "class" ] ) ) : $options . getItemProp ( processedItem , "icon" ) ? ( openBlock ( ) , createElementBlock ( "span" , mergeProps ( {
key : 1 ,
"class" : [ _ctx . cx ( "itemIcon" ) , $options . getItemProp ( processedItem , "icon" ) ] ,
ref _for : true
} , $options . getPTOptions ( processedItem , index , "itemIcon" ) ) , null , 16 ) ) : createCommentVNode ( "" , true ) , createBaseVNode ( "span" , mergeProps ( {
id : $options . getItemLabelId ( processedItem ) ,
"class" : _ctx . cx ( "itemLabel" ) ,
ref _for : true
} , $options . getPTOptions ( processedItem , index , "itemLabel" ) ) , toDisplayString ( $options . getItemLabel ( processedItem ) ) , 17 , _hoisted _5 ) , $options . getItemProp ( processedItem , "items" ) ? ( openBlock ( ) , createElementBlock ( Fragment , {
key : 2
} , [ $props . templates . submenuicon ? ( openBlock ( ) , createBlock ( resolveDynamicComponent ( $props . templates . submenuicon ) , mergeProps ( {
key : 0 ,
"class" : _ctx . cx ( "submenuIcon" ) ,
active : $options . isItemActive ( processedItem ) ,
ref _for : true
} , $options . getPTOptions ( processedItem , index , "submenuIcon" ) ) , null , 16 , [ "class" , "active" ] ) ) : ( openBlock ( ) , createBlock ( _component _AngleRightIcon , mergeProps ( {
key : 1 ,
"class" : _ctx . cx ( "submenuIcon" ) ,
ref _for : true
} , $options . getPTOptions ( processedItem , index , "submenuIcon" ) ) , null , 16 , [ "class" ] ) ) ] , 64 ) ) : createCommentVNode ( "" , true ) ] , 16 , _hoisted _4 ) ) , [ [ _directive _ripple ] ] ) : ( openBlock ( ) , createBlock ( resolveDynamicComponent ( $props . templates . item ) , {
key : 1 ,
item : processedItem . item ,
hasSubmenu : $options . getItemProp ( processedItem , "items" ) ,
label : $options . getItemLabel ( processedItem ) ,
props : $options . getMenuItemProps ( processedItem , index )
2024-10-29 18:14:06 +00:00
} , null , 8 , [ "item" , "hasSubmenu" , "label" , "props" ] ) ) ] , 16 , _hoisted _3$2 ) , $options . isItemVisible ( processedItem ) && $options . isItemGroup ( processedItem ) ? ( openBlock ( ) , createBlock ( _component _TieredMenuSub , {
2024-10-28 18:29:38 +00:00
key : 0 ,
id : $options . getItemId ( processedItem ) + "_list" ,
style : normalizeStyle ( _ctx . sx ( "submenu" , true , {
processedItem
} ) ) ,
"aria-labelledby" : $options . getItemLabelId ( processedItem ) ,
role : "menu" ,
menuId : $props . menuId ,
focusedItemId : $props . focusedItemId ,
items : processedItem . items ,
templates : $props . templates ,
activeItemPath : $props . activeItemPath ,
level : $props . level + 1 ,
visible : $options . isItemActive ( processedItem ) && $options . isItemGroup ( processedItem ) ,
pt : _ctx . pt ,
unstyled : _ctx . unstyled ,
onItemClick : _cache [ 0 ] || ( _cache [ 0 ] = function ( $event ) {
return _ctx . $emit ( "item-click" , $event ) ;
} ) ,
onItemMouseenter : _cache [ 1 ] || ( _cache [ 1 ] = function ( $event ) {
return _ctx . $emit ( "item-mouseenter" , $event ) ;
} ) ,
onItemMousemove : _cache [ 2 ] || ( _cache [ 2 ] = function ( $event ) {
return _ctx . $emit ( "item-mousemove" , $event ) ;
} )
2024-10-29 18:14:06 +00:00
} , null , 8 , [ "id" , "style" , "aria-labelledby" , "menuId" , "focusedItemId" , "items" , "templates" , "activeItemPath" , "level" , "visible" , "pt" , "unstyled" ] ) ) : createCommentVNode ( "" , true ) ] , 16 , _hoisted _2$3 ) ) : createCommentVNode ( "" , true ) , $options . isItemVisible ( processedItem ) && $options . getItemProp ( processedItem , "separator" ) ? ( openBlock ( ) , createElementBlock ( "li" , mergeProps ( {
2024-10-28 18:29:38 +00:00
key : 1 ,
id : $options . getItemId ( processedItem ) ,
style : $options . getItemProp ( processedItem , "style" ) ,
"class" : [ _ctx . cx ( "separator" ) , $options . getItemProp ( processedItem , "class" ) ] ,
role : "separator" ,
ref _for : true
} , _ctx . ptm ( "separator" ) ) , null , 16 , _hoisted _6 ) ) : createCommentVNode ( "" , true ) ] , 64 ) ;
} ) , 128 ) ) ] , 16 , _hoisted _1$1$1 ) ) : createCommentVNode ( "" , true ) ] ;
} ) ,
_ : 1
} , 16 , [ "onEnter" ] ) ;
}
2024-10-29 18:14:06 +00:00
_ _name ( render$1$1 , "render$1$1" ) ;
script$1$1 . render = render$1$1 ;
2024-10-28 18:29:38 +00:00
var script$3 = {
name : "TieredMenu" ,
"extends" : script$2 ,
inheritAttrs : false ,
emits : [ "focus" , "blur" , "before-show" , "before-hide" , "hide" , "show" ] ,
outsideClickListener : null ,
scrollHandler : null ,
resizeListener : null ,
target : null ,
container : null ,
menubar : null ,
searchTimeout : null ,
searchValue : null ,
2024-10-29 18:14:06 +00:00
data : /* @__PURE__ */ _ _name ( function data8 ( ) {
2024-10-28 18:29:38 +00:00
return {
id : this . $attrs . id ,
focused : false ,
focusedItemInfo : {
index : - 1 ,
level : 0 ,
parentKey : ""
} ,
activeItemPath : [ ] ,
visible : ! this . popup ,
submenuVisible : false ,
dirty : false
} ;
} , "data" ) ,
watch : {
"$attrs.id" : /* @__PURE__ */ _ _name ( function $attrsId4 ( newValue ) {
this . id = newValue || UniqueComponentId ( ) ;
} , "$attrsId" ) ,
activeItemPath : /* @__PURE__ */ _ _name ( function activeItemPath2 ( newPath ) {
if ( ! this . popup ) {
if ( isNotEmpty ( newPath ) ) {
this . bindOutsideClickListener ( ) ;
this . bindResizeListener ( ) ;
} else {
this . unbindOutsideClickListener ( ) ;
this . unbindResizeListener ( ) ;
}
}
} , "activeItemPath" )
} ,
2024-10-29 18:14:06 +00:00
mounted : /* @__PURE__ */ _ _name ( function mounted8 ( ) {
2024-10-28 18:29:38 +00:00
this . id = this . id || UniqueComponentId ( ) ;
} , "mounted" ) ,
2024-10-29 18:14:06 +00:00
beforeUnmount : /* @__PURE__ */ _ _name ( function beforeUnmount7 ( ) {
2024-10-28 18:29:38 +00:00
this . unbindOutsideClickListener ( ) ;
this . unbindResizeListener ( ) ;
if ( this . scrollHandler ) {
this . scrollHandler . destroy ( ) ;
this . scrollHandler = null ;
}
if ( this . container && this . autoZIndex ) {
ZIndex . clear ( this . container ) ;
}
this . target = null ;
this . container = null ;
} , "beforeUnmount" ) ,
methods : {
getItemProp : /* @__PURE__ */ _ _name ( function getItemProp4 ( item3 , name ) {
return item3 ? resolve ( item3 [ name ] ) : void 0 ;
} , "getItemProp" ) ,
getItemLabel : /* @__PURE__ */ _ _name ( function getItemLabel4 ( item3 ) {
return this . getItemProp ( item3 , "label" ) ;
} , "getItemLabel" ) ,
isItemDisabled : /* @__PURE__ */ _ _name ( function isItemDisabled4 ( item3 ) {
return this . getItemProp ( item3 , "disabled" ) ;
} , "isItemDisabled" ) ,
isItemVisible : /* @__PURE__ */ _ _name ( function isItemVisible4 ( item3 ) {
return this . getItemProp ( item3 , "visible" ) !== false ;
} , "isItemVisible" ) ,
isItemGroup : /* @__PURE__ */ _ _name ( function isItemGroup4 ( item3 ) {
return isNotEmpty ( this . getItemProp ( item3 , "items" ) ) ;
} , "isItemGroup" ) ,
isItemSeparator : /* @__PURE__ */ _ _name ( function isItemSeparator2 ( item3 ) {
return this . getItemProp ( item3 , "separator" ) ;
} , "isItemSeparator" ) ,
getProccessedItemLabel : /* @__PURE__ */ _ _name ( function getProccessedItemLabel2 ( processedItem ) {
return processedItem ? this . getItemLabel ( processedItem . item ) : void 0 ;
} , "getProccessedItemLabel" ) ,
isProccessedItemGroup : /* @__PURE__ */ _ _name ( function isProccessedItemGroup2 ( processedItem ) {
return processedItem && isNotEmpty ( processedItem . items ) ;
} , "isProccessedItemGroup" ) ,
toggle : /* @__PURE__ */ _ _name ( function toggle3 ( event ) {
this . visible ? this . hide ( event , true ) : this . show ( event ) ;
} , "toggle" ) ,
show : /* @__PURE__ */ _ _name ( function show3 ( event , isFocus ) {
if ( this . popup ) {
this . $emit ( "before-show" ) ;
this . visible = true ;
this . target = this . target || event . currentTarget ;
this . relatedTarget = event . relatedTarget || null ;
}
isFocus && focus ( this . menubar ) ;
} , "show" ) ,
hide : /* @__PURE__ */ _ _name ( function hide3 ( event , isFocus ) {
if ( this . popup ) {
this . $emit ( "before-hide" ) ;
this . visible = false ;
}
this . activeItemPath = [ ] ;
this . focusedItemInfo = {
index : - 1 ,
level : 0 ,
parentKey : ""
} ;
isFocus && focus ( this . relatedTarget || this . target || this . menubar ) ;
this . dirty = false ;
} , "hide" ) ,
2024-10-29 18:14:06 +00:00
onFocus : /* @__PURE__ */ _ _name ( function onFocus4 ( event ) {
2024-10-28 18:29:38 +00:00
this . focused = true ;
if ( ! this . popup ) {
this . focusedItemInfo = this . focusedItemInfo . index !== - 1 ? this . focusedItemInfo : {
index : this . findFirstFocusedItemIndex ( ) ,
level : 0 ,
parentKey : ""
} ;
}
this . $emit ( "focus" , event ) ;
} , "onFocus" ) ,
onBlur : /* @__PURE__ */ _ _name ( function onBlur3 ( event ) {
this . focused = false ;
this . focusedItemInfo = {
index : - 1 ,
level : 0 ,
parentKey : ""
} ;
this . searchValue = "" ;
this . dirty = false ;
this . $emit ( "blur" , event ) ;
} , "onBlur" ) ,
onKeyDown : /* @__PURE__ */ _ _name ( function onKeyDown4 ( event ) {
if ( this . disabled ) {
event . preventDefault ( ) ;
return ;
}
var metaKey = event . metaKey || event . ctrlKey ;
switch ( event . code ) {
case "ArrowDown" :
this . onArrowDownKey ( event ) ;
break ;
case "ArrowUp" :
this . onArrowUpKey ( event ) ;
break ;
case "ArrowLeft" :
this . onArrowLeftKey ( event ) ;
break ;
case "ArrowRight" :
this . onArrowRightKey ( event ) ;
break ;
case "Home" :
this . onHomeKey ( event ) ;
break ;
case "End" :
this . onEndKey ( event ) ;
break ;
case "Space" :
this . onSpaceKey ( event ) ;
break ;
case "Enter" :
case "NumpadEnter" :
this . onEnterKey ( event ) ;
break ;
case "Escape" :
this . onEscapeKey ( event ) ;
break ;
case "Tab" :
this . onTabKey ( event ) ;
break ;
case "PageDown" :
case "PageUp" :
case "Backspace" :
case "ShiftLeft" :
case "ShiftRight" :
break ;
default :
if ( ! metaKey && isPrintableCharacter ( event . key ) ) {
this . searchItems ( event , event . key ) ;
}
break ;
}
} , "onKeyDown" ) ,
onItemChange : /* @__PURE__ */ _ _name ( function onItemChange2 ( event ) {
var processedItem = event . processedItem , isFocus = event . isFocus ;
if ( isEmpty ( processedItem ) ) return ;
var index = processedItem . index , key = processedItem . key , level = processedItem . level , parentKey = processedItem . parentKey , items = processedItem . items ;
var grouped = isNotEmpty ( items ) ;
var activeItemPath3 = this . activeItemPath . filter ( function ( p ) {
return p . parentKey !== parentKey && p . parentKey !== key ;
} ) ;
if ( grouped ) {
activeItemPath3 . push ( processedItem ) ;
this . submenuVisible = true ;
}
this . focusedItemInfo = {
index ,
level ,
parentKey
} ;
this . activeItemPath = activeItemPath3 ;
grouped && ( this . dirty = true ) ;
isFocus && focus ( this . menubar ) ;
} , "onItemChange" ) ,
onOverlayClick : /* @__PURE__ */ _ _name ( function onOverlayClick2 ( event ) {
OverlayEventBus . emit ( "overlay-click" , {
originalEvent : event ,
target : this . target
} ) ;
} , "onOverlayClick" ) ,
onItemClick : /* @__PURE__ */ _ _name ( function onItemClick4 ( event ) {
var originalEvent = event . originalEvent , processedItem = event . processedItem ;
var grouped = this . isProccessedItemGroup ( processedItem ) ;
2024-10-29 18:14:06 +00:00
var root12 = isEmpty ( processedItem . parent ) ;
2024-10-28 18:29:38 +00:00
var selected = this . isSelected ( processedItem ) ;
if ( selected ) {
var index = processedItem . index , key = processedItem . key , level = processedItem . level , parentKey = processedItem . parentKey ;
this . activeItemPath = this . activeItemPath . filter ( function ( p ) {
return key !== p . key && key . startsWith ( p . key ) ;
} ) ;
this . focusedItemInfo = {
index ,
level ,
parentKey
} ;
2024-10-29 18:14:06 +00:00
this . dirty = ! root12 ;
2024-10-28 18:29:38 +00:00
focus ( this . menubar ) ;
} else {
if ( grouped ) {
this . onItemChange ( event ) ;
} else {
2024-10-29 18:14:06 +00:00
var rootProcessedItem = root12 ? processedItem : this . activeItemPath . find ( function ( p ) {
2024-10-28 18:29:38 +00:00
return p . parentKey === "" ;
} ) ;
this . hide ( originalEvent ) ;
this . changeFocusedItemIndex ( originalEvent , rootProcessedItem ? rootProcessedItem . index : - 1 ) ;
focus ( this . menubar ) ;
}
}
} , "onItemClick" ) ,
onItemMouseEnter : /* @__PURE__ */ _ _name ( function onItemMouseEnter4 ( event ) {
if ( this . dirty ) {
this . onItemChange ( event ) ;
}
} , "onItemMouseEnter" ) ,
onItemMouseMove : /* @__PURE__ */ _ _name ( function onItemMouseMove4 ( event ) {
if ( this . focused ) {
this . changeFocusedItemIndex ( event , event . processedItem . index ) ;
}
} , "onItemMouseMove" ) ,
onArrowDownKey : /* @__PURE__ */ _ _name ( function onArrowDownKey3 ( event ) {
var itemIndex = this . focusedItemInfo . index !== - 1 ? this . findNextItemIndex ( this . focusedItemInfo . index ) : this . findFirstFocusedItemIndex ( ) ;
this . changeFocusedItemIndex ( event , itemIndex ) ;
event . preventDefault ( ) ;
} , "onArrowDownKey" ) ,
onArrowUpKey : /* @__PURE__ */ _ _name ( function onArrowUpKey3 ( event ) {
if ( event . altKey ) {
if ( this . focusedItemInfo . index !== - 1 ) {
var processedItem = this . visibleItems [ this . focusedItemInfo . index ] ;
var grouped = this . isProccessedItemGroup ( processedItem ) ;
! grouped && this . onItemChange ( {
originalEvent : event ,
processedItem
} ) ;
}
this . popup && this . hide ( event , true ) ;
event . preventDefault ( ) ;
} else {
var itemIndex = this . focusedItemInfo . index !== - 1 ? this . findPrevItemIndex ( this . focusedItemInfo . index ) : this . findLastFocusedItemIndex ( ) ;
this . changeFocusedItemIndex ( event , itemIndex ) ;
event . preventDefault ( ) ;
}
} , "onArrowUpKey" ) ,
2024-10-29 18:14:06 +00:00
onArrowLeftKey : /* @__PURE__ */ _ _name ( function onArrowLeftKey4 ( event ) {
2024-10-28 18:29:38 +00:00
var _this = this ;
var processedItem = this . visibleItems [ this . focusedItemInfo . index ] ;
var parentItem = this . activeItemPath . find ( function ( p ) {
return p . key === processedItem . parentKey ;
} ) ;
2024-10-29 18:14:06 +00:00
var root12 = isEmpty ( processedItem . parent ) ;
if ( ! root12 ) {
2024-10-28 18:29:38 +00:00
this . focusedItemInfo = {
index : - 1 ,
parentKey : parentItem ? parentItem . parentKey : ""
} ;
this . searchValue = "" ;
this . onArrowDownKey ( event ) ;
}
this . activeItemPath = this . activeItemPath . filter ( function ( p ) {
return p . parentKey !== _this . focusedItemInfo . parentKey ;
} ) ;
event . preventDefault ( ) ;
} , "onArrowLeftKey" ) ,
2024-10-29 18:14:06 +00:00
onArrowRightKey : /* @__PURE__ */ _ _name ( function onArrowRightKey4 ( event ) {
2024-10-28 18:29:38 +00:00
var processedItem = this . visibleItems [ this . focusedItemInfo . index ] ;
var grouped = this . isProccessedItemGroup ( processedItem ) ;
if ( grouped ) {
this . onItemChange ( {
originalEvent : event ,
processedItem
} ) ;
this . focusedItemInfo = {
index : - 1 ,
parentKey : processedItem . key
} ;
this . searchValue = "" ;
this . onArrowDownKey ( event ) ;
}
event . preventDefault ( ) ;
} , "onArrowRightKey" ) ,
2024-10-29 18:14:06 +00:00
onHomeKey : /* @__PURE__ */ _ _name ( function onHomeKey4 ( event ) {
2024-10-28 18:29:38 +00:00
this . changeFocusedItemIndex ( event , this . findFirstItemIndex ( ) ) ;
event . preventDefault ( ) ;
} , "onHomeKey" ) ,
2024-10-29 18:14:06 +00:00
onEndKey : /* @__PURE__ */ _ _name ( function onEndKey4 ( event ) {
2024-10-28 18:29:38 +00:00
this . changeFocusedItemIndex ( event , this . findLastItemIndex ( ) ) ;
event . preventDefault ( ) ;
} , "onEndKey" ) ,
2024-10-29 18:14:06 +00:00
onEnterKey : /* @__PURE__ */ _ _name ( function onEnterKey4 ( event ) {
2024-10-28 18:29:38 +00:00
if ( this . focusedItemInfo . index !== - 1 ) {
var element = findSingle ( this . menubar , 'li[id="' . concat ( "" . concat ( this . focusedItemId ) , '"]' ) ) ;
var anchorElement = element && findSingle ( element , '[data-pc-section="itemlink"]' ) ;
anchorElement ? anchorElement . click ( ) : element && element . click ( ) ;
if ( ! this . popup ) {
var processedItem = this . visibleItems [ this . focusedItemInfo . index ] ;
var grouped = this . isProccessedItemGroup ( processedItem ) ;
! grouped && ( this . focusedItemInfo . index = this . findFirstFocusedItemIndex ( ) ) ;
}
}
event . preventDefault ( ) ;
} , "onEnterKey" ) ,
onSpaceKey : /* @__PURE__ */ _ _name ( function onSpaceKey2 ( event ) {
this . onEnterKey ( event ) ;
} , "onSpaceKey" ) ,
onEscapeKey : /* @__PURE__ */ _ _name ( function onEscapeKey3 ( event ) {
if ( this . popup || this . focusedItemInfo . level !== 0 ) {
var _focusedItemInfo = this . focusedItemInfo ;
this . hide ( event , false ) ;
this . focusedItemInfo = {
index : Number ( _focusedItemInfo . parentKey . split ( "_" ) [ 0 ] ) ,
level : 0 ,
parentKey : ""
} ;
this . popup && focus ( this . target ) ;
}
event . preventDefault ( ) ;
} , "onEscapeKey" ) ,
onTabKey : /* @__PURE__ */ _ _name ( function onTabKey3 ( event ) {
if ( this . focusedItemInfo . index !== - 1 ) {
var processedItem = this . visibleItems [ this . focusedItemInfo . index ] ;
var grouped = this . isProccessedItemGroup ( processedItem ) ;
! grouped && this . onItemChange ( {
originalEvent : event ,
processedItem
} ) ;
}
this . hide ( ) ;
} , "onTabKey" ) ,
onEnter : /* @__PURE__ */ _ _name ( function onEnter3 ( el ) {
if ( this . autoZIndex ) {
ZIndex . set ( "menu" , el , this . baseZIndex + this . $primevue . config . zIndex . menu ) ;
}
addStyle ( el , {
position : "absolute" ,
top : "0" ,
left : "0"
} ) ;
this . alignOverlay ( ) ;
focus ( this . menubar ) ;
this . scrollInView ( ) ;
} , "onEnter" ) ,
onAfterEnter : /* @__PURE__ */ _ _name ( function onAfterEnter ( ) {
this . bindOutsideClickListener ( ) ;
this . bindScrollListener ( ) ;
this . bindResizeListener ( ) ;
this . $emit ( "show" ) ;
} , "onAfterEnter" ) ,
onLeave : /* @__PURE__ */ _ _name ( function onLeave2 ( ) {
this . unbindOutsideClickListener ( ) ;
this . unbindScrollListener ( ) ;
this . unbindResizeListener ( ) ;
this . $emit ( "hide" ) ;
this . container = null ;
this . dirty = false ;
} , "onLeave" ) ,
onAfterLeave : /* @__PURE__ */ _ _name ( function onAfterLeave ( el ) {
if ( this . autoZIndex ) {
ZIndex . clear ( el ) ;
}
} , "onAfterLeave" ) ,
alignOverlay : /* @__PURE__ */ _ _name ( function alignOverlay2 ( ) {
absolutePosition ( this . container , this . target ) ;
var targetWidth = getOuterWidth ( this . target ) ;
if ( targetWidth > getOuterWidth ( this . container ) ) {
this . container . style . minWidth = getOuterWidth ( this . target ) + "px" ;
}
} , "alignOverlay" ) ,
bindOutsideClickListener : /* @__PURE__ */ _ _name ( function bindOutsideClickListener3 ( ) {
var _this2 = this ;
if ( ! this . outsideClickListener ) {
this . outsideClickListener = function ( event ) {
var isOutsideContainer = _this2 . container && ! _this2 . container . contains ( event . target ) ;
var isOutsideTarget = _this2 . popup ? ! ( _this2 . target && ( _this2 . target === event . target || _this2 . target . contains ( event . target ) ) ) : true ;
if ( isOutsideContainer && isOutsideTarget ) {
_this2 . hide ( ) ;
}
} ;
document . addEventListener ( "click" , this . outsideClickListener ) ;
}
} , "bindOutsideClickListener" ) ,
unbindOutsideClickListener : /* @__PURE__ */ _ _name ( function unbindOutsideClickListener3 ( ) {
if ( this . outsideClickListener ) {
document . removeEventListener ( "click" , this . outsideClickListener ) ;
this . outsideClickListener = null ;
}
} , "unbindOutsideClickListener" ) ,
bindScrollListener : /* @__PURE__ */ _ _name ( function bindScrollListener2 ( ) {
var _this3 = this ;
if ( ! this . scrollHandler ) {
this . scrollHandler = new ConnectedOverlayScrollHandler ( this . target , function ( event ) {
_this3 . hide ( event , true ) ;
} ) ;
}
this . scrollHandler . bindScrollListener ( ) ;
} , "bindScrollListener" ) ,
unbindScrollListener : /* @__PURE__ */ _ _name ( function unbindScrollListener2 ( ) {
if ( this . scrollHandler ) {
this . scrollHandler . unbindScrollListener ( ) ;
}
} , "unbindScrollListener" ) ,
bindResizeListener : /* @__PURE__ */ _ _name ( function bindResizeListener3 ( ) {
var _this4 = this ;
if ( ! this . resizeListener ) {
this . resizeListener = function ( event ) {
if ( ! isTouchDevice ( ) ) {
_this4 . hide ( event , true ) ;
}
} ;
window . addEventListener ( "resize" , this . resizeListener ) ;
}
} , "bindResizeListener" ) ,
unbindResizeListener : /* @__PURE__ */ _ _name ( function unbindResizeListener3 ( ) {
if ( this . resizeListener ) {
window . removeEventListener ( "resize" , this . resizeListener ) ;
this . resizeListener = null ;
}
} , "unbindResizeListener" ) ,
isItemMatched : /* @__PURE__ */ _ _name ( function isItemMatched2 ( processedItem ) {
var _this$getProccessedIt ;
return this . isValidItem ( processedItem ) && ( ( _this$getProccessedIt = this . getProccessedItemLabel ( processedItem ) ) === null || _this$getProccessedIt === void 0 ? void 0 : _this$getProccessedIt . toLocaleLowerCase ( ) . startsWith ( this . searchValue . toLocaleLowerCase ( ) ) ) ;
} , "isItemMatched" ) ,
isValidItem : /* @__PURE__ */ _ _name ( function isValidItem2 ( processedItem ) {
return ! ! processedItem && ! this . isItemDisabled ( processedItem . item ) && ! this . isItemSeparator ( processedItem . item ) && this . isItemVisible ( processedItem . item ) ;
} , "isValidItem" ) ,
isValidSelectedItem : /* @__PURE__ */ _ _name ( function isValidSelectedItem2 ( processedItem ) {
return this . isValidItem ( processedItem ) && this . isSelected ( processedItem ) ;
} , "isValidSelectedItem" ) ,
isSelected : /* @__PURE__ */ _ _name ( function isSelected3 ( processedItem ) {
return this . activeItemPath . some ( function ( p ) {
return p . key === processedItem . key ;
} ) ;
} , "isSelected" ) ,
findFirstItemIndex : /* @__PURE__ */ _ _name ( function findFirstItemIndex2 ( ) {
var _this5 = this ;
return this . visibleItems . findIndex ( function ( processedItem ) {
return _this5 . isValidItem ( processedItem ) ;
} ) ;
} , "findFirstItemIndex" ) ,
findLastItemIndex : /* @__PURE__ */ _ _name ( function findLastItemIndex2 ( ) {
var _this6 = this ;
return findLastIndex ( this . visibleItems , function ( processedItem ) {
return _this6 . isValidItem ( processedItem ) ;
} ) ;
} , "findLastItemIndex" ) ,
findNextItemIndex : /* @__PURE__ */ _ _name ( function findNextItemIndex2 ( index ) {
var _this7 = this ;
var matchedItemIndex = index < this . visibleItems . length - 1 ? this . visibleItems . slice ( index + 1 ) . findIndex ( function ( processedItem ) {
return _this7 . isValidItem ( processedItem ) ;
} ) : - 1 ;
return matchedItemIndex > - 1 ? matchedItemIndex + index + 1 : index ;
} , "findNextItemIndex" ) ,
findPrevItemIndex : /* @__PURE__ */ _ _name ( function findPrevItemIndex2 ( index ) {
var _this8 = this ;
var matchedItemIndex = index > 0 ? findLastIndex ( this . visibleItems . slice ( 0 , index ) , function ( processedItem ) {
return _this8 . isValidItem ( processedItem ) ;
} ) : - 1 ;
return matchedItemIndex > - 1 ? matchedItemIndex : index ;
} , "findPrevItemIndex" ) ,
findSelectedItemIndex : /* @__PURE__ */ _ _name ( function findSelectedItemIndex2 ( ) {
var _this9 = this ;
return this . visibleItems . findIndex ( function ( processedItem ) {
return _this9 . isValidSelectedItem ( processedItem ) ;
} ) ;
} , "findSelectedItemIndex" ) ,
findFirstFocusedItemIndex : /* @__PURE__ */ _ _name ( function findFirstFocusedItemIndex2 ( ) {
var selectedIndex = this . findSelectedItemIndex ( ) ;
return selectedIndex < 0 ? this . findFirstItemIndex ( ) : selectedIndex ;
} , "findFirstFocusedItemIndex" ) ,
findLastFocusedItemIndex : /* @__PURE__ */ _ _name ( function findLastFocusedItemIndex2 ( ) {
var selectedIndex = this . findSelectedItemIndex ( ) ;
return selectedIndex < 0 ? this . findLastItemIndex ( ) : selectedIndex ;
} , "findLastFocusedItemIndex" ) ,
searchItems : /* @__PURE__ */ _ _name ( function searchItems2 ( event , _char ) {
var _this10 = this ;
this . searchValue = ( this . searchValue || "" ) + _char ;
var itemIndex = - 1 ;
var matched = false ;
if ( this . focusedItemInfo . index !== - 1 ) {
itemIndex = this . visibleItems . slice ( this . focusedItemInfo . index ) . findIndex ( function ( processedItem ) {
return _this10 . isItemMatched ( processedItem ) ;
} ) ;
itemIndex = itemIndex === - 1 ? this . visibleItems . slice ( 0 , this . focusedItemInfo . index ) . findIndex ( function ( processedItem ) {
return _this10 . isItemMatched ( processedItem ) ;
} ) : itemIndex + this . focusedItemInfo . index ;
} else {
itemIndex = this . visibleItems . findIndex ( function ( processedItem ) {
return _this10 . isItemMatched ( processedItem ) ;
} ) ;
}
if ( itemIndex !== - 1 ) {
matched = true ;
}
if ( itemIndex === - 1 && this . focusedItemInfo . index === - 1 ) {
itemIndex = this . findFirstFocusedItemIndex ( ) ;
}
if ( itemIndex !== - 1 ) {
this . changeFocusedItemIndex ( event , itemIndex ) ;
}
if ( this . searchTimeout ) {
clearTimeout ( this . searchTimeout ) ;
}
this . searchTimeout = setTimeout ( function ( ) {
_this10 . searchValue = "" ;
_this10 . searchTimeout = null ;
} , 500 ) ;
return matched ;
} , "searchItems" ) ,
changeFocusedItemIndex : /* @__PURE__ */ _ _name ( function changeFocusedItemIndex2 ( event , index ) {
if ( this . focusedItemInfo . index !== index ) {
this . focusedItemInfo . index = index ;
this . scrollInView ( ) ;
}
} , "changeFocusedItemIndex" ) ,
2024-10-29 18:14:06 +00:00
scrollInView : /* @__PURE__ */ _ _name ( function scrollInView4 ( ) {
2024-10-28 18:29:38 +00:00
var index = arguments . length > 0 && arguments [ 0 ] !== void 0 ? arguments [ 0 ] : - 1 ;
2024-10-29 18:14:06 +00:00
var id2 = index !== - 1 ? "" . concat ( this . id , "_" ) . concat ( index ) : this . focusedItemId ;
var element = findSingle ( this . menubar , 'li[id="' . concat ( id2 , '"]' ) ) ;
2024-10-28 18:29:38 +00:00
if ( element ) {
element . scrollIntoView && element . scrollIntoView ( {
block : "nearest" ,
inline : "start"
} ) ;
}
} , "scrollInView" ) ,
createProcessedItems : /* @__PURE__ */ _ _name ( function createProcessedItems2 ( items ) {
var _this11 = this ;
var level = arguments . length > 1 && arguments [ 1 ] !== void 0 ? arguments [ 1 ] : 0 ;
var parent = arguments . length > 2 && arguments [ 2 ] !== void 0 ? arguments [ 2 ] : { } ;
var parentKey = arguments . length > 3 && arguments [ 3 ] !== void 0 ? arguments [ 3 ] : "" ;
var processedItems3 = [ ] ;
items && items . forEach ( function ( item3 , index ) {
var key = ( parentKey !== "" ? parentKey + "_" : "" ) + index ;
var newItem = {
item : item3 ,
index ,
level ,
key ,
parent ,
parentKey
} ;
newItem [ "items" ] = _this11 . createProcessedItems ( item3 . items , level + 1 , newItem , key ) ;
processedItems3 . push ( newItem ) ;
} ) ;
return processedItems3 ;
} , "createProcessedItems" ) ,
containerRef : /* @__PURE__ */ _ _name ( function containerRef3 ( el ) {
this . container = el ;
} , "containerRef" ) ,
menubarRef : /* @__PURE__ */ _ _name ( function menubarRef2 ( el ) {
this . menubar = el ? el . $el : void 0 ;
} , "menubarRef" )
} ,
computed : {
processedItems : /* @__PURE__ */ _ _name ( function processedItems2 ( ) {
return this . createProcessedItems ( this . model || [ ] ) ;
} , "processedItems" ) ,
visibleItems : /* @__PURE__ */ _ _name ( function visibleItems2 ( ) {
var _this12 = this ;
var processedItem = this . activeItemPath . find ( function ( p ) {
return p . key === _this12 . focusedItemInfo . parentKey ;
} ) ;
return processedItem ? processedItem . items : this . processedItems ;
} , "visibleItems" ) ,
focusedItemId : /* @__PURE__ */ _ _name ( function focusedItemId2 ( ) {
return this . focusedItemInfo . index !== - 1 ? "" . concat ( this . id ) . concat ( isNotEmpty ( this . focusedItemInfo . parentKey ) ? "_" + this . focusedItemInfo . parentKey : "" , "_" ) . concat ( this . focusedItemInfo . index ) : null ;
} , "focusedItemId" )
} ,
components : {
TieredMenuSub : script$1$1 ,
2024-10-29 18:14:06 +00:00
Portal : script$m
2024-10-28 18:29:38 +00:00
}
} ;
2024-10-29 18:14:06 +00:00
var _hoisted _1$5 = [ "id" ] ;
function render$3 ( _ctx , _cache , $props , $setup , $data , $options ) {
2024-10-28 18:29:38 +00:00
var _component _TieredMenuSub = resolveComponent ( "TieredMenuSub" ) ;
var _component _Portal = resolveComponent ( "Portal" ) ;
return openBlock ( ) , createBlock ( _component _Portal , {
appendTo : _ctx . appendTo ,
disabled : ! _ctx . popup
} , {
"default" : withCtx ( function ( ) {
return [ createVNode ( Transition , mergeProps ( {
name : "p-connected-overlay" ,
onEnter : $options . onEnter ,
onAfterEnter : $options . onAfterEnter ,
onLeave : $options . onLeave ,
onAfterLeave : $options . onAfterLeave
} , _ctx . ptm ( "transition" ) ) , {
"default" : withCtx ( function ( ) {
return [ $data . visible ? ( openBlock ( ) , createElementBlock ( "div" , mergeProps ( {
key : 0 ,
ref : $options . containerRef ,
id : $data . id ,
"class" : _ctx . cx ( "root" ) ,
onClick : _cache [ 0 ] || ( _cache [ 0 ] = function ( ) {
return $options . onOverlayClick && $options . onOverlayClick . apply ( $options , arguments ) ;
} )
} , _ctx . ptmi ( "root" ) ) , [ _ctx . $slots . start ? ( openBlock ( ) , createElementBlock ( "div" , mergeProps ( {
key : 0 ,
"class" : _ctx . cx ( "start" )
} , _ctx . ptm ( "start" ) ) , [ renderSlot ( _ctx . $slots , "start" ) ] , 16 ) ) : createCommentVNode ( "" , true ) , createVNode ( _component _TieredMenuSub , {
ref : $options . menubarRef ,
id : $data . id + "_list" ,
tabindex : ! _ctx . disabled ? _ctx . tabindex : - 1 ,
role : "menubar" ,
"aria-label" : _ctx . ariaLabel ,
"aria-labelledby" : _ctx . ariaLabelledby ,
"aria-disabled" : _ctx . disabled || void 0 ,
"aria-orientation" : "vertical" ,
"aria-activedescendant" : $data . focused ? $options . focusedItemId : void 0 ,
menuId : $data . id ,
focusedItemId : $data . focused ? $options . focusedItemId : void 0 ,
items : $options . processedItems ,
templates : _ctx . $slots ,
activeItemPath : $data . activeItemPath ,
level : 0 ,
visible : $data . submenuVisible ,
pt : _ctx . pt ,
unstyled : _ctx . unstyled ,
onFocus : $options . onFocus ,
onBlur : $options . onBlur ,
onKeydown : $options . onKeyDown ,
onItemClick : $options . onItemClick ,
onItemMouseenter : $options . onItemMouseEnter ,
onItemMousemove : $options . onItemMouseMove
} , null , 8 , [ "id" , "tabindex" , "aria-label" , "aria-labelledby" , "aria-disabled" , "aria-activedescendant" , "menuId" , "focusedItemId" , "items" , "templates" , "activeItemPath" , "visible" , "pt" , "unstyled" , "onFocus" , "onBlur" , "onKeydown" , "onItemClick" , "onItemMouseenter" , "onItemMousemove" ] ) , _ctx . $slots . end ? ( openBlock ( ) , createElementBlock ( "div" , mergeProps ( {
key : 1 ,
"class" : _ctx . cx ( "end" )
2024-10-29 18:14:06 +00:00
} , _ctx . ptm ( "end" ) ) , [ renderSlot ( _ctx . $slots , "end" ) ] , 16 ) ) : createCommentVNode ( "" , true ) ] , 16 , _hoisted _1$5 ) ) : createCommentVNode ( "" , true ) ] ;
2024-10-28 18:29:38 +00:00
} ) ,
_ : 3
} , 16 , [ "onEnter" , "onAfterEnter" , "onLeave" , "onAfterLeave" ] ) ] ;
} ) ,
_ : 3
} , 8 , [ "appendTo" , "disabled" ] ) ;
}
2024-10-29 18:14:06 +00:00
_ _name ( render$3 , "render$3" ) ;
script$3 . render = render$3 ;
2024-10-28 18:29:38 +00:00
var theme9 = /* @__PURE__ */ _ _name ( function theme10 ( _ref ) {
var dt = _ref . dt ;
return "\n.p-splitbutton {\n display: inline-flex;\n position: relative;\n border-radius: " . concat ( dt ( "splitbutton.border.radius" ) , ";\n}\n\n.p-splitbutton-button {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n border-right: 0 none;\n}\n\n.p-splitbutton-button:focus-visible,\n.p-splitbutton-dropdown:focus-visible {\n z-index: 1;\n}\n\n.p-splitbutton-button:not(:disabled):hover,\n.p-splitbutton-button:not(:disabled):active {\n border-right: 0 none;\n}\n\n.p-splitbutton-dropdown {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n}\n\n.p-splitbutton .p-menu {\n min-width: 100%;\n}\n\n.p-splitbutton-fluid {\n display: flex;\n}\n\n.p-splitbutton-rounded .p-splitbutton-dropdown {\n border-top-right-radius: " ) . concat ( dt ( "splitbutton.rounded.border.radius" ) , ";\n border-bottom-right-radius: " ) . concat ( dt ( "splitbutton.rounded.border.radius" ) , ";\n}\n\n.p-splitbutton-rounded .p-splitbutton-button {\n border-top-left-radius: " ) . concat ( dt ( "splitbutton.rounded.border.radius" ) , ";\n border-bottom-left-radius: " ) . concat ( dt ( "splitbutton.rounded.border.radius" ) , ";\n}\n\n.p-splitbutton-raised {\n box-shadow: " ) . concat ( dt ( "splitbutton.raised.shadow" ) , ";\n}\n" ) ;
} , "theme" ) ;
var classes = {
2024-10-29 18:14:06 +00:00
root : /* @__PURE__ */ _ _name ( function root11 ( _ref2 ) {
2024-10-28 18:29:38 +00:00
var instance = _ref2 . instance , props = _ref2 . props ;
return [ "p-splitbutton p-component" , {
"p-splitbutton-raised" : props . raised ,
"p-splitbutton-rounded" : props . rounded ,
"p-splitbutton-fluid" : instance . hasFluid
} ] ;
} , "root" ) ,
pcButton : "p-splitbutton-button" ,
pcDropdown : "p-splitbutton-dropdown"
} ;
var SplitButtonStyle = BaseStyle . extend ( {
name : "splitbutton" ,
theme : theme9 ,
classes
} ) ;
var script$1 = {
name : "BaseSplitButton" ,
2024-10-29 18:14:06 +00:00
"extends" : script$g ,
2024-10-28 18:29:38 +00:00
props : {
label : {
type : String ,
"default" : null
} ,
icon : {
type : String ,
"default" : null
} ,
model : {
type : Array ,
"default" : null
} ,
autoZIndex : {
type : Boolean ,
"default" : true
} ,
baseZIndex : {
type : Number ,
"default" : 0
} ,
appendTo : {
type : [ String , Object ] ,
"default" : "body"
} ,
disabled : {
type : Boolean ,
"default" : false
} ,
fluid : {
type : Boolean ,
"default" : null
} ,
"class" : {
type : null ,
"default" : null
} ,
style : {
type : null ,
"default" : null
} ,
buttonProps : {
type : null ,
"default" : null
} ,
menuButtonProps : {
type : null ,
"default" : null
} ,
menuButtonIcon : {
type : String ,
"default" : void 0
} ,
dropdownIcon : {
type : String ,
"default" : void 0
} ,
severity : {
type : String ,
"default" : null
} ,
raised : {
type : Boolean ,
"default" : false
} ,
rounded : {
type : Boolean ,
"default" : false
} ,
text : {
type : Boolean ,
"default" : false
} ,
outlined : {
type : Boolean ,
"default" : false
} ,
size : {
type : String ,
"default" : null
} ,
plain : {
type : Boolean ,
"default" : false
}
} ,
style : SplitButtonStyle ,
2024-10-29 18:14:06 +00:00
provide : /* @__PURE__ */ _ _name ( function provide13 ( ) {
2024-10-28 18:29:38 +00:00
return {
$pcSplitButton : this ,
$parentInstance : this
} ;
} , "provide" )
} ;
var script = {
name : "SplitButton" ,
"extends" : script$1 ,
inheritAttrs : false ,
emits : [ "click" ] ,
inject : {
$pcFluid : {
"default" : null
}
} ,
2024-10-29 18:14:06 +00:00
data : /* @__PURE__ */ _ _name ( function data9 ( ) {
2024-10-28 18:29:38 +00:00
return {
id : this . $attrs . id ,
isExpanded : false
} ;
} , "data" ) ,
watch : {
"$attrs.id" : /* @__PURE__ */ _ _name ( function $attrsId5 ( newValue ) {
this . id = newValue || UniqueComponentId ( ) ;
} , "$attrsId" )
} ,
2024-10-29 18:14:06 +00:00
mounted : /* @__PURE__ */ _ _name ( function mounted9 ( ) {
2024-10-28 18:29:38 +00:00
var _this = this ;
this . id = this . id || UniqueComponentId ( ) ;
this . $watch ( "$refs.menu.visible" , function ( newValue ) {
_this . isExpanded = newValue ;
} ) ;
} , "mounted" ) ,
methods : {
onDropdownButtonClick : /* @__PURE__ */ _ _name ( function onDropdownButtonClick ( event ) {
if ( event ) {
event . preventDefault ( ) ;
}
this . $refs . menu . toggle ( {
currentTarget : this . $el ,
relatedTarget : this . $refs . button . $el
} ) ;
this . isExpanded = this . $refs . menu . visible ;
} , "onDropdownButtonClick" ) ,
onDropdownKeydown : /* @__PURE__ */ _ _name ( function onDropdownKeydown ( event ) {
if ( event . code === "ArrowDown" || event . code === "ArrowUp" ) {
this . onDropdownButtonClick ( ) ;
event . preventDefault ( ) ;
}
} , "onDropdownKeydown" ) ,
onDefaultButtonClick : /* @__PURE__ */ _ _name ( function onDefaultButtonClick ( event ) {
if ( this . isExpanded ) {
this . $refs . menu . hide ( event ) ;
}
this . $emit ( "click" , event ) ;
} , "onDefaultButtonClick" )
} ,
computed : {
containerClass : /* @__PURE__ */ _ _name ( function containerClass ( ) {
return [ this . cx ( "root" ) , this [ "class" ] ] ;
} , "containerClass" ) ,
hasFluid : /* @__PURE__ */ _ _name ( function hasFluid2 ( ) {
return isEmpty ( this . fluid ) ? ! ! this . $pcFluid : this . fluid ;
} , "hasFluid" )
} ,
components : {
2024-10-29 18:14:06 +00:00
PVSButton : script$f ,
2024-10-28 18:29:38 +00:00
PVSMenu : script$3 ,
2024-10-29 18:14:06 +00:00
ChevronDownIcon : script$n
2024-10-28 18:29:38 +00:00
}
} ;
2024-10-29 18:14:06 +00:00
var _hoisted _1$4 = [ "data-p-severity" ] ;
function render$2 ( _ctx , _cache , $props , $setup , $data , $options ) {
2024-10-28 18:29:38 +00:00
var _component _PVSButton = resolveComponent ( "PVSButton" ) ;
var _component _PVSMenu = resolveComponent ( "PVSMenu" ) ;
return openBlock ( ) , createElementBlock ( "div" , mergeProps ( {
"class" : $options . containerClass ,
style : _ctx . style
} , _ctx . ptmi ( "root" ) , {
"data-p-severity" : _ctx . severity
} ) , [ createVNode ( _component _PVSButton , mergeProps ( {
type : "button" ,
"class" : _ctx . cx ( "pcButton" ) ,
label : _ctx . label ,
disabled : _ctx . disabled ,
severity : _ctx . severity ,
text : _ctx . text ,
icon : _ctx . icon ,
outlined : _ctx . outlined ,
size : _ctx . size ,
fluid : _ctx . fluid ,
"aria-label" : _ctx . label ,
onClick : $options . onDefaultButtonClick
} , _ctx . buttonProps , {
pt : _ctx . ptm ( "pcButton" ) ,
unstyled : _ctx . unstyled
} ) , createSlots ( {
"default" : withCtx ( function ( ) {
return [ renderSlot ( _ctx . $slots , "default" ) ] ;
} ) ,
_ : 2
} , [ _ctx . $slots . icon ? {
name : "icon" ,
fn : withCtx ( function ( slotProps ) {
return [ renderSlot ( _ctx . $slots , "icon" , {
"class" : normalizeClass ( slotProps [ "class" ] )
} , function ( ) {
return [ createBaseVNode ( "span" , mergeProps ( {
"class" : [ _ctx . icon , slotProps [ "class" ] ]
} , _ctx . ptm ( "pcButton" ) [ "icon" ] , {
"data-pc-section" : "buttonicon"
} ) , null , 16 ) ] ;
} ) ] ;
} ) ,
key : "0"
} : void 0 ] ) , 1040 , [ "class" , "label" , "disabled" , "severity" , "text" , "icon" , "outlined" , "size" , "fluid" , "aria-label" , "onClick" , "pt" , "unstyled" ] ) , createVNode ( _component _PVSButton , mergeProps ( {
ref : "button" ,
type : "button" ,
"class" : _ctx . cx ( "pcDropdown" ) ,
disabled : _ctx . disabled ,
"aria-haspopup" : "true" ,
"aria-expanded" : $data . isExpanded ,
"aria-controls" : $data . id + "_overlay" ,
onClick : $options . onDropdownButtonClick ,
onKeydown : $options . onDropdownKeydown ,
severity : _ctx . severity ,
text : _ctx . text ,
outlined : _ctx . outlined ,
size : _ctx . size ,
unstyled : _ctx . unstyled
} , _ctx . menuButtonProps , {
pt : _ctx . ptm ( "pcDropdown" )
} ) , {
icon : withCtx ( function ( slotProps ) {
return [ renderSlot ( _ctx . $slots , _ctx . $slots . dropdownicon ? "dropdownicon" : "menubuttonicon" , {
"class" : normalizeClass ( slotProps [ "class" ] )
} , function ( ) {
return [ ( openBlock ( ) , createBlock ( resolveDynamicComponent ( _ctx . menuButtonIcon || _ctx . dropdownIcon ? "span" : "ChevronDownIcon" ) , mergeProps ( {
"class" : [ _ctx . dropdownIcon || _ctx . menuButtonIcon , slotProps [ "class" ] ]
} , _ctx . ptm ( "pcDropdown" ) [ "icon" ] , {
"data-pc-section" : "menubuttonicon"
} ) , null , 16 , [ "class" ] ) ) ] ;
} ) ] ;
} ) ,
_ : 3
} , 16 , [ "class" , "disabled" , "aria-expanded" , "aria-controls" , "onClick" , "onKeydown" , "severity" , "text" , "outlined" , "size" , "unstyled" , "pt" ] ) , createVNode ( _component _PVSMenu , {
ref : "menu" ,
id : $data . id + "_overlay" ,
model : _ctx . model ,
popup : true ,
autoZIndex : _ctx . autoZIndex ,
baseZIndex : _ctx . baseZIndex ,
appendTo : _ctx . appendTo ,
unstyled : _ctx . unstyled ,
pt : _ctx . ptm ( "pcMenu" )
} , createSlots ( {
_ : 2
} , [ _ctx . $slots . menuitemicon ? {
name : "itemicon" ,
fn : withCtx ( function ( slotProps ) {
return [ renderSlot ( _ctx . $slots , "menuitemicon" , {
item : slotProps . item ,
"class" : normalizeClass ( slotProps [ "class" ] )
} ) ] ;
} ) ,
key : "0"
} : void 0 , _ctx . $slots . item ? {
name : "item" ,
fn : withCtx ( function ( slotProps ) {
return [ renderSlot ( _ctx . $slots , "item" , {
item : slotProps . item ,
hasSubmenu : slotProps . hasSubmenu ,
label : slotProps . label ,
props : slotProps . props
} ) ] ;
} ) ,
key : "1"
2024-10-29 18:14:06 +00:00
} : void 0 ] ) , 1032 , [ "id" , "model" , "autoZIndex" , "baseZIndex" , "appendTo" , "unstyled" , "pt" ] ) ] , 16 , _hoisted _1$4 ) ;
2024-10-28 18:29:38 +00:00
}
2024-10-29 18:14:06 +00:00
_ _name ( render$2 , "render$2" ) ;
script . render = render$2 ;
2024-10-28 18:29:38 +00:00
const minQueueCount = 1 ;
2024-10-29 18:14:06 +00:00
const _sfc _main$5 = /* @__PURE__ */ defineComponent ( {
2024-10-28 18:29:38 +00:00
_ _name : "BatchCountEdit" ,
props : {
class : { default : "" }
} ,
setup ( _ _props ) {
const props = _ _props ;
const queueSettingsStore = useQueueSettingsStore ( ) ;
const { batchCount } = storeToRefs ( queueSettingsStore ) ;
const settingStore = useSettingStore ( ) ;
const maxQueueCount = computed (
( ) => settingStore . get ( "Comfy.QueueButton.BatchCountLimit" )
) ;
const handleClick = /* @__PURE__ */ _ _name ( ( increment ) => {
let newCount ;
if ( increment ) {
const originalCount = batchCount . value - 1 ;
newCount = originalCount * 2 ;
} else {
const originalCount = batchCount . value + 1 ;
newCount = Math . floor ( originalCount / 2 ) ;
}
batchCount . value = newCount ;
} , "handleClick" ) ;
return ( _ctx , _cache ) => {
const _directive _tooltip = resolveDirective ( "tooltip" ) ;
return withDirectives ( ( openBlock ( ) , createElementBlock ( "div" , {
class : normalizeClass ( [ "batch-count" , props . class ] )
} , [
2024-10-29 18:14:06 +00:00
createVNode ( unref ( script$D ) , {
2024-10-28 18:29:38 +00:00
class : "w-14" ,
modelValue : unref ( batchCount ) ,
"onUpdate:modelValue" : _cache [ 0 ] || ( _cache [ 0 ] = ( $event ) => isRef ( batchCount ) ? batchCount . value = $event : null ) ,
min : minQueueCount ,
max : maxQueueCount . value ,
fluid : "" ,
showButtons : "" ,
pt : {
incrementButton : {
class : "w-6" ,
onmousedown : /* @__PURE__ */ _ _name ( ( ) => {
handleClick ( true ) ;
} , "onmousedown" )
} ,
decrementButton : {
class : "w-6" ,
onmousedown : /* @__PURE__ */ _ _name ( ( ) => {
handleClick ( false ) ;
} , "onmousedown" )
}
}
} , null , 8 , [ "modelValue" , "max" , "pt" ] )
] , 2 ) ) , [
[
_directive _tooltip ,
_ctx . $t ( "menu.batchCount" ) ,
void 0 ,
{ bottom : true }
]
] ) ;
} ;
}
} ) ;
2024-10-29 18:14:06 +00:00
const BatchCountEdit = /* @__PURE__ */ _export _sfc ( _sfc _main$5 , [ [ "__scopeId" , "data-v-713442be" ] ] ) ;
2024-11-16 01:17:15 +00:00
const _withScopeId$1 = /* @__PURE__ */ _ _name ( ( n ) => ( pushScopeId ( "data-v-95bc9be0" ) , n = n ( ) , popScopeId ( ) , n ) , "_withScopeId$1" ) ;
2024-10-29 18:14:06 +00:00
const _hoisted _1$3 = { class : "queue-button-group flex" } ;
const _sfc _main$4 = /* @__PURE__ */ defineComponent ( {
2024-10-28 18:29:38 +00:00
_ _name : "ComfyQueueButton" ,
setup ( _ _props ) {
const workspaceStore = useWorkspaceStore ( ) ;
const queueCountStore = storeToRefs ( useQueuePendingTaskCountStore ( ) ) ;
const { mode : queueMode } = storeToRefs ( useQueueSettingsStore ( ) ) ;
const { t } = useI18n ( ) ;
const queueModeMenuItemLookup = {
disabled : {
key : "disabled" ,
label : "Queue" ,
tooltip : t ( "menu.disabledTooltip" ) ,
command : /* @__PURE__ */ _ _name ( ( ) => {
queueMode . value = "disabled" ;
} , "command" )
} ,
instant : {
key : "instant" ,
label : "Queue (Instant)" ,
tooltip : t ( "menu.instantTooltip" ) ,
command : /* @__PURE__ */ _ _name ( ( ) => {
queueMode . value = "instant" ;
} , "command" )
} ,
change : {
key : "change" ,
label : "Queue (Change)" ,
tooltip : t ( "menu.changeTooltip" ) ,
command : /* @__PURE__ */ _ _name ( ( ) => {
queueMode . value = "change" ;
} , "command" )
}
} ;
const activeQueueModeMenuItem = computed (
( ) => queueModeMenuItemLookup [ queueMode . value ]
) ;
const queueModeMenuItems = computed (
( ) => Object . values ( queueModeMenuItemLookup )
) ;
const executingPrompt = computed ( ( ) => ! ! queueCountStore . count . value ) ;
const hasPendingTasks = computed ( ( ) => queueCountStore . count . value > 1 ) ;
const commandStore = useCommandStore ( ) ;
const queuePrompt = /* @__PURE__ */ _ _name ( ( e ) => {
const commandId = e . shiftKey ? "Comfy.QueuePromptFront" : "Comfy.QueuePrompt" ;
commandStore . execute ( commandId ) ;
} , "queuePrompt" ) ;
return ( _ctx , _cache ) => {
2024-10-29 18:14:06 +00:00
const _component _i _lucide58list _start = _ _unplugin _components _0$1 ;
2024-11-16 01:17:15 +00:00
const _component _i _lucide58play = _ _unplugin _components _1$1 ;
const _component _i _lucide58fast _forward = _ _unplugin _components _2 ;
const _component _i _lucide58step _forward = _ _unplugin _components _3 ;
2024-10-28 18:29:38 +00:00
const _directive _tooltip = resolveDirective ( "tooltip" ) ;
2024-10-29 18:14:06 +00:00
return openBlock ( ) , createElementBlock ( "div" , _hoisted _1$3 , [
2024-10-28 18:29:38 +00:00
withDirectives ( ( openBlock ( ) , createBlock ( unref ( script ) , {
class : "comfyui-queue-button" ,
label : activeQueueModeMenuItem . value . label ,
severity : "primary" ,
2024-11-16 01:17:15 +00:00
size : "small" ,
2024-10-28 18:29:38 +00:00
onClick : queuePrompt ,
model : queueModeMenuItems . value ,
"data-testid" : "queue-button"
} , {
icon : withCtx ( ( ) => [
2024-11-16 01:17:15 +00:00
unref ( workspaceStore ) . shiftDown ? ( openBlock ( ) , createBlock ( _component _i _lucide58list _start , { key : 0 } ) ) : unref ( queueMode ) === "disabled" ? ( openBlock ( ) , createBlock ( _component _i _lucide58play , { key : 1 } ) ) : unref ( queueMode ) === "instant" ? ( openBlock ( ) , createBlock ( _component _i _lucide58fast _forward , { key : 2 } ) ) : unref ( queueMode ) === "change" ? ( openBlock ( ) , createBlock ( _component _i _lucide58step _forward , { key : 3 } ) ) : createCommentVNode ( "" , true )
2024-10-28 18:29:38 +00:00
] ) ,
item : withCtx ( ( { item : item3 } ) => [
2024-10-29 18:14:06 +00:00
withDirectives ( createVNode ( unref ( script$f ) , {
2024-10-28 18:29:38 +00:00
label : item3 . label ,
icon : item3 . icon ,
severity : item3 . key === unref ( queueMode ) ? "primary" : "secondary" ,
2024-11-16 01:17:15 +00:00
size : "small" ,
2024-10-28 18:29:38 +00:00
text : ""
} , null , 8 , [ "label" , "icon" , "severity" ] ) , [
[ _directive _tooltip , item3 . tooltip ]
] )
] ) ,
_ : 1
} , 8 , [ "label" , "model" ] ) ) , [
[
_directive _tooltip ,
unref ( workspaceStore ) . shiftDown ? _ctx . $t ( "menu.queueWorkflowFront" ) : _ctx . $t ( "menu.queueWorkflow" ) ,
void 0 ,
{ bottom : true }
]
] ) ,
createVNode ( BatchCountEdit ) ,
createVNode ( unref ( script$7 ) , { class : "execution-actions flex flex-nowrap" } , {
default : withCtx ( ( ) => [
2024-10-29 18:14:06 +00:00
withDirectives ( createVNode ( unref ( script$f ) , {
2024-10-28 18:29:38 +00:00
icon : "pi pi-times" ,
severity : executingPrompt . value ? "danger" : "secondary" ,
disabled : ! executingPrompt . value ,
text : "" ,
onClick : _cache [ 0 ] || ( _cache [ 0 ] = ( ) => unref ( commandStore ) . execute ( "Comfy.Interrupt" ) )
} , null , 8 , [ "severity" , "disabled" ] ) , [
[
_directive _tooltip ,
_ctx . $t ( "menu.interrupt" ) ,
void 0 ,
{ bottom : true }
]
] ) ,
2024-10-29 18:14:06 +00:00
withDirectives ( createVNode ( unref ( script$f ) , {
2024-10-28 18:29:38 +00:00
icon : "pi pi-stop" ,
severity : hasPendingTasks . value ? "danger" : "secondary" ,
disabled : ! hasPendingTasks . value ,
text : "" ,
onClick : _cache [ 1 ] || ( _cache [ 1 ] = ( ) => unref ( commandStore ) . execute ( "Comfy.ClearPendingTasks" ) )
} , null , 8 , [ "severity" , "disabled" ] ) , [
[
_directive _tooltip ,
_ctx . $t ( "sideToolbar.queueTab.clearPendingTasks" ) ,
void 0 ,
{ bottom : true }
]
] )
] ) ,
_ : 1
} )
] ) ;
} ;
}
} ) ;
2024-11-16 01:17:15 +00:00
const ComfyQueueButton = /* @__PURE__ */ _export _sfc ( _sfc _main$4 , [ [ "__scopeId" , "data-v-95bc9be0" ] ] ) ;
2024-10-28 18:29:38 +00:00
const overlapThreshold = 20 ;
2024-10-29 18:14:06 +00:00
const _sfc _main$3 = /* @__PURE__ */ defineComponent ( {
2024-10-28 18:29:38 +00:00
_ _name : "ComfyActionbar" ,
setup ( _ _props ) {
const settingsStore = useSettingStore ( ) ;
const visible = computed (
( ) => settingsStore . get ( "Comfy.UseNewMenu" ) !== "Disabled"
) ;
const panelRef = ref ( null ) ;
const dragHandleRef = ref ( null ) ;
const isDocked = useLocalStorage ( "Comfy.MenuPosition.Docked" , false ) ;
const storedPosition = useLocalStorage ( "Comfy.MenuPosition.Floating" , {
x : 0 ,
y : 0
} ) ;
const {
x ,
y ,
style ,
isDragging
} = useDraggable ( panelRef , {
initialValue : { x : 0 , y : 0 } ,
handle : dragHandleRef ,
containerElement : document . body
} ) ;
watchDebounced (
[ x , y ] ,
( [ newX , newY ] ) => {
storedPosition . value = { x : newX , y : newY } ;
} ,
{ debounce : 300 }
) ;
const setInitialPosition = /* @__PURE__ */ _ _name ( ( ) => {
if ( x . value !== 0 || y . value !== 0 ) {
return ;
}
if ( storedPosition . value . x !== 0 || storedPosition . value . y !== 0 ) {
x . value = storedPosition . value . x ;
y . value = storedPosition . value . y ;
captureLastDragState ( ) ;
return ;
}
if ( panelRef . value ) {
const screenWidth = window . innerWidth ;
const screenHeight = window . innerHeight ;
const menuWidth = panelRef . value . offsetWidth ;
const menuHeight = panelRef . value . offsetHeight ;
if ( menuWidth === 0 || menuHeight === 0 ) {
return ;
}
x . value = ( screenWidth - menuWidth ) / 2 ;
y . value = screenHeight - menuHeight - 10 ;
captureLastDragState ( ) ;
}
} , "setInitialPosition" ) ;
onMounted ( setInitialPosition ) ;
watch ( visible , ( newVisible ) => {
if ( newVisible ) {
nextTick ( setInitialPosition ) ;
}
} ) ;
const lastDragState = ref ( {
x : x . value ,
y : y . value ,
windowWidth : window . innerWidth ,
windowHeight : window . innerHeight
} ) ;
const captureLastDragState = /* @__PURE__ */ _ _name ( ( ) => {
lastDragState . value = {
x : x . value ,
y : y . value ,
windowWidth : window . innerWidth ,
windowHeight : window . innerHeight
} ;
} , "captureLastDragState" ) ;
watch (
isDragging ,
( newIsDragging ) => {
if ( ! newIsDragging ) {
captureLastDragState ( ) ;
}
} ,
{ immediate : true }
) ;
const adjustMenuPosition = /* @__PURE__ */ _ _name ( ( ) => {
if ( panelRef . value ) {
const screenWidth = window . innerWidth ;
const screenHeight = window . innerHeight ;
const menuWidth = panelRef . value . offsetWidth ;
const menuHeight = panelRef . value . offsetHeight ;
const distanceRight = lastDragState . value . windowWidth - ( lastDragState . value . x + menuWidth ) ;
const distanceBottom = lastDragState . value . windowHeight - ( lastDragState . value . y + menuHeight ) ;
const anchorRight = distanceRight < lastDragState . value . x ;
const anchorBottom = distanceBottom < lastDragState . value . y ;
if ( anchorRight ) {
x . value = screenWidth - ( lastDragState . value . windowWidth - lastDragState . value . x ) ;
} else {
x . value = lastDragState . value . x ;
}
if ( anchorBottom ) {
y . value = screenHeight - ( lastDragState . value . windowHeight - lastDragState . value . y ) ;
} else {
y . value = lastDragState . value . y ;
}
x . value = lodashExports . clamp ( x . value , 0 , screenWidth - menuWidth ) ;
y . value = lodashExports . clamp ( y . value , 0 , screenHeight - menuHeight ) ;
}
} , "adjustMenuPosition" ) ;
useEventListener ( window , "resize" , adjustMenuPosition ) ;
const topMenuRef = inject ( "topMenuRef" ) ;
const topMenuBounds = useElementBounding ( topMenuRef ) ;
const isOverlappingWithTopMenu = computed ( ( ) => {
if ( ! panelRef . value ) {
return false ;
}
const { height } = panelRef . value . getBoundingClientRect ( ) ;
const actionbarBottom = y . value + height ;
const topMenuBottom = topMenuBounds . bottom . value ;
const overlapPixels = Math . min ( actionbarBottom , topMenuBottom ) - Math . max ( y . value , topMenuBounds . top . value ) ;
return overlapPixels > overlapThreshold ;
} ) ;
watch ( isDragging , ( newIsDragging ) => {
if ( ! newIsDragging ) {
isDocked . value = isOverlappingWithTopMenu . value ;
} else {
isDocked . value = false ;
}
} ) ;
const eventBus = useEventBus ( "topMenu" ) ;
watch ( [ isDragging , isOverlappingWithTopMenu ] , ( [ dragging , overlapping ] ) => {
eventBus . emit ( "updateHighlight" , {
isDragging : dragging ,
isOverlapping : overlapping
} ) ;
} ) ;
return ( _ctx , _cache ) => {
return openBlock ( ) , createBlock ( unref ( script$4 ) , {
class : normalizeClass ( [ "actionbar w-fit" , { "is-dragging" : unref ( isDragging ) , "is-docked" : unref ( isDocked ) } ] ) ,
style : normalizeStyle ( unref ( style ) )
} , {
default : withCtx ( ( ) => [
createBaseVNode ( "div" , {
class : "actionbar-content flex items-center" ,
ref _key : "panelRef" ,
ref : panelRef
} , [
createBaseVNode ( "span" , {
class : "drag-handle cursor-move mr-2 p-0!" ,
ref _key : "dragHandleRef" ,
ref : dragHandleRef
} , null , 512 ) ,
2024-11-16 01:17:15 +00:00
createVNode ( ComfyQueueButton )
2024-10-28 18:29:38 +00:00
] , 512 )
] ) ,
_ : 1
} , 8 , [ "style" , "class" ] ) ;
} ;
}
} ) ;
2024-11-16 01:17:15 +00:00
const Actionbar = /* @__PURE__ */ _export _sfc ( _sfc _main$3 , [ [ "__scopeId" , "data-v-eb6e9acf" ] ] ) ;
2024-10-29 18:14:06 +00:00
const _hoisted _1$2 = {
viewBox : "0 0 24 24" ,
width : "1.2em" ,
height : "1.2em"
} ;
const _hoisted _2$2 = /* @__PURE__ */ createBaseVNode ( "path" , {
fill : "currentColor" ,
d : "M5 21q-.825 0-1.412-.587T3 19V5q0-.825.588-1.412T5 3h14q.825 0 1.413.588T21 5v14q0 .825-.587 1.413T19 21zm0-5v3h14v-3zm0-2h14V5H5zm0 2v3z"
} , null , - 1 ) ;
const _hoisted _3$1 = [
_hoisted _2$2
] ;
function render$1 ( _ctx , _cache ) {
return openBlock ( ) , createElementBlock ( "svg" , _hoisted _1$2 , [ ... _hoisted _3$1 ] ) ;
}
_ _name ( render$1 , "render$1" ) ;
const _ _unplugin _components _1 = markRaw ( { name : "material-symbols-dock-to-bottom-outline" , render : render$1 } ) ;
const _hoisted _1$1 = {
viewBox : "0 0 24 24" ,
width : "1.2em" ,
height : "1.2em"
} ;
const _hoisted _2$1 = /* @__PURE__ */ createBaseVNode ( "path" , {
fill : "currentColor" ,
d : "M5 21q-.825 0-1.412-.587T3 19V5q0-.825.588-1.412T5 3h14q.825 0 1.413.588T21 5v14q0 .825-.587 1.413T19 21zm0-7h14V5H5z"
} , null , - 1 ) ;
const _hoisted _3 = [
_hoisted _2$1
] ;
function render ( _ctx , _cache ) {
return openBlock ( ) , createElementBlock ( "svg" , _hoisted _1$1 , [ ... _hoisted _3 ] ) ;
}
_ _name ( render , "render" ) ;
const _ _unplugin _components _0 = markRaw ( { name : "material-symbols-dock-to-bottom" , render } ) ;
const _sfc _main$2 = /* @__PURE__ */ defineComponent ( {
_ _name : "BottomPanelToggleButton" ,
setup ( _ _props ) {
const bottomPanelStore = useBottomPanelStore ( ) ;
return ( _ctx , _cache ) => {
const _component _i _material _symbols58dock _to _bottom = _ _unplugin _components _0 ;
const _component _i _material _symbols58dock _to _bottom _outline = _ _unplugin _components _1 ;
const _directive _tooltip = resolveDirective ( "tooltip" ) ;
return withDirectives ( ( openBlock ( ) , createBlock ( unref ( script$f ) , {
severity : "secondary" ,
text : "" ,
onClick : unref ( bottomPanelStore ) . toggleBottomPanel
} , {
icon : withCtx ( ( ) => [
unref ( bottomPanelStore ) . bottomPanelVisible ? ( openBlock ( ) , createBlock ( _component _i _material _symbols58dock _to _bottom , { key : 0 } ) ) : ( openBlock ( ) , createBlock ( _component _i _material _symbols58dock _to _bottom _outline , { key : 1 } ) )
] ) ,
_ : 1
} , 8 , [ "onClick" ] ) ) , [
[ vShow , unref ( bottomPanelStore ) . bottomPanelTabs . length > 0 ] ,
[ _directive _tooltip , { value : _ctx . $t ( "menu.toggleBottomPanel" ) , showDelay : 300 } ]
] ) ;
} ;
}
} ) ;
2024-11-16 01:17:15 +00:00
const _withScopeId = /* @__PURE__ */ _ _name ( ( n ) => ( pushScopeId ( "data-v-d84a704d" ) , n = n ( ) , popScopeId ( ) , n ) , "_withScopeId" ) ;
2024-10-28 18:29:38 +00:00
const _hoisted _1 = /* @__PURE__ */ _withScopeId ( ( ) => /* @__PURE__ */ createBaseVNode ( "h1" , { class : "comfyui-logo mx-2" } , "ComfyUI" , - 1 ) ) ;
const _hoisted _2 = { class : "flex-grow" } ;
const _sfc _main$1 = /* @__PURE__ */ defineComponent ( {
_ _name : "TopMenubar" ,
setup ( _ _props ) {
2024-11-16 01:17:15 +00:00
const workspaceState = useWorkspaceStore ( ) ;
2024-10-28 18:29:38 +00:00
const settingStore = useSettingStore ( ) ;
const workflowTabsPosition = computed (
( ) => settingStore . get ( "Comfy.Workflow.WorkflowTabsPosition" )
) ;
const betaMenuEnabled = computed (
( ) => settingStore . get ( "Comfy.UseNewMenu" ) !== "Disabled"
) ;
const teleportTarget = computed (
( ) => settingStore . get ( "Comfy.UseNewMenu" ) === "Top" ? ".comfyui-body-top" : ".comfyui-body-bottom"
) ;
const menuRight = ref ( null ) ;
onMounted ( ( ) => {
if ( menuRight . value ) {
menuRight . value . appendChild ( app . menu . element ) ;
}
} ) ;
const topMenuRef = ref ( null ) ;
provide ( "topMenuRef" , topMenuRef ) ;
const eventBus = useEventBus ( "topMenu" ) ;
const isDropZone = ref ( false ) ;
const isDroppable = ref ( false ) ;
eventBus . on ( ( event , payload ) => {
if ( event === "updateHighlight" ) {
isDropZone . value = payload . isDragging ;
isDroppable . value = payload . isOverlapping && payload . isDragging ;
}
} ) ;
return ( _ctx , _cache ) => {
2024-11-16 01:17:15 +00:00
const _directive _tooltip = resolveDirective ( "tooltip" ) ;
2024-10-28 18:29:38 +00:00
return openBlock ( ) , createBlock ( Teleport , { to : teleportTarget . value } , [
withDirectives ( createBaseVNode ( "div" , {
ref _key : "topMenuRef" ,
ref : topMenuRef ,
class : normalizeClass ( [ "comfyui-menu flex items-center" , { dropzone : isDropZone . value , "dropzone-active" : isDroppable . value } ] )
} , [
_hoisted _1 ,
createVNode ( CommandMenubar ) ,
2024-10-29 18:14:06 +00:00
createVNode ( unref ( script$E ) , {
2024-10-28 18:29:38 +00:00
layout : "vertical" ,
class : "mx-2"
} ) ,
createBaseVNode ( "div" , _hoisted _2 , [
workflowTabsPosition . value === "Topbar" ? ( openBlock ( ) , createBlock ( WorkflowTabs , { key : 0 } ) ) : createCommentVNode ( "" , true )
] ) ,
createBaseVNode ( "div" , {
class : "comfyui-menu-right" ,
ref _key : "menuRight" ,
ref : menuRight
} , null , 512 ) ,
2024-10-29 18:14:06 +00:00
createVNode ( Actionbar ) ,
2024-11-16 01:17:15 +00:00
createVNode ( _sfc _main$2 ) ,
withDirectives ( createVNode ( unref ( script$f ) , {
icon : "pi pi-bars" ,
severity : "secondary" ,
text : "" ,
onClick : _cache [ 0 ] || ( _cache [ 0 ] = ( $event ) => unref ( workspaceState ) . focusMode = true )
} , null , 512 ) , [
[ _directive _tooltip , { value : _ctx . $t ( "menu.hideMenu" ) , showDelay : 300 } ]
] )
2024-10-28 18:29:38 +00:00
] , 2 ) , [
2024-11-16 01:17:15 +00:00
[ vShow , betaMenuEnabled . value && ! unref ( workspaceState ) . focusMode ]
2024-10-28 18:29:38 +00:00
] )
] , 8 , [ "to" ] ) ;
} ;
}
} ) ;
2024-11-16 01:17:15 +00:00
const TopMenubar = /* @__PURE__ */ _export _sfc ( _sfc _main$1 , [ [ "__scopeId" , "data-v-d84a704d" ] ] ) ;
2024-10-28 18:29:38 +00:00
function setupAutoQueueHandler ( ) {
const queueCountStore = useQueuePendingTaskCountStore ( ) ;
const queueSettingsStore = useQueueSettingsStore ( ) ;
let graphHasChanged = false ;
let internalCount = 0 ;
api . addEventListener ( "graphChanged" , ( ) => {
if ( queueSettingsStore . mode === "change" ) {
if ( internalCount ) {
graphHasChanged = true ;
} else {
graphHasChanged = false ;
app . queuePrompt ( 0 , queueSettingsStore . batchCount ) ;
internalCount ++ ;
}
}
} ) ;
queueCountStore . $subscribe (
( ) => {
internalCount = queueCountStore . count ;
if ( ! internalCount && ! app . lastExecutionError ) {
if ( queueSettingsStore . mode === "instant" || queueSettingsStore . mode === "change" && graphHasChanged ) {
graphHasChanged = false ;
app . queuePrompt ( 0 , queueSettingsStore . batchCount ) ;
}
}
} ,
{ detached : true }
) ;
}
_ _name ( setupAutoQueueHandler , "setupAutoQueueHandler" ) ;
const _sfc _main = /* @__PURE__ */ defineComponent ( {
_ _name : "GraphView" ,
setup ( _ _props ) {
setupAutoQueueHandler ( ) ;
const { t } = useI18n ( ) ;
const toast = useToast ( ) ;
const settingStore = useSettingStore ( ) ;
const executionStore = useExecutionStore ( ) ;
const theme11 = computed ( ( ) => settingStore . get ( "Comfy.ColorPalette" ) ) ;
watch (
theme11 ,
( newTheme ) => {
const DARK _THEME _CLASS = "dark-theme" ;
const isDarkTheme = newTheme !== "light" ;
if ( isDarkTheme ) {
document . body . classList . add ( DARK _THEME _CLASS ) ;
} else {
document . body . classList . remove ( DARK _THEME _CLASS ) ;
}
} ,
{ immediate : true }
) ;
watchEffect ( ( ) => {
const fontSize = settingStore . get ( "Comfy.TextareaWidget.FontSize" ) ;
document . documentElement . style . setProperty (
"--comfy-textarea-font-size" ,
` ${ fontSize } px `
) ;
} ) ;
watchEffect ( ( ) => {
const padding = settingStore . get ( "Comfy.TreeExplorer.ItemPadding" ) ;
document . documentElement . style . setProperty (
"--comfy-tree-explorer-item-padding" ,
` ${ padding } px `
) ;
} ) ;
watchEffect ( ( ) => {
const locale = settingStore . get ( "Comfy.Locale" ) ;
if ( locale ) {
i18n . global . locale . value = locale ;
}
} ) ;
watchEffect ( ( ) => {
const useNewMenu = settingStore . get ( "Comfy.UseNewMenu" ) ;
if ( useNewMenu === "Disabled" ) {
app . ui . menuContainer . style . removeProperty ( "display" ) ;
app . ui . restoreMenuPosition ( ) ;
} else {
app . ui . menuContainer . style . setProperty ( "display" , "none" ) ;
}
} ) ;
const init = /* @__PURE__ */ _ _name ( ( ) => {
settingStore . addSettings ( app . ui . settings ) ;
useKeybindingStore ( ) . loadCoreKeybindings ( ) ;
useSidebarTabStore ( ) . registerCoreSidebarTabs ( ) ;
2024-10-29 18:14:06 +00:00
useBottomPanelStore ( ) . registerCoreBottomPanelTabs ( ) ;
2024-10-28 18:29:38 +00:00
app . extensionManager = useWorkspaceStore ( ) ;
} , "init" ) ;
const queuePendingTaskCountStore = useQueuePendingTaskCountStore ( ) ;
const onStatus = /* @__PURE__ */ _ _name ( ( e ) => {
queuePendingTaskCountStore . update ( e ) ;
} , "onStatus" ) ;
const reconnectingMessage = {
severity : "error" ,
summary : t ( "reconnecting" )
} ;
const onReconnecting = /* @__PURE__ */ _ _name ( ( ) => {
toast . remove ( reconnectingMessage ) ;
toast . add ( reconnectingMessage ) ;
} , "onReconnecting" ) ;
const onReconnected = /* @__PURE__ */ _ _name ( ( ) => {
toast . remove ( reconnectingMessage ) ;
toast . add ( {
severity : "success" ,
summary : t ( "reconnected" ) ,
life : 2e3
} ) ;
} , "onReconnected" ) ;
onMounted ( ( ) => {
api . addEventListener ( "status" , onStatus ) ;
api . addEventListener ( "reconnecting" , onReconnecting ) ;
api . addEventListener ( "reconnected" , onReconnected ) ;
executionStore . bindExecutionEvents ( ) ;
try {
init ( ) ;
} catch ( e ) {
console . error ( "Failed to init ComfyUI frontend" , e ) ;
}
} ) ;
onBeforeUnmount ( ( ) => {
api . removeEventListener ( "status" , onStatus ) ;
api . removeEventListener ( "reconnecting" , onReconnecting ) ;
api . removeEventListener ( "reconnected" , onReconnected ) ;
executionStore . unbindExecutionEvents ( ) ;
} ) ;
const onGraphReady = /* @__PURE__ */ _ _name ( ( ) => {
requestIdleCallback (
( ) => {
useKeybindingStore ( ) . loadUserKeybindings ( ) ;
2024-11-16 01:17:15 +00:00
useModelStore ( ) . loadModelFolders ( ) ;
2024-10-28 18:29:38 +00:00
useNodeBookmarkStore ( ) . migrateLegacyBookmarks ( ) ;
useNodeDefStore ( ) . nodeSearchService . endsWithFilterStartSequence ( "" ) ;
useNodeFrequencyStore ( ) . loadNodeFrequencies ( ) ;
} ,
{ timeout : 1e3 }
) ;
} , "onGraphReady" ) ;
return ( _ctx , _cache ) => {
return openBlock ( ) , createElementBlock ( Fragment , null , [
createVNode ( TopMenubar ) ,
2024-11-16 01:17:15 +00:00
createVNode ( _sfc _main$c , { onReady : onGraphReady } ) ,
2024-10-29 18:14:06 +00:00
createVNode ( _sfc _main$a ) ,
2024-10-28 18:29:38 +00:00
createVNode ( _sfc _main$9 ) ,
2024-11-16 01:17:15 +00:00
createVNode ( _sfc _main$8 ) ,
createVNode ( MenuHamburger )
2024-10-28 18:29:38 +00:00
] , 64 ) ;
} ;
}
} ) ;
export {
_sfc _main as default
} ;
2024-11-16 01:17:15 +00:00
//# sourceMappingURL=GraphView-BCOd0Zle.js.map