@sky-mavis/tanto-widget
Version:
Tanto Widget
52 lines • 3.05 kB
JavaScript
import _styled from'@emotion/styled/base';import {jsx}from'@emotion/react/jsx-runtime';import {AnimatePresence}from'motion/react';import*as m from'motion/react-m';import {SIZE,TRANSITION_DURATION}from'./constants.mjs';import {QRCode}from'./QRCode.mjs';import {QRCodePlaceholder}from'./QRCodePlaceholder.mjs';const Container = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
target: "evdnne60"
} : {
target: "evdnne60",
label: "Container"
})({
position: 'relative',
overflow: 'hidden',
width: SIZE,
height: SIZE
}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkFuaW1hdGVkUVJDb2RlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFPa0IiLCJmaWxlIjoiQW5pbWF0ZWRRUkNvZGUudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsganN4IGFzIF9qc3ggfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3QvanN4LXJ1bnRpbWVcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IEFuaW1hdGVQcmVzZW5jZSB9IGZyb20gJ21vdGlvbi9yZWFjdCc7XG5pbXBvcnQgKiBhcyBtIGZyb20gJ21vdGlvbi9yZWFjdC1tJztcbmltcG9ydCB7IFNJWkUsIFRSQU5TSVRJT05fRFVSQVRJT04gfSBmcm9tICcuL2NvbnN0YW50cyc7XG5pbXBvcnQgeyBRUkNvZGUgfSBmcm9tICcuL1FSQ29kZSc7XG5pbXBvcnQgeyBRUkNvZGVQbGFjZWhvbGRlciB9IGZyb20gJy4vUVJDb2RlUGxhY2Vob2xkZXInO1xuY29uc3QgQ29udGFpbmVyID0gc3R5bGVkLmRpdih7XG4gICAgcG9zaXRpb246ICdyZWxhdGl2ZScsXG4gICAgb3ZlcmZsb3c6ICdoaWRkZW4nLFxuICAgIHdpZHRoOiBTSVpFLFxuICAgIGhlaWdodDogU0laRSxcbn0pO1xuZXhwb3J0IGZ1bmN0aW9uIEFuaW1hdGVkUVJDb2RlKHsgdmFsdWUgfSkge1xuICAgIHJldHVybiAoX2pzeChDb250YWluZXIsIHsgY2hpbGRyZW46IF9qc3goQW5pbWF0ZVByZXNlbmNlLCB7IGluaXRpYWw6IGZhbHNlLCBtb2RlOiBcInBvcExheW91dFwiLCBjaGlsZHJlbjogdmFsdWUgPyAoX2pzeChtLmRpdiwgeyBpbml0aWFsOiB7IG9wYWNpdHk6IDAgfSwgYW5pbWF0ZTogeyBvcGFjaXR5OiAxIH0sIGV4aXQ6IHsgb3BhY2l0eTogMCB9LCB0cmFuc2l0aW9uOiB7IGR1cmF0aW9uOiBUUkFOU0lUSU9OX0RVUkFUSU9OIH0sIGNoaWxkcmVuOiBfanN4KFFSQ29kZSwgeyB2YWx1ZTogdmFsdWUgfSkgfSwgYHFyLSR7dmFsdWV9YCkpIDogKF9qc3gobS5kaXYsIHsgaW5pdGlhbDogeyBvcGFjaXR5OiAxIH0sIGFuaW1hdGU6IHsgb3BhY2l0eTogMSB9LCBleGl0OiB7IG9wYWNpdHk6IDAgfSwgdHJhbnNpdGlvbjogeyBkdXJhdGlvbjogVFJBTlNJVElPTl9EVVJBVElPTiB9LCBjaGlsZHJlbjogX2pzeChRUkNvZGVQbGFjZWhvbGRlciwge30pIH0sIFwicGxhY2Vob2xkZXJcIikpIH0pIH0pKTtcbn1cbiJdfQ== */");
function AnimatedQRCode({
value
}) {
return jsx(Container, {
children: jsx(AnimatePresence, {
initial: false,
mode: "popLayout",
children: value ? jsx(m.div, {
initial: {
opacity: 0
},
animate: {
opacity: 1
},
exit: {
opacity: 0
},
transition: {
duration: TRANSITION_DURATION
},
children: jsx(QRCode, {
value: value
})
}, `qr-${value}`) : jsx(m.div, {
initial: {
opacity: 1
},
animate: {
opacity: 1
},
exit: {
opacity: 0
},
transition: {
duration: TRANSITION_DURATION
},
children: jsx(QRCodePlaceholder, {})
}, "placeholder")
})
});
}export{AnimatedQRCode};