@comicrelief/component-library 7.0.3 → 7.1.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.
- package/dist/components/{Organisms/EmailSignUp/_Confetti.js → Atoms/Confetti/Confetti.js} +1 -2
- package/dist/components/Atoms/Confetti/Confetti.md +15 -0
- package/dist/components/Atoms/Confetti/_TriggerConfetti.js +34 -0
- package/dist/components/Organisms/EmailSignUp/_EmailSignUp.js +1 -1
- package/package.json +1 -1
- package/src/components/{Organisms/EmailSignUp/_Confetti.js → Atoms/Confetti/Confetti.js} +1 -1
- package/src/components/Atoms/Confetti/Confetti.md +15 -0
- package/src/components/Atoms/Confetti/_TriggerConfetti.js +15 -0
- package/src/components/Organisms/EmailSignUp/_EmailSignUp.js +1 -1
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
# Confetti
|
|
2
|
+
|
|
3
|
+
```js
|
|
4
|
+
import React, { useState } from 'react';
|
|
5
|
+
import Confetti from './Confetti';
|
|
6
|
+
|
|
7
|
+
const [isConfetti, setIsConfetti] = useState(false);
|
|
8
|
+
|
|
9
|
+
const handleConfettiTrigger = () => setIsConfetti(!isConfetti);
|
|
10
|
+
|
|
11
|
+
<>
|
|
12
|
+
<Confetti trigger={isConfetti} />
|
|
13
|
+
<button type="button" onClick={handleConfettiTrigger}>trigger confetti</button>
|
|
14
|
+
</>
|
|
15
|
+
```
|
|
@@ -0,0 +1,34 @@
|
|
|
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 = TriggerConfetti;
|
|
9
|
+
|
|
10
|
+
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
|
|
11
|
+
|
|
12
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
13
|
+
|
|
14
|
+
var _Confetti = _interopRequireDefault(require("./Confetti"));
|
|
15
|
+
|
|
16
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
17
|
+
|
|
18
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
19
|
+
|
|
20
|
+
function TriggerConfetti() {
|
|
21
|
+
var _useState = (0, _react.useState)(false),
|
|
22
|
+
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
|
23
|
+
isConfetti = _useState2[0],
|
|
24
|
+
setIsConfetti = _useState2[1];
|
|
25
|
+
|
|
26
|
+
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Confetti.default, {
|
|
27
|
+
trigger: isConfetti
|
|
28
|
+
}), /*#__PURE__*/_react.default.createElement("button", {
|
|
29
|
+
type: "button",
|
|
30
|
+
onClick: function onClick() {
|
|
31
|
+
return setIsConfetti(!isConfetti);
|
|
32
|
+
}
|
|
33
|
+
}, "trigger confetti"));
|
|
34
|
+
}
|
|
@@ -33,7 +33,7 @@ var _EmailSignUpConfig = require("./_EmailSignUpConfig");
|
|
|
33
33
|
|
|
34
34
|
var _ErrorText = _interopRequireDefault(require("../../Atoms/ErrorText/ErrorText"));
|
|
35
35
|
|
|
36
|
-
var _Confetti = _interopRequireDefault(require("
|
|
36
|
+
var _Confetti = _interopRequireDefault(require("../../Atoms/Confetti/Confetti"));
|
|
37
37
|
|
|
38
38
|
var _excluded = ["title", "topCopy", "successCopy", "privacyCopy", "backgroundColour", "buttonColour", "formContext", "columnLayout"];
|
|
39
39
|
|
package/package.json
CHANGED
|
@@ -30,7 +30,7 @@ function getAnimationSettings(originXA, originXB) {
|
|
|
30
30
|
}
|
|
31
31
|
};
|
|
32
32
|
}
|
|
33
|
-
|
|
33
|
+
|
|
34
34
|
export default function Confetti({ trigger, duration }) {
|
|
35
35
|
const refAnimationInstance = useRef(null);
|
|
36
36
|
const [intervalId, setIntervalId] = useState();
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
# Confetti
|
|
2
|
+
|
|
3
|
+
```js
|
|
4
|
+
import React, { useState } from 'react';
|
|
5
|
+
import Confetti from './Confetti';
|
|
6
|
+
|
|
7
|
+
const [isConfetti, setIsConfetti] = useState(false);
|
|
8
|
+
|
|
9
|
+
const handleConfettiTrigger = () => setIsConfetti(!isConfetti);
|
|
10
|
+
|
|
11
|
+
<>
|
|
12
|
+
<Confetti trigger={isConfetti} />
|
|
13
|
+
<button type="button" onClick={handleConfettiTrigger}>trigger confetti</button>
|
|
14
|
+
</>
|
|
15
|
+
```
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import React, { useState } from 'react';
|
|
2
|
+
import Confetti from './Confetti';
|
|
3
|
+
|
|
4
|
+
export default function TriggerConfetti() {
|
|
5
|
+
const [isConfetti, setIsConfetti] = useState(false);
|
|
6
|
+
|
|
7
|
+
return (
|
|
8
|
+
|
|
9
|
+
<>
|
|
10
|
+
<Confetti trigger={isConfetti} />
|
|
11
|
+
<button type="button" onClick={() => setIsConfetti(!isConfetti)}>trigger confetti</button>
|
|
12
|
+
</>
|
|
13
|
+
|
|
14
|
+
);
|
|
15
|
+
}
|
|
@@ -15,7 +15,7 @@ import ButtonWithStates from '../../Atoms/ButtonWithStates/ButtonWithStates';
|
|
|
15
15
|
import Text from '../../Atoms/Text/Text';
|
|
16
16
|
import { buildEsuValidationSchema, ESU_FIELDS } from './_EmailSignUpConfig';
|
|
17
17
|
import ErrorText from '../../Atoms/ErrorText/ErrorText';
|
|
18
|
-
import Confetti from '
|
|
18
|
+
import Confetti from '../../Atoms/Confetti/Confetti';
|
|
19
19
|
|
|
20
20
|
const EmailSignUp = ({
|
|
21
21
|
title,
|