@stellartech/voice-widget-directus 1.0.4 → 1.0.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +28 -7
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -996,6 +996,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
996
996
|
ref(null);
|
|
997
997
|
const isPollingProgress = ref(false);
|
|
998
998
|
const progressStatus = ref("");
|
|
999
|
+
const pendingVariantId = ref(null);
|
|
999
1000
|
let samplePollingInterval = null;
|
|
1000
1001
|
let voiceoverPollingInterval = null;
|
|
1001
1002
|
const selectedVariant = computed(() => allVariants.value[currentVariantIndex.value]);
|
|
@@ -1120,15 +1121,31 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
1120
1121
|
return;
|
|
1121
1122
|
}
|
|
1122
1123
|
voiceoverPollCount++;
|
|
1123
|
-
console.log(`[Voice Widget] Poll #${voiceoverPollCount} for lesson ${voiceoverLessonId}...`);
|
|
1124
|
+
console.log(`[Voice Widget] Poll #${voiceoverPollCount} for lesson ${voiceoverLessonId}, pendingVariantId=${pendingVariantId.value}...`);
|
|
1124
1125
|
try {
|
|
1125
1126
|
const allVariantsNow = await fetchVoiceVariants(voiceoverLessonId);
|
|
1126
1127
|
console.log(`[Voice Widget] Poll #${voiceoverPollCount} raw result:`, JSON.stringify(allVariantsNow));
|
|
1127
|
-
|
|
1128
|
-
|
|
1129
|
-
|
|
1128
|
+
let isNewVariantComplete = false;
|
|
1129
|
+
if (pendingVariantId.value) {
|
|
1130
|
+
const pendingVariant = allVariantsNow.find((v) => v.id === pendingVariantId.value);
|
|
1131
|
+
if (pendingVariant?.audio_file_id) {
|
|
1132
|
+
console.log("[Voice Widget] Pending variant completed with audio:", pendingVariant.audio_file_id);
|
|
1133
|
+
isNewVariantComplete = true;
|
|
1134
|
+
} else {
|
|
1135
|
+
console.log(`[Voice Widget] Poll #${voiceoverPollCount} - pending variant not yet complete`);
|
|
1136
|
+
}
|
|
1137
|
+
} else {
|
|
1138
|
+
const processingThatCompleted = allVariantsNow.find((v) => v.status === "processing" && v.audio_file_id);
|
|
1139
|
+
if (processingThatCompleted) {
|
|
1140
|
+
console.log("[Voice Widget] Found completed processing variant:", processingThatCompleted.id);
|
|
1141
|
+
isNewVariantComplete = true;
|
|
1142
|
+
}
|
|
1143
|
+
}
|
|
1144
|
+
if (isNewVariantComplete) {
|
|
1130
1145
|
console.log("[Voice Widget] COMPLETED! Transitioning to result...");
|
|
1131
1146
|
stopVoiceoverPolling();
|
|
1147
|
+
pendingVariantId.value = null;
|
|
1148
|
+
const completedWithAudio = allVariantsNow.filter((v) => v.audio_file_id);
|
|
1132
1149
|
allVariants.value = completedWithAudio;
|
|
1133
1150
|
for (const v of allVariants.value) {
|
|
1134
1151
|
if (v.audio_file_id) {
|
|
@@ -1190,7 +1207,9 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
1190
1207
|
tone_id: selectedToneId.value,
|
|
1191
1208
|
style_id: selectedStyleId.value
|
|
1192
1209
|
};
|
|
1193
|
-
await createPendingVoiceVariant(props.primaryKey, voiceConfig);
|
|
1210
|
+
const newPendingId = await createPendingVoiceVariant(props.primaryKey, voiceConfig);
|
|
1211
|
+
pendingVariantId.value = newPendingId;
|
|
1212
|
+
console.log("[Voice Widget] Created pending variant:", newPendingId);
|
|
1194
1213
|
startVoiceoverPolling();
|
|
1195
1214
|
if (!props.collection) {
|
|
1196
1215
|
throw new Error("collection is required but was not provided");
|
|
@@ -1237,6 +1256,8 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
1237
1256
|
progressPercent.value = 0;
|
|
1238
1257
|
progressStatus.value = "";
|
|
1239
1258
|
isPollingProgress.value = false;
|
|
1259
|
+
pendingVariantId.value = null;
|
|
1260
|
+
stopVoiceoverPolling();
|
|
1240
1261
|
}
|
|
1241
1262
|
function selectVariant(index) {
|
|
1242
1263
|
currentVariantIndex.value = index;
|
|
@@ -1965,10 +1986,10 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
1965
1986
|
}
|
|
1966
1987
|
});
|
|
1967
1988
|
|
|
1968
|
-
var css = "\n.voice-widget[data-v-
|
|
1989
|
+
var css = "\n.voice-widget[data-v-e86a7906] {\n font-family: var(--theme--fonts--sans--font-family);\n padding: 16px;\n border: 1px solid var(--theme--form--field--input--border-color);\n border-radius: var(--theme--border-radius);\n background: var(--theme--background);\n}\n.widget__header[data-v-e86a7906] {\n margin-bottom: 20px;\n}\n.widget__header-row[data-v-e86a7906] {\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n gap: 16px;\n}\n.widget__header-text[data-v-e86a7906] {\n flex: 1;\n}\n.widget__title[data-v-e86a7906] {\n display: flex;\n align-items: center;\n gap: 8px;\n margin: 0 0 4px 0;\n font-size: 18px;\n font-weight: 600;\n color: var(--theme--foreground);\n}\n.widget__collapse-btn[data-v-e86a7906] {\n background: none;\n border: none;\n padding: 4px;\n cursor: pointer;\n color: var(--theme--foreground-subdued);\n border-radius: 4px;\n}\n.widget__collapse-btn[data-v-e86a7906]:hover {\n background: var(--theme--background-accent);\n}\n.widget__subtitle[data-v-e86a7906] {\n margin: 0;\n font-size: 14px;\n color: var(--theme--foreground-subdued);\n}\n.widget__header-controls[data-v-e86a7906] {\n display: flex;\n gap: 16px;\n align-items: center;\n}\n.widget__url-input[data-v-e86a7906] {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n.widget__url-label[data-v-e86a7906] {\n font-size: 12px;\n color: var(--theme--foreground-subdued);\n white-space: nowrap;\n}\n.widget__url-field[data-v-e86a7906] {\n padding: 6px 10px;\n border: 1px solid var(--theme--form--field--input--border-color);\n border-radius: var(--theme--border-radius);\n font-size: 12px;\n width: 280px;\n background: var(--theme--form--field--input--background);\n color: var(--theme--foreground);\n}\n.widget__section[data-v-e86a7906] {\n margin-bottom: 20px;\n}\n.widget__section-label[data-v-e86a7906] {\n display: block;\n margin-bottom: 8px;\n font-size: 14px;\n font-weight: 500;\n color: var(--theme--foreground);\n}\n.widget__model-buttons[data-v-e86a7906] {\n display: flex;\n gap: 8px;\n}\n.widget__model-btn[data-v-e86a7906] {\n padding: 8px 16px;\n border: 1px solid var(--theme--form--field--input--border-color);\n border-radius: var(--theme--border-radius);\n background: var(--theme--background);\n color: var(--theme--foreground);\n cursor: pointer;\n font-size: 14px;\n transition: all 0.15s ease;\n}\n.widget__model-btn[data-v-e86a7906]:hover {\n border-color: var(--theme--primary);\n}\n.widget__model-btn--active[data-v-e86a7906] {\n background: var(--theme--primary);\n border-color: var(--theme--primary);\n color: var(--theme--primary-foreground, #fff);\n}\n.widget__voice-list[data-v-e86a7906] {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n.widget__section--toggle[data-v-e86a7906] {\n padding: 12px;\n background: var(--theme--background-subdued);\n border-radius: var(--theme--border-radius);\n}\n.widget__toggle[data-v-e86a7906] {\n display: flex;\n align-items: center;\n gap: 8px;\n cursor: pointer;\n}\n.widget__toggle input[data-v-e86a7906] {\n width: 16px;\n height: 16px;\n cursor: pointer;\n}\n.widget__toggle-label[data-v-e86a7906] {\n font-size: 14px;\n font-weight: 500;\n color: var(--theme--foreground);\n}\n.widget__toggle-note[data-v-e86a7906] {\n margin: 4px 0 0 24px;\n font-size: 12px;\n color: var(--theme--foreground-subdued);\n}\n.widget__footer[data-v-e86a7906] {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding-top: 16px;\n border-top: 1px solid var(--theme--border-color-subdued);\n margin-top: 20px;\n}\n.widget__footer-left[data-v-e86a7906],\n.widget__footer-right[data-v-e86a7906] {\n display: flex;\n gap: 8px;\n}\n.widget__variant-nav[data-v-e86a7906] {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 12px;\n margin-bottom: 16px;\n padding: 8px 0;\n}\n.widget__variant-counter[data-v-e86a7906] {\n font-size: 14px;\n font-weight: 500;\n color: var(--theme--foreground-subdued);\n min-width: 60px;\n text-align: center;\n}\n.widget__btn--icon[data-v-e86a7906] {\n padding: 6px;\n min-width: 32px;\n min-height: 32px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.widget__result-date[data-v-e86a7906] {\n margin-top: 8px;\n font-size: 12px;\n color: var(--theme--foreground-subdued);\n}\n.widget__btn[data-v-e86a7906] {\n padding: 8px 16px;\n border: none;\n border-radius: var(--theme--border-radius);\n font-size: 14px;\n font-weight: 500;\n cursor: pointer;\n transition: all 0.15s ease;\n}\n.widget__btn[data-v-e86a7906]:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n.widget__btn--primary[data-v-e86a7906] {\n background: var(--theme--primary);\n color: var(--theme--primary-foreground, #fff);\n}\n.widget__btn--primary[data-v-e86a7906]:hover:not(:disabled) {\n background: var(--theme--primary-accent);\n}\n.widget__btn--secondary[data-v-e86a7906] {\n background: var(--theme--background-accent);\n color: var(--theme--foreground);\n border: 1px solid var(--theme--form--field--input--border-color);\n}\n.widget__btn--secondary[data-v-e86a7906]:hover:not(:disabled) {\n background: var(--theme--background-normal);\n}\n\n/* Processing State */\n.widget__processing[data-v-e86a7906] {\n padding: 40px 20px;\n text-align: center;\n}\n.widget__progress[data-v-e86a7906] {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 12px;\n margin-bottom: 16px;\n font-size: 16px;\n color: var(--theme--foreground);\n}\n.widget__progress-bar[data-v-e86a7906] {\n height: 8px;\n background: var(--theme--background-accent);\n border-radius: 4px;\n overflow: hidden;\n max-width: 400px;\n margin: 0 auto;\n}\n.widget__progress-fill[data-v-e86a7906] {\n height: 100%;\n background: var(--theme--primary);\n transition: width 0.3s ease;\n}\n\n/* Error State */\n.widget__error[data-v-e86a7906] {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 12px;\n padding: 20px;\n color: var(--theme--danger);\n text-align: center;\n}\n.widget__error-actions[data-v-e86a7906] {\n display: flex;\n gap: 8px;\n margin-top: 8px;\n}\n.widget__retry[data-v-e86a7906] {\n padding: 6px 12px;\n background: var(--theme--danger);\n color: #fff;\n border: none;\n border-radius: var(--theme--border-radius);\n cursor: pointer;\n}\n\n/* Loading State */\n.widget__loading[data-v-e86a7906] {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 12px;\n padding: 40px 20px;\n color: var(--theme--foreground-subdued);\n}\n\n/* Result State */\n.widget__result[data-v-e86a7906] {\n padding: 20px;\n background: var(--theme--background-subdued);\n border-radius: var(--theme--border-radius);\n margin-bottom: 20px;\n}\n.widget__result-info[data-v-e86a7906] {\n margin-top: 16px;\n padding-top: 16px;\n border-top: 1px solid var(--theme--border-color-subdued);\n}\n.widget__result-info p[data-v-e86a7906] {\n margin: 4px 0;\n font-size: 14px;\n color: var(--theme--foreground-subdued);\n}\n.widget__result-info strong[data-v-e86a7906] {\n color: var(--theme--foreground);\n}\n\n/* Variants List View */\n.widget__variants-list[data-v-e86a7906] {\n display: flex;\n flex-direction: column;\n gap: 8px;\n max-height: 400px;\n overflow-y: auto;\n margin-bottom: 16px;\n}\n.widget__variant-item[data-v-e86a7906] {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 12px;\n border: 1px solid var(--theme--border-color-subdued);\n border-radius: var(--theme--border-radius);\n cursor: pointer;\n transition: all 0.15s ease;\n}\n.widget__variant-item[data-v-e86a7906]:hover {\n border-color: var(--theme--primary);\n}\n.widget__variant-item--selected[data-v-e86a7906] {\n border-color: var(--theme--primary);\n background: var(--theme--primary-background);\n}\n.widget__variant-radio[data-v-e86a7906] {\n flex-shrink: 0;\n}\n.widget__variant-radio input[data-v-e86a7906] {\n width: 16px;\n height: 16px;\n cursor: pointer;\n}\n.widget__variant-player[data-v-e86a7906] {\n flex: 1;\n min-width: 200px;\n}\n.widget__variant-meta[data-v-e86a7906] {\n display: flex;\n flex-direction: column;\n gap: 2px;\n min-width: 120px;\n}\n.widget__variant-voice[data-v-e86a7906] {\n font-size: 13px;\n font-weight: 500;\n color: var(--theme--foreground);\n}\n.widget__variant-date[data-v-e86a7906] {\n font-size: 11px;\n color: var(--theme--foreground-subdued);\n}\n.widget__btn--danger[data-v-e86a7906] {\n color: var(--theme--danger);\n background: transparent;\n border: none;\n}\n.widget__btn--danger[data-v-e86a7906]:hover {\n background: var(--theme--danger-background);\n}\n.widget__selected-info[data-v-e86a7906] {\n padding: 12px;\n background: var(--theme--background-subdued);\n border-radius: var(--theme--border-radius);\n margin-bottom: 16px;\n}\n.widget__selected-info p[data-v-e86a7906] {\n margin: 4px 0;\n font-size: 14px;\n color: var(--theme--foreground-subdued);\n}\n.widget__selected-info strong[data-v-e86a7906] {\n color: var(--theme--foreground);\n}\n.widget__progress-status[data-v-e86a7906] {\n text-align: center;\n font-size: 12px;\n color: var(--theme--foreground-subdued);\n margin-top: 8px;\n}\n\n/* Animations */\n.spinning[data-v-e86a7906] {\n animation: spin-e86a7906 1s linear infinite;\n}\n@keyframes spin-e86a7906 {\nfrom { transform: rotate(0deg);\n}\nto { transform: rotate(360deg);\n}\n}\n";
|
|
1969
1990
|
n(css,{});
|
|
1970
1991
|
|
|
1971
|
-
var InterfaceComponent = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-
|
|
1992
|
+
var InterfaceComponent = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-e86a7906"], ["__file", "interface.vue"]]);
|
|
1972
1993
|
|
|
1973
1994
|
var index = defineInterface({
|
|
1974
1995
|
id: "voice-widget",
|
package/package.json
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
"name": "@stellartech/voice-widget-directus",
|
|
3
3
|
"description": "Voice generation widget with model/voice selection and audio preview for Directus",
|
|
4
4
|
"icon": "mic",
|
|
5
|
-
"version": "1.0.
|
|
5
|
+
"version": "1.0.5",
|
|
6
6
|
"license": "MIT",
|
|
7
7
|
"readme": "README.md",
|
|
8
8
|
"repository": {
|