@knime/product-features 1.2.4 → 2.0.1

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.
Files changed (29) hide show
  1. package/CHANGELOG.md +26 -0
  2. package/README.md +46 -0
  3. package/dist/nodes.css +11 -48
  4. package/dist/nodes.js +29 -148
  5. package/dist/nodes.js.map +1 -1
  6. package/dist/src/dataTransfer/upload/ui/types.d.ts.map +1 -1
  7. package/dist/src/nodes/NodeDescriptionTabs/PortTemplateInfo.vue.d.ts.map +1 -1
  8. package/dist/src/nodes/NodeDescriptionTabs/types.d.ts +2 -2
  9. package/dist/src/nodes/NodeDescriptionTabs/types.d.ts.map +1 -1
  10. package/dist/src/nodes/NodePreview/NodePreview.vue.d.ts.map +1 -1
  11. package/dist/src/nodes/NodePreview/types.d.ts +2 -3
  12. package/dist/src/nodes/NodePreview/types.d.ts.map +1 -1
  13. package/dist/src/nodes/index.d.ts +0 -2
  14. package/dist/src/nodes/index.d.ts.map +1 -1
  15. package/dist/toasts.js +606 -54
  16. package/dist/toasts.js.map +1 -1
  17. package/package.json +7 -8
  18. package/dist/src/nodes/PortIcon/PortIcon.vue.d.ts +0 -5
  19. package/dist/src/nodes/PortIcon/PortIcon.vue.d.ts.map +0 -1
  20. package/dist/src/nodes/PortIcon/SVGPortIcon.vue.d.ts +0 -5
  21. package/dist/src/nodes/PortIcon/SVGPortIcon.vue.d.ts.map +0 -1
  22. package/dist/src/nodes/PortIcon/constants.d.ts +0 -3
  23. package/dist/src/nodes/PortIcon/constants.d.ts.map +0 -1
  24. package/dist/src/nodes/PortIcon/enums.d.ts +0 -8
  25. package/dist/src/nodes/PortIcon/enums.d.ts.map +0 -1
  26. package/dist/src/nodes/PortIcon/index.d.ts +0 -3
  27. package/dist/src/nodes/PortIcon/index.d.ts.map +0 -1
  28. package/dist/src/nodes/PortIcon/types.d.ts +0 -19
  29. package/dist/src/nodes/PortIcon/types.d.ts.map +0 -1
package/dist/nodes.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"nodes.js","names":["$attrs"],"sources":["../src/nodes/NodeDescriptionTabs/OptionsTab.vue","../src/nodes/NodeDescriptionTabs/OptionsTab.vue","../src/nodes/PortIcon/constants.ts","../src/nodes/PortIcon/SVGPortIcon.vue","../src/nodes/PortIcon/SVGPortIcon.vue","../src/nodes/PortIcon/PortIcon.vue","../src/nodes/PortIcon/PortIcon.vue","../src/nodes/NodeDescriptionTabs/PortTemplateInfo.vue","../src/nodes/NodeDescriptionTabs/PortTemplateInfo.vue","../src/nodes/NodeDescriptionTabs/PortGroup.vue","../src/nodes/NodeDescriptionTabs/PortGroup.vue","../src/nodes/NodeDescriptionTabs/PortsTab.vue","../src/nodes/NodeDescriptionTabs/PortsTab.vue","../src/nodes/NodeDescriptionTabs/ViewsTab.vue","../src/nodes/NodeDescriptionTabs/ViewsTab.vue","../src/nodes/NodeDescriptionTabs/NodeDescriptionTabs.vue","../src/nodes/NodeDescriptionTabs/NodeDescriptionTabs.vue","../src/nodes/NodePreview/SVGNodeTorso.vue","../src/nodes/NodePreview/SVGNodeTorso.vue","../src/nodes/NodePreview/NodePreview.vue","../src/nodes/NodePreview/NodePreview.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref } from \"vue\";\n\nimport {\n KdsAccordion,\n type KdsAccordionItem,\n KdsDescription,\n} from \"@knime/kds-components\";\n\nimport type { NodeDescriptionOptions } from \"./types\";\n\ntype Props = {\n options: Array<NodeDescriptionOptions>;\n renderAsHtml?: boolean;\n};\n\nconst { options, renderAsHtml } = defineProps<Props>();\n\ntype AccordionItemWithContent = KdsAccordionItem & {\n description?: string;\n content: NodeDescriptionOptions[\"fields\"];\n};\n\nconst accordionItems = computed<AccordionItemWithContent[]>(() => {\n return options.map(\n (option, index) =>\n ({\n id: `section-${index}`,\n headline: option.sectionName,\n description: option.sectionDescription,\n content: option.fields,\n }) satisfies AccordionItemWithContent,\n );\n});\n\nconst modelValue = ref<string[]>([]);\n</script>\n\n<template>\n <div>\n <KdsAccordion\n v-if=\"options.length > 1\"\n v-model=\"modelValue\"\n :items=\"accordionItems\"\n >\n <template v-for=\"item in accordionItems\" :key=\"item.id\" #[item.id]>\n <KdsDescription\n v-if=\"item.description\"\n :text=\"item.description\"\n :render-as-html=\"renderAsHtml\"\n class=\"section-description\"\n />\n\n <template v-for=\"field in item.content\" :key=\"field.name\">\n <div class=\"option-content\">\n <span class=\"name\">\n {{ field.name }} {{ field.optional ? \"(optional)\" : \"\" }}\n </span>\n\n <KdsDescription\n :text=\"field.description\"\n :render-as-html=\"renderAsHtml\"\n />\n </div>\n </template>\n </template>\n </KdsAccordion>\n\n <div v-if=\"options.length === 1\" class=\"single-option-wrapper\">\n <KdsDescription\n v-if=\"options[0].sectionDescription\"\n :text=\"options[0].sectionDescription\"\n :render-as-html=\"renderAsHtml\"\n class=\"section-description\"\n />\n\n <template v-for=\"field in options[0].fields\" :key=\"field.name\">\n <div class=\"option-content\">\n <span class=\"name\">\n {{ field.name }} {{ field.optional ? \"(optional)\" : \"\" }}\n </span>\n\n <KdsDescription\n :text=\"field.description\"\n :render-as-html=\"renderAsHtml\"\n />\n </div>\n </template>\n </div>\n </div>\n</template>\n\n<style scoped>\n.section-description {\n margin-bottom: var(--kds-spacing-container-1x);\n}\n\n.single-option-wrapper {\n display: flex;\n flex-direction: column;\n padding: var(--kds-spacing-container-1x);\n background: var(--kds-color-surface-muted);\n border-radius: var(--kds-border-radius-container-0-37x);\n}\n\n.option-content {\n & .name {\n font: var(--kds-font-base-title-small-strong);\n }\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed, ref } from \"vue\";\n\nimport {\n KdsAccordion,\n type KdsAccordionItem,\n KdsDescription,\n} from \"@knime/kds-components\";\n\nimport type { NodeDescriptionOptions } from \"./types\";\n\ntype Props = {\n options: Array<NodeDescriptionOptions>;\n renderAsHtml?: boolean;\n};\n\nconst { options, renderAsHtml } = defineProps<Props>();\n\ntype AccordionItemWithContent = KdsAccordionItem & {\n description?: string;\n content: NodeDescriptionOptions[\"fields\"];\n};\n\nconst accordionItems = computed<AccordionItemWithContent[]>(() => {\n return options.map(\n (option, index) =>\n ({\n id: `section-${index}`,\n headline: option.sectionName,\n description: option.sectionDescription,\n content: option.fields,\n }) satisfies AccordionItemWithContent,\n );\n});\n\nconst modelValue = ref<string[]>([]);\n</script>\n\n<template>\n <div>\n <KdsAccordion\n v-if=\"options.length > 1\"\n v-model=\"modelValue\"\n :items=\"accordionItems\"\n >\n <template v-for=\"item in accordionItems\" :key=\"item.id\" #[item.id]>\n <KdsDescription\n v-if=\"item.description\"\n :text=\"item.description\"\n :render-as-html=\"renderAsHtml\"\n class=\"section-description\"\n />\n\n <template v-for=\"field in item.content\" :key=\"field.name\">\n <div class=\"option-content\">\n <span class=\"name\">\n {{ field.name }} {{ field.optional ? \"(optional)\" : \"\" }}\n </span>\n\n <KdsDescription\n :text=\"field.description\"\n :render-as-html=\"renderAsHtml\"\n />\n </div>\n </template>\n </template>\n </KdsAccordion>\n\n <div v-if=\"options.length === 1\" class=\"single-option-wrapper\">\n <KdsDescription\n v-if=\"options[0].sectionDescription\"\n :text=\"options[0].sectionDescription\"\n :render-as-html=\"renderAsHtml\"\n class=\"section-description\"\n />\n\n <template v-for=\"field in options[0].fields\" :key=\"field.name\">\n <div class=\"option-content\">\n <span class=\"name\">\n {{ field.name }} {{ field.optional ? \"(optional)\" : \"\" }}\n </span>\n\n <KdsDescription\n :text=\"field.description\"\n :render-as-html=\"renderAsHtml\"\n />\n </div>\n </template>\n </div>\n </div>\n</template>\n\n<style scoped>\n.section-description {\n margin-bottom: var(--kds-spacing-container-1x);\n}\n\n.single-option-wrapper {\n display: flex;\n flex-direction: column;\n padding: var(--kds-spacing-container-1x);\n background: var(--kds-color-surface-muted);\n border-radius: var(--kds-border-radius-container-0-37x);\n}\n\n.option-content {\n & .name {\n font: var(--kds-font-base-title-small-strong);\n }\n}\n</style>\n","export const PORT_SIZE = 8; // px\nexport const PORT_STROKE_WIDTH = 1.4; // px\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport { PORT_SIZE, PORT_STROKE_WIDTH } from \"./constants\";\nimport type { PortIconProps } from \"./types\";\n\nconst { filled = true, type, color } = defineProps<PortIconProps>();\n\nconst trianglePath = computed(() => {\n // draw triangle around middle point\n let [x1, y1, x2, y3] = [\n -PORT_SIZE / 2,\n -PORT_SIZE / 2,\n PORT_SIZE / 2,\n PORT_SIZE / 2,\n ];\n\n // y and d are chosen so the triangle (including strokeWidth) fits precisely in the port (portSize x portSize)\n /* eslint-disable no-magic-numbers */\n const d = Math.sqrt(5) / 2;\n const y = d / 2 + 1 / 4;\n /* eslint-enable no-magic-numbers */\n\n // move points towards the center of the triangle according to strokeWidth\n x1 += PORT_STROKE_WIDTH / 2;\n x2 -= PORT_STROKE_WIDTH * d;\n y1 += PORT_STROKE_WIDTH * y;\n y3 -= PORT_STROKE_WIDTH * y;\n\n // draw triangle clock-wise\n return `${x1},${y1} ${x2},${0} ${x1},${y3}`;\n});\n</script>\n\n<template>\n <!-- data table port -->\n <polygon\n v-if=\"type === 'table'\"\n :points=\"trianglePath\"\n :class=\"{ filled }\"\n :data-type=\"type\"\n :stroke-width=\"PORT_STROKE_WIDTH\"\n v-bind=\"$attrs\"\n />\n\n <!-- flow variable port -->\n <circle\n v-else-if=\"type === 'flowVariable'\"\n :r=\"PORT_SIZE / 2 - PORT_STROKE_WIDTH / 2\"\n :class=\"{ filled }\"\n :data-type=\"type\"\n :stroke-width=\"PORT_STROKE_WIDTH\"\n v-bind=\"$attrs\"\n />\n\n <!-- other port -->\n <rect\n v-else\n :width=\"PORT_SIZE - PORT_STROKE_WIDTH\"\n :height=\"PORT_SIZE - PORT_STROKE_WIDTH\"\n :x=\"-PORT_SIZE / 2 + PORT_STROKE_WIDTH / 2\"\n :y=\"-PORT_SIZE / 2 + PORT_STROKE_WIDTH / 2\"\n :class=\"{ filled }\"\n :data-type=\"type\"\n :stroke-width=\"PORT_STROKE_WIDTH\"\n v-bind=\"$attrs\"\n />\n</template>\n\n<style scoped>\n[data-type=\"flowVariable\"] {\n fill: transparent;\n stroke: var(--kds-color-port-flow-variable);\n\n &.filled {\n fill: var(--kds-color-port-flow-variable);\n }\n}\n\n[data-type=\"table\"] {\n fill: transparent;\n stroke: var(--kds-color-port-data);\n\n &.filled {\n fill: var(--kds-color-port-data);\n }\n}\n\n[data-type=\"other\"],\n[data-type=\"generic\"] {\n fill: transparent;\n\n /** dark mode for custom colors generated using oklch */\n --base: v-bind(color);\n --color: light-dark(\n var(--base),\n oklch(from var(--base) calc(1 - l * 0.8) c h)\n );\n\n stroke: var(--color);\n\n &.filled {\n fill: var(--color);\n }\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport { PORT_SIZE, PORT_STROKE_WIDTH } from \"./constants\";\nimport type { PortIconProps } from \"./types\";\n\nconst { filled = true, type, color } = defineProps<PortIconProps>();\n\nconst trianglePath = computed(() => {\n // draw triangle around middle point\n let [x1, y1, x2, y3] = [\n -PORT_SIZE / 2,\n -PORT_SIZE / 2,\n PORT_SIZE / 2,\n PORT_SIZE / 2,\n ];\n\n // y and d are chosen so the triangle (including strokeWidth) fits precisely in the port (portSize x portSize)\n /* eslint-disable no-magic-numbers */\n const d = Math.sqrt(5) / 2;\n const y = d / 2 + 1 / 4;\n /* eslint-enable no-magic-numbers */\n\n // move points towards the center of the triangle according to strokeWidth\n x1 += PORT_STROKE_WIDTH / 2;\n x2 -= PORT_STROKE_WIDTH * d;\n y1 += PORT_STROKE_WIDTH * y;\n y3 -= PORT_STROKE_WIDTH * y;\n\n // draw triangle clock-wise\n return `${x1},${y1} ${x2},${0} ${x1},${y3}`;\n});\n</script>\n\n<template>\n <!-- data table port -->\n <polygon\n v-if=\"type === 'table'\"\n :points=\"trianglePath\"\n :class=\"{ filled }\"\n :data-type=\"type\"\n :stroke-width=\"PORT_STROKE_WIDTH\"\n v-bind=\"$attrs\"\n />\n\n <!-- flow variable port -->\n <circle\n v-else-if=\"type === 'flowVariable'\"\n :r=\"PORT_SIZE / 2 - PORT_STROKE_WIDTH / 2\"\n :class=\"{ filled }\"\n :data-type=\"type\"\n :stroke-width=\"PORT_STROKE_WIDTH\"\n v-bind=\"$attrs\"\n />\n\n <!-- other port -->\n <rect\n v-else\n :width=\"PORT_SIZE - PORT_STROKE_WIDTH\"\n :height=\"PORT_SIZE - PORT_STROKE_WIDTH\"\n :x=\"-PORT_SIZE / 2 + PORT_STROKE_WIDTH / 2\"\n :y=\"-PORT_SIZE / 2 + PORT_STROKE_WIDTH / 2\"\n :class=\"{ filled }\"\n :data-type=\"type\"\n :stroke-width=\"PORT_STROKE_WIDTH\"\n v-bind=\"$attrs\"\n />\n</template>\n\n<style scoped>\n[data-type=\"flowVariable\"] {\n fill: transparent;\n stroke: var(--kds-color-port-flow-variable);\n\n &.filled {\n fill: var(--kds-color-port-flow-variable);\n }\n}\n\n[data-type=\"table\"] {\n fill: transparent;\n stroke: var(--kds-color-port-data);\n\n &.filled {\n fill: var(--kds-color-port-data);\n }\n}\n\n[data-type=\"other\"],\n[data-type=\"generic\"] {\n fill: transparent;\n\n /** dark mode for custom colors generated using oklch */\n --base: v-bind(color);\n --color: light-dark(\n var(--base),\n oklch(from var(--base) calc(1 - l * 0.8) c h)\n );\n\n stroke: var(--color);\n\n &.filled {\n fill: var(--color);\n }\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport SVGPortIcon from \"./SVGPortIcon.vue\";\nimport { PORT_SIZE } from \"./constants\";\nimport type { PortIconProps } from \"./types\";\n\nconst { filled = true, type, color } = defineProps<PortIconProps>();\n\nconst viewBox = computed(() =>\n [-PORT_SIZE / 2, -PORT_SIZE / 2, PORT_SIZE, PORT_SIZE].join(\" \"),\n);\n</script>\n\n<template>\n <svg :viewBox=\"viewBox\" :width=\"PORT_SIZE\" :height=\"PORT_SIZE\">\n <SVGPortIcon :filled :type :color />\n </svg>\n</template>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport SVGPortIcon from \"./SVGPortIcon.vue\";\nimport { PORT_SIZE } from \"./constants\";\nimport type { PortIconProps } from \"./types\";\n\nconst { filled = true, type, color } = defineProps<PortIconProps>();\n\nconst viewBox = computed(() =>\n [-PORT_SIZE / 2, -PORT_SIZE / 2, PORT_SIZE, PORT_SIZE].join(\" \"),\n);\n</script>\n\n<template>\n <svg :viewBox=\"viewBox\" :width=\"PORT_SIZE\" :height=\"PORT_SIZE\">\n <SVGPortIcon :filled :type :color />\n </svg>\n</template>\n","<script setup lang=\"ts\">\nimport { KdsDescription } from \"@knime/kds-components\";\n\nimport PortIcon from \"../PortIcon/PortIcon.vue\";\n\nimport type { PortTemplate } from \"./types\";\n\ntype Props = {\n port: PortTemplate;\n showDescription: boolean;\n};\n\ndefineProps<Props>();\n</script>\n\n<template>\n <div class=\"wrapper\">\n <div class=\"icon\">\n <PortIcon\n :type=\"port.type\"\n :color=\"port.color\"\n :filled=\"!port.optional\"\n />\n </div>\n <span class=\"title\">Type: {{ port.typeDisplayName }}</span>\n\n <span class=\"name title\">Name: {{ port.name }}</span>\n\n <KdsDescription\n v-if=\"showDescription\"\n class=\"description\"\n :text=\"port.description\"\n render-as-html\n />\n </div>\n</template>\n\n<style scoped>\n.wrapper {\n display: grid;\n grid-template-columns: var(--kds-spacing-container-0-5x) 1fr;\n gap: var(--kds-spacing-container-0-5x);\n}\n\n.icon {\n display: flex;\n align-items: center;\n}\n\n.name,\n.description {\n grid-column: 2;\n}\n\n.title {\n font: var(--kds-font-base-title-small-strong);\n}\n</style>\n","<script setup lang=\"ts\">\nimport { KdsDescription } from \"@knime/kds-components\";\n\nimport PortIcon from \"../PortIcon/PortIcon.vue\";\n\nimport type { PortTemplate } from \"./types\";\n\ntype Props = {\n port: PortTemplate;\n showDescription: boolean;\n};\n\ndefineProps<Props>();\n</script>\n\n<template>\n <div class=\"wrapper\">\n <div class=\"icon\">\n <PortIcon\n :type=\"port.type\"\n :color=\"port.color\"\n :filled=\"!port.optional\"\n />\n </div>\n <span class=\"title\">Type: {{ port.typeDisplayName }}</span>\n\n <span class=\"name title\">Name: {{ port.name }}</span>\n\n <KdsDescription\n v-if=\"showDescription\"\n class=\"description\"\n :text=\"port.description\"\n render-as-html\n />\n </div>\n</template>\n\n<style scoped>\n.wrapper {\n display: grid;\n grid-template-columns: var(--kds-spacing-container-0-5x) 1fr;\n gap: var(--kds-spacing-container-0-5x);\n}\n\n.icon {\n display: flex;\n align-items: center;\n}\n\n.name,\n.description {\n grid-column: 2;\n}\n\n.title {\n font: var(--kds-font-base-title-small-strong);\n}\n</style>\n","<script setup lang=\"ts\">\nimport { KdsDescription } from \"@knime/kds-components\";\n\nimport PortTemplateInfo from \"./PortTemplateInfo.vue\";\nimport type { PortTemplate } from \"./types\";\n\ntype Props = {\n name: string;\n description?: string;\n ports: Array<PortTemplate>;\n isDynamicGroup?: boolean;\n};\n\ndefineProps<Props>();\n</script>\n\n<template>\n <div class=\"port-group-card\">\n <span class=\"group-name\">{{ name }}</span>\n\n <KdsDescription v-if=\"description\" :text=\"description\" render-as-html />\n\n <template v-for=\"port in ports\" :key=\"port.id\">\n <PortTemplateInfo :port=\"port\" :show-description=\"!isDynamicGroup\" />\n </template>\n </div>\n</template>\n\n<style scoped>\n.port-group-card {\n display: flex;\n flex-direction: column;\n gap: var(--kds-spacing-container-0-75x);\n padding: var(--kds-spacing-container-1x);\n background: var(--kds-color-surface-muted);\n border-radius: var(--kds-border-radius-container-0-37x);\n\n & .group-name {\n font: var(--kds-font-base-title-small-strong);\n }\n}\n</style>\n","<script setup lang=\"ts\">\nimport { KdsDescription } from \"@knime/kds-components\";\n\nimport PortTemplateInfo from \"./PortTemplateInfo.vue\";\nimport type { PortTemplate } from \"./types\";\n\ntype Props = {\n name: string;\n description?: string;\n ports: Array<PortTemplate>;\n isDynamicGroup?: boolean;\n};\n\ndefineProps<Props>();\n</script>\n\n<template>\n <div class=\"port-group-card\">\n <span class=\"group-name\">{{ name }}</span>\n\n <KdsDescription v-if=\"description\" :text=\"description\" render-as-html />\n\n <template v-for=\"port in ports\" :key=\"port.id\">\n <PortTemplateInfo :port=\"port\" :show-description=\"!isDynamicGroup\" />\n </template>\n </div>\n</template>\n\n<style scoped>\n.port-group-card {\n display: flex;\n flex-direction: column;\n gap: var(--kds-spacing-container-0-75x);\n padding: var(--kds-spacing-container-1x);\n background: var(--kds-color-surface-muted);\n border-radius: var(--kds-border-radius-container-0-37x);\n\n & .group-name {\n font: var(--kds-font-base-title-small-strong);\n }\n}\n</style>\n","<script setup lang=\"ts\">\nimport PortGroup from \"./PortGroup.vue\";\nimport type { DynamicPortGroup, PortTemplate } from \"./types\";\n\ntype Props = {\n inputPorts: Array<PortTemplate>;\n outputPorts: Array<PortTemplate>;\n dynamicInputGroups?: Array<DynamicPortGroup>;\n dynamicOutputGroups?: Array<DynamicPortGroup>;\n};\n\nconst { dynamicInputGroups = [], dynamicOutputGroups = [] } =\n defineProps<Props>();\n</script>\n\n<template>\n <div class=\"port-list\">\n <PortGroup\n v-if=\"inputPorts.length > 0\"\n name=\"Input ports\"\n :ports=\"inputPorts\"\n />\n\n <PortGroup\n v-if=\"outputPorts.length > 0\"\n name=\"Output ports\"\n :ports=\"outputPorts\"\n />\n\n <template v-for=\"group in dynamicInputGroups\" :key=\"group.name\">\n <PortGroup\n v-if=\"group.types.length > 0\"\n :name=\"group.name + ' (Dynamic Inport)'\"\n :description=\"group.description\"\n :ports=\"group.types\"\n is-dynamic-group\n />\n </template>\n\n <template v-for=\"group in dynamicOutputGroups\" :key=\"group.name\">\n <PortGroup\n v-if=\"group.types.length > 0\"\n :name=\"group.name + ' (Dynamic Outport)'\"\n :description=\"group.description\"\n :ports=\"group.types\"\n is-dynamic-group\n />\n </template>\n </div>\n</template>\n\n<style scoped>\n.port-list {\n display: flex;\n flex-direction: column;\n gap: var(--kds-spacing-container-0-5x);\n}\n</style>\n","<script setup lang=\"ts\">\nimport PortGroup from \"./PortGroup.vue\";\nimport type { DynamicPortGroup, PortTemplate } from \"./types\";\n\ntype Props = {\n inputPorts: Array<PortTemplate>;\n outputPorts: Array<PortTemplate>;\n dynamicInputGroups?: Array<DynamicPortGroup>;\n dynamicOutputGroups?: Array<DynamicPortGroup>;\n};\n\nconst { dynamicInputGroups = [], dynamicOutputGroups = [] } =\n defineProps<Props>();\n</script>\n\n<template>\n <div class=\"port-list\">\n <PortGroup\n v-if=\"inputPorts.length > 0\"\n name=\"Input ports\"\n :ports=\"inputPorts\"\n />\n\n <PortGroup\n v-if=\"outputPorts.length > 0\"\n name=\"Output ports\"\n :ports=\"outputPorts\"\n />\n\n <template v-for=\"group in dynamicInputGroups\" :key=\"group.name\">\n <PortGroup\n v-if=\"group.types.length > 0\"\n :name=\"group.name + ' (Dynamic Inport)'\"\n :description=\"group.description\"\n :ports=\"group.types\"\n is-dynamic-group\n />\n </template>\n\n <template v-for=\"group in dynamicOutputGroups\" :key=\"group.name\">\n <PortGroup\n v-if=\"group.types.length > 0\"\n :name=\"group.name + ' (Dynamic Outport)'\"\n :description=\"group.description\"\n :ports=\"group.types\"\n is-dynamic-group\n />\n </template>\n </div>\n</template>\n\n<style scoped>\n.port-list {\n display: flex;\n flex-direction: column;\n gap: var(--kds-spacing-container-0-5x);\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport { KdsDescription } from \"@knime/kds-components\";\n\nimport type { NodeDescriptionView } from \"./types\";\n\ntype Props = {\n views: Array<NodeDescriptionView>;\n};\n\nconst props = defineProps<Props>();\n\nconst viewsWithId = computed<Array<NodeDescriptionView & { id: string }>>(() =>\n props.views.map((view, index) => {\n const id = `view-${index}`;\n return { id, ...view };\n }),\n);\n</script>\n\n<template>\n <div v-for=\"view in viewsWithId\" :key=\"view.id\" class=\"card-wrapper\">\n <span class=\"name\">{{ view.name }}</span>\n <KdsDescription\n v-if=\"view.description\"\n :text=\"view.description\"\n render-as-html\n />\n </div>\n</template>\n\n<style scoped>\n.card-wrapper {\n display: flex;\n flex-direction: column;\n padding: var(--kds-spacing-container-1x);\n margin-bottom: var(--kds-spacing-container-0-25x);\n background: var(--kds-color-surface-muted);\n border-radius: var(--kds-border-radius-container-0-37x);\n}\n\n.name {\n font: var(--kds-font-base-title-small-strong);\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport { KdsDescription } from \"@knime/kds-components\";\n\nimport type { NodeDescriptionView } from \"./types\";\n\ntype Props = {\n views: Array<NodeDescriptionView>;\n};\n\nconst props = defineProps<Props>();\n\nconst viewsWithId = computed<Array<NodeDescriptionView & { id: string }>>(() =>\n props.views.map((view, index) => {\n const id = `view-${index}`;\n return { id, ...view };\n }),\n);\n</script>\n\n<template>\n <div v-for=\"view in viewsWithId\" :key=\"view.id\" class=\"card-wrapper\">\n <span class=\"name\">{{ view.name }}</span>\n <KdsDescription\n v-if=\"view.description\"\n :text=\"view.description\"\n render-as-html\n />\n </div>\n</template>\n\n<style scoped>\n.card-wrapper {\n display: flex;\n flex-direction: column;\n padding: var(--kds-spacing-container-1x);\n margin-bottom: var(--kds-spacing-container-0-25x);\n background: var(--kds-color-surface-muted);\n border-radius: var(--kds-border-radius-container-0-37x);\n}\n\n.name {\n font: var(--kds-font-base-title-small-strong);\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed, ref } from \"vue\";\n\nimport {\n KdsEmptyState,\n KdsTabBar,\n type KdsTabBarItem,\n} from \"@knime/kds-components\";\n\nimport OptionsTab from \"./OptionsTab.vue\";\nimport PortsTab from \"./PortsTab.vue\";\nimport ViewsTab from \"./ViewsTab.vue\";\nimport type { NodeDescriptionTabsProps } from \"./types\";\n\nconst {\n inputPorts = [],\n outputPorts = [],\n dynamicInputPorts = [],\n dynamicOutputPorts = [],\n optionsData = [],\n viewsData = [],\n emptyText = \"No ports, options or views available.\",\n renderAsHtml = false,\n tabBarFullWidth = false,\n} = defineProps<NodeDescriptionTabsProps>();\n\nconst TAB_IDS = {\n PORTS: \"ports\",\n OPTIONS: \"options\",\n VIEW: \"view\",\n} as const;\n\ntype TabIds = (typeof TAB_IDS)[keyof typeof TAB_IDS];\n\nconst activeTab = ref<TabIds | undefined>();\n\nconst hasPorts = computed(\n () =>\n inputPorts.length > 0 ||\n outputPorts.length > 0 ||\n dynamicInputPorts.length > 0 ||\n dynamicOutputPorts.length > 0,\n);\n\nconst tabs = computed<KdsTabBarItem[]>(() => [\n {\n id: \"tab-ports\",\n value: TAB_IDS.PORTS,\n label: \"Ports\",\n panelId: \"panel-ports\",\n accessory: {\n type: \"icon\",\n name: \"connection\",\n },\n disabled: !hasPorts.value,\n },\n {\n id: \"tab-options\",\n value: TAB_IDS.OPTIONS,\n label: \"Options\",\n panelId: \"panel-options\",\n accessory: {\n type: \"icon\",\n name: \"parameter\",\n },\n disabled: optionsData.length < 1,\n },\n {\n id: \"tab-view\",\n value: TAB_IDS.VIEW,\n label: \"View\",\n panelId: \"panel-view\",\n accessory: {\n type: \"icon\",\n name: \"eye\",\n },\n disabled: viewsData.length < 1,\n },\n]);\n</script>\n\n<template>\n <div>\n <KdsTabBar\n v-model=\"activeTab\"\n :full-width=\"tabBarFullWidth\"\n size=\"small\"\n :tabs=\"tabs\"\n />\n\n <div class=\"content\">\n <PortsTab\n v-if=\"activeTab === TAB_IDS.PORTS\"\n id=\"panel-ports\"\n role=\"tabpanel\"\n aria-labelledby=\"tab-ports\"\n tabindex=\"0\"\n :input-ports=\"inputPorts\"\n :output-ports=\"outputPorts\"\n :dynamic-input-groups=\"dynamicInputPorts\"\n :dynamic-output-groups=\"dynamicOutputPorts\"\n />\n\n <OptionsTab\n v-if=\"activeTab === TAB_IDS.OPTIONS\"\n id=\"panel-options\"\n role=\"tabpanel\"\n aria-labelledby=\"tab-options\"\n tabindex=\"0\"\n :options=\"optionsData\"\n :render-as-html=\"renderAsHtml\"\n />\n\n <ViewsTab\n v-if=\"activeTab === TAB_IDS.VIEW\"\n id=\"panel-view\"\n role=\"tabpanel\"\n aria-labelledby=\"tab-view\"\n tabindex=\"0\"\n :views=\"viewsData\"\n />\n\n <KdsEmptyState\n v-if=\"!activeTab\"\n :headline=\"emptyText\"\n class=\"empty-state\"\n />\n </div>\n </div>\n</template>\n\n<style scoped>\n.content {\n padding: var(--kds-spacing-container-0-5x) 0;\n color: var(--kds-color-text-and-icon-neutral);\n}\n\n.empty-state {\n margin: 0 auto;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed, ref } from \"vue\";\n\nimport {\n KdsEmptyState,\n KdsTabBar,\n type KdsTabBarItem,\n} from \"@knime/kds-components\";\n\nimport OptionsTab from \"./OptionsTab.vue\";\nimport PortsTab from \"./PortsTab.vue\";\nimport ViewsTab from \"./ViewsTab.vue\";\nimport type { NodeDescriptionTabsProps } from \"./types\";\n\nconst {\n inputPorts = [],\n outputPorts = [],\n dynamicInputPorts = [],\n dynamicOutputPorts = [],\n optionsData = [],\n viewsData = [],\n emptyText = \"No ports, options or views available.\",\n renderAsHtml = false,\n tabBarFullWidth = false,\n} = defineProps<NodeDescriptionTabsProps>();\n\nconst TAB_IDS = {\n PORTS: \"ports\",\n OPTIONS: \"options\",\n VIEW: \"view\",\n} as const;\n\ntype TabIds = (typeof TAB_IDS)[keyof typeof TAB_IDS];\n\nconst activeTab = ref<TabIds | undefined>();\n\nconst hasPorts = computed(\n () =>\n inputPorts.length > 0 ||\n outputPorts.length > 0 ||\n dynamicInputPorts.length > 0 ||\n dynamicOutputPorts.length > 0,\n);\n\nconst tabs = computed<KdsTabBarItem[]>(() => [\n {\n id: \"tab-ports\",\n value: TAB_IDS.PORTS,\n label: \"Ports\",\n panelId: \"panel-ports\",\n accessory: {\n type: \"icon\",\n name: \"connection\",\n },\n disabled: !hasPorts.value,\n },\n {\n id: \"tab-options\",\n value: TAB_IDS.OPTIONS,\n label: \"Options\",\n panelId: \"panel-options\",\n accessory: {\n type: \"icon\",\n name: \"parameter\",\n },\n disabled: optionsData.length < 1,\n },\n {\n id: \"tab-view\",\n value: TAB_IDS.VIEW,\n label: \"View\",\n panelId: \"panel-view\",\n accessory: {\n type: \"icon\",\n name: \"eye\",\n },\n disabled: viewsData.length < 1,\n },\n]);\n</script>\n\n<template>\n <div>\n <KdsTabBar\n v-model=\"activeTab\"\n :full-width=\"tabBarFullWidth\"\n size=\"small\"\n :tabs=\"tabs\"\n />\n\n <div class=\"content\">\n <PortsTab\n v-if=\"activeTab === TAB_IDS.PORTS\"\n id=\"panel-ports\"\n role=\"tabpanel\"\n aria-labelledby=\"tab-ports\"\n tabindex=\"0\"\n :input-ports=\"inputPorts\"\n :output-ports=\"outputPorts\"\n :dynamic-input-groups=\"dynamicInputPorts\"\n :dynamic-output-groups=\"dynamicOutputPorts\"\n />\n\n <OptionsTab\n v-if=\"activeTab === TAB_IDS.OPTIONS\"\n id=\"panel-options\"\n role=\"tabpanel\"\n aria-labelledby=\"tab-options\"\n tabindex=\"0\"\n :options=\"optionsData\"\n :render-as-html=\"renderAsHtml\"\n />\n\n <ViewsTab\n v-if=\"activeTab === TAB_IDS.VIEW\"\n id=\"panel-view\"\n role=\"tabpanel\"\n aria-labelledby=\"tab-view\"\n tabindex=\"0\"\n :views=\"viewsData\"\n />\n\n <KdsEmptyState\n v-if=\"!activeTab\"\n :headline=\"emptyText\"\n class=\"empty-state\"\n />\n </div>\n </div>\n</template>\n\n<style scoped>\n.content {\n padding: var(--kds-spacing-container-0-5x) 0;\n color: var(--kds-color-text-and-icon-neutral);\n}\n\n.empty-state {\n margin: 0 auto;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport { NODE_SIZE } from \"./constants\";\nimport type { NodeTorsoProps } from \"./types\";\n\n/**\n * Draws the Torso (colored rounded rectangle with icon) of a Node or Component\n * This vue component only draws regular Nodes/Components, no Metanodes, no Unknown nor Missing Nodes\n * Only works inside of a <svg> element.\n */\nconst backgroundPaths: Record<string, string> = {\n default:\n \"M0,29.2L0,2.8C0,1.3,1.3,0,2.8,0l26.3,0C30.7,0,32,1.3,32,2.8v26.3c0,1.6-1.3,2.8-2.8,2.8H2.8C1.3,32,0,30.\" +\n \"7,0,29.2z\",\n LoopEnd:\n \"M32,2.8v26.3c0,1.6-1.3,2.8-2.8,2.8H4L0,16.1L4,0l25.2,0C30.7,0,32,1.3,32,2.8z\",\n LoopStart:\n \"M0,29.2L0,2.8C0,1.3,1.3,0,2.8,0L32,0l-4,15.9L32,32H2.8C1.3,32,0,30.7,0,29.2z\",\n ScopeEnd:\n \"M32,2.8v26.3c0,1.6-1.3,2.8-2.8,2.8H4L0,16.1L4,0l25.2,0C30.7,0,32,1.3,32,2.8z\",\n ScopeStart:\n \"M0,29.2L0,2.8C0,1.3,1.3,0,2.8,0L32,0l-4,15.9L32,32H2.8C1.3,32,0,30.7,0,29.2z\",\n VirtualIn:\n \"M32,2.8v26.3c0,1.6-1.3,2.8-2.8,2.8H6.5L0,25.9l5.2-10L0.7,7.2L6.5,0l22.7,0C30.7,0,32,1.3,32,2.8z\",\n VirtualOut:\n \"M0,29.2L0,2.8C0,1.3,1.3,0,2.8,0L32,0l-5.8,7.2l4.5,8.7l-5.2,10L32,32H2.8C1.3,32,0,30.7,0,29.2z\",\n};\n\nconst componentBackgroundPortion = 0.75;\n\nconst {\n type = null,\n isComponent = false,\n icon = null,\n} = defineProps<NodeTorsoProps>();\n\nconst backgroundPath = computed(\n () => (type && backgroundPaths[type]) || backgroundPaths.default,\n);\n\nconst componentBackgroundTransformation = computed(() => {\n const offset = NODE_SIZE / 2;\n const scaleFactor = componentBackgroundPortion;\n return `translate(${offset}, ${offset}) scale(${scaleFactor}) translate(-${offset}, -${offset})`;\n});\n</script>\n\n<template>\n <g>\n <path\n :d=\"backgroundPath\"\n :class=\"['bg', { component: isComponent }]\"\n :data-type=\"isComponent ? null : type\"\n />\n <!-- components may have two layers of background. This is the inner part, a shrunk version of the outer frame -->\n <path\n v-if=\"isComponent && type\"\n :d=\"backgroundPath\"\n class=\"bg\"\n :data-type=\"type\"\n :transform=\"componentBackgroundTransformation\"\n />\n <image\n v-if=\"icon\"\n :xlink:href=\"icon\"\n x=\"8\"\n y=\"8\"\n width=\"16\"\n height=\"16\"\n pointer-events=\"none\"\n />\n </g>\n</template>\n\n<style scoped>\n.bg {\n /** default color is unknown */\n fill: var(--kds-color-nodes-and-variables-unknown);\n\n &.component {\n fill: var(--kds-color-nodes-and-variables-component);\n }\n\n &[data-type=\"Configuration\"] {\n fill: var(--kds-color-nodes-and-variables-configuration);\n }\n\n &[data-type=\"Container\"] {\n fill: var(--kds-color-nodes-and-variables-container);\n }\n\n &[data-type=\"Learner\"] {\n fill: var(--kds-color-nodes-and-variables-learner);\n }\n\n &[data-type=\"Loop\"] {\n fill: var(--kds-color-nodes-and-variables-loop);\n }\n\n &[data-type=\"LoopEnd\"] {\n fill: var(--kds-color-nodes-and-variables-loop);\n }\n\n &[data-type=\"LoopStart\"] {\n fill: var(--kds-color-nodes-and-variables-loop);\n }\n\n &[data-type=\"Manipulator\"] {\n fill: var(--kds-color-nodes-and-variables-manipulator);\n }\n\n &[data-type=\"Other\"] {\n fill: var(--kds-color-nodes-and-variables-other);\n }\n\n &[data-type=\"Predictor\"] {\n fill: var(--kds-color-nodes-and-variables-predictor);\n }\n\n &[data-type=\"ScopeEnd\"] {\n fill: var(--kds-color-nodes-and-variables-scope);\n }\n\n &[data-type=\"ScopeStart\"] {\n fill: var(--kds-color-nodes-and-variables-scope);\n }\n\n &[data-type=\"Sink\"] {\n fill: var(--kds-color-nodes-and-variables-sink);\n }\n\n &[data-type=\"Source\"] {\n fill: var(--kds-color-nodes-and-variables-source);\n }\n\n &[data-type=\"Visualizer\"] {\n fill: var(--kds-color-nodes-and-variables-visualizer);\n }\n\n &[data-type=\"QuickForm\"] {\n fill: var(--kds-color-nodes-and-variables-quickform);\n }\n\n &[data-type=\"Widget\"] {\n fill: var(--kds-color-nodes-and-variables-widget);\n }\n\n /** Virtual = Components */\n &[data-type=\"VirtualIn\"],\n &[data-type=\"VirtualOut\"] {\n fill: var(--kds-color-nodes-and-variables-component);\n }\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport { NODE_SIZE } from \"./constants\";\nimport type { NodeTorsoProps } from \"./types\";\n\n/**\n * Draws the Torso (colored rounded rectangle with icon) of a Node or Component\n * This vue component only draws regular Nodes/Components, no Metanodes, no Unknown nor Missing Nodes\n * Only works inside of a <svg> element.\n */\nconst backgroundPaths: Record<string, string> = {\n default:\n \"M0,29.2L0,2.8C0,1.3,1.3,0,2.8,0l26.3,0C30.7,0,32,1.3,32,2.8v26.3c0,1.6-1.3,2.8-2.8,2.8H2.8C1.3,32,0,30.\" +\n \"7,0,29.2z\",\n LoopEnd:\n \"M32,2.8v26.3c0,1.6-1.3,2.8-2.8,2.8H4L0,16.1L4,0l25.2,0C30.7,0,32,1.3,32,2.8z\",\n LoopStart:\n \"M0,29.2L0,2.8C0,1.3,1.3,0,2.8,0L32,0l-4,15.9L32,32H2.8C1.3,32,0,30.7,0,29.2z\",\n ScopeEnd:\n \"M32,2.8v26.3c0,1.6-1.3,2.8-2.8,2.8H4L0,16.1L4,0l25.2,0C30.7,0,32,1.3,32,2.8z\",\n ScopeStart:\n \"M0,29.2L0,2.8C0,1.3,1.3,0,2.8,0L32,0l-4,15.9L32,32H2.8C1.3,32,0,30.7,0,29.2z\",\n VirtualIn:\n \"M32,2.8v26.3c0,1.6-1.3,2.8-2.8,2.8H6.5L0,25.9l5.2-10L0.7,7.2L6.5,0l22.7,0C30.7,0,32,1.3,32,2.8z\",\n VirtualOut:\n \"M0,29.2L0,2.8C0,1.3,1.3,0,2.8,0L32,0l-5.8,7.2l4.5,8.7l-5.2,10L32,32H2.8C1.3,32,0,30.7,0,29.2z\",\n};\n\nconst componentBackgroundPortion = 0.75;\n\nconst {\n type = null,\n isComponent = false,\n icon = null,\n} = defineProps<NodeTorsoProps>();\n\nconst backgroundPath = computed(\n () => (type && backgroundPaths[type]) || backgroundPaths.default,\n);\n\nconst componentBackgroundTransformation = computed(() => {\n const offset = NODE_SIZE / 2;\n const scaleFactor = componentBackgroundPortion;\n return `translate(${offset}, ${offset}) scale(${scaleFactor}) translate(-${offset}, -${offset})`;\n});\n</script>\n\n<template>\n <g>\n <path\n :d=\"backgroundPath\"\n :class=\"['bg', { component: isComponent }]\"\n :data-type=\"isComponent ? null : type\"\n />\n <!-- components may have two layers of background. This is the inner part, a shrunk version of the outer frame -->\n <path\n v-if=\"isComponent && type\"\n :d=\"backgroundPath\"\n class=\"bg\"\n :data-type=\"type\"\n :transform=\"componentBackgroundTransformation\"\n />\n <image\n v-if=\"icon\"\n :xlink:href=\"icon\"\n x=\"8\"\n y=\"8\"\n width=\"16\"\n height=\"16\"\n pointer-events=\"none\"\n />\n </g>\n</template>\n\n<style scoped>\n.bg {\n /** default color is unknown */\n fill: var(--kds-color-nodes-and-variables-unknown);\n\n &.component {\n fill: var(--kds-color-nodes-and-variables-component);\n }\n\n &[data-type=\"Configuration\"] {\n fill: var(--kds-color-nodes-and-variables-configuration);\n }\n\n &[data-type=\"Container\"] {\n fill: var(--kds-color-nodes-and-variables-container);\n }\n\n &[data-type=\"Learner\"] {\n fill: var(--kds-color-nodes-and-variables-learner);\n }\n\n &[data-type=\"Loop\"] {\n fill: var(--kds-color-nodes-and-variables-loop);\n }\n\n &[data-type=\"LoopEnd\"] {\n fill: var(--kds-color-nodes-and-variables-loop);\n }\n\n &[data-type=\"LoopStart\"] {\n fill: var(--kds-color-nodes-and-variables-loop);\n }\n\n &[data-type=\"Manipulator\"] {\n fill: var(--kds-color-nodes-and-variables-manipulator);\n }\n\n &[data-type=\"Other\"] {\n fill: var(--kds-color-nodes-and-variables-other);\n }\n\n &[data-type=\"Predictor\"] {\n fill: var(--kds-color-nodes-and-variables-predictor);\n }\n\n &[data-type=\"ScopeEnd\"] {\n fill: var(--kds-color-nodes-and-variables-scope);\n }\n\n &[data-type=\"ScopeStart\"] {\n fill: var(--kds-color-nodes-and-variables-scope);\n }\n\n &[data-type=\"Sink\"] {\n fill: var(--kds-color-nodes-and-variables-sink);\n }\n\n &[data-type=\"Source\"] {\n fill: var(--kds-color-nodes-and-variables-source);\n }\n\n &[data-type=\"Visualizer\"] {\n fill: var(--kds-color-nodes-and-variables-visualizer);\n }\n\n &[data-type=\"QuickForm\"] {\n fill: var(--kds-color-nodes-and-variables-quickform);\n }\n\n &[data-type=\"Widget\"] {\n fill: var(--kds-color-nodes-and-variables-widget);\n }\n\n /** Virtual = Components */\n &[data-type=\"VirtualIn\"],\n &[data-type=\"VirtualOut\"] {\n fill: var(--kds-color-nodes-and-variables-component);\n }\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport { KdsIcon } from \"@knime/kds-components\";\n\nimport SVGPortIcon from \"../PortIcon/SVGPortIcon.vue\";\nimport { PORT_SIZE } from \"../PortIcon/constants\";\n\nimport SVGNodeTorso from \"./SVGNodeTorso.vue\";\nimport { NODE_SIZE } from \"./constants\";\nimport type { NodePreviewProps, Port } from \"./types\";\n\n/**\n * SVG icon preview for a node or component, generated from its attributes\n */\nconst {\n type = null,\n isComponent = false,\n inPorts = [],\n outPorts = [],\n hidePorts = false,\n hideIndicators = false,\n size = \"xlarge\",\n indicatorIcon = undefined,\n icon = null,\n} = defineProps<NodePreviewProps>();\n\nconst horizontalSpaceForPorts = computed(() => (hidePorts ? 0 : PORT_SIZE));\n\nconst width = computed(() => NODE_SIZE + 2 * horizontalSpaceForPorts.value);\nconst height = NODE_SIZE;\nconst viewBox = computed(\n () => `-${horizontalSpaceForPorts.value} 0 ${width.value} ${height}`,\n);\n\n// top edge of port icon relative to 32x32 background\nfunction yPortShift(index: number, total: number): number {\n /* eslint-disable no-magic-numbers */\n let spacing = 1;\n if (total === 2) {\n spacing = 12;\n } else if (total === 3) {\n spacing = 2;\n }\n /* eslint-enable no-magic-numbers */\n\n const totalHeight = total * PORT_SIZE + (total - 1) * spacing;\n const delta = (NODE_SIZE - totalHeight) / 2;\n return (spacing + PORT_SIZE) * index + delta + PORT_SIZE / 2;\n}\n\nconst maxShownPorts = 3;\n\nconst cutOffPorts = (ports: Port[]) => {\n if (ports.length > maxShownPorts) {\n return [...ports.slice(0, maxShownPorts)];\n }\n return ports;\n};\n\nconst visibleInPorts = computed(() => cutOffPorts(inPorts));\nconst visibleOutPorts = computed(() => cutOffPorts(outPorts));\nconst numberOfHiddenPorts = computed(\n () =>\n inPorts.length -\n visibleInPorts.value.length +\n outPorts.length -\n visibleOutPorts.value.length,\n);\n</script>\n\n<template>\n <div class=\"node-preview\" :data-size=\"size\">\n <svg :viewBox=\"viewBox\" :width=\"width\" :height=\"height\">\n <SVGNodeTorso :type=\"type\" :icon=\"icon\" :is-component=\"isComponent\" />\n <template v-if=\"!hidePorts\">\n <SVGPortIcon\n v-for=\"(port, index) in visibleInPorts\"\n :key=\"`in-${index}`\"\n :color=\"port.color\"\n :filled=\"!port.optional\"\n :type=\"port.type\"\n :transform=\"`translate(-${PORT_SIZE / 2}, ${yPortShift(index, visibleInPorts.length)})`\"\n />\n <SVGPortIcon\n v-for=\"(port, index) in visibleOutPorts\"\n :key=\"`out-${index}`\"\n :color=\"port.color\"\n :filled=\"!port.optional\"\n :type=\"port.type\"\n :transform=\"`translate(${NODE_SIZE + PORT_SIZE / 2}, ${yPortShift(index, visibleOutPorts.length)})`\"\n />\n </template>\n </svg>\n <div v-if=\"!hideIndicators\" class=\"indicators\">\n <KdsIcon v-if=\"indicatorIcon\" :name=\"indicatorIcon\" size=\"small\" />\n <KdsIcon\n v-if=\"numberOfHiddenPorts > 0 && !hidePorts\"\n name=\"more-connections\"\n aria-label=\"Indication that some ports are hidden\"\n size=\"small\"\n />\n </div>\n </div>\n</template>\n\n<style scoped>\n.node-preview {\n display: flex;\n flex-direction: column;\n gap: var(--kds-spacing-container-0-25x);\n width: calc(v-bind(width) * 1px);\n\n /*\n * `zoom` is used instead of `transform: scale()` so that the shrunk size\n * is also reflected in the layout box, e.g. when placed in a flex or grid\n * container alongside other elements.\n */\n &[data-size=\"small\"] {\n zoom: calc(12 / v-bind(NODE_SIZE));\n }\n\n &[data-size=\"medium\"] {\n zoom: 0.5;\n }\n\n & .indicators {\n display: flex;\n gap: var(--kds-spacing-container-0-25x);\n justify-content: center;\n height: var(--kds-dimension-icon-0-75x);\n }\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport { KdsIcon } from \"@knime/kds-components\";\n\nimport SVGPortIcon from \"../PortIcon/SVGPortIcon.vue\";\nimport { PORT_SIZE } from \"../PortIcon/constants\";\n\nimport SVGNodeTorso from \"./SVGNodeTorso.vue\";\nimport { NODE_SIZE } from \"./constants\";\nimport type { NodePreviewProps, Port } from \"./types\";\n\n/**\n * SVG icon preview for a node or component, generated from its attributes\n */\nconst {\n type = null,\n isComponent = false,\n inPorts = [],\n outPorts = [],\n hidePorts = false,\n hideIndicators = false,\n size = \"xlarge\",\n indicatorIcon = undefined,\n icon = null,\n} = defineProps<NodePreviewProps>();\n\nconst horizontalSpaceForPorts = computed(() => (hidePorts ? 0 : PORT_SIZE));\n\nconst width = computed(() => NODE_SIZE + 2 * horizontalSpaceForPorts.value);\nconst height = NODE_SIZE;\nconst viewBox = computed(\n () => `-${horizontalSpaceForPorts.value} 0 ${width.value} ${height}`,\n);\n\n// top edge of port icon relative to 32x32 background\nfunction yPortShift(index: number, total: number): number {\n /* eslint-disable no-magic-numbers */\n let spacing = 1;\n if (total === 2) {\n spacing = 12;\n } else if (total === 3) {\n spacing = 2;\n }\n /* eslint-enable no-magic-numbers */\n\n const totalHeight = total * PORT_SIZE + (total - 1) * spacing;\n const delta = (NODE_SIZE - totalHeight) / 2;\n return (spacing + PORT_SIZE) * index + delta + PORT_SIZE / 2;\n}\n\nconst maxShownPorts = 3;\n\nconst cutOffPorts = (ports: Port[]) => {\n if (ports.length > maxShownPorts) {\n return [...ports.slice(0, maxShownPorts)];\n }\n return ports;\n};\n\nconst visibleInPorts = computed(() => cutOffPorts(inPorts));\nconst visibleOutPorts = computed(() => cutOffPorts(outPorts));\nconst numberOfHiddenPorts = computed(\n () =>\n inPorts.length -\n visibleInPorts.value.length +\n outPorts.length -\n visibleOutPorts.value.length,\n);\n</script>\n\n<template>\n <div class=\"node-preview\" :data-size=\"size\">\n <svg :viewBox=\"viewBox\" :width=\"width\" :height=\"height\">\n <SVGNodeTorso :type=\"type\" :icon=\"icon\" :is-component=\"isComponent\" />\n <template v-if=\"!hidePorts\">\n <SVGPortIcon\n v-for=\"(port, index) in visibleInPorts\"\n :key=\"`in-${index}`\"\n :color=\"port.color\"\n :filled=\"!port.optional\"\n :type=\"port.type\"\n :transform=\"`translate(-${PORT_SIZE / 2}, ${yPortShift(index, visibleInPorts.length)})`\"\n />\n <SVGPortIcon\n v-for=\"(port, index) in visibleOutPorts\"\n :key=\"`out-${index}`\"\n :color=\"port.color\"\n :filled=\"!port.optional\"\n :type=\"port.type\"\n :transform=\"`translate(${NODE_SIZE + PORT_SIZE / 2}, ${yPortShift(index, visibleOutPorts.length)})`\"\n />\n </template>\n </svg>\n <div v-if=\"!hideIndicators\" class=\"indicators\">\n <KdsIcon v-if=\"indicatorIcon\" :name=\"indicatorIcon\" size=\"small\" />\n <KdsIcon\n v-if=\"numberOfHiddenPorts > 0 && !hidePorts\"\n name=\"more-connections\"\n aria-label=\"Indication that some ports are hidden\"\n size=\"small\"\n />\n </div>\n </div>\n</template>\n\n<style scoped>\n.node-preview {\n display: flex;\n flex-direction: column;\n gap: var(--kds-spacing-container-0-25x);\n width: calc(v-bind(width) * 1px);\n\n /*\n * `zoom` is used instead of `transform: scale()` so that the shrunk size\n * is also reflected in the layout box, e.g. when placed in a flex or grid\n * container alongside other elements.\n */\n &[data-size=\"small\"] {\n zoom: calc(12 / v-bind(NODE_SIZE));\n }\n\n &[data-size=\"medium\"] {\n zoom: 0.5;\n }\n\n & .indicators {\n display: flex;\n gap: var(--kds-spacing-container-0-25x);\n justify-content: center;\n height: var(--kds-dimension-icon-0-75x);\n }\n}\n</style>\n"],"mappings":"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"}
1
+ {"version":3,"file":"nodes.js","names":[],"sources":["../src/nodes/NodeDescriptionTabs/OptionsTab.vue","../src/nodes/NodeDescriptionTabs/OptionsTab.vue","../src/nodes/NodeDescriptionTabs/PortTemplateInfo.vue","../src/nodes/NodeDescriptionTabs/PortTemplateInfo.vue","../src/nodes/NodeDescriptionTabs/PortGroup.vue","../src/nodes/NodeDescriptionTabs/PortGroup.vue","../src/nodes/NodeDescriptionTabs/PortsTab.vue","../src/nodes/NodeDescriptionTabs/PortsTab.vue","../src/nodes/NodeDescriptionTabs/ViewsTab.vue","../src/nodes/NodeDescriptionTabs/ViewsTab.vue","../src/nodes/NodeDescriptionTabs/NodeDescriptionTabs.vue","../src/nodes/NodeDescriptionTabs/NodeDescriptionTabs.vue","../src/nodes/NodePreview/SVGNodeTorso.vue","../src/nodes/NodePreview/SVGNodeTorso.vue","../src/nodes/NodePreview/NodePreview.vue","../src/nodes/NodePreview/NodePreview.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref } from \"vue\";\n\nimport {\n KdsAccordion,\n type KdsAccordionItem,\n KdsDescription,\n} from \"@knime/kds-components\";\n\nimport type { NodeDescriptionOptions } from \"./types\";\n\ntype Props = {\n options: Array<NodeDescriptionOptions>;\n renderAsHtml?: boolean;\n};\n\nconst { options, renderAsHtml } = defineProps<Props>();\n\ntype AccordionItemWithContent = KdsAccordionItem & {\n description?: string;\n content: NodeDescriptionOptions[\"fields\"];\n};\n\nconst accordionItems = computed<AccordionItemWithContent[]>(() => {\n return options.map(\n (option, index) =>\n ({\n id: `section-${index}`,\n headline: option.sectionName,\n description: option.sectionDescription,\n content: option.fields,\n }) satisfies AccordionItemWithContent,\n );\n});\n\nconst modelValue = ref<string[]>([]);\n</script>\n\n<template>\n <div>\n <KdsAccordion\n v-if=\"options.length > 1\"\n v-model=\"modelValue\"\n :items=\"accordionItems\"\n >\n <template v-for=\"item in accordionItems\" :key=\"item.id\" #[item.id]>\n <KdsDescription\n v-if=\"item.description\"\n :text=\"item.description\"\n :render-as-html=\"renderAsHtml\"\n class=\"section-description\"\n />\n\n <template v-for=\"field in item.content\" :key=\"field.name\">\n <div class=\"option-content\">\n <span class=\"name\">\n {{ field.name }} {{ field.optional ? \"(optional)\" : \"\" }}\n </span>\n\n <KdsDescription\n :text=\"field.description\"\n :render-as-html=\"renderAsHtml\"\n />\n </div>\n </template>\n </template>\n </KdsAccordion>\n\n <div v-if=\"options.length === 1\" class=\"single-option-wrapper\">\n <KdsDescription\n v-if=\"options[0].sectionDescription\"\n :text=\"options[0].sectionDescription\"\n :render-as-html=\"renderAsHtml\"\n class=\"section-description\"\n />\n\n <template v-for=\"field in options[0].fields\" :key=\"field.name\">\n <div class=\"option-content\">\n <span class=\"name\">\n {{ field.name }} {{ field.optional ? \"(optional)\" : \"\" }}\n </span>\n\n <KdsDescription\n :text=\"field.description\"\n :render-as-html=\"renderAsHtml\"\n />\n </div>\n </template>\n </div>\n </div>\n</template>\n\n<style scoped>\n.section-description {\n margin-bottom: var(--kds-spacing-container-1x);\n}\n\n.single-option-wrapper {\n display: flex;\n flex-direction: column;\n padding: var(--kds-spacing-container-1x);\n background: var(--kds-color-surface-muted);\n border-radius: var(--kds-border-radius-container-0-37x);\n}\n\n.option-content {\n & .name {\n font: var(--kds-font-base-title-small-strong);\n }\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed, ref } from \"vue\";\n\nimport {\n KdsAccordion,\n type KdsAccordionItem,\n KdsDescription,\n} from \"@knime/kds-components\";\n\nimport type { NodeDescriptionOptions } from \"./types\";\n\ntype Props = {\n options: Array<NodeDescriptionOptions>;\n renderAsHtml?: boolean;\n};\n\nconst { options, renderAsHtml } = defineProps<Props>();\n\ntype AccordionItemWithContent = KdsAccordionItem & {\n description?: string;\n content: NodeDescriptionOptions[\"fields\"];\n};\n\nconst accordionItems = computed<AccordionItemWithContent[]>(() => {\n return options.map(\n (option, index) =>\n ({\n id: `section-${index}`,\n headline: option.sectionName,\n description: option.sectionDescription,\n content: option.fields,\n }) satisfies AccordionItemWithContent,\n );\n});\n\nconst modelValue = ref<string[]>([]);\n</script>\n\n<template>\n <div>\n <KdsAccordion\n v-if=\"options.length > 1\"\n v-model=\"modelValue\"\n :items=\"accordionItems\"\n >\n <template v-for=\"item in accordionItems\" :key=\"item.id\" #[item.id]>\n <KdsDescription\n v-if=\"item.description\"\n :text=\"item.description\"\n :render-as-html=\"renderAsHtml\"\n class=\"section-description\"\n />\n\n <template v-for=\"field in item.content\" :key=\"field.name\">\n <div class=\"option-content\">\n <span class=\"name\">\n {{ field.name }} {{ field.optional ? \"(optional)\" : \"\" }}\n </span>\n\n <KdsDescription\n :text=\"field.description\"\n :render-as-html=\"renderAsHtml\"\n />\n </div>\n </template>\n </template>\n </KdsAccordion>\n\n <div v-if=\"options.length === 1\" class=\"single-option-wrapper\">\n <KdsDescription\n v-if=\"options[0].sectionDescription\"\n :text=\"options[0].sectionDescription\"\n :render-as-html=\"renderAsHtml\"\n class=\"section-description\"\n />\n\n <template v-for=\"field in options[0].fields\" :key=\"field.name\">\n <div class=\"option-content\">\n <span class=\"name\">\n {{ field.name }} {{ field.optional ? \"(optional)\" : \"\" }}\n </span>\n\n <KdsDescription\n :text=\"field.description\"\n :render-as-html=\"renderAsHtml\"\n />\n </div>\n </template>\n </div>\n </div>\n</template>\n\n<style scoped>\n.section-description {\n margin-bottom: var(--kds-spacing-container-1x);\n}\n\n.single-option-wrapper {\n display: flex;\n flex-direction: column;\n padding: var(--kds-spacing-container-1x);\n background: var(--kds-color-surface-muted);\n border-radius: var(--kds-border-radius-container-0-37x);\n}\n\n.option-content {\n & .name {\n font: var(--kds-font-base-title-small-strong);\n }\n}\n</style>\n","<script setup lang=\"ts\">\nimport { KdsDescription, KdsPortIcon } from \"@knime/kds-components\";\n\nimport type { PortTemplate } from \"./types\";\n\ntype Props = {\n port: PortTemplate;\n showDescription: boolean;\n};\n\ndefineProps<Props>();\n</script>\n\n<template>\n <div class=\"wrapper\">\n <div class=\"icon\">\n <KdsPortIcon\n :type=\"port.type\"\n :color=\"port.color\"\n :optional=\"port.optional\"\n />\n </div>\n <span class=\"title\">Type: {{ port.typeDisplayName }}</span>\n\n <span class=\"name title\">Name: {{ port.name }}</span>\n\n <KdsDescription\n v-if=\"showDescription\"\n class=\"description\"\n :text=\"port.description\"\n render-as-html\n />\n </div>\n</template>\n\n<style scoped>\n.wrapper {\n display: grid;\n grid-template-columns: var(--kds-spacing-container-0-5x) 1fr;\n gap: var(--kds-spacing-container-0-5x);\n}\n\n.icon {\n display: flex;\n align-items: center;\n}\n\n.name,\n.description {\n grid-column: 2;\n}\n\n.title {\n font: var(--kds-font-base-title-small-strong);\n}\n</style>\n","<script setup lang=\"ts\">\nimport { KdsDescription, KdsPortIcon } from \"@knime/kds-components\";\n\nimport type { PortTemplate } from \"./types\";\n\ntype Props = {\n port: PortTemplate;\n showDescription: boolean;\n};\n\ndefineProps<Props>();\n</script>\n\n<template>\n <div class=\"wrapper\">\n <div class=\"icon\">\n <KdsPortIcon\n :type=\"port.type\"\n :color=\"port.color\"\n :optional=\"port.optional\"\n />\n </div>\n <span class=\"title\">Type: {{ port.typeDisplayName }}</span>\n\n <span class=\"name title\">Name: {{ port.name }}</span>\n\n <KdsDescription\n v-if=\"showDescription\"\n class=\"description\"\n :text=\"port.description\"\n render-as-html\n />\n </div>\n</template>\n\n<style scoped>\n.wrapper {\n display: grid;\n grid-template-columns: var(--kds-spacing-container-0-5x) 1fr;\n gap: var(--kds-spacing-container-0-5x);\n}\n\n.icon {\n display: flex;\n align-items: center;\n}\n\n.name,\n.description {\n grid-column: 2;\n}\n\n.title {\n font: var(--kds-font-base-title-small-strong);\n}\n</style>\n","<script setup lang=\"ts\">\nimport { KdsDescription } from \"@knime/kds-components\";\n\nimport PortTemplateInfo from \"./PortTemplateInfo.vue\";\nimport type { PortTemplate } from \"./types\";\n\ntype Props = {\n name: string;\n description?: string;\n ports: Array<PortTemplate>;\n isDynamicGroup?: boolean;\n};\n\ndefineProps<Props>();\n</script>\n\n<template>\n <div class=\"port-group-card\">\n <span class=\"group-name\">{{ name }}</span>\n\n <KdsDescription v-if=\"description\" :text=\"description\" render-as-html />\n\n <template v-for=\"port in ports\" :key=\"port.id\">\n <PortTemplateInfo :port=\"port\" :show-description=\"!isDynamicGroup\" />\n </template>\n </div>\n</template>\n\n<style scoped>\n.port-group-card {\n display: flex;\n flex-direction: column;\n gap: var(--kds-spacing-container-0-75x);\n padding: var(--kds-spacing-container-1x);\n background: var(--kds-color-surface-muted);\n border-radius: var(--kds-border-radius-container-0-37x);\n\n & .group-name {\n font: var(--kds-font-base-title-small-strong);\n }\n}\n</style>\n","<script setup lang=\"ts\">\nimport { KdsDescription } from \"@knime/kds-components\";\n\nimport PortTemplateInfo from \"./PortTemplateInfo.vue\";\nimport type { PortTemplate } from \"./types\";\n\ntype Props = {\n name: string;\n description?: string;\n ports: Array<PortTemplate>;\n isDynamicGroup?: boolean;\n};\n\ndefineProps<Props>();\n</script>\n\n<template>\n <div class=\"port-group-card\">\n <span class=\"group-name\">{{ name }}</span>\n\n <KdsDescription v-if=\"description\" :text=\"description\" render-as-html />\n\n <template v-for=\"port in ports\" :key=\"port.id\">\n <PortTemplateInfo :port=\"port\" :show-description=\"!isDynamicGroup\" />\n </template>\n </div>\n</template>\n\n<style scoped>\n.port-group-card {\n display: flex;\n flex-direction: column;\n gap: var(--kds-spacing-container-0-75x);\n padding: var(--kds-spacing-container-1x);\n background: var(--kds-color-surface-muted);\n border-radius: var(--kds-border-radius-container-0-37x);\n\n & .group-name {\n font: var(--kds-font-base-title-small-strong);\n }\n}\n</style>\n","<script setup lang=\"ts\">\nimport PortGroup from \"./PortGroup.vue\";\nimport type { DynamicPortGroup, PortTemplate } from \"./types\";\n\ntype Props = {\n inputPorts: Array<PortTemplate>;\n outputPorts: Array<PortTemplate>;\n dynamicInputGroups?: Array<DynamicPortGroup>;\n dynamicOutputGroups?: Array<DynamicPortGroup>;\n};\n\nconst { dynamicInputGroups = [], dynamicOutputGroups = [] } =\n defineProps<Props>();\n</script>\n\n<template>\n <div class=\"port-list\">\n <PortGroup\n v-if=\"inputPorts.length > 0\"\n name=\"Input ports\"\n :ports=\"inputPorts\"\n />\n\n <PortGroup\n v-if=\"outputPorts.length > 0\"\n name=\"Output ports\"\n :ports=\"outputPorts\"\n />\n\n <template v-for=\"group in dynamicInputGroups\" :key=\"group.name\">\n <PortGroup\n v-if=\"group.types.length > 0\"\n :name=\"group.name + ' (Dynamic Inport)'\"\n :description=\"group.description\"\n :ports=\"group.types\"\n is-dynamic-group\n />\n </template>\n\n <template v-for=\"group in dynamicOutputGroups\" :key=\"group.name\">\n <PortGroup\n v-if=\"group.types.length > 0\"\n :name=\"group.name + ' (Dynamic Outport)'\"\n :description=\"group.description\"\n :ports=\"group.types\"\n is-dynamic-group\n />\n </template>\n </div>\n</template>\n\n<style scoped>\n.port-list {\n display: flex;\n flex-direction: column;\n gap: var(--kds-spacing-container-0-5x);\n}\n</style>\n","<script setup lang=\"ts\">\nimport PortGroup from \"./PortGroup.vue\";\nimport type { DynamicPortGroup, PortTemplate } from \"./types\";\n\ntype Props = {\n inputPorts: Array<PortTemplate>;\n outputPorts: Array<PortTemplate>;\n dynamicInputGroups?: Array<DynamicPortGroup>;\n dynamicOutputGroups?: Array<DynamicPortGroup>;\n};\n\nconst { dynamicInputGroups = [], dynamicOutputGroups = [] } =\n defineProps<Props>();\n</script>\n\n<template>\n <div class=\"port-list\">\n <PortGroup\n v-if=\"inputPorts.length > 0\"\n name=\"Input ports\"\n :ports=\"inputPorts\"\n />\n\n <PortGroup\n v-if=\"outputPorts.length > 0\"\n name=\"Output ports\"\n :ports=\"outputPorts\"\n />\n\n <template v-for=\"group in dynamicInputGroups\" :key=\"group.name\">\n <PortGroup\n v-if=\"group.types.length > 0\"\n :name=\"group.name + ' (Dynamic Inport)'\"\n :description=\"group.description\"\n :ports=\"group.types\"\n is-dynamic-group\n />\n </template>\n\n <template v-for=\"group in dynamicOutputGroups\" :key=\"group.name\">\n <PortGroup\n v-if=\"group.types.length > 0\"\n :name=\"group.name + ' (Dynamic Outport)'\"\n :description=\"group.description\"\n :ports=\"group.types\"\n is-dynamic-group\n />\n </template>\n </div>\n</template>\n\n<style scoped>\n.port-list {\n display: flex;\n flex-direction: column;\n gap: var(--kds-spacing-container-0-5x);\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport { KdsDescription } from \"@knime/kds-components\";\n\nimport type { NodeDescriptionView } from \"./types\";\n\ntype Props = {\n views: Array<NodeDescriptionView>;\n};\n\nconst props = defineProps<Props>();\n\nconst viewsWithId = computed<Array<NodeDescriptionView & { id: string }>>(() =>\n props.views.map((view, index) => {\n const id = `view-${index}`;\n return { id, ...view };\n }),\n);\n</script>\n\n<template>\n <div v-for=\"view in viewsWithId\" :key=\"view.id\" class=\"card-wrapper\">\n <span class=\"name\">{{ view.name }}</span>\n <KdsDescription\n v-if=\"view.description\"\n :text=\"view.description\"\n render-as-html\n />\n </div>\n</template>\n\n<style scoped>\n.card-wrapper {\n display: flex;\n flex-direction: column;\n padding: var(--kds-spacing-container-1x);\n margin-bottom: var(--kds-spacing-container-0-25x);\n background: var(--kds-color-surface-muted);\n border-radius: var(--kds-border-radius-container-0-37x);\n}\n\n.name {\n font: var(--kds-font-base-title-small-strong);\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport { KdsDescription } from \"@knime/kds-components\";\n\nimport type { NodeDescriptionView } from \"./types\";\n\ntype Props = {\n views: Array<NodeDescriptionView>;\n};\n\nconst props = defineProps<Props>();\n\nconst viewsWithId = computed<Array<NodeDescriptionView & { id: string }>>(() =>\n props.views.map((view, index) => {\n const id = `view-${index}`;\n return { id, ...view };\n }),\n);\n</script>\n\n<template>\n <div v-for=\"view in viewsWithId\" :key=\"view.id\" class=\"card-wrapper\">\n <span class=\"name\">{{ view.name }}</span>\n <KdsDescription\n v-if=\"view.description\"\n :text=\"view.description\"\n render-as-html\n />\n </div>\n</template>\n\n<style scoped>\n.card-wrapper {\n display: flex;\n flex-direction: column;\n padding: var(--kds-spacing-container-1x);\n margin-bottom: var(--kds-spacing-container-0-25x);\n background: var(--kds-color-surface-muted);\n border-radius: var(--kds-border-radius-container-0-37x);\n}\n\n.name {\n font: var(--kds-font-base-title-small-strong);\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed, ref } from \"vue\";\n\nimport {\n KdsEmptyState,\n KdsTabBar,\n type KdsTabBarItem,\n} from \"@knime/kds-components\";\n\nimport OptionsTab from \"./OptionsTab.vue\";\nimport PortsTab from \"./PortsTab.vue\";\nimport ViewsTab from \"./ViewsTab.vue\";\nimport type { NodeDescriptionTabsProps } from \"./types\";\n\nconst {\n inputPorts = [],\n outputPorts = [],\n dynamicInputPorts = [],\n dynamicOutputPorts = [],\n optionsData = [],\n viewsData = [],\n emptyText = \"No ports, options or views available.\",\n renderAsHtml = false,\n tabBarFullWidth = false,\n} = defineProps<NodeDescriptionTabsProps>();\n\nconst TAB_IDS = {\n PORTS: \"ports\",\n OPTIONS: \"options\",\n VIEW: \"view\",\n} as const;\n\ntype TabIds = (typeof TAB_IDS)[keyof typeof TAB_IDS];\n\nconst activeTab = ref<TabIds | undefined>();\n\nconst hasPorts = computed(\n () =>\n inputPorts.length > 0 ||\n outputPorts.length > 0 ||\n dynamicInputPorts.length > 0 ||\n dynamicOutputPorts.length > 0,\n);\n\nconst tabs = computed<KdsTabBarItem[]>(() => [\n {\n id: \"tab-ports\",\n value: TAB_IDS.PORTS,\n label: \"Ports\",\n panelId: \"panel-ports\",\n accessory: {\n type: \"icon\",\n name: \"connection\",\n },\n disabled: !hasPorts.value,\n },\n {\n id: \"tab-options\",\n value: TAB_IDS.OPTIONS,\n label: \"Options\",\n panelId: \"panel-options\",\n accessory: {\n type: \"icon\",\n name: \"parameter\",\n },\n disabled: optionsData.length < 1,\n },\n {\n id: \"tab-view\",\n value: TAB_IDS.VIEW,\n label: \"View\",\n panelId: \"panel-view\",\n accessory: {\n type: \"icon\",\n name: \"eye\",\n },\n disabled: viewsData.length < 1,\n },\n]);\n</script>\n\n<template>\n <div>\n <KdsTabBar\n v-model=\"activeTab\"\n :full-width=\"tabBarFullWidth\"\n size=\"small\"\n :tabs=\"tabs\"\n />\n\n <div class=\"content\">\n <PortsTab\n v-if=\"activeTab === TAB_IDS.PORTS\"\n id=\"panel-ports\"\n role=\"tabpanel\"\n aria-labelledby=\"tab-ports\"\n tabindex=\"0\"\n :input-ports=\"inputPorts\"\n :output-ports=\"outputPorts\"\n :dynamic-input-groups=\"dynamicInputPorts\"\n :dynamic-output-groups=\"dynamicOutputPorts\"\n />\n\n <OptionsTab\n v-if=\"activeTab === TAB_IDS.OPTIONS\"\n id=\"panel-options\"\n role=\"tabpanel\"\n aria-labelledby=\"tab-options\"\n tabindex=\"0\"\n :options=\"optionsData\"\n :render-as-html=\"renderAsHtml\"\n />\n\n <ViewsTab\n v-if=\"activeTab === TAB_IDS.VIEW\"\n id=\"panel-view\"\n role=\"tabpanel\"\n aria-labelledby=\"tab-view\"\n tabindex=\"0\"\n :views=\"viewsData\"\n />\n\n <KdsEmptyState\n v-if=\"!activeTab\"\n :headline=\"emptyText\"\n class=\"empty-state\"\n />\n </div>\n </div>\n</template>\n\n<style scoped>\n.content {\n padding: var(--kds-spacing-container-0-5x) 0;\n color: var(--kds-color-text-and-icon-neutral);\n}\n\n.empty-state {\n margin: 0 auto;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed, ref } from \"vue\";\n\nimport {\n KdsEmptyState,\n KdsTabBar,\n type KdsTabBarItem,\n} from \"@knime/kds-components\";\n\nimport OptionsTab from \"./OptionsTab.vue\";\nimport PortsTab from \"./PortsTab.vue\";\nimport ViewsTab from \"./ViewsTab.vue\";\nimport type { NodeDescriptionTabsProps } from \"./types\";\n\nconst {\n inputPorts = [],\n outputPorts = [],\n dynamicInputPorts = [],\n dynamicOutputPorts = [],\n optionsData = [],\n viewsData = [],\n emptyText = \"No ports, options or views available.\",\n renderAsHtml = false,\n tabBarFullWidth = false,\n} = defineProps<NodeDescriptionTabsProps>();\n\nconst TAB_IDS = {\n PORTS: \"ports\",\n OPTIONS: \"options\",\n VIEW: \"view\",\n} as const;\n\ntype TabIds = (typeof TAB_IDS)[keyof typeof TAB_IDS];\n\nconst activeTab = ref<TabIds | undefined>();\n\nconst hasPorts = computed(\n () =>\n inputPorts.length > 0 ||\n outputPorts.length > 0 ||\n dynamicInputPorts.length > 0 ||\n dynamicOutputPorts.length > 0,\n);\n\nconst tabs = computed<KdsTabBarItem[]>(() => [\n {\n id: \"tab-ports\",\n value: TAB_IDS.PORTS,\n label: \"Ports\",\n panelId: \"panel-ports\",\n accessory: {\n type: \"icon\",\n name: \"connection\",\n },\n disabled: !hasPorts.value,\n },\n {\n id: \"tab-options\",\n value: TAB_IDS.OPTIONS,\n label: \"Options\",\n panelId: \"panel-options\",\n accessory: {\n type: \"icon\",\n name: \"parameter\",\n },\n disabled: optionsData.length < 1,\n },\n {\n id: \"tab-view\",\n value: TAB_IDS.VIEW,\n label: \"View\",\n panelId: \"panel-view\",\n accessory: {\n type: \"icon\",\n name: \"eye\",\n },\n disabled: viewsData.length < 1,\n },\n]);\n</script>\n\n<template>\n <div>\n <KdsTabBar\n v-model=\"activeTab\"\n :full-width=\"tabBarFullWidth\"\n size=\"small\"\n :tabs=\"tabs\"\n />\n\n <div class=\"content\">\n <PortsTab\n v-if=\"activeTab === TAB_IDS.PORTS\"\n id=\"panel-ports\"\n role=\"tabpanel\"\n aria-labelledby=\"tab-ports\"\n tabindex=\"0\"\n :input-ports=\"inputPorts\"\n :output-ports=\"outputPorts\"\n :dynamic-input-groups=\"dynamicInputPorts\"\n :dynamic-output-groups=\"dynamicOutputPorts\"\n />\n\n <OptionsTab\n v-if=\"activeTab === TAB_IDS.OPTIONS\"\n id=\"panel-options\"\n role=\"tabpanel\"\n aria-labelledby=\"tab-options\"\n tabindex=\"0\"\n :options=\"optionsData\"\n :render-as-html=\"renderAsHtml\"\n />\n\n <ViewsTab\n v-if=\"activeTab === TAB_IDS.VIEW\"\n id=\"panel-view\"\n role=\"tabpanel\"\n aria-labelledby=\"tab-view\"\n tabindex=\"0\"\n :views=\"viewsData\"\n />\n\n <KdsEmptyState\n v-if=\"!activeTab\"\n :headline=\"emptyText\"\n class=\"empty-state\"\n />\n </div>\n </div>\n</template>\n\n<style scoped>\n.content {\n padding: var(--kds-spacing-container-0-5x) 0;\n color: var(--kds-color-text-and-icon-neutral);\n}\n\n.empty-state {\n margin: 0 auto;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport { NODE_SIZE } from \"./constants\";\nimport type { NodeTorsoProps } from \"./types\";\n\n/**\n * Draws the Torso (colored rounded rectangle with icon) of a Node or Component\n * This vue component only draws regular Nodes/Components, no Metanodes, no Unknown nor Missing Nodes\n * Only works inside of a <svg> element.\n */\nconst backgroundPaths: Record<string, string> = {\n default:\n \"M0,29.2L0,2.8C0,1.3,1.3,0,2.8,0l26.3,0C30.7,0,32,1.3,32,2.8v26.3c0,1.6-1.3,2.8-2.8,2.8H2.8C1.3,32,0,30.\" +\n \"7,0,29.2z\",\n LoopEnd:\n \"M32,2.8v26.3c0,1.6-1.3,2.8-2.8,2.8H4L0,16.1L4,0l25.2,0C30.7,0,32,1.3,32,2.8z\",\n LoopStart:\n \"M0,29.2L0,2.8C0,1.3,1.3,0,2.8,0L32,0l-4,15.9L32,32H2.8C1.3,32,0,30.7,0,29.2z\",\n ScopeEnd:\n \"M32,2.8v26.3c0,1.6-1.3,2.8-2.8,2.8H4L0,16.1L4,0l25.2,0C30.7,0,32,1.3,32,2.8z\",\n ScopeStart:\n \"M0,29.2L0,2.8C0,1.3,1.3,0,2.8,0L32,0l-4,15.9L32,32H2.8C1.3,32,0,30.7,0,29.2z\",\n VirtualIn:\n \"M32,2.8v26.3c0,1.6-1.3,2.8-2.8,2.8H6.5L0,25.9l5.2-10L0.7,7.2L6.5,0l22.7,0C30.7,0,32,1.3,32,2.8z\",\n VirtualOut:\n \"M0,29.2L0,2.8C0,1.3,1.3,0,2.8,0L32,0l-5.8,7.2l4.5,8.7l-5.2,10L32,32H2.8C1.3,32,0,30.7,0,29.2z\",\n};\n\nconst componentBackgroundPortion = 0.75;\n\nconst {\n type = null,\n isComponent = false,\n icon = null,\n} = defineProps<NodeTorsoProps>();\n\nconst backgroundPath = computed(\n () => (type && backgroundPaths[type]) || backgroundPaths.default,\n);\n\nconst componentBackgroundTransformation = computed(() => {\n const offset = NODE_SIZE / 2;\n const scaleFactor = componentBackgroundPortion;\n return `translate(${offset}, ${offset}) scale(${scaleFactor}) translate(-${offset}, -${offset})`;\n});\n</script>\n\n<template>\n <g>\n <path\n :d=\"backgroundPath\"\n :class=\"['bg', { component: isComponent }]\"\n :data-type=\"isComponent ? null : type\"\n />\n <!-- components may have two layers of background. This is the inner part, a shrunk version of the outer frame -->\n <path\n v-if=\"isComponent && type\"\n :d=\"backgroundPath\"\n class=\"bg\"\n :data-type=\"type\"\n :transform=\"componentBackgroundTransformation\"\n />\n <image\n v-if=\"icon\"\n :xlink:href=\"icon\"\n x=\"8\"\n y=\"8\"\n width=\"16\"\n height=\"16\"\n pointer-events=\"none\"\n />\n </g>\n</template>\n\n<style scoped>\n.bg {\n /** default color is unknown */\n fill: var(--kds-color-nodes-and-variables-unknown);\n\n &.component {\n fill: var(--kds-color-nodes-and-variables-component);\n }\n\n &[data-type=\"Configuration\"] {\n fill: var(--kds-color-nodes-and-variables-configuration);\n }\n\n &[data-type=\"Container\"] {\n fill: var(--kds-color-nodes-and-variables-container);\n }\n\n &[data-type=\"Learner\"] {\n fill: var(--kds-color-nodes-and-variables-learner);\n }\n\n &[data-type=\"Loop\"] {\n fill: var(--kds-color-nodes-and-variables-loop);\n }\n\n &[data-type=\"LoopEnd\"] {\n fill: var(--kds-color-nodes-and-variables-loop);\n }\n\n &[data-type=\"LoopStart\"] {\n fill: var(--kds-color-nodes-and-variables-loop);\n }\n\n &[data-type=\"Manipulator\"] {\n fill: var(--kds-color-nodes-and-variables-manipulator);\n }\n\n &[data-type=\"Other\"] {\n fill: var(--kds-color-nodes-and-variables-other);\n }\n\n &[data-type=\"Predictor\"] {\n fill: var(--kds-color-nodes-and-variables-predictor);\n }\n\n &[data-type=\"ScopeEnd\"] {\n fill: var(--kds-color-nodes-and-variables-scope);\n }\n\n &[data-type=\"ScopeStart\"] {\n fill: var(--kds-color-nodes-and-variables-scope);\n }\n\n &[data-type=\"Sink\"] {\n fill: var(--kds-color-nodes-and-variables-sink);\n }\n\n &[data-type=\"Source\"] {\n fill: var(--kds-color-nodes-and-variables-source);\n }\n\n &[data-type=\"Visualizer\"] {\n fill: var(--kds-color-nodes-and-variables-visualizer);\n }\n\n &[data-type=\"QuickForm\"] {\n fill: var(--kds-color-nodes-and-variables-quickform);\n }\n\n &[data-type=\"Widget\"] {\n fill: var(--kds-color-nodes-and-variables-widget);\n }\n\n /** Virtual = Components */\n &[data-type=\"VirtualIn\"],\n &[data-type=\"VirtualOut\"] {\n fill: var(--kds-color-nodes-and-variables-component);\n }\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport { NODE_SIZE } from \"./constants\";\nimport type { NodeTorsoProps } from \"./types\";\n\n/**\n * Draws the Torso (colored rounded rectangle with icon) of a Node or Component\n * This vue component only draws regular Nodes/Components, no Metanodes, no Unknown nor Missing Nodes\n * Only works inside of a <svg> element.\n */\nconst backgroundPaths: Record<string, string> = {\n default:\n \"M0,29.2L0,2.8C0,1.3,1.3,0,2.8,0l26.3,0C30.7,0,32,1.3,32,2.8v26.3c0,1.6-1.3,2.8-2.8,2.8H2.8C1.3,32,0,30.\" +\n \"7,0,29.2z\",\n LoopEnd:\n \"M32,2.8v26.3c0,1.6-1.3,2.8-2.8,2.8H4L0,16.1L4,0l25.2,0C30.7,0,32,1.3,32,2.8z\",\n LoopStart:\n \"M0,29.2L0,2.8C0,1.3,1.3,0,2.8,0L32,0l-4,15.9L32,32H2.8C1.3,32,0,30.7,0,29.2z\",\n ScopeEnd:\n \"M32,2.8v26.3c0,1.6-1.3,2.8-2.8,2.8H4L0,16.1L4,0l25.2,0C30.7,0,32,1.3,32,2.8z\",\n ScopeStart:\n \"M0,29.2L0,2.8C0,1.3,1.3,0,2.8,0L32,0l-4,15.9L32,32H2.8C1.3,32,0,30.7,0,29.2z\",\n VirtualIn:\n \"M32,2.8v26.3c0,1.6-1.3,2.8-2.8,2.8H6.5L0,25.9l5.2-10L0.7,7.2L6.5,0l22.7,0C30.7,0,32,1.3,32,2.8z\",\n VirtualOut:\n \"M0,29.2L0,2.8C0,1.3,1.3,0,2.8,0L32,0l-5.8,7.2l4.5,8.7l-5.2,10L32,32H2.8C1.3,32,0,30.7,0,29.2z\",\n};\n\nconst componentBackgroundPortion = 0.75;\n\nconst {\n type = null,\n isComponent = false,\n icon = null,\n} = defineProps<NodeTorsoProps>();\n\nconst backgroundPath = computed(\n () => (type && backgroundPaths[type]) || backgroundPaths.default,\n);\n\nconst componentBackgroundTransformation = computed(() => {\n const offset = NODE_SIZE / 2;\n const scaleFactor = componentBackgroundPortion;\n return `translate(${offset}, ${offset}) scale(${scaleFactor}) translate(-${offset}, -${offset})`;\n});\n</script>\n\n<template>\n <g>\n <path\n :d=\"backgroundPath\"\n :class=\"['bg', { component: isComponent }]\"\n :data-type=\"isComponent ? null : type\"\n />\n <!-- components may have two layers of background. This is the inner part, a shrunk version of the outer frame -->\n <path\n v-if=\"isComponent && type\"\n :d=\"backgroundPath\"\n class=\"bg\"\n :data-type=\"type\"\n :transform=\"componentBackgroundTransformation\"\n />\n <image\n v-if=\"icon\"\n :xlink:href=\"icon\"\n x=\"8\"\n y=\"8\"\n width=\"16\"\n height=\"16\"\n pointer-events=\"none\"\n />\n </g>\n</template>\n\n<style scoped>\n.bg {\n /** default color is unknown */\n fill: var(--kds-color-nodes-and-variables-unknown);\n\n &.component {\n fill: var(--kds-color-nodes-and-variables-component);\n }\n\n &[data-type=\"Configuration\"] {\n fill: var(--kds-color-nodes-and-variables-configuration);\n }\n\n &[data-type=\"Container\"] {\n fill: var(--kds-color-nodes-and-variables-container);\n }\n\n &[data-type=\"Learner\"] {\n fill: var(--kds-color-nodes-and-variables-learner);\n }\n\n &[data-type=\"Loop\"] {\n fill: var(--kds-color-nodes-and-variables-loop);\n }\n\n &[data-type=\"LoopEnd\"] {\n fill: var(--kds-color-nodes-and-variables-loop);\n }\n\n &[data-type=\"LoopStart\"] {\n fill: var(--kds-color-nodes-and-variables-loop);\n }\n\n &[data-type=\"Manipulator\"] {\n fill: var(--kds-color-nodes-and-variables-manipulator);\n }\n\n &[data-type=\"Other\"] {\n fill: var(--kds-color-nodes-and-variables-other);\n }\n\n &[data-type=\"Predictor\"] {\n fill: var(--kds-color-nodes-and-variables-predictor);\n }\n\n &[data-type=\"ScopeEnd\"] {\n fill: var(--kds-color-nodes-and-variables-scope);\n }\n\n &[data-type=\"ScopeStart\"] {\n fill: var(--kds-color-nodes-and-variables-scope);\n }\n\n &[data-type=\"Sink\"] {\n fill: var(--kds-color-nodes-and-variables-sink);\n }\n\n &[data-type=\"Source\"] {\n fill: var(--kds-color-nodes-and-variables-source);\n }\n\n &[data-type=\"Visualizer\"] {\n fill: var(--kds-color-nodes-and-variables-visualizer);\n }\n\n &[data-type=\"QuickForm\"] {\n fill: var(--kds-color-nodes-and-variables-quickform);\n }\n\n &[data-type=\"Widget\"] {\n fill: var(--kds-color-nodes-and-variables-widget);\n }\n\n /** Virtual = Components */\n &[data-type=\"VirtualIn\"],\n &[data-type=\"VirtualOut\"] {\n fill: var(--kds-color-nodes-and-variables-component);\n }\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport { KdsIcon, KdsPortIcon, PORT_SIZE } from \"@knime/kds-components\";\n\nimport SVGNodeTorso from \"./SVGNodeTorso.vue\";\nimport { NODE_SIZE } from \"./constants\";\nimport type { NodePreviewProps, Port } from \"./types\";\n\n/**\n * SVG icon preview for a node or component, generated from its attributes\n */\nconst {\n type = null,\n isComponent = false,\n inPorts = [],\n outPorts = [],\n hidePorts = false,\n hideIndicators = false,\n size = \"xlarge\",\n indicatorIcon = undefined,\n icon = null,\n} = defineProps<NodePreviewProps>();\n\nconst horizontalSpaceForPorts = computed(() => (hidePorts ? 0 : PORT_SIZE));\n\nconst width = computed(() => NODE_SIZE + 2 * horizontalSpaceForPorts.value);\nconst height = NODE_SIZE;\nconst viewBox = computed(\n () => `-${horizontalSpaceForPorts.value} 0 ${width.value} ${height}`,\n);\n\n// top edge of port icon relative to 32x32 background\nfunction yPortShift(index: number, total: number): number {\n /* eslint-disable no-magic-numbers */\n let spacing = 1;\n if (total === 2) {\n spacing = 12;\n } else if (total === 3) {\n spacing = 2;\n }\n /* eslint-enable no-magic-numbers */\n\n const totalHeight = total * PORT_SIZE + (total - 1) * spacing;\n const delta = (NODE_SIZE - totalHeight) / 2;\n return (spacing + PORT_SIZE) * index + delta + PORT_SIZE / 2;\n}\n\nconst maxShownPorts = 3;\n\nconst cutOffPorts = (ports: Port[]) => {\n if (ports.length > maxShownPorts) {\n return [...ports.slice(0, maxShownPorts)];\n }\n return ports;\n};\n\nconst visibleInPorts = computed(() => cutOffPorts(inPorts));\nconst visibleOutPorts = computed(() => cutOffPorts(outPorts));\nconst numberOfHiddenPorts = computed(\n () =>\n inPorts.length -\n visibleInPorts.value.length +\n outPorts.length -\n visibleOutPorts.value.length,\n);\n</script>\n\n<template>\n <div class=\"node-preview\" :data-size=\"size\">\n <svg :viewBox=\"viewBox\" :width=\"width\" :height=\"height\">\n <SVGNodeTorso :type=\"type\" :icon=\"icon\" :is-component=\"isComponent\" />\n <template v-if=\"!hidePorts\">\n <KdsPortIcon\n v-for=\"(port, index) in visibleInPorts\"\n :key=\"`in-${index}`\"\n :color=\"port.color\"\n :optional=\"port.optional\"\n :type=\"port.type\"\n :standalone=\"false\"\n :transform=\"`translate(-${PORT_SIZE / 2}, ${yPortShift(index, visibleInPorts.length)})`\"\n />\n <KdsPortIcon\n v-for=\"(port, index) in visibleOutPorts\"\n :key=\"`out-${index}`\"\n :color=\"port.color\"\n :optional=\"port.optional\"\n :type=\"port.type\"\n :standalone=\"false\"\n :transform=\"`translate(${NODE_SIZE + PORT_SIZE / 2}, ${yPortShift(index, visibleOutPorts.length)})`\"\n />\n </template>\n </svg>\n <div v-if=\"!hideIndicators\" class=\"indicators\">\n <KdsIcon v-if=\"indicatorIcon\" :name=\"indicatorIcon\" size=\"small\" />\n <KdsIcon\n v-if=\"numberOfHiddenPorts > 0 && !hidePorts\"\n name=\"more-connections\"\n aria-label=\"Indication that some ports are hidden\"\n size=\"small\"\n />\n </div>\n </div>\n</template>\n\n<style scoped>\n.node-preview {\n display: flex;\n flex-direction: column;\n gap: var(--kds-spacing-container-0-25x);\n width: calc(v-bind(width) * 1px);\n\n /*\n * `zoom` is used instead of `transform: scale()` so that the shrunk size\n * is also reflected in the layout box, e.g. when placed in a flex or grid\n * container alongside other elements.\n */\n &[data-size=\"small\"] {\n zoom: calc(12 / v-bind(NODE_SIZE));\n }\n\n &[data-size=\"medium\"] {\n zoom: 0.5;\n }\n\n & .indicators {\n display: flex;\n gap: var(--kds-spacing-container-0-25x);\n justify-content: center;\n height: var(--kds-dimension-icon-0-75x);\n }\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport { KdsIcon, KdsPortIcon, PORT_SIZE } from \"@knime/kds-components\";\n\nimport SVGNodeTorso from \"./SVGNodeTorso.vue\";\nimport { NODE_SIZE } from \"./constants\";\nimport type { NodePreviewProps, Port } from \"./types\";\n\n/**\n * SVG icon preview for a node or component, generated from its attributes\n */\nconst {\n type = null,\n isComponent = false,\n inPorts = [],\n outPorts = [],\n hidePorts = false,\n hideIndicators = false,\n size = \"xlarge\",\n indicatorIcon = undefined,\n icon = null,\n} = defineProps<NodePreviewProps>();\n\nconst horizontalSpaceForPorts = computed(() => (hidePorts ? 0 : PORT_SIZE));\n\nconst width = computed(() => NODE_SIZE + 2 * horizontalSpaceForPorts.value);\nconst height = NODE_SIZE;\nconst viewBox = computed(\n () => `-${horizontalSpaceForPorts.value} 0 ${width.value} ${height}`,\n);\n\n// top edge of port icon relative to 32x32 background\nfunction yPortShift(index: number, total: number): number {\n /* eslint-disable no-magic-numbers */\n let spacing = 1;\n if (total === 2) {\n spacing = 12;\n } else if (total === 3) {\n spacing = 2;\n }\n /* eslint-enable no-magic-numbers */\n\n const totalHeight = total * PORT_SIZE + (total - 1) * spacing;\n const delta = (NODE_SIZE - totalHeight) / 2;\n return (spacing + PORT_SIZE) * index + delta + PORT_SIZE / 2;\n}\n\nconst maxShownPorts = 3;\n\nconst cutOffPorts = (ports: Port[]) => {\n if (ports.length > maxShownPorts) {\n return [...ports.slice(0, maxShownPorts)];\n }\n return ports;\n};\n\nconst visibleInPorts = computed(() => cutOffPorts(inPorts));\nconst visibleOutPorts = computed(() => cutOffPorts(outPorts));\nconst numberOfHiddenPorts = computed(\n () =>\n inPorts.length -\n visibleInPorts.value.length +\n outPorts.length -\n visibleOutPorts.value.length,\n);\n</script>\n\n<template>\n <div class=\"node-preview\" :data-size=\"size\">\n <svg :viewBox=\"viewBox\" :width=\"width\" :height=\"height\">\n <SVGNodeTorso :type=\"type\" :icon=\"icon\" :is-component=\"isComponent\" />\n <template v-if=\"!hidePorts\">\n <KdsPortIcon\n v-for=\"(port, index) in visibleInPorts\"\n :key=\"`in-${index}`\"\n :color=\"port.color\"\n :optional=\"port.optional\"\n :type=\"port.type\"\n :standalone=\"false\"\n :transform=\"`translate(-${PORT_SIZE / 2}, ${yPortShift(index, visibleInPorts.length)})`\"\n />\n <KdsPortIcon\n v-for=\"(port, index) in visibleOutPorts\"\n :key=\"`out-${index}`\"\n :color=\"port.color\"\n :optional=\"port.optional\"\n :type=\"port.type\"\n :standalone=\"false\"\n :transform=\"`translate(${NODE_SIZE + PORT_SIZE / 2}, ${yPortShift(index, visibleOutPorts.length)})`\"\n />\n </template>\n </svg>\n <div v-if=\"!hideIndicators\" class=\"indicators\">\n <KdsIcon v-if=\"indicatorIcon\" :name=\"indicatorIcon\" size=\"small\" />\n <KdsIcon\n v-if=\"numberOfHiddenPorts > 0 && !hidePorts\"\n name=\"more-connections\"\n aria-label=\"Indication that some ports are hidden\"\n size=\"small\"\n />\n </div>\n </div>\n</template>\n\n<style scoped>\n.node-preview {\n display: flex;\n flex-direction: column;\n gap: var(--kds-spacing-container-0-25x);\n width: calc(v-bind(width) * 1px);\n\n /*\n * `zoom` is used instead of `transform: scale()` so that the shrunk size\n * is also reflected in the layout box, e.g. when placed in a flex or grid\n * container alongside other elements.\n */\n &[data-size=\"small\"] {\n zoom: calc(12 / v-bind(NODE_SIZE));\n }\n\n &[data-size=\"medium\"] {\n zoom: 0.5;\n }\n\n & .indicators {\n display: flex;\n gap: var(--kds-spacing-container-0-25x);\n justify-content: center;\n height: var(--kds-dimension-icon-0-75x);\n }\n}\n</style>\n"],"mappings":"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"}
package/dist/src/dataTransfer/upload/ui/types.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../src/dataTransfer/upload/ui/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,eAAe,EAAgB,MAAM,YAAY,CAAC;AAEhE,MAAM,MAAM,gBAAgB,GAAG,OAAO,CAAC,eAAe,EAAE,MAAM,CAAC,GAAG,YAAY,CAAC;AAI/E,QAAA,MAAM,gBAAgB;;;;;;CAGrB,CAAC;AAEF,KAAK,IAAI,GAAG;IACV,8CAA8C;IAC9C,EAAE,EAAE,MAAM,CAAC;IACX,sCAAsC;IACtC,IAAI,EAAE,MAAM,CAAC;IACb,0BAA0B;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,yDAAyD;IACzD,QAAQ,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG,IAAI,GAAG;IAChC,qDAAqD;IACrD,QAAQ,EAAE,MAAM,CAAC;IACjB,gEAAgE;IAChE,MAAM,EACF,OAAO,gBAAgB,CAAC,WAAW,GACnC,OAAO,gBAAgB,CAAC,QAAQ,CAAC;CACtC,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG,IAAI,GAAG;IACjC,8DAA8D;IAC9D,MAAM,EAAE,OAAO,gBAAgB,CAAC,SAAS,CAAC;CAC3C,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG,IAAI,GAAG;IAC/B,2CAA2C;IAC3C,MAAM,EAAE,OAAO,gBAAgB,CAAC,MAAM,CAAC;IACvC,2DAA2D;IAC3D,cAAc,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG,IAAI,GAAG;IAClC,0EAA0E;IAC1E,MAAM,EAAE,OAAO,gBAAgB,CAAC,UAAU,CAAC;CAC5C,CAAC;AAEF,MAAM,MAAM,UAAU,GAClB,YAAY,GACZ,aAAa,GACb,WAAW,GACX,cAAc,CAAC;AAEnB,MAAM,MAAM,wBAAwB,GAAG;IACrC;;OAEG;IACH,KAAK,EAAE,UAAU,EAAE,CAAC;IACpB;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B,CAAC"}
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../src/dataTransfer/upload/ui/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,eAAe,EAAgB,MAAM,YAAY,CAAC;AAEhE,MAAM,MAAM,gBAAgB,GAAG,OAAO,CAAC,eAAe,EAAE,MAAM,CAAC,GAAG,YAAY,CAAC;AAI/E,QAAA,MAAM,gBAAgB;;;;;;CAGrB,CAAC;AAEF,KAAK,IAAI,GAAG;IACV,8CAA8C;IAC9C,EAAE,EAAE,MAAM,CAAC;IACX,sCAAsC;IACtC,IAAI,EAAE,MAAM,CAAC;IACb,0BAA0B;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,yDAAyD;IACzD,QAAQ,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG,IAAI,GAAG;IAChC,qDAAqD;IACrD,QAAQ,EAAE,MAAM,CAAC;IACjB,gEAAgE;IAChE,MAAM,EACJ,OAAO,gBAAgB,CAAC,WAAW,GAAG,OAAO,gBAAgB,CAAC,QAAQ,CAAC;CAC1E,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG,IAAI,GAAG;IACjC,8DAA8D;IAC9D,MAAM,EAAE,OAAO,gBAAgB,CAAC,SAAS,CAAC;CAC3C,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG,IAAI,GAAG;IAC/B,2CAA2C;IAC3C,MAAM,EAAE,OAAO,gBAAgB,CAAC,MAAM,CAAC;IACvC,2DAA2D;IAC3D,cAAc,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG,IAAI,GAAG;IAClC,0EAA0E;IAC1E,MAAM,EAAE,OAAO,gBAAgB,CAAC,UAAU,CAAC;CAC5C,CAAC;AAEF,MAAM,MAAM,UAAU,GACpB,YAAY,GAAG,aAAa,GAAG,WAAW,GAAG,cAAc,CAAC;AAE9D,MAAM,MAAM,wBAAwB,GAAG;IACrC;;OAEG;IACH,KAAK,EAAE,UAAU,EAAE,CAAC;IACpB;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B,CAAC"}
package/dist/src/nodes/NodeDescriptionTabs/PortTemplateInfo.vue.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"PortTemplateInfo.vue.d.ts","sourceRoot":"","sources":["../../../../src/nodes/NodeDescriptionTabs/PortTemplateInfo.vue"],"names":[],"mappings":"AAiEA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAE5C,KAAK,KAAK,GAAG;IACX,IAAI,EAAE,YAAY,CAAC;IACnB,eAAe,EAAE,OAAO,CAAC;CAC1B,CAAC;AAgFF,QAAA,MAAM,YAAY,sRAEhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}
1
+ {"version":3,"file":"PortTemplateInfo.vue.d.ts","sourceRoot":"","sources":["../../../../src/nodes/NodeDescriptionTabs/PortTemplateInfo.vue"],"names":[],"mappings":"AA6DA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAE5C,KAAK,KAAK,GAAG;IACX,IAAI,EAAE,YAAY,CAAC;IACnB,eAAe,EAAE,OAAO,CAAC;CAC1B,CAAC;AAmFF,QAAA,MAAM,YAAY,sRAEhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}
package/dist/src/nodes/NodeDescriptionTabs/types.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { PortType } from '../PortIcon/types';
1
+ import { KdsPortType } from '@knime/kds-components';
2
2
  export type PortTemplate = {
3
3
  /**
4
4
  * Unique fully-qualified identifier for the port. Not user-supplied, comes from the backend
@@ -12,7 +12,7 @@ export type PortTemplate = {
12
12
  /**
13
13
  * General port type, which acts as an overall category and determines the rendered shape
14
14
  */
15
- type: PortType;
15
+ type: KdsPortType;
16
16
  /**
17
17
  * Human readable name for the port `type`
18
18
  */
package/dist/src/nodes/NodeDescriptionTabs/types.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/nodes/NodeDescriptionTabs/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAElD,MAAM,MAAM,YAAY,GAAG;IACzB;;;OAGG;IACH,EAAE,EAAE,MAAM,CAAC;IACX;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,IAAI,EAAE,QAAQ,CAAC;IACf;;OAEG;IACH,eAAe,EAAE,MAAM,CAAC;IACxB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,WAAW,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC7B,+CAA+C;IAC/C,IAAI,EAAE,MAAM,CAAC;IACb,mEAAmE;IACnE,WAAW,EAAE,MAAM,CAAC;IACpB,sDAAsD;IACtD,KAAK,EAAE,YAAY,EAAE,CAAC;CACvB,CAAC;AAEF;;;GAGG;AACH,MAAM,MAAM,sBAAsB,GAAG;IACnC;;OAEG;IACH,WAAW,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,MAAM,EAAE,KAAK,CAAC;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,WAAW,EAAE,MAAM,CAAC;QAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;KAAE,CAAC,CAAC;CAC1E,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,gCAAgC;IAChC,IAAI,EAAE,MAAM,CAAC;IACb,8DAA8D;IAC9D,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,wBAAwB,GAAG;IACrC,sCAAsC;IACtC,UAAU,CAAC,EAAE,YAAY,EAAE,CAAC;IAC5B,uCAAuC;IACvC,WAAW,CAAC,EAAE,YAAY,EAAE,CAAC;IAC7B,4DAA4D;IAC5D,iBAAiB,CAAC,EAAE,gBAAgB,EAAE,CAAC;IACvC,kCAAkC;IAClC,kBAAkB,CAAC,EAAE,gBAAgB,EAAE,CAAC;IACxC,qDAAqD;IACrD,WAAW,CAAC,EAAE,sBAAsB,EAAE,CAAC;IACvC,gEAAgE;IAChE,SAAS,CAAC,EAAE,mBAAmB,EAAE,CAAC;IAElC,qEAAqE;IACrE,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,mGAAmG;IACnG,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB,wEAAwE;IACxE,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B,CAAC"}
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/nodes/NodeDescriptionTabs/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAEzD,MAAM,MAAM,YAAY,GAAG;IACzB;;;OAGG;IACH,EAAE,EAAE,MAAM,CAAC;IACX;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,IAAI,EAAE,WAAW,CAAC;IAClB;;OAEG;IACH,eAAe,EAAE,MAAM,CAAC;IACxB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,WAAW,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC7B,+CAA+C;IAC/C,IAAI,EAAE,MAAM,CAAC;IACb,mEAAmE;IACnE,WAAW,EAAE,MAAM,CAAC;IACpB,sDAAsD;IACtD,KAAK,EAAE,YAAY,EAAE,CAAC;CACvB,CAAC;AAEF;;;GAGG;AACH,MAAM,MAAM,sBAAsB,GAAG;IACnC;;OAEG;IACH,WAAW,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,MAAM,EAAE,KAAK,CAAC;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,WAAW,EAAE,MAAM,CAAC;QAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;KAAE,CAAC,CAAC;CAC1E,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,gCAAgC;IAChC,IAAI,EAAE,MAAM,CAAC;IACb,8DAA8D;IAC9D,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,wBAAwB,GAAG;IACrC,sCAAsC;IACtC,UAAU,CAAC,EAAE,YAAY,EAAE,CAAC;IAC5B,uCAAuC;IACvC,WAAW,CAAC,EAAE,YAAY,EAAE,CAAC;IAC7B,4DAA4D;IAC5D,iBAAiB,CAAC,EAAE,gBAAgB,EAAE,CAAC;IACvC,kCAAkC;IAClC,kBAAkB,CAAC,EAAE,gBAAgB,EAAE,CAAC;IACxC,qDAAqD;IACrD,WAAW,CAAC,EAAE,sBAAsB,EAAE,CAAC;IACvC,gEAAgE;IAChE,SAAS,CAAC,EAAE,mBAAmB,EAAE,CAAC;IAElC,qEAAqE;IACrE,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,mGAAmG;IACnG,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB,wEAAwE;IACxE,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B,CAAC"}
package/dist/src/nodes/NodePreview/NodePreview.vue.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"NodePreview.vue.d.ts","sourceRoot":"","sources":["../../../../src/nodes/NodePreview/NodePreview.vue"],"names":[],"mappings":"AAkJA,OAAO,KAAK,EAAE,gBAAgB,EAAQ,MAAM,SAAS,CAAC;AAuMtD,QAAA,MAAM,YAAY,4SAEhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}
1
+ {"version":3,"file":"NodePreview.vue.d.ts","sourceRoot":"","sources":["../../../../src/nodes/NodePreview/NodePreview.vue"],"names":[],"mappings":"AA8IA,OAAO,KAAK,EAAE,gBAAgB,EAAQ,MAAM,SAAS,CAAC;AAgNtD,QAAA,MAAM,YAAY,4SAEhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}
package/dist/src/nodes/NodePreview/types.d.ts CHANGED
@@ -1,5 +1,4 @@
1
- import { KdsIconName } from '@knime/kds-components';
2
- import { PortType } from '../PortIcon';
1
+ import { KdsIconName, KdsPortType } from '@knime/kds-components';
3
2
  import { NodePreviewSize, NodeTypes } from './enums';
4
3
  export type NodeType = (typeof NodeTypes)[number];
5
4
  export type NodePreviewSize = (typeof NodePreviewSize)[number];
@@ -23,7 +22,7 @@ export type Port = {
23
22
  /** CSS-compatible color string for type "other" and "generic" */
24
23
  color?: string;
25
24
  optional?: boolean;
26
- type: PortType;
25
+ type: KdsPortType;
27
26
  };
28
27
  export type NodePreviewProps = {
29
28
  /**
package/dist/src/nodes/NodePreview/types.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/nodes/NodePreview/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAEzD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAE5C,OAAO,KAAK,EAAE,eAAe,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAE1D,MAAM,MAAM,QAAQ,GAAG,CAAC,OAAO,SAAS,CAAC,CAAC,MAAM,CAAC,CAAC;AAClD,MAAM,MAAM,eAAe,GAAG,CAAC,OAAO,eAAe,CAAC,CAAC,MAAM,CAAC,CAAC;AAE/D,MAAM,MAAM,cAAc,GAAG;IAC3B;;;;OAIG;IACH,IAAI,CAAC,EAAE,QAAQ,GAAG,IAAI,CAAC;IACvB;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,IAAI,GAAG;IACjB,iEAAiE;IACjE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,EAAE,QAAQ,CAAC;CAChB,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;OAEG;IACH,IAAI,CAAC,EAAE,QAAQ,GAAG,IAAI,CAAC;IACvB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,aAAa,CAAC,EAAE,WAAW,CAAC;IAC5B;;OAEG;IACH,OAAO,CAAC,EAAE,IAAI,EAAE,CAAC;IACjB;;OAEG;IACH,QAAQ,CAAC,EAAE,IAAI,EAAE,CAAC;IAClB;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;OAEG;IACH,IAAI,CAAC,EAAE,eAAe,CAAC;CACxB,CAAC"}
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/nodes/NodePreview/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,WAAW,EAAE,KAAK,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAE3E,OAAO,KAAK,EAAE,eAAe,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAE1D,MAAM,MAAM,QAAQ,GAAG,CAAC,OAAO,SAAS,CAAC,CAAC,MAAM,CAAC,CAAC;AAClD,MAAM,MAAM,eAAe,GAAG,CAAC,OAAO,eAAe,CAAC,CAAC,MAAM,CAAC,CAAC;AAE/D,MAAM,MAAM,cAAc,GAAG;IAC3B;;;;OAIG;IACH,IAAI,CAAC,EAAE,QAAQ,GAAG,IAAI,CAAC;IACvB;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,IAAI,GAAG;IACjB,iEAAiE;IACjE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,EAAE,WAAW,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;OAEG;IACH,IAAI,CAAC,EAAE,QAAQ,GAAG,IAAI,CAAC;IACvB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,aAAa,CAAC,EAAE,WAAW,CAAC;IAC5B;;OAEG;IACH,OAAO,CAAC,EAAE,IAAI,EAAE,CAAC;IACjB;;OAEG;IACH,QAAQ,CAAC,EAAE,IAAI,EAAE,CAAC;IAClB;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;OAEG;IACH,IAAI,CAAC,EAAE,eAAe,CAAC;CACxB,CAAC"}
package/dist/src/nodes/index.d.ts CHANGED
@@ -2,6 +2,4 @@ export * from './NodeDescriptionTabs';
2
2
  export type * from './NodeDescriptionTabs';
3
3
  export * from './NodePreview';
4
4
  export type * from './NodePreview';
5
- export * from './PortIcon';
6
- export type * from './PortIcon';
7
5
  //# sourceMappingURL=index.d.ts.map
package/dist/src/nodes/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/nodes/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAC;AACtC,mBAAmB,uBAAuB,CAAC;AAE3C,cAAc,eAAe,CAAC;AAC9B,mBAAmB,eAAe,CAAC;AAEnC,cAAc,YAAY,CAAC;AAC3B,mBAAmB,YAAY,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/nodes/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAC;AACtC,mBAAmB,uBAAuB,CAAC;AAE3C,cAAc,eAAe,CAAC;AAC9B,mBAAmB,eAAe,CAAC"}