@elliemae/ds-basic 2.1.1-rc.1 → 3.0.0-next.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/css/dimsum.css +47 -29
  2. package/css/dimsum.min.css +1 -1
  3. package/css/dimsum.min.css.map +1 -1
  4. package/package.json +44 -44
  5. package/styles/components/packages/ds-treeview/Tree.scss +55 -43
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-basic",
3
- "version": "2.1.1-rc.1",
3
+ "version": "3.0.0-next.0",
4
4
  "license": "MIT",
5
5
  "description": "EllieMae UI Design System Library",
6
6
  "module": "./esm/index.js",
@@ -296,49 +296,49 @@
296
296
  "dev": "node ../../scripts/build/build.js -w"
297
297
  },
298
298
  "dependencies": {
299
- "@elliemae/ds-accordion": "2.1.1-rc.1",
300
- "@elliemae/ds-app-picker": "2.1.1-rc.1",
301
- "@elliemae/ds-backdrop": "2.1.1-rc.1",
302
- "@elliemae/ds-breadcrumb": "2.1.1-rc.1",
303
- "@elliemae/ds-button": "2.1.1-rc.1",
304
- "@elliemae/ds-button-group": "2.1.1-rc.1",
305
- "@elliemae/ds-card": "2.1.1-rc.1",
306
- "@elliemae/ds-circular-progress-indicator": "2.1.1-rc.1",
307
- "@elliemae/ds-form": "2.1.1-rc.1",
308
- "@elliemae/ds-grid": "2.1.1-rc.1",
309
- "@elliemae/ds-group-box": "2.1.1-rc.1",
310
- "@elliemae/ds-header": "2.1.1-rc.1",
311
- "@elliemae/ds-hidden": "2.1.1-rc.1",
312
- "@elliemae/ds-icon": "2.1.1-rc.1",
313
- "@elliemae/ds-indeterminate-progress-indicator": "2.1.1-rc.1",
314
- "@elliemae/ds-label-value": "2.1.1-rc.1",
315
- "@elliemae/ds-list-section-header": "2.1.1-rc.1",
316
- "@elliemae/ds-loading-indicator": "2.1.1-rc.1",
317
- "@elliemae/ds-menu": "2.1.1-rc.1",
318
- "@elliemae/ds-overlay": "2.1.1-rc.1",
319
- "@elliemae/ds-page-header": "2.1.1-rc.1",
320
- "@elliemae/ds-page-number": "2.1.1-rc.1",
321
- "@elliemae/ds-pills": "2.1.1-rc.1",
322
- "@elliemae/ds-popover": "2.1.1-rc.1",
323
- "@elliemae/ds-popper": "2.1.1-rc.1",
324
- "@elliemae/ds-portal": "2.1.1-rc.1",
325
- "@elliemae/ds-progress-indicator": "2.1.1-rc.1",
326
- "@elliemae/ds-read-more": "2.1.1-rc.1",
327
- "@elliemae/ds-resizeable-container": "2.1.1-rc.1",
328
- "@elliemae/ds-separator": "2.1.1-rc.1",
329
- "@elliemae/ds-side-panel": "2.1.1-rc.1",
330
- "@elliemae/ds-slider": "2.1.1-rc.1",
331
- "@elliemae/ds-spinner": "2.1.1-rc.1",
332
- "@elliemae/ds-tabs": "2.1.1-rc.1",
333
- "@elliemae/ds-text-wrapper": "2.1.1-rc.1",
334
- "@elliemae/ds-time-picker": "2.1.1-rc.1",
335
- "@elliemae/ds-toast": "2.1.1-rc.1",
336
- "@elliemae/ds-toolbar": "2.1.1-rc.1",
337
- "@elliemae/ds-tooltip": "2.1.1-rc.1",
338
- "@elliemae/ds-truncated-expandable-text": "2.1.1-rc.1",
339
- "@elliemae/ds-truncated-tooltip-text": "2.1.1-rc.1",
340
- "@elliemae/ds-zipcode-search": "2.1.1-rc.1",
341
- "@elliemae/ds-zoom": "2.1.1-rc.1"
299
+ "@elliemae/ds-accordion": "3.0.0-next.0",
300
+ "@elliemae/ds-app-picker": "3.0.0-next.0",
301
+ "@elliemae/ds-backdrop": "3.0.0-next.0",
302
+ "@elliemae/ds-breadcrumb": "3.0.0-next.0",
303
+ "@elliemae/ds-button": "3.0.0-next.0",
304
+ "@elliemae/ds-button-group": "3.0.0-next.0",
305
+ "@elliemae/ds-card": "3.0.0-next.0",
306
+ "@elliemae/ds-circular-progress-indicator": "3.0.0-next.0",
307
+ "@elliemae/ds-form": "3.0.0-next.0",
308
+ "@elliemae/ds-grid": "3.0.0-next.0",
309
+ "@elliemae/ds-group-box": "3.0.0-next.0",
310
+ "@elliemae/ds-header": "3.0.0-next.0",
311
+ "@elliemae/ds-hidden": "3.0.0-next.0",
312
+ "@elliemae/ds-icon": "3.0.0-next.0",
313
+ "@elliemae/ds-indeterminate-progress-indicator": "3.0.0-next.0",
314
+ "@elliemae/ds-label-value": "3.0.0-next.0",
315
+ "@elliemae/ds-list-section-header": "3.0.0-next.0",
316
+ "@elliemae/ds-loading-indicator": "3.0.0-next.0",
317
+ "@elliemae/ds-menu": "3.0.0-next.0",
318
+ "@elliemae/ds-overlay": "3.0.0-next.0",
319
+ "@elliemae/ds-page-header": "3.0.0-next.0",
320
+ "@elliemae/ds-page-number": "3.0.0-next.0",
321
+ "@elliemae/ds-pills": "3.0.0-next.0",
322
+ "@elliemae/ds-popover": "3.0.0-next.0",
323
+ "@elliemae/ds-popper": "3.0.0-next.0",
324
+ "@elliemae/ds-portal": "3.0.0-next.0",
325
+ "@elliemae/ds-progress-indicator": "3.0.0-next.0",
326
+ "@elliemae/ds-read-more": "3.0.0-next.0",
327
+ "@elliemae/ds-resizeable-container": "3.0.0-next.0",
328
+ "@elliemae/ds-separator": "3.0.0-next.0",
329
+ "@elliemae/ds-side-panel": "3.0.0-next.0",
330
+ "@elliemae/ds-slider": "3.0.0-next.0",
331
+ "@elliemae/ds-spinner": "3.0.0-next.0",
332
+ "@elliemae/ds-tabs": "3.0.0-next.0",
333
+ "@elliemae/ds-text-wrapper": "3.0.0-next.0",
334
+ "@elliemae/ds-time-picker": "3.0.0-next.0",
335
+ "@elliemae/ds-toast": "3.0.0-next.0",
336
+ "@elliemae/ds-toolbar": "3.0.0-next.0",
337
+ "@elliemae/ds-tooltip": "3.0.0-next.0",
338
+ "@elliemae/ds-truncated-expandable-text": "3.0.0-next.0",
339
+ "@elliemae/ds-truncated-tooltip-text": "3.0.0-next.0",
340
+ "@elliemae/ds-zipcode-search": "3.0.0-next.0",
341
+ "@elliemae/ds-zoom": "3.0.0-next.0"
342
342
  },
343
343
  "devDependencies": {
344
344
  "gulp": "~4.0.2",
package/styles/components/packages/ds-treeview/Tree.scss CHANGED
@@ -47,39 +47,26 @@ body > .#{$tree-item} {
47
47
  &-children-count-displayer {
48
48
  color: color(neutral, 500);
49
49
  }
50
- &--valid {
51
- &-drop-before {
52
- border-top-width: 2px;
53
- border-top-style: solid;
54
- border-top-color: color(brand-primary, 600);
55
- }
56
- &-drop-in {
57
- border-width: 2px;
58
- border-style: solid;
59
- border-color: color(brand-primary, 600);
60
- }
61
- &-drop-after {
62
- border-bottom-width: 2px;
63
- border-bottom-style: solid;
64
- border-bottom-color: color(brand-primary, 600);
65
- }
66
- }
67
- &--invalid {
68
- &-drop-before {
69
- border-top-width: 2px;
70
- border-top-style: solid;
71
- border-top-color: color(danger, 900);
72
- }
73
- &-drop-in {
74
- border-width: 2px;
75
- border-style: solid;
76
- border-color: color(danger, 900);
77
- }
78
- &-drop-after {
79
- border-bottom-width: 2px;
80
- border-bottom-style: solid;
81
- border-bottom-color: color(danger, 900);
82
- }
50
+ &--valid-drop-in:after {
51
+ content: '';
52
+ display: block;
53
+ position: absolute;
54
+ top: 0;
55
+ left: 0;
56
+ right: 0;
57
+ bottom: 0;
58
+ border: 2px solid color(brand-primary, 600);
59
+ }
60
+
61
+ &--invalid-drop-in:after {
62
+ content: '';
63
+ display: block;
64
+ position: absolute;
65
+ top: 0;
66
+ left: 0;
67
+ right: 0;
68
+ bottom: 0;
69
+ border: 2px solid color(danger, 900);
83
70
  }
84
71
 
85
72
  .#{$tree-item}__value {
@@ -107,20 +94,49 @@ body > .#{$tree-item} {
107
94
  }
108
95
 
109
96
  &.selected {
97
+ &:before {
98
+ content: '';
99
+ position: absolute;
100
+ top: 0;
101
+ left: 0;
102
+ width: 100%;
103
+ height: 100%;
104
+ border: 1px solid color(brand-primary, 500);
105
+ pointer-events: none;
106
+ }
110
107
  background-color: color(brand-primary, 200);
111
108
  }
112
109
 
110
+ &.drag-overlay {
111
+ box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.5);
112
+ border-radius: 2px;
113
+ }
114
+
113
115
  .drag-handle {
116
+ position: relative;
114
117
  transition: duration(fast) easing(base);
115
118
  align-items: center;
116
119
  display: flex;
117
- // height: 100%;
118
- // width: space(s) * 1.3;
120
+ height: 24px;
119
121
  visibility: visible;
120
122
  opacity: 1;
121
123
  margin-left: 8px;
122
-
123
- @include icon-color(color(neutral, 500));
124
+ outline: none;
125
+ cursor: grab;
126
+ &[data-isactive='true'],
127
+ &[data-isdragoverlay='true'] {
128
+ cursor: grabbing;
129
+ }
130
+ &.focuseable:focus:after {
131
+ content: '';
132
+ position: absolute;
133
+ top: 0;
134
+ left: 0;
135
+ width: 100%;
136
+ height: 100%;
137
+ border: 2px solid color(brand-primary, 700);
138
+ pointer-events: none;
139
+ }
124
140
  }
125
141
  .expandable-arrow {
126
142
  margin-left: 8px;
@@ -162,10 +178,6 @@ body > .#{$tree-item} {
162
178
  }
163
179
 
164
180
  &.hover {
165
- .drag-handle {
166
- @include icon-color(color(brand-primary, 800));
167
- }
168
-
169
181
  //Update from mixins when the correct states story comes
170
182
  background-color: color(neutral, 080);
171
183
 
@@ -180,13 +192,13 @@ body > .#{$tree-item} {
180
192
  border-radius: 0px;
181
193
  z-index: 1;
182
194
  &:before {
183
- content: "";
195
+ content: '';
184
196
  position: absolute;
185
197
  top: 0;
186
198
  left: 0;
187
199
  width: 100%;
188
200
  height: 100%;
189
- border: 1px solid color(brand-primary, 600);
201
+ border: 2px solid color(brand-primary, 700);
190
202
  pointer-events: none;
191
203
  }
192
204
  &.selected {