@dataloop-ai/components 0.20.53 → 0.20.55

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dataloop-ai/components",
-  "version": "0.20.53",
+  "version": "0.20.55",
   "exports": {
     ".": "./index.ts",
     "./models": "./models.ts",
@@ -23,7 +23,7 @@
     "check-only": "if grep -E -H -r --exclude-dir=.git --exclude-dir=node_modules --exclude=*.json --exclude=*.yml '^(describe|it).only' .; then echo 'Found only in test files' && exit 1; fi"
   },
   "dependencies": {
-    "@dataloop-ai/icons": "^3.0.152",
+    "@dataloop-ai/icons": "^3.0.158",
     "@types/flat": "^5.0.2",
     "@types/lodash": "^4.14.184",
     "@types/sortablejs": "^1.15.7",

package/src/components/compound/DlInput/DlInput.vue

@@ -1358,6 +1358,8 @@ export default defineComponent({
 }
 
 .dl-input {
+    display: flex;
+    align-items: center;
     margin: var(--dl-input-margin);
 
     /* Chrome, Safari, Edge, Opera */
@@ -1372,9 +1374,6 @@ export default defineComponent({
         -moz-appearance: textfield;
     }
 
-    display: flex;
-    align-items: center;
-
     &--dense {
         padding: 0;
     }

package/src/components/compound/DlInput/components/InputFileElement.vue

@@ -67,6 +67,7 @@ export default defineComponent({
 
 <style lang="scss" scoped>
 .input-file-element {
+    padding: 5px;
     position: relative;
     &--default {
         display: flex;
@@ -86,7 +87,6 @@ export default defineComponent({
     &--icon {
         cursor: pointer;
     }
-    padding: 5px;
 }
 .file-image {
     width: 100px;

package/src/components/compound/DlOptionGroup/DlOptionGroup.vue

@@ -196,10 +196,10 @@ export default defineComponent({
 }
 
 .disabled {
+    color: var(--dl-color-disabled);
     cursor: not-allowed;
     & label {
         cursor: not-allowed;
     }
-    color: var(--dl-color-disabled);
 }
 </style>

package/src/components/compound/DlPagination/components/QuickNavigation.vue

@@ -113,6 +113,8 @@ export default defineComponent({
         padding-left: 5px;
         padding-right: 5px;
         font-size: 10px;
+        max-width: 30px; // 40px - 10px (paddings)
+        -moz-appearance: textfield;
         &::-webkit-outer-spin-button,
         &::-webkit-inner-spin-button {
             -webkit-appearance: none;
@@ -135,8 +137,6 @@ export default defineComponent({
                 border-color: var(--dl-color-disabled);
             }
         }
-        max-width: 30px; // 40px - 10px (paddings)
-        -moz-appearance: textfield;
     }
 }
 

package/src/components/compound/DlSelect/DlSelect.vue

@@ -1193,10 +1193,10 @@ export default defineComponent({
             width: calc(100% - var(--dl-select-expand-icon-width));
             padding: 0;
             padding-right: var(--dl-select-expand-icon-width);
+            height: auto;
             .adornment-container {
                 height: 100%;
             }
-            height: auto;
 
             &__with-prepend {
                 padding-left: 30px;

package/src/components/compound/DlTable/styles/dl-table-styles.scss

@@ -3,6 +3,11 @@
 }
 
 .dl-table {
+    width: 100%;
+    max-width: 100%;
+    border-collapse: separate;
+    border-spacing: 0;
+
     .vertical-border {
         border-left: 1px solid var(--dl-color-separator);
         border-right: 1px solid var(--dl-color-separator);
@@ -71,11 +76,6 @@
         justify-content: center;
     }
 
-    width: 100%;
-    max-width: 100%;
-    border-collapse: separate;
-    border-spacing: 0;
-
     &__drag-icon>div {
         transition: all ease-in 0.1s;
         opacity: 0;

package/src/components/compound/DlTabs/components/DlTab.vue

@@ -118,6 +118,8 @@ export default defineComponent({
     display: flex;
     align-items: center;
     justify-content: center;
+    cursor: pointer;
+    flex-grow: 1;
     .tab-icon {
         margin: 0px 8px 0px 5px;
         color: var(--dl-color-medium);
@@ -167,8 +169,6 @@ export default defineComponent({
     &--no-border-bottom {
         border-bottom: unset;
     }
-    cursor: pointer;
-    flex-grow: 1;
 }
 
 .info-icon {

package/src/components/compound/DlThumbnailGallery/DlThumbnailGallery.vue

@@ -232,13 +232,13 @@ export default defineComponent({
             max-width: 60px;
             max-height: 60px;
             transition: 0.1s;
+            cursor: pointer;
+            background-color: var(--dl-color-text-buttons);
+            padding: var(--img-padding);
             &:hover {
                 transform: scale(1.1);
                 outline: 1px solid var(--dl-color-hover) !important;
             }
-            cursor: pointer;
-            background-color: var(--dl-color-text-buttons);
-            padding: var(--img-padding);
         }
         &--image img {
             pointer-events: none;

package/src/components/essential/DlMenu/DlMenu.vue

@@ -536,12 +536,12 @@ export default defineComponent({
     border-radius: 2px;
     overflow-y: auto;
     overflow-x: hidden;
-    &::-webkit-scrollbar {
-        width: var(--dl-menu-scrollbar-width, 5px);
-    }
     outline: 0;
     max-height: 65vh;
     z-index: var(--menu-z-index);
+    &::-webkit-scrollbar {
+        width: var(--dl-menu-scrollbar-width, 5px);
+    }
 
     &--square {
         border-radius: 0;

package/src/components/essential/DlTypography/DlTypography.vue

@@ -96,6 +96,11 @@ export default defineComponent({
 .dl-typography {
     margin: 0;
     padding: 0;
+
+    // important needed below for sizing of h tags.. quasar conflict
+    // to deal with quasar conflicts.
+    line-height: initial !important;
+
     &--h1 {
         font-size: var(--dl-font-size-h1);
     }
@@ -120,9 +125,5 @@ export default defineComponent({
     &--small {
         font-size: var(--dl-font-size-small);
     }
-
-    // important needed above for sizing of h tags.. quasar conflict
-    // to deal with quasar conflicts.
-    line-height: initial !important;
 }
 </style>