npm - @escapenavigator/hooks - Versions diffs - 2.2.8 → 2.2.10 - Mend

@escapenavigator/hooks 2.2.8 → 2.2.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (14) hide show

package/dist/lead-form/lead-field.js +10 -5
package/dist/lead-form/lead-form.d.ts +3 -2
package/dist/lead-form/lead-form.js +61 -18
package/dist/lead-form/lib.d.ts +1 -1
package/dist/lead-form/lib.js +6 -20
package/dist/lead-form/lib.spec.js +18 -0
package/dist/lead-form/use-lead-t.js +5 -1
package/dist/players-and-variation-picker/index.d.ts +8 -4
package/dist/players-and-variation-picker/index.js +60 -20
package/dist/use-localstore-state/index.d.ts +2 -0
package/dist/use-localstore-state/index.js +27 -8
package/dist/use-localstore-state/index.spec.d.ts +1 -0
package/dist/use-localstore-state/index.spec.js +30 -0
package/package.json +5 -5

package/dist/lead-form/lead-field.js CHANGED Viewed

@@ -81,11 +81,16 @@ const ChoiceIcon = ({ id }) => {
  * Радио и чекбоксы площадки — кнопками-вариантами: один тап вместо попадания
  * в кружок, и форма читается как выбор, а не как анкета.
  */
-const ChoiceGroup = ({ label, options, isSelected, onToggle, hint, error, }) => {
-    const tiled = options.length >= TILES_FROM;
+const ChoiceGroup = ({ presentation, label, options, isSelected, onToggle, hint, error, }) => {
+    const tiled = presentation === 'cards' ||
+        ((!presentation || presentation === 'auto') && options.length >= TILES_FROM);
     return (react_1.default.createElement(ui_1.FlexColumns, { columns: 1, gr: 8 },
         react_1.default.createElement(ui_1.Typography.Text, { view: 'primary-small', weight: 'medium', color: 'primary' }, label),
-        react_1.default.createElement("div", { role: 'group', "aria-label": label, className: tiled ? index_module_css_1.default.choiceTiles : index_module_css_1.default.choicePills }, options.map((option) => {
+        react_1.default.createElement("div", { role: 'group', "aria-label": label, className: presentation === 'list'
+                ? index_module_css_1.default.choiceList
+                : tiled
+                    ? index_module_css_1.default.choiceTiles
+                    : index_module_css_1.default.choicePills }, options.map((option) => {
             const selected = isSelected(option.id);
             return (react_1.default.createElement("button", { key: option.id, type: 'button', "aria-pressed": selected, className: index_module_css_1.default.choice, "data-selected": selected, "data-invalid": !!error, onClick: () => onToggle(option.id) },
                 tiled && react_1.default.createElement(ChoiceIcon, { id: option.id }),
@@ -260,10 +265,10 @@ const LeadField = ({ field, value, error, language, profileCountry, questrooms,
                     content: (0, lib_1.optionLabel)(option, language, option.id),
                 })), selected: String(value || ''), error: error, onChange: ({ selected }) => onChange(selected === null || selected === void 0 ? void 0 : selected.key) }));
         case lead_field_type_enum_1.LeadFieldTypeEnum.RADIO:
-            return (react_1.default.createElement(ChoiceGroup, { label: label, options: choiceOptions, isSelected: (id) => value === id, onToggle: (id) => onChange(id), hint: hint, error: error }));
+            return (react_1.default.createElement(ChoiceGroup, { presentation: field.presentation, label: label, options: choiceOptions, isSelected: (id) => value === id, onToggle: (id) => onChange(id), hint: hint, error: error }));
         case lead_field_type_enum_1.LeadFieldTypeEnum.CHECKBOX: {
             const selected = Array.isArray(value) ? value : [];
-            return (react_1.default.createElement(ChoiceGroup, { label: label, options: choiceOptions, isSelected: (id) => selected.includes(id), onToggle: (id) => onChange(selected.includes(id)
+            return (react_1.default.createElement(ChoiceGroup, { presentation: field.presentation, label: label, options: choiceOptions, isSelected: (id) => selected.includes(id), onToggle: (id) => onChange(selected.includes(id)
                     ? selected.filter((item) => item !== id)
                     : [...selected, id]), hint: hint, error: error }));
         }

package/dist/lead-form/lead-form.d.ts CHANGED Viewed

@@ -47,8 +47,9 @@ type Props = {
     /** Документ согласия на обработку ПДн (галочка есть только в РФ). */
     pdConsentUrl?: string;
     /** Модалка управляет шагом, чтобы использовать свою кнопку «Назад». */
-    currentStep?: 1 | 2;
-    onStepChange?: (step: 1 | 2) => void;
+    currentStep?: number;
+    preview?: boolean;
+    onStepChange?: (step: number) => void;
     showBackButton?: boolean;
 };
 export declare const LeadForm: React.FC<Props>;

package/dist/lead-form/lead-form.js CHANGED Viewed

@@ -49,6 +49,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.LeadForm = void 0;
 const ui_1 = require("@alphakits/ui");
 const lead_field_type_enum_1 = require("@escapenavigator/types/dist/lead/enums/lead-field-type.enum");
+const lead_form_layout_1 = require("@escapenavigator/types/dist/lead/lead-form-layout");
 const react_1 = __importStar(require("react"));
 const personal_data_consent_1 = require("../personal-data-consent");
 const index_module_css_1 = __importDefault(require("./index.module.css"));
@@ -77,17 +78,18 @@ const CONTACT_FIELD_ORDER = {
     [lead_field_type_enum_1.LeadFieldTypeEnum.EMAIL]: 6,
     [lead_field_type_enum_1.LeadFieldTypeEnum.CONSENT]: 7,
 };
-const LeadForm = ({ form, source, language, profileCountry, submit, prefill, contextNote, withHeader = true, onDone, doneLabel, onSuccess, policyUrl, pdConsentUrl, currentStep, onStepChange, showBackButton = true, }) => {
+const LeadForm = ({ form, source, language, profileCountry, submit, prefill, contextNote, withHeader = true, onDone, doneLabel, onSuccess, policyUrl, pdConsentUrl, currentStep, onStepChange, showBackButton = true, preview = false, }) => {
+    var _a, _b;
     const t = (0, use_lead_t_1.useLeadT)();
     const consentRequired = (0, personal_data_consent_1.requiresPersonalDataConsent)(profileCountry);
     const [consent, setConsent] = (0, react_1.useState)(false);
     const [showConsentError, setShowConsentError] = (0, react_1.useState)(false);
     const [internalStep, setInternalStep] = (0, react_1.useState)(1);
-    const step = currentStep !== null && currentStep !== void 0 ? currentStep : internalStep;
-    const setStep = (nextStep) => {
+    const requestedStep = currentStep !== null && currentStep !== void 0 ? currentStep : internalStep;
+    const setStep = (0, react_1.useCallback)((nextStep) => {
         setInternalStep(nextStep);
         onStepChange === null || onStepChange === void 0 ? void 0 : onStepChange(nextStep);
-    };
+    }, [onStepChange]);
     const [values, setValues] = (0, react_1.useState)(() => (0, lib_1.buildInitialValues)(form, prefill));
     const [errors, setErrors] = (0, react_1.useState)({});
     const [formError, setFormError] = (0, react_1.useState)();
@@ -101,7 +103,7 @@ const LeadForm = ({ form, source, language, profileCountry, submit, prefill, con
         setErrors((prev) => (prev[fieldId] ? Object.assign(Object.assign({}, prev), { [fieldId]: '' }) : prev));
         setFormError(undefined);
     };
-    const visibleFields = form.fields.filter((field) => (0, lib_1.isVisible)(field, values));
+    const visibleFields = form.fields.filter((field) => (0, lib_1.isVisible)(field, values, form.fields));
     const planningFields = visibleFields.filter((field) => PLANNING_FIELD_IDS.has(field.id) || PLANNING_FIELD_TYPES.has(field.type));
     const contactFields = visibleFields
         .filter((field) => !PLANNING_FIELD_IDS.has(field.id) && !PLANNING_FIELD_TYPES.has(field.type))
@@ -110,10 +112,36 @@ const LeadForm = ({ form, source, language, profileCountry, submit, prefill, con
         return ((_a = CONTACT_FIELD_ORDER[left.type]) !== null && _a !== void 0 ? _a : 10) - ((_b = CONTACT_FIELD_ORDER[right.type]) !== null && _b !== void 0 ? _b : 10) ||
             left.order - right.order;
     });
-    const hasTwoSteps = planningFields.length > 0 && contactFields.length > 0;
-    const activeFields = !hasTwoSteps ? visibleFields : step === 1 ? planningFields : contactFields;
+    const layout = (0, lead_form_layout_1.normalizeLeadLayout)(form.layout, form.fields);
+    const configuredSteps = (layout === null || layout === void 0 ? void 0 : layout.mode) === 'steps'
+        ? layout.steps
+            .map((item) => (Object.assign(Object.assign({}, item), { fields: item.fieldIds
+                .map((id) => visibleFields.find((field) => field.id === id))
+                .filter(Boolean) })))
+            .filter((item) => item.fields.length)
+        : [];
+    const legacyTwoSteps = !layout && planningFields.length > 0 && contactFields.length > 0;
+    const stepCount = layout ? Math.max(1, configuredSteps.length) : legacyTwoSteps ? 2 : 1;
+    const step = Math.min(Math.max(1, requestedStep), stepCount);
+    (0, react_1.useEffect)(() => {
+        if (requestedStep !== step)
+            setStep(step);
+    }, [requestedStep, step, setStep]);
+    const hasTwoSteps = stepCount > 1;
+    const activeFields = layout
+        ? layout.mode === 'single'
+            ? visibleFields
+            : ((_a = configuredSteps[step - 1]) === null || _a === void 0 ? void 0 : _a.fields) || []
+        : !hasTwoSteps
+            ? visibleFields
+            : step === 1
+                ? planningFields
+                : contactFields;
     const planningFieldIds = new Set(planningFields.map((field) => field.id));
-    const planningSummary = planningFields
+    const summaryFields = layout
+        ? configuredSteps.slice(0, -1).flatMap((item) => item.fields)
+        : planningFields;
+    const planningSummary = summaryFields
         .map((field) => {
         var _a, _b, _c;
         const value = values[field.id];
@@ -151,7 +179,7 @@ const LeadForm = ({ form, source, language, profileCountry, submit, prefill, con
             values,
             phoneValid,
             t,
-            fieldIds: planningFieldIds,
+            fieldIds: new Set(activeFields.map((field) => field.id)),
             requireContact: false,
         });
         if (Object.keys(result.errors).length) {
@@ -160,7 +188,7 @@ const LeadForm = ({ form, source, language, profileCountry, submit, prefill, con
         }
         setErrors({});
         setFormError(undefined);
-        setStep(2);
+        setStep(step + 1);
     };
     const handleSubmit = () => __awaiter(void 0, void 0, void 0, function* () {
         var _a;
@@ -172,11 +200,23 @@ const LeadForm = ({ form, source, language, profileCountry, submit, prefill, con
         if (Object.keys(result.errors).length || result.formError || consentMissing) {
             setErrors(result.errors);
             setFormError(result.formError);
-            if (Object.keys(result.errors).some((fieldId) => planningFieldIds.has(fieldId))) {
+            const invalidStep = configuredSteps.findIndex((item) => item.fields.some((field) => result.errors[field.id]));
+            if (layout && invalidStep >= 0)
+                setStep(invalidStep + 1);
+            if (!layout &&
+                Object.keys(result.errors).some((fieldId) => planningFieldIds.has(fieldId))) {
                 setStep(1);
             }
             return;
         }
+        if (preview) {
+            setSuccess({
+                success: true,
+                successTitle: form.successTitle,
+                successDescription: form.successDescription,
+            });
+            return;
+        }
         setSending(true);
         setFormError(undefined);
         const response = yield submit({
@@ -207,30 +247,33 @@ const LeadForm = ({ form, source, language, profileCountry, submit, prefill, con
             !!onDone && (react_1.default.createElement("div", { className: index_module_css_1.default.successActions },
                 react_1.default.createElement(ui_1.Button, { view: 'primary', size: 's', block: true, onClick: onDone }, doneLabel || t('lead.close'))))));
     }
-    const title = (0, lib_1.localized)(form.clientTitle, language) || t('lead.title');
+    const title = (0, lib_1.localized)((_b = configuredSteps[step - 1]) === null || _b === void 0 ? void 0 : _b.title, language) ||
+        (0, lib_1.localized)(form.clientTitle, language) ||
+        t('lead.title');
     const description = (0, lib_1.localized)(form.description, language);
     const stepLabel = step === 1 ? t('lead.stepPlanning') : t('lead.stepContacts');
-    const showHeaderCopy = !hasTwoSteps || step === 1;
+    const showHeaderCopy = !!layout || !hasTwoSteps || step === 1;
     const dateField = activeFields.find((field) => field.type === lead_field_type_enum_1.LeadFieldTypeEnum.DATE);
     const timeField = activeFields.find((field) => field.type === lead_field_type_enum_1.LeadFieldTypeEnum.TIME);
     return (react_1.default.createElement("div", { className: index_module_css_1.default.form },
         withHeader && (react_1.default.createElement("div", { className: index_module_css_1.default.header },
             hasTwoSteps ? (react_1.default.createElement(react_1.default.Fragment, null,
                 react_1.default.createElement("div", { className: index_module_css_1.default.stepMeta },
-                    step === 2 && showBackButton ? (react_1.default.createElement("button", { type: 'button', className: index_module_css_1.default.backButton, onClick: () => setStep(1) },
+                    step > 1 && showBackButton ? (react_1.default.createElement("button", { type: 'button', className: index_module_css_1.default.backButton, onClick: () => setStep(step - 1) },
                         react_1.default.createElement(ArrowLeft, null),
                         t('lead.back'))) : (react_1.default.createElement("span", null)),
-                    react_1.default.createElement("span", null, t('lead.stepCounter', {
+                    react_1.default.createElement("span", null, t(layout ? 'lead.customStepCounter' : 'lead.stepCounter', {
+                        total: stepCount,
                         current: step,
                         label: stepLabel,
                     }))),
                 react_1.default.createElement("div", { className: index_module_css_1.default.progress, "aria-hidden": 'true' },
-                    react_1.default.createElement("span", { "data-step": step })))) : (react_1.default.createElement("span", { className: index_module_css_1.default.headerAccent, "aria-hidden": 'true' })),
+                    react_1.default.createElement("span", { "data-step": step, style: { width: `${(step / stepCount) * 100}%` } })))) : (react_1.default.createElement("span", { className: index_module_css_1.default.headerAccent, "aria-hidden": 'true' })),
             showHeaderCopy && (react_1.default.createElement("div", { className: index_module_css_1.default.headerCopy },
                 react_1.default.createElement(ui_1.Typography.Title, { tag: 'h1', view: 'small', weight: 'bold' }, title),
                 !!description && (react_1.default.createElement(ui_1.Typography.Text, { view: 'primary-small', color: 'secondary' }, description)))))),
         !!formError && react_1.default.createElement(ui_1.ToastPlate, { view: 'negative' }, formError),
-        hasTwoSteps && step === 2 && !!planningSummary.length && (react_1.default.createElement("div", { className: index_module_css_1.default.selectionSummary },
+        hasTwoSteps && step === stepCount && !!planningSummary.length && (react_1.default.createElement("div", { className: index_module_css_1.default.selectionSummary },
             react_1.default.createElement("div", null,
                 react_1.default.createElement("span", { className: index_module_css_1.default.summaryIcon, "aria-hidden": 'true' },
                     react_1.default.createElement("svg", { viewBox: '0 0 24 24', fill: 'none', "aria-hidden": 'true' },
@@ -248,7 +291,7 @@ const LeadForm = ({ form, source, language, profileCountry, submit, prefill, con
                         : undefined, onChange: (value) => setValue(field.id, value), onPhoneValidChange: setPhoneValid })));
         })),
         react_1.default.createElement("input", { className: index_module_css_1.default.trap, tabIndex: -1, autoComplete: 'off', "aria-hidden": 'true', value: trap, onChange: (event) => setTrap(event.target.value) }),
-        react_1.default.createElement("div", { className: index_module_css_1.default.footer, "data-step": hasTwoSteps ? step : 1 }, hasTwoSteps && step === 1 ? (react_1.default.createElement(ui_1.Button, { view: 'primary', size: 's', block: true, rightAddons: react_1.default.createElement(ArrowRight, null), onClick: handleNext }, t('lead.next'))) : (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement("div", { className: index_module_css_1.default.footer, "data-step": hasTwoSteps ? step : 1 }, step < stepCount ? (react_1.default.createElement(ui_1.Button, { view: 'primary', size: 's', block: true, rightAddons: react_1.default.createElement(ArrowRight, null), onClick: handleNext }, t(layout ? 'lead.continue' : 'lead.next'))) : (react_1.default.createElement(react_1.default.Fragment, null,
             (consentRequired || !!policyUrl) && (react_1.default.createElement(personal_data_consent_1.PersonalDataConsent, { required: consentRequired, consentUrl: pdConsentUrl || '', policyUrl: policyUrl || '', checked: consent, showError: showConsentError, onChange: (checked) => {
                     setConsent(checked);
                     if (checked)

package/dist/lead-form/lib.d.ts CHANGED Viewed

@@ -23,7 +23,7 @@ export declare const isMultiple: (type: LeadFieldTypeEnum) => boolean;
  * поле не валидируется и не попадает в ответы — иначе обязательная
  * «уточните какой квест» блокировала бы отправку у всех остальных.
  */
-export declare const isVisible: (field: LeadFormField, values: LeadFormValues) => boolean;
+export declare const isVisible: (field: LeadFormField, values: LeadFormValues, fields?: LeadFormField[]) => boolean;
 /**
  * Предзаполнение по смысловой роли поля, а не по его id: форма настраивается
  * площадкой, и id полей у каждой свои. Роль (`mapsTo`) стабильна — по ней

package/dist/lead-form/lib.js CHANGED Viewed

@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.buildAnswers = exports.validate = exports.buildInitialValues = exports.isVisible = exports.isMultiple = exports.optionLabel = exports.fieldText = exports.fieldTitle = exports.localized = void 0;
 const lead_field_mapping_enum_1 = require("@escapenavigator/types/dist/lead/enums/lead-field-mapping.enum");
 const lead_field_type_enum_1 = require("@escapenavigator/types/dist/lead/enums/lead-field-type.enum");
+const lead_form_layout_1 = require("@escapenavigator/types/dist/lead/lead-form-layout");
 const languages_enum_1 = require("@escapenavigator/types/dist/shared/enum/languages.enum");
 /**
  * Текст на языке виджета. Площадка могла не перевести форму на все языки —
@@ -45,24 +46,9 @@ exports.isMultiple = isMultiple;
  * поле не валидируется и не попадает в ответы — иначе обязательная
  * «уточните какой квест» блокировала бы отправку у всех остальных.
  */
-const isVisible = (field, values) => {
+const isVisible = (field, values, fields) => {
     var _a;
-    const condition = field.conditional;
-    if (!(condition === null || condition === void 0 ? void 0 : condition.fieldId))
-        return true;
-    const parentValue = values[condition.fieldId];
-    const optionIds = ((_a = condition.optionIds) === null || _a === void 0 ? void 0 : _a.length)
-        ? condition.optionIds
-        : condition.optionId
-            ? [condition.optionId]
-            : [];
-    if (!optionIds.length) {
-        return Array.isArray(parentValue) ? parentValue.length > 0 : !!parentValue;
-    }
-    if (Array.isArray(parentValue)) {
-        return parentValue.some((value) => optionIds.includes(value));
-    }
-    return typeof parentValue === 'string' && optionIds.includes(parentValue);
+    return (0, lead_form_layout_1.isLeadFieldVisible)(field, fields || [field, { id: (_a = field.conditional) === null || _a === void 0 ? void 0 : _a.fieldId }], (id) => values[id]);
 };
 exports.isVisible = isVisible;
 const buildInitialValues = (form, prefill) => {
@@ -114,7 +100,7 @@ const validate = ({ form, values, phoneValid, t, fieldIds, requireContact = true
     for (const field of form.fields) {
         if (fieldIds && !fieldIds.has(field.id))
             continue;
-        if (!(0, exports.isVisible)(field, values))
+        if (!(0, exports.isVisible)(field, values, form.fields))
             continue;
         const value = values[field.id];
         const empty = isEmpty(value);
@@ -153,9 +139,9 @@ exports.validate = validate;
  * такого поля может не быть, а менеджеру этот контекст нужен в карточке.
  */
 const buildAnswers = (form, values, contextNote) => {
-    const commentField = form.fields.find((field) => field.mapsTo === lead_field_mapping_enum_1.LeadFieldMappingEnum.COMMENT && (0, exports.isVisible)(field, values));
+    const commentField = form.fields.find((field) => field.mapsTo === lead_field_mapping_enum_1.LeadFieldMappingEnum.COMMENT && (0, exports.isVisible)(field, values, form.fields));
     return form.fields
-        .filter((field) => (0, exports.isVisible)(field, values))
+        .filter((field) => (0, exports.isVisible)(field, values, form.fields))
         .map((field) => {
         const value = normalizeValue(values[field.id]);
         if (!contextNote || field.id !== (commentField === null || commentField === void 0 ? void 0 : commentField.id)) {

package/dist/lead-form/lib.spec.js CHANGED Viewed

@@ -67,3 +67,21 @@ describe('lead form step validation', () => {
         expect((0, lib_1.buildInitialValues)(guestsForm)).toEqual({ guests: '' });
     });
 });
+describe('conditional chains', () => {
+    it('excludes a required descendant when its parent is hidden despite stale answers', () => {
+        const fields = [
+            Object.assign(Object.assign({}, form.fields[0]), { id: 'audience', required: false }),
+            Object.assign(Object.assign({}, form.fields[0]), { id: 'interest', required: false, conditional: { fieldId: 'audience', optionId: 'children' } }),
+            Object.assign(Object.assign({}, form.fields[0]), { id: 'detail', conditional: { fieldId: 'interest', optionId: 'magic' } }),
+        ];
+        const values = { audience: 'adults', interest: 'magic', detail: '' };
+        expect((0, lib_1.isVisible)(fields[2], values, fields)).toBe(false);
+        expect((0, lib_1.validate)({
+            form: Object.assign(Object.assign({}, form), { fields }),
+            values,
+            phoneValid: false,
+            t: (key) => key,
+            requireContact: false,
+        }).errors).toEqual({});
+    });
+});

package/dist/lead-form/use-lead-t.js CHANGED Viewed

@@ -10,6 +10,8 @@ const react_i18next_1 = require("react-i18next");
  * в витрине пакетов (`use-package-t`).
  */
 const DEFAULTS = {
+    'lead.customStepCounter': 'Step {{current}} of {{total}}',
+    'lead.continue': 'Continue',
     'lead.title': 'Leave a request',
     'lead.hint': 'Tell us what you need and we will call you back.',
     'lead.submit': 'Send',
@@ -56,6 +58,8 @@ const DEFAULTS = {
 };
 /** Новые ключи, которых ещё нет в сервисе: русский аудитории показываем сразу. */
 const RU_DEFAULTS = {
+    'lead.customStepCounter': 'Шаг {{current}} из {{total}}',
+    'lead.continue': 'Далее',
     'lead.footnote': 'Менеджер свяжется с вами и предложит варианты. Заявка пока не бронирует игру.',
     'lead.timeUndecided': 'Пока не определился со временем',
     'lead.guestsUnknown': 'Не знаю',
@@ -78,7 +82,7 @@ const RU_DEFAULTS = {
 };
 const useLeadT = () => {
     var _a;
-    const { t, i18n } = (0, react_i18next_1.useTranslation)();
+    const { t, i18n } = (0, react_i18next_1.useTranslation)('widgets');
     const isRuLang = (_a = i18n.language) === null || _a === void 0 ? void 0 : _a.startsWith('ru');
     return (0, react_1.useCallback)((key, options) => t(key, Object.assign({ defaultValue: (isRuLang && RU_DEFAULTS[key]) || DEFAULTS[key] || key }, options)), [t, isRuLang]);
 };

package/dist/players-and-variation-picker/index.d.ts CHANGED Viewed

@@ -135,10 +135,14 @@ export type PlayersAndVariationPickerProps = {
     hidePriceHints?: boolean;
     /**
      * Опция «Определимся на месте» (questroom.playersSelectMode=OPTIONAL).
-     * Стоит первым пунктом и выбрана по умолчанию, но теги/строки состава
-     * остаются видимыми — гость может указать точное число. Пока flex
-     * выбран, ни одно число не подсвечено, ценовые подсказки скрыты:
-     * хост рендерит «базовую стоимость от» сам.
+     * Выбрана по умолчанию. Пока flex выбран, ни одно число не подсвечено,
+     * ценовые подсказки скрыты: хост рендерит «базовую стоимость от» сам.
+     *
+     * Простой состав (только число человек) — чип стоит в одном ряду с
+     * числами, клик по числу снимает flex. Сложный (взрослые, дети,
+     * льготы) — пара чипов «Определимся на месте» / «Уже определились»:
+     * степперы видны только когда состав уже выбран, иначе заполненные
+     * строки спорят с «решим на месте».
      */
     flexPlayersOption?: {
         selected: boolean;

package/dist/players-and-variation-picker/index.js CHANGED Viewed

@@ -59,6 +59,29 @@ const react_i18next_1 = require("react-i18next");
 const use_players_and_variation_picker_1 = require("../use-players-and-variation-picker");
 const sync_composition_1 = require("./sync-composition");
 const ticket_row_1 = require("./ticket-row");
+/**
+ * Подпись второго чипа сложного состава, пока ключа нет в каталоге переводов.
+ * Тон рядом с `decideOnSite` того же языка. Неизвестный язык — английский,
+ * как `fallbackLng` виджета.
+ */
+const playersAlreadyDecidedFallback = {
+    ru: 'Уже определились',
+    en: 'Already decided',
+    sv: 'Redan bestämt',
+    de: 'Schon entschieden',
+    pl: 'Już ustaliliśmy',
+    es: 'Ya lo sabemos',
+    fr: 'Déjà décidé',
+    nl: 'Al besloten',
+    da: 'Allerede afgjort',
+    fi: 'Jo päätetty',
+};
+const playersAlreadyDecidedLabel = (translate, language) => {
+    const lng = (language || 'en').toLowerCase().split('-')[0];
+    return translate('prices:playersAlreadyDecided', {
+        defaultValue: playersAlreadyDecidedFallback[lng] || playersAlreadyDecidedFallback.en,
+    });
+};
 /**
  * Единый пикер «вариация + состав», который используют админские модалки
  * заказа, виджет и пакет orders.
@@ -75,7 +98,7 @@ const PlayersAndVariationPicker = ({ slot, currentTariffId, currentDuration, loa
      * `useTranslation()` без нужных namespace'ов, а в CRM `prices` грузится
      * лениво. Декларируем их здесь — i18next догрузит бандлы и перерендерит.
      */
-    const { ready: translationsReady } = (0, react_i18next_1.useTranslation)(['prices', 'common'], {
+    const { ready: translationsReady, i18n } = (0, react_i18next_1.useTranslation)(['prices', 'common'], {
         useSuspense: false,
     });
     const { loading: pickerLoading, options: pickerOptions, selectedOptionId, selectedVariation, buildVariationChange, selectVariation, details, } = (0, use_players_and_variation_picker_1.usePlayersAndVariationPicker)({
@@ -242,6 +265,20 @@ const PlayersAndVariationPicker = ({ slot, currentTariffId, currentDuration, loa
         }
         flexPlayersOption === null || flexPlayersOption === void 0 ? void 0 : flexPlayersOption.onSelect(true);
     };
+    /**
+     * Сложный состав: гость явно сказал, что число уже известно.
+     * Пока «на месте», степперы скрыты и крутить их было негде. Пустой
+     * состав (ещё никто не выбран) открываем минимальной группой — той же,
+     * по которой уже показана цена «от». Набранное раньше число не трогаем.
+     */
+    const handleSelectDecided = () => {
+        if (!flexSelected)
+            return;
+        if (totalHeads === 0 && effectiveMin > 0 && baseCategoryKey) {
+            applyComposition(Object.assign(Object.assign({}, _composition), { [baseCategoryKey]: effectiveMin }));
+        }
+        flexPlayersOption === null || flexPlayersOption === void 0 ? void 0 : flexPlayersOption.onSelect(false);
+    };
     /**
      * Единственная автоправка состава: смена вариации сузила сетку, и состав
      * торчит выше нового потолка — иначе на бэке `price[N]` = undefined →
@@ -419,29 +456,32 @@ const PlayersAndVariationPicker = ({ slot, currentTariffId, currentDuration, loa
                     ? categoryTitle(baseCategory)
                     : t('prices:choosePlayersAmount')),
                 !hasExtraRows && !flexSelected && !!tariff[pricingHeads] && (react_1.default.createElement(typography_1.Typography.Text, { view: 'title', color: 'secondary' }, (0, format_amount_1.formatAmount)(tariff[pricingHeads], currency)))),
-            (!!flexPlayersOption || !hasExtraRows) && (react_1.default.createElement(flex_1.Flex, { gap: 'xs', wrap: true, justify: 'start' },
+            hasExtraRows && flexPlayersOption ? (react_1.default.createElement(flex_1.Flex, { gap: 'xs', wrap: true, justify: 'start' },
+                react_1.default.createElement(tag_1.Tag, { key: 'flex-players', text: flexPlayersOption.label, onClick: handleSelectFlex, view: flexSelected ? 'primary-inverted' : 'primary' }),
+                react_1.default.createElement(tag_1.Tag, { key: 'players-decided', text: playersAlreadyDecidedLabel(t, i18n.resolvedLanguage || i18n.language), onClick: handleSelectDecided, view: flexSelected ? 'primary' : 'primary-inverted' }))) : ((!!flexPlayersOption || !hasExtraRows) && (react_1.default.createElement(flex_1.Flex, { gap: 'xs', wrap: true, justify: 'start' },
                 !!flexPlayersOption && (react_1.default.createElement(tag_1.Tag, { key: 'flex-players', text: flexPlayersOption.label, onClick: handleSelectFlex, view: flexSelected ? 'primary-inverted' : 'primary' })),
                 !hasExtraRows &&
                     baseLevelOptions.map((level) => (react_1.default.createElement(tag_1.Tag, { key: `level-${level}`, text: `${level}`, onClick: () => handleSelectLevel(level), view: !flexSelected && pricingHeads === level
                             ? 'primary-inverted'
-                            : 'primary' }))))),
-            (hasExtraRows ? categories : addOnCategories).map((category) => {
-                var _a, _b;
-                const value = Math.max(0, _composition[category.key] || 0);
-                const rowMax = (_a = maxByCategory[category.key]) !== null && _a !== void 0 ? _a : value;
-                const plusLimitHint = value >= rowMax
-                    ? capacityReached
-                        ? t('prices:capacityReached', {
-                            count: capacityMax,
-                            defaultValue: 'Максимум {{count}} участников',
-                        })
-                        : t('prices:pricingMaxReached', {
-                            count: pricingMax,
-                            defaultValue: 'Максимум {{count}} участников по этому тарифу',
-                        })
-                    : undefined;
-                return (react_1.default.createElement(ticket_row_1.TicketRow, { key: category.key, title: categoryTitle(category), priceHint: categoryPriceHint(category), description: ((_b = category.description) === null || _b === void 0 ? void 0 : _b.trim()) || undefined, value: value, min: 0, max: rowMax, minusLabel: t('prices:minus', { defaultValue: 'На одного меньше' }), plusLabel: t('prices:plus', { defaultValue: 'На одного больше' }), plusDisabledHint: plusLimitHint, onChange: (next) => handleChangeCategory(category.key, next) }));
-            })),
+                            : 'primary' })))))),
+            (hasExtraRows ? !flexSelected : true) &&
+                (hasExtraRows ? categories : addOnCategories).map((category) => {
+                    var _a, _b;
+                    const value = Math.max(0, _composition[category.key] || 0);
+                    const rowMax = (_a = maxByCategory[category.key]) !== null && _a !== void 0 ? _a : value;
+                    const plusLimitHint = value >= rowMax
+                        ? capacityReached
+                            ? t('prices:capacityReached', {
+                                count: capacityMax,
+                                defaultValue: 'Максимум {{count}} участников',
+                            })
+                            : t('prices:pricingMaxReached', {
+                                count: pricingMax,
+                                defaultValue: 'Максимум {{count}} участников по этому тарифу',
+                            })
+                        : undefined;
+                    return (react_1.default.createElement(ticket_row_1.TicketRow, { key: category.key, title: categoryTitle(category), priceHint: categoryPriceHint(category), description: ((_b = category.description) === null || _b === void 0 ? void 0 : _b.trim()) || undefined, value: value, min: 0, max: rowMax, minusLabel: t('prices:minus', { defaultValue: 'На одного меньше' }), plusLabel: t('prices:plus', { defaultValue: 'На одного больше' }), plusDisabledHint: plusLimitHint, onChange: (next) => handleChangeCategory(category.key, next) }));
+                })),
         !hidePriceHints && !flexSelected && bookable && (react_1.default.createElement(flex_columns_1.FlexColumns, { columns: 1, gr: 4, gc: 0 }, priceSummary)),
         hidePriceHints && !flexSelected && bookable && (react_1.default.createElement("div", { style: {
                 display: 'flex',

package/dist/use-localstore-state/index.d.ts CHANGED Viewed

@@ -1,2 +1,4 @@
 export type LocalstoreSetValue<T> = T | undefined | ((prev: T | undefined) => T | undefined);
+export declare function readFromLocalstore<T>(token: string, defaultValue?: T): T | undefined;
+export declare function writeToLocalstore<T>(token: string, value: T | undefined): void;
 export declare function useLocalstoreState<T>(token: string, defaultValue?: T): [T | undefined, (update: LocalstoreSetValue<T>) => void];

package/dist/use-localstore-state/index.js CHANGED Viewed

@@ -1,8 +1,11 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.readFromLocalstore = readFromLocalstore;
+exports.writeToLocalstore = writeToLocalstore;
 exports.useLocalstoreState = useLocalstoreState;
 const react_1 = require("react");
 function readFromLocalstore(token, defaultValue) {
+    var _a;
     if (typeof window === 'undefined') {
         return defaultValue;
     }
@@ -12,11 +15,32 @@ function readFromLocalstore(token, defaultValue) {
             return JSON.parse(prev);
         }
     }
-    catch (_a) {
-        localStorage.removeItem(token);
+    catch (_b) {
+        try {
+            (_a = window.localStorage) === null || _a === void 0 ? void 0 : _a.removeItem(token);
+        }
+        catch (_c) {
+            // Storage itself can be blocked, not just contain invalid JSON.
+        }
     }
     return defaultValue;
 }
+function writeToLocalstore(token, value) {
+    var _a, _b;
+    if (typeof window === 'undefined')
+        return;
+    try {
+        if (value) {
+            (_a = window.localStorage) === null || _a === void 0 ? void 0 : _a.setItem(token, JSON.stringify(value));
+        }
+        else {
+            (_b = window.localStorage) === null || _b === void 0 ? void 0 : _b.removeItem(token);
+        }
+    }
+    catch (_c) {
+        // Keep React state usable when storage is unavailable or its quota is full.
+    }
+}
 function useLocalstoreState(token, defaultValue) {
     // We track defaultValue via ref so token changes don't pull in stale closures
     // while also avoiding extra effect runs when consumers pass an inline default.
@@ -41,12 +65,7 @@ function useLocalstoreState(token, defaultValue) {
             if (next === prev) {
                 return prev;
             }
-            if (next) {
-                localStorage.setItem(token, JSON.stringify(next));
-            }
-            else {
-                localStorage.removeItem(token);
-            }
+            writeToLocalstore(token, next);
             return next;
         });
     }, [token]);

package/dist/use-localstore-state/index.spec.d.ts ADDED Viewed

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

package/dist/use-localstore-state/index.spec.js ADDED Viewed

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const index_1 = require("./index");
+describe('unavailable local storage', () => {
+    afterEach(() => {
+        delete globalThis.window;
+        delete globalThis.localStorage;
+    });
+    it.each(['null', 'blocked'])('returns a default and allows writes with %s storage', (mode) => {
+        const getStorage = () => {
+            if (mode === 'blocked')
+                throw new Error('Access denied');
+            return null;
+        };
+        const browser = {};
+        Object.defineProperty(browser, 'localStorage', { get: getStorage });
+        globalThis.window = browser;
+        Object.defineProperty(globalThis, 'localStorage', { get: getStorage, configurable: true });
+        expect((0, index_1.readFromLocalstore)('client', 'default')).toBe('default');
+        expect(() => (0, index_1.writeToLocalstore)('client', undefined)).not.toThrow();
+        expect(() => (0, index_1.writeToLocalstore)('client', 'new value')).not.toThrow();
+    });
+    it('still removes malformed JSON when storage works', () => {
+        const storage = { getItem: () => '{', removeItem: jest.fn() };
+        globalThis.window = { localStorage: storage };
+        globalThis.localStorage = storage;
+        expect((0, index_1.readFromLocalstore)('client', 'default')).toBe('default');
+        expect(storage.removeItem).toHaveBeenCalledWith('client');
+    });
+});

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@escapenavigator/hooks",
-  "version": "2.2.8",
+  "version": "2.2.10",
   "publishConfig": {
     "access": "public"
   },
@@ -14,9 +14,9 @@
     "test": "jest"
   },
   "dependencies": {
-    "@escapenavigator/services": "^2.2.8",
-    "@escapenavigator/types": "^2.2.7",
-    "@escapenavigator/utils": "^2.2.7",
+    "@escapenavigator/services": "^2.2.9",
+    "@escapenavigator/types": "^2.2.8",
+    "@escapenavigator/utils": "^2.2.8",
     "libphonenumber-js": "^1.12.24",
     "react": "19.2.6",
     "react-phone-input-2": "^2.15.1"
@@ -32,5 +32,5 @@
     "ts-jest": "^29.1.1",
     "typescript": "^5.6"
   },
-  "gitHead": "821f81560e48bb5554575ada7f5f8b0d7597fdcb"
+  "gitHead": "30230db507f7483ba425b0811f31d980d3b0a684"
 }