@sanity/form-builder
Version:
Sanity form builder
85 lines (83 loc) • 4.54 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = ArrayFunctions;
var _types = require("@sanity/types");
var _icons = require("@sanity/icons");
var _react = _interopRequireWildcard(require("react"));
var _ui = require("@sanity/ui");
var _autoId = require("@reach/auto-id");
var _internal = require("@sanity/base/_internal");
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; }
// These are the props any implementation of the ArrayFunctions part will receive
function ArrayFunctions(props) {
var _useConditionalReadOn;
var type = props.type,
readOnly = props.readOnly,
children = props.children,
onCreateValue = props.onCreateValue,
onAppendItem = props.onAppendItem;
var menuButtonId = (0, _autoId.useId)();
var conditionalReadOnly = (_useConditionalReadOn = (0, _internal.useConditionalReadOnly)()) !== null && _useConditionalReadOn !== void 0 ? _useConditionalReadOn : readOnly;
var insertItem = _react.default.useCallback(itemType => {
var item = onCreateValue(itemType);
onAppendItem(item);
}, [onCreateValue, onAppendItem]);
var handleAddBtnClick = _react.default.useCallback(() => {
insertItem(type.of[0]);
}, [type, insertItem]);
var popoverProps = (0, _react.useMemo)(() => ({
constrainSize: true,
portal: true
}), []);
if (conditionalReadOnly) {
return /*#__PURE__*/_react.default.createElement(_ui.Tooltip, {
portal: true,
content: /*#__PURE__*/_react.default.createElement(_ui.Box, {
padding: 2,
sizing: "border"
}, /*#__PURE__*/_react.default.createElement(_ui.Text, {
size: 1
}, "This field is read-only"))
}, /*#__PURE__*/_react.default.createElement(_ui.Grid, null, /*#__PURE__*/_react.default.createElement(_ui.Button, {
icon: _icons.AddIcon,
mode: "ghost",
disabled: true,
text: type.of.length === 1 ? 'Add item' : 'Add item...'
})));
}
return /*#__PURE__*/_react.default.createElement(_ui.Grid, {
gap: 1,
style: {
gridTemplateColumns: 'repeat(auto-fit, minmax(100px, 1fr))'
}
}, type.of.length === 1 ? /*#__PURE__*/_react.default.createElement(_ui.Button, {
icon: _icons.AddIcon,
mode: "ghost",
onClick: handleAddBtnClick,
text: "Add item"
}) : /*#__PURE__*/_react.default.createElement(_ui.MenuButton, {
button: /*#__PURE__*/_react.default.createElement(_ui.Button, {
icon: _icons.AddIcon,
mode: "ghost",
text: "Add item\u2026"
}),
id: menuButtonId || '',
menu: /*#__PURE__*/_react.default.createElement(_ui.Menu, null, type.of.map((memberDef, i) => {
var _memberDef$type, _memberDef$type2;
// Use reference icon if reference is to one type only
var referenceIcon = (0, _types.isReferenceSchemaType)(memberDef) && (memberDef.to || []).length === 1 && memberDef.to[0].icon;
var icon = memberDef.icon || ((_memberDef$type = memberDef.type) === null || _memberDef$type === void 0 ? void 0 : _memberDef$type.icon) || referenceIcon;
return /*#__PURE__*/_react.default.createElement(_ui.MenuItem, {
key: i,
text: memberDef.title || ((_memberDef$type2 = memberDef.type) === null || _memberDef$type2 === void 0 ? void 0 : _memberDef$type2.name),
onClick: () => insertItem(memberDef),
icon: icon
});
})),
popover: popoverProps
}), children);
}
ArrayFunctions.__SANITY_INTERNAL_IMPLEMENTATION = true;