@sdata/web-vue 1.5.0 → 1.7.0

package/es/cascader/style/index.less

@@ -1,234 +0,0 @@
-@import url('../../select/style/index.less');
-@import url('./token.less');
-
-@cascader-prefix-cls: ~'@{prefix}-cascader';
-
-//.select-view(@cascader-prefix-cls);
-
-.@{cascader-prefix-cls} {
-  &-panel {
-    display: inline-flex;
-    box-sizing: border-box;
-    height: @select-popup-max-height;
-    overflow: hidden;
-    white-space: nowrap;
-    list-style: none;
-    background-color: var(~'@{sd-cssvars-prefix}-color-bg-popup');
-    border: 1px solid @select-popup-color-border;
-    border-radius: @select-popup-border-radius;
-    box-shadow: @select-popup-box-shadow;
-  }
-
-  &-search-panel {
-    justify-content: flex-start;
-    width: 100%;
-    overflow: auto;
-  }
-
-  &-popup-trigger-hover {
-    .@{cascader-prefix-cls}-list-item {
-      transition: fontweight 0s;
-    }
-  }
-
-  &-highlight {
-    font-weight: @font-weight-500;
-  }
-
-  &-panel-column {
-    position: relative;
-    display: inline-flex;
-    flex-direction: column;
-    min-width: 120px;
-    height: 100%;
-    max-height: 200px;
-    background-color: var(~'@{sd-cssvars-prefix}-color-bg-popup');
-
-    &-loading {
-      display: inline-flex;
-      align-items: center;
-      justify-content: center;
-    }
-
-    &:not(:last-of-type) {
-      border-right: 1px solid @select-popup-color-border;
-    }
-  }
-
-  &-column-content {
-    flex: 1;
-    max-height: 200px;
-    overflow-y: auto;
-  }
-
-  &-list-wrapper {
-    position: relative;
-    display: flex;
-    flex-direction: column;
-    box-sizing: border-box;
-    height: 100%;
-    padding: @select-popup-padding-vertical 0;
-
-    &-with-footer {
-      padding-bottom: 0;
-    }
-  }
-
-  &-list-empty {
-    display: flex;
-    align-items: center;
-    width: 100%;
-    height: 100%;
-  }
-
-  &-list {
-    flex: 1;
-    box-sizing: border-box;
-    margin: 0;
-    padding: 0;
-    list-style: none;
-
-    &-multiple,
-    &-strictly {
-      .@{cascader-prefix-cls}-option-label {
-        padding-left: 0;
-      }
-
-      .@{cascader-prefix-cls}-option {
-        padding-left: @cascader-padding-item-left;
-
-        .@{prefix}-checkbox,
-        .@{prefix}-radio {
-          margin-right: @cascader-margin-checkbox-right;
-          padding-left: 0;
-        }
-      }
-    }
-  }
-
-  &-search-list&-list-multiple {
-    .@{cascader-prefix-cls}-option-label {
-      padding-right: @cascader-padding-item-left;
-    }
-  }
-
-  &-list-footer {
-    box-sizing: border-box;
-    height: @cascader-size-item-height;
-    padding-left: @cascader-padding-item-left;
-    line-height: @cascader-size-item-height;
-    border-top: 1px solid @select-popup-color-border;
-  }
-
-  &-option,
-  &-search-option {
-    position: relative;
-    display: flex;
-    box-sizing: border-box;
-    min-width: 100px;
-    height: @cascader-size-item-height;
-    color: @cascader-color-item-text;
-    font-size: @cascader-font-item-size;
-    line-height: @cascader-size-item-height;
-    background-color: transparent;
-    cursor: pointer;
-
-    &-label {
-      flex-grow: 1;
-      padding-right: @cascader-padding-item-right + @cascader-size-item-icon +
-        @cascader-margin-item-icon-left;
-      padding-left: @cascader-padding-item-left;
-    }
-
-    .@{prefix}-icon-right,
-    .@{prefix}-icon-check {
-      position: absolute;
-      top: 50%;
-      right: @cascader-padding-item-right;
-      color: @cascader-color-item-icon;
-      font-size: @cascader-size-item-icon;
-      transform: translateY(-50%);
-    }
-
-    .@{prefix}-icon-check {
-      color: @color-primary-6;
-    }
-
-    .@{prefix}-icon-loading {
-      position: absolute;
-      top: 50%;
-      right: @cascader-padding-item-right;
-      margin-top: -(@cascader-size-item-icon / 2);
-      color: @color-primary-6;
-      font-size: @cascader-size-item-icon;
-    }
-  }
-
-  &-option:hover,
-  &-search-option-hover {
-    color: @cascader-color-item-text_hover;
-    background-color: @cascader-color-item-bg_hover;
-
-    .@{prefix}-checkbox:not(.@{prefix}-checkbox-disabled):not(.@{prefix}-checkbox-checked):hover
-      .@{prefix}-checkbox-icon-hover::before {
-      background-color: @cascader-color-checkbox-bg_hover;
-    }
-
-    .@{prefix}-radio:not(.@{prefix}-radio-disabled):not(.@{prefix}-radio-checked):hover
-      .@{prefix}-radio-icon-hover::before {
-      background-color: @cascader-color-checkbox-bg_hover;
-    }
-  }
-
-  &-option,
-  &-search-option {
-    &-disabled,
-    &-disabled:hover {
-      color: @cascader-color-item-text_disabled;
-      background-color: @cascader-color-item-bg_disabled;
-      cursor: not-allowed;
-
-      .@{prefix}-icon-right {
-        color: inherit;
-      }
-
-      .@{prefix}-icon-check {
-        color: var(~'@{sd-cssvars-prefix}-color-primary-light-3');
-      }
-    }
-  }
-
-  &-option {
-    &-active {
-      color: @cascader-color-item-text_active;
-      background-color: @cascader-color-item-bg_active;
-      transition: all @transition-duration-2 @transition-timing-function-linear;
-
-      &:hover {
-        color: @cascader-color-item-text_active;
-        background-color: @cascader-color-item-bg_active;
-      }
-    }
-
-    &-active&-disabled,
-    &-active&-disabled:hover {
-      color: @cascader-color-item-text_disabled_active;
-      background-color: @cascader-color-item-bg_disabled_active;
-    }
-  }
-}
-
-.cascader-slide-enter-active,
-.cascader-slide-leave-active {
-  transition: margin @transition-duration-3 @transition-timing-function-standard;
-}
-
-.cascader-slide-enter-from,
-.cascader-slide-leave-to {
-  margin-left: -120px;
-}
-
-.cascader-slide-enter-to,
-.cascader-slide-leave-from {
-  margin-left: 0;
-}

package/es/cascader/style/token.less

@@ -1,39 +0,0 @@
-@import url('../../style/theme/index.less');
-
-@cascader-size-item-height: @size-9;
-
-@cascader-font-item-size: @font-size-body-3;
-
-@cascader-margin-item-icon-left: @spacing-6;
-
-@cascader-color-item-text: var(~'@{sd-cssvars-prefix}-color-text-1');
-
-@cascader-color-item-icon: var(~'@{sd-cssvars-prefix}-color-text-2');
-
-@cascader-padding-item-left: @spacing-6;
-
-@cascader-padding-item-right: @spacing-5;
-
-@cascader-size-item-icon: @size-3;
-
-@cascader-color-item-text_hover: @cascader-color-item-text;
-
-@cascader-color-item-text_active: @cascader-color-item-text;
-
-@cascader-color-item-text_disabled: var(~'@{sd-cssvars-prefix}-color-text-4');
-
-@cascader-color-item-text_disabled_active: var(~'@{sd-cssvars-prefix}-color-text-4');
-
-@cascader-font-item-weight_active: @font-weight-500;
-
-@cascader-color-item-bg_active: var(~'@{sd-cssvars-prefix}-color-fill-2');
-
-@cascader-color-item-bg_hover: @cascader-color-item-bg_active;
-
-@cascader-color-item-bg_disabled: @color-transparent;
-
-@cascader-color-item-bg_disabled_active: var(~'@{sd-cssvars-prefix}-color-fill-2');
-
-@cascader-color-checkbox-bg_hover: var(~'@{sd-cssvars-prefix}-color-fill-3');
-
-@cascader-margin-checkbox-right: @spacing-4;

package/es/checkbox/style/index.less

@@ -1,178 +0,0 @@
-@import url('../../style/mixins/index.less');
-@import url('./token.less');
-
-.icon-hover(@checkbox-prefix-cls, @checkbox-mask-height, @checkbox-mask-bg-height);
-
-.@{checkbox-prefix-cls} {
-  position: relative;
-  display: inline-flex;
-  align-items: center;
-  box-sizing: border-box;
-  padding-left: (@checkbox-mask-bg-height / 2) - (@checkbox-mask-height / 2);
-  font-size: @checkbox-text-font-size;
-  line-height: unset;
-  cursor: pointer;
-
-  > input[type='checkbox'] {
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 0;
-    height: 0;
-    opacity: 0;
-
-    &:focus-visible + .@{checkbox-prefix-cls}-icon-hover::before {
-      background-color: @icon-hover-color-bg;
-    }
-  }
-
-  &:hover {
-    .@{checkbox-prefix-cls}-icon-hover::before {
-      background-color: @checkbox-mask-bg-color-bg;
-    }
-  }
-
-  &-label {
-    margin-left: @checkbox-text-mask-spacing;
-    color: @checkbox-color-text;
-  }
-
-  &-icon {
-    position: relative;
-    box-sizing: border-box;
-    width: @checkbox-mask-height;
-    height: @checkbox-mask-height;
-    background-color: @checkbox-mask-color-bg;
-    border: @checkbox-mask-border-width @checkbox-mask-border-style @checkbox-mask-color-border;
-    border-radius: @checkbox-mask-border-radius;
-    user-select: none;
-
-    // 半选
-    &::after {
-      position: absolute;
-      top: 50%;
-      left: 50%;
-      display: block;
-      width: @checkbox-color-indeterminate-icon-width;
-      height: @checkbox-color-indeterminate-icon-height;
-      background: @checkbox-color-indeterminate-icon;
-      border-radius: 0.5px;
-      transform: translateX(-50%) translateY(-50%) scale(0);
-      content: '';
-    }
-
-    &-check {
-      position: relative;
-      display: block;
-      width: @checkbox-size-check-icon;
-      height: 100%;
-      margin: 0 auto;
-      color: @checkbox-color-check-icon;
-      transform: scale(0);
-      transform-origin: center 75%;
-    }
-  }
-
-  &:hover &-icon {
-    border-color: @checkbox-mask-color-border_hover;
-    transition:
-      border-color @transition-duration-1 @transition-timing-function-linear,
-      transform @transition-duration-3 @transition-timing-function-overshoot;
-  }
-
-  &-checked:hover &-icon,
-  &-indeterminate:hover &-icon {
-    transition: transform @transition-duration-3 @transition-timing-function-overshoot;
-  }
-
-  &-checked &-icon {
-    background-color: @checkbox-mask-color-bg_checked;
-    border-color: @checkbox-mask-color-border_checked;
-
-    &-check {
-      transform: scale(1);
-      transition: transform @transition-duration-3 @transition-timing-function-overshoot;
-    }
-  }
-
-  &-indeterminate &-icon {
-    background-color: @checkbox-mask-color-bg_checked;
-    border-color: @checkbox-mask-color-border_checked;
-
-    svg {
-      transform: scale(0);
-    }
-
-    &::after {
-      transform: translateX(-50%) translateY(-50%) scale(1);
-      transition: transform @transition-duration-3 @transition-timing-function-overshoot;
-    }
-  }
-
-  &&-disabled {
-    cursor: not-allowed;
-
-    .@{checkbox-prefix-cls}-icon-hover {
-      cursor: not-allowed;
-    }
-
-    &:hover .@{checkbox-prefix-cls}-mask {
-      border-color: @checkbox-mask-color-border_disabled;
-    }
-  }
-
-  &-checked:hover &-icon,
-  &-indeterminate:hover &-icon {
-    border-color: @checkbox-mask-color-border_checked;
-  }
-
-  &-disabled &-icon {
-    background-color: @checkbox-mask-color-bg_disabled;
-    border-color: @checkbox-mask-color-border_disabled;
-  }
-
-  &-disabled&-checked &-icon,
-  &-disabled&-checked:hover &-icon {
-    background-color: @checkbox-mask-color-bg_checked_disabled;
-    border-color: @checkbox-mask-color-border_checked_disabled;
-  }
-
-  &-disabled:hover,
-  &-checked:hover,
-  &-indeterminate:hover {
-    .@{checkbox-prefix-cls}-icon-hover::before {
-      background-color: @color-transparent;
-    }
-  }
-
-  &-disabled:hover &-icon {
-    border-color: @checkbox-mask-color-border;
-  }
-
-  &-disabled &-label {
-    color: @checkbox-color-text_disabled;
-  }
-
-  &-disabled &-icon-check {
-    color: @checkbox-color-check-icon_disabled;
-  }
-}
-
-// checkbox group
-.@{checkbox-prefix-cls}-group {
-  display: inline-block;
-
-  .@{checkbox-prefix-cls} {
-    margin-right: @checkbox-group-spacing;
-  }
-}
-
-// vertical direction
-
-.@{checkbox-prefix-cls}-group-direction-vertical {
-  .@{checkbox-prefix-cls} {
-    display: flex;
-    margin-right: 0;
-    line-height: @checkbox-group-size-line-height_vertical;
-  }
-}

package/es/checkbox/style/token.less

@@ -1,57 +0,0 @@
-@import url('../../style/theme/index.less');
-
-@checkbox-prefix-cls: ~'@{prefix}-checkbox';
-
-@checkbox-mask-border-width: @border-2;
-
-@checkbox-mask-border-style: @border-solid;
-
-@checkbox-mask-border-radius: @radius-small;
-
-@checkbox-mask-height: 14px;
-
-@checkbox-mask-bg-height: @size-6;
-
-@checkbox-mask-bg-color-bg: @icon-hover-color-bg;
-
-@checkbox-mask-color-bg: var(~'@{sd-cssvars-prefix}-color-bg-2');
-
-@checkbox-mask-color-bg_checked: @color-primary-6;
-
-@checkbox-mask-color-bg_disabled: var(~'@{sd-cssvars-prefix}-color-fill-2');
-
-@checkbox-mask-color-bg_checked_disabled: var(~'@{sd-cssvars-prefix}-color-primary-light-3');
-
-@checkbox-mask-color-border: var(~'@{sd-cssvars-prefix}-color-fill-3');
-
-@checkbox-mask-color-border_hover: var(~'@{sd-cssvars-prefix}-color-fill-4');
-
-@checkbox-mask-color-border_checked: @color-transparent;
-
-@checkbox-mask-color-border_checked_disabled: @color-transparent;
-
-@checkbox-mask-color-border_disabled: var(~'@{sd-cssvars-prefix}-color-fill-3');
-
-@checkbox-color-text: var(~'@{sd-cssvars-prefix}-color-text-1');
-
-@checkbox-color-text_disabled: var(~'@{sd-cssvars-prefix}-color-text-4');
-
-@checkbox-group-spacing: @spacing-7;
-
-@checkbox-text-mask-spacing: @spacing-4;
-
-@checkbox-text-font-size: @font-size-body-3;
-
-@checkbox-group-size-line-height_vertical: @size-8;
-
-@checkbox-size-check-icon: @size-2;
-
-@checkbox-color-check-icon: var(~'@{sd-cssvars-prefix}-color-white');
-
-@checkbox-color-check-icon_disabled: var(~'@{sd-cssvars-prefix}-color-fill-3');
-
-@checkbox-color-indeterminate-icon-width: 6px;
-
-@checkbox-color-indeterminate-icon-height: 2px;
-
-@checkbox-color-indeterminate-icon: var(~'@{sd-cssvars-prefix}-color-white');

package/es/collapse/style/index.less

@@ -1,177 +0,0 @@
-@import url('../../style/mixins/index.less');
-@import url('./token.less');
-
-@collapse-prefix-cls: ~'@{prefix}-collapse';
-
-.icon-hover(
-  ~'@{collapse-prefix-cls}-item',
-  @collapse-expand-icon-size,
-  @collapse-expand-icon-size-bg
-);
-
-.icon-hover-bg(~'@{collapse-prefix-cls}-item', @collapse-expand-icon-color-bg);
-
-.@{collapse-prefix-cls} {
-  overflow: hidden;
-  line-height: @collapse-line-height;
-  border: @collapse-border-width solid @collapse-color-border;
-  border-radius: @collapse-border-radius;
-
-  &-item {
-    box-sizing: border-box;
-    border-bottom: @collapse-title-border-width solid @collapse-item-color-border;
-
-    &-active {
-      > .@{collapse-prefix-cls}-item-header {
-        background-color: @collapse-title-color-bg_active;
-        border-color: @collapse-title-color-border;
-        transition: border-color 0s ease 0s;
-
-        .@{collapse-prefix-cls}-item-header-title {
-          font-weight: @collapse-title-font-weight_active;
-        }
-
-        .@{collapse-prefix-cls}-item-expand-icon {
-          transform: rotate(90deg);
-        }
-
-        .@{collapse-prefix-cls}-item-icon-right .@{collapse-prefix-cls}-item-expand-icon {
-          transform: rotate(-90deg);
-        }
-      }
-    }
-
-    &-header {
-      position: relative;
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      box-sizing: border-box;
-      padding-top: @collapse-title-padding-vertical;
-      padding-bottom: $padding-top;
-      overflow: hidden;
-      color: @collapse-title-color-text;
-      font-size: @collapse-title-font-size;
-      line-height: @collapse-title-line-height;
-      background-color: @collapse-title-color-bg;
-      border-bottom: 1px solid @color-transparent;
-      cursor: pointer;
-      // Ensure that the border is hidden when the collapse animation is complete
-      transition: border-color 0s ease 0.19s;
-
-      &-left {
-        padding-right: @collapse-title-padding-horizontal;
-        padding-left: @collapse-title-padding-horizontal + @collapse-expand-icon-size-bg +
-          @collapse-expand-icon-spacing-text;
-      }
-
-      &-right {
-        padding-right: @collapse-title-padding-horizontal + @collapse-expand-icon-size-bg +
-          @collapse-expand-icon-spacing-text;
-        padding-left: @collapse-title-padding-horizontal;
-
-        + .@{collapse-prefix-cls}-item-content {
-          padding-left: @collapse-title-padding-horizontal;
-        }
-      }
-
-      &-disabled {
-        color: @collapse-title-color-text_disabled;
-        background-color: @collapse-title-color-bg_disabled;
-        cursor: not-allowed;
-
-        .@{collapse-prefix-cls}-item-header-icon {
-          color: @collapse-title-color-text_disabled;
-        }
-      }
-
-      &-title {
-        display: inline;
-      }
-
-      &-extra {
-        float: right;
-      }
-    }
-
-    // expand icon style
-    & &-icon-hover {
-      position: absolute;
-      top: 50%;
-      left: @collapse-title-padding-horizontal;
-      text-align: center;
-      transform: translateY(-50%);
-    }
-
-    & &-icon-right {
-      right: @collapse-title-padding-horizontal;
-      left: unset;
-
-      > .@{collapse-prefix-cls}-item-header-icon-down {
-        transform: rotate(-90deg);
-      }
-    }
-
-    & &-expand-icon {
-      position: relative;
-      display: block;
-      color: @collapse-color-expand-icon;
-      font-size: @collapse-expand-icon-size;
-      vertical-align: middle;
-      transition: transform @transition-duration-2 @transition-timing-function-standard;
-    }
-
-    &-content {
-      position: relative;
-      padding-right: @collapse-title-padding-horizontal;
-      padding-left: @collapse-title-padding-horizontal + @collapse-expand-icon-size-bg +
-        @collapse-expand-icon-spacing-text;
-      overflow: hidden;
-      color: @collapse-content-color-text;
-      font-size: @collapse-content-font-size;
-      background-color: @collapse-content-color-bg;
-
-      &-expanded {
-        display: block;
-        height: auto;
-      }
-
-      &-box {
-        padding: @collapse-content-padding-vertical 0;
-      }
-    }
-
-    &&-disabled > &-content {
-      color: @collapse-content-color-text_disabled;
-    }
-
-    &-no-icon > &-header {
-      padding-right: @collapse-title-padding-horizontal;
-      padding-left: @collapse-title-padding-horizontal;
-    }
-
-    &:last-of-type {
-      border-bottom: none;
-    }
-  }
-
-  &.@{collapse-prefix-cls}-borderless {
-    border: none;
-  }
-
-  &::after {
-    display: table;
-    clear: both;
-    content: '';
-  }
-}
-
-.collapse-slider-enter-from,
-.collapse-slider-leave-to {
-  height: 0;
-}
-
-.collapse-slider-enter-active,
-.collapse-slider-leave-active {
-  transition: height @transition-duration-2 @transition-timing-function-standard;
-}