@dartcom/ui-kit 3.3.0 → 3.3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,2 +1,2 @@
1
- import{jsxs as n,jsx as t}from"react/jsx-runtime";import e from"../../node_modules/@mui/material/esm/Box/Box.js";function o({form:o,sx:r={},fields:s,buttons:i,observers:m,onSubmit:l}){const{handleSubmit:x}=o;return n(e,{component:"form",sx:{display:"grid",gap:"15px",...r},onSubmit:x(l),children:[t(e,{sx:{display:"grid",gap:"15px",...s.sx},children:s.content}),i?.content?t(e,{sx:{display:"flex",alignItems:"center",gap:"15px",...i.sx},children:i.content}):null,m?.content]})}export{o as default};
1
+ import{jsx as e,jsxs as o}from"react/jsx-runtime";import{FormProvider as n}from"../../node_modules/react-hook-form/dist/index.esm.js";import t from"../../node_modules/@mui/material/esm/Box/Box.js";function r({form:r,sx:s={},fields:i,buttons:m,observers:d,onSubmit:l}){const{handleSubmit:x}=r;return e(n,{...r,children:o(t,{component:"form",sx:{display:"grid",gap:"15px",...s},onSubmit:x(l),children:[e(t,{sx:{display:"grid",gap:"15px",...i.sx},children:i.content}),m?.content?e(t,{sx:{display:"flex",alignItems:"center",gap:"15px",...m.sx},children:m.content}):null,d?.content]})})}export{r as default};
2
2
  //# sourceMappingURL=form.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"form.js","sources":["../../../../src/components/form/form.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport { Box, SxProps } from '@mui/material';\r\nimport { FieldValues, SubmitHandler, UseFormReturn } from 'react-hook-form';\r\n\r\ninterface CustomFormProp<T extends FieldValues> {\r\n form: UseFormReturn<T>;\r\n\r\n onSubmit: SubmitHandler<T>;\r\n\r\n sx?: SxProps;\r\n\r\n fields: {\r\n content: React.ReactNode;\r\n sx?: SxProps;\r\n };\r\n\r\n buttons?: {\r\n content?: React.ReactNode;\r\n sx?: SxProps;\r\n };\r\n\r\n observers?: {\r\n content?: React.ReactNode;\r\n };\r\n}\r\n\r\n/**\r\n * Используем этот компонент как основную обертку для формы\r\n * Все поля должны хранится при инициализации формы и быть доступны через контекст формы\r\n * @template T - Интрефейс данных формы.\r\n * @param {React.ReactNode} children - Все компоненты, которым нужен контекст фор.\r\n * @param {UseFormReturn<T>} form - Форма useForm, которая содержит все поля.\r\n * @param {SxProps} [sx={}] - Опциональные стили самой формы.\r\n * @param {SubmitHandler<T>} onSubmit - Функция обработки отправки формы.\r\n *\r\n * @returns {JSX.Element} The rendered form component with form context.\r\n */\r\nfunction CustomForm<T extends FieldValues>({\r\n form,\r\n sx = {},\r\n fields,\r\n buttons,\r\n observers,\r\n onSubmit,\r\n}: CustomFormProp<T>) {\r\n const { handleSubmit } = form;\r\n\r\n return (\r\n <Box\r\n component=\"form\"\r\n sx={{\r\n display: 'grid',\r\n\r\n gap: '15px',\r\n\r\n ...sx,\r\n }}\r\n onSubmit={handleSubmit(onSubmit)}>\r\n <Box\r\n sx={{\r\n display: 'grid',\r\n\r\n gap: '15px',\r\n\r\n ...fields.sx,\r\n }}>\r\n {fields.content}\r\n </Box>\r\n\r\n {buttons?.content ? (\r\n <Box\r\n sx={{\r\n display: 'flex',\r\n\r\n alignItems: 'center',\r\n\r\n gap: '15px',\r\n\r\n ...buttons.sx,\r\n }}>\r\n {buttons.content}\r\n </Box>\r\n ) : null}\r\n {observers?.content}\r\n </Box>\r\n );\r\n}\r\n\r\nexport default CustomForm;\r\n"],"names":["CustomForm","form","sx","fields","buttons","observers","onSubmit","handleSubmit","_jsxs","Box","component","display","gap","children","_jsx","content","alignItems"],"mappings":"iHAqCA,SAASA,GAAkCC,KACzCA,EAAIC,GACJA,EAAK,CAAA,EAAEC,OACPA,EAAMC,QACNA,EAAOC,UACPA,EAASC,SACTA,IAEA,MAAMC,aAAEA,GAAiBN,EAEzB,OACEO,EAACC,EAAG,CACFC,UAAU,OACVR,GAAI,CACFS,QAAS,OAETC,IAAK,UAEFV,GAELI,SAAUC,EAAaD,GAASO,SAAA,CAChCC,EAACL,EAAG,CACFP,GAAI,CACFS,QAAS,OAETC,IAAK,UAEFT,EAAOD,IACXW,SACAV,EAAOY,UAGTX,GAASW,QACRD,EAACL,EAAG,CACFP,GAAI,CACFS,QAAS,OAETK,WAAY,SAEZJ,IAAK,UAEFR,EAAQF,IACZW,SACAT,EAAQW,UAET,KACHV,GAAWU,UAGlB"}
1
+ {"version":3,"file":"form.js","sources":["../../../../src/components/form/form.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport { Box, SxProps } from '@mui/material';\r\nimport {\r\n FieldValues,\r\n FormProvider,\r\n SubmitHandler,\r\n UseFormReturn,\r\n} from 'react-hook-form';\r\n\r\ninterface CustomFormProp<T extends FieldValues> {\r\n form: UseFormReturn<T>;\r\n\r\n onSubmit: SubmitHandler<T>;\r\n\r\n sx?: SxProps;\r\n\r\n fields: {\r\n content: React.ReactNode;\r\n sx?: SxProps;\r\n };\r\n\r\n buttons?: {\r\n content?: React.ReactNode;\r\n sx?: SxProps;\r\n };\r\n\r\n observers?: {\r\n content?: React.ReactNode;\r\n };\r\n}\r\n\r\n/**\r\n * Используем этот компонент как основную обертку для формы\r\n * Все поля должны хранится при инициализации формы и быть доступны через контекст формы\r\n * @template T - Интрефейс данных формы.\r\n * @param {React.ReactNode} children - Все компоненты, которым нужен контекст фор.\r\n * @param {UseFormReturn<T>} form - Форма useForm, которая содержит все поля.\r\n * @param {SxProps} [sx={}] - Опциональные стили самой формы.\r\n * @param {SubmitHandler<T>} onSubmit - Функция обработки отправки формы.\r\n *\r\n * @returns {JSX.Element} The rendered form component with form context.\r\n */\r\nfunction CustomForm<T extends FieldValues>({\r\n form,\r\n sx = {},\r\n fields,\r\n buttons,\r\n observers,\r\n onSubmit,\r\n}: CustomFormProp<T>) {\r\n const { handleSubmit } = form;\r\n\r\n return (\r\n <FormProvider {...form}>\r\n <Box\r\n component=\"form\"\r\n sx={{\r\n display: 'grid',\r\n\r\n gap: '15px',\r\n\r\n ...sx,\r\n }}\r\n onSubmit={handleSubmit(onSubmit)}>\r\n <Box\r\n sx={{\r\n display: 'grid',\r\n\r\n gap: '15px',\r\n\r\n ...fields.sx,\r\n }}>\r\n {fields.content}\r\n </Box>\r\n\r\n {buttons?.content ? (\r\n <Box\r\n sx={{\r\n display: 'flex',\r\n\r\n alignItems: 'center',\r\n\r\n gap: '15px',\r\n\r\n ...buttons.sx,\r\n }}>\r\n {buttons.content}\r\n </Box>\r\n ) : null}\r\n {observers?.content}\r\n </Box>\r\n </FormProvider>\r\n );\r\n}\r\n\r\nexport default CustomForm;\r\n"],"names":["CustomForm","form","sx","fields","buttons","observers","onSubmit","handleSubmit","_jsx","FormProvider","children","_jsxs","Box","component","display","gap","content","alignItems"],"mappings":"qMA0CA,SAASA,GAAkCC,KACzCA,EAAIC,GACJA,EAAK,CAAA,EAAEC,OACPA,EAAMC,QACNA,EAAOC,UACPA,EAASC,SACTA,IAEA,MAAMC,aAAEA,GAAiBN,EAEzB,OACEO,EAACC,EAAY,IAAKR,EAAIS,SACpBC,EAACC,EAAG,CACFC,UAAU,OACVX,GAAI,CACFY,QAAS,OAETC,IAAK,UAEFb,GAELI,SAAUC,EAAaD,GAASI,SAAA,CAChCF,EAACI,EAAG,CACFV,GAAI,CACFY,QAAS,OAETC,IAAK,UAEFZ,EAAOD,IACXQ,SACAP,EAAOa,UAGTZ,GAASY,QACRR,EAACI,EAAG,CACFV,GAAI,CACFY,QAAS,OAETG,WAAY,SAEZF,IAAK,UAEFX,EAAQF,IACZQ,SACAN,EAAQY,UAET,KACHX,GAAWW,YAIpB"}
@@ -1,2 +1,2 @@
1
- import e from"react";var t=e=>e instanceof Date,r=e=>null==e;const n=e=>"object"==typeof e;var s=e=>!r(e)&&!Array.isArray(e)&&n(e)&&!t(e),a=e=>s(e)&&e.target?"checkbox"===e.target.type?e.target.checked:e.target.value:e,o="undefined"!=typeof window&&void 0!==window.HTMLElement&&"undefined"!=typeof document;function u(e){let t;const r=Array.isArray(e),n="undefined"!=typeof FileList&&e instanceof FileList;if(e instanceof Date)t=new Date(e);else{if(o&&(e instanceof Blob||n)||!r&&!s(e))return e;if(t=r?[]:Object.create(Object.getPrototypeOf(e)),r||(e=>{const t=e.constructor&&e.constructor.prototype;return s(t)&&t.hasOwnProperty("isPrototypeOf")})(e))for(const r in e)e.hasOwnProperty(r)&&(t[r]=u(e[r]));else t=e}return t}var i=e=>/^\w*$/.test(e),l=e=>void 0===e,c=e=>{return t=e.replace(/["|']|\]/g,"").split(/\.|\[/),Array.isArray(t)?t.filter(Boolean):[];var t},f=(e,t,n)=>{if(!t||!s(e))return n;const a=(i(t)?[t]:c(t)).reduce((e,t)=>r(e)?e:e[t],e);return l(a)||a===e?l(e[t])?n:e[t]:a},d=e=>"boolean"==typeof e,m=(e,t,r)=>{let n=-1;const a=i(t)?[t]:c(t),o=a.length,u=o-1;for(;++n<o;){const t=a[n];let o=r;if(n!==u){const r=e[t];o=s(r)||Array.isArray(r)?r:isNaN(+a[n+1])?{}:[]}if("__proto__"===t||"constructor"===t||"prototype"===t)return;e[t]=o,e=e[t]}};const y="blur",b="change",g="all",p=e.createContext(null);p.displayName="HookFormContext";const _=()=>e.useContext(p);const V="undefined"!=typeof window?e.useLayoutEffect:e.useEffect;function h(t){const r=_(),{control:n=r.control,disabled:s,name:a,exact:o}=t||{},[u,i]=e.useState(n._formState),l=e.useRef({isDirty:!1,isLoading:!1,dirtyFields:!1,touchedFields:!1,validatingFields:!1,isValidating:!1,isValid:!1,errors:!1});return V(()=>n._subscribe({name:a,formState:l.current,exact:o,callback:e=>{!s&&i({...n._formState,...e})}}),[a,s,o]),e.useEffect(()=>{l.current.isValid&&n._setValid(!0)},[n]),e.useMemo(()=>((e,t,r,n=!0)=>{const s={defaultValues:t._defaultValues};for(const a in e)Object.defineProperty(s,a,{get:()=>{const s=a;return t._proxyFormState[s]!==g&&(t._proxyFormState[s]=!n||g),r&&(r[s]=!0),e[s]}});return s})(u,n,l.current,!1),[u,n])}var v=e=>r(e)||!n(e);function A(e,r,n=new WeakSet){if(v(e)||v(r))return e===r;if(t(e)&&t(r))return e.getTime()===r.getTime();const a=Object.keys(e),o=Object.keys(r);if(a.length!==o.length)return!1;if(n.has(e)||n.has(r))return!0;n.add(e),n.add(r);for(const u of a){const a=e[u];if(!o.includes(u))return!1;if("ref"!==u){const e=r[u];if(t(a)&&t(e)||s(a)&&s(e)||Array.isArray(a)&&Array.isArray(e)?!A(a,e,n):a!==e)return!1}}return!0}function x(t){const r=_(),{control:n=r.control,name:s,defaultValue:a,disabled:o,exact:u,compute:i}=t||{},l=e.useRef(a),c=e.useRef(i),d=e.useRef(void 0);c.current=i;const m=e.useMemo(()=>n._getWatch(s,l.current),[n,s]),[y,b]=e.useState(c.current?c.current(m):m);return V(()=>n._subscribe({name:s,formState:{values:!0},exact:u,callback:e=>{if(!o){const t=((e,t,r,n,s)=>"string"==typeof e?f(r,e,s):Array.isArray(e)?e.map(e=>f(r,e)):r)(s,n._names,e.values||n._formValues,0,l.current);if(c.current){const e=c.current(t);A(e,d.current)||(b(e),d.current=e)}else b(t)}}}),[n,o,s,u]),e.useEffect(()=>n._removeUnmounted()),y}function F(t){const r=_(),{name:n,disabled:s,control:o=r.control,shouldUnregister:i,defaultValue:c}=t,g=((e,t)=>e.has((e=>e.substring(0,e.search(/\.\d+(\.|$)/))||e)(t)))(o._names.array,n),p=e.useMemo(()=>f(o._formValues,n,f(o._defaultValues,n,c)),[o,n,c]),V=x({control:o,name:n,defaultValue:p,exact:!0}),v=h({control:o,name:n,exact:!0}),A=e.useRef(t),F=e.useRef(void 0),k=e.useRef(o.register(n,{...t.rules,value:V,...d(t.disabled)?{disabled:t.disabled}:{}}));A.current=t;const w=e.useMemo(()=>Object.defineProperties({},{invalid:{enumerable:!0,get:()=>!!f(v.errors,n)},isDirty:{enumerable:!0,get:()=>!!f(v.dirtyFields,n)},isTouched:{enumerable:!0,get:()=>!!f(v.touchedFields,n)},isValidating:{enumerable:!0,get:()=>!!f(v.validatingFields,n)},error:{enumerable:!0,get:()=>f(v.errors,n)}}),[v,n]),S=e.useCallback(e=>k.current.onChange({target:{value:a(e),name:n},type:b}),[n]),C=e.useCallback(()=>k.current.onBlur({target:{value:f(o._formValues,n),name:n},type:y}),[n,o._formValues]),O=e.useCallback(e=>{const t=f(o._fields,n);t&&e&&(t._f.ref={focus:()=>e.focus&&e.focus(),select:()=>e.select&&e.select(),setCustomValidity:t=>e.setCustomValidity(t),reportValidity:()=>e.reportValidity()})},[o._fields,n]),j=e.useMemo(()=>({name:n,value:V,...d(s)||v.disabled?{disabled:v.disabled||s}:{},onChange:S,onBlur:C,ref:O}),[n,s,v.disabled,S,C,O,V]);return e.useEffect(()=>{const e=o._options.shouldUnregister||i,t=F.current;t&&t!==n&&!g&&o.unregister(t),o.register(n,{...A.current.rules,...d(A.current.disabled)?{disabled:A.current.disabled}:{}});const r=(e,t)=>{const r=f(o._fields,e);r&&r._f&&(r._f.mount=t)};if(r(n,!0),e){const e=u(f(o._options.defaultValues,n,A.current.defaultValue));m(o._defaultValues,n,e),l(f(o._formValues,n))&&m(o._formValues,n,e)}return!g&&o.register(n),F.current=n,()=>{(g?e&&!o._state.action:e)?o.unregister(n):r(n,!1)}},[n,o,g,i]),e.useEffect(()=>{o._setDisabledField({disabled:s,name:n})},[s,n,o]),e.useMemo(()=>({field:j,formState:v,fieldState:w}),[j,v,w])}const k=e=>e.render(F(e));export{k as Controller,f as get,m as set,F as useController,_ as useFormContext,h as useFormState,x as useWatch};
1
+ import e from"react";var t=e=>e instanceof Date,r=e=>null==e;const n=e=>"object"==typeof e;var s=e=>!r(e)&&!Array.isArray(e)&&n(e)&&!t(e),a=e=>s(e)&&e.target?"checkbox"===e.target.type?e.target.checked:e.target.value:e,o="undefined"!=typeof window&&void 0!==window.HTMLElement&&"undefined"!=typeof document;function u(e){let t;const r=Array.isArray(e),n="undefined"!=typeof FileList&&e instanceof FileList;if(e instanceof Date)t=new Date(e);else{if(o&&(e instanceof Blob||n)||!r&&!s(e))return e;if(t=r?[]:Object.create(Object.getPrototypeOf(e)),r||(e=>{const t=e.constructor&&e.constructor.prototype;return s(t)&&t.hasOwnProperty("isPrototypeOf")})(e))for(const r in e)e.hasOwnProperty(r)&&(t[r]=u(e[r]));else t=e}return t}var i=e=>/^\w*$/.test(e),l=e=>void 0===e,c=e=>{return t=e.replace(/["|']|\]/g,"").split(/\.|\[/),Array.isArray(t)?t.filter(Boolean):[];var t},d=(e,t,n)=>{if(!t||!s(e))return n;const a=(i(t)?[t]:c(t)).reduce((e,t)=>r(e)?e:e[t],e);return l(a)||a===e?l(e[t])?n:e[t]:a},f=e=>"boolean"==typeof e,m=(e,t,r)=>{let n=-1;const a=i(t)?[t]:c(t),o=a.length,u=o-1;for(;++n<o;){const t=a[n];let o=r;if(n!==u){const r=e[t];o=s(r)||Array.isArray(r)?r:isNaN(+a[n+1])?{}:[]}if("__proto__"===t||"constructor"===t||"prototype"===t)return;e[t]=o,e=e[t]}};const y="blur",b="change",g="all",p=e.createContext(null);p.displayName="HookFormContext";const _=()=>e.useContext(p),V=t=>{const{children:r,...n}=t;return e.createElement(p.Provider,{value:n},r)};const v="undefined"!=typeof window?e.useLayoutEffect:e.useEffect;function h(t){const r=_(),{control:n=r.control,disabled:s,name:a,exact:o}=t||{},[u,i]=e.useState(n._formState),l=e.useRef({isDirty:!1,isLoading:!1,dirtyFields:!1,touchedFields:!1,validatingFields:!1,isValidating:!1,isValid:!1,errors:!1});return v(()=>n._subscribe({name:a,formState:l.current,exact:o,callback:e=>{!s&&i({...n._formState,...e})}}),[a,s,o]),e.useEffect(()=>{l.current.isValid&&n._setValid(!0)},[n]),e.useMemo(()=>((e,t,r,n=!0)=>{const s={defaultValues:t._defaultValues};for(const a in e)Object.defineProperty(s,a,{get:()=>{const s=a;return t._proxyFormState[s]!==g&&(t._proxyFormState[s]=!n||g),r&&(r[s]=!0),e[s]}});return s})(u,n,l.current,!1),[u,n])}var A=e=>r(e)||!n(e);function x(e,r,n=new WeakSet){if(A(e)||A(r))return e===r;if(t(e)&&t(r))return e.getTime()===r.getTime();const a=Object.keys(e),o=Object.keys(r);if(a.length!==o.length)return!1;if(n.has(e)||n.has(r))return!0;n.add(e),n.add(r);for(const u of a){const a=e[u];if(!o.includes(u))return!1;if("ref"!==u){const e=r[u];if(t(a)&&t(e)||s(a)&&s(e)||Array.isArray(a)&&Array.isArray(e)?!x(a,e,n):a!==e)return!1}}return!0}function F(t){const r=_(),{control:n=r.control,name:s,defaultValue:a,disabled:o,exact:u,compute:i}=t||{},l=e.useRef(a),c=e.useRef(i),f=e.useRef(void 0);c.current=i;const m=e.useMemo(()=>n._getWatch(s,l.current),[n,s]),[y,b]=e.useState(c.current?c.current(m):m);return v(()=>n._subscribe({name:s,formState:{values:!0},exact:u,callback:e=>{if(!o){const t=((e,t,r,n,s)=>"string"==typeof e?d(r,e,s):Array.isArray(e)?e.map(e=>d(r,e)):r)(s,n._names,e.values||n._formValues,0,l.current);if(c.current){const e=c.current(t);x(e,f.current)||(b(e),f.current=e)}else b(t)}}}),[n,o,s,u]),e.useEffect(()=>n._removeUnmounted()),y}function k(t){const r=_(),{name:n,disabled:s,control:o=r.control,shouldUnregister:i,defaultValue:c}=t,g=((e,t)=>e.has((e=>e.substring(0,e.search(/\.\d+(\.|$)/))||e)(t)))(o._names.array,n),p=e.useMemo(()=>d(o._formValues,n,d(o._defaultValues,n,c)),[o,n,c]),V=F({control:o,name:n,defaultValue:p,exact:!0}),v=h({control:o,name:n,exact:!0}),A=e.useRef(t),x=e.useRef(void 0),k=e.useRef(o.register(n,{...t.rules,value:V,...f(t.disabled)?{disabled:t.disabled}:{}}));A.current=t;const w=e.useMemo(()=>Object.defineProperties({},{invalid:{enumerable:!0,get:()=>!!d(v.errors,n)},isDirty:{enumerable:!0,get:()=>!!d(v.dirtyFields,n)},isTouched:{enumerable:!0,get:()=>!!d(v.touchedFields,n)},isValidating:{enumerable:!0,get:()=>!!d(v.validatingFields,n)},error:{enumerable:!0,get:()=>d(v.errors,n)}}),[v,n]),S=e.useCallback(e=>k.current.onChange({target:{value:a(e),name:n},type:b}),[n]),C=e.useCallback(()=>k.current.onBlur({target:{value:d(o._formValues,n),name:n},type:y}),[n,o._formValues]),O=e.useCallback(e=>{const t=d(o._fields,n);t&&e&&(t._f.ref={focus:()=>e.focus&&e.focus(),select:()=>e.select&&e.select(),setCustomValidity:t=>e.setCustomValidity(t),reportValidity:()=>e.reportValidity()})},[o._fields,n]),E=e.useMemo(()=>({name:n,value:V,...f(s)||v.disabled?{disabled:v.disabled||s}:{},onChange:S,onBlur:C,ref:O}),[n,s,v.disabled,S,C,O,V]);return e.useEffect(()=>{const e=o._options.shouldUnregister||i,t=x.current;t&&t!==n&&!g&&o.unregister(t),o.register(n,{...A.current.rules,...f(A.current.disabled)?{disabled:A.current.disabled}:{}});const r=(e,t)=>{const r=d(o._fields,e);r&&r._f&&(r._f.mount=t)};if(r(n,!0),e){const e=u(d(o._options.defaultValues,n,A.current.defaultValue));m(o._defaultValues,n,e),l(d(o._formValues,n))&&m(o._formValues,n,e)}return!g&&o.register(n),x.current=n,()=>{(g?e&&!o._state.action:e)?o.unregister(n):r(n,!1)}},[n,o,g,i]),e.useEffect(()=>{o._setDisabledField({disabled:s,name:n})},[s,n,o]),e.useMemo(()=>({field:E,formState:v,fieldState:w}),[E,v,w])}const w=e=>e.render(k(e));export{w as Controller,V as FormProvider,d as get,m as set,k as useController,_ as useFormContext,h as useFormState,F as useWatch};
2
2
  //# sourceMappingURL=index.esm.js.map