@diplodoc/components 3.0.0-alpha-1

package/build/cjs/components/Feedback/Feedback.js

@@ -0,0 +1,163 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/Feedback/Feedback.tsx
+var Feedback_exports = {};
+__export(Feedback_exports, {
+  FeedbackView: () => FeedbackView,
+  default: () => Feedback_default
+});
+module.exports = __toCommonJS(Feedback_exports);
+var import_react = __toESM(require("react"));
+var import_bem_cn_lite = __toESM(require("bem-cn-lite"));
+var import_hooks = require("../../hooks");
+var import_models = require("../../models");
+var import_DislikeControl = __toESM(require("./controls/DislikeControl"));
+var import_DislikeVariantsPopup = __toESM(require("./controls/DislikeVariantsPopup"));
+var import_LikeControl = __toESM(require("./controls/LikeControl"));
+var import_SuccessPopup = __toESM(require("./controls/SuccessPopup"));
+var import_Feedback = require("./Feedback.css");
+var b = (0, import_bem_cn_lite.default)("dc-feedback");
+var FeedbackView = /* @__PURE__ */ ((FeedbackView2) => {
+  FeedbackView2["Wide"] = "wide";
+  FeedbackView2["Regular"] = "regular";
+  return FeedbackView2;
+})(FeedbackView || {});
+var getInnerState = (isLiked, isDisliked) => {
+  switch (true) {
+    case Boolean(isDisliked):
+      return import_models.FeedbackType.dislike;
+    case Boolean(isLiked):
+      return import_models.FeedbackType.like;
+    default:
+      return import_models.FeedbackType.indeterminate;
+  }
+};
+var ControlsLayout = ({ view, children }) => {
+  const { t } = (0, import_hooks.useTranslation)("feedback");
+  if (view === "regular" /* Regular */) {
+    return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, children);
+  }
+  return /* @__PURE__ */ import_react.default.createElement("div", { className: b("container", { view }) }, /* @__PURE__ */ import_react.default.createElement("div", { className: b("container-row", { view }) }, /* @__PURE__ */ import_react.default.createElement("h3", { className: b("title", { view }) }, t("main-question")), /* @__PURE__ */ import_react.default.createElement("div", { className: b("controls", { view }) }, children)));
+};
+var Feedback = (props) => {
+  const {
+    isLiked = false,
+    isDisliked = false,
+    onSendFeedback,
+    view = "regular" /* Regular */
+  } = props;
+  const likeControlRef = (0, import_react.useRef)(null);
+  const dislikeControlRef = (0, import_react.useRef)(null);
+  const [innerState, setInnerState] = (0, import_react.useState)(getInnerState(isLiked, isDisliked));
+  (0, import_react.useEffect)(() => {
+    setInnerState(getInnerState(isLiked, isDisliked));
+  }, [isLiked, isDisliked, setInnerState]);
+  const likeSuccessPopup = (0, import_hooks.usePopupState)({ autoclose: 3e3 });
+  const dislikeSuccessPopup = (0, import_hooks.usePopupState)({ autoclose: 3e3 });
+  const dislikeVariantsPopup = (0, import_hooks.usePopupState)();
+  const hideFeedbackPopups = (0, import_react.useCallback)(() => {
+    likeSuccessPopup.close();
+    dislikeSuccessPopup.close();
+    dislikeVariantsPopup.close();
+  }, [likeSuccessPopup, dislikeSuccessPopup, dislikeVariantsPopup]);
+  const onChangeLike = (0, import_react.useCallback)(() => {
+    hideFeedbackPopups();
+    if (innerState === import_models.FeedbackType.like) {
+      setInnerState(import_models.FeedbackType.indeterminate);
+      onSendFeedback({ type: import_models.FeedbackType.indeterminate });
+    } else {
+      setInnerState(import_models.FeedbackType.like);
+      onSendFeedback({ type: import_models.FeedbackType.like });
+      likeSuccessPopup.open();
+    }
+  }, [onSendFeedback, setInnerState, innerState, likeSuccessPopup, hideFeedbackPopups]);
+  const onChangeDislike = (0, import_react.useCallback)(() => {
+    hideFeedbackPopups();
+    if (innerState === import_models.FeedbackType.dislike) {
+      setInnerState(import_models.FeedbackType.indeterminate);
+      onSendFeedback({ type: import_models.FeedbackType.indeterminate });
+    } else {
+      dislikeVariantsPopup.open();
+    }
+  }, [onSendFeedback, setInnerState, innerState, dislikeVariantsPopup, hideFeedbackPopups]);
+  const onSendDislikeInformation = (0, import_react.useCallback)(
+    (data) => {
+      hideFeedbackPopups();
+      dislikeSuccessPopup.open();
+      setInnerState(import_models.FeedbackType.dislike);
+      onSendFeedback({ type: import_models.FeedbackType.dislike, ...data });
+    },
+    [onSendFeedback, setInnerState, dislikeSuccessPopup, hideFeedbackPopups]
+  );
+  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(ControlsLayout, { view }, /* @__PURE__ */ import_react.default.createElement(
+    import_LikeControl.default,
+    {
+      ref: likeControlRef,
+      view,
+      onClick: onChangeLike,
+      isLiked: innerState === import_models.FeedbackType.like
+    }
+  ), /* @__PURE__ */ import_react.default.createElement(
+    import_DislikeControl.default,
+    {
+      ref: dislikeControlRef,
+      view,
+      onClick: onChangeDislike,
+      isDisliked: innerState === import_models.FeedbackType.dislike
+    }
+  )), likeControlRef.current && /* @__PURE__ */ import_react.default.createElement(
+    import_SuccessPopup.default,
+    {
+      visible: likeSuccessPopup.visible,
+      anchor: likeControlRef,
+      view,
+      onOutsideClick: hideFeedbackPopups
+    }
+  ), dislikeControlRef.current && /* @__PURE__ */ import_react.default.createElement(
+    import_SuccessPopup.default,
+    {
+      visible: dislikeSuccessPopup.visible,
+      anchor: dislikeControlRef,
+      view,
+      onOutsideClick: hideFeedbackPopups
+    }
+  ), dislikeControlRef.current && /* @__PURE__ */ import_react.default.createElement(
+    import_DislikeVariantsPopup.default,
+    {
+      visible: dislikeVariantsPopup.visible,
+      anchor: dislikeControlRef,
+      view,
+      onSubmit: onSendDislikeInformation,
+      onOutsideClick: hideFeedbackPopups
+    }
+  ));
+};
+var Feedback_default = Feedback;
+//# sourceMappingURL=Feedback.js.map

package/build/cjs/components/Feedback/Feedback.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/components/Feedback/Feedback.tsx"],
+  "sourcesContent": ["import React, {PropsWithChildren, useCallback, useEffect, useRef, useState} from 'react';\n\nimport block from 'bem-cn-lite';\n\nimport {usePopupState, useTranslation} from '../../hooks';\nimport {FeedbackSendData, FeedbackType} from '../../models';\n\nimport DislikeControl from './controls/DislikeControl';\nimport DislikeVariantsPopup, {FormData} from './controls/DislikeVariantsPopup';\nimport LikeControl from './controls/LikeControl';\nimport SuccessPopup from './controls/SuccessPopup';\n\nimport './Feedback.scss';\n\nconst b = block('dc-feedback');\n\nexport enum FeedbackView {\n    Wide = 'wide',\n    Regular = 'regular',\n}\n\nexport interface FeedbackProps {\n    isLiked?: boolean;\n    isDisliked?: boolean;\n    onSendFeedback: (data: FeedbackSendData) => void;\n    view?: FeedbackView;\n}\n\nconst getInnerState = (isLiked: boolean, isDisliked: boolean) => {\n    switch (true) {\n        case Boolean(isDisliked):\n            return FeedbackType.dislike;\n        case Boolean(isLiked):\n            return FeedbackType.like;\n        default:\n            return FeedbackType.indeterminate;\n    }\n};\n\nconst ControlsLayout: React.FC<PropsWithChildren<{view: FeedbackView}>> = ({view, children}) => {\n    const {t} = useTranslation('feedback');\n\n    if (view === FeedbackView.Regular) {\n        return <React.Fragment>{children}</React.Fragment>;\n    }\n\n    return (\n        <div className={b('container', {view})}>\n            <div className={b('container-row', {view})}>\n                <h3 className={b('title', {view})}>{t<string>('main-question')}</h3>\n                <div className={b('controls', {view})}>{children}</div>\n            </div>\n        </div>\n    );\n};\n\nconst Feedback: React.FC<FeedbackProps> = (props) => {\n    const {\n        isLiked = false,\n        isDisliked = false,\n        onSendFeedback,\n        view = FeedbackView.Regular,\n    } = props;\n\n    const likeControlRef = useRef<HTMLButtonElement | null>(null);\n    const dislikeControlRef = useRef<HTMLButtonElement | null>(null);\n\n    const [innerState, setInnerState] = useState<FeedbackType>(getInnerState(isLiked, isDisliked));\n    useEffect(() => {\n        setInnerState(getInnerState(isLiked, isDisliked));\n    }, [isLiked, isDisliked, setInnerState]);\n\n    const likeSuccessPopup = usePopupState({autoclose: 3000});\n    const dislikeSuccessPopup = usePopupState({autoclose: 3000});\n    const dislikeVariantsPopup = usePopupState();\n\n    const hideFeedbackPopups = useCallback(() => {\n        likeSuccessPopup.close();\n        dislikeSuccessPopup.close();\n        dislikeVariantsPopup.close();\n    }, [likeSuccessPopup, dislikeSuccessPopup, dislikeVariantsPopup]);\n\n    const onChangeLike = useCallback(() => {\n        hideFeedbackPopups();\n\n        if (innerState === FeedbackType.like) {\n            setInnerState(FeedbackType.indeterminate);\n            onSendFeedback({type: FeedbackType.indeterminate});\n        } else {\n            setInnerState(FeedbackType.like);\n            onSendFeedback({type: FeedbackType.like});\n            likeSuccessPopup.open();\n        }\n    }, [onSendFeedback, setInnerState, innerState, likeSuccessPopup, hideFeedbackPopups]);\n\n    const onChangeDislike = useCallback(() => {\n        hideFeedbackPopups();\n\n        if (innerState === FeedbackType.dislike) {\n            setInnerState(FeedbackType.indeterminate);\n            onSendFeedback({type: FeedbackType.indeterminate});\n        } else {\n            dislikeVariantsPopup.open();\n        }\n    }, [onSendFeedback, setInnerState, innerState, dislikeVariantsPopup, hideFeedbackPopups]);\n\n    const onSendDislikeInformation = useCallback(\n        (data: FormData) => {\n            hideFeedbackPopups();\n            dislikeSuccessPopup.open();\n            setInnerState(FeedbackType.dislike);\n            onSendFeedback({type: FeedbackType.dislike, ...data});\n        },\n        [onSendFeedback, setInnerState, dislikeSuccessPopup, hideFeedbackPopups],\n    );\n\n    return (\n        <React.Fragment>\n            <ControlsLayout view={view}>\n                <LikeControl\n                    ref={likeControlRef}\n                    view={view}\n                    onClick={onChangeLike}\n                    isLiked={innerState === FeedbackType.like}\n                />\n                <DislikeControl\n                    ref={dislikeControlRef}\n                    view={view}\n                    onClick={onChangeDislike}\n                    isDisliked={innerState === FeedbackType.dislike}\n                />\n            </ControlsLayout>\n            {likeControlRef.current && (\n                <SuccessPopup\n                    visible={likeSuccessPopup.visible}\n                    anchor={likeControlRef}\n                    view={view}\n                    onOutsideClick={hideFeedbackPopups}\n                />\n            )}\n            {dislikeControlRef.current && (\n                <SuccessPopup\n                    visible={dislikeSuccessPopup.visible}\n                    anchor={dislikeControlRef}\n                    view={view}\n                    onOutsideClick={hideFeedbackPopups}\n                />\n            )}\n            {dislikeControlRef.current && (\n                <DislikeVariantsPopup\n                    visible={dislikeVariantsPopup.visible}\n                    anchor={dislikeControlRef}\n                    view={view}\n                    onSubmit={onSendDislikeInformation}\n                    onOutsideClick={hideFeedbackPopups}\n                />\n            )}\n        </React.Fragment>\n    );\n};\n\nexport default Feedback;\n"],
+  "mappings": "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",
+  "names": ["block", "FeedbackView", "React", "LikeControl", "DislikeControl", "SuccessPopup", "DislikeVariantsPopup"]
+}

package/build/cjs/components/Feedback/controls/DislikeControl.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { FeedbackView } from '../Feedback';
+type DislikeControlProps = {
+    isVerticalView?: boolean | undefined;
+    isDisliked: boolean | undefined;
+    className?: string | undefined;
+    view: FeedbackView | undefined;
+    onClick: () => void;
+};
+declare const DislikeControl: React.MemoExoticComponent<React.ForwardRefExoticComponent<DislikeControlProps & React.RefAttributes<HTMLButtonElement>>>;
+export default DislikeControl;

package/build/cjs/components/Feedback/controls/DislikeControl.js

@@ -0,0 +1,69 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/Feedback/controls/DislikeControl.tsx
+var DislikeControl_exports = {};
+__export(DislikeControl_exports, {
+  default: () => DislikeControl_default
+});
+module.exports = __toCommonJS(DislikeControl_exports);
+var import_react = __toESM(require("react"));
+var import_uikit = require("@gravity-ui/uikit");
+var import_bem_cn_lite = __toESM(require("bem-cn-lite"));
+var import_hooks = require("../../../hooks");
+var import_Control = require("../../Control");
+var import_ControlsLayout = require("../../Controls/ControlsLayout");
+var import_Feedback = require("../Feedback");
+var import_thumbs_down_fill = __toESM(require("@gravity-ui/icons/svgs/thumbs-down-fill.svg"));
+var import_thumbs_down = __toESM(require("@gravity-ui/icons/svgs/thumbs-down.svg"));
+var b = (0, import_bem_cn_lite.default)("dc-feedback");
+var DislikeControl = (0, import_react.memo)(
+  (0, import_react.forwardRef)(({ isDisliked, view, onClick }, ref) => {
+    const { t } = (0, import_hooks.useTranslation)("feedback");
+    const { isVerticalView, controlClassName } = (0, import_react.useContext)(import_ControlsLayout.ControlsLayoutContext);
+    const tooltipText = isDisliked ? t("cancel-dislike-text") : t("dislike-text");
+    if (view === import_Feedback.FeedbackView.Wide) {
+      return /* @__PURE__ */ import_react.default.createElement(import_uikit.Button, { view: "normal", ref, onClick, className: b("control", { view }) }, /* @__PURE__ */ import_react.default.createElement(import_uikit.Button.Icon, null, /* @__PURE__ */ import_react.default.createElement(import_uikit.Icon, { data: isDisliked ? import_thumbs_down_fill.default : import_thumbs_down.default, size: 14 })), t("button-dislike-text"));
+    }
+    return /* @__PURE__ */ import_react.default.createElement(
+      import_Control.Control,
+      {
+        onClick,
+        className: b("control", { view }, controlClassName),
+        isVerticalView,
+        tooltipText,
+        ref,
+        icon: (args) => /* @__PURE__ */ import_react.default.createElement(import_uikit.Icon, { data: isDisliked ? import_thumbs_down_fill.default : import_thumbs_down.default, ...args })
+      }
+    );
+  })
+);
+DislikeControl.displayName = "DislikeControl";
+var DislikeControl_default = DislikeControl;
+//# sourceMappingURL=DislikeControl.js.map

package/build/cjs/components/Feedback/controls/DislikeControl.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/components/Feedback/controls/DislikeControl.tsx"],
+  "sourcesContent": ["import React, {forwardRef, memo, useContext} from 'react';\n\nimport {Button, Icon} from '@gravity-ui/uikit';\nimport block from 'bem-cn-lite';\n\nimport {useTranslation} from '../../../hooks';\nimport {Control} from '../../Control';\nimport {ControlsLayoutContext} from '../../Controls/ControlsLayout';\nimport {FeedbackView} from '../Feedback';\n\nimport DislikeActiveIcon from '@gravity-ui/icons/svgs/thumbs-down-fill.svg';\nimport DislikeIcon from '@gravity-ui/icons/svgs/thumbs-down.svg';\n\ntype DislikeControlProps = {\n    isVerticalView?: boolean | undefined;\n    isDisliked: boolean | undefined;\n    className?: string | undefined;\n    view: FeedbackView | undefined;\n    onClick: () => void;\n};\n\nconst b = block('dc-feedback');\n\nconst DislikeControl = memo(\n    forwardRef<HTMLButtonElement, DislikeControlProps>(({isDisliked, view, onClick}, ref) => {\n        const {t} = useTranslation('feedback');\n        const {isVerticalView, controlClassName} = useContext(ControlsLayoutContext);\n        const tooltipText = isDisliked ? t('cancel-dislike-text') : t('dislike-text');\n\n        if (view === FeedbackView.Wide) {\n            return (\n                <Button view=\"normal\" ref={ref} onClick={onClick} className={b('control', {view})}>\n                    <Button.Icon>\n                        <Icon data={isDisliked ? DislikeActiveIcon : DislikeIcon} size={14} />\n                    </Button.Icon>\n                    {t<string>('button-dislike-text')}\n                </Button>\n            );\n        }\n\n        return (\n            <Control\n                onClick={onClick}\n                className={b('control', {view}, controlClassName)}\n                isVerticalView={isVerticalView}\n                tooltipText={tooltipText}\n                ref={ref}\n                icon={(args) => (\n                    <Icon data={isDisliked ? DislikeActiveIcon : DislikeIcon} {...args} />\n                )}\n            />\n        );\n    }),\n);\n\nDislikeControl.displayName = 'DislikeControl';\n\nexport default DislikeControl;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkD;AAElD,mBAA2B;AAC3B,yBAAkB;AAElB,mBAA6B;AAC7B,qBAAsB;AACtB,4BAAoC;AACpC,sBAA2B;AAE3B,8BAA8B;AAC9B,yBAAwB;AAUxB,IAAM,QAAI,mBAAAA,SAAM,aAAa;AAE7B,IAAM,qBAAiB;AAAA,MACnB,yBAAmD,CAAC,EAAC,YAAY,MAAM,QAAO,GAAG,QAAQ;AACrF,UAAM,EAAC,EAAC,QAAI,6BAAe,UAAU;AACrC,UAAM,EAAC,gBAAgB,iBAAgB,QAAI,yBAAW,2CAAqB;AAC3E,UAAM,cAAc,aAAa,EAAE,qBAAqB,IAAI,EAAE,cAAc;AAE5E,QAAI,SAAS,6BAAa,MAAM;AAC5B,aACI,6BAAAC,QAAA,cAAC,uBAAO,MAAK,UAAS,KAAU,SAAkB,WAAW,EAAE,WAAW,EAAC,KAAI,CAAC,KAC5E,6BAAAA,QAAA,cAAC,oBAAO,MAAP,MACG,6BAAAA,QAAA,cAAC,qBAAK,MAAM,aAAa,wBAAAC,UAAoB,mBAAAC,SAAa,MAAM,IAAI,CACxE,GACC,EAAU,qBAAqB,CACpC;AAAA,IAER;AAEA,WACI,6BAAAF,QAAA;AAAA,MAAC;AAAA;AAAA,QACG;AAAA,QACA,WAAW,EAAE,WAAW,EAAC,KAAI,GAAG,gBAAgB;AAAA,QAChD;AAAA,QACA;AAAA,QACA;AAAA,QACA,MAAM,CAAC,SACH,6BAAAA,QAAA,cAAC,qBAAK,MAAM,aAAa,wBAAAC,UAAoB,mBAAAC,SAAc,GAAG,MAAM;AAAA;AAAA,IAE5E;AAAA,EAER,CAAC;AACL;AAEA,eAAe,cAAc;AAE7B,IAAO,yBAAQ;",
+  "names": ["block", "React", "DislikeActiveIcon", "DislikeIcon"]
+}

package/build/cjs/components/Feedback/controls/DislikeVariantsPopup.d.ts

@@ -0,0 +1,18 @@
+import React, { RefObject } from 'react';
+import { FeedbackView } from '../Feedback';
+export interface FeedbackCheckboxes {
+    [key: string]: boolean;
+}
+export type FormData = {
+    comment: string;
+    answers: string[];
+};
+type DislikeVariantsPopupProps = {
+    view: FeedbackView;
+    visible: boolean;
+    anchor: RefObject<HTMLButtonElement>;
+    onOutsideClick: () => void;
+    onSubmit: (data: FormData) => void;
+};
+declare const DislikeVariantsPopup: React.FC<DislikeVariantsPopupProps>;
+export default DislikeVariantsPopup;

package/build/cjs/components/Feedback/controls/DislikeVariantsPopup.js

@@ -0,0 +1,150 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/Feedback/controls/DislikeVariantsPopup.tsx
+var DislikeVariantsPopup_exports = {};
+__export(DislikeVariantsPopup_exports, {
+  default: () => DislikeVariantsPopup_default
+});
+module.exports = __toCommonJS(DislikeVariantsPopup_exports);
+var import_react = __toESM(require("react"));
+var import_uikit = require("@gravity-ui/uikit");
+var import_bem_cn_lite = __toESM(require("bem-cn-lite"));
+var import_hooks = require("../../../hooks");
+var import_ControlsLayout = require("../../Controls/ControlsLayout");
+var import_Feedback = require("../Feedback");
+var b = (0, import_bem_cn_lite.default)("dc-feedback");
+var DislikeVariantsList = (0, import_react.memo)(
+  (0, import_react.forwardRef)((_props, ref) => {
+    const { t, i18n } = (0, import_hooks.useTranslation)("feedback-variants");
+    const variants = i18n.getResourceBundle(i18n.language, "feedback-variants");
+    const [checked, setChecked] = (0, import_react.useState)({});
+    (0, import_react.useImperativeHandle)(ref, () => {
+      return {
+        data() {
+          return Object.keys(checked).filter((key) => Boolean(checked[key])).map((key) => variants[key]);
+        },
+        clean() {
+          setChecked({});
+        }
+      };
+    });
+    if (!Object.keys(variants).length) {
+      return null;
+    }
+    return /* @__PURE__ */ import_react.default.createElement("div", { className: b("variants") }, Object.keys(variants).map((variant) => /* @__PURE__ */ import_react.default.createElement(
+      import_uikit.Checkbox,
+      {
+        key: variant,
+        className: b("variant"),
+        checked: checked[variant],
+        onUpdate: (state) => {
+          setChecked({
+            ...checked,
+            [variant]: state
+          });
+        },
+        content: t(variant)
+      }
+    )));
+  })
+);
+DislikeVariantsList.displayName = "DislikeVariantsList";
+var DislikeVariantsInput = (0, import_react.memo)(
+  (0, import_react.forwardRef)((_props, ref) => {
+    const { t } = (0, import_hooks.useTranslation)("feedback");
+    const [feedbackComment, setFeedbackComment] = (0, import_react.useState)("");
+    const onChange = (0, import_react.useCallback)((event) => {
+      setFeedbackComment(event.target.value);
+    }, []);
+    (0, import_react.useImperativeHandle)(ref, () => {
+      return {
+        data() {
+          return feedbackComment;
+        },
+        clean() {
+          setFeedbackComment("");
+        }
+      };
+    });
+    return /* @__PURE__ */ import_react.default.createElement("div", { className: b("textarea") }, /* @__PURE__ */ import_react.default.createElement(
+      import_uikit.TextArea,
+      {
+        size: "m",
+        rows: 6,
+        placeholder: t("comment-placeholder"),
+        hasClear: true,
+        value: feedbackComment,
+        onChange
+      }
+    ));
+  })
+);
+DislikeVariantsInput.displayName = "DislikeVariantsInput";
+var DislikeVariantsPopup = (0, import_react.memo)(
+  ({ anchor, visible, view, onOutsideClick, onSubmit }) => {
+    const { t } = (0, import_hooks.useTranslation)("feedback");
+    const { isVerticalView } = (0, import_react.useContext)(import_ControlsLayout.ControlsLayoutContext);
+    const position = (0, import_react.useMemo)(() => {
+      if (!view || view === import_Feedback.FeedbackView.Regular) {
+        return isVerticalView ? import_hooks.PopperPosition.LEFT_START : import_hooks.PopperPosition.BOTTOM_END;
+      }
+      return import_hooks.PopperPosition.RIGHT;
+    }, [isVerticalView, view]);
+    const feedbackComment = (0, import_react.useRef)(null);
+    const feedbackCheckboxes = (0, import_react.useRef)(null);
+    const onFormSubmit = (0, import_react.useCallback)(
+      (event) => {
+        event.preventDefault();
+        onSubmit({
+          comment: feedbackComment.current?.data() || "",
+          answers: feedbackCheckboxes.current?.data() || []
+        });
+        feedbackComment.current?.clean();
+        feedbackCheckboxes.current?.clean();
+      },
+      [onSubmit]
+    );
+    return /* @__PURE__ */ import_react.default.createElement(
+      import_uikit.Popup,
+      {
+        anchorRef: anchor,
+        open: visible,
+        onOutsideClick,
+        contentClassName: b("variants-popup", { view }),
+        placement: position
+      },
+      /* @__PURE__ */ import_react.default.createElement("h3", { className: b("popup-title") }, t("dislike-variants-title")),
+      /* @__PURE__ */ import_react.default.createElement("form", { onSubmit: onFormSubmit }, /* @__PURE__ */ import_react.default.createElement(DislikeVariantsList, { ref: feedbackCheckboxes }), /* @__PURE__ */ import_react.default.createElement(DislikeVariantsInput, { ref: feedbackComment }), /* @__PURE__ */ import_react.default.createElement("div", { className: b("variants-actions") }, /* @__PURE__ */ import_react.default.createElement(import_uikit.Button, { view: "action", className: b("variants-action"), type: "submit" }, t("send-action-text"))))
+    );
+  }
+);
+DislikeVariantsPopup.displayName = "FeedbackDislikeVariantsPopup";
+var DislikeVariantsPopup_default = DislikeVariantsPopup;
+//# sourceMappingURL=DislikeVariantsPopup.js.map

package/build/cjs/components/Feedback/controls/DislikeVariantsPopup.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/components/Feedback/controls/DislikeVariantsPopup.tsx"],
+  "sourcesContent": ["import React, {\n    RefObject,\n    SyntheticEvent,\n    forwardRef,\n    memo,\n    useCallback,\n    useContext,\n    useImperativeHandle,\n    useMemo,\n    useRef,\n    useState,\n} from 'react';\n\nimport {Button, Checkbox, Popup, TextArea} from '@gravity-ui/uikit';\nimport block from 'bem-cn-lite';\n\nimport {PopperPosition, useTranslation} from '../../../hooks';\nimport {ControlsLayoutContext} from '../../Controls/ControlsLayout';\nimport {FeedbackView} from '../Feedback';\n\nexport interface FeedbackCheckboxes {\n    [key: string]: boolean;\n}\n\nconst b = block('dc-feedback');\n\nconst DislikeVariantsList = memo(\n    forwardRef<FormPart<string[]>>((_props, ref) => {\n        const {t, i18n} = useTranslation('feedback-variants');\n        const variants = i18n.getResourceBundle(i18n.language, 'feedback-variants');\n        const [checked, setChecked] = useState({} as FeedbackCheckboxes);\n\n        useImperativeHandle(ref, () => {\n            return {\n                data() {\n                    return Object.keys(checked)\n                        .filter((key) => Boolean(checked[key]))\n                        .map((key) => variants[key]);\n                },\n\n                clean() {\n                    setChecked({});\n                },\n            };\n        });\n\n        if (!Object.keys(variants).length) {\n            return null;\n        }\n\n        return (\n            <div className={b('variants')}>\n                {Object.keys(variants).map((variant) => (\n                    <Checkbox\n                        key={variant}\n                        className={b('variant')}\n                        checked={checked[variant]}\n                        // TODO: fix uikit API - onUpdate(value, key)\n                        onUpdate={(state) => {\n                            setChecked({\n                                ...checked,\n                                [variant]: state,\n                            });\n                        }}\n                        content={t<string>(variant)}\n                    />\n                ))}\n            </div>\n        );\n    }),\n);\n\nDislikeVariantsList.displayName = 'DislikeVariantsList';\n\nconst DislikeVariantsInput = memo(\n    forwardRef<FormPart<string>>((_props, ref) => {\n        const {t} = useTranslation('feedback');\n        const [feedbackComment, setFeedbackComment] = useState('');\n        const onChange = useCallback((event: SyntheticEvent) => {\n            setFeedbackComment((event.target as HTMLTextAreaElement).value);\n        }, []);\n\n        useImperativeHandle(ref, () => {\n            return {\n                data() {\n                    return feedbackComment;\n                },\n\n                clean() {\n                    setFeedbackComment('');\n                },\n            };\n        });\n\n        return (\n            <div className={b('textarea')}>\n                <TextArea\n                    size=\"m\"\n                    rows={6}\n                    placeholder={t('comment-placeholder')}\n                    hasClear\n                    value={feedbackComment}\n                    onChange={onChange}\n                />\n            </div>\n        );\n    }),\n);\n\nDislikeVariantsInput.displayName = 'DislikeVariantsInput';\n\ntype FormPart<T> = {\n    data(): T;\n    clean(): void;\n};\n\nexport type FormData = {\n    comment: string;\n    answers: string[];\n};\n\ntype DislikeVariantsPopupProps = {\n    view: FeedbackView;\n    visible: boolean;\n    anchor: RefObject<HTMLButtonElement>;\n    onOutsideClick: () => void;\n    onSubmit: (data: FormData) => void;\n};\n\nconst DislikeVariantsPopup: React.FC<DislikeVariantsPopupProps> = memo(\n    ({anchor, visible, view, onOutsideClick, onSubmit}) => {\n        const {t} = useTranslation('feedback');\n        const {isVerticalView} = useContext(ControlsLayoutContext);\n        const position = useMemo(() => {\n            if (!view || view === FeedbackView.Regular) {\n                return isVerticalView ? PopperPosition.LEFT_START : PopperPosition.BOTTOM_END;\n            }\n\n            return PopperPosition.RIGHT;\n        }, [isVerticalView, view]);\n\n        const feedbackComment = useRef<FormPart<string> | null>(null);\n        const feedbackCheckboxes = useRef<FormPart<string[]> | null>(null);\n\n        const onFormSubmit = useCallback(\n            (event: SyntheticEvent) => {\n                event.preventDefault();\n\n                onSubmit({\n                    comment: feedbackComment.current?.data() || '',\n                    answers: feedbackCheckboxes.current?.data() || [],\n                });\n\n                feedbackComment.current?.clean();\n                feedbackCheckboxes.current?.clean();\n            },\n            [onSubmit],\n        );\n\n        return (\n            <Popup\n                anchorRef={anchor}\n                open={visible}\n                onOutsideClick={onOutsideClick}\n                contentClassName={b('variants-popup', {view})}\n                placement={position}\n            >\n                <h3 className={b('popup-title')}>{t<string>('dislike-variants-title')}</h3>\n                <form onSubmit={onFormSubmit}>\n                    <DislikeVariantsList ref={feedbackCheckboxes} />\n                    <DislikeVariantsInput ref={feedbackComment} />\n                    <div className={b('variants-actions')}>\n                        <Button view=\"action\" className={b('variants-action')} type={'submit'}>\n                            {t<string>('send-action-text')}\n                        </Button>\n                    </div>\n                </form>\n            </Popup>\n        );\n    },\n);\n\nDislikeVariantsPopup.displayName = 'FeedbackDislikeVariantsPopup';\n\nexport default DislikeVariantsPopup;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAWO;AAEP,mBAAgD;AAChD,yBAAkB;AAElB,mBAA6C;AAC7C,4BAAoC;AACpC,sBAA2B;AAM3B,IAAM,QAAI,mBAAAA,SAAM,aAAa;AAE7B,IAAM,0BAAsB;AAAA,MACxB,yBAA+B,CAAC,QAAQ,QAAQ;AAC5C,UAAM,EAAC,GAAG,KAAI,QAAI,6BAAe,mBAAmB;AACpD,UAAM,WAAW,KAAK,kBAAkB,KAAK,UAAU,mBAAmB;AAC1E,UAAM,CAAC,SAAS,UAAU,QAAI,uBAAS,CAAC,CAAuB;AAE/D,0CAAoB,KAAK,MAAM;AAC3B,aAAO;AAAA,QACH,OAAO;AACH,iBAAO,OAAO,KAAK,OAAO,EACrB,OAAO,CAAC,QAAQ,QAAQ,QAAQ,GAAG,CAAC,CAAC,EACrC,IAAI,CAAC,QAAQ,SAAS,GAAG,CAAC;AAAA,QACnC;AAAA,QAEA,QAAQ;AACJ,qBAAW,CAAC,CAAC;AAAA,QACjB;AAAA,MACJ;AAAA,IACJ,CAAC;AAED,QAAI,CAAC,OAAO,KAAK,QAAQ,EAAE,QAAQ;AAC/B,aAAO;AAAA,IACX;AAEA,WACI,6BAAAC,QAAA,cAAC,SAAI,WAAW,EAAE,UAAU,KACvB,OAAO,KAAK,QAAQ,EAAE,IAAI,CAAC,YACxB,6BAAAA,QAAA;AAAA,MAAC;AAAA;AAAA,QACG,KAAK;AAAA,QACL,WAAW,EAAE,SAAS;AAAA,QACtB,SAAS,QAAQ,OAAO;AAAA,QAExB,UAAU,CAAC,UAAU;AACjB,qBAAW;AAAA,YACP,GAAG;AAAA,YACH,CAAC,OAAO,GAAG;AAAA,UACf,CAAC;AAAA,QACL;AAAA,QACA,SAAS,EAAU,OAAO;AAAA;AAAA,IAC9B,CACH,CACL;AAAA,EAER,CAAC;AACL;AAEA,oBAAoB,cAAc;AAElC,IAAM,2BAAuB;AAAA,MACzB,yBAA6B,CAAC,QAAQ,QAAQ;AAC1C,UAAM,EAAC,EAAC,QAAI,6BAAe,UAAU;AACrC,UAAM,CAAC,iBAAiB,kBAAkB,QAAI,uBAAS,EAAE;AACzD,UAAM,eAAW,0BAAY,CAAC,UAA0B;AACpD,yBAAoB,MAAM,OAA+B,KAAK;AAAA,IAClE,GAAG,CAAC,CAAC;AAEL,0CAAoB,KAAK,MAAM;AAC3B,aAAO;AAAA,QACH,OAAO;AACH,iBAAO;AAAA,QACX;AAAA,QAEA,QAAQ;AACJ,6BAAmB,EAAE;AAAA,QACzB;AAAA,MACJ;AAAA,IACJ,CAAC;AAED,WACI,6BAAAA,QAAA,cAAC,SAAI,WAAW,EAAE,UAAU,KACxB,6BAAAA,QAAA;AAAA,MAAC;AAAA;AAAA,QACG,MAAK;AAAA,QACL,MAAM;AAAA,QACN,aAAa,EAAE,qBAAqB;AAAA,QACpC,UAAQ;AAAA,QACR,OAAO;AAAA,QACP;AAAA;AAAA,IACJ,CACJ;AAAA,EAER,CAAC;AACL;AAEA,qBAAqB,cAAc;AAoBnC,IAAM,2BAA4D;AAAA,EAC9D,CAAC,EAAC,QAAQ,SAAS,MAAM,gBAAgB,SAAQ,MAAM;AACnD,UAAM,EAAC,EAAC,QAAI,6BAAe,UAAU;AACrC,UAAM,EAAC,eAAc,QAAI,yBAAW,2CAAqB;AACzD,UAAM,eAAW,sBAAQ,MAAM;AAC3B,UAAI,CAAC,QAAQ,SAAS,6BAAa,SAAS;AACxC,eAAO,iBAAiB,4BAAe,aAAa,4BAAe;AAAA,MACvE;AAEA,aAAO,4BAAe;AAAA,IAC1B,GAAG,CAAC,gBAAgB,IAAI,CAAC;AAEzB,UAAM,sBAAkB,qBAAgC,IAAI;AAC5D,UAAM,yBAAqB,qBAAkC,IAAI;AAEjE,UAAM,mBAAe;AAAA,MACjB,CAAC,UAA0B;AACvB,cAAM,eAAe;AAErB,iBAAS;AAAA,UACL,SAAS,gBAAgB,SAAS,KAAK,KAAK;AAAA,UAC5C,SAAS,mBAAmB,SAAS,KAAK,KAAK,CAAC;AAAA,QACpD,CAAC;AAED,wBAAgB,SAAS,MAAM;AAC/B,2BAAmB,SAAS,MAAM;AAAA,MACtC;AAAA,MACA,CAAC,QAAQ;AAAA,IACb;AAEA,WACI,6BAAAA,QAAA;AAAA,MAAC;AAAA;AAAA,QACG,WAAW;AAAA,QACX,MAAM;AAAA,QACN;AAAA,QACA,kBAAkB,EAAE,kBAAkB,EAAC,KAAI,CAAC;AAAA,QAC5C,WAAW;AAAA;AAAA,MAEX,6BAAAA,QAAA,cAAC,QAAG,WAAW,EAAE,aAAa,KAAI,EAAU,wBAAwB,CAAE;AAAA,MACtE,6BAAAA,QAAA,cAAC,UAAK,UAAU,gBACZ,6BAAAA,QAAA,cAAC,uBAAoB,KAAK,oBAAoB,GAC9C,6BAAAA,QAAA,cAAC,wBAAqB,KAAK,iBAAiB,GAC5C,6BAAAA,QAAA,cAAC,SAAI,WAAW,EAAE,kBAAkB,KAChC,6BAAAA,QAAA,cAAC,uBAAO,MAAK,UAAS,WAAW,EAAE,iBAAiB,GAAG,MAAM,YACxD,EAAU,kBAAkB,CACjC,CACJ,CACJ;AAAA,IACJ;AAAA,EAER;AACJ;AAEA,qBAAqB,cAAc;AAEnC,IAAO,+BAAQ;",
+  "names": ["block", "React"]
+}

package/build/cjs/components/Feedback/controls/LikeControl.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import type { PopperPosition } from '../../../hooks';
+import { FeedbackView } from '../Feedback';
+type LikeControlProps = {
+    isVerticalView?: boolean | undefined;
+    isLiked: boolean | undefined;
+    className?: string | undefined;
+    view: FeedbackView | undefined;
+    onClick: () => void;
+    popupPosition?: PopperPosition | undefined;
+};
+declare const LikeControl: React.MemoExoticComponent<React.ForwardRefExoticComponent<LikeControlProps & React.RefAttributes<HTMLButtonElement>>>;
+export default LikeControl;

package/build/cjs/components/Feedback/controls/LikeControl.js

@@ -0,0 +1,81 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/Feedback/controls/LikeControl.tsx
+var LikeControl_exports = {};
+__export(LikeControl_exports, {
+  default: () => LikeControl_default
+});
+module.exports = __toCommonJS(LikeControl_exports);
+var import_react = __toESM(require("react"));
+var import_uikit = require("@gravity-ui/uikit");
+var import_bem_cn_lite = __toESM(require("bem-cn-lite"));
+var import_hooks = require("../../../hooks");
+var import_Control = require("../../Control");
+var import_ControlsLayout = require("../../Controls/ControlsLayout");
+var import_Feedback = require("../Feedback");
+var import_thumbs_up_fill = __toESM(require("@gravity-ui/icons/svgs/thumbs-up-fill.svg"));
+var import_thumbs_up = __toESM(require("@gravity-ui/icons/svgs/thumbs-up.svg"));
+var b = (0, import_bem_cn_lite.default)("dc-feedback");
+var LikeControl = (0, import_react.memo)(
+  (0, import_react.forwardRef)(({ isLiked, view, onClick }, ref) => {
+    const { t } = (0, import_hooks.useTranslation)("feedback");
+    const { isVerticalView, popupPosition, controlClassName } = (0, import_react.useContext)(import_ControlsLayout.ControlsLayoutContext);
+    const tooltipText = isLiked ? t("cancel-like-text") : t("like-text");
+    if (view === import_Feedback.FeedbackView.Wide) {
+      return /* @__PURE__ */ import_react.default.createElement(
+        import_uikit.Button,
+        {
+          size: "m",
+          view: "normal",
+          ref,
+          onClick,
+          className: b("control", { view })
+        },
+        /* @__PURE__ */ import_react.default.createElement(import_uikit.Button.Icon, null, /* @__PURE__ */ import_react.default.createElement(import_uikit.Icon, { data: isLiked ? import_thumbs_up_fill.default : import_thumbs_up.default, size: 14 })),
+        t("button-like-text")
+      );
+    }
+    return /* @__PURE__ */ import_react.default.createElement(
+      import_Control.Control,
+      {
+        onClick,
+        className: b("control", { view }, controlClassName),
+        isVerticalView,
+        tooltipText,
+        ref,
+        icon: (args) => /* @__PURE__ */ import_react.default.createElement(import_uikit.Icon, { data: isLiked ? import_thumbs_up_fill.default : import_thumbs_up.default, ...args }),
+        popupPosition
+      }
+    );
+  })
+);
+LikeControl.displayName = "LikeControl";
+var LikeControl_default = LikeControl;
+//# sourceMappingURL=LikeControl.js.map

package/build/cjs/components/Feedback/controls/LikeControl.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/components/Feedback/controls/LikeControl.tsx"],
+  "sourcesContent": ["import React, {forwardRef, memo, useContext} from 'react';\n\nimport {Button, Icon} from '@gravity-ui/uikit';\nimport block from 'bem-cn-lite';\n\nimport type {PopperPosition} from '../../../hooks';\nimport {useTranslation} from '../../../hooks';\nimport {Control} from '../../Control';\nimport {ControlsLayoutContext} from '../../Controls/ControlsLayout';\nimport {FeedbackView} from '../Feedback';\n\nimport LikeActiveIcon from '@gravity-ui/icons/svgs/thumbs-up-fill.svg';\nimport LikeIcon from '@gravity-ui/icons/svgs/thumbs-up.svg';\n\ntype LikeControlProps = {\n    isVerticalView?: boolean | undefined;\n    isLiked: boolean | undefined;\n    className?: string | undefined;\n    view: FeedbackView | undefined;\n    onClick: () => void;\n    popupPosition?: PopperPosition | undefined;\n};\n\nconst b = block('dc-feedback');\n\nconst LikeControl = memo(\n    forwardRef<HTMLButtonElement, LikeControlProps>(({isLiked, view, onClick}, ref) => {\n        const {t} = useTranslation('feedback');\n        const {isVerticalView, popupPosition, controlClassName} = useContext(ControlsLayoutContext);\n        const tooltipText = isLiked ? t('cancel-like-text') : t('like-text');\n\n        if (view === FeedbackView.Wide) {\n            return (\n                <Button\n                    size=\"m\"\n                    view=\"normal\"\n                    ref={ref}\n                    onClick={onClick}\n                    className={b('control', {view})}\n                >\n                    <Button.Icon>\n                        <Icon data={isLiked ? LikeActiveIcon : LikeIcon} size={14} />\n                    </Button.Icon>\n                    {t<string>('button-like-text')}\n                </Button>\n            );\n        }\n\n        return (\n            <Control\n                onClick={onClick}\n                className={b('control', {view}, controlClassName)}\n                isVerticalView={isVerticalView}\n                tooltipText={tooltipText}\n                ref={ref}\n                icon={(args) => <Icon data={isLiked ? LikeActiveIcon : LikeIcon} {...args} />}\n                popupPosition={popupPosition}\n            />\n        );\n    }),\n);\n\nLikeControl.displayName = 'LikeControl';\n\nexport default LikeControl;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkD;AAElD,mBAA2B;AAC3B,yBAAkB;AAGlB,mBAA6B;AAC7B,qBAAsB;AACtB,4BAAoC;AACpC,sBAA2B;AAE3B,4BAA2B;AAC3B,uBAAqB;AAWrB,IAAM,QAAI,mBAAAA,SAAM,aAAa;AAE7B,IAAM,kBAAc;AAAA,MAChB,yBAAgD,CAAC,EAAC,SAAS,MAAM,QAAO,GAAG,QAAQ;AAC/E,UAAM,EAAC,EAAC,QAAI,6BAAe,UAAU;AACrC,UAAM,EAAC,gBAAgB,eAAe,iBAAgB,QAAI,yBAAW,2CAAqB;AAC1F,UAAM,cAAc,UAAU,EAAE,kBAAkB,IAAI,EAAE,WAAW;AAEnE,QAAI,SAAS,6BAAa,MAAM;AAC5B,aACI,6BAAAC,QAAA;AAAA,QAAC;AAAA;AAAA,UACG,MAAK;AAAA,UACL,MAAK;AAAA,UACL;AAAA,UACA;AAAA,UACA,WAAW,EAAE,WAAW,EAAC,KAAI,CAAC;AAAA;AAAA,QAE9B,6BAAAA,QAAA,cAAC,oBAAO,MAAP,MACG,6BAAAA,QAAA,cAAC,qBAAK,MAAM,UAAU,sBAAAC,UAAiB,iBAAAC,SAAU,MAAM,IAAI,CAC/D;AAAA,QACC,EAAU,kBAAkB;AAAA,MACjC;AAAA,IAER;AAEA,WACI,6BAAAF,QAAA;AAAA,MAAC;AAAA;AAAA,QACG;AAAA,QACA,WAAW,EAAE,WAAW,EAAC,KAAI,GAAG,gBAAgB;AAAA,QAChD;AAAA,QACA;AAAA,QACA;AAAA,QACA,MAAM,CAAC,SAAS,6BAAAA,QAAA,cAAC,qBAAK,MAAM,UAAU,sBAAAC,UAAiB,iBAAAC,SAAW,GAAG,MAAM;AAAA,QAC3E;AAAA;AAAA,IACJ;AAAA,EAER,CAAC;AACL;AAEA,YAAY,cAAc;AAE1B,IAAO,sBAAQ;",
+  "names": ["block", "React", "LikeActiveIcon", "LikeIcon"]
+}

package/build/cjs/components/Feedback/controls/SuccessPopup.d.ts

@@ -0,0 +1,10 @@
+import React, { RefObject } from 'react';
+import { FeedbackView } from '../Feedback';
+type SuccessPopupProps = {
+    view: FeedbackView;
+    visible: boolean;
+    anchor: RefObject<HTMLButtonElement>;
+    onOutsideClick: () => void;
+};
+declare const SuccessPopup: React.NamedExoticComponent<SuccessPopupProps>;
+export default SuccessPopup;