import{i as e}from"./preload-helper-B45gAKPr.js";import{E as t,a as n,d as r,f as i,l as a,m as o,n as s,p as c,r as l,u}from"./blocks-CwEU-ME1.js";import{t as d}from"./jsx-runtime-BBQGix-2.js";import{t as f}from"./mdx-react-shim-DnKFgFHy.js";import{AutoSwitchByRange as p,Controlled as m,Disabled as h,n as g,t as _}from"./PeriodSelect.stories-BI6yLRCK.js";function v(e){let o={code:`code`,h2:`h2`,h3:`h3`,li:`li`,p:`p`,pre:`pre`,ul:`ul`,...t(),...e.components};return(0,b.jsxs)(b.Fragment,{children:[(0,b.jsx)(a,{of:_,parameters:{docs:{toc:!0}}}),`
`,(0,b.jsx)(c,{children:`PeriodSelect`}),`
`,(0,b.jsx)(i,{children:`Выбор периода детализации дат с ограничением вариантов по связанному диапазону`}),`
`,(0,b.jsxs)(o.p,{children:[`PeriodSelect используется для выбора уровня детализации: `,(0,b.jsx)(o.code,{children:`day`}),`, `,(0,b.jsx)(o.code,{children:`week`}),` или `,(0,b.jsx)(o.code,{children:`month`}),`. Компонент хранит только id выбранного периода, а недоступность вариантов вычисляет по переданному `,(0,b.jsx)(o.code,{children:`dateRange`}),` и порогам `,(0,b.jsx)(o.code,{children:`maxDayRangeDays`}),` / `,(0,b.jsx)(o.code,{children:`maxWeekRangeWeeks`}),`.`]}),`
`,(0,b.jsx)(o.h2,{id:`основной-сценарий`,children:`Основной сценарий`}),`
`,(0,b.jsx)(u,{}),`
`,(0,b.jsx)(n,{of:m}),`
`,(0,b.jsx)(o.pre,{children:(0,b.jsx)(o.code,{className:`language-tsx`,children:`import { useState } from "react";

import { PeriodSelect } from "@/shared/ui";

export function Example() {
	const [value, setValue] = useState("day");
	const dateRange = [new Date(2026, 2, 1), new Date(2026, 2, 14)] as const;

	return <PeriodSelect label="Период" value={value} onChange={setValue} dateRange={dateRange} maxDayRangeDays={31} />;
}
`})}),`
`,(0,b.jsx)(o.h2,{id:`практические-рекомендации`,children:`Практические рекомендации`}),`
`,(0,b.jsxs)(o.ul,{children:[`
`,(0,b.jsxs)(o.li,{children:[`Передавайте `,(0,b.jsx)(o.code,{children:`dateRange`}),`, если период должен зависеть от выбранного диапазона дат.`]}),`
`,(0,b.jsxs)(o.li,{children:[`Настраивайте `,(0,b.jsx)(o.code,{children:`maxDayRangeDays`}),` и `,(0,b.jsx)(o.code,{children:`maxWeekRangeWeeks`}),` в конфиге параметрического контрола, а не в потребителях runtime.`]}),`
`,(0,b.jsxs)(o.li,{children:[`В story `,(0,b.jsx)(o.code,{children:`Controlled`}),` значения обновляются через `,(0,b.jsx)(o.code,{children:`useArgs`}),`, поэтому Controls и сам Select остаются синхронизированы.`]}),`
`]}),`
`,(0,b.jsx)(o.h2,{id:`сценарии-использования`,children:`Сценарии использования`}),`
`,(0,b.jsx)(o.h3,{id:`контролируемый-выбор-с-редактированием-props-через-storybook-controls`,children:`Контролируемый выбор с редактированием props через Storybook Controls`}),`
`,(0,b.jsx)(l,{of:m}),`
`,(0,b.jsx)(o.h3,{id:`автопереключение-при-слишком-большом-диапазоне`,children:`Автопереключение при слишком большом диапазоне`}),`
`,(0,b.jsx)(l,{of:p}),`
`,(0,b.jsx)(o.h3,{id:`заблокированное-состояние`,children:`Заблокированное состояние`}),`
`,(0,b.jsx)(l,{of:h}),`
`,(0,b.jsx)(o.h2,{id:`api`,children:`API`}),`
`,(0,b.jsx)(s,{of:_}),`
`,(0,b.jsx)(o.h2,{id:`все-сторисы`,children:`Все сторисы`}),`
`,(0,b.jsx)(r,{includePrimary:!1})]})}function y(e={}){let{wrapper:n}={...t(),...e.components};return n?(0,b.jsx)(n,{...e,children:(0,b.jsx)(v,{...e})}):v(e)}var b;e((()=>{b=d(),f(),o(),g()}))();export{y as default};