@knime/product-features 0.2.0 → 0.2.2

package/dist/nodes.css

@@ -311,6 +311,84 @@
 }
 }
 
+.kds-progress-bar {
+&[data-v-5fdfbce2] {
+  --progress-bar-background-color: var(--kds-color-surface-subtle);
+  --progress-bar-foreground-color: var(
+    --kds-color-background-primary-bold-initial
+  );
+  --progress-bar-radius: var(--kds-border-radius-container-pill);
+  --progress-bar-height: var(--kds-dimension-component-height-0-25x);
+
+  position: relative;
+  width: 100%;
+  height: var(--progress-bar-height);
+  overflow: hidden;
+  border-radius: var(--progress-bar-radius);
+
+  /* Firefox uses this to target the bar that represents the value of the progress element */
+
+  /* the following two rules need to stay separate, as otherwise it causes it not to be applied in Chrome correctly */
+}
+& .progress[data-v-5fdfbce2] {
+    display: block;
+    width: 100%;
+    height: var(--progress-bar-height);
+    padding: 0;
+    overflow: hidden;
+    appearance: none;
+
+    /* Firefox sets the background of the bar from here  */
+    background-color: var(--progress-bar-background-color);
+    border: none;
+    border-radius: var(--progress-bar-radius);
+}
+& .progress[data-v-5fdfbce2]::-webkit-progress-bar {
+    background-color: var(--progress-bar-background-color);
+}
+& .progress[data-v-5fdfbce2]::-webkit-progress-value {
+    background-color: var(--progress-bar-foreground-color);
+    border-radius: var(--progress-bar-radius);
+    transition: width 0.5s;
+}
+& .progress[data-v-5fdfbce2]::-moz-progress-bar {
+    background-color: var(--progress-bar-foreground-color);
+}
+& .progress[data-v-5fdfbce2]:indeterminate {
+    background-color: var(--progress-bar-background-color);
+    background-image: none;
+}
+& .progress[data-v-5fdfbce2]:indeterminate::-webkit-progress-bar {
+    background-color: transparent;
+}
+& .progress[data-v-5fdfbce2]:indeterminate::-moz-progress-bar {
+    background-color: transparent;
+}
+& .indeterminate-bar[data-v-5fdfbce2] {
+    position: absolute;
+    inset-block: 0;
+    width: 35%;
+    pointer-events: none;
+    background-color: var(--progress-bar-foreground-color);
+    border-radius: var(--kds-border-radius-container-pill);
+    animation: move-indeterminate-5fdfbce2 1.5s linear infinite;
+}
+}
+.kds-progress-bar-medium[data-v-5fdfbce2] {
+  --progress-bar-height: var(--kds-dimension-component-height-0-25x);
+}
+.kds-progress-bar-large[data-v-5fdfbce2] {
+  --progress-bar-height: var(--kds-dimension-component-height-0-75x);
+}
+@keyframes move-indeterminate-5fdfbce2 {
+0% {
+    transform: translateX(-120%);
+}
+100% {
+    transform: translateX(320%);
+}
+}
+
 .kds-color-swatch {
 &[data-v-91e0130d] {
   display: inline-block;
@@ -4515,7 +4593,10 @@ td {
   font: var(--kds-font-base-title-small-strong);
 }
 
-.content[data-v-822747b0] {
+.content[data-v-d2eb8e2e] {
   padding: var(--kds-spacing-container-0-5x) 0;
   color: var(--kds-color-text-and-icon-neutral);
 }
+.empty-state[data-v-d2eb8e2e] {
+  margin: 0 auto;
+}

package/dist/nodes.js

@@ -64,7 +64,7 @@ function useIcon({
   };
 }
 
-const _sfc_main$1D = /* @__PURE__ */ defineComponent({
+const _sfc_main$1E = /* @__PURE__ */ defineComponent({
   __name: "KdsIcon",
   props: {
     name: {},
@@ -94,7 +94,7 @@ const _sfc_main$1D = /* @__PURE__ */ defineComponent({
   }
 });
 
-const KdsIcon = /* @__PURE__ */ _export_sfc$1(_sfc_main$1D, [["__scopeId", "data-v-bff4f419"]]);
+const KdsIcon = /* @__PURE__ */ _export_sfc$1(_sfc_main$1E, [["__scopeId", "data-v-bff4f419"]]);
 
 const iconNames = [
   "add-user",
@@ -11590,7 +11590,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     optionsData: { default: () => [] },
     viewsData: { default: () => [] },
     emptyText: { default: "No ports, options or views available." },
-    renderAsHtml: { type: Boolean, default: false }
+    renderAsHtml: { type: Boolean, default: false },
+    tabBarFullWidth: { type: Boolean, default: false }
   },
   setup(__props) {
     const TAB_IDS = {
@@ -11642,10 +11643,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         createVNode(unref(KdsTabBar), {
           modelValue: activeTab.value,
           "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => activeTab.value = $event),
-          "full-width": false,
+          "full-width": __props.tabBarFullWidth,
           size: "small",
           tabs: tabs.value
-        }, null, 8, ["modelValue", "tabs"]),
+        }, null, 8, ["modelValue", "full-width", "tabs"]),
         createElementVNode("div", _hoisted_1, [
           activeTab.value === TAB_IDS.PORTS ? (openBlock(), createBlock(PortsTab, {
             key: 0,
@@ -11677,7 +11678,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           }, null, 8, ["views"])) : createCommentVNode("", true),
           !activeTab.value ? (openBlock(), createBlock(unref(KdsEmptyState), {
             key: 3,
-            headline: __props.emptyText
+            headline: __props.emptyText,
+            class: "empty-state"
           }, null, 8, ["headline"])) : createCommentVNode("", true)
         ])
       ]);
@@ -11685,7 +11687,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   }
 });
 
-const NodeDescriptionTabs = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-822747b0"]]);
+const NodeDescriptionTabs = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-d2eb8e2e"]]);
 
 export { NodeDescriptionTabs, _sfc_main$5 as PortIcon };
 //# sourceMappingURL=nodes.js.map