@sanity/form-builder
Version:
Sanity form builder
127 lines (126 loc) • 8.1 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.InvalidValueInput = void 0;
var _ui = require("@sanity/ui");
var _react = _interopRequireWildcard(require("react"));
var _Alert = require("../../components/Alert");
var _Details = require("../../components/Details");
var _PatchEvent = _interopRequireWildcard(require("../../PatchEvent"));
var _converters = _interopRequireDefault(require("./converters"));
var _UntypedValueInput = require("./UntypedValueInput");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
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); }
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; }
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
function getConverters(value, actualType, validTypes) {
if (!(actualType in _converters.default)) {
return [];
}
return Object.keys(_converters.default[actualType]).filter(targetType => validTypes.includes(targetType)).map(targetType => _objectSpread({
from: actualType,
to: targetType
}, _converters.default[actualType][targetType])).filter(converter => converter.test(value));
}
var InvalidValueInput = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
var value = props.value,
actualType = props.actualType,
validTypes = props.validTypes,
onChange = props.onChange;
(0, _react.useImperativeHandle)(ref, () => ({
// @todo
focus: () => undefined
}));
var handleClearClick = (0, _react.useCallback)(() => {
onChange(_PatchEvent.default.from((0, _PatchEvent.unset)()));
}, [onChange]);
var handleConvertTo = (0, _react.useCallback)(converted => {
onChange(_PatchEvent.default.from((0, _PatchEvent.set)(converted)));
}, [onChange]);
var converters = (0, _react.useMemo)(() => getConverters(value, actualType, validTypes), [value, actualType, validTypes]);
if (typeof value === 'object' && value !== null && !('_type' in value)) {
return /*#__PURE__*/_react.default.createElement(_UntypedValueInput.UntypedValueInput, {
value: value,
validTypes: validTypes,
onChange: onChange
});
}
var suffix = /*#__PURE__*/_react.default.createElement(_ui.Stack, {
padding: 2
}, /*#__PURE__*/_react.default.createElement(_ui.Button, {
onClick: handleClearClick,
tone: "critical",
text: "Reset value"
}));
return /*#__PURE__*/_react.default.createElement(_Alert.Alert, {
status: "error",
suffix: suffix,
title: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, "Invalid property value")
}, /*#__PURE__*/_react.default.createElement(_ui.Text, {
as: "p",
muted: true,
size: 1
}, "The property value is stored as a value type that does not match the expected type."), /*#__PURE__*/_react.default.createElement(_Details.Details, {
marginTop: 4,
open: __DEV__,
title: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, "Developer info")
}, /*#__PURE__*/_react.default.createElement(_ui.Stack, {
space: 3
}, validTypes.length === 1 && /*#__PURE__*/_react.default.createElement(_ui.Text, {
as: "p",
muted: true,
size: 1
}, "The value of this property must be of type ", /*#__PURE__*/_react.default.createElement("code", null, validTypes[0]), " according to the schema."), validTypes.length === 1 && /*#__PURE__*/_react.default.createElement(_ui.Text, {
as: "p",
muted: true,
size: 1
}, "Mismatching value types typically occur when the schema has recently been changed."), validTypes.length !== 1 && /*#__PURE__*/_react.default.createElement(_ui.Text, {
as: "p",
muted: true,
size: 1
}, "Only the following types are valid here according to schema:"), validTypes.length !== 1 && /*#__PURE__*/_react.default.createElement(_ui.Stack, {
as: "ul",
space: 2
}, validTypes.map(validType => /*#__PURE__*/_react.default.createElement(_ui.Text, {
as: "li",
key: validType
}, /*#__PURE__*/_react.default.createElement("code", null, validType)))), /*#__PURE__*/_react.default.createElement(_ui.Stack, {
marginTop: 2,
space: 2
}, /*#__PURE__*/_react.default.createElement(_ui.Text, {
size: 1,
weight: "semibold"
}, "The current value (", /*#__PURE__*/_react.default.createElement("code", null, actualType), ")"), /*#__PURE__*/_react.default.createElement(_ui.Card, {
border: true,
padding: 2,
radius: 2,
tone: "inherit"
}, /*#__PURE__*/_react.default.createElement(_ui.Code, {
language: "json",
size: 1
}, JSON.stringify(value, null, 2)))), converters.length > 0 && /*#__PURE__*/_react.default.createElement(_ui.Stack, {
space: 1
}, converters.map(converter => /*#__PURE__*/_react.default.createElement(ConvertButton, {
converter: converter,
key: "".concat(converter.from, "-").concat(converter.to),
onConvert: handleConvertTo,
value: value
}))))));
});
exports.InvalidValueInput = InvalidValueInput;
InvalidValueInput.displayName = 'InvalidValueInput';
function ConvertButton(_ref) {
var converter = _ref.converter,
onConvert = _ref.onConvert,
value = _ref.value;
var handleClick = (0, _react.useCallback)(() => onConvert(converter.convert(value)), [converter, onConvert, value]);
return /*#__PURE__*/_react.default.createElement(_ui.Button, {
onClick: handleClick,
text: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, "Convert to ", /*#__PURE__*/_react.default.createElement("code", null, converter.to))
});
}