"use strict";(self.webpackChunkcomplianz_gdpr=self.webpackChunkcomplianz_gdpr||[]).push([[1370],{41370:(e,t,l)=>{l.r(t),l.d(t,{default:()=>r});var n=l(51609),a=l(27723),p=l(45111);const r=(0,n.memo)((({label:e,id:t,value:l,onChange:r,required:o,defaultValue:c,disabled:i,options:m={},units:u=["px"]})=>{const s=c.type||l.type||u[0],[d,g]=(0,n.useState)(s),[b,k]=(0,n.useState)(!1),z={top:(0,a.__)("Top","complianz-gdpr"),right:(0,a.__)("Right","complianz-gdpr"),bottom:(0,a.__)("Bottom","complianz-gdpr"),left:(0,a.__)("Left","complianz-gdpr")};(0,n.useEffect)((()=>{l.top===l.right&&l.top===l.bottom&&l.top===l.left&&k(!0)}),[]),(0,n.useEffect)((()=>{b&&f(l.top,"top")}),[b]);const f=(e,t)=>{let n={...l};b?n=h(e):n[t]=e,r(n)},h=e=>{let t={...l};return t.top=e,t.right=e,t.bottom=e,t.left=e,t};return(0,n.createElement)("div",{className:"cmplz-border-input"},Object.keys(z).map((e=>{const t=z[e],a=l.hasOwnProperty(e)?l[e]:c[e];return(0,n.createElement)(n.Fragment,{key:e},(0,n.createElement)("input",{className:"cmplz-border-input-side",type:"number",key:e,onChange:t=>f(t.target.value,e),value:a}),(0,n.createElement)("p",{className:"cmplz-border-input-side-label"},t))})),b&&(0,n.createElement)("button",{className:"cmplz-border-input-link linked",onClick:()=>k(!b)},(0,n.createElement)(p.default,{name:"linked",size:16,tooltip:(0,a.__)("Unlink values","complianz-gdpr")})),!b&&(0,n.createElement)("button",{className:"cmplz-border-input-link",onClick:()=>k(!b)},(0,n.createElement)(p.default,{name:"unlinked",size:16,tooltip:(0,a.__)("Link values together","complianz-gdpr")})),u.length>1&&(0,n.createElement)("div",{className:"cmplz-border-input-unit"},(0,n.createElement)("select",{value:d,onChange:e=>(e=>{g(e);let t={...l};t.type=e,r(t)})(e.target.value)},u.map(((e,t)=>(0,n.createElement)("option",{key:t,value:e},e))))),1===u.length&&(0,n.createElement)("div",{className:"cmplz-border-input-unit"},d))}))}}]);