@diplodoc/components 0.0.0-rc-pdf-icon-custimization-24387828749

package/build/cjs/components/Control/Control.js

@@ -0,0 +1,125 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b2) => {
+  for (var prop in b2 || (b2 = {}))
+    if (__hasOwnProp.call(b2, prop))
+      __defNormalProp(a, prop, b2[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b2)) {
+      if (__propIsEnum.call(b2, prop))
+        __defNormalProp(a, prop, b2[prop]);
+    }
+  return a;
+};
+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/Control/Control.tsx
+var Control_exports = {};
+__export(Control_exports, {
+  default: () => Control_default
+});
+module.exports = __toCommonJS(Control_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_models = require("../../models");
+var import_utils = require("../../utils");
+var import_Control = require("./Control.css");
+var b = (0, import_bem_cn_lite.default)("dc-control");
+var ICONS_SIZES = {
+  [import_models.ControlSizes.M]: 16,
+  [import_models.ControlSizes.L]: 20,
+  [import_models.ControlSizes.XL]: 20
+};
+var Control = (0, import_react.forwardRef)((props, ref) => {
+  const {
+    onClick,
+    className,
+    tooltipText,
+    isTooltipHidden,
+    isWideView,
+    isVerticalView,
+    size = import_models.ControlSizes.M,
+    icon,
+    popupPosition,
+    buttonExtraProps: extraProps,
+    href,
+    target,
+    rel
+  } = props;
+  const controlRef = (0, import_react.useRef)(null);
+  const popupState = (0, import_hooks.usePopupState)({ autoclose: 3e3 });
+  const direction = (0, import_uikit.useDirection)();
+  const getTooltipAlign = (0, import_react.useCallback)(() => {
+    if (popupPosition) {
+      return popupPosition;
+    }
+    return (0, import_utils.getPopupPosition)(isVerticalView, direction);
+  }, [isVerticalView, popupPosition, direction]);
+  (0, import_react.useImperativeHandle)(ref, () => controlRef.current, []);
+  const position = getTooltipAlign();
+  const Icon = icon;
+  const iconSize = ICONS_SIZES[size];
+  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(
+    import_uikit.Button,
+    __spreadValues(__spreadValues({
+      ref: controlRef,
+      view: "flat-secondary",
+      className: b(null, className),
+      onClick,
+      onMouseEnter: popupState.open,
+      onMouseLeave: popupState.close,
+      "aria-label": tooltipText,
+      size
+    }, href ? { href, target, rel } : {}), extraProps),
+    /* @__PURE__ */ import_react.default.createElement(import_uikit.Button.Icon, null, /* @__PURE__ */ import_react.default.createElement(Icon, { width: iconSize, height: iconSize })),
+    isWideView ? tooltipText : null
+  ), controlRef.current && /* @__PURE__ */ import_react.default.createElement(
+    import_uikit.Popup,
+    {
+      anchorElement: controlRef.current,
+      open: isTooltipHidden ? false : popupState.visible,
+      onOpenChange: (open) => {
+        if (!open) {
+          popupState.close();
+        }
+      },
+      className: b("tooltip"),
+      placement: position,
+      returnFocus: false
+    },
+    /* @__PURE__ */ import_react.default.createElement("span", { className: b("tooltip-text") }, tooltipText)
+  ));
+});
+Control.displayName = "DCControl";
+var Control_default = Control;
+//# sourceMappingURL=Control.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/components/Control/Control.tsx"],
+  "sourcesContent": ["import type {ButtonProps} from '@gravity-ui/uikit';\nimport type {PopperPosition} from '../../hooks';\n\nimport React, {forwardRef, useCallback, useImperativeHandle, useRef} from 'react';\nimport {Button, Popup, useDirection} from '@gravity-ui/uikit';\nimport block from 'bem-cn-lite';\n\nimport {usePopupState} from '../../hooks';\nimport {ControlSizes} from '../../models';\nimport {getPopupPosition} from '../../utils';\n\nimport './Control.scss';\n\nconst b = block('dc-control');\n\nexport interface IconProps {\n    width: number;\n    height: number;\n}\n\nexport interface ControlProps {\n    onClick?: () => void;\n    setRef?: (ref: HTMLButtonElement) => void;\n    isWideView?: boolean;\n    isVerticalView?: boolean;\n    tooltipText: string;\n    isTooltipHidden?: boolean;\n    className?: string;\n    href?: string;\n    target?: string;\n    rel?: string;\n    size?: ControlSizes;\n    icon: React.FC<IconProps>;\n    popupPosition?: PopperPosition;\n    buttonExtraProps?: ButtonProps['extraProps'];\n}\n\nconst ICONS_SIZES = {\n    [ControlSizes.M]: 16,\n    [ControlSizes.L]: 20,\n    [ControlSizes.XL]: 20,\n};\n\nconst Control = forwardRef<HTMLButtonElement, ControlProps>((props, ref) => {\n    const {\n        onClick,\n        className,\n        tooltipText,\n        isTooltipHidden,\n        isWideView,\n        isVerticalView,\n        size = ControlSizes.M,\n        icon,\n        popupPosition,\n        buttonExtraProps: extraProps,\n        href,\n        target,\n        rel,\n    } = props;\n\n    const controlRef = useRef<HTMLButtonElement | null>(null);\n\n    const popupState = usePopupState({autoclose: 3000});\n    const direction = useDirection();\n\n    const getTooltipAlign = useCallback(() => {\n        if (popupPosition) {\n            return popupPosition;\n        }\n\n        return getPopupPosition(isVerticalView, direction);\n    }, [isVerticalView, popupPosition, direction]);\n\n    useImperativeHandle(ref, () => controlRef.current as HTMLButtonElement, []);\n\n    const position = getTooltipAlign();\n    const Icon = icon;\n    const iconSize = ICONS_SIZES[size];\n\n    return (\n        <React.Fragment>\n            <Button\n                ref={controlRef}\n                view=\"flat-secondary\"\n                className={b(null, className)}\n                onClick={onClick}\n                onMouseEnter={popupState.open}\n                onMouseLeave={popupState.close}\n                aria-label={tooltipText}\n                size={size}\n                // eslint-disable-next-line @typescript-eslint/no-explicit-any\n                {...(href ? ({href, target, rel} as any) : {})} // Button cannot detect type automatically\n                {...extraProps}\n            >\n                <Button.Icon>\n                    <Icon width={iconSize} height={iconSize} />\n                </Button.Icon>\n                {isWideView ? tooltipText : null}\n            </Button>\n            {controlRef.current && (\n                <Popup\n                    anchorElement={controlRef.current}\n                    open={isTooltipHidden ? false : popupState.visible}\n                    onOpenChange={(open) => {\n                        if (!open) {\n                            popupState.close();\n                        }\n                    }}\n                    className={b('tooltip')}\n                    placement={position}\n                    returnFocus={false}\n                >\n                    <span className={b('tooltip-text')}>{tooltipText}</span>\n                </Popup>\n            )}\n        </React.Fragment>\n    );\n});\n\nControl.displayName = 'DCControl';\n\nexport default Control;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,mBAA0E;AAC1E,mBAA0C;AAC1C,yBAAkB;AAElB,mBAA4B;AAC5B,oBAA2B;AAC3B,mBAA+B;AAE/B,qBAAO;AAEP,IAAM,QAAI,mBAAAA,SAAM,YAAY;AAwB5B,IAAM,cAAc;AAAA,EAChB,CAAC,2BAAa,CAAC,GAAG;AAAA,EAClB,CAAC,2BAAa,CAAC,GAAG;AAAA,EAClB,CAAC,2BAAa,EAAE,GAAG;AACvB;AAEA,IAAM,cAAU,yBAA4C,CAAC,OAAO,QAAQ;AACxE,QAAM;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO,2BAAa;AAAA,IACpB;AAAA,IACA;AAAA,IACA,kBAAkB;AAAA,IAClB;AAAA,IACA;AAAA,IACA;AAAA,EACJ,IAAI;AAEJ,QAAM,iBAAa,qBAAiC,IAAI;AAExD,QAAM,iBAAa,4BAAc,EAAC,WAAW,IAAI,CAAC;AAClD,QAAM,gBAAY,2BAAa;AAE/B,QAAM,sBAAkB,0BAAY,MAAM;AACtC,QAAI,eAAe;AACf,aAAO;AAAA,IACX;AAEA,eAAO,+BAAiB,gBAAgB,SAAS;AAAA,EACrD,GAAG,CAAC,gBAAgB,eAAe,SAAS,CAAC;AAE7C,wCAAoB,KAAK,MAAM,WAAW,SAA8B,CAAC,CAAC;AAE1E,QAAM,WAAW,gBAAgB;AACjC,QAAM,OAAO;AACb,QAAM,WAAW,YAAY,IAAI;AAEjC,SACI,6BAAAC,QAAA,cAAC,aAAAA,QAAM,UAAN,MACG,6BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACG,KAAK;AAAA,MACL,MAAK;AAAA,MACL,WAAW,EAAE,MAAM,SAAS;AAAA,MAC5B;AAAA,MACA,cAAc,WAAW;AAAA,MACzB,cAAc,WAAW;AAAA,MACzB,cAAY;AAAA,MACZ;AAAA,OAEK,OAAQ,EAAC,MAAM,QAAQ,IAAG,IAAY,CAAC,IACxC;AAAA,IAEJ,6BAAAA,QAAA,cAAC,oBAAO,MAAP,MACG,6BAAAA,QAAA,cAAC,QAAK,OAAO,UAAU,QAAQ,UAAU,CAC7C;AAAA,IACC,aAAa,cAAc;AAAA,EAChC,GACC,WAAW,WACR,6BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACG,eAAe,WAAW;AAAA,MAC1B,MAAM,kBAAkB,QAAQ,WAAW;AAAA,MAC3C,cAAc,CAAC,SAAS;AACpB,YAAI,CAAC,MAAM;AACP,qBAAW,MAAM;AAAA,QACrB;AAAA,MACJ;AAAA,MACA,WAAW,EAAE,SAAS;AAAA,MACtB,WAAW;AAAA,MACX,aAAa;AAAA;AAAA,IAEb,6BAAAA,QAAA,cAAC,UAAK,WAAW,EAAE,cAAc,KAAI,WAAY;AAAA,EACrD,CAER;AAER,CAAC;AAED,QAAQ,cAAc;AAEtB,IAAO,kBAAQ;",
+  "names": ["block", "React"]
+}

package/build/cjs/components/Control/__tests__/Control.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/build/cjs/components/Control/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Control';
+export { default as Control } from './Control';

package/build/cjs/components/Control/index.js

@@ -0,0 +1,39 @@
+"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 __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
+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/Control/index.ts
+var Control_exports = {};
+__export(Control_exports, {
+  Control: () => import_Control.default
+});
+module.exports = __toCommonJS(Control_exports);
+__reExport(Control_exports, require("./Control"), module.exports);
+var import_Control = __toESM(require("./Control"));
+//# sourceMappingURL=index.js.map

package/build/cjs/components/Control/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/components/Control/index.ts"],
+  "sourcesContent": ["export * from './Control';\nexport {default as Control} from './Control';\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,4BAAc,sBAAd;AACA,qBAAiC;",
+  "names": []
+}

package/build/cjs/components/Controls/Controls.css

@@ -0,0 +1,37 @@
+/* src/components/Controls/Controls.scss */
+.dc-controls {
+  display: flex;
+  font-size: var(--g-text-body-1-font-size);
+  line-height: var(--g-text-body-1-line-height);
+}
+.dc-controls__control:not(:last-child),
+.dc-controls__divider {
+  margin-right: 4px;
+}
+.dc-controls__list {
+  padding: 4px 0;
+}
+.dc-controls__list-icon {
+  font-size: 22px;
+}
+.dc-controls__icon-rotated {
+  transform: rotate(90deg);
+}
+.dc-controls__popup-tooltip {
+  padding: 0;
+}
+@media (min-width: 769px) {
+  .dc-controls_vertical {
+    flex-direction: column;
+  }
+  .dc-controls_vertical .dc-controls__divider {
+    height: 1px;
+    width: 16px;
+  }
+  .dc-controls_vertical .dc-controls__control:not(:last-child),
+  .dc-controls_vertical .dc-controls__divider {
+    margin-right: 0;
+    margin-bottom: 4px;
+  }
+}
+/*# sourceMappingURL=Controls.css.map */

package/build/cjs/components/Controls/Controls.css.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/components/Controls/Controls.scss", "../../../../src/styles/mixins.scss", "../../../../src/components/Controls/%3Cinput css 8Wjek4%3E"],
+  "sourcesContent": ["@use 'sass:map';\n@use '../../styles/mixins';\n@use '../../styles/variables';\n\n.dc-controls {\n    display: flex;\n\n    @include mixins.text-size(body-1);\n\n    &__control:not(:last-child),\n    &__divider {\n        margin-right: 4px;\n    }\n\n    &__list {\n        padding: 4px 0;\n    }\n\n    &__list-icon {\n        font-size: 22px;\n    }\n\n    &__icon-rotated {\n        transform: rotate(90deg);\n    }\n\n    &__popup-tooltip {\n        padding: 0;\n    }\n\n    @media (min-width: map.get(variables.$screenBreakpoints, 'md')) {\n        &_vertical {\n            flex-direction: column;\n        }\n\n        &_vertical &__divider {\n            height: 1px;\n            width: 16px;\n        }\n\n        &_vertical &__control:not(:last-child),\n        &_vertical &__divider {\n            margin-right: 0;\n            margin-bottom: 4px;\n        }\n    }\n}\n", "@use 'sass:map';\n@use 'variables';\n\n@mixin text-size($name) {\n    font-size: var(--g-text-#{$name}-font-size);\n    line-height: var(--g-text-#{$name}-line-height);\n}\n\n@mixin reset-list-style() {\n    margin: 0;\n    padding: 0;\n    list-style: none;\n}\n\n@mixin fixAnchorPosition($offset: 0px) {\n    padding-top: calc(var(--dc-header-height, #{variables.$headerHeight}));\n    margin-top: calc(#{$offset} - var(--dc-header-height, #{variables.$headerHeight}));\n}\n\n@mixin reset-link-style() {\n    color: inherit;\n    text-decoration: none;\n}\n\n@mixin islands-focus() {\n    outline: none;\n\n    .utilityfocus &:focus {\n        outline: 2px solid #ffdb4d;\n    }\n}\n\n@mixin focusable($offset: 0, $mode: 'outline') {\n    @if $mode == 'outline' {\n        &:focus {\n            outline: 2px solid var(--g-color-line-focus);\n            outline-offset: $offset;\n        }\n        &:focus:not(:focus-visible) {\n            outline: 0;\n        }\n    }\n\n    @if $mode == 'box-shadow' {\n        &:focus {\n            box-shadow: 0 0 0 2px var(--g-color-line-focus);\n            outline: 0;\n        }\n        &:focus:not(:focus-visible) {\n            box-shadow: none;\n        }\n    }\n}\n\n@mixin link() {\n    color: var(--g-color-text-link);\n    text-decoration: none;\n    cursor: pointer;\n    border-radius: var(--g-focus-border-radius);\n\n    @include islands-focus();\n\n    @include focusable(0, 'box-shadow');\n\n    &:hover,\n    &:active {\n        color: var(--g-color-text-link-hover);\n    }\n}\n\n@mixin heading1() {\n    font-weight: 500;\n\n    @include text-size(display-3);\n\n    @media (max-width: map.get(variables.$screenBreakpoints, 'md') - 1) {\n        @include text-size(display-2);\n    }\n}\n\n@mixin heading2() {\n    font-weight: 500;\n\n    @include text-size(display-1);\n}\n\n@mixin heading3() {\n    font-weight: 500;\n\n    @include text-size(header-2);\n}\n\n@mixin heading4() {\n    font-weight: 500;\n\n    @include text-size(header-1);\n}\n\n@mixin heading5() {\n    font-weight: 500;\n\n    @include text-size(body-3);\n}\n\n@mixin heading6() {\n    font-weight: 400;\n\n    @include text-size(body-3);\n}\n\n@mixin contributors-text() {\n    font-size: 13px;\n    font-weight: 400;\n    margin-right: 5px;\n    align-self: center;\n}\n\n@mixin text-body-1() {\n    font-size: var(--g-text-body-1-font-size);\n    line-height: var(--g-text-body-1-line-height);\n    font-weight: var(--g-text-body-font-weight);\n}\n\n@mixin desktop-only() {\n    @media (max-width: map.get(variables.$screenBreakpoints, 'md') - 1) {\n        display: none;\n    }\n}\n\n@mixin desktop-tablet-only() {\n    @media (max-width: map.get(variables.$screenBreakpoints, 'sm') - 1) {\n        display: none;\n    }\n}\n\n@mixin mobile-tablet-only() {\n    @media (min-width: map.get(variables.$screenBreakpoints, 'md')) {\n        display: none;\n    }\n}\n\n@mixin mobile-only() {\n    @media (min-width: map.get(variables.$screenBreakpoints, 'sm')) {\n        display: none;\n    }\n}\n", ".dc-controls {\n  display: flex;\n  font-size: var(--g-text-body-1-font-size);\n  line-height: var(--g-text-body-1-line-height);\n}\n.dc-controls__control:not(:last-child), .dc-controls__divider {\n  margin-right: 4px;\n}\n.dc-controls__list {\n  padding: 4px 0;\n}\n.dc-controls__list-icon {\n  font-size: 22px;\n}\n.dc-controls__icon-rotated {\n  transform: rotate(90deg);\n}\n.dc-controls__popup-tooltip {\n  padding: 0;\n}\n@media (min-width: 769px) {\n  .dc-controls_vertical {\n    flex-direction: column;\n  }\n  .dc-controls_vertical .dc-controls__divider {\n    height: 1px;\n    width: 16px;\n  }\n  .dc-controls_vertical .dc-controls__control:not(:last-child), .dc-controls_vertical .dc-controls__divider {\n    margin-right: 0;\n    margin-bottom: 4px;\n  }\n}\n/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VSb290IjoiL2hvbWUvcnVubmVyL3dvcmsvY29tcG9uZW50cy9jb21wb25lbnRzL3NyYy9jb21wb25lbnRzL0NvbnRyb2xzIiwic291cmNlcyI6WyJDb250cm9scy5zY3NzIiwiLi4vLi4vc3R5bGVzL21peGlucy5zY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUlBO0VBQ0k7RUNEQTtFQUNBOztBRElBO0VBRUk7O0FBR0o7RUFDSTs7QUFHSjtFQUNJOztBQUdKO0VBQ0k7O0FBR0o7RUFDSTs7QUFHSjtFQUNJO0lBQ0k7O0VBR0o7SUFDSTtJQUNBOztFQUdKO0lBRUk7SUFDQSIsInNvdXJjZXNDb250ZW50IjpbIkB1c2UgJ3Nhc3M6bWFwJztcbkB1c2UgJy4uLy4uL3N0eWxlcy9taXhpbnMnO1xuQHVzZSAnLi4vLi4vc3R5bGVzL3ZhcmlhYmxlcyc7XG5cbi5kYy1jb250cm9scyB7XG4gICAgZGlzcGxheTogZmxleDtcblxuICAgIEBpbmNsdWRlIG1peGlucy50ZXh0LXNpemUoYm9keS0xKTtcblxuICAgICZfX2NvbnRyb2w6bm90KDpsYXN0LWNoaWxkKSxcbiAgICAmX19kaXZpZGVyIHtcbiAgICAgICAgbWFyZ2luLXJpZ2h0OiA0cHg7XG4gICAgfVxuXG4gICAgJl9fbGlzdCB7XG4gICAgICAgIHBhZGRpbmc6IDRweCAwO1xuICAgIH1cblxuICAgICZfX2xpc3QtaWNvbiB7XG4gICAgICAgIGZvbnQtc2l6ZTogMjJweDtcbiAgICB9XG5cbiAgICAmX19pY29uLXJvdGF0ZWQge1xuICAgICAgICB0cmFuc2Zvcm06IHJvdGF0ZSg5MGRlZyk7XG4gICAgfVxuXG4gICAgJl9fcG9wdXAtdG9vbHRpcCB7XG4gICAgICAgIHBhZGRpbmc6IDA7XG4gICAgfVxuXG4gICAgQG1lZGlhIChtaW4td2lkdGg6IG1hcC5nZXQodmFyaWFibGVzLiRzY3JlZW5CcmVha3BvaW50cywgJ21kJykpIHtcbiAgICAgICAgJl92ZXJ0aWNhbCB7XG4gICAgICAgICAgICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICAgICAgICB9XG5cbiAgICAgICAgJl92ZXJ0aWNhbCAmX19kaXZpZGVyIHtcbiAgICAgICAgICAgIGhlaWdodDogMXB4O1xuICAgICAgICAgICAgd2lkdGg6IDE2cHg7XG4gICAgICAgIH1cblxuICAgICAgICAmX3ZlcnRpY2FsICZfX2NvbnRyb2w6bm90KDpsYXN0LWNoaWxkKSxcbiAgICAgICAgJl92ZXJ0aWNhbCAmX19kaXZpZGVyIHtcbiAgICAgICAgICAgIG1hcmdpbi1yaWdodDogMDtcbiAgICAgICAgICAgIG1hcmdpbi1ib3R0b206IDRweDtcbiAgICAgICAgfVxuICAgIH1cbn1cbiIsIkB1c2UgJ3Nhc3M6bWFwJztcbkB1c2UgJ3ZhcmlhYmxlcyc7XG5cbkBtaXhpbiB0ZXh0LXNpemUoJG5hbWUpIHtcbiAgICBmb250LXNpemU6IHZhcigtLWctdGV4dC0jeyRuYW1lfS1mb250LXNpemUpO1xuICAgIGxpbmUtaGVpZ2h0OiB2YXIoLS1nLXRleHQtI3skbmFtZX0tbGluZS1oZWlnaHQpO1xufVxuXG5AbWl4aW4gcmVzZXQtbGlzdC1zdHlsZSgpIHtcbiAgICBtYXJnaW46IDA7XG4gICAgcGFkZGluZzogMDtcbiAgICBsaXN0LXN0eWxlOiBub25lO1xufVxuXG5AbWl4aW4gZml4QW5jaG9yUG9zaXRpb24oJG9mZnNldDogMHB4KSB7XG4gICAgcGFkZGluZy10b3A6IGNhbGModmFyKC0tZGMtaGVhZGVyLWhlaWdodCwgI3t2YXJpYWJsZXMuJGhlYWRlckhlaWdodH0pKTtcbiAgICBtYXJnaW4tdG9wOiBjYWxjKCN7JG9mZnNldH0gLSB2YXIoLS1kYy1oZWFkZXItaGVpZ2h0LCAje3ZhcmlhYmxlcy4kaGVhZGVySGVpZ2h0fSkpO1xufVxuXG5AbWl4aW4gcmVzZXQtbGluay1zdHlsZSgpIHtcbiAgICBjb2xvcjogaW5oZXJpdDtcbiAgICB0ZXh0LWRlY29yYXRpb246IG5vbmU7XG59XG5cbkBtaXhpbiBpc2xhbmRzLWZvY3VzKCkge1xuICAgIG91dGxpbmU6IG5vbmU7XG5cbiAgICAudXRpbGl0eWZvY3VzICY6Zm9jdXMge1xuICAgICAgICBvdXRsaW5lOiAycHggc29saWQgI2ZmZGI0ZDtcbiAgICB9XG59XG5cbkBtaXhpbiBmb2N1c2FibGUoJG9mZnNldDogMCwgJG1vZGU6ICdvdXRsaW5lJykge1xuICAgIEBpZiAkbW9kZSA9PSAnb3V0bGluZScge1xuICAgICAgICAmOmZvY3VzIHtcbiAgICAgICAgICAgIG91dGxpbmU6IDJweCBzb2xpZCB2YXIoLS1nLWNvbG9yLWxpbmUtZm9jdXMpO1xuICAgICAgICAgICAgb3V0bGluZS1vZmZzZXQ6ICRvZmZzZXQ7XG4gICAgICAgIH1cbiAgICAgICAgJjpmb2N1czpub3QoOmZvY3VzLXZpc2libGUpIHtcbiAgICAgICAgICAgIG91dGxpbmU6IDA7XG4gICAgICAgIH1cbiAgICB9XG5cbiAgICBAaWYgJG1vZGUgPT0gJ2JveC1zaGFkb3cnIHtcbiAgICAgICAgJjpmb2N1cyB7XG4gICAgICAgICAgICBib3gtc2hhZG93OiAwIDAgMCAycHggdmFyKC0tZy1jb2xvci1saW5lLWZvY3VzKTtcbiAgICAgICAgICAgIG91dGxpbmU6IDA7XG4gICAgICAgIH1cbiAgICAgICAgJjpmb2N1czpub3QoOmZvY3VzLXZpc2libGUpIHtcbiAgICAgICAgICAgIGJveC1zaGFkb3c6IG5vbmU7XG4gICAgICAgIH1cbiAgICB9XG59XG5cbkBtaXhpbiBsaW5rKCkge1xuICAgIGNvbG9yOiB2YXIoLS1nLWNvbG9yLXRleHQtbGluayk7XG4gICAgdGV4dC1kZWNvcmF0aW9uOiBub25lO1xuICAgIGN1cnNvcjogcG9pbnRlcjtcbiAgICBib3JkZXItcmFkaXVzOiB2YXIoLS1nLWZvY3VzLWJvcmRlci1yYWRpdXMpO1xuXG4gICAgQGluY2x1ZGUgaXNsYW5kcy1mb2N1cygpO1xuXG4gICAgQGluY2x1ZGUgZm9jdXNhYmxlKDAsICdib3gtc2hhZG93Jyk7XG5cbiAgICAmOmhvdmVyLFxuICAgICY6YWN0aXZlIHtcbiAgICAgICAgY29sb3I6IHZhcigtLWctY29sb3ItdGV4dC1saW5rLWhvdmVyKTtcbiAgICB9XG59XG5cbkBtaXhpbiBoZWFkaW5nMSgpIHtcbiAgICBmb250LXdlaWdodDogNTAwO1xuXG4gICAgQGluY2x1ZGUgdGV4dC1zaXplKGRpc3BsYXktMyk7XG5cbiAgICBAbWVkaWEgKG1heC13aWR0aDogbWFwLmdldCh2YXJpYWJsZXMuJHNjcmVlbkJyZWFrcG9pbnRzLCAnbWQnKSAtIDEpIHtcbiAgICAgICAgQGluY2x1ZGUgdGV4dC1zaXplKGRpc3BsYXktMik7XG4gICAgfVxufVxuXG5AbWl4aW4gaGVhZGluZzIoKSB7XG4gICAgZm9udC13ZWlnaHQ6IDUwMDtcblxuICAgIEBpbmNsdWRlIHRleHQtc2l6ZShkaXNwbGF5LTEpO1xufVxuXG5AbWl4aW4gaGVhZGluZzMoKSB7XG4gICAgZm9udC13ZWlnaHQ6IDUwMDtcblxuICAgIEBpbmNsdWRlIHRleHQtc2l6ZShoZWFkZXItMik7XG59XG5cbkBtaXhpbiBoZWFkaW5nNCgpIHtcbiAgICBmb250LXdlaWdodDogNTAwO1xuXG4gICAgQGluY2x1ZGUgdGV4dC1zaXplKGhlYWRlci0xKTtcbn1cblxuQG1peGluIGhlYWRpbmc1KCkge1xuICAgIGZvbnQtd2VpZ2h0OiA1MDA7XG5cbiAgICBAaW5jbHVkZSB0ZXh0LXNpemUoYm9keS0zKTtcbn1cblxuQG1peGluIGhlYWRpbmc2KCkge1xuICAgIGZvbnQtd2VpZ2h0OiA0MDA7XG5cbiAgICBAaW5jbHVkZSB0ZXh0LXNpemUoYm9keS0zKTtcbn1cblxuQG1peGluIGNvbnRyaWJ1dG9ycy10ZXh0KCkge1xuICAgIGZvbnQtc2l6ZTogMTNweDtcbiAgICBmb250LXdlaWdodDogNDAwO1xuICAgIG1hcmdpbi1yaWdodDogNXB4O1xuICAgIGFsaWduLXNlbGY6IGNlbnRlcjtcbn1cblxuQG1peGluIHRleHQtYm9keS0xKCkge1xuICAgIGZvbnQtc2l6ZTogdmFyKC0tZy10ZXh0LWJvZHktMS1mb250LXNpemUpO1xuICAgIGxpbmUtaGVpZ2h0OiB2YXIoLS1nLXRleHQtYm9keS0xLWxpbmUtaGVpZ2h0KTtcbiAgICBmb250LXdlaWdodDogdmFyKC0tZy10ZXh0LWJvZHktZm9udC13ZWlnaHQpO1xufVxuXG5AbWl4aW4gZGVza3RvcC1vbmx5KCkge1xuICAgIEBtZWRpYSAobWF4LXdpZHRoOiBtYXAuZ2V0KHZhcmlhYmxlcy4kc2NyZWVuQnJlYWtwb2ludHMsICdtZCcpIC0gMSkge1xuICAgICAgICBkaXNwbGF5OiBub25lO1xuICAgIH1cbn1cblxuQG1peGluIGRlc2t0b3AtdGFibGV0LW9ubHkoKSB7XG4gICAgQG1lZGlhIChtYXgtd2lkdGg6IG1hcC5nZXQodmFyaWFibGVzLiRzY3JlZW5CcmVha3BvaW50cywgJ3NtJykgLSAxKSB7XG4gICAgICAgIGRpc3BsYXk6IG5vbmU7XG4gICAgfVxufVxuXG5AbWl4aW4gbW9iaWxlLXRhYmxldC1vbmx5KCkge1xuICAgIEBtZWRpYSAobWluLXdpZHRoOiBtYXAuZ2V0KHZhcmlhYmxlcy4kc2NyZWVuQnJlYWtwb2ludHMsICdtZCcpKSB7XG4gICAgICAgIGRpc3BsYXk6IG5vbmU7XG4gICAgfVxufVxuXG5AbWl4aW4gbW9iaWxlLW9ubHkoKSB7XG4gICAgQG1lZGlhIChtaW4td2lkdGg6IG1hcC5nZXQodmFyaWFibGVzLiRzY3JlZW5CcmVha3BvaW50cywgJ3NtJykpIHtcbiAgICAgICAgZGlzcGxheTogbm9uZTtcbiAgICB9XG59XG4iXX0= */"],
+  "mappings": ";AAIA,CAAA;AACI,WAAA;ACDA,aAAA,IAAA;AACA,eAAA,IAAA;ACDJ;AFKI,CAAA,oBAAA,KAAA;AAAA,CAAA;AAEI,gBAAA;AEJR;AFOI,CAAA;AACI,WAAA,IAAA;AELR;AFQI,CAAA;AACI,aAAA;AENR;AFSI,CAAA;AACI,aAAA,OAAA;AEPR;AFUI,CAAA;AACI,WAAA;AERR;AFWI,QAAA,WAAA;AACI,GAAA;AACI,oBAAA;AETV;AFYM,GAJA,qBAIA,CA1BJ;AA2BQ,YAAA;AACA,WAAA;AEVV;AFaM,GATA,qBASA,CA/BJ,oBA+BI,KAAA;EAAA,CATA,qBASA,CA/BJ;AAiCQ,kBAAA;AACA,mBAAA;AEZV;AACF;",
+  "names": []
+}

package/build/cjs/components/Controls/Controls.d.ts

@@ -0,0 +1,42 @@
+import type { AvailableLangs, FeedbackSendData, Lang, LangOptions, SubscribeData, TextSizes, Theme } from '../../models';
+import React from 'react';
+import './Controls.scss';
+export interface ControlsProps {
+    lang?: `${Lang}` | Lang;
+    langs?: (`${Lang}` | Lang)[];
+    fullScreen?: boolean;
+    singlePage?: boolean;
+    wideFormat?: boolean;
+    showMiniToc?: boolean;
+    theme?: Theme;
+    textSize?: TextSizes;
+    vcsUrl?: string;
+    vcsType?: string;
+    isLiked?: boolean;
+    isDisliked?: boolean;
+    onChangeLang?: (lang: `${Lang}` | Lang, options?: LangOptions) => void;
+    onChangeFullScreen?: (value: boolean) => void;
+    onChangeSinglePage?: (value: boolean) => void;
+    onChangeWideFormat?: (value: boolean) => void;
+    onChangeShowMiniToc?: (value: boolean) => void;
+    onChangeTheme?: (theme: Theme) => void;
+    onChangeTextSize?: (textSize: TextSizes) => void;
+    onSendFeedback?: (data: FeedbackSendData) => void;
+    onSubscribe?: (data: SubscribeData) => void;
+    onEditClick?: () => void;
+    pdfLink?: string;
+    pdfIconConfig?: {
+        position?: string;
+        size?: 'S' | 'M' | 'L';
+        icon?: string;
+    };
+    className?: string;
+    hideEditControl?: boolean;
+    hideFeedbackControls?: boolean;
+    availableLangs?: AvailableLangs;
+}
+export declare const ControlsList: React.FC<ControlsProps & {
+    isHiddenFeedback: boolean;
+}>;
+declare const Controls: React.NamedExoticComponent<ControlsProps>;
+export default Controls;

package/build/cjs/components/Controls/Controls.js

@@ -0,0 +1,215 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b2) => {
+  for (var prop in b2 || (b2 = {}))
+    if (__hasOwnProp.call(b2, prop))
+      __defNormalProp(a, prop, b2[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b2)) {
+      if (__propIsEnum.call(b2, prop))
+        __defNormalProp(a, prop, b2[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b2) => __defProps(a, __getOwnPropDescs(b2));
+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/Controls/Controls.tsx
+var Controls_exports = {};
+__export(Controls_exports, {
+  ControlsList: () => ControlsList,
+  default: () => Controls_default
+});
+module.exports = __toCommonJS(Controls_exports);
+var import_react = __toESM(require("react"));
+var import_bem_cn_lite = __toESM(require("bem-cn-lite"));
+var import_Feedback = require("../Feedback");
+var import_Subscribe = require("../Subscribe");
+var import_hooks = require("../../hooks");
+var import_ControlsLayout = require("./ControlsLayout");
+var import__ = require("./");
+var import_Controls = require("./Controls.css");
+var b = (0, import_bem_cn_lite.default)("dc-controls");
+function hasLangs(langs) {
+  return (langs == null ? void 0 : langs.length) && langs.length > 1;
+}
+var ControlsList = (props) => {
+  const {
+    fullScreen,
+    singlePage,
+    theme,
+    wideFormat,
+    showMiniToc,
+    hideEditControl,
+    hideFeedbackControls,
+    textSize,
+    onChangeFullScreen,
+    onChangeTheme,
+    onChangeShowMiniToc,
+    onChangeTextSize,
+    onChangeWideFormat,
+    onChangeLang,
+    onChangeSinglePage,
+    onSendFeedback,
+    onSubscribe,
+    onEditClick,
+    lang,
+    langs,
+    pdfLink,
+    pdfIconConfig,
+    vcsUrl,
+    vcsType,
+    isLiked,
+    isDisliked,
+    isHiddenFeedback,
+    availableLangs = []
+  } = props;
+  const withFullscreenControl = Boolean(onChangeFullScreen);
+  const withSettingsControl = Boolean(
+    onChangeWideFormat || onChangeTheme || onChangeShowMiniToc || onChangeTextSize
+  );
+  const withLangControl = Boolean(lang && hasLangs(langs) && onChangeLang);
+  const withSinglePageControl = Boolean(onChangeSinglePage);
+  const withPdfControl = Boolean(pdfLink);
+  const withEditControl = Boolean(!singlePage && !hideEditControl && vcsUrl);
+  const withFeedbackControl = Boolean(
+    !singlePage && !hideFeedbackControls && !isHiddenFeedback && onSendFeedback
+  );
+  const withSubscribeControls = Boolean(!singlePage && onSubscribe);
+  const controls = [
+    withFullscreenControl && /* @__PURE__ */ import_react.default.createElement(
+      import__.FullScreenControl,
+      {
+        key: "fullscreen-control",
+        value: fullScreen,
+        onChange: onChangeFullScreen
+      }
+    ),
+    withSettingsControl && /* @__PURE__ */ import_react.default.createElement(
+      import__.SettingsControl,
+      {
+        key: "settings-control",
+        theme,
+        wideFormat,
+        showMiniToc,
+        textSize,
+        onChangeTheme,
+        onChangeShowMiniToc,
+        onChangeTextSize,
+        onChangeWideFormat
+      }
+    ),
+    withLangControl && /* @__PURE__ */ import_react.default.createElement(
+      import__.LangControl,
+      {
+        key: "lang-control",
+        lang,
+        langs,
+        availableLangs,
+        onChangeLang
+      }
+    ),
+    withSinglePageControl && /* @__PURE__ */ import_react.default.createElement(
+      import__.SinglePageControl,
+      {
+        key: "single-page-control",
+        value: singlePage,
+        onChange: onChangeSinglePage
+      }
+    ),
+    withPdfControl && /* @__PURE__ */ import_react.default.createElement(
+      import__.PdfControl,
+      {
+        key: "pdf-control",
+        pdfLink,
+        icon: pdfIconConfig == null ? void 0 : pdfIconConfig.icon,
+        size: pdfIconConfig == null ? void 0 : pdfIconConfig.size
+      }
+    ),
+    "---",
+    withEditControl && /* @__PURE__ */ import_react.default.createElement(
+      import__.EditControl,
+      {
+        key: "edit-control",
+        vcsUrl,
+        vcsType,
+        onClick: onEditClick
+      }
+    ),
+    "---",
+    withFeedbackControl && /* @__PURE__ */ import_react.default.createElement(
+      import_Feedback.Feedback,
+      {
+        key: "feedback-control",
+        isLiked,
+        isDisliked,
+        onSendFeedback,
+        view: import_Feedback.FeedbackView.Regular
+      }
+    ),
+    "---",
+    withSubscribeControls && /* @__PURE__ */ import_react.default.createElement(
+      import_Subscribe.Subscribe,
+      {
+        key: "subscribe-control",
+        onSubscribe,
+        view: import_Subscribe.SubscribeView.Regular
+      }
+    )
+  ].filter(Boolean).reduce((result, control, index, array) => {
+    if (control === "---") {
+      if (array[index - 1] && array[index + 1] && array[index + 1] !== "---") {
+        result.push(
+          /* @__PURE__ */ import_react.default.createElement(import__.DividerControl, { key: "divider-" + index, className: b("divider") })
+        );
+      }
+    } else {
+      result.push(control);
+    }
+    return result;
+  }, []);
+  return controls;
+};
+var Controls = (0, import_react.memo)((props) => {
+  const { isVerticalView } = (0, import_react.useContext)(import_ControlsLayout.ControlsLayoutContext);
+  const isHiddenFeedback = (0, import_hooks.useInterface)("feedback");
+  const { className } = props;
+  const controls = /* @__PURE__ */ import_react.default.createElement(ControlsList, __spreadProps(__spreadValues({}, props), { isHiddenFeedback }));
+  if (!controls) {
+    return null;
+  }
+  return /* @__PURE__ */ import_react.default.createElement("div", { className: b({ vertical: isVerticalView }, className) }, controls);
+});
+Controls.displayName = "DCControls";
+var Controls_default = Controls;
+//# sourceMappingURL=Controls.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/components/Controls/Controls.tsx"],
+  "sourcesContent": ["import type {\n    AvailableLangs,\n    ControlSizes,\n    FeedbackSendData,\n    Lang,\n    LangOptions,\n    SubscribeData,\n    TextSizes,\n    Theme,\n} from '../../models';\n\nimport React, {memo, useContext} from 'react';\nimport block from 'bem-cn-lite';\n\nimport {Feedback, FeedbackView} from '../Feedback';\nimport {Subscribe, SubscribeView} from '../Subscribe';\nimport {useInterface} from '../../hooks';\n\nimport {ControlsLayoutContext} from './ControlsLayout';\n\nimport {\n    DividerControl,\n    EditControl,\n    FullScreenControl,\n    LangControl,\n    PdfControl,\n    SettingsControl,\n    SinglePageControl,\n} from './';\n\n// eslint-disable-next-line import/order\nimport './Controls.scss';\n\nexport interface ControlsProps {\n    lang?: `${Lang}` | Lang;\n    langs?: (`${Lang}` | Lang)[];\n    fullScreen?: boolean;\n    singlePage?: boolean;\n    wideFormat?: boolean;\n    showMiniToc?: boolean;\n    theme?: Theme;\n    textSize?: TextSizes;\n    vcsUrl?: string;\n    vcsType?: string;\n    isLiked?: boolean;\n    isDisliked?: boolean;\n    onChangeLang?: (lang: `${Lang}` | Lang, options?: LangOptions) => void;\n    onChangeFullScreen?: (value: boolean) => void;\n    onChangeSinglePage?: (value: boolean) => void;\n    onChangeWideFormat?: (value: boolean) => void;\n    onChangeShowMiniToc?: (value: boolean) => void;\n    onChangeTheme?: (theme: Theme) => void;\n    onChangeTextSize?: (textSize: TextSizes) => void;\n    onSendFeedback?: (data: FeedbackSendData) => void;\n    onSubscribe?: (data: SubscribeData) => void;\n    onEditClick?: () => void;\n    pdfLink?: string;\n    pdfIconConfig?: {position?: string; size?: 'S' | 'M' | 'L'; icon?: string};\n    className?: string;\n    hideEditControl?: boolean;\n    hideFeedbackControls?: boolean;\n    availableLangs?: AvailableLangs;\n}\n\nconst b = block('dc-controls');\n\ntype Defined = {\n    [P in keyof ControlsProps]-?: ControlsProps[P];\n};\n\nfunction hasLangs(langs?: (`${Lang}` | Lang)[]) {\n    return langs?.length && langs.length > 1;\n}\n\nexport const ControlsList: React.FC<ControlsProps & {isHiddenFeedback: boolean}> = (props) => {\n    const {\n        fullScreen,\n        singlePage,\n        theme,\n        wideFormat,\n        showMiniToc,\n        hideEditControl,\n        hideFeedbackControls,\n        textSize,\n        onChangeFullScreen,\n        onChangeTheme,\n        onChangeShowMiniToc,\n        onChangeTextSize,\n        onChangeWideFormat,\n        onChangeLang,\n        onChangeSinglePage,\n        onSendFeedback,\n        onSubscribe,\n        onEditClick,\n        lang,\n        langs,\n        pdfLink,\n        pdfIconConfig,\n        vcsUrl,\n        vcsType,\n        isLiked,\n        isDisliked,\n        isHiddenFeedback,\n        availableLangs = [],\n    } = props;\n\n    const withFullscreenControl = Boolean(onChangeFullScreen);\n    const withSettingsControl = Boolean(\n        onChangeWideFormat || onChangeTheme || onChangeShowMiniToc || onChangeTextSize,\n    );\n    const withLangControl = Boolean(lang && hasLangs(langs) && onChangeLang);\n    const withSinglePageControl = Boolean(onChangeSinglePage);\n    const withPdfControl = Boolean(pdfLink);\n    const withEditControl = Boolean(!singlePage && !hideEditControl && vcsUrl);\n    const withFeedbackControl = Boolean(\n        !singlePage && !hideFeedbackControls && !isHiddenFeedback && onSendFeedback,\n    );\n    const withSubscribeControls = Boolean(!singlePage && onSubscribe);\n\n    const controls = [\n        withFullscreenControl && (\n            <FullScreenControl\n                key=\"fullscreen-control\"\n                value={fullScreen}\n                onChange={onChangeFullScreen}\n            />\n        ),\n        withSettingsControl && (\n            <SettingsControl\n                key=\"settings-control\"\n                theme={theme}\n                wideFormat={wideFormat}\n                showMiniToc={showMiniToc}\n                textSize={textSize}\n                onChangeTheme={onChangeTheme}\n                onChangeShowMiniToc={onChangeShowMiniToc}\n                onChangeTextSize={onChangeTextSize}\n                onChangeWideFormat={onChangeWideFormat}\n            />\n        ),\n        withLangControl && (\n            <LangControl\n                key=\"lang-control\"\n                lang={lang as Lang}\n                langs={langs}\n                availableLangs={availableLangs}\n                onChangeLang={onChangeLang as Defined['onChangeLang']}\n            />\n        ),\n        withSinglePageControl && (\n            <SinglePageControl\n                key=\"single-page-control\"\n                value={singlePage}\n                onChange={onChangeSinglePage as Defined['onChangeSinglePage']}\n            />\n        ),\n        withPdfControl && (\n            <PdfControl\n                key=\"pdf-control\"\n                pdfLink={pdfLink as Defined['pdfLink']}\n                icon={pdfIconConfig?.icon}\n                size={pdfIconConfig?.size as ControlSizes | undefined}\n            />\n        ),\n        '---',\n        withEditControl && (\n            <EditControl\n                key=\"edit-control\"\n                vcsUrl={vcsUrl as Defined['vcsUrl']}\n                vcsType={vcsType as Defined['vcsType']}\n                onClick={onEditClick}\n            />\n        ),\n        '---',\n        withFeedbackControl && (\n            <Feedback\n                key=\"feedback-control\"\n                isLiked={isLiked}\n                isDisliked={isDisliked}\n                onSendFeedback={onSendFeedback as Defined['onSendFeedback']}\n                view={FeedbackView.Regular}\n            />\n        ),\n        '---',\n        withSubscribeControls && (\n            <Subscribe\n                key=\"subscribe-control\"\n                onSubscribe={onSubscribe as Defined['onSubscribe']}\n                view={SubscribeView.Regular}\n            />\n        ),\n    ]\n        .filter(Boolean)\n        .reduce((result, control, index, array) => {\n            if (control === '---') {\n                if (array[index - 1] && array[index + 1] && array[index + 1] !== '---') {\n                    result.push(\n                        <DividerControl key={'divider-' + index} className={b('divider')} />,\n                    );\n                }\n            } else {\n                result.push(control as React.ReactElement);\n            }\n\n            return result;\n        }, [] as React.ReactElement[]);\n\n    return controls;\n};\n\nconst Controls = memo<ControlsProps>((props) => {\n    const {isVerticalView} = useContext(ControlsLayoutContext);\n    const isHiddenFeedback = useInterface('feedback');\n    const {className} = props;\n\n    const controls = <ControlsList {...props} isHiddenFeedback={isHiddenFeedback} />;\n\n    if (!controls) {\n        return null;\n    }\n\n    return <div className={b({vertical: isVerticalView}, className)}>{controls}</div>;\n});\n\nControls.displayName = 'DCControls';\n\nexport default Controls;\n"],
+  "mappings": "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",
+  "names": ["block", "React"]
+}

package/build/cjs/components/Controls/ControlsLayout.d.ts

@@ -0,0 +1,15 @@
+import type { PropsWithChildren } from 'react';
+import React from 'react';
+import { PopperPosition } from '../../hooks';
+import { ControlSizes } from '../../models';
+type ControlsLayoutProps = {
+    isWideView?: boolean;
+    isMobileView?: boolean;
+    isVerticalView?: boolean;
+    controlClassName?: string;
+    controlSize?: ControlSizes;
+    popupPosition?: PopperPosition;
+};
+export declare const ControlsLayoutContext: React.Context<ControlsLayoutProps>;
+export declare const ControlsLayout: React.FC<PropsWithChildren<ControlsLayoutProps>>;
+export {};

package/build/cjs/components/Controls/ControlsLayout.js

@@ -0,0 +1,74 @@
+"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/Controls/ControlsLayout.tsx
+var ControlsLayout_exports = {};
+__export(ControlsLayout_exports, {
+  ControlsLayout: () => ControlsLayout,
+  ControlsLayoutContext: () => ControlsLayoutContext
+});
+module.exports = __toCommonJS(ControlsLayout_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 ControlsLayoutContext = (0, import_react.createContext)({
+  controlClassName: "",
+  isWideView: false,
+  isMobileView: false,
+  isVerticalView: false,
+  controlSize: import_models.ControlSizes.M,
+  popupPosition: import_hooks.PopperPosition.BOTTOM_END
+});
+var b = (0, import_bem_cn_lite.default)("dc-controls");
+var ControlsLayout = ({
+  isWideView,
+  isMobileView,
+  isVerticalView,
+  controlClassName,
+  controlSize,
+  popupPosition,
+  children
+}) => {
+  return /* @__PURE__ */ import_react.default.createElement(
+    ControlsLayoutContext.Provider,
+    {
+      value: {
+        controlClassName: controlClassName || b("control"),
+        isWideView,
+        isMobileView,
+        isVerticalView,
+        controlSize,
+        popupPosition
+      }
+    },
+    children
+  );
+};
+//# sourceMappingURL=ControlsLayout.js.map

package/build/cjs/components/Controls/ControlsLayout.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/components/Controls/ControlsLayout.tsx"],
+  "sourcesContent": ["import type {PropsWithChildren} from 'react';\n\nimport React, {createContext} from 'react';\nimport block from 'bem-cn-lite';\n\nimport {PopperPosition} from '../../hooks';\nimport {ControlSizes} from '../../models';\n\ntype ControlsLayoutProps = {\n    isWideView?: boolean;\n    isMobileView?: boolean;\n    isVerticalView?: boolean;\n    controlClassName?: string;\n    controlSize?: ControlSizes;\n    popupPosition?: PopperPosition;\n};\n\nexport const ControlsLayoutContext = createContext<ControlsLayoutProps>({\n    controlClassName: '',\n    isWideView: false,\n    isMobileView: false,\n    isVerticalView: false,\n    controlSize: ControlSizes.M,\n    popupPosition: PopperPosition.BOTTOM_END,\n});\n\nconst b = block('dc-controls');\n\nexport const ControlsLayout: React.FC<PropsWithChildren<ControlsLayoutProps>> = ({\n    isWideView,\n    isMobileView,\n    isVerticalView,\n    controlClassName,\n    controlSize,\n    popupPosition,\n    children,\n}) => {\n    return (\n        <ControlsLayoutContext.Provider\n            value={{\n                controlClassName: controlClassName || b('control'),\n                isWideView: isWideView,\n                isMobileView: isMobileView,\n                isVerticalView: isVerticalView,\n                controlSize: controlSize,\n                popupPosition: popupPosition,\n            }}\n        >\n            {children}\n        </ControlsLayoutContext.Provider>\n    );\n};\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,mBAAmC;AACnC,yBAAkB;AAElB,mBAA6B;AAC7B,oBAA2B;AAWpB,IAAM,4BAAwB,4BAAmC;AAAA,EACpE,kBAAkB;AAAA,EAClB,YAAY;AAAA,EACZ,cAAc;AAAA,EACd,gBAAgB;AAAA,EAChB,aAAa,2BAAa;AAAA,EAC1B,eAAe,4BAAe;AAClC,CAAC;AAED,IAAM,QAAI,mBAAAA,SAAM,aAAa;AAEtB,IAAM,iBAAmE,CAAC;AAAA,EAC7E;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACJ,MAAM;AACF,SACI,6BAAAC,QAAA;AAAA,IAAC,sBAAsB;AAAA,IAAtB;AAAA,MACG,OAAO;AAAA,QACH,kBAAkB,oBAAoB,EAAE,SAAS;AAAA,QACjD;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACJ;AAAA;AAAA,IAEC;AAAA,EACL;AAER;",
+  "names": ["block", "React"]
+}

package/build/cjs/components/Controls/__tests__/Controls.spec.d.ts

@@ -0,0 +1 @@
+export {};