@handaotech-design/bom 0.0.41 → 0.0.42

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 (3) hide show
  1. package/dist/es/components/bom-tree/index.vue +48 -16
  2. package/dist/lib/components/bom-tree/index.vue +48 -16
  3. package/package.json +1 -1
package/dist/es/components/bom-tree/index.vue CHANGED
@@ -372,6 +372,7 @@ function focusNode(key: string) {
372
372
 
373
373
  // 3. 触发一次可感知的焦点动画
374
374
  el.classList.remove('focus-flash')
375
+ // eslint-disable-next-line no-void
375
376
  void el.offsetWidth
376
377
  el.classList.add('focus-flash')
377
378
 
@@ -398,24 +399,20 @@ function focusNode(key: string) {
398
399
  {{ searchMatches.length ? currentMatchIndex + 1 : 0 }} / {{ searchMatches.length }}
399
400
  </div>
400
401
  <div v-if="searchValue" class="match-nav" :class="{ 'is-disabled': !searchMatches.length }">
401
- <a-button
402
+ <div
402
403
  class="match-nav-btn mr-4px"
403
- shape="circle"
404
- size="small"
405
- :disabled="!searchMatches.length"
404
+ :class="{ disabled: !searchMatches.length }"
406
405
  @click.stop.prevent="focusPreviousMatch"
407
406
  >
408
407
  ↑
409
- </a-button>
410
- <a-button
408
+ </div>
409
+ <div
411
410
  class="match-nav-btn"
412
- shape="circle"
413
- size="small"
414
- :disabled="!searchMatches.length"
411
+ :class="{ disabled: !searchMatches.length }"
415
412
  @click.stop.prevent="focusNextMatch"
416
413
  >
417
414
  ↓
418
- </a-button>
415
+ </div>
419
416
  </div>
420
417
  </template>
421
418
  </HdGrayInput>
@@ -605,17 +602,19 @@ function focusNode(key: string) {
605
602
  .tree-node-tittle.focus-flash::after {
606
603
  content: "";
607
604
  position: absolute;
608
- inset: -4px -8px;
609
- border-radius: 8px;
605
+ inset: -2px -6px; /* 包裹文字 */
606
+ border-radius: 6px;
610
607
  pointer-events: none;
611
- box-shadow: 0 0 0 1px rgba(30, 59, 157, 0.25), 0 0 8px rgba(30, 59, 157, 0.25);
612
- animation: focusSoftGlow 1.6s ease-out 2;
608
+ /* 混合描边 + 光晕 */
609
+ border: 1.5px solid rgba(30, 59, 157, 0.6); /* 更明显但不硬 */
610
+ box-shadow: 0 0 6px rgba(30, 59, 157, 0.35);
611
+ animation: focusSoftGlow 1.4s ease-out 2;
613
612
  }
614
613
 
615
614
  @keyframes focusSoftGlow {
616
615
  0% {
617
616
  opacity: 0;
618
- transform: scale(0.98);
617
+ transform: scale(0.97);
619
618
  }
620
619
  30% {
621
620
  opacity: 1;
@@ -623,7 +622,40 @@ function focusNode(key: string) {
623
622
  }
624
623
  100% {
625
624
  opacity: 0;
626
- transform: scale(1.01);
625
+ transform: scale(1.02);
627
626
  }
628
627
  }
628
+ :deep(.match-nav) {
629
+ display: flex;
630
+ align-items: center;
631
+ }
632
+ :deep(.match-nav) .match-nav-btn {
633
+ width: 20px;
634
+ height: 20px;
635
+ line-height: 18px;
636
+ text-align: center;
637
+ border: 1px solid rgba(0, 0, 0, 0.65);
638
+ border-radius: 50%;
639
+ color: rgba(0, 0, 0, 0.65);
640
+ background-color: #fff;
641
+ cursor: pointer;
642
+ font-size: 12px;
643
+ margin-left: 4px;
644
+ transition: all 0.2s;
645
+ }
646
+ :deep(.match-nav) .match-nav-btn:hover {
647
+ background-color: #E9EBED;
648
+ border-color: #1E3B9D;
649
+ color: #1E3B9D;
650
+ }
651
+ :deep(.match-nav) .match-nav-btn.disabled {
652
+ color: #ccc;
653
+ border-color: #ccc;
654
+ cursor: not-allowed;
655
+ background-color: #f5f5f5;
656
+ }
657
+ :deep(.match-nav) .match-nav-btn.disabled:hover {
658
+ background-color: #f5f5f5;
659
+ border-color: #ccc;
660
+ }
629
661
  </style>
package/dist/lib/components/bom-tree/index.vue CHANGED
@@ -372,6 +372,7 @@ function focusNode(key: string) {
372
372
 
373
373
  // 3. 触发一次可感知的焦点动画
374
374
  el.classList.remove('focus-flash')
375
+ // eslint-disable-next-line no-void
375
376
  void el.offsetWidth
376
377
  el.classList.add('focus-flash')
377
378
 
@@ -398,24 +399,20 @@ function focusNode(key: string) {
398
399
  {{ searchMatches.length ? currentMatchIndex + 1 : 0 }} / {{ searchMatches.length }}
399
400
  </div>
400
401
  <div v-if="searchValue" class="match-nav" :class="{ 'is-disabled': !searchMatches.length }">
401
- <a-button
402
+ <div
402
403
  class="match-nav-btn mr-4px"
403
- shape="circle"
404
- size="small"
405
- :disabled="!searchMatches.length"
404
+ :class="{ disabled: !searchMatches.length }"
406
405
  @click.stop.prevent="focusPreviousMatch"
407
406
  >
408
407
  ↑
409
- </a-button>
410
- <a-button
408
+ </div>
409
+ <div
411
410
  class="match-nav-btn"
412
- shape="circle"
413
- size="small"
414
- :disabled="!searchMatches.length"
411
+ :class="{ disabled: !searchMatches.length }"
415
412
  @click.stop.prevent="focusNextMatch"
416
413
  >
417
414
  ↓
418
- </a-button>
415
+ </div>
419
416
  </div>
420
417
  </template>
421
418
  </HdGrayInput>
@@ -605,17 +602,19 @@ function focusNode(key: string) {
605
602
  .tree-node-tittle.focus-flash::after {
606
603
  content: "";
607
604
  position: absolute;
608
- inset: -4px -8px;
609
- border-radius: 8px;
605
+ inset: -2px -6px; /* 包裹文字 */
606
+ border-radius: 6px;
610
607
  pointer-events: none;
611
- box-shadow: 0 0 0 1px rgba(30, 59, 157, 0.25), 0 0 8px rgba(30, 59, 157, 0.25);
612
- animation: focusSoftGlow 1.6s ease-out 2;
608
+ /* 混合描边 + 光晕 */
609
+ border: 1.5px solid rgba(30, 59, 157, 0.6); /* 更明显但不硬 */
610
+ box-shadow: 0 0 6px rgba(30, 59, 157, 0.35);
611
+ animation: focusSoftGlow 1.4s ease-out 2;
613
612
  }
614
613
 
615
614
  @keyframes focusSoftGlow {
616
615
  0% {
617
616
  opacity: 0;
618
- transform: scale(0.98);
617
+ transform: scale(0.97);
619
618
  }
620
619
  30% {
621
620
  opacity: 1;
@@ -623,7 +622,40 @@ function focusNode(key: string) {
623
622
  }
624
623
  100% {
625
624
  opacity: 0;
626
- transform: scale(1.01);
625
+ transform: scale(1.02);
627
626
  }
628
627
  }
628
+ :deep(.match-nav) {
629
+ display: flex;
630
+ align-items: center;
631
+ }
632
+ :deep(.match-nav) .match-nav-btn {
633
+ width: 20px;
634
+ height: 20px;
635
+ line-height: 18px;
636
+ text-align: center;
637
+ border: 1px solid rgba(0, 0, 0, 0.65);
638
+ border-radius: 50%;
639
+ color: rgba(0, 0, 0, 0.65);
640
+ background-color: #fff;
641
+ cursor: pointer;
642
+ font-size: 12px;
643
+ margin-left: 4px;
644
+ transition: all 0.2s;
645
+ }
646
+ :deep(.match-nav) .match-nav-btn:hover {
647
+ background-color: #E9EBED;
648
+ border-color: #1E3B9D;
649
+ color: #1E3B9D;
650
+ }
651
+ :deep(.match-nav) .match-nav-btn.disabled {
652
+ color: #ccc;
653
+ border-color: #ccc;
654
+ cursor: not-allowed;
655
+ background-color: #f5f5f5;
656
+ }
657
+ :deep(.match-nav) .match-nav-btn.disabled:hover {
658
+ background-color: #f5f5f5;
659
+ border-color: #ccc;
660
+ }
629
661
  </style>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@handaotech-design/bom",
3
- "version": "0.0.41",
3
+ "version": "0.0.42",
4
4
  "license": "MIT",
5
5
  "sideEffects": false,
6
6
  "exports": {