amis-ui 6.11.0-beta.3 → 6.11.0-beta.5

package/lib/themes/default.css

@@ -20749,6 +20749,38 @@ input[type=button].cxd-Button--block {
 .cxd-TplField.is-inline {
   display: inline;
 }
+.cxd-TplField table {
+  border: 0;
+  border-collapse: collapse;
+  empty-cells: show;
+  max-width: 100%;
+}
+.cxd-TplField table td {
+  min-width: 5px;
+}
+.cxd-TplField table td,
+.cxd-TplField table th {
+  border: 1px solid #ddd;
+}
+.cxd-TplField table td:empty,
+.cxd-TplField table th:empty {
+  height: 20px;
+}
+.cxd-TplField table th {
+  background: #ececec;
+}
+.cxd-TplField hr {
+  clear: both;
+  user-select: none;
+  -o-user-select: none;
+  -moz-user-select: none;
+  -khtml-user-select: none;
+  -webkit-user-select: none;
+  -ms-user-select: none;
+  -moz-column-break-after: always;
+  break-after: always;
+  page-break-after: always;
+}
 .max-line {
   overflow: hidden;
   text-overflow: ellipsis;
@@ -25239,6 +25271,9 @@ input[type=button].cxd-Button--block {
 }
 .cxd-Crud-selection-overflow-wrapper .cxd-Crud-valueLabel {
   padding: 0 var(--gap-xs);
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 .cxd-Crud-selectionLabel {
   display: inline-block;
@@ -25288,6 +25323,9 @@ input[type=button].cxd-Button--block {
 }
 .cxd-Crud .cxd-Crud-valueLabel {
   padding: 0 var(--gap-xs);
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 .cxd-Crud-selectionClear {
   display: inline-block;
@@ -26651,6 +26689,8 @@ input[type=button].cxd-Button--block {
 }
 .cxd-Table--autoFillHeight > .cxd-Table-contentWrap > .cxd-Table-content > table {
   border-top: none;
+}
+.cxd-Table--autoFillHeight > .cxd-Table-contentWrap > .cxd-Table-content > table.cxd-Table-table--tableFillHeight {
   min-height: 100%;
 }
 .cxd-Table--autoFillHeight > .cxd-Table-contentWrap > .cxd-Table-content table thead {
@@ -29054,7 +29094,7 @@ input[type=button].cxd-Button--block {
 .cxd-Field--quickEditable:focus {
   position: relative;
 }
-.cxd-Field--quickEditable:focus:after {
+.cxd-Field--quickEditable:focus:before {
   content: "";
   left: 0;
   top: 0;
@@ -29938,6 +29978,57 @@ input[type=button].cxd-Button--block {
   z-index: 100;
   text-align: center;
 }
+.cxd-Carousel-vertical.cxd-Carousel .cxd-Carousel-dotsControl {
+  right: 0;
+  bottom: auto;
+  height: 100%;
+  width: auto;
+  display: flex;
+  flex-direction: column;
+  top: 0;
+  justify-content: center;
+}
+.cxd-Carousel-vertical.cxd-Carousel .cxd-Carousel-leftArrow, .cxd-Carousel-vertical.cxd-Carousel .cxd-Carousel-rightArrow {
+  height: 10%;
+  width: 100%;
+  left: 0;
+  right: 0;
+  bottom: unset;
+}
+.cxd-Carousel-vertical.cxd-Carousel .cxd-Carousel-leftArrow {
+  top: 0;
+}
+.cxd-Carousel-vertical.cxd-Carousel .cxd-Carousel-leftArrow svg {
+  transform: translate(-50%, -50%) rotate(90deg);
+}
+.cxd-Carousel-vertical.cxd-Carousel .cxd-Carousel-rightArrow {
+  bottom: 0;
+  top: unset;
+}
+.cxd-Carousel-vertical.cxd-Carousel .cxd-Carousel-rightArrow svg {
+  transform: translate(-50%, -50%) rotate(90deg);
+}
+.cxd-Carousel-vertical.cxd-Carousel .cxd-Carousel-item.slide {
+  transform: translateY(100%);
+}
+.cxd-Carousel-vertical.cxd-Carousel .cxd-Carousel-item.slide.in {
+  transform: translateY(0);
+}
+.cxd-Carousel-vertical.cxd-Carousel .cxd-Carousel-item.slide.out {
+  transform: translateY(-100%);
+}
+.cxd-Carousel-vertical.cxd-Carousel .cxd-Carousel-item.slideRight {
+  transform: translateY(-100%);
+}
+.cxd-Carousel-vertical.cxd-Carousel .cxd-Carousel-item.slideRight.in {
+  transform: translateY(0);
+}
+.cxd-Carousel-vertical.cxd-Carousel .cxd-Carousel-item.slideRight.out {
+  transform: translateY(100%);
+}
+.cxd-Carousel img {
+  pointer-events: none;
+}
 @keyframes disappear {
   to {
     opacity: 0;
@@ -30268,7 +30359,7 @@ input[type=button].cxd-Button--block {
   padding: 5px 10px;
 }
 .cxd-Image--thumb .cxd-Image-info {
-  width: 6.875rem;
+  width: 100%;
   padding: 0;
 }
 .cxd-Image-thumb--4-3 {
@@ -34973,26 +35064,19 @@ input.cxd-TextControl-input-password {
   background: var(--select-base-default-option-bg-color);
   line-height: var(--select-base-default-option-line-height);
 }
-.cxd-Select-option-checkbox {
+.cxd-Select-option .cxd-Checkbox {
   width: 100%;
   display: flex;
-  text-overflow: ellipsis;
-  overflow: hidden;
-  white-space: nowrap;
   align-items: center;
-}
-.cxd-Select-option-checkbox > label {
-  width: 100%;
-  display: flex;
   text-overflow: ellipsis;
   overflow: hidden;
   white-space: nowrap;
-  align-items: center;
+  margin: 0;
 }
-.cxd-Select-option-checkbox > label > i {
+.cxd-Select-option .cxd-Checkbox > i {
   flex-shrink: 0;
 }
-.cxd-Select-option-checkbox > label > span {
+.cxd-Select-option .cxd-Checkbox > span {
   text-overflow: ellipsis;
   overflow: hidden;
   white-space: nowrap;
@@ -35001,6 +35085,12 @@ input.cxd-TextControl-input-password {
   font-weight: var(--select-base-default-option-fontWeight);
   color: var(--select-base-default-option-color);
 }
+.cxd-Select-option .cxd-Checkbox .cxd-TplField > span > p {
+  margin: 0;
+  text-overflow: ellipsis;
+  overflow: hidden;
+  white-space: nowrap;
+}
 .cxd-Select-option.is-active {
   color: var(--Form-select-menu-onActive-color);
   background: var(--Form-select-menu-onActive-bg);
@@ -39049,6 +39139,9 @@ td.rdtQuarter.rdtDisabled:hover > span {
 }
 .cxd-Picker .cxd-Picker-valueLabel {
   padding: 0 var(--gap-xs);
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 .cxd-Picker-btn {
   cursor: pointer;
@@ -39154,6 +39247,9 @@ td.rdtQuarter.rdtDisabled:hover > span {
 }
 .cxd-Picker-overflow-wrapper .cxd-Picker-valueLabel {
   padding: 0 var(--gap-xs);
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 .cxd-PickerControl.is-inline .cxd-Picker,
 .cxd-Form-item--inline .cxd-Picker {
@@ -41118,14 +41214,26 @@ td.rdtQuarter.rdtDisabled:hover > span {
 .cxd-Form--column-1 > .cxd-Form-item {
   width: 100%;
 }
+.cxd-Form--column-1 > [data-role*=container] {
+  flex: 100%;
+}
+.cxd-Form--column-1 > .cxd-Form-item:nth-last-child(-n+1) {
+  margin-bottom: 0;
+}
 .cxd-Form--column-2 > .cxd-Form-item {
   width: 50%;
 }
-.cxd-Form--column-2 > .cxd-Form-item:nth-last-child(2) {
+.cxd-Form--column-2 > [data-role*=container] {
+  flex: 100%;
+}
+.cxd-Form--column-2 > .cxd-Form-item:nth-last-child(-n+2) {
   margin-bottom: 0;
 }
 .cxd-Form--column-3 > .cxd-Form-item {
-  width: 33%;
+  width: 33.3333333333%;
+}
+.cxd-Form--column-3 > [data-role*=container] {
+  flex: 100%;
 }
 .cxd-Form--column-3 > .cxd-Form-item:nth-last-child(-n+3) {
   margin-bottom: 0;
@@ -41133,23 +41241,35 @@ td.rdtQuarter.rdtDisabled:hover > span {
 .cxd-Form--column-4 > .cxd-Form-item {
   width: 25%;
 }
+.cxd-Form--column-4 > [data-role*=container] {
+  flex: 100%;
+}
 .cxd-Form--column-4 > .cxd-Form-item:nth-last-child(-n+4) {
   margin-bottom: 0;
 }
 .cxd-Form--column-5 > .cxd-Form-item {
   width: 20%;
 }
+.cxd-Form--column-5 > [data-role*=container] {
+  flex: 100%;
+}
 .cxd-Form--column-5 > .cxd-Form-item:nth-last-child(-n+5) {
   margin-bottom: 0;
 }
 .cxd-Form--column-6 > .cxd-Form-item {
-  width: 16.6%;
+  width: 16.6666666667%;
+}
+.cxd-Form--column-6 > [data-role*=container] {
+  flex: 100%;
 }
 .cxd-Form--column-6 > .cxd-Form-item:nth-last-child(-n+6) {
   margin-bottom: 0;
 }
 .cxd-Form--column-7 > .cxd-Form-item {
-  width: 14.2%;
+  width: 14.2857142857%;
+}
+.cxd-Form--column-7 > [data-role*=container] {
+  flex: 100%;
 }
 .cxd-Form--column-7 > .cxd-Form-item:nth-last-child(-n+7) {
   margin-bottom: 0;
@@ -41157,18 +41277,27 @@ td.rdtQuarter.rdtDisabled:hover > span {
 .cxd-Form--column-8 > .cxd-Form-item {
   width: 12.5%;
 }
+.cxd-Form--column-8 > [data-role*=container] {
+  flex: 100%;
+}
 .cxd-Form--column-8 > .cxd-Form-item:nth-last-child(-n+8) {
   margin-bottom: 0;
 }
-.cxd-Form-column-9 > .cxd-Form-item {
-  width: 11.1%;
+.cxd-Form--column-9 > .cxd-Form-item {
+  width: 11.1111111111%;
+}
+.cxd-Form--column-9 > [data-role*=container] {
+  flex: 100%;
 }
 .cxd-Form--column-9 > .cxd-Form-item:nth-last-child(-n+9) {
   margin-bottom: 0;
 }
-.cxd-Form-column-10 > .cxd-Form-item {
+.cxd-Form--column-10 > .cxd-Form-item {
   width: 10%;
 }
+.cxd-Form--column-10 > [data-role*=container] {
+  flex: 100%;
+}
 .cxd-Form--column-10 > .cxd-Form-item:nth-last-child(-n+10) {
   margin-bottom: 0;
 }

package/lib/utils/smoothSignature.js

@@ -1,6 +1,6 @@
 /**
- * amis-ui v6.11.0-beta.3
- * Copyright 2018-2024 fex
+ * amis-ui v6.11.0-beta.5
+ * Copyright 2018-2025 fex
  */
 
 'use strict';

package/lib/utils/vectorComputed.js

@@ -1,6 +1,6 @@
 /**
- * amis-ui v6.11.0-beta.3
- * Copyright 2018-2024 fex
+ * amis-ui v6.11.0-beta.5
+ * Copyright 2018-2025 fex
  */
 
 'use strict';

package/lib/withRemoteConfig.js

@@ -1,6 +1,6 @@
 /**
- * amis-ui v6.11.0-beta.3
- * Copyright 2018-2024 fex
+ * amis-ui v6.11.0-beta.5
+ * Copyright 2018-2025 fex
  */
 
 'use strict';

package/lib/withStore.js

@@ -1,6 +1,6 @@
 /**
- * amis-ui v6.11.0-beta.3
- * Copyright 2018-2024 fex
+ * amis-ui v6.11.0-beta.5
+ * Copyright 2018-2025 fex
  */
 
 'use strict';

package/package.json

@@ -3,7 +3,7 @@
   "main": "lib/index.js",
   "module": "esm/index.js",
   "types": "lib/index.d.ts",
-  "version": "6.11.0-beta.3",
+  "version": "6.11.0-beta.5",
   "description": "",
   "scripts": {
     "build": "npm run clean-dist && cross-env NODE_ENV=production rollup -c ",
@@ -36,8 +36,8 @@
   },
   "dependencies": {
     "@rc-component/mini-decimal": "^1.0.1",
-    "amis-core": "^6.11.0-beta.3",
-    "amis-formula": "^6.11.0-beta.3",
+    "amis-core": "^6.11.0-beta.5",
+    "amis-formula": "^6.11.0-beta.5",
     "animate.css": "4.1.1",
     "classnames": "2.3.2",
     "codemirror": "^5.63.0",
@@ -73,7 +73,8 @@
     "sortablejs": "1.15.0",
     "tinymce": "^6.1.2",
     "tslib": "^2.3.1",
-    "uncontrollable": "7.2.1"
+    "uncontrollable": "7.2.1",
+    "video-react": "0.15.0"
   },
   "devDependencies": {
     "@rollup/plugin-commonjs": "^22.0.2",

package/scss/_mixins.scss

@@ -714,6 +714,9 @@
 
   .#{$ns}#{$component-prefix}-valueLabel {
     padding: 0 var(--gap-xs);
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
   }
 }
 

package/scss/components/_carousel.scss

@@ -202,4 +202,70 @@
     z-index: 100;
     text-align: center;
   }
+
+  &-vertical.#{$ns}Carousel {
+    .#{$ns}Carousel {
+      &-dotsControl {
+        right: 0;
+        bottom: auto;
+        height: 100%;
+        width: auto;
+        display: flex;
+        flex-direction: column;
+        top: 0;
+        justify-content: center;
+      }
+      
+      &-leftArrow, &-rightArrow {
+        height: 10%;
+        width: 100%;
+        left: 0;
+        right: 0;
+        bottom: unset;
+      }
+
+      &-leftArrow {
+        top: 0;
+        svg {
+          transform: translate(-50%, -50%) rotate(90deg);
+        }
+      }
+
+      &-rightArrow {
+        bottom: 0;
+        top: unset;
+        svg {
+          transform: translate(-50%, -50%) rotate(90deg);
+        }
+      }
+  
+      &-item.slide {
+        transform: translateY(100%);
+      }
+  
+      &-item.slide.in {
+        transform: translateY(0);
+      }
+  
+      &-item.slide.out {
+        transform: translateY(-100%);
+      }
+  
+      &-item.slideRight {
+        transform: translateY(-100%);
+      }
+  
+      &-item.slideRight.in {
+        transform: translateY(0);
+      }
+  
+      &-item.slideRight.out {
+        transform: translateY(100%);
+      }
+    }
+  }
+
+  img {
+    pointer-events: none;
+  }
 }

package/scss/components/_images.scss

@@ -65,7 +65,7 @@
   }
 
   &--thumb &-info {
-    width: px2rem(110px);
+    width: 100%;
     padding: 0;
   }
 

package/scss/components/_quick-edit.scss

@@ -23,7 +23,7 @@
   &:focus {
     position: relative;
 
-    &:after {
+    &:before {
       content: '';
       left: 0;
       top: 0;

package/scss/components/_table.scss

@@ -1020,7 +1020,10 @@
     > .#{$ns}Table-contentWrap {
       > .#{$ns}Table-content > table {
         border-top: none; // 不然会导致拖动时顶部露出内容
-        min-height: 100%; // 为了让表格占满高度
+
+        &.#{$ns}Table-table--tableFillHeight {
+          min-height: 100%; // 为了让表格占满高度
+        }
       }
 
       > .#{$ns}Table-content table thead {

package/scss/components/_tpl.scss

@@ -2,12 +2,50 @@
   &.is-inline {
     display: inline;
   }
+
+  table {
+    border: 0;
+    border-collapse: collapse;
+    empty-cells: show;
+    max-width: 100%;
+  }
+
+  table td {
+    min-width: 5px;
+  }
+
+  table td,
+  table th {
+    border: 1px solid #ddd;
+  }
+
+  table td:empty,
+  table th:empty {
+    height: 20px;
+  }
+
+  table th {
+    background: #ececec;
+  }
+
+  hr {
+    clear: both;
+    user-select: none;
+    -o-user-select: none;
+    -moz-user-select: none;
+    -khtml-user-select: none;
+    -webkit-user-select: none;
+    -ms-user-select: none;
+    -moz-column-break-after: always;
+    break-after: always;
+    page-break-after: always;
+  }
 }
 
 .max-line {
-  overflow : hidden;
+  overflow: hidden;
   text-overflow: ellipsis;
   display: -webkit-box;
   -webkit-box-orient: vertical;
   word-break: break-word;
-}
+}

package/scss/components/form/_form.scss

@@ -531,80 +531,18 @@
   }
 }
 
-.#{$ns}Form--column-1 > .#{$ns}Form-item {
-  width: 100%;
-}
-
-.#{$ns}Form--column-2 > .#{$ns}Form-item {
-  width: 50%;
-}
-
-.#{$ns}Form--column-2 > .#{$ns}Form-item:nth-last-child(2) {
-  margin-bottom: 0;
-}
-
-.#{$ns}Form--column-3 > .#{$ns}Form-item {
-  width: 33%;
-}
-
-.#{$ns}Form--column-3 > .#{$ns}Form-item:nth-last-child(-n + 3) {
-  margin-bottom: 0;
-}
-
-.#{$ns}Form--column-4 > .#{$ns}Form-item {
-  width: 25%;
-}
-
-.#{$ns}Form--column-4 > .#{$ns}Form-item:nth-last-child(-n + 4) {
-  margin-bottom: 0;
-}
-
-.#{$ns}Form--column-5 > .#{$ns}Form-item {
-  width: 20%;
-}
-
-.#{$ns}Form--column-5 > .#{$ns}Form-item:nth-last-child(-n + 5) {
-  margin-bottom: 0;
-}
-
-.#{$ns}Form--column-6 > .#{$ns}Form-item {
-  width: 16.6%;
-}
-
-.#{$ns}Form--column-6 > .#{$ns}Form-item:nth-last-child(-n + 6) {
-  margin-bottom: 0;
-}
-
-.#{$ns}Form--column-7 > .#{$ns}Form-item {
-  width: 14.2%;
-}
-
-.#{$ns}Form--column-7 > .#{$ns}Form-item:nth-last-child(-n + 7) {
-  margin-bottom: 0;
-}
-
-.#{$ns}Form--column-8 > .#{$ns}Form-item {
-  width: 12.5%;
-}
-
-.#{$ns}Form--column-8 > .#{$ns}Form-item:nth-last-child(-n + 8) {
-  margin-bottom: 0;
-}
-
-.#{$ns}Form-column-9 > .#{$ns}Form-item {
-  width: 11.1%;
-}
-
-.#{$ns}Form--column-9 > .#{$ns}Form-item:nth-last-child(-n + 9) {
-  margin-bottom: 0;
-}
+@for $i from 1 through 10 {
+  .#{$ns}Form--column-#{$i} > .#{$ns}Form-item {
+    width: 100 / $i * 1%;
+  }
 
-.#{$ns}Form-column-10 > .#{$ns}Form-item {
-  width: 10%;
-}
+  .#{$ns}Form--column-#{$i} > [data-role*='container'] {
+    flex: 100%;
+  }
 
-.#{$ns}Form--column-10 > .#{$ns}Form-item:nth-last-child(-n + 10) {
-  margin-bottom: 0;
+  .#{$ns}Form--column-#{$i} > .#{$ns}Form-item:nth-last-child(-n + #{$i}) {
+    margin-bottom: 0;
+  }
 }
 
 /* 移动端样式调整 */

package/scss/components/form/_select.scss

@@ -363,33 +363,33 @@
     background: var(--select-base-default-option-bg-color);
     line-height: var(--select-base-default-option-line-height);
 
-    &-checkbox {
+    .#{$ns}Checkbox {
       width: 100%;
       display: flex;
+      align-items: center;
       text-overflow: ellipsis;
       overflow: hidden;
       white-space: nowrap;
-      align-items: center;
-      > label {
-        width: 100%;
-        display: flex;
+      margin: 0;
+      > i {
+        flex-shrink: 0;
+      }
+
+      > span {
         text-overflow: ellipsis;
         overflow: hidden;
         white-space: nowrap;
-        align-items: center;
-
-        > i {
-          flex-shrink: 0;
-        }
-
-        > span {
+        width: 100%;
+        font-size: var(--select-base-default-option-fontSize);
+        font-weight: var(--select-base-default-option-fontWeight);
+        color: var(--select-base-default-option-color);
+      }
+      .#{$ns}TplField {
+        > span > p {
+          margin: 0;
           text-overflow: ellipsis;
           overflow: hidden;
           white-space: nowrap;
-          width: 100%;
-          font-size: var(--select-base-default-option-fontSize);
-          font-weight: var(--select-base-default-option-fontWeight);
-          color: var(--select-base-default-option-color);
         }
       }
     }