@fox-js/foxui-pc 4.1.1-37 → 4.1.1-39

package/dist/style.css

@@ -575,7 +575,7 @@
 .fox-group__header-mark {
   width: var(--fox-group-header-mark-width, 3px);
   height: var(--fox-group-header-mark-height, 15px);
-  background: var(--fox-group-header-mark-color, var(--fox-primary-color, var(--el-color-primary)));
+  background: var(--fox-group-header-mark-color, var(--fox-color-primary, var(--el-color-primary)));
   display: inline-block;
 }
 
@@ -590,7 +590,7 @@
 
 .fox-group__header-collapse {
   cursor: pointer;
-  color: var(--fox-group-header-collapse-color, var(--fox-primary-color, var(--el-color-primary)));
+  color: var(--fox-group-header-collapse-color, var(--fox-color-primary, var(--el-color-primary)));
   flex-flow: row;
   flex: none;
   justify-content: flex-start;
@@ -650,7 +650,7 @@
 }
 
 .fox-item.is-error:before {
-  border-bottom: 1px solid var(--fox-input-item-tip-error-color, var(--fox-danger-color, var(--el-color-danger)));
+  border-bottom: 1px solid var(--fox-input-item-tip-error-color, var(--fox-color-danger, var(--el-color-danger)));
   transition: transform .2s cubic-bezier(0, 0, .2, 1);
   transform: scaleX(0);
 }
@@ -771,15 +771,15 @@
 }
 
 .fox-item__tip--info {
-  color: var(--fox-input-item-tip-info-color, var(--fox-primary-color, var(--el-color-primary)));
+  color: var(--fox-input-item-tip-info-color, var(--fox-color-primary, var(--el-color-primary)));
 }
 
 .fox-item__tip--warn {
-  color: var(--fox-input-item-tip-warn-color, var(--fox-warning-color, var(--el-color-warning)));
+  color: var(--fox-input-item-tip-warn-color, var(--fox-color-warning, var(--el-color-warning)));
 }
 
 .fox-item__tip--error {
-  color: var(--fox-input-item-tip-error-color, var(--fox-danger-color, var(--el-color-danger)));
+  color: var(--fox-input-item-tip-error-color, var(--fox-color-danger, var(--el-color-danger)));
 }
 
 .fox-item__fixed-tip {
@@ -853,12 +853,12 @@
 }
 
 .fox-buttons-item__dropdown-link {
+  --fox-text-mark-icon-height: var(--fox-buttons-item-dropdown-link-icon-size, 16px);
+  --fox-text-mark-icon-width: var(--fox-buttons-item-dropdown-link-icon-size, 16px);
+  --fox-text-font-size: var(--fox-font-size-small);
   cursor: pointer;
-}
-
-.fox-buttons-item__dropdown-link svg {
-  width: 1em;
-  height: 1em;
+  color: var(--fox-buttons-item-dropdown-link-icon-color);
+  font-size: var(--fox-font-size-small);
 }
 
 .fox-buttons-item__dropdown-item {
@@ -884,10 +884,6 @@
   cursor: default;
 }
 
-.fox-buttons-item > * + * {
-  margin-left: var(--fox-buttons-item-gutter, 12px);
-}
-
 .fox-hint-text {
   z-index: var(--fox-hint-text-z-index, 3000);
   padding: var(--fox-hint-text-padding, 6px 8px);
@@ -1593,7 +1589,7 @@
 }
 
 .fox-tabs-bar__titles-item.active {
-  color: var(--fox-tabs-bar-item-color-active, var(--fox-primary-color, var(--el-color-primary)));
+  color: var(--fox-tabs-bar-item-color-active, var(--fox-color-primary, var(--el-color-primary)));
   font-size: var(--fox-tabs-bar-item-font-size-default-active, var(--fox-font-size-base, 14px));
   font-weight: var(--fox-tabs-bar-item-font-weight-active, bold);
 }
@@ -1601,8 +1597,8 @@
 .fox-tabs-bar__titles-item.active .fox-tabs-bar__titles-item-line {
   content: " ";
   width: var(--fox-tabs-bar-item-line-width-horizontal, 40px);
-  background: var(--fox-tabs-bar-item-line-color-horizontal, var(--fox-primary-color, var(--el-color-primary)));
-  height: 3px;
+  height: var(--fox-tabs-bar-item-line-height-horizontal, 3px);
+  background: var(--fox-tabs-bar-item-line-color-horizontal, var(--fox-color-primary, var(--el-color-primary)));
 }
 
 .fox-tabs-bar__titles-item.button {
@@ -1619,7 +1615,7 @@
 
 .fox-tabs-bar__titles-item.button.active {
   background: var(--fox-tabs-bar-item-background-active-button, #fff);
-  color: var(--fox-tabs-bar-item-color-active-button, var(--fox-primary-color, var(--el-color-primary)));
+  color: var(--fox-tabs-bar-item-color-active-button, var(--fox-color-primary, var(--el-color-primary)));
   font-size: var(--fox-tabs-bar-item-font-size-active-button, 12px);
   font-weight: var(--fox-tabs-bar-item-font-weight-button, 400);
   border: var(--fox-tabs-bar-item-border-active-button, 1px solid transparent);
@@ -1632,7 +1628,7 @@
 .fox-tabs-bar__titles-item.button-group:first-child {
   border-top-left-radius: var(--fox-tabs-bar-item-radius-button-group, 8px);
   border-bottom-left-radius: var(--fox-tabs-bar-item-radius-button-group, 8px);
-  border-left: var(--fox-tabs-bar-item-border-width-button-group, 1px) solid var(--fox-tabs-bar-item-background-active-button-group, var(--fox-primary-color, var(--el-color-primary)));
+  border-left: var(--fox-tabs-bar-item-border-width-button-group, 1px) solid var(--fox-tabs-bar-item-background-active-button-group, var(--fox-color-primary, var(--el-color-primary)));
 }
 
 .fox-tabs-bar__titles-item.button-group:last-child {
@@ -1645,18 +1641,18 @@
   width: var(--fox-tabs-bar-item-width-button-group, 105px);
   height: var(--fox-tabs-bar-item-height-button-group, 32px);
   background: var(--fox-tabs-bar-item-background-button-group, #fff);
-  color: var(--fox-tabs-bar-item-color-button-group, var(--fox-primary-color, var(--el-color-primary)));
+  color: var(--fox-tabs-bar-item-color-button-group, var(--fox-color-primary, var(--el-color-primary)));
   font-size: var(--fox-tabs-bar-item-font-size-button-group, 14px);
   font-weight: var(--fox-tabs-bar-item-font-weight-button-group, 400);
-  border-top: var(--fox-tabs-bar-item-border-width-button-group, 1px) solid var(--fox-tabs-bar-item-background-active-button-group, var(--fox-primary-color, var(--el-color-primary)));
-  border-right: var(--fox-tabs-bar-item-border-width-button-group, 1px) solid var(--fox-tabs-bar-item-background-active-button-group, var(--fox-primary-color, var(--el-color-primary)));
-  border-bottom: var(--fox-tabs-bar-item-border-width-button-group, 1px) solid var(--fox-tabs-bar-item-background-active-button-group, var(--fox-primary-color, var(--el-color-primary)));
-  border-left: 0 solid var(--fox-tabs-bar-item-background-active-button-group, var(--fox-primary-color, var(--el-color-primary)));
+  border-top: var(--fox-tabs-bar-item-border-width-button-group, 1px) solid var(--fox-tabs-bar-item-background-active-button-group, var(--fox-color-primary, var(--el-color-primary)));
+  border-right: var(--fox-tabs-bar-item-border-width-button-group, 1px) solid var(--fox-tabs-bar-item-background-active-button-group, var(--fox-color-primary, var(--el-color-primary)));
+  border-bottom: var(--fox-tabs-bar-item-border-width-button-group, 1px) solid var(--fox-tabs-bar-item-background-active-button-group, var(--fox-color-primary, var(--el-color-primary)));
+  border-left: 0 solid var(--fox-tabs-bar-item-background-active-button-group, var(--fox-color-primary, var(--el-color-primary)));
   flex: none;
 }
 
 .fox-tabs-bar__titles-item.button-group.active {
-  background: var(--fox-tabs-bar-item-background-active-button-group, var(--fox-primary-color, var(--el-color-primary)));
+  background: var(--fox-tabs-bar-item-background-active-button-group, var(--fox-color-primary, var(--el-color-primary)));
   color: var(--fox-tabs-bar-item-color-active-button-group, #fff);
   font-size: var(--fox-tabs-bar-item-font-size-active-button-group, 14px);
   font-weight: var(--fox-tabs-bar-item-font-weight-button-group, 400);
@@ -1680,7 +1676,7 @@
 
 .fox-tabs-bar__titles-item.capsule.active {
   background: var(--fox-tabs-bar-item-background-active-capsule, #fff);
-  color: var(--fox-tabs-bar-item-color-active-capsule, var(--fox-primary-color, var(--el-color-primary)));
+  color: var(--fox-tabs-bar-item-color-active-capsule, var(--fox-color-primary, var(--el-color-primary)));
   font-size: var(--fox-tabs-bar-item-font-size-active-capsule, 14px);
   font-weight: var(--fox-tabs-bar-item-font-weight-capsule, 400);
 }
@@ -1719,7 +1715,7 @@
   line-height: 1;
   font-size: var(--fox-tabs-bar-item-tip-font-size, 10px);
   color: var(--fox-tabs-bar-item-tip-color, var(--fox-white, #fff));
-  background: var(--fox-tabs-bar-item-tip-background, var(--fox-primary-color, var(--el-color-primary)));
+  background: var(--fox-tabs-bar-item-tip-background, var(--fox-color-primary, var(--el-color-primary)));
   box-shadow: var(--fox-tabs-bar-item-tip-box-shadow, 0 0 0 1px #fff);
   border-radius: 50%;
   position: absolute;
@@ -1869,9 +1865,9 @@
 }
 
 .fox-tabs-bar__titles.vertical .fox-tabs-bar__titles-item.active .fox-tabs-bar__titles-item-line {
-  background: var(--fox-tabs-bar-item-line-color-vertical, var(--fox-primary-color, var(--el-color-primary)));
-  width: 3px;
+  width: var(--fox-tabs-bar-item-line-width-vertical, 3px);
   height: var(--fox-tabs-bar-item-line-height-vertical, 14px);
+  background: var(--fox-tabs-bar-item-line-color-vertical, var(--fox-color-primary, var(--el-color-primary)));
   top: 50%;
   left: 10px;
 }
@@ -1929,7 +1925,7 @@
 }
 
 .fox-tabs-bar__popup-item.active {
-  color: var(--fox-tabs-bar-popup-item-color-active, var(--fox-primary-color, var(--el-color-primary)));
+  color: var(--fox-tabs-bar-popup-item-color-active, var(--fox-color-primary, var(--el-color-primary)));
   background: var(--fox-tabs-bar-popup-item-background-active, #ffecec);
 }
 
@@ -2162,7 +2158,7 @@
 }
 
 .fox-steps-bar.is-vertical .fox-steps-bar__mark {
-  color: var(--fox-steps-bar-mark-color, var(--fox-primary-color, var(--el-color-primary)));
+  color: var(--fox-steps-bar-mark-color, var(--fox-color-primary, var(--el-color-primary)));
   height: var(--fox-steps-bar-mark-height-vertical, var(--fox-steps-bar-icon-size, 28px));
   width: var(--fox-steps-bar-mark-width-vertical, var(--fox-steps-bar-icon-size, 28px));
   flex: none;
@@ -2221,7 +2217,7 @@
 
 .fox-steps-bar__step.is-active .fox-steps-bar__icon {
   color: var(--fox-steps-bar-icon-active-color, var(--fox-white, #fff));
-  background: var(--fox-steps-bar-icon-bg-active-color, var(--fox-primary-color, var(--el-color-primary)));
+  background: var(--fox-steps-bar-icon-bg-active-color, var(--fox-color-primary, var(--el-color-primary)));
 }
 
 .fox-steps-bar__step.is-done {
@@ -2234,7 +2230,7 @@
 
 .fox-steps-bar__step.is-done .fox-steps-bar__icon {
   color: var(--fox-steps-bar-icon-done-color, var(--fox-white, #fff));
-  background: var(--fox-steps-bar-icon-bg-done-color, var(--fox-success-color, var(--el-color-success)));
+  background: var(--fox-steps-bar-icon-bg-done-color, var(--fox-color-success, var(--el-color-success)));
 }
 
 .fox-steps-bar__step.is-error {
@@ -2247,7 +2243,7 @@
 
 .fox-steps-bar__step.is-error .fox-steps-bar__icon {
   color: var(--fox-steps-bar-icon-error-color, var(--fox-white, #fff));
-  background: var(--fox-steps-bar-icon-bg-error-color, var(--fox-danger-color, var(--el-color-danger)));
+  background: var(--fox-steps-bar-icon-bg-error-color, var(--fox-color-danger, var(--el-color-danger)));
 }
 
 .fox-steps-bar__step.is-half {
@@ -2260,7 +2256,7 @@
 
 .fox-steps-bar__step.is-half .fox-steps-bar__icon {
   color: var(--fox-steps-bar-icon-half-color, var(--fox-white, #fff));
-  background: var(--fox-steps-bar-icon-bg-half-color, var(--fox-warning-color, var(--el-color-warning)));
+  background: var(--fox-steps-bar-icon-bg-half-color, var(--fox-color-warning, var(--el-color-warning)));
 }
 
 .fox-steps-bar__step.is-doit .fox-steps-bar__icon {
@@ -2276,7 +2272,7 @@
 
 .fox-steps-bar__step.is-doit.is-active .fox-steps-bar__icon:before {
   content: "";
-  background-color: var(--fox-steps-bar-icon-bg-active-color, var(--fox-primary-color, var(--el-color-primary)));
+  background-color: var(--fox-steps-bar-icon-bg-active-color, var(--fox-color-primary, var(--el-color-primary)));
   opacity: .23;
   border-radius: 50%;
   width: 14px;
@@ -2299,7 +2295,7 @@
 }
 
 .fox-steps-bar__line-inner {
-  color: var(--fox-steps-bar-line-active-color, var(--fox-primary-color, var(--el-color-primary)));
+  color: var(--fox-steps-bar-line-active-color, var(--fox-color-primary, var(--el-color-primary)));
   border-width: var(--fox-steps-bar-line-border-width, 1px);
   border-style: var(--fox-steps-bar-line-border-style, solid);
   border-color: inherit;
@@ -2714,16 +2710,12 @@
   margin-left: 16px;
 }
 
-.fox-theme-dark .fox-infinite-loading .fox-infinite__bottom, .fox-theme-dark .fox-infinite-loading .fox-infinite__bottom .bottom-text {
-  color: var(--fox-dark-color, var(--fox-white, #fff));
-}
-
 .fox-infinite-loading {
   width: 100%;
   display: block;
 }
 
-.fox-infinite-loading .fox-infinite__bottom {
+.fox-infinite-loading__bottom {
   width: 100%;
   height: 50px;
   line-height: 50px;
@@ -2733,13 +2725,13 @@
   display: block;
 }
 
-.fox-infinite-loading .fox-infinite__bottom .fox-infinite__bottom-box {
+.fox-infinite-loading__bottom-box {
   justify-content: center;
   align-items: center;
   display: flex;
 }
 
-.fox-infinite-loading .fox-infinite__bottom .fox-infinite__bottom-box__img {
+.fox-infinite-loading__bottom-box__img {
   width: 15px;
   height: 15px;
   margin-right: 5px;
@@ -2750,7 +2742,7 @@
   animation-fill-mode: both;
 }
 
-.fox-infinite-loading .fox-infinite__bottom .fox-infinite__bottom-box__text {
+.fox-infinite-loading__bottom-box__text {
   color: var(--fox-text-color, var(--el-text-color-regular));
   font-size: 12px;
 }
@@ -2760,12 +2752,12 @@
   overflow: hidden;
 }
 
-.fox-pull-refresh-container {
+.fox-pull-refresh__container {
   height: 100%;
   position: relative;
 }
 
-.fox-pull-refresh-container-topbox {
+.fox-pull-refresh__container-topbox {
   text-align: center;
   justify-content: center;
   align-items: center;
@@ -2778,7 +2770,7 @@
   transform: translateY(-100%);
 }
 
-.fox-pull-refresh-container-topbox-icon {
+.fox-pull-refresh__container-topbox-icon {
   width: 16px;
   height: 16px;
   margin-right: 4px;
@@ -2789,14 +2781,14 @@
   animation-fill-mode: both;
 }
 
-.fox-pull-refresh-container-topbox-text {
+.fox-pull-refresh__container-topbox-text {
   font-size: var(--fox-font-size-base, 14px);
   color: var(--fox-text-color, var(--el-text-color-regular));
 }
 
 .fox-more-button {
   cursor: pointer;
-  color: var(--fox-default-color, var(--el-text-color-regular));
+  color: var(--fox-color-info, var(--el-color-info));
   flex-flow: row;
   justify-content: flex-start;
   align-items: center;
@@ -2804,23 +2796,23 @@
 }
 
 .fox-more-button--primary {
-  color: var(--fox-primary-color, var(--el-color-primary));
+  color: var(--fox-color-primary, var(--el-color-primary));
 }
 
 .fox-more-button--info {
-  color: var(--fox-info-color, var(--el-color-info));
+  color: var(--fox-color-info, var(--el-color-info));
 }
 
 .fox-more-button--success {
-  color: var(--fox-success-color, var(--el-color-success));
+  color: var(--fox-color-success, var(--el-color-success));
 }
 
 .fox-more-button--warning {
-  color: var(--fox-warning-color, var(--el-color-warning));
+  color: var(--fox-color-warning, var(--el-color-warning));
 }
 
 .fox-more-button--danger {
-  color: var(--fox-danger-color, var(--el-color-danger));
+  color: var(--fox-color-danger, var(--el-color-danger));
 }
 
 .fox-more-button--disabled {
@@ -2865,7 +2857,7 @@
   width: var(--fox-floating-button-width, 52px);
   height: var(--fox-floating-button-height, 52px);
   opacity: var(--fox-floating-button-opacity, 1);
-  background: var(--fox-floating-button-background, linear-gradient(136.56deg, var(--fox-primary-color, var(--el-color-primary)) 0%, var(--fox-primary-color-end, var(--el-color-primary-light-3)) 100%));
+  background: var(--fox-floating-button-background, linear-gradient(136.56deg, var(--fox-color-primary, var(--el-color-primary)) 0%, var(--fox-color-primary-end, var(--el-color-primary-light-3)) 100%));
   box-shadow: var(--fox-floating-button-box-shadow, 0px 3px 12px #31040014);
   border-radius: var(--fox-floating-button-border-radius, 50%);
   color: var(--fox-floating-button-color, #fff);
@@ -3175,7 +3167,7 @@
 
 .fox-price {
   font-size: var(--fox-font-size-medium, 16px);
-  color: var(--fox-primary-color, var(--el-color-primary));
+  color: var(--fox-color-primary, var(--el-color-primary));
   display: inline;
 }
 
@@ -3335,7 +3327,7 @@
 
 .fox-text.is-highlight > * {
   color: var(--fox-text-highlight-color, var(--fox-white, #fff)) !important;
-  background: var(--fox-text-highlight-background-color, var(--fox-danger-color, var(--el-color-danger))) !important;
+  background: var(--fox-text-highlight-background-color, var(--fox-color-danger, var(--el-color-danger))) !important;
 }
 
 .fox-text.is-selectable {

package/dist/style.js

@@ -1,3 +1,3 @@
 /*!
-* @fox-js/foxui-desktop v4.0.0 2026-06-13T06:52:22.066Z
+* @fox-js/foxui-desktop v4.0.0 2026-06-19T06:09:01.839Z
 */

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@fox-js/foxui-pc",
   "type": "module",
-  "version": "4.1.1-37",
+  "version": "4.1.1-39",
   "description": "FoxUI PC端组件库",
   "author": "jiangcheng",
   "main": "./dist/index.umd.js",
@@ -15,6 +15,16 @@
       "require": "./dist/index.umd.js"
     },
     "./style.css": "./dist/style.css",
+    "./locale": {
+      "types": "./dist/locale/index.d.ts",
+      "import": "./dist/locale/index.esm.js",
+      "require": "./dist/locale/index.umd.js"
+    },
+    "./dist/locale": {
+      "types": "./dist/locale/index.d.ts",
+      "import": "./dist/locale/index.esm.js",
+      "require": "./dist/locale/index.umd.js"
+    },
     "./*": "./*"
   },
   "files": [