@dartcom/ui-kit 3.2.2 → 3.2.3
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/dist/cjs/components/select/select.js +8 -5
- package/dist/cjs/components/select/select.js.map +1 -1
- package/dist/esm/components/select/select.js +1 -1
- package/dist/esm/components/select/select.js.map +1 -1
- package/dist/esm/types/components/select/select.d.ts +5 -2
- package/dist/esm/types/components/select/select.d.ts.map +1 -1
- package/dist/esm/types/components/select/select.stories.d.ts +1 -0
- package/dist/esm/types/components/select/select.stories.d.ts.map +1 -1
- package/package.json +1 -1
|
@@ -27,15 +27,18 @@ function _interopNamespaceDefault(e) {
|
|
|
27
27
|
|
|
28
28
|
var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
|
|
29
29
|
|
|
30
|
-
function CustomSelect({ name, items, label, getLabel, getValue, }) {
|
|
30
|
+
function CustomSelect({ name, items, label, sx, getLabel, getValue, getKey, }) {
|
|
31
31
|
const { watch, resetField, setValue } = index_esm.useFormContext();
|
|
32
32
|
const formValue = watch(name);
|
|
33
33
|
const selectId = React__namespace.useId();
|
|
34
|
-
const
|
|
35
|
-
const value = item ? getValue(item) : null;
|
|
34
|
+
const value = items.find((item) => getValue(item) === formValue) ?? null;
|
|
36
35
|
return (jsxRuntime.jsx(Autocomplete.default, { value: value, options: items, id: selectId, getOptionLabel: (item) => {
|
|
37
|
-
|
|
38
|
-
|
|
36
|
+
const optionLabel = item ? getLabel(item) : '';
|
|
37
|
+
return optionLabel;
|
|
38
|
+
}, getOptionKey: (item) => {
|
|
39
|
+
const optionKey = item ? getKey(item) : '';
|
|
40
|
+
return optionKey;
|
|
41
|
+
}, sx: { minWidth: 150, ...sx }, size: "small", onChange: (_, newValue) => {
|
|
39
42
|
if (newValue) {
|
|
40
43
|
setValue(name, getValue(newValue));
|
|
41
44
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select.js","sources":["../../../../src/components/select/select.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport { TextField } from '@mui/material';\r\nimport Autocomplete from '@mui/material/Autocomplete';\r\nimport { FieldValues, Path, PathValue, useFormContext } from 'react-hook-form';\r\n\r\nimport { Nullable } from '
|
|
1
|
+
{"version":3,"file":"select.js","sources":["../../../../src/components/select/select.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport { SxProps, TextField } from '@mui/material';\r\nimport Autocomplete from '@mui/material/Autocomplete';\r\nimport { FieldValues, Path, PathValue, useFormContext } from 'react-hook-form';\r\n\r\nimport { Nullable, StringOrNumber } from '@/types';\r\n\r\ninterface SelectProps<V, O> {\r\n name: Path<V>;\r\n items: O[];\r\n label: string;\r\n\r\n sx?: SxProps;\r\n\r\n getLabel: (item: O) => string;\r\n getKey: (item: O) => StringOrNumber;\r\n getValue: (item: O) => PathValue<V, Path<V>>;\r\n}\r\n\r\nfunction CustomSelect<V extends FieldValues, O>({\r\n name,\r\n items,\r\n label,\r\n\r\n sx,\r\n\r\n getLabel,\r\n getValue,\r\n getKey,\r\n}: SelectProps<V, O>): React.ReactNode {\r\n const { watch, resetField, setValue } = useFormContext<V>();\r\n\r\n const formValue = watch(name);\r\n\r\n const selectId = React.useId();\r\n\r\n const value = items.find((item) => getValue(item) === formValue) ?? null;\r\n\r\n return (\r\n <Autocomplete<Nullable<O>>\r\n value={value}\r\n options={items}\r\n id={selectId}\r\n getOptionLabel={(item) => {\r\n const optionLabel = item ? getLabel(item) : '';\r\n\r\n return optionLabel;\r\n }}\r\n getOptionKey={(item) => {\r\n const optionKey = item ? getKey(item) : '';\r\n\r\n return optionKey;\r\n }}\r\n sx={{ minWidth: 150, ...sx }}\r\n size=\"small\"\r\n onChange={(_, newValue) => {\r\n if (newValue) {\r\n setValue(name, getValue(newValue));\r\n } else {\r\n resetField(name);\r\n }\r\n }}\r\n renderInput={(params) => <TextField {...params} label={label} />}\r\n />\r\n );\r\n}\r\n\r\nexport default CustomSelect;\r\n"],"names":["useFormContext","React","_jsx","Autocomplete","TextField"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBA,SAAS,YAAY,CAA2B,EAC9C,IAAI,EACJ,KAAK,EACL,KAAK,EAEL,EAAE,EAEF,QAAQ,EACR,QAAQ,EACR,MAAM,GACY,EAAA;IAClB,MAAM,EAAE,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAGA,wBAAc,EAAK;AAE3D,IAAA,MAAM,SAAS,GAAG,KAAK,CAAC,IAAI,CAAC;AAE7B,IAAA,MAAM,QAAQ,GAAGC,gBAAK,CAAC,KAAK,EAAE;IAE9B,MAAM,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC,IAAI,KAAK,QAAQ,CAAC,IAAI,CAAC,KAAK,SAAS,CAAC,IAAI,IAAI;IAExE,QACEC,eAACC,oBAAY,EAAA,EACX,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,KAAK,EACd,EAAE,EAAE,QAAQ,EACZ,cAAc,EAAE,CAAC,IAAI,KAAI;AACvB,YAAA,MAAM,WAAW,GAAG,IAAI,GAAG,QAAQ,CAAC,IAAI,CAAC,GAAG,EAAE;AAE9C,YAAA,OAAO,WAAW;AACpB,QAAA,CAAC,EACD,YAAY,EAAE,CAAC,IAAI,KAAI;AACrB,YAAA,MAAM,SAAS,GAAG,IAAI,GAAG,MAAM,CAAC,IAAI,CAAC,GAAG,EAAE;AAE1C,YAAA,OAAO,SAAS;QAClB,CAAC,EACD,EAAE,EAAE,EAAE,QAAQ,EAAE,GAAG,EAAE,GAAG,EAAE,EAAE,EAC5B,IAAI,EAAC,OAAO,EACZ,QAAQ,EAAE,CAAC,CAAC,EAAE,QAAQ,KAAI;YACxB,IAAI,QAAQ,EAAE;gBACZ,QAAQ,CAAC,IAAI,EAAE,QAAQ,CAAC,QAAQ,CAAC,CAAC;YACpC;iBAAO;gBACL,UAAU,CAAC,IAAI,CAAC;YAClB;AACF,QAAA,CAAC,EACD,WAAW,EAAE,CAAC,MAAM,KAAKD,cAAA,CAACE,iBAAS,EAAA,EAAA,GAAK,MAAM,EAAE,KAAK,EAAE,KAAK,EAAA,CAAI,EAAA,CAChE;AAEN;;;;"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as e}from"react/jsx-runtime";import*as t from"react";import{useFormContext as o}from"../../node_modules/react-hook-form/dist/index.esm.js";import m from"../../node_modules/@mui/material/esm/Autocomplete/Autocomplete.js";import i from"../../node_modules/@mui/material/esm/TextField/TextField.js";function l({name:l,items:r,label:s,
|
|
1
|
+
import{jsx as e}from"react/jsx-runtime";import*as t from"react";import{useFormContext as o}from"../../node_modules/react-hook-form/dist/index.esm.js";import m from"../../node_modules/@mui/material/esm/Autocomplete/Autocomplete.js";import i from"../../node_modules/@mui/material/esm/TextField/TextField.js";function l({name:l,items:r,label:s,sx:a,getLabel:n,getValue:d,getKey:u}){const{watch:p,resetField:f,setValue:c}=o(),x=p(l),g=t.useId(),b=r.find(e=>d(e)===x)??null;return e(m,{value:b,options:r,id:g,getOptionLabel:e=>e?n(e):"",getOptionKey:e=>e?u(e):"",sx:{minWidth:150,...a},size:"small",onChange:(e,t)=>{t?c(l,d(t)):f(l)},renderInput:t=>e(i,{...t,label:s})})}export{l as default};
|
|
2
2
|
//# sourceMappingURL=select.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select.js","sources":["../../../../src/components/select/select.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport { TextField } from '@mui/material';\r\nimport Autocomplete from '@mui/material/Autocomplete';\r\nimport { FieldValues, Path, PathValue, useFormContext } from 'react-hook-form';\r\n\r\nimport { Nullable } from '
|
|
1
|
+
{"version":3,"file":"select.js","sources":["../../../../src/components/select/select.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport { SxProps, TextField } from '@mui/material';\r\nimport Autocomplete from '@mui/material/Autocomplete';\r\nimport { FieldValues, Path, PathValue, useFormContext } from 'react-hook-form';\r\n\r\nimport { Nullable, StringOrNumber } from '@/types';\r\n\r\ninterface SelectProps<V, O> {\r\n name: Path<V>;\r\n items: O[];\r\n label: string;\r\n\r\n sx?: SxProps;\r\n\r\n getLabel: (item: O) => string;\r\n getKey: (item: O) => StringOrNumber;\r\n getValue: (item: O) => PathValue<V, Path<V>>;\r\n}\r\n\r\nfunction CustomSelect<V extends FieldValues, O>({\r\n name,\r\n items,\r\n label,\r\n\r\n sx,\r\n\r\n getLabel,\r\n getValue,\r\n getKey,\r\n}: SelectProps<V, O>): React.ReactNode {\r\n const { watch, resetField, setValue } = useFormContext<V>();\r\n\r\n const formValue = watch(name);\r\n\r\n const selectId = React.useId();\r\n\r\n const value = items.find((item) => getValue(item) === formValue) ?? null;\r\n\r\n return (\r\n <Autocomplete<Nullable<O>>\r\n value={value}\r\n options={items}\r\n id={selectId}\r\n getOptionLabel={(item) => {\r\n const optionLabel = item ? getLabel(item) : '';\r\n\r\n return optionLabel;\r\n }}\r\n getOptionKey={(item) => {\r\n const optionKey = item ? getKey(item) : '';\r\n\r\n return optionKey;\r\n }}\r\n sx={{ minWidth: 150, ...sx }}\r\n size=\"small\"\r\n onChange={(_, newValue) => {\r\n if (newValue) {\r\n setValue(name, getValue(newValue));\r\n } else {\r\n resetField(name);\r\n }\r\n }}\r\n renderInput={(params) => <TextField {...params} label={label} />}\r\n />\r\n );\r\n}\r\n\r\nexport default CustomSelect;\r\n"],"names":["CustomSelect","name","items","label","sx","getLabel","getValue","getKey","watch","resetField","setValue","useFormContext","formValue","selectId","React","useId","value","find","item","_jsx","Autocomplete","options","id","getOptionLabel","getOptionKey","minWidth","size","onChange","_","newValue","renderInput","params","TextField"],"mappings":"kTAmBA,SAASA,GAAuCC,KAC9CA,EAAIC,MACJA,EAAKC,MACLA,EAAKC,GAELA,EAAEC,SAEFA,EAAQC,SACRA,EAAQC,OACRA,IAEA,MAAMC,MAAEA,EAAKC,WAAEA,EAAUC,SAAEA,GAAaC,IAElCC,EAAYJ,EAAMP,GAElBY,EAAWC,EAAMC,QAEjBC,EAAQd,EAAMe,KAAMC,GAASZ,EAASY,KAAUN,IAAc,KAEpE,OACEO,EAACC,EAAY,CACXJ,MAAOA,EACPK,QAASnB,EACToB,GAAIT,EACJU,eAAiBL,GACKA,EAAOb,EAASa,GAAQ,GAI9CM,aAAeN,GACKA,EAAOX,EAAOW,GAAQ,GAI1Cd,GAAI,CAAEqB,SAAU,OAAQrB,GACxBsB,KAAK,QACLC,SAAU,CAACC,EAAGC,KACRA,EACFnB,EAAST,EAAMK,EAASuB,IAExBpB,EAAWR,IAGf6B,YAAcC,GAAWZ,EAACa,EAAS,IAAKD,EAAQ5B,MAAOA,KAG7D"}
|
|
@@ -1,13 +1,16 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
+
import { SxProps } from '@mui/material';
|
|
2
3
|
import { FieldValues, Path, PathValue } from 'react-hook-form';
|
|
4
|
+
import { StringOrNumber } from '@/types';
|
|
3
5
|
interface SelectProps<V, O> {
|
|
4
6
|
name: Path<V>;
|
|
5
7
|
items: O[];
|
|
6
8
|
label: string;
|
|
9
|
+
sx?: SxProps;
|
|
7
10
|
getLabel: (item: O) => string;
|
|
8
|
-
getKey: (item: O) =>
|
|
11
|
+
getKey: (item: O) => StringOrNumber;
|
|
9
12
|
getValue: (item: O) => PathValue<V, Path<V>>;
|
|
10
13
|
}
|
|
11
|
-
declare function CustomSelect<V extends FieldValues, O>({ name, items, label, getLabel, getValue, }: SelectProps<V, O>): React.ReactNode;
|
|
14
|
+
declare function CustomSelect<V extends FieldValues, O>({ name, items, label, sx, getLabel, getValue, getKey, }: SelectProps<V, O>): React.ReactNode;
|
|
12
15
|
export default CustomSelect;
|
|
13
16
|
//# sourceMappingURL=select.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../../../../src/components/select/select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../../../../src/components/select/select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,OAAO,EAAa,MAAM,eAAe,CAAC;AAEnD,OAAO,EAAE,WAAW,EAAE,IAAI,EAAE,SAAS,EAAkB,MAAM,iBAAiB,CAAC;AAE/E,OAAO,EAAY,cAAc,EAAE,MAAM,SAAS,CAAC;AAEnD,UAAU,WAAW,CAAC,CAAC,EAAE,CAAC;IACxB,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC;IACd,KAAK,EAAE,CAAC,EAAE,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IAEd,EAAE,CAAC,EAAE,OAAO,CAAC;IAEb,QAAQ,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,CAAC;IAC9B,MAAM,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,cAAc,CAAC;IACpC,QAAQ,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,SAAS,CAAC,CAAC,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC;CAC9C;AAED,iBAAS,YAAY,CAAC,CAAC,SAAS,WAAW,EAAE,CAAC,EAAE,EAC9C,IAAI,EACJ,KAAK,EACL,KAAK,EAEL,EAAE,EAEF,QAAQ,EACR,QAAQ,EACR,MAAM,GACP,EAAE,WAAW,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,KAAK,CAAC,SAAS,CAoCrC;AAED,eAAe,YAAY,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/select/select.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAKvD,OAAO,EAAE,MAAM,EAAE,MAAM,GAAG,CAAC;AAE3B,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,MAAM,CAO7B,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAmDrB,CAAC"}
|
|
1
|
+
{"version":3,"file":"select.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/select/select.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAKvD,OAAO,EAAE,MAAM,EAAE,MAAM,GAAG,CAAC;AAE3B,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,MAAM,CAO7B,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAmDrB,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAuD9B,CAAC"}
|