amotify/dist/fn/Input/Color.js

UI Component for React,NextJS,esbuild

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