UNPKG

@cimpress/react-components

Version:
63 lines 2.26 kB
var __rest = (this && this.__rest) || function (s, e) { var t = {}; for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p]; if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]]; } return t; }; import { css, cx } from '@emotion/css'; import React from 'react'; import { ReactSVG } from 'react-svg'; import { useFeatureFlags } from './FeatureFlags'; const robotStyle = css ` position: relative; margin: 15px; `; const robotSm = css ` height: 200px; width: 160px; `; const robotLg = css ` height: 350px; width: 280px; `; const robotBgSm = css ` position: absolute; transform-origin: 0 0; top: 45px; `; const robotBgLg = css ` position: absolute; transform-origin: 0 0; top: 45px; transform: scale(1.75); `; const robotFigureSm = css ` position: absolute; transform-origin: 0 0; transform: translate(-50%); left: 50%; `; const robotFigureLg = css ` position: absolute; transform-origin: 0 0; transform: scale(1.75) translate(-50%); left: 50%; `; const noOuterMarginCss = css ` margin: 0; `; export const Robot = (_a) => { var { status, size = 'sm', alternate, className } = _a, rest = __rest(_a, ["status", "size", "alternate", "className"]); const { v17_noOuterSpacing } = useFeatureFlags(); return (React.createElement("div", Object.assign({ className: cx('crc-robot', robotStyle, size === 'sm' ? robotSm : robotLg, v17_noOuterSpacing && noOuterMarginCss, className) }, rest), React.createElement("div", { className: cx(size === 'sm' ? robotBgSm : robotBgLg) }, React.createElement(ReactSVG, { src: `https://static.ux.cimpress.io/assets/images/bg_diamond-${status || 'success'}.svg` })), React.createElement("div", { className: cx(size === 'sm' ? robotFigureSm : robotFigureLg) }, React.createElement(ReactSVG, { src: `https://static.ux.cimpress.io/assets/images/robot-${status || 'success'}${alternate ? '-2' : ''}.svg` })))); }; //# sourceMappingURL=Robot.js.map