carbon-components-svelte 0.95.2 → 0.97.0

package/css/_slider.scss

@@ -0,0 +1,57 @@
+// This file adds slider validation message styles from carbon-components v11+
+// to ensure compatibility with carbon-components v10.58.12.
+// The validation message feature provides consistency with other input components.
+
+//
+// Copyright IBM Corp. 2016, 2023
+//
+// This source code is licensed under the Apache-2.0 license found in the
+// LICENSE file in the root directory of this source tree.
+//
+
+@import 'carbon-components/scss/globals/scss/vars';
+@import 'carbon-components/scss/globals/scss/helper-mixins';
+@import 'carbon-components/scss/globals/scss/vendor/@carbon/elements/scss/import-once/import-once';
+
+/// Slider validation message styles
+/// @access private
+/// @group slider
+@mixin slider-validation {
+  //----------------------------------------------
+  // Validation message
+  // ---------------------------------------------
+  .#{$prefix}--slider__validation-msg.#{$prefix}--form-requirement {
+    display: block;
+    overflow: visible;
+    max-height: 100%;
+  }
+
+  .#{$prefix}--slider__validation-msg--invalid {
+    color: $text-error;
+  }
+
+  //----------------------------------------------
+  // Readonly state
+  // ---------------------------------------------
+  .#{$prefix}--slider--readonly.#{$prefix}--slider {
+    cursor: default;
+  }
+
+  .#{$prefix}--slider-container--readonly .#{$prefix}--slider__thumb {
+    height: 0;
+    width: 0;
+
+    &::before,
+    &::after {
+      display: none;
+    }
+  }
+
+  .#{$prefix}--slider-container--readonly .#{$prefix}--slider-text-input {
+    background-color: transparent;
+  }
+}
+
+@include exports('slider-validation') {
+  @include slider-validation;
+}

package/css/_stack.scss

@@ -86,6 +86,46 @@
   .#{$prefix}--stack-scale-13 {
     gap: 10rem;
   }
+
+  .#{$prefix}--stack-align-start {
+    align-items: flex-start;
+  }
+
+  .#{$prefix}--stack-align-center {
+    align-items: center;
+  }
+
+  .#{$prefix}--stack-align-end {
+    align-items: flex-end;
+  }
+
+  .#{$prefix}--stack-align-baseline {
+    align-items: baseline;
+  }
+
+  .#{$prefix}--stack-justify-start {
+    justify-content: flex-start;
+  }
+
+  .#{$prefix}--stack-justify-center {
+    justify-content: center;
+  }
+
+  .#{$prefix}--stack-justify-end {
+    justify-content: flex-end;
+  }
+
+  .#{$prefix}--stack-justify-space-between {
+    justify-content: space-between;
+  }
+
+  .#{$prefix}--stack-justify-space-around {
+    justify-content: space-around;
+  }
+
+  .#{$prefix}--stack-justify-space-evenly {
+    justify-content: space-evenly;
+  }
 }
 
 @include exports('stack') {