koval-ui
Version:
React components collection with minimalistic design. Supports theming, layout, and input validation.
3 lines (2 loc) • 2.64 kB
JavaScript
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),e=require("react"),F=require("classnames"),k=require("../../../internal/Icons/IconClose.cjs"),w=require("../../../internal/Icons/IconEdit.cjs"),M=require("../../../internal/Icons/IconColumns.cjs"),P=require("../../../internal/locale/useBrowserLocale.cjs"),r=require("./Dialog.module.css.cjs"),l=require("../types.cjs"),B=require("./PercentageInput.cjs"),L=require("../../Dialog/useDialogState.cjs"),R=require("../../Dialog/Dialog.cjs"),f=require("../../FormField/FormField.cjs"),V=require("../../Select/Select.cjs"),A=require("../../InputDate/InputDate.cjs"),N=require("../../InputText/InputText.cjs"),I=require("../../InputNumeric/InputNumeric.cjs"),u=c=>{const t=({onChange:d=()=>{},...m})=>{const i=e.useCallback(s=>{d(s.target?.value)},[d]);return n.jsx(c,{...m,mode:"floating",onChange:i})};return t.displayName=c.displayName,t},O={[l.ColumnTypes.text]:u(N.InputText),[l.ColumnTypes.currency]:u(I.InputNumeric),[l.ColumnTypes.decimal]:u(I.InputNumeric),[l.ColumnTypes.unit]:u(I.InputNumeric),[l.ColumnTypes.percentage]:B.PercentageInput,[l.ColumnTypes.select]:u(N.InputText),[l.ColumnTypes.date]:u(A.InputDate)},S=e.memo(({id:c,columnsConfig:t=[],selectionAmount:d,onEdit:m})=>{const{dialogParams:i,closeDialog:s}=L.useDialogState(c),[a,C]=e.useState(t[0].id);e.useEffect(()=>{i?.columnId&&C(i?.columnId)},[i?.columnId]);const D=e.useCallback(o=>{C(o.target.value)},[]),[g,q]=e.useState(l.ColumnTypes.text);e.useEffect(()=>{const o=t.find(({id:y})=>y===a)?.type||l.ColumnTypes.text;q(o)},[t,a,q]);const j=e.useMemo(()=>O[g],[g]),[p,x]=e.useState("");e.useEffect(()=>{x("")},[a]);const T=e.useCallback(()=>{m(a||t[0].id,p),s()},[s,t,m,a,p]),h=e.useCallback(()=>{s()},[s]),v=e.useMemo(()=>[[{title:"Cancel",onClick:h,icon:k.IconClose},{title:"Apply change",icon:w.IconEdit,onClick:T,type:"link"}]],[T,h]),b=P.useBrowserLocale(),E=new Intl.NumberFormat(b,{style:"decimal"}).format(d||0);return n.jsx(R.Dialog,{animation:"scale-in",showCloseButton:!1,dialogTitle:`Edit ${E} row(s)`,id:c,className:r.default.dialog,actions:v,children:n.jsxs("div",{className:r.default.fieldset,children:[n.jsx(f.FormField,{className:r.default.field,label:"Column:",children:n.jsx(V.Select,{prefix:M.IconColumns,value:a,onChange:D,children:t.map(({id:o,name:y})=>n.jsx("option",{value:o,children:y},o))})}),n.jsx(f.FormField,{className:F(r.default.field,r.default.valueField),label:"New value:",children:n.jsx(j,{value:p,onChange:x})})]})})});S.displayName="EditDialog";exports.EditDialog=S;
//# sourceMappingURL=EditDialog.cjs.map