@revenexx/studio-integrations 0.5.1 → 0.7.0

package/dist/runtime/components/Integrations/NodeInspector.vue.d.ts

@@ -20,6 +20,12 @@ type __VLS_Props = {
     dynamicOutputs?: Record<string, NodeManifestOutput[]>;
     /** Workflow id — enables sampling real values from the latest run. */
     workflowId?: number | string;
+    /**
+     * Config key → why the LAST SAVE refused it. Not live validation: the server
+     * is the only judge, so a fix shows once it is saved. Absent for a node the
+     * last save had no complaint about.
+     */
+    refusedFields?: Record<string, string>;
 };
 declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     close: () => any;

package/dist/runtime/components/Integrations/NodeLogo.d.vue.ts

@@ -1,3 +1,15 @@
+/**
+ * @deprecated Use `NodeMark` directly. This is a thin back-compat shim kept so
+ * that hosts still referencing the auto-registered `<IntegrationsNodeLogo>`
+ * (e.g. integrations/studio-ui `local-nodes.vue`) keep resolving the component
+ * after PO-194 renamed NodeLogo → NodeMark. Auto-registered components are
+ * public API surface for the hosts, so a silent delete breaks them at a
+ * different repo's build, invisible to this repo's CI.
+ *
+ * The old NodeLogo rendered "logo OR glyph, logo preferred" — exactly
+ * `NodeMark`'s `logo-only` behaviour (logo when present, glyph fallback). Drop
+ * this shim one release after the hosts have migrated to `NodeMark`.
+ */
 import type { NodeManifest } from '../../types/integrations.js';
 type __VLS_Props = {
     manifest: NodeManifest | null;

package/dist/runtime/components/Integrations/NodeLogo.vue

@@ -1,38 +1,10 @@
 <script setup>
-import { computed, ref, watch } from "vue";
-import * as Lucide from "lucide-vue-next";
-const props = defineProps({
+defineProps({
   manifest: { type: [Object, null], required: true },
   size: { type: Number, required: false, default: 16 }
 });
-const failed = ref(false);
-watch(() => props.manifest?.slug, () => {
-  failed.value = false;
-});
-const logoSrc = computed(() => {
-  const imgs = props.manifest?.images ?? [];
-  const logo = imgs.find((i) => i.category === "logo") ?? imgs[0];
-  return logo?.src ?? null;
-});
-const glyph = computed(() => {
-  const name = props.manifest?.icon;
-  if (!name) return Lucide.Box;
-  const cleaned = (name.includes(":") ? name.split(":").pop() : name).split("-").map((s) => s.charAt(0).toUpperCase() + s.slice(1)).join("");
-  return Lucide[cleaned] || Lucide.Box;
-});
 </script>
 
 <template>
-  <img
-    v-if="logoSrc && !failed"
-    :src="logoSrc"
-    :width="size"
-    :height="size"
-    class="shrink-0 rounded-[3px] object-contain"
-    :style="{ width: `${size}px`, height: `${size}px` }"
-    alt=""
-    loading="lazy"
-    @error="failed = true"
-  >
-  <component :is="glyph" v-else :size="size" />
+  <IntegrationsNodeMark :manifest="manifest" :size="size" logo-only />
 </template>

package/dist/runtime/components/Integrations/NodeLogo.vue.d.ts

@@ -1,3 +1,15 @@
+/**
+ * @deprecated Use `NodeMark` directly. This is a thin back-compat shim kept so
+ * that hosts still referencing the auto-registered `<IntegrationsNodeLogo>`
+ * (e.g. integrations/studio-ui `local-nodes.vue`) keep resolving the component
+ * after PO-194 renamed NodeLogo → NodeMark. Auto-registered components are
+ * public API surface for the hosts, so a silent delete breaks them at a
+ * different repo's build, invisible to this repo's CI.
+ *
+ * The old NodeLogo rendered "logo OR glyph, logo preferred" — exactly
+ * `NodeMark`'s `logo-only` behaviour (logo when present, glyph fallback). Drop
+ * this shim one release after the hosts have migrated to `NodeMark`.
+ */
 import type { NodeManifest } from '../../types/integrations.js';
 type __VLS_Props = {
     manifest: NodeManifest | null;

package/dist/runtime/components/Integrations/NodeMark.d.vue.ts

@@ -0,0 +1,15 @@
+import type { NodeManifest } from '../../types/integrations.js';
+type __VLS_Props = {
+    manifest: NodeManifest | null;
+    size?: number;
+    /** Render only the vendor logo (folder/group rows), never the glyph+badge composite. */
+    logoOnly?: boolean;
+    /** Overlay the vendor logo as a corner badge. Off in rows that already name the vendor. */
+    badge?: boolean;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    size: number;
+    badge: boolean;
+    logoOnly: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/runtime/components/Integrations/NodeMark.vue

@@ -0,0 +1,79 @@
+<script setup>
+import { computed, ref, watch } from "vue";
+import { nodeIcon } from "../../data/nodeIcons";
+const props = defineProps({
+  manifest: { type: [Object, null], required: true },
+  size: { type: Number, required: false, default: 16 },
+  logoOnly: { type: Boolean, required: false, default: false },
+  badge: { type: Boolean, required: false, default: true }
+});
+const failed = ref(false);
+const { load: reloadCatalog } = useIntegrationsNodes();
+const refreshed = ref(false);
+watch(() => props.manifest?.slug, () => {
+  failed.value = false;
+  refreshed.value = false;
+});
+function onImageError() {
+  if (!refreshed.value) {
+    refreshed.value = true;
+    void reloadCatalog(true);
+    return;
+  }
+  failed.value = true;
+}
+function onImageLoad() {
+  refreshed.value = false;
+}
+const logoSrc = computed(() => {
+  const imgs = props.manifest?.images ?? [];
+  const logo = imgs.find((i) => i.category === "logo") ?? imgs[0];
+  return logo?.src ?? null;
+});
+const hasIcon = computed(() => typeof props.manifest?.icon === "string" && props.manifest.icon.trim() !== "");
+const glyph = computed(() => nodeIcon(props.manifest?.icon));
+const logoOk = computed(() => !!logoSrc.value && !failed.value);
+const logoPrimary = computed(() => logoOk.value && (props.logoOnly || !hasIcon.value));
+const composite = computed(() => props.badge && !props.logoOnly && logoOk.value && hasIcon.value);
+const badgeSize = computed(() => Math.max(12, Math.round(props.size * 0.72)));
+</script>
+
+<template>
+  <!-- Logo as the primary mark (folder rows, or a node without its own glyph). -->
+  <img
+    v-if="logoPrimary"
+    :src="logoSrc"
+    :width="size"
+    :height="size"
+    class="shrink-0 rounded-[3px] object-contain"
+    :style="{ width: `${size}px`, height: `${size}px` }"
+    alt=""
+    loading="lazy"
+    @error="onImageError"
+    @load="onImageLoad"
+  >
+  <!-- Per-node glyph, with the vendor logo as a plated corner badge when present. -->
+  <span
+    v-else
+    class="relative inline-flex shrink-0"
+    :style="{ width: `${size}px`, height: `${size}px` }"
+  >
+    <component :is="glyph" :size="size" :stroke-width="2.25" />
+    <!-- The badge deliberately sits 3px OUTSIDE this box (integrations-ui
+         geometry): it overlaps the glyph's corner instead of shrinking the
+         glyph. Consequence for call sites — a chip hosting a mark has to leave
+         its overflow visible; an `overflow-hidden` wrapper clips the badge. -->
+    <img
+      v-if="composite"
+      :src="logoSrc"
+      :width="badgeSize"
+      :height="badgeSize"
+      class="absolute rounded-[3px] bg-white object-contain p-px ring-1 ring-black/10"
+      :style="{ width: `${badgeSize}px`, height: `${badgeSize}px`, right: '-3px', bottom: '-3px' }"
+      alt=""
+      loading="lazy"
+      @error="onImageError"
+      @load="onImageLoad"
+    >
+  </span>
+</template>

package/dist/runtime/components/Integrations/NodeMark.vue.d.ts

@@ -0,0 +1,15 @@
+import type { NodeManifest } from '../../types/integrations.js';
+type __VLS_Props = {
+    manifest: NodeManifest | null;
+    size?: number;
+    /** Render only the vendor logo (folder/group rows), never the glyph+badge composite. */
+    logoOnly?: boolean;
+    /** Overlay the vendor logo as a corner badge. Off in rows that already name the vendor. */
+    badge?: boolean;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    size: number;
+    badge: boolean;
+    logoOnly: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/runtime/components/Integrations/NodeOutputSchema.d.vue.ts

@@ -0,0 +1,21 @@
+import type { PortEntry } from '../../data/nodeInputData.js';
+/**
+ * The ports a node hands downstream, with their declared fields and whatever
+ * sample value is known for each.
+ *
+ * Rendered from one place — the Output tab (specs/node-configuration.md AC-4). It
+ * keeps its own file for readability rather than for reuse: the schema list is
+ * a self-contained tree with its own type glyphs and sample formatting, and
+ * inlining it would bury the tab's own markup.
+ *
+ * It was briefly read from a second place, an always-visible summary strip
+ * above the form. That was AC-5, retired before it ever held — see the Gaps
+ * section of the spec. Do not go looking for the second call site.
+ */
+type __VLS_Props = {
+    ports: PortEntry[];
+    /** Sample preview for a port, or for one field of it; null when unknown. */
+    valueAt: (port: string, field?: string) => string | null;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/runtime/components/Integrations/NodeOutputSchema.vue

@@ -0,0 +1,43 @@
+<script setup>
+import { portDotClass } from "../../data/portTone";
+defineProps({
+  ports: { type: Array, required: true },
+  valueAt: { type: Function, required: true }
+});
+const t = useIntegrationsT();
+const TYPE_GLYPHS = {
+  string: { char: "A", cls: "text-sky-600" },
+  number: { char: "#", cls: "text-amber-600" },
+  integer: { char: "#", cls: "text-amber-600" },
+  boolean: { char: "\u2713", cls: "text-emerald-600" },
+  object: { char: "{}", cls: "text-violet-600" },
+  array: { char: "[]", cls: "text-violet-600" }
+};
+function typeGlyph(dataType) {
+  return dataType ? TYPE_GLYPHS[dataType] ?? null : null;
+}
+</script>
+
+<template>
+  <div>
+    <div v-for="p in ports" :key="p.name" class="mb-3 space-y-1">
+      <div class="flex items-center gap-1.5">
+        <span class="size-1.5 rounded-full" :class="portDotClass(p.kind, p.name)" />
+        <span class="text-[10px] font-medium uppercase tracking-wider text-muted-foreground">{{ p.name }}</span>
+      </div>
+      <div v-if="p.fields.length" class="space-y-0.5">
+        <div v-for="f in p.fields" :key="f.name" class="flex min-w-0 items-baseline gap-1 font-mono text-[11px]">
+          <span v-if="typeGlyph(f.dataType)" class="shrink-0 font-semibold" :class="typeGlyph(f.dataType).cls">{{ typeGlyph(f.dataType).char }}</span>
+          <span class="shrink-0 text-slate-700">{{ f.name }}</span>
+          <span v-if="valueAt(p.name, f.name) !== null" class="min-w-0 truncate text-slate-400">: {{ valueAt(p.name, f.name) }}</span>
+        </div>
+      </div>
+      <p v-else class="text-[11px] leading-snug text-muted-foreground">
+        {{ t("integration.nodeInspector.output.schema.noFields") }}<template v-if="valueAt(p.name) !== null">{{ t("integration.nodeInspector.output.schema.sampledSuffix") }} <span class="font-mono">{{ valueAt(p.name) }}</span></template>.
+      </p>
+    </div>
+    <p v-if="!ports.length" class="text-xs leading-snug text-muted-foreground">
+      {{ t("integration.nodeInspector.output.schema.noOutputs") }}
+    </p>
+  </div>
+</template>

package/dist/runtime/components/Integrations/NodeOutputSchema.vue.d.ts

@@ -0,0 +1,21 @@
+import type { PortEntry } from '../../data/nodeInputData.js';
+/**
+ * The ports a node hands downstream, with their declared fields and whatever
+ * sample value is known for each.
+ *
+ * Rendered from one place — the Output tab (specs/node-configuration.md AC-4). It
+ * keeps its own file for readability rather than for reuse: the schema list is
+ * a self-contained tree with its own type glyphs and sample formatting, and
+ * inlining it would bury the tab's own markup.
+ *
+ * It was briefly read from a second place, an always-visible summary strip
+ * above the form. That was AC-5, retired before it ever held — see the Gaps
+ * section of the spec. Do not go looking for the second call site.
+ */
+type __VLS_Props = {
+    ports: PortEntry[];
+    /** Sample preview for a port, or for one field of it; null when unknown. */
+    valueAt: (port: string, field?: string) => string | null;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;