amotify/dist/fn/Input/Color.js

UI Component for React,NextJS,esbuild

import{b as e,c as r,d as h}from"../../chunk-C5N2D3ZX.js";import{jsx as m}from"react/jsx-runtime";import{UUID as b}from"jmini";import{useState as v}from"react";import x from"../../atoms/Box";import{OptionalInputWrapper as _,BoxWrapper as k,CoreEffects as p,DefaultBoxishStyles as F}from"./core";import{InputSwitchClasses as R}from"../../@styles/componentClasses";function w(t){let{value:n,states:d}=t,{required:s}=d,o=[];return s&&!n&&o.push({type:"invalid",label:"ON\u306B\u306A\u3063\u3066\u3044\u307E\u305B\u3093"}),{ok:!o.filter(({type:c})=>c=="invalid").length,notice:o}}const B=t=>{let y=t,{componentID:n,required:d,form:s,enableFormSubmit:o,checkValidationAtFirst:c,onChange:I,onKeyDown:f,onValidate:E,onUpdateValue:U,onUpdateValidValue:W,value:g=""}=y,S=h(y,["componentID","required","form","enableFormSubmit","checkValidationAtFirst","onChange","onKeyDown","onValidate","onUpdateValue","onUpdateValidValue","value"]),[l,i]=v(p.DefaultStatus(t.componentID||"",g)),[u,C]=v({ok:!1,notice:[]});return p.CommonEffects({type:"color",states:t,val_status:l,set_status:i,val_validate:u,set_validate:C,SystemValidation:w}),m(k,{val_status:l,set_status:i,val_validate:u,states:t,children:m(x,e({htmlTag:"input",type:"color","data-component-id":l.componentID,value:l.dataValue,className:R("Input"),onKeyDown:a=>{f&&f(a),o&&p.SubmitForm(a,s)},onChange:a=>{let{value:T}=a.target;u.ok&&C({ok:!1,notice:[]}),i(V=>r(e({},V),{dataValue:T,eventType:"update",eventID:b()})),I&&I(a)}},S))})},D=t=>{let n=r(e(r(e({},F(t)),{backgroundColor:"cloud",unitHeight:3}),t),{freeCSS:e({minWidth:108},t.freeCSS)});return m(_,{componentID:t.componentID,children:B,states:n})};export{D as Color,D as default};