@knime/kds-components 0.20.0 → 0.20.1

package/dist/index.css

@@ -1213,17 +1213,44 @@ html.kds-legacy {
   );
 }
 
-.checkbox-group[data-v-e2e58cad] {
+.kds-fieldset[data-v-a44731da] {
+  display: flex;
+  flex-direction: column;
+  min-inline-size: 0;
   padding: 0;
   margin: 0;
   border: none;
 }
-.options[data-v-e2e58cad] {
+.kds-fieldset-legend[data-v-a44731da] {
+  display: flex;
+  gap: var(--kds-spacing-container-0-12x);
+  align-items: center;
+  max-width: 100%;
+  min-height: var(--kds-dimension-component-height-0-75x);
+  padding: 0 0 var(--kds-spacing-input-label-spacing-bottom);
+}
+.kds-fieldset-content[data-v-a44731da] {
+  display: flex;
+  flex-direction: column;
+  gap: var(--kds-spacing-container-0-75x);
+}
+.legend-text[data-v-a44731da] {
+  display: block;
+  flex-grow: 1;
+  max-width: 100%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  font: var(--kds-font-base-title-small-strong);
+  color: var(--kds-color-text-and-icon-neutral);
+  white-space: nowrap;
+}
+
+.options[data-v-c6536296] {
   display: flex;
   flex-direction: column;
   gap: var(--kds-spacing-container-0-5x) var(--kds-spacing-container-0-75x);
 }
-.options.horizontal[data-v-e2e58cad] {
+.options.horizontal[data-v-c6536296] {
   flex-flow: row wrap;
   align-items: flex-start;
 }
@@ -1328,23 +1355,18 @@ html.kds-legacy {
 }
 }
 
-.radio-button-group[data-v-206fe061] {
-  padding: 0;
-  margin: 0;
-  border: none;
-}
-.options[data-v-206fe061] {
+.options[data-v-d78ed4a2] {
   display: flex;
   flex-direction: column;
   gap: var(--kds-spacing-container-0-5x) var(--kds-spacing-container-0-75x);
 }
-.options.horizontal[data-v-206fe061] {
+.options.horizontal[data-v-d78ed4a2] {
   flex-flow: row wrap;
   align-items: flex-start;
 }
 
 .option {
-&[data-v-65986f11] {
+&[data-v-5c6f0f1f] {
   display: flex;
   flex: 0 1 auto;
   gap: var(--kds-spacing-container-0-25x);
@@ -1366,54 +1388,57 @@ html.kds-legacy {
   border: var(--kds-border-action-transparent);
   border-radius: var(--kds-border-radius-container-0-25x);
 }
-&.size-small[data-v-65986f11] {
+&.size-small[data-v-5c6f0f1f] {
     height: var(--kds-dimension-component-height-1-25x);
     font: var(--kds-font-base-interactive-small-strong);
 }
-&[data-v-65986f11]:focus-visible {
+&[data-v-5c6f0f1f]:focus-visible {
     outline: none;
 }
-&[data-v-65986f11]:hover:not(:disabled) {
+&[data-v-5c6f0f1f]:focus:not(.selected) {
+    border: var(--kds-border-action-selected);
+}
+&[data-v-5c6f0f1f]:hover:not(:disabled) {
     background: var(--kds-color-background-neutral-hover);
 }
-&[data-v-65986f11]:active:not(:disabled) {
+&[data-v-5c6f0f1f]:active:not(:disabled) {
     background: var(--kds-color-background-neutral-active);
 }
 &.selected {
-&[data-v-65986f11] {
+&[data-v-5c6f0f1f] {
     color: var(--kds-color-text-and-icon-selected);
     background: var(--kds-color-background-selected-initial);
     border: var(--kds-border-action-selected);
 }
-&[data-v-65986f11]:hover:not(:disabled) {
+&[data-v-5c6f0f1f]:hover:not(:disabled) {
       background: var(--kds-color-background-selected-hover);
 }
-&[data-v-65986f11]:active:not(:disabled) {
+&[data-v-5c6f0f1f]:active:not(:disabled) {
       background: var(--kds-color-background-selected-active);
 }
 &.variant-muted {
-&[data-v-65986f11] {
+&[data-v-5c6f0f1f] {
       color: var(--kds-color-text-and-icon-neutral);
       background: var(--kds-color-background-input-initial);
 }
-&[data-v-65986f11]:hover:not(:disabled) {
+&[data-v-5c6f0f1f]:hover:not(:disabled) {
         background: var(--kds-color-background-input-hover);
 }
-&[data-v-65986f11]:active:not(:disabled) {
+&[data-v-5c6f0f1f]:active:not(:disabled) {
         background: var(--kds-color-background-input-active);
 }
 }
 }
-&.disabled[data-v-65986f11] {
+&.disabled[data-v-5c6f0f1f] {
     color: var(--kds-color-text-and-icon-disabled);
     cursor: default;
 }
-&.disabled.selected[data-v-65986f11] {
+&.disabled.selected[data-v-5c6f0f1f] {
     color: var(--kds-color-text-and-icon-disabled);
     border: var(--kds-border-action-disabled);
 }
 }
-.option-label[data-v-65986f11] {
+.option-label[data-v-5c6f0f1f] {
   min-width: 0;
   padding: 0 var(--kds-spacing-container-0-12x);
   overflow: hidden;
@@ -1422,16 +1447,11 @@ html.kds-legacy {
   white-space: nowrap;
 }
 
-.value-switch[data-v-2800bea3] {
-  display: flex;
-  flex-direction: column;
+.value-switch[data-v-640271e0] {
   align-items: flex-start;
-  padding: 0;
-  margin: 0;
-  border: none;
 }
 .options {
-&[data-v-2800bea3] {
+&[data-v-640271e0] {
   display: flex;
   flex-flow: row nowrap;
   gap: var(--kds-spacing-container-none);
@@ -1448,12 +1468,12 @@ html.kds-legacy {
   border-radius: var(--kds-border-radius-container-0-37x);
   box-shadow: var(--kds-fake-border-xs-muted);
   }
-&[data-v-2800bea3]:has(:focus-visible) {
+&[data-v-640271e0]:has(:focus-visible) {
     outline: var(--kds-border-action-focused);
     outline-offset: var(--kds-spacing-offset-focus);
     border-radius: var(--kds-border-radius-container-0-44x);
 }
-&.error[data-v-2800bea3] {
+&.error[data-v-640271e0] {
     border: var(--kds-border-action-error);
     box-shadow: none;
 }
@@ -1598,7 +1618,7 @@ html.kds-legacy {
   margin-left: var(--kds-spacing-container-0-12x);
 }
 
-.kds-text-input-suggestions[data-v-5a8cd710] {
+.kds-text-input-suggestions[data-v-1740ce83] {
   max-height: var(--kds-dimension-component-height-12x);
   background-color: var(--kds-color-surface-default);
   border-radius: var(--kds-border-radius-container-0-50x);