Skip to content

Commit 0938a0f

Browse files
anlyyaoanlyyao
authored
Merge pull request #222 from TDesignOteam/feat/mobile/color-picker
feat(ColorPicker): add color-picker
2 parents 97dba58 + a6313c8 commit 0938a0f

File tree

4 files changed

+194
-10
lines changed

4 files changed

+194
-10
lines changed

‎db/TDesign.db

0 Bytes
Binary file not shown.

‎packages/products/tdesign-miniprogram/src/color-picker/README.en-US.md

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
:: BASE_DOC ::
2+
3+
## API
4+
### ColorPicker Props
5+
6+
name | type | default | description | required
7+
-- | -- | -- | -- | --
8+
enable-alpha | Boolean | false | \- | N
9+
format | String | RGB | options: RGB/RGBA/HSL/HSLA/HSB/HSV/HSVA/HEX/CMYK/CSS | N
10+
swatch-colors | Array | - | swatch colors。Typescript：`Array<string> \| null` | N
11+
type | String | base | options: base/multiple。Typescript：`TypeEnum ` `type TypeEnum = 'base' \| 'multiple'`。[see more ts definition](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/color-picker/type.ts) | N
12+
value | String | - | color value | N
13+
default-value | String | undefined | color value。uncontrolled property | N
14+
15+
### ColorPicker Events
16+
17+
name | params | description
18+
-- | -- | --
19+
change | `(value: string, context: { color: ColorObject; trigger: ColorPickerChangeTrigger })` | [see more ts definition](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/color-picker/type.ts)。<br/>`type ColorPickerChangeTrigger = 'palette-hue-bar' \| 'palette-alpha-bar' \| 'preset' `<br/>
20+
palette-bar-change | `(detail: { color: ColorObject })` | [see more ts definition](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/color-picker/type.ts)。<br/>`interface ColorObject { alpha: number; css: string; hex: string; hex8: string; hsl: string; hsla: string; hsv: string; hsva: string; rgb: string; rgba: string; value: number;}`<br/>

‎packages/products/tdesign-miniprogram/src/color-picker/README.md

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
:: BASE_DOC ::
2+
3+
## API
4+
### ColorPicker Props
5+
6+
名称 | 类型 | 默认值 | 说明 | 必传
7+
-- | -- | -- | -- | --
8+
enable-alpha | Boolean | false | 是否开启透明通道 | N
9+
format | String | RGB | 格式化色值。`enableAlpha` 为真时，`RGBA/HSLA/HSVA` 等值有效。可选项：RGB/RGBA/HSL/HSLA/HSB/HSV/HSVA/HEX/CMYK/CSS | N
10+
swatch-colors | Array | - | 系统预设的颜色样例，值为 `null` 或 `[]` 则不显示系统色，值为 `undefined` 会显示组件内置的系统默认色。TS 类型：`Array<string> \| null` | N
11+
type | String | base | 颜色选择器类型。（base 表示仅展示系统预设内容; multiple 表示展示色板和系统预设内容。。可选项：base/multiple。TS 类型：`TypeEnum ` `type TypeEnum = 'base' \| 'multiple'`。[详细类型定义](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/color-picker/type.ts) | N
12+
value | String | - | 色值 | N
13+
default-value | String | undefined | 色值。非受控属性 | N
14+
15+
### ColorPicker Events
16+
17+
名称 | 参数 | 描述
18+
-- | -- | --
19+
change | `(value: string, context: { color: ColorObject; trigger: ColorPickerChangeTrigger })` | 选中的色值发生变化时触发，第一个参数 `value` 表示新色值，`context.color` 表示当前调色板控制器的色值，`context.trigger` 表示触发颜色变化的来源。[详细类型定义](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/color-picker/type.ts)。<br/>`type ColorPickerChangeTrigger = 'palette-hue-bar' \| 'palette-alpha-bar' \| 'preset' `<br/>
20+
palette-bar-change | `(detail: { color: ColorObject })` | 调色板控制器的值变化时触发，`context.color` 指调色板控制器的值。[详细类型定义](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/color-picker/type.ts)。<br/>`interface ColorObject { alpha: number; css: string; hex: string; hex8: string; hsl: string; hsla: string; hsv: string; hsva: string; rgb: string; rgba: string; value: number;}`<br/>

‎packages/scripts/api.json

Lines changed: 154 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -25241,8 +25241,7 @@
2524125241
"4",
2524225242
"8",
2524325243
"16",
25244-
"32",
25245-
"64"
25244+
"32"
2524625245
],
2524725246
"component": "ColorPicker",
2524825247
"field_category": 1,
@@ -25275,8 +25274,7 @@
2527525274
"Angular(PC)",
2527625275
"Vue(Mobile)",
2527725276
"React(Mobile)",
25278-
"Angular(Mobile)",
25279-
"Miniprogram"
25277+
"Angular(Mobile)"
2528025278
],
2528125279
"field_type_text": [
2528225280
"Boolean"
@@ -25414,7 +25412,8 @@
2541425412
"platform_framework": [
2541525413
"1",
2541625414
"2",
25417-
"4"
25415+
"4",
25416+
"64"
2541825417
],
2541925418
"component": "ColorPicker",
2542025419
"field_category": 1,
@@ -25444,7 +25443,8 @@
2544425443
"platform_framework_text": [
2544525444
"Vue(PC)",
2544625445
"React(PC)",
25447-
"Angular(PC)"
25446+
"Angular(PC)",
25447+
"Miniprogram"
2544825448
],
2544925449
"field_type_text": [
2545025450
"Boolean"
@@ -25496,7 +25496,8 @@
2549625496
"platform_framework": [
2549725497
"1",
2549825498
"2",
25499-
"4"
25499+
"4",
25500+
"64"
2550025501
],
2550125502
"component": "ColorPicker",
2550225503
"field_category": 1,
@@ -25526,7 +25527,8 @@
2552625527
"platform_framework_text": [
2552725528
"Vue(PC)",
2552825529
"React(PC)",
25529-
"Angular(PC)"
25530+
"Angular(PC)",
25531+
"Miniprogram"
2553025532
],
2553125533
"field_type_text": [
2553225534
"String"
@@ -25783,7 +25785,8 @@
2578325785
"platform_framework": [
2578425786
"1",
2578525787
"2",
25786-
"4"
25788+
"4",
25789+
"64"
2578725790
],
2578825791
"component": "ColorPicker",
2578925792
"field_category": 1,
@@ -25813,12 +25816,50 @@
2581325816
"platform_framework_text": [
2581425817
"Vue(PC)",
2581525818
"React(PC)",
25816-
"Angular(PC)"
25819+
"Angular(PC)",
25820+
"Miniprogram"
2581725821
],
2581825822
"field_type_text": [
2581925823
"Array"
2582025824
]
2582125825
},
25826+
{
25827+
"id": 1705294739,
25828+
"platform_framework": [
25829+
"64"
25830+
],
25831+
"component": "ColorPicker",
25832+
"field_category": 1,
25833+
"field_name": "type",
25834+
"field_type": [
25835+
"1"
25836+
],
25837+
"field_default_value": "base",
25838+
"field_enum": "base/multiple",
25839+
"field_desc_zh": "颜色选择器类型。（base 表示仅展示系统预设内容; multiple 表示展示色板和系统预设内容。",
25840+
"field_desc_en": null,
25841+
"field_required": 0,
25842+
"event_input": "",
25843+
"create_time": "2024-01-15 04:58:59",
25844+
"update_time": "2024-01-15 04:58:59",
25845+
"event_output": null,
25846+
"custom_field_type": "TypeEnum 【type TypeEnum = 'base' | 'multiple'】",
25847+
"syntactic_sugar": null,
25848+
"readonly": 1,
25849+
"html_attribute": 0,
25850+
"trigger_elements": "",
25851+
"deprecated": 0,
25852+
"version": "",
25853+
"test_description": null,
25854+
"support_default_value": 0,
25855+
"field_category_text": "Props",
25856+
"platform_framework_text": [
25857+
"Miniprogram"
25858+
],
25859+
"field_type_text": [
25860+
"String"
25861+
]
25862+
},
2582225863
{
2582325864
"id": 2118,
2582425865
"platform_framework": [
@@ -25860,6 +25901,43 @@
2586025901
"String"
2586125902
]
2586225903
},
25904+
{
25905+
"id": 1705294511,
25906+
"platform_framework": [
25907+
"64"
25908+
],
25909+
"component": "ColorPicker",
25910+
"field_category": 1,
25911+
"field_name": "value",
25912+
"field_type": [
25913+
"1"
25914+
],
25915+
"field_default_value": "",
25916+
"field_enum": "",
25917+
"field_desc_zh": "色值",
25918+
"field_desc_en": "color value",
25919+
"field_required": 0,
25920+
"event_input": "",
25921+
"create_time": "2024-01-15 04:55:11",
25922+
"update_time": "2024-01-15 04:55:11",
25923+
"event_output": null,
25924+
"custom_field_type": null,
25925+
"syntactic_sugar": "v-model",
25926+
"readonly": 1,
25927+
"html_attribute": 0,
25928+
"trigger_elements": "",
25929+
"deprecated": 0,
25930+
"version": "",
25931+
"test_description": null,
25932+
"support_default_value": 1,
25933+
"field_category_text": "Props",
25934+
"platform_framework_text": [
25935+
"Miniprogram"
25936+
],
25937+
"field_type_text": [
25938+
"String"
25939+
]
25940+
},
2586325941
{
2586425942
"id": 2126,
2586525943
"platform_framework": [
@@ -25897,6 +25975,39 @@
2589725975
],
2589825976
"field_type_text": []
2589925977
},
25978+
{
25979+
"id": 1705294804,
25980+
"platform_framework": [
25981+
"64"
25982+
],
25983+
"component": "ColorPicker",
25984+
"field_category": 2,
25985+
"field_name": "change",
25986+
"field_type": [],
25987+
"field_default_value": "",
25988+
"field_enum": "",
25989+
"field_desc_zh": "选中的色值发生变化时触发，第一个参数 `value` 表示新色值，`context.color` 表示当前调色板控制器的色值，`context.trigger` 表示触发颜色变化的来源",
25990+
"field_desc_en": null,
25991+
"field_required": 0,
25992+
"event_input": "(value: string, context: { color: ColorObject; trigger: ColorPickerChangeTrigger })【type ColorPickerChangeTrigger = 'palette-hue-bar' | 'palette-alpha-bar' | 'preset' 】",
25993+
"create_time": "2024-01-15 05:00:04",
25994+
"update_time": "2024-01-15 05:00:04",
25995+
"event_output": null,
25996+
"custom_field_type": null,
25997+
"syntactic_sugar": null,
25998+
"readonly": 1,
25999+
"html_attribute": 0,
26000+
"trigger_elements": "",
26001+
"deprecated": 0,
26002+
"version": "",
26003+
"test_description": null,
26004+
"support_default_value": 0,
26005+
"field_category_text": "Events",
26006+
"platform_framework_text": [
26007+
"Miniprogram"
26008+
],
26009+
"field_type_text": []
26010+
},
2590026011
{
2590126012
"id": 2125,
2590226013
"platform_framework": [
@@ -25934,6 +26045,39 @@
2593426045
],
2593526046
"field_type_text": []
2593626047
},
26048+
{
26049+
"id": 1705394290,
26050+
"platform_framework": [
26051+
"64"
26052+
],
26053+
"component": "ColorPicker",
26054+
"field_category": 2,
26055+
"field_name": "paletteBarChange",
26056+
"field_type": [],
26057+
"field_default_value": "",
26058+
"field_enum": "",
26059+
"field_desc_zh": "调色板控制器的值变化时触发，`context.color` 指调色板控制器的值",
26060+
"field_desc_en": null,
26061+
"field_required": 0,
26062+
"event_input": "(context: { color: ColorObject })【interface ColorObject { alpha: number; css: string; hex: string; hex8: string; hsl: string; hsla: string; hsv: string; hsva: string; rgb: string; rgba: string; value: number;}】",
26063+
"create_time": "2024-01-16 08:38:10",
26064+
"update_time": "2024-01-16 08:38:10",
26065+
"event_output": null,
26066+
"custom_field_type": null,
26067+
"syntactic_sugar": null,
26068+
"readonly": 1,
26069+
"html_attribute": 0,
26070+
"trigger_elements": "",
26071+
"deprecated": 0,
26072+
"version": "",
26073+
"test_description": null,
26074+
"support_default_value": 0,
26075+
"field_category_text": "Events",
26076+
"platform_framework_text": [
26077+
"Miniprogram"
26078+
],
26079+
"field_type_text": []
26080+
},
2593726081
{
2593826082
"id": 2424,
2593926083
"platform_framework": [

0 commit comments

Comments
 (0)