amotify/dist/fn/Input/Label.js

UI Component for React,NextJS,esbuild

import{b as l,c as p}from"../../chunk-C5N2D3ZX.js";import{jsx as m,jsxs as x}from"react/jsx-runtime";import{useState as b,useEffect as c}from"react";import a from"jmini";import{Box as d,Span as g}from"../../atoms";import{Row as h}from"../../mols";const D=t=>{if(!t.label)return null;let[r,s]=b({});return c(()=>{let f=a('[data-input-origin="'+t.componentID+'"]'),e=a('[data-input-label="'+t.componentID+'"]'),u=a('[data-input-value-shallow="'+t.componentID+'"]');if(!f[0]||!e[0]||!u[0])return;let i=f.position(),o=u.position();if(t.isActive){let n=o.left-i.left;s({opacity:"max",backgroundColor:"layer.1",freeCSS:{fontSize:"12px",lineHeight:1,transform:`translate(${n}px,-6px)`}})}else{let n=o.left-i.left,S=o.top-i.top;s({fontSize:t.fontSize||"inherit",opacity:"middle",backgroundColor:"trans",freeCSS:{lineHeight:"inherit",transform:`translate(${n}px,${S}px)`}})}e.getAttribute("data-label-init")=="true"&&e.setAttribute("data-label-init","false").await(10).css({transition:".25s"})},[t.isActive]),m(d,p(l({htmlTag:"label","data-input-label":t.componentID,"data-label-init":"true",position:"absolute",left:0,top:0,fontColor:"3.blur",backgroundColor:"trans",borderRadius:"1/3",padding:[0,"1/4"],opacity:"min",fontHeight:"inherit"},r),{freeCSS:l({zIndex:2,transformOrigin:"top left",pointerEvents:"none"},r.freeCSS),children:x(h.Left,{gap:"1/3",children:[t.label,t.required&&m(g,{fontColor:"nega",children:" * "})]})}))};export{D as InputLabel};