@pie-element/extended-text-entry 6.8.4-annotations.0 → 6.8.5

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 (41) hide show
  1. package/CHANGELOG.md +61 -0
  2. package/LICENSE.md +5 -0
  3. package/configure/CHANGELOG.md +51 -0
  4. package/configure/lib/defaults.js +6 -0
  5. package/configure/lib/defaults.js.map +1 -1
  6. package/configure/lib/main.js +11 -5
  7. package/configure/lib/main.js.map +1 -1
  8. package/configure/package.json +3 -3
  9. package/controller/CHANGELOG.md +16 -0
  10. package/controller/lib/defaults.js +1 -66
  11. package/controller/lib/defaults.js.map +1 -1
  12. package/controller/lib/index.js +3 -8
  13. package/controller/lib/index.js.map +1 -1
  14. package/controller/package.json +1 -1
  15. package/docs/config-schema.json +16 -0
  16. package/docs/config-schema.json.md +12 -0
  17. package/docs/demo/generate.js +2 -1
  18. package/docs/pie-schema.json +7 -66
  19. package/docs/pie-schema.json.md +5 -47
  20. package/lib/index.js +4 -27
  21. package/lib/index.js.map +1 -1
  22. package/lib/main.js +18 -45
  23. package/lib/main.js.map +1 -1
  24. package/module/configure.js +395 -0
  25. package/module/controller.js +98 -0
  26. package/module/demo.js +38 -0
  27. package/module/element.js +277 -0
  28. package/module/index.html +21 -0
  29. package/module/manifest.json +18 -0
  30. package/module/print-demo.js +76 -0
  31. package/module/print.html +18 -0
  32. package/module/print.js +242 -0
  33. package/package.json +5 -5
  34. package/lib/annotation/annotation-editor.js +0 -703
  35. package/lib/annotation/annotation-editor.js.map +0 -1
  36. package/lib/annotation/annotation-menu.js +0 -205
  37. package/lib/annotation/annotation-menu.js.map +0 -1
  38. package/lib/annotation/annotation-utils.js +0 -249
  39. package/lib/annotation/annotation-utils.js.map +0 -1
  40. package/lib/annotation/freeform-editor.js +0 -265
  41. package/lib/annotation/freeform-editor.js.map +0 -1
@@ -1,265 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports["default"] = void 0;
9
-
10
- var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
11
-
12
- var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
13
-
14
- var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
15
-
16
- var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
17
-
18
- var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
19
-
20
- var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
21
-
22
- var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
23
-
24
- var _react = _interopRequireDefault(require("react"));
25
-
26
- var _classnames = _interopRequireDefault(require("classnames"));
27
-
28
- var _propTypes = _interopRequireDefault(require("prop-types"));
29
-
30
- var _core = require("@material-ui/core");
31
-
32
- var _styles = require("@material-ui/core/styles");
33
-
34
- function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
35
-
36
- function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
37
-
38
- var styles = {
39
- wrapper: {
40
- width: '200px',
41
- overflow: 'hidden',
42
- borderRadius: '4px',
43
- backgroundColor: '#ffffff',
44
- border: '4px solid #d3d3d3',
45
- '&.negative': {
46
- borderColor: 'rgb(255, 204, 238) !important'
47
- },
48
- '&.positive': {
49
- borderColor: 'rgb(153, 255, 153) !important'
50
- }
51
- },
52
- holder: {
53
- display: 'flex',
54
- flexWrap: 'wrap',
55
- borderTop: '2px solid #d3d3d3'
56
- },
57
- positive: {
58
- backgroundColor: 'rgb(153, 255, 153) !important',
59
- '&:hover': {
60
- filter: 'brightness(85%)'
61
- }
62
- },
63
- negative: {
64
- backgroundColor: 'rgb(255, 204, 238) !important',
65
- '&:hover': {
66
- filter: 'brightness(85%)'
67
- }
68
- },
69
- button: {
70
- flexGrow: 1,
71
- width: '28%',
72
- textAlign: 'center',
73
- padding: '4px',
74
- cursor: 'pointer',
75
- '&:not(:nth-child(3n))': {
76
- borderRight: '1px solid #d3d3d3'
77
- },
78
- '&:hover': {
79
- backgroundColor: '#d3d3d3'
80
- },
81
- '&.negative:hover': {
82
- backgroundColor: 'rgb(153, 255, 153) !important'
83
- },
84
- '&.positive:hover': {
85
- backgroundColor: 'rgb(255, 204, 238) !important'
86
- }
87
- },
88
- arrow: {
89
- overflowX: 'unset',
90
- overflowY: 'unset',
91
- marginLeft: '16px',
92
- '&::before': {
93
- position: 'absolute',
94
- right: '100%',
95
- top: '13px',
96
- border: 'solid transparent',
97
- content: '""',
98
- height: 0,
99
- width: 0,
100
- pointerEvents: 'none',
101
- borderWidth: '7px',
102
- borderRightColor: '#d3d3d3'
103
- },
104
- '&.negative::before': {
105
- borderRightColor: 'rgb(255, 204, 238) !important'
106
- },
107
- '&.positive::before': {
108
- borderRightColor: 'rgb(153, 255, 153) !important'
109
- }
110
- }
111
- };
112
-
113
- var FreeformEditor = /*#__PURE__*/function (_React$Component) {
114
- (0, _inherits2["default"])(FreeformEditor, _React$Component);
115
-
116
- var _super = _createSuper(FreeformEditor);
117
-
118
- function FreeformEditor(props) {
119
- var _this;
120
-
121
- (0, _classCallCheck2["default"])(this, FreeformEditor);
122
- _this = _super.call(this, props);
123
- (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onValueChange", function (event) {
124
- return _this.setState({
125
- value: event.target.value
126
- });
127
- });
128
- (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleSave", function () {
129
- var _this$props = _this.props,
130
- oldValue = _this$props.value,
131
- onSave = _this$props.onSave,
132
- onClose = _this$props.onClose,
133
- onDelete = _this$props.onDelete;
134
- var value = _this.state.value;
135
-
136
- if (value === '') {
137
- onDelete();
138
- }
139
-
140
- if (oldValue !== value) {
141
- onSave(oldValue, value);
142
- }
143
-
144
- _this.setState({
145
- value: ''
146
- });
147
-
148
- onClose();
149
- });
150
- (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleTypeChange", function () {
151
- var _this$props2 = _this.props,
152
- onTypeChange = _this$props2.onTypeChange,
153
- onDelete = _this$props2.onDelete;
154
- var value = _this.state.value;
155
-
156
- if (value === '') {
157
- onDelete();
158
- } else {
159
- onTypeChange(value);
160
- }
161
-
162
- _this.setState({
163
- value: ''
164
- });
165
- });
166
- _this.state = {
167
- value: props.value
168
- };
169
- return _this;
170
- }
171
-
172
- (0, _createClass2["default"])(FreeformEditor, [{
173
- key: "UNSAFE_componentWillReceiveProps",
174
- value: function UNSAFE_componentWillReceiveProps(nextProps) {
175
- var value = nextProps.value;
176
- var propsValue = this.props.value;
177
-
178
- if (value !== propsValue) {
179
- this.setState({
180
- value: value
181
- });
182
- }
183
- }
184
- }, {
185
- key: "render",
186
- value: function render() {
187
- var _this$props3 = this.props,
188
- anchorEl = _this$props3.anchorEl,
189
- classes = _this$props3.classes,
190
- offset = _this$props3.offset,
191
- onDelete = _this$props3.onDelete,
192
- open = _this$props3.open,
193
- type = _this$props3.type;
194
- var value = this.state.value;
195
- return /*#__PURE__*/_react["default"].createElement(_core.Popover, {
196
- anchorEl: anchorEl,
197
- elevation: 2,
198
- open: open,
199
- onClose: this.handleSave,
200
- classes: {
201
- paper: (0, _classnames["default"])(classes.arrow, type)
202
- },
203
- style: {
204
- marginTop: "".concat(offset, "px"),
205
- transition: 'margin-top 2s ease-out'
206
- },
207
- anchorOrigin: {
208
- vertical: 'top',
209
- horizontal: 'right'
210
- },
211
- transformOrigin: {
212
- vertical: 'top',
213
- horizontal: 'left'
214
- }
215
- }, /*#__PURE__*/_react["default"].createElement("div", {
216
- className: (0, _classnames["default"])(classes.wrapper, type)
217
- }, /*#__PURE__*/_react["default"].createElement(_core.TextField, {
218
- id: "annotation-editor",
219
- style: {
220
- padding: '2px 5px',
221
- width: '95%'
222
- },
223
- autoFocus: true,
224
- multiline: true,
225
- rows: 1,
226
- rowsMax: 4,
227
- value: value,
228
- onChange: this.onValueChange,
229
- InputProps: {
230
- disableUnderline: true
231
- }
232
- }), /*#__PURE__*/_react["default"].createElement("div", {
233
- className: classes.holder
234
- }, /*#__PURE__*/_react["default"].createElement("div", {
235
- className: classes.button,
236
- onClick: onDelete
237
- }, "Delete"), /*#__PURE__*/_react["default"].createElement("div", {
238
- className: (0, _classnames["default"])(classes.button, type),
239
- onClick: this.handleTypeChange
240
- }, type === 'negative' ? 'Green' : 'Pink'), /*#__PURE__*/_react["default"].createElement("div", {
241
- className: classes.button,
242
- onClick: this.handleSave
243
- }, "Save"))));
244
- }
245
- }]);
246
- return FreeformEditor;
247
- }(_react["default"].Component);
248
-
249
- (0, _defineProperty2["default"])(FreeformEditor, "propTypes", {
250
- anchorEl: _propTypes["default"].object,
251
- open: _propTypes["default"].bool,
252
- offset: _propTypes["default"].number,
253
- value: _propTypes["default"].string,
254
- type: _propTypes["default"].string,
255
- onClose: _propTypes["default"].func,
256
- onDelete: _propTypes["default"].func,
257
- onSave: _propTypes["default"].func,
258
- onTypeChange: _propTypes["default"].func
259
- });
260
- ;
261
-
262
- var _default = (0, _styles.withStyles)(styles)(FreeformEditor);
263
-
264
- exports["default"] = _default;
265
- //# sourceMappingURL=freeform-editor.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../src/annotation/freeform-editor.jsx"],"names":["styles","wrapper","width","overflow","borderRadius","backgroundColor","border","borderColor","holder","display","flexWrap","borderTop","positive","filter","negative","button","flexGrow","textAlign","padding","cursor","borderRight","arrow","overflowX","overflowY","marginLeft","position","right","top","content","height","pointerEvents","borderWidth","borderRightColor","FreeformEditor","props","event","setState","value","target","oldValue","onSave","onClose","onDelete","state","onTypeChange","nextProps","propsValue","anchorEl","classes","offset","open","type","handleSave","paper","marginTop","transition","vertical","horizontal","onValueChange","disableUnderline","handleTypeChange","React","Component","PropTypes","object","bool","number","string","func"],"mappings":"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","sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\nimport PropTypes from 'prop-types';\nimport { Popover, TextField } from '@material-ui/core';\nimport { withStyles } from '@material-ui/core/styles';\n\nconst styles = {\n wrapper: {\n width: '200px',\n overflow: 'hidden',\n borderRadius: '4px',\n backgroundColor: '#ffffff',\n border: '4px solid #d3d3d3',\n '&.negative': {\n borderColor: 'rgb(255, 204, 238) !important'\n },\n '&.positive': {\n borderColor: 'rgb(153, 255, 153) !important'\n }\n },\n holder: {\n display: 'flex',\n flexWrap: 'wrap',\n borderTop: '2px solid #d3d3d3'\n },\n positive: {\n backgroundColor: 'rgb(153, 255, 153) !important',\n '&:hover': {\n filter: 'brightness(85%)'\n }\n },\n negative: {\n backgroundColor: 'rgb(255, 204, 238) !important',\n '&:hover': {\n filter: 'brightness(85%)'\n }\n },\n button: {\n flexGrow: 1,\n width: '28%',\n textAlign: 'center',\n padding: '4px',\n cursor: 'pointer',\n '&:not(:nth-child(3n))': {\n borderRight: '1px solid #d3d3d3',\n },\n '&:hover': {\n backgroundColor: '#d3d3d3'\n },\n '&.negative:hover': {\n backgroundColor: 'rgb(153, 255, 153) !important',\n },\n '&.positive:hover': {\n backgroundColor: 'rgb(255, 204, 238) !important',\n }\n },\n arrow: {\n overflowX: 'unset',\n overflowY: 'unset',\n marginLeft: '16px',\n '&::before': {\n position: 'absolute',\n right: '100%',\n top: '13px',\n border: 'solid transparent',\n content: '\"\"',\n height: 0,\n width: 0,\n pointerEvents: 'none',\n borderWidth: '7px',\n borderRightColor: '#d3d3d3'\n },\n '&.negative::before': {\n borderRightColor: 'rgb(255, 204, 238) !important'\n },\n '&.positive::before': {\n borderRightColor: 'rgb(153, 255, 153) !important'\n }\n }\n};\n\nclass FreeformEditor extends React.Component {\n static propTypes = {\n anchorEl: PropTypes.object,\n open: PropTypes.bool,\n offset: PropTypes.number,\n value: PropTypes.string,\n type: PropTypes.string,\n onClose: PropTypes.func,\n onDelete: PropTypes.func,\n onSave: PropTypes.func,\n onTypeChange: PropTypes.func,\n };\n\n constructor(props) {\n super(props);\n this.state = { value: props.value };\n };\n\n UNSAFE_componentWillReceiveProps(nextProps) {\n const { value } = nextProps;\n const { value: propsValue } = this.props;\n\n if (value !== propsValue) {\n this.setState({ value });\n }\n };\n\n onValueChange = event => this.setState({ value: event.target.value });\n\n handleSave = () => {\n const { value: oldValue, onSave, onClose, onDelete } = this.props;\n const { value } = this.state;\n\n if (value === '') {\n onDelete();\n }\n\n if (oldValue !== value) {\n onSave(oldValue, value);\n }\n\n this.setState({ value: '' });\n onClose();\n };\n\n handleTypeChange = () => {\n const { onTypeChange, onDelete } = this.props;\n const { value } = this.state;\n\n if (value === '') {\n onDelete();\n } else {\n onTypeChange(value);\n }\n\n this.setState({ value: '' });\n };\n\n render() {\n const { anchorEl, classes, offset, onDelete, open, type } = this.props;\n const { value } = this.state;\n\n return (\n <Popover\n anchorEl={anchorEl}\n elevation={2}\n open={open}\n onClose={this.handleSave}\n classes={{ paper: classNames(classes.arrow, type) }}\n style={{ marginTop: `${offset}px`, transition: 'margin-top 2s ease-out' }}\n anchorOrigin={{\n vertical: 'top',\n horizontal: 'right',\n }}\n transformOrigin={{\n vertical: 'top',\n horizontal: 'left',\n }}\n >\n <div className={classNames(classes.wrapper, type)}>\n <TextField\n id=\"annotation-editor\"\n style={{\n padding: '2px 5px',\n width: '95%'\n }}\n autoFocus\n multiline\n rows={1}\n rowsMax={4}\n value={value}\n onChange={this.onValueChange}\n InputProps={{ disableUnderline: true }}\n />\n <div className={classes.holder}>\n <div className={classes.button} onClick={onDelete}>\n Delete\n </div>\n <div className={classNames(classes.button, type)} onClick={this.handleTypeChange} >\n { type === 'negative' ? 'Green' : 'Pink' }\n </div>\n <div className={classes.button} onClick={this.handleSave} >\n Save\n </div>\n </div>\n </div>\n </Popover>\n );\n }\n};\n\nexport default withStyles(styles)(FreeformEditor);\n"],"file":"freeform-editor.js"}