gather-content-ui
Version:
GatherContent UI Library
77 lines (76 loc) • 4.75 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.ComponentWrapperHeader = ComponentWrapperHeader;
var _react = _interopRequireDefault(require("react"));
var _ = require("../../../..");
var _classnames = _interopRequireDefault(require("classnames"));
var _ComponentLabel = require("./ComponentLabel");
var _ComponentInstructions = require("./ComponentInstructions");
var _ComponentWrapper = require("../ComponentWrapper");
var _excluded = ["editable", "headerAside", "label", "subLabel", "onLabelChange", "onLabelEmpty", "instructions", "onInstructionChange", "isSelected", "isHovered", "counter", "status", "maxLength", "className"];
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
function ComponentWrapperHeader(_ref) {
var editable = _ref.editable,
headerAside = _ref.headerAside,
label = _ref.label,
subLabel = _ref.subLabel,
onLabelChange = _ref.onLabelChange,
onLabelEmpty = _ref.onLabelEmpty,
instructions = _ref.instructions,
onInstructionChange = _ref.onInstructionChange,
isSelected = _ref.isSelected,
isHovered = _ref.isHovered,
counter = _ref.counter,
status = _ref.status,
maxLength = _ref.maxLength,
className = _ref.className,
rest = _objectWithoutProperties(_ref, _excluded);
var classes = (0, _classnames["default"])("gui-component-header ".concat(className), {
"gui-component-header-selected": isSelected,
"gui-component-header-hovered": isHovered,
"border-l-2 border-r-2 border-t-2 border-b-0 border-green-primary bg-white": status === _ComponentWrapper.componentStatuses.added,
"border-l-2 border-r-2 border-t-2 border-b-0 border-red-primary bg-white": status === _ComponentWrapper.componentStatuses.deleted,
"border-l-2 border-r-2 border-t-2 border-b-0 border-purple-primary bg-white": status === _ComponentWrapper.componentStatuses.movedDown || status === _ComponentWrapper.componentStatuses.movedUp,
"bg-white": [_ComponentWrapper.componentStatuses.active, _ComponentWrapper.componentStatuses.unchanged].includes(status)
});
var countText = "".concat(counter < 9 ? "0" : "").concat(counter);
return /*#__PURE__*/_react["default"].createElement("div", _extends({
className: classes
}, rest), /*#__PURE__*/_react["default"].createElement("div", {
className: "gui-component-header-top"
}, /*#__PURE__*/_react["default"].createElement("div", {
className: "gui-component-label"
}, counter && /*#__PURE__*/_react["default"].createElement("span", {
className: "gui-component-counter"
}, countText), /*#__PURE__*/_react["default"].createElement(_.Icon, {
name: "component16",
types: ["neutral-20"],
className: "mr-2"
}), /*#__PURE__*/_react["default"].createElement(_ComponentLabel.ComponentLabel, {
editable: editable,
label: label,
onChange: onLabelChange,
onEmpty: onLabelEmpty,
maxLength: maxLength
}), subLabel && /*#__PURE__*/_react["default"].createElement("span", {
className: "gui-component-sublabel"
}, subLabel)), headerAside && /*#__PURE__*/_react["default"].createElement("div", {
className: "gui-component-header-aside"
}, headerAside)), (instructions || editable) && /*#__PURE__*/_react["default"].createElement(_ComponentInstructions.ComponentInstructions, {
editable: editable,
instructions: instructions,
onChange: onInstructionChange
}));
}
ComponentWrapperHeader.defaultProps = {
editable: false,
isSelected: false,
isHovered: false,
className: ""
};
//# sourceMappingURL=ComponentWrapperHeader.js.map