@nutui/nutui-react 1.1.4-beta.1 → 1.1.4-beta.2

package/dist/style.es.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react v1.1.4-beta.1 Wed May 11 2022 10:28:31 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v1.1.4-beta.2 Fri May 20 2022 09:39:04 GMT+0800 (China Standard Time)
 * (c) 2021 @jdf2e.
 * Released under the MIT License.
 */

package/dist/styles/themes/default.scss

@@ -47,6 +47,7 @@
 @import '../../packages/swiper/swiper.scss';
 @import '../../packages/swiperitem/swiperitem.scss';
 @import '../../packages/avatar/avatar.scss';
+@import '../../packages/avatargroup/avatargroup.scss';
 @import '../../packages/price/price.scss';
 @import '../../packages/badge/badge.scss';
 @import '../../packages/tag/tag.scss';

package/dist/styles/variables.scss

@@ -117,9 +117,9 @@ $icon-line-height: 20px;
 
 // uploader
 
-$uploader-width: 100px;
-$uploader-height: 100px;
-$uploader-background: #f7f8fa;
+$uploader-picture-width: 100px !default;
+$uploader-picture-height: 100px !default;
+$uploader-background: #f7f8fa !default;
 
 //input
 $input-border-bottom: #eaf0fb;
@@ -252,7 +252,33 @@ $rang-bar-bg-color: linear-gradient(135deg, $primary-color 0%, $primary-color-en
 $address-region-tab-line: linear-gradient(90deg, $primary-color 0%, $primary-color-end 100%);
 
 //steps
-$step-wait-bg-color: #959fb1;
+$steps-base-icon-width: 25px !default;
+$steps-base-icon-height: 25px !default;
+$steps-base-icon-line-height: 25px !default;
+$steps-base-icon-font-size: 13px !default;
+$steps-base-title-font-size: 14px !default;
+$steps-base-line-color: #909ca4 !default;
+$steps-base-title-color: #909ca4 !default;
+$steps-base-title-margin-bottom: 10px !default;
+$steps-base-content-font-size: 14px !default;
+$steps-base-content-color: #666 !default;
+
+$steps-wait-icon-bg-color: #959fb1 !default;
+$steps-wait-icon-color: $white !default;
+$steps-wait-head-color: #909ca4 !default;
+$steps-wait-head-border-color: #909ca4 !default;
+$steps-wait-content-color: #909ca4 !default;
+
+$steps-finish-head-color: $primary-color !default;
+$steps-finish-head-border-color: $primary-color !default;
+$steps-finish-title-color: $primary-color !default;
+$steps-finish-line-background: $primary-color !default;
+$steps-finish-icon-text-color: $white !default;
+
+$steps-process-head-color: $white !default;
+$steps-process-head-border-color: $primary-color !default;
+$steps-process-title-color: $primary-color !default;
+$steps-process-icon-text-color: $primary-color !default;
 
 // dialog
 $dialog-width: 296px;
@@ -374,3 +400,9 @@ $tabs-vertical-tab-line-color: linear-gradient(
 $tabs-vertical-titles-item-height: 40px !default;
 $tabs-vertical-titles-item-active-line-height: 14px !default;
 $tabs-vertical-titles-width: 100px !default;
+
+// circleProgress
+$circleprogress-primary-color: $primary-color !default;
+$circleprogress-path-color: #e5e9f2 !default;
+$circleprogress-text-color: #000000 !default;
+$circleprogress-text-size: $font-size-3 !default;

package/dist/types/avatar/__tests__/avatar.spec.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';

package/dist/types/avatar/avatar.d.ts

@@ -1,14 +1,17 @@
 import React, { FunctionComponent } from 'react';
 export interface AvatarProps {
-    size: AvatarSize;
+    size: string;
     icon: string;
     shape: AvatarShape;
     bgColor: string;
+    color: string;
     prefixCls: string;
-    src: string;
+    url: string;
     className: string;
+    alt: string;
     style: React.CSSProperties;
+    activeAvatar: (e: MouseEvent) => void;
+    onError: (e: any) => void;
 }
-export declare type AvatarSize = 'large' | 'normal' | 'small';
 export declare type AvatarShape = 'round' | 'square';
 export declare const Avatar: FunctionComponent<Partial<AvatarProps> & React.HTMLAttributes<HTMLDivElement>>;

package/dist/types/avatargroup/AvatarContext.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const AvatarContext: import("react").Context<{}>;

package/dist/types/avatargroup/__tests__/avatargroup.spec.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';

package/dist/types/avatargroup/avatargroup.d.ts

@@ -0,0 +1,14 @@
+import React, { FunctionComponent } from 'react';
+export interface AvatarGroupProps {
+    maxContent: string;
+    maxCount: string | number;
+    maxBgColor: string;
+    maxColor: string;
+    size: string;
+    shape: string;
+    span: string;
+    zIndex: string;
+    className: string;
+    style: React.CSSProperties;
+}
+export declare const AvatarGroup: FunctionComponent<Partial<AvatarGroupProps> & React.HTMLAttributes<HTMLDivElement>>;

package/dist/types/avatargroup/index.d.ts

@@ -0,0 +1,2 @@
+import { AvatarGroup } from './avatargroup';
+export default AvatarGroup;

package/dist/types/barrage/__tests__/barrage.spec.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';

package/dist/types/button/button.d.ts

@@ -1,4 +1,4 @@
-import { FunctionComponent } from 'react';
+import React, { FunctionComponent } from 'react';
 export interface ButtonProps {
     className: string;
     color: string;
@@ -6,7 +6,7 @@ export interface ButtonProps {
     plain: boolean;
     loading: boolean;
     disabled: boolean;
-    style: object;
+    style: React.CSSProperties;
     type: ButtonType;
     size: ButtonSize;
     block: boolean;

package/dist/types/checkbox/__test__/checkbox.spec.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';

package/dist/types/circleprogress/__tests__/circleprogress.spec.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';

package/dist/types/circleprogress/circleprogress.d.ts

@@ -1,9 +1,15 @@
 import React, { FunctionComponent } from 'react';
+export interface IColor {
+    [key: string]: string;
+}
 export interface CircleProgressProps {
-    strokeInnerWidth: string | number;
     progress: string | number;
-    isAuto: boolean;
-    progressOption: object;
-    className: string;
+    strokeWidth?: string | number;
+    radius?: number | string;
+    strokeLinecap?: 'butt' | 'round' | 'square' | 'inherit' | undefined;
+    circleColor?: object | string;
+    pathColor?: string;
+    clockwise?: boolean;
+    className?: string;
 }
-export declare const CircleProgress: FunctionComponent<Partial<CircleProgressProps> & React.HTMLAttributes<HTMLDivElement>>;
+export declare const CircleProgress: FunctionComponent<CircleProgressProps & React.HTMLAttributes<HTMLDivElement>>;

package/dist/types/icon/__test__/icon.spec.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';

package/dist/types/infiniteloading/__tests__/infiniteloading.spec.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';

package/dist/types/inputnumber/__tests__/inputnumber.spec.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';

package/dist/types/overlay/__tests__/overlay.spec.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';

package/dist/types/skeleton/__test__/skeleton.spec.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';

package/dist/types/skeleton/skeleton.d.ts

@@ -1,8 +1,8 @@
 import React, { FunctionComponent } from 'react';
 declare type avatarShape = 'round' | 'square';
 export interface SkeletonProps {
-    width: number;
-    height: number;
+    width: string;
+    height: string;
     animated: boolean;
     row: number;
     title: boolean;

package/dist/types/step/step.d.ts

@@ -4,6 +4,7 @@ export interface StepProps {
     content: string;
     activeIndex: number;
     icon: string;
+    iconColor: string;
     size: string;
     className: string;
     style: React.CSSProperties;

package/dist/types/steps/__tests__/steps.spec.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';

package/dist/types/steps/steps.d.ts

@@ -5,5 +5,6 @@ export interface StepsProps {
     progressDot: boolean;
     className: string;
     style: React.CSSProperties;
+    clickStep: (index: number) => void;
 }
 export declare const Steps: FunctionComponent<Partial<StepsProps> & React.HTMLAttributes<HTMLDivElement>>;

package/dist/types/tabbaritem/tabbaritem.d.ts

@@ -3,6 +3,7 @@ export interface TabbarItemProps {
     tabTitle: string;
     icon: string;
     href: string;
+    to: object | string;
     num: string | number;
     active: boolean;
     activeColor: string;

package/dist/types/uploader/__tests__/uploader.spec.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';

package/dist/types/uploader/uploader.d.ts

@@ -1,10 +1,17 @@
 import React from 'react';
 import { UploadOptions } from './upload';
+export declare type FileType<T> = {
+    [key: string]: T;
+};
+export declare type FileItemStatus = 'ready' | 'uploading' | 'success' | 'error' | 'removed';
 export interface UploaderProps {
     url: string;
     maximum: string | number;
     maximize: number;
+    defaultFileList: FileType<string>[];
+    listType: string;
     uploadIcon: string;
+    uploadIconSize: string | number;
     name: string;
     accept: string;
     disabled: boolean;
@@ -45,10 +52,11 @@ export interface UploaderProps {
     }) => void;
     beforeUpload?: (file: File[]) => Promise<File[]>;
     beforeDelete?: (file: FileItem, files: FileItem[]) => boolean;
+    fileItemClick?: (file: FileItem) => void;
 }
-export declare type FileItemStatus = 'ready' | 'uploading' | 'success' | 'error' | 'removed';
 export declare class FileItem {
     status: FileItemStatus;
+    message: string;
     uid: string;
     name?: string;
     url?: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nutui/nutui-react",
-  "version": "1.1.4-beta.1",
+  "version": "1.1.4-beta.2",
   "style": "dist/style.css",
   "main": "dist/nutui.react.umd.js",
   "module": "dist/esm/nutui-react.es.js",
@@ -50,7 +50,7 @@
     "build:replace": "npm run replace:scss",
     "build:es": "npx rollup -c rollup.config.es.js",
     "build:locales": "vite build --config vite.config.build.locales.ts",
-    "build": "npm run checked && vite build --config vite.config.build.ts && npm run build:es && npm run build:css && npm run build:loader-style && npm run build:types && npm run build:locales",
+    "build": "npm run checked && npm run test && vite build --config vite.config.build.ts && npm run build:es && npm run build:css && npm run build:loader-style && npm run build:types && npm run build:locales",
     "build:site": "npm run checked && vite build --config vite.config.build.site.ts",
     "lint": "eslint .",
     "lint:fix": "eslint --fix .",
@@ -58,6 +58,9 @@
     "prepare": "husky install",
     "test": "jest"
   },
+  "engines": {
+    "node": "^14.18.0 || >=15.0.0"
+  },
   "lint-staged": {
     "*.md": "prettier --write",
     "*.{ts,tsx,js,vue,scss}": "prettier --write"
@@ -66,7 +69,7 @@
     "@babel/runtime": "^7.16.5",
     "@bem-react/classname": "^1.5.10",
     "@react-spring/web": "^9.3.2",
-    "@use-gesture/react": "^10.2.4",
+    "@use-gesture/react": "10.2.9",
     "classnames": "^2.3.1",
     "react-router-dom": "^5.2.0",
     "react-transition-group": "^4.4.2"

package/dist/styles/variables-jdw.scss

@@ -1,376 +0,0 @@
-// color
-
-// 主色调
-$primary-color: #fa2c19 !default;
-$primary-color-end: #fa6419 !default;
-// 辅助色
-$help-color: #f5f5f5 !default;
-// 标题常规文字
-$title-color: #1a1a1a !default;
-// 副标题
-$title-color2: #666666 !default;
-// 次内容
-$text-color: #808080 !default;
-// 特殊禁用色
-$disable-color: #cccccc !default;
-$white: #fff;
-$black: #000;
-
-// padding
-$padding-xs: 12px;
-
-$font-family: PingFang SC, Microsoft YaHei, Helvetica, Hiragino Sans GB, SimSun, sans-serif !default;
-
-// ---- Animation ----
-$animation-duration: 0.25s !default;
-$animation-timing-fun: cubic-bezier(0.55, 0.085, 0.68, 0.53) !default;
-
-// Font
-$font-size-0: 10px;
-$font-size-1: 12px;
-$font-size-2: 14px;
-$font-size-3: 16px;
-$font-size-4: 18px;
-$font-weight-bold: 400;
-
-$font-size-small: $font-size-1;
-$font-size-base: $font-size-2;
-$font-size-large: $font-size-3;
-$line-height-base: 1.5 !default;
-// button
-$button-border-radius: 25px;
-$button-border-width: 1px;
-$button-default-bg-color: $white;
-$button-default-border-color: rgba(204, 204, 204, 1);
-$button-default-color: rgba(102, 102, 102, 1);
-$button-small-height: 28px;
-$button-default-height: 38px;
-$button-large-height: 48px;
-$button-large-line-height: 46px;
-$button-small-line-height: 26px;
-$button-block-height: 48px;
-$button-default-line-height: 36px;
-$button-block-line-height: 46px;
-$button-default-font-size: $font-size-2;
-$button-disabled-opacity: 0.68;
-$button-primary-color: $white;
-$button-primary-border-color: $primary-color;
-$button-primary-background-color: linear-gradient(
-  135deg,
-  $primary-color 0%,
-  $primary-color-end 100%
-);
-$button-info-color: $white;
-$button-info-border-color: rgba(73, 106, 242, 1);
-$button-info-background-color: linear-gradient(
-  315deg,
-  rgba(73, 143, 242, 1) 0%,
-  rgba(73, 101, 242, 1) 100%
-);
-$button-success-color: $white;
-$button-success-border-color: rgba(38, 191, 38, 1);
-$button-success-background-color: linear-gradient(
-  135deg,
-  rgba(38, 191, 38, 1) 0%,
-  rgba(39, 197, 48, 1) 45%,
-  rgba(40, 207, 63, 1) 83%,
-  rgba(41, 212, 70, 1) 100%
-);
-
-$button-danger-color: $white;
-$button-danger-border-color: rgba(250, 44, 25, 1);
-$button-danger-background-color: rgba(250, 44, 25, 1);
-$button-warning-color: $white;
-$button-warning-border-color: rgba(255, 158, 13, 1);
-$button-warning-background-color: linear-gradient(
-  135deg,
-  rgba(255, 158, 13, 1) 0%,
-  rgba(255, 167, 13, 1) 45%,
-  rgba(255, 182, 13, 1) 83%,
-  rgba(255, 190, 13, 1) 100%
-);
-$button-plain-background-color: #fff;
-$button-plain-background-color: $white;
-
-// cell
-
-$cell-color: $title-color2;
-$cell-title-font: $font-size-2;
-$cell-title-desc-font: $font-size-1;
-$cell-desc-font: $font-size-2;
-$cell-desc-color: $disable-color;
-$cell-border-radius: 6px;
-
-// cell-group
-
-$cell-group-title-padding: 0 10px;
-$cell-group-title-color: #909ca4;
-$cell-group-title-font-size: $font-size-2;
-$cell-group-title-line-height: 20px;
-$cell-group-background-color: $white;
-
-// icon
-
-$icon-height: 20px;
-$icon-width: 20px;
-$icon-line-height: 20px;
-
-// uploader
-
-$uploader-width: 100px;
-$uploader-height: 100px;
-$uploader-background: #f7f8fa;
-
-//input
-$input-border-bottom: #eaf0fb;
-$input-disabled-color: #c8c9cc;
-
-// textarea
-
-$textarea-font: $font-size-2;
-$textarea-height: 100px;
-$textarea-limit-color: $text-color;
-$textarea-text-color: $title-color;
-$textarea-disabled-color: $disable-color;
-
-// inputnumber
-
-$inputnumber-icon-color: $title-color;
-$inputnumber-icon-void-color: $disable-color;
-$inputnumber-input-background-color: $help-color;
-$inputnumber-input-border-radius: 4px;
-$inputnumber-input-width: 40px;
-$inputnumber-icon-size: 20px;
-
-// actionsheet
-$zindex-actionsheet: 10001 !default;
-$body-background: #f6f6f6 !default;
-$light-color: #f6f6f6 !default;
-$font-size-base: $font-size-2;
-$font-size-small: $font-size-1;
-
-//shortpassword
-$shortpsd-background-color: rgba(245, 245, 245, 1);
-$shortpsd-border-color: #ddd;
-$shortpsd-error: rgba(242, 39, 12, 1);
-$shortpsd-forget: rgba(128, 128, 128, 1);
-
-//price
-$price-big-size: 24px;
-
-//avatar
-$avatar-square: 5px;
-$avatar-large-width: 60px;
-$avatar-large-height: 60px;
-$avatar-small-width: 32px;
-$avatar-small-height: 32px;
-$avatar-normal-width: 40px;
-$avatar-normal-height: 40px;
-
-//switch
-$switch-close-bg-color: #ebebeb;
-$switch-close--cline-bg-color: #f0f0f0;
-
-//backtop
-$backtop-border-color: #e0e0e0;
-
-// calendar
-$calendar-primary-color: $primary-color;
-$calendar-choose-color: #fef6f6;
-$calendar-base-color: #333333;
-$calendar-disable-color: #d1d0d0;
-$calendar-title-font: $font-size-4;
-$calendar-base-font: $font-size-3;
-$calendar-text-font: $font-size-1;
-$calendar-day-font: 18px;
-
-//overlay
-$overlay-bg-color: rgba(0, 0, 0, 0.7);
-
-//popup
-$popup-close-icon-margin: 16px;
-$popup-border-radius: 20px;
-
-// Notify
-$notify-text-color: $white;
-$notify-padding: 12px 0;
-$notify-font-size: 14px;
-$notify-height: 44px;
-
-// NoticeBar
-$noticeBar-font-size: 14px !default;
-$noticeBar-height: 40px !default;
-$noticeBar-line-height: 24px !default;
-$noticeBar-left-icon-width: 16px !default;
-$noticeBar-right-icon-width: 16px !default;
-
-$notify-base-background-color: linear-gradient(
-  135deg,
-  rgba(250, 44, 25, 1) 0%,
-  rgba(250, 63, 25, 1) 45%,
-  rgba(250, 89, 25, 1) 83%,
-  rgba(250, 100, 25, 1) 100%
-);
-$notify-primary-background-color: linear-gradient(
-  315deg,
-  rgba(73, 143, 242, 1) 0%,
-  rgba(73, 101, 242, 1) 100%
-);
-$notify-success-background-color: linear-gradient(
-  135deg,
-  rgba(38, 191, 38, 1) 0%,
-  rgba(39, 197, 48, 1) 45%,
-  rgba(40, 207, 63, 1) 83%,
-  rgba(41, 212, 70, 1) 100%
-);
-$notify-danger-background-color: rgba(250, 50, 25, 1);
-$notify-warning-background-color: linear-gradient(
-  135deg,
-  rgba(255, 93, 13, 1) 0%,
-  rgba(255, 154, 13, 1) 100%
-);
-
-// rate
-
-$rate-icon-color: $primary-color;
-$rate-icon-void-color: $disable-color;
-
-// tabbar
-
-$tabbar-active-color: $primary-color;
-$tabbar-border-color: #eee;
-
-//infiniteloading
-$infinite-bottom-color: #c8c8c8;
-
-//range
-$range-max: #333333;
-$rang-bg-color: rgba($primary-color, 0.5);
-$rang-bar-bg-color: linear-gradient(135deg, $primary-color 0%, $primary-color-end 100%);
-
-//address
-$address-region-tab-line: linear-gradient(90deg, $primary-color 0%, $primary-color-end 100%);
-
-//steps
-$step-wait-bg-color: #959fb1;
-
-// dialog
-$dialog-width: 296px;
-
-// checkbox
-$checkbox-label-color: #1d1e1e;
-$checkbox-label-disable-color: #999;
-
-//radio
-$radio-label-font-color: #1d1e1e !default;
-$radio-label-font-active-color: #f0250f !default;
-$radio-label-disable-color: #999 !default;
-$radio-icon-disable-color: #d6d6d6 !default;
-
-$radio-label-button-border-color: #f0250f !default;
-$radio-label-button-background: rgba(240, 37, 15, 0.05) !default;
-
-// signature
-$signature-border-color: #dadada;
-
-//fixednav
-$fixednav-bg-color: $white;
-$fixednav-font-color: $black;
-$fixednav-index: 201;
-$fixednav-btn-bg: linear-gradient(135deg, rgba(250, 25, 44, 1) 0%, rgba(250, 63, 25, 1) 100%);
-
-// Tag
-$tag-font-size: 12px !default;
-$tag-default-background-color: #000000 !default;
-$tag-primary-background-color: #3460fa !default;
-$tag-success-background-color: #4fc08d !default;
-$tag-danger-background-color: linear-gradient(
-  135deg,
-  rgba(242, 20, 12, 1) 0%,
-  rgba(232, 34, 14, 1) 69.83950099728881%,
-  rgba(242, 77, 12, 1) 100%
-) !default;
-$tag-warning-background-color: #f3812e !default;
-$tag-default-color: #ffffff !default;
-$tag-border-width: 1px !default;
-
-$tag-plain-background-color: #fff !default;
-$tag-plain-color: rgb(250, 36, 0) !default;
-
-//badge
-$badge-background-color: linear-gradient(
-  135deg,
-  $primary-color 0%,
-  $primary-color-end 100%
-) !default;
-$badge-font-size: $font-size-1 !default;
-$badge-default-background-color: rgba(255, 255, 255, 1) !default;
-
-//popover
-$popover-white-background-color: rgba(255, 255, 255, 1) !default;
-$popover-dark-background-color: rgba(75, 76, 77, 1) !default;
-$popover-border-bottom-color: rgba(229, 229, 229, 1) !default;
-$popover-primary-text-color: rgba(51, 51, 51, 1) !default;
-$popover-disable-color: rgba(154, 155, 157, 1) !default;
-
-//pagination
-$pagination-color: $primary-color !default;
-$pagination-font-size: $font-size-2 !default;
-$pagination-item-border-color: #e4e7eb !default;
-$pagination-active-background-color: linear-gradient(
-  135deg,
-  rgba(250, 44, 25, 1) 0%,
-  rgba(250, 63, 25, 1) 44.59259259%,
-  rgba(250, 89, 25, 1) 83.40740741%,
-  rgba(250, 100, 25, 1) 100%
-) !default;
-$pagination-disable-color: rgba(116, 116, 116, 0.31) !default;
-$pagination-disable-background-color: #f7f8fa !default;
-$pagination-item-border-width: 1px !default;
-$pagination-item-border-radius: 2px !default;
-$pagination-prev-next-padding: 0 11px !default;
-
-// dialog
-$dialog-min-height: 156px !default;
-$dialog-padding: 28px 24px 16px 24px !default;
-$dialog-header-height: 20px !default;
-$dialog-header-color: rgba(38, 38, 38, 1) !default;
-$dialog-content-margin: 20px 0 !default;
-$dialog-content-max-height: 268px !default;
-$dialog-content-line-height: 16px !default;
-$dialog-mask-z-index: 1050 !default;
-$dialog-mask-background-color: rgba($black, 0.7) !default;
-$dialog-outer-z-index: 2000 !default;
-$dialog-outer-bordder-radius: 20px !default;
-$dialog-vertical-footer-ok-margin-top: 10px !default;
-$dialog-footer-button-min-width: 100px !default;
-$dialog-footer-cancel-margin-right: 20px !default;
-$dialog-footer-ok-max-width: 128px !default;
-// 在组件中import
-//@import './mixins/index';
-//@import './animation/index';
-
-// tabs
-$tabs-tab-smile-color: $primary-color !default;
-$tabs-titles-border-radius: 0 !default;
-$tabs-titles-item-large-font-size: $font-size-3 !default;
-$tabs-titles-item-font-size: $font-size-2 !default;
-$tabs-titles-item-small-font-size: $font-size-1 !default;
-$tabs-titles-item-color: $title-color !default;
-$tabs-titles-background-color: $help-color !default;
-$tabs-horizontal-tab-line-color: linear-gradient(
-  90deg,
-  $primary-color 0%,
-  rgba($primary-color, 0.15) 100%
-) !default;
-$tabs-horizontal-titles-height: 46px !default;
-$tabs-horizontal-titles-item-min-width: 50px !default;
-$tabs-horizontal-titles-item-active-line-width: 40px !default;
-$tabs-vertical-tab-line-color: linear-gradient(
-  180deg,
-  $primary-color 0%,
-  rgba($primary-color, 0.15) 100%
-) !default;
-$tabs-vertical-titles-item-height: 40px !default;
-$tabs-vertical-titles-item-active-line-height: 14px !default;
-$tabs-vertical-titles-width: 100px !default;