@knime/product-features 6.1.0 → 6.1.1

package/dist/versions.css

@@ -63,7 +63,7 @@
   gap: var(--kds-spacing-container-0-37x);
 }
 
-.label-popover-container[data-v-00d7133a] {
+.label-popover-container[data-v-7878b825] {
   display: flex;
   flex-direction: column;
   gap: var(--kds-spacing-container-0-5x);
@@ -76,7 +76,7 @@
   border-radius: var(--kds-border-radius-container-0-50x);
   box-shadow: var(--kds-elevation-level-3);
 }
-.label-title[data-v-00d7133a] {
+.label-title[data-v-7878b825] {
   font: var(--kds-font-base-body-small-strong);
 }
 

package/dist/versions.js

@@ -1,6 +1,6 @@
 import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper-BOaGB7Aw.js";
-import { i as formatLocalDateTimeString, n as formatDateTimeString } from "./dist-DtdyvuFe.js";
-import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createSlots, createTextVNode, createVNode, defineComponent, guardReactiveProps, mergeModels, nextTick, normalizeClass, normalizeProps, normalizeStyle, onMounted, openBlock, ref, renderList, renderSlot, toDisplayString, unref, useModel, useTemplateRef, withCtx, withDirectives, withModifiers } from "vue";
+import { i as formatLocalDateTimeString, n as formatDateTimeString } from "./dist-htLRPkoq.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createSlots, createTextVNode, createVNode, defineComponent, guardReactiveProps, mergeModels, nextTick, normalizeClass, normalizeProps, onMounted, openBlock, ref, renderList, renderSlot, toDisplayString, unref, useModel, useTemplateRef, withCtx, withDirectives, withModifiers } from "vue";
 import { KdsAvatar, KdsButton, KdsCard, KdsDescription, KdsIcon, KdsLinkButton, KdsMenuButton, KdsPanel, KdsPopover, KdsSelectableCard, KdsTextInput, KdsTextarea, KdsToggleButton, vKdsTooltip } from "@knime/kds-components";
 import './versions.css';//#region src/versions/VersionHistory/HistoryEvent.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1$8 = { class: "history-event-wrapper" };
@@ -168,8 +168,10 @@ var VersionLabel_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
 	setup(__props) {
 		const isPopoverOpen = useModel(__props, "modelValue");
 		const popoverEl = useTemplateRef("popover");
+		const toggleButtonEl = useTemplateRef("toggleButton");
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock(Fragment, null, [createVNode(unref(KdsToggleButton), {
+				ref: "toggleButton",
 				modelValue: isPopoverOpen.value,
 				"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isPopoverOpen.value = $event),
 				"data-kds-card-secondary-action": "",
@@ -177,18 +179,17 @@ var VersionLabel_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
 				"aria-haspopup": "dialog",
 				"aria-expanded": isPopoverOpen.value,
 				"aria-controls": popoverEl.value?.popoverId,
-				size: "xsmall",
-				style: normalizeStyle(popoverEl.value?.anchorStyle)
+				size: "xsmall"
 			}, null, 8, [
 				"modelValue",
 				"label",
 				"aria-expanded",
-				"aria-controls",
-				"style"
+				"aria-controls"
 			]), createVNode(unref(KdsPopover), {
 				ref: "popover",
 				modelValue: isPopoverOpen.value,
 				"onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => isPopoverOpen.value = $event),
+				anchor: toggleButtonEl.value?.$el,
 				placement: "bottom-left",
 				role: "dialog",
 				"aria-label": "Label details"
@@ -202,10 +203,10 @@ var VersionLabel_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
 					}, null, 8, ["text"])) : createCommentVNode("", true)
 				])]),
 				_: 1
-			}, 8, ["modelValue"])], 64);
+			}, 8, ["modelValue", "anchor"])], 64);
 		};
 	}
-}), [["__scopeId", "data-v-00d7133a"]]);
+}), [["__scopeId", "data-v-7878b825"]]);
 //#endregion
 //#region src/versions/VersionHistory/VersionItem.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1$3 = { class: "content-wrapper" };

package/dist/versions.js.map

@@ -1 +1 @@
-{"version":3,"file":"versions.js","names":["$emit","$emit"],"sources":["../src/versions/VersionHistory/HistoryEvent.vue","../src/versions/VersionHistory/HistoryEvent.vue","../src/versions/VersionHistory/HistoryEventAuthor.vue","../src/versions/VersionHistory/HistoryEventAuthor.vue","../src/versions/VersionHistory/HistoryEventFooter.vue","../src/versions/VersionHistory/HistoryEventFooter.vue","../src/versions/VersionHistory/CurrentState.vue","../src/versions/VersionHistory/CurrentState.vue","../src/versions/VersionHistory/VersionLabel.vue","../src/versions/VersionHistory/VersionLabel.vue","../src/versions/VersionHistory/VersionItem.vue","../src/versions/VersionHistory/VersionItem.vue","../src/versions/VersionHistory/VersionLimitInfo.vue","../src/versions/VersionHistory/VersionLimitInfo.vue","../src/versions/VersionHistory/constants.ts","../src/versions/VersionHistory/VersionHistory.vue","../src/versions/VersionHistory/VersionHistory.vue","../src/versions/CreateVersionForm/CreateVersionForm.vue","../src/versions/CreateVersionForm/CreateVersionForm.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { KdsIcon } from \"@knime/kds-components\";\n\ntype Props = {\n  isSelected: boolean;\n  isFirstItem: boolean;\n  isLastItem: boolean;\n};\n\ndefineProps<Props>();\n</script>\n\n<template>\n  <div class=\"history-event-wrapper\">\n    <div class=\"history-event-decorator\">\n      <div v-if=\"!isFirstItem\" class=\"history-event-line-top\" />\n      <KdsIcon\n        class=\"history-event-icon\"\n        :name=\"isSelected ? 'circle-success' : 'circle-unchecked'\"\n        size=\"small\"\n      />\n      <div v-if=\"!isLastItem\" class=\"history-event-line-bottom\" />\n    </div>\n\n    <div class=\"card-wrapper\">\n      <slot />\n    </div>\n  </div>\n</template>\n\n<style scoped>\n.history-event-wrapper {\n  display: flex;\n}\n\n.history-event-decorator {\n  position: relative;\n  display: flex;\n  flex-shrink: 0;\n  justify-content: center;\n  width: var(--kds-dimension-component-width-0-75x);\n  margin: 0 var(--kds-spacing-container-0-75x);\n}\n\n.history-event-line-top {\n  position: absolute;\n  top: calc(var(--kds-spacing-container-0-37x) * -1);\n  height: calc(\n    var(--kds-spacing-container-1x) + var(--kds-spacing-container-0-37x)\n  );\n  border-left: var(--kds-border-base-subtle);\n}\n\n.history-event-line-bottom {\n  position: absolute;\n  top: calc(\n    var(--kds-spacing-container-1x) + var(--kds-spacing-container-0-37x) +\n      var(--kds-spacing-container-0-37x)\n  );\n  bottom: calc(var(--kds-spacing-container-0-37x) * -1);\n  border-left: var(--kds-border-base-subtle);\n}\n\n.history-event-icon {\n  position: absolute;\n  top: var(--kds-spacing-container-1x);\n}\n\n.card-wrapper {\n  display: flex;\n  flex-grow: 1;\n  flex-direction: column;\n  gap: var(--kds-spacing-container-0-37x);\n  min-width: 0;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { KdsIcon } from \"@knime/kds-components\";\n\ntype Props = {\n  isSelected: boolean;\n  isFirstItem: boolean;\n  isLastItem: boolean;\n};\n\ndefineProps<Props>();\n</script>\n\n<template>\n  <div class=\"history-event-wrapper\">\n    <div class=\"history-event-decorator\">\n      <div v-if=\"!isFirstItem\" class=\"history-event-line-top\" />\n      <KdsIcon\n        class=\"history-event-icon\"\n        :name=\"isSelected ? 'circle-success' : 'circle-unchecked'\"\n        size=\"small\"\n      />\n      <div v-if=\"!isLastItem\" class=\"history-event-line-bottom\" />\n    </div>\n\n    <div class=\"card-wrapper\">\n      <slot />\n    </div>\n  </div>\n</template>\n\n<style scoped>\n.history-event-wrapper {\n  display: flex;\n}\n\n.history-event-decorator {\n  position: relative;\n  display: flex;\n  flex-shrink: 0;\n  justify-content: center;\n  width: var(--kds-dimension-component-width-0-75x);\n  margin: 0 var(--kds-spacing-container-0-75x);\n}\n\n.history-event-line-top {\n  position: absolute;\n  top: calc(var(--kds-spacing-container-0-37x) * -1);\n  height: calc(\n    var(--kds-spacing-container-1x) + var(--kds-spacing-container-0-37x)\n  );\n  border-left: var(--kds-border-base-subtle);\n}\n\n.history-event-line-bottom {\n  position: absolute;\n  top: calc(\n    var(--kds-spacing-container-1x) + var(--kds-spacing-container-0-37x) +\n      var(--kds-spacing-container-0-37x)\n  );\n  bottom: calc(var(--kds-spacing-container-0-37x) * -1);\n  border-left: var(--kds-border-base-subtle);\n}\n\n.history-event-icon {\n  position: absolute;\n  top: var(--kds-spacing-container-1x);\n}\n\n.card-wrapper {\n  display: flex;\n  flex-grow: 1;\n  flex-direction: column;\n  gap: var(--kds-spacing-container-0-37x);\n  min-width: 0;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { KdsAvatar } from \"@knime/kds-components\";\n\nimport type { WithAvatar } from \"./types\";\n\ntype Props = WithAvatar & {\n  author: string;\n};\n\ndefineProps<Props>();\n</script>\n\n<template>\n  <div class=\"avatar-and-name-wrapper\">\n    <KdsAvatar v-bind=\"avatar\" />\n    <span class=\"author-name\">{{ author }}</span>\n  </div>\n</template>\n\n<style scoped>\n.avatar-and-name-wrapper {\n  display: flex;\n  gap: var(--kds-spacing-container-0-25x);\n  align-items: center;\n}\n\n.author-name {\n  font: var(--kds-font-base-subtext-small);\n  color: var(--kds-color-text-and-icon-neutral);\n}\n</style>\n","<script setup lang=\"ts\">\nimport { KdsAvatar } from \"@knime/kds-components\";\n\nimport type { WithAvatar } from \"./types\";\n\ntype Props = WithAvatar & {\n  author: string;\n};\n\ndefineProps<Props>();\n</script>\n\n<template>\n  <div class=\"avatar-and-name-wrapper\">\n    <KdsAvatar v-bind=\"avatar\" />\n    <span class=\"author-name\">{{ author }}</span>\n  </div>\n</template>\n\n<style scoped>\n.avatar-and-name-wrapper {\n  display: flex;\n  gap: var(--kds-spacing-container-0-25x);\n  align-items: center;\n}\n\n.author-name {\n  font: var(--kds-font-base-subtext-small);\n  color: var(--kds-color-text-and-icon-neutral);\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed, onMounted, ref } from \"vue\";\n\nimport { vKdsTooltip } from \"@knime/kds-components\";\nimport { formatDateTimeString, formatLocalDateTimeString } from \"@knime/utils\";\n\nimport type { NamedItemVersion } from \"./types\";\n\ntype Props = {\n  date: string;\n  version?: NamedItemVersion[\"version\"];\n};\n\nconst { version, date } = defineProps<Props>();\n\n// Render the hidden non-local format on the server / first paint to reserve the\n// space and avoid content jumping once the localized value swaps in after mount\nconst isMounted = ref(false);\nconst localDateTime = computed(() =>\n  isMounted.value\n    ? formatLocalDateTimeString(date, true)\n    : formatDateTimeString(date, true),\n);\n\nonMounted(() => {\n  isMounted.value = true;\n});\n</script>\n\n<template>\n  <span class=\"history-event-footer\">\n    Created on\n    <time\n      v-kds-tooltip=\"date\"\n      :datetime=\"date\"\n      :class=\"{ hidden: !isMounted }\"\n      >{{ localDateTime }}</time\n    >\n    <template v-if=\"version\">– Version {{ version }}</template>\n  </span>\n</template>\n\n<style scoped>\n.history-event-footer {\n  font: var(--kds-font-base-subtext-small);\n  color: var(--kds-color-text-and-icon-subtle);\n}\n\n.hidden {\n  visibility: hidden;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed, onMounted, ref } from \"vue\";\n\nimport { vKdsTooltip } from \"@knime/kds-components\";\nimport { formatDateTimeString, formatLocalDateTimeString } from \"@knime/utils\";\n\nimport type { NamedItemVersion } from \"./types\";\n\ntype Props = {\n  date: string;\n  version?: NamedItemVersion[\"version\"];\n};\n\nconst { version, date } = defineProps<Props>();\n\n// Render the hidden non-local format on the server / first paint to reserve the\n// space and avoid content jumping once the localized value swaps in after mount\nconst isMounted = ref(false);\nconst localDateTime = computed(() =>\n  isMounted.value\n    ? formatLocalDateTimeString(date, true)\n    : formatDateTimeString(date, true),\n);\n\nonMounted(() => {\n  isMounted.value = true;\n});\n</script>\n\n<template>\n  <span class=\"history-event-footer\">\n    Created on\n    <time\n      v-kds-tooltip=\"date\"\n      :datetime=\"date\"\n      :class=\"{ hidden: !isMounted }\"\n      >{{ localDateTime }}</time\n    >\n    <template v-if=\"version\">– Version {{ version }}</template>\n  </span>\n</template>\n\n<style scoped>\n.history-event-footer {\n  font: var(--kds-font-base-subtext-small);\n  color: var(--kds-color-text-and-icon-subtle);\n}\n\n.hidden {\n  visibility: hidden;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport {\n  KdsButton,\n  type KdsMenuActionItem,\n  KdsMenuButton,\n  KdsSelectableCard,\n} from \"@knime/kds-components\";\n\nimport HistoryEvent from \"./HistoryEvent.vue\";\nimport HistoryEventAuthor from \"./HistoryEventAuthor.vue\";\nimport HistoryEventFooter from \"./HistoryEventFooter.vue\";\nimport type { ItemSavepoint, WithAvatar, WithLabels } from \"./types\";\n\ntype Props = {\n  currentSavepoint: ItemSavepoint & WithAvatar & WithLabels;\n  isSelected: boolean;\n  hasEditCapability: boolean;\n  hasPreviousVersion: boolean;\n  hasVersionLimit: boolean;\n  isVersionLimitExceeded?: boolean;\n};\n\nconst props = defineProps<Props>();\n\nconst emit = defineEmits<{\n  createVersion: [];\n  discard: [];\n  select: [];\n}>();\n\nconst menuItems = computed<KdsMenuActionItem[]>(() =>\n  props.hasEditCapability && props.hasPreviousVersion\n    ? [\n        {\n          id: \"discard\",\n          text: \"Discard\",\n          handler: () => emit(\"discard\"),\n        },\n      ]\n    : [],\n);\n</script>\n\n<template>\n  <HistoryEvent\n    :is-selected\n    is-first-item\n    :is-last-item=\"!hasPreviousVersion && !hasVersionLimit\"\n  >\n    <KdsSelectableCard\n      :model-value=\"isSelected\"\n      headline=\"Draft\"\n      ariaLabel=\"Savepoint history event\"\n      @update:model-value=\"!isSelected && $emit('select')\"\n    >\n      <template v-if=\"menuItems.length\" #header-actions>\n        <KdsMenuButton\n          :items=\"menuItems\"\n          variant=\"transparent\"\n          leading-icon=\"more-actions\"\n          ariaLabel=\"More actions\"\n        />\n      </template>\n\n      <div class=\"content-wrapper\">\n        <HistoryEventAuthor\n          :author=\"currentSavepoint.author\"\n          :avatar=\"currentSavepoint.avatar\"\n        />\n\n        <HistoryEventFooter :date=\"currentSavepoint.lastEditedOn\" />\n      </div>\n    </KdsSelectableCard>\n\n    <KdsButton\n      v-if=\"hasEditCapability && !isVersionLimitExceeded\"\n      label=\"Create version\"\n      @click.stop=\"$emit('createVersion')\"\n    />\n  </HistoryEvent>\n</template>\n\n<style scoped>\n.content-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: var(--kds-spacing-container-0-37x);\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport {\n  KdsButton,\n  type KdsMenuActionItem,\n  KdsMenuButton,\n  KdsSelectableCard,\n} from \"@knime/kds-components\";\n\nimport HistoryEvent from \"./HistoryEvent.vue\";\nimport HistoryEventAuthor from \"./HistoryEventAuthor.vue\";\nimport HistoryEventFooter from \"./HistoryEventFooter.vue\";\nimport type { ItemSavepoint, WithAvatar, WithLabels } from \"./types\";\n\ntype Props = {\n  currentSavepoint: ItemSavepoint & WithAvatar & WithLabels;\n  isSelected: boolean;\n  hasEditCapability: boolean;\n  hasPreviousVersion: boolean;\n  hasVersionLimit: boolean;\n  isVersionLimitExceeded?: boolean;\n};\n\nconst props = defineProps<Props>();\n\nconst emit = defineEmits<{\n  createVersion: [];\n  discard: [];\n  select: [];\n}>();\n\nconst menuItems = computed<KdsMenuActionItem[]>(() =>\n  props.hasEditCapability && props.hasPreviousVersion\n    ? [\n        {\n          id: \"discard\",\n          text: \"Discard\",\n          handler: () => emit(\"discard\"),\n        },\n      ]\n    : [],\n);\n</script>\n\n<template>\n  <HistoryEvent\n    :is-selected\n    is-first-item\n    :is-last-item=\"!hasPreviousVersion && !hasVersionLimit\"\n  >\n    <KdsSelectableCard\n      :model-value=\"isSelected\"\n      headline=\"Draft\"\n      ariaLabel=\"Savepoint history event\"\n      @update:model-value=\"!isSelected && $emit('select')\"\n    >\n      <template v-if=\"menuItems.length\" #header-actions>\n        <KdsMenuButton\n          :items=\"menuItems\"\n          variant=\"transparent\"\n          leading-icon=\"more-actions\"\n          ariaLabel=\"More actions\"\n        />\n      </template>\n\n      <div class=\"content-wrapper\">\n        <HistoryEventAuthor\n          :author=\"currentSavepoint.author\"\n          :avatar=\"currentSavepoint.avatar\"\n        />\n\n        <HistoryEventFooter :date=\"currentSavepoint.lastEditedOn\" />\n      </div>\n    </KdsSelectableCard>\n\n    <KdsButton\n      v-if=\"hasEditCapability && !isVersionLimitExceeded\"\n      label=\"Create version\"\n      @click.stop=\"$emit('createVersion')\"\n    />\n  </HistoryEvent>\n</template>\n\n<style scoped>\n.content-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: var(--kds-spacing-container-0-37x);\n}\n</style>\n","<script setup lang=\"ts\">\nimport { useTemplateRef } from \"vue\";\n\nimport {\n  KdsDescription,\n  KdsPopover,\n  type KdsPopoverExpose,\n  KdsToggleButton,\n} from \"@knime/kds-components\";\n\nimport type { AssignedLabel } from \"./types\";\n\ntype Props = {\n  label: AssignedLabel;\n};\n\ndefineProps<Props>();\n\nconst isPopoverOpen = defineModel<boolean>({ default: false });\nconst popoverEl = useTemplateRef<KdsPopoverExpose>(\"popover\");\n</script>\n\n<template>\n  <KdsToggleButton\n    v-model=\"isPopoverOpen\"\n    data-kds-card-secondary-action\n    :label=\"label.label.name\"\n    aria-haspopup=\"dialog\"\n    :aria-expanded=\"isPopoverOpen\"\n    :aria-controls=\"popoverEl?.popoverId\"\n    size=\"xsmall\"\n    :style=\"popoverEl?.anchorStyle\"\n  />\n\n  <KdsPopover\n    ref=\"popover\"\n    v-model=\"isPopoverOpen\"\n    placement=\"bottom-left\"\n    role=\"dialog\"\n    aria-label=\"Label details\"\n  >\n    <div class=\"label-popover-container\">\n      <div class=\"label-title\">{{ label.label.name }}</div>\n      <KdsDescription :text=\"label.label.description\" />\n      <KdsDescription v-if=\"label.message\" :text=\"label.message\" />\n    </div>\n  </KdsPopover>\n</template>\n\n<style scoped>\n.label-popover-container {\n  display: flex;\n  flex-direction: column;\n  gap: var(--kds-spacing-container-0-5x);\n  align-items: flex-start;\n  max-width: var(--kds-dimension-component-width-20x);\n  max-height: var(--kds-dimension-component-height-20x);\n  padding: var(--kds-spacing-container-0-75x) var(--kds-spacing-container-1x);\n  overflow-y: auto;\n  background-color: var(--kds-color-surface-default);\n  border-radius: var(--kds-border-radius-container-0-50x);\n  box-shadow: var(--kds-elevation-level-3);\n}\n\n.label-title {\n  font: var(--kds-font-base-body-small-strong);\n}\n</style>\n","<script setup lang=\"ts\">\nimport { useTemplateRef } from \"vue\";\n\nimport {\n  KdsDescription,\n  KdsPopover,\n  type KdsPopoverExpose,\n  KdsToggleButton,\n} from \"@knime/kds-components\";\n\nimport type { AssignedLabel } from \"./types\";\n\ntype Props = {\n  label: AssignedLabel;\n};\n\ndefineProps<Props>();\n\nconst isPopoverOpen = defineModel<boolean>({ default: false });\nconst popoverEl = useTemplateRef<KdsPopoverExpose>(\"popover\");\n</script>\n\n<template>\n  <KdsToggleButton\n    v-model=\"isPopoverOpen\"\n    data-kds-card-secondary-action\n    :label=\"label.label.name\"\n    aria-haspopup=\"dialog\"\n    :aria-expanded=\"isPopoverOpen\"\n    :aria-controls=\"popoverEl?.popoverId\"\n    size=\"xsmall\"\n    :style=\"popoverEl?.anchorStyle\"\n  />\n\n  <KdsPopover\n    ref=\"popover\"\n    v-model=\"isPopoverOpen\"\n    placement=\"bottom-left\"\n    role=\"dialog\"\n    aria-label=\"Label details\"\n  >\n    <div class=\"label-popover-container\">\n      <div class=\"label-title\">{{ label.label.name }}</div>\n      <KdsDescription :text=\"label.label.description\" />\n      <KdsDescription v-if=\"label.message\" :text=\"label.message\" />\n    </div>\n  </KdsPopover>\n</template>\n\n<style scoped>\n.label-popover-container {\n  display: flex;\n  flex-direction: column;\n  gap: var(--kds-spacing-container-0-5x);\n  align-items: flex-start;\n  max-width: var(--kds-dimension-component-width-20x);\n  max-height: var(--kds-dimension-component-height-20x);\n  padding: var(--kds-spacing-container-0-75x) var(--kds-spacing-container-1x);\n  overflow-y: auto;\n  background-color: var(--kds-color-surface-default);\n  border-radius: var(--kds-border-radius-container-0-50x);\n  box-shadow: var(--kds-elevation-level-3);\n}\n\n.label-title {\n  font: var(--kds-font-base-body-small-strong);\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport {\n  KdsDescription,\n  type KdsMenuActionItem,\n  KdsMenuButton,\n  KdsSelectableCard,\n} from \"@knime/kds-components\";\n\nimport HistoryEvent from \"./HistoryEvent.vue\";\nimport HistoryEventAuthor from \"./HistoryEventAuthor.vue\";\nimport HistoryEventFooter from \"./HistoryEventFooter.vue\";\nimport VersionLabel from \"./VersionLabel.vue\";\nimport type {\n  NamedItemVersion,\n  RestoreOption,\n  WithAvatar,\n  WithLabels,\n} from \"./types\";\n\ntype Props = {\n  version: NamedItemVersion & WithAvatar & WithLabels;\n  isSelected: boolean;\n  hasAdminRights: boolean;\n  hasEditCapability: boolean;\n  isFirstItem: boolean;\n  isLastItem: boolean;\n  restoreOption?: RestoreOption;\n};\n\nconst props = defineProps<Props>();\n\nconst emit = defineEmits<{\n  select: [selectionStatus: boolean];\n  delete: [];\n  restore: [];\n}>();\n\nconst toggleVersionSelection = () => {\n  emit(\"select\", !props.isSelected);\n};\n\nconst menuItems = computed<KdsMenuActionItem[]>(() =>\n  [\n    props.hasEditCapability && {\n      id: \"show\",\n      text: props.isSelected ? \"Deselect this version\" : \"Show this version\",\n      handler: toggleVersionSelection,\n    },\n    props.hasEditCapability && {\n      id: \"restore\",\n      text: \"Restore this version\",\n      subText: props.restoreOption?.subText,\n      disabled: props.restoreOption?.disabled,\n      handler: () => emit(\"restore\"),\n    },\n    props.hasAdminRights && {\n      id: \"delete\",\n      text: \"Delete this version\",\n      handler: () => emit(\"delete\"),\n    },\n  ].filter((i) => i !== false),\n);\n</script>\n\n<template>\n  <HistoryEvent :is-selected :is-first-item :is-last-item>\n    <KdsSelectableCard\n      :model-value=\"isSelected\"\n      :headline=\"version.title\"\n      ariaLabel=\"Version history event\"\n      @update:model-value=\"toggleVersionSelection\"\n    >\n      <template v-if=\"menuItems.length\" #header-actions>\n        <KdsMenuButton\n          :items=\"menuItems\"\n          variant=\"transparent\"\n          leading-icon=\"more-actions\"\n          ariaLabel=\"More actions\"\n        />\n      </template>\n\n      <div class=\"content-wrapper\">\n        <HistoryEventAuthor :author=\"version.author\" :avatar=\"version.avatar\" />\n\n        <KdsDescription\n          v-if=\"version.description\"\n          :text=\"version.description\"\n        />\n\n        <div class=\"labels-wrapper\">\n          <VersionLabel\n            v-for=\"label in version.labels\"\n            :key=\"label.labelId\"\n            :label=\"label\"\n          />\n        </div>\n\n        <HistoryEventFooter\n          :version=\"version.version\"\n          :date=\"version.createdOn\"\n        />\n      </div>\n    </KdsSelectableCard>\n  </HistoryEvent>\n</template>\n\n<style scoped>\n.content-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: var(--kds-spacing-container-0-37x);\n}\n\n.labels-wrapper {\n  display: flex;\n  flex-wrap: wrap;\n  gap: var(--kds-spacing-container-0-25x) var(--kds-spacing-container-0-5x);\n  align-items: center;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport {\n  KdsDescription,\n  type KdsMenuActionItem,\n  KdsMenuButton,\n  KdsSelectableCard,\n} from \"@knime/kds-components\";\n\nimport HistoryEvent from \"./HistoryEvent.vue\";\nimport HistoryEventAuthor from \"./HistoryEventAuthor.vue\";\nimport HistoryEventFooter from \"./HistoryEventFooter.vue\";\nimport VersionLabel from \"./VersionLabel.vue\";\nimport type {\n  NamedItemVersion,\n  RestoreOption,\n  WithAvatar,\n  WithLabels,\n} from \"./types\";\n\ntype Props = {\n  version: NamedItemVersion & WithAvatar & WithLabels;\n  isSelected: boolean;\n  hasAdminRights: boolean;\n  hasEditCapability: boolean;\n  isFirstItem: boolean;\n  isLastItem: boolean;\n  restoreOption?: RestoreOption;\n};\n\nconst props = defineProps<Props>();\n\nconst emit = defineEmits<{\n  select: [selectionStatus: boolean];\n  delete: [];\n  restore: [];\n}>();\n\nconst toggleVersionSelection = () => {\n  emit(\"select\", !props.isSelected);\n};\n\nconst menuItems = computed<KdsMenuActionItem[]>(() =>\n  [\n    props.hasEditCapability && {\n      id: \"show\",\n      text: props.isSelected ? \"Deselect this version\" : \"Show this version\",\n      handler: toggleVersionSelection,\n    },\n    props.hasEditCapability && {\n      id: \"restore\",\n      text: \"Restore this version\",\n      subText: props.restoreOption?.subText,\n      disabled: props.restoreOption?.disabled,\n      handler: () => emit(\"restore\"),\n    },\n    props.hasAdminRights && {\n      id: \"delete\",\n      text: \"Delete this version\",\n      handler: () => emit(\"delete\"),\n    },\n  ].filter((i) => i !== false),\n);\n</script>\n\n<template>\n  <HistoryEvent :is-selected :is-first-item :is-last-item>\n    <KdsSelectableCard\n      :model-value=\"isSelected\"\n      :headline=\"version.title\"\n      ariaLabel=\"Version history event\"\n      @update:model-value=\"toggleVersionSelection\"\n    >\n      <template v-if=\"menuItems.length\" #header-actions>\n        <KdsMenuButton\n          :items=\"menuItems\"\n          variant=\"transparent\"\n          leading-icon=\"more-actions\"\n          ariaLabel=\"More actions\"\n        />\n      </template>\n\n      <div class=\"content-wrapper\">\n        <HistoryEventAuthor :author=\"version.author\" :avatar=\"version.avatar\" />\n\n        <KdsDescription\n          v-if=\"version.description\"\n          :text=\"version.description\"\n        />\n\n        <div class=\"labels-wrapper\">\n          <VersionLabel\n            v-for=\"label in version.labels\"\n            :key=\"label.labelId\"\n            :label=\"label\"\n          />\n        </div>\n\n        <HistoryEventFooter\n          :version=\"version.version\"\n          :date=\"version.createdOn\"\n        />\n      </div>\n    </KdsSelectableCard>\n  </HistoryEvent>\n</template>\n\n<style scoped>\n.content-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: var(--kds-spacing-container-0-37x);\n}\n\n.labels-wrapper {\n  display: flex;\n  flex-wrap: wrap;\n  gap: var(--kds-spacing-container-0-25x) var(--kds-spacing-container-0-5x);\n  align-items: center;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport { KdsCard, KdsDescription, KdsLinkButton } from \"@knime/kds-components\";\n\nimport HistoryEvent from \"./HistoryEvent.vue\";\nimport type { VersionLimit } from \"./types\";\n\nconst {\n  versionLimit,\n  upgradeUrl = undefined,\n  isPrivate = false,\n} = defineProps<{\n  versionLimit: Required<VersionLimit>;\n  upgradeUrl?: string;\n  isPrivate?: boolean;\n}>();\n\nconst isLimitReached = computed(\n  () => versionLimit.currentUsage >= versionLimit.limit,\n);\n\nconst headline = computed(() => {\n  if (isLimitReached.value) {\n    return `You've reached the maximum of ${versionLimit.limit} versions.`;\n  } else {\n    return `Using ${versionLimit.currentUsage} of ${versionLimit.limit} versions.`;\n  }\n});\n</script>\n\n<template>\n  <HistoryEvent :is-selected=\"false\" :is-first-item=\"false\" is-last-item>\n    <KdsCard variant=\"filled\" :headline=\"headline\">\n      <template v-if=\"upgradeUrl\" #header-actions>\n        <KdsLinkButton label=\"Upgrade\" :to=\"upgradeUrl\" />\n      </template>\n\n      <div class=\"content-wrapper\">\n        <KdsDescription\n          :text=\"`Upgrade to use unlimited versions${isPrivate ? ' for private items.' : '.'}`\"\n        />\n      </div>\n    </KdsCard>\n  </HistoryEvent>\n</template>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport { KdsCard, KdsDescription, KdsLinkButton } from \"@knime/kds-components\";\n\nimport HistoryEvent from \"./HistoryEvent.vue\";\nimport type { VersionLimit } from \"./types\";\n\nconst {\n  versionLimit,\n  upgradeUrl = undefined,\n  isPrivate = false,\n} = defineProps<{\n  versionLimit: Required<VersionLimit>;\n  upgradeUrl?: string;\n  isPrivate?: boolean;\n}>();\n\nconst isLimitReached = computed(\n  () => versionLimit.currentUsage >= versionLimit.limit,\n);\n\nconst headline = computed(() => {\n  if (isLimitReached.value) {\n    return `You've reached the maximum of ${versionLimit.limit} versions.`;\n  } else {\n    return `Using ${versionLimit.currentUsage} of ${versionLimit.limit} versions.`;\n  }\n});\n</script>\n\n<template>\n  <HistoryEvent :is-selected=\"false\" :is-first-item=\"false\" is-last-item>\n    <KdsCard variant=\"filled\" :headline=\"headline\">\n      <template v-if=\"upgradeUrl\" #header-actions>\n        <KdsLinkButton label=\"Upgrade\" :to=\"upgradeUrl\" />\n      </template>\n\n      <div class=\"content-wrapper\">\n        <KdsDescription\n          :text=\"`Upgrade to use unlimited versions${isPrivate ? ' for private items.' : '.'}`\"\n        />\n      </div>\n    </KdsCard>\n  </HistoryEvent>\n</template>\n","export const VERSION_DEFAULT_LIMIT = 10;\nexport const CURRENT_STATE_VERSION = \"current-state\";\nexport const MOST_RECENT_VERSION = \"most-recent\";\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport {\n  KdsButton,\n  KdsPanel,\n  type KdsPanelHeadlineTrailingAction,\n} from \"@knime/kds-components\";\n\nimport CurrentState from \"./CurrentState.vue\";\nimport VersionItem from \"./VersionItem.vue\";\nimport VersionLimitInfo from \"./VersionLimitInfo.vue\";\nimport { CURRENT_STATE_VERSION } from \"./constants\";\nimport type { NamedItemVersion, VersionHistoryProps } from \"./types\";\n\nconst props = defineProps<VersionHistoryProps>();\n\nconst emit = defineEmits<{\n  close: [];\n  loadAll: [];\n  create: [];\n  delete: [version: NamedItemVersion[\"version\"]];\n  restore: [version: NamedItemVersion[\"version\"]];\n  select: [version: NamedItemVersion[\"version\"]];\n  discardCurrentState: [];\n}>();\n\nconst isVersionLimitExceeded = computed(() => {\n  return (\n    props.versionLimit?.limit !== undefined &&\n    props.versionLimit.currentUsage >= props.versionLimit.limit\n  );\n});\n\nconst headlineTrailingActions = computed<KdsPanelHeadlineTrailingAction[]>(\n  () => [\n    {\n      type: \"button\",\n      props: {\n        leadingIcon: \"x-close\",\n        ariaLabel: \"Close\",\n        variant: \"transparent\",\n      },\n      onClick: () => emit(\"close\"),\n    },\n  ],\n);\n</script>\n\n<template>\n  <KdsPanel\n    headline=\"Version history\"\n    :headline-trailing-actions=\"headlineTrailingActions\"\n  >\n    <div class=\"version-history-wrapper\">\n      <CurrentState\n        v-if=\"unversionedSavepoint\"\n        :current-savepoint=\"unversionedSavepoint\"\n        :is-selected=\"currentVersion === CURRENT_STATE_VERSION\"\n        :has-edit-capability=\"hasEditCapability\"\n        :has-previous-version=\"versionHistory.length > 0\"\n        :has-version-limit=\"versionLimit?.limit !== undefined\"\n        :is-version-limit-exceeded=\"isVersionLimitExceeded\"\n        @select=\"$emit('select', CURRENT_STATE_VERSION)\"\n        @create-version=\"$emit('create')\"\n        @discard=\"$emit('discardCurrentState')\"\n      />\n\n      <VersionItem\n        v-for=\"(historyEvent, index) in versionHistory\"\n        :key=\"historyEvent.version\"\n        :version=\"historyEvent\"\n        :is-selected=\"historyEvent.version === currentVersion\"\n        :has-admin-rights=\"hasAdminRights\"\n        :has-edit-capability=\"hasEditCapability\"\n        :is-first-item=\"!unversionedSavepoint && index === 0\"\n        :is-last-item=\"\n          index === versionHistory.length - 1 &&\n          versionLimit?.limit === undefined\n        \"\n        :restore-option\n        @delete=\"$emit('delete', historyEvent.version)\"\n        @restore=\"$emit('restore', historyEvent.version)\"\n        @select=\"\n          $emit('select', $event ? historyEvent.version : CURRENT_STATE_VERSION)\n        \"\n      />\n\n      <VersionLimitInfo\n        v-if=\"versionLimit?.limit !== undefined\"\n        class=\"version-limit-info\"\n        :version-limit=\"{\n          limit: versionLimit.limit,\n          currentUsage: versionLimit.currentUsage,\n        }\"\n        :upgrade-url\n        :is-private\n      />\n\n      <KdsButton\n        v-if=\"!hasLoadedAllVersions\"\n        variant=\"transparent\"\n        :disabled=\"loading\"\n        :label=\"loading ? 'Loading...' : 'Load all'\"\n        class=\"load-more-button\"\n        @click=\"$emit('loadAll')\"\n      />\n    </div>\n  </KdsPanel>\n</template>\n\n<style scoped>\n.version-history-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: var(--kds-spacing-container-0-75x);\n}\n\n.load-more-button {\n  margin: 0 auto;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport {\n  KdsButton,\n  KdsPanel,\n  type KdsPanelHeadlineTrailingAction,\n} from \"@knime/kds-components\";\n\nimport CurrentState from \"./CurrentState.vue\";\nimport VersionItem from \"./VersionItem.vue\";\nimport VersionLimitInfo from \"./VersionLimitInfo.vue\";\nimport { CURRENT_STATE_VERSION } from \"./constants\";\nimport type { NamedItemVersion, VersionHistoryProps } from \"./types\";\n\nconst props = defineProps<VersionHistoryProps>();\n\nconst emit = defineEmits<{\n  close: [];\n  loadAll: [];\n  create: [];\n  delete: [version: NamedItemVersion[\"version\"]];\n  restore: [version: NamedItemVersion[\"version\"]];\n  select: [version: NamedItemVersion[\"version\"]];\n  discardCurrentState: [];\n}>();\n\nconst isVersionLimitExceeded = computed(() => {\n  return (\n    props.versionLimit?.limit !== undefined &&\n    props.versionLimit.currentUsage >= props.versionLimit.limit\n  );\n});\n\nconst headlineTrailingActions = computed<KdsPanelHeadlineTrailingAction[]>(\n  () => [\n    {\n      type: \"button\",\n      props: {\n        leadingIcon: \"x-close\",\n        ariaLabel: \"Close\",\n        variant: \"transparent\",\n      },\n      onClick: () => emit(\"close\"),\n    },\n  ],\n);\n</script>\n\n<template>\n  <KdsPanel\n    headline=\"Version history\"\n    :headline-trailing-actions=\"headlineTrailingActions\"\n  >\n    <div class=\"version-history-wrapper\">\n      <CurrentState\n        v-if=\"unversionedSavepoint\"\n        :current-savepoint=\"unversionedSavepoint\"\n        :is-selected=\"currentVersion === CURRENT_STATE_VERSION\"\n        :has-edit-capability=\"hasEditCapability\"\n        :has-previous-version=\"versionHistory.length > 0\"\n        :has-version-limit=\"versionLimit?.limit !== undefined\"\n        :is-version-limit-exceeded=\"isVersionLimitExceeded\"\n        @select=\"$emit('select', CURRENT_STATE_VERSION)\"\n        @create-version=\"$emit('create')\"\n        @discard=\"$emit('discardCurrentState')\"\n      />\n\n      <VersionItem\n        v-for=\"(historyEvent, index) in versionHistory\"\n        :key=\"historyEvent.version\"\n        :version=\"historyEvent\"\n        :is-selected=\"historyEvent.version === currentVersion\"\n        :has-admin-rights=\"hasAdminRights\"\n        :has-edit-capability=\"hasEditCapability\"\n        :is-first-item=\"!unversionedSavepoint && index === 0\"\n        :is-last-item=\"\n          index === versionHistory.length - 1 &&\n          versionLimit?.limit === undefined\n        \"\n        :restore-option\n        @delete=\"$emit('delete', historyEvent.version)\"\n        @restore=\"$emit('restore', historyEvent.version)\"\n        @select=\"\n          $emit('select', $event ? historyEvent.version : CURRENT_STATE_VERSION)\n        \"\n      />\n\n      <VersionLimitInfo\n        v-if=\"versionLimit?.limit !== undefined\"\n        class=\"version-limit-info\"\n        :version-limit=\"{\n          limit: versionLimit.limit,\n          currentUsage: versionLimit.currentUsage,\n        }\"\n        :upgrade-url\n        :is-private\n      />\n\n      <KdsButton\n        v-if=\"!hasLoadedAllVersions\"\n        variant=\"transparent\"\n        :disabled=\"loading\"\n        :label=\"loading ? 'Loading...' : 'Load all'\"\n        class=\"load-more-button\"\n        @click=\"$emit('loadAll')\"\n      />\n    </div>\n  </KdsPanel>\n</template>\n\n<style scoped>\n.version-history-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: var(--kds-spacing-container-0-75x);\n}\n\n.load-more-button {\n  margin: 0 auto;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed, nextTick, ref } from \"vue\";\n\nimport {\n  KdsDescription,\n  KdsPanel,\n  type KdsPanelButtonAction,\n  type KdsPanelHeadlineTrailingAction,\n  KdsTextInput,\n  KdsTextarea,\n} from \"@knime/kds-components\";\n\nimport type { CreateVersionFormProps } from \"./types\";\n\nconst { isCreationPending = false } = defineProps<CreateVersionFormProps>();\n\nconst emit = defineEmits<{\n  create: [{ name: string; description: string }];\n  cancel: [hasUnsavedChanges: boolean];\n}>();\n\nconst versionName = ref(\"\");\nconst versionDescription = ref(\"\");\n\nconst doValidate = ref(false);\n\nconst isVersionNameInvalid = computed(() => {\n  return doValidate.value && versionName.value.trim().length <= 0;\n});\n\nconst hasUnsavedChanges = computed(() => {\n  return versionName.value !== \"\" || versionDescription.value !== \"\";\n});\n\nconst onCreate = async () => {\n  doValidate.value = true;\n  await nextTick();\n\n  if (!isVersionNameInvalid.value) {\n    emit(\"create\", {\n      name: versionName.value.trim(),\n      description: versionDescription.value,\n    });\n  }\n};\n\nconst headlineTrailingActions = computed<KdsPanelHeadlineTrailingAction[]>(\n  () => [\n    {\n      type: \"button\",\n      props: {\n        leadingIcon: \"x-close\",\n        ariaLabel: \"Close\",\n        variant: \"transparent\",\n      },\n      onClick: () => emit(\"cancel\", hasUnsavedChanges.value),\n    },\n  ],\n);\n\nconst footerLeadingActions = computed<KdsPanelButtonAction[]>(() => [\n  {\n    type: \"button\",\n    props: {\n      label: \"Cancel\",\n      variant: \"outlined\",\n    },\n    onClick: () => emit(\"cancel\", hasUnsavedChanges.value),\n  },\n]);\n\nconst footerTrailingActions = computed<KdsPanelButtonAction[]>(() => [\n  {\n    type: \"button\",\n    props: {\n      label: \"Create\",\n      variant: \"filled\",\n      disabled: isVersionNameInvalid.value || isCreationPending,\n    },\n    onClick: onCreate,\n  },\n]);\n</script>\n\n<template>\n  <KdsPanel\n    headline=\"Create version\"\n    :headline-trailing-actions=\"headlineTrailingActions\"\n    :footer-leading-actions=\"footerLeadingActions\"\n    :footer-trailing-actions=\"footerTrailingActions\"\n  >\n    <div class=\"create-version-form-wrapper\">\n      <KdsDescription\n        text=\"Give your version a name and description. Versions can be used to create a deployment.\"\n        class=\"create-version-form-description\"\n      />\n\n      <KdsTextInput\n        v-model=\"versionName\"\n        label=\"Version name\"\n        type=\"text\"\n        :error=\"isVersionNameInvalid\"\n        :sub-text=\"\n          isVersionNameInvalid\n            ? 'Please enter at least 1 character.'\n            : undefined\n        \"\n      />\n\n      <KdsTextarea\n        v-model=\"versionDescription\"\n        label=\"Description\"\n        class=\"description\"\n      />\n    </div>\n  </KdsPanel>\n</template>\n\n<style scoped>\n.create-version-form-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: var(--kds-spacing-container-1x);\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed, nextTick, ref } from \"vue\";\n\nimport {\n  KdsDescription,\n  KdsPanel,\n  type KdsPanelButtonAction,\n  type KdsPanelHeadlineTrailingAction,\n  KdsTextInput,\n  KdsTextarea,\n} from \"@knime/kds-components\";\n\nimport type { CreateVersionFormProps } from \"./types\";\n\nconst { isCreationPending = false } = defineProps<CreateVersionFormProps>();\n\nconst emit = defineEmits<{\n  create: [{ name: string; description: string }];\n  cancel: [hasUnsavedChanges: boolean];\n}>();\n\nconst versionName = ref(\"\");\nconst versionDescription = ref(\"\");\n\nconst doValidate = ref(false);\n\nconst isVersionNameInvalid = computed(() => {\n  return doValidate.value && versionName.value.trim().length <= 0;\n});\n\nconst hasUnsavedChanges = computed(() => {\n  return versionName.value !== \"\" || versionDescription.value !== \"\";\n});\n\nconst onCreate = async () => {\n  doValidate.value = true;\n  await nextTick();\n\n  if (!isVersionNameInvalid.value) {\n    emit(\"create\", {\n      name: versionName.value.trim(),\n      description: versionDescription.value,\n    });\n  }\n};\n\nconst headlineTrailingActions = computed<KdsPanelHeadlineTrailingAction[]>(\n  () => [\n    {\n      type: \"button\",\n      props: {\n        leadingIcon: \"x-close\",\n        ariaLabel: \"Close\",\n        variant: \"transparent\",\n      },\n      onClick: () => emit(\"cancel\", hasUnsavedChanges.value),\n    },\n  ],\n);\n\nconst footerLeadingActions = computed<KdsPanelButtonAction[]>(() => [\n  {\n    type: \"button\",\n    props: {\n      label: \"Cancel\",\n      variant: \"outlined\",\n    },\n    onClick: () => emit(\"cancel\", hasUnsavedChanges.value),\n  },\n]);\n\nconst footerTrailingActions = computed<KdsPanelButtonAction[]>(() => [\n  {\n    type: \"button\",\n    props: {\n      label: \"Create\",\n      variant: \"filled\",\n      disabled: isVersionNameInvalid.value || isCreationPending,\n    },\n    onClick: onCreate,\n  },\n]);\n</script>\n\n<template>\n  <KdsPanel\n    headline=\"Create version\"\n    :headline-trailing-actions=\"headlineTrailingActions\"\n    :footer-leading-actions=\"footerLeadingActions\"\n    :footer-trailing-actions=\"footerTrailingActions\"\n  >\n    <div class=\"create-version-form-wrapper\">\n      <KdsDescription\n        text=\"Give your version a name and description. Versions can be used to create a deployment.\"\n        class=\"create-version-form-description\"\n      />\n\n      <KdsTextInput\n        v-model=\"versionName\"\n        label=\"Version name\"\n        type=\"text\"\n        :error=\"isVersionNameInvalid\"\n        :sub-text=\"\n          isVersionNameInvalid\n            ? 'Please enter at least 1 character.'\n            : undefined\n        \"\n      />\n\n      <KdsTextarea\n        v-model=\"versionDescription\"\n        label=\"Description\"\n        class=\"description\"\n      />\n    </div>\n  </KdsPanel>\n</template>\n\n<style scoped>\n.create-version-form-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: var(--kds-spacing-container-1x);\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;uBAaE,mBAcM,OAdN,cAcM,CAbJ,mBAQM,OARN,cAQM;KAPQ,QAAA,eAAA,UAAA,GAAZ,mBAA0D,OAA1D,UAA0D,KAAA,mBAAA,IAAA,IAAA;IAC1D,YAIE,MAAA,OAAA,GAAA;KAHA,OAAM;KACL,MAAM,QAAA,aAAU,mBAAA;KACjB,MAAK;;KAEK,QAAA,cAAA,UAAA,GAAZ,mBAA4D,OAA5D,UAA4D,KAAA,mBAAA,IAAA,IAAA;OAG9D,mBAEM,OAFN,YAEM,CADJ,WAAQ,KAAA,QAAA,WAAA,CAAA,GAAA,KAAA,GAAA,IAAA,CAAA,CAAA,CAAA,CAAA;;;;;;;;;;;;;;;;;;uBEZZ,mBAGM,OAHN,cAGM,CAFJ,YAA6B,MAAA,SAAA,GAAA,eAAA,mBAAV,QAAA,MAAM,CAAA,GAAA,MAAA,EAAA,GACzB,mBAA6C,QAA7C,cAA6C,gBAAhB,QAAA,MAAM,GAAA,CAAA,CAAA,CAAA;;;;;;;;;;;;;;;;;EEEvC,MAAM,YAAY,IAAI,KAAK;EAC3B,MAAM,gBAAgB,eACpB,UAAU,QACN,0BAA0B,QAAA,MAAM,IAAI,IACpC,qBAAqB,QAAA,MAAM,IAAI,CACrC;EAEA,gBAAgB;GACd,UAAU,QAAQ;EACpB,CAAC;;uBAIC,mBASO,QATP,cASO;8CAT4B,gBAEjC,EAAA;iCAAA,mBAKC,QAAA;KAHE,UAAU,QAAA;KACV,OAAK,eAAA,EAAA,QAAA,CAAa,UAAA,MAAS,CAAA;wCACxB,cAAA,KAAa,GAAA,CAAA,CAAA,GAAA,IAAA,YAAA,IAAA,CAAA,CAAA,MAAA,WAAA,GAHF,QAAA,IAAI,CAAA,CAAA;IAKL,QAAA,WAAA,UAAA,GAAhB,mBAA2D,UAAA,EAAA,KAAA,EAAA,GAAA,CAAA,gBAAlC,eAAU,gBAAG,QAAA,OAAO,GAAA,CAAA,CAAA,GAAA,EAAA,KAAA,mBAAA,IAAA,IAAA;;;;;;;;;;;;;;;;;;;;;;;;;;EEdjD,MAAM,QAAQ;EAEd,MAAM,OAAO;EAMb,MAAM,YAAY,eAChB,MAAM,qBAAqB,MAAM,qBAC7B,CACE;GACE,IAAI;GACJ,MAAM;GACN,eAAe,KAAK,SAAS;EAC/B,CACF,IACA,CAAC,CACP;;uBAIE,YAmCe,sBAAA;IAlCZ,eAAA,QAAA;IACD,iBAAA;IACC,gBAAY,CAAG,QAAA,sBAAkB,CAAK,QAAA;;2BAyBnB,CAvBpB,YAuBoB,MAAA,iBAAA,GAAA;KAtBjB,eAAa,QAAA;KACd,UAAS;KACT,WAAU;KACT,uBAAkB,OAAA,OAAA,OAAA,MAAA,WAAA,CAAG,QAAA,cAAcA,KAAAA,MAAK,QAAA;;4BAkBnC,CAPN,mBAOM,OAPN,cAOM,CANJ,YAGE,4BAAA;MAFC,QAAQ,QAAA,iBAAiB;MACzB,QAAQ,QAAA,iBAAiB;wCAG5B,YAA4D,4BAAA,EAAvC,MAAM,QAAA,iBAAiB,aAAA,GAAA,MAAA,GAAA,CAAA,MAAA,CAAA,CAAA,CAAA,CAAA,CAAA;;QAf9B,UAAA,MAAU,SAAA;WAAS;uBAM/B,CALF,YAKE,MAAA,aAAA,GAAA;MAJC,OAAO,UAAA;MACR,SAAQ;MACR,gBAAa;MACb,WAAU;;;0CAeR,QAAA,qBAAiB,CAAK,QAAA,0BAAA,UAAA,GAD9B,YAIE,MAAA,SAAA,GAAA;;KAFA,OAAM;KACL,SAAK,OAAA,OAAA,OAAA,KAAA,eAAA,WAAOA,KAAAA,MAAK,eAAA,GAAA,CAAA,MAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;EE7DxB,MAAM,gBAAgB,SAAoB,SAAA,YAAmB;EAC7D,MAAM,YAAY,eAAiC,SAAS;;2DAI1D,YASE,MAAA,eAAA,GAAA;gBARS,cAAA;+EAAa,QAAA;IACtB,kCAAA;IACC,OAAO,QAAA,MAAM,MAAM;IACpB,iBAAc;IACb,iBAAe,cAAA;IACf,iBAAe,UAAA,OAAW;IAC3B,MAAK;IACJ,OAAK,eAAE,UAAA,OAAW,WAAW;;;;;;;OAGhC,YAYa,MAAA,UAAA,GAAA;IAXX,KAAI;gBACK,cAAA;+EAAa,QAAA;IACtB,WAAU;IACV,MAAK;IACL,cAAW;;2BAML,CAJN,mBAIM,OAJN,cAIM;KAHJ,mBAAqD,OAArD,cAAqD,gBAAzB,QAAA,MAAM,MAAM,IAAI,GAAA,CAAA;KAC5C,YAAkD,MAAA,cAAA,GAAA,EAAjC,MAAM,QAAA,MAAM,MAAM,YAAA,GAAA,MAAA,GAAA,CAAA,MAAA,CAAA;KACb,QAAA,MAAM,WAAA,UAAA,GAA5B,YAA6D,MAAA,cAAA,GAAA;;MAAvB,MAAM,QAAA,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EEbxD,MAAM,QAAQ;EAEd,MAAM,OAAO;EAMb,MAAM,+BAA+B;GACnC,KAAK,UAAU,CAAC,MAAM,UAAU;EAClC;EAEA,MAAM,YAAY,eAChB;GACE,MAAM,qBAAqB;IACzB,IAAI;IACJ,MAAM,MAAM,aAAa,0BAA0B;IACnD,SAAS;GACX;GACA,MAAM,qBAAqB;IACzB,IAAI;IACJ,MAAM;IACN,SAAS,MAAM,eAAe;IAC9B,UAAU,MAAM,eAAe;IAC/B,eAAe,KAAK,SAAS;GAC/B;GACA,MAAM,kBAAkB;IACtB,IAAI;IACJ,MAAM;IACN,eAAe,KAAK,QAAQ;GAC9B;EACF,CAAC,CAAC,QAAQ,MAAM,MAAM,KAAK,CAC7B;;uBAIE,YAsCe,sBAAA;IAtCA,eAAA,QAAA;IAAa,iBAAA,QAAA;IAAe,gBAAA,QAAA;;2BAqCrB,CApCpB,YAoCoB,MAAA,iBAAA,GAAA;KAnCjB,eAAa,QAAA;KACb,UAAU,QAAA,QAAQ;KACnB,WAAU;KACT,uBAAoB;;4BA+Bf,CApBN,mBAoBM,OApBN,cAoBM;MAnBJ,YAAwE,4BAAA;OAAnD,QAAQ,QAAA,QAAQ;OAAS,QAAQ,QAAA,QAAQ;;MAGtD,QAAA,QAAQ,eAAA,UAAA,GADhB,YAGE,MAAA,cAAA,GAAA;;OADC,MAAM,QAAA,QAAQ;;MAGjB,mBAMM,OANN,YAMM,EAAA,UAAA,IAAA,GALJ,mBAIE,UAAA,MAAA,WAHgB,QAAA,QAAQ,SAAjB,UAAK;2BADd,YAIE,sBAAA;QAFC,KAAK,MAAM;QACJ;;;MAIZ,YAGE,4BAAA;OAFC,SAAS,QAAA,QAAQ;OACjB,MAAM,QAAA,QAAQ;;;;QA3BH,UAAA,MAAU,SAAA;WAAS;uBAM/B,CALF,YAKE,MAAA,aAAA,GAAA;MAJC,OAAO,UAAA;MACR,SAAQ;MACR,gBAAa;MACb,WAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EE7DpB,MAAM,iBAAiB,eACf,QAAA,aAAa,gBAAgB,QAAA,aAAa,KAClD;EAEA,MAAM,WAAW,eAAe;GAC9B,IAAI,eAAe,OACjB,OAAO,iCAAiC,QAAA,aAAa,MAAM;QAE3D,OAAO,SAAS,QAAA,aAAa,aAAa,MAAM,QAAA,aAAa,MAAM;EAEvE,CAAC;;uBAIC,YAYe,sBAAA;IAZA,eAAa;IAAQ,iBAAe;IAAO,gBAAA;;2BAW9C,CAVV,YAUU,MAAA,OAAA,GAAA;KAVD,SAAQ;KAAU,UAAU,SAAA;;4BAS7B,CAJN,mBAIM,OAJN,cAIM,CAHJ,YAEE,MAAA,cAAA,GAAA,EADC,MAAI,oCAAsC,QAAA,YAAS,wBAAA,MAAA,GAAA,MAAA,GAAA,CAAA,MAAA,CAAA,CAAA,CAAA,CAAA,CAAA;;QANxC,QAAA,aAAA;WAAa;uBACuB,CAAlD,YAAkD,MAAA,aAAA,GAAA;MAAnC,OAAM;MAAW,IAAI,QAAA;;;;;;;;;;;AEnC5C,IAAa,wBAAwB;AACrC,IAAa,wBAAwB;AACrC,IAAa,sBAAsB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ECanC,MAAM,QAAQ;EAEd,MAAM,OAAO;EAUb,MAAM,yBAAyB,eAAe;GAC5C,OACE,MAAM,cAAc,UAAU,KAAA,KAC9B,MAAM,aAAa,gBAAgB,MAAM,aAAa;EAE1D,CAAC;EAED,MAAM,0BAA0B,eACxB,CACJ;GACE,MAAM;GACN,OAAO;IACL,aAAa;IACb,WAAW;IACX,SAAS;GACX;GACA,eAAe,KAAK,OAAO;EAC7B,CACF,CACF;;uBAIE,YA0DW,MAAA,QAAA,GAAA;IAzDT,UAAS;IACR,6BAA2B,wBAAA;;2BAuDtB,CArDN,mBAqDM,OArDN,cAqDM;KAnDI,QAAA,wBAAA,UAAA,GADR,YAWE,sBAAA;;MATC,qBAAmB,QAAA;MACnB,eAAa,QAAA,mBAAmB,MAAA,qBAAA;MAChC,uBAAqB,QAAA;MACrB,wBAAsB,QAAA,eAAe,SAAM;MAC3C,qBAAmB,QAAA,cAAc,UAAU,KAAA;MAC3C,6BAA2B,uBAAA;MAC3B,UAAM,OAAA,OAAA,OAAA,MAAA,WAAEC,KAAAA,MAAK,UAAW,MAAA,eAAA,CAAqB;MAC7C,iBAAc,OAAA,OAAA,OAAA,MAAA,WAAEA,KAAAA,MAAK,QAAA;MACrB,WAAO,OAAA,OAAA,OAAA,MAAA,WAAEA,KAAAA,MAAK,qBAAA;;;;;;;;;uBAGjB,mBAkBE,UAAA,MAAA,WAjBgC,QAAA,iBAAxB,cAAc,UAAK;0BAD7B,YAkBE,qBAAA;OAhBC,KAAK,aAAa;OAClB,SAAS;OACT,eAAa,aAAa,YAAY,QAAA;OACtC,oBAAkB,QAAA;OAClB,uBAAqB,QAAA;OACrB,iBAAa,CAAG,QAAA,wBAAwB,UAAK;OAC7C,gBAAyB,UAAU,QAAA,eAAe,SAAM,KAAkB,QAAA,cAAc,UAAU,KAAA;OAIlG,kBAAA,QAAA;OACA,WAAM,WAAEA,KAAAA,MAAK,UAAW,aAAa,OAAO;OAC5C,YAAO,WAAEA,KAAAA,MAAK,WAAY,aAAa,OAAO;OAC9C,WAAM,WAAaA,KAAAA,MAAK,UAAW,SAAS,aAAa,UAAU,MAAA,qBAAA,CAAqB;;;;;;;;;;;;;;KAMnF,QAAA,cAAc,UAAU,KAAA,KAAA,UAAA,GADhC,YASE,0BAAA;;MAPA,OAAM;MACL,iBAAa;cAAqB,QAAA,aAAa;qBAA+B,QAAA,aAAa;;MAI3F,eAAA,QAAA;MACA,cAAA,QAAA;;;;;;MAIM,QAAA,wBAAA,UAAA,GADT,YAOE,MAAA,SAAA,GAAA;;MALA,SAAQ;MACP,UAAU,QAAA;MACV,OAAO,QAAA,UAAO,eAAA;MACf,OAAM;MACL,SAAK,OAAA,OAAA,OAAA,MAAA,WAAEA,KAAAA,MAAK,SAAA;;;;;;;;;;;;;;;;;;;;;EEzFrB,MAAM,OAAO;EAKb,MAAM,cAAc,IAAI,EAAE;EAC1B,MAAM,qBAAqB,IAAI,EAAE;EAEjC,MAAM,aAAa,IAAI,KAAK;EAE5B,MAAM,uBAAuB,eAAe;GAC1C,OAAO,WAAW,SAAS,YAAY,MAAM,KAAK,CAAC,CAAC,UAAU;EAChE,CAAC;EAED,MAAM,oBAAoB,eAAe;GACvC,OAAO,YAAY,UAAU,MAAM,mBAAmB,UAAU;EAClE,CAAC;EAED,MAAM,WAAW,YAAY;GAC3B,WAAW,QAAQ;GACnB,MAAM,SAAS;GAEf,IAAI,CAAC,qBAAqB,OACxB,KAAK,UAAU;IACb,MAAM,YAAY,MAAM,KAAK;IAC7B,aAAa,mBAAmB;GAClC,CAAC;EAEL;EAEA,MAAM,0BAA0B,eACxB,CACJ;GACE,MAAM;GACN,OAAO;IACL,aAAa;IACb,WAAW;IACX,SAAS;GACX;GACA,eAAe,KAAK,UAAU,kBAAkB,KAAK;EACvD,CACF,CACF;EAEA,MAAM,uBAAuB,eAAuC,CAClE;GACE,MAAM;GACN,OAAO;IACL,OAAO;IACP,SAAS;GACX;GACA,eAAe,KAAK,UAAU,kBAAkB,KAAK;EACvD,CACF,CAAC;EAED,MAAM,wBAAwB,eAAuC,CACnE;GACE,MAAM;GACN,OAAO;IACL,OAAO;IACP,SAAS;IACT,UAAU,qBAAqB,SAAS,QAAA;GAC1C;GACA,SAAS;EACX,CACF,CAAC;;uBAIC,YA8BW,MAAA,QAAA,GAAA;IA7BT,UAAS;IACR,6BAA2B,wBAAA;IAC3B,0BAAwB,qBAAA;IACxB,2BAAyB,sBAAA;;2BAyBpB,CAvBN,mBAuBM,OAvBN,YAuBM;KAtBJ,YAGE,MAAA,cAAA,GAAA;MAFA,MAAK;MACL,OAAM;;KAGR,YAUE,MAAA,YAAA,GAAA;kBATS,YAAA;+EAAW,QAAA;MACpB,OAAM;MACN,MAAK;MACJ,OAAO,qBAAA;MACP,YAAqB,qBAAA,QAAA,uCAAsF,KAAA;;;;;;KAO9G,YAIE,MAAA,WAAA,GAAA;kBAHS,mBAAA;sFAAkB,QAAA;MAC3B,OAAM;MACN,OAAM"}
+{"version":3,"file":"versions.js","names":["$emit","$emit"],"sources":["../src/versions/VersionHistory/HistoryEvent.vue","../src/versions/VersionHistory/HistoryEvent.vue","../src/versions/VersionHistory/HistoryEventAuthor.vue","../src/versions/VersionHistory/HistoryEventAuthor.vue","../src/versions/VersionHistory/HistoryEventFooter.vue","../src/versions/VersionHistory/HistoryEventFooter.vue","../src/versions/VersionHistory/CurrentState.vue","../src/versions/VersionHistory/CurrentState.vue","../src/versions/VersionHistory/VersionLabel.vue","../src/versions/VersionHistory/VersionLabel.vue","../src/versions/VersionHistory/VersionItem.vue","../src/versions/VersionHistory/VersionItem.vue","../src/versions/VersionHistory/VersionLimitInfo.vue","../src/versions/VersionHistory/VersionLimitInfo.vue","../src/versions/VersionHistory/constants.ts","../src/versions/VersionHistory/VersionHistory.vue","../src/versions/VersionHistory/VersionHistory.vue","../src/versions/CreateVersionForm/CreateVersionForm.vue","../src/versions/CreateVersionForm/CreateVersionForm.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { KdsIcon } from \"@knime/kds-components\";\n\ntype Props = {\n  isSelected: boolean;\n  isFirstItem: boolean;\n  isLastItem: boolean;\n};\n\ndefineProps<Props>();\n</script>\n\n<template>\n  <div class=\"history-event-wrapper\">\n    <div class=\"history-event-decorator\">\n      <div v-if=\"!isFirstItem\" class=\"history-event-line-top\" />\n      <KdsIcon\n        class=\"history-event-icon\"\n        :name=\"isSelected ? 'circle-success' : 'circle-unchecked'\"\n        size=\"small\"\n      />\n      <div v-if=\"!isLastItem\" class=\"history-event-line-bottom\" />\n    </div>\n\n    <div class=\"card-wrapper\">\n      <slot />\n    </div>\n  </div>\n</template>\n\n<style scoped>\n.history-event-wrapper {\n  display: flex;\n}\n\n.history-event-decorator {\n  position: relative;\n  display: flex;\n  flex-shrink: 0;\n  justify-content: center;\n  width: var(--kds-dimension-component-width-0-75x);\n  margin: 0 var(--kds-spacing-container-0-75x);\n}\n\n.history-event-line-top {\n  position: absolute;\n  top: calc(var(--kds-spacing-container-0-37x) * -1);\n  height: calc(\n    var(--kds-spacing-container-1x) + var(--kds-spacing-container-0-37x)\n  );\n  border-left: var(--kds-border-base-subtle);\n}\n\n.history-event-line-bottom {\n  position: absolute;\n  top: calc(\n    var(--kds-spacing-container-1x) + var(--kds-spacing-container-0-37x) +\n      var(--kds-spacing-container-0-37x)\n  );\n  bottom: calc(var(--kds-spacing-container-0-37x) * -1);\n  border-left: var(--kds-border-base-subtle);\n}\n\n.history-event-icon {\n  position: absolute;\n  top: var(--kds-spacing-container-1x);\n}\n\n.card-wrapper {\n  display: flex;\n  flex-grow: 1;\n  flex-direction: column;\n  gap: var(--kds-spacing-container-0-37x);\n  min-width: 0;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { KdsIcon } from \"@knime/kds-components\";\n\ntype Props = {\n  isSelected: boolean;\n  isFirstItem: boolean;\n  isLastItem: boolean;\n};\n\ndefineProps<Props>();\n</script>\n\n<template>\n  <div class=\"history-event-wrapper\">\n    <div class=\"history-event-decorator\">\n      <div v-if=\"!isFirstItem\" class=\"history-event-line-top\" />\n      <KdsIcon\n        class=\"history-event-icon\"\n        :name=\"isSelected ? 'circle-success' : 'circle-unchecked'\"\n        size=\"small\"\n      />\n      <div v-if=\"!isLastItem\" class=\"history-event-line-bottom\" />\n    </div>\n\n    <div class=\"card-wrapper\">\n      <slot />\n    </div>\n  </div>\n</template>\n\n<style scoped>\n.history-event-wrapper {\n  display: flex;\n}\n\n.history-event-decorator {\n  position: relative;\n  display: flex;\n  flex-shrink: 0;\n  justify-content: center;\n  width: var(--kds-dimension-component-width-0-75x);\n  margin: 0 var(--kds-spacing-container-0-75x);\n}\n\n.history-event-line-top {\n  position: absolute;\n  top: calc(var(--kds-spacing-container-0-37x) * -1);\n  height: calc(\n    var(--kds-spacing-container-1x) + var(--kds-spacing-container-0-37x)\n  );\n  border-left: var(--kds-border-base-subtle);\n}\n\n.history-event-line-bottom {\n  position: absolute;\n  top: calc(\n    var(--kds-spacing-container-1x) + var(--kds-spacing-container-0-37x) +\n      var(--kds-spacing-container-0-37x)\n  );\n  bottom: calc(var(--kds-spacing-container-0-37x) * -1);\n  border-left: var(--kds-border-base-subtle);\n}\n\n.history-event-icon {\n  position: absolute;\n  top: var(--kds-spacing-container-1x);\n}\n\n.card-wrapper {\n  display: flex;\n  flex-grow: 1;\n  flex-direction: column;\n  gap: var(--kds-spacing-container-0-37x);\n  min-width: 0;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { KdsAvatar } from \"@knime/kds-components\";\n\nimport type { WithAvatar } from \"./types\";\n\ntype Props = WithAvatar & {\n  author: string;\n};\n\ndefineProps<Props>();\n</script>\n\n<template>\n  <div class=\"avatar-and-name-wrapper\">\n    <KdsAvatar v-bind=\"avatar\" />\n    <span class=\"author-name\">{{ author }}</span>\n  </div>\n</template>\n\n<style scoped>\n.avatar-and-name-wrapper {\n  display: flex;\n  gap: var(--kds-spacing-container-0-25x);\n  align-items: center;\n}\n\n.author-name {\n  font: var(--kds-font-base-subtext-small);\n  color: var(--kds-color-text-and-icon-neutral);\n}\n</style>\n","<script setup lang=\"ts\">\nimport { KdsAvatar } from \"@knime/kds-components\";\n\nimport type { WithAvatar } from \"./types\";\n\ntype Props = WithAvatar & {\n  author: string;\n};\n\ndefineProps<Props>();\n</script>\n\n<template>\n  <div class=\"avatar-and-name-wrapper\">\n    <KdsAvatar v-bind=\"avatar\" />\n    <span class=\"author-name\">{{ author }}</span>\n  </div>\n</template>\n\n<style scoped>\n.avatar-and-name-wrapper {\n  display: flex;\n  gap: var(--kds-spacing-container-0-25x);\n  align-items: center;\n}\n\n.author-name {\n  font: var(--kds-font-base-subtext-small);\n  color: var(--kds-color-text-and-icon-neutral);\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed, onMounted, ref } from \"vue\";\n\nimport { vKdsTooltip } from \"@knime/kds-components\";\nimport { formatDateTimeString, formatLocalDateTimeString } from \"@knime/utils\";\n\nimport type { NamedItemVersion } from \"./types\";\n\ntype Props = {\n  date: string;\n  version?: NamedItemVersion[\"version\"];\n};\n\nconst { version, date } = defineProps<Props>();\n\n// Render the hidden non-local format on the server / first paint to reserve the\n// space and avoid content jumping once the localized value swaps in after mount\nconst isMounted = ref(false);\nconst localDateTime = computed(() =>\n  isMounted.value\n    ? formatLocalDateTimeString(date, true)\n    : formatDateTimeString(date, true),\n);\n\nonMounted(() => {\n  isMounted.value = true;\n});\n</script>\n\n<template>\n  <span class=\"history-event-footer\">\n    Created on\n    <time\n      v-kds-tooltip=\"date\"\n      :datetime=\"date\"\n      :class=\"{ hidden: !isMounted }\"\n      >{{ localDateTime }}</time\n    >\n    <template v-if=\"version\">– Version {{ version }}</template>\n  </span>\n</template>\n\n<style scoped>\n.history-event-footer {\n  font: var(--kds-font-base-subtext-small);\n  color: var(--kds-color-text-and-icon-subtle);\n}\n\n.hidden {\n  visibility: hidden;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed, onMounted, ref } from \"vue\";\n\nimport { vKdsTooltip } from \"@knime/kds-components\";\nimport { formatDateTimeString, formatLocalDateTimeString } from \"@knime/utils\";\n\nimport type { NamedItemVersion } from \"./types\";\n\ntype Props = {\n  date: string;\n  version?: NamedItemVersion[\"version\"];\n};\n\nconst { version, date } = defineProps<Props>();\n\n// Render the hidden non-local format on the server / first paint to reserve the\n// space and avoid content jumping once the localized value swaps in after mount\nconst isMounted = ref(false);\nconst localDateTime = computed(() =>\n  isMounted.value\n    ? formatLocalDateTimeString(date, true)\n    : formatDateTimeString(date, true),\n);\n\nonMounted(() => {\n  isMounted.value = true;\n});\n</script>\n\n<template>\n  <span class=\"history-event-footer\">\n    Created on\n    <time\n      v-kds-tooltip=\"date\"\n      :datetime=\"date\"\n      :class=\"{ hidden: !isMounted }\"\n      >{{ localDateTime }}</time\n    >\n    <template v-if=\"version\">– Version {{ version }}</template>\n  </span>\n</template>\n\n<style scoped>\n.history-event-footer {\n  font: var(--kds-font-base-subtext-small);\n  color: var(--kds-color-text-and-icon-subtle);\n}\n\n.hidden {\n  visibility: hidden;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport {\n  KdsButton,\n  type KdsMenuActionItem,\n  KdsMenuButton,\n  KdsSelectableCard,\n} from \"@knime/kds-components\";\n\nimport HistoryEvent from \"./HistoryEvent.vue\";\nimport HistoryEventAuthor from \"./HistoryEventAuthor.vue\";\nimport HistoryEventFooter from \"./HistoryEventFooter.vue\";\nimport type { ItemSavepoint, WithAvatar, WithLabels } from \"./types\";\n\ntype Props = {\n  currentSavepoint: ItemSavepoint & WithAvatar & WithLabels;\n  isSelected: boolean;\n  hasEditCapability: boolean;\n  hasPreviousVersion: boolean;\n  hasVersionLimit: boolean;\n  isVersionLimitExceeded?: boolean;\n};\n\nconst props = defineProps<Props>();\n\nconst emit = defineEmits<{\n  createVersion: [];\n  discard: [];\n  select: [];\n}>();\n\nconst menuItems = computed<KdsMenuActionItem[]>(() =>\n  props.hasEditCapability && props.hasPreviousVersion\n    ? [\n        {\n          id: \"discard\",\n          text: \"Discard\",\n          handler: () => emit(\"discard\"),\n        },\n      ]\n    : [],\n);\n</script>\n\n<template>\n  <HistoryEvent\n    :is-selected\n    is-first-item\n    :is-last-item=\"!hasPreviousVersion && !hasVersionLimit\"\n  >\n    <KdsSelectableCard\n      :model-value=\"isSelected\"\n      headline=\"Draft\"\n      ariaLabel=\"Savepoint history event\"\n      @update:model-value=\"!isSelected && $emit('select')\"\n    >\n      <template v-if=\"menuItems.length\" #header-actions>\n        <KdsMenuButton\n          :items=\"menuItems\"\n          variant=\"transparent\"\n          leading-icon=\"more-actions\"\n          ariaLabel=\"More actions\"\n        />\n      </template>\n\n      <div class=\"content-wrapper\">\n        <HistoryEventAuthor\n          :author=\"currentSavepoint.author\"\n          :avatar=\"currentSavepoint.avatar\"\n        />\n\n        <HistoryEventFooter :date=\"currentSavepoint.lastEditedOn\" />\n      </div>\n    </KdsSelectableCard>\n\n    <KdsButton\n      v-if=\"hasEditCapability && !isVersionLimitExceeded\"\n      label=\"Create version\"\n      @click.stop=\"$emit('createVersion')\"\n    />\n  </HistoryEvent>\n</template>\n\n<style scoped>\n.content-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: var(--kds-spacing-container-0-37x);\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport {\n  KdsButton,\n  type KdsMenuActionItem,\n  KdsMenuButton,\n  KdsSelectableCard,\n} from \"@knime/kds-components\";\n\nimport HistoryEvent from \"./HistoryEvent.vue\";\nimport HistoryEventAuthor from \"./HistoryEventAuthor.vue\";\nimport HistoryEventFooter from \"./HistoryEventFooter.vue\";\nimport type { ItemSavepoint, WithAvatar, WithLabels } from \"./types\";\n\ntype Props = {\n  currentSavepoint: ItemSavepoint & WithAvatar & WithLabels;\n  isSelected: boolean;\n  hasEditCapability: boolean;\n  hasPreviousVersion: boolean;\n  hasVersionLimit: boolean;\n  isVersionLimitExceeded?: boolean;\n};\n\nconst props = defineProps<Props>();\n\nconst emit = defineEmits<{\n  createVersion: [];\n  discard: [];\n  select: [];\n}>();\n\nconst menuItems = computed<KdsMenuActionItem[]>(() =>\n  props.hasEditCapability && props.hasPreviousVersion\n    ? [\n        {\n          id: \"discard\",\n          text: \"Discard\",\n          handler: () => emit(\"discard\"),\n        },\n      ]\n    : [],\n);\n</script>\n\n<template>\n  <HistoryEvent\n    :is-selected\n    is-first-item\n    :is-last-item=\"!hasPreviousVersion && !hasVersionLimit\"\n  >\n    <KdsSelectableCard\n      :model-value=\"isSelected\"\n      headline=\"Draft\"\n      ariaLabel=\"Savepoint history event\"\n      @update:model-value=\"!isSelected && $emit('select')\"\n    >\n      <template v-if=\"menuItems.length\" #header-actions>\n        <KdsMenuButton\n          :items=\"menuItems\"\n          variant=\"transparent\"\n          leading-icon=\"more-actions\"\n          ariaLabel=\"More actions\"\n        />\n      </template>\n\n      <div class=\"content-wrapper\">\n        <HistoryEventAuthor\n          :author=\"currentSavepoint.author\"\n          :avatar=\"currentSavepoint.avatar\"\n        />\n\n        <HistoryEventFooter :date=\"currentSavepoint.lastEditedOn\" />\n      </div>\n    </KdsSelectableCard>\n\n    <KdsButton\n      v-if=\"hasEditCapability && !isVersionLimitExceeded\"\n      label=\"Create version\"\n      @click.stop=\"$emit('createVersion')\"\n    />\n  </HistoryEvent>\n</template>\n\n<style scoped>\n.content-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: var(--kds-spacing-container-0-37x);\n}\n</style>\n","<script setup lang=\"ts\">\nimport { useTemplateRef } from \"vue\";\n\nimport {\n  KdsDescription,\n  KdsPopover,\n  type KdsPopoverExpose,\n  KdsToggleButton,\n} from \"@knime/kds-components\";\n\nimport type { AssignedLabel } from \"./types\";\n\ntype Props = {\n  label: AssignedLabel;\n};\n\ndefineProps<Props>();\n\nconst isPopoverOpen = defineModel<boolean>({ default: false });\nconst popoverEl = useTemplateRef<KdsPopoverExpose>(\"popover\");\nconst toggleButtonEl = useTemplateRef(\"toggleButton\");\n</script>\n\n<template>\n  <KdsToggleButton\n    ref=\"toggleButton\"\n    v-model=\"isPopoverOpen\"\n    data-kds-card-secondary-action\n    :label=\"label.label.name\"\n    aria-haspopup=\"dialog\"\n    :aria-expanded=\"isPopoverOpen\"\n    :aria-controls=\"popoverEl?.popoverId\"\n    size=\"xsmall\"\n  />\n\n  <KdsPopover\n    ref=\"popover\"\n    v-model=\"isPopoverOpen\"\n    :anchor=\"toggleButtonEl?.$el\"\n    placement=\"bottom-left\"\n    role=\"dialog\"\n    aria-label=\"Label details\"\n  >\n    <div class=\"label-popover-container\">\n      <div class=\"label-title\">{{ label.label.name }}</div>\n      <KdsDescription :text=\"label.label.description\" />\n      <KdsDescription v-if=\"label.message\" :text=\"label.message\" />\n    </div>\n  </KdsPopover>\n</template>\n\n<style scoped>\n.label-popover-container {\n  display: flex;\n  flex-direction: column;\n  gap: var(--kds-spacing-container-0-5x);\n  align-items: flex-start;\n  max-width: var(--kds-dimension-component-width-20x);\n  max-height: var(--kds-dimension-component-height-20x);\n  padding: var(--kds-spacing-container-0-75x) var(--kds-spacing-container-1x);\n  overflow-y: auto;\n  background-color: var(--kds-color-surface-default);\n  border-radius: var(--kds-border-radius-container-0-50x);\n  box-shadow: var(--kds-elevation-level-3);\n}\n\n.label-title {\n  font: var(--kds-font-base-body-small-strong);\n}\n</style>\n","<script setup lang=\"ts\">\nimport { useTemplateRef } from \"vue\";\n\nimport {\n  KdsDescription,\n  KdsPopover,\n  type KdsPopoverExpose,\n  KdsToggleButton,\n} from \"@knime/kds-components\";\n\nimport type { AssignedLabel } from \"./types\";\n\ntype Props = {\n  label: AssignedLabel;\n};\n\ndefineProps<Props>();\n\nconst isPopoverOpen = defineModel<boolean>({ default: false });\nconst popoverEl = useTemplateRef<KdsPopoverExpose>(\"popover\");\nconst toggleButtonEl = useTemplateRef(\"toggleButton\");\n</script>\n\n<template>\n  <KdsToggleButton\n    ref=\"toggleButton\"\n    v-model=\"isPopoverOpen\"\n    data-kds-card-secondary-action\n    :label=\"label.label.name\"\n    aria-haspopup=\"dialog\"\n    :aria-expanded=\"isPopoverOpen\"\n    :aria-controls=\"popoverEl?.popoverId\"\n    size=\"xsmall\"\n  />\n\n  <KdsPopover\n    ref=\"popover\"\n    v-model=\"isPopoverOpen\"\n    :anchor=\"toggleButtonEl?.$el\"\n    placement=\"bottom-left\"\n    role=\"dialog\"\n    aria-label=\"Label details\"\n  >\n    <div class=\"label-popover-container\">\n      <div class=\"label-title\">{{ label.label.name }}</div>\n      <KdsDescription :text=\"label.label.description\" />\n      <KdsDescription v-if=\"label.message\" :text=\"label.message\" />\n    </div>\n  </KdsPopover>\n</template>\n\n<style scoped>\n.label-popover-container {\n  display: flex;\n  flex-direction: column;\n  gap: var(--kds-spacing-container-0-5x);\n  align-items: flex-start;\n  max-width: var(--kds-dimension-component-width-20x);\n  max-height: var(--kds-dimension-component-height-20x);\n  padding: var(--kds-spacing-container-0-75x) var(--kds-spacing-container-1x);\n  overflow-y: auto;\n  background-color: var(--kds-color-surface-default);\n  border-radius: var(--kds-border-radius-container-0-50x);\n  box-shadow: var(--kds-elevation-level-3);\n}\n\n.label-title {\n  font: var(--kds-font-base-body-small-strong);\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport {\n  KdsDescription,\n  type KdsMenuActionItem,\n  KdsMenuButton,\n  KdsSelectableCard,\n} from \"@knime/kds-components\";\n\nimport HistoryEvent from \"./HistoryEvent.vue\";\nimport HistoryEventAuthor from \"./HistoryEventAuthor.vue\";\nimport HistoryEventFooter from \"./HistoryEventFooter.vue\";\nimport VersionLabel from \"./VersionLabel.vue\";\nimport type {\n  NamedItemVersion,\n  RestoreOption,\n  WithAvatar,\n  WithLabels,\n} from \"./types\";\n\ntype Props = {\n  version: NamedItemVersion & WithAvatar & WithLabels;\n  isSelected: boolean;\n  hasAdminRights: boolean;\n  hasEditCapability: boolean;\n  isFirstItem: boolean;\n  isLastItem: boolean;\n  restoreOption?: RestoreOption;\n};\n\nconst props = defineProps<Props>();\n\nconst emit = defineEmits<{\n  select: [selectionStatus: boolean];\n  delete: [];\n  restore: [];\n}>();\n\nconst toggleVersionSelection = () => {\n  emit(\"select\", !props.isSelected);\n};\n\nconst menuItems = computed<KdsMenuActionItem[]>(() =>\n  [\n    props.hasEditCapability && {\n      id: \"show\",\n      text: props.isSelected ? \"Deselect this version\" : \"Show this version\",\n      handler: toggleVersionSelection,\n    },\n    props.hasEditCapability && {\n      id: \"restore\",\n      text: \"Restore this version\",\n      subText: props.restoreOption?.subText,\n      disabled: props.restoreOption?.disabled,\n      handler: () => emit(\"restore\"),\n    },\n    props.hasAdminRights && {\n      id: \"delete\",\n      text: \"Delete this version\",\n      handler: () => emit(\"delete\"),\n    },\n  ].filter((i) => i !== false),\n);\n</script>\n\n<template>\n  <HistoryEvent :is-selected :is-first-item :is-last-item>\n    <KdsSelectableCard\n      :model-value=\"isSelected\"\n      :headline=\"version.title\"\n      ariaLabel=\"Version history event\"\n      @update:model-value=\"toggleVersionSelection\"\n    >\n      <template v-if=\"menuItems.length\" #header-actions>\n        <KdsMenuButton\n          :items=\"menuItems\"\n          variant=\"transparent\"\n          leading-icon=\"more-actions\"\n          ariaLabel=\"More actions\"\n        />\n      </template>\n\n      <div class=\"content-wrapper\">\n        <HistoryEventAuthor :author=\"version.author\" :avatar=\"version.avatar\" />\n\n        <KdsDescription\n          v-if=\"version.description\"\n          :text=\"version.description\"\n        />\n\n        <div class=\"labels-wrapper\">\n          <VersionLabel\n            v-for=\"label in version.labels\"\n            :key=\"label.labelId\"\n            :label=\"label\"\n          />\n        </div>\n\n        <HistoryEventFooter\n          :version=\"version.version\"\n          :date=\"version.createdOn\"\n        />\n      </div>\n    </KdsSelectableCard>\n  </HistoryEvent>\n</template>\n\n<style scoped>\n.content-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: var(--kds-spacing-container-0-37x);\n}\n\n.labels-wrapper {\n  display: flex;\n  flex-wrap: wrap;\n  gap: var(--kds-spacing-container-0-25x) var(--kds-spacing-container-0-5x);\n  align-items: center;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport {\n  KdsDescription,\n  type KdsMenuActionItem,\n  KdsMenuButton,\n  KdsSelectableCard,\n} from \"@knime/kds-components\";\n\nimport HistoryEvent from \"./HistoryEvent.vue\";\nimport HistoryEventAuthor from \"./HistoryEventAuthor.vue\";\nimport HistoryEventFooter from \"./HistoryEventFooter.vue\";\nimport VersionLabel from \"./VersionLabel.vue\";\nimport type {\n  NamedItemVersion,\n  RestoreOption,\n  WithAvatar,\n  WithLabels,\n} from \"./types\";\n\ntype Props = {\n  version: NamedItemVersion & WithAvatar & WithLabels;\n  isSelected: boolean;\n  hasAdminRights: boolean;\n  hasEditCapability: boolean;\n  isFirstItem: boolean;\n  isLastItem: boolean;\n  restoreOption?: RestoreOption;\n};\n\nconst props = defineProps<Props>();\n\nconst emit = defineEmits<{\n  select: [selectionStatus: boolean];\n  delete: [];\n  restore: [];\n}>();\n\nconst toggleVersionSelection = () => {\n  emit(\"select\", !props.isSelected);\n};\n\nconst menuItems = computed<KdsMenuActionItem[]>(() =>\n  [\n    props.hasEditCapability && {\n      id: \"show\",\n      text: props.isSelected ? \"Deselect this version\" : \"Show this version\",\n      handler: toggleVersionSelection,\n    },\n    props.hasEditCapability && {\n      id: \"restore\",\n      text: \"Restore this version\",\n      subText: props.restoreOption?.subText,\n      disabled: props.restoreOption?.disabled,\n      handler: () => emit(\"restore\"),\n    },\n    props.hasAdminRights && {\n      id: \"delete\",\n      text: \"Delete this version\",\n      handler: () => emit(\"delete\"),\n    },\n  ].filter((i) => i !== false),\n);\n</script>\n\n<template>\n  <HistoryEvent :is-selected :is-first-item :is-last-item>\n    <KdsSelectableCard\n      :model-value=\"isSelected\"\n      :headline=\"version.title\"\n      ariaLabel=\"Version history event\"\n      @update:model-value=\"toggleVersionSelection\"\n    >\n      <template v-if=\"menuItems.length\" #header-actions>\n        <KdsMenuButton\n          :items=\"menuItems\"\n          variant=\"transparent\"\n          leading-icon=\"more-actions\"\n          ariaLabel=\"More actions\"\n        />\n      </template>\n\n      <div class=\"content-wrapper\">\n        <HistoryEventAuthor :author=\"version.author\" :avatar=\"version.avatar\" />\n\n        <KdsDescription\n          v-if=\"version.description\"\n          :text=\"version.description\"\n        />\n\n        <div class=\"labels-wrapper\">\n          <VersionLabel\n            v-for=\"label in version.labels\"\n            :key=\"label.labelId\"\n            :label=\"label\"\n          />\n        </div>\n\n        <HistoryEventFooter\n          :version=\"version.version\"\n          :date=\"version.createdOn\"\n        />\n      </div>\n    </KdsSelectableCard>\n  </HistoryEvent>\n</template>\n\n<style scoped>\n.content-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: var(--kds-spacing-container-0-37x);\n}\n\n.labels-wrapper {\n  display: flex;\n  flex-wrap: wrap;\n  gap: var(--kds-spacing-container-0-25x) var(--kds-spacing-container-0-5x);\n  align-items: center;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport { KdsCard, KdsDescription, KdsLinkButton } from \"@knime/kds-components\";\n\nimport HistoryEvent from \"./HistoryEvent.vue\";\nimport type { VersionLimit } from \"./types\";\n\nconst {\n  versionLimit,\n  upgradeUrl = undefined,\n  isPrivate = false,\n} = defineProps<{\n  versionLimit: Required<VersionLimit>;\n  upgradeUrl?: string;\n  isPrivate?: boolean;\n}>();\n\nconst isLimitReached = computed(\n  () => versionLimit.currentUsage >= versionLimit.limit,\n);\n\nconst headline = computed(() => {\n  if (isLimitReached.value) {\n    return `You've reached the maximum of ${versionLimit.limit} versions.`;\n  } else {\n    return `Using ${versionLimit.currentUsage} of ${versionLimit.limit} versions.`;\n  }\n});\n</script>\n\n<template>\n  <HistoryEvent :is-selected=\"false\" :is-first-item=\"false\" is-last-item>\n    <KdsCard variant=\"filled\" :headline=\"headline\">\n      <template v-if=\"upgradeUrl\" #header-actions>\n        <KdsLinkButton label=\"Upgrade\" :to=\"upgradeUrl\" />\n      </template>\n\n      <div class=\"content-wrapper\">\n        <KdsDescription\n          :text=\"`Upgrade to use unlimited versions${isPrivate ? ' for private items.' : '.'}`\"\n        />\n      </div>\n    </KdsCard>\n  </HistoryEvent>\n</template>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport { KdsCard, KdsDescription, KdsLinkButton } from \"@knime/kds-components\";\n\nimport HistoryEvent from \"./HistoryEvent.vue\";\nimport type { VersionLimit } from \"./types\";\n\nconst {\n  versionLimit,\n  upgradeUrl = undefined,\n  isPrivate = false,\n} = defineProps<{\n  versionLimit: Required<VersionLimit>;\n  upgradeUrl?: string;\n  isPrivate?: boolean;\n}>();\n\nconst isLimitReached = computed(\n  () => versionLimit.currentUsage >= versionLimit.limit,\n);\n\nconst headline = computed(() => {\n  if (isLimitReached.value) {\n    return `You've reached the maximum of ${versionLimit.limit} versions.`;\n  } else {\n    return `Using ${versionLimit.currentUsage} of ${versionLimit.limit} versions.`;\n  }\n});\n</script>\n\n<template>\n  <HistoryEvent :is-selected=\"false\" :is-first-item=\"false\" is-last-item>\n    <KdsCard variant=\"filled\" :headline=\"headline\">\n      <template v-if=\"upgradeUrl\" #header-actions>\n        <KdsLinkButton label=\"Upgrade\" :to=\"upgradeUrl\" />\n      </template>\n\n      <div class=\"content-wrapper\">\n        <KdsDescription\n          :text=\"`Upgrade to use unlimited versions${isPrivate ? ' for private items.' : '.'}`\"\n        />\n      </div>\n    </KdsCard>\n  </HistoryEvent>\n</template>\n","export const VERSION_DEFAULT_LIMIT = 10;\nexport const CURRENT_STATE_VERSION = \"current-state\";\nexport const MOST_RECENT_VERSION = \"most-recent\";\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport {\n  KdsButton,\n  KdsPanel,\n  type KdsPanelHeadlineTrailingAction,\n} from \"@knime/kds-components\";\n\nimport CurrentState from \"./CurrentState.vue\";\nimport VersionItem from \"./VersionItem.vue\";\nimport VersionLimitInfo from \"./VersionLimitInfo.vue\";\nimport { CURRENT_STATE_VERSION } from \"./constants\";\nimport type { NamedItemVersion, VersionHistoryProps } from \"./types\";\n\nconst props = defineProps<VersionHistoryProps>();\n\nconst emit = defineEmits<{\n  close: [];\n  loadAll: [];\n  create: [];\n  delete: [version: NamedItemVersion[\"version\"]];\n  restore: [version: NamedItemVersion[\"version\"]];\n  select: [version: NamedItemVersion[\"version\"]];\n  discardCurrentState: [];\n}>();\n\nconst isVersionLimitExceeded = computed(() => {\n  return (\n    props.versionLimit?.limit !== undefined &&\n    props.versionLimit.currentUsage >= props.versionLimit.limit\n  );\n});\n\nconst headlineTrailingActions = computed<KdsPanelHeadlineTrailingAction[]>(\n  () => [\n    {\n      type: \"button\",\n      props: {\n        leadingIcon: \"x-close\",\n        ariaLabel: \"Close\",\n        variant: \"transparent\",\n      },\n      onClick: () => emit(\"close\"),\n    },\n  ],\n);\n</script>\n\n<template>\n  <KdsPanel\n    headline=\"Version history\"\n    :headline-trailing-actions=\"headlineTrailingActions\"\n  >\n    <div class=\"version-history-wrapper\">\n      <CurrentState\n        v-if=\"unversionedSavepoint\"\n        :current-savepoint=\"unversionedSavepoint\"\n        :is-selected=\"currentVersion === CURRENT_STATE_VERSION\"\n        :has-edit-capability=\"hasEditCapability\"\n        :has-previous-version=\"versionHistory.length > 0\"\n        :has-version-limit=\"versionLimit?.limit !== undefined\"\n        :is-version-limit-exceeded=\"isVersionLimitExceeded\"\n        @select=\"$emit('select', CURRENT_STATE_VERSION)\"\n        @create-version=\"$emit('create')\"\n        @discard=\"$emit('discardCurrentState')\"\n      />\n\n      <VersionItem\n        v-for=\"(historyEvent, index) in versionHistory\"\n        :key=\"historyEvent.version\"\n        :version=\"historyEvent\"\n        :is-selected=\"historyEvent.version === currentVersion\"\n        :has-admin-rights=\"hasAdminRights\"\n        :has-edit-capability=\"hasEditCapability\"\n        :is-first-item=\"!unversionedSavepoint && index === 0\"\n        :is-last-item=\"\n          index === versionHistory.length - 1 &&\n          versionLimit?.limit === undefined\n        \"\n        :restore-option\n        @delete=\"$emit('delete', historyEvent.version)\"\n        @restore=\"$emit('restore', historyEvent.version)\"\n        @select=\"\n          $emit('select', $event ? historyEvent.version : CURRENT_STATE_VERSION)\n        \"\n      />\n\n      <VersionLimitInfo\n        v-if=\"versionLimit?.limit !== undefined\"\n        class=\"version-limit-info\"\n        :version-limit=\"{\n          limit: versionLimit.limit,\n          currentUsage: versionLimit.currentUsage,\n        }\"\n        :upgrade-url\n        :is-private\n      />\n\n      <KdsButton\n        v-if=\"!hasLoadedAllVersions\"\n        variant=\"transparent\"\n        :disabled=\"loading\"\n        :label=\"loading ? 'Loading...' : 'Load all'\"\n        class=\"load-more-button\"\n        @click=\"$emit('loadAll')\"\n      />\n    </div>\n  </KdsPanel>\n</template>\n\n<style scoped>\n.version-history-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: var(--kds-spacing-container-0-75x);\n}\n\n.load-more-button {\n  margin: 0 auto;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport {\n  KdsButton,\n  KdsPanel,\n  type KdsPanelHeadlineTrailingAction,\n} from \"@knime/kds-components\";\n\nimport CurrentState from \"./CurrentState.vue\";\nimport VersionItem from \"./VersionItem.vue\";\nimport VersionLimitInfo from \"./VersionLimitInfo.vue\";\nimport { CURRENT_STATE_VERSION } from \"./constants\";\nimport type { NamedItemVersion, VersionHistoryProps } from \"./types\";\n\nconst props = defineProps<VersionHistoryProps>();\n\nconst emit = defineEmits<{\n  close: [];\n  loadAll: [];\n  create: [];\n  delete: [version: NamedItemVersion[\"version\"]];\n  restore: [version: NamedItemVersion[\"version\"]];\n  select: [version: NamedItemVersion[\"version\"]];\n  discardCurrentState: [];\n}>();\n\nconst isVersionLimitExceeded = computed(() => {\n  return (\n    props.versionLimit?.limit !== undefined &&\n    props.versionLimit.currentUsage >= props.versionLimit.limit\n  );\n});\n\nconst headlineTrailingActions = computed<KdsPanelHeadlineTrailingAction[]>(\n  () => [\n    {\n      type: \"button\",\n      props: {\n        leadingIcon: \"x-close\",\n        ariaLabel: \"Close\",\n        variant: \"transparent\",\n      },\n      onClick: () => emit(\"close\"),\n    },\n  ],\n);\n</script>\n\n<template>\n  <KdsPanel\n    headline=\"Version history\"\n    :headline-trailing-actions=\"headlineTrailingActions\"\n  >\n    <div class=\"version-history-wrapper\">\n      <CurrentState\n        v-if=\"unversionedSavepoint\"\n        :current-savepoint=\"unversionedSavepoint\"\n        :is-selected=\"currentVersion === CURRENT_STATE_VERSION\"\n        :has-edit-capability=\"hasEditCapability\"\n        :has-previous-version=\"versionHistory.length > 0\"\n        :has-version-limit=\"versionLimit?.limit !== undefined\"\n        :is-version-limit-exceeded=\"isVersionLimitExceeded\"\n        @select=\"$emit('select', CURRENT_STATE_VERSION)\"\n        @create-version=\"$emit('create')\"\n        @discard=\"$emit('discardCurrentState')\"\n      />\n\n      <VersionItem\n        v-for=\"(historyEvent, index) in versionHistory\"\n        :key=\"historyEvent.version\"\n        :version=\"historyEvent\"\n        :is-selected=\"historyEvent.version === currentVersion\"\n        :has-admin-rights=\"hasAdminRights\"\n        :has-edit-capability=\"hasEditCapability\"\n        :is-first-item=\"!unversionedSavepoint && index === 0\"\n        :is-last-item=\"\n          index === versionHistory.length - 1 &&\n          versionLimit?.limit === undefined\n        \"\n        :restore-option\n        @delete=\"$emit('delete', historyEvent.version)\"\n        @restore=\"$emit('restore', historyEvent.version)\"\n        @select=\"\n          $emit('select', $event ? historyEvent.version : CURRENT_STATE_VERSION)\n        \"\n      />\n\n      <VersionLimitInfo\n        v-if=\"versionLimit?.limit !== undefined\"\n        class=\"version-limit-info\"\n        :version-limit=\"{\n          limit: versionLimit.limit,\n          currentUsage: versionLimit.currentUsage,\n        }\"\n        :upgrade-url\n        :is-private\n      />\n\n      <KdsButton\n        v-if=\"!hasLoadedAllVersions\"\n        variant=\"transparent\"\n        :disabled=\"loading\"\n        :label=\"loading ? 'Loading...' : 'Load all'\"\n        class=\"load-more-button\"\n        @click=\"$emit('loadAll')\"\n      />\n    </div>\n  </KdsPanel>\n</template>\n\n<style scoped>\n.version-history-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: var(--kds-spacing-container-0-75x);\n}\n\n.load-more-button {\n  margin: 0 auto;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed, nextTick, ref } from \"vue\";\n\nimport {\n  KdsDescription,\n  KdsPanel,\n  type KdsPanelButtonAction,\n  type KdsPanelHeadlineTrailingAction,\n  KdsTextInput,\n  KdsTextarea,\n} from \"@knime/kds-components\";\n\nimport type { CreateVersionFormProps } from \"./types\";\n\nconst { isCreationPending = false } = defineProps<CreateVersionFormProps>();\n\nconst emit = defineEmits<{\n  create: [{ name: string; description: string }];\n  cancel: [hasUnsavedChanges: boolean];\n}>();\n\nconst versionName = ref(\"\");\nconst versionDescription = ref(\"\");\n\nconst doValidate = ref(false);\n\nconst isVersionNameInvalid = computed(() => {\n  return doValidate.value && versionName.value.trim().length <= 0;\n});\n\nconst hasUnsavedChanges = computed(() => {\n  return versionName.value !== \"\" || versionDescription.value !== \"\";\n});\n\nconst onCreate = async () => {\n  doValidate.value = true;\n  await nextTick();\n\n  if (!isVersionNameInvalid.value) {\n    emit(\"create\", {\n      name: versionName.value.trim(),\n      description: versionDescription.value,\n    });\n  }\n};\n\nconst headlineTrailingActions = computed<KdsPanelHeadlineTrailingAction[]>(\n  () => [\n    {\n      type: \"button\",\n      props: {\n        leadingIcon: \"x-close\",\n        ariaLabel: \"Close\",\n        variant: \"transparent\",\n      },\n      onClick: () => emit(\"cancel\", hasUnsavedChanges.value),\n    },\n  ],\n);\n\nconst footerLeadingActions = computed<KdsPanelButtonAction[]>(() => [\n  {\n    type: \"button\",\n    props: {\n      label: \"Cancel\",\n      variant: \"outlined\",\n    },\n    onClick: () => emit(\"cancel\", hasUnsavedChanges.value),\n  },\n]);\n\nconst footerTrailingActions = computed<KdsPanelButtonAction[]>(() => [\n  {\n    type: \"button\",\n    props: {\n      label: \"Create\",\n      variant: \"filled\",\n      disabled: isVersionNameInvalid.value || isCreationPending,\n    },\n    onClick: onCreate,\n  },\n]);\n</script>\n\n<template>\n  <KdsPanel\n    headline=\"Create version\"\n    :headline-trailing-actions=\"headlineTrailingActions\"\n    :footer-leading-actions=\"footerLeadingActions\"\n    :footer-trailing-actions=\"footerTrailingActions\"\n  >\n    <div class=\"create-version-form-wrapper\">\n      <KdsDescription\n        text=\"Give your version a name and description. Versions can be used to create a deployment.\"\n        class=\"create-version-form-description\"\n      />\n\n      <KdsTextInput\n        v-model=\"versionName\"\n        label=\"Version name\"\n        type=\"text\"\n        :error=\"isVersionNameInvalid\"\n        :sub-text=\"\n          isVersionNameInvalid\n            ? 'Please enter at least 1 character.'\n            : undefined\n        \"\n      />\n\n      <KdsTextarea\n        v-model=\"versionDescription\"\n        label=\"Description\"\n        class=\"description\"\n      />\n    </div>\n  </KdsPanel>\n</template>\n\n<style scoped>\n.create-version-form-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: var(--kds-spacing-container-1x);\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed, nextTick, ref } from \"vue\";\n\nimport {\n  KdsDescription,\n  KdsPanel,\n  type KdsPanelButtonAction,\n  type KdsPanelHeadlineTrailingAction,\n  KdsTextInput,\n  KdsTextarea,\n} from \"@knime/kds-components\";\n\nimport type { CreateVersionFormProps } from \"./types\";\n\nconst { isCreationPending = false } = defineProps<CreateVersionFormProps>();\n\nconst emit = defineEmits<{\n  create: [{ name: string; description: string }];\n  cancel: [hasUnsavedChanges: boolean];\n}>();\n\nconst versionName = ref(\"\");\nconst versionDescription = ref(\"\");\n\nconst doValidate = ref(false);\n\nconst isVersionNameInvalid = computed(() => {\n  return doValidate.value && versionName.value.trim().length <= 0;\n});\n\nconst hasUnsavedChanges = computed(() => {\n  return versionName.value !== \"\" || versionDescription.value !== \"\";\n});\n\nconst onCreate = async () => {\n  doValidate.value = true;\n  await nextTick();\n\n  if (!isVersionNameInvalid.value) {\n    emit(\"create\", {\n      name: versionName.value.trim(),\n      description: versionDescription.value,\n    });\n  }\n};\n\nconst headlineTrailingActions = computed<KdsPanelHeadlineTrailingAction[]>(\n  () => [\n    {\n      type: \"button\",\n      props: {\n        leadingIcon: \"x-close\",\n        ariaLabel: \"Close\",\n        variant: \"transparent\",\n      },\n      onClick: () => emit(\"cancel\", hasUnsavedChanges.value),\n    },\n  ],\n);\n\nconst footerLeadingActions = computed<KdsPanelButtonAction[]>(() => [\n  {\n    type: \"button\",\n    props: {\n      label: \"Cancel\",\n      variant: \"outlined\",\n    },\n    onClick: () => emit(\"cancel\", hasUnsavedChanges.value),\n  },\n]);\n\nconst footerTrailingActions = computed<KdsPanelButtonAction[]>(() => [\n  {\n    type: \"button\",\n    props: {\n      label: \"Create\",\n      variant: \"filled\",\n      disabled: isVersionNameInvalid.value || isCreationPending,\n    },\n    onClick: onCreate,\n  },\n]);\n</script>\n\n<template>\n  <KdsPanel\n    headline=\"Create version\"\n    :headline-trailing-actions=\"headlineTrailingActions\"\n    :footer-leading-actions=\"footerLeadingActions\"\n    :footer-trailing-actions=\"footerTrailingActions\"\n  >\n    <div class=\"create-version-form-wrapper\">\n      <KdsDescription\n        text=\"Give your version a name and description. Versions can be used to create a deployment.\"\n        class=\"create-version-form-description\"\n      />\n\n      <KdsTextInput\n        v-model=\"versionName\"\n        label=\"Version name\"\n        type=\"text\"\n        :error=\"isVersionNameInvalid\"\n        :sub-text=\"\n          isVersionNameInvalid\n            ? 'Please enter at least 1 character.'\n            : undefined\n        \"\n      />\n\n      <KdsTextarea\n        v-model=\"versionDescription\"\n        label=\"Description\"\n        class=\"description\"\n      />\n    </div>\n  </KdsPanel>\n</template>\n\n<style scoped>\n.create-version-form-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: var(--kds-spacing-container-1x);\n}\n</style>\n"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@knime/product-features",
-  "version": "6.1.0",
+  "version": "6.1.1",
   "description": "Package containing composition patterns of KDS Components and KNIME business logic",
   "repository": {
     "type": "git",
@@ -63,22 +63,22 @@
     "CHANGELOG.md"
   ],
   "peerDependencies": {
-    "@knime/kds-components": "^11.0.0",
-    "@knime/kds-styles": "^11.0.0",
+    "@knime/kds-components": "^12.0.0",
+    "@knime/kds-styles": "^12.0.0",
     "@vueuse/core": "^14.0.0",
     "es-toolkit": "^1.49.0",
     "ofetch": "^1.5.1",
     "vue": "~3.5.0"
   },
   "dependencies": {
-    "@knime/utils": "^2.0.3",
+    "@knime/utils": "^2.0.4",
     "consola": "^3.4.2"
   },
   "devDependencies": {
-    "@knime/kds-components": "^11.4.0",
-    "@knime/kds-styles": "^11.4.0",
-    "@storybook/addon-docs": "^10.4.6",
-    "@storybook/vue3-vite": "^10.4.6",
+    "@knime/kds-components": "^12.0.0",
+    "@knime/kds-styles": "^12.0.0",
+    "@storybook/addon-docs": "^10.6.2",
+    "@storybook/vue3-vite": "^10.6.2",
     "@vitejs/plugin-vue": "^6.0.8",
     "@vue/test-utils": "^2.4.11",
     "@vue/tsconfig": "^0.9.1",
@@ -90,7 +90,7 @@
     "ofetch": "^1.5.1",
     "prettier": "3.9.6",
     "prettier-plugin-vue": "^1.1.6",
-    "storybook": "^10.4.6",
+    "storybook": "^10.6.2",
     "ts-morph": "^28.0.0",
     "vite": "^8.1.3",
     "vite-plugin-dts": "^5.0.3",