@elliemae/ds-basic 3.0.0-alpha.2 → 3.0.0-next.10

package/dist/styles/components/packages/ds-common/Input/DSInput.scss

@@ -37,15 +37,24 @@ $input-height: space(m) * 1.17; // TODO: define global input sizes
 @mixin withActive() {
   border: calc(#{space(xxs)} * 0.25) solid color(brand-primary, 600);
 }
+
 @mixin withDisabled() {
-  border: calc(#{space(xxs)} * 0.25) solid color(neutral, 400);
-  background: color(neutral, 100) !important;
+  border: 1px solid color(neutral, 400);
+  background: color(neutral, 080) !important;
   color: #616b7f;
+  -webkit-text-fill-color: #616b7f;
+  opacity: 1;
 }
+
 @mixin withReadOnly() {
   border: none;
-  border-top: calc(#{space(xxs)} * 0.25) solid color(neutral, 400);
+  border-top: 1px solid color(neutral, 400);
+  border-bottom: 1px solid transparent;
+  border-left: 1px solid transparent;
+  border-right: 1px solid transparent;
   background: none;
+  border-radius: 0;
+  color: color(neutral, 500);
 }
 
 @mixin withError() {
@@ -67,13 +76,13 @@ $input-height: space(m) * 1.17; // TODO: define global input sizes
   @include border-radius($radius);
   border: $border-type color(neutral, 400);
   text-overflow: ellipsis;
-  
+
   &::-ms-clear {
     display: none;
   }
   &:-webkit-autofill,
   &:-webkit-autofill:hover,
-  &:-webkit-autofill:focus textarea:-webkit-autofill{
+  &:-webkit-autofill:focus textarea:-webkit-autofill {
     margin: 2px;
     height: calc(#{$input-height} - 4px);
     // -webkit-box-shadow: 0 0 0px 1000px #ffffff inset !important; // fix chrome autocomplete
@@ -82,11 +91,12 @@ $input-height: space(m) * 1.17; // TODO: define global input sizes
   &:not(.floating-label-input-controller):hover {
     @include dsHover();
 
-    &:active, &:focus {
-      @include dsFocus(); 
+    &:active,
+    &:focus {
+      @include dsFocus();
     }
   }
-   
+
   &:active {
     color: color(neutral, 800);
     @include dsActive();
@@ -103,11 +113,16 @@ $input-height: space(m) * 1.17; // TODO: define global input sizes
     @include dsFocus();
   }
 
-  &:disabled, &.input-disabled {
+  &:disabled,
+  &.input-disabled {
     @include withDisabled();
     @include placeholder {
-      color: #5C6574;
-    }   
+      color: #5c6574;
+    }
+  }
+
+  &.read-only {
+    @include withReadOnly();
   }
 }
 
@@ -123,24 +138,24 @@ $input-height: space(m) * 1.17; // TODO: define global input sizes
       color: color(brand-primary, 600);
       background-color: transparent;
       .em-ds-icon {
-        fill: color(brand-primary, 600);  
-      }   
+        fill: color(brand-primary, 600);
+      }
       &:focus {
         border: unset;
       }
-    }    
+    }
   }
 
   &:hover {
     .#{$el-addon} .#{$el-clearable-button} {
       opacity: 1;
-      @include dsHover();    
+      @include dsHover();
       background-color: transparent;
       .em-ds-icon {
-        fill: color(brand-primary, 600);  
-      } 
-    }    
-  }  
+        fill: color(brand-primary, 600);
+      }
+    }
+  }
 }
 
 .#{$el-input} {
@@ -150,7 +165,6 @@ $input-height: space(m) * 1.17; // TODO: define global input sizes
   border: none;
 }
 
-
 .#{$input-addons} {
   .#{$el-clearable-button} {
     margin-left: auto;
@@ -160,9 +174,10 @@ $input-height: space(m) * 1.17; // TODO: define global input sizes
     max-height: 100%;
     outline: none;
     .em-ds-icon {
-      fill: color(brand-primary, 600);  
-    }   
-    &:hover, &:hover::after {
+      fill: color(brand-primary, 600);
+    }
+    &:hover,
+    &:hover::after {
       opacity: 1;
       border: none;
     }
@@ -174,8 +189,8 @@ $input-height: space(m) * 1.17; // TODO: define global input sizes
   border-color: transparent;
   background: none;
   .em-ds-icon {
-    fill: color(brand-primary, 600);  
-  }   
+    fill: color(brand-primary, 600);
+  }
   &:hover {
     opacity: 1;
   }
@@ -215,10 +230,8 @@ $input-height: space(m) * 1.17; // TODO: define global input sizes
 // ********************************************
 // ReadOnly container & elements          *****
 .#{$input-read-only} {
-  border-color: color(neutral, 100);
-  cursor: not-allowed;
   .#{$el-input} {
-    color: color(neutral, 500);
+    @include withReadOnly();
   }
 }
 

package/dist/styles/components/packages/ds-form/Checkbox/DSCheckbox.scss

@@ -1 +1 @@
-@import '../../../ds-common/src/Checkbox/DSCheckbox';
+@import '../../../ds-common/src/Checkbox/DSCheckbox.scss';

package/dist/styles/components/packages/ds-form/ComboBox/DSComboBox.scss

@@ -1 +1 @@
-@import '../../../ds-common/src/ComboBox/DSComboBox';
+@import '../../../ds-common/src/ComboBox/DSComboBox.scss';

package/dist/styles/components/packages/ds-form/ComboBox/v1/DSComboBox.scss

@@ -1 +1 @@
-@import '../../../../ds-common/src/ComboBox/v1/DSComboBox';
+// ToDo: This file has been moved to ds-common. it will be removed from here in the next major release.

package/dist/styles/components/packages/ds-form/ComboBox/v2/DSComboBox.scss

@@ -1 +1 @@
-@import '../../../../ds-common/src/ComboBox/v2/DSComboBox';
+// ToDo: This file has been moved to ds-common. it will be removed from here in the next major release.

package/dist/styles/components/packages/ds-form/ComboBox/v2/styles/container.scss

@@ -1 +1 @@
-@import '../../../../../ds-common/src/ComboBox/v2/styles/container';
+// ToDo: This file has been moved to ds-common. it will be removed from here in the next major release.

package/dist/styles/components/packages/ds-form/ComboBox/v2/styles/customOptions.scss

@@ -1 +1 @@
-@import '../../../../../ds-common/src/ComboBox/v2/styles/customOptions';
+// ToDo: This file has been moved to ds-common. it will be removed from here in the next major release.

package/dist/styles/components/packages/ds-form/ComboBox/v2/styles/dropdownIndicator.scss

@@ -1 +1 @@
-@import '../../../../../ds-common/src/ComboBox/v2/styles/dropdownIndicator.scss';
+// ToDo: This file has been moved to ds-common. it will be removed from here in the next major release.

package/dist/styles/components/packages/ds-form/ComboBox/v2/styles/indicatorSeparator.scss

@@ -1 +1 @@
-@import '../../../../../ds-common/src/ComboBox/v2/styles/indicatorSeparator';
+// ToDo: This file has been moved to ds-common. it will be removed from here in the next major release.

package/dist/styles/components/packages/ds-form/ComboBox/v2/styles/menu.scss

@@ -1 +1 @@
-@import '../../../../../ds-common/src/ComboBox/v2/styles/menu';
+// ToDo: This file has been moved to ds-common. it will be removed from here in the next major release.

package/dist/styles/components/packages/ds-form/ComboBox/v2/styles/optionMultiple.scss

@@ -1 +1 @@
-@import '../../../../../ds-common/src/ComboBox/v2/styles/optionMultiple';
+// ToDo: This file has been moved to ds-common. it will be removed from here in the next major release.

package/dist/styles/components/packages/ds-form/ComboBox/v2/styles/placeholder.scss

@@ -1 +1 @@
-@import '../../../../../ds-common/src/ComboBox/v2/styles/placeholder';
+// ToDo: This file has been moved to ds-common. it will be removed from here in the next major release.

package/dist/styles/components/packages/ds-form/ComboBox/v2/styles/valueContainer.scss

@@ -1 +1 @@
-@import '../../../../../ds-common/src/ComboBox/v2/styles/valueContainer';
+// ToDo: This file has been moved to ds-common. it will be removed from here in the next major release.

package/dist/styles/components/packages/ds-form/ComboBox/v2/styles/wrapper.scss

@@ -1 +1 @@
-@import '../../../../../ds-common/src/ComboBox/v2/styles/wrapper';
+// ToDo: This file has been moved to ds-common. it will be removed from here in the next major release.

package/dist/styles/components/packages/ds-form/Input/DSInput.scss

@@ -1 +1 @@
-@import '../../../ds-common/src/Input/DSInput';
+@import '../../../ds-common/src/Input/DSInput.scss';

package/dist/styles/components/packages/ds-form/Input/InputAddonWrapper.scss

@@ -1 +1 @@
-@import '../../../ds-common/src/Input/InputAddonWrapper';
+@import '../../../ds-common/src/Input/InputAddonWrapper.scss';

package/dist/styles/components/packages/ds-form/SearchBox/DSSearchBox.scss

@@ -1 +1 @@
-@import '../../../ds-common/src/SearchBox/DSSearchBox';
+@import '../../../ds-common/src/SearchBox/DSSearchBox.scss';

package/dist/styles/components/packages/ds-treeview/Tree.scss

@@ -110,6 +110,15 @@ body > .#{$tree-item} {
   &.drag-overlay {
     box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.5);
     border-radius: 2px;
+    padding-right: space(xs);
+  }
+
+  &--dragging {
+    background-color: color(neutral, 080);
+    color: color(neutral, 500);
+    .#{$dsicon} {
+      @include icon-color(color(neutral, 500));
+    }
   }
 
   .drag-handle {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-basic",
-  "version": "3.0.0-alpha.2",
+  "version": "3.0.0-next.10",
   "license": "MIT",
   "description": "EllieMae UI Design System Library",
   "files": [