Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(ColorPicker): support fixed props #3426

Open
wants to merge 3 commits into
base: develop
Choose a base branch
from
Open

feat(ColorPicker): support fixed props #3426

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
afc96ee
feat(ColorPicker): support fixed props
anlyyao Jan 2, 2025
1dc7911
fix: fix spelling errors
anlyyao Jan 2, 2025
2489e10
docs: update
anlyyao Jan 3, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions src/color-picker/README.en-US.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ style | Object | - | CSS(Cascading Style Sheets) | N
custom-style | Object | - | CSS(Cascading Style Sheets)，used to set style on virtual component | N
auto-close | Boolean | true | \- | N
enable-alpha | Boolean | false | \- | N
fixed | Boolean | false | `1.8.5` | N
footer | Slot | - | [see more ts definition](https://github.com/Tencent/tdesign-miniprogram/blob/develop/src/common/common.ts) | N
format | String | RGB | options: RGB/RGBA/HSL/HSLA/HSB/HSV/HSVA/HEX/CMYK/CSS | N
header | Slot | - | [see more ts definition](https://github.com/Tencent/tdesign-miniprogram/blob/develop/src/common/common.ts) | N
Expand Down
1 change: 1 addition & 0 deletions src/color-picker/README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -44,6 +44,7 @@ style | Object | - | 样式 | N
custom-style | Object | - | 样式，一般用于开启虚拟化组件节点场景 | N
auto-close | Boolean | true | 自动关闭。在点击遮罩层时自动关闭，不需要手动设置 visible | N
enable-alpha | Boolean | false | 是否开启透明通道 | N
fixed | Boolean | false | `1.8.5`。如果 color-picker 是在一个 `position:fixed` 的区域，需要显式指定属性 fixed 为 true | N
footer | Slot | - | 底部插槽，仅在 `usePopup` 为 `true` 时有效。[通用类型定义](https://github.com/Tencent/tdesign-miniprogram/blob/develop/src/common/common.ts) | N
format | String | RGB | 格式化色值。`enableAlpha` 为真时，`RGBA/HSLA/HSVA` 等值有效。可选项：RGB/RGBA/HSL/HSLA/HSB/HSV/HSVA/HEX/CMYK/CSS | N
header | Slot | - | 顶部插槽，仅在 `usePopup` 为 `true` 时有效。[通用类型定义](https://github.com/Tencent/tdesign-miniprogram/blob/develop/src/common/common.ts) | N
Expand Down
9 changes: 5 additions & 4 deletions src/color-picker/color-picker.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,14 +17,14 @@ import { Color, getColorObject } from './utils';
const { prefix } = config;
const name = `${prefix}-color-picker`;

const getCoordinate = (e, react, isPopup?: boolean) => {
const getCoordinate = (e, react, isFixed?: boolean) => {
const { pageX, pageY, clientY } = e.changedTouches[0] || {};

const offsetY = isPopup ? react.top : e.currentTarget?.offsetTop;
const offsetY = isFixed ? react.top : e.currentTarget?.offsetTop;

return {
x: Math.min(Math.max(0, pageX - react.left), react.width),
y: Math.min(Math.max(0, (isPopup ? clientY : pageY) - offsetY), react.height),
y: Math.min(Math.max(0, (isFixed ? clientY : pageY) - offsetY), react.height),
};
};

Expand Down Expand Up @@ -312,7 +312,8 @@ export default class ColorPicker extends SuperComponent {
},

handleSaturationDrag(e) {
const coordinate = getCoordinate(e, this.data.panelRect, this.properties.usePopup);
const { usePopup, fixed } = this.properties;
const coordinate = getCoordinate(e, this.data.panelRect, usePopup || fixed);
const { saturation, value } = this.getSaturationAndValueByCoordinate(coordinate);
this.onChangeSaturation({ saturation, value });
},
Expand Down
5 changes: 5 additions & 0 deletions src/color-picker/props.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,11 @@ const props: TdColorPickerProps = {
type: Boolean,
value: false,
},
/** 如果 color-picker 是在一个 `position:fixed` 的区域，需要显式指定属性 fixed 为 true */
fixed: {
type: Boolean,
value: false,
},
/** 格式化色值。`enableAlpha` 为真时，`RGBA/HSLA/HSVA` 等值有效 */
format: {
type: String,
Expand Down
8 changes: 8 additions & 0 deletions src/color-picker/type.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,14 @@ export interface TdColorPickerProps {
type: BooleanConstructor;
value?: boolean;
};
/**
* 如果 color-picker 是在一个 `position:fixed` 的区域，需要显式指定属性 fixed 为 true
* @default false
*/
fixed?: {
type: BooleanConstructor;
value?: boolean;
};
/**
* 格式化色值。`enableAlpha` 为真时，`RGBA/HSLA/HSVA` 等值有效
* @default RGB
Expand Down
2 changes: 1 addition & 1 deletion src/pull-down-refresh/__test__/__snapshots__/demo.test.js.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ exports[`PullDownRefresh PullDownRefresh base demo works fine 1`] = `
title="PullDownRefresh 下拉刷新"
/>
<wx-view
class="pulldown-reflesh__content"
class="pulldown-refresh__content"
>
<t-skeleton
loading="{{true}}"
Expand Down
2 changes: 1 addition & 1 deletion src/pull-down-refresh/__test__/__virtualHostSnapshot__/demo.test.js.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ exports[`PullDownRefresh PullDownRefresh base demo works fine 1`] = `
用于快速刷新页面信息，刷新可以是整页刷新也可以是页面的局部刷新。
</wx-view>
<wx-view
class="pulldown-reflesh__content"
class="pulldown-refresh__content"
>
<t-skeleton
loading="{{true}}"
Expand Down
2 changes: 1 addition & 1 deletion src/pull-down-refresh/_example/base/index.wxml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
desc="用于快速刷新页面信息，刷新可以是整页刷新也可以是页面的局部刷新。"
notice="渲染框架支持情况：WebView"
/>
<view class="pulldown-reflesh__content">
<view class="pulldown-refresh__content">
<t-skeleton rowCol="{{rowCol1}}" loading></t-skeleton>
<view class="row">
<t-skeleton rowCol="{{rowCol2}}" loading></t-skeleton>
Expand Down
2 changes: 1 addition & 1 deletion src/pull-down-refresh/_example/base/index.wxss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@
line-height: 44rpx;
}

.pulldown-reflesh__content {
.pulldown-refresh__content {
margin: 64rpx 32rpx 0;
position: relative;
}
Expand Down
1 change: 1 addition & 0 deletions src/textarea/README.en-US.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,6 +43,7 @@ enter | `(value: TextareaValue)` | \-
focus | `(value: TextareaValue)` | \-
keyboardheightchange | `(height: number, duration: number)` | \-
line-change | `(value: TextareaValue)` | \-

### Textarea External Classes

className | Description
Expand Down
3 changes: 2 additions & 1 deletion src/textarea/README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -81,7 +81,7 @@ cursor | Number | -1 | 指定 focus 时的光标位置 | N
cursor-spacing | Number | 0 | 指定光标与键盘的距离。取textarea距离底部的距离和cursor-spacing指定的距离的最小值作为光标与键盘的距离 | N
disable-default-padding | Boolean | false | 是否去掉 iOS 下的默认内边距 | N
disabled | Boolean | undefined | 是否禁用文本框 | N
fixed | Boolean | false | 如果 textarea 是在一个 `position:fixed` 的区域，需要显示指定属性 fixed 为 true | N
fixed | Boolean | false | 如果 textarea 是在一个 `position:fixed` 的区域，需要显式指定属性 fixed 为 true | N
focus | Boolean | false | 自动聚焦 | N
hold-keyboard | Boolean | false | focus时，点击页面的时候不收起键盘 | N
indicator | Boolean | false | 显示文本计数器，如 0/140。当 `maxlength < 0 && maxcharacter < 0` 成立时， indicator无效 | N
Expand All @@ -106,6 +106,7 @@ enter | `(value: TextareaValue)` | 点击完成时触发
focus | `(value: TextareaValue)` | 获得焦点时触发
keyboardheightchange | `(height: number, duration: number)` | 键盘高度发生变化的时候触发此事件
line-change | `(value: TextareaValue)` | 行高发生变化时触发

### Textarea External Classes

类名 | 描述
Expand Down
2 changes: 1 addition & 1 deletion src/textarea/__test__/__snapshots__/index.test.js.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ exports[`textarea slots : label 1`] = `
cursorSpacing="{{0}}"
disabled="{{null}}"
disableDefaultPadding="{{false}}"
fixed="{{null}}"
fixed="{{false}}"
focus="{{false}}"
holdKeyboard="{{false}}"
maxlength="{{-1}}"
Expand Down
7 changes: 1 addition & 6 deletions src/textarea/props.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -56,13 +56,8 @@ const props: TdTextareaProps = {
type: null,
value: undefined,
},
/** 如果 textarea 是在一个 `position:fixed` 的区域，需要显示指定属性 fixed 为 true */
/** 如果 textarea 是在一个 `position:fixed` 的区域，需要显式指定属性 fixed 为 true */
fixed: {
type: Boolean,
value: null,
},
/** 如果 textarea 是在一个 `position:fixed` 的区域，需要显示指定属性 fixed 为 true，非受控属性 */
defaultFixed: {
type: Boolean,
value: false,
},
Expand Down
10 changes: 1 addition & 9 deletions src/textarea/type.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -85,21 +85,13 @@ export interface TdTextareaProps {
value?: boolean;
};
/**
* 如果 textarea 是在一个 `position:fixed` 的区域，需要显示指定属性 fixed 为 true
* 如果 textarea 是在一个 `position:fixed` 的区域，需要显式指定属性 fixed 为 true
* @default false
*/
fixed?: {
type: BooleanConstructor;
value?: boolean;
};
/**
* 如果 textarea 是在一个 `position:fixed` 的区域，需要显示指定属性 fixed 为 true，非受控属性
* @default false
*/
defaultFixed?: {
type: BooleanConstructor;
value?: boolean;
};
/**
* 自动聚焦
* @default false
Expand Down
Loading