@elliemae/ds-basic 2.0.0-alpha.11 → 2.0.0-alpha.12

package/esm/form/ComboBox/index.js

@@ -1,3 +1,2 @@
 export * from '@elliemae/ds-form/ComboBox/v1/DSComboBox';
-export * from '@elliemae/ds-form/ComboBox/v2/Combobox';
 export { default as DSComboBox2, default } from '@elliemae/ds-form/ComboBox/v2/Combobox';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-basic",
-  "version": "2.0.0-alpha.11",
+  "version": "2.0.0-alpha.12",
   "license": "MIT",
   "description": "EllieMae UI Design System Library",
   "module": "./esm/index.js",
@@ -296,57 +296,54 @@
     "dev": "node ../../scripts/build/build.js -w"
   },
   "dependencies": {
-    "@elliemae/ds-accordion": "2.0.0-alpha.11",
-    "@elliemae/ds-app-picker": "2.0.0-alpha.11",
-    "@elliemae/ds-backdrop": "2.0.0-alpha.11",
-    "@elliemae/ds-breadcrumb": "2.0.0-alpha.11",
-    "@elliemae/ds-button": "2.0.0-alpha.11",
-    "@elliemae/ds-button-group": "2.0.0-alpha.11",
-    "@elliemae/ds-card": "2.0.0-alpha.11",
-    "@elliemae/ds-circular-progress-indicator": "2.0.0-alpha.11",
-    "@elliemae/ds-classnames": "2.0.0-alpha.11",
-    "@elliemae/ds-dropdownmenu": "2.0.0-alpha.11",
-    "@elliemae/ds-form": "2.0.0-alpha.11",
-    "@elliemae/ds-grid": "2.0.0-alpha.11",
-    "@elliemae/ds-group-box": "2.0.0-alpha.11",
-    "@elliemae/ds-header": "2.0.0-alpha.11",
-    "@elliemae/ds-hidden": "2.0.0-alpha.11",
-    "@elliemae/ds-icon": "2.0.0-alpha.11",
-    "@elliemae/ds-icons": "2.0.0-alpha.11",
-    "@elliemae/ds-indeterminate-progress-indicator": "2.0.0-alpha.11",
-    "@elliemae/ds-label-value": "2.0.0-alpha.11",
-    "@elliemae/ds-list-section-header": "2.0.0-alpha.11",
-    "@elliemae/ds-loading-indicator": "2.0.0-alpha.11",
-    "@elliemae/ds-menu": "2.0.0-alpha.11",
-    "@elliemae/ds-mobile": "2.0.0-alpha.11",
-    "@elliemae/ds-overlay": "2.0.0-alpha.11",
-    "@elliemae/ds-page-header": "2.0.0-alpha.11",
-    "@elliemae/ds-page-number": "2.0.0-alpha.11",
-    "@elliemae/ds-pills": "2.0.0-alpha.11",
-    "@elliemae/ds-popover": "2.0.0-alpha.11",
-    "@elliemae/ds-popper": "2.0.0-alpha.11",
-    "@elliemae/ds-portal": "2.0.0-alpha.11",
-    "@elliemae/ds-progress-indicator": "2.0.0-alpha.11",
-    "@elliemae/ds-read-more": "2.0.0-alpha.11",
-    "@elliemae/ds-resizeable-container": "2.0.0-alpha.11",
-    "@elliemae/ds-separator": "2.0.0-alpha.11",
-    "@elliemae/ds-shared": "2.0.0-alpha.11",
-    "@elliemae/ds-side-panel": "2.0.0-alpha.11",
-    "@elliemae/ds-slider": "2.0.0-alpha.11",
-    "@elliemae/ds-spinner": "2.0.0-alpha.11",
-    "@elliemae/ds-system": "2.0.0-alpha.11",
-    "@elliemae/ds-tabs": "2.0.0-alpha.11",
-    "@elliemae/ds-text-wrapper": "2.0.0-alpha.11",
-    "@elliemae/ds-time-picker": "2.0.0-alpha.11",
-    "@elliemae/ds-toast": "2.0.0-alpha.11",
-    "@elliemae/ds-toolbar": "2.0.0-alpha.11",
-    "@elliemae/ds-tooltip": "2.0.0-alpha.11",
-    "@elliemae/ds-truncated-expandable-text": "2.0.0-alpha.11",
-    "@elliemae/ds-truncated-tooltip-text": "2.0.0-alpha.11",
-    "@elliemae/ds-utilities": "2.0.0-alpha.11",
-    "@elliemae/ds-zipcode-search": "2.0.0-alpha.11",
-    "@elliemae/ds-zoom": "2.0.0-alpha.11",
-    "react-dates": "~18.5.0"
+    "@elliemae/ds-accordion": "2.0.0-alpha.12",
+    "@elliemae/ds-app-picker": "2.0.0-alpha.12",
+    "@elliemae/ds-backdrop": "2.0.0-alpha.12",
+    "@elliemae/ds-breadcrumb": "2.0.0-alpha.12",
+    "@elliemae/ds-button": "2.0.0-alpha.12",
+    "@elliemae/ds-button-group": "2.0.0-alpha.12",
+    "@elliemae/ds-card": "2.0.0-alpha.12",
+    "@elliemae/ds-circular-progress-indicator": "2.0.0-alpha.12",
+    "@elliemae/ds-form": "2.0.0-alpha.12",
+    "@elliemae/ds-grid": "2.0.0-alpha.12",
+    "@elliemae/ds-group-box": "2.0.0-alpha.12",
+    "@elliemae/ds-header": "2.0.0-alpha.12",
+    "@elliemae/ds-hidden": "2.0.0-alpha.12",
+    "@elliemae/ds-icon": "2.0.0-alpha.12",
+    "@elliemae/ds-indeterminate-progress-indicator": "2.0.0-alpha.12",
+    "@elliemae/ds-label-value": "2.0.0-alpha.12",
+    "@elliemae/ds-list-section-header": "2.0.0-alpha.12",
+    "@elliemae/ds-loading-indicator": "2.0.0-alpha.12",
+    "@elliemae/ds-menu": "2.0.0-alpha.12",
+    "@elliemae/ds-overlay": "2.0.0-alpha.12",
+    "@elliemae/ds-page-header": "2.0.0-alpha.12",
+    "@elliemae/ds-page-number": "2.0.0-alpha.12",
+    "@elliemae/ds-pills": "2.0.0-alpha.12",
+    "@elliemae/ds-popover": "2.0.0-alpha.12",
+    "@elliemae/ds-popper": "2.0.0-alpha.12",
+    "@elliemae/ds-portal": "2.0.0-alpha.12",
+    "@elliemae/ds-progress-indicator": "2.0.0-alpha.12",
+    "@elliemae/ds-read-more": "2.0.0-alpha.12",
+    "@elliemae/ds-resizeable-container": "2.0.0-alpha.12",
+    "@elliemae/ds-separator": "2.0.0-alpha.12",
+    "@elliemae/ds-side-panel": "2.0.0-alpha.12",
+    "@elliemae/ds-slider": "2.0.0-alpha.12",
+    "@elliemae/ds-spinner": "2.0.0-alpha.12",
+    "@elliemae/ds-tabs": "2.0.0-alpha.12",
+    "@elliemae/ds-text-wrapper": "2.0.0-alpha.12",
+    "@elliemae/ds-time-picker": "2.0.0-alpha.12",
+    "@elliemae/ds-toast": "2.0.0-alpha.12",
+    "@elliemae/ds-toolbar": "2.0.0-alpha.12",
+    "@elliemae/ds-tooltip": "2.0.0-alpha.12",
+    "@elliemae/ds-truncated-expandable-text": "2.0.0-alpha.12",
+    "@elliemae/ds-truncated-tooltip-text": "2.0.0-alpha.12",
+    "@elliemae/ds-zipcode-search": "2.0.0-alpha.12",
+    "@elliemae/ds-zoom": "2.0.0-alpha.12"
+  },
+  "devDependencies": {
+    "gulp": "~4.0.2",
+    "gulp-debug": "~4.0.0",
+    "gulp-rename": "~2.0.0"
   },
   "peerDependencies": {
     "lodash": "^4.17.21",

package/styles/components/index.scss

@@ -27,7 +27,6 @@
 @import 'packages/ds-progress-indicator/DSProgressIndicator';
 @import 'packages/ds-spinner/DSSpinner';
 @import 'packages/ds-loading-indicator/DSLoadingIndicator';
-@import 'packages/ds-tabs/DSTabs';
 @import 'packages/ds-tooltip/v1/DSTooltip';
 @import 'packages/ds-popover/DSPopover';
 @import 'packages/ds-overlay/DSOverlay';
@@ -48,7 +47,6 @@
 @import 'packages/ds-page-number/DSPageNumber';
 @import 'packages/ds-zipcode-search/DSZipCodeSearch';
 @import 'packages/ds-circular-progress-indicator/DSCircularProgressIndicator';
-@import 'packages/ds-app-picker/DSAppPicker';
 
 @import '~react-dates/lib/css/_datepicker.css';
 

package/styles/components/packages/ds-basic/index.scss

@@ -29,7 +29,6 @@
 @import '../../ds-toast/src/DSToast';
 @import '../../ds-spinner/src/DSSpinner';
 @import '../../ds-loading-indicator/src/DSLoadingIndicator';
-@import '../../ds-tabs/src/DSTabs';
 @import '../../ds-tooltip/src/v1/DSTooltip';
 @import '../../ds-popover/src/DSPopover';
 @import '../../ds-overlay/src/DSOverlay';
@@ -50,4 +49,3 @@
 @import '../../ds-page-number/src/DSPageNumber';
 @import '../../ds-zipcode-search/src/DSZipCodeSearch';
 @import '../../ds-circular-progress-indicator/src/DSCircularProgressIndicator';
-@import '../../ds-app-picker/src/DSAppPicker';

package/styles/components/packages/ds-basic/styles/dist-index.scss

@@ -27,7 +27,6 @@
 @import 'packages/ds-progress-indicator/DSProgressIndicator';
 @import 'packages/ds-spinner/DSSpinner';
 @import 'packages/ds-loading-indicator/DSLoadingIndicator';
-@import 'packages/ds-tabs/DSTabs';
 @import 'packages/ds-tooltip/v1/DSTooltip';
 @import 'packages/ds-popover/DSPopover';
 @import 'packages/ds-overlay/DSOverlay';
@@ -48,7 +47,6 @@
 @import 'packages/ds-page-number/DSPageNumber';
 @import 'packages/ds-zipcode-search/DSZipCodeSearch';
 @import 'packages/ds-circular-progress-indicator/DSCircularProgressIndicator';
-@import 'packages/ds-app-picker/DSAppPicker';
 
 @import '~react-dates/lib/css/_datepicker.css';
 

package/styles/components/packages/ds-button/DSButton.scss

@@ -52,7 +52,7 @@ $text-disabled: #5c6574;
   position: relative;
 
   &:after {
-    content: "";
+    content: '';
     position: absolute;
     top: 0;
     left: 0;
@@ -236,7 +236,7 @@ div.#{$btn-el} {
 
   @at-root .#{$input-addon-group}__addon {
     .#{$btn-el-text} {
-      border: $border-type color(neutral, 200);
+      border: $border-type color(neutral, 400);
     }
   }
 
@@ -288,7 +288,7 @@ div.#{$btn-el} {
 
 // ********************************************
 // Secondary
-.#{$btn-el-secondary}{
+.#{$btn-el-secondary} {
   color: color(brand-primary, 600);
   background-color: color(neutral, 000);
   border: $border-type color(neutral, 400);
@@ -296,7 +296,7 @@ div.#{$btn-el} {
 
   @at-root .#{$input-addon-group}__addon {
     .#{$btn-el-secondary} {
-      border: $border-type color(neutral, 200);
+      border: $border-type color(neutral, 400);
     }
   }
 
@@ -393,10 +393,10 @@ div.#{$btn-el} {
 }
 
 $intent-colors: (
-  "success": color("success", 900),
-  "danger": color("danger", 900),
-  "warning": color("warning", 900),
-  "info": color("brand-primary", 600),
+  'success': color('success', 900),
+  'danger': color('danger', 900),
+  'warning': color('warning', 900),
+  'info': color('brand-primary', 600),
 );
 
 @each $intent, $color in $intent-colors {
@@ -425,7 +425,7 @@ $intent-colors: (
     &:hover:not([disabled]),
     &.#{$btn-el-vhover} {
       color: $color;
-      
+
       span.label-wrapper.no-icon {
         &:before {
           background-color: transparent;

package/styles/components/packages/ds-date-picker/components/DatePickerPicker/DatePickerPicker.scss

@@ -1,9 +1,8 @@
 .#{$el-icon} {
-  border: $border-type color(neutral, 200);
   @include border-radius(0 $radius $radius 0);
   padding: 0 calc(#{space(xxs)} * 0.5);
 
-  &:hover:not([disabled]) {    
+  &:hover:not([disabled]) {
     border: $border-type color(brand-primary, 600);
   }
 

package/styles/components/packages/ds-form/LargeInputText/DSLargeInputText.scss

@@ -34,7 +34,7 @@ $min-height: space(m) * 1.17;
   background: color(neutral, 000);
   transition: border duration(base) easing(base);
   @include border-radius($radius);
-  @include dsFakeBorder();
+  box-shadow: inset 0 0 0 1px color(neutral, 400);
   padding: 1px;
   &:focus-within {
     padding: 0;

package/styles/components/packages/ds-form/Radio/DSRadio.scss

@@ -238,8 +238,10 @@ $border-type-focus-mobile: solid 3px;
   }
 
   .#{$el-container-error} {
-    .#{$el-button} {
-      border: $border-type-mobile color(danger, 900);
+    .#{$el-label} { // added this specificity so it correctly overwrites the error state
+      .#{$el-button} {
+        border: $border-type-mobile color(danger, 900);
+      }
     }
   }
 }

package/styles/dist-index.scss

@@ -27,7 +27,6 @@
 @import 'packages/ds-progress-indicator/DSProgressIndicator';
 @import 'packages/ds-spinner/DSSpinner';
 @import 'packages/ds-loading-indicator/DSLoadingIndicator';
-@import 'packages/ds-tabs/DSTabs';
 @import 'packages/ds-tooltip/v1/DSTooltip';
 @import 'packages/ds-popover/DSPopover';
 @import 'packages/ds-overlay/DSOverlay';
@@ -48,7 +47,6 @@
 @import 'packages/ds-page-number/DSPageNumber';
 @import 'packages/ds-zipcode-search/DSZipCodeSearch';
 @import 'packages/ds-circular-progress-indicator/DSCircularProgressIndicator';
-@import 'packages/ds-app-picker/DSAppPicker';
 
 @import '~react-dates/lib/css/_datepicker.css';
 

package/types/form/ComboBox/index.d.ts

@@ -1,4 +1,3 @@
 export * from '@elliemae/ds-form/ComboBox/v1/DSComboBox';
-export * from '@elliemae/ds-form/ComboBox/v2/Combobox';
 export { default } from '@elliemae/ds-form/ComboBox/v2/Combobox';
 export { default as DSComboBox2 } from '@elliemae/ds-form/ComboBox/v2/Combobox';

package/styles/components/packages/ds-app-picker/DSAppPicker.scss

@@ -1,161 +0,0 @@
-$app-picker: #{$prefix}-app-picker;
-$wrapper: #{$app-picker}__wrapper;
-$grid: #{$app-picker}__grid;
-$row: #{$app-picker}__row;
-$chip: #{$app-picker}__chip;
-$chip-label: #{$app-picker}__chip-label;
-$title: #{$app-picker}__section-title;
-$separator: #{$app-picker}__separator;
-$arrow: #{$app-picker}__arrow;
-
-.#{$wrapper} {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  min-width: 244px;
-  max-height: 449px;
-  overflow-y: scroll;
-  padding: 4px 0;
-  margin: 0 auto;
- 
-  &:focus {
-    outline: none;
-  }
-}
-
-.#{$arrow} {
-  position: relative;
-  top: -21px;
-  margin: 0;
-  fill: #fff;
-}
-
-.#{$grid} {
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
-  width: 100%;
-  padding: 0 8px;
-}
-
-.#{$row} {
-  display: flex;
-  width: 100%;
-}
-
-.#{$title} {
-  color: color('neutral', 700);
-  font-size: font-size(200);
-  font-weight: bold;
-  margin: 8px 0 4px 0;
-  line-height: 1;
-  text-transform: uppercase;
-}
-
-.#{$chip} {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  border-radius: 2%;
-  padding: 8px 0 4px 0;
-  margin: 4px;
-  height: 68px;
-  width: 68px;
-  line-height: 1px;
-  background-color: #fff;
-  color: color('brand-primary', 600);
-  cursor: pointer;
-  border: 2px solid transparent;
-
-  &:hover {
-    color: color('brand-primary', 800);
-    background-color: color('brand-primary', 200);
-    .app-picker__icon {
-      fill: color('brand-primary', 800);
-    }
-  }
-
-  &:focus {
-    outline: none;
-    border: 2px solid color('brand-primary', 800);
-  }
-
-  &--disabled {
-    color: color('neutral', 500);
-    cursor: not-allowed;
-
-    .app-picker__icon {
-      fill: color('neutral', 500);
-    }
-   
-    &:focus,
-    &:hover {
-      background-color: #fff;
-      cursor: not-allowed;
-      border: 2px solid transparent;
-
-      .#{$chip-label} {
-        color: color('neutral', 500);
-      }
-    }
-    
-    &:hover .app-picker__icon {
-      fill: color('neutral', 500);
-    }
-  }
-
-  &--selected {
-    color: color('brand-primary', 800);
-    background-color: color('brand-primary', 200);
-    position: relative;
-
-    .app-picker__icon {
-      fill: color('brand-primary', 800);
-    }
-
-    &:focus {
-      border: 2px solid transparent;
-      &::after {
-        border: 2px solid color('brand-primary', 800);
-      }
-    }
-
-    &::after {
-      position: absolute;
-      content: '';
-      top: -2px;
-      left: -2px;
-      width: calc(100% + 4px);
-      height: calc(100% + 4px);
-      border: 1px solid color('brand-primary', 600);
-      border-radius: 2px;
-    }
-  }
-}
-
-.app-picker__icon {
-  fill: color('brand-primary', 600);
-}
-
-#app-picker__button {
-  &:hover {
-    background-color: transparent;
-  }
-}
-
-.#{$chip-label} {
-  font-size: font-size(200);
-  font-weight: 600;
-  word-wrap: break-word;
-  margin: 4px 0;
-  line-height: 12px;
-  text-overflow: ellipsis;
-}
-
-.#{$separator} {
-  border-top: 1px solid color('neutral', 100);
-  border-bottom: none;
-  width: 99%;
-  margin-bottom: 0;
-}