@bifrostui/react 1.3.1-beta.0 → 1.3.2

package/dist/Input/Input.css

@@ -1,14 +1,9 @@
 .bui-input {
-  --height: var(--bui-input-height, 32px);
-  --padding: var(--bui-input-padding, 4px 10px);
-  --icon-start-margin-right: var(--bui-input-icon-start-margin-right, 3px);
-  --icon-end-margin-left: var(--bui-input-icon-end-margin-left, 3px);
-  --disabled-background-color: var(--bui-input-disabled-background-color, rgba(0, 0, 0, 0.04));
   position: relative;
   display: flex;
   align-items: center;
-  height: var(--height);
-  padding: var(--padding);
+  height: 32px;
+  padding: 4px 10px;
   box-sizing: border-box;
   border-radius: var(--bui-shape-radius-default);
   border: 1px solid var(--bui-color-border-default);
@@ -21,10 +16,10 @@
   font-size: var(--bui-title-size-3);
 }
 .bui-input-icon-start {
-  margin-right: var(--icon-start-margin-right);
+  margin-right: 3px;
 }
 .bui-input-icon-end {
-  margin-left: var(--icon-end-margin-left);
+  margin-left: 3px;
 }
 .bui-input-input {
   flex: 1;
@@ -43,7 +38,7 @@
 }
 .bui-input-disabled {
   pointer-events: none;
-  background-color: var(--disabled-background-color);
+  background-color: rgba(0, 0, 0, 0.04);
 }
 .bui-input-disabled .bui-input-input {
   color: var(--bui-color-fg-disabled);

package/dist/List/List.css

@@ -1,7 +1,4 @@
 .bui-list {
-  --small-item-padding: var(--bui-list-small-item-padding, 5px 12px);
-  --medium-item-padding: var(--bui-list-medium-item-padding, 18px 12px);
-  --large-item-padding: var(--bui-list-large-item-padding, 20px 12px);
   background: var(--bui-color-bg-view);
   font-size: var(--bui-title-size-3);
   font-family: var(--bui-font-family);

package/dist/List/ListItem.css

@@ -10,13 +10,13 @@
   color: var(--bui-color-fg-subtle);
 }
 .bui-list-small .bui-list-item {
-  padding: var(--small-item-padding);
+  padding: 5px 12px;
 }
 .bui-list-medium .bui-list-item {
-  padding: var(--medium-item-padding);
+  padding: 18px 12px;
 }
 .bui-list-large .bui-list-item {
-  padding: var(--large-item-padding);
+  padding: 20px 12px;
 }
 .bui-list-item-divider:not(:last-child) {
   border-bottom: 1px solid var(--bui-color-border-default);

package/dist/List/ListItemContent.css

@@ -13,6 +13,6 @@
   flex: 1 1 auto;
 }
 .bui-list-item-content-secondary {
-  font-size: var(--bui-text-size-2);
+  font-size: 13px;
   color: var(--bui-color-fg-muted);
 }

package/dist/Loading/Loading.css

@@ -1,6 +1,4 @@
 .bui-loading {
-  --icon-font-size: var(--bui-loading-icon-font-size, 30px);
-  --text-padding: var(--bui-loading-text-padding, 10px);
   --animation-duration: var(--bui-loading-animation-duration, 1.6s);
   width: fit-content;
   display: flex;
@@ -10,11 +8,11 @@
   font-family: var(--bui-font-family);
 }
 .bui-loading-icon {
-  font-size: var(--icon-font-size);
+  font-size: 30px;
   animation: loading var(--animation-duration) linear infinite;
 }
 .bui-loading-text {
-  padding: var(--text-padding);
+  padding: 10px;
   font-size: var(--bui-title-size-3);
 }
 .bui-loading-vertical {

package/dist/Modal/Modal.miniapp.d.ts

@@ -12,5 +12,5 @@ declare const Modal: React.ForwardRefExoticComponent<Omit<ViewProps & {
     keepMounted?: boolean;
 } & import("@bifrostui/types").ICommonProps & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: React.Ref<HTMLDivElement>;
-}, "open" | "container" | "disablePortal" | keyof import("@bifrostui/types").ICommonProps | "hideBackdrop" | "BackdropProps" | "onClose" | "disableScrollLock" | "keepMounted">, "ref"> & React.RefAttributes<HTMLDivElement>>;
+}, "open" | keyof import("@bifrostui/types").ICommonProps | "container" | "disablePortal" | "hideBackdrop" | "BackdropProps" | "onClose" | "disableScrollLock" | "keepMounted">, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export default Modal;

package/dist/NavBar/NavBar.css

@@ -1,18 +1,14 @@
 .bui-navbar {
-  --width: var(--bui-navbar-width, 100%);
   --height: var(--bui-navbar-height, 45px);
-  --padding: var(--bui-navbar-padding, 0 8px);
   --icon-size: var(--bui-navbar-icon-size, 24px);
-  --icon-font-size: var(--bui-navbar-icon-font-size, var(--bui-title-size-3));
   --background-color: var(--bui-navbar-background-color, var(--bui-color-white));
   --border-bottom: var(--bui-navbar-border-bottom, none);
   --z-index: var(--bui-navbar-z-index, auto);
-  --title-max-width: var(--bui-navbar-title-max-width, 60%);
   position: relative;
-  width: var(--width);
+  width: 100%;
   height: var(--height);
   box-sizing: border-box;
-  padding: var(--padding);
+  padding: 0 8px;
   display: flex;
   justify-content: center;
   align-items: center;
@@ -29,8 +25,8 @@
   width: 100%;
 }
 .bui-navbar-title {
-  max-width: var(--title-max-width);
-  padding: var(--padding);
+  max-width: 60%;
+  padding: 0 8px;
   font-size: var(--bui-title-size-2);
   width: auto;
   overflow: hidden;
@@ -42,7 +38,7 @@
   flex: 1;
   display: flex;
   align-items: center;
-  font-size: var(--icon-font-size);
+  font-size: var(--bui-title-size-3);
 }
 .bui-navbar-left {
   justify-content: flex-start;

package/dist/Picker/Picker.css

@@ -1,49 +1,53 @@
 .bui-picker {
-  --header-height: var(--bui-picker-header-height, 50px);
-  --header-padding: var(--bui-picker-header-padding, 0 var(--bui-spacing-lg));
-  --cancel-height: var(--bui-picker-cancel-height, 100%);
-  --cancel-line-height: var(--bui-picker-cancel-line-height, 50px);
-  --confirm-height: var(--bui-picker-confirm-height, 100%);
-  --confirm-line-height: var(--bui-picker-confirm-line-height, 50px);
-  --panel-container-height: var(--bui-picker-panel-height, 260px);
-  --indicator-top: var(--bui-picker-indicator-top, 108px);
-  --option-height: var(--bui-picker-option-height, 36px);
+  --cancel-color: var(--bui-color-fg-default);
+  --cancel-font-size: var(--bui-title-size-4, 15px);
+  --confirm-color: var(--bui-color-primary);
+  --confirm-font-size: var(--bui-title-size-4, 15px);
+  --title-color: var(--bui-color-fg-default);
+  --title-font-size: var(--bui-title-size-3, 16px);
+  --title-font-weight: var(--bui-font-weight-medium, 500);
+  --panel-container-height: 260px;
+  --indicator-top: 108px;
+  --indicator-height: 36px;
+  --indicator-border-color: var(--bui-color-border-default);
+  --option-color: var(--bui-color-fg-default);
+  --option-font-size: var(--bui-title-size-4);
+  --option-height: 36px;
   font-family: var(--bui-font-family);
 }
 .bui-picker .bui-drawer-content {
   border-radius: var(--bui-shape-radius-drawer) var(--bui-shape-radius-drawer) 0 0;
 }
 .bui-picker-header {
-  height: var(--header-height);
+  height: 50px;
   display: flex;
   align-items: center;
   justify-content: space-between;
-  padding: var(--header-padding);
+  padding: 0 var(--bui-spacing-lg);
 }
 .bui-picker-cancel {
-  cursor: pointer;
-  height: var(--cancel-height);
-  font-size: var(--bui-title-size-4);
+  width: 40px;
+  height: 100%;
+  font-size: var(--cancel-font-size);
   text-align: center;
-  line-height: var(--cancel-line-height);
-  color: var(--bui-color-fg-default);
+  line-height: 50px;
+  color: var(--cancel-color);
 }
 .bui-picker-title {
-  font-size: var(--bui-title-size-3);
-  color: var(--bui-color-fg-default);
-  font-weight: var(--bui-font-weight-medium);
+  font-size: var(--title-font-size);
+  color: var(--title-color);
+  font-weight: var(--title-font-weight);
 }
 .bui-picker-confirm {
-  cursor: pointer;
-  height: var(--confirm-height);
-  font-size: var(--bui-title-size-4);
+  width: 40px;
+  height: 100%;
+  font-size: var(--confirm-font-size);
   text-align: center;
-  line-height: var(--confirm-line-height);
-  color: var(--bui-color-primary);
+  line-height: 50px;
+  color: var(--confirm-color);
 }
 .bui-picker-container {
   width: 100%;
   height: var(--panel-container-height);
   display: flex;
-  overflow: hidden;
 }

package/dist/Picker/Picker.js

@@ -63,7 +63,6 @@ var import_clsx = __toESM(require("clsx"));
 var import_react = __toESM(require("react"));
 var import_Drawer = __toESM(require("../Drawer"));
 var import_PickerPanel = __toESM(require("./PickerPanel"));
-var import_locales = require("../locales");
 var import_utils = require("./utils");
 var import_Picker2 = require("./Picker.css");
 const prefixCls = "bui-picker";
@@ -95,7 +94,6 @@ const Picker = /* @__PURE__ */ import_react.default.forwardRef((props, ref) => {
   const rollerRefs = (0, import_react.useRef)([]);
   const [columns, setColumns] = (0, import_react.useState)([]);
   const [internalValue, setInternalValue] = (0, import_react.useState)([]);
-  const { cancel: cancelText, confirm: confirmText } = (0, import_locales.useLocaleText)("picker");
   (0, import_react.useEffect)(() => {
     if (!open)
       return;
@@ -117,18 +115,13 @@ const Picker = /* @__PURE__ */ import_react.default.forwardRef((props, ref) => {
     }
   }, [value, options]);
   const confirm = (e) => {
-    const isMoving = rollerRefs.current.some((roller) => roller == null ? void 0 : roller.isMoving);
-    if (isMoving)
-      return;
-    const { safeValue } = (0, import_utils.safeData)({
-      value: internalValue,
-      formatted: columns,
-      options
-    });
     const payload = {
-      value: safeValue,
+      value: internalValue,
       options: columns
     };
+    const isMoving = rollerRefs.current.some((roller) => roller == null ? void 0 : roller.isMoving);
+    if (isMoving)
+      return;
     onConfirm == null ? void 0 : onConfirm(e, payload);
     onClose == null ? void 0 : onClose(e, __spreadValues({
       from: "confirm"
@@ -136,18 +129,11 @@ const Picker = /* @__PURE__ */ import_react.default.forwardRef((props, ref) => {
   };
   const cancel = (e) => {
     onCancel == null ? void 0 : onCancel(e);
-    const { safeValue } = (0, import_utils.safeData)({
+    onClose == null ? void 0 : onClose(e, {
+      from: "cancel",
       value: internalValue,
-      formatted: columns,
-      options
-    });
-    const payload = {
-      value: safeValue,
       options: columns
-    };
-    onClose == null ? void 0 : onClose(e, __spreadValues({
-      from: "cancel"
-    }, payload));
+    });
   };
   const updateItem = (e, columnOption, columnIndex) => {
     var _a2, _b, _c;
@@ -180,7 +166,7 @@ const Picker = /* @__PURE__ */ import_react.default.forwardRef((props, ref) => {
           currentOption: columnOption
         });
       } else {
-        const result = [...internalValue];
+        const result = internalValue;
         result[columnIndex] = columnOption.value;
         setInternalValue(result);
         onOptionChange == null ? void 0 : onOptionChange(e, {
@@ -195,13 +181,8 @@ const Picker = /* @__PURE__ */ import_react.default.forwardRef((props, ref) => {
     updateItem(e, columnOption, columnIndex);
   };
   const handleClose = (e, data) => {
-    const { safeValue } = (0, import_utils.safeData)({
-      value: internalValue,
-      formatted: columns,
-      options
-    });
     onClose == null ? void 0 : onClose(e, __spreadValues({
-      value: safeValue,
+      value: internalValue,
       options: columns
     }, data));
   };
@@ -225,7 +206,7 @@ const Picker = /* @__PURE__ */ import_react.default.forwardRef((props, ref) => {
       __spreadProps(__spreadValues({}, contentProps), {
         className: (0, import_clsx.default)(`${prefixCls}-content`, contentProps == null ? void 0 : contentProps.className)
       }),
-      /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefixCls}-header` }, /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefixCls}-cancel`, onClick: cancel }, cancelText), title && /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefixCls}-title` }, title), /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefixCls}-confirm`, onClick: confirm }, confirmText)),
+      /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefixCls}-header` }, /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefixCls}-cancel`, onClick: cancel }, "\u53D6\u6D88"), title && /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefixCls}-title` }, title), /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefixCls}-confirm`, onClick: confirm }, "\u786E\u8BA4")),
       /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefixCls}-container` }, columns.map((column, index) => /* @__PURE__ */ import_react.default.createElement(
         import_PickerPanel.default,
         {
@@ -234,8 +215,7 @@ const Picker = /* @__PURE__ */ import_react.default.forwardRef((props, ref) => {
           options: column,
           columnIndex: index,
           defaultValue: internalValue == null ? void 0 : internalValue[index],
-          onSelect: handleSelect,
-          pickerStyle: others == null ? void 0 : others.style
+          onSelect: handleSelect
         }
       )))
     )

package/dist/Picker/Picker.types.d.ts

@@ -86,10 +86,6 @@ export type PickerPanelProps<D extends React.ElementType = 'div', P = {}> = Over
          * 列索引
          */
         columnIndex?: number;
-        /**
-         * Piker组件的样式，PickerPanel的主题定制与css变量传入的Tokens有关，需要透传计算
-         */
-        pickerStyle?: React.CSSProperties;
         /**
          * 选择选项时的回调
          */

package/dist/Picker/PickerPanel.css

@@ -21,12 +21,12 @@
   background-image:
     linear-gradient(
       180deg,
-      var(--bui-color-bg-alpha-light-9),
-      var(--bui-color-bg-alpha-light-3)),
+      var(--bui-color-bg-view-opacity-9),
+      var(--bui-color-bg-view-opacity-4)),
     linear-gradient(
       0deg,
-      var(--bui-color-bg-alpha-light-9),
-      var(--bui-color-bg-alpha-light-3));
+      var(--bui-color-bg-view-opacity-9),
+      var(--bui-color-bg-view-opacity-4));
   background-position: top, bottom;
   background-size: 100% var(--indicator-top);
   background-repeat: no-repeat;
@@ -35,10 +35,10 @@
 .bui-picker-panel-indicator {
   position: absolute;
   top: var(--indicator-top);
-  height: var(--option-height);
+  height: var(--indicator-height);
   width: 100%;
-  border-top: 1px solid var(--bui-color-border-default);
-  border-bottom: 1px solid var(--bui-color-border-default);
+  border-top: 1px solid var(--indicator-border-color);
+  border-bottom: 1px solid var(--indicator-border-color);
 }
 .bui-picker-panel-option {
   position: absolute;
@@ -47,7 +47,7 @@
   text-align: center;
   height: var(--option-height);
   line-height: var(--option-height);
-  color: var(--bui-color-fg-default);
+  color: var(--option-color);
   font-size: var(--option-font-size);
   backface-visibility: hidden;
   width: auto;

package/dist/Picker/PickerPanel.js

@@ -63,31 +63,25 @@ var import_PickerPanel = require("./PickerPanel.css");
 const prefixCls = "bui-picker-panel";
 const PickerPanel = /* @__PURE__ */ import_react.default.forwardRef(
   (props, ref) => {
-    var _b;
     const _a = props, {
       options = [],
       defaultValue,
       onSelect,
-      columnIndex,
-      pickerStyle
+      columnIndex
     } = _a, others = __objRest(_a, [
       "options",
       "defaultValue",
       "onSelect",
-      "columnIndex",
-      "pickerStyle"
+      "columnIndex"
     ]);
     const touch = (0, import_utils.useTouch)();
     let timer;
     const INERTIA_TIME = 200;
     const INERTIA_DISTANCE = 15;
     const DEFAULT_DURATION = 200;
+    const LINE_SPACING = 36;
     const ROTATION = 20;
     const TOUCH_END = "end";
-    const DEFAULT_LINE_SPACING = 36;
-    const LINE_SPACING_STR = (_b = ((pickerStyle == null ? void 0 : pickerStyle["--option-height"]) ? `${pickerStyle == null ? void 0 : pickerStyle["--option-height"]}` : `${DEFAULT_LINE_SPACING}`).match(/\d+/)) == null ? void 0 : _b[0];
-    const LINE_SPACING = parseInt(LINE_SPACING_STR, 10);
-    const INDICATOR_OFFSET = LINE_SPACING * 108 / DEFAULT_LINE_SPACING;
     const [startY, setStartY] = (0, import_react.useState)(0);
     const [currIndex, setCurrIndex] = (0, import_react.useState)(1);
     const [startTime, setStartTime] = (0, import_react.useState)(0);
@@ -203,17 +197,17 @@ const PickerPanel = /* @__PURE__ */ import_react.default.forwardRef(
       }, 0);
     };
     (0, import_react.useEffect)(() => {
-      var _a2, _b2, _c;
+      var _a2, _b, _c;
       (_a2 = PickerPanelRef.current) == null ? void 0 : _a2.addEventListener("touchstart", panelTouchStart);
-      (_b2 = PickerPanelRef.current) == null ? void 0 : _b2.addEventListener("touchmove", panelTouchMove);
+      (_b = PickerPanelRef.current) == null ? void 0 : _b.addEventListener("touchmove", panelTouchMove);
       (_c = PickerPanelRef.current) == null ? void 0 : _c.addEventListener("touchend", panelTouchEnd);
       return () => {
-        var _a3, _b3, _c2;
+        var _a3, _b2, _c2;
         (_a3 = PickerPanelRef.current) == null ? void 0 : _a3.removeEventListener(
           "touchstart",
           panelTouchStart
         );
-        (_b3 = PickerPanelRef.current) == null ? void 0 : _b3.removeEventListener(
+        (_b2 = PickerPanelRef.current) == null ? void 0 : _b2.removeEventListener(
           "touchmove",
           panelTouchMove
         );
@@ -259,7 +253,7 @@ const PickerPanel = /* @__PURE__ */ import_react.default.forwardRef(
             }),
             key: `${item == null ? void 0 : item.value}-${i}`,
             style: {
-              transform: `rotate3d(1, 0, 0, ${-ROTATION * (i + 1)}deg) translate3d(0px, 0px, ${INDICATOR_OFFSET}px)`
+              transform: `rotate3d(1, 0, 0, ${-ROTATION * (i + 1)}deg) translate3d(0px, 0px, 104px)`
             }
           },
           item == null ? void 0 : item.label

package/dist/Picker/utils.d.ts

@@ -11,19 +11,3 @@ export declare const formatCascade: (columns: ICascadePickerOptionItem[], values
  * 统一options数据格式
  */
 export declare const formatOptions: (internalValue: any, options?: any[]) => any[];
-/**
- * 在格式化后的数据源中是否存在等长子项的value
- */
-export declare const existSameLengthValue: (value: any, formatted: any) => any;
-/**
- * 关闭选择器时，纠正value和格式化数据
- * 取决于formatted后的options有几列，若value为格式化后数据源（formatted）的等长子集，则取value，否则执行纠正逻辑
- */
-export declare const safeData: ({ value, formatted, options }: {
-    value: any;
-    formatted: any;
-    options: any;
-}) => {
-    safeValue: any[];
-    safeFormatted: any[];
-};

package/dist/Picker/utils.js

@@ -17,11 +17,9 @@ var __copyProps = (to, from, except, desc) => {
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var utils_exports = {};
 __export(utils_exports, {
-  existSameLengthValue: () => existSameLengthValue,
   formatCascade: () => formatCascade,
   formatOptions: () => formatOptions,
-  pickerPanelType: () => pickerPanelType,
-  safeData: () => safeData
+  pickerPanelType: () => pickerPanelType
 });
 module.exports = __toCommonJS(utils_exports);
 const pickerPanelType = (options = []) => {
@@ -65,37 +63,9 @@ const formatOptions = (internalValue, options = []) => {
       return options;
   }
 };
-const existSameLengthValue = (value, formatted) => {
-  const result = formatted.every(
-    (item, idx) => item.some((i) => (value == null ? void 0 : value[idx]) === (i == null ? void 0 : i.value))
-  );
-  return result;
-};
-const safeData = ({ value, formatted, options }) => {
-  let safeValue = [];
-  let safeFormatted = [];
-  const existValidChildren = existSameLengthValue(value, formatted);
-  if (existValidChildren) {
-    safeValue = value;
-    safeFormatted = formatted;
-  } else {
-    formatted.forEach((item, index) => {
-      var _a, _b;
-      const childIndex = item.findIndex((i) => i.value === value[index]);
-      safeValue[index] = ((_a = item == null ? void 0 : item[childIndex]) == null ? void 0 : _a.value) || ((_b = item == null ? void 0 : item[0]) == null ? void 0 : _b.value);
-    });
-    safeFormatted = formatOptions(safeValue, options);
-  }
-  return {
-    safeValue,
-    safeFormatted
-  };
-};
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  existSameLengthValue,
   formatCascade,
   formatOptions,
-  pickerPanelType,
-  safeData
+  pickerPanelType
 });

package/dist/Portal/Portal.types.d.ts

@@ -18,9 +18,5 @@ export interface PortalCoreProps {
      * 页面跟节点
      */
     rootElement?: Element;
-    /**
-     * 挂载成功的回调方法
-     */
-    onRootElementMouted?: (e: Element) => void;
 }
 export type PortalProps = Omit<PortalCoreProps, 'rootElement'>;

package/dist/Portal/PortalCore.js

@@ -38,13 +38,7 @@ function getContainer(container) {
 }
 const PortalCore = /* @__PURE__ */ import_react.default.forwardRef(
   function Portal(props, ref) {
-    const {
-      children,
-      container,
-      disablePortal = false,
-      rootElement,
-      onRootElementMouted
-    } = props;
+    const { children, container, disablePortal = false, rootElement } = props;
     const [mountNode, setMountNode] = import_react.default.useState(null);
     const handleRef = (0, import_utils.useForkRef)(
       // @ts-expect-error will upstream fix
@@ -59,7 +53,6 @@ const PortalCore = /* @__PURE__ */ import_react.default.forwardRef(
     (0, import_react.useLayoutEffect)(() => {
       if (mountNode && !disablePortal) {
         (0, import_utils.setRef)(ref, mountNode);
-        onRootElementMouted == null ? void 0 : onRootElementMouted(mountNode);
         return () => {
           (0, import_utils.setRef)(ref, null);
         };

package/dist/Progress/Progress.css

@@ -1,24 +1,22 @@
 .bui-progress {
   --fill-color: var(--bui-color-primary);
-  --trail-color: var(--bui-progress-trail-color, rgba(156, 156, 165, 0.2));
-  --stroke-width: var(--bui-progress-stroke-width, 8px);
-  --width: var(--bui-progress-width, 100%);
-  --border-radius: var(--bui-progress-border-radius, 100px);
-  width: var(--width);
+  --trail-color: rgba(156, 156, 165, 0.2);
+  --stroke-width: 8px;
+  width: 100%;
   font-family: var(--bui-font-family);
 }
 .bui-progress-inner {
   position: relative;
   display: inline-block;
-  width: var(--width);
+  width: 100%;
   overflow: hidden;
   vertical-align: middle;
   background-color: var(--trail-color);
-  border-radius: var(--border-radius);
+  border-radius: 100px;
 }
 .bui-progress-bg {
   position: relative;
-  border-radius: var(--border-radius);
+  border-radius: 100px;
   background-color: var(--fill-color);
   height: var(--stroke-width);
 }

package/dist/Radio/Radio.css

@@ -2,7 +2,6 @@
   --label-color: var(--bui-color-fg-default);
   --label-font-size: var(--bui-text-size-1);
   --icon-font-size: var(--bui-title-size-2);
-  --icon-padding: var(--bui-radio-icon-padding, 5px);
   display: inline-flex;
   align-items: center;
   position: relative;
@@ -36,7 +35,7 @@
   align-items: center;
   justify-content: center;
   flex-shrink: 0;
-  padding: var(--icon-padding);
+  padding: 5px;
   box-sizing: border-box;
 }
 .bui-radio-label {

package/dist/Rating/Rating.css

@@ -1,8 +1,4 @@
 .bui-rating {
-  --small-margin-right: var(--bui-rating-small-margin-right, 0.5px);
-  --medium-margin-right: var(--bui-rating-medium-margin-right, 1px);
-  --large-margin-right: var(--bui-rating-large-margin-right, 2px);
-  --large-font-size: var(--bui-rating-large-font-size, 22px);
   display: flex;
   flex-wrap: wrap;
   font-family: var(--bui-font-family);
@@ -23,15 +19,15 @@
 }
 .bui-rating-container-small {
   font-size: var(--bui-text-size-1);
-  margin-right: var(--small-margin-right);
+  margin-right: 0.5px;
 }
 .bui-rating-container-medium {
   font-size: var(--bui-title-size-3);
-  margin-right: var(--small-medium-right);
+  margin-right: 1px;
 }
 .bui-rating-container-large {
-  font-size: var(--large-font-size);
-  margin-right: var(--large-margin-right);
+  font-size: 22px;
+  margin-right: 2px;
 }
 .bui-rating-item {
   display: flex;