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"./Select-tPi1vIDV.js";function o(e,t){return e[t]}function s(e,t,n){let r=e[t];if(typeof r==`string`||typeof r==`number`)return r;let i=o(e,n);return typeof i==`string`||typeof i==`number`?i:String(i)}function c({label:e,description:t,disabled:n,placeholder:r,size:i,options:c,value:u,onChange:d,optionKey:f,optionLabel:p,renderCode:m,className:h,clearable:g}){let _=u===void 0?void 0:c.find(e=>o(e,f)===u);return(0,l.jsx)(a,{label:e,description:t,disabled:n,placeholder:r,size:i,options:c,value:_,onChange:e=>d(e?o(e,f):void 0),getOptionKey:e=>o(e,f),getOptionLabel:e=>s(e,p,f),getOptionCode:m?e=>o(e,f):void 0,className:h,clearable:g})}var l;function u(){return(u=e((()=>{i(),l=r(),c.__docgenInfo={description:``,methods:[],displayName:`SerializableSelect`,props:{options:{required:!0,tsType:{name:`unknown`},description:``},onChange:{required:!0,tsType:{name:`signature`,type:`function`,raw:`(value: SerializableOptionValue<TOption, TOptionKey> | undefined) => void`,signature:{arguments:[{type:{name:`union`,raw:`SerializableOptionValue<TOption, TOptionKey> | undefined`,elements:[{name:`Extract`,elements:[{name:`TOption[TOptionKey]`,raw:`TOption[TOptionKey]`},{name:`union`,raw:`string | number`,elements:[{name:`string`},{name:`number`}]}],raw:`Extract<
	TOption[TOptionKey],
	SelectOptionKey
>`},{name:`undefined`}]},name:`value`}],return:{name:`void`}}},description:``},optionKey:{required:!0,tsType:{name:`TOptionKey`},description:``},optionLabel:{required:!0,tsType:{name:`TOptionLabel`},description:``},renderCode:{required:!1,tsType:{name:`literal`,value:`true`},description:``},className:{required:!1,tsType:{name:`string`},description:``},clearable:{required:!1,tsType:{name:`boolean`},description:``}},composes:[`Omit`]}})))()}var d=t({AsyncReloadLike:()=>S,Controlled:()=>y,Disabled:()=>C,Placeholder:()=>b,WithCode:()=>x,__namedExportsOrder:()=>w,default:()=>v}),f,p,m,h,g,_,v,y,b,x,S,C,w;function T(){return(T=e((()=>{f=n(),u(),p=r(),{useArgs:m,useState:h}=__STORYBOOK_MODULE_PREVIEW_API__,{fn:g}=__STORYBOOK_MODULE_TEST__,_=[{id:10,name:`Продажи`,code:`SLS`,branch:`Екатеринбург`},{id:20,name:`Закупки`,code:`PRC`,branch:`Челябинск`},{id:30,name:`Логистика`,code:`LGS`,branch:`Новосибирск`},{id:40,name:`Сервис`,code:`SRV`,branch:`Москва`}],v={title:`Shared/UI/SerializableSelect`,component:c,args:{label:`Подразделение`,description:`Сериализуемая обёртка над Select для object-options и field-based конфигурации.`,placeholder:`Выберите подразделение`,options:_,optionKey:`id`,optionLabel:`name`,value:void 0,onChange:g(),size:`md`},parameters:{atomicCanvas:!0,layout:`padded`,docs:{description:{component:`Высокоуровневая обёртка над low-level Select. Принимает массив объектов, получает key и label по именам полей, а наружу возвращает только значение ключа. Нужна для сериализуемых конфигов, в том числе в src/shared/ui/controls/*.`}}},argTypes:{label:{description:`Заголовок поля.`,control:`text`},description:{description:`Описание под заголовком.`,control:`text`},placeholder:{description:`Текст, когда ключ ещё не выбран.`,control:`text`},options:{description:`Массив объектных option.`,control:!1},optionKey:{description:`Поле объекта, значение которого используется как ключ и отдаётся наружу через onChange.`,control:!1},optionLabel:{description:`Поле объекта, значение которого отображается как основной текст option.`,control:!1},renderCode:{description:`Если включено, справа от текста будет показан ключ optionKey.`,control:`boolean`},value:{description:`Текущий выбранный ключ option, а не вся option целиком.`,control:!1},onChange:{description:`Вызывается с новым значением optionKey.`,control:!1},size:{description:`Размер поля и подписей.`,control:`select`,options:[`xs`,`sm`,`md`,`lg`,`xl`]},disabled:{description:`Блокирует взаимодействие с полем.`,control:`boolean`},clearable:{description:`Показывает действие очистки выбранного ключа.`,control:`boolean`}}},y={name:`Выбор по ключу`,render:function(e){let[,t]=m();return(0,p.jsx)(c,{...e,value:e.value??20,onChange:n=>{e.onChange(n),t({value:n})}})},args:{value:20}},b={render:function(e){let[,t]=m();return(0,p.jsx)(c,{...e,onChange:n=>{e.onChange(n),t({value:n})}})}},x={name:`С кодом`,render:function(e){let[,t]=m();return(0,p.jsx)(c,{...e,value:e.value??10,renderCode:!0,onChange:n=>{e.onChange(n),t({value:n})}})},args:{value:10,renderCode:!0}},S={name:`Смена набора опций`,render:function(e){let[,t]=m(),[n,r]=h(!1),i=(0,f.useMemo)(()=>n?_.filter(e=>e.id!==20):_,[n]);return(0,p.jsxs)(`div`,{style:{display:`grid`,gap:`12px`,maxWidth:`320px`},children:[(0,p.jsx)(`button`,{type:`button`,onClick:()=>r(e=>!e),children:n?`Показать полный список`:`Скрыть одну опцию`}),(0,p.jsx)(c,{...e,options:i,value:e.value??30,onChange:n=>{e.onChange(n),t({value:n})}})]})},args:{value:30}},C={args:{disabled:!0,value:10}},y.parameters={...y.parameters,docs:{...y.parameters?.docs,source:{originalSource:`{
  name: "Выбор по ключу",
  render: function Render(args) {
    const [, updateArgs] = useArgs<SerializableSelectProps<DepartmentOption, "id", "name">>();
    return <SerializableSelect {...args} value={args.value ?? 20} onChange={value => {
      args.onChange(value);
      updateArgs({
        value
      });
    }} />;
  },
  args: {
    value: 20
  }
}`,...y.parameters?.docs?.source}}},b.parameters={...b.parameters,docs:{...b.parameters?.docs,source:{originalSource:`{
  render: function Render(args) {
    const [, updateArgs] = useArgs<SerializableSelectProps<DepartmentOption, "id", "name">>();
    return <SerializableSelect {...args} onChange={value => {
      args.onChange(value);
      updateArgs({
        value
      });
    }} />;
  }
}`,...b.parameters?.docs?.source}}},x.parameters={...x.parameters,docs:{...x.parameters?.docs,source:{originalSource:`{
  name: "С кодом",
  render: function Render(args) {
    const [, updateArgs] = useArgs<SerializableSelectProps<DepartmentOption, "id", "name">>();
    return <SerializableSelect {...args} value={args.value ?? 10} renderCode onChange={value => {
      args.onChange(value);
      updateArgs({
        value
      });
    }} />;
  },
  args: {
    value: 10,
    renderCode: true
  }
}`,...x.parameters?.docs?.source}}},S.parameters={...S.parameters,docs:{...S.parameters?.docs,source:{originalSource:`{
  name: "Смена набора опций",
  render: function Render(args) {
    const [, updateArgs] = useArgs<SerializableSelectProps<DepartmentOption, "id", "name">>();
    const [showShortList, setShowShortList] = useStorybookState(false);
    const options = useMemo(() => showShortList ? departmentOptions.filter(option => option.id !== 20) : departmentOptions, [showShortList]);
    return <div style={{
      display: "grid",
      gap: "12px",
      maxWidth: "320px"
    }}>
                <button type="button" onClick={() => setShowShortList(current => !current)}>
                    {showShortList ? "Показать полный список" : "Скрыть одну опцию"}
                </button>
                <SerializableSelect {...args} options={options} value={args.value ?? 30} onChange={value => {
        args.onChange(value);
        updateArgs({
          value
        });
      }} />
            </div>;
  },
  args: {
    value: 30
  }
}`,...S.parameters?.docs?.source}}},C.parameters={...C.parameters,docs:{...C.parameters?.docs,source:{originalSource:`{
  args: {
    disabled: true,
    value: 10
  }
}`,...C.parameters?.docs?.source}}},w=[`Controlled`,`Placeholder`,`WithCode`,`AsyncReloadLike`,`Disabled`]})))()}export{d as a,b as i,y as n,x as o,C as r,T as s,S as t};