import{P as d}from"./PzText-D5PUnIjq.js";import{e as m,x as y,A as h,n as z,z as f,c as v,o as g,q as s,y as i}from"./iframe-Bl-fVlm8.js";import{_ as b}from"./_plugin-vue_export-helper-DlAUqK2U.js";import"./preload-helper-C1FmrZbK.js";const x={class:"pz-search-result-item-layout-surface"},S={class:"pz-search-result-item-layout-grid"},L={class:"pz-search-result-item-layout-main"},_={class:"pz-search-result-item-layout-aside"},r=m({name:"PzSearchResultItemLayout",__name:"PzSearchResultItemLayout",props:{as:{default:"li"},desktopColumns:{default:"minmax(0, 1fr) minmax(240px, 292px)"}},setup(e){const t=e,o=v(()=>({"--pz-search-result-item-layout-columns-lg":t.desktopColumns}));return(l,A)=>(g(),y(f(t.as),{class:"pz-search-result-item-layout",style:z(o.value)},{default:h(()=>[s("div",x,[s("div",S,[s("div",L,[i(l.$slots,"first-col",{},void 0,!0)]),s("div",_,[i(l.$slots,"second-col",{},void 0,!0)])])])]),_:3},8,["style"]))}}),c=b(r,[["__scopeId","data-v-53ce1156"]]);r.__docgenInfo=Object.assign({displayName:r.name??r.__name},{name:"PzSearchResultItemLayout",exportName:"default",displayName:"PzSearchResultItemLayout",description:"",tags:{},props:[{name:"as",required:!1,type:{name:"PzSearchResultItemLayoutTag"},defaultValue:{func:!1,value:'"li"'}},{name:"desktopColumns",required:!1,type:{name:"string"},defaultValue:{func:!1,value:'"minmax(0, 1fr) minmax(240px, 292px)"'}}],slots:[{name:"first-col"},{name:"second-col"}],sourceFiles:["/builds/Web-Projects/client-services/prozorro-ui/src/components/Layouts/PzSearchResultItemLayout/PzSearchResultItemLayout.vue"]});const I=["li","article","div"],P=[{id:"tenders",eyebrow:"Procurement results",title:"Tender search",resultLabel:"Знайдено більше 10 000 закупівель",sortLabel:"за замовчуванням",cards:[{id:"tender-1",title:"Вогнегасник ВП-5(з)",status:"Завершена",organization:'ДЕРЖАВНА УСТАНОВА "ЛУЦЬКИЙ СЛІДЧИЙ ІЗОЛЯТОР" • Луцьк',identifier:"ID: UA-2026-04-16-007213-a",metrics:[{id:"budget",label:"Очікувана вартість",value:"4 830,00 UAH",accent:"success"}]},{id:"tender-2",title:'Електрична енергія, без розподілу (постачальник "останньої надії")',status:"Підготовка угоди",organization:"Ратнівський дитячий садок №2 Ратнівської селищної ради • Ковельський р-н, селище міського типу Ратне",identifier:"ID: UA-2026-04-16-007209-a",metrics:[{id:"budget",label:"Очікувана вартість",value:"54 741,16 UAH",accent:"success"}]}]},{id:"qualifications",eyebrow:"Selection results",title:"Framework selection search",resultLabel:"Знайдено 470 відборів",sortLabel:"за замовчуванням",cards:[{id:"selection-1",title:"33730000-6 Офтальмологічні вироби та коригувальні лінзи",status:"Активний до 5 бер. 23:00",organization:"",identifier:"ID: UA-F-2026-04-06-000001",metrics:[{id:"clarification",label:"Уточнення до:",value:"20 квіт. 23:00"},{id:"published",label:"Оголошено:",value:"6 квіт. 2026"}]},{id:"selection-2",title:"33650000-1 Загальні протиінфекційні засоби для системного застосування",status:"Активний до 13 лют. 23:00",organization:"",identifier:"ID: UA-F-2026-03-17-000001",metrics:[{id:"clarification",label:"Уточнення до:",value:"31 бер. 23:00"},{id:"published",label:"Оголошено:",value:"17 бер. 2026"}]}]},{id:"plans",eyebrow:"Planning results",title:"Annual plan search",resultLabel:"Знайдено більше 10 000 планів",sortLabel:"за замовчуванням",cards:[{id:"plan-1",title:"ДК 021:2015 по коду: 22460000-2 Рекламні матеріали, каталоги товарів та посібники",status:"22460000-2: Рекламні матеріали, каталоги товарів та посібники",organization:"Державний ліцей з посиленою військово-фізичною підготовкою «Слобожанський»",identifier:"ID: UA-P-2026-04-16-009442-a",metrics:[{id:"budget",label:"Планова сума закупівлі",value:"700,00 UAH",accent:"success"},{id:"date",label:"Планова дата",value:"березень 2026"}]},{id:"plan-2",title:"Членський внесок за 2026 рік",status:"98100000-4: Послуги членських організацій",organization:"Ганнівська сільська рада Новоукраїнського району Кіровоградської області",identifier:"ID: UA-P-2026-04-16-009435-a",metrics:[{id:"budget",label:"Планова сума закупівлі",value:"3 572,00 UAH",accent:"success"},{id:"date",label:"Планова дата",value:"квітень 2026"}]}]}],k=e=>`<template>
  <PzSearchResultItemLayout ${[e.as&&e.as!=="li"?`as="${e.as}"`:null,e.desktopColumns&&e.desktopColumns!=="minmax(0, 1fr) minmax(240px, 292px)"?`desktop-columns="${e.desktopColumns}"`:null].filter(o=>!!o).join(" ")}>
    <template #first-col>
      <a href="#">Result title</a>
      <p>Status or secondary line</p>
      <p>Organization or supporting copy</p>
      <p>ID: UA-000000-00-00-000000-a</p>
    </template>

    <template #second-col>
      <div>
        <span>Очікувана вартість</span>
        <strong>4 830,00 UAH</strong>
      </div>
    </template>
  </PzSearchResultItemLayout>
</template>`,R={title:"Components/Layouts/PzSearchResultItemLayout",component:c,parameters:{prototype:{caption:"Search result item layout",note:"Search-list card shell for procurement, selection, and planning results. The component owns spacing, card surface, and responsive column rhythm while consumers compose the inner content through slots."},docs:{description:{component:"Use `PzSearchResultItemLayout` as a structural primitive for search results with a wide content area and a compact metrics column. Fill the content through the `first-col` and `second-col` slots."},source:{transform:(e,t)=>k(t.args??R.args)}}},args:{as:"li",desktopColumns:"minmax(0, 1fr) minmax(240px, 292px)"},argTypes:{as:{control:"select",options:I,description:"HTML tag used for the outer wrapper."},desktopColumns:{control:"text",description:"CSS value for desktop grid columns at the `lg` breakpoint, for example `2fr 1fr` or `minmax(0, 1fr) minmax(320px, 380px)`."}},render:e=>({components:{pzSearchResultItemLayout:c,pzText:d},setup(){return{args:e,searchResultGroups:P}},template:`
      <section class="pz-search-result-layout-story">
        <div class="pz-search-result-layout-story-hero">
          <div>
            <span class="pz-search-result-layout-story-eyebrow">Component API</span>
            <pz-text variant="h4-bold">Search results with an adaptive metrics rail</pz-text>
          </div>
          <span class="pz-search-result-layout-story-chip">{{ args.as }}</span>
        </div>

        <div class="pz-search-result-layout-story-board">
          <section
            v-for="group in searchResultGroups"
            :key="group.id"
            class="pz-search-result-layout-story-group"
          >
            <div class="pz-search-result-layout-story-group-header">
              <div>
                <span class="pz-search-result-layout-story-group-kicker">{{ group.eyebrow }}</span>
                <pz-text variant="h4-bold">{{ group.title }}</pz-text>
              </div>

              <button
                type="button"
                class="pz-search-result-layout-story-sort"
              >
                Сортування:
                <span>{{ group.sortLabel }}</span>
              </button>
            </div>

            <p class="pz-search-result-layout-story-result-label">{{ group.resultLabel }}</p>

            <component
              :is="args.as === 'li' ? 'ul' : 'div'"
              class="pz-search-result-layout-story-list"
            >
              <pz-search-result-item-layout
                v-for="card in group.cards"
                :key="card.id"
                :as="args.as"
                :desktop-columns="args.desktopColumns"
              >
                <template #first-col>
                  <div class="pz-search-result-layout-story-main">
                    <a
                      href="#"
                      class="pz-search-result-layout-story-title"
                    >
                      {{ card.title }}
                    </a>

                    <p class="pz-search-result-layout-story-status">{{ card.status }}</p>

                    <p
                      v-if="card.subtitle"
                      class="pz-search-result-layout-story-subtitle"
                    >
                      {{ card.subtitle }}
                    </p>

                    <p
                      v-if="card.organization"
                      class="pz-search-result-layout-story-organization"
                    >
                      {{ card.organization }}
                    </p>

                    <p class="pz-search-result-layout-story-identifier">{{ card.identifier }}</p>
                  </div>
                </template>

                <template #second-col>
                  <div class="pz-search-result-layout-story-aside">
                    <div
                      v-for="metric in card.metrics"
                      :key="metric.id"
                      class="pz-search-result-layout-story-metric"
                    >
                      <span class="pz-search-result-layout-story-metric-label">{{ metric.label }}</span>
                      <strong
                        class="pz-search-result-layout-story-metric-value"
                        :class="{
                          'pz-search-result-layout-story-metric-value-success': metric.accent === 'success',
                        }"
                      >
                        {{ metric.value }}
                      </strong>
                    </div>
                  </div>
                </template>
              </pz-search-result-item-layout>
            </component>
          </section>
        </div>
      </section>
    `})},a={};var u,n,p;a.parameters={...a.parameters,docs:{...(u=a.parameters)==null?void 0:u.docs,source:{originalSource:"{}",...(p=(n=a.parameters)==null?void 0:n.docs)==null?void 0:p.source}}};const T=["Playground"];export{a as Playground,T as __namedExportsOrder,R as default};
