@dartcom/ui-kit 2.8.0 → 2.9.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.
- package/README.md +1 -1
- package/dist/cjs/components/form/form.js +13 -17
- package/dist/cjs/components/form/form.js.map +1 -1
- package/dist/cjs/components/list/list.js +26 -5
- package/dist/cjs/components/list/list.js.map +1 -1
- package/dist/cjs/node_modules/react-hook-form/dist/index.esm.js +0 -118
- package/dist/cjs/node_modules/react-hook-form/dist/index.esm.js.map +1 -1
- package/dist/esm/components/form/form.js +1 -1
- package/dist/esm/components/form/form.js.map +1 -1
- package/dist/esm/components/list/list.js +1 -1
- package/dist/esm/components/list/list.js.map +1 -1
- package/dist/esm/node_modules/react-hook-form/dist/index.esm.js +1 -1
- package/dist/esm/node_modules/react-hook-form/dist/index.esm.js.map +1 -1
- package/dist/esm/types/components/form/form.d.ts +2 -2
- package/dist/esm/types/components/form/form.d.ts.map +1 -1
- package/dist/esm/types/components/list/list.d.ts +6 -2
- package/dist/esm/types/components/list/list.d.ts.map +1 -1
- package/dist/esm/types/components/list/list.stories.d.ts +2 -0
- package/dist/esm/types/components/list/list.stories.d.ts.map +1 -1
- package/dist/esm/types/components/list/stories/constants.d.ts +1 -0
- package/dist/esm/types/components/list/stories/constants.d.ts.map +1 -1
- package/package.json +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as
|
|
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 {\r\n FieldValues,\r\n
|
|
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,EAChBS,SAAAC,EAACC,EAAG,CACFC,UAAU,OACVX,GAAI,CACFY,QAAS,OAETC,IAAK,UAEFb,GAELI,SAAUC,EAAaD,GAASI,SAAA,CAChCF,EAACI,EACC,CAAAV,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{jsxs as
|
|
1
|
+
import{jsxs as t,jsx as e}from"react/jsx-runtime";import*as i from"react";import o from"../no-data/no-data.js";import r from"../../node_modules/@mui/material/esm/Box/Box.js";import m from"../../node_modules/@mui/material/esm/Typography/Typography.js";import a from"../../node_modules/@mui/material/esm/List/List.js";import s from"../../node_modules/@mui/material/esm/ListItem/ListItem.js";function n({items:n,columnsCount:l=1,getContent:d,title:p,getKey:u,onClick:g,sx:c,isShowNoData:f=!0}){const x=0===n.length;return t(r,{sx:{display:"grid",gridTemplateColumns:"1fr",gap:"15px",...c?.root},children:[p?e(m,{variant:"h6",noWrap:!0,sx:{textAlign:"center",fontWeight:700,...c?.title},children:p}):null,x?e(i.Fragment,{children:f?e(o,{}):null}):e(a,{sx:{display:"grid",gridTemplateColumns:`repeat(${l}, 1fr)`,gap:"15px",...c?.list},disablePadding:!0,children:n.map((t,i)=>e(s,{onClick:()=>g?.(t,i),sx:{...c?.item},disablePadding:!0,children:d(t,i)},u(t,i)))})]})}export{n as default};
|
|
2
2
|
//# sourceMappingURL=list.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"list.js","sources":["../../../../src/components/list/list.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport { Box, List, ListItem, SxProps, Typography } from '@mui/material';\r\n\r\nimport { NoData } from '../no-data';\r\n\r\ninterface CustomListProps<T> {\r\n items: T[];\r\n columnsCount?: number;\r\n title?: string;\r\n\r\n getContent: (item: T, index: number) => React.JSX.Element;\r\n getKey: (item: T, index: number) =>
|
|
1
|
+
{"version":3,"file":"list.js","sources":["../../../../src/components/list/list.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport { Box, List, ListItem, SxProps, Typography } from '@mui/material';\r\n\r\nimport { StringOrNumber } from '@/types';\r\n\r\nimport { NoData } from '../no-data';\r\n\r\ninterface CustomListProps<T> {\r\n items: T[];\r\n columnsCount?: number;\r\n title?: string;\r\n\r\n getContent: (item: T, index: number) => React.JSX.Element;\r\n getKey: (item: T, index: number) => StringOrNumber;\r\n onClick?: (item: T, index: number) => void;\r\n\r\n sx?: {\r\n root?: SxProps;\r\n list?: SxProps;\r\n title?: SxProps;\r\n item?: SxProps;\r\n };\r\n\r\n isShowNoData?: boolean;\r\n}\r\n\r\nfunction CustomList<T>({\r\n items,\r\n columnsCount = 1,\r\n getContent,\r\n title,\r\n getKey,\r\n onClick,\r\n sx,\r\n\r\n isShowNoData = true,\r\n}: CustomListProps<T>) {\r\n const isNoData = items.length === 0;\r\n\r\n return (\r\n <Box\r\n sx={{\r\n display: 'grid',\r\n\r\n gridTemplateColumns: '1fr',\r\n\r\n gap: '15px',\r\n\r\n ...sx?.root,\r\n }}>\r\n {title ? (\r\n <Typography\r\n variant=\"h6\"\r\n noWrap\r\n sx={{\r\n textAlign: 'center',\r\n\r\n fontWeight: 700,\r\n\r\n ...sx?.title,\r\n }}>\r\n {title}\r\n </Typography>\r\n ) : null}\r\n\r\n {isNoData ? (\r\n <React.Fragment>{isShowNoData ? <NoData /> : null}</React.Fragment>\r\n ) : (\r\n <List\r\n sx={{\r\n display: 'grid',\r\n\r\n gridTemplateColumns: `repeat(${columnsCount}, 1fr)`,\r\n\r\n gap: '15px',\r\n\r\n ...sx?.list,\r\n }}\r\n disablePadding>\r\n {items.map((item, index) => (\r\n <ListItem\r\n key={getKey(item, index)}\r\n onClick={() => onClick?.(item, index)}\r\n sx={{\r\n ...sx?.item,\r\n }}\r\n disablePadding>\r\n {getContent(item, index)}\r\n </ListItem>\r\n ))}\r\n </List>\r\n )}\r\n </Box>\r\n );\r\n}\r\n\r\nexport default CustomList;\r\n"],"names":["CustomList","items","columnsCount","getContent","title","getKey","onClick","sx","isShowNoData","isNoData","length","_jsxs","Box","display","gridTemplateColumns","gap","root","children","_jsx","Typography","variant","noWrap","textAlign","fontWeight","React","Fragment","NoData","List","list","disablePadding","map","item","index","ListItem"],"mappings":"qYA0BA,SAASA,GAAcC,MACrBA,EAAKC,aACLA,EAAe,EAACC,WAChBA,EAAUC,MACVA,EAAKC,OACLA,EAAMC,QACNA,EAAOC,GACPA,EAAEC,aAEFA,GAAe,IAEf,MAAMC,EAA4B,IAAjBR,EAAMS,OAEvB,OACEC,EAACC,EAAG,CACFL,GAAI,CACFM,QAAS,OAETC,oBAAqB,MAErBC,IAAK,UAEFR,GAAIS,MACRC,SAAA,CACAb,EACCc,EAACC,EACC,CAAAC,QAAQ,KACRC,QAAM,EACNd,GAAI,CACFe,UAAW,SAEXC,WAAY,OAEThB,GAAIH,OACRa,SACAb,IAED,KAEHK,EACCS,EAACM,EAAMC,SAAU,CAAAR,SAAAT,EAAeU,EAACQ,MAAY,OAE7CR,EAACS,EAAI,CACHpB,GAAI,CACFM,QAAS,OAETC,oBAAqB,UAAUZ,UAE/Ba,IAAK,UAEFR,GAAIqB,MAETC,gBAAc,EAAAZ,SACbhB,EAAM6B,IAAI,CAACC,EAAMC,IAChBd,EAACe,EAAQ,CAEP3B,QAAS,IAAMA,IAAUyB,EAAMC,GAC/BzB,GAAI,IACCA,GAAIwB,MAETF,2BACC1B,EAAW4B,EAAMC,IANb3B,EAAO0B,EAAMC,SAahC"}
|
|
@@ -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
|
|
1
|
+
import e from"react";var t=e=>e instanceof Date,r=e=>null==e;const n=e=>"object"==typeof e;var a=e=>!r(e)&&!Array.isArray(e)&&n(e)&&!t(e),s=e=>a(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&&!a(e))return e;if(t=r?[]:Object.create(Object.getPrototypeOf(e)),r||(e=>{const t=e.constructor&&e.constructor.prototype;return a(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||!a(e))return n;const s=(i(t)?[t]:c(t)).reduce((e,t)=>r(e)?e:e[t],e);return l(s)||s===e?l(e[t])?n:e[t]:s},f=e=>"boolean"==typeof e,m=(e,t,r)=>{let n=-1;const s=i(t)?[t]:c(t),o=s.length,u=o-1;for(;++n<o;){const t=s[n];let o=r;if(n!==u){const r=e[t];o=a(r)||Array.isArray(r)?r:isNaN(+s[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),h=t=>{const{children:r,...n}=t;return e.createElement(p.Provider,{value:n},r)};const V="undefined"!=typeof window?e.useLayoutEffect:e.useEffect;function v(t){const r=_(),{control:n=r.control,disabled:a,name:s,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:s,formState:l.current,exact:o,callback:e=>{!a&&i({...n._formState,...e})}}),[s,a,o]),e.useEffect(()=>{l.current.isValid&&n._setValid(!0)},[n]),e.useMemo(()=>((e,t,r,n=!0)=>{const a={defaultValues:t._defaultValues};for(const s in e)Object.defineProperty(a,s,{get:()=>{const a=s;return t._proxyFormState[a]!==g&&(t._proxyFormState[a]=!n||g),r&&(r[a]=!0),e[a]}});return a})(u,n,l.current,!1),[u,n])}var A=e=>r(e)||!n(e);function w(e,r,n=new WeakSet){if(A(e)||A(r))return e===r;if(t(e)&&t(r))return e.getTime()===r.getTime();const s=Object.keys(e),o=Object.keys(r);if(s.length!==o.length)return!1;if(n.has(e)||n.has(r))return!0;n.add(e),n.add(r);for(const u of s){const s=e[u];if(!o.includes(u))return!1;if("ref"!==u){const e=r[u];if(t(s)&&t(e)||a(s)&&a(e)||Array.isArray(s)&&Array.isArray(e)?!w(s,e,n):s!==e)return!1}}return!0}function x(t){const r=_(),{control:n=r.control,name:a,defaultValue:s,disabled:o,exact:u,compute:i}=t||{},l=e.useRef(s),c=e.useRef(i),f=e.useRef(void 0);c.current=i;const m=e.useMemo(()=>n._getWatch(a,l.current),[n,a]),[y,b]=e.useState(c.current?c.current(m):m);return V(()=>n._subscribe({name:a,formState:{values:!0},exact:u,callback:e=>{if(!o){const t=((e,t,r,n,a)=>"string"==typeof e?(n&&t.watch.add(e),d(r,e,a)):Array.isArray(e)?e.map(e=>(n&&t.watch.add(e),d(r,e))):(n&&(t.watchAll=!0),r))(a,n._names,e.values||n._formValues,!1,l.current);if(c.current){const e=c.current(t);w(e,f.current)||(b(e),f.current=e)}else b(t)}}}),[n,o,a,u]),e.useEffect(()=>n._removeUnmounted()),y}function F(t){const r=_(),{name:n,disabled:a,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]),h=x({control:o,name:n,defaultValue:p,exact:!0}),V=v({control:o,name:n,exact:!0}),A=e.useRef(t),w=e.useRef(o.register(n,{...t.rules,value:h,...f(t.disabled)?{disabled:t.disabled}:{}}));A.current=t;const F=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]),k=e.useCallback(e=>w.current.onChange({target:{value:s(e),name:n},type:b}),[n]),S=e.useCallback(()=>w.current.onBlur({target:{value:d(o._formValues,n),name:n},type:y}),[n,o._formValues]),C=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]),O=e.useMemo(()=>({name:n,value:h,...f(a)||V.disabled?{disabled:V.disabled||a}:{},onChange:k,onBlur:S,ref:C}),[n,a,V.disabled,k,S,C,h]);return e.useEffect(()=>{const e=o._options.shouldUnregister||i;o.register(n,{...A.current.rules,...f(A.current.disabled)?{disabled:A.current.disabled}:{}});const t=(e,t)=>{const r=d(o._fields,e);r&&r._f&&(r._f.mount=t)};if(t(n,!0),e){const e=u(d(o._options.defaultValues,n));m(o._defaultValues,n,e),l(d(o._formValues,n))&&m(o._formValues,n,e)}return!g&&o.register(n),()=>{(g?e&&!o._state.action:e)?o.unregister(n):t(n,!1)}},[n,o,g,i]),e.useEffect(()=>{o._setDisabledField({disabled:a,name:n})},[a,n,o]),e.useMemo(()=>({field:O,formState:V,fieldState:F}),[O,V,F])}const k=e=>e.render(F(e));export{k as Controller,h as FormProvider,d as get,m as set,F as useController,_ as useFormContext,v as useFormState,x as useWatch};
|
|
2
2
|
//# sourceMappingURL=index.esm.js.map
|