refactor(LoraCyclerWidget): UI/UX improvements

- Replace REP badge with segmented progress bar for repeat indicator
- Reorganize Starting Index & Repeat controls into aligned groups
- Change repeat format from '× [count] times' to '[count] ×' for better alignment
- Remove unnecessary refresh button and related logic
This commit is contained in:
Will Miao
2026-02-01 20:00:30 +08:00
parent db1aec94e5
commit 71c8cf84e0
4 changed files with 379 additions and 403 deletions

View File

@@ -23,7 +23,6 @@
@update:repeat-count="handleRepeatCountChange" @update:repeat-count="handleRepeatCountChange"
@toggle-pause="handleTogglePause" @toggle-pause="handleTogglePause"
@reset-index="handleResetIndex" @reset-index="handleResetIndex"
@refresh="handleRefresh"
/> />
</div> </div>
</template> </template>
@@ -136,16 +135,6 @@ const handleUseCustomClipRangeChange = (newValue: boolean) => {
} }
} }
// Handle refresh button click
const handleRefresh = async () => {
try {
const poolConfig = getPoolConfig()
await state.refreshList(poolConfig)
} catch (error) {
console.error('[LoraCyclerWidget] Error refreshing:', error)
}
}
// Handle repeat count change // Handle repeat count change
const handleRepeatCountChange = (newValue: number) => { const handleRepeatCountChange = (newValue: number) => {
state.repeatCount.value = newValue state.repeatCount.value = newValue

View File

@@ -16,97 +16,92 @@
<span class="progress-separator">/</span> <span class="progress-separator">/</span>
<span class="progress-total">{{ totalCount }}</span> <span class="progress-total">{{ totalCount }}</span>
<!-- Repeat indicator (only shown when repeatCount > 1) --> <!-- Repeat progress indicator (only shown when repeatCount > 1) -->
<div v-if="repeatCount > 1" class="repeat-badge"> <div v-if="repeatCount > 1" class="repeat-progress">
<span class="repeat-badge-label">Rep</span> <div class="repeat-progress-track">
<span class="repeat-badge-value">{{ repeatUsed }}/{{ repeatCount }}</span> <div
class="repeat-progress-fill"
:style="{ width: `${(repeatUsed / repeatCount) * 100}%` }"
:class="{ 'is-complete': repeatUsed >= repeatCount }"
></div>
</div>
<span class="repeat-progress-text">{{ repeatUsed }}/{{ repeatCount }}</span>
</div> </div>
<button
class="refresh-button"
:disabled="isLoading"
@click="$emit('refresh')"
title="Refresh list"
>
<svg
class="refresh-icon"
:class="{ spinning: isLoading }"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
>
<path d="M21 12a9 9 0 1 1-6.219-8.56"/>
<path d="M21 3v5h-5"/>
</svg>
</button>
</div> </div>
</div> </div>
</div> </div>
<!-- Starting Index with Advanced Controls --> <!-- Starting Index with Advanced Controls -->
<div class="setting-section"> <div class="setting-section">
<label class="setting-label">Starting Index</label>
<div class="index-controls-row"> <div class="index-controls-row">
<!-- Index input --> <!-- Left: Index group -->
<input <div class="control-group">
type="number" <label class="control-group-label">Starting Index</label>
class="index-input" <div class="control-group-content">
:min="1" <input
:max="totalCount || 1" type="number"
:value="currentIndex" class="index-input"
:disabled="totalCount === 0" :min="1"
@input="onIndexInput" :max="totalCount || 1"
@blur="onIndexBlur" :value="currentIndex"
@pointerdown.stop :disabled="totalCount === 0"
@pointermove.stop @input="onIndexInput"
@pointerup.stop @blur="onIndexBlur"
/> @pointerdown.stop
<span class="index-hint">1 - {{ totalCount || 1 }}</span> @pointermove.stop
@pointerup.stop
/>
<span class="index-hint">/ {{ totalCount || 1 }}</span>
</div>
</div>
<!-- Repeat control --> <!-- Right: Repeat group -->
<span class="repeat-label">x</span> <div class="control-group">
<input <label class="control-group-label">Repeat</label>
type="number" <div class="control-group-content">
class="repeat-input" <input
min="1" type="number"
max="99" class="repeat-input"
:value="repeatCount" min="1"
@input="onRepeatInput" max="99"
@blur="onRepeatBlur" :value="repeatCount"
@pointerdown.stop @input="onRepeatInput"
@pointermove.stop @blur="onRepeatBlur"
@pointerup.stop @pointerdown.stop
title="Repeat each LoRA this many times" @pointermove.stop
/> @pointerup.stop
<span class="repeat-hint">times</span> title="Each LoRA will be used this many times before moving to the next"
/>
<span class="repeat-suffix">×</span>
</div>
</div>
<!-- Control buttons --> <!-- Action buttons -->
<button <div class="action-buttons">
class="control-btn" <button
:class="{ active: isPaused }" class="control-btn"
:disabled="isPauseDisabled" :class="{ active: isPaused }"
@click="$emit('toggle-pause')" :disabled="isPauseDisabled"
:title="isPauseDisabled ? 'Cannot pause while prompts are queued' : (isPaused ? 'Continue iteration' : 'Pause iteration')" @click="$emit('toggle-pause')"
> :title="isPauseDisabled ? 'Cannot pause while prompts are queued' : (isPaused ? 'Continue iteration' : 'Pause iteration')"
<svg v-if="isPaused" viewBox="0 0 24 24" fill="currentColor" class="control-icon"> >
<path d="M8 5v14l11-7z"/> <svg v-if="isPaused" viewBox="0 0 24 24" fill="currentColor" class="control-icon">
</svg> <path d="M8 5v14l11-7z"/>
<svg v-else viewBox="0 0 24 24" fill="currentColor" class="control-icon"> </svg>
<path d="M6 4h4v16H6zm8 0h4v16h-4z"/> <svg v-else viewBox="0 0 24 24" fill="currentColor" class="control-icon">
</svg> <path d="M6 4h4v16H6zm8 0h4v16h-4z"/>
</button> </svg>
<button </button>
class="control-btn" <button
@click="$emit('reset-index')" class="control-btn"
title="Reset to index 1" @click="$emit('reset-index')"
> title="Reset to index 1"
<svg viewBox="0 0 24 24" fill="currentColor" class="control-icon"> >
<path d="M12 5V1L7 6l5 5V7c3.31 0 6 2.69 6 6s-2.69 6-6 6-6-2.69-6-6H4c0 4.42 3.58 8 8 8s8-3.58 8-8-3.58-8-8-8z"/> <svg viewBox="0 0 24 24" fill="currentColor" class="control-icon">
</svg> <path d="M12 5V1L7 6l5 5V7c3.31 0 6 2.69 6 6s-2.69 6-6 6-6-2.69-6-6H4c0 4.42 3.58 8 8 8s8-3.58 8-8-3.58-8-8-8z"/>
</button> </svg>
</button>
</div>
</div> </div>
</div> </div>
@@ -172,7 +167,6 @@ const props = defineProps<{
clipStrength: number clipStrength: number
useCustomClipRange: boolean useCustomClipRange: boolean
isClipStrengthDisabled: boolean isClipStrengthDisabled: boolean
isLoading: boolean
repeatCount: number repeatCount: number
repeatUsed: number repeatUsed: number
isPaused: boolean isPaused: boolean
@@ -189,7 +183,6 @@ const emit = defineEmits<{
'update:repeatCount': [value: number] 'update:repeatCount': [value: number]
'toggle-pause': [] 'toggle-pause': []
'reset-index': [] 'reset-index': []
'refresh': []
}>() }>()
// Temporary value for input while typing // Temporary value for input while typing
@@ -354,94 +347,87 @@ const onRepeatBlur = (event: Event) => {
font-variant-numeric: tabular-nums; font-variant-numeric: tabular-nums;
} }
.refresh-button { /* Repeat Progress */
.repeat-progress {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; gap: 6px;
width: 24px;
height: 24px;
margin-left: 8px;
padding: 0;
background: transparent;
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 4px;
color: rgba(226, 232, 240, 0.6);
cursor: pointer;
transition: all 0.2s;
}
.refresh-button:hover:not(:disabled) {
background: rgba(66, 153, 225, 0.2);
border-color: rgba(66, 153, 225, 0.4);
color: rgba(191, 219, 254, 1);
}
.refresh-button:disabled {
opacity: 0.4;
cursor: not-allowed;
}
.refresh-icon {
width: 14px;
height: 14px;
}
.refresh-icon.spinning {
animation: spin 1s linear infinite;
}
@keyframes spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
/* Repeat Badge */
.repeat-badge {
display: flex;
align-items: center;
gap: 4px;
margin-left: 8px; margin-left: 8px;
padding: 2px 6px; padding: 2px 6px;
background: rgba(245, 158, 11, 0.15); background: rgba(26, 32, 44, 0.6);
border: 1px solid rgba(245, 158, 11, 0.3); border: 1px solid rgba(226, 232, 240, 0.1);
border-radius: 4px; border-radius: 4px;
} }
.repeat-badge-label { .repeat-progress-track {
font-size: 10px; width: 32px;
color: rgba(253, 230, 138, 0.7); height: 4px;
text-transform: uppercase; background: rgba(226, 232, 240, 0.15);
border-radius: 2px;
overflow: hidden;
} }
.repeat-badge-value { .repeat-progress-fill {
font-size: 12px; height: 100%;
background: linear-gradient(90deg, #f59e0b, #fbbf24);
border-radius: 2px;
transition: width 0.3s ease;
}
.repeat-progress-fill.is-complete {
background: linear-gradient(90deg, #10b981, #34d399);
}
.repeat-progress-text {
font-size: 10px;
font-family: 'SF Mono', 'Roboto Mono', monospace; font-family: 'SF Mono', 'Roboto Mono', monospace;
color: rgba(253, 230, 138, 1); color: rgba(253, 230, 138, 0.9);
min-width: 3ch; min-width: 3ch;
font-variant-numeric: tabular-nums; font-variant-numeric: tabular-nums;
} }
/* Index Controls Row */ /* Index Controls Row - Grouped Layout */
.index-controls-row { .index-controls-row {
display: flex; display: flex;
align-items: center; align-items: flex-end;
gap: 8px; gap: 16px;
flex-wrap: wrap; }
/* Control Group */
.control-group {
display: flex;
flex-direction: column;
gap: 6px;
}
.control-group-label {
font-size: 11px;
font-weight: 500;
color: rgba(226, 232, 240, 0.5);
text-transform: uppercase;
letter-spacing: 0.03em;
line-height: 1;
}
.control-group-content {
display: flex;
align-items: baseline;
gap: 4px;
height: 32px;
} }
.index-input { .index-input {
width: 60px; width: 50px;
padding: 6px 8px; height: 32px;
padding: 0 8px;
background: rgba(26, 32, 44, 0.9); background: rgba(26, 32, 44, 0.9);
border: 1px solid rgba(226, 232, 240, 0.2); border: 1px solid rgba(226, 232, 240, 0.2);
border-radius: 6px; border-radius: 6px;
color: #e4e4e7; color: #e4e4e7;
font-size: 13px; font-size: 13px;
font-family: 'SF Mono', 'Roboto Mono', monospace; font-family: 'SF Mono', 'Roboto Mono', monospace;
line-height: 32px;
box-sizing: border-box;
} }
.index-input:focus { .index-input:focus {
@@ -455,22 +441,17 @@ const onRepeatBlur = (event: Event) => {
} }
.index-hint { .index-hint {
font-size: 11px; font-size: 12px;
color: rgba(226, 232, 240, 0.4); color: rgba(226, 232, 240, 0.4);
min-width: 7ch;
font-variant-numeric: tabular-nums; font-variant-numeric: tabular-nums;
line-height: 32px;
} }
/* Repeat Controls */ /* Repeat Controls */
.repeat-label {
font-size: 13px;
color: rgba(226, 232, 240, 0.6);
margin-left: 4px;
}
.repeat-input { .repeat-input {
width: 44px; width: 40px;
padding: 6px 6px; height: 32px;
padding: 0 6px;
background: rgba(26, 32, 44, 0.9); background: rgba(26, 32, 44, 0.9);
border: 1px solid rgba(226, 232, 240, 0.2); border: 1px solid rgba(226, 232, 240, 0.2);
border-radius: 6px; border-radius: 6px;
@@ -478,6 +459,8 @@ const onRepeatBlur = (event: Event) => {
font-size: 13px; font-size: 13px;
font-family: 'SF Mono', 'Roboto Mono', monospace; font-family: 'SF Mono', 'Roboto Mono', monospace;
text-align: center; text-align: center;
line-height: 32px;
box-sizing: border-box;
} }
.repeat-input:focus { .repeat-input:focus {
@@ -485,9 +468,19 @@ const onRepeatBlur = (event: Event) => {
border-color: rgba(66, 153, 225, 0.6); border-color: rgba(66, 153, 225, 0.6);
} }
.repeat-hint { .repeat-suffix {
font-size: 11px; font-size: 13px;
color: rgba(226, 232, 240, 0.4); color: rgba(226, 232, 240, 0.4);
font-weight: 500;
line-height: 32px;
}
/* Action Buttons */
.action-buttons {
display: flex;
align-items: center;
gap: 6px;
margin-left: auto;
} }
/* Control Buttons */ /* Control Buttons */

View File

@@ -1464,16 +1464,16 @@ to { transform: rotate(360deg);
box-sizing: border-box; box-sizing: border-box;
} }
.cycler-settings[data-v-9be19e47] { .cycler-settings[data-v-a14881ad] {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
color: #e4e4e7; color: #e4e4e7;
} }
.settings-header[data-v-9be19e47] { .settings-header[data-v-a14881ad] {
margin-bottom: 8px; margin-bottom: 8px;
} }
.settings-title[data-v-9be19e47] { .settings-title[data-v-a14881ad] {
font-size: 10px; font-size: 10px;
font-weight: 600; font-weight: 600;
letter-spacing: 0.05em; letter-spacing: 0.05em;
@@ -1482,10 +1482,10 @@ to { transform: rotate(360deg);
margin: 0; margin: 0;
text-transform: uppercase; text-transform: uppercase;
} }
.setting-section[data-v-9be19e47] { .setting-section[data-v-a14881ad] {
margin-bottom: 8px; margin-bottom: 8px;
} }
.setting-label[data-v-9be19e47] { .setting-label[data-v-a14881ad] {
font-size: 13px; font-size: 13px;
font-weight: 500; font-weight: 500;
color: rgba(226, 232, 240, 0.8); color: rgba(226, 232, 240, 0.8);
@@ -1494,10 +1494,10 @@ to { transform: rotate(360deg);
} }
/* Progress Display */ /* Progress Display */
.progress-section[data-v-9be19e47] { .progress-section[data-v-a14881ad] {
margin-bottom: 12px; margin-bottom: 12px;
} }
.progress-display[data-v-9be19e47] { .progress-display[data-v-a14881ad] {
background: rgba(26, 32, 44, 0.9); background: rgba(26, 32, 44, 0.9);
border: 1px solid rgba(226, 232, 240, 0.2); border: 1px solid rgba(226, 232, 240, 0.2);
border-radius: 6px; border-radius: 6px;
@@ -1507,31 +1507,31 @@ to { transform: rotate(360deg);
align-items: center; align-items: center;
transition: border-color 0.3s ease; transition: border-color 0.3s ease;
} }
.progress-display.executing[data-v-9be19e47] { .progress-display.executing[data-v-a14881ad] {
border-color: rgba(66, 153, 225, 0.5); border-color: rgba(66, 153, 225, 0.5);
animation: pulse-9be19e47 2s ease-in-out infinite; animation: pulse-a14881ad 2s ease-in-out infinite;
} }
@keyframes pulse-9be19e47 { @keyframes pulse-a14881ad {
0%, 100% { border-color: rgba(66, 153, 225, 0.3); 0%, 100% { border-color: rgba(66, 153, 225, 0.3);
} }
50% { border-color: rgba(66, 153, 225, 0.7); 50% { border-color: rgba(66, 153, 225, 0.7);
} }
} }
.progress-info[data-v-9be19e47] { .progress-info[data-v-a14881ad] {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 2px; gap: 2px;
min-width: 0; min-width: 0;
flex: 1; flex: 1;
} }
.progress-label[data-v-9be19e47] { .progress-label[data-v-a14881ad] {
font-size: 10px; font-size: 10px;
font-weight: 500; font-weight: 500;
color: rgba(226, 232, 240, 0.5); color: rgba(226, 232, 240, 0.5);
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.03em; letter-spacing: 0.03em;
} }
.progress-name[data-v-9be19e47] { .progress-name[data-v-a14881ad] {
font-size: 13px; font-size: 13px;
font-weight: 500; font-weight: 500;
color: rgba(191, 219, 254, 1); color: rgba(191, 219, 254, 1);
@@ -1539,14 +1539,14 @@ to { transform: rotate(360deg);
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
} }
.progress-counter[data-v-9be19e47] { .progress-counter[data-v-a14881ad] {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 4px; gap: 4px;
padding-left: 12px; padding-left: 12px;
flex-shrink: 0; flex-shrink: 0;
} }
.progress-index[data-v-9be19e47] { .progress-index[data-v-a14881ad] {
font-size: 18px; font-size: 18px;
font-weight: 600; font-weight: 600;
color: rgba(66, 153, 225, 1); color: rgba(66, 153, 225, 1);
@@ -1555,12 +1555,12 @@ to { transform: rotate(360deg);
text-align: right; text-align: right;
font-variant-numeric: tabular-nums; font-variant-numeric: tabular-nums;
} }
.progress-separator[data-v-9be19e47] { .progress-separator[data-v-a14881ad] {
font-size: 14px; font-size: 14px;
color: rgba(226, 232, 240, 0.4); color: rgba(226, 232, 240, 0.4);
margin: 0 2px; margin: 0 2px;
} }
.progress-total[data-v-9be19e47] { .progress-total[data-v-a14881ad] {
font-size: 14px; font-size: 14px;
font-weight: 500; font-weight: 500;
color: rgba(226, 232, 240, 0.6); color: rgba(226, 232, 240, 0.6);
@@ -1569,111 +1569,102 @@ to { transform: rotate(360deg);
text-align: left; text-align: left;
font-variant-numeric: tabular-nums; font-variant-numeric: tabular-nums;
} }
.refresh-button[data-v-9be19e47] {
display: flex;
align-items: center;
justify-content: center;
width: 24px;
height: 24px;
margin-left: 8px;
padding: 0;
background: transparent;
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 4px;
color: rgba(226, 232, 240, 0.6);
cursor: pointer;
transition: all 0.2s;
}
.refresh-button[data-v-9be19e47]:hover:not(:disabled) {
background: rgba(66, 153, 225, 0.2);
border-color: rgba(66, 153, 225, 0.4);
color: rgba(191, 219, 254, 1);
}
.refresh-button[data-v-9be19e47]:disabled {
opacity: 0.4;
cursor: not-allowed;
}
.refresh-icon[data-v-9be19e47] {
width: 14px;
height: 14px;
}
.refresh-icon.spinning[data-v-9be19e47] {
animation: spin-9be19e47 1s linear infinite;
}
@keyframes spin-9be19e47 {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
/* Repeat Badge */ /* Repeat Progress */
.repeat-badge[data-v-9be19e47] { .repeat-progress[data-v-a14881ad] {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 4px; gap: 6px;
margin-left: 8px; margin-left: 8px;
padding: 2px 6px; padding: 2px 6px;
background: rgba(245, 158, 11, 0.15); background: rgba(26, 32, 44, 0.6);
border: 1px solid rgba(245, 158, 11, 0.3); border: 1px solid rgba(226, 232, 240, 0.1);
border-radius: 4px; border-radius: 4px;
} }
.repeat-badge-label[data-v-9be19e47] { .repeat-progress-track[data-v-a14881ad] {
font-size: 10px; width: 32px;
color: rgba(253, 230, 138, 0.7); height: 4px;
text-transform: uppercase; background: rgba(226, 232, 240, 0.15);
border-radius: 2px;
overflow: hidden;
} }
.repeat-badge-value[data-v-9be19e47] { .repeat-progress-fill[data-v-a14881ad] {
font-size: 12px; height: 100%;
background: linear-gradient(90deg, #f59e0b, #fbbf24);
border-radius: 2px;
transition: width 0.3s ease;
}
.repeat-progress-fill.is-complete[data-v-a14881ad] {
background: linear-gradient(90deg, #10b981, #34d399);
}
.repeat-progress-text[data-v-a14881ad] {
font-size: 10px;
font-family: 'SF Mono', 'Roboto Mono', monospace; font-family: 'SF Mono', 'Roboto Mono', monospace;
color: rgba(253, 230, 138, 1); color: rgba(253, 230, 138, 0.9);
min-width: 3ch; min-width: 3ch;
font-variant-numeric: tabular-nums; font-variant-numeric: tabular-nums;
} }
/* Index Controls Row */ /* Index Controls Row - Grouped Layout */
.index-controls-row[data-v-9be19e47] { .index-controls-row[data-v-a14881ad] {
display: flex; display: flex;
align-items: center; align-items: flex-end;
gap: 8px; gap: 16px;
flex-wrap: wrap;
} }
.index-input[data-v-9be19e47] {
width: 60px; /* Control Group */
padding: 6px 8px; .control-group[data-v-a14881ad] {
display: flex;
flex-direction: column;
gap: 6px;
}
.control-group-label[data-v-a14881ad] {
font-size: 11px;
font-weight: 500;
color: rgba(226, 232, 240, 0.5);
text-transform: uppercase;
letter-spacing: 0.03em;
line-height: 1;
}
.control-group-content[data-v-a14881ad] {
display: flex;
align-items: baseline;
gap: 4px;
height: 32px;
}
.index-input[data-v-a14881ad] {
width: 50px;
height: 32px;
padding: 0 8px;
background: rgba(26, 32, 44, 0.9); background: rgba(26, 32, 44, 0.9);
border: 1px solid rgba(226, 232, 240, 0.2); border: 1px solid rgba(226, 232, 240, 0.2);
border-radius: 6px; border-radius: 6px;
color: #e4e4e7; color: #e4e4e7;
font-size: 13px; font-size: 13px;
font-family: 'SF Mono', 'Roboto Mono', monospace; font-family: 'SF Mono', 'Roboto Mono', monospace;
line-height: 32px;
box-sizing: border-box;
} }
.index-input[data-v-9be19e47]:focus { .index-input[data-v-a14881ad]:focus {
outline: none; outline: none;
border-color: rgba(66, 153, 225, 0.6); border-color: rgba(66, 153, 225, 0.6);
} }
.index-input[data-v-9be19e47]:disabled { .index-input[data-v-a14881ad]:disabled {
opacity: 0.4; opacity: 0.4;
cursor: not-allowed; cursor: not-allowed;
} }
.index-hint[data-v-9be19e47] { .index-hint[data-v-a14881ad] {
font-size: 11px; font-size: 12px;
color: rgba(226, 232, 240, 0.4); color: rgba(226, 232, 240, 0.4);
min-width: 7ch;
font-variant-numeric: tabular-nums; font-variant-numeric: tabular-nums;
line-height: 32px;
} }
/* Repeat Controls */ /* Repeat Controls */
.repeat-label[data-v-9be19e47] { .repeat-input[data-v-a14881ad] {
font-size: 13px; width: 40px;
color: rgba(226, 232, 240, 0.6); height: 32px;
margin-left: 4px; padding: 0 6px;
}
.repeat-input[data-v-9be19e47] {
width: 44px;
padding: 6px 6px;
background: rgba(26, 32, 44, 0.9); background: rgba(26, 32, 44, 0.9);
border: 1px solid rgba(226, 232, 240, 0.2); border: 1px solid rgba(226, 232, 240, 0.2);
border-radius: 6px; border-radius: 6px;
@@ -1681,18 +1672,30 @@ to {
font-size: 13px; font-size: 13px;
font-family: 'SF Mono', 'Roboto Mono', monospace; font-family: 'SF Mono', 'Roboto Mono', monospace;
text-align: center; text-align: center;
line-height: 32px;
box-sizing: border-box;
} }
.repeat-input[data-v-9be19e47]:focus { .repeat-input[data-v-a14881ad]:focus {
outline: none; outline: none;
border-color: rgba(66, 153, 225, 0.6); border-color: rgba(66, 153, 225, 0.6);
} }
.repeat-hint[data-v-9be19e47] { .repeat-suffix[data-v-a14881ad] {
font-size: 11px; font-size: 13px;
color: rgba(226, 232, 240, 0.4); color: rgba(226, 232, 240, 0.4);
font-weight: 500;
line-height: 32px;
}
/* Action Buttons */
.action-buttons[data-v-a14881ad] {
display: flex;
align-items: center;
gap: 6px;
margin-left: auto;
} }
/* Control Buttons */ /* Control Buttons */
.control-btn[data-v-9be19e47] { .control-btn[data-v-a14881ad] {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
@@ -1706,52 +1709,52 @@ to {
cursor: pointer; cursor: pointer;
transition: all 0.2s; transition: all 0.2s;
} }
.control-btn[data-v-9be19e47]:hover:not(:disabled) { .control-btn[data-v-a14881ad]:hover:not(:disabled) {
background: rgba(66, 153, 225, 0.2); background: rgba(66, 153, 225, 0.2);
border-color: rgba(66, 153, 225, 0.4); border-color: rgba(66, 153, 225, 0.4);
color: rgba(191, 219, 254, 1); color: rgba(191, 219, 254, 1);
} }
.control-btn[data-v-9be19e47]:disabled { .control-btn[data-v-a14881ad]:disabled {
opacity: 0.4; opacity: 0.4;
cursor: not-allowed; cursor: not-allowed;
} }
.control-btn.active[data-v-9be19e47] { .control-btn.active[data-v-a14881ad] {
background: rgba(245, 158, 11, 0.2); background: rgba(245, 158, 11, 0.2);
border-color: rgba(245, 158, 11, 0.5); border-color: rgba(245, 158, 11, 0.5);
color: rgba(253, 230, 138, 1); color: rgba(253, 230, 138, 1);
} }
.control-btn.active[data-v-9be19e47]:hover { .control-btn.active[data-v-a14881ad]:hover {
background: rgba(245, 158, 11, 0.3); background: rgba(245, 158, 11, 0.3);
border-color: rgba(245, 158, 11, 0.6); border-color: rgba(245, 158, 11, 0.6);
} }
.control-icon[data-v-9be19e47] { .control-icon[data-v-a14881ad] {
width: 14px; width: 14px;
height: 14px; height: 14px;
} }
/* Slider Container */ /* Slider Container */
.slider-container[data-v-9be19e47] { .slider-container[data-v-a14881ad] {
background: rgba(26, 32, 44, 0.9); background: rgba(26, 32, 44, 0.9);
border: 1px solid rgba(226, 232, 240, 0.2); border: 1px solid rgba(226, 232, 240, 0.2);
border-radius: 6px; border-radius: 6px;
padding: 6px; padding: 6px;
} }
.slider-container--disabled[data-v-9be19e47] { .slider-container--disabled[data-v-a14881ad] {
opacity: 0.5; opacity: 0.5;
pointer-events: none; pointer-events: none;
} }
.section-header-with-toggle[data-v-9be19e47] { .section-header-with-toggle[data-v-a14881ad] {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
margin-bottom: 8px; margin-bottom: 8px;
} }
.section-header-with-toggle .setting-label[data-v-9be19e47] { .section-header-with-toggle .setting-label[data-v-a14881ad] {
margin-bottom: 4px; margin-bottom: 4px;
} }
/* Toggle Switch */ /* Toggle Switch */
.toggle-switch[data-v-9be19e47] { .toggle-switch[data-v-a14881ad] {
position: relative; position: relative;
width: 36px; width: 36px;
height: 20px; height: 20px;
@@ -1760,7 +1763,7 @@ to {
border: none; border: none;
cursor: pointer; cursor: pointer;
} }
.toggle-switch__track[data-v-9be19e47] { .toggle-switch__track[data-v-a14881ad] {
position: absolute; position: absolute;
inset: 0; inset: 0;
background: var(--comfy-input-bg, #333); background: var(--comfy-input-bg, #333);
@@ -1768,11 +1771,11 @@ to {
border-radius: 10px; border-radius: 10px;
transition: all 0.2s; transition: all 0.2s;
} }
.toggle-switch--active .toggle-switch__track[data-v-9be19e47] { .toggle-switch--active .toggle-switch__track[data-v-a14881ad] {
background: rgba(66, 153, 225, 0.3); background: rgba(66, 153, 225, 0.3);
border-color: rgba(66, 153, 225, 0.6); border-color: rgba(66, 153, 225, 0.6);
} }
.toggle-switch__thumb[data-v-9be19e47] { .toggle-switch__thumb[data-v-a14881ad] {
position: absolute; position: absolute;
top: 3px; top: 3px;
left: 2px; left: 2px;
@@ -1783,16 +1786,16 @@ to {
transition: all 0.2s; transition: all 0.2s;
opacity: 0.6; opacity: 0.6;
} }
.toggle-switch--active .toggle-switch__thumb[data-v-9be19e47] { .toggle-switch--active .toggle-switch__thumb[data-v-a14881ad] {
transform: translateX(16px); transform: translateX(16px);
background: #4299e1; background: #4299e1;
opacity: 1; opacity: 1;
} }
.toggle-switch:hover .toggle-switch__thumb[data-v-9be19e47] { .toggle-switch:hover .toggle-switch__thumb[data-v-a14881ad] {
opacity: 1; opacity: 1;
} }
.lora-cycler-widget[data-v-9c17d0bf] { .lora-cycler-widget[data-v-cce5520b] {
padding: 6px; padding: 6px;
background: rgba(40, 44, 52, 0.6); background: rgba(40, 44, 52, 0.6);
border-radius: 6px; border-radius: 6px;
@@ -12819,34 +12822,39 @@ const _hoisted_7 = { class: "progress-index" };
const _hoisted_8 = { class: "progress-total" }; const _hoisted_8 = { class: "progress-total" };
const _hoisted_9 = { const _hoisted_9 = {
key: 0, key: 0,
class: "repeat-badge" class: "repeat-progress"
}; };
const _hoisted_10 = { class: "repeat-badge-value" }; const _hoisted_10 = { class: "repeat-progress-track" };
const _hoisted_11 = ["disabled"]; const _hoisted_11 = { class: "repeat-progress-text" };
const _hoisted_12 = { class: "setting-section" }; const _hoisted_12 = { class: "setting-section" };
const _hoisted_13 = { class: "index-controls-row" }; const _hoisted_13 = { class: "index-controls-row" };
const _hoisted_14 = ["max", "value", "disabled"]; const _hoisted_14 = { class: "control-group" };
const _hoisted_15 = { class: "index-hint" }; const _hoisted_15 = { class: "control-group-content" };
const _hoisted_16 = ["value"]; const _hoisted_16 = ["max", "value", "disabled"];
const _hoisted_17 = ["disabled", "title"]; const _hoisted_17 = { class: "index-hint" };
const _hoisted_18 = { const _hoisted_18 = { class: "control-group" };
const _hoisted_19 = { class: "control-group-content" };
const _hoisted_20 = ["value"];
const _hoisted_21 = { class: "action-buttons" };
const _hoisted_22 = ["disabled", "title"];
const _hoisted_23 = {
key: 0, key: 0,
viewBox: "0 0 24 24", viewBox: "0 0 24 24",
fill: "currentColor", fill: "currentColor",
class: "control-icon" class: "control-icon"
}; };
const _hoisted_19 = { const _hoisted_24 = {
key: 1, key: 1,
viewBox: "0 0 24 24", viewBox: "0 0 24 24",
fill: "currentColor", fill: "currentColor",
class: "control-icon" class: "control-icon"
}; };
const _hoisted_20 = { class: "setting-section" }; const _hoisted_25 = { class: "setting-section" };
const _hoisted_21 = { class: "slider-container" }; const _hoisted_26 = { class: "slider-container" };
const _hoisted_22 = { class: "setting-section" }; const _hoisted_27 = { class: "setting-section" };
const _hoisted_23 = { class: "section-header-with-toggle" }; const _hoisted_28 = { class: "section-header-with-toggle" };
const _hoisted_24 = { class: "setting-label" }; const _hoisted_29 = { class: "setting-label" };
const _hoisted_25 = ["aria-checked"]; const _hoisted_30 = ["aria-checked"];
const _sfc_main$3 = /* @__PURE__ */ defineComponent({ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
__name: "LoraCyclerSettingsView", __name: "LoraCyclerSettingsView",
props: { props: {
@@ -12858,7 +12866,6 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
clipStrength: {}, clipStrength: {},
useCustomClipRange: { type: Boolean }, useCustomClipRange: { type: Boolean },
isClipStrengthDisabled: { type: Boolean }, isClipStrengthDisabled: { type: Boolean },
isLoading: { type: Boolean },
repeatCount: {}, repeatCount: {},
repeatUsed: {}, repeatUsed: {},
isPaused: { type: Boolean }, isPaused: { type: Boolean },
@@ -12866,7 +12873,7 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
isWorkflowExecuting: { type: Boolean }, isWorkflowExecuting: { type: Boolean },
executingRepeatStep: {} executingRepeatStep: {}
}, },
emits: ["update:currentIndex", "update:modelStrength", "update:clipStrength", "update:useCustomClipRange", "update:repeatCount", "toggle-pause", "reset-index", "refresh"], emits: ["update:currentIndex", "update:modelStrength", "update:clipStrength", "update:useCustomClipRange", "update:repeatCount", "toggle-pause", "reset-index"],
setup(__props, { emit: __emit }) { setup(__props, { emit: __emit }) {
const props = __props; const props = __props;
const emit2 = __emit; const emit2 = __emit;
@@ -12906,7 +12913,7 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
}; };
return (_ctx, _cache) => { return (_ctx, _cache) => {
return openBlock(), createElementBlock("div", _hoisted_1$3, [ return openBlock(), createElementBlock("div", _hoisted_1$3, [
_cache[23] || (_cache[23] = createBaseVNode("div", { class: "settings-header" }, [ _cache[20] || (_cache[20] = createBaseVNode("div", { class: "settings-header" }, [
createBaseVNode("h3", { class: "settings-title" }, "CYCLER SETTINGS") createBaseVNode("h3", { class: "settings-title" }, "CYCLER SETTINGS")
], -1)), ], -1)),
createBaseVNode("div", _hoisted_2$2, [ createBaseVNode("div", _hoisted_2$2, [
@@ -12922,126 +12929,122 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
]), ]),
createBaseVNode("div", _hoisted_6, [ createBaseVNode("div", _hoisted_6, [
createBaseVNode("span", _hoisted_7, toDisplayString(__props.currentIndex), 1), createBaseVNode("span", _hoisted_7, toDisplayString(__props.currentIndex), 1),
_cache[14] || (_cache[14] = createBaseVNode("span", { class: "progress-separator" }, "/", -1)), _cache[11] || (_cache[11] = createBaseVNode("span", { class: "progress-separator" }, "/", -1)),
createBaseVNode("span", _hoisted_8, toDisplayString(__props.totalCount), 1), createBaseVNode("span", _hoisted_8, toDisplayString(__props.totalCount), 1),
__props.repeatCount > 1 ? (openBlock(), createElementBlock("div", _hoisted_9, [ __props.repeatCount > 1 ? (openBlock(), createElementBlock("div", _hoisted_9, [
_cache[12] || (_cache[12] = createBaseVNode("span", { class: "repeat-badge-label" }, "Rep", -1)), createBaseVNode("div", _hoisted_10, [
createBaseVNode("span", _hoisted_10, toDisplayString(__props.repeatUsed) + "/" + toDisplayString(__props.repeatCount), 1) createBaseVNode("div", {
])) : createCommentVNode("", true), class: normalizeClass(["repeat-progress-fill", { "is-complete": __props.repeatUsed >= __props.repeatCount }]),
createBaseVNode("button", { style: normalizeStyle({ width: `${__props.repeatUsed / __props.repeatCount * 100}%` })
class: "refresh-button", }, null, 6)
disabled: __props.isLoading, ]),
onClick: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("refresh")), createBaseVNode("span", _hoisted_11, toDisplayString(__props.repeatUsed) + "/" + toDisplayString(__props.repeatCount), 1)
title: "Refresh list" ])) : createCommentVNode("", true)
}, [
(openBlock(), createElementBlock("svg", {
class: normalizeClass(["refresh-icon", { spinning: __props.isLoading }]),
viewBox: "0 0 24 24",
fill: "none",
stroke: "currentColor",
"stroke-width": "2",
"stroke-linecap": "round",
"stroke-linejoin": "round"
}, [..._cache[13] || (_cache[13] = [
createBaseVNode("path", { d: "M21 12a9 9 0 1 1-6.219-8.56" }, null, -1),
createBaseVNode("path", { d: "M21 3v5h-5" }, null, -1)
])], 2))
], 8, _hoisted_11)
]) ])
], 2) ], 2)
]), ]),
createBaseVNode("div", _hoisted_12, [ createBaseVNode("div", _hoisted_12, [
_cache[20] || (_cache[20] = createBaseVNode("label", { class: "setting-label" }, "Starting Index", -1)),
createBaseVNode("div", _hoisted_13, [ createBaseVNode("div", _hoisted_13, [
createBaseVNode("input", { createBaseVNode("div", _hoisted_14, [
type: "number", _cache[12] || (_cache[12] = createBaseVNode("label", { class: "control-group-label" }, "Starting Index", -1)),
class: "index-input", createBaseVNode("div", _hoisted_15, [
min: 1, createBaseVNode("input", {
max: __props.totalCount || 1, type: "number",
value: __props.currentIndex, class: "index-input",
disabled: __props.totalCount === 0, min: 1,
onInput: onIndexInput, max: __props.totalCount || 1,
onBlur: onIndexBlur, value: __props.currentIndex,
onPointerdown: _cache[1] || (_cache[1] = withModifiers(() => { disabled: __props.totalCount === 0,
}, ["stop"])), onInput: onIndexInput,
onPointermove: _cache[2] || (_cache[2] = withModifiers(() => { onBlur: onIndexBlur,
}, ["stop"])), onPointerdown: _cache[0] || (_cache[0] = withModifiers(() => {
onPointerup: _cache[3] || (_cache[3] = withModifiers(() => { }, ["stop"])),
}, ["stop"])) onPointermove: _cache[1] || (_cache[1] = withModifiers(() => {
}, null, 40, _hoisted_14), }, ["stop"])),
createBaseVNode("span", _hoisted_15, "1 - " + toDisplayString(__props.totalCount || 1), 1), onPointerup: _cache[2] || (_cache[2] = withModifiers(() => {
_cache[18] || (_cache[18] = createBaseVNode("span", { class: "repeat-label" }, "x", -1)), }, ["stop"]))
createBaseVNode("input", { }, null, 40, _hoisted_16),
type: "number", createBaseVNode("span", _hoisted_17, "/ " + toDisplayString(__props.totalCount || 1), 1)
class: "repeat-input", ])
min: "1", ]),
max: "99", createBaseVNode("div", _hoisted_18, [
value: __props.repeatCount, _cache[14] || (_cache[14] = createBaseVNode("label", { class: "control-group-label" }, "Repeat", -1)),
onInput: onRepeatInput, createBaseVNode("div", _hoisted_19, [
onBlur: onRepeatBlur, createBaseVNode("input", {
onPointerdown: _cache[4] || (_cache[4] = withModifiers(() => { type: "number",
}, ["stop"])), class: "repeat-input",
onPointermove: _cache[5] || (_cache[5] = withModifiers(() => { min: "1",
}, ["stop"])), max: "99",
onPointerup: _cache[6] || (_cache[6] = withModifiers(() => { value: __props.repeatCount,
}, ["stop"])), onInput: onRepeatInput,
title: "Repeat each LoRA this many times" onBlur: onRepeatBlur,
}, null, 40, _hoisted_16), onPointerdown: _cache[3] || (_cache[3] = withModifiers(() => {
_cache[19] || (_cache[19] = createBaseVNode("span", { class: "repeat-hint" }, "times", -1)), }, ["stop"])),
createBaseVNode("button", { onPointermove: _cache[4] || (_cache[4] = withModifiers(() => {
class: normalizeClass(["control-btn", { active: __props.isPaused }]), }, ["stop"])),
disabled: __props.isPauseDisabled, onPointerup: _cache[5] || (_cache[5] = withModifiers(() => {
onClick: _cache[7] || (_cache[7] = ($event) => _ctx.$emit("toggle-pause")), }, ["stop"])),
title: __props.isPauseDisabled ? "Cannot pause while prompts are queued" : __props.isPaused ? "Continue iteration" : "Pause iteration" title: "Each LoRA will be used this many times before moving to the next"
}, [ }, null, 40, _hoisted_20),
__props.isPaused ? (openBlock(), createElementBlock("svg", _hoisted_18, [..._cache[15] || (_cache[15] = [ _cache[13] || (_cache[13] = createBaseVNode("span", { class: "repeat-suffix" }, "×", -1))
createBaseVNode("path", { d: "M8 5v14l11-7z" }, null, -1) ])
])])) : (openBlock(), createElementBlock("svg", _hoisted_19, [..._cache[16] || (_cache[16] = [ ]),
createBaseVNode("path", { d: "M6 4h4v16H6zm8 0h4v16h-4z" }, null, -1) createBaseVNode("div", _hoisted_21, [
])])) createBaseVNode("button", {
], 10, _hoisted_17), class: normalizeClass(["control-btn", { active: __props.isPaused }]),
createBaseVNode("button", { disabled: __props.isPauseDisabled,
class: "control-btn", onClick: _cache[6] || (_cache[6] = ($event) => _ctx.$emit("toggle-pause")),
onClick: _cache[8] || (_cache[8] = ($event) => _ctx.$emit("reset-index")), title: __props.isPauseDisabled ? "Cannot pause while prompts are queued" : __props.isPaused ? "Continue iteration" : "Pause iteration"
title: "Reset to index 1"
}, [..._cache[17] || (_cache[17] = [
createBaseVNode("svg", {
viewBox: "0 0 24 24",
fill: "currentColor",
class: "control-icon"
}, [ }, [
createBaseVNode("path", { d: "M12 5V1L7 6l5 5V7c3.31 0 6 2.69 6 6s-2.69 6-6 6-6-2.69-6-6H4c0 4.42 3.58 8 8 8s8-3.58 8-8-3.58-8-8-8z" }) __props.isPaused ? (openBlock(), createElementBlock("svg", _hoisted_23, [..._cache[15] || (_cache[15] = [
], -1) createBaseVNode("path", { d: "M8 5v14l11-7z" }, null, -1)
])]) ])])) : (openBlock(), createElementBlock("svg", _hoisted_24, [..._cache[16] || (_cache[16] = [
createBaseVNode("path", { d: "M6 4h4v16H6zm8 0h4v16h-4z" }, null, -1)
])]))
], 10, _hoisted_22),
createBaseVNode("button", {
class: "control-btn",
onClick: _cache[7] || (_cache[7] = ($event) => _ctx.$emit("reset-index")),
title: "Reset to index 1"
}, [..._cache[17] || (_cache[17] = [
createBaseVNode("svg", {
viewBox: "0 0 24 24",
fill: "currentColor",
class: "control-icon"
}, [
createBaseVNode("path", { d: "M12 5V1L7 6l5 5V7c3.31 0 6 2.69 6 6s-2.69 6-6 6-6-2.69-6-6H4c0 4.42 3.58 8 8 8s8-3.58 8-8-3.58-8-8-8z" })
], -1)
])])
])
]) ])
]), ]),
createBaseVNode("div", _hoisted_20, [ createBaseVNode("div", _hoisted_25, [
_cache[21] || (_cache[21] = createBaseVNode("label", { class: "setting-label" }, "Model Strength", -1)), _cache[18] || (_cache[18] = createBaseVNode("label", { class: "setting-label" }, "Model Strength", -1)),
createBaseVNode("div", _hoisted_21, [ createBaseVNode("div", _hoisted_26, [
createVNode(SingleSlider, { createVNode(SingleSlider, {
min: -10, min: -10,
max: 10, max: 10,
value: __props.modelStrength, value: __props.modelStrength,
step: 0.1, step: 0.1,
"default-range": { min: 0.5, max: 1.5 }, "default-range": { min: 0.5, max: 1.5 },
"onUpdate:value": _cache[9] || (_cache[9] = ($event) => _ctx.$emit("update:modelStrength", $event)) "onUpdate:value": _cache[8] || (_cache[8] = ($event) => _ctx.$emit("update:modelStrength", $event))
}, null, 8, ["value"]) }, null, 8, ["value"])
]) ])
]), ]),
createBaseVNode("div", _hoisted_22, [ createBaseVNode("div", _hoisted_27, [
createBaseVNode("div", _hoisted_23, [ createBaseVNode("div", _hoisted_28, [
createBaseVNode("label", _hoisted_24, " Clip Strength - " + toDisplayString(__props.useCustomClipRange ? "Custom Value" : "Use Model Strength"), 1), createBaseVNode("label", _hoisted_29, " Clip Strength - " + toDisplayString(__props.useCustomClipRange ? "Custom Value" : "Use Model Strength"), 1),
createBaseVNode("button", { createBaseVNode("button", {
type: "button", type: "button",
class: normalizeClass(["toggle-switch", { "toggle-switch--active": __props.useCustomClipRange }]), class: normalizeClass(["toggle-switch", { "toggle-switch--active": __props.useCustomClipRange }]),
onClick: _cache[10] || (_cache[10] = ($event) => _ctx.$emit("update:useCustomClipRange", !__props.useCustomClipRange)), onClick: _cache[9] || (_cache[9] = ($event) => _ctx.$emit("update:useCustomClipRange", !__props.useCustomClipRange)),
role: "switch", role: "switch",
"aria-checked": __props.useCustomClipRange, "aria-checked": __props.useCustomClipRange,
title: "Use custom clip strength when enabled, otherwise use model strength" title: "Use custom clip strength when enabled, otherwise use model strength"
}, [..._cache[22] || (_cache[22] = [ }, [..._cache[19] || (_cache[19] = [
createBaseVNode("span", { class: "toggle-switch__track" }, null, -1), createBaseVNode("span", { class: "toggle-switch__track" }, null, -1),
createBaseVNode("span", { class: "toggle-switch__thumb" }, null, -1) createBaseVNode("span", { class: "toggle-switch__thumb" }, null, -1)
])], 10, _hoisted_25) ])], 10, _hoisted_30)
]), ]),
createBaseVNode("div", { createBaseVNode("div", {
class: normalizeClass(["slider-container", { "slider-container--disabled": __props.isClipStrengthDisabled }]) class: normalizeClass(["slider-container", { "slider-container--disabled": __props.isClipStrengthDisabled }])
@@ -13053,7 +13056,7 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
step: 0.1, step: 0.1,
"default-range": { min: 0.5, max: 1.5 }, "default-range": { min: 0.5, max: 1.5 },
disabled: __props.isClipStrengthDisabled, disabled: __props.isClipStrengthDisabled,
"onUpdate:value": _cache[11] || (_cache[11] = ($event) => _ctx.$emit("update:clipStrength", $event)) "onUpdate:value": _cache[10] || (_cache[10] = ($event) => _ctx.$emit("update:clipStrength", $event))
}, null, 8, ["value", "disabled"]) }, null, 8, ["value", "disabled"])
], 2) ], 2)
]) ])
@@ -13061,7 +13064,7 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
}; };
} }
}); });
const LoraCyclerSettingsView = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-9be19e47"]]); const LoraCyclerSettingsView = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-a14881ad"]]);
function useLoraCyclerState(widget) { function useLoraCyclerState(widget) {
let isRestoring = false; let isRestoring = false;
const currentIndex = ref(1); const currentIndex = ref(1);
@@ -13346,14 +13349,6 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
state.clipStrength.value = state.modelStrength.value; state.clipStrength.value = state.modelStrength.value;
} }
}; };
const handleRefresh = async () => {
try {
const poolConfig = getPoolConfig();
await state.refreshList(poolConfig);
} catch (error) {
console.error("[LoraCyclerWidget] Error refreshing:", error);
}
};
const handleRepeatCountChange = (newValue) => { const handleRepeatCountChange = (newValue) => {
state.repeatCount.value = newValue; state.repeatCount.value = newValue;
state.repeatUsed.value = 0; state.repeatUsed.value = 0;
@@ -13558,14 +13553,13 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
"onUpdate:useCustomClipRange": handleUseCustomClipRangeChange, "onUpdate:useCustomClipRange": handleUseCustomClipRangeChange,
"onUpdate:repeatCount": handleRepeatCountChange, "onUpdate:repeatCount": handleRepeatCountChange,
onTogglePause: handleTogglePause, onTogglePause: handleTogglePause,
onResetIndex: handleResetIndex, onResetIndex: handleResetIndex
onRefresh: handleRefresh
}, null, 8, ["current-index", "total-count", "current-lora-name", "current-lora-filename", "model-strength", "clip-strength", "use-custom-clip-range", "is-clip-strength-disabled", "is-loading", "repeat-count", "repeat-used", "is-paused", "is-pause-disabled", "is-workflow-executing", "executing-repeat-step"]) }, null, 8, ["current-index", "total-count", "current-lora-name", "current-lora-filename", "model-strength", "clip-strength", "use-custom-clip-range", "is-clip-strength-disabled", "is-loading", "repeat-count", "repeat-used", "is-paused", "is-pause-disabled", "is-workflow-executing", "executing-repeat-step"])
]); ]);
}; };
} }
}); });
const LoraCyclerWidget = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-9c17d0bf"]]); const LoraCyclerWidget = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-cce5520b"]]);
const _hoisted_1$1 = { class: "json-display-widget" }; const _hoisted_1$1 = { class: "json-display-widget" };
const _hoisted_2$1 = { const _hoisted_2$1 = {
class: "json-content", class: "json-content",

File diff suppressed because one or more lines are too long