@tuya-miniapp/smart-ui 2.7.0-beta-5 → 2.7.0-beta-7

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.
@@ -1 +1 @@
1
- @import '../common/index.css';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-dialog-background:#fff;--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-dialog-background:#333;--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0))}.smart-nav-bar{background-color:var(--nav-bar-background-color,var(--app-B2,#fff));box-sizing:initial;height:var(--nav-bar-height,var(--app-device-navbar-height,46px));line-height:var(--nav-bar-height,var(--app-device-navbar-height,46px));position:relative;text-align:center;-webkit-user-select:none;user-select:none}.smart-nav-bar__content{align-items:center;display:flex;height:100%;position:relative}.smart-nav-bar__text{color:var(--nav-bar-text-color,var(--app-B2-N2,rgba(0,0,0,.7)));display:inline-block;font-size:var(--nav-bar-text-font-size,16px);font-weight:var(--nav-bar-text-font-weight,600);overflow:hidden;padding-left:var(--nav-bar-text-padding,20px);text-overflow:ellipsis;vertical-align:middle;white-space:nowrap}.smart-nav-bar .smart-nav-bar__icon--hover,.smart-nav-bar .smart-nav-bar__text--hover{opacity:.3}.smart-nav-bar__arrow{vertical-align:middle}.smart-nav-bar__arrow>view{background:var(--nav-bar-arrow-color,var(--app-B2-N1,#000))}.smart-nav-bar__icon-wrap{align-items:center;display:flex;justify-content:center}.smart-nav-bar__icon>view{background:var(--nav-bar-icon-color,var(--app-B2-N1,#000))}.smart-nav-bar--safe{padding-top:var(--app-device-status-height,20px)}.smart-nav-bar--fixed{left:0;position:fixed;top:0;width:100%}.smart-nav-bar--round{border-radius:var(--nav-bar-round-border-radius,16px 16px 0 0);min-height:var(--nav-bar-round-min-height,56px)}.smart-nav-bar__title{color:var(--nav-bar-title-text-color,var(--app-B2-N1,#000));flex:1;font-size:var(--nav-bar-title-font-size,17px);font-weight:var(--nav-bar-title-font-weight,600);margin:var(--nav-bar-title-margin,0 16px);text-align:center}.smart-nav-bar__left,.smart-nav-bar__right{align-items:center;display:flex;width:var(--nav-bar-side-width,98px)}.smart-nav-bar__left--home{max-width:var(--nav-bar-home-max-width,calc(100% - 114px));width:auto}.smart-nav-bar__left--home .smart-nav-bar__text{color:var(--nav-bar-home-text-color,var(--app-B2-N1,#000));font-size:var(--nav-bar-home-font-size,22px);font-weight:var(--nav-bar-home-font-weight,600)}.smart-nav-bar__left--title{max-width:var(--nav-bar-title-max-width,calc(100% - 114px));width:auto}.smart-nav-bar__left--title .smart-nav-bar__text{color:var(--nav-bar-title-text-color,var(--app-B2-N1,#000));font-size:var(--nav-bar-home-font-size,22px);font-weight:var(--nav-bar-title-font-weight,600);padding-left:var(--nav-bar-left-title-padding,8px)}.smart-nav-bar__left--icon{padding-left:var(--nav-bar-icon-padding,16px)}.smart-nav-bar__right{flex-direction:row-reverse}.smart-nav-bar__right .smart-nav-bar__text{color:var(--nav-bar-right-text-color,var(--nav-bar-text-color,var(--app-B2-N2,rgba(0,0,0,.7))));padding-left:0;padding-right:var(--nav-bar-text-padding,20px);text-align:right}.smart-nav-bar__right .smart-nav-bar__icon-wrap{padding-right:var(--nav-bar-icon-padding,16px)}
1
+ @import '../common/index.css';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-dialog-background:#fff;--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-dialog-background:#333;--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0))}.smart-nav-bar{background-color:var(--nav-bar-background-color,var(--app-B2,#fff));box-sizing:initial;height:var(--nav-bar-height,var(--app-device-navbar-height,46px));line-height:var(--nav-bar-height,var(--app-device-navbar-height,46px));position:relative;text-align:center;-webkit-user-select:none;user-select:none}.smart-nav-bar__content{align-items:center;display:flex;height:100%;position:relative}.smart-nav-bar__text{color:var(--nav-bar-text-color,var(--app-B2-N2,rgba(0,0,0,.7)));display:inline-block;font-size:var(--nav-bar-text-font-size,16px);font-weight:var(--nav-bar-text-font-weight,600);overflow:hidden;text-overflow:ellipsis;vertical-align:middle;white-space:nowrap}.smart-nav-bar .smart-nav-bar__icon--hover,.smart-nav-bar .smart-nav-bar__text--hover{opacity:.3}.smart-nav-bar__arrow{vertical-align:middle}.smart-nav-bar__arrow>view{background:var(--nav-bar-arrow-color,var(--app-B2-N1,#000))}.smart-nav-bar__icon-wrap{align-items:center;display:flex;justify-content:center}.smart-nav-bar__icon>view{background:var(--nav-bar-icon-color,var(--app-B2-N1,#000))}.smart-nav-bar--safe{padding-top:var(--app-device-status-height,20px)}.smart-nav-bar--fixed{left:0;position:fixed;top:0;width:100%}.smart-nav-bar--round{border-radius:var(--nav-bar-round-border-radius,16px 16px 0 0);min-height:var(--nav-bar-round-min-height,56px)}.smart-nav-bar__title{color:var(--nav-bar-title-text-color,var(--app-B2-N1,#000));flex:1;font-size:var(--nav-bar-title-font-size,17px);font-weight:var(--nav-bar-title-font-weight,600);margin:var(--nav-bar-title-margin,0 16px);text-align:center}.smart-nav-bar__left,.smart-nav-bar__right{align-items:center;display:flex;width:var(--nav-bar-side-width,98px)}.smart-nav-bar__left{padding-left:var(--nav-bar-icon-padding,16px)}.smart-nav-bar__left--home{max-width:var(--nav-bar-home-max-width,calc(100% - 114px));width:auto}.smart-nav-bar__left--home .smart-nav-bar__text{color:var(--nav-bar-home-text-color,var(--app-B2-N1,#000));font-size:var(--nav-bar-home-font-size,22px);font-weight:var(--nav-bar-home-font-weight,600)}.smart-nav-bar__left--title{max-width:var(--nav-bar-title-max-width,calc(100% - 114px));width:auto}.smart-nav-bar__left--title .smart-nav-bar__text{color:var(--nav-bar-title-text-color,var(--app-B2-N1,#000));font-size:var(--nav-bar-home-font-size,22px);font-weight:var(--nav-bar-title-font-weight,600);padding-left:var(--nav-bar-left-title-padding,8px)}.smart-nav-bar__left--text{padding-left:var(--nav-bar-text-padding,20px)}.smart-nav-bar__left--icon{padding-left:var(--nav-bar-icon-padding,16px)}.smart-nav-bar__right{flex-direction:row-reverse;padding-right:var(--nav-bar-icon-padding,16px)}.smart-nav-bar__right .smart-nav-bar__text{color:var(--nav-bar-right-text-color,var(--nav-bar-text-color,var(--app-B2-N2,rgba(0,0,0,.7))));text-align:right}.smart-nav-bar__right--text{padding-right:var(--nav-bar-text-padding,20px)}
@@ -8,7 +8,7 @@
8
8
  style="{{ computed.barStyle({ zIndex, statusBarHeight, safeAreaInsetTop, background }) }}; {{ customStyle }}"
9
9
  >
10
10
  <view class="smart-nav-bar__content">
11
- <view class="{{ utils.bem('nav-bar__left', { home: leftTextType === 'home', title: leftTextType === 'title', icon: leftArrow || leftIcon }) }}" bind:tap="onClickLeft">
11
+ <view class="{{ utils.bem('nav-bar__left', { home: leftTextType === 'home', title: leftTextType === 'title', text: !!leftText, icon: leftArrow || leftIcon }) }}" bind:tap="onClickLeft">
12
12
  <smart-icon
13
13
  wx:if="{{ leftArrow }}"
14
14
  size="24px"
@@ -43,7 +43,7 @@
43
43
  <block>{{ title }}</block>
44
44
  <slot name="title" />
45
45
  </view>
46
- <view class="smart-nav-bar__right" bind:tap="onClickRight">
46
+ <view class="{{utils.bem('nav-bar__right', { text: !!rightText })}}" bind:tap="onClickRight">
47
47
  <view
48
48
  wx:if="{{ rightIcon }}"
49
49
  data-type="rightIcon"
@@ -1 +1 @@
1
- @import '../common/index.wxss';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-dialog-background:#fff;--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-dialog-background:#333;--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0))}.smart-nav-bar{background-color:var(--nav-bar-background-color,var(--app-B2,#fff));box-sizing:initial;height:var(--nav-bar-height,var(--app-device-navbar-height,46px));line-height:var(--nav-bar-height,var(--app-device-navbar-height,46px));position:relative;text-align:center;-webkit-user-select:none;user-select:none}.smart-nav-bar__content{align-items:center;display:flex;height:100%;position:relative}.smart-nav-bar__text{color:var(--nav-bar-text-color,var(--app-B2-N2,rgba(0,0,0,.7)));display:inline-block;font-size:var(--nav-bar-text-font-size,16px);font-weight:var(--nav-bar-text-font-weight,600);overflow:hidden;padding-left:var(--nav-bar-text-padding,20px);text-overflow:ellipsis;vertical-align:middle;white-space:nowrap}.smart-nav-bar .smart-nav-bar__icon--hover,.smart-nav-bar .smart-nav-bar__text--hover{opacity:.3}.smart-nav-bar__arrow{vertical-align:middle}.smart-nav-bar__arrow>view{background:var(--nav-bar-arrow-color,var(--app-B2-N1,#000))}.smart-nav-bar__icon-wrap{align-items:center;display:flex;justify-content:center}.smart-nav-bar__icon>view{background:var(--nav-bar-icon-color,var(--app-B2-N1,#000))}.smart-nav-bar--safe{padding-top:var(--app-device-status-height,20px)}.smart-nav-bar--fixed{left:0;position:fixed;top:0;width:100%}.smart-nav-bar--round{border-radius:var(--nav-bar-round-border-radius,16px 16px 0 0);min-height:var(--nav-bar-round-min-height,56px)}.smart-nav-bar__title{color:var(--nav-bar-title-text-color,var(--app-B2-N1,#000));flex:1;font-size:var(--nav-bar-title-font-size,17px);font-weight:var(--nav-bar-title-font-weight,600);margin:var(--nav-bar-title-margin,0 16px);text-align:center}.smart-nav-bar__left,.smart-nav-bar__right{align-items:center;display:flex;width:var(--nav-bar-side-width,98px)}.smart-nav-bar__left--home{max-width:var(--nav-bar-home-max-width,calc(100% - 114px));width:auto}.smart-nav-bar__left--home .smart-nav-bar__text{color:var(--nav-bar-home-text-color,var(--app-B2-N1,#000));font-size:var(--nav-bar-home-font-size,22px);font-weight:var(--nav-bar-home-font-weight,600)}.smart-nav-bar__left--title{max-width:var(--nav-bar-title-max-width,calc(100% - 114px));width:auto}.smart-nav-bar__left--title .smart-nav-bar__text{color:var(--nav-bar-title-text-color,var(--app-B2-N1,#000));font-size:var(--nav-bar-home-font-size,22px);font-weight:var(--nav-bar-title-font-weight,600);padding-left:var(--nav-bar-left-title-padding,8px)}.smart-nav-bar__left--icon{padding-left:var(--nav-bar-icon-padding,16px)}.smart-nav-bar__right{flex-direction:row-reverse}.smart-nav-bar__right .smart-nav-bar__text{color:var(--nav-bar-right-text-color,var(--nav-bar-text-color,var(--app-B2-N2,rgba(0,0,0,.7))));padding-left:0;padding-right:var(--nav-bar-text-padding,20px);text-align:right}.smart-nav-bar__right .smart-nav-bar__icon-wrap{padding-right:var(--nav-bar-icon-padding,16px)}
1
+ @import '../common/index.wxss';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-dialog-background:#fff;--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-dialog-background:#333;--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0))}.smart-nav-bar{background-color:var(--nav-bar-background-color,var(--app-B2,#fff));box-sizing:initial;height:var(--nav-bar-height,var(--app-device-navbar-height,46px));line-height:var(--nav-bar-height,var(--app-device-navbar-height,46px));position:relative;text-align:center;-webkit-user-select:none;user-select:none}.smart-nav-bar__content{align-items:center;display:flex;height:100%;position:relative}.smart-nav-bar__text{color:var(--nav-bar-text-color,var(--app-B2-N2,rgba(0,0,0,.7)));display:inline-block;font-size:var(--nav-bar-text-font-size,16px);font-weight:var(--nav-bar-text-font-weight,600);overflow:hidden;text-overflow:ellipsis;vertical-align:middle;white-space:nowrap}.smart-nav-bar .smart-nav-bar__icon--hover,.smart-nav-bar .smart-nav-bar__text--hover{opacity:.3}.smart-nav-bar__arrow{vertical-align:middle}.smart-nav-bar__arrow>view{background:var(--nav-bar-arrow-color,var(--app-B2-N1,#000))}.smart-nav-bar__icon-wrap{align-items:center;display:flex;justify-content:center}.smart-nav-bar__icon>view{background:var(--nav-bar-icon-color,var(--app-B2-N1,#000))}.smart-nav-bar--safe{padding-top:var(--app-device-status-height,20px)}.smart-nav-bar--fixed{left:0;position:fixed;top:0;width:100%}.smart-nav-bar--round{border-radius:var(--nav-bar-round-border-radius,16px 16px 0 0);min-height:var(--nav-bar-round-min-height,56px)}.smart-nav-bar__title{color:var(--nav-bar-title-text-color,var(--app-B2-N1,#000));flex:1;font-size:var(--nav-bar-title-font-size,17px);font-weight:var(--nav-bar-title-font-weight,600);margin:var(--nav-bar-title-margin,0 16px);text-align:center}.smart-nav-bar__left,.smart-nav-bar__right{align-items:center;display:flex;width:var(--nav-bar-side-width,98px)}.smart-nav-bar__left{padding-left:var(--nav-bar-icon-padding,16px)}.smart-nav-bar__left--home{max-width:var(--nav-bar-home-max-width,calc(100% - 114px));width:auto}.smart-nav-bar__left--home .smart-nav-bar__text{color:var(--nav-bar-home-text-color,var(--app-B2-N1,#000));font-size:var(--nav-bar-home-font-size,22px);font-weight:var(--nav-bar-home-font-weight,600)}.smart-nav-bar__left--title{max-width:var(--nav-bar-title-max-width,calc(100% - 114px));width:auto}.smart-nav-bar__left--title .smart-nav-bar__text{color:var(--nav-bar-title-text-color,var(--app-B2-N1,#000));font-size:var(--nav-bar-home-font-size,22px);font-weight:var(--nav-bar-title-font-weight,600);padding-left:var(--nav-bar-left-title-padding,8px)}.smart-nav-bar__left--text{padding-left:var(--nav-bar-text-padding,20px)}.smart-nav-bar__left--icon{padding-left:var(--nav-bar-icon-padding,16px)}.smart-nav-bar__right{flex-direction:row-reverse;padding-right:var(--nav-bar-icon-padding,16px)}.smart-nav-bar__right .smart-nav-bar__text{color:var(--nav-bar-right-text-color,var(--nav-bar-text-color,var(--app-B2-N2,rgba(0,0,0,.7))));text-align:right}.smart-nav-bar__right--text{padding-right:var(--nav-bar-text-padding,20px)}
@@ -29,7 +29,9 @@ var preStateObj = {}
29
29
 
30
30
  function updateState(instanceId, key, value) {
31
31
  if (!key) return;
32
- state[instanceId] = state[instanceId] || {}
32
+ if (!state[instanceId]) {
33
+ state[instanceId] = {}
34
+ }
33
35
  state[instanceId][key] = value
34
36
  }
35
37
 
@@ -288,12 +290,12 @@ function touchMove(instanceId) {
288
290
  var direction =
289
291
  offsetCompare < 0 ? 'down' : offsetCompare > 0 ? 'up' : state.movingDirection;
290
292
  updateVisibleOptions(animationIndex, instanceId);
291
- var isOverOptions = state.loop ? false : animationIndex < 0 || animationIndex > state.options.length - 1;
293
+ var isOverOptionsItem = state.loop ? false : animationIndex < 0 || animationIndex > state.options.length - 1;
292
294
  var activeIndex = Math.round(animationIndex);
293
295
  var isDisabled = wxUtils.isObj(state.options[activeIndex]) && state.options[activeIndex].disabled;
294
296
  if (
295
297
  intPreIndex !== intCurIndex
296
- && !isOverOptions
298
+ && !isOverOptionsItem
297
299
  && !isDisabled
298
300
  ) {
299
301
  ownerInstance.callMethod('animationIndexChange', animationIndex);
@@ -379,10 +381,10 @@ function touchEnd(instanceId) {
379
381
  currTargetActiveIndex = adjustIndex(Math.round(currTargetActiveIndex), state.options, state.loop);
380
382
  targetOffset = -currTargetActiveIndex * state.itemHeight;
381
383
  var animationOffset = Math.abs(targetOffset - state.preOffsetting);
382
- var isOverOptions = state.loop ? false : state.animationIndex < 0 || state.animationIndex > state.options.length - 1;
384
+ var isOverOptionsLimit = state.loop ? false : state.animationIndex < 0 || state.animationIndex > state.options.length - 1;
383
385
  var totalDistance = targetOffset - state.preOffsetting;
384
386
  // 如果动画时间大于150ms,并且滚动距离大于itemHeight,则需要进行动态更新列表
385
- if (state.animationTime > 200 && animationOffset > state.itemHeight && !isOverOptions) {
387
+ if (state.animationTime > 200 && animationOffset > state.itemHeight && !isOverOptionsLimit) {
386
388
  var countOffsetIndex = Math.abs(Math.round(currTargetActiveIndex - state.animationIndex));
387
389
  var maxVibrateShort = Math.floor(state.animationTime / 30);
388
390
 
@@ -446,6 +448,13 @@ function touchEnd(instanceId) {
446
448
  }
447
449
  }
448
450
 
451
+
452
+ function updateVisibleOptions(currentIndex, instanceId) {
453
+ var newArr = getVisibleOptions(currentIndex, instanceId);
454
+ updateState(instanceId, 'optionsVIndexList', newArr);
455
+ return newArr
456
+ }
457
+
449
458
  var Cache = {}
450
459
 
451
460
  function getVisibleOptions(currentIndex, instanceId) {
@@ -528,12 +537,6 @@ function getVisibleOptions(currentIndex, instanceId) {
528
537
  return newArr
529
538
  }
530
539
 
531
- function updateVisibleOptions(currentIndex, instanceId) {
532
- var newArr = getVisibleOptions(currentIndex, instanceId);
533
- updateState(instanceId, 'optionsVIndexList', newArr);
534
- return newArr
535
- }
536
-
537
540
  function getWrapperCSSVar(instanceId) {
538
541
  var state = getCurrState(instanceId);
539
542
  var optionsVIndexList = state.optionsVIndexList;
@@ -541,7 +544,7 @@ function getWrapperCSSVar(instanceId) {
541
544
  if (currentValue === '' || currentValue === undefined) {
542
545
  previousValue['--picker-item-content_' + currentIndex] = '""';
543
546
  } else {
544
- var index = state.loop ? Math.abs(currentValue % state.options.length) : currentValue;
547
+ var index = currentValue;
545
548
  var text = optionText(state.options, index, state.valueKey);
546
549
  previousValue['--picker-item-content_' + currentIndex] = '"' + (text === undefined ? '' : text) + '"';
547
550
  }
@@ -583,17 +586,17 @@ function tapItem(instanceId) {
583
586
  clearTimeout(state.tapTimer);
584
587
  updateState(instanceId, 'tapTimer', null);
585
588
  }
586
- var currTargetActiveIndex = getNewAnimationIndex(state.animationIndex, currOptionsActiveIndex, state.options.length || 1, state.loop);
587
- var offsetCount = Math.abs(currTargetActiveIndex - state.animationIndex);
588
- updateVisibleOptions(currTargetActiveIndex, instanceId);
589
- updateState(instanceId, 'animationIndex', currTargetActiveIndex);
589
+ var targetAnimationIndex = getNewAnimationIndex(state.animationIndex, currOptionsActiveIndex, state.options.length || 1, state.loop);
590
+ var offsetCount = Math.abs(targetAnimationIndex - state.animationIndex);
591
+ updateVisibleOptions(targetAnimationIndex, instanceId);
592
+ updateState(instanceId, 'animationIndex', targetAnimationIndex);
590
593
  updateWrapperStyle(instanceId, ownerInstance, {
591
594
  transition: 'transform ' + 300 + 'ms cubic-bezier(0.2, 0.9, 0.25, 1)'
592
595
  });
593
- ownerInstance.callMethod('animationIndexChange', currTargetActiveIndex);
596
+ ownerInstance.callMethod('animationIndexChange', targetAnimationIndex);
594
597
  ownerInstance.callMethod('vibrateShort', offsetCount, 200);
595
598
  var tapTimer = setTimeout(function() {
596
- ownerInstance.callMethod('activeIndexChange', currTargetActiveIndex);
599
+ ownerInstance.callMethod('activeIndexChange', targetAnimationIndex);
597
600
  updateState(instanceId, 'tapTimer', null);
598
601
  setTimeout(function() {
599
602
  ownerInstance.callMethod('animationEnd');
@@ -1 +1 @@
1
- @import '../common/index.css';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-dialog-background:#fff;--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-dialog-background:#333;--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0))}.smart-nav-bar{background-color:var(--nav-bar-background-color,var(--app-B2,#fff));box-sizing:initial;height:var(--nav-bar-height,var(--app-device-navbar-height,46px));line-height:var(--nav-bar-height,var(--app-device-navbar-height,46px));position:relative;text-align:center;-webkit-user-select:none;user-select:none}.smart-nav-bar__content{align-items:center;display:flex;height:100%;position:relative}.smart-nav-bar__text{color:var(--nav-bar-text-color,var(--app-B2-N2,rgba(0,0,0,.7)));display:inline-block;font-size:var(--nav-bar-text-font-size,16px);font-weight:var(--nav-bar-text-font-weight,600);overflow:hidden;padding-left:var(--nav-bar-text-padding,20px);text-overflow:ellipsis;vertical-align:middle;white-space:nowrap}.smart-nav-bar .smart-nav-bar__icon--hover,.smart-nav-bar .smart-nav-bar__text--hover{opacity:.3}.smart-nav-bar__arrow{vertical-align:middle}.smart-nav-bar__arrow>view{background:var(--nav-bar-arrow-color,var(--app-B2-N1,#000))}.smart-nav-bar__icon-wrap{align-items:center;display:flex;justify-content:center}.smart-nav-bar__icon>view{background:var(--nav-bar-icon-color,var(--app-B2-N1,#000))}.smart-nav-bar--safe{padding-top:var(--app-device-status-height,20px)}.smart-nav-bar--fixed{left:0;position:fixed;top:0;width:100%}.smart-nav-bar--round{border-radius:var(--nav-bar-round-border-radius,16px 16px 0 0);min-height:var(--nav-bar-round-min-height,56px)}.smart-nav-bar__title{color:var(--nav-bar-title-text-color,var(--app-B2-N1,#000));flex:1;font-size:var(--nav-bar-title-font-size,17px);font-weight:var(--nav-bar-title-font-weight,600);margin:var(--nav-bar-title-margin,0 16px);text-align:center}.smart-nav-bar__left,.smart-nav-bar__right{align-items:center;display:flex;width:var(--nav-bar-side-width,98px)}.smart-nav-bar__left--home{max-width:var(--nav-bar-home-max-width,calc(100% - 114px));width:auto}.smart-nav-bar__left--home .smart-nav-bar__text{color:var(--nav-bar-home-text-color,var(--app-B2-N1,#000));font-size:var(--nav-bar-home-font-size,22px);font-weight:var(--nav-bar-home-font-weight,600)}.smart-nav-bar__left--title{max-width:var(--nav-bar-title-max-width,calc(100% - 114px));width:auto}.smart-nav-bar__left--title .smart-nav-bar__text{color:var(--nav-bar-title-text-color,var(--app-B2-N1,#000));font-size:var(--nav-bar-home-font-size,22px);font-weight:var(--nav-bar-title-font-weight,600);padding-left:var(--nav-bar-left-title-padding,8px)}.smart-nav-bar__left--icon{padding-left:var(--nav-bar-icon-padding,16px)}.smart-nav-bar__right{flex-direction:row-reverse}.smart-nav-bar__right .smart-nav-bar__text{color:var(--nav-bar-right-text-color,var(--nav-bar-text-color,var(--app-B2-N2,rgba(0,0,0,.7))));padding-left:0;padding-right:var(--nav-bar-text-padding,20px);text-align:right}.smart-nav-bar__right .smart-nav-bar__icon-wrap{padding-right:var(--nav-bar-icon-padding,16px)}
1
+ @import '../common/index.css';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-dialog-background:#fff;--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-dialog-background:#333;--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0))}.smart-nav-bar{background-color:var(--nav-bar-background-color,var(--app-B2,#fff));box-sizing:initial;height:var(--nav-bar-height,var(--app-device-navbar-height,46px));line-height:var(--nav-bar-height,var(--app-device-navbar-height,46px));position:relative;text-align:center;-webkit-user-select:none;user-select:none}.smart-nav-bar__content{align-items:center;display:flex;height:100%;position:relative}.smart-nav-bar__text{color:var(--nav-bar-text-color,var(--app-B2-N2,rgba(0,0,0,.7)));display:inline-block;font-size:var(--nav-bar-text-font-size,16px);font-weight:var(--nav-bar-text-font-weight,600);overflow:hidden;text-overflow:ellipsis;vertical-align:middle;white-space:nowrap}.smart-nav-bar .smart-nav-bar__icon--hover,.smart-nav-bar .smart-nav-bar__text--hover{opacity:.3}.smart-nav-bar__arrow{vertical-align:middle}.smart-nav-bar__arrow>view{background:var(--nav-bar-arrow-color,var(--app-B2-N1,#000))}.smart-nav-bar__icon-wrap{align-items:center;display:flex;justify-content:center}.smart-nav-bar__icon>view{background:var(--nav-bar-icon-color,var(--app-B2-N1,#000))}.smart-nav-bar--safe{padding-top:var(--app-device-status-height,20px)}.smart-nav-bar--fixed{left:0;position:fixed;top:0;width:100%}.smart-nav-bar--round{border-radius:var(--nav-bar-round-border-radius,16px 16px 0 0);min-height:var(--nav-bar-round-min-height,56px)}.smart-nav-bar__title{color:var(--nav-bar-title-text-color,var(--app-B2-N1,#000));flex:1;font-size:var(--nav-bar-title-font-size,17px);font-weight:var(--nav-bar-title-font-weight,600);margin:var(--nav-bar-title-margin,0 16px);text-align:center}.smart-nav-bar__left,.smart-nav-bar__right{align-items:center;display:flex;width:var(--nav-bar-side-width,98px)}.smart-nav-bar__left{padding-left:var(--nav-bar-icon-padding,16px)}.smart-nav-bar__left--home{max-width:var(--nav-bar-home-max-width,calc(100% - 114px));width:auto}.smart-nav-bar__left--home .smart-nav-bar__text{color:var(--nav-bar-home-text-color,var(--app-B2-N1,#000));font-size:var(--nav-bar-home-font-size,22px);font-weight:var(--nav-bar-home-font-weight,600)}.smart-nav-bar__left--title{max-width:var(--nav-bar-title-max-width,calc(100% - 114px));width:auto}.smart-nav-bar__left--title .smart-nav-bar__text{color:var(--nav-bar-title-text-color,var(--app-B2-N1,#000));font-size:var(--nav-bar-home-font-size,22px);font-weight:var(--nav-bar-title-font-weight,600);padding-left:var(--nav-bar-left-title-padding,8px)}.smart-nav-bar__left--text{padding-left:var(--nav-bar-text-padding,20px)}.smart-nav-bar__left--icon{padding-left:var(--nav-bar-icon-padding,16px)}.smart-nav-bar__right{flex-direction:row-reverse;padding-right:var(--nav-bar-icon-padding,16px)}.smart-nav-bar__right .smart-nav-bar__text{color:var(--nav-bar-right-text-color,var(--nav-bar-text-color,var(--app-B2-N2,rgba(0,0,0,.7))));text-align:right}.smart-nav-bar__right--text{padding-right:var(--nav-bar-text-padding,20px)}
@@ -8,7 +8,7 @@
8
8
  style="{{ computed.barStyle({ zIndex, statusBarHeight, safeAreaInsetTop, background }) }}; {{ customStyle }}"
9
9
  >
10
10
  <view class="smart-nav-bar__content">
11
- <view class="{{ utils.bem('nav-bar__left', { home: leftTextType === 'home', title: leftTextType === 'title', icon: leftArrow || leftIcon }) }}" bind:tap="onClickLeft">
11
+ <view class="{{ utils.bem('nav-bar__left', { home: leftTextType === 'home', title: leftTextType === 'title', text: !!leftText, icon: leftArrow || leftIcon }) }}" bind:tap="onClickLeft">
12
12
  <smart-icon
13
13
  wx:if="{{ leftArrow }}"
14
14
  size="24px"
@@ -43,7 +43,7 @@
43
43
  <block>{{ title }}</block>
44
44
  <slot name="title" />
45
45
  </view>
46
- <view class="smart-nav-bar__right" bind:tap="onClickRight">
46
+ <view class="{{utils.bem('nav-bar__right', { text: !!rightText })}}" bind:tap="onClickRight">
47
47
  <view
48
48
  wx:if="{{ rightIcon }}"
49
49
  data-type="rightIcon"
@@ -1 +1 @@
1
- @import '../common/index.wxss';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-dialog-background:#fff;--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-dialog-background:#333;--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0))}.smart-nav-bar{background-color:var(--nav-bar-background-color,var(--app-B2,#fff));box-sizing:initial;height:var(--nav-bar-height,var(--app-device-navbar-height,46px));line-height:var(--nav-bar-height,var(--app-device-navbar-height,46px));position:relative;text-align:center;-webkit-user-select:none;user-select:none}.smart-nav-bar__content{align-items:center;display:flex;height:100%;position:relative}.smart-nav-bar__text{color:var(--nav-bar-text-color,var(--app-B2-N2,rgba(0,0,0,.7)));display:inline-block;font-size:var(--nav-bar-text-font-size,16px);font-weight:var(--nav-bar-text-font-weight,600);overflow:hidden;padding-left:var(--nav-bar-text-padding,20px);text-overflow:ellipsis;vertical-align:middle;white-space:nowrap}.smart-nav-bar .smart-nav-bar__icon--hover,.smart-nav-bar .smart-nav-bar__text--hover{opacity:.3}.smart-nav-bar__arrow{vertical-align:middle}.smart-nav-bar__arrow>view{background:var(--nav-bar-arrow-color,var(--app-B2-N1,#000))}.smart-nav-bar__icon-wrap{align-items:center;display:flex;justify-content:center}.smart-nav-bar__icon>view{background:var(--nav-bar-icon-color,var(--app-B2-N1,#000))}.smart-nav-bar--safe{padding-top:var(--app-device-status-height,20px)}.smart-nav-bar--fixed{left:0;position:fixed;top:0;width:100%}.smart-nav-bar--round{border-radius:var(--nav-bar-round-border-radius,16px 16px 0 0);min-height:var(--nav-bar-round-min-height,56px)}.smart-nav-bar__title{color:var(--nav-bar-title-text-color,var(--app-B2-N1,#000));flex:1;font-size:var(--nav-bar-title-font-size,17px);font-weight:var(--nav-bar-title-font-weight,600);margin:var(--nav-bar-title-margin,0 16px);text-align:center}.smart-nav-bar__left,.smart-nav-bar__right{align-items:center;display:flex;width:var(--nav-bar-side-width,98px)}.smart-nav-bar__left--home{max-width:var(--nav-bar-home-max-width,calc(100% - 114px));width:auto}.smart-nav-bar__left--home .smart-nav-bar__text{color:var(--nav-bar-home-text-color,var(--app-B2-N1,#000));font-size:var(--nav-bar-home-font-size,22px);font-weight:var(--nav-bar-home-font-weight,600)}.smart-nav-bar__left--title{max-width:var(--nav-bar-title-max-width,calc(100% - 114px));width:auto}.smart-nav-bar__left--title .smart-nav-bar__text{color:var(--nav-bar-title-text-color,var(--app-B2-N1,#000));font-size:var(--nav-bar-home-font-size,22px);font-weight:var(--nav-bar-title-font-weight,600);padding-left:var(--nav-bar-left-title-padding,8px)}.smart-nav-bar__left--icon{padding-left:var(--nav-bar-icon-padding,16px)}.smart-nav-bar__right{flex-direction:row-reverse}.smart-nav-bar__right .smart-nav-bar__text{color:var(--nav-bar-right-text-color,var(--nav-bar-text-color,var(--app-B2-N2,rgba(0,0,0,.7))));padding-left:0;padding-right:var(--nav-bar-text-padding,20px);text-align:right}.smart-nav-bar__right .smart-nav-bar__icon-wrap{padding-right:var(--nav-bar-icon-padding,16px)}
1
+ @import '../common/index.wxss';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-dialog-background:#fff;--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-dialog-background:#333;--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0))}.smart-nav-bar{background-color:var(--nav-bar-background-color,var(--app-B2,#fff));box-sizing:initial;height:var(--nav-bar-height,var(--app-device-navbar-height,46px));line-height:var(--nav-bar-height,var(--app-device-navbar-height,46px));position:relative;text-align:center;-webkit-user-select:none;user-select:none}.smart-nav-bar__content{align-items:center;display:flex;height:100%;position:relative}.smart-nav-bar__text{color:var(--nav-bar-text-color,var(--app-B2-N2,rgba(0,0,0,.7)));display:inline-block;font-size:var(--nav-bar-text-font-size,16px);font-weight:var(--nav-bar-text-font-weight,600);overflow:hidden;text-overflow:ellipsis;vertical-align:middle;white-space:nowrap}.smart-nav-bar .smart-nav-bar__icon--hover,.smart-nav-bar .smart-nav-bar__text--hover{opacity:.3}.smart-nav-bar__arrow{vertical-align:middle}.smart-nav-bar__arrow>view{background:var(--nav-bar-arrow-color,var(--app-B2-N1,#000))}.smart-nav-bar__icon-wrap{align-items:center;display:flex;justify-content:center}.smart-nav-bar__icon>view{background:var(--nav-bar-icon-color,var(--app-B2-N1,#000))}.smart-nav-bar--safe{padding-top:var(--app-device-status-height,20px)}.smart-nav-bar--fixed{left:0;position:fixed;top:0;width:100%}.smart-nav-bar--round{border-radius:var(--nav-bar-round-border-radius,16px 16px 0 0);min-height:var(--nav-bar-round-min-height,56px)}.smart-nav-bar__title{color:var(--nav-bar-title-text-color,var(--app-B2-N1,#000));flex:1;font-size:var(--nav-bar-title-font-size,17px);font-weight:var(--nav-bar-title-font-weight,600);margin:var(--nav-bar-title-margin,0 16px);text-align:center}.smart-nav-bar__left,.smart-nav-bar__right{align-items:center;display:flex;width:var(--nav-bar-side-width,98px)}.smart-nav-bar__left{padding-left:var(--nav-bar-icon-padding,16px)}.smart-nav-bar__left--home{max-width:var(--nav-bar-home-max-width,calc(100% - 114px));width:auto}.smart-nav-bar__left--home .smart-nav-bar__text{color:var(--nav-bar-home-text-color,var(--app-B2-N1,#000));font-size:var(--nav-bar-home-font-size,22px);font-weight:var(--nav-bar-home-font-weight,600)}.smart-nav-bar__left--title{max-width:var(--nav-bar-title-max-width,calc(100% - 114px));width:auto}.smart-nav-bar__left--title .smart-nav-bar__text{color:var(--nav-bar-title-text-color,var(--app-B2-N1,#000));font-size:var(--nav-bar-home-font-size,22px);font-weight:var(--nav-bar-title-font-weight,600);padding-left:var(--nav-bar-left-title-padding,8px)}.smart-nav-bar__left--text{padding-left:var(--nav-bar-text-padding,20px)}.smart-nav-bar__left--icon{padding-left:var(--nav-bar-icon-padding,16px)}.smart-nav-bar__right{flex-direction:row-reverse;padding-right:var(--nav-bar-icon-padding,16px)}.smart-nav-bar__right .smart-nav-bar__text{color:var(--nav-bar-right-text-color,var(--nav-bar-text-color,var(--app-B2-N2,rgba(0,0,0,.7))));text-align:right}.smart-nav-bar__right--text{padding-right:var(--nav-bar-text-padding,20px)}
@@ -29,7 +29,9 @@ var preStateObj = {}
29
29
 
30
30
  function updateState(instanceId, key, value) {
31
31
  if (!key) return;
32
- state[instanceId] = state[instanceId] || {}
32
+ if (!state[instanceId]) {
33
+ state[instanceId] = {}
34
+ }
33
35
  state[instanceId][key] = value
34
36
  }
35
37
 
@@ -288,12 +290,12 @@ function touchMove(instanceId) {
288
290
  var direction =
289
291
  offsetCompare < 0 ? 'down' : offsetCompare > 0 ? 'up' : state.movingDirection;
290
292
  updateVisibleOptions(animationIndex, instanceId);
291
- var isOverOptions = state.loop ? false : animationIndex < 0 || animationIndex > state.options.length - 1;
293
+ var isOverOptionsItem = state.loop ? false : animationIndex < 0 || animationIndex > state.options.length - 1;
292
294
  var activeIndex = Math.round(animationIndex);
293
295
  var isDisabled = wxUtils.isObj(state.options[activeIndex]) && state.options[activeIndex].disabled;
294
296
  if (
295
297
  intPreIndex !== intCurIndex
296
- && !isOverOptions
298
+ && !isOverOptionsItem
297
299
  && !isDisabled
298
300
  ) {
299
301
  ownerInstance.callMethod('animationIndexChange', animationIndex);
@@ -379,10 +381,10 @@ function touchEnd(instanceId) {
379
381
  currTargetActiveIndex = adjustIndex(Math.round(currTargetActiveIndex), state.options, state.loop);
380
382
  targetOffset = -currTargetActiveIndex * state.itemHeight;
381
383
  var animationOffset = Math.abs(targetOffset - state.preOffsetting);
382
- var isOverOptions = state.loop ? false : state.animationIndex < 0 || state.animationIndex > state.options.length - 1;
384
+ var isOverOptionsLimit = state.loop ? false : state.animationIndex < 0 || state.animationIndex > state.options.length - 1;
383
385
  var totalDistance = targetOffset - state.preOffsetting;
384
386
  // 如果动画时间大于150ms,并且滚动距离大于itemHeight,则需要进行动态更新列表
385
- if (state.animationTime > 200 && animationOffset > state.itemHeight && !isOverOptions) {
387
+ if (state.animationTime > 200 && animationOffset > state.itemHeight && !isOverOptionsLimit) {
386
388
  var countOffsetIndex = Math.abs(Math.round(currTargetActiveIndex - state.animationIndex));
387
389
  var maxVibrateShort = Math.floor(state.animationTime / 30);
388
390
 
@@ -446,6 +448,13 @@ function touchEnd(instanceId) {
446
448
  }
447
449
  }
448
450
 
451
+
452
+ function updateVisibleOptions(currentIndex, instanceId) {
453
+ var newArr = getVisibleOptions(currentIndex, instanceId);
454
+ updateState(instanceId, 'optionsVIndexList', newArr);
455
+ return newArr
456
+ }
457
+
449
458
  var Cache = {}
450
459
 
451
460
  function getVisibleOptions(currentIndex, instanceId) {
@@ -528,12 +537,6 @@ function getVisibleOptions(currentIndex, instanceId) {
528
537
  return newArr
529
538
  }
530
539
 
531
- function updateVisibleOptions(currentIndex, instanceId) {
532
- var newArr = getVisibleOptions(currentIndex, instanceId);
533
- updateState(instanceId, 'optionsVIndexList', newArr);
534
- return newArr
535
- }
536
-
537
540
  function getWrapperCSSVar(instanceId) {
538
541
  var state = getCurrState(instanceId);
539
542
  var optionsVIndexList = state.optionsVIndexList;
@@ -541,7 +544,7 @@ function getWrapperCSSVar(instanceId) {
541
544
  if (currentValue === '' || currentValue === undefined) {
542
545
  previousValue['--picker-item-content_' + currentIndex] = '""';
543
546
  } else {
544
- var index = state.loop ? Math.abs(currentValue % state.options.length) : currentValue;
547
+ var index = currentValue;
545
548
  var text = optionText(state.options, index, state.valueKey);
546
549
  previousValue['--picker-item-content_' + currentIndex] = '"' + (text === undefined ? '' : text) + '"';
547
550
  }
@@ -583,17 +586,17 @@ function tapItem(instanceId) {
583
586
  clearTimeout(state.tapTimer);
584
587
  updateState(instanceId, 'tapTimer', null);
585
588
  }
586
- var currTargetActiveIndex = getNewAnimationIndex(state.animationIndex, currOptionsActiveIndex, state.options.length || 1, state.loop);
587
- var offsetCount = Math.abs(currTargetActiveIndex - state.animationIndex);
588
- updateVisibleOptions(currTargetActiveIndex, instanceId);
589
- updateState(instanceId, 'animationIndex', currTargetActiveIndex);
589
+ var targetAnimationIndex = getNewAnimationIndex(state.animationIndex, currOptionsActiveIndex, state.options.length || 1, state.loop);
590
+ var offsetCount = Math.abs(targetAnimationIndex - state.animationIndex);
591
+ updateVisibleOptions(targetAnimationIndex, instanceId);
592
+ updateState(instanceId, 'animationIndex', targetAnimationIndex);
590
593
  updateWrapperStyle(instanceId, ownerInstance, {
591
594
  transition: 'transform ' + 300 + 'ms cubic-bezier(0.2, 0.9, 0.25, 1)'
592
595
  });
593
- ownerInstance.callMethod('animationIndexChange', currTargetActiveIndex);
596
+ ownerInstance.callMethod('animationIndexChange', targetAnimationIndex);
594
597
  ownerInstance.callMethod('vibrateShort', offsetCount, 200);
595
598
  var tapTimer = setTimeout(function() {
596
- ownerInstance.callMethod('activeIndexChange', currTargetActiveIndex);
599
+ ownerInstance.callMethod('activeIndexChange', targetAnimationIndex);
597
600
  updateState(instanceId, 'tapTimer', null);
598
601
  setTimeout(function() {
599
602
  ownerInstance.callMethod('animationEnd');
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tuya-miniapp/smart-ui",
3
- "version": "2.7.0-beta-5",
3
+ "version": "2.7.0-beta-7",
4
4
  "author": "MiniApp Team",
5
5
  "license": "MIT",
6
6
  "miniprogram": "lib",