@sanity/form-builder
Version:
Sanity form builder
41 lines (40 loc) • 6.06 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.TooltipBox = exports.Root = exports.PreviewContainer = exports.InnerFlex = exports.ChangeIndicatorWrapper = exports.BlockPreview = exports.BlockActionsOuter = exports.BlockActionsInner = void 0;
var _color = require("@sanity/color");
var _ui = require("@sanity/ui");
var _styledComponents = _interopRequireWildcard(require("styled-components"));
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10;
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)(props => {
var _props$theme$sanity = props.theme.sanity,
color = _props$theme$sanity.color,
radius = _props$theme$sanity.radius,
space = _props$theme$sanity.space;
var overlay = (0, _styledComponents.css)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n pointer-events: none;\n content: '';\n position: absolute;\n top: -", "px;\n bottom: -", "px;\n left: -", "px;\n right: -", "px;\n border-radius: ", "px;\n mix-blend-mode: ", ";\n "])), space[1], space[1], space[1], space[1], radius[2], color.dark ? 'screen' : 'multiply');
return (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n box-shadow: 0 0 0 1px var(--card-border-color);\n border-radius: ", "px;\n pointer-events: all;\n position: relative;\n\n &[data-focused] {\n box-shadow: 0 0 0 1px ", ";\n }\n\n &:not([data-focused]):not([data-selected]) {\n @media (hover: hover) {\n &:hover {\n --card-border-color: ", ";\n }\n }\n }\n\n &[data-markers] {\n &:after {\n ", "\n background-color: ", ";\n }\n }\n\n &[data-warning] {\n &:after {\n ", "\n background-color: ", ";\n }\n\n @media (hover: hover) {\n &:hover {\n --card-border-color: ", ";\n }\n }\n }\n\n &[data-invalid] {\n &:after {\n ", "\n background-color: ", ";\n }\n\n @media (hover: hover) {\n &:hover {\n --card-border-color: ", ";\n }\n }\n }\n "])), radius[1], color.selectable.primary.selected.border, color.input.default.hovered.border, overlay, color.dark ? _color.hues.purple[950].hex : _color.hues.purple[50].hex, overlay, color.muted.caution.hovered.bg, color.muted.caution.hovered.border, overlay, color.input.invalid.enabled.bg, color.input.invalid.hovered.border);
});
exports.Root = Root;
var PreviewContainer = (0, _styledComponents.default)(_ui.Flex)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n user-select: none;\n pointer-events: none;\n"])));
exports.PreviewContainer = PreviewContainer;
var ChangeIndicatorWrapper = _styledComponents.default.div(_ref => {
var theme = _ref.theme,
$hasChanges = _ref.$hasChanges;
var space = theme.sanity.space;
return (0, _styledComponents.css)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n position: absolute;\n width: ", "px;\n right: 0;\n top: 0;\n bottom: 0;\n padding-left: ", "px;\n user-select: none;\n\n ", "\n\n [data-dragged] & {\n visibility: hidden;\n }\n "])), space[2], space[1], !$hasChanges && (0, _styledComponents.css)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n display: none;\n "]))));
});
exports.ChangeIndicatorWrapper = ChangeIndicatorWrapper;
var InnerFlex = (0, _styledComponents.default)(_ui.Flex)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n position: relative;\n\n [data-dragged] > & {\n opacity: 0.5;\n }\n"])));
exports.InnerFlex = InnerFlex;
var BlockActionsOuter = (0, _styledComponents.default)(_ui.Box)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n width: 25px;\n position: relative;\n\n [data-dragged] & {\n visibility: hidden;\n }\n"])));
exports.BlockActionsOuter = BlockActionsOuter;
var BlockActionsInner = (0, _styledComponents.default)(_ui.Flex)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n position: absolute;\n right: 0;\n [data-dragged] & {\n visibility: hidden;\n }\n"])));
exports.BlockActionsInner = BlockActionsInner;
var TooltipBox = (0, _styledComponents.default)(_ui.Box)(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n max-width: 250px;\n"])));
exports.TooltipBox = TooltipBox;
var BlockPreview = (0, _styledComponents.default)(_ui.Box)(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral([""])));
exports.BlockPreview = BlockPreview;