You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

style.ts 1.2KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051
  1. import Command from './command'
  2. import history from '../history'
  3. import { Data, ShapeStyles } from 'types'
  4. import {
  5. getDocumentBranch,
  6. getPage,
  7. getSelectedIds,
  8. setToArray,
  9. } from 'utils/utils'
  10. import { getShapeUtils } from 'state/shape-utils'
  11. import { current } from 'immer'
  12. export default function styleCommand(
  13. data: Data,
  14. styles: Partial<ShapeStyles>
  15. ): void {
  16. const cData = current(data)
  17. const page = getPage(cData)
  18. const { currentPageId } = cData
  19. const selectedIds = setToArray(getSelectedIds(data))
  20. const shapesToStyle = selectedIds
  21. .flatMap((id) => getDocumentBranch(data, id))
  22. .map((id) => page.shapes[id])
  23. history.execute(
  24. data,
  25. new Command({
  26. name: 'style_shapes',
  27. category: 'canvas',
  28. manualSelection: true,
  29. do(data) {
  30. const { shapes } = getPage(data, currentPageId)
  31. for (const { id } of shapesToStyle) {
  32. const shape = shapes[id]
  33. getShapeUtils(shape).applyStyles(shape, styles)
  34. }
  35. },
  36. undo(data) {
  37. const { shapes } = getPage(data, currentPageId)
  38. for (const { id, style } of shapesToStyle) {
  39. const shape = shapes[id]
  40. getShapeUtils(shape).applyStyles(shape, style)
  41. }
  42. },
  43. })
  44. )
  45. }