UNPKG

@sanity/default-layout

Version:

The default layout components for Sanity

141 lines (140 loc) • 5.44 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.default = void 0; var _react = _interopRequireDefault(require("react")); var _ui = require("@sanity/ui"); var _icons = require("@sanity/icons"); var _generateHelpUrl = require("@sanity/generate-help-url"); var _propTypes = _interopRequireDefault(require("prop-types")); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function renderPath(path) { return path.map((segment, i) => { var key = "s_".concat(i); if (segment.kind === 'type') { return /*#__PURE__*/_react.default.createElement(_ui.Flex, { gap: 3, align: "center", wrap: "wrap", key: key }, /*#__PURE__*/_react.default.createElement(_ui.Text, { key: "name", as: "span", size: 3, weight: "semibold" }, segment.name), /*#__PURE__*/_react.default.createElement(_ui.Text, { key: "type", as: "span" }, segment.type), i < path.length - 1 && /*#__PURE__*/_react.default.createElement(_icons.ArrowRightIcon, null)); } if (segment.kind === 'property') { return /*#__PURE__*/_react.default.createElement(_ui.Flex, { gap: 3, align: "center", wrap: "wrap", key: key }, /*#__PURE__*/_react.default.createElement(_ui.Text, { as: "span" }, segment.name), i < path.length - 1 && /*#__PURE__*/_react.default.createElement(_icons.ArrowRightIcon, null)); } if (segment.kind === 'type') { return /*#__PURE__*/_react.default.createElement(_ui.Flex, { gap: 3, align: "center", wrap: "wrap", key: key }, /*#__PURE__*/_react.default.createElement(_icons.ArrowRightIcon, null), /*#__PURE__*/_react.default.createElement(_ui.Text, { key: "name", as: "span", size: 3, weight: "semibold" }, segment.name), /*#__PURE__*/_react.default.createElement(_icons.ArrowRightIcon, null), /*#__PURE__*/_react.default.createElement(_ui.Text, { key: "type", as: "span" }, segment.type)); } return null; }).filter(Boolean); } function SchemaErrors(props) { var problemGroups = props.problemGroups; return /*#__PURE__*/_react.default.createElement(_ui.Box, null, /*#__PURE__*/_react.default.createElement(_ui.Card, { padding: [4, 4, 5], tone: "critical" }, /*#__PURE__*/_react.default.createElement(_ui.Heading, null, "Uh oh\u2026 found errors in schema")), /*#__PURE__*/_react.default.createElement(_ui.Stack, { as: "ul", space: 6, padding: [4, 4, 5] }, problemGroups.map((group, i) => { return /*#__PURE__*/_react.default.createElement(_ui.Stack, { as: "li", space: 5, key: "g_".concat(i) }, /*#__PURE__*/_react.default.createElement(_ui.Heading, null, /*#__PURE__*/_react.default.createElement(_ui.Flex, { align: "center", gap: 3, wrap: "wrap" }, renderPath(group.path))), /*#__PURE__*/_react.default.createElement(_ui.Box, { as: "ul" }, group.problems.map((problem, j) => /*#__PURE__*/_react.default.createElement(_ui.Flex, { as: "li", key: "g_".concat(i, "_p_").concat(j) }, /*#__PURE__*/_react.default.createElement(_ui.Box, { flex: 1 }, /*#__PURE__*/_react.default.createElement(_ui.Stack, { space: 4 }, /*#__PURE__*/_react.default.createElement(_ui.Flex, { gap: 4 }, /*#__PURE__*/_react.default.createElement(_ui.Box, null, /*#__PURE__*/_react.default.createElement(_ui.Flex, { direction: "column", align: "center", justify: "center", height: "fill", gap: 3 }, /*#__PURE__*/_react.default.createElement(_ui.Text, { accent: true, weight: "semibold", size: 1 }, problem.severity === 'error' && /*#__PURE__*/_react.default.createElement(_icons.ErrorOutlineIcon, null), problem.severity === 'warning' && /*#__PURE__*/_react.default.createElement(_icons.WarningOutlineIcon, null)), /*#__PURE__*/_react.default.createElement(_ui.Text, { accent: true, style: { textTransform: 'uppercase' }, weight: "semibold", size: 1 }, problem.severity))), /*#__PURE__*/_react.default.createElement(_ui.Card, { tone: "critical", borderRight: true }), /*#__PURE__*/_react.default.createElement(_ui.Flex, { direction: "column", justify: "center", gap: 4, flex: 1 }, /*#__PURE__*/_react.default.createElement(_ui.Text, { accent: true, size: 0, style: { fontFamily: 'monospace' } }, problem.message), problem.helpId && /*#__PURE__*/_react.default.createElement(_ui.Text, null, /*#__PURE__*/_react.default.createElement("a", { href: (0, _generateHelpUrl.generateHelpUrl)(problem.helpId), target: "_blank", rel: "noopener noreferrer" }, "View documentation")))))))))); }))); } SchemaErrors.propTypes = { problemGroups: _propTypes.default.arrayOf(_propTypes.default.shape({ path: _propTypes.default.arrayOf(_propTypes.default.shape({ kind: _propTypes.default.string, type: _propTypes.default.string, name: _propTypes.default.string })), problems: _propTypes.default.arrayOf(_propTypes.default.shape({ severity: _propTypes.default.string })) }).isRequired).isRequired }; var _default = SchemaErrors; exports.default = _default;