@gravity-ui/markdown-editor 15.25.0 → 15.27.0

package/build/cjs/markup/codemirror/search-plugin/theme.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.searchTheme = void 0;
+const view_1 = require("../../../cm/view.js");
+exports.searchTheme = view_1.EditorView.baseTheme({
+    '&light, &dark': {
+        '& .cm-searchMatch': {
+            backgroundColor: 'var(--g-color-base-info-light)',
+        },
+        '& .cm-searchMatch-selected': {
+            backgroundColor: 'var(--g-color-base-info-heavy)',
+        },
+    },
+});
+//# sourceMappingURL=theme.js.map

package/build/cjs/markup/codemirror/search-plugin/theme.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.js","sourceRoot":"../../../../../src","sources":["markup/codemirror/search-plugin/theme.ts"],"names":[],"mappings":";;;AAAA,8CAAoC;AAEvB,QAAA,WAAW,GAAG,iBAAU,CAAC,SAAS,CAAC;IAC5C,eAAe,EAAE;QACb,mBAAmB,EAAE;YACjB,eAAe,EAAE,gCAAgC;SACpD;QACD,4BAA4B,EAAE;YAC1B,eAAe,EAAE,gCAAgC;SACpD;KACJ;CACJ,CAAC,CAAC","sourcesContent":["import {EditorView} from '#cm/view';\n\nexport const searchTheme = EditorView.baseTheme({\n    '&light, &dark': {\n        '& .cm-searchMatch': {\n            backgroundColor: 'var(--g-color-base-info-light)',\n        },\n        '& .cm-searchMatch-selected': {\n            backgroundColor: 'var(--g-color-base-info-heavy)',\n        },\n    },\n});\n"]}

package/build/cjs/modules/search/components/SearchCardView.css

@@ -0,0 +1,7 @@
+.g-md-search-card {
+  width: 428px;
+}
+.g-md-search-card__row.g-md-search-card__row {
+  --gc-form-row-label-width: 86px;
+  --gc-form-row-field-height: 36px;
+}

package/build/cjs/modules/search/components/SearchCardView.d.ts

@@ -0,0 +1,17 @@
+import { type DOMProps } from '@gravity-ui/uikit';
+import type { SearchCounter, SearchState } from "../types.js";
+import "./SearchCardView.css";
+export type SearchCardViewProps = DOMProps & {
+    counter?: SearchCounter;
+    searchState: SearchState;
+    onClose: () => void;
+    onSearchChange: (value: string) => void;
+    onReplacementChange: (value: string) => void;
+    onFindPrevious: () => void;
+    onFindNext: () => void;
+    onReplace: () => void;
+    onReplaceAll: () => void;
+    onWholeWordChange: (value: boolean) => void;
+    onCaseSensitiveChange: (value: boolean) => void;
+};
+export declare const SearchCardView: React.FC<SearchCardViewProps>;

package/build/cjs/modules/search/components/SearchCardView.js

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SearchCardView = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const components_1 = require("@gravity-ui/components");
+const icons_1 = require("@gravity-ui/icons");
+const uikit_1 = require("@gravity-ui/uikit");
+const classname_1 = require("../../../classname.js");
+const search_1 = require("../../../i18n/search/index.js");
+const useAutoFocus_1 = require("../../../react-utils/useAutoFocus.js");
+const qa_1 = require("../qa.js");
+const SearchTextInput_1 = require("./SearchTextInput.js");
+require("./SearchCardView.css");
+const b = (0, classname_1.cn)('search-card');
+const SearchCardView = ({ style, className, counter, searchState, onClose, onSearchChange, onReplacementChange, onFindPrevious, onFindNext, onReplace, onReplaceAll, onWholeWordChange, onCaseSensitiveChange, }) => {
+    const searchInputRef = (0, react_1.useRef)(null);
+    (0, useAutoFocus_1.useAutoFocus)(searchInputRef, [], 200);
+    return ((0, jsx_runtime_1.jsxs)(uikit_1.Card, { size: "l", spacing: { pt: 4, pb: 5, pl: 5, pr: 5 }, style: style, className: b(null, className), children: [(0, jsx_runtime_1.jsxs)(uikit_1.Flex, { spacing: { mb: 5 }, alignItems: "center", justifyContent: "space-between", className: b('header'), children: [(0, jsx_runtime_1.jsx)(uikit_1.Text, { variant: "subheader-2", className: b('title'), children: (0, search_1.i18n)('title') }), (0, jsx_runtime_1.jsx)(uikit_1.Button, { size: "m", view: "flat", onClick: onClose, "aria-label": (0, search_1.i18n)('action_close'), qa: qa_1.SearchQA.CloseBtn, children: (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icons_1.Xmark }) })] }), (0, jsx_runtime_1.jsxs)(components_1.FormRow, { direction: "row", label: (0, search_1.i18n)('title_search'), className: b('row', (0, uikit_1.sp)({ mb: 4 })), children: [(0, jsx_runtime_1.jsx)(SearchTextInput_1.SearchTextInput, { counter: counter, onFindNext: onFindNext, onFindPrevious: onFindPrevious, controlRef: searchInputRef, className: (0, uikit_1.sp)({ mb: 2 }), onUpdate: onSearchChange, value: searchState.search, delay: 300 }), (0, jsx_runtime_1.jsx)(uikit_1.Checkbox, { size: "m", onUpdate: onCaseSensitiveChange, checked: searchState.caseSensitive, qa: qa_1.SearchQA.CaseSensitiveCheck, className: (0, uikit_1.sp)({ mr: 4 }), children: (0, search_1.i18n)('label_case-sensitive') }), (0, jsx_runtime_1.jsx)(uikit_1.Checkbox, { size: "m", checked: searchState.wholeWord, onUpdate: onWholeWordChange, qa: qa_1.SearchQA.WholeWordCheck, children: (0, search_1.i18n)('label_whole-word') })] }), (0, jsx_runtime_1.jsx)(components_1.FormRow, { direction: "row", label: (0, search_1.i18n)('title_replace'), className: b('row', (0, uikit_1.sp)({ mb: 5 })), children: (0, jsx_runtime_1.jsx)(components_1.DelayedTextInput, { size: "l", delay: 300, value: searchState.replace, onUpdate: onReplacementChange, qa: qa_1.SearchQA.ReplaceInput }) }), (0, jsx_runtime_1.jsxs)(uikit_1.Flex, { justifyContent: "flex-end", gap: 2, className: b('footer'), children: [(0, jsx_runtime_1.jsx)(uikit_1.Button, { size: "l", view: "normal", onClick: onReplaceAll, disabled: !searchState.search, qa: qa_1.SearchQA.ReplaceAllBtn, children: (0, search_1.i18n)('action_replace_all') }), (0, jsx_runtime_1.jsx)(uikit_1.Button, { view: "action", size: "l", disabled: !searchState.search, onClick: onReplace, qa: qa_1.SearchQA.ReplaceBtn, children: (0, search_1.i18n)('action_replace') })] })] }));
+};
+exports.SearchCardView = SearchCardView;
+//# sourceMappingURL=SearchCardView.js.map

package/build/cjs/modules/search/components/SearchCardView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchCardView.js","sourceRoot":"../../../../../src","sources":["modules/search/components/SearchCardView.tsx"],"names":[],"mappings":"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","sourcesContent":["import {useRef} from 'react';\n\nimport {DelayedTextInput, FormRow} from '@gravity-ui/components';\nimport {Xmark} from '@gravity-ui/icons';\nimport {Button, Card, Checkbox, type DOMProps, Flex, Icon, Text, sp} from '@gravity-ui/uikit';\n\nimport {cn} from 'src/classname';\nimport {i18n} from 'src/i18n/search';\nimport {useAutoFocus} from 'src/react-utils/useAutoFocus';\n\nimport {SearchQA} from '../qa';\nimport type {SearchCounter, SearchState} from '../types';\n\nimport {SearchTextInput} from './SearchTextInput';\n\nimport './SearchCardView.scss';\n\nexport type SearchCardViewProps = DOMProps & {\n    counter?: SearchCounter;\n    searchState: SearchState;\n    onClose: () => void;\n    onSearchChange: (value: string) => void;\n    onReplacementChange: (value: string) => void;\n    onFindPrevious: () => void;\n    onFindNext: () => void;\n    onReplace: () => void;\n    onReplaceAll: () => void;\n    onWholeWordChange: (value: boolean) => void;\n    onCaseSensitiveChange: (value: boolean) => void;\n};\n\nconst b = cn('search-card');\n\nexport const SearchCardView: React.FC<SearchCardViewProps> = ({\n    style,\n    className,\n\n    counter,\n    searchState,\n    onClose,\n    onSearchChange,\n    onReplacementChange,\n    onFindPrevious,\n    onFindNext,\n    onReplace,\n    onReplaceAll,\n    onWholeWordChange,\n    onCaseSensitiveChange,\n}) => {\n    const searchInputRef = useRef<HTMLInputElement>(null);\n\n    useAutoFocus(searchInputRef, [], 200);\n\n    return (\n        <Card\n            size=\"l\"\n            spacing={{pt: 4, pb: 5, pl: 5, pr: 5}}\n            style={style}\n            className={b(null, className)}\n        >\n            <Flex\n                spacing={{mb: 5}}\n                alignItems=\"center\"\n                justifyContent=\"space-between\"\n                className={b('header')}\n            >\n                <Text variant=\"subheader-2\" className={b('title')}>\n                    {i18n('title')}\n                </Text>\n                <Button\n                    size=\"m\"\n                    view=\"flat\"\n                    onClick={onClose}\n                    aria-label={i18n('action_close')}\n                    qa={SearchQA.CloseBtn}\n                >\n                    <Icon data={Xmark} />\n                </Button>\n            </Flex>\n\n            <FormRow direction=\"row\" label={i18n('title_search')} className={b('row', sp({mb: 4}))}>\n                <SearchTextInput\n                    counter={counter}\n                    onFindNext={onFindNext}\n                    onFindPrevious={onFindPrevious}\n                    controlRef={searchInputRef}\n                    className={sp({mb: 2})}\n                    onUpdate={onSearchChange}\n                    value={searchState.search}\n                    delay={300}\n                />\n\n                <Checkbox\n                    size=\"m\"\n                    onUpdate={onCaseSensitiveChange}\n                    checked={searchState.caseSensitive}\n                    qa={SearchQA.CaseSensitiveCheck}\n                    className={sp({mr: 4})}\n                >\n                    {i18n('label_case-sensitive')}\n                </Checkbox>\n\n                <Checkbox\n                    size=\"m\"\n                    checked={searchState.wholeWord}\n                    onUpdate={onWholeWordChange}\n                    qa={SearchQA.WholeWordCheck}\n                >\n                    {i18n('label_whole-word')}\n                </Checkbox>\n            </FormRow>\n\n            <FormRow\n                direction=\"row\"\n                label={i18n('title_replace')}\n                className={b('row', sp({mb: 5}))}\n            >\n                <DelayedTextInput\n                    size=\"l\"\n                    delay={300}\n                    value={searchState.replace}\n                    onUpdate={onReplacementChange}\n                    qa={SearchQA.ReplaceInput}\n                />\n            </FormRow>\n\n            <Flex justifyContent=\"flex-end\" gap={2} className={b('footer')}>\n                <Button\n                    size=\"l\"\n                    view=\"normal\"\n                    onClick={onReplaceAll}\n                    disabled={!searchState.search}\n                    qa={SearchQA.ReplaceAllBtn}\n                >\n                    {i18n('action_replace_all')}\n                </Button>\n                <Button\n                    view=\"action\"\n                    size=\"l\"\n                    disabled={!searchState.search}\n                    onClick={onReplace}\n                    qa={SearchQA.ReplaceBtn}\n                >\n                    {i18n('action_replace')}\n                </Button>\n            </Flex>\n        </Card>\n    );\n};\n"]}

package/build/cjs/modules/search/components/SearchCompactView.css

@@ -0,0 +1,5 @@
+.g-md-search-compact {
+  display: flex;
+  align-items: center;
+  width: 428px;
+}

package/build/cjs/modules/search/components/SearchCompactView.d.ts

@@ -0,0 +1,13 @@
+import { type DOMProps, type QAProps } from '@gravity-ui/uikit';
+import type { SearchCounter } from "../types.js";
+import "./SearchCompactView.css";
+export type SearchCompactProps = DOMProps & QAProps & {
+    value: string;
+    counter?: SearchCounter;
+    onChange: (value: string) => void;
+    onFindPrevious: () => void;
+    onFindNext: () => void;
+    onExpand: () => void;
+    onClose: () => void;
+};
+export declare const SeachCompactView: React.FC<SearchCompactProps>;

package/build/cjs/modules/search/components/SearchCompactView.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SeachCompactView = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const icons_1 = require("@gravity-ui/icons");
+const uikit_1 = require("@gravity-ui/uikit");
+const classname_1 = require("../../../classname.js");
+const search_1 = require("../../../i18n/search/index.js");
+const useAutoFocus_1 = require("../../../react-utils/useAutoFocus.js");
+const qa_1 = require("../qa.js");
+const SearchTextInput_1 = require("./SearchTextInput.js");
+require("./SearchCompactView.css");
+const b = (0, classname_1.cn)('search-compact');
+const SeachCompactView = function SearchCompactView({ value, counter, onChange, onFindNext, onFindPrevious, onExpand, onClose, qa, style, className, }) {
+    const inputRef = (0, react_1.useRef)(null);
+    (0, useAutoFocus_1.useAutoFocus)(inputRef, [], 200);
+    return ((0, jsx_runtime_1.jsxs)(uikit_1.Card, { spacing: { pr: 1 }, "data-qa": qa, style: style, className: b(null, className), children: [(0, jsx_runtime_1.jsx)(SearchTextInput_1.SearchTextInput, { counter: counter, onFindNext: onFindNext, onFindPrevious: onFindPrevious, value: value, view: "clear", delay: 300, onUpdate: onChange, controlRef: inputRef, placeholder: (0, search_1.i18n)('search_placeholder'), className: (0, uikit_1.sp)({ pl: 3 }) }), (0, jsx_runtime_1.jsx)("div", { className: (0, uikit_1.sp)({ mr: 1 }), style: {
+                    flexShrink: 0,
+                    background: 'var(--g-color-line-generic-solid)',
+                    height: '36px',
+                    width: '1px',
+                } }), (0, jsx_runtime_1.jsx)(uikit_1.Tooltip, { content: (0, search_1.i18n)('action_expand'), role: "label", children: (props, ref) => ((0, jsx_runtime_1.jsx)(uikit_1.Button, { ...props, size: "m", view: "flat-secondary", onClick: onExpand, qa: qa_1.SearchQA.ExpandBtn, ref: ref, "aria-label": (0, search_1.i18n)('action_expand'), children: (0, jsx_runtime_1.jsx)(uikit_1.ButtonIcon, { children: (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icons_1.ChevronsExpandUpRight }) }) })) }), (0, jsx_runtime_1.jsx)(uikit_1.Button, { size: "m", view: "flat-secondary", onClick: onClose, className: (0, uikit_1.sp)({ ml: 1 }), "aria-label": (0, search_1.i18n)('action_close'), qa: qa_1.SearchQA.CloseBtn, children: (0, jsx_runtime_1.jsx)(uikit_1.ButtonIcon, { children: (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icons_1.Xmark }) }) })] }));
+};
+exports.SeachCompactView = SeachCompactView;
+//# sourceMappingURL=SearchCompactView.js.map

package/build/cjs/modules/search/components/SearchCompactView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchCompactView.js","sourceRoot":"../../../../../src","sources":["modules/search/components/SearchCompactView.tsx"],"names":[],"mappings":";;;;AAAA,iCAA6B;AAE7B,6CAA+D;AAC/D,6CAS2B;AAE3B,qDAAiC;AACjC,0DAAqC;AACrC,uEAA0D;AAE1D,iCAA+B;AAG/B,0DAAkD;AAElD,mCAAkC;AAElC,MAAM,CAAC,GAAG,IAAA,cAAE,EAAC,gBAAgB,CAAC,CAAC;AAaxB,MAAM,gBAAgB,GAAiC,SAAS,iBAAiB,CAAC,EACrF,KAAK,EACL,OAAO,EAEP,QAAQ,EACR,UAAU,EACV,cAAc,EACd,QAAQ,EACR,OAAO,EAEP,EAAE,EACF,KAAK,EACL,SAAS,GACZ;IACG,MAAM,QAAQ,GAAG,IAAA,cAAM,EAAmB,IAAI,CAAC,CAAC;IAEhD,IAAA,2BAAY,EAAC,QAAQ,EAAE,EAAE,EAAE,GAAG,CAAC,CAAC;IAEhC,OAAO,CACH,wBAAC,YAAI,IAAC,OAAO,EAAE,EAAC,EAAE,EAAE,CAAC,EAAC,aAAW,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,aAC5E,uBAAC,iCAAe,IACZ,OAAO,EAAE,OAAO,EAChB,UAAU,EAAE,UAAU,EACtB,cAAc,EAAE,cAAc,EAC9B,KAAK,EAAE,KAAK,EACZ,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE,GAAG,EACV,QAAQ,EAAE,QAAQ,EAClB,UAAU,EAAE,QAAQ,EACpB,WAAW,EAAE,IAAA,aAAI,EAAC,oBAAoB,CAAC,EACvC,SAAS,EAAE,IAAA,UAAE,EAAC,EAAC,EAAE,EAAE,CAAC,EAAC,CAAC,GACxB,EAEF,gCACI,SAAS,EAAE,IAAA,UAAE,EAAC,EAAC,EAAE,EAAE,CAAC,EAAC,CAAC,EACtB,KAAK,EAAE;oBACH,UAAU,EAAE,CAAC;oBACb,UAAU,EAAE,mCAAmC;oBAC/C,MAAM,EAAE,MAAM;oBACd,KAAK,EAAE,KAAK;iBACf,GACH,EAGF,uBAAC,eAAO,IAAC,OAAO,EAAE,IAAA,aAAI,EAAC,eAAe,CAAC,EAAE,IAAI,EAAC,OAAO,YAChD,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE,CAAC,CACb,uBAAC,cAAM,OACC,KAAK,EACT,IAAI,EAAC,GAAG,EACR,IAAI,EAAC,gBAAgB,EACrB,OAAO,EAAE,QAAQ,EACjB,EAAE,EAAE,aAAQ,CAAC,SAAS,EACtB,GAAG,EAAE,GAAmC,gBAC5B,IAAA,aAAI,EAAC,eAAe,CAAC,YAEjC,uBAAC,kBAAU,cACP,uBAAC,YAAI,IAAC,IAAI,EAAE,6BAAqB,GAAI,GAC5B,GACR,CACZ,GACK,EACV,uBAAC,cAAM,IACH,IAAI,EAAC,GAAG,EACR,IAAI,EAAC,gBAAgB,EACrB,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,IAAA,UAAE,EAAC,EAAC,EAAE,EAAE,CAAC,EAAC,CAAC,gBACV,IAAA,aAAI,EAAC,cAAc,CAAC,EAChC,EAAE,EAAE,aAAQ,CAAC,QAAQ,YAErB,uBAAC,kBAAU,cACP,uBAAC,YAAI,IAAC,IAAI,EAAE,aAAK,GAAI,GACZ,GACR,IACN,CACV,CAAC;AACN,CAAC,CAAC;AA3EW,QAAA,gBAAgB,oBA2E3B","sourcesContent":["import {useRef} from 'react';\n\nimport {ChevronsExpandUpRight, Xmark} from '@gravity-ui/icons';\nimport {\n    Button,\n    ButtonIcon,\n    Card,\n    type DOMProps,\n    Icon,\n    type QAProps,\n    Tooltip,\n    sp,\n} from '@gravity-ui/uikit';\n\nimport {cn} from 'src/classname';\nimport {i18n} from 'src/i18n/search';\nimport {useAutoFocus} from 'src/react-utils/useAutoFocus';\n\nimport {SearchQA} from '../qa';\nimport type {SearchCounter} from '../types';\n\nimport {SearchTextInput} from './SearchTextInput';\n\nimport './SearchCompactView.scss';\n\nconst b = cn('search-compact');\n\nexport type SearchCompactProps = DOMProps &\n    QAProps & {\n        value: string;\n        counter?: SearchCounter;\n        onChange: (value: string) => void;\n        onFindPrevious: () => void;\n        onFindNext: () => void;\n        onExpand: () => void;\n        onClose: () => void;\n    };\n\nexport const SeachCompactView: React.FC<SearchCompactProps> = function SearchCompactView({\n    value,\n    counter,\n\n    onChange,\n    onFindNext,\n    onFindPrevious,\n    onExpand,\n    onClose,\n\n    qa,\n    style,\n    className,\n}) {\n    const inputRef = useRef<HTMLInputElement>(null);\n\n    useAutoFocus(inputRef, [], 200);\n\n    return (\n        <Card spacing={{pr: 1}} data-qa={qa} style={style} className={b(null, className)}>\n            <SearchTextInput\n                counter={counter}\n                onFindNext={onFindNext}\n                onFindPrevious={onFindPrevious}\n                value={value}\n                view=\"clear\"\n                delay={300}\n                onUpdate={onChange}\n                controlRef={inputRef}\n                placeholder={i18n('search_placeholder')}\n                className={sp({pl: 3})}\n            />\n\n            <div\n                className={sp({mr: 1})}\n                style={{\n                    flexShrink: 0,\n                    background: 'var(--g-color-line-generic-solid)',\n                    height: '36px',\n                    width: '1px',\n                }}\n            />\n\n            {/* eslint-disable-next-line jsx-a11y/aria-role */}\n            <Tooltip content={i18n('action_expand')} role=\"label\">\n                {(props, ref) => (\n                    <Button\n                        {...props}\n                        size=\"m\"\n                        view=\"flat-secondary\"\n                        onClick={onExpand}\n                        qa={SearchQA.ExpandBtn}\n                        ref={ref as React.Ref<HTMLButtonElement>}\n                        aria-label={i18n('action_expand')}\n                    >\n                        <ButtonIcon>\n                            <Icon data={ChevronsExpandUpRight} />\n                        </ButtonIcon>\n                    </Button>\n                )}\n            </Tooltip>\n            <Button\n                size=\"m\"\n                view=\"flat-secondary\"\n                onClick={onClose}\n                className={sp({ml: 1})}\n                aria-label={i18n('action_close')}\n                qa={SearchQA.CloseBtn}\n            >\n                <ButtonIcon>\n                    <Icon data={Xmark} />\n                </ButtonIcon>\n            </Button>\n        </Card>\n    );\n};\n"]}

package/build/cjs/modules/search/components/SearchCounter.d.ts

@@ -0,0 +1,6 @@
+import { type DOMProps } from '@gravity-ui/uikit';
+import type { SearchCounter } from "../types.js";
+export type SearchCounterProps = DOMProps & {
+    counter: SearchCounter;
+};
+export declare const SearchCounterText: React.FC<SearchCounterProps>;

package/build/cjs/modules/search/components/SearchCounter.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SearchCounterText = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const uikit_1 = require("@gravity-ui/uikit");
+const search_1 = require("../../../i18n/search/index.js");
+const qa_1 = require("../qa.js");
+const SearchCounterText = ({ counter, style, className }) => {
+    return ((0, jsx_runtime_1.jsx)(uikit_1.Text, { whiteSpace: "nowrap", style: style, className: className, qa: qa_1.SearchQA.Counter, children: (0, search_1.i18n)('search_counter', {
+            current: String(counter.current),
+            total: String(counter.total),
+        }) }));
+};
+exports.SearchCounterText = SearchCounterText;
+//# sourceMappingURL=SearchCounter.js.map

package/build/cjs/modules/search/components/SearchCounter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchCounter.js","sourceRoot":"../../../../../src","sources":["modules/search/components/SearchCounter.tsx"],"names":[],"mappings":";;;;AAAA,6CAAsD;AAEtD,0DAAqC;AAErC,iCAA+B;AAOxB,MAAM,iBAAiB,GAAiC,CAAC,EAAC,OAAO,EAAE,KAAK,EAAE,SAAS,EAAC,EAAE,EAAE;IAC3F,OAAO,CACH,uBAAC,YAAI,IAAC,UAAU,EAAC,QAAQ,EAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,EAAE,EAAE,aAAQ,CAAC,OAAO,YAC7E,IAAA,aAAI,EAAC,gBAAgB,EAAE;YACpB,OAAO,EAAE,MAAM,CAAC,OAAO,CAAC,OAAO,CAAC;YAChC,KAAK,EAAE,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC;SAC/B,CAAC,GACC,CACV,CAAC;AACN,CAAC,CAAC;AATW,QAAA,iBAAiB,qBAS5B","sourcesContent":["import {type DOMProps, Text} from '@gravity-ui/uikit';\n\nimport {i18n} from 'src/i18n/search';\n\nimport {SearchQA} from '../qa';\nimport type {SearchCounter} from '../types';\n\nexport type SearchCounterProps = DOMProps & {\n    counter: SearchCounter;\n};\n\nexport const SearchCounterText: React.FC<SearchCounterProps> = ({counter, style, className}) => {\n    return (\n        <Text whiteSpace=\"nowrap\" style={style} className={className} qa={SearchQA.Counter}>\n            {i18n('search_counter', {\n                current: String(counter.current),\n                total: String(counter.total),\n            })}\n        </Text>\n    );\n};\n"]}

package/build/cjs/modules/search/components/SearchPopup.css

@@ -0,0 +1,9 @@
+.g-md-search-popup {
+  --g-popup-border-width: 0;
+  --g-popup-border-radius: 16px;
+  border-radius: 16px;
+}
+.g-md-search-popup_compact {
+  --g-popup-border-radius: var(--g-border-radius-l);
+  border-radius: var(--g-border-radius-l);
+}

package/build/cjs/modules/search/components/SearchPopup.d.ts

@@ -0,0 +1,15 @@
+import { type UseSearchProps } from "../hooks/use-search.js";
+import type { SearchCounter } from "../types.js";
+import "./SearchPopup.css";
+export type SearchPopupProps = UseSearchProps & {
+    open: boolean;
+    anchor: Element;
+    counter?: SearchCounter;
+    onClose: () => void;
+};
+export declare const SearchPopup: React.FC<SearchPopupProps>;
+interface SearchPopupWithRefProps extends Omit<SearchPopupProps, 'anchor'> {
+    anchor: Element | null;
+}
+export declare function renderSearchPopup({ anchor, ...props }: SearchPopupWithRefProps): JSX.Element | null;
+export {};

package/build/cjs/modules/search/components/SearchPopup.js

@@ -0,0 +1,29 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SearchPopup = void 0;
+exports.renderSearchPopup = renderSearchPopup;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const uikit_1 = require("@gravity-ui/uikit");
+const classname_1 = require("../../../classname.js");
+const use_search_1 = require("../hooks/use-search.js");
+const qa_1 = require("../qa.js");
+const SearchCardView_1 = require("./SearchCardView.js");
+const SearchCompactView_1 = require("./SearchCompactView.js");
+require("./SearchPopup.css");
+const b = (0, classname_1.cn)('search-popup');
+const SearchPopup = ({ open, anchor, counter, onClose, ...props }) => {
+    const { isCompact, searchState, handlers } = (0, use_search_1.useSearch)(props);
+    return ((0, jsx_runtime_1.jsx)(uikit_1.Popup, { open: open, qa: qa_1.SearchQA.Panel, anchorElement: anchor, placement: "bottom-end", className: b({ compact: isCompact }), onOpenChange: (_open, _event, reason) => {
+            if (reason === 'escape-key') {
+                onClose();
+            }
+        }, children: isCompact ? ((0, jsx_runtime_1.jsx)(SearchCompactView_1.SeachCompactView, { counter: counter, onClose: onClose, value: searchState.search, onExpand: handlers.onExpand, onChange: handlers.onSearchChange, onFindNext: handlers.onFindNext, onFindPrevious: handlers.onFindPrevious })) : ((0, jsx_runtime_1.jsx)(SearchCardView_1.SearchCardView, { counter: counter, onClose: onClose, searchState: searchState, onSearchChange: handlers.onSearchChange, onReplacementChange: handlers.onReplaceChange, onFindNext: handlers.onFindNext, onFindPrevious: handlers.onFindPrevious, onReplace: handlers.onReplace, onReplaceAll: handlers.onReplaceAll, onWholeWordChange: handlers.onWholeWordChange, onCaseSensitiveChange: handlers.onCaseSensitiveChange })) }));
+};
+exports.SearchPopup = SearchPopup;
+exports.SearchPopup.displayName = 'SearchPopup';
+function renderSearchPopup({ anchor, ...props }) {
+    if (!anchor)
+        return null;
+    return (0, jsx_runtime_1.jsx)(exports.SearchPopup, { anchor: anchor, ...props });
+}
+//# sourceMappingURL=SearchPopup.js.map

package/build/cjs/modules/search/components/SearchPopup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchPopup.js","sourceRoot":"../../../../../src","sources":["modules/search/components/SearchPopup.tsx"],"names":[],"mappings":";;;AA+EA,8CAIC;;AAnFD,6CAAwC;AAExC,qDAAiC;AAEjC,uDAAmE;AACnE,iCAA+B;AAG/B,wDAAgD;AAChD,8DAAqD;AAErD,6BAA4B;AAE5B,MAAM,CAAC,GAAG,IAAA,cAAE,EAAC,cAAc,CAAC,CAAC;AAStB,MAAM,WAAW,GAA+B,CAAC,EACpD,IAAI,EACJ,MAAM,EACN,OAAO,EACP,OAAO,EACP,GAAG,KAAK,EACX,EAAE,EAAE;IACD,MAAM,EAAC,SAAS,EAAE,WAAW,EAAE,QAAQ,EAAC,GAAG,IAAA,sBAAS,EAAC,KAAK,CAAC,CAAC;IAE5D,OAAO,CACH,uBAAC,aAAK,IACF,IAAI,EAAE,IAAI,EACV,EAAE,EAAE,aAAQ,CAAC,KAAK,EAClB,aAAa,EAAE,MAAM,EACrB,SAAS,EAAC,YAAY,EACtB,SAAS,EAAE,CAAC,CAAC,EAAC,OAAO,EAAE,SAAS,EAAC,CAAC,EAClC,YAAY,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,EAAE;YACpC,IAAI,MAAM,KAAK,YAAY,EAAE,CAAC;gBAC1B,OAAO,EAAE,CAAC;YACd,CAAC;QACL,CAAC,YAEA,SAAS,CAAC,CAAC,CAAC,CACT,uBAAC,oCAAgB,IACb,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,WAAW,CAAC,MAAM,EACzB,QAAQ,EAAE,QAAQ,CAAC,QAAQ,EAC3B,QAAQ,EAAE,QAAQ,CAAC,cAAc,EACjC,UAAU,EAAE,QAAQ,CAAC,UAAU,EAC/B,cAAc,EAAE,QAAQ,CAAC,cAAc,GACzC,CACL,CAAC,CAAC,CAAC,CACA,uBAAC,+BAAc,IACX,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,WAAW,EAAE,WAAW,EACxB,cAAc,EAAE,QAAQ,CAAC,cAAc,EACvC,mBAAmB,EAAE,QAAQ,CAAC,eAAe,EAC7C,UAAU,EAAE,QAAQ,CAAC,UAAU,EAC/B,cAAc,EAAE,QAAQ,CAAC,cAAc,EACvC,SAAS,EAAE,QAAQ,CAAC,SAAS,EAC7B,YAAY,EAAE,QAAQ,CAAC,YAAY,EACnC,iBAAiB,EAAE,QAAQ,CAAC,iBAAiB,EAC7C,qBAAqB,EAAE,QAAQ,CAAC,qBAAqB,GACvD,CACL,GACG,CACX,CAAC;AACN,CAAC,CAAC;AAjDW,QAAA,WAAW,eAiDtB;AAEF,mBAAW,CAAC,WAAW,GAAG,aAAa,CAAC;AAMxC,SAAgB,iBAAiB,CAAC,EAAC,MAAM,EAAE,GAAG,KAAK,EAA0B;IACzE,IAAI,CAAC,MAAM;QAAE,OAAO,IAAI,CAAC;IAEzB,OAAO,uBAAC,mBAAW,IAAC,MAAM,EAAE,MAAM,KAAM,KAAK,GAAI,CAAC;AACtD,CAAC","sourcesContent":["import {Popup} from '@gravity-ui/uikit';\n\nimport {cn} from 'src/classname';\n\nimport {type UseSearchProps, useSearch} from '../hooks/use-search';\nimport {SearchQA} from '../qa';\nimport type {SearchCounter} from '../types';\n\nimport {SearchCardView} from './SearchCardView';\nimport {SeachCompactView} from './SearchCompactView';\n\nimport './SearchPopup.scss';\n\nconst b = cn('search-popup');\n\nexport type SearchPopupProps = UseSearchProps & {\n    open: boolean;\n    anchor: Element;\n    counter?: SearchCounter;\n    onClose: () => void;\n};\n\nexport const SearchPopup: React.FC<SearchPopupProps> = ({\n    open,\n    anchor,\n    counter,\n    onClose,\n    ...props\n}) => {\n    const {isCompact, searchState, handlers} = useSearch(props);\n\n    return (\n        <Popup\n            open={open}\n            qa={SearchQA.Panel}\n            anchorElement={anchor}\n            placement=\"bottom-end\"\n            className={b({compact: isCompact})}\n            onOpenChange={(_open, _event, reason) => {\n                if (reason === 'escape-key') {\n                    onClose();\n                }\n            }}\n        >\n            {isCompact ? (\n                <SeachCompactView\n                    counter={counter}\n                    onClose={onClose}\n                    value={searchState.search}\n                    onExpand={handlers.onExpand}\n                    onChange={handlers.onSearchChange}\n                    onFindNext={handlers.onFindNext}\n                    onFindPrevious={handlers.onFindPrevious}\n                />\n            ) : (\n                <SearchCardView\n                    counter={counter}\n                    onClose={onClose}\n                    searchState={searchState}\n                    onSearchChange={handlers.onSearchChange}\n                    onReplacementChange={handlers.onReplaceChange}\n                    onFindNext={handlers.onFindNext}\n                    onFindPrevious={handlers.onFindPrevious}\n                    onReplace={handlers.onReplace}\n                    onReplaceAll={handlers.onReplaceAll}\n                    onWholeWordChange={handlers.onWholeWordChange}\n                    onCaseSensitiveChange={handlers.onCaseSensitiveChange}\n                />\n            )}\n        </Popup>\n    );\n};\n\nSearchPopup.displayName = 'SearchPopup';\n\ninterface SearchPopupWithRefProps extends Omit<SearchPopupProps, 'anchor'> {\n    anchor: Element | null;\n}\n\nexport function renderSearchPopup({anchor, ...props}: SearchPopupWithRefProps) {\n    if (!anchor) return null;\n\n    return <SearchPopup anchor={anchor} {...props} />;\n}\n"]}

package/build/cjs/modules/search/components/SearchTextInput.d.ts

@@ -0,0 +1,10 @@
+import { DelayedTextInput } from '@gravity-ui/components';
+import type { SearchCounter } from "../types.js";
+type DelayedTextInputProps = React.ComponentProps<typeof DelayedTextInput>;
+export type SearchTextInputProps = DelayedTextInputProps & {
+    counter?: SearchCounter;
+    onFindNext: () => void;
+    onFindPrevious: () => void;
+};
+export declare const SearchTextInput: React.FC<SearchTextInputProps>;
+export {};

package/build/cjs/modules/search/components/SearchTextInput.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SearchTextInput = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const components_1 = require("@gravity-ui/components");
+const icons_1 = require("@gravity-ui/icons");
+const uikit_1 = require("@gravity-ui/uikit");
+const search_1 = require("../../../i18n/search/index.js");
+const qa_1 = require("../qa.js");
+const SearchCounter_1 = require("./SearchCounter.js");
+const SearchTextInput = function SearchTextInput({ counter, onFindNext, onFindPrevious, ...inputProps }) {
+    const handleKeyDown = (0, react_1.useCallback)((event) => {
+        if (event.key === 'Enter') {
+            if (event.shiftKey)
+                onFindPrevious();
+            else
+                onFindNext();
+        }
+    }, [onFindNext, onFindPrevious]);
+    return ((0, jsx_runtime_1.jsx)(components_1.DelayedTextInput, { size: "l", qa: qa_1.SearchQA.FindInput, onKeyDown: handleKeyDown, endContent: Boolean(inputProps.value) && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [counter && (0, jsx_runtime_1.jsx)(SearchCounter_1.SearchCounterText, { counter: counter, className: (0, uikit_1.sp)({ px: 1 }) }), (0, jsx_runtime_1.jsx)(uikit_1.Button, { size: "m", view: "flat-secondary", onClick: onFindPrevious, "aria-label": (0, search_1.i18n)('action_prev'), qa: qa_1.SearchQA.PrevBtn, children: (0, jsx_runtime_1.jsx)(uikit_1.ButtonIcon, { children: (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icons_1.ChevronUp }) }) }), (0, jsx_runtime_1.jsx)(uikit_1.Button, { size: "m", view: "flat-secondary", onClick: onFindNext, className: (0, uikit_1.sp)({ ml: 1 }), "aria-label": (0, search_1.i18n)('action_next'), qa: qa_1.SearchQA.NextBtn, children: (0, jsx_runtime_1.jsx)(uikit_1.ButtonIcon, { children: (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icons_1.ChevronDown }) }) })] })), ...inputProps }));
+};
+exports.SearchTextInput = SearchTextInput;
+//# sourceMappingURL=SearchTextInput.js.map

package/build/cjs/modules/search/components/SearchTextInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchTextInput.js","sourceRoot":"../../../../../src","sources":["modules/search/components/SearchTextInput.tsx"],"names":[],"mappings":";;;;AAAA,iCAAkC;AAElC,uDAAwD;AACxD,6CAAyD;AACzD,6CAA+D;AAE/D,0DAAqC;AAErC,iCAA+B;AAG/B,sDAAkD;AAU3C,MAAM,eAAe,GAAmC,SAAS,eAAe,CAAC,EACpF,OAAO,EACP,UAAU,EACV,cAAc,EACd,GAAG,UAAU,EAChB;IACG,MAAM,aAAa,GAAG,IAAA,mBAAW,EAC7B,CAAC,KAAK,EAAE,EAAE;QACN,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,EAAE,CAAC;YACxB,IAAI,KAAK,CAAC,QAAQ;gBAAE,cAAc,EAAE,CAAC;;gBAChC,UAAU,EAAE,CAAC;QACtB,CAAC;IACL,CAAC,EACD,CAAC,UAAU,EAAE,cAAc,CAAC,CAC/B,CAAC;IAEF,OAAO,CACH,uBAAC,6BAAgB,IACb,IAAI,EAAC,GAAG,EACR,EAAE,EAAE,aAAQ,CAAC,SAAS,EACtB,SAAS,EAAE,aAAa,EACxB,UAAU,EACN,OAAO,CAAC,UAAU,CAAC,KAAK,CAAC,IAAI,CACzB,6DACK,OAAO,IAAI,uBAAC,iCAAiB,IAAC,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,IAAA,UAAE,EAAC,EAAC,EAAE,EAAE,CAAC,EAAC,CAAC,GAAI,EAC3E,uBAAC,cAAM,IACH,IAAI,EAAC,GAAG,EACR,IAAI,EAAC,gBAAgB,EACrB,OAAO,EAAE,cAAc,gBACX,IAAA,aAAI,EAAC,aAAa,CAAC,EAC/B,EAAE,EAAE,aAAQ,CAAC,OAAO,YAEpB,uBAAC,kBAAU,cACP,uBAAC,YAAI,IAAC,IAAI,EAAE,iBAAS,GAAI,GAChB,GACR,EACT,uBAAC,cAAM,IACH,IAAI,EAAC,GAAG,EACR,IAAI,EAAC,gBAAgB,EACrB,OAAO,EAAE,UAAU,EACnB,SAAS,EAAE,IAAA,UAAE,EAAC,EAAC,EAAE,EAAE,CAAC,EAAC,CAAC,gBACV,IAAA,aAAI,EAAC,aAAa,CAAC,EAC/B,EAAE,EAAE,aAAQ,CAAC,OAAO,YAEpB,uBAAC,kBAAU,cACP,uBAAC,YAAI,IAAC,IAAI,EAAE,mBAAW,GAAI,GAClB,GACR,IACV,CACN,KAED,UAAU,GAChB,CACL,CAAC;AACN,CAAC,CAAC;AAtDW,QAAA,eAAe,mBAsD1B","sourcesContent":["import {useCallback} from 'react';\n\nimport {DelayedTextInput} from '@gravity-ui/components';\nimport {ChevronDown, ChevronUp} from '@gravity-ui/icons';\nimport {Button, ButtonIcon, Icon, sp} from '@gravity-ui/uikit';\n\nimport {i18n} from 'src/i18n/search';\n\nimport {SearchQA} from '../qa';\nimport type {SearchCounter} from '../types';\n\nimport {SearchCounterText} from './SearchCounter';\n\ntype DelayedTextInputProps = React.ComponentProps<typeof DelayedTextInput>;\n\nexport type SearchTextInputProps = DelayedTextInputProps & {\n    counter?: SearchCounter;\n    onFindNext: () => void;\n    onFindPrevious: () => void;\n};\n\nexport const SearchTextInput: React.FC<SearchTextInputProps> = function SearchTextInput({\n    counter,\n    onFindNext,\n    onFindPrevious,\n    ...inputProps\n}) {\n    const handleKeyDown = useCallback<React.KeyboardEventHandler>(\n        (event) => {\n            if (event.key === 'Enter') {\n                if (event.shiftKey) onFindPrevious();\n                else onFindNext();\n            }\n        },\n        [onFindNext, onFindPrevious],\n    );\n\n    return (\n        <DelayedTextInput\n            size=\"l\"\n            qa={SearchQA.FindInput}\n            onKeyDown={handleKeyDown}\n            endContent={\n                Boolean(inputProps.value) && (\n                    <>\n                        {counter && <SearchCounterText counter={counter} className={sp({px: 1})} />}\n                        <Button\n                            size=\"m\"\n                            view=\"flat-secondary\"\n                            onClick={onFindPrevious}\n                            aria-label={i18n('action_prev')}\n                            qa={SearchQA.PrevBtn}\n                        >\n                            <ButtonIcon>\n                                <Icon data={ChevronUp} />\n                            </ButtonIcon>\n                        </Button>\n                        <Button\n                            size=\"m\"\n                            view=\"flat-secondary\"\n                            onClick={onFindNext}\n                            className={sp({ml: 1})}\n                            aria-label={i18n('action_next')}\n                            qa={SearchQA.NextBtn}\n                        >\n                            <ButtonIcon>\n                                <Icon data={ChevronDown} />\n                            </ButtonIcon>\n                        </Button>\n                    </>\n                )\n            }\n            {...inputProps}\n        />\n    );\n};\n"]}

package/build/cjs/modules/search/hooks/use-search.d.ts

@@ -0,0 +1,24 @@
+import type { SearchState } from "../types.js";
+export type UseSearchProps = {
+    state: SearchState;
+    onChange: (config: SearchState) => void;
+    onSearchPrev: (config: SearchState) => void;
+    onSearchNext: (config: SearchState) => void;
+    onReplaceNext: (config: SearchState) => void;
+    onReplaceAll: (config: SearchState) => void;
+};
+export declare function useSearch({ state, onChange, onSearchPrev, onSearchNext, onReplaceNext, onReplaceAll, }: UseSearchProps): {
+    isCompact: boolean;
+    searchState: SearchState;
+    handlers: {
+        onExpand: () => void;
+        onSearchChange: (value: string) => void;
+        onReplaceChange: (value: string) => void;
+        onWholeWordChange: (val: boolean) => void;
+        onCaseSensitiveChange: (val: boolean) => void;
+        onFindPrevious: () => void;
+        onFindNext: () => void;
+        onReplace: () => void;
+        onReplaceAll: () => void;
+    };
+};

package/build/cjs/modules/search/hooks/use-search.js

@@ -0,0 +1,47 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useSearch = useSearch;
+const react_utils_1 = require("../../../react-utils/index.js");
+function useSearch({ state, onChange, onSearchPrev, onSearchNext, onReplaceNext, onReplaceAll, }) {
+    const [isCompact, , showFullForm] = (0, react_utils_1.useBooleanState)(true);
+    const handleSearchChange = (value) => {
+        onChange({ ...state, search: value });
+    };
+    const handleReplacementChange = (value) => {
+        onChange({ ...state, replace: value });
+    };
+    const handleFindPrevious = () => {
+        onSearchPrev(state);
+    };
+    const handleFindNext = () => {
+        onSearchNext(state);
+    };
+    const handleReplace = () => {
+        onReplaceNext(state);
+    };
+    const handleReplaceAll = () => {
+        onReplaceAll(state);
+    };
+    const handleCaseSensitiveChange = (val) => {
+        onChange({ ...state, caseSensitive: val });
+    };
+    const handleWholeWordChange = (val) => {
+        onChange({ ...state, wholeWord: val });
+    };
+    return {
+        isCompact,
+        searchState: state,
+        handlers: {
+            onExpand: showFullForm,
+            onSearchChange: handleSearchChange,
+            onReplaceChange: handleReplacementChange,
+            onWholeWordChange: handleWholeWordChange,
+            onCaseSensitiveChange: handleCaseSensitiveChange,
+            onFindPrevious: handleFindPrevious,
+            onFindNext: handleFindNext,
+            onReplace: handleReplace,
+            onReplaceAll: handleReplaceAll,
+        },
+    };
+}
+//# sourceMappingURL=use-search.js.map

package/build/cjs/modules/search/hooks/use-search.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-search.js","sourceRoot":"../../../../../src","sources":["modules/search/hooks/use-search.ts"],"names":[],"mappings":";;AAaA,8BA+DC;AA5ED,+DAAgD;AAahD,SAAgB,SAAS,CAAC,EACtB,KAAK,EACL,QAAQ,EACR,YAAY,EACZ,YAAY,EACZ,aAAa,EACb,YAAY,GACC;IACb,MAAM,CAAC,SAAS,EAAE,AAAD,EAAG,YAAY,CAAC,GAAG,IAAA,6BAAe,EAAC,IAAI,CAAC,CAAC;IAE1D,MAAM,kBAAkB,GAAG,CAAC,KAAa,EAAE,EAAE;QACzC,QAAQ,CAAC,EAAC,GAAG,KAAK,EAAE,MAAM,EAAE,KAAK,EAAC,CAAC,CAAC;IACxC,CAAC,CAAC;IAEF,MAAM,uBAAuB,GAAG,CAAC,KAAa,EAAE,EAAE;QAC9C,QAAQ,CAAC,EAAC,GAAG,KAAK,EAAE,OAAO,EAAE,KAAK,EAAC,CAAC,CAAC;IACzC,CAAC,CAAC;IAEF,MAAM,kBAAkB,GAAG,GAAG,EAAE;QAC5B,YAAY,CAAC,KAAK,CAAC,CAAC;IACxB,CAAC,CAAC;IAEF,MAAM,cAAc,GAAG,GAAG,EAAE;QACxB,YAAY,CAAC,KAAK,CAAC,CAAC;IACxB,CAAC,CAAC;IAEF,MAAM,aAAa,GAAG,GAAG,EAAE;QACvB,aAAa,CAAC,KAAK,CAAC,CAAC;IACzB,CAAC,CAAC;IAEF,MAAM,gBAAgB,GAAG,GAAG,EAAE;QAC1B,YAAY,CAAC,KAAK,CAAC,CAAC;IACxB,CAAC,CAAC;IAEF,MAAM,yBAAyB,GAAG,CAAC,GAAY,EAAE,EAAE;QAC/C,QAAQ,CAAC,EAAC,GAAG,KAAK,EAAE,aAAa,EAAE,GAAG,EAAC,CAAC,CAAC;IAC7C,CAAC,CAAC;IAEF,MAAM,qBAAqB,GAAG,CAAC,GAAY,EAAE,EAAE;QAC3C,QAAQ,CAAC,EAAC,GAAG,KAAK,EAAE,SAAS,EAAE,GAAG,EAAC,CAAC,CAAC;IACzC,CAAC,CAAC;IAEF,OAAO;QACH,SAAS;QAET,WAAW,EAAE,KAAK;QAElB,QAAQ,EAAE;YACN,QAAQ,EAAE,YAAY;YAEtB,cAAc,EAAE,kBAAkB;YAClC,eAAe,EAAE,uBAAuB;YAExC,iBAAiB,EAAE,qBAAqB;YACxC,qBAAqB,EAAE,yBAAyB;YAEhD,cAAc,EAAE,kBAAkB;YAClC,UAAU,EAAE,cAAc;YAE1B,SAAS,EAAE,aAAa;YACxB,YAAY,EAAE,gBAAgB;SACjC;KACJ,CAAC;AACN,CAAC","sourcesContent":["import {useBooleanState} from 'src/react-utils';\n\nimport type {SearchState} from '../types';\n\nexport type UseSearchProps = {\n    state: SearchState;\n    onChange: (config: SearchState) => void;\n    onSearchPrev: (config: SearchState) => void;\n    onSearchNext: (config: SearchState) => void;\n    onReplaceNext: (config: SearchState) => void;\n    onReplaceAll: (config: SearchState) => void;\n};\n\nexport function useSearch({\n    state,\n    onChange,\n    onSearchPrev,\n    onSearchNext,\n    onReplaceNext,\n    onReplaceAll,\n}: UseSearchProps) {\n    const [isCompact, , showFullForm] = useBooleanState(true);\n\n    const handleSearchChange = (value: string) => {\n        onChange({...state, search: value});\n    };\n\n    const handleReplacementChange = (value: string) => {\n        onChange({...state, replace: value});\n    };\n\n    const handleFindPrevious = () => {\n        onSearchPrev(state);\n    };\n\n    const handleFindNext = () => {\n        onSearchNext(state);\n    };\n\n    const handleReplace = () => {\n        onReplaceNext(state);\n    };\n\n    const handleReplaceAll = () => {\n        onReplaceAll(state);\n    };\n\n    const handleCaseSensitiveChange = (val: boolean) => {\n        onChange({...state, caseSensitive: val});\n    };\n\n    const handleWholeWordChange = (val: boolean) => {\n        onChange({...state, wholeWord: val});\n    };\n\n    return {\n        isCompact,\n\n        searchState: state,\n\n        handlers: {\n            onExpand: showFullForm,\n\n            onSearchChange: handleSearchChange,\n            onReplaceChange: handleReplacementChange,\n\n            onWholeWordChange: handleWholeWordChange,\n            onCaseSensitiveChange: handleCaseSensitiveChange,\n\n            onFindPrevious: handleFindPrevious,\n            onFindNext: handleFindNext,\n\n            onReplace: handleReplace,\n            onReplaceAll: handleReplaceAll,\n        },\n    };\n}\n"]}

package/build/cjs/modules/search/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./types.js";
+export * from "./components/SearchPopup.js";
+export { SearchQA } from "./qa.js";

package/build/cjs/modules/search/index.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SearchQA = void 0;
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./types.js"), exports);
+tslib_1.__exportStar(require("./components/SearchPopup.js"), exports);
+var qa_1 = require("./qa.js");
+Object.defineProperty(exports, "SearchQA", { enumerable: true, get: function () { return qa_1.SearchQA; } });
+//# sourceMappingURL=index.js.map

package/build/cjs/modules/search/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"../../../../src","sources":["modules/search/index.ts"],"names":[],"mappings":";;;;AAAA,qDAAwB;AACxB,sEAAyC;AACzC,8BAA8B;AAAtB,8FAAA,QAAQ,OAAA","sourcesContent":["export * from './types';\nexport * from './components/SearchPopup';\nexport {SearchQA} from './qa';\n"]}

package/build/cjs/modules/search/qa.d.ts

@@ -0,0 +1,14 @@
+export declare const SearchQA: {
+    readonly Panel: "g-md-search-panel";
+    readonly Counter: "g-md-search-counter";
+    readonly NextBtn: "g-md-search-next-btn";
+    readonly PrevBtn: "g-md-search-prev-btn";
+    readonly FindInput: "g-md-search-find-input";
+    readonly ReplaceInput: "g-md-search-replace-input";
+    readonly ReplaceBtn: "g-md-search-replace-btn";
+    readonly ReplaceAllBtn: "g-md-search-replace-all-btn";
+    readonly ExpandBtn: "g-md-search-expand-btn";
+    readonly CaseSensitiveCheck: "g-md-search-case-sensitive-check";
+    readonly WholeWordCheck: "g-md-search-whole-word-check";
+    readonly CloseBtn: "g-md-search-close-btn";
+};

package/build/cjs/modules/search/qa.js

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SearchQA = void 0;
+exports.SearchQA = {
+    Panel: 'g-md-search-panel',
+    Counter: 'g-md-search-counter',
+    NextBtn: 'g-md-search-next-btn',
+    PrevBtn: 'g-md-search-prev-btn',
+    FindInput: 'g-md-search-find-input',
+    ReplaceInput: 'g-md-search-replace-input',
+    ReplaceBtn: 'g-md-search-replace-btn',
+    ReplaceAllBtn: 'g-md-search-replace-all-btn',
+    ExpandBtn: 'g-md-search-expand-btn',
+    CaseSensitiveCheck: 'g-md-search-case-sensitive-check',
+    WholeWordCheck: 'g-md-search-whole-word-check',
+    CloseBtn: 'g-md-search-close-btn',
+};
+//# sourceMappingURL=qa.js.map

package/build/cjs/modules/search/qa.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"qa.js","sourceRoot":"../../../../src","sources":["modules/search/qa.ts"],"names":[],"mappings":";;;AAAa,QAAA,QAAQ,GAAG;IACpB,KAAK,EAAE,mBAAmB;IAC1B,OAAO,EAAE,qBAAqB;IAC9B,OAAO,EAAE,sBAAsB;IAC/B,OAAO,EAAE,sBAAsB;IAC/B,SAAS,EAAE,wBAAwB;IACnC,YAAY,EAAE,2BAA2B;IACzC,UAAU,EAAE,yBAAyB;IACrC,aAAa,EAAE,6BAA6B;IAC5C,SAAS,EAAE,wBAAwB;IACnC,kBAAkB,EAAE,kCAAkC;IACtD,cAAc,EAAE,8BAA8B;IAC9C,QAAQ,EAAE,uBAAuB;CAC3B,CAAC","sourcesContent":["export const SearchQA = {\n    Panel: 'g-md-search-panel',\n    Counter: 'g-md-search-counter',\n    NextBtn: 'g-md-search-next-btn',\n    PrevBtn: 'g-md-search-prev-btn',\n    FindInput: 'g-md-search-find-input',\n    ReplaceInput: 'g-md-search-replace-input',\n    ReplaceBtn: 'g-md-search-replace-btn',\n    ReplaceAllBtn: 'g-md-search-replace-all-btn',\n    ExpandBtn: 'g-md-search-expand-btn',\n    CaseSensitiveCheck: 'g-md-search-case-sensitive-check',\n    WholeWordCheck: 'g-md-search-whole-word-check',\n    CloseBtn: 'g-md-search-close-btn',\n} as const;\n"]}

package/build/cjs/modules/search/types.d.ts

@@ -0,0 +1,10 @@
+export type SearchState = {
+    search: string;
+    replace: string;
+    caseSensitive: boolean;
+    wholeWord: boolean;
+};
+export type SearchCounter = {
+    current: number;
+    total: number;
+};

package/build/cjs/modules/search/types.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=types.js.map

package/build/cjs/modules/search/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"../../../../src","sources":["modules/search/types.ts"],"names":[],"mappings":"","sourcesContent":["export type SearchState = {\n    search: string;\n    replace: string;\n    caseSensitive: boolean;\n    wholeWord: boolean;\n};\n\nexport type SearchCounter = {\n    current: number;\n    total: number;\n};\n"]}

package/build/cjs/react-utils/useAutoFocus.d.ts

@@ -1,2 +1,2 @@
 import { type RefObject } from 'react';
-export declare const useAutoFocus: (nodeRef: RefObject<HTMLElement>, dependencies?: unknown[]) => void;
+export declare function useAutoFocus<T extends HTMLElement>(ref: RefObject<T>, dependencies?: unknown[], timeout?: number): void;

package/build/cjs/react-utils/useAutoFocus.js

@@ -1,19 +1,17 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useAutoFocus = void 0;
+exports.useAutoFocus = useAutoFocus;
 const react_1 = require("react");
-const useAutoFocus = (nodeRef, dependencies = []) => {
+function useAutoFocus(ref, dependencies = [], timeout = 0) {
     (0, react_1.useEffect)(() => {
-        const { current: anchor } = nodeRef;
-        const timeout = setTimeout(() => {
-            anchor?.focus();
-        });
+        const timeoutId = setTimeout(() => {
+            ref.current?.focus();
+        }, timeout);
         return () => {
-            clearTimeout(timeout);
+            clearTimeout(timeoutId);
         };
         // https://github.com/facebook/react/issues/23392#issuecomment-1055610198
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [nodeRef.current, ...dependencies]);
-};
-exports.useAutoFocus = useAutoFocus;
+    }, dependencies);
+}
 //# sourceMappingURL=useAutoFocus.js.map

package/build/cjs/react-utils/useAutoFocus.js.map

@@ -1 +1 @@
-{"version":3,"file":"useAutoFocus.js","sourceRoot":"../../../src","sources":["react-utils/useAutoFocus.ts"],"names":[],"mappings":";;;AAAA,iCAAgD;AAEzC,MAAM,YAAY,GAAG,CAAC,OAA+B,EAAE,eAA0B,EAAE,EAAE,EAAE;IAC1F,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,MAAM,EAAC,OAAO,EAAE,MAAM,EAAC,GAAG,OAAO,CAAC;QAClC,MAAM,OAAO,GAAG,UAAU,CAAC,GAAG,EAAE;YAC5B,MAAM,EAAE,KAAK,EAAE,CAAC;QACpB,CAAC,CAAC,CAAC;QAEH,OAAO,GAAG,EAAE;YACR,YAAY,CAAC,OAAO,CAAC,CAAC;QAC1B,CAAC,CAAC;QACF,yEAAyE;QACzE,uDAAuD;IAC3D,CAAC,EAAE,CAAC,OAAO,CAAC,OAAO,EAAE,GAAG,YAAY,CAAC,CAAC,CAAC;AAC3C,CAAC,CAAC;AAbW,QAAA,YAAY,gBAavB","sourcesContent":["import {type RefObject, useEffect} from 'react';\n\nexport const useAutoFocus = (nodeRef: RefObject<HTMLElement>, dependencies: unknown[] = []) => {\n    useEffect(() => {\n        const {current: anchor} = nodeRef;\n        const timeout = setTimeout(() => {\n            anchor?.focus();\n        });\n\n        return () => {\n            clearTimeout(timeout);\n        };\n        // https://github.com/facebook/react/issues/23392#issuecomment-1055610198\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [nodeRef.current, ...dependencies]);\n};\n"]}
+{"version":3,"file":"useAutoFocus.js","sourceRoot":"../../../src","sources":["react-utils/useAutoFocus.ts"],"names":[],"mappings":";;AAEA,oCAgBC;AAlBD,iCAAgD;AAEhD,SAAgB,YAAY,CACxB,GAAiB,EACjB,eAA0B,EAAE,EAC5B,OAAO,GAAG,CAAC;IAEX,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,MAAM,SAAS,GAAG,UAAU,CAAC,GAAG,EAAE;YAC9B,GAAG,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;QACzB,CAAC,EAAE,OAAO,CAAC,CAAC;QAEZ,OAAO,GAAG,EAAE;YACR,YAAY,CAAC,SAAS,CAAC,CAAC;QAC5B,CAAC,CAAC;QACF,yEAAyE;QACzE,uDAAuD;IAC3D,CAAC,EAAE,YAAY,CAAC,CAAC;AACrB,CAAC","sourcesContent":["import {type RefObject, useEffect} from 'react';\n\nexport function useAutoFocus<T extends HTMLElement>(\n    ref: RefObject<T>,\n    dependencies: unknown[] = [],\n    timeout = 0,\n) {\n    useEffect(() => {\n        const timeoutId = setTimeout(() => {\n            ref.current?.focus();\n        }, timeout);\n\n        return () => {\n            clearTimeout(timeoutId);\n        };\n        // https://github.com/facebook/react/issues/23392#issuecomment-1055610198\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, dependencies);\n}\n"]}