import{n as e,r as t}from"./rolldown-runtime-C0FnF6B9.js";import{t as n}from"./react-C21x__mS.js";import{n as r}from"./iframe-GrlyTB2d.js";import{n as i,t as a}from"./MultiSelect-CJrLmYe-.js";var o=t({Basic:()=>p,Empty:()=>g,ErrorState:()=>h,Loading:()=>m,__namedExportsOrder:()=>_,default:()=>f}),s,c,l,u,d,f,p,m,h,g,_;function v(){return(v=e((()=>{s=n(),i(),c=r(),{useArgs:l}=__STORYBOOK_MODULE_PREVIEW_API__,{fn:u}=__STORYBOOK_MODULE_TEST__,d=[{code:`MOW`,label:`Москва`},{code:`SPB`,label:`Санкт-Петербург`},{code:`EKB`,label:`Екатеринбург`},{code:`KZN`,label:`Казань`},{code:`NSK`,label:`Новосибирск`}],f={title:`Shared/UI/MultiSelect`,component:a,args:{label:`Города`,description:`Выберите несколько значений.`,placeholder:`Начните вводить`,value:[],onChange:u(),codeKey:`code`,textKey:`label`,items:d,query:``,onQuery:u(),onOpen:()=>{},onClose:u(),size:`md`,disabled:!1},parameters:{atomicCanvas:!0,layout:`padded`},argTypes:{label:{description:`Заголовок поля.`,control:`text`},description:{description:`Описание под полем.`,control:`text`},placeholder:{description:`Текст пустого поля.`,control:`text`},value:{description:`Контролируемый набор выбранных option.`,control:!1},onChange:{description:`Вызывается после подтверждения набора option.`,control:!1},codeKey:{description:`Имя поля option с уникальным ключом.`,control:`text`},textKey:{description:`Имя поля option с отображаемым текстом.`,control:`text`},hideCode:{description:`Скрывает код option в токенах и списке.`,control:`boolean`},items:{description:`Набор доступных option.`,control:!1},query:{description:`Контролируемый текст поиска.`,control:`text`},defaultQuery:{description:`Начальный текст поиска в uncontrolled-режиме.`,control:`text`},highlightQuery:{description:`Текст, который подсвечивается в option.`,control:`text`},onQuery:{description:`Вызывается при вводе поисковой строки.`,control:!1},defaultFilter:{description:`Включает встроенную фильтрацию option.`,control:`boolean`},getOptionDisabled:{description:`Блокирует отдельные option с учетом текущего выбора.`,control:!1},onOpen:{description:`Вызывается при открытии списка.`,control:!1},onClose:{description:`Вызывается при закрытии списка после commit.`,control:!1},error:{description:`Текст ошибки загрузки option.`,control:`text`},isLoading:{description:`Показывает состояние загрузки option.`,control:`boolean`},renderToken:{description:`Кастомный рендер выбранных токенов.`,control:!1},renderToolbar:{description:`Кастомный рендер toolbar popup.`,control:!1},renderItem:{description:`Кастомный рендер строки option.`,control:!1},disabled:{description:`Блокирует взаимодействие с полем.`,control:`boolean`},size:{description:`Размер поля и подписей.`,control:`select`,options:[`xs`,`sm`,`md`,`lg`,`xl`]}}},p={render:function(e){let[,t]=l(),n=e.value??[d[1]],r=e.query??``,i=(0,s.useMemo)(()=>{let e=r.trim().toLowerCase();return e?d.filter(t=>t.label.toLowerCase().includes(e)||t.code.toLowerCase().includes(e)):d},[r]);return(0,c.jsx)(a,{...e,value:n,items:i,query:r,onQuery:n=>{e.onQuery?.(n),t({query:n})},onChange:n=>{e.onChange(n),t({value:n})}})}},m={render:function(e){let[,t]=l();return(0,c.jsx)(a,{...e,value:e.value??[],items:[],isLoading:!0,onChange:n=>{e.onChange(n),t({value:n})}})}},h={render:function(e){let[,t]=l();return(0,c.jsx)(a,{...e,value:e.value??[],items:[],error:`Ошибка загрузки`,onChange:n=>{e.onChange(n),t({value:n})}})}},g={render:function(e){let[,t]=l();return(0,c.jsx)(a,{...e,value:e.value??[],items:[],onChange:n=>{e.onChange(n),t({value:n})}})}},p.parameters={...p.parameters,docs:{...p.parameters?.docs,source:{originalSource:`{
  render: function Render(args) {
    const [, updateArgs] = useArgs<React.ComponentProps<typeof MultiSelect>>();
    const value = args.value ?? [catalog[1]!];
    const query = args.query ?? "";
    const filteredItems = useMemo(() => {
      const needle = query.trim().toLowerCase();
      if (!needle) {
        return catalog;
      }
      return catalog.filter(item => item.label.toLowerCase().includes(needle) || item.code.toLowerCase().includes(needle));
    }, [query]);
    return <MultiSelect {...args} value={value} items={filteredItems} query={query} onQuery={query => {
      args.onQuery?.(query);
      updateArgs({
        query
      });
    }} onChange={value => {
      args.onChange(value);
      updateArgs({
        value
      });
    }} />;
  }
}`,...p.parameters?.docs?.source}}},m.parameters={...m.parameters,docs:{...m.parameters?.docs,source:{originalSource:`{
  render: function Render(args) {
    const [, updateArgs] = useArgs<React.ComponentProps<typeof MultiSelect>>();
    return <MultiSelect {...args} value={args.value ?? []} items={[]} isLoading onChange={value => {
      args.onChange(value);
      updateArgs({
        value
      });
    }} />;
  }
}`,...m.parameters?.docs?.source}}},h.parameters={...h.parameters,docs:{...h.parameters?.docs,source:{originalSource:`{
  render: function Render(args) {
    const [, updateArgs] = useArgs<React.ComponentProps<typeof MultiSelect>>();
    return <MultiSelect {...args} value={args.value ?? []} items={[]} error="Ошибка загрузки" onChange={value => {
      args.onChange(value);
      updateArgs({
        value
      });
    }} />;
  }
}`,...h.parameters?.docs?.source}}},g.parameters={...g.parameters,docs:{...g.parameters?.docs,source:{originalSource:`{
  render: function Render(args) {
    const [, updateArgs] = useArgs<React.ComponentProps<typeof MultiSelect>>();
    return <MultiSelect {...args} value={args.value ?? []} items={[]} onChange={value => {
      args.onChange(value);
      updateArgs({
        value
      });
    }} />;
  }
}`,...g.parameters?.docs?.source}}},_=[`Basic`,`Loading`,`ErrorState`,`Empty`]})))()}export{o as a,m as i,g as n,v as o,h as r,p as t};