@trionesdev/antd-mobile-base-react 0.0.2-beta.16 → 0.0.2-beta.17

package/dist/PageIndicator/style.scss

@@ -1,59 +1,59 @@
-/* prettier-ignore */
-.triones-antm-page-indicator {
-  display: flex;
-  width: auto;
-
-  --dot-color: #ccc;
-  --active-dot-color: #1677ff;
-  --dot-size: 3PX;
-  --active-dot-size: 13PX;
-  --dot-border-radius: 1PX;
-  --active-dot-border-radius: var(--dot-border-radius);
-  --dot-spacing: 3PX;
-
-  &-dot {
-    display: block;
-    width: var(--dot-size);
-    height: var(--dot-size);
-    border-radius: var(--dot-border-radius);
-    background: var(--dot-color);
-
-    &:last-child {
-      margin-right: 0;
-    }
-
-    &-active {
-      border-radius: var(--active-dot-border-radius);
-      background: var(--active-dot-color);
-    }
-  }
-
-  &-color-white {
-    --dot-color: rgba(255, 255, 255, 50%);
-    --active-dot-color: #fff;
-  }
-
-  &-horizontal {
-    flex-direction: row;
-
-    .triones-antm-page-indicator-dot {
-      margin-right: var(--dot-spacing);
-
-      &-active {
-        width: var(--active-dot-size);
-      }
-    }
-  }
-
-  &-vertical {
-    flex-direction: column;
-
-    .triones-antm-page-indicator-dot {
-      margin-bottom: var(--dot-spacing);
-
-      &-active {
-        height: var(--active-dot-size);
-      }
-    }
-  }
-}
+/* prettier-ignore */
+.triones-antm-page-indicator {
+  display: flex;
+  width: auto;
+
+  --dot-color: #ccc;
+  --active-dot-color: #1677ff;
+  --dot-size: 3PX;
+  --active-dot-size: 13PX;
+  --dot-border-radius: 1PX;
+  --active-dot-border-radius: var(--dot-border-radius);
+  --dot-spacing: 3PX;
+
+  &-dot {
+    display: block;
+    width: var(--dot-size);
+    height: var(--dot-size);
+    border-radius: var(--dot-border-radius);
+    background: var(--dot-color);
+
+    &:last-child {
+      margin-right: 0;
+    }
+
+    &-active {
+      border-radius: var(--active-dot-border-radius);
+      background: var(--active-dot-color);
+    }
+  }
+
+  &-color-white {
+    --dot-color: rgba(255, 255, 255, 50%);
+    --active-dot-color: #fff;
+  }
+
+  &-horizontal {
+    flex-direction: row;
+
+    .triones-antm-page-indicator-dot {
+      margin-right: var(--dot-spacing);
+
+      &-active {
+        width: var(--active-dot-size);
+      }
+    }
+  }
+
+  &-vertical {
+    flex-direction: column;
+
+    .triones-antm-page-indicator-dot {
+      margin-bottom: var(--dot-spacing);
+
+      &-active {
+        height: var(--active-dot-size);
+      }
+    }
+  }
+}

package/dist/Progress/Progress.js

@@ -11,7 +11,7 @@ export var Progress = function Progress(_ref) {
     _ref$percent = _ref.percent,
     percent = _ref$percent === void 0 ? 0 : _ref$percent,
     _ref$size = _ref.size,
-    size = _ref$size === void 0 ? 'middle' : _ref$size,
+    size = _ref$size === void 0 ? 'medium' : _ref$size,
     _ref$showInfo = _ref.showInfo,
     showInfo = _ref$showInfo === void 0 ? true : _ref$showInfo,
     _ref$railColor = _ref.railColor,

package/dist/Progress/ProgressCircle.js

@@ -30,12 +30,15 @@ export var ProgressCircle = /*#__PURE__*/memo(function (_ref) {
     switch (size) {
       case 'small':
         return 50;
-      case 'middle':
+      case 'medium':
         return 100;
       case 'large':
         return 150;
       default:
-        return size || 50;
+        if (typeof size === 'number') {
+          return size;
+        }
+        return 50;
     }
   }, [size]);
   var style = {

package/dist/Progress/ProgressLine.js

@@ -7,7 +7,7 @@ export var ProgressLine = function ProgressLine(_ref) {
     _ref$percent = _ref.percent,
     percent = _ref$percent === void 0 ? 0 : _ref$percent,
     _ref$size = _ref.size,
-    size = _ref$size === void 0 ? 'middle' : _ref$size,
+    size = _ref$size === void 0 ? 'medium' : _ref$size,
     _ref$showInfo = _ref.showInfo,
     showInfo = _ref$showInfo === void 0 ? true : _ref$showInfo,
     _ref$railColor = _ref.railColor,
@@ -22,7 +22,7 @@ export var ProgressLine = function ProgressLine(_ref) {
     switch (size) {
       case 'small':
         return 6;
-      case 'middle':
+      case 'medium':
         return 8;
       case 'large':
         return 12;

package/dist/Progress/style.scss

@@ -1,33 +1,33 @@
-$progressLineCls: 'triones-antm-progress-line';
-$progressCircleCls: 'triones-antm-progress-circle';
-
-.#{$progressLineCls}{
-  width: 100%;
-  display: flex;
-  align-items: center;
-  gap: 4Px;
-  &-rail{
-    flex: 1 auto;
-    border-radius: 90Px;
-  }
-  &-track{
-    border-radius: 90Px;
-  }
-  &-indicator{}
-}
-
-.#{$progressCircleCls} {
-  position: relative;
-  &-indicator {
-    position: absolute;
-    inset-block-start: 50%;
-    inset-inline-start: 0;
-    width: 100%;
-    margin: 0;
-    padding: 0;
-    line-height: 1;
-    white-space: normal;
-    text-align: center;
-    transform: translatey(-50%);
-  }
-}
+$progressLineCls: 'triones-antm-progress-line';
+$progressCircleCls: 'triones-antm-progress-circle';
+
+.#{$progressLineCls}{
+  width: 100%;
+  display: flex;
+  align-items: center;
+  gap: 4Px;
+  &-rail{
+    flex: 1 auto;
+    border-radius: 90Px;
+  }
+  &-track{
+    border-radius: 90Px;
+  }
+  &-indicator{}
+}
+
+.#{$progressCircleCls} {
+  position: relative;
+  &-indicator {
+    position: absolute;
+    inset-block-start: 50%;
+    inset-inline-start: 0;
+    width: 100%;
+    margin: 0;
+    padding: 0;
+    line-height: 1;
+    white-space: normal;
+    text-align: center;
+    transform: translatey(-50%);
+  }
+}

package/dist/Progress/types.d.ts

@@ -1,5 +1,5 @@
-import { SizeType } from "..";
-export type Size = SizeType | number;
+import { AntSize } from "..";
+export type Size = AntSize | number;
 export type ProgressStatus = 'normal' | 'active' | 'success' | 'exception';
 export type PercentPositionAlign = 'start' | 'end';
 export declare const successColor = "#53C31B";

package/dist/Radio/style.scss

@@ -1,141 +1,154 @@
-@use "../style/variable" as variable;
-
-$checkboxDisabledColor: rgba(0, 0, 0, 0.25) !default;
-
-$class-prefix-radio: 'triones-antm-radio';
-
-.#{$class-prefix-radio}-wrapper {
-  cursor: pointer;
-  display: flex;
-  align-items: center;
-  gap: 8Px;
-
-  .#{$class-prefix-radio} {
-    &-fake {
-      width: 20PX;
-      height: 20PX;
-
-      .triones-antm-icon {
-        //position: absolute;
-        font-size: variable.$trionesFontSize;
-      }
-
-      &-checked {
-        height: 100%;
-        width: 100%;
-        display: inline-flex;
-        justify-content: center;
-        align-items: center;
-        background-color: variable.$trionesColorPrimary;
-        color: white;
-        border-radius: 50vh;
-        box-sizing: border-box;
-        overflow: hidden;
-        .triones-antm-icon{
-          font-size: 14Px;
-        }
-      }
-
-      &-unchecked {
-        height: 100%;
-        width: 100%;
-        display: inline-flex;
-        justify-content: center;
-        align-items: center;
-        border-radius: 50vh;
-        border: 1PX solid variable.$trionesBorderColor;
-        box-sizing: border-box;
-      }
-
-    }
-
-
-
-    &-label {
-      flex: 1 auto;
-    }
-  }
-
-  &.#{$class-prefix-radio} {
-    &-disabled {
-      color: $checkboxDisabledColor;
-      pointer-events: none;
-
-      .#{$class-prefix-radio}-fake-checked {
-        background-color: $checkboxDisabledColor;
-      }
-    }
-    &-block {
-      width: 100%;
-    }
-  }
-
-}
-
-
-.#{$class-prefix-radio}-group {
-  display: flex;
-  gap: 8Px;
-  &-horizontal{
-    flex-direction: row;
-  }
-  &-vertical{
-    flex-direction: column;
-  }
-}
-
-.#{$class-prefix-radio}-button-group {
-  display: flex;
-}
-
-.#{$class-prefix-radio}-button-wrapper {
-  display: inline-flex;
-  position: relative;
-  border-top: 1PX solid variable.$trionesBorderColor;
-  border-bottom: 1PX solid variable.$trionesBorderColor;
-  border-right: 1PX solid variable.$trionesBorderColor;
-
-  &:first-child {
-    border-left: 1PX solid variable.$trionesBorderColor;
-    border-top-left-radius: variable.$trionesBorderRadius;
-    border-bottom-left-radius: variable.$trionesBorderRadius;
-  }
-
-  &:last-child {
-    border-right: 1PX solid variable.$trionesBorderColor;
-    border-top-right-radius: variable.$trionesBorderRadius;
-    border-bottom-right-radius: variable.$trionesBorderRadius;
-  }
-
-  &-checked {
-    border-top: 1PX solid variable.$trionesColorPrimary;
-    border-bottom: 1PX solid variable.$trionesColorPrimary;
-    color: variable.$trionesColorPrimary;
-
-    &:first-child {
-      border: 1PX solid variable.$trionesColorPrimary;
-    }
-
-    &:not(:first-child) {
-      &::before {
-        content: " ";
-        width: 1PX;
-        background-color: variable.$trionesColorPrimary;
-        position: absolute;
-        inset-block-start: -1Px;
-        inset-inline-start: -1Px;
-        height: 100%;
-        padding-block: 1Px;
-      }
-
-      border-right: 1PX solid variable.$trionesColorPrimary;
-    }
-  }
-
-  .#{$class-prefix-radio}-button {
-    cursor: pointer;
-    display: inline-flex;
-    padding: 8Px 12Px;
-
-  }
-}
+@use "../style/variable" as variable;
+
+$checkboxDisabledColor: rgba(0, 0, 0, 0.25) !default;
+
+$class-prefix-radio: 'triones-antm-radio';
+
+.#{$class-prefix-radio}-wrapper {
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  gap: 8Px;
+
+  .#{$class-prefix-radio} {
+    flex-shrink: 0;
+    &-fake {
+      width: 20PX;
+      height: 20PX;
+      line-height: 0;
+      box-sizing: border-box;
+      overflow: hidden;
+
+      .triones-antm-icon {
+        //position: absolute;
+        font-size: variable.$trionesFontSize;
+      }
+
+      &-checked {
+        height: 100%;
+        width: 100%;
+        display: inline-flex;
+        justify-content: center;
+        align-items: center;
+        background-color: variable.$trionesColorPrimary;
+        color: white;
+        border-radius: 50vh;
+        box-sizing: border-box;
+        overflow: hidden;
+
+        .triones-antm-icon {
+          font-size: 14Px;
+          line-height: 1;
+          display: block;
+        }
+      }
+
+      &-unchecked {
+        height: 100%;
+        width: 100%;
+        display: inline-flex;
+        justify-content: center;
+        align-items: center;
+        border-radius: 50vh;
+        border: 1PX solid variable.$trionesBorderColor;
+        box-sizing: border-box;
+      }
+
+    }
+
+
+    &-label {
+      flex: 1 auto;
+    }
+  }
+
+  &.#{$class-prefix-radio} {
+    &-disabled {
+      color: $checkboxDisabledColor;
+      pointer-events: none;
+
+      .#{$class-prefix-radio}-fake-checked {
+        background-color: $checkboxDisabledColor;
+      }
+    }
+
+    &-block {
+      width: 100%;
+    }
+  }
+
+}
+
+
+.#{$class-prefix-radio}-group {
+
+  gap: 8Px;
+
+  &-horizontal {
+    display: inline-flex;
+    flex-direction: row;
+    align-items: center;
+    vertical-align: middle;
+  }
+
+  &-vertical {
+    display: flex;
+    flex-direction: column;
+  }
+}
+
+.#{$class-prefix-radio}-button-group {
+  display: flex;
+}
+
+.#{$class-prefix-radio}-button-wrapper {
+  display: inline-flex;
+  position: relative;
+  border-top: 1PX solid variable.$trionesBorderColor;
+  border-bottom: 1PX solid variable.$trionesBorderColor;
+  border-right: 1PX solid variable.$trionesBorderColor;
+
+  &:first-child {
+    border-left: 1PX solid variable.$trionesBorderColor;
+    border-top-left-radius: variable.$trionesBorderRadius;
+    border-bottom-left-radius: variable.$trionesBorderRadius;
+  }
+
+  &:last-child {
+    border-right: 1PX solid variable.$trionesBorderColor;
+    border-top-right-radius: variable.$trionesBorderRadius;
+    border-bottom-right-radius: variable.$trionesBorderRadius;
+  }
+
+  &-checked {
+    border-top: 1PX solid variable.$trionesColorPrimary;
+    border-bottom: 1PX solid variable.$trionesColorPrimary;
+    color: variable.$trionesColorPrimary;
+
+    &:first-child {
+      border: 1PX solid variable.$trionesColorPrimary;
+    }
+
+    &:not(:first-child) {
+      &::before {
+        content: " ";
+        width: 1PX;
+        background-color: variable.$trionesColorPrimary;
+        position: absolute;
+        inset-block-start: -1Px;
+        inset-inline-start: -1Px;
+        height: 100%;
+        padding-block: 1Px;
+      }
+
+      border-right: 1PX solid variable.$trionesColorPrimary;
+    }
+  }
+
+  .#{$class-prefix-radio}-button {
+    cursor: pointer;
+    display: inline-flex;
+    padding: 8Px 12Px;
+
+  }
+}

package/dist/Rate/style.scss

@@ -1,37 +1,37 @@
-$rateCls: 'triones-antm-rate';
-
-.#{$rateCls} {
-  display: inline-flex;
-  align-items: center;
-
-  &-star-wrapper {
-    position: relative;
-    padding: 0 2px;
-    cursor: pointer;
-  }
-
-  &-star {
-    font-size: 20px;
-    color: var(--inactive-color, #e8e8e8);
-    transition: color 0.3s;
-
-    &-active {
-      color: var(--active-color, #ffb400);
-    }
-  }
-
-  &-star-half-item {
-    position: absolute;
-    left: 2px;
-    top: 0;
-    width: 42%;
-    height: 100%;
-    overflow: hidden;
-  }
-
-  &-readonly {
-    .#{$rateCls}-star-wrapper {
-      cursor: default;
-    }
-  }
-}
+$rateCls: 'triones-antm-rate';
+
+.#{$rateCls} {
+  display: inline-flex;
+  align-items: center;
+
+  &-star-wrapper {
+    position: relative;
+    padding: 0 2px;
+    cursor: pointer;
+  }
+
+  &-star {
+    font-size: 20px;
+    color: var(--inactive-color, #e8e8e8);
+    transition: color 0.3s;
+
+    &-active {
+      color: var(--active-color, #ffb400);
+    }
+  }
+
+  &-star-half-item {
+    position: absolute;
+    left: 2px;
+    top: 0;
+    width: 42%;
+    height: 100%;
+    overflow: hidden;
+  }
+
+  &-readonly {
+    .#{$rateCls}-star-wrapper {
+      cursor: default;
+    }
+  }
+}

package/dist/Result/demo/base.js

@@ -1,5 +1,5 @@
-/**
- * compact: true
+/**
+ * compact: true
  */
 import { DemoBlock } from "../../DemoBlock";
 import React from 'react';