@pie-lib/icons 4.0.2-next.1 → 4.0.3-next.0

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 (65) hide show
  1. package/dist/correct-icon.d.ts +78 -0
  2. package/dist/correct-icon.js +59 -0
  3. package/dist/correct-response-icon.d.ts +24 -0
  4. package/dist/correct-response-icon.js +96 -0
  5. package/dist/icon-base.d.ts +78 -0
  6. package/dist/icon-base.js +40 -0
  7. package/dist/icon-root.d.ts +71 -0
  8. package/dist/icon-root.js +57 -0
  9. package/dist/incorrect-icon.d.ts +78 -0
  10. package/dist/incorrect-icon.js +71 -0
  11. package/dist/index.d.ts +17 -0
  12. package/dist/index.js +9 -0
  13. package/dist/instructions-icon.d.ts +13 -0
  14. package/dist/instructions-icon.js +179 -0
  15. package/dist/learn-more-icon.d.ts +18 -0
  16. package/dist/learn-more-icon.js +82 -0
  17. package/dist/nothing-submitted-icon.d.ts +14 -0
  18. package/dist/nothing-submitted-icon.js +92 -0
  19. package/dist/partially-correct-icon.d.ts +78 -0
  20. package/dist/partially-correct-icon.js +64 -0
  21. package/dist/show-rationale-icon.d.ts +13 -0
  22. package/dist/show-rationale-icon.js +136 -0
  23. package/dist/sized.d.ts +22 -0
  24. package/dist/sized.js +19 -0
  25. package/package.json +25 -21
  26. package/CHANGELOG.json +0 -1
  27. package/CHANGELOG.md +0 -569
  28. package/LICENSE.md +0 -5
  29. package/lib/correct-icon.js +0 -79
  30. package/lib/correct-icon.js.map +0 -1
  31. package/lib/correct-response-icon.js +0 -125
  32. package/lib/correct-response-icon.js.map +0 -1
  33. package/lib/icon-base.js +0 -93
  34. package/lib/icon-base.js.map +0 -1
  35. package/lib/icon-root.js +0 -106
  36. package/lib/icon-root.js.map +0 -1
  37. package/lib/incorrect-icon.js +0 -88
  38. package/lib/incorrect-icon.js.map +0 -1
  39. package/lib/index.js +0 -63
  40. package/lib/index.js.map +0 -1
  41. package/lib/instructions-icon.js +0 -205
  42. package/lib/instructions-icon.js.map +0 -1
  43. package/lib/learn-more-icon.js +0 -104
  44. package/lib/learn-more-icon.js.map +0 -1
  45. package/lib/nothing-submitted-icon.js +0 -175
  46. package/lib/nothing-submitted-icon.js.map +0 -1
  47. package/lib/partially-correct-icon.js +0 -81
  48. package/lib/partially-correct-icon.js.map +0 -1
  49. package/lib/show-rationale-icon.js +0 -187
  50. package/lib/show-rationale-icon.js.map +0 -1
  51. package/lib/sized.js +0 -32
  52. package/lib/sized.js.map +0 -1
  53. package/src/__tests__/index.test.js +0 -305
  54. package/src/correct-icon.jsx +0 -54
  55. package/src/correct-response-icon.jsx +0 -106
  56. package/src/icon-base.jsx +0 -55
  57. package/src/icon-root.jsx +0 -53
  58. package/src/incorrect-icon.jsx +0 -67
  59. package/src/index.js +0 -19
  60. package/src/instructions-icon.jsx +0 -189
  61. package/src/learn-more-icon.jsx +0 -94
  62. package/src/nothing-submitted-icon.jsx +0 -136
  63. package/src/partially-correct-icon.jsx +0 -56
  64. package/src/show-rationale-icon.jsx +0 -145
  65. package/src/sized.jsx +0 -25
@@ -1,187 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports["default"] = exports.ShowRationale = void 0;
8
- var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
9
- var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
10
- var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
11
- var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
12
- var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
13
- var _propTypes = _interopRequireDefault(require("prop-types"));
14
- var _react = _interopRequireDefault(require("react"));
15
- var _sized = require("./sized");
16
- function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2["default"])(o), (0, _possibleConstructorReturn2["default"])(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2["default"])(t).constructor) : o.apply(t, e)); }
17
- function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
18
- // Info icon
19
- var Info = function Info(_ref) {
20
- var fill = _ref.fill;
21
- return /*#__PURE__*/_react["default"].createElement("g", null, /*#__PURE__*/_react["default"].createElement("rect", {
22
- x: "-115",
23
- y: "136.7",
24
- width: "3",
25
- height: "3",
26
- fill: fill
27
- }), /*#__PURE__*/_react["default"].createElement("polygon", {
28
- points: "-112,147.7 -112,141.7 -115.8,141.7 -115.8,143.7 -114,143.7 -114,147.7 -116.2,147.7 -116.2,149.7 -109.8,149.7 -109.8,147.7",
29
- fill: fill
30
- }));
31
- };
32
- Info.propTypes = {
33
- fill: _propTypes["default"].string.isRequired
34
- };
35
-
36
- // Border path
37
- var Border = function Border(_ref2) {
38
- var fill = _ref2.fill;
39
- return /*#__PURE__*/_react["default"].createElement("path", {
40
- d: "M-113,158.5c-8,0-14.5-6.5-14.5-14.5s6.5-14.5,14.5-14.5s14.5,6.5,14.5,14.5S-105,158.5-113,158.5z M-113,130.5c-7.4,0-13.5,6.1-13.5,13.5s6.1,13.5,13.5,13.5s13.5-6.1,13.5-13.5S-105.6,130.5-113,130.5z",
41
- fill: fill
42
- });
43
- };
44
- Border.propTypes = {
45
- fill: _propTypes["default"].string.isRequired
46
- };
47
-
48
- // Circle background
49
- var Circle = function Circle(_ref3) {
50
- var _ref3$fill = _ref3.fill,
51
- fill = _ref3$fill === void 0 ? '#FFFFFF' : _ref3$fill;
52
- return /*#__PURE__*/_react["default"].createElement("g", null, /*#__PURE__*/_react["default"].createElement("path", {
53
- style: {
54
- fill: '#D0CAC5',
55
- stroke: '#E6E3E0',
56
- strokeWidth: 0.75,
57
- strokeMiterlimit: 10
58
- },
59
- d: "M-111.7,160.9c-8.5,0-15.5-6.9-15.5-15.5c0-8.5,6.9-15.5,15.5-15.5s15.5,6.9,15.5,15.5C-96.2,154-103.1,160.9-111.7,160.9z"
60
- }), /*#__PURE__*/_react["default"].createElement("path", {
61
- style: {
62
- fill: '#B3ABA4',
63
- stroke: '#CDC7C2',
64
- strokeWidth: 0.5,
65
- strokeMiterlimit: 10
66
- },
67
- d: "M-112,159.5c-8,0-14.5-6.5-14.5-14.5s6.5-14.5,14.5-14.5s14.5,6.5,14.5,14.5S-104,159.5-112,159.5z"
68
- }), /*#__PURE__*/_react["default"].createElement("circle", {
69
- cx: "-113",
70
- cy: "144",
71
- r: "14",
72
- fill: fill
73
- }));
74
- };
75
- Circle.propTypes = {
76
- fill: _propTypes["default"].string
77
- };
78
-
79
- // Root wrapper for sizing
80
- var Root = function Root(_ref4) {
81
- var children = _ref4.children,
82
- size = _ref4.size;
83
- var normalizedSize = (0, _sized.normalizeSize)(size);
84
- var style = {
85
- height: normalizedSize,
86
- width: normalizedSize,
87
- display: 'inline-block',
88
- position: 'relative'
89
- };
90
- return /*#__PURE__*/_react["default"].createElement("div", {
91
- style: style
92
- }, /*#__PURE__*/_react["default"].createElement("svg", {
93
- preserveAspectRatio: "xMinYMin meet",
94
- viewBox: "-129 128 34 34"
95
- }, children));
96
- };
97
- Root.propTypes = {
98
- children: _propTypes["default"].oneOfType([_propTypes["default"].arrayOf(_propTypes["default"].node), _propTypes["default"].node]).isRequired,
99
- size: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number])
100
- };
101
-
102
- // Main ShowRationale component
103
- var ShowRationale = exports.ShowRationale = /*#__PURE__*/function (_React$Component) {
104
- function ShowRationale() {
105
- (0, _classCallCheck2["default"])(this, ShowRationale);
106
- return _callSuper(this, ShowRationale, arguments);
107
- }
108
- (0, _inherits2["default"])(ShowRationale, _React$Component);
109
- return (0, _createClass2["default"])(ShowRationale, [{
110
- key: "render",
111
- value: function render() {
112
- var _this$props = this.props,
113
- iconSet = _this$props.iconSet,
114
- open = _this$props.open,
115
- _this$props$fg = _this$props.fg,
116
- fg = _this$props$fg === void 0 ? '#1a9cff' : _this$props$fg,
117
- _this$props$bg = _this$props.bg,
118
- bg = _this$props$bg === void 0 ? '#bce2ff' : _this$props$bg,
119
- _this$props$border = _this$props.border,
120
- border = _this$props$border === void 0 ? '#bbe3fd' : _this$props$border;
121
- var info = /*#__PURE__*/_react["default"].createElement(Info, {
122
- fill: fg
123
- });
124
- var icons = {
125
- check: /*#__PURE__*/_react["default"].createElement(Root, {
126
- size: this.props.size
127
- }, /*#__PURE__*/_react["default"].createElement(Circle, null), info, /*#__PURE__*/_react["default"].createElement(Border, {
128
- fill: border
129
- })),
130
- emoji: /*#__PURE__*/_react["default"].createElement(Root, {
131
- size: this.props.size
132
- }, /*#__PURE__*/_react["default"].createElement(Circle, null), info, /*#__PURE__*/_react["default"].createElement(Border, {
133
- fill: border
134
- })),
135
- open: {
136
- check: /*#__PURE__*/_react["default"].createElement(Root, {
137
- size: this.props.size
138
- }, /*#__PURE__*/_react["default"].createElement("circle", {
139
- cx: "-113",
140
- cy: "144",
141
- r: "14",
142
- fill: "#FFFFFF"
143
- }), /*#__PURE__*/_react["default"].createElement(Info, {
144
- fill: bg
145
- }), /*#__PURE__*/_react["default"].createElement(Border, {
146
- fill: "#FFFFFF"
147
- })),
148
- emoji: /*#__PURE__*/_react["default"].createElement(Root, {
149
- size: this.props.size
150
- }, /*#__PURE__*/_react["default"].createElement("circle", {
151
- cx: "-113",
152
- cy: "144",
153
- r: "14",
154
- fill: "#FFFFFF"
155
- }), /*#__PURE__*/_react["default"].createElement(Info, {
156
- fill: bg
157
- }), /*#__PURE__*/_react["default"].createElement(Border, {
158
- fill: border
159
- }))
160
- }
161
- };
162
- if (open === true) {
163
- return icons.open[iconSet];
164
- } else {
165
- return icons[iconSet];
166
- }
167
- }
168
- }]);
169
- }(_react["default"].Component);
170
- ShowRationale.propTypes = {
171
- iconSet: _propTypes["default"].oneOf(['emoji', 'check']),
172
- open: _propTypes["default"].bool,
173
- fg: _propTypes["default"].string,
174
- bg: _propTypes["default"].string,
175
- border: _propTypes["default"].string,
176
- size: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number])
177
- };
178
- ShowRationale.defaultProps = {
179
- iconSet: 'check',
180
- open: false,
181
- fg: '#1a9cff',
182
- bg: '#bce2ff',
183
- border: '#bbe3fd',
184
- size: 30
185
- };
186
- var _default = exports["default"] = ShowRationale;
187
- //# sourceMappingURL=show-rationale-icon.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"show-rationale-icon.js","names":["_propTypes","_interopRequireDefault","require","_react","_sized","_callSuper","t","o","e","_getPrototypeOf2","_possibleConstructorReturn2","_isNativeReflectConstruct","Reflect","construct","constructor","apply","Boolean","prototype","valueOf","call","Info","_ref","fill","createElement","x","y","width","height","points","propTypes","PropTypes","string","isRequired","Border","_ref2","d","Circle","_ref3","_ref3$fill","style","stroke","strokeWidth","strokeMiterlimit","cx","cy","r","Root","_ref4","children","size","normalizedSize","normalizeSize","display","position","preserveAspectRatio","viewBox","oneOfType","arrayOf","node","number","ShowRationale","exports","_React$Component","_classCallCheck2","arguments","_inherits2","_createClass2","key","value","render","_this$props","props","iconSet","open","_this$props$fg","fg","_this$props$bg","bg","_this$props$border","border","info","icons","check","emoji","React","Component","oneOf","bool","defaultProps","_default"],"sources":["../src/show-rationale-icon.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\nimport { normalizeSize } from './sized';\n\n// Info icon\nconst Info = ({ fill }) => (\n <g>\n <rect x=\"-115\" y=\"136.7\" width=\"3\" height=\"3\" fill={fill} />\n <polygon\n points=\"-112,147.7 -112,141.7 -115.8,141.7 -115.8,143.7 -114,143.7 -114,147.7 -116.2,147.7 -116.2,149.7 -109.8,149.7 -109.8,147.7\"\n fill={fill}\n />\n </g>\n);\n\nInfo.propTypes = { fill: PropTypes.string.isRequired };\n\n// Border path\nconst Border = ({ fill }) => (\n <path\n d=\"M-113,158.5c-8,0-14.5-6.5-14.5-14.5s6.5-14.5,14.5-14.5s14.5,6.5,14.5,14.5S-105,158.5-113,158.5z\n M-113,130.5c-7.4,0-13.5,6.1-13.5,13.5s6.1,13.5,13.5,13.5s13.5-6.1,13.5-13.5S-105.6,130.5-113,130.5z\"\n fill={fill}\n />\n);\n\nBorder.propTypes = { fill: PropTypes.string.isRequired };\n\n// Circle background\nconst Circle = ({ fill = '#FFFFFF' }) => (\n <g>\n <path\n style={{\n fill: '#D0CAC5',\n stroke: '#E6E3E0',\n strokeWidth: 0.75,\n strokeMiterlimit: 10,\n }}\n d=\"M-111.7,160.9c-8.5,0-15.5-6.9-15.5-15.5c0-8.5,6.9-15.5,15.5-15.5s15.5,6.9,15.5,15.5C-96.2,154-103.1,160.9-111.7,160.9z\"\n />\n <path\n style={{\n fill: '#B3ABA4',\n stroke: '#CDC7C2',\n strokeWidth: 0.5,\n strokeMiterlimit: 10,\n }}\n d=\"M-112,159.5c-8,0-14.5-6.5-14.5-14.5s6.5-14.5,14.5-14.5s14.5,6.5,14.5,14.5S-104,159.5-112,159.5z\"\n />\n <circle cx=\"-113\" cy=\"144\" r=\"14\" fill={fill} />\n </g>\n);\n\nCircle.propTypes = { fill: PropTypes.string };\n\n// Root wrapper for sizing\nconst Root = ({ children, size }) => {\n const normalizedSize = normalizeSize(size);\n const style = {\n height: normalizedSize,\n width: normalizedSize,\n display: 'inline-block',\n position: 'relative',\n };\n return (\n <div style={style}>\n <svg preserveAspectRatio=\"xMinYMin meet\" viewBox=\"-129 128 34 34\">\n {children}\n </svg>\n </div>\n );\n};\n\nRoot.propTypes = {\n children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired,\n size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n};\n\n// Main ShowRationale component\nexport class ShowRationale extends React.Component {\n render() {\n const { iconSet, open, fg = '#1a9cff', bg = '#bce2ff', border = '#bbe3fd' } = this.props;\n\n const info = <Info fill={fg} />;\n\n const icons = {\n check: (\n <Root size={this.props.size}>\n <Circle />\n {info}\n <Border fill={border} />\n </Root>\n ),\n emoji: (\n <Root size={this.props.size}>\n <Circle />\n {info}\n <Border fill={border} />\n </Root>\n ),\n open: {\n check: (\n <Root size={this.props.size}>\n <circle cx=\"-113\" cy=\"144\" r=\"14\" fill=\"#FFFFFF\" />\n <Info fill={bg} />\n <Border fill=\"#FFFFFF\" />\n </Root>\n ),\n emoji: (\n <Root size={this.props.size}>\n <circle cx=\"-113\" cy=\"144\" r=\"14\" fill=\"#FFFFFF\" />\n <Info fill={bg} />\n <Border fill={border} />\n </Root>\n ),\n },\n };\n\n if (open === true) {\n return icons.open[iconSet];\n } else {\n return icons[iconSet];\n }\n }\n}\n\nShowRationale.propTypes = {\n iconSet: PropTypes.oneOf(['emoji', 'check']),\n open: PropTypes.bool,\n fg: PropTypes.string,\n bg: PropTypes.string,\n border: PropTypes.string,\n size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n};\n\nShowRationale.defaultProps = {\n iconSet: 'check',\n open: false,\n fg: '#1a9cff',\n bg: '#bce2ff',\n border: '#bbe3fd',\n size: 30,\n};\n\nexport default ShowRationale;\n"],"mappings":"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","ignoreList":[]}
package/lib/sized.js DELETED
@@ -1,32 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports.normalizeSize = exports["default"] = void 0;
8
- var _react = _interopRequireDefault(require("react"));
9
- var _propTypes = _interopRequireDefault(require("prop-types"));
10
- var normalizeSize = exports.normalizeSize = function normalizeSize(size) {
11
- return typeof size === 'string' ? size : typeof size === 'number' ? "".concat(size, "px") : '30px';
12
- };
13
- var Sized = function Sized(_ref) {
14
- var size = _ref.size,
15
- children = _ref.children;
16
- size = normalizeSize(size);
17
- var style = {
18
- height: size,
19
- width: size,
20
- display: 'inline-block',
21
- position: 'relative'
22
- };
23
- return /*#__PURE__*/_react["default"].createElement("div", {
24
- style: style
25
- }, children);
26
- };
27
- Sized.propTypes = {
28
- size: _propTypes["default"].number,
29
- children: _propTypes["default"].oneOfType([_propTypes["default"].arrayOf(_propTypes["default"].node), _propTypes["default"].node]).isRequired
30
- };
31
- var _default = exports["default"] = Sized;
32
- //# sourceMappingURL=sized.js.map
package/lib/sized.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"sized.js","names":["_react","_interopRequireDefault","require","_propTypes","normalizeSize","exports","size","concat","Sized","_ref","children","style","height","width","display","position","createElement","propTypes","PropTypes","number","oneOfType","arrayOf","node","isRequired","_default"],"sources":["../src/sized.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\n\nexport const normalizeSize = (size) => {\n return typeof size === 'string' ? size : typeof size === 'number' ? `${size}px` : '30px';\n};\n\nconst Sized = ({ size, children }) => {\n size = normalizeSize(size);\n\n const style = {\n height: size,\n width: size,\n display: 'inline-block',\n position: 'relative',\n };\n\n return <div style={style}>{children}</div>;\n};\n\nSized.propTypes = {\n size: PropTypes.number,\n children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired,\n};\nexport default Sized;\n"],"mappings":";;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,UAAA,GAAAF,sBAAA,CAAAC,OAAA;AAEO,IAAME,aAAa,GAAAC,OAAA,CAAAD,aAAA,GAAG,SAAhBA,aAAaA,CAAIE,IAAI,EAAK;EACrC,OAAO,OAAOA,IAAI,KAAK,QAAQ,GAAGA,IAAI,GAAG,OAAOA,IAAI,KAAK,QAAQ,MAAAC,MAAA,CAAMD,IAAI,UAAO,MAAM;AAC1F,CAAC;AAED,IAAME,KAAK,GAAG,SAARA,KAAKA,CAAAC,IAAA,EAA2B;EAAA,IAArBH,IAAI,GAAAG,IAAA,CAAJH,IAAI;IAAEI,QAAQ,GAAAD,IAAA,CAARC,QAAQ;EAC7BJ,IAAI,GAAGF,aAAa,CAACE,IAAI,CAAC;EAE1B,IAAMK,KAAK,GAAG;IACZC,MAAM,EAAEN,IAAI;IACZO,KAAK,EAAEP,IAAI;IACXQ,OAAO,EAAE,cAAc;IACvBC,QAAQ,EAAE;EACZ,CAAC;EAED,oBAAOf,MAAA,YAAAgB,aAAA;IAAKL,KAAK,EAAEA;EAAM,GAAED,QAAc,CAAC;AAC5C,CAAC;AAEDF,KAAK,CAACS,SAAS,GAAG;EAChBX,IAAI,EAAEY,qBAAS,CAACC,MAAM;EACtBT,QAAQ,EAAEQ,qBAAS,CAACE,SAAS,CAAC,CAACF,qBAAS,CAACG,OAAO,CAACH,qBAAS,CAACI,IAAI,CAAC,EAAEJ,qBAAS,CAACI,IAAI,CAAC,CAAC,CAACC;AACrF,CAAC;AAAC,IAAAC,QAAA,GAAAnB,OAAA,cACaG,KAAK","ignoreList":[]}
@@ -1,305 +0,0 @@
1
- import React from 'react';
2
- import { render } from '@pie-lib/test-utils';
3
- import {
4
- Correct,
5
- CorrectResponse,
6
- Incorrect,
7
- Instructions,
8
- LearnMore,
9
- NothingSubmitted,
10
- PartiallyCorrect,
11
- ShowRationale,
12
- } from '../index';
13
-
14
- describe('@pie-lib/icons', () => {
15
- describe('Correct Icon', () => {
16
- it('renders with default props', () => {
17
- const { container } = render(<Correct />);
18
- const svg = container.querySelector('svg');
19
- expect(svg).toBeInTheDocument();
20
- expect(svg).toHaveAttribute('viewBox', '0 0 44 40');
21
- });
22
-
23
- it('renders with check iconSet by default', () => {
24
- const { container } = render(<Correct />);
25
- // Check icon should render (contains polygon for checkmark)
26
- const polygon = container.querySelector('polygon');
27
- expect(polygon).toBeInTheDocument();
28
- });
29
-
30
- it('renders with emoji iconSet', () => {
31
- const { container } = render(<Correct iconSet="emoji" />);
32
- // Emoji icon contains paths and rects
33
- const elements = container.querySelectorAll('path, rect');
34
- expect(elements.length).toBeGreaterThan(0);
35
- });
36
-
37
- it('renders with round shape by default', () => {
38
- const { container } = render(<Correct />);
39
- // Round shape has a circle element
40
- const circle = container.querySelector('circle');
41
- expect(circle).toBeInTheDocument();
42
- });
43
-
44
- it('renders with square shape', () => {
45
- const { container } = render(<Correct shape="square" />);
46
- // Square shape has a rect element
47
- const rect = container.querySelector('rect');
48
- expect(rect).toBeInTheDocument();
49
- });
50
-
51
- it('renders with feedback category and round shape', () => {
52
- const { container } = render(<Correct category="feedback" shape="round" />);
53
- // Feedback round box has a specific path
54
- const path = container.querySelector('path');
55
- expect(path).toBeInTheDocument();
56
- });
57
-
58
- it('renders with feedback category and square shape', () => {
59
- const { container } = render(<Correct category="feedback" shape="square" />);
60
- // Multiple polygons for square feedback
61
- const polygons = container.querySelectorAll('polygon');
62
- expect(polygons.length).toBeGreaterThan(0);
63
- });
64
-
65
- it('renders in open state', () => {
66
- const { container } = render(<Correct open={true} />);
67
- // In open state, should show background only (fewer elements)
68
- const svg = container.querySelector('svg');
69
- expect(svg).toBeInTheDocument();
70
- });
71
-
72
- it('renders with custom size as number', () => {
73
- const { container } = render(<Correct size={50} />);
74
- const wrapper = container.firstChild;
75
- expect(wrapper).toHaveStyle({ width: '50px', height: '50px' });
76
- });
77
-
78
- it('renders with custom size as string', () => {
79
- const { container } = render(<Correct size="100px" />);
80
- const wrapper = container.firstChild;
81
- expect(wrapper).toHaveStyle({ width: '100px', height: '100px' });
82
- });
83
- });
84
-
85
- describe('Incorrect Icon', () => {
86
- it('renders with default props', () => {
87
- const { container } = render(<Incorrect />);
88
- const svg = container.querySelector('svg');
89
- expect(svg).toBeInTheDocument();
90
- });
91
-
92
- it('renders with check iconSet (X mark)', () => {
93
- const { container } = render(<Incorrect iconSet="check" />);
94
- // X mark contains rect elements
95
- const rects = container.querySelectorAll('rect');
96
- expect(rects.length).toBeGreaterThan(0);
97
- });
98
-
99
- it('renders with emoji iconSet', () => {
100
- const { container } = render(<Incorrect iconSet="emoji" />);
101
- const rects = container.querySelectorAll('rect');
102
- expect(rects.length).toBeGreaterThan(0);
103
- });
104
-
105
- it('renders with custom colors', () => {
106
- const { container } = render(<Incorrect fg="#ff0000" bg="#00ff00" />);
107
- const svg = container.querySelector('svg');
108
- expect(svg).toBeInTheDocument();
109
- });
110
- });
111
-
112
- describe('PartiallyCorrect Icon', () => {
113
- it('renders with default props', () => {
114
- const { container } = render(<PartiallyCorrect />);
115
- const svg = container.querySelector('svg');
116
- expect(svg).toBeInTheDocument();
117
- });
118
-
119
- it('renders with check iconSet', () => {
120
- const { container } = render(<PartiallyCorrect iconSet="check" />);
121
- const svg = container.querySelector('svg');
122
- expect(svg).toBeInTheDocument();
123
- });
124
-
125
- it('renders with emoji iconSet', () => {
126
- const { container } = render(<PartiallyCorrect iconSet="emoji" />);
127
- const svg = container.querySelector('svg');
128
- expect(svg).toBeInTheDocument();
129
- });
130
- });
131
-
132
- describe('NothingSubmitted Icon', () => {
133
- it('renders with default props', () => {
134
- const { container } = render(<NothingSubmitted />);
135
- const svg = container.querySelector('svg');
136
- expect(svg).toBeInTheDocument();
137
- });
138
-
139
- it('renders with default size', () => {
140
- const { container } = render(<NothingSubmitted />);
141
- const wrapper = container.firstChild;
142
- // NothingSubmitted uses default 30px size from IconRoot
143
- expect(wrapper).toHaveStyle({ width: '30px', height: '30px' });
144
- });
145
- });
146
-
147
- describe('CorrectResponse Icon', () => {
148
- it('renders with default props', () => {
149
- const { container } = render(<CorrectResponse />);
150
- const svg = container.querySelector('svg');
151
- expect(svg).toBeInTheDocument();
152
- });
153
-
154
- it('renders SVG with proper viewBox', () => {
155
- const { container } = render(<CorrectResponse />);
156
- const svg = container.querySelector('svg');
157
- // CorrectResponse uses CloseIcon by default which has viewBox="-129.5 127 34 35"
158
- expect(svg).toHaveAttribute('viewBox', '-129.5 127 34 35');
159
- });
160
- });
161
-
162
- describe('LearnMore Icon', () => {
163
- it('renders with default props', () => {
164
- const { container } = render(<LearnMore />);
165
- const svg = container.querySelector('svg');
166
- expect(svg).toBeInTheDocument();
167
- });
168
-
169
- it('renders with custom colors', () => {
170
- const { container } = render(<LearnMore fg="#333333" bg="#ffffff" />);
171
- const svg = container.querySelector('svg');
172
- expect(svg).toBeInTheDocument();
173
- });
174
- });
175
-
176
- describe('ShowRationale Icon', () => {
177
- it('renders with default props', () => {
178
- const { container } = render(<ShowRationale />);
179
- const svg = container.querySelector('svg');
180
- expect(svg).toBeInTheDocument();
181
- });
182
-
183
- it('renders with custom size', () => {
184
- const { container } = render(<ShowRationale size="60px" />);
185
- const wrapper = container.firstChild;
186
- expect(wrapper).toHaveStyle({ width: '60px', height: '60px' });
187
- });
188
- });
189
-
190
- describe('Instructions Icon', () => {
191
- it('renders with default props', () => {
192
- const { container } = render(<Instructions />);
193
- const svg = container.querySelector('svg');
194
- expect(svg).toBeInTheDocument();
195
- });
196
-
197
- it('renders SVG with proper viewBox', () => {
198
- const { container } = render(<Instructions />);
199
- const svg = container.querySelector('svg');
200
- // Instructions SVG has a specific viewBox
201
- expect(svg).toHaveAttribute('viewBox', '-128 129 31 31');
202
- });
203
- });
204
-
205
- describe('Icon Combinations', () => {
206
- it('renders multiple icons together', () => {
207
- const { container } = render(
208
- <div>
209
- <Correct />
210
- <Incorrect />
211
- <PartiallyCorrect />
212
- </div>,
213
- );
214
-
215
- const svgs = container.querySelectorAll('svg');
216
- expect(svgs).toHaveLength(3);
217
- });
218
-
219
- it('handles all iconSet variations', () => {
220
- const icons = [
221
- <Correct key="1" iconSet="check" />,
222
- <Correct key="2" iconSet="emoji" />,
223
- <Incorrect key="3" iconSet="check" />,
224
- <Incorrect key="4" iconSet="emoji" />,
225
- ];
226
-
227
- const { container } = render(<div>{icons}</div>);
228
- const svgs = container.querySelectorAll('svg');
229
- expect(svgs).toHaveLength(4);
230
- });
231
-
232
- it('handles all shape variations', () => {
233
- const icons = [
234
- <Correct key="1" shape="round" />,
235
- <Correct key="2" shape="square" />,
236
- <Incorrect key="3" shape="round" />,
237
- <Incorrect key="4" shape="square" />,
238
- ];
239
-
240
- const { container } = render(<div>{icons}</div>);
241
- const svgs = container.querySelectorAll('svg');
242
- expect(svgs).toHaveLength(4);
243
- });
244
-
245
- it('handles feedback category with both shapes', () => {
246
- const icons = [
247
- <Correct key="1" category="feedback" shape="round" />,
248
- <Correct key="2" category="feedback" shape="square" />,
249
- <Incorrect key="3" category="feedback" shape="round" />,
250
- <Incorrect key="4" category="feedback" shape="square" />,
251
- ];
252
-
253
- const { container } = render(<div>{icons}</div>);
254
- const svgs = container.querySelectorAll('svg');
255
- expect(svgs).toHaveLength(4);
256
- });
257
- });
258
-
259
- describe('Accessibility', () => {
260
- it('renders SVG elements that can be styled', () => {
261
- const { container } = render(<Correct />);
262
- const svg = container.querySelector('svg');
263
- expect(svg).toHaveAttribute('viewBox');
264
- expect(svg).toHaveAttribute('preserveAspectRatio');
265
- });
266
-
267
- it('maintains aspect ratio for responsive sizing', () => {
268
- const { container } = render(<Correct size={100} />);
269
- const svg = container.querySelector('svg');
270
- expect(svg).toHaveAttribute('preserveAspectRatio', 'xMinYMin meet');
271
- });
272
- });
273
-
274
- describe('Default Values', () => {
275
- it('Correct icon has correct default values', () => {
276
- const { container } = render(<Correct />);
277
- // Should render with default size
278
- const wrapper = container.firstChild;
279
- expect(wrapper).toBeInTheDocument();
280
- });
281
-
282
- it('Incorrect icon has correct default values', () => {
283
- const { container } = render(<Incorrect />);
284
- const wrapper = container.firstChild;
285
- expect(wrapper).toBeInTheDocument();
286
- });
287
-
288
- it('all icons render without errors', () => {
289
- const icons = [
290
- <Correct key="correct" />,
291
- <Incorrect key="incorrect" />,
292
- <PartiallyCorrect key="partially" />,
293
- <NothingSubmitted key="nothing" />,
294
- <CorrectResponse key="correctResponse" />,
295
- <LearnMore key="learnMore" />,
296
- <ShowRationale key="showRationale" />,
297
- <Instructions key="instructions" />,
298
- ];
299
-
300
- const { container } = render(<div>{icons}</div>);
301
- const svgs = container.querySelectorAll('svg');
302
- expect(svgs).toHaveLength(8);
303
- });
304
- });
305
- });
@@ -1,54 +0,0 @@
1
- import IconBase from './icon-base';
2
- import PropTypes from 'prop-types';
3
- import React from 'react';
4
-
5
- // Emoji SVG
6
- const Emoji = ({ fill }) => (
7
- <g transform="translate(1, 0)">
8
- <path
9
- d="M24.7,22.1c-1.5,1.7-3.6,2.7-5.8,2.7s-4.5-1.1-5.8-2.7l-2.8,1.6c2,2.7,5.2,4.2,8.7,4.2
10
- c3.4,0,6.6-1.6,8.7-4.2L24.7,22.1z"
11
- fill={fill}
12
- />
13
- <rect x="21.1" y="13.1" width="3.7" height="4.7" fill={fill} />
14
- <rect x="12.7" y="13.1" width="3.7" height="4.7" fill={fill} />
15
- </g>
16
- );
17
-
18
- Emoji.propTypes = { fill: PropTypes.string.isRequired };
19
-
20
- // Check SVG
21
- const Check = ({ fill, x = 0, y = 0 }) => (
22
- <polygon
23
- transform={`translate(${x}, ${y})`}
24
- points="19.1,28.6 11.8,22.3 14.4,19.2 17.9,22.1 23.9,11.4 27.5,13.4"
25
- fill={fill}
26
- />
27
- );
28
-
29
- Check.propTypes = { fill: PropTypes.string.isRequired, x: PropTypes.number, y: PropTypes.number };
30
-
31
- // IconBase wrapper
32
- export const Correct = IconBase(Check, Emoji);
33
-
34
- Correct.propTypes = {
35
- iconSet: PropTypes.oneOf(['emoji', 'check']),
36
- shape: PropTypes.oneOf(['round', 'square']),
37
- category: PropTypes.oneOf(['feedback', undefined]),
38
- open: PropTypes.bool,
39
- fg: PropTypes.string,
40
- bg: PropTypes.string,
41
- size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
42
- };
43
-
44
- Correct.defaultProps = {
45
- iconSet: 'check',
46
- shape: 'round',
47
- category: undefined,
48
- open: false,
49
- fg: '#4aaf46', // foreground color
50
- bg: '#f8ffe2', // background color
51
- size: 30,
52
- };
53
-
54
- export default Correct;