@knime/kds-components 0.23.0 → 0.23.1

package/dist/index.js

@@ -1091,11 +1091,22 @@ const resolveNuxtLinkComponent = () => {
   return fallbackComponent;
 };
 
+function isExternalUrl(url) {
+  const normalized = url.trim();
+  if (!normalized) {
+    return false;
+  }
+  if (normalized.startsWith("#") || normalized.startsWith("/") && !normalized.startsWith("//") || normalized.startsWith("./") || normalized.startsWith("../") || normalized.startsWith("?")) {
+    return false;
+  }
+  return true;
+}
+
 const _sfc_main$13 = /* @__PURE__ */ defineComponent({
   __name: "KdsLinkButton",
   props: {
     size: {},
-    disabled: { type: Boolean },
+    disabled: { type: Boolean, default: false },
     title: {},
     variant: { default: "filled" },
     label: {},
@@ -1110,23 +1121,33 @@ const _sfc_main$13 = /* @__PURE__ */ defineComponent({
   },
   emits: ["click"],
   setup(__props, { emit: __emit }) {
-    const props = createPropsRestProxy(__props, ["variant", "download", "rel", "target"]);
+    const rawProps = createPropsRestProxy(__props, ["variant", "disabled", "download", "rel", "target"]);
+    const props = computed(() => {
+      if (isExternalUrl(rawProps.to)) {
+        return {
+          ...rawProps,
+          trailingIcon: "external-link"
+        };
+      }
+      return rawProps;
+    });
     const component = computed(() => {
-      if (props.disabled) {
+      if (__props.disabled) {
         return "button";
       }
       return resolveNuxtLinkComponent();
     });
     const emit = __emit;
     return (_ctx, _cache) => {
-      return openBlock(), createBlock(BaseButton, mergeProps(props, {
+      return openBlock(), createBlock(BaseButton, mergeProps(props.value, {
         variant: __props.variant,
+        disabled: __props.disabled,
         download: __props.download,
         rel: __props.rel,
         target: __props.target,
         component: component.value,
         onClick: _cache[0] || (_cache[0] = ($event) => emit("click", $event))
-      }), null, 16, ["variant", "download", "rel", "target", "component"]);
+      }), null, 16, ["variant", "disabled", "download", "rel", "target", "component"]);
     };
   }
 });
@@ -1331,21 +1352,11 @@ const _sfc_main$12 = /* @__PURE__ */ defineComponent({
   setup(__props, { emit: __emit }) {
     const emit = __emit;
     const linkComponent = resolveNuxtLinkComponent();
-    function inferVariantFromTo(to) {
-      const normalized = to.trim();
-      if (!normalized) {
-        return "internal";
-      }
-      if (normalized.startsWith("#") || normalized.startsWith("/") && !normalized.startsWith("//") || normalized.startsWith("./") || normalized.startsWith("../") || normalized.startsWith("?")) {
-        return "internal";
-      }
-      return "external";
-    }
     const variant = computed(() => {
       if (__props.download || __props.fileSize !== void 0) {
         return "document";
       }
-      return inferVariantFromTo(__props.to);
+      return isExternalUrl(__props.to) ? "external" : "internal";
     });
     const effectiveTarget = computed(
       () => __props.target ?? (variant.value === "external" ? "_blank" : void 0)
@@ -1429,7 +1440,7 @@ const _sfc_main$12 = /* @__PURE__ */ defineComponent({
   }
 });
 
-const KdsLink = /* @__PURE__ */ _export_sfc$1(_sfc_main$12, [["__scopeId", "data-v-65e776f1"]]);
+const KdsLink = /* @__PURE__ */ _export_sfc$1(_sfc_main$12, [["__scopeId", "data-v-56e748a8"]]);
 
 const _sfc_main$11 = /* @__PURE__ */ defineComponent({
   __name: "KdsToggleButton",
@@ -1558,7 +1569,7 @@ const kdsProgressButtonState = {
 };
 const kdsProgressButtonStates = Object.values(kdsProgressButtonState);
 
-const _hoisted_1$F = { class: "kds-empty-state" };
+const _hoisted_1$F = ["aria-disabled"];
 const _hoisted_2$o = { class: "kds-empty-state-headline" };
 const _hoisted_3$h = {
   key: 1,
@@ -1573,12 +1584,14 @@ const _sfc_main$$ = /* @__PURE__ */ defineComponent({
   props: {
     headline: {},
     description: {},
+    loadingSpinner: { type: Boolean },
+    disabled: { type: Boolean, default: false },
     button: {},
-    loadingSpinner: { type: Boolean }
+    secondaryButton: {}
   },
-  emits: ["buttonClick"],
+  emits: ["buttonClick", "secondaryButtonClick"],
   setup(__props, { emit: __emit }) {
-    const props = __props;
+    const props = createPropsRestProxy(__props, ["disabled"]);
     const emit = __emit;
     const isLinkButton = computed(
       () => props.button && "to" in props.button && props.button.to !== void 0
@@ -1586,8 +1599,17 @@ const _sfc_main$$ = /* @__PURE__ */ defineComponent({
     const buttonComponent = computed(
       () => isLinkButton.value ? _sfc_main$13 : _sfc_main$14
     );
+    const isSecondaryLinkButton = computed(
+      () => props.secondaryButton && "to" in props.secondaryButton && props.secondaryButton.to !== void 0
+    );
+    const secondaryButtonComponent = computed(
+      () => isSecondaryLinkButton.value ? _sfc_main$13 : _sfc_main$14
+    );
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$F, [
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(["kds-empty-state", { disabled: __props.disabled }]),
+        "aria-disabled": __props.disabled || void 0
+      }, [
         props.loadingSpinner ? (openBlock(), createBlock(KdsLoadingSpinner, {
           key: 0,
           "data-testid": "loading-spinner",
@@ -1599,15 +1621,20 @@ const _sfc_main$$ = /* @__PURE__ */ defineComponent({
         props.description ? (openBlock(), createElementBlock("p", _hoisted_3$h, toDisplayString(props.description), 1)) : createCommentVNode("", true),
         props.button ? (openBlock(), createElementBlock("div", _hoisted_4$d, [
           (openBlock(), createBlock(resolveDynamicComponent(buttonComponent.value), mergeProps(props.button, {
-            onClick: _cache[0] || (_cache[0] = ($event) => emit("buttonClick", $event))
-          }), null, 16))
+            disabled: props.button?.disabled || __props.disabled,
+            onClick: _cache[0] || (_cache[0] = ($event) => !__props.disabled && emit("buttonClick", $event))
+          }), null, 16, ["disabled"])),
+          props.secondaryButton ? (openBlock(), createBlock(resolveDynamicComponent(secondaryButtonComponent.value), mergeProps({ key: 0 }, props.secondaryButton, {
+            disabled: props.secondaryButton?.disabled || __props.disabled,
+            onClick: _cache[1] || (_cache[1] = ($event) => !__props.disabled && emit("secondaryButtonClick", $event))
+          }), null, 16, ["disabled"])) : createCommentVNode("", true)
         ])) : createCommentVNode("", true)
-      ]);
+      ], 10, _hoisted_1$F);
     };
   }
 });
 
-const KdsEmptyState = /* @__PURE__ */ _export_sfc$1(_sfc_main$$, [["__scopeId", "data-v-5da4d570"]]);
+const KdsEmptyState = /* @__PURE__ */ _export_sfc$1(_sfc_main$$, [["__scopeId", "data-v-e913660a"]]);
 
 const _sfc_main$_ = /* @__PURE__ */ defineComponent({
   __name: "ListItemAccessory",
@@ -1775,7 +1802,7 @@ const _sfc_main$Z = /* @__PURE__ */ defineComponent({
   }
 });
 
-const KdsListItem = /* @__PURE__ */ _export_sfc$1(_sfc_main$Z, [["__scopeId", "data-v-822789ec"]]);
+const KdsListItem = /* @__PURE__ */ _export_sfc$1(_sfc_main$Z, [["__scopeId", "data-v-e3517d34"]]);
 
 const _sfc_main$Y = {  };
 
@@ -1784,7 +1811,7 @@ const _hoisted_1$D = { class: "kds-list-item-divider" };
 function _sfc_render$8(_ctx, _cache) {
   return (openBlock(), createElementBlock("hr", _hoisted_1$D))
 }
-const ListItemDivider = /*#__PURE__*/_export_sfc$1(_sfc_main$Y, [['render',_sfc_render$8],['__scopeId',"data-v-3ee92695"]]);
+const ListItemDivider = /*#__PURE__*/_export_sfc$1(_sfc_main$Y, [['render',_sfc_render$8],['__scopeId',"data-v-48d01ed1"]]);
 
 const _hoisted_1$C = { class: "kds-list-item-section-title" };
 const _hoisted_2$m = {
@@ -1821,7 +1848,7 @@ const _sfc_main$X = /* @__PURE__ */ defineComponent({
   }
 });
 
-const ListItemSectionTitle = /* @__PURE__ */ _export_sfc$1(_sfc_main$X, [["__scopeId", "data-v-53382531"]]);
+const ListItemSectionTitle = /* @__PURE__ */ _export_sfc$1(_sfc_main$X, [["__scopeId", "data-v-14b9ee99"]]);
 
 const _hoisted_1$B = ["role", "aria-busy", "aria-label", "aria-activedescendant", "tabindex"];
 const _hoisted_2$l = ["role"];
@@ -16109,9 +16136,12 @@ const _sfc_main$o = /* @__PURE__ */ defineComponent({
 const KdsListItemButton = /* @__PURE__ */ _export_sfc$1(_sfc_main$o, [["__scopeId", "data-v-13945d12"]]);
 
 const _hoisted_1$j = { class: "kds-multi-select-dropdown-options" };
-const _hoisted_2$8 = { class: "kds-multi-select-dropdown-search" };
-const _hoisted_3$7 = {
+const _hoisted_2$8 = {
   key: 0,
+  class: "kds-multi-select-dropdown-search"
+};
+const _hoisted_3$7 = {
+  key: 1,
   class: "kds-multi-select-dropdown-footer"
 };
 const _sfc_main$n = /* @__PURE__ */ defineComponent({
@@ -16150,6 +16180,9 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
         (option) => option.text.toLowerCase().includes(normalizedQuery)
       );
     });
+    const searchable = computed(() => {
+      return __props.allowNewValues || props.possibleValues.length >= DROPDOWN_SEARCH_THRESHOLD;
+    });
     const canAddNewValue = computed(() => {
       const trimmed = searchValue.value.trim();
       if (!__props.allowNewValues || trimmed.length === 0) {
@@ -16226,19 +16259,23 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
     __expose({
       focus: () => {
         initialSelectedIds.value = new Set(modelValue.value);
-        searchEl.value?.focus();
+        if (searchable.value) {
+          searchEl.value?.focus();
+        } else {
+          listContainerRef.value?.focus();
+        }
       }
     });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1$j, [
-        createElementVNode("div", _hoisted_2$8, [
+        searchable.value ? (openBlock(), createElementBlock("div", _hoisted_2$8, [
           createVNode(BaseInput, {
             ref_key: "searchEl",
             ref: searchEl,
             modelValue: searchValue.value,
             "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => searchValue.value = $event),
             type: "search",
-            placeholder: "Search",
+            placeholder: __props.allowNewValues ? "Search or add new" : "Search",
             "aria-label": "Filter options",
             "aria-activedescendant": listContainerRef.value?.activeDescendant,
             "leading-icon": "search",
@@ -16246,8 +16283,8 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
             onKeydown: _cache[1] || (_cache[1] = ($event) => listContainerRef.value?.handleKeydown($event)),
             onFocus: _cache[2] || (_cache[2] = ($event) => listContainerRef.value?.handleFocus()),
             onBlur: _cache[3] || (_cache[3] = ($event) => listContainerRef.value?.handleBlur())
-          }, null, 8, ["modelValue", "aria-activedescendant"])
-        ]),
+          }, null, 8, ["modelValue", "placeholder", "aria-activedescendant"])
+        ])) : createCommentVNode("", true),
         createVNode(unref(KdsListContainer), {
           ref: "listContainer",
           class: normalizeClass(["kds-multi-select-dropdown-list", {
@@ -16256,10 +16293,10 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
           "possible-values": __props.loading ? [] : listOptions.value,
           loading: __props.loading,
           "empty-text": props.emptyText,
-          "controlled-externally": "",
+          "controlled-externally": searchable.value,
           "aria-label": "Dropdown options",
           onItemClick: _cache[4] || (_cache[4] = ($event) => $event !== void 0 && onItemClick($event))
-        }, null, 8, ["class", "possible-values", "loading", "empty-text"]),
+        }, null, 8, ["class", "possible-values", "loading", "empty-text", "controlled-externally"]),
         !__props.loading && visibleEnabledIds.value.length > 0 ? (openBlock(), createElementBlock("div", _hoisted_3$7, [
           createVNode(unref(KdsListItemButton), {
             label: anyVisibleSelected.value ? "Clear all" : "Select all",
@@ -16273,7 +16310,7 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
   }
 });
 
-const MultiSelectDropdownContainer = /* @__PURE__ */ _export_sfc$1(_sfc_main$n, [["__scopeId", "data-v-9b631765"]]);
+const MultiSelectDropdownContainer = /* @__PURE__ */ _export_sfc$1(_sfc_main$n, [["__scopeId", "data-v-3cac8f74"]]);
 
 const _sfc_main$m = /* @__PURE__ */ defineComponent({
   __name: "KdsMultiSelectDropdown",
@@ -17137,8 +17174,9 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
                 visiblePossibleValues.value.length === 0 && !visibleBottomValue.value ? (openBlock(), createElementBlock("div", _hoisted_4$5, [
                   createVNode(KdsEmptyState, {
                     headline: __props.loading ? "Loading data…" : __props.emptyStateLabel,
-                    "loading-spinner": __props.loading
-                  }, null, 8, ["headline", "loading-spinner"])
+                    "loading-spinner": __props.loading,
+                    disabled: __props.disabled
+                  }, null, 8, ["headline", "loading-spinner", "disabled"])
                 ])) : createCommentVNode("", true)
               ], 6)
             ]),
@@ -17151,7 +17189,7 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
   }
 });
 
-const KdsMultiSelectListBox = /* @__PURE__ */ _export_sfc$1(_sfc_main$j, [["__scopeId", "data-v-24af1af0"]]);
+const KdsMultiSelectListBox = /* @__PURE__ */ _export_sfc$1(_sfc_main$j, [["__scopeId", "data-v-a95bec6e"]]);
 
 const _hoisted_1$f = { class: "kds-list-column" };
 const _hoisted_2$5 = { class: "kds-list-header" };