@redocly/theme
Version:
Shared UI components lib
95 lines (94 loc) • 4.54 kB
JavaScript
;
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
var desc = Object.getOwnPropertyDescriptor(m, k);
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
desc = { enumerable: true, get: function() { return m[k]; } };
}
Object.defineProperty(o, k2, desc);
}) : (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
o["default"] = v;
});
var __importStar = (this && this.__importStar) || (function () {
var ownKeys = function(o) {
ownKeys = Object.getOwnPropertyNames || function (o) {
var ar = [];
for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
return ar;
};
return ownKeys(o);
};
return function (mod) {
if (mod && mod.__esModule) return mod;
var result = {};
if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
__setModuleDefault(result, mod);
return result;
};
})();
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.Feedback = Feedback;
const React = __importStar(require("react"));
const react_router_dom_1 = require("react-router-dom");
const styled_components_1 = __importDefault(require("styled-components"));
const hooks_1 = require("../../core/hooks");
const Rating_1 = require("../../components/Feedback/Rating");
const Sentiment_1 = require("../../components/Feedback/Sentiment");
const Comment_1 = require("../../components/Feedback/Comment");
const Mood_1 = require("../../components/Feedback/Mood");
const Scale_1 = require("../../components/Feedback/Scale");
const constants_1 = require("../../core/constants");
const feedbackComponents = {
rating: Rating_1.Rating,
sentiment: Sentiment_1.Sentiment,
mood: Mood_1.Mood,
scale: Scale_1.Scale,
comment: Comment_1.Comment,
};
function Feedback(props) {
var _a;
const { useSubmitFeedback, useTelemetry } = (0, hooks_1.useThemeHooks)();
const { submitFeedback } = useSubmitFeedback();
const telemetry = useTelemetry();
const { pathname } = (0, react_router_dom_1.useLocation)();
const { feedback: themeFeedbackConf } = (0, hooks_1.useThemeConfig)();
const feedbackConf = Object.assign(Object.assign({}, themeFeedbackConf), { path: props === null || props === void 0 ? void 0 : props.path, type: (props === null || props === void 0 ? void 0 : props.type) || (themeFeedbackConf === null || themeFeedbackConf === void 0 ? void 0 : themeFeedbackConf.type) || constants_1.DEFAULT_FEEDBACK_TYPE, settings: (props === null || props === void 0 ? void 0 : props.settings) || (themeFeedbackConf === null || themeFeedbackConf === void 0 ? void 0 : themeFeedbackConf.settings) || {}, hide: (_a = props.hide) !== null && _a !== void 0 ? _a : themeFeedbackConf === null || themeFeedbackConf === void 0 ? void 0 : themeFeedbackConf.hide });
if (feedbackConf.hide) {
return null;
}
const renderFeedbackComponent = () => {
const { type, settings, path } = feedbackConf;
const FeedbackComponent = feedbackComponents[type];
if (!FeedbackComponent) {
return null;
}
return (React.createElement(FeedbackWrapper, { "data-component-name": "Feedback/Feedback" },
React.createElement(FeedbackComponent, { settings: settings, onSubmit: (values) => {
submitFeedback({ type, values, path });
telemetry.sendFeedbackMessage({ feedbackType: type });
} })));
};
return React.createElement(React.Fragment, { key: pathname }, renderFeedbackComponent());
}
const FeedbackWrapper = styled_components_1.default.div `
padding: var(--feedback-padding);
background-color: var(--feedback-bg-color);
color: var(--feedback-font-color);
font-size: var(--feedback-font-size);
width: var(--feedback-width);
max-width: 100%;
border-radius: var(--feedback-border-radius);
@media print {
display: none;
}
`;
//# sourceMappingURL=Feedback.js.map