@modernpoacher/gremlins 0.0.67 → 0.0.69

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.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@modernpoacher/gremlins",
3
- "version": "0.0.67",
3
+ "version": "0.0.69",
4
4
  "description": "Gremlins",
5
5
  "keywords": [
6
6
  "Gremlins",
@@ -50,16 +50,16 @@
50
50
  "@babel/preset-env": "^7.23.6",
51
51
  "@babel/preset-react": "^7.23.3",
52
52
  "@babel/register": "^7.22.15",
53
- "@modernpoacher/design-system": "1.0.77",
54
- "@modernpoacher/hooks": "^1.0.452",
53
+ "@modernpoacher/design-system": "1.0.113",
54
+ "@modernpoacher/hooks": "^1.0.453",
55
55
  "@storybook/addon-actions": "^7.6.5",
56
56
  "@storybook/addon-essentials": "^7.6.5",
57
57
  "@storybook/addon-links": "^7.6.5",
58
58
  "@storybook/react": "^7.6.5",
59
59
  "@storybook/react-webpack5": "^7.6.5",
60
60
  "@types/react": "^18.2.45",
61
- "@typescript-eslint/eslint-plugin": "^6.14.0",
62
- "@typescript-eslint/parser": "^6.14.0",
61
+ "@typescript-eslint/eslint-plugin": "^6.15.0",
62
+ "@typescript-eslint/parser": "^6.15.0",
63
63
  "babel-plugin-module-resolver": "^5.0.0",
64
64
  "clean-webpack-plugin": "^4.0.0",
65
65
  "core-js": "^3.34.0",
@@ -2,6 +2,7 @@
2
2
  * CheckboxField component
3
3
  */
4
4
  import React from 'react'
5
+ import PropTypes from 'prop-types'
5
6
  import classnames from 'classnames'
6
7
 
7
8
  import { CheckField } from '@modernpoacher/gremlins/components/field'
@@ -13,10 +14,10 @@ export default class CheckboxField extends CheckField {
13
14
 
14
15
  render () {
15
16
  const {
17
+ checked,
16
18
  id,
17
19
  name,
18
- checked,
19
- defaultChecked,
20
+ value,
20
21
  required,
21
22
  disabled,
22
23
  readOnly,
@@ -27,13 +28,43 @@ export default class CheckboxField extends CheckField {
27
28
 
28
29
  const className = this.getClassName()
29
30
 
31
+ if (typeof checked === 'boolean') {
32
+ return (
33
+ <>
34
+ <input
35
+ checked={checked}
36
+ id={id}
37
+ name={name}
38
+ value={value}
39
+ required={required}
40
+ disabled={disabled}
41
+ readOnly={readOnly}
42
+ tabIndex={tabIndex}
43
+ accessKey={accessKey}
44
+ onClick={this.handleClick}
45
+ onChange={this.handleChange}
46
+ className={className}
47
+ type='checkbox'
48
+ ref={fieldRef}
49
+ />
50
+ <label htmlFor={id}>
51
+ {String.fromCodePoint(8203)}
52
+ </label>
53
+ </>
54
+ )
55
+ }
56
+
57
+ const {
58
+ defaultChecked
59
+ } = this.props
60
+
30
61
  return (
31
62
  <>
32
63
  <input
64
+ defaultChecked={defaultChecked}
33
65
  id={id}
34
66
  name={name}
35
67
  checked={checked}
36
- defaultChecked={defaultChecked}
37
68
  required={required}
38
69
  disabled={disabled}
39
70
  readOnly={readOnly}
@@ -54,7 +85,8 @@ export default class CheckboxField extends CheckField {
54
85
  }
55
86
 
56
87
  CheckboxField.propTypes = {
57
- ...CheckField.propTypes
88
+ ...CheckField.propTypes,
89
+ value: PropTypes.string.isRequired
58
90
  }
59
91
 
60
92
  CheckboxField.defaultProps = {
@@ -2,6 +2,7 @@
2
2
  * CheckboxGremlin component
3
3
  */
4
4
  import React from 'react'
5
+ import PropTypes from 'prop-types'
5
6
  import classnames from 'classnames'
6
7
 
7
8
  import { CheckGremlin } from '@modernpoacher/gremlins/gremlins'
@@ -34,6 +35,7 @@ export default class CheckboxGremlin extends CheckGremlin {
34
35
 
35
36
  const {
36
37
  name,
38
+ value,
37
39
  checked,
38
40
  defaultChecked,
39
41
  required,
@@ -49,6 +51,7 @@ export default class CheckboxGremlin extends CheckGremlin {
49
51
  <Field
50
52
  id={id}
51
53
  name={name}
54
+ value={value}
52
55
  checked={checked}
53
56
  defaultChecked={defaultChecked}
54
57
  required={required}
@@ -76,7 +79,8 @@ export default class CheckboxGremlin extends CheckGremlin {
76
79
  }
77
80
 
78
81
  CheckboxGremlin.propTypes = {
79
- ...CheckGremlin.propTypes
82
+ ...CheckGremlin.propTypes,
83
+ value: PropTypes.string.isRequired
80
84
  }
81
85
 
82
86
  CheckboxGremlin.defaultProps = {
@@ -26,11 +26,10 @@ export default class RadioField extends CheckField {
26
26
 
27
27
  render () {
28
28
  const {
29
+ checked,
29
30
  id,
30
31
  name,
31
32
  value,
32
- checked,
33
- defaultChecked,
34
33
  required,
35
34
  disabled,
36
35
  readOnly,
@@ -41,14 +40,43 @@ export default class RadioField extends CheckField {
41
40
 
42
41
  const className = this.getClassName()
43
42
 
43
+ if (typeof checked === 'boolean') {
44
+ return (
45
+ <>
46
+ <input
47
+ checked={checked}
48
+ id={id}
49
+ name={name}
50
+ value={value}
51
+ required={required}
52
+ disabled={disabled}
53
+ readOnly={readOnly}
54
+ tabIndex={tabIndex}
55
+ accessKey={accessKey}
56
+ onClick={this.handleClick}
57
+ onChange={this.handleChange}
58
+ className={className}
59
+ type='radio'
60
+ ref={fieldRef}
61
+ />
62
+ <label htmlFor={id}>
63
+ {String.fromCodePoint(8203)}
64
+ </label>
65
+ </>
66
+ )
67
+ }
68
+
69
+ const {
70
+ defaultChecked
71
+ } = this.props
72
+
44
73
  return (
45
74
  <>
46
75
  <input
76
+ defaultChecked={defaultChecked}
47
77
  id={id}
48
78
  name={name}
49
79
  value={value}
50
- checked={checked}
51
- defaultChecked={defaultChecked}
52
80
  required={required}
53
81
  disabled={disabled}
54
82
  readOnly={readOnly}
@@ -87,6 +87,7 @@ export default class Radio extends CheckGremlin {
87
87
 
88
88
  Radio.propTypes = {
89
89
  ...CheckGremlin.propTypes,
90
+ id: PropTypes.string.isRequired,
90
91
  value: PropTypes.string.isRequired
91
92
  }
92
93