NeteaseYanxuan · zgldada · Jul 8, 2024 · Jul 8, 2024 · Jul 8, 2024 · Jul 8, 2024
diff --git a/package.json b/package.json
@@ -23,7 +23,7 @@
     "version-packages:ci": "changeset version && pnpm install --shamefully-hoist --no-frozen-lockfile",
     "changelog": "conventional-changelog -p angular -i CHANGELOG.md -s -r 0",
     "release": "pnpm build && pnpm release:only",
-    "release:only": "changeset publish --registry=https://registry.npmjs.com/",
+    "release:only": "changeset publish --registry=https://npm.infra.inner.casamiel.cn/",
     "test": "pnpm --filter=ossa-demo test",
     "checkUIChange": "node ./scripts/checkModifyListAndTest.js",
     "prepare": "husky install"

diff --git a/packages/ossa-demo/src/assets/style/_variable.scss b/packages/ossa-demo/src/assets/style/_variable.scss
@@ -6,6 +6,9 @@
 $--font-color:#666;
 $--font-size:14px;
 
+/* Theme Color */
+$--color-primay:#AF7357 !default;           // 主题色
+
 /* Color */
 $--color-red:#DD1A21 !default;              // 品牌红
 // $--color-logo:#FF142F !default;             // 桌面图标亮红色

diff --git a/packages/ossa-demo/src/components/color/demo/index.tsx b/packages/ossa-demo/src/components/color/demo/index.tsx
@@ -40,6 +40,11 @@ function getClassObject() {
 }
 
 const initialColorList: ColorListItem[] = [
+  {
+    color: "#AF7357",
+    title: "YXColorPrimary",
+    desc: "主题色",
+  },
   {
     color: "#DD1A21",
     title: "YXColorRed",

diff --git a/packages/ossa-demo/src/components/tag/demo/index.tsx b/packages/ossa-demo/src/components/tag/demo/index.tsx
@@ -161,6 +161,26 @@ export default function Index() {
           </View>
         </View>
       </DemoBlock>
+      <DemoBlock title='中尺寸'>
+        <View className='block-section'>
+          <View className='inline-item'>
+            <OsTag bgColor='#F7F8F8' color='#3D3D3D' size='middle'>女性蛋糕</OsTag>
+          </View>
+          <View className='inline-item'>
+            <OsTag bgColor='#F7F8F8' border=' 1px solid #AF7357' color='#AF7357' size='middle'>女性蛋糕</OsTag>
+          </View>
+        </View>
+      </DemoBlock>
+      <DemoBlock title='大尺寸'>
+        <View className='block-section'>
+          <View className='inline-item'>
+            <OsTag color='#3D3D3D' size='large'>整条（12片装）</OsTag>
+          </View>
+          <View className='inline-item'>
+            <OsTag bgColor='#FFF7F1' type='primary' border='1px solid #893F23' color='#893F23' size='large'>整条（12片装）</OsTag>
+          </View>
+        </View>
+      </DemoBlock>
       <DemoBlock>
         <DemoTable list={listApi}></DemoTable>
       </DemoBlock>

diff --git a/packages/ossa-doc/docs/color.md b/packages/ossa-doc/docs/color.md
@@ -7,6 +7,9 @@ demo_url: 'https://neteaseyanxuan.github.io/OSSA/#/components/color/demo/index'
 
 ### scss变量
 ```scss
+/* Theme Color */
+$--color-primay: #AF7357 !default;           // 主题色
+
 /* Color */
 $--color-red:#DD1A21 !default;              // 品牌红
 $--color-yellow:#F48F18 !default;           // 营销色

diff --git a/packages/ossa-doc/docs/组件/tag.md b/packages/ossa-doc/docs/组件/tag.md
@@ -65,6 +65,8 @@ demo_url: 'https://neteaseyanxuan.github.io/OSSA/#/components/tag/demo/index'
 |endBgColor|填充渐变结束色，可选|string|-（只支持radius腰圆标签，且与startBgColor配合使用）|
 |showArrow|显示向右箭头，可选|boolean|-（只支持radius腰圆标签）|
 |customStyle|自定义Style，可选|Object|-|
+|size|tag尺寸|,可选|middle|large|-|
+|border|边框,可选｜string|-
 
 
 ### 方法

diff --git a/packages/ossa/package.json b/packages/ossa/package.json
@@ -1,6 +1,6 @@
 {
-  "name": "ossaui",
-  "version": "0.7.4",
+  "name": "@casamiel/ossaui",
+  "version": "0.7.4-beta.4",
   "description": "",
   "main": "dist/index.js",
   "module": "dist/index.esm.js",

diff --git a/packages/ossa/src/components/modal/index.tsx b/packages/ossa/src/components/modal/index.tsx
@@ -1,9 +1,10 @@
 import React from "react";
-import { View, Image, Text, Button } from "@tarojs/components";
+import { View, Image, Text } from "@tarojs/components";
 import classNames from "classnames";
 import { OsModalProps } from "../../../types/index";
 import getOpenTypeRelatedProps from "../../utils/getOpenTypeRelatedProps";
 import { deprecatedProp } from "../../utils";
+import Button from "../button";
 
 const closeIconImg =
   "https://yanxuan-static.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/icon-normal/modalClose-9d2d6d39f7.png?imageView";
@@ -108,8 +109,10 @@ export default function Index(props: OsModalProps) {
                     className={classNames({
                       ["ossa-action-btn"]: true,
                       ["ossa-action-btn--cancel"]: true,
-                      ["ossa-action-btn--disabled"]: props.disableCancelBtn,
                     })}
+                    shape='round'
+                    size={confirmText ? 'normal' : 'block'}
+                    disabled={props.disableConfirmBtn}
                     onClick={(e) => onClickCancelBtn(props)}
                   >
                     {cancelText}
@@ -120,9 +123,12 @@ export default function Index(props: OsModalProps) {
                     className={classNames({
                       ["ossa-action-btn"]: true,
                       ["ossa-action-btn--confirm"]: true,
-                      ["ossa-action-btn--disabled"]: props.disableConfirmBtn,
                     })}
                     openType={confirmOpenType}
+                    type='primary'
+                    shape='round'
+                    size={cancelText ? 'normal' : 'block'}
+                    disabled={props.disableConfirmBtn}
                     {...openTypeRelatedProps}
                     onClick={(e) => onClickConfirmBtn(props)}
                   >
@@ -158,8 +164,10 @@ export default function Index(props: OsModalProps) {
                   className={classNames({
                     ["ossa-action-btn"]: true,
                     ["ossa-action-btn--cancel"]: true,
-                    ["ossa-action-btn--disabled"]: props.disableCancelBtn,
                   })}
+                  shape='round'
+                  size={confirmText ? 'normal' : 'block'}
+                  disabled={props.disableCancelBtn}
                   onClick={(e) => onClickCancelBtn(props)}
                 >
                   {cancelText}
@@ -170,9 +178,12 @@ export default function Index(props: OsModalProps) {
                   className={classNames({
                     ["ossa-action-btn"]: true,
                     ["ossa-action-btn--confirm"]: true,
-                    ["ossa-action-btn--disabled"]: props.disableConfirmBtn,
                   })}
                   openType={confirmOpenType}
+                  type='primary'
+                  shape='round'
+                  size={cancelText ? 'normal' : 'block'}
+                  disabled={props.disableConfirmBtn}
                   {...openTypeRelatedProps}
                   onClick={(e) => onClickConfirmBtn(props)}
                 >

diff --git a/packages/ossa/src/components/tag/index.tsx b/packages/ossa/src/components/tag/index.tsx
@@ -11,6 +11,7 @@ function getStyleObj(props: OsTagProps): CSSProperties {
     bgColor,
     startBgColor,
     endBgColor,
+    border,
   } = props;
 
   let _styleObj: CSSProperties = {};
@@ -29,6 +30,14 @@ function getStyleObj(props: OsTagProps): CSSProperties {
     _styleObj["background"] = bgColor;
   }
 
+  if (border) {
+    _styleObj["border"] = border;
+  }
+
+  if (color) {
+    _styleObj["color"] = color;
+  }
+
   if (startBgColor && endBgColor) {
     _styleObj[
       "background-image"
@@ -46,13 +55,15 @@ function getClassObject(props: OsTagProps) {
     bgColor,
     startBgColor,
     endBgColor,
+    size,
   } = props;
 
 
   const classObject = {
     [`ossa-tag--type-${type}`]: TagType[type],
     [`ossa-tag--color-${color}`]: TagColor[color],
     ["ossa-tag--border-none"]: bgColor || startBgColor || endBgColor,
+    [`ossa-tag--size-${size}`]: size,
   };
   return classObject;
 }

diff --git a/packages/ossa/src/style/_variable.scss b/packages/ossa/src/style/_variable.scss
@@ -6,6 +6,9 @@
 $--font-color:#666;
 $--font-size:14px;
 
+/* Theme Color */
+$--color-primay:#AF7357 !default;           // 主题色
+
 /* Color */
 $--color-red:#DD1A21 !default;              // 品牌红
 // $--color-logo:#FF142F !default;             // 桌面图标亮红色
@@ -139,9 +142,9 @@ $--fill-color-button-default: transparent !default;
 $--fill-color-button-default-active: $--fill-body !default;
 $--fill-color-button-default-disabled: $--text-color-disabled !default;
 
-$--fill-color-button-primary: $--color-red !default;
+$--fill-color-button-primary: $--color-primay !default;
 $--fill-color-button-primary-active: #C6171D !default;
-$--fill-color-button-primary-disabled: $--color-red !default;
+$--fill-color-button-primary-disabled: $--color-primay !default;
 
 $--fill-color-button-special1: transparent !default;
 
@@ -155,15 +158,15 @@ $--border-color-default: $--text-color-secondary !default;
 $--border-color-default-active: $--text-color-secondary !default;
 $--border-color-default-disabled: transparent !default;
 
-$--border-color-primary: $--color-red !default;
+$--border-color-primary: $--color-primay !default;
 $--border-color-primary-active: #A22929 !default;
-$--border-color-primary-disabled: $--color-red !default;
+$--border-color-primary-disabled: $--color-primay !default;
 
 $--border-color-special1: $--color-border-base-1 !default;
-$--border-color-special1-active: $--color-red !default;
+$--border-color-special1-active: $--color-primay !default;
 
 $--border-color-special2: $--text-color-disabled !default;
-$--border-color-special2-active: $--color-red !default;
+$--border-color-special2-active: $--color-primay !default;
 
 $--border-color-icon: #979797 !default;
 $--border-color-icon-active: #979797 !default;

diff --git a/packages/ossa/src/style/components/actionsheet.scss b/packages/ossa/src/style/components/actionsheet.scss
@@ -21,6 +21,7 @@ $animation-duration: 200ms;
 
     .ossa-actionsheet__container {
       transform: translate(-50%, 0%);
+      background-color: #F4F4F4
     }
   }
 
@@ -34,9 +35,9 @@ $animation-duration: 200ms;
   &__container {
     @include absolute-center-bottom();
     @include safe-area-inset-bottom();
-
     width: 100%;
     background: $--fill-default;
+    border-radius: 32px 32px 0px 0px;
     transform: translate(-50%, 100%);
     transition: transform 200ms ease-in;
   }
@@ -47,7 +48,6 @@ $animation-duration: 200ms;
     justify-content: flex-end;
     align-items: center;
     padding: 40px 24px;
-    @include hairline-bottom();
   }
 
   &__title {

diff --git a/packages/ossa/src/style/components/modal.scss b/packages/ossa/src/style/components/modal.scss
@@ -44,40 +44,38 @@ $modal-duration: 200ms;
   }
 
   &__title {
-    font-size: 32px;
+    font-size: 36px;
+    font-weight: 500;
     line-height: 48px;
     display: block;
     text-align: center;
   }
 
   &__header {
-    padding-top: 48px;
-    padding-bottom: 8px;
+    padding-top: 40px;
+    padding-left: 32px;
+    padding-right: 32px;
   }
 
   &__content {
-    padding: 0 60px 48px;
+    padding: 32px;
     color: $--text-color-secondary;
     font-size: 28px;
     font-weight: $--font-weight-default;
   }
 
   &__footer {
-    @include hairline-top();
-
+    margin-bottom: 40px;
+    padding: 0 32px;
     display: flex;
     flex-direction: row;
     align-items: center;
+    gap: 26px;
 
     & > .ossa-action-btn {
       @include line(1);
-
-      color: $--text-color-base;
-      background-color: $--fill-default;
       border: none;
       font-size: 28px;
-      height: 104px;
-      line-height: 104px;
       text-align: center;
       box-sizing: border-box;
       flex: 1;
@@ -96,16 +94,12 @@ $modal-duration: 200ms;
         border-radius: 0;
       }
 
-      &:active {
-        background-color: $--fill-model-btns-active;
-      }
-
       &.ossa-action-btn--cancel {
         color: $--text-color-base;
-      }
-
-      &.ossa-action-btn--confirm {
-        color: $--color-red;
+        background: $--fill-body;
+        &::after {
+          border: none;
+        }
       }
 
       &.ossa-action-btn--disabled {