@sky-mavis/tanto-widget
Version:
Tanto Widget
83 lines (77 loc) • 3.53 kB
JavaScript
'use strict';
var _styled = require('@emotion/styled/base');
var jsxRuntime = require('@emotion/react/jsx-runtime');
var react = require('motion/react');
var m = require('motion/react-m');
var QRCode = require('./QRCode.cjs');
var QRCodePlaceholder = require('./QRCodePlaceholder.cjs');
function _interopNamespaceDefault(e) {
var n = Object.create(null);
if (e) {
Object.keys(e).forEach(function (k) {
if (k !== 'default') {
var d = Object.getOwnPropertyDescriptor(e, k);
Object.defineProperty(n, k, d.get ? d : {
enumerable: true,
get: function () { return e[k]; }
});
}
});
}
n.default = e;
return Object.freeze(n);
}
var m__namespace = /*#__PURE__*/_interopNamespaceDefault(m);
const SIZE = 236;
const TRANSITION = {
duration: 0.4
};
const Container = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
target: "eh940830"
} : {
target: "eh940830",
label: "Container"
})({
position: 'relative',
overflow: 'hidden',
width: SIZE,
height: SIZE
}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIldDUVJDb2RlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFRa0IiLCJmaWxlIjoiV0NRUkNvZGUudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsganN4IGFzIF9qc3ggfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3QvanN4LXJ1bnRpbWVcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IEFuaW1hdGVQcmVzZW5jZSB9IGZyb20gJ21vdGlvbi9yZWFjdCc7XG5pbXBvcnQgKiBhcyBtIGZyb20gJ21vdGlvbi9yZWFjdC1tJztcbmltcG9ydCB7IFFSQ29kZSB9IGZyb20gJy4vUVJDb2RlJztcbmltcG9ydCB7IFFSQ29kZVBsYWNlaG9sZGVyIH0gZnJvbSAnLi9RUkNvZGVQbGFjZWhvbGRlcic7XG5jb25zdCBTSVpFID0gMjM2O1xuY29uc3QgVFJBTlNJVElPTiA9IHsgZHVyYXRpb246IDAuNCB9O1xuY29uc3QgQ29udGFpbmVyID0gc3R5bGVkLmRpdih7XG4gICAgcG9zaXRpb246ICdyZWxhdGl2ZScsXG4gICAgb3ZlcmZsb3c6ICdoaWRkZW4nLFxuICAgIHdpZHRoOiBTSVpFLFxuICAgIGhlaWdodDogU0laRSxcbn0pO1xuZXhwb3J0IGNvbnN0IFdDUVJDb2RlID0gKHsgdmFsdWUgfSkgPT4ge1xuICAgIHJldHVybiAoX2pzeChDb250YWluZXIsIHsgY2hpbGRyZW46IF9qc3goQW5pbWF0ZVByZXNlbmNlLCB7IGluaXRpYWw6IGZhbHNlLCBtb2RlOiBcInBvcExheW91dFwiLCBjaGlsZHJlbjogdmFsdWUgPyAoX2pzeChtLmRpdiwgeyBpbml0aWFsOiB7IG9wYWNpdHk6IDAgfSwgYW5pbWF0ZTogeyBvcGFjaXR5OiAxIH0sIGV4aXQ6IHsgb3BhY2l0eTogMCB9LCB0cmFuc2l0aW9uOiBUUkFOU0lUSU9OLCBjaGlsZHJlbjogX2pzeChRUkNvZGUsIHsgdmFsdWU6IHZhbHVlIH0pIH0sIGBxci0ke3ZhbHVlfWApKSA6IChfanN4KG0uZGl2LCB7IGluaXRpYWw6IHsgb3BhY2l0eTogMSB9LCBhbmltYXRlOiB7IG9wYWNpdHk6IDEgfSwgZXhpdDogeyBvcGFjaXR5OiAwIH0sIHRyYW5zaXRpb246IFRSQU5TSVRJT04sIGNoaWxkcmVuOiBfanN4KFFSQ29kZVBsYWNlaG9sZGVyLCB7fSkgfSwgXCJwbGFjZWhvbGRlclwiKSkgfSkgfSkpO1xufTtcbiJdfQ== */");
const WCQRCode = ({
value
}) => {
return jsxRuntime.jsx(Container, {
children: jsxRuntime.jsx(react.AnimatePresence, {
initial: false,
mode: "popLayout",
children: value ? jsxRuntime.jsx(m__namespace.div, {
initial: {
opacity: 0
},
animate: {
opacity: 1
},
exit: {
opacity: 0
},
transition: TRANSITION,
children: jsxRuntime.jsx(QRCode.QRCode, {
value: value
})
}, `qr-${value}`) : jsxRuntime.jsx(m__namespace.div, {
initial: {
opacity: 1
},
animate: {
opacity: 1
},
exit: {
opacity: 0
},
transition: TRANSITION,
children: jsxRuntime.jsx(QRCodePlaceholder.QRCodePlaceholder, {})
}, "placeholder")
})
});
};
exports.WCQRCode = WCQRCode;