@tarojs/plugin-platform-harmony-ets 4.0.0-canary.8 → 4.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (135) hide show
  1. package/dist/apis/base/system.ts +73 -20
  2. package/dist/apis/canvas/index.ts +10 -1
  3. package/dist/apis/device/clipboard.ts +23 -8
  4. package/dist/apis/framework/index.ts +1 -5
  5. package/dist/apis/index.ts +27 -17
  6. package/dist/apis/media/image/index.ts +169 -17
  7. package/dist/apis/network/request.ts +5 -5
  8. package/dist/apis/route/index.ts +15 -0
  9. package/dist/apis/storage/index.ts +146 -78
  10. package/dist/apis/ui/animation/animation.ts +71 -29
  11. package/dist/apis/ui/background.ts +2 -1
  12. package/dist/apis/ui/interaction/index.ts +58 -59
  13. package/dist/apis/ui/navigation-bar/index.ts +1 -1
  14. package/dist/apis/ui/pull-down-refresh.ts +9 -3
  15. package/dist/apis/ui/scroll/index.ts +5 -5
  16. package/dist/apis/ui/tab-bar.ts +3 -3
  17. package/dist/apis/utils/index.ts +21 -2
  18. package/dist/apis/utils/permissions.ts +6 -0
  19. package/dist/apis/wxml/IntersectionObserver.ts +18 -10
  20. package/dist/apis/wxml/index.ts +2 -0
  21. package/dist/apis/wxml/selectorQuery.ts +26 -13
  22. package/dist/components-harmony-ets/button.ets +63 -77
  23. package/dist/components-harmony-ets/canvas.ets +51 -0
  24. package/dist/components-harmony-ets/checkbox.ets +75 -258
  25. package/dist/components-harmony-ets/form.ets +51 -158
  26. package/dist/components-harmony-ets/icon.ets +33 -83
  27. package/dist/components-harmony-ets/image.ets +35 -79
  28. package/dist/components-harmony-ets/index.ets +92 -0
  29. package/dist/components-harmony-ets/innerHtml.ets +11 -6
  30. package/dist/components-harmony-ets/input.ets +64 -101
  31. package/dist/components-harmony-ets/label.ets +72 -174
  32. package/dist/components-harmony-ets/listView.ets +31 -0
  33. package/dist/components-harmony-ets/movableArea.ets +126 -0
  34. package/dist/components-harmony-ets/movableView.ets +93 -0
  35. package/dist/components-harmony-ets/navigationBar.ets +65 -0
  36. package/dist/components-harmony-ets/pageMeta.ets +94 -0
  37. package/dist/components-harmony-ets/picker.ets +46 -163
  38. package/dist/components-harmony-ets/progress.ets +52 -0
  39. package/dist/components-harmony-ets/pseudo.ets +80 -0
  40. package/dist/components-harmony-ets/radio.ets +80 -264
  41. package/dist/components-harmony-ets/richText.ets +20 -102
  42. package/dist/components-harmony-ets/scrollList.ets +108 -0
  43. package/dist/components-harmony-ets/scrollView.ets +71 -160
  44. package/dist/components-harmony-ets/slider.ets +22 -82
  45. package/dist/components-harmony-ets/stickySection.ets +42 -0
  46. package/dist/components-harmony-ets/style.ets +410 -0
  47. package/dist/components-harmony-ets/swiper.ets +64 -87
  48. package/dist/components-harmony-ets/switch.ets +39 -99
  49. package/dist/components-harmony-ets/{index.ts → tag.ts} +6 -0
  50. package/dist/components-harmony-ets/text.ets +111 -113
  51. package/dist/components-harmony-ets/textArea.ets +51 -95
  52. package/dist/components-harmony-ets/utils/AttributeManager.ets +2 -2
  53. package/dist/components-harmony-ets/utils/DynamicCenter.ts +2 -2
  54. package/dist/components-harmony-ets/utils/flexManager.ets +50 -19
  55. package/dist/components-harmony-ets/utils/helper.ets +20 -8
  56. package/dist/components-harmony-ets/utils/htmlParser/HarmonyHTMLParser.ts +1 -2
  57. package/dist/components-harmony-ets/utils/htmlParser/index.ts +1 -1
  58. package/dist/components-harmony-ets/utils/index.ts +54 -50
  59. package/dist/components-harmony-ets/utils/styles.ets +172 -92
  60. package/dist/components-harmony-ets/video.ets +37 -88
  61. package/dist/components-harmony-ets/view.ets +63 -159
  62. package/dist/components-harmony-ets/webView.ets +41 -98
  63. package/dist/index.d.ts +152 -0
  64. package/dist/index.js +187 -56
  65. package/dist/index.js.map +1 -1
  66. package/dist/runtime-ets/bom/document.ts +6 -4
  67. package/dist/runtime-ets/bom/getComputedStyle.ts +2 -2
  68. package/dist/runtime-ets/bom/window.ts +9 -2
  69. package/dist/runtime-ets/current.ts +5 -1
  70. package/dist/runtime-ets/dom/bind.ts +28 -12
  71. package/dist/runtime-ets/dom/class-list.ts +2 -2
  72. package/dist/runtime-ets/dom/cssNesting.ts +419 -0
  73. package/dist/runtime-ets/dom/cssStyleDeclaration.ts +28 -42
  74. package/dist/runtime-ets/dom/document.ts +22 -8
  75. package/dist/runtime-ets/dom/element/canvas.ts +136 -0
  76. package/dist/runtime-ets/dom/element/element.ts +376 -57
  77. package/dist/runtime-ets/dom/element/form.ts +31 -26
  78. package/dist/runtime-ets/dom/element/index.ts +30 -2
  79. package/dist/runtime-ets/dom/element/movableArea.ts +11 -0
  80. package/dist/runtime-ets/dom/element/movableView.ts +248 -0
  81. package/dist/runtime-ets/dom/element/normal.ts +35 -8
  82. package/dist/runtime-ets/dom/element/progress.ts +11 -0
  83. package/dist/runtime-ets/dom/element/scrollView.ts +1 -0
  84. package/dist/runtime-ets/dom/element/text.ts +1 -8
  85. package/dist/runtime-ets/dom/element/video.ts +5 -4
  86. package/dist/runtime-ets/dom/element/webView.ts +12 -5
  87. package/dist/runtime-ets/dom/event.ts +3 -5
  88. package/dist/runtime-ets/dom/eventTarget.ts +2 -3
  89. package/dist/runtime-ets/dom/node.ts +65 -32
  90. package/dist/runtime-ets/dom/stylesheet/covertWeb2Hm.ts +418 -237
  91. package/dist/runtime-ets/dom/stylesheet/index.ts +29 -311
  92. package/dist/runtime-ets/dom/stylesheet/type.ts +53 -11
  93. package/dist/runtime-ets/dom/stylesheet/util.ts +33 -27
  94. package/dist/runtime-ets/index.ts +2 -2
  95. package/dist/runtime-ets/interface/event.ts +1 -1
  96. package/dist/runtime-ets/utils/index.ts +74 -13
  97. package/dist/runtime-ets/utils/info.ts +2 -2
  98. package/dist/runtime-framework/react/app.ts +25 -30
  99. package/dist/runtime-framework/react/hooks.ts +3 -4
  100. package/dist/runtime-framework/react/index.ts +0 -2
  101. package/dist/runtime-framework/react/native-page.ts +219 -82
  102. package/dist/runtime-framework/react/page.ts +6 -10
  103. package/dist/runtime-framework/react/utils/index.ts +3 -3
  104. package/dist/runtime-framework/solid/app.ts +30 -46
  105. package/dist/runtime-framework/solid/connect.ts +21 -3
  106. package/dist/runtime-framework/solid/hooks.ts +17 -12
  107. package/dist/runtime-framework/solid/index.ts +6 -2
  108. package/dist/runtime-framework/solid/page.ts +85 -31
  109. package/dist/runtime-framework/solid/reconciler/props.ts +70 -25
  110. package/dist/runtime-framework/solid/reconciler/render.ts +16 -6
  111. package/dist/runtime-framework/solid/reconciler/use.ts +0 -1
  112. package/dist/runtime-framework/solid/utils/index.ts +3 -5
  113. package/dist/runtime-utils.d.ts +827 -0
  114. package/dist/runtime-utils.js +618 -245
  115. package/dist/runtime-utils.js.map +1 -1
  116. package/dist/runtime.d.ts +1 -0
  117. package/dist/runtime.js +618 -245
  118. package/dist/runtime.js.map +1 -1
  119. package/index.js +3 -1
  120. package/package.json +14 -15
  121. package/static/media/cancel.svg +1 -1
  122. package/static/media/circle.svg +1 -1
  123. package/static/media/clear.svg +1 -1
  124. package/static/media/download.svg +1 -1
  125. package/static/media/info.svg +1 -1
  126. package/static/media/info_circle.svg +1 -1
  127. package/static/media/search.svg +1 -1
  128. package/static/media/success.svg +1 -1
  129. package/static/media/success_no_circle.svg +1 -1
  130. package/static/media/warn.svg +1 -1
  131. package/types/harmony.d.ts +5 -0
  132. package/types/index.d.ts +4 -0
  133. package/types/runtime.d.ts +3 -1
  134. package/dist/runtime-ets/utils/bind.ts +0 -24
  135. /package/dist/runtime-framework/solid/{contant.ts → constant.ts} +0 -0
@@ -1,14 +1,17 @@
1
1
  import { Current } from '@tarojs/runtime'
2
2
 
3
- import { callAsyncSuccess } from '../utils'
3
+ import { callAsyncFail, callAsyncSuccess } from '../utils'
4
4
 
5
5
  import type Taro from '@tarojs/taro/types'
6
6
 
7
7
  export const startPullDownRefresh: typeof Taro.startPullDownRefresh = function (options) {
8
- return new Promise(resolve => {
8
+ return new Promise((resolve, reject) => {
9
9
  const taro = (Current as any).taro
10
10
  const page = taro.getCurrentInstance().page
11
11
 
12
+ if (!page) {
13
+ return callAsyncFail(reject, { errMsg: 'stopPullDownRefresh:fail' }, options)
14
+ }
12
15
  if (page.isRefreshing instanceof Array) {
13
16
  const index = page.tabBarCurrentIndex || 0
14
17
  page.isRefreshing[index] = true
@@ -23,10 +26,13 @@ export const startPullDownRefresh: typeof Taro.startPullDownRefresh = function (
23
26
  }
24
27
 
25
28
  export const stopPullDownRefresh: typeof Taro.stopPullDownRefresh = function (options) {
26
- return new Promise(resolve => {
29
+ return new Promise((resolve, reject) => {
27
30
  const taro = (Current as any).taro
28
31
  const page = taro.getCurrentInstance().page
29
32
 
33
+ if (!page) {
34
+ return callAsyncFail(reject, { errMsg: 'stopPullDownRefresh:fail' }, options)
35
+ }
30
36
  if (page.isRefreshing instanceof Array) {
31
37
  const index = page.tabBarCurrentIndex || 0
32
38
  page.isRefreshing[index] = false
@@ -34,8 +34,8 @@ export const pageScrollTo: typeof Taro.pageScrollTo = (options) => {
34
34
  const page = taro.getCurrentInstance().page
35
35
 
36
36
  let scrollValue = -1
37
- let scroller = page.scroller
38
- const currentPageNode = getPageScrollerOrNode(page.node, page)
37
+ let scroller = getPageScrollerOrNode(page?.scroller, page)
38
+ const currentPageNode = getPageScrollerOrNode(page?.node, page)
39
39
 
40
40
  if (scrollTop || typeof scrollTop === 'number') {
41
41
  scrollValue = scrollTop
@@ -66,14 +66,14 @@ export const pageScrollTo: typeof Taro.pageScrollTo = (options) => {
66
66
  scrollValue = areaInfo.globalPosition.y + yOffset + pxTransformHelper(offsetTop, 'px', true)
67
67
  }
68
68
  }
69
- const { xOffset } = scroller.currentOffset()
70
-
71
- if (scrollValue === -1) {
69
+ if (!scroller || scrollValue === -1) {
72
70
  return handle.fail({
73
71
  errMsg: '请检查传入的 scrollTop 或 selector 是否合法'
74
72
  }, { resolve, reject })
75
73
  }
76
74
 
75
+ const { xOffset } = scroller.currentOffset()
76
+
77
77
  try {
78
78
  scroller.scrollTo({
79
79
  xOffset,
@@ -22,7 +22,7 @@ const toggleTabBar = function<T extends ToggleAPIs['type']> (type: T): Extract<T
22
22
  return new Promise((resolve, reject) => {
23
23
  const taro = (Current as any).taro
24
24
  const page = taro.getCurrentInstance().page
25
- const currentData = page._data?.taroTabBar || page.tabBar
25
+ const currentData = page?._data?.taroTabBar || page?.tabBar
26
26
  const res = { errMsg: `${type}TabBar:ok` }
27
27
  const error = { errMsg: `${type}TabBar:fail not TabBar page` }
28
28
 
@@ -49,7 +49,7 @@ export const setTabBarStyle: typeof Taro.setTabBarStyle = function (options = {}
49
49
  return new Promise((resolve, reject) => {
50
50
  const taro = (Current as any).taro
51
51
  const page = taro.getCurrentInstance().page
52
- const currentData = page._data?.taroTabBar || page.tabBar
52
+ const currentData = page?._data?.taroTabBar || page?.tabBar
53
53
  const res = { errMsg: 'setTabBarStyle:ok' }
54
54
  const error = { errMsg: 'setTabBarStyle:fail not TabBar page' }
55
55
 
@@ -74,7 +74,7 @@ export const setTabBarItem: typeof Taro.setTabBarItem = function (options) {
74
74
  return new Promise((resolve, reject) => {
75
75
  const taro = (Current as any).taro
76
76
  const page = taro.getCurrentInstance().page
77
- const currentData = page._data?.taroTabBar || page.tabBar
77
+ const currentData = page?._data?.taroTabBar || page?.tabBar
78
78
  const res = { errMsg: 'setTabBarItem:ok' }
79
79
  const error = { errMsg: 'setTabBarItem:fail not TabBar page' }
80
80
 
@@ -1,12 +1,31 @@
1
- import { eventCenter } from '@tarojs/runtime/dist/runtime.esm'
1
+ import abilityAccessCtrl from '@ohos.abilityAccessCtrl'
2
+ import { Current } from '@tarojs/runtime' // eslint-disable-line import/no-duplicates
3
+ import { eventCenter } from '@tarojs/runtime/dist/runtime.esm' // eslint-disable-line import/no-duplicates
2
4
 
3
5
  import { ICallbackResult, MethodHandler } from './handler'
4
6
 
5
7
  import type { FunctionType, IAsyncParams } from './types'
6
8
 
7
9
  export * from './validate'
10
+ export { MethodHandler }
8
11
  export { noop } from '@tarojs/shared'
9
12
 
13
+ export function requestPermissions (permissions: string[]) {
14
+ return new Promise<void>((resolve, reject) => {
15
+ const context = getContext(Current?.page)
16
+ const atManager = abilityAccessCtrl.createAtManager()
17
+
18
+ atManager.requestPermissionsFromUser(context, permissions, (err, _) => {
19
+ if (err) {
20
+ // eslint-disable-next-line prefer-promise-reject-errors
21
+ reject(`[Taro] 请求用户授权 ${permissions.join('、')} 失败:${JSON.stringify(err)}`)
22
+ } else {
23
+ resolve()
24
+ }
25
+ })
26
+ })
27
+ }
28
+
10
29
  export function object2String (obj) {
11
30
  let str = ''
12
31
  for (const item in obj) {
@@ -19,7 +38,7 @@ export function temporarilyNotSupport (name: string, recommended?: string) {
19
38
  return (option = {}, ...args) => {
20
39
  const { success, fail, complete } = option as any
21
40
  const handle = new MethodHandler({ name, success, fail, complete })
22
- let errMsg = '暂时不支持 API'
41
+ let errMsg = `暂时不支持 API ${name}`
23
42
  if (recommended) {
24
43
  errMsg += `, 请使用 ${recommended}`
25
44
  }
@@ -0,0 +1,6 @@
1
+ export const READ_IMAGEVIDEO_PERMISSIONS = 'ohos.permission.READ_IMAGEVIDEO'
2
+ export const READ_MEDIA_PERMISSIONS = 'ohos.permission.READ_MEDIA'
3
+ export const WRITE_MEDIA_PERMISSIONS = 'ohos.permission.WRITE_MEDIA'
4
+ export const MEDIA_LOCATION_PERMISSIONS = 'ohos.permission.MEDIA_LOCATION'
5
+
6
+ export const IMAGE_PERMISSION = [READ_IMAGEVIDEO_PERMISSIONS, READ_MEDIA_PERMISSIONS, WRITE_MEDIA_PERMISSIONS, MEDIA_LOCATION_PERMISSIONS]
@@ -19,31 +19,33 @@ export class IntersectionObserver implements Taro.IntersectionObserver {
19
19
  constructor(component: any, options: Taro.createIntersectionObserver.Option = {}) {
20
20
  const taro = (Current as any).taro
21
21
  const page = taro.getCurrentInstance().page
22
- const currentPage = getPageScrollerOrNode(page.node, page)
23
- this._component = component || currentPage
22
+
23
+ this._component = component || getPageScrollerOrNode(page?.node, page)
24
24
  Object.assign(this._options, options)
25
25
  }
26
26
 
27
27
  public disconnect (): void {
28
- if (this._observerNodes) {
28
+ if (this._observerNodes && this._component) {
29
29
  if (this._observerNodes instanceof Array) {
30
30
  this._observerNodes.forEach((n: TaroElement & any) => {
31
31
  disconnectEvent(n, VISIBLE_CHANGE_EVENT_NAME)
32
32
  // @ts-ignore
33
- n._nodeInfo?.thresholds = null
33
+ n._nodeInfo.thresholds = null
34
34
  })
35
35
  } else {
36
36
  disconnectEvent(this._observerNodes, VISIBLE_CHANGE_EVENT_NAME)
37
37
  // @ts-ignore
38
38
  if (this._observerNodes._nodeInfo) {
39
39
  // @ts-ignore
40
- this._observerNodes._nodeInfo?.thresholds = null
40
+ this._observerNodes._nodeInfo.thresholds = null
41
41
  }
42
42
  }
43
43
  }
44
44
  }
45
45
 
46
46
  public observe (targetSelector: string, callback: Taro.IntersectionObserver.ObserveCallback): void {
47
+ if (!this._component) return
48
+
47
49
  const { observeAll, thresholds } = this._options
48
50
  const node = findChildNodeWithDFS(this._component, targetSelector, observeAll)
49
51
  this._observerNodes = node
@@ -52,20 +54,24 @@ export class IntersectionObserver implements Taro.IntersectionObserver {
52
54
  if (node instanceof Array) {
53
55
  node.forEach(n => {
54
56
  // @ts-ignore
55
- n._nodeInfo?.thresholds = thresholds
57
+ n._nodeInfo.thresholds = thresholds
56
58
 
57
59
  setNodeEventCallbackAndTriggerComponentUpdate(n, VISIBLE_CHANGE_EVENT_NAME, (isVisible: boolean, currentRatio: number) => {
58
- callback(this.handleResult(isVisible, currentRatio))
60
+ callback(this.handleResult(isVisible, currentRatio, n))
59
61
  })
60
62
  })
61
63
  } else {
62
64
  // @ts-ignore
63
- node._nodeInfo?.thresholds = thresholds
65
+ node._nodeInfo.thresholds = thresholds
64
66
 
65
67
  setNodeEventCallbackAndTriggerComponentUpdate(node, VISIBLE_CHANGE_EVENT_NAME, (isVisible: boolean, currentRatio: number) => {
66
- callback(this.handleResult(isVisible, currentRatio))
68
+ callback(this.handleResult(isVisible, currentRatio, node))
67
69
  })
68
70
  }
71
+ } else {
72
+ callback({
73
+ errMsg: 'IntersectionObserver.observe:fail cannot find the node for selector.'
74
+ })
69
75
  }
70
76
  }
71
77
 
@@ -80,8 +86,10 @@ export class IntersectionObserver implements Taro.IntersectionObserver {
80
86
  }
81
87
 
82
88
  // @ts-ignore
83
- private handleResult (isVisible: boolean, currentRatio: number): Taro.IntersectionObserver.ObserveCallbackResult {
89
+ private handleResult (isVisible: boolean, currentRatio: number, node: TaroElement): Taro.IntersectionObserver.ObserveCallbackResult {
84
90
  const result = {
91
+ id: node.id,
92
+ dataset: node.dataset,
85
93
  intersectionRatio: currentRatio,
86
94
  // TODO 未做,等待能拿到element的info信息
87
95
  boundingClientRect: {
@@ -13,3 +13,5 @@ export const createIntersectionObserver: typeof Taro.createIntersectionObserver
13
13
  }
14
14
 
15
15
  export const createMediaQueryObserver = /* @__PURE__ */ temporarilyNotSupport('createMediaQueryObserver')
16
+
17
+ export { IntersectionObserver }
@@ -112,7 +112,7 @@ function filter (fields, dom) {
112
112
  return res
113
113
  }
114
114
  if (context) {
115
- // TODO: 暂未实现获取 context
115
+ // TODO: 暂未实现获取 context
116
116
  // const typeName = dom.type
117
117
  // if (/^video/i.test(typeName)) {
118
118
  // return { context: dom }
@@ -179,37 +179,50 @@ function filter (fields, dom) {
179
179
 
180
180
  function querySelector (selector, selectAll) {
181
181
  if (typeof selector === 'string') {
182
- return parseHandler(selector, selectAll)
182
+ return selector.split(',').reduce((prev, current) => {
183
+ const item = current.trim()
184
+
185
+ return prev.concat(parseHandler(item, selectAll))
186
+ }, [])
183
187
  }
184
- return null
188
+ return []
185
189
  }
186
190
 
187
191
  function queryBat (queue, cb) {
188
192
  const result: any = []
189
193
  const taro = (Current as any).taro
190
194
  const page = taro.getCurrentInstance().page
191
- const element = getPageScrollerOrNode(page.node, page)
195
+ const element = getPageScrollerOrNode(page?.node, page)
192
196
 
193
- if (element == null) return null
197
+ if (!element) return null
194
198
 
195
199
  arr = []
196
200
  traversalDFSDom(element)
197
- queue.forEach(item => {
201
+ queue.forEach((item) => {
198
202
  const { selector, single, fields } = item
199
- const nodeList = querySelector(selector, !single)
200
203
 
201
- result.push(nodeList.map(dom => {
204
+ if (single) {
205
+ const dom = querySelector(selector, !single)[0]
202
206
  // eslint-disable-next-line no-async-promise-executor
203
- return new Promise(async resolve => {
207
+ result.push(new Promise(async resolve => {
204
208
  await setNodeEventCallbackAndTriggerComponentUpdate(dom, AREA_CHANGE_EVENT_NAME, null, true)
205
-
206
209
  resolve(filter(fields, dom))
207
- })
208
- }))
210
+ }))
211
+ } else {
212
+ const nodeList = querySelector(selector, !single)
213
+ result.push(nodeList.map(dom => {
214
+ // eslint-disable-next-line no-async-promise-executor
215
+ return new Promise(async resolve => {
216
+ await setNodeEventCallbackAndTriggerComponentUpdate(dom, AREA_CHANGE_EVENT_NAME, null, true)
217
+
218
+ resolve(filter(fields, dom))
219
+ })
220
+ }))
221
+ }
209
222
  })
210
223
 
211
224
  Promise.all(result.map(item => {
212
- return Promise.all(item)
225
+ return item instanceof Array ? Promise.all(item) : item
213
226
  })).then(data => {
214
227
  cb(data)
215
228
  })
@@ -1,54 +1,24 @@
1
1
  import { eventHandler, createTaroEvent, convertNumber2VP, getComponentEventCallback, AREA_CHANGE_EVENT_NAME, VISIBLE_CHANGE_EVENT_NAME } from '@tarojs/runtime'
2
- import { createLazyChildren } from './render'
2
+ import commonStyleModify from './style'
3
3
  import { BUTTON_THEME_COLOR } from './utils/constant/style'
4
4
  import { TOUCH_EVENT_MAP } from './utils/constant/event'
5
- import { getNormalAttributes, shouldBindEvent, getNodeThresholds } from './utils/helper'
5
+ import { shouldBindEvent, getNodeThresholds } from './utils/helper'
6
6
 
7
7
  import type { TaroAny, TaroEvent, TaroButtonElement, TaroStyleType } from '@tarojs/runtime'
8
8
 
9
+ interface ButtonAttrs {
10
+ disabled?: boolean
11
+ }
12
+
9
13
  @Extend(Button)
10
- function attrs (style: TaroStyleType) {
11
- .id(style.id)
12
- .key(style.id)
13
- .flexGrow(style.flexGrow)
14
- .flexShrink(style.flexShrink)
15
- .flexBasis(style.flexBasis)
16
- .alignSelf(style.alignSelf)
17
- .padding({
18
- top: style.paddingTop,
19
- right: style.paddingRight || 10,
20
- bottom: style.paddingBottom,
21
- left: style.paddingLeft || 10
22
- })
23
- .margin({
24
- top: style.marginTop,
25
- right: style.marginRight,
26
- bottom: style.marginBottom,
27
- left: style.marginLeft
28
- })
29
- .width(style.width)
30
- .height(style.height)
31
- .constraintSize({
32
- minWidth: style.minWidth,
33
- maxWidth: style.maxWidth,
34
- minHeight: style.minHeight,
35
- maxHeight: style.maxHeight
36
- })
37
- .backgroundImage(style.backgroundImage?.src, style.backgroundRepeat)
38
- .backgroundImageSize(style.backgroundSize)
39
- .backgroundImagePosition(style.backgroundPosition)
40
- .borderStyle({
41
- top: style.borderTopStyle,
42
- right: style.borderRightStyle,
43
- bottom: style.borderBottomStyle,
44
- left: style.borderLeftStyle
45
- })
46
- .zIndex(style.zIndex)
47
- .linearGradient(style.linearGradient)
48
- .clip(style.overflow)
49
- .rotate({ centerX: style.transformOrigin?.x, centerY: style.transformOrigin?.y, angle: 0 })
50
- .scale({ centerX: style.transformOrigin?.x, centerY: style.transformOrigin?.y })
51
- .transform(style.transform)
14
+ function attrs(attr: ButtonAttrs) {
15
+ .enabled(!attr.disabled)
16
+ }
17
+
18
+ function getAttributes(node: TaroButtonElement): ButtonAttrs {
19
+ return {
20
+ disabled: node._attrs.disabled || false,
21
+ }
52
22
  }
53
23
 
54
24
  @Extend(Button)
@@ -110,13 +80,13 @@ function getThemeAttributes (node: TaroButtonElement): TaroStyleType {
110
80
  }
111
81
  }
112
82
 
113
- function getButtonWidth (node: TaroButtonElement) {
83
+ function getButtonWidth (node: TaroButtonElement): string | number {
114
84
  const isMini = node._attrs.size === 'mini'
115
85
 
116
86
  return isMini ? convertNumber2VP(120) : '100%'
117
87
  }
118
88
 
119
- function getButtonHeight (node: TaroButtonElement) {
89
+ function getButtonHeight (node: TaroButtonElement): string | number {
120
90
  const isMini = node._attrs.size === 'mini'
121
91
 
122
92
  return isMini ? convertNumber2VP(60) : convertNumber2VP(92)
@@ -138,38 +108,54 @@ function getButtonMinHeight (node: TaroButtonElement): string | number | undefin
138
108
  return getButtonHeight(node)
139
109
  }
140
110
 
141
- @Builder
142
- export default function TaroButton (node: TaroButtonElement) {
143
- Button({ stateEffect: !node._attrs.disabled }) {
144
- Row() {
145
- if (node._attrs.loading) {
146
- LoadingProgress()
147
- .width(20).height(20)
148
- .color(getThemeAttributes(node).color)
149
- }
150
- createLazyChildren(node)
111
+ @Component
112
+ export default struct TaroButton {
113
+ @Builder customBuilder() {}
114
+ @BuilderParam createLazyChildren: (node: TaroButtonElement, layer?: number) => void = this.customBuilder
115
+ @ObjectLink node: TaroButtonElement
116
+ @State overwriteStyle: Record<string, TaroAny> = {}
117
+
118
+ aboutToAppear(): void {
119
+ if (this.node) {
120
+ this.node._instance = this
151
121
  }
152
122
  }
153
- .themeStyles(getThemeAttributes(node))
154
- .attrs(getNormalAttributes(node))
155
- .constraintSize({
156
- minWidth: node.hmStyle?.minWidth || getButtonMinWidth(node),
157
- minHeight: node.hmStyle?.minHeight || getButtonMinHeight(node),
158
- maxWidth: node.hmStyle?.maxWidth,
159
- maxHeight: node.hmStyle?.maxHeight,
160
- })
161
- .type(ButtonType.Normal)
162
- .onClick((e: ClickEvent) => {
163
- if (node._attrs.formType && ['submit', 'reset'].includes(node._attrs.formType)) {
164
- const eventName = node._attrs.formType + '-btn'
165
- const event: TaroEvent = createTaroEvent(eventName, {}, node)
166
- eventHandler(event, eventName, node)
123
+
124
+ build() {
125
+ Button({ stateEffect: !this.node._attrs.disabled }) {
126
+ if (this.node._attrs.loading) {
127
+ Row() {
128
+ LoadingProgress()
129
+ .width(20).height(20)
130
+ .color(getThemeAttributes(this.node).color)
131
+ this.createLazyChildren(this.node, 0)
132
+ }
133
+ } else {
134
+ this.createLazyChildren(this.node, 0)
135
+ }
167
136
  }
168
- eventHandler(e, 'click', node)
169
- })
170
- .onTouch(shouldBindEvent((e: TouchEvent) => eventHandler(e, TOUCH_EVENT_MAP.get(e.type), node), node, TOUCH_EVENT_MAP.values()))
171
- .onAreaChange(getComponentEventCallback(node, AREA_CHANGE_EVENT_NAME, (res: TaroAny) => {
172
- node._nodeInfo.areaInfo = res[1]
173
- }))
174
- .onVisibleAreaChange(getNodeThresholds(node) || [0.0, 1.0], getComponentEventCallback(node, VISIBLE_CHANGE_EVENT_NAME))
137
+ .themeStyles(getThemeAttributes(this.node))
138
+ .attributeModifier(commonStyleModify.setNode(this.node).setAnimationStyle(this.overwriteStyle))
139
+ .attrs(getAttributes(this.node))
140
+ .constraintSize({
141
+ minWidth: this.node.hmStyle?.minWidth || getButtonMinWidth(this.node),
142
+ minHeight: this.node.hmStyle?.minHeight || getButtonMinHeight(this.node),
143
+ maxWidth: this.node.hmStyle?.maxWidth,
144
+ maxHeight: this.node.hmStyle?.maxHeight,
145
+ })
146
+ .type(ButtonType.Normal)
147
+ .onClick((e: ClickEvent) => {
148
+ if (this.node._attrs.formType && ['submit', 'reset'].includes(this.node._attrs.formType)) {
149
+ const eventName = this.node._attrs.formType + '-btn'
150
+ const event: TaroEvent = createTaroEvent(eventName, {}, this.node)
151
+ eventHandler(event, eventName, this.node)
152
+ }
153
+ eventHandler(e, 'click', this.node)
154
+ })
155
+ .onTouch(shouldBindEvent((e: TouchEvent) => { eventHandler(e, TOUCH_EVENT_MAP.get(e.type), this.node) }, this.node, TOUCH_EVENT_MAP.values()))
156
+ .onAreaChange(getComponentEventCallback(this.node, AREA_CHANGE_EVENT_NAME, (res: TaroAny) => {
157
+ this.node._nodeInfo.areaInfo = res[1]
158
+ }))
159
+ .onVisibleAreaChange(getNodeThresholds(this.node) || [0.0, 1.0], getComponentEventCallback(this.node, VISIBLE_CHANGE_EVENT_NAME))
160
+ }
175
161
  }
@@ -0,0 +1,51 @@
1
+ import type { TaroAny, TaroCanvasElement } from '@tarojs/runtime'
2
+ import { cancelAnimationFrame, requestAnimationFrame } from '@tarojs/runtime'
3
+ import commonStyleModify from './style'
4
+
5
+ @Component
6
+ export default struct TaroCanvas {
7
+ @ObjectLink node: TaroCanvasElement
8
+ rafId: number = 0
9
+ @State overwriteStyle: Record<string, TaroAny> = {}
10
+
11
+ aboutToAppear(): void {
12
+ if (this.node) {
13
+ this.node._instance = this
14
+ }
15
+ }
16
+
17
+ aboutToDisappear() {
18
+ if(this.rafId) {
19
+ cancelAnimationFrame(this.rafId)
20
+ }
21
+ }
22
+
23
+ build() {
24
+ Canvas(this.node._context)
25
+ .attributeModifier(commonStyleModify.setNode(this.node as TaroAny, {
26
+ width: '100%',
27
+ height: '100%',
28
+ backgroundColor: '#ffff00'
29
+ }).setAnimationStyle(this.overwriteStyle))
30
+ .onReady(() => {
31
+ const context = this.node._context
32
+
33
+ const draw = () => {
34
+ if (this.node._drawList.length) {
35
+ while (this.node._drawList.length) {
36
+ const item = this.node._drawList.shift()
37
+ if (item) {
38
+ if (typeof context[item.key] === 'function') {
39
+ context[item.key](...[].concat(item.value))
40
+ } else {
41
+ context[item.key] = item.value
42
+ }
43
+ }
44
+ }
45
+ }
46
+ this.rafId = requestAnimationFrame(draw)
47
+ }
48
+ draw()
49
+ })
50
+ }
51
+ }