@fjyueke/arco-mcp 1.0.1 → 1.0.2

package/metaData/components/carousel/style.md

@@ -0,0 +1,208 @@
+@import "../../../style/mixin.less";
+
+.@{prefix}-carousel {
+
+    &-wrap {
+        position: relative;
+        font-size: 0;
+        width: 100%;
+    }
+    position: relative;
+    width: 100%;
+    overflow: hidden;
+    transition: height .3s;
+    box-sizing: content-box;
+
+    &.wrap-placeholder {
+        display: none;
+    }
+
+    &-inner {
+        overflow: visible;
+
+        &:not(.vertical) {
+            white-space: nowrap;
+        }
+
+        &.auto,
+        &.auto &-item-inner {
+            .use-var(transition-timing-function, carousel-auto-transition);
+        }
+
+        &.slide,
+        &.slide &-item-inner {
+            .use-var(transition-timing-function, carousel-slide-transition);
+        }
+    }
+
+    &-item {
+        width: 100%;
+        height: 100%;
+        display: inline-block;
+        vertical-align: top;
+        white-space: normal;
+        position: relative;
+
+        &.ssr-float {
+            max-height: 0;
+            overflow: visible;
+        }
+
+        &.vertical > *,
+        &.vertical &-inner > * {
+            height: 100%;
+        }
+
+        & > img,
+        &-inner > img,
+        .carousel-item-img {
+            width: 100%;
+            height: 100%;
+            object-fit: cover;
+            object-position: center;
+        }
+
+        .carousel-item-text {
+            position: absolute;
+            bottom: 0;
+            left: 0;
+            width: 100%;
+            display: flex;
+            align-items: center;
+            box-sizing: border-box;
+            .use-var(padding, carousel-item-text-padding);
+            .use-var(font-size, carousel-item-text-font-size);
+            .use-var(height, carousel-item-text-height);
+            .use-var(color, carousel-item-text-color);
+            .use-var(background, carousel-item-text-background);
+        }
+
+        &-inner {
+            width: 100%;
+            height: 100%;
+        }
+
+        &-inner {
+            width: 100%;
+            height: 100%;
+        }
+    }
+
+    &-indicator {
+        position: absolute;
+        .use-var(bottom, carousel-indicator-position);
+        z-index: 1;
+        will-change: transform;
+        box-sizing: border-box;
+
+        &.pos-start {
+            .use-var-with-rtl(left, carousel-indicator-safe-padding);
+            .set-value-with-rtl(text-align, left);
+        }
+
+        &.pos-center {
+            left: 50%;
+            transform: translate3d(-50%, 0, 0);
+            text-align: center;
+        }
+
+        &.pos-end {
+            .use-var-with-rtl(right, carousel-indicator-safe-padding);
+            .set-value-with-rtl(text-align, right);
+        }
+
+        &-vertical {
+
+            .indicator {
+                display: block;
+                box-sizing: border-box;
+                .use-var(height, carousel-square-indicator-width);
+                .use-var(width, carousel-square-indicator-height);
+
+                &:not(:last-of-type) {
+                    margin: 0;
+                    .use-var(margin-bottom, carousel-square-indicator-gutter);
+                }
+
+                &.type-circle:not(:last-of-type) {
+                    margin: 0;
+                    .use-var(margin-bottom, carousel-circle-indicator-gutter);
+                }
+            }
+
+            &.pos-start {
+                .use-var(top, carousel-indicator-safe-padding);
+            }
+
+            &.pos-center {
+                bottom: 50%;
+                transform: translate3d(0, 50%, 0);
+            }
+
+            &.pos-end {
+                .use-var(bottom, carousel-indicator-safe-padding);
+            }
+
+            &.ver-pos-left {
+                left: auto;
+                right: auto;
+                .use-var-with-rtl(left, carousel-indicator-position);
+            }
+
+            &.ver-pos-right {
+                left: auto;
+                right: auto;
+                .use-var-with-rtl(right, carousel-indicator-position);
+            }
+        }
+
+        &.inverse {
+
+            .indicator {
+                .use-var(background-color, carousel-indicator-inverse-background);
+
+                &.active {
+                    .use-var(background-color, carousel-indicator-active-inverse-background);
+                }
+            }
+        }
+
+        &.outside {
+            position: relative;
+            left: 0;
+            transform: none;
+            bottom: 0;
+            .use-var(padding, carousel-indicator-outside-padding);
+        }
+
+        .indicator {
+            transition: all .2s;
+            .use-var(background-color, carousel-indicator-background);
+
+            &.active {
+                .use-var(background-color, carousel-indicator-active-background);
+            }
+        }
+
+        &-horizontal .indicator {
+            display: inline-block;
+            .use-var(width, carousel-square-indicator-width);
+            .use-var(height, carousel-square-indicator-height);
+
+            &:not(:last-of-type) {
+                .use-var-with-rtl(margin-right, carousel-square-indicator-gutter);
+            }
+        }
+
+        .circle-indicator,
+        .indicator.type-circle {
+            .use-var(width, carousel-circle-indicator-size);
+            .use-var(height, carousel-circle-indicator-size);
+            border-radius: 50%;
+
+            &:not(:last-of-type) {
+                .use-var-with-rtl(margin-right, carousel-circle-indicator-gutter);
+            }
+        }
+    }
+}

package/metaData/components/cell/style.md

@@ -0,0 +1,123 @@
+@import "../../../style/mixin.less";
+
+.@{prefix}-cell {
+    .use-var(color, cell-text-color);
+    .use-var(font-size, cell-font-size);
+    .use-var(margin-left, cell-horizontal-padding);
+    .use-var(padding-right, cell-horizontal-padding);
+
+    &:not(:first-of-type).bordered {
+        .onepx-border-var(top, line-color);
+    }
+
+    &.without-group {
+        .use-var(background-color, cell-background-color);
+        .use-var(padding-left, cell-horizontal-padding);
+        margin-left: 0;
+
+        &.bordered {
+            .onepx-border-var(top, line-color);
+            .onepx-border-var(bottom, line-color);
+        }
+    }
+
+    &-inner {
+        display: flex;
+        align-items: center;
+        .use-var(height, cell-item-height);
+
+        &.has-desc {
+            .use-var(height, cell-item-has-desc-height);
+        }
+    }
+
+    .cell-label {
+        .use-var(color, cell-label-color);
+        .use-var-with-rtl(margin-right, cell-label-gutter);
+
+        .cell-title {
+            .use-var(font-size, cell-title-font-size);
+            .use-var(font-weight, cell-title-font-weight);
+        }
+    }
+
+    .cell-desc {
+        .use-var(color, cell-desc-color);
+        .use-var(font-size, cell-desc-font-size);
+        .use-var(margin-top, cell-desc-margin-top);
+    }
+
+    .cell-content {
+        flex: 1;
+        display: flex;
+        align-items: center;
+        height: 100%;
+
+        &.has-label {
+            justify-content: flex-end;
+        }
+
+        .cell-text {
+            width: 100%;
+            .set-value-with-rtl(text-align, right);
+            .use-var(font-size, cell-content-font-size);
+            .text-overflow(2);
+        }
+    }
+
+    .cell-label-icon {
+        .use-var-with-rtl(margin-right, cell-label-icon-gutter);
+        font-size: 0;
+        .@{prefix}-icon {
+            line-height: initial;
+            .use-var(font-size, cell-label-icon-font-size);
+            .use-var(color, cell-label-icon-color);
+        }
+    }
+
+    .cell-arrow-icon {
+        .style-with-rtl({
+            transform: scale(-1);
+        });
+        .use-var-with-rtl(margin-left, cell-arrow-gutter);
+        font-size: 0;
+        .@{prefix}-icon {
+            .use-var(font-size, cell-arrow-font-size);
+            .use-var(color, cell-arrow-color);
+        }
+
+        .arrow-icon-svg {
+            .rem(width, 8);
+
+            path {
+                .use-var(fill, cell-arrow-color);
+            }
+        }
+    }
+
+    .@{prefix}-input-wrap {
+        .set-prop-with-rtl(padding-left, 0, {
+            .use-var(padding-left, input-horizontal-padding);
+        });
+    }
+}
+
+.@{prefix}-cell-group {
+
+    .cell-group-header,
+    .cell-group-footer {
+        .use-var(color, cell-text-color);
+        .use-var(font-size, cell-extra-font-size);
+        .use-var(line-height, cell-extra-line-height);
+        .use-var(padding, cell-extra-padding);
+    }
+
+    .cell-group-body {
+        .use-var(background-color, cell-background-color);
+
+        &.bordered {
+            .onepx-border-var(top, line-color);
+            .onepx-border-var(bottom, line-color);
+        }
+    }
+}

package/metaData/components/checkbox/style.md

@@ -0,0 +1,62 @@
+@import "../../../style/mixin.less";
+
+.@{prefix}-checkbox {
+    display: inline-flex;
+    align-items: center;
+
+    .checkbox-icon {
+        display: inline-flex;
+        align-items: center;
+        .use-var(font-size, checkbox-icon-font-size);
+        .use-var(color, checkbox-icon-color);
+
+        &.checked {
+            .use-var(color, checkbox-icon-checked-color);
+        }
+
+        &.disabled {
+            .use-var(color, checkbox-icon-disabled-color);
+        }
+
+        &.checked.disabled {
+            .use-var(color, checkbox-icon-checked-disabled-color);
+        }
+
+        .@{prefix}-icon-circle-disabled path {
+            .use-var(stroke, line-color);
+        }
+    }
+
+    .checkbox-text {
+        .use-var(font-size, checkbox-text-font-size);
+        .use-var(color, font-color);
+    }
+
+    .checkbox-icon + .checkbox-text {
+        .use-var-with-rtl(margin-left, checkbox-icon-margin-right);
+    }
+
+    &.disabled .checkbox-text {
+        .use-var(opacity, checkbox-text-disabled-opacity);
+    }
+
+    &.block {
+        width: 100%;
+    }
+
+    &.justify {
+        width: 100%;
+        justify-content: space-between;
+    }
+}
+
+.@{prefix}-checkbox-group {
+    .@{prefix}-checkbox:not(:last-child) {
+        .use-var-with-rtl(margin-right, checkbox-group-gutter);
+
+        &.block,
+        &.justify {
+            .set-prop-with-rtl(margin-right, 0);
+        }
+    }
+}

package/metaData/components/circle-progress/style.md

@@ -0,0 +1,52 @@
+@import "../../../style/mixin.less";
+
+.@{prefix}-circle-progress {
+    position: relative;
+
+    &-text {
+        position: absolute;
+        .use-var(font-size, circle-progress-font-size);
+    }
+
+    &-text-center {
+        left: 50%;
+        top: 50%;
+        transform: translate(-50%, -50%);
+    }
+
+    &-text-bottom {
+        .rem(bottom, -20);
+        left: 50%;
+        transform: translateX(-50%);
+    }
+
+    .track-color {
+        .use-var(stroke, circle-progress-track-color);
+    }
+
+    .color {
+        .use-var(stroke, circle-progress-primary-color);
+        .use-var(color, circle-progress-primary-color);
+    }
+
+    .mini {
+        .use-var(stroke, circle-progress-mini-track-color);
+    }
+
+    .disabled {
+        .use-var(color, circle-progress-disabled-color);
+        .use-var(stroke, circle-progress-disabled-color);
+    }
+
+    .linear-gradient-start {
+        .use-var(stop-color, circle-progress-linear-gradient-start-color);
+    }
+
+    .linear-gradient-text {
+        .use-var(color, circle-progress-linear-gradient-text-color);
+    }
+
+    .linear-gradient-end {
+        .use-var(stop-color, circle-progress-linear-gradient-end-color);
+    }
+}

package/metaData/components/collapse/style.md

@@ -0,0 +1,53 @@
+@import '../../../style/mixin.less';
+
+.@{prefix}-collapse-group {
+}
+
+.@{prefix}-collapse-item {
+    padding: 0;
+    margin: 0;
+    .@{prefix}-collapse {
+        &-header {
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            .use-var(background, collapse-header-background);
+            .use-var(height, collapse-header-height);
+            .use-var(margin-left, collapse-header-margin-left);
+            .use-var(padding, collapse-header-padding);
+            .use-var(color, collapse-header-color);
+            .use-var(line-height, collapse-header-line-height);
+            .use-var(font-size, collapse-header-font-size);
+            .onepx-border-var(bottom, line-color);
+        }
+        &-icon {
+            .use-var(color, collapse-header-icon-color);
+            display: inline-flex;
+            align-items: center;
+            svg,
+            i {
+                .use-var(font-size, collapse-header-font-size);
+                .use-var(width, collapse-header-font-size);
+            }
+            &-arrow {
+                transition: transform 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
+            }
+        }
+        &-content {
+            height: 0;
+            .use-var(line-height, collapse-content-line-height);
+            .use-var(font-size, collapse-content-font-size);
+            .use-var(color, collapse-content-color);
+            overflow: hidden;
+            transition: height 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
+            &-container {
+                .use-var(padding, collapse-content-padding);
+            }
+        }
+    }
+    &.disabled {
+        .@{prefix}-collapse-header {
+            .use-var(color, collapse-disabled-header-color);
+        }
+    }
+}

package/metaData/components/context-provider/style.md

@@ -0,0 +1 @@
+// 这里啥也没有，但是为了兼容 babel-plugin-import的统一引用，还是需要创建下文件

package/metaData/components/count-down/style.md

@@ -0,0 +1,7 @@
+@import "../../../style/mixin.less";
+
+.@{prefix}-count-down {
+    .use-var(font-size, count-down-font-size);
+    .use-var(line-height, count-down-line-height);
+    .use-var(color, count-down-color);
+}

package/metaData/components/date-picker/style.md

@@ -0,0 +1,27 @@
+@import '../../../style/mixin.less';
+
+.@{prefix}-date-picker {
+    &-show {
+        display: flex;
+        .use-var(font-size, date-picker-range-font-size);
+        .use-var(padding, date-picker-range-show-padding);
+        .use-var(color, date-picker-range-disabled-font-color);
+        .use-var(min-height, date-picker-range-show-min-height);
+        .use-var(background-color, date-picker-range-background-color);
+        & > span {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+        }
+        &-separate {
+            flex: 0 1 auto;
+            .use-var(min-width, date-picker-range-separate-min-width);
+        }
+    }
+    &-range-item {
+        flex: 1 0 auto;
+        &-active {
+            .use-var(color, date-picker-range-font-color);
+        }
+    }
+}