Преглед на файлове

Restores selected indicator, removes hook for isSelected on shape

main
Steve Ruiz преди 4 години
родител
ревизия
9877c2ff97
променени са 3 файла, в които са добавени 14 реда и са изтрити 15 реда
  1. 1
    2
      components/canvas/canvas.tsx
  2. 4
    6
      components/canvas/shape.tsx
  3. 9
    7
      state/sessions/brush-session.ts

+ 1
- 2
components/canvas/canvas.tsx Целия файл

56
       onPointerMove={handlePointerMove}
56
       onPointerMove={handlePointerMove}
57
       onPointerUp={handlePointerUp}
57
       onPointerUp={handlePointerUp}
58
       onTouchStart={handleTouchStart}
58
       onTouchStart={handleTouchStart}
59
-      // onTouchMove={handleTouchMove}
60
     >
59
     >
61
       <Defs />
60
       <Defs />
62
       {isReady && (
61
       {isReady && (
63
         <g ref={rGroup}>
62
         <g ref={rGroup}>
64
           <BoundsBg />
63
           <BoundsBg />
65
           <Page />
64
           <Page />
66
-          {/* <Selected /> */}
65
+          <Selected />
67
           <Bounds />
66
           <Bounds />
68
           <Handles />
67
           <Handles />
69
           <Brush />
68
           <Brush />

+ 4
- 6
components/canvas/shape.tsx Целия файл

8
 import { getShapeStyle } from 'lib/shape-styles'
8
 import { getShapeStyle } from 'lib/shape-styles'
9
 
9
 
10
 function Shape({ id, isSelecting }: { id: string; isSelecting: boolean }) {
10
 function Shape({ id, isSelecting }: { id: string; isSelecting: boolean }) {
11
-  const isSelected = useSelector((s) => s.values.selectedIds.has(id))
12
-
13
   const shape = useSelector(({ data }) => getPage(data).shapes[id])
11
   const shape = useSelector(({ data }) => getPage(data).shapes[id])
14
 
12
 
15
   const rGroup = useRef<SVGGElement>(null)
13
   const rGroup = useRef<SVGGElement>(null)
32
   const style = getShapeStyle(shape.style)
30
   const style = getShapeStyle(shape.style)
33
 
31
 
34
   return (
32
   return (
35
-    <StyledGroup ref={rGroup} isSelected={isSelected} transform={transform}>
33
+    <StyledGroup ref={rGroup} transform={transform}>
36
       {isSelecting && (
34
       {isSelecting && (
37
         <HoverIndicator
35
         <HoverIndicator
38
           as="use"
36
           as="use"
86
   [`& ${HoverIndicator}`]: {
84
   [`& ${HoverIndicator}`]: {
87
     opacity: '0',
85
     opacity: '0',
88
   },
86
   },
87
+  [`&:hover ${HoverIndicator}`]: {
88
+    opacity: '0.16',
89
+  },
89
   variants: {
90
   variants: {
90
     isSelected: {
91
     isSelected: {
91
       true: {
92
       true: {
103
         [`& ${HoverIndicator}`]: {
104
         [`& ${HoverIndicator}`]: {
104
           opacity: '0',
105
           opacity: '0',
105
         },
106
         },
106
-        [`&:hover ${HoverIndicator}`]: {
107
-          opacity: '0.16',
108
-        },
109
       },
107
       },
110
     },
108
     },
111
   },
109
   },

+ 9
- 7
state/sessions/brush-session.ts Целия файл

1
-import { current } from "immer"
2
-import { Bounds, Data } from "types"
3
-import BaseSession from "./base-session"
4
-import { getShapeUtils } from "lib/shape-utils"
5
-import { getBoundsFromPoints, getShapes } from "utils/utils"
6
-import * as vec from "utils/vec"
1
+import { current } from 'immer'
2
+import { Bounds, Data } from 'types'
3
+import BaseSession from './base-session'
4
+import { getShapeUtils } from 'lib/shape-utils'
5
+import { getBoundsFromPoints, getShapes } from 'utils/utils'
6
+import * as vec from 'utils/vec'
7
 
7
 
8
 export default class BrushSession extends BaseSession {
8
 export default class BrushSession extends BaseSession {
9
   origin: number[]
9
   origin: number[]
25
     for (let id in snapshot.shapeHitTests) {
25
     for (let id in snapshot.shapeHitTests) {
26
       const test = snapshot.shapeHitTests[id]
26
       const test = snapshot.shapeHitTests[id]
27
       if (test(brushBounds)) {
27
       if (test(brushBounds)) {
28
-        data.selectedIds.add(id)
28
+        if (!data.selectedIds.has(id)) {
29
+          data.selectedIds.add(id)
30
+        }
29
       } else if (data.selectedIds.has(id)) {
31
       } else if (data.selectedIds.has(id)) {
30
         data.selectedIds.delete(id)
32
         data.selectedIds.delete(id)
31
       }
33
       }

Loading…
Отказ
Запис