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

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