import{P as c}from"./PzText-D5PUnIjq.js";import{P as A}from"./PzKeyValue-Bqw-YOMe.js";import"./iframe-Bl-fVlm8.js";import"./preload-helper-C1FmrZbK.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./isArray-DPUC7i9_.js";import"./lodash-CdDiHlzQ.js";import"./PzDomHandler-BU7iMNnt.js";const d=A,O=A,T=["column","column-reverse","row","row-reverse"],i=[{id:"tender-id",key:"id",labelKey:"Tender ID"},{id:"tender-title",key:"title",labelKey:"Title"},{id:"tender-customer",key:"customer-name",labelKey:"Customer"},{id:"tender-amount",key:"amount",labelKey:"Expected value"},{id:"tender-status",key:"status",labelKey:"Status"},{id:"tender-note",key:"note",labelKey:"Note"}],l={id:"UA-2026-04-17-000123-a",title:"Закупівля медичного обладнання для лікарні №3",customer:{name:'ТОВ "АДМІНІСТРАЦІЯ ЗАКУПІВЕЛЬ"'},amount:"1 250 000,00 UAH",status:"Awaiting offers",note:""},p=[{id:"bid-supplier",key:"supplier",labelKey:"Bidder"},{id:"bid-amount",key:"amount",labelKey:"Amount"},{id:"bid-discount",key:"discount",labelKey:"Discount"},{id:"bid-submitted",key:"submittedAt",labelKey:"Submitted"},{id:"bid-winner",key:"isWinner",labelKey:"Winner"}],y={supplier:'ТОВ "ЕКО ЦЕНТР ПРОЕКТ"',amount:"98 000,00 UAH",discount:0,submittedAt:"17.04.2026 12:39",isWinner:!0},W=e=>`<template>
  <PzKeyValue
    ${[':config="config"',':data="data"',e.flexDirection&&e.flexDirection!=="column"?`flex-direction="${e.flexDirection}"`:null,e.checkRequired===!1?':check-required="false"':null,e.titleStyleClass?`title-style-class="${e.titleStyleClass}"`:null].filter(E=>!!E).join(`
    `)}
  />
</template>`,_={title:"Components/Display/PzKeyValue",component:O,parameters:{prototype:{caption:"Key-value list",note:"Presentational component for pairing labels with dynamic values. Filters empty fields by default and supports dot-notation lookups into the source data."},docs:{description:{component:"Use `PzKeyValue` to render a labelled list of values from a data object. Item order is driven by `config`; values resolve via dot-notation keys (via lodash `get`). Numbers and booleans are always rendered; empty strings/null/undefined are hidden when `checkRequired` is `true` (the default). Each item exposes a matching slot and a `<key>_label` slot for custom rendering."},source:{transform:(e,u)=>W(u.args??_.args)}}},args:{config:i,data:l,flexDirection:"column",checkRequired:!0,titleStyleClass:""},argTypes:{config:{control:!1,description:"Ordered list of `{ id, key, labelKey, labelStyleClass? }` entries describing each row.",table:{category:"Props"}},data:{control:!1,description:"Source object. Row values are resolved via lodash `get` on a dash-split key.",table:{category:"Props"}},flexDirection:{control:"inline-radio",options:T,description:"Applied as inline `flex-direction` on each value container.",table:{category:"Props"}},checkRequired:{control:"boolean",description:"When `true`, rows with empty strings / null / undefined are hidden. Numbers and booleans are always shown.",table:{category:"Props"}},titleStyleClass:{control:"text",description:"Extra class applied to every row title.",table:{category:"Props"}}},render:e=>({components:{pzKeyValue:d,pzText:c},setup(){return{args:e}},template:`
      <section class="pz-key-value-story">
        <section class="pz-key-value-story-board">
          <div class="pz-key-value-story-header">
            <div class="pz-key-value-story-copy">
              <span class="pz-key-value-story-eyebrow">Component API</span>
              <pz-text variant="h4-bold">Label / value rows for procurement details</pz-text>
            </div>
            <span class="pz-key-value-story-chip">{{ args.flexDirection }}</span>
          </div>

          <div class="pz-key-value-story-preview">
            <pz-key-value
              :config="args.config"
              :data="args.data"
              :flex-direction="args.flexDirection"
              :check-required="args.checkRequired"
              :title-style-class="args.titleStyleClass"
            />
          </div>
        </section>
      </section>
    `})},t={},a={args:{config:i,data:l,flexDirection:"column",checkRequired:!0}},n={args:{config:p,data:y,flexDirection:"row",checkRequired:!0}},r={args:{config:i,data:l,flexDirection:"column",checkRequired:!1},parameters:{docs:{description:{story:"`checkRequired: false` renders every row from `config`, even when the corresponding value is empty."}}}},s={args:{config:p,data:y,flexDirection:"column",checkRequired:!0},render:e=>({components:{pzKeyValue:d,pzText:c},setup(){return{args:e}},template:`
      <section class="pz-key-value-story">
        <section class="pz-key-value-story-board">
          <div class="pz-key-value-story-header">
            <div class="pz-key-value-story-copy">
              <span class="pz-key-value-story-eyebrow">Slots</span>
              <pz-text variant="h4-bold">Override value rendering per key</pz-text>
            </div>
          </div>

          <div class="pz-key-value-story-preview">
            <pz-key-value
              :config="args.config"
              :data="args.data"
              :flex-direction="args.flexDirection"
              :check-required="args.checkRequired"
            >
              <template #supplier="{ data }">
                <a
                  href="#"
                  class="pz-key-value-story-link"
                >
                  {{ data }}
                </a>
              </template>

              <template #isWinner="{ data }">
                <span>{{ data ? "Yes" : "No" }}</span>
              </template>
            </pz-key-value>
          </div>
        </section>
      </section>
    `}),parameters:{docs:{description:{story:"Each row exposes a slot named after its `key` and a `<key>_label` slot for the heading. Slot scope forwards the resolved value as `data`."}}}},o={render:()=>({components:{pzKeyValue:d,pzText:c},setup(){return{tenderConfig:i,tenderData:l,bidConfig:p,bidData:y,flexDirectionOptions:T}},template:`
      <section class="pz-key-value-story">
        <section class="pz-key-value-story-gallery">
          <article
            v-for="direction in flexDirectionOptions"
            :key="direction"
            class="pz-key-value-story-tile"
          >
            <div class="pz-key-value-story-copy">
              <span class="pz-key-value-story-eyebrow">flex-direction</span>
              <h4 class="pz-key-value-story-tile-title">{{ direction }}</h4>
              <p class="pz-key-value-story-tile-note">Rendered with tender-style data.</p>
            </div>

            <pz-key-value
              :config="tenderConfig"
              :data="tenderData"
              :flex-direction="direction"
            />
          </article>

          <article class="pz-key-value-story-tile">
            <div class="pz-key-value-story-copy">
              <span class="pz-key-value-story-eyebrow">check-required false</span>
              <h4 class="pz-key-value-story-tile-title">Always show rows</h4>
              <p class="pz-key-value-story-tile-note">Empty note field is still rendered.</p>
            </div>

            <pz-key-value
              :config="tenderConfig"
              :data="tenderData"
              :check-required="false"
            />
          </article>

          <article class="pz-key-value-story-tile">
            <div class="pz-key-value-story-copy">
              <span class="pz-key-value-story-eyebrow">winner bid</span>
              <h4 class="pz-key-value-story-tile-title">Falsy-preserving values</h4>
              <p class="pz-key-value-story-tile-note">Zero discount and boolean winner stay visible.</p>
            </div>

            <pz-key-value
              :config="bidConfig"
              :data="bidData"
            />
          </article>
        </section>
      </section>
    `}),parameters:{docs:{description:{story:"Reference board covering every `flexDirection` value, the `checkRequired: false` fallback, and numeric/boolean preservation."}}}};var v,m,f;t.parameters={...t.parameters,docs:{...(v=t.parameters)==null?void 0:v.docs,source:{originalSource:"{}",...(f=(m=t.parameters)==null?void 0:m.docs)==null?void 0:f.source}}};var k,g,z;a.parameters={...a.parameters,docs:{...(k=a.parameters)==null?void 0:k.docs,source:{originalSource:`{
  args: {
    config: tenderConfig,
    data: tenderData,
    flexDirection: "column",
    checkRequired: true
  }
}`,...(z=(g=a.parameters)==null?void 0:g.docs)==null?void 0:z.source}}};var b,h,x;n.parameters={...n.parameters,docs:{...(b=n.parameters)==null?void 0:b.docs,source:{originalSource:`{
  args: {
    config: bidConfig,
    data: bidData,
    flexDirection: "row",
    checkRequired: true
  }
}`,...(x=(h=n.parameters)==null?void 0:h.docs)==null?void 0:x.source}}};var w,D,C;r.parameters={...r.parameters,docs:{...(w=r.parameters)==null?void 0:w.docs,source:{originalSource:`{
  args: {
    config: tenderConfig,
    data: tenderData,
    flexDirection: "column",
    checkRequired: false
  },
  parameters: {
    docs: {
      description: {
        story: "\`checkRequired: false\` renders every row from \`config\`, even when the corresponding value is empty."
      }
    }
  }
}`,...(C=(D=r.parameters)==null?void 0:D.docs)==null?void 0:C.source}}};var q,R,K;s.parameters={...s.parameters,docs:{...(q=s.parameters)==null?void 0:q.docs,source:{originalSource:`{
  args: {
    config: bidConfig,
    data: bidData,
    flexDirection: "column",
    checkRequired: true
  },
  render: (args: PzKeyValueStoryArgs) => ({
    components: {
      pzKeyValue: pzKeyValueStoryComponent,
      pzText: PzText
    },
    setup() {
      return {
        args
      };
    },
    template: \`
      <section class="pz-key-value-story">
        <section class="pz-key-value-story-board">
          <div class="pz-key-value-story-header">
            <div class="pz-key-value-story-copy">
              <span class="pz-key-value-story-eyebrow">Slots</span>
              <pz-text variant="h4-bold">Override value rendering per key</pz-text>
            </div>
          </div>

          <div class="pz-key-value-story-preview">
            <pz-key-value
              :config="args.config"
              :data="args.data"
              :flex-direction="args.flexDirection"
              :check-required="args.checkRequired"
            >
              <template #supplier="{ data }">
                <a
                  href="#"
                  class="pz-key-value-story-link"
                >
                  {{ data }}
                </a>
              </template>

              <template #isWinner="{ data }">
                <span>{{ data ? "Yes" : "No" }}</span>
              </template>
            </pz-key-value>
          </div>
        </section>
      </section>
    \`
  }),
  parameters: {
    docs: {
      description: {
        story: "Each row exposes a slot named after its \`key\` and a \`<key>_label\` slot for the heading. Slot scope forwards the resolved value as \`data\`."
      }
    }
  }
}`,...(K=(R=s.parameters)==null?void 0:R.docs)==null?void 0:K.source}}};var S,P,V;o.parameters={...o.parameters,docs:{...(S=o.parameters)==null?void 0:S.docs,source:{originalSource:`{
  render: () => ({
    components: {
      pzKeyValue: pzKeyValueStoryComponent,
      pzText: PzText
    },
    setup() {
      return {
        tenderConfig,
        tenderData,
        bidConfig,
        bidData,
        flexDirectionOptions
      };
    },
    template: \`
      <section class="pz-key-value-story">
        <section class="pz-key-value-story-gallery">
          <article
            v-for="direction in flexDirectionOptions"
            :key="direction"
            class="pz-key-value-story-tile"
          >
            <div class="pz-key-value-story-copy">
              <span class="pz-key-value-story-eyebrow">flex-direction</span>
              <h4 class="pz-key-value-story-tile-title">{{ direction }}</h4>
              <p class="pz-key-value-story-tile-note">Rendered with tender-style data.</p>
            </div>

            <pz-key-value
              :config="tenderConfig"
              :data="tenderData"
              :flex-direction="direction"
            />
          </article>

          <article class="pz-key-value-story-tile">
            <div class="pz-key-value-story-copy">
              <span class="pz-key-value-story-eyebrow">check-required false</span>
              <h4 class="pz-key-value-story-tile-title">Always show rows</h4>
              <p class="pz-key-value-story-tile-note">Empty note field is still rendered.</p>
            </div>

            <pz-key-value
              :config="tenderConfig"
              :data="tenderData"
              :check-required="false"
            />
          </article>

          <article class="pz-key-value-story-tile">
            <div class="pz-key-value-story-copy">
              <span class="pz-key-value-story-eyebrow">winner bid</span>
              <h4 class="pz-key-value-story-tile-title">Falsy-preserving values</h4>
              <p class="pz-key-value-story-tile-note">Zero discount and boolean winner stay visible.</p>
            </div>

            <pz-key-value
              :config="bidConfig"
              :data="bidData"
            />
          </article>
        </section>
      </section>
    \`
  }),
  parameters: {
    docs: {
      description: {
        story: "Reference board covering every \`flexDirection\` value, the \`checkRequired: false\` fallback, and numeric/boolean preservation."
      }
    }
  }
}`,...(V=(P=o.parameters)==null?void 0:P.docs)==null?void 0:V.source}}};const H=["Playground","ColumnLayout","RowLayout","WithoutRequiredFilter","CustomSlots","Gallery"];export{a as ColumnLayout,s as CustomSlots,o as Gallery,t as Playground,n as RowLayout,r as WithoutRequiredFilter,H as __namedExportsOrder,_ as default};
