abstract-image 3.3.2 → 3.3.3

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 (106) hide show
  1. package/CHANGELOG.md +44 -38
  2. package/LICENSE +21 -21
  3. package/README.md +73 -73
  4. package/lib/exporters/__tests__/dxf2d-export-image/test-defs/dxf2d-ellipse.js +379 -379
  5. package/lib/exporters/__tests__/dxf2d-export-image/test-defs/dxf2d-group.js +123 -123
  6. package/lib/exporters/__tests__/dxf2d-export-image/test-defs/dxf2d-line.js +55 -55
  7. package/lib/exporters/__tests__/dxf2d-export-image/test-defs/dxf2d-polygon.js +89 -89
  8. package/lib/exporters/__tests__/dxf2d-export-image/test-defs/dxf2d-polyline.js +79 -79
  9. package/lib/exporters/__tests__/dxf2d-export-image/test-defs/dxf2d-rectangle.js +99 -99
  10. package/lib/exporters/__tests__/dxf2d-export-image/test-defs/dxf2d-text-growth-directions.js +135 -135
  11. package/lib/exporters/__tests__/dxf2d-export-image/test-defs/dxf2d-text.js +63 -63
  12. package/lib/exporters/__tests__/eps-export-image/test-defs/eps-ellipse.js +24 -24
  13. package/lib/exporters/__tests__/eps-export-image/test-defs/eps-empty-text.js +26 -26
  14. package/lib/exporters/__tests__/eps-export-image/test-defs/eps-group.js +31 -31
  15. package/lib/exporters/__tests__/eps-export-image/test-defs/eps-line.js +20 -20
  16. package/lib/exporters/__tests__/eps-export-image/test-defs/eps-polygon.js +34 -34
  17. package/lib/exporters/__tests__/eps-export-image/test-defs/eps-polyline.js +26 -26
  18. package/lib/exporters/__tests__/eps-export-image/test-defs/eps-rectangle.js +20 -20
  19. package/lib/exporters/__tests__/eps-export-image/test-defs/eps-text-growth-directions.js +59 -59
  20. package/lib/exporters/__tests__/eps-export-image/test-defs/eps-text.js +26 -26
  21. package/package.json +4 -2
  22. package/src/__stories__/react-svg-export/example-1.stories.tsx +54 -54
  23. package/src/__stories__/svg-export/example-1.stories.tsx +42 -42
  24. package/src/exporters/__tests__/dxf2d-export-image/export-test-def.ts +11 -11
  25. package/src/exporters/__tests__/dxf2d-export-image/export.test.tsx +13 -13
  26. package/src/exporters/__tests__/dxf2d-export-image/test-defs/dxf2d-ellipse.ts +405 -405
  27. package/src/exporters/__tests__/dxf2d-export-image/test-defs/dxf2d-group.ts +166 -166
  28. package/src/exporters/__tests__/dxf2d-export-image/test-defs/dxf2d-line.ts +80 -80
  29. package/src/exporters/__tests__/dxf2d-export-image/test-defs/dxf2d-polygon.ts +114 -114
  30. package/src/exporters/__tests__/dxf2d-export-image/test-defs/dxf2d-polyline.ts +103 -103
  31. package/src/exporters/__tests__/dxf2d-export-image/test-defs/dxf2d-rectangle.ts +125 -125
  32. package/src/exporters/__tests__/dxf2d-export-image/test-defs/dxf2d-text-growth-directions.ts +214 -214
  33. package/src/exporters/__tests__/dxf2d-export-image/test-defs/dxf2d-text.ts +97 -97
  34. package/src/exporters/__tests__/eps-export-image/export-test-def.ts +11 -11
  35. package/src/exporters/__tests__/eps-export-image/export.test.tsx +13 -13
  36. package/src/exporters/__tests__/eps-export-image/test-defs/eps-ellipse.ts +50 -50
  37. package/src/exporters/__tests__/eps-export-image/test-defs/eps-empty-text.ts +60 -60
  38. package/src/exporters/__tests__/eps-export-image/test-defs/eps-group.ts +74 -74
  39. package/src/exporters/__tests__/eps-export-image/test-defs/eps-line.ts +45 -45
  40. package/src/exporters/__tests__/eps-export-image/test-defs/eps-polygon.ts +65 -65
  41. package/src/exporters/__tests__/eps-export-image/test-defs/eps-polyline.ts +58 -58
  42. package/src/exporters/__tests__/eps-export-image/test-defs/eps-rectangle.ts +46 -46
  43. package/src/exporters/__tests__/eps-export-image/test-defs/eps-text-growth-directions.ts +138 -138
  44. package/src/exporters/__tests__/eps-export-image/test-defs/eps-text.ts +60 -60
  45. package/src/exporters/__tests__/exception/png-unsupported.test.tsx +25 -25
  46. package/src/exporters/__tests__/exception/react-svg-direction-exception.test.tsx +65 -65
  47. package/src/exporters/__tests__/exception/svg-direction-exception.test.tsx +65 -65
  48. package/src/exporters/__tests__/png-export-image/export-test-def.ts +11 -11
  49. package/src/exporters/__tests__/png-export-image/export.test.tsx +13 -13
  50. package/src/exporters/__tests__/png-export-image/test-defs/png-createPNG.tsx +26 -26
  51. package/src/exporters/__tests__/react-svg-export-image/export-test-def.tsx +13 -13
  52. package/src/exporters/__tests__/react-svg-export-image/export.test.tsx +13 -13
  53. package/src/exporters/__tests__/react-svg-export-image/test-defs/react-svg-binary-png.tsx +26 -26
  54. package/src/exporters/__tests__/react-svg-export-image/test-defs/react-svg-binary-url.tsx +26 -26
  55. package/src/exporters/__tests__/react-svg-export-image/test-defs/react-svg-binary.tsx +25 -25
  56. package/src/exporters/__tests__/react-svg-export-image/test-defs/react-svg-callback.tsx +60 -60
  57. package/src/exporters/__tests__/react-svg-export-image/test-defs/react-svg-ellipse.tsx +28 -28
  58. package/src/exporters/__tests__/react-svg-export-image/test-defs/react-svg-empty-text.tsx +35 -35
  59. package/src/exporters/__tests__/react-svg-export-image/test-defs/react-svg-group.tsx +44 -44
  60. package/src/exporters/__tests__/react-svg-export-image/test-defs/react-svg-line.tsx +26 -26
  61. package/src/exporters/__tests__/react-svg-export-image/test-defs/react-svg-polygon.tsx +32 -32
  62. package/src/exporters/__tests__/react-svg-export-image/test-defs/react-svg-polyline.tsx +33 -33
  63. package/src/exporters/__tests__/react-svg-export-image/test-defs/react-svg-rectangle.tsx +27 -27
  64. package/src/exporters/__tests__/react-svg-export-image/test-defs/react-svg-subimage.tsx +36 -36
  65. package/src/exporters/__tests__/react-svg-export-image/test-defs/react-svg-text-bold.tsx +50 -50
  66. package/src/exporters/__tests__/react-svg-export-image/test-defs/react-svg-text-growth-directions.tsx +80 -80
  67. package/src/exporters/__tests__/react-svg-export-image/test-defs/react-svg-text-italic.tsx +65 -65
  68. package/src/exporters/__tests__/react-svg-export-image/test-defs/react-svg-text-sub.tsx +35 -35
  69. package/src/exporters/__tests__/react-svg-export-image/test-defs/react-svg-text.tsx +35 -35
  70. package/src/exporters/__tests__/svg-export-image/export-test-def.ts +11 -11
  71. package/src/exporters/__tests__/svg-export-image/export.test.tsx +13 -13
  72. package/src/exporters/__tests__/svg-export-image/test-defs/svg-binary.tsx +25 -25
  73. package/src/exporters/__tests__/svg-export-image/test-defs/svg-ellipse.ts +27 -27
  74. package/src/exporters/__tests__/svg-export-image/test-defs/svg-empty-text.ts +34 -34
  75. package/src/exporters/__tests__/svg-export-image/test-defs/svg-group.ts +44 -44
  76. package/src/exporters/__tests__/svg-export-image/test-defs/svg-line.ts +26 -26
  77. package/src/exporters/__tests__/svg-export-image/test-defs/svg-polygon.ts +32 -32
  78. package/src/exporters/__tests__/svg-export-image/test-defs/svg-polyline.ts +33 -33
  79. package/src/exporters/__tests__/svg-export-image/test-defs/svg-rectangle.ts +27 -27
  80. package/src/exporters/__tests__/svg-export-image/test-defs/svg-text-bold.ts +50 -50
  81. package/src/exporters/__tests__/svg-export-image/test-defs/svg-text-growth-directions.ts +80 -80
  82. package/src/exporters/__tests__/svg-export-image/test-defs/svg-text-italic.ts +65 -65
  83. package/src/exporters/__tests__/svg-export-image/test-defs/svg-text.ts +35 -35
  84. package/src/exporters/dxf2d-export-image.ts +218 -218
  85. package/src/exporters/eps-export-image.ts +154 -154
  86. package/src/exporters/index.ts +3 -3
  87. package/src/exporters/png-export-image.ts +12 -12
  88. package/src/exporters/react-svg-export-image.tsx +315 -315
  89. package/src/exporters/svg-export-image.ts +309 -309
  90. package/src/index.ts +11 -11
  91. package/src/model/__tests__/color/export-test-def.ts +13 -13
  92. package/src/model/__tests__/color/export.test.tsx +14 -14
  93. package/src/model/__tests__/color/test-defs/color-from-string.ts +46 -46
  94. package/src/model/__tests__/color/test-defs/color-to-string.ts +35 -35
  95. package/src/model/__tests__/color/test-defs/color-undefined-2.ts +8 -8
  96. package/src/model/__tests__/color/test-defs/color-undefined.ts +8 -8
  97. package/src/model/abstract-image.ts +25 -25
  98. package/src/model/color.ts +52 -52
  99. package/src/model/component.ts +279 -279
  100. package/src/model/index.ts +5 -5
  101. package/src/model/point.ts +11 -11
  102. package/src/model/size.ts +11 -11
  103. package/lib/exporters/__tests__/svg-export-image.test.d.ts +0 -2
  104. package/lib/exporters/__tests__/svg-export-image.test.d.ts.map +0 -1
  105. package/lib/exporters/__tests__/svg-export-image.test.js +0 -35
  106. package/lib/exporters/__tests__/svg-export-image.test.js.map +0 -1
@@ -1,154 +1,154 @@
1
- import * as AI from "../model/index";
2
- import * as R from "ramda";
3
-
4
- export function epsExportImage(root: AI.AbstractImage): string {
5
- return [
6
- "%!PS-Adobe-3.0 EPSF-3.0",
7
- `%%BoundingBox: 0 0 ${root.size.width} ${root.size.height}`,
8
- "/ellipse {7 dict begin",
9
- "/endangle exch def",
10
- "/startangle exch def",
11
- "/yradius exch def",
12
- "/xradius exch def",
13
- "/yC exch def",
14
- "/xC exch def",
15
- "/savematrix matrix currentmatrix def",
16
- "xC yC translate",
17
- "xradius yradius scale",
18
- "0 0 1 startangle endangle arc",
19
- "savematrix setmatrix",
20
- "end",
21
- "} def",
22
- ...R.unnest<string>(
23
- root.components.map(c => epsExportComponent(c, root.size.height))
24
- )
25
- ].join("\n");
26
- }
27
-
28
- function epsExportComponent(c: AI.Component, height: number): Array<string> {
29
- switch (c.type) {
30
- case "ellipse": {
31
- const cx = (c.topLeft.x + c.bottomRight.x) * 0.5;
32
- const cy = height - (c.topLeft.y + c.bottomRight.y) * 0.5;
33
- const rx = 0.5 * (c.bottomRight.x - c.topLeft.x);
34
- const ry = 0.5 * (c.bottomRight.y - c.topLeft.y);
35
- return [
36
- ...getColored(c.fillColor, [
37
- `${cx} ${cy} ${rx} ${ry} 0 360 ellipse`,
38
- "closepath",
39
- "fill"
40
- ]),
41
- ...getColored(c.strokeColor, [
42
- `${cx} ${cy} ${rx} ${ry} 0 360 ellipse`,
43
- "closepath",
44
- `${c.strokeThickness} setlinewidth`,
45
- "stroke"
46
- ])
47
- ];
48
- }
49
- case "group": {
50
- return R.unnest<string>(
51
- c.children.map(cc => epsExportComponent(cc, height))
52
- );
53
- }
54
- case "line": {
55
- return getColored(c.strokeColor, [
56
- `${c.start.x} ${height - c.start.y} moveto`,
57
- `${c.end.x} ${height - c.end.y} lineto`,
58
- `${c.strokeThickness} setlinewidth`,
59
- "stroke"
60
- ]);
61
- }
62
- case "polygon": {
63
- return [
64
- ...getColored(c.fillColor, [
65
- `${c.points[0].x} ${height - c.points[0].y} moveto`,
66
- ...c.points.map(p => `${p.x} ${height - p.y} lineto`),
67
- "closepath",
68
- `${c.strokeThickness} setlinewidth`,
69
- "fill"
70
- ]),
71
- ...getColored(c.strokeColor, [
72
- `${c.points[0].x} ${height - c.points[0].y} moveto`,
73
- ...c.points.map(p => `${p.x} ${height - p.y} lineto`),
74
- "closepath",
75
- "stroke"
76
- ])
77
- ];
78
- }
79
- case "polyline": {
80
- return getColored(c.strokeColor, [
81
- `${c.points[0].x} ${height - c.points[0].y} moveto`,
82
- ...c.points.map(p => `${p.x} ${height - p.y} lineto`),
83
- `${c.strokeThickness} setlinewidth`,
84
- "stroke"
85
- ]);
86
- }
87
- case "rectangle": {
88
- const w = c.bottomRight.x - c.topLeft.x;
89
- const h = c.bottomRight.y - c.topLeft.y;
90
- return [
91
- ...getColored(c.fillColor, [
92
- `${c.topLeft.x} ${height - c.bottomRight.y} ${w} ${h} rectfill`
93
- ]),
94
- ...getColored(c.strokeColor, [
95
- `${c.strokeThickness} setlinewidth`,
96
- `${c.topLeft.x} ${height - c.bottomRight.y} ${w} ${h} rectstroke`
97
- ])
98
- ];
99
- }
100
- case "text": {
101
- return getColored(c.textColor, [
102
- `gsave`,
103
- `/${c.fontFamily} findfont`,
104
- `${c.fontSize} scalefont setfont`,
105
- `${c.position.x} ${height - c.position.y} moveto`,
106
- getTextXOffset(c),
107
- getTextYOffset(c),
108
- `rmoveto`,
109
- `${-c.clockwiseRotationDegrees} rotate`,
110
- `(${c.text}) show`,
111
- `grestore`
112
- ]);
113
- }
114
- default:
115
- return [];
116
- }
117
- }
118
-
119
- function getTextXOffset(c: AI.Text): string {
120
- if (c.horizontalGrowthDirection === "left") {
121
- return `(${c.text}) stringwidth pop neg`;
122
- } else if (c.horizontalGrowthDirection === "uniform") {
123
- return `(${c.text}) stringwidth pop neg 0.5 mul`;
124
- } else {
125
- return `0`;
126
- }
127
- }
128
-
129
- function getTextYOffset(c: AI.Text): string {
130
- if (c.verticalGrowthDirection === "down") {
131
- return `gsave (${
132
- c.text
133
- }) true charpath pathbbox exch pop 3 -1 roll pop sub grestore`;
134
- } else if (c.verticalGrowthDirection === "uniform") {
135
- return `gsave (${
136
- c.text
137
- }) true charpath pathbbox exch pop 3 -1 roll pop sub 0.5 mul grestore`;
138
- } else {
139
- return `0`;
140
- }
141
- }
142
-
143
- function getColored(
144
- color: AI.Color,
145
- instructions: Array<string>
146
- ): Array<string> {
147
- if (color.a === 0) {
148
- return [];
149
- }
150
- return [
151
- `${color.r / 255} ${color.g / 255} ${color.b / 255} setrgbcolor`,
152
- ...instructions
153
- ];
154
- }
1
+ import * as AI from "../model/index";
2
+ import * as R from "ramda";
3
+
4
+ export function epsExportImage(root: AI.AbstractImage): string {
5
+ return [
6
+ "%!PS-Adobe-3.0 EPSF-3.0",
7
+ `%%BoundingBox: 0 0 ${root.size.width} ${root.size.height}`,
8
+ "/ellipse {7 dict begin",
9
+ "/endangle exch def",
10
+ "/startangle exch def",
11
+ "/yradius exch def",
12
+ "/xradius exch def",
13
+ "/yC exch def",
14
+ "/xC exch def",
15
+ "/savematrix matrix currentmatrix def",
16
+ "xC yC translate",
17
+ "xradius yradius scale",
18
+ "0 0 1 startangle endangle arc",
19
+ "savematrix setmatrix",
20
+ "end",
21
+ "} def",
22
+ ...R.unnest<string>(
23
+ root.components.map(c => epsExportComponent(c, root.size.height))
24
+ )
25
+ ].join("\n");
26
+ }
27
+
28
+ function epsExportComponent(c: AI.Component, height: number): Array<string> {
29
+ switch (c.type) {
30
+ case "ellipse": {
31
+ const cx = (c.topLeft.x + c.bottomRight.x) * 0.5;
32
+ const cy = height - (c.topLeft.y + c.bottomRight.y) * 0.5;
33
+ const rx = 0.5 * (c.bottomRight.x - c.topLeft.x);
34
+ const ry = 0.5 * (c.bottomRight.y - c.topLeft.y);
35
+ return [
36
+ ...getColored(c.fillColor, [
37
+ `${cx} ${cy} ${rx} ${ry} 0 360 ellipse`,
38
+ "closepath",
39
+ "fill"
40
+ ]),
41
+ ...getColored(c.strokeColor, [
42
+ `${cx} ${cy} ${rx} ${ry} 0 360 ellipse`,
43
+ "closepath",
44
+ `${c.strokeThickness} setlinewidth`,
45
+ "stroke"
46
+ ])
47
+ ];
48
+ }
49
+ case "group": {
50
+ return R.unnest<string>(
51
+ c.children.map(cc => epsExportComponent(cc, height))
52
+ );
53
+ }
54
+ case "line": {
55
+ return getColored(c.strokeColor, [
56
+ `${c.start.x} ${height - c.start.y} moveto`,
57
+ `${c.end.x} ${height - c.end.y} lineto`,
58
+ `${c.strokeThickness} setlinewidth`,
59
+ "stroke"
60
+ ]);
61
+ }
62
+ case "polygon": {
63
+ return [
64
+ ...getColored(c.fillColor, [
65
+ `${c.points[0].x} ${height - c.points[0].y} moveto`,
66
+ ...c.points.map(p => `${p.x} ${height - p.y} lineto`),
67
+ "closepath",
68
+ `${c.strokeThickness} setlinewidth`,
69
+ "fill"
70
+ ]),
71
+ ...getColored(c.strokeColor, [
72
+ `${c.points[0].x} ${height - c.points[0].y} moveto`,
73
+ ...c.points.map(p => `${p.x} ${height - p.y} lineto`),
74
+ "closepath",
75
+ "stroke"
76
+ ])
77
+ ];
78
+ }
79
+ case "polyline": {
80
+ return getColored(c.strokeColor, [
81
+ `${c.points[0].x} ${height - c.points[0].y} moveto`,
82
+ ...c.points.map(p => `${p.x} ${height - p.y} lineto`),
83
+ `${c.strokeThickness} setlinewidth`,
84
+ "stroke"
85
+ ]);
86
+ }
87
+ case "rectangle": {
88
+ const w = c.bottomRight.x - c.topLeft.x;
89
+ const h = c.bottomRight.y - c.topLeft.y;
90
+ return [
91
+ ...getColored(c.fillColor, [
92
+ `${c.topLeft.x} ${height - c.bottomRight.y} ${w} ${h} rectfill`
93
+ ]),
94
+ ...getColored(c.strokeColor, [
95
+ `${c.strokeThickness} setlinewidth`,
96
+ `${c.topLeft.x} ${height - c.bottomRight.y} ${w} ${h} rectstroke`
97
+ ])
98
+ ];
99
+ }
100
+ case "text": {
101
+ return getColored(c.textColor, [
102
+ `gsave`,
103
+ `/${c.fontFamily} findfont`,
104
+ `${c.fontSize} scalefont setfont`,
105
+ `${c.position.x} ${height - c.position.y} moveto`,
106
+ getTextXOffset(c),
107
+ getTextYOffset(c),
108
+ `rmoveto`,
109
+ `${-c.clockwiseRotationDegrees} rotate`,
110
+ `(${c.text}) show`,
111
+ `grestore`
112
+ ]);
113
+ }
114
+ default:
115
+ return [];
116
+ }
117
+ }
118
+
119
+ function getTextXOffset(c: AI.Text): string {
120
+ if (c.horizontalGrowthDirection === "left") {
121
+ return `(${c.text}) stringwidth pop neg`;
122
+ } else if (c.horizontalGrowthDirection === "uniform") {
123
+ return `(${c.text}) stringwidth pop neg 0.5 mul`;
124
+ } else {
125
+ return `0`;
126
+ }
127
+ }
128
+
129
+ function getTextYOffset(c: AI.Text): string {
130
+ if (c.verticalGrowthDirection === "down") {
131
+ return `gsave (${
132
+ c.text
133
+ }) true charpath pathbbox exch pop 3 -1 roll pop sub grestore`;
134
+ } else if (c.verticalGrowthDirection === "uniform") {
135
+ return `gsave (${
136
+ c.text
137
+ }) true charpath pathbbox exch pop 3 -1 roll pop sub 0.5 mul grestore`;
138
+ } else {
139
+ return `0`;
140
+ }
141
+ }
142
+
143
+ function getColored(
144
+ color: AI.Color,
145
+ instructions: Array<string>
146
+ ): Array<string> {
147
+ if (color.a === 0) {
148
+ return [];
149
+ }
150
+ return [
151
+ `${color.r / 255} ${color.g / 255} ${color.b / 255} setrgbcolor`,
152
+ ...instructions
153
+ ];
154
+ }
@@ -1,3 +1,3 @@
1
- export * from "./svg-export-image";
2
- export * from "./png-export-image";
3
- export * from "./dxf2d-export-image";
1
+ export * from "./svg-export-image";
2
+ export * from "./png-export-image";
3
+ export * from "./dxf2d-export-image";
@@ -1,12 +1,12 @@
1
- import * as AbstractImage from "../model/index";
2
-
3
- export function createPNG(image: AbstractImage.AbstractImage): Uint8Array {
4
- if (image.components.length !== 1) {
5
- throw new Error("Not supported!");
6
- }
7
- const component = image.components[0];
8
- if (component.type === "binaryimage" && component.format === "png" && component.data.type === "bytes") {
9
- return component.data.bytes;
10
- }
11
- throw new Error("Not supported!");
12
- }
1
+ import * as AbstractImage from "../model/index";
2
+
3
+ export function createPNG(image: AbstractImage.AbstractImage): Uint8Array {
4
+ if (image.components.length !== 1) {
5
+ throw new Error("Not supported!");
6
+ }
7
+ const component = image.components[0];
8
+ if (component.type === "binaryimage" && component.format === "png" && component.data.type === "bytes") {
9
+ return component.data.bytes;
10
+ }
11
+ throw new Error("Not supported!");
12
+ }