@sanity/form-builder
Version:
Sanity form builder
62 lines (61 loc) • 6.84 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.ToolbarCard = exports.Scroller = exports.Root = exports.EditableWrapper = exports.EditableContainer = exports.EditableCard = void 0;
var _components = require("@sanity/base/components");
var _ui = require("@sanity/ui");
var _styledComponents = _interopRequireWildcard(require("styled-components"));
var _text = require("./text");
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
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 _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
var Root = (0, _styledComponents.default)(_ui.Card)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n height: ", ";\n\n &:not([hidden]) {\n display: flex;\n }\n\n flex-direction: column;\n"])), _ref => {
var $fullscreen = _ref.$fullscreen;
return $fullscreen ? '100%' : '15em';
});
exports.Root = Root;
var ToolbarCard = (0, _styledComponents.default)(_ui.Card)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n z-index: 10;\n line-height: 0;\n"])));
exports.ToolbarCard = ToolbarCard;
var EditableCard = (0, _styledComponents.default)(_ui.Card)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n position: relative;\n overflow: hidden;\n\n & > [data-portal] {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n pointer-events: none;\n\n & > * {\n pointer-events: initial;\n }\n }\n\n &::selection,\n *::selection {\n background-color: transparent;\n }\n"])));
exports.EditableCard = EditableCard;
var Scroller = (0, _styledComponents.default)(_components.ScrollContainer)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n position: relative;\n overflow: auto;\n height: 100%;\n display: flex;\n flex-direction: column;\n\n & > * {\n flex: 1;\n min-height: auto;\n }\n"])));
exports.Scroller = Scroller;
var EditableContainer = (0, _styledComponents.default)(_ui.Container)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n /* @todo: calculate from theme */\n /* max-width: 728px; */\n"])));
exports.EditableContainer = EditableContainer;
var EditableWrapper = (0, _styledComponents.default)(_ui.Card)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n height: 100%;\n width: 100%;\n counter-reset: ", ";\n overflow: hidden;\n\n & > div {\n height: 100%;\n }\n\n & .pt-editable {\n display: block;\n width: 100%;\n height: 100%;\n\n ", "\n\n & > .pt-list-item-bullet + .pt-list-item-number,\n & > .pt-list-item-number + .pt-list-item-bullet {\n margin-top: ", "px;\n counter-reset: ", ";\n }\n\n & > :not(.pt-list-item) + .pt-list-item {\n margin-top: ", "px;\n }\n\n /* Reset the list count if the element is not a numbered list item */\n & > :not(.pt-list-item-number) {\n counter-reset: ", ";\n }\n\n ", "\n\n & > .pt-list-item + :not(.pt-list-item) {\n margin-top: ", "px;\n }\n\n & > :first-child {\n padding-top: ", "px;\n }\n\n & > :last-child {\n padding-bottom: ", "px;\n }\n\n /* & > .pt-block {\n & .pt-inline-object {\n }\n } */\n\n & .pt-drop-indicator {\n pointer-events: none;\n border: 1px solid var(--card-focus-ring-color) !important;\n height: 0px !important;\n border-radius: 1px;\n margin-top: -3px;\n left: calc(\n ", " - 1px\n );\n right: calc(\n ", " - 1px\n );\n width: calc(\n 100% -\n ", " + 2px\n ) !important;\n }\n }\n"])), _text.TEXT_LEVELS.map(l => (0, _text.createListName)(l)).join(' '), _text.TEXT_LEVELS.map(l => {
return (0, _styledComponents.css)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n & > .pt-list-item-number[class~='pt-list-item-level-", "'] {\n counter-increment: ", ";\n }\n "])), l, (0, _text.createListName)(l));
}), _ref2 => {
var theme = _ref2.theme;
return theme.sanity.space[3];
}, _text.TEXT_LEVELS.map(l => (0, _text.createListName)(l)).join(' '), _ref3 => {
var theme = _ref3.theme;
return theme.sanity.space[2];
}, _text.TEXT_LEVELS.map(l => (0, _text.createListName)(l)).join(' '), _text.TEXT_LEVELS.slice(1).map(l => {
return (0, _styledComponents.css)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n & > .pt-list-item-level-", " + .pt-list-item-level-", " {\n counter-reset: ", ";\n }\n "])), l, l - 1, (0, _text.createListName)(l));
}), _ref4 => {
var theme = _ref4.theme;
return theme.sanity.space[3];
}, _ref5 => {
var $isFullscreen = _ref5.$isFullscreen,
theme = _ref5.theme;
return theme.sanity.space[$isFullscreen ? 5 : 3];
}, _ref6 => {
var $isFullscreen = _ref6.$isFullscreen,
theme = _ref6.theme;
return theme.sanity.space[$isFullscreen ? 9 : 5];
}, _ref7 => {
var $isFullscreen = _ref7.$isFullscreen,
theme = _ref7.theme;
return $isFullscreen ? (0, _ui.rem)(theme.sanity.space[5]) : (0, _ui.rem)(theme.sanity.space[3]);
}, _ref8 => {
var $isFullscreen = _ref8.$isFullscreen,
theme = _ref8.theme;
return $isFullscreen ? (0, _ui.rem)(theme.sanity.space[5]) : (0, _ui.rem)(theme.sanity.space[3]);
}, _ref9 => {
var $isFullscreen = _ref9.$isFullscreen,
theme = _ref9.theme;
return $isFullscreen ? (0, _ui.rem)(theme.sanity.space[5] * 2) : (0, _ui.rem)(theme.sanity.space[3] * 2);
});
exports.EditableWrapper = EditableWrapper;