import{e as S,V as B,f as i,B as L,A as F,v as $,g as C,W as z,o as d,t as V,p as O,c as x,r,w as T}from"./iframe-Bl-fVlm8.js";import{P as A}from"./PzText-D5PUnIjq.js";import{P as D}from"./PzLabel-avnfC9tn.js";import{P as E}from"./PzNumberFormat-D5xYsZ3A.js";import{_ as j}from"./_plugin-vue_export-helper-DlAUqK2U.js";import"./preload-helper-C1FmrZbK.js";import"./lodash-CdDiHlzQ.js";import"./_commonjsHelpers-Cpj98o6Y.js";const W=["id","value","placeholder","disabled","required"],U=["id"],K={key:2,class:"pz-input-number-error"},p=S({name:"PzInputNumber",__name:"PzInputNumber",props:z({name:{},modelValue:{},label:{default:""},placeholder:{default:""},errorMessage:{default:""},type:{default:"integer"},required:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},editable:{type:Boolean,default:!0},isLightSkin:{type:Boolean,default:!1}},{modelValue:{},modelModifiers:{}}),emits:z(["focus","blur","update:modelValue"],["update:modelValue"]),setup(e,{emit:t}){const n=e,o=t,u=B(e,"modelValue"),c=x(()=>n.type==="integer"?0:void 0),s=x(()=>new E(u.value??null,c.value).number),b=l=>{const a=l.match(/^-?\d+(\.\d+)?/);return a?a[0]:l},f=l=>{const a=b(l.replace(/\s+/g,""));return a==="-"?a:a!==""?Number(a):null},y=l=>{var h;const a=l.target,g=isFinite(Number(l.key)),k=n.type==="decimal"&&/\./g.test(l.key)&&!/\./g.test(a.value),M=/-/g.test(l.key)&&!/-/g.test(a.value)&&!((h=a.value)!=null&&h.length);g||k||M||l.preventDefault()},I=l=>{const a=l.target;u.value=f(a.value)};return(l,a)=>(d(),i("div",{class:C(["pz-input-number",{light:e.isLightSkin,error:e.errorMessage,disabled:e.disabled}])},[L($(D),{label:e.label,for:e.name,required:e.required,disabled:e.disabled},{default:F(()=>[e.editable?(d(),i("input",{key:0,id:e.name,value:s.value,placeholder:e.placeholder,disabled:e.disabled,required:e.required,type:"text",class:"pz-input-number-control",onInput:I,onBlur:a[0]||(a[0]=g=>o("blur")),onFocus:a[1]||(a[1]=g=>o("focus")),onKeypress:y},null,40,W)):(d(),i("span",{key:1,id:e.name,class:"pz-input-number-readonly"},V(s.value),9,U)),e.errorMessage?(d(),i("span",K,V(e.errorMessage),1)):O("",!0)]),_:1},8,["label","for","required","disabled"])],2))}}),q=j(p,[["__scopeId","data-v-0104f54f"]]);p.__docgenInfo=Object.assign({displayName:p.name??p.__name},{name:"PzInputNumber",exportName:"default",displayName:"PzInputNumber",description:"",tags:{},props:[{name:"name",required:!0,type:{name:"string"}},{name:"modelValue",required:!0,type:{name:"PzInputNumberValue"}},{name:"label",required:!1,type:{name:"string"},defaultValue:{func:!1,value:'""'}},{name:"placeholder",required:!1,type:{name:"string"},defaultValue:{func:!1,value:'""'}},{name:"errorMessage",required:!1,type:{name:"string"},defaultValue:{func:!1,value:'""'}},{name:"type",required:!1,type:{name:"PzInputNumberType"},defaultValue:{func:!1,value:'"integer"'}},{name:"required",required:!1,type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"disabled",required:!1,type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"editable",required:!1,type:{name:"boolean"},defaultValue:{func:!1,value:"true"}},{name:"isLightSkin",required:!1,type:{name:"boolean"},defaultValue:{func:!1,value:"false"}}],events:[{name:"focus"},{name:"blur"},{name:"update:modelValue",type:{names:["PzInputNumberValue"]}}],sourceFiles:["/builds/Web-Projects/client-services/prozorro-ui/src/components/Form/PzInputNumber/PzInputNumber.vue"]});const v=15e5,R=e=>`<template>
  <PzInputNumber
    v-model="value"
    ${[`name="${e.name}"`,e.label?`label="${e.label}"`:null,e.placeholder?`placeholder="${e.placeholder}"`:null,e.type&&e.type!=="integer"?`type="${e.type}"`:null,e.required?':required="true"':null,e.disabled?':disabled="true"':null,e.editable===!1?':editable="false"':null,e.errorMessage?`error-message="${e.errorMessage}"`:null,e.isLightSkin?':is-light-skin="true"':null].filter(n=>!!n).join(" ")}
  />
</template>`,G={title:"Components/Form/PzInputNumber",component:q,parameters:{docs:{description:{component:"Use `PzInputNumber` for numeric entry. It formats the displayed value via `PzNumberFormat`, accepts only digits (plus optional decimal separator and minus), and emits a `number | null` via `v-model`."},source:{transform:(e,t)=>R(t.args??G.args)}}},args:{name:"pz-input-number-story",label:"Сума",modelValue:"",placeholder:"Введіть число...",type:"integer",errorMessage:"",required:!1,disabled:!1,editable:!0,isLightSkin:!1},argTypes:{name:{control:"text",description:"Native input `id`/`name`."},label:{control:"text",description:"Label text shown above the input."},modelValue:{control:"text",description:"Current numeric value bound via `v-model` (required)."},placeholder:{control:"text",description:"Placeholder shown when the input is empty."},type:{control:"inline-radio",options:["integer","decimal"],description:"`integer` rounds to whole numbers; `decimal` allows one dot separator."},errorMessage:{control:"text",description:"Validation message shown below the input; enables error styling."},required:{control:"boolean",description:"Marks the field as required in the label."},disabled:{control:"boolean",description:"Disables the input and applies muted styling."},editable:{control:"boolean",description:"When false, renders the formatted value as readonly text instead of an input."},isLightSkin:{control:"boolean",description:"Enables the light alternate layout."}},render:e=>({components:{pzInputNumber:q,pzText:A},setup(){const t=r(e.modelValue??""),n=r(v),o=r(""),u=r(""),c=r(v),s=r(""),b=r(""),f=v;return T(()=>e.modelValue,y=>{t.value=y??""}),{args:e,value:t,sharedValue:n,defaultValue:o,decimalValue:u,formattedValue:c,requiredValue:s,errorValue:b,readonlyValue:f}},template:`
      <div style="display: flex; flex-direction: column; gap: var(--pz-space-24); max-width: 480px;">
        <section>
          <pz-text variant="h4-bold">Component API</pz-text>
          <div style="margin-top: var(--pz-space-16);">
            <pz-input-number
              v-model="value"
              :name="args.name"
              :label="args.label"
              :placeholder="args.placeholder"
              :type="args.type"
              :error-message="args.errorMessage"
              :required="args.required"
              :disabled="args.disabled"
              :editable="args.editable"
              :is-light-skin="args.isLightSkin"
            />
          </div>
        </section>

        <section>
          <pz-text variant="h4-bold">Two-way binding</pz-text>
          <div style="display: flex; flex-direction: column; gap: var(--pz-space-8); margin-top: var(--pz-space-16);">
            <pz-input-number v-model="sharedValue" name="two-way-a" label="Поле A" placeholder="Введіть число..." />
            <pz-input-number v-model="sharedValue" name="two-way-b" label="Поле B (таке саме значення)" placeholder="Введіть число..." />
            <pz-text variant="body-regular">Поточне значення: "{{ sharedValue }}"</pz-text>
          </div>
        </section>

        <section style="display: flex; flex-direction: column; gap: var(--pz-space-16);">
          <pz-text variant="h4-bold">States</pz-text>
          <pz-input-number v-model="defaultValue" name="number-default" label="Ціле число" placeholder="Введіть число..." />
          <pz-input-number v-model="decimalValue" name="number-decimal" label="З десятковою частиною" placeholder="0.00" type="decimal" />
          <pz-input-number v-model="formattedValue" name="number-value" label="З форматуванням" />
          <pz-input-number v-model="requiredValue" name="number-required" label="Обов'язкове" placeholder="Введіть число..." required />
          <pz-input-number v-model="errorValue" name="number-error" label="Помилка" placeholder="Введіть число..." error-message="Введіть коректне число" />
          <pz-input-number model-value="" name="number-disabled" label="Disabled" placeholder="Введіть число..." disabled />
          <pz-input-number :model-value="readonlyValue" name="number-readonly" label="Readonly (editable: false)" :editable="false" />
        </section>
      </div>
    `})},m={parameters:{docs:{description:{story:"Інтерактивний приклад числового інпуту. Нижче — перевірка two-way binding та базові стани: integer, decimal, форматування, required, помилка, disabled, readonly."}}}};var N,P,w;m.parameters={...m.parameters,docs:{...(N=m.parameters)==null?void 0:N.docs,source:{originalSource:`{
  parameters: {
    docs: {
      description: {
        story: "Інтерактивний приклад числового інпуту. Нижче — перевірка two-way binding та базові стани: integer, decimal, форматування, required, помилка, disabled, readonly."
      }
    }
  }
}`,...(w=(P=m.parameters)==null?void 0:P.docs)==null?void 0:w.source}}};const ae=["Playground"];export{m as Playground,ae as __namedExportsOrder,G as default};
