UNPKG

@sanity/form-builder

Version:
95 lines (94 loc) 3.88 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.ConfirmMessage = void 0; var _react = _interopRequireDefault(require("react")); var _icons = require("@sanity/icons"); var _ui = require("@sanity/ui"); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } var STYLE_ASSET_IMAGE = { maxWidth: '100%', height: '120px', objectFit: 'contain', objectPosition: 'center' }; var STYLE_CONFIRM_CARD = { gridColumn: 'span 1', overflow: 'hidden', display: 'flex', alignSelf: 'center', justifyContent: 'center' }; var STYLE_IMAGE_WRAPPER = { height: '100%' }; var ConfirmMessage = _ref => { var asset = _ref.asset, assetType = _ref.assetType, _ref$hasResults = _ref.hasResults, hasResults = _ref$hasResults === void 0 ? false : _ref$hasResults; var isImage = assetType === 'image'; var filenamePlaceholder = asset.originalFilename ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, "The ", assetType, " ", /*#__PURE__*/_react.default.createElement("strong", null, asset.originalFilename)) : "this ".concat(assetType); if (hasResults) { return /*#__PURE__*/_react.default.createElement(_ui.Card, { tone: "caution", padding: [3, 3, 4], border: true, radius: 2, marginBottom: 3 }, /*#__PURE__*/_react.default.createElement(_ui.Grid, { columns: 3, gap: [2, 3, 4] }, /*#__PURE__*/_react.default.createElement(_ui.Flex, { gap: [3, 4], align: "center", style: { gridColumn: isImage ? 'span 2' : 'span 3' } }, /*#__PURE__*/_react.default.createElement(_ui.Text, null, /*#__PURE__*/_react.default.createElement(_icons.WarningOutlineIcon, null)), /*#__PURE__*/_react.default.createElement(_ui.Text, { size: 1 }, filenamePlaceholder, " cannot be deleted because it's being used. In order to delete the ", assetType, " you need the remove all uses of it.")), isImage && /*#__PURE__*/_react.default.createElement(_ui.Card, { __unstable_checkered: true, border: true, radius: 1, style: STYLE_CONFIRM_CARD }, /*#__PURE__*/_react.default.createElement(_ui.Flex, { align: "center", justify: "center", style: STYLE_IMAGE_WRAPPER }, /*#__PURE__*/_react.default.createElement("img", { src: "".concat(asset.url, "?w=200"), style: STYLE_ASSET_IMAGE, alt: "Preview of image", referrerPolicy: "strict-origin-when-cross-origin" }))))); } return /*#__PURE__*/_react.default.createElement(_ui.Card, { paddingX: [2, 3, 4], paddingY: [3, 3, 3, 4] }, /*#__PURE__*/_react.default.createElement(_ui.Grid, { columns: 3, gap: 3 }, /*#__PURE__*/_react.default.createElement(_ui.Flex, { style: { gridColumn: isImage ? 'span 2' : 'span 3' }, align: "center" }, /*#__PURE__*/_react.default.createElement(_ui.Text, null, "You are about to delete the ", assetType, asset.originalFilename && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, ' ', /*#__PURE__*/_react.default.createElement("strong", null, asset.originalFilename)), ' ', "and its metadata.", /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement("br", null), "Are you sure?")), isImage && /*#__PURE__*/_react.default.createElement(_ui.Card, { __unstable_checkered: true, border: true, radius: 1, style: STYLE_CONFIRM_CARD }, /*#__PURE__*/_react.default.createElement(_ui.Flex, { align: "center", justify: "center", style: STYLE_IMAGE_WRAPPER }, /*#__PURE__*/_react.default.createElement("img", { src: "".concat(asset.url, "?w=200"), style: STYLE_ASSET_IMAGE, alt: "Preview of image", referrerPolicy: "strict-origin-when-cross-origin" }))))); }; exports.ConfirmMessage = ConfirmMessage;