@mage-ui/components 1.0.175 → 1.0.177
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/components/controls/dropdown/autocomplete/Autocomplete.d.mts +1 -0
- package/dist/components/controls/dropdown/autocomplete/Autocomplete.d.mts.map +1 -1
- package/dist/components/controls/dropdown/autocomplete/Autocomplete.mjs +1 -1
- package/dist/components/controls/dropdown/autocomplete/Autocomplete.mjs.map +1 -1
- package/dist/components/controls/dropdown/combobox/Combobox.d.mts +2 -0
- package/dist/components/controls/dropdown/combobox/Combobox.d.mts.map +1 -1
- package/dist/components/controls/dropdown/combobox/Combobox.mjs +1 -1
- package/dist/components/controls/dropdown/combobox/Combobox.mjs.map +1 -1
- package/dist/components/controls/dropdown/select/Select.d.mts +2 -0
- package/dist/components/controls/dropdown/select/Select.d.mts.map +1 -1
- package/dist/components/controls/dropdown/select/Select.mjs +1 -1
- package/dist/components/controls/dropdown/select/Select.mjs.map +1 -1
- package/dist/components/controls/dropzone/Dropzone.d.mts +3 -0
- package/dist/components/controls/dropzone/Dropzone.d.mts.map +1 -1
- package/dist/components/controls/dropzone/Dropzone.mjs +1 -1
- package/dist/components/controls/dropzone/Dropzone.mjs.map +1 -1
- package/dist/components/controls/dropzone/DropzoneBase.d.mts +1 -0
- package/dist/components/controls/dropzone/DropzoneBase.d.mts.map +1 -1
- package/dist/components/controls/dropzone/DropzoneBase.mjs +1 -1
- package/dist/components/controls/dropzone/DropzoneBase.mjs.map +1 -1
- package/dist/components/controls/file-input/FileInputMultiple.d.mts +20 -17
- package/dist/components/controls/file-input/FileInputMultiple.d.mts.map +1 -1
- package/dist/components/controls/file-input/FileInputMultiple.mjs +1 -1
- package/dist/components/controls/file-input/FileInputMultiple.mjs.map +1 -1
- package/dist/components/controls/file-input/FileInputMultipleS3.d.mts +2 -5
- package/dist/components/controls/file-input/FileInputMultipleS3.d.mts.map +1 -1
- package/dist/components/controls/file-input/FileInputMultipleS3.mjs +1 -1
- package/dist/components/controls/file-input/FileInputMultipleS3.mjs.map +1 -1
- package/dist/components/controls/index.d.mts +1 -1
- package/dist/components/index.d.mts +1 -1
- package/dist/index.d.mts +2 -2
- package/package.json +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Autocomplete.d.mts","names":[],"sources":["../../../../../src/components/controls/dropdown/autocomplete/Autocomplete.tsx"],"mappings":";;;;;;;KAkCY,iBAAA,GAAoB,IAAA,CAC9B,aAAA;EAGA,IAAA;EACA,WAAA,GAAc,SAAA;EACd,KAAA;EACA,GAAA;EACA,OAAA,GAAU,MAAA;IACR,GAAA;IACA,KAAA;EAAA,MACI,OAAA,CAAQ,aAAA;EACd,SAAA;EACA,QAAA;EACA,KAAA;EACA,UAAA,GAAa,IAAA,CAAK,WAAA,CAAY,aAAA;IAC5B,MAAA,GAAS,mBAAA;MACP,WAAA,GAAc,WAAA,CACZ,mBAAA;IAAA;EAAA;AAAA;AAAA,cAMK,YAAA;EAAgB,IAAA;EAAA,KAAA;EAAA,QAAA;EAAA,YAAA;EAAA,WAAA;EAAA,KAAA;EAAA,WAAA;EAAA,SAAA;EAAA,GAAA;EAAA,OAAA;EAAA,KAAA;EAAA,QAAA;EAAA,SAAA;EAAA,eAAA;EAAA,UAAA;EAAA,SAAA;EAAA,UAAA;EAAA,GAAA;AAAA,
|
|
1
|
+
{"version":3,"file":"Autocomplete.d.mts","names":[],"sources":["../../../../../src/components/controls/dropdown/autocomplete/Autocomplete.tsx"],"mappings":";;;;;;;KAkCY,iBAAA,GAAoB,IAAA,CAC9B,aAAA;EAGA,IAAA;EACA,WAAA,GAAc,SAAA;EACd,KAAA;EACA,GAAA;EACA,OAAA,GAAU,MAAA;IACR,GAAA;IACA,KAAA;EAAA,MACI,OAAA,CAAQ,aAAA;EACd,SAAA;EACA,QAAA;EACA,KAAA;EACA,UAAA,GAAa,IAAA,CAAK,WAAA,CAAY,aAAA;IAC5B,MAAA,GAAS,mBAAA;MACP,WAAA,GAAc,WAAA,CACZ,mBAAA;IAAA;EAAA;AAAA;AAAA,cAMK,YAAA;EAAgB,IAAA;EAAA,KAAA;EAAA,QAAA;EAAA,YAAA;EAAA,QAAA;EAAA,WAAA;EAAA,KAAA;EAAA,WAAA;EAAA,SAAA;EAAA,GAAA;EAAA,OAAA;EAAA,KAAA;EAAA,QAAA;EAAA,SAAA;EAAA,eAAA;EAAA,UAAA;EAAA,SAAA;EAAA,UAAA;EAAA,GAAA;AAAA,GAoB1B,iBAAA,KAAiB,kBAAA,CAAA,GAAA,CAAA,OAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{Dropdown as e}from"../Dropdown.mjs";import{ComboboxOptions as t}from"../combobox/ComboboxOptions.mjs";import{AutocompleteTarget as n}from"./AutocompleteTarget.mjs";import{autocomplete as r,autocompleteClearButton as i,autocompleteClearButtonIcon as a,autocompleteClearButtonIconRaw as o,autocompleteClearButtonIconRawRoot as ee,autocompleteClearButtonRoot as s,autocompleteEmpty as c,autocompleteOption as l,autocompleteOptions as u,autocompleteRoot as
|
|
1
|
+
import{Dropdown as e}from"../Dropdown.mjs";import{ComboboxOptions as t}from"../combobox/ComboboxOptions.mjs";import{AutocompleteTarget as n}from"./AutocompleteTarget.mjs";import{autocomplete as r,autocompleteClearButton as i,autocompleteClearButtonIcon as a,autocompleteClearButtonIconRaw as o,autocompleteClearButtonIconRawRoot as ee,autocompleteClearButtonRoot as s,autocompleteEmpty as c,autocompleteOption as l,autocompleteOptions as u,autocompleteRoot as te,autocompleteScrollAreaAutosize as ne,autocompleteTextInput as re,autocompleteTextInputDescription as ie,autocompleteTextInputError as d,autocompleteTextInputInput as f,autocompleteTextInputLabel as p,autocompleteTextInputRequired as m,autocompleteTextInputRoot as h,autocompleteTextInputSection as g,autocompleteTextInputWrapper as _}from"@mage-ui/styled-system/recipes";import{jsx as v}from"react/jsx-runtime";import{useState as y}from"react";import{useDebouncedCallback as b}from"@mantine/hooks";import{useQuery as x}from"@tanstack/react-query";const S=({name:S,label:C,required:w,autoComplete:T,disabled:E,description:D,error:O,placeholder:k,creatable:A,url:j,fetcher:M,query:N=``,debounce:P=500,threshold:F=3,clearButtonText:I,createText:L,emptyText:R=`No hay resultados`,classNames:z,...B})=>{let[V,H]=y(N),[U,W]=y(!1),{data:G,isFetching:K}=x({queryKey:[S,j,V],queryFn:()=>M({url:j,query:V}),initialData:[],enabled:V.length>=F}),q=b(e=>{H(e),W(!1)},P),J=e=>{W(!0),q(e)},{creatable:Y,empty:X,target:ae,scrollArea:oe,...Z}=z||{},{clearButton:Q,...$}=ae||{},se={placeholder:k,label:C,required:w,autoComplete:T,disabled:E,description:D,error:O,classNames:{dropdownTextInput:$?.dropdownTextInput??re(),root:$?.root??h(),label:$?.label??p(),description:$?.description??ie(),error:$?.error??d(),wrapper:$?.wrapper??_(),input:$?.input??f(),section:$?.section??g(),required:$?.required??m()},clearButtonProps:{label:I,classNames:{clearButton:Q?.clearButton??i(),root:Q?.root??s(),icon:Q?.icon??a(),iconRaw:{iconRaw:Q?.iconRaw?.iconRaw??o(),root:Q?.iconRaw?.root??ee()}}}},ce={emptyText:R,classNames:{empty:X?.empty??c()}},le={creatable:A??!1,createText:L,classNames:Y};return v(e,{shouldFilter:!1,classNames:{dropdown:Z?.dropdown??r(),root:Z?.root??te(),options:Z?.options??u(),option:Z?.option??l(),empty:X?.empty??c(),search:Z?.search},scrollAreaProps:{classNames:{dropdownScrollAreaAutosize:oe?.dropdownScrollAreaAutosize??ne()}},target:v(n,{debounced:J,isLoading:K||U,threshold:F,showEmpty:R!==void 0,...se}),options:G,...B,children:v(t,{emptyProps:ce,creatableProps:le})})};export{S as Autocomplete};
|
|
2
2
|
//# sourceMappingURL=Autocomplete.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Autocomplete.mjs","names":[],"sources":["../../../../../src/components/controls/dropdown/autocomplete/Autocomplete.tsx"],"sourcesContent":["import { type ReactNode, useState } from 'react';\n\nimport {\n autocomplete,\n autocompleteClearButton,\n autocompleteClearButtonIcon,\n autocompleteClearButtonIconRaw,\n autocompleteClearButtonIconRawRoot,\n autocompleteClearButtonRoot,\n autocompleteEmpty,\n autocompleteOption,\n autocompleteOptions,\n autocompleteRoot,\n autocompleteScrollAreaAutosize,\n autocompleteTextInput,\n autocompleteTextInputDescription,\n autocompleteTextInputError,\n autocompleteTextInputInput,\n autocompleteTextInputLabel,\n autocompleteTextInputRequired,\n autocompleteTextInputRoot,\n autocompleteTextInputSection,\n autocompleteTextInputWrapper,\n} from '@mage-ui/styled-system/recipes';\nimport { useDebouncedCallback } from '@mantine/hooks';\nimport { useQuery } from '@tanstack/react-query';\n\nimport type { ComboboxProps } from '../combobox/Combobox';\nimport { ComboboxOptions } from '../combobox/ComboboxOptions';\nimport type { ComboboxTargetProps } from '../combobox/ComboboxTarget';\nimport { Dropdown } from '../Dropdown';\nimport type { DropdownValue } from '../DropdownContextProvider';\nimport { AutocompleteTarget } from './AutocompleteTarget';\n\nexport type AutocompleteProps = Omit<\n ComboboxProps,\n 'options' | 'classNames'\n> & {\n name: string;\n description?: ReactNode;\n error?: string;\n url?: string;\n fetcher: (params: {\n url?: string;\n query: string;\n }) => Promise<DropdownValue[]>;\n threshold?: number;\n debounce?: number;\n query?: string;\n classNames?: Omit<NonNullable<ComboboxProps['classNames']>, 'target'> & {\n target?: ComboboxTargetProps['classNames'] & {\n clearButton?: NonNullable<\n ComboboxTargetProps['clearButtonProps']\n >['classNames'];\n };\n };\n};\n\nexport const Autocomplete = ({\n name,\n label,\n required,\n autoComplete,\n description,\n error,\n placeholder,\n creatable,\n url,\n fetcher,\n query = '',\n debounce = 500,\n threshold = 3,\n clearButtonText,\n createText,\n emptyText = 'No hay resultados',\n classNames,\n ...props\n}: AutocompleteProps) => {\n const [searchValue, setSearchValue] = useState(query);\n const [isTyping, setIsTyping] = useState(false);\n\n const { data, isFetching } = useQuery<DropdownValue[]>({\n queryKey: [name, url, searchValue],\n queryFn: () => {\n return fetcher({\n url,\n query: searchValue,\n });\n },\n initialData: [],\n enabled: searchValue.length >= threshold,\n });\n\n const debounced = useDebouncedCallback((value: string) => {\n setSearchValue(value);\n setIsTyping(false);\n }, debounce);\n\n const handleSearch = (value: string) => {\n setIsTyping(true);\n debounced(value);\n };\n\n const {\n creatable: creatableClassNames,\n empty: emptyClassNames,\n target: targetClassNames,\n scrollArea: scrollAreaClassNames,\n ...dropdownClassNames\n } = classNames || {};\n\n const { clearButton: clearButtonClassNames, ...restTargetClassNames } =\n targetClassNames || {};\n\n const targetProps = {\n placeholder,\n label,\n required,\n autoComplete,\n description,\n error,\n classNames: {\n dropdownTextInput:\n restTargetClassNames?.dropdownTextInput ?? autocompleteTextInput(),\n root: restTargetClassNames?.root ?? autocompleteTextInputRoot(),\n label: restTargetClassNames?.label ?? autocompleteTextInputLabel(),\n description:\n restTargetClassNames?.description ?? autocompleteTextInputDescription(),\n error: restTargetClassNames?.error ?? autocompleteTextInputError(),\n wrapper: restTargetClassNames?.wrapper ?? autocompleteTextInputWrapper(),\n input: restTargetClassNames?.input ?? autocompleteTextInputInput(),\n section: restTargetClassNames?.section ?? autocompleteTextInputSection(),\n required:\n restTargetClassNames?.required ?? autocompleteTextInputRequired(),\n },\n clearButtonProps: {\n label: clearButtonText,\n classNames: {\n clearButton:\n clearButtonClassNames?.clearButton ?? autocompleteClearButton(),\n root: clearButtonClassNames?.root ?? autocompleteClearButtonRoot(),\n icon: clearButtonClassNames?.icon ?? autocompleteClearButtonIcon(),\n iconRaw: {\n iconRaw:\n clearButtonClassNames?.iconRaw?.iconRaw ??\n autocompleteClearButtonIconRaw(),\n root:\n clearButtonClassNames?.iconRaw?.root ??\n autocompleteClearButtonIconRawRoot(),\n },\n },\n },\n };\n\n const emptyProps = {\n emptyText,\n classNames: {\n empty: emptyClassNames?.empty ?? autocompleteEmpty(),\n },\n };\n\n const creatableProps = {\n creatable: creatable ?? false,\n createText,\n classNames: creatableClassNames,\n };\n\n return (\n <Dropdown\n shouldFilter={false}\n classNames={{\n dropdown: dropdownClassNames?.dropdown ?? autocomplete(),\n root: dropdownClassNames?.root ?? autocompleteRoot(),\n options: dropdownClassNames?.options ?? autocompleteOptions(),\n option: dropdownClassNames?.option ?? autocompleteOption(),\n empty: emptyClassNames?.empty ?? autocompleteEmpty(),\n search: dropdownClassNames?.search,\n }}\n scrollAreaProps={{\n classNames: {\n dropdownScrollAreaAutosize:\n scrollAreaClassNames?.dropdownScrollAreaAutosize ??\n autocompleteScrollAreaAutosize(),\n },\n }}\n target={\n <AutocompleteTarget\n debounced={handleSearch}\n isLoading={isFetching || isTyping}\n threshold={threshold}\n showEmpty={emptyText !== undefined}\n {...targetProps}\n />\n }\n options={data}\n {...props}\n >\n <ComboboxOptions\n emptyProps={emptyProps}\n creatableProps={creatableProps}\n />\n </Dropdown>\n );\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Autocomplete.mjs","names":[],"sources":["../../../../../src/components/controls/dropdown/autocomplete/Autocomplete.tsx"],"sourcesContent":["import { type ReactNode, useState } from 'react';\n\nimport {\n autocomplete,\n autocompleteClearButton,\n autocompleteClearButtonIcon,\n autocompleteClearButtonIconRaw,\n autocompleteClearButtonIconRawRoot,\n autocompleteClearButtonRoot,\n autocompleteEmpty,\n autocompleteOption,\n autocompleteOptions,\n autocompleteRoot,\n autocompleteScrollAreaAutosize,\n autocompleteTextInput,\n autocompleteTextInputDescription,\n autocompleteTextInputError,\n autocompleteTextInputInput,\n autocompleteTextInputLabel,\n autocompleteTextInputRequired,\n autocompleteTextInputRoot,\n autocompleteTextInputSection,\n autocompleteTextInputWrapper,\n} from '@mage-ui/styled-system/recipes';\nimport { useDebouncedCallback } from '@mantine/hooks';\nimport { useQuery } from '@tanstack/react-query';\n\nimport type { ComboboxProps } from '../combobox/Combobox';\nimport { ComboboxOptions } from '../combobox/ComboboxOptions';\nimport type { ComboboxTargetProps } from '../combobox/ComboboxTarget';\nimport { Dropdown } from '../Dropdown';\nimport type { DropdownValue } from '../DropdownContextProvider';\nimport { AutocompleteTarget } from './AutocompleteTarget';\n\nexport type AutocompleteProps = Omit<\n ComboboxProps,\n 'options' | 'classNames'\n> & {\n name: string;\n description?: ReactNode;\n error?: string;\n url?: string;\n fetcher: (params: {\n url?: string;\n query: string;\n }) => Promise<DropdownValue[]>;\n threshold?: number;\n debounce?: number;\n query?: string;\n classNames?: Omit<NonNullable<ComboboxProps['classNames']>, 'target'> & {\n target?: ComboboxTargetProps['classNames'] & {\n clearButton?: NonNullable<\n ComboboxTargetProps['clearButtonProps']\n >['classNames'];\n };\n };\n};\n\nexport const Autocomplete = ({\n name,\n label,\n required,\n autoComplete,\n disabled,\n description,\n error,\n placeholder,\n creatable,\n url,\n fetcher,\n query = '',\n debounce = 500,\n threshold = 3,\n clearButtonText,\n createText,\n emptyText = 'No hay resultados',\n classNames,\n ...props\n}: AutocompleteProps) => {\n const [searchValue, setSearchValue] = useState(query);\n const [isTyping, setIsTyping] = useState(false);\n\n const { data, isFetching } = useQuery<DropdownValue[]>({\n queryKey: [name, url, searchValue],\n queryFn: () => {\n return fetcher({\n url,\n query: searchValue,\n });\n },\n initialData: [],\n enabled: searchValue.length >= threshold,\n });\n\n const debounced = useDebouncedCallback((value: string) => {\n setSearchValue(value);\n setIsTyping(false);\n }, debounce);\n\n const handleSearch = (value: string) => {\n setIsTyping(true);\n debounced(value);\n };\n\n const {\n creatable: creatableClassNames,\n empty: emptyClassNames,\n target: targetClassNames,\n scrollArea: scrollAreaClassNames,\n ...dropdownClassNames\n } = classNames || {};\n\n const { clearButton: clearButtonClassNames, ...restTargetClassNames } =\n targetClassNames || {};\n\n const targetProps = {\n placeholder,\n label,\n required,\n autoComplete,\n disabled,\n description,\n error,\n classNames: {\n dropdownTextInput:\n restTargetClassNames?.dropdownTextInput ?? autocompleteTextInput(),\n root: restTargetClassNames?.root ?? autocompleteTextInputRoot(),\n label: restTargetClassNames?.label ?? autocompleteTextInputLabel(),\n description:\n restTargetClassNames?.description ?? autocompleteTextInputDescription(),\n error: restTargetClassNames?.error ?? autocompleteTextInputError(),\n wrapper: restTargetClassNames?.wrapper ?? autocompleteTextInputWrapper(),\n input: restTargetClassNames?.input ?? autocompleteTextInputInput(),\n section: restTargetClassNames?.section ?? autocompleteTextInputSection(),\n required:\n restTargetClassNames?.required ?? autocompleteTextInputRequired(),\n },\n clearButtonProps: {\n label: clearButtonText,\n classNames: {\n clearButton:\n clearButtonClassNames?.clearButton ?? autocompleteClearButton(),\n root: clearButtonClassNames?.root ?? autocompleteClearButtonRoot(),\n icon: clearButtonClassNames?.icon ?? autocompleteClearButtonIcon(),\n iconRaw: {\n iconRaw:\n clearButtonClassNames?.iconRaw?.iconRaw ??\n autocompleteClearButtonIconRaw(),\n root:\n clearButtonClassNames?.iconRaw?.root ??\n autocompleteClearButtonIconRawRoot(),\n },\n },\n },\n };\n\n const emptyProps = {\n emptyText,\n classNames: {\n empty: emptyClassNames?.empty ?? autocompleteEmpty(),\n },\n };\n\n const creatableProps = {\n creatable: creatable ?? false,\n createText,\n classNames: creatableClassNames,\n };\n\n return (\n <Dropdown\n shouldFilter={false}\n classNames={{\n dropdown: dropdownClassNames?.dropdown ?? autocomplete(),\n root: dropdownClassNames?.root ?? autocompleteRoot(),\n options: dropdownClassNames?.options ?? autocompleteOptions(),\n option: dropdownClassNames?.option ?? autocompleteOption(),\n empty: emptyClassNames?.empty ?? autocompleteEmpty(),\n search: dropdownClassNames?.search,\n }}\n scrollAreaProps={{\n classNames: {\n dropdownScrollAreaAutosize:\n scrollAreaClassNames?.dropdownScrollAreaAutosize ??\n autocompleteScrollAreaAutosize(),\n },\n }}\n target={\n <AutocompleteTarget\n debounced={handleSearch}\n isLoading={isFetching || isTyping}\n threshold={threshold}\n showEmpty={emptyText !== undefined}\n {...targetProps}\n />\n }\n options={data}\n {...props}\n >\n <ComboboxOptions\n emptyProps={emptyProps}\n creatableProps={creatableProps}\n />\n </Dropdown>\n );\n};\n"],"mappings":"k/BA0DA,MAAa,GAAgB,CAC3B,OACA,QACA,WACA,eACA,WACA,cACA,QACA,cACA,YACA,MACA,UACA,QAAQ,GACR,WAAW,IACX,YAAY,EACZ,kBACA,aACA,YAAY,oBACZ,aACA,GAAG,KACoB,CACvB,GAAM,CAAC,EAAa,GAAkB,EAAS,EAAM,CAC/C,CAAC,EAAU,GAAe,EAAS,GAAM,CAEzC,CAAE,OAAM,cAAe,EAA0B,CACrD,SAAU,CAAC,EAAM,EAAK,EAAY,CAClC,YACS,EAAQ,CACb,MACA,MAAO,EACR,CAAC,CAEJ,YAAa,EAAE,CACf,QAAS,EAAY,QAAU,EAChC,CAAC,CAEI,EAAY,EAAsB,GAAkB,CACxD,EAAe,EAAM,CACrB,EAAY,GAAM,EACjB,EAAS,CAEN,EAAgB,GAAkB,CACtC,EAAY,GAAK,CACjB,EAAU,EAAM,EAGZ,CACJ,UAAW,EACX,MAAO,EACP,OAAQ,GACR,WAAY,GACZ,GAAG,GACD,GAAc,EAAE,CAEd,CAAE,YAAa,EAAuB,GAAG,GAC7C,IAAoB,EAAE,CAElB,GAAc,CAClB,cACA,QACA,WACA,eACA,WACA,cACA,QACA,WAAY,CACV,kBACE,GAAsB,mBAAqB,IAAuB,CACpE,KAAM,GAAsB,MAAQ,GAA2B,CAC/D,MAAO,GAAsB,OAAS,GAA4B,CAClE,YACE,GAAsB,aAAe,IAAkC,CACzE,MAAO,GAAsB,OAAS,GAA4B,CAClE,QAAS,GAAsB,SAAW,GAA8B,CACxE,MAAO,GAAsB,OAAS,GAA4B,CAClE,QAAS,GAAsB,SAAW,GAA8B,CACxE,SACE,GAAsB,UAAY,GAA+B,CACpE,CACD,iBAAkB,CAChB,MAAO,EACP,WAAY,CACV,YACE,GAAuB,aAAe,GAAyB,CACjE,KAAM,GAAuB,MAAQ,GAA6B,CAClE,KAAM,GAAuB,MAAQ,GAA6B,CAClE,QAAS,CACP,QACE,GAAuB,SAAS,SAChC,GAAgC,CAClC,KACE,GAAuB,SAAS,MAChC,IAAoC,CACvC,CACF,CACF,CACF,CAEK,GAAa,CACjB,YACA,WAAY,CACV,MAAO,GAAiB,OAAS,GAAmB,CACrD,CACF,CAEK,GAAiB,CACrB,UAAW,GAAa,GACxB,aACA,WAAY,EACb,CAED,OACE,EAAC,EAAD,CACE,aAAc,GACd,WAAY,CACV,SAAU,GAAoB,UAAY,GAAc,CACxD,KAAM,GAAoB,MAAQ,IAAkB,CACpD,QAAS,GAAoB,SAAW,GAAqB,CAC7D,OAAQ,GAAoB,QAAU,GAAoB,CAC1D,MAAO,GAAiB,OAAS,GAAmB,CACpD,OAAQ,GAAoB,OAC7B,CACD,gBAAiB,CACf,WAAY,CACV,2BACE,IAAsB,4BACtB,IAAgC,CACnC,CACF,CACD,OACE,EAAC,EAAD,CACE,UAAW,EACX,UAAW,GAAc,EACd,YACX,UAAW,IAAc,IAAA,GACzB,GAAI,GACJ,CAAA,CAEJ,QAAS,EACT,GAAI,WAEJ,EAAC,EAAD,CACc,cACI,kBAChB,CAAA,CACO,CAAA"}
|
|
@@ -18,6 +18,7 @@ type ComboboxProps = Omit<DropdownProps, 'classNames' | 'target' | 'children'> &
|
|
|
18
18
|
error?: string;
|
|
19
19
|
required?: boolean;
|
|
20
20
|
autoComplete?: string;
|
|
21
|
+
disabled?: boolean;
|
|
21
22
|
classNames?: DropdownProps['classNames'] & {
|
|
22
23
|
creatable?: ComboboxCreatableOptionProps['classNames'];
|
|
23
24
|
empty?: ComboboxEmptyOptionProps['classNames'];
|
|
@@ -34,6 +35,7 @@ declare const Combobox: ({
|
|
|
34
35
|
placeholder,
|
|
35
36
|
required,
|
|
36
37
|
autoComplete,
|
|
38
|
+
disabled,
|
|
37
39
|
creatable,
|
|
38
40
|
createText,
|
|
39
41
|
clearButtonText,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Combobox.d.mts","names":[],"sources":["../../../../../src/components/controls/dropdown/combobox/Combobox.tsx"],"mappings":";;;;;;;;KAuCY,aAAA,GAAgB,IAAA,CAC1B,aAAA;EAGA,KAAA,GAAQ,SAAA;EACR,WAAA,GAAc,SAAA;EACd,WAAA;EACA,SAAA;EACA,UAAA;EACA,SAAA;EACA,eAAA;EACA,SAAA,GAAY,SAAA;EACZ,KAAA;EACA,QAAA;EACA,YAAA;EACA,UAAA,GAAa,aAAA;IACX,SAAA,GAAY,4BAAA;IACZ,KAAA,GAAQ,wBAAA;IACR,MAAA,GAAS,mBAAA;MACP,WAAA,GAAc,WAAA,CACZ,mBAAA;MAEF,OAAA,GAAU,WAAA,CAAY,mBAAA;IAAA;IAExB,UAAA,GAAa,WAAA,CAAY,aAAA;EAAA;AAAA;AAAA,cAIhB,QAAA;EAAY,KAAA;EAAA,WAAA;EAAA,WAAA;EAAA,QAAA;EAAA,YAAA;EAAA,SAAA;EAAA,UAAA;EAAA,eAAA;EAAA,SAAA;EAAA,SAAA;EAAA,KAAA;EAAA,UAAA;EAAA,GAAA;AAAA,
|
|
1
|
+
{"version":3,"file":"Combobox.d.mts","names":[],"sources":["../../../../../src/components/controls/dropdown/combobox/Combobox.tsx"],"mappings":";;;;;;;;KAuCY,aAAA,GAAgB,IAAA,CAC1B,aAAA;EAGA,KAAA,GAAQ,SAAA;EACR,WAAA,GAAc,SAAA;EACd,WAAA;EACA,SAAA;EACA,UAAA;EACA,SAAA;EACA,eAAA;EACA,SAAA,GAAY,SAAA;EACZ,KAAA;EACA,QAAA;EACA,YAAA;EACA,QAAA;EACA,UAAA,GAAa,aAAA;IACX,SAAA,GAAY,4BAAA;IACZ,KAAA,GAAQ,wBAAA;IACR,MAAA,GAAS,mBAAA;MACP,WAAA,GAAc,WAAA,CACZ,mBAAA;MAEF,OAAA,GAAU,WAAA,CAAY,mBAAA;IAAA;IAExB,UAAA,GAAa,WAAA,CAAY,aAAA;EAAA;AAAA;AAAA,cAIhB,QAAA;EAAY,KAAA;EAAA,WAAA;EAAA,WAAA;EAAA,QAAA;EAAA,YAAA;EAAA,QAAA;EAAA,SAAA;EAAA,UAAA;EAAA,eAAA;EAAA,SAAA;EAAA,SAAA;EAAA,KAAA;EAAA,UAAA;EAAA,GAAA;AAAA,GAetB,aAAA,KAAa,kBAAA,CAAA,GAAA,CAAA,OAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{Dropdown as e}from"../Dropdown.mjs";import{ComboboxOptions as t}from"./ComboboxOptions.mjs";import{ComboboxTarget as n}from"./ComboboxTarget.mjs";import{combobox as r,comboboxChevron as i,comboboxChevronIcon as a,comboboxChevronIconRoot as o,comboboxChevronRoot as s,comboboxClearButton as c,comboboxClearButtonIcon as l,comboboxClearButtonIconRaw as u,comboboxClearButtonIconRawRoot as d,comboboxClearButtonRoot as ee,comboboxEmpty as f,comboboxOption as p,comboboxOptionCreateIcon as m,comboboxOptionCreateIconIconRaw as h,comboboxOptionCreateIconIconRawRoot as g,comboboxOptionCreateIconRoot as _,comboboxOptions as v,comboboxRoot as y,comboboxScrollAreaAutosize as b,comboboxTextInput as x,comboboxTextInputDescription as S,comboboxTextInputError as C,comboboxTextInputInput as w,comboboxTextInputLabel as T,comboboxTextInputRequired as E,comboboxTextInputRoot as D,comboboxTextInputSection as O,comboboxTextInputWrapper as k}from"@mage-ui/styled-system/recipes";import{jsx as A}from"react/jsx-runtime";const j=({label:j,description:M,placeholder:N,required:P,autoComplete:te,
|
|
1
|
+
import{Dropdown as e}from"../Dropdown.mjs";import{ComboboxOptions as t}from"./ComboboxOptions.mjs";import{ComboboxTarget as n}from"./ComboboxTarget.mjs";import{combobox as r,comboboxChevron as i,comboboxChevronIcon as a,comboboxChevronIconRoot as o,comboboxChevronRoot as s,comboboxClearButton as c,comboboxClearButtonIcon as l,comboboxClearButtonIconRaw as u,comboboxClearButtonIconRawRoot as d,comboboxClearButtonRoot as ee,comboboxEmpty as f,comboboxOption as p,comboboxOptionCreateIcon as m,comboboxOptionCreateIconIconRaw as h,comboboxOptionCreateIconIconRawRoot as g,comboboxOptionCreateIconRoot as _,comboboxOptions as v,comboboxRoot as y,comboboxScrollAreaAutosize as b,comboboxTextInput as x,comboboxTextInputDescription as S,comboboxTextInputError as C,comboboxTextInputInput as w,comboboxTextInputLabel as T,comboboxTextInputRequired as E,comboboxTextInputRoot as D,comboboxTextInputSection as O,comboboxTextInputWrapper as k}from"@mage-ui/styled-system/recipes";import{jsx as A}from"react/jsx-runtime";const j=({label:j,description:M,placeholder:N,required:P,autoComplete:te,disabled:F,creatable:I,createText:L,clearButtonText:R,emptyText:z=`No results`,startSlot:B,error:V,classNames:H,...U})=>{let{creatable:W,empty:G,target:K,scrollArea:q,...J}=H||{},{clearButton:Y,chevron:X,...Z}=K||{},Q={placeholder:N,label:j,description:M,required:P,autoComplete:te,disabled:F,error:V,startSlot:B,classNames:{dropdownTextInput:Z?.dropdownTextInput??x(),root:Z?.root??D(),label:Z?.label??T(),description:Z?.description??S(),error:Z?.error??C(),wrapper:Z?.wrapper??k(),input:Z?.input??w(),section:Z?.section??O(),required:Z?.required??E()},clearButtonProps:{label:R,classNames:{clearButton:Y?.clearButton??c(),root:Y?.root??ee(),icon:Y?.icon??l(),iconRaw:{iconRaw:Y?.iconRaw?.iconRaw??u(),root:Y?.iconRaw?.root??d()}}},chevronProps:{classNames:{chevron:X?.chevron??i(),root:X?.root??s(),open:{iconRaw:X?.open?.iconRaw??a(),root:X?.open?.root??o()},close:{iconRaw:X?.close?.iconRaw??a(),root:X?.close?.root??o()}}}},ne=J?.dropdown??r(),re=J?.root??y(),ie=J?.options??v(),ae=J?.option??p(),$=G?.empty??f(),oe=J?.search,se={emptyText:z,classNames:{empty:G?.empty??$}},ce={creatable:I??!1,createText:L,classNames:{create:W?.create,createIcon:{createIcon:W?.createIcon?.createIcon??m(),root:W?.createIcon?.root??_(),iconRaw:{iconRaw:W?.createIcon?.iconRaw?.iconRaw??h(),root:W?.createIcon?.iconRaw?.root??g()}}}};return A(e,{classNames:{dropdown:ne,root:re,options:ie,option:ae,empty:$,search:oe},scrollAreaProps:{classNames:{dropdownScrollAreaAutosize:q?.dropdownScrollAreaAutosize??b()}},target:A(n,{...Q}),...U,children:A(t,{emptyProps:se,creatableProps:ce})})};export{j as Combobox};
|
|
2
2
|
//# sourceMappingURL=Combobox.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Combobox.mjs","names":[],"sources":["../../../../../src/components/controls/dropdown/combobox/Combobox.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport {\n combobox,\n comboboxChevron,\n comboboxChevronIcon,\n comboboxChevronIconRoot,\n comboboxChevronRoot,\n comboboxClearButton,\n comboboxClearButtonIcon,\n comboboxClearButtonIconRaw,\n comboboxClearButtonIconRawRoot,\n comboboxClearButtonRoot,\n comboboxEmpty,\n comboboxOption,\n comboboxOptionCreateIcon,\n comboboxOptionCreateIconIconRaw,\n comboboxOptionCreateIconIconRawRoot,\n comboboxOptionCreateIconRoot,\n comboboxOptions,\n comboboxRoot,\n comboboxScrollAreaAutosize,\n comboboxTextInput,\n comboboxTextInputDescription,\n comboboxTextInputError,\n comboboxTextInputInput,\n comboboxTextInputLabel,\n comboboxTextInputRequired,\n comboboxTextInputRoot,\n comboboxTextInputSection,\n comboboxTextInputWrapper,\n} from '@mage-ui/styled-system/recipes';\n\nimport { Dropdown, type DropdownProps } from '../Dropdown';\nimport type { ComboboxCreatableOptionProps } from './ComboboxCreatableOption';\nimport type { ComboboxEmptyOptionProps } from './ComboboxEmptyOption';\nimport { ComboboxOptions } from './ComboboxOptions';\nimport { ComboboxTarget, type ComboboxTargetProps } from './ComboboxTarget';\n\nexport type ComboboxProps = Omit<\n DropdownProps,\n 'classNames' | 'target' | 'children'\n> & {\n label?: ReactNode;\n description?: ReactNode;\n placeholder?: string;\n creatable?: boolean;\n createText?: string;\n emptyText?: string;\n clearButtonText?: string;\n startSlot?: ReactNode;\n error?: string;\n required?: boolean;\n autoComplete?: string;\n classNames?: DropdownProps['classNames'] & {\n creatable?: ComboboxCreatableOptionProps['classNames'];\n empty?: ComboboxEmptyOptionProps['classNames'];\n target?: ComboboxTargetProps['classNames'] & {\n clearButton?: NonNullable<\n ComboboxTargetProps['clearButtonProps']\n >['classNames'];\n chevron?: NonNullable<ComboboxTargetProps['chevronProps']>['classNames'];\n };\n scrollArea?: NonNullable<DropdownProps['scrollAreaProps']>['classNames'];\n };\n};\n\nexport const Combobox = ({\n label,\n description,\n placeholder,\n required,\n autoComplete,\n creatable,\n createText,\n clearButtonText,\n emptyText = 'No results',\n startSlot,\n error,\n classNames,\n ...props\n}: ComboboxProps) => {\n const {\n creatable: creatableClassNames,\n empty: emptyClassNames,\n target: targetClassNames,\n scrollArea: scrollAreaClassNames,\n ...dropdownClassNames\n } = classNames || {};\n\n const {\n clearButton: clearButtonClassNames,\n chevron: chevronClassNames,\n ...restTargetClassNames\n } = targetClassNames || {};\n\n const targetProps = {\n placeholder,\n label,\n description,\n required,\n autoComplete,\n error,\n startSlot,\n classNames: {\n dropdownTextInput:\n restTargetClassNames?.dropdownTextInput ?? comboboxTextInput(),\n root: restTargetClassNames?.root ?? comboboxTextInputRoot(),\n label: restTargetClassNames?.label ?? comboboxTextInputLabel(),\n description:\n restTargetClassNames?.description ?? comboboxTextInputDescription(),\n error: restTargetClassNames?.error ?? comboboxTextInputError(),\n wrapper: restTargetClassNames?.wrapper ?? comboboxTextInputWrapper(),\n input: restTargetClassNames?.input ?? comboboxTextInputInput(),\n section: restTargetClassNames?.section ?? comboboxTextInputSection(),\n required: restTargetClassNames?.required ?? comboboxTextInputRequired(),\n },\n clearButtonProps: {\n label: clearButtonText,\n classNames: {\n clearButton:\n clearButtonClassNames?.clearButton ?? comboboxClearButton(),\n root: clearButtonClassNames?.root ?? comboboxClearButtonRoot(),\n icon: clearButtonClassNames?.icon ?? comboboxClearButtonIcon(),\n iconRaw: {\n iconRaw:\n clearButtonClassNames?.iconRaw?.iconRaw ??\n comboboxClearButtonIconRaw(),\n root:\n clearButtonClassNames?.iconRaw?.root ??\n comboboxClearButtonIconRawRoot(),\n },\n },\n },\n chevronProps: {\n classNames: {\n chevron: chevronClassNames?.chevron ?? comboboxChevron(),\n root: chevronClassNames?.root ?? comboboxChevronRoot(),\n open: {\n iconRaw: chevronClassNames?.open?.iconRaw ?? comboboxChevronIcon(),\n root: chevronClassNames?.open?.root ?? comboboxChevronIconRoot(),\n },\n close: {\n iconRaw: chevronClassNames?.close?.iconRaw ?? comboboxChevronIcon(),\n root: chevronClassNames?.close?.root ?? comboboxChevronIconRoot(),\n },\n },\n },\n };\n\n const dropdownClassName = dropdownClassNames?.dropdown ?? combobox();\n const rootClassName = dropdownClassNames?.root ?? comboboxRoot();\n const optionsClassName = dropdownClassNames?.options ?? comboboxOptions();\n const optionClassName = dropdownClassNames?.option ?? comboboxOption();\n const emptyClassName = emptyClassNames?.empty ?? comboboxEmpty();\n const searchClassName = dropdownClassNames?.search;\n\n const emptyProps = {\n emptyText,\n classNames: {\n empty: emptyClassNames?.empty ?? emptyClassName,\n },\n };\n\n const creatableProps = {\n creatable: creatable ?? false,\n createText,\n classNames: {\n create: creatableClassNames?.create,\n createIcon: {\n createIcon:\n creatableClassNames?.createIcon?.createIcon ??\n comboboxOptionCreateIcon(),\n root:\n creatableClassNames?.createIcon?.root ??\n comboboxOptionCreateIconRoot(),\n iconRaw: {\n iconRaw:\n creatableClassNames?.createIcon?.iconRaw?.iconRaw ??\n comboboxOptionCreateIconIconRaw(),\n root:\n creatableClassNames?.createIcon?.iconRaw?.root ??\n comboboxOptionCreateIconIconRawRoot(),\n },\n },\n },\n };\n\n return (\n <Dropdown\n classNames={{\n dropdown: dropdownClassName,\n root: rootClassName,\n options: optionsClassName,\n option: optionClassName,\n empty: emptyClassName,\n search: searchClassName,\n }}\n scrollAreaProps={{\n classNames: {\n dropdownScrollAreaAutosize:\n scrollAreaClassNames?.dropdownScrollAreaAutosize ??\n comboboxScrollAreaAutosize(),\n },\n }}\n target={<ComboboxTarget {...targetProps} />}\n {...props}\n >\n <ComboboxOptions\n emptyProps={emptyProps}\n creatableProps={creatableProps}\n />\n </Dropdown>\n );\n};\n"],"mappings":"s/
|
|
1
|
+
{"version":3,"file":"Combobox.mjs","names":[],"sources":["../../../../../src/components/controls/dropdown/combobox/Combobox.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport {\n combobox,\n comboboxChevron,\n comboboxChevronIcon,\n comboboxChevronIconRoot,\n comboboxChevronRoot,\n comboboxClearButton,\n comboboxClearButtonIcon,\n comboboxClearButtonIconRaw,\n comboboxClearButtonIconRawRoot,\n comboboxClearButtonRoot,\n comboboxEmpty,\n comboboxOption,\n comboboxOptionCreateIcon,\n comboboxOptionCreateIconIconRaw,\n comboboxOptionCreateIconIconRawRoot,\n comboboxOptionCreateIconRoot,\n comboboxOptions,\n comboboxRoot,\n comboboxScrollAreaAutosize,\n comboboxTextInput,\n comboboxTextInputDescription,\n comboboxTextInputError,\n comboboxTextInputInput,\n comboboxTextInputLabel,\n comboboxTextInputRequired,\n comboboxTextInputRoot,\n comboboxTextInputSection,\n comboboxTextInputWrapper,\n} from '@mage-ui/styled-system/recipes';\n\nimport { Dropdown, type DropdownProps } from '../Dropdown';\nimport type { ComboboxCreatableOptionProps } from './ComboboxCreatableOption';\nimport type { ComboboxEmptyOptionProps } from './ComboboxEmptyOption';\nimport { ComboboxOptions } from './ComboboxOptions';\nimport { ComboboxTarget, type ComboboxTargetProps } from './ComboboxTarget';\n\nexport type ComboboxProps = Omit<\n DropdownProps,\n 'classNames' | 'target' | 'children'\n> & {\n label?: ReactNode;\n description?: ReactNode;\n placeholder?: string;\n creatable?: boolean;\n createText?: string;\n emptyText?: string;\n clearButtonText?: string;\n startSlot?: ReactNode;\n error?: string;\n required?: boolean;\n autoComplete?: string;\n disabled?: boolean;\n classNames?: DropdownProps['classNames'] & {\n creatable?: ComboboxCreatableOptionProps['classNames'];\n empty?: ComboboxEmptyOptionProps['classNames'];\n target?: ComboboxTargetProps['classNames'] & {\n clearButton?: NonNullable<\n ComboboxTargetProps['clearButtonProps']\n >['classNames'];\n chevron?: NonNullable<ComboboxTargetProps['chevronProps']>['classNames'];\n };\n scrollArea?: NonNullable<DropdownProps['scrollAreaProps']>['classNames'];\n };\n};\n\nexport const Combobox = ({\n label,\n description,\n placeholder,\n required,\n autoComplete,\n disabled,\n creatable,\n createText,\n clearButtonText,\n emptyText = 'No results',\n startSlot,\n error,\n classNames,\n ...props\n}: ComboboxProps) => {\n const {\n creatable: creatableClassNames,\n empty: emptyClassNames,\n target: targetClassNames,\n scrollArea: scrollAreaClassNames,\n ...dropdownClassNames\n } = classNames || {};\n\n const {\n clearButton: clearButtonClassNames,\n chevron: chevronClassNames,\n ...restTargetClassNames\n } = targetClassNames || {};\n\n const targetProps = {\n placeholder,\n label,\n description,\n required,\n autoComplete,\n disabled,\n error,\n startSlot,\n classNames: {\n dropdownTextInput:\n restTargetClassNames?.dropdownTextInput ?? comboboxTextInput(),\n root: restTargetClassNames?.root ?? comboboxTextInputRoot(),\n label: restTargetClassNames?.label ?? comboboxTextInputLabel(),\n description:\n restTargetClassNames?.description ?? comboboxTextInputDescription(),\n error: restTargetClassNames?.error ?? comboboxTextInputError(),\n wrapper: restTargetClassNames?.wrapper ?? comboboxTextInputWrapper(),\n input: restTargetClassNames?.input ?? comboboxTextInputInput(),\n section: restTargetClassNames?.section ?? comboboxTextInputSection(),\n required: restTargetClassNames?.required ?? comboboxTextInputRequired(),\n },\n clearButtonProps: {\n label: clearButtonText,\n classNames: {\n clearButton:\n clearButtonClassNames?.clearButton ?? comboboxClearButton(),\n root: clearButtonClassNames?.root ?? comboboxClearButtonRoot(),\n icon: clearButtonClassNames?.icon ?? comboboxClearButtonIcon(),\n iconRaw: {\n iconRaw:\n clearButtonClassNames?.iconRaw?.iconRaw ??\n comboboxClearButtonIconRaw(),\n root:\n clearButtonClassNames?.iconRaw?.root ??\n comboboxClearButtonIconRawRoot(),\n },\n },\n },\n chevronProps: {\n classNames: {\n chevron: chevronClassNames?.chevron ?? comboboxChevron(),\n root: chevronClassNames?.root ?? comboboxChevronRoot(),\n open: {\n iconRaw: chevronClassNames?.open?.iconRaw ?? comboboxChevronIcon(),\n root: chevronClassNames?.open?.root ?? comboboxChevronIconRoot(),\n },\n close: {\n iconRaw: chevronClassNames?.close?.iconRaw ?? comboboxChevronIcon(),\n root: chevronClassNames?.close?.root ?? comboboxChevronIconRoot(),\n },\n },\n },\n };\n\n const dropdownClassName = dropdownClassNames?.dropdown ?? combobox();\n const rootClassName = dropdownClassNames?.root ?? comboboxRoot();\n const optionsClassName = dropdownClassNames?.options ?? comboboxOptions();\n const optionClassName = dropdownClassNames?.option ?? comboboxOption();\n const emptyClassName = emptyClassNames?.empty ?? comboboxEmpty();\n const searchClassName = dropdownClassNames?.search;\n\n const emptyProps = {\n emptyText,\n classNames: {\n empty: emptyClassNames?.empty ?? emptyClassName,\n },\n };\n\n const creatableProps = {\n creatable: creatable ?? false,\n createText,\n classNames: {\n create: creatableClassNames?.create,\n createIcon: {\n createIcon:\n creatableClassNames?.createIcon?.createIcon ??\n comboboxOptionCreateIcon(),\n root:\n creatableClassNames?.createIcon?.root ??\n comboboxOptionCreateIconRoot(),\n iconRaw: {\n iconRaw:\n creatableClassNames?.createIcon?.iconRaw?.iconRaw ??\n comboboxOptionCreateIconIconRaw(),\n root:\n creatableClassNames?.createIcon?.iconRaw?.root ??\n comboboxOptionCreateIconIconRawRoot(),\n },\n },\n },\n };\n\n return (\n <Dropdown\n classNames={{\n dropdown: dropdownClassName,\n root: rootClassName,\n options: optionsClassName,\n option: optionClassName,\n empty: emptyClassName,\n search: searchClassName,\n }}\n scrollAreaProps={{\n classNames: {\n dropdownScrollAreaAutosize:\n scrollAreaClassNames?.dropdownScrollAreaAutosize ??\n comboboxScrollAreaAutosize(),\n },\n }}\n target={<ComboboxTarget {...targetProps} />}\n {...props}\n >\n <ComboboxOptions\n emptyProps={emptyProps}\n creatableProps={creatableProps}\n />\n </Dropdown>\n );\n};\n"],"mappings":"s/BAoEA,MAAa,GAAY,CACvB,QACA,cACA,cACA,WACA,gBACA,WACA,YACA,aACA,kBACA,YAAY,aACZ,YACA,QACA,aACA,GAAG,KACgB,CACnB,GAAM,CACJ,UAAW,EACX,MAAO,EACP,OAAQ,EACR,WAAY,EACZ,GAAG,GACD,GAAc,EAAE,CAEd,CACJ,YAAa,EACb,QAAS,EACT,GAAG,GACD,GAAoB,EAAE,CAEpB,EAAc,CAClB,cACA,QACA,cACA,WACA,gBACA,WACA,QACA,YACA,WAAY,CACV,kBACE,GAAsB,mBAAqB,GAAmB,CAChE,KAAM,GAAsB,MAAQ,GAAuB,CAC3D,MAAO,GAAsB,OAAS,GAAwB,CAC9D,YACE,GAAsB,aAAe,GAA8B,CACrE,MAAO,GAAsB,OAAS,GAAwB,CAC9D,QAAS,GAAsB,SAAW,GAA0B,CACpE,MAAO,GAAsB,OAAS,GAAwB,CAC9D,QAAS,GAAsB,SAAW,GAA0B,CACpE,SAAU,GAAsB,UAAY,GAA2B,CACxE,CACD,iBAAkB,CAChB,MAAO,EACP,WAAY,CACV,YACE,GAAuB,aAAe,GAAqB,CAC7D,KAAM,GAAuB,MAAQ,IAAyB,CAC9D,KAAM,GAAuB,MAAQ,GAAyB,CAC9D,QAAS,CACP,QACE,GAAuB,SAAS,SAChC,GAA4B,CAC9B,KACE,GAAuB,SAAS,MAChC,GAAgC,CACnC,CACF,CACF,CACD,aAAc,CACZ,WAAY,CACV,QAAS,GAAmB,SAAW,GAAiB,CACxD,KAAM,GAAmB,MAAQ,GAAqB,CACtD,KAAM,CACJ,QAAS,GAAmB,MAAM,SAAW,GAAqB,CAClE,KAAM,GAAmB,MAAM,MAAQ,GAAyB,CACjE,CACD,MAAO,CACL,QAAS,GAAmB,OAAO,SAAW,GAAqB,CACnE,KAAM,GAAmB,OAAO,MAAQ,GAAyB,CAClE,CACF,CACF,CACF,CAEK,GAAoB,GAAoB,UAAY,GAAU,CAC9D,GAAgB,GAAoB,MAAQ,GAAc,CAC1D,GAAmB,GAAoB,SAAW,GAAiB,CACnE,GAAkB,GAAoB,QAAU,GAAgB,CAChE,EAAiB,GAAiB,OAAS,GAAe,CAC1D,GAAkB,GAAoB,OAEtC,GAAa,CACjB,YACA,WAAY,CACV,MAAO,GAAiB,OAAS,EAClC,CACF,CAEK,GAAiB,CACrB,UAAW,GAAa,GACxB,aACA,WAAY,CACV,OAAQ,GAAqB,OAC7B,WAAY,CACV,WACE,GAAqB,YAAY,YACjC,GAA0B,CAC5B,KACE,GAAqB,YAAY,MACjC,GAA8B,CAChC,QAAS,CACP,QACE,GAAqB,YAAY,SAAS,SAC1C,GAAiC,CACnC,KACE,GAAqB,YAAY,SAAS,MAC1C,GAAqC,CACxC,CACF,CACF,CACF,CAED,OACE,EAAC,EAAD,CACE,WAAY,CACV,SAAU,GACV,KAAM,GACN,QAAS,GACT,OAAQ,GACR,MAAO,EACP,OAAQ,GACT,CACD,gBAAiB,CACf,WAAY,CACV,2BACE,GAAsB,4BACtB,GAA4B,CAC/B,CACF,CACD,OAAQ,EAAC,EAAD,CAAgB,GAAI,EAAe,CAAA,CAC3C,GAAI,WAEJ,EAAC,EAAD,CACc,cACI,kBAChB,CAAA,CACO,CAAA"}
|
|
@@ -20,6 +20,7 @@ type SelectProps = Omit<DropdownProps, 'children' | 'classNames' | 'target'> & {
|
|
|
20
20
|
error?: string;
|
|
21
21
|
required?: boolean;
|
|
22
22
|
autoComplete?: string;
|
|
23
|
+
disabled?: boolean;
|
|
23
24
|
classNames?: DropdownProps['classNames'] & {
|
|
24
25
|
target?: ComboboxTargetProps['classNames'] & {
|
|
25
26
|
clearButton?: NonNullable<ComboboxTargetProps['clearButtonProps']>['classNames'];
|
|
@@ -34,6 +35,7 @@ declare const Select: ({
|
|
|
34
35
|
placeholder,
|
|
35
36
|
required,
|
|
36
37
|
autoComplete,
|
|
38
|
+
disabled,
|
|
37
39
|
clearable,
|
|
38
40
|
clearButtonText,
|
|
39
41
|
emptyText,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Select.d.mts","names":[],"sources":["../../../../../src/components/controls/dropdown/select/Select.tsx"],"mappings":";;;;;;;KAsCY,WAAA,GAAc,IAAA,CACxB,aAAA;EAGA,KAAA,GAAQ,SAAA;EACR,WAAA,GAAc,SAAA;EACd,WAAA;EACA,SAAA;EACA,eAAA;EACA,SAAA;EACA,UAAA;EACA,iBAAA;EACA,eAAA,GAAkB,SAAA;EAClB,gBAAA,GAAmB,sBAAA;EACnB,SAAA,GAAY,SAAA;EACZ,KAAA;EACA,QAAA;EACA,YAAA;EACA,UAAA,GAAa,aAAA;IACX,MAAA,GAAS,mBAAA;MACP,WAAA,GAAc,WAAA,CACZ,mBAAA;MAEF,OAAA,GAAU,WAAA,CAAY,mBAAA;IAAA;IAExB,UAAA,GAAa,WAAA,CAAY,aAAA;EAAA;AAAA;AAAA,cAIhB,MAAA;EAAU,KAAA;EAAA,WAAA;EAAA,WAAA;EAAA,QAAA;EAAA,YAAA;EAAA,SAAA;EAAA,eAAA;EAAA,SAAA;EAAA,UAAA;EAAA,iBAAA;EAAA,eAAA;EAAA,gBAAA;EAAA,SAAA;EAAA,KAAA;EAAA,UAAA;EAAA,GAAA;AAAA,
|
|
1
|
+
{"version":3,"file":"Select.d.mts","names":[],"sources":["../../../../../src/components/controls/dropdown/select/Select.tsx"],"mappings":";;;;;;;KAsCY,WAAA,GAAc,IAAA,CACxB,aAAA;EAGA,KAAA,GAAQ,SAAA;EACR,WAAA,GAAc,SAAA;EACd,WAAA;EACA,SAAA;EACA,eAAA;EACA,SAAA;EACA,UAAA;EACA,iBAAA;EACA,eAAA,GAAkB,SAAA;EAClB,gBAAA,GAAmB,sBAAA;EACnB,SAAA,GAAY,SAAA;EACZ,KAAA;EACA,QAAA;EACA,YAAA;EACA,QAAA;EACA,UAAA,GAAa,aAAA;IACX,MAAA,GAAS,mBAAA;MACP,WAAA,GAAc,WAAA,CACZ,mBAAA;MAEF,OAAA,GAAU,WAAA,CAAY,mBAAA;IAAA;IAExB,UAAA,GAAa,WAAA,CAAY,aAAA;EAAA;AAAA;AAAA,cAIhB,MAAA;EAAU,KAAA;EAAA,WAAA;EAAA,WAAA;EAAA,QAAA;EAAA,YAAA;EAAA,QAAA;EAAA,SAAA;EAAA,eAAA;EAAA,SAAA;EAAA,UAAA;EAAA,iBAAA;EAAA,eAAA;EAAA,gBAAA;EAAA,SAAA;EAAA,KAAA;EAAA,UAAA;EAAA,GAAA;AAAA,GAkBpB,WAAA,KAAW,kBAAA,CAAA,GAAA,CAAA,OAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{Dropdown as e}from"../Dropdown.mjs";import{ComboboxOptions as t}from"../combobox/ComboboxOptions.mjs";import{ComboboxTarget as ee}from"../combobox/ComboboxTarget.mjs";import{SelectSearch as n}from"./SelectSearch.mjs";import{select as r,selectChevron as i,selectChevronIcon as a,selectChevronIconRoot as o,selectChevronRoot as s,selectClearButton as c,selectClearButtonIcon as l,selectClearButtonIconRaw as u,selectClearButtonIconRawRoot as d,selectClearButtonRoot as f,selectEmpty as p,selectOption as m,selectOptions as h,selectRoot as g,selectScrollAreaAutosize as _,selectSearchInput as v,selectSearchSection as y,selectSearchWrapper as b,selectTextInput as x,selectTextInputDescription as S,selectTextInputError as C,selectTextInputInput as w,selectTextInputLabel as T,selectTextInputRequired as E,selectTextInputRoot as D,selectTextInputSection as O,selectTextInputWrapper as k}from"@mage-ui/styled-system/recipes";import{jsx as A}from"react/jsx-runtime";const j=({label:j,description:M,placeholder:N,required:P,autoComplete:F,clearable:
|
|
1
|
+
import{Dropdown as e}from"../Dropdown.mjs";import{ComboboxOptions as t}from"../combobox/ComboboxOptions.mjs";import{ComboboxTarget as ee}from"../combobox/ComboboxTarget.mjs";import{SelectSearch as n}from"./SelectSearch.mjs";import{select as r,selectChevron as i,selectChevronIcon as a,selectChevronIconRoot as o,selectChevronRoot as s,selectClearButton as c,selectClearButtonIcon as l,selectClearButtonIconRaw as u,selectClearButtonIconRawRoot as d,selectClearButtonRoot as f,selectEmpty as p,selectOption as m,selectOptions as h,selectRoot as g,selectScrollAreaAutosize as _,selectSearchInput as v,selectSearchSection as y,selectSearchWrapper as b,selectTextInput as x,selectTextInputDescription as S,selectTextInputError as C,selectTextInputInput as w,selectTextInputLabel as T,selectTextInputRequired as E,selectTextInputRoot as D,selectTextInputSection as O,selectTextInputWrapper as k}from"@mage-ui/styled-system/recipes";import{jsx as A}from"react/jsx-runtime";const j=({label:j,description:M,placeholder:N,required:P,autoComplete:F,disabled:I,clearable:L=!1,clearButtonText:R,emptyText:z,searchable:B,searchPlaceholder:V,searchStartSlot:H,searchClassNames:U,startSlot:W,error:G,classNames:K,...q})=>{let{target:J,scrollArea:Y,...X}=K||{},{clearButton:Z,chevron:Q,...$}=J||{},te=z??(B?`No results`:void 0),ne={placeholder:N,label:j,description:M,required:P,autoComplete:F,disabled:I,error:G,clearable:L,readOnly:!0,closeOnBlur:!B,startSlot:W,displayQuery:!1,classNames:{dropdownTextInput:$?.dropdownTextInput??x(),root:$?.root??D(),label:$?.label??T(),description:$?.description??S(),error:$?.error??C(),wrapper:$?.wrapper??k(),input:$?.input??w(),section:$?.section??O(),required:$?.required??E()},clearButtonProps:{label:R,classNames:{clearButton:Z?.clearButton??c(),root:Z?.root??f(),icon:Z?.icon??l(),iconRaw:{iconRaw:Z?.iconRaw?.iconRaw??u(),root:Z?.iconRaw?.root??d()}}},chevronProps:{classNames:{chevron:Q?.chevron??i(),root:Q?.root??s(),open:{iconRaw:Q?.open?.iconRaw??a(),root:Q?.open?.root??o()},close:{iconRaw:Q?.close?.iconRaw??a(),root:Q?.close?.root??o()}}}};return A(e,{"data-searchable":B,classNames:{dropdown:X?.dropdown??r(),root:X?.root??g(),options:X?.options??h(),option:X?.option??m(),empty:X?.empty??p(),search:X?.search},scrollAreaProps:{classNames:{dropdownScrollAreaAutosize:Y?.dropdownScrollAreaAutosize??_()}},target:A(ee,{...ne}),dropdownTopSlot:B&&A(n,{searchPlaceholder:V,startSlot:H,classNames:{input:U?.input??v(),wrapper:U?.wrapper??b(),section:U?.section??y()}}),...q,children:A(t,{emptyProps:{emptyText:te,classNames:{empty:X?.empty??p()}},creatableProps:{creatable:!1}})})};export{j as Select};
|
|
2
2
|
//# sourceMappingURL=Select.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Select.mjs","names":[],"sources":["../../../../../src/components/controls/dropdown/select/Select.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport {\n select,\n selectChevron,\n selectChevronIcon,\n selectChevronIconRoot,\n selectChevronRoot,\n selectClearButton,\n selectClearButtonIcon,\n selectClearButtonIconRaw,\n selectClearButtonIconRawRoot,\n selectClearButtonRoot,\n selectEmpty,\n selectOption,\n selectOptions,\n selectRoot,\n selectScrollAreaAutosize,\n selectSearchInput,\n selectSearchSection,\n selectSearchWrapper,\n selectTextInput,\n selectTextInputDescription,\n selectTextInputError,\n selectTextInputInput,\n selectTextInputLabel,\n selectTextInputRequired,\n selectTextInputRoot,\n selectTextInputSection,\n selectTextInputWrapper,\n} from '@mage-ui/styled-system/recipes';\n\nimport { ComboboxOptions } from '../combobox/ComboboxOptions';\nimport type { ComboboxTargetProps } from '../combobox/ComboboxTarget';\nimport { ComboboxTarget } from '../combobox/ComboboxTarget';\nimport { Dropdown, type DropdownProps } from '../Dropdown';\nimport { SelectSearch, type SelectSearchClassNames } from './SelectSearch';\n\nexport type SelectProps = Omit<\n DropdownProps,\n 'children' | 'classNames' | 'target'\n> & {\n label?: ReactNode;\n description?: ReactNode;\n placeholder?: string;\n clearable?: boolean;\n clearButtonText?: string;\n emptyText?: string;\n searchable?: boolean;\n searchPlaceholder?: string;\n searchStartSlot?: ReactNode;\n searchClassNames?: SelectSearchClassNames;\n startSlot?: ReactNode;\n error?: string;\n required?: boolean;\n autoComplete?: string;\n classNames?: DropdownProps['classNames'] & {\n target?: ComboboxTargetProps['classNames'] & {\n clearButton?: NonNullable<\n ComboboxTargetProps['clearButtonProps']\n >['classNames'];\n chevron?: NonNullable<ComboboxTargetProps['chevronProps']>['classNames'];\n };\n scrollArea?: NonNullable<DropdownProps['scrollAreaProps']>['classNames'];\n };\n};\n\nexport const Select = ({\n label,\n description,\n placeholder,\n required,\n autoComplete,\n clearable = false,\n clearButtonText,\n emptyText,\n searchable,\n searchPlaceholder,\n searchStartSlot,\n searchClassNames,\n startSlot,\n error,\n classNames,\n ...props\n}: SelectProps) => {\n const {\n target: targetClassNames,\n scrollArea: scrollAreaClassNames,\n ...dropdownClassNames\n } = classNames || {};\n\n const {\n clearButton: clearButtonClassNames,\n chevron: chevronClassNames,\n ...restTargetClassNames\n } = targetClassNames || {};\n const resolvedEmptyText =\n emptyText ?? (searchable ? 'No results' : undefined);\n\n const targetProps = {\n placeholder,\n label,\n description,\n required,\n autoComplete,\n error,\n clearable,\n readOnly: true,\n closeOnBlur: !searchable,\n startSlot,\n displayQuery: false,\n classNames: {\n dropdownTextInput:\n restTargetClassNames?.dropdownTextInput ?? selectTextInput(),\n root: restTargetClassNames?.root ?? selectTextInputRoot(),\n label: restTargetClassNames?.label ?? selectTextInputLabel(),\n description:\n restTargetClassNames?.description ?? selectTextInputDescription(),\n error: restTargetClassNames?.error ?? selectTextInputError(),\n wrapper: restTargetClassNames?.wrapper ?? selectTextInputWrapper(),\n input: restTargetClassNames?.input ?? selectTextInputInput(),\n section: restTargetClassNames?.section ?? selectTextInputSection(),\n required: restTargetClassNames?.required ?? selectTextInputRequired(),\n },\n clearButtonProps: {\n label: clearButtonText,\n classNames: {\n clearButton: clearButtonClassNames?.clearButton ?? selectClearButton(),\n root: clearButtonClassNames?.root ?? selectClearButtonRoot(),\n icon: clearButtonClassNames?.icon ?? selectClearButtonIcon(),\n iconRaw: {\n iconRaw:\n clearButtonClassNames?.iconRaw?.iconRaw ??\n selectClearButtonIconRaw(),\n root:\n clearButtonClassNames?.iconRaw?.root ??\n selectClearButtonIconRawRoot(),\n },\n },\n },\n chevronProps: {\n classNames: {\n chevron: chevronClassNames?.chevron ?? selectChevron(),\n root: chevronClassNames?.root ?? selectChevronRoot(),\n open: {\n iconRaw: chevronClassNames?.open?.iconRaw ?? selectChevronIcon(),\n root: chevronClassNames?.open?.root ?? selectChevronIconRoot(),\n },\n close: {\n iconRaw: chevronClassNames?.close?.iconRaw ?? selectChevronIcon(),\n root: chevronClassNames?.close?.root ?? selectChevronIconRoot(),\n },\n },\n },\n };\n\n return (\n <Dropdown\n data-searchable={searchable}\n classNames={{\n dropdown: dropdownClassNames?.dropdown ?? select(),\n root: dropdownClassNames?.root ?? selectRoot(),\n options: dropdownClassNames?.options ?? selectOptions(),\n option: dropdownClassNames?.option ?? selectOption(),\n empty: dropdownClassNames?.empty ?? selectEmpty(),\n search: dropdownClassNames?.search,\n }}\n scrollAreaProps={{\n classNames: {\n dropdownScrollAreaAutosize:\n scrollAreaClassNames?.dropdownScrollAreaAutosize ??\n selectScrollAreaAutosize(),\n },\n }}\n target={<ComboboxTarget {...targetProps} />}\n dropdownTopSlot={\n searchable && (\n <SelectSearch\n searchPlaceholder={searchPlaceholder}\n startSlot={searchStartSlot}\n classNames={{\n input: searchClassNames?.input ?? selectSearchInput(),\n wrapper: searchClassNames?.wrapper ?? selectSearchWrapper(),\n section: searchClassNames?.section ?? selectSearchSection(),\n }}\n />\n )\n }\n {...props}\n >\n <ComboboxOptions\n emptyProps={{\n emptyText: resolvedEmptyText,\n classNames: {\n empty: dropdownClassNames?.empty ?? selectEmpty(),\n },\n }}\n creatableProps={{\n creatable: false,\n }}\n />\n </Dropdown>\n );\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Select.mjs","names":[],"sources":["../../../../../src/components/controls/dropdown/select/Select.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport {\n select,\n selectChevron,\n selectChevronIcon,\n selectChevronIconRoot,\n selectChevronRoot,\n selectClearButton,\n selectClearButtonIcon,\n selectClearButtonIconRaw,\n selectClearButtonIconRawRoot,\n selectClearButtonRoot,\n selectEmpty,\n selectOption,\n selectOptions,\n selectRoot,\n selectScrollAreaAutosize,\n selectSearchInput,\n selectSearchSection,\n selectSearchWrapper,\n selectTextInput,\n selectTextInputDescription,\n selectTextInputError,\n selectTextInputInput,\n selectTextInputLabel,\n selectTextInputRequired,\n selectTextInputRoot,\n selectTextInputSection,\n selectTextInputWrapper,\n} from '@mage-ui/styled-system/recipes';\n\nimport { ComboboxOptions } from '../combobox/ComboboxOptions';\nimport type { ComboboxTargetProps } from '../combobox/ComboboxTarget';\nimport { ComboboxTarget } from '../combobox/ComboboxTarget';\nimport { Dropdown, type DropdownProps } from '../Dropdown';\nimport { SelectSearch, type SelectSearchClassNames } from './SelectSearch';\n\nexport type SelectProps = Omit<\n DropdownProps,\n 'children' | 'classNames' | 'target'\n> & {\n label?: ReactNode;\n description?: ReactNode;\n placeholder?: string;\n clearable?: boolean;\n clearButtonText?: string;\n emptyText?: string;\n searchable?: boolean;\n searchPlaceholder?: string;\n searchStartSlot?: ReactNode;\n searchClassNames?: SelectSearchClassNames;\n startSlot?: ReactNode;\n error?: string;\n required?: boolean;\n autoComplete?: string;\n disabled?: boolean;\n classNames?: DropdownProps['classNames'] & {\n target?: ComboboxTargetProps['classNames'] & {\n clearButton?: NonNullable<\n ComboboxTargetProps['clearButtonProps']\n >['classNames'];\n chevron?: NonNullable<ComboboxTargetProps['chevronProps']>['classNames'];\n };\n scrollArea?: NonNullable<DropdownProps['scrollAreaProps']>['classNames'];\n };\n};\n\nexport const Select = ({\n label,\n description,\n placeholder,\n required,\n autoComplete,\n disabled,\n clearable = false,\n clearButtonText,\n emptyText,\n searchable,\n searchPlaceholder,\n searchStartSlot,\n searchClassNames,\n startSlot,\n error,\n classNames,\n ...props\n}: SelectProps) => {\n const {\n target: targetClassNames,\n scrollArea: scrollAreaClassNames,\n ...dropdownClassNames\n } = classNames || {};\n\n const {\n clearButton: clearButtonClassNames,\n chevron: chevronClassNames,\n ...restTargetClassNames\n } = targetClassNames || {};\n const resolvedEmptyText =\n emptyText ?? (searchable ? 'No results' : undefined);\n\n const targetProps = {\n placeholder,\n label,\n description,\n required,\n autoComplete,\n disabled,\n error,\n clearable,\n readOnly: true,\n closeOnBlur: !searchable,\n startSlot,\n displayQuery: false,\n classNames: {\n dropdownTextInput:\n restTargetClassNames?.dropdownTextInput ?? selectTextInput(),\n root: restTargetClassNames?.root ?? selectTextInputRoot(),\n label: restTargetClassNames?.label ?? selectTextInputLabel(),\n description:\n restTargetClassNames?.description ?? selectTextInputDescription(),\n error: restTargetClassNames?.error ?? selectTextInputError(),\n wrapper: restTargetClassNames?.wrapper ?? selectTextInputWrapper(),\n input: restTargetClassNames?.input ?? selectTextInputInput(),\n section: restTargetClassNames?.section ?? selectTextInputSection(),\n required: restTargetClassNames?.required ?? selectTextInputRequired(),\n },\n clearButtonProps: {\n label: clearButtonText,\n classNames: {\n clearButton: clearButtonClassNames?.clearButton ?? selectClearButton(),\n root: clearButtonClassNames?.root ?? selectClearButtonRoot(),\n icon: clearButtonClassNames?.icon ?? selectClearButtonIcon(),\n iconRaw: {\n iconRaw:\n clearButtonClassNames?.iconRaw?.iconRaw ??\n selectClearButtonIconRaw(),\n root:\n clearButtonClassNames?.iconRaw?.root ??\n selectClearButtonIconRawRoot(),\n },\n },\n },\n chevronProps: {\n classNames: {\n chevron: chevronClassNames?.chevron ?? selectChevron(),\n root: chevronClassNames?.root ?? selectChevronRoot(),\n open: {\n iconRaw: chevronClassNames?.open?.iconRaw ?? selectChevronIcon(),\n root: chevronClassNames?.open?.root ?? selectChevronIconRoot(),\n },\n close: {\n iconRaw: chevronClassNames?.close?.iconRaw ?? selectChevronIcon(),\n root: chevronClassNames?.close?.root ?? selectChevronIconRoot(),\n },\n },\n },\n };\n\n return (\n <Dropdown\n data-searchable={searchable}\n classNames={{\n dropdown: dropdownClassNames?.dropdown ?? select(),\n root: dropdownClassNames?.root ?? selectRoot(),\n options: dropdownClassNames?.options ?? selectOptions(),\n option: dropdownClassNames?.option ?? selectOption(),\n empty: dropdownClassNames?.empty ?? selectEmpty(),\n search: dropdownClassNames?.search,\n }}\n scrollAreaProps={{\n classNames: {\n dropdownScrollAreaAutosize:\n scrollAreaClassNames?.dropdownScrollAreaAutosize ??\n selectScrollAreaAutosize(),\n },\n }}\n target={<ComboboxTarget {...targetProps} />}\n dropdownTopSlot={\n searchable && (\n <SelectSearch\n searchPlaceholder={searchPlaceholder}\n startSlot={searchStartSlot}\n classNames={{\n input: searchClassNames?.input ?? selectSearchInput(),\n wrapper: searchClassNames?.wrapper ?? selectSearchWrapper(),\n section: searchClassNames?.section ?? selectSearchSection(),\n }}\n />\n )\n }\n {...props}\n >\n <ComboboxOptions\n emptyProps={{\n emptyText: resolvedEmptyText,\n classNames: {\n empty: dropdownClassNames?.empty ?? selectEmpty(),\n },\n }}\n creatableProps={{\n creatable: false,\n }}\n />\n </Dropdown>\n );\n};\n"],"mappings":"u8BAoEA,MAAa,GAAU,CACrB,QACA,cACA,cACA,WACA,eACA,WACA,YAAY,GACZ,kBACA,YACA,aACA,oBACA,kBACA,mBACA,YACA,QACA,aACA,GAAG,KACc,CACjB,GAAM,CACJ,OAAQ,EACR,WAAY,EACZ,GAAG,GACD,GAAc,EAAE,CAEd,CACJ,YAAa,EACb,QAAS,EACT,GAAG,GACD,GAAoB,EAAE,CACpB,GACJ,IAAc,EAAa,aAAe,IAAA,IAEtC,GAAc,CAClB,cACA,QACA,cACA,WACA,eACA,WACA,QACA,YACA,SAAU,GACV,YAAa,CAAC,EACd,YACA,aAAc,GACd,WAAY,CACV,kBACE,GAAsB,mBAAqB,GAAiB,CAC9D,KAAM,GAAsB,MAAQ,GAAqB,CACzD,MAAO,GAAsB,OAAS,GAAsB,CAC5D,YACE,GAAsB,aAAe,GAA4B,CACnE,MAAO,GAAsB,OAAS,GAAsB,CAC5D,QAAS,GAAsB,SAAW,GAAwB,CAClE,MAAO,GAAsB,OAAS,GAAsB,CAC5D,QAAS,GAAsB,SAAW,GAAwB,CAClE,SAAU,GAAsB,UAAY,GAAyB,CACtE,CACD,iBAAkB,CAChB,MAAO,EACP,WAAY,CACV,YAAa,GAAuB,aAAe,GAAmB,CACtE,KAAM,GAAuB,MAAQ,GAAuB,CAC5D,KAAM,GAAuB,MAAQ,GAAuB,CAC5D,QAAS,CACP,QACE,GAAuB,SAAS,SAChC,GAA0B,CAC5B,KACE,GAAuB,SAAS,MAChC,GAA8B,CACjC,CACF,CACF,CACD,aAAc,CACZ,WAAY,CACV,QAAS,GAAmB,SAAW,GAAe,CACtD,KAAM,GAAmB,MAAQ,GAAmB,CACpD,KAAM,CACJ,QAAS,GAAmB,MAAM,SAAW,GAAmB,CAChE,KAAM,GAAmB,MAAM,MAAQ,GAAuB,CAC/D,CACD,MAAO,CACL,QAAS,GAAmB,OAAO,SAAW,GAAmB,CACjE,KAAM,GAAmB,OAAO,MAAQ,GAAuB,CAChE,CACF,CACF,CACF,CAED,OACE,EAAC,EAAD,CACE,kBAAiB,EACjB,WAAY,CACV,SAAU,GAAoB,UAAY,GAAQ,CAClD,KAAM,GAAoB,MAAQ,GAAY,CAC9C,QAAS,GAAoB,SAAW,GAAe,CACvD,OAAQ,GAAoB,QAAU,GAAc,CACpD,MAAO,GAAoB,OAAS,GAAa,CACjD,OAAQ,GAAoB,OAC7B,CACD,gBAAiB,CACf,WAAY,CACV,2BACE,GAAsB,4BACtB,GAA0B,CAC7B,CACF,CACD,OAAQ,EAAC,GAAD,CAAgB,GAAI,GAAe,CAAA,CAC3C,gBACE,GACE,EAAC,EAAD,CACqB,oBACnB,UAAW,EACX,WAAY,CACV,MAAO,GAAkB,OAAS,GAAmB,CACrD,QAAS,GAAkB,SAAW,GAAqB,CAC3D,QAAS,GAAkB,SAAW,GAAqB,CAC5D,CACD,CAAA,CAGN,GAAI,WAEJ,EAAC,EAAD,CACE,WAAY,CACV,UAAW,GACX,WAAY,CACV,MAAO,GAAoB,OAAS,GAAa,CAClD,CACF,CACD,eAAgB,CACd,UAAW,GACZ,CACD,CAAA,CACO,CAAA"}
|
|
@@ -9,12 +9,14 @@ type DropzoneProps = Omit<DropzoneBaseProps, 'children' | 'classNames'> & {
|
|
|
9
9
|
label?: ReactNode;
|
|
10
10
|
description?: ReactNode;
|
|
11
11
|
error?: ReactNode;
|
|
12
|
+
required?: boolean;
|
|
12
13
|
fileListHeight?: number | string;
|
|
13
14
|
classNames?: {
|
|
14
15
|
dropzone?: string;
|
|
15
16
|
root?: string;
|
|
16
17
|
labelWrapper?: string;
|
|
17
18
|
label?: string;
|
|
19
|
+
required?: string;
|
|
18
20
|
description?: string;
|
|
19
21
|
error?: string;
|
|
20
22
|
uploadedFiles?: string;
|
|
@@ -29,6 +31,7 @@ declare const Dropzone: ({
|
|
|
29
31
|
label,
|
|
30
32
|
description,
|
|
31
33
|
error,
|
|
34
|
+
required,
|
|
32
35
|
fileListHeight: _fileListHeight,
|
|
33
36
|
classNames,
|
|
34
37
|
inputId,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dropzone.d.mts","names":[],"sources":["../../../../src/components/controls/dropzone/Dropzone.tsx"],"mappings":";;;;;;
|
|
1
|
+
{"version":3,"file":"Dropzone.d.mts","names":[],"sources":["../../../../src/components/controls/dropzone/Dropzone.tsx"],"mappings":";;;;;;KA2BY,aAAA,GAAgB,IAAA,CAC1B,iBAAA;EAGA,QAAA,GAAW,SAAA,GAAY,iBAAA;EACvB,KAAA,GAAQ,SAAA;EACR,WAAA,GAAc,SAAA;EACd,KAAA,GAAQ,SAAA;EACR,QAAA;EACA,cAAA;EACA,UAAA;IACE,QAAA;IACA,IAAA;IACA,YAAA;IACA,KAAA;IACA,QAAA;IACA,WAAA;IACA,KAAA;IACA,aAAA;IACA,iBAAA;IACA,qBAAA;IACA,YAAA,GAAe,iBAAA;IACf,gBAAA,GAAmB,iBAAA;EAAA;AAAA;AAAA,cAMV,QAAA;EAAY,QAAA;EAAA,KAAA;EAAA,WAAA;EAAA,KAAA;EAAA,QAAA;EAAA,cAAA,EAAA,eAAA;EAAA,UAAA;EAAA,OAAA;EAAA,SAAA;EAAA,GAAA;AAAA,GAWtB,aAAA,KAAa,kBAAA,CAAA,GAAA,CAAA,OAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{UploadedFiles as e}from"../../data-display/uploaded-files/UploadedFiles.mjs";import{DropzoneBase as t}from"./DropzoneBase.mjs";import{cx as n}from"@mage-ui/styled-system/css";import{dropzone as r,dropzoneDescription as i,dropzoneDropzone as a,dropzoneError as o,dropzoneLabel as s,dropzoneLabelWrapper as c,
|
|
1
|
+
import{UploadedFiles as e}from"../../data-display/uploaded-files/UploadedFiles.mjs";import{DropzoneBase as t}from"./DropzoneBase.mjs";import{cx as n}from"@mage-ui/styled-system/css";import{dropzone as r,dropzoneDescription as i,dropzoneDropzone as a,dropzoneError as o,dropzoneLabel as s,dropzoneLabelWrapper as c,dropzoneRequired as l,dropzoneRoot as u,dropzoneUploadedFile as d,dropzoneUploadedFiles as f,dropzoneUploadedFilesListItem as p}from"@mage-ui/styled-system/recipes";import{jsx as m,jsxs as h}from"react/jsx-runtime";import{useId as g}from"react";const _=({children:_,label:v,description:y,error:b,required:x,fileListHeight:S,classNames:C,inputId:w,direction:T=`default`,...E})=>{let D=g(),O=w??D;return h(`div`,{className:n(C?.dropzone??r(),C?.root??u()),"data-error":b?`true`:void 0,children:[(v||y)&&h(`div`,{className:C?.labelWrapper??c(),children:[v&&h(`label`,{htmlFor:O,className:C?.label??s(),children:[v,x&&m(`span`,{"aria-hidden":`true`,className:C?.required??l(),children:` *`})]}),y&&m(`p`,{className:C?.description??i(),children:y})]}),m(t,{...E,inputId:O,direction:T,classNames:{...C?.dropzoneDropzone??{},dropzoneBase:C?.dropzoneDropzone?.dropzoneBase??a()},children:({files:t,isUploading:n,removeFile:r})=>_===void 0?Object.keys(t).length>0?m(e,{classNames:{uploadedFiles:C?.uploadedFiles??f(),root:C?.uploadedFilesRoot},children:Object.values(t).map(t=>m(e.Item,{fileName:t.name,fileType:t.type,fileSize:`${(t.size/1024).toFixed(1)} KB`,fileDate:t.date,url:t.url,onRemove:()=>r(t.id),classNames:{listItem:C?.uploadedFilesListItem??p(),uploadedFile:{...C?.uploadedFile,uploadedFile:C?.uploadedFile?.uploadedFile??d()}}},t.id))}):null:typeof _==`function`?_({files:t,isUploading:n,removeFile:r}):_}),b&&m(`p`,{className:C?.error??o(),children:b})]})};export{_ as Dropzone};
|
|
2
2
|
//# sourceMappingURL=Dropzone.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dropzone.mjs","names":[],"sources":["../../../../src/components/controls/dropzone/Dropzone.tsx"],"sourcesContent":["import { type ReactNode, useId } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n dropzone,\n dropzoneDescription,\n dropzoneDropzone,\n dropzoneError,\n dropzoneLabel,\n dropzoneLabelWrapper,\n dropzoneRoot,\n dropzoneUploadedFile,\n dropzoneUploadedFiles,\n dropzoneUploadedFilesListItem,\n} from '@mage-ui/styled-system/recipes';\nimport {\n type UploadedFileProps,\n UploadedFiles,\n} from '@/components/data-display';\n\nimport {\n DropzoneBase,\n type DropzoneBaseProps,\n type FileData,\n} from './DropzoneBase';\n\nexport type DropzoneProps = Omit<\n DropzoneBaseProps,\n 'children' | 'classNames'\n> & {\n children?: ReactNode | DropzoneBaseProps['children'];\n label?: ReactNode;\n description?: ReactNode;\n error?: ReactNode;\n fileListHeight?: number | string;\n classNames?: {\n dropzone?: string;\n root?: string;\n labelWrapper?: string;\n label?: string;\n description?: string;\n error?: string;\n uploadedFiles?: string;\n uploadedFilesRoot?: string;\n uploadedFilesListItem?: string;\n uploadedFile?: UploadedFileProps['classNames'];\n dropzoneDropzone?: DropzoneBaseProps['classNames'];\n };\n};\n\nexport type { FileData };\n\nexport const Dropzone = ({\n children,\n label,\n description,\n error,\n fileListHeight: _fileListHeight,\n classNames,\n inputId,\n direction = 'default',\n ...baseProps\n}: DropzoneProps) => {\n const generatedId = useId();\n const groupId = inputId ?? generatedId;\n\n return (\n <div\n className={cx(\n classNames?.dropzone ?? dropzone(),\n classNames?.root ?? dropzoneRoot(),\n )}\n >\n {(label || description) && (\n <div className={classNames?.labelWrapper ?? dropzoneLabelWrapper()}>\n {label && (\n <label\n htmlFor={groupId}\n className={classNames?.label ?? dropzoneLabel()}\n >\n {label}\n </label>\n )}\n {description && (\n <p className={classNames?.description ?? dropzoneDescription()}>\n {description}\n </p>\n )}\n </div>\n )}\n <DropzoneBase\n {...baseProps}\n inputId={groupId}\n direction={direction}\n classNames={{\n ...(classNames?.dropzoneDropzone ?? {}),\n dropzoneBase:\n classNames?.dropzoneDropzone?.dropzoneBase ?? dropzoneDropzone(),\n }}\n >\n {({ files, isUploading, removeFile }) => {\n if (children !== undefined) {\n return typeof children === 'function'\n ? children({ files, isUploading, removeFile })\n : children;\n }\n return Object.keys(files).length > 0 ? (\n <UploadedFiles\n classNames={{\n uploadedFiles:\n classNames?.uploadedFiles ?? dropzoneUploadedFiles(),\n root: classNames?.uploadedFilesRoot,\n }}\n >\n {Object.values(files).map((file) => (\n <UploadedFiles.Item\n key={file.id}\n fileName={file.name}\n fileType={file.type}\n fileSize={`${(file.size / 1024).toFixed(1)} KB`}\n fileDate={file.date}\n url={file.url}\n onRemove={() => removeFile(file.id)}\n classNames={{\n listItem:\n classNames?.uploadedFilesListItem ??\n dropzoneUploadedFilesListItem(),\n uploadedFile: {\n ...classNames?.uploadedFile,\n uploadedFile:\n classNames?.uploadedFile?.uploadedFile ??\n dropzoneUploadedFile(),\n },\n }}\n />\n ))}\n </UploadedFiles>\n ) : null;\n }}\n </DropzoneBase>\n {error && <p className={classNames?.error ?? dropzoneError()}>{error}</p>}\n </div>\n );\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Dropzone.mjs","names":[],"sources":["../../../../src/components/controls/dropzone/Dropzone.tsx"],"sourcesContent":["import { type ReactNode, useId } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n dropzone,\n dropzoneDescription,\n dropzoneDropzone,\n dropzoneError,\n dropzoneLabel,\n dropzoneLabelWrapper,\n dropzoneRequired,\n dropzoneRoot,\n dropzoneUploadedFile,\n dropzoneUploadedFiles,\n dropzoneUploadedFilesListItem,\n} from '@mage-ui/styled-system/recipes';\nimport {\n type UploadedFileProps,\n UploadedFiles,\n} from '@/components/data-display';\n\nimport {\n DropzoneBase,\n type DropzoneBaseProps,\n type FileData,\n} from './DropzoneBase';\n\nexport type DropzoneProps = Omit<\n DropzoneBaseProps,\n 'children' | 'classNames'\n> & {\n children?: ReactNode | DropzoneBaseProps['children'];\n label?: ReactNode;\n description?: ReactNode;\n error?: ReactNode;\n required?: boolean;\n fileListHeight?: number | string;\n classNames?: {\n dropzone?: string;\n root?: string;\n labelWrapper?: string;\n label?: string;\n required?: string;\n description?: string;\n error?: string;\n uploadedFiles?: string;\n uploadedFilesRoot?: string;\n uploadedFilesListItem?: string;\n uploadedFile?: UploadedFileProps['classNames'];\n dropzoneDropzone?: DropzoneBaseProps['classNames'];\n };\n};\n\nexport type { FileData };\n\nexport const Dropzone = ({\n children,\n label,\n description,\n error,\n required,\n fileListHeight: _fileListHeight,\n classNames,\n inputId,\n direction = 'default',\n ...baseProps\n}: DropzoneProps) => {\n const generatedId = useId();\n const groupId = inputId ?? generatedId;\n\n return (\n <div\n className={cx(\n classNames?.dropzone ?? dropzone(),\n classNames?.root ?? dropzoneRoot(),\n )}\n data-error={error ? 'true' : undefined}\n >\n {(label || description) && (\n <div className={classNames?.labelWrapper ?? dropzoneLabelWrapper()}>\n {label && (\n <label\n htmlFor={groupId}\n className={classNames?.label ?? dropzoneLabel()}\n >\n {label}\n {required && (\n <span\n aria-hidden='true'\n className={classNames?.required ?? dropzoneRequired()}\n >\n {' *'}\n </span>\n )}\n </label>\n )}\n {description && (\n <p className={classNames?.description ?? dropzoneDescription()}>\n {description}\n </p>\n )}\n </div>\n )}\n <DropzoneBase\n {...baseProps}\n inputId={groupId}\n direction={direction}\n classNames={{\n ...(classNames?.dropzoneDropzone ?? {}),\n dropzoneBase:\n classNames?.dropzoneDropzone?.dropzoneBase ?? dropzoneDropzone(),\n }}\n >\n {({ files, isUploading, removeFile }) => {\n if (children !== undefined) {\n return typeof children === 'function'\n ? children({ files, isUploading, removeFile })\n : children;\n }\n return Object.keys(files).length > 0 ? (\n <UploadedFiles\n classNames={{\n uploadedFiles:\n classNames?.uploadedFiles ?? dropzoneUploadedFiles(),\n root: classNames?.uploadedFilesRoot,\n }}\n >\n {Object.values(files).map((file) => (\n <UploadedFiles.Item\n key={file.id}\n fileName={file.name}\n fileType={file.type}\n fileSize={`${(file.size / 1024).toFixed(1)} KB`}\n fileDate={file.date}\n url={file.url}\n onRemove={() => removeFile(file.id)}\n classNames={{\n listItem:\n classNames?.uploadedFilesListItem ??\n dropzoneUploadedFilesListItem(),\n uploadedFile: {\n ...classNames?.uploadedFile,\n uploadedFile:\n classNames?.uploadedFile?.uploadedFile ??\n dropzoneUploadedFile(),\n },\n }}\n />\n ))}\n </UploadedFiles>\n ) : null;\n }}\n </DropzoneBase>\n {error && <p className={classNames?.error ?? dropzoneError()}>{error}</p>}\n </div>\n );\n};\n"],"mappings":"+iBAuDA,MAAa,GAAY,CACvB,WACA,QACA,cACA,QACA,WACA,eAAgB,EAChB,aACA,UACA,YAAY,UACZ,GAAG,KACgB,CACnB,IAAM,EAAc,GAAO,CACrB,EAAU,GAAW,EAE3B,OACE,EAAC,MAAD,CACE,UAAW,EACT,GAAY,UAAY,GAAU,CAClC,GAAY,MAAQ,GAAc,CACnC,CACD,aAAY,EAAQ,OAAS,IAAA,YAL/B,EAOI,GAAS,IACT,EAAC,MAAD,CAAK,UAAW,GAAY,cAAgB,GAAsB,UAAlE,CACG,GACC,EAAC,QAAD,CACE,QAAS,EACT,UAAW,GAAY,OAAS,GAAe,UAFjD,CAIG,EACA,GACC,EAAC,OAAD,CACE,cAAY,OACZ,UAAW,GAAY,UAAY,GAAkB,UAEpD,KACI,CAAA,CAEH,GAET,GACC,EAAC,IAAD,CAAG,UAAW,GAAY,aAAe,GAAqB,UAC3D,EACC,CAAA,CAEF,GAER,EAAC,EAAD,CACE,GAAI,EACJ,QAAS,EACE,YACX,WAAY,CACV,GAAI,GAAY,kBAAoB,EAAE,CACtC,aACE,GAAY,kBAAkB,cAAgB,GAAkB,CACnE,WAEC,CAAE,QAAO,cAAa,gBAClB,IAAa,IAAA,GAKV,OAAO,KAAK,EAAM,CAAC,OAAS,EACjC,EAAC,EAAD,CACE,WAAY,CACV,cACE,GAAY,eAAiB,GAAuB,CACtD,KAAM,GAAY,kBACnB,UAEA,OAAO,OAAO,EAAM,CAAC,IAAK,GACzB,EAAC,EAAc,KAAf,CAEE,SAAU,EAAK,KACf,SAAU,EAAK,KACf,SAAU,IAAI,EAAK,KAAO,MAAM,QAAQ,EAAE,CAAC,KAC3C,SAAU,EAAK,KACf,IAAK,EAAK,IACV,aAAgB,EAAW,EAAK,GAAG,CACnC,WAAY,CACV,SACE,GAAY,uBACZ,GAA+B,CACjC,aAAc,CACZ,GAAG,GAAY,aACf,aACE,GAAY,cAAc,cAC1B,GAAsB,CACzB,CACF,CACD,CAlBK,EAAK,GAkBV,CACF,CACY,CAAA,CACd,KAnCK,OAAO,GAAa,WACvB,EAAS,CAAE,QAAO,cAAa,aAAY,CAAC,CAC5C,EAmCK,CAAA,CACd,GAAS,EAAC,IAAD,CAAG,UAAW,GAAY,OAAS,GAAe,UAAG,EAAU,CAAA,CACrE"}
|
|
@@ -67,6 +67,7 @@ type DropzoneBaseProps = {
|
|
|
67
67
|
inputId?: string;
|
|
68
68
|
onFileUploaded?: (file: FileData) => void; /** Called when a file is about to be removed. Use to trigger server-side deletion. Fire-and-forget — errors are swallowed. */
|
|
69
69
|
onRemoveFile?: (file: FileData) => void | Promise<void>;
|
|
70
|
+
disabled?: boolean;
|
|
70
71
|
hideWhenFull?: boolean;
|
|
71
72
|
classNames?: {
|
|
72
73
|
dropzoneBase?: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropzoneBase.d.mts","names":[],"sources":["../../../../src/components/controls/dropzone/DropzoneBase.tsx"],"mappings":";;;;;;KAkCY,QAAA;EACV,EAAA;EACA,IAAA;EACA,IAAA;EACA,IAAA;EACA,IAAA;EACA,QAAA;EACA,OAAA;EACA,GAAA;EACA,KAAA;EACA,KAAA;EACA,QAAA;AAAA;AAAA,KAGU,iBAAA;EACV,QAAA;IACE,KAAA;IACA,WAAA;IACA;EAAA;IAEA,KAAA,EAAO,MAAA,SAAe,QAAA;IACtB,WAAA;IACA,UAAA,GAAa,EAAA;EAAA,MACT,SAAA;EACN,YAAA,GAAe,MAAA,SAAe,QAAA;EAC9B,QAAA;EAXU;;;;;EAiBV,GAAA;EAXwB;;;;;EAiBxB,QAAA,GAAW,QAAA,EAMQ;EAJnB,QAAA,YAMU;EAJV,OAAA,WAoBQ;EAlBR,QAAA,IAAY,KAAA,EAAO,IAAA;EACnB,IAAA,GAAO,MAAA;EACP,OAAA,GAAU,MAAA;EAsBY;;;;;;;;;;;;;;EAPtB,MAAA,cAAoB,MAAA;EACpB,KAAA,GAAQ,SAAA;EACR,QAAA,GAAW,SAAA;EACX,IAAA,GAAO,SAAA;EACP,OAAA;EACA,cAAA,IAAkB,IAAA,EAAM,QAAA,WAzCxB;EA2CA,YAAA,IAAgB,IAAA,EAAM,QAAA,YAAoB,OAAA;EAC1C,YAAA;EACA,UAAA;IACE,YAAA;IACA,IAAA;IACA,KAAA;MACE,IAAA;MACA,KAAA;IAAA;IAEF,QAAA;IACA,YAAA,GAAe,SAAA;IACf,MAAA,GAAS,eAAA;IACT,QAAA;IACA,KAAA;IACA,QAAA;IACA,IAAA;EAAA;EAEF,SAAA;AAAA"}
|
|
1
|
+
{"version":3,"file":"DropzoneBase.d.mts","names":[],"sources":["../../../../src/components/controls/dropzone/DropzoneBase.tsx"],"mappings":";;;;;;KAkCY,QAAA;EACV,EAAA;EACA,IAAA;EACA,IAAA;EACA,IAAA;EACA,IAAA;EACA,QAAA;EACA,OAAA;EACA,GAAA;EACA,KAAA;EACA,KAAA;EACA,QAAA;AAAA;AAAA,KAGU,iBAAA;EACV,QAAA;IACE,KAAA;IACA,WAAA;IACA;EAAA;IAEA,KAAA,EAAO,MAAA,SAAe,QAAA;IACtB,WAAA;IACA,UAAA,GAAa,EAAA;EAAA,MACT,SAAA;EACN,YAAA,GAAe,MAAA,SAAe,QAAA;EAC9B,QAAA;EAXU;;;;;EAiBV,GAAA;EAXwB;;;;;EAiBxB,QAAA,GAAW,QAAA,EAMQ;EAJnB,QAAA,YAMU;EAJV,OAAA,WAoBQ;EAlBR,QAAA,IAAY,KAAA,EAAO,IAAA;EACnB,IAAA,GAAO,MAAA;EACP,OAAA,GAAU,MAAA;EAsBY;;;;;;;;;;;;;;EAPtB,MAAA,cAAoB,MAAA;EACpB,KAAA,GAAQ,SAAA;EACR,QAAA,GAAW,SAAA;EACX,IAAA,GAAO,SAAA;EACP,OAAA;EACA,cAAA,IAAkB,IAAA,EAAM,QAAA,WAzCxB;EA2CA,YAAA,IAAgB,IAAA,EAAM,QAAA,YAAoB,OAAA;EAC1C,QAAA;EACA,YAAA;EACA,UAAA;IACE,YAAA;IACA,IAAA;IACA,KAAA;MACE,IAAA;MACA,KAAA;IAAA;IAEF,QAAA;IACA,YAAA,GAAe,SAAA;IACf,MAAA,GAAS,eAAA;IACT,QAAA;IACA,KAAA;IACA,QAAA;IACA,IAAA;EAAA;EAEF,SAAA;AAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{Icon as e}from"../../data-display/icons/icon/Icon.mjs";import{LoaderOval as t}from"../../data-display/loader-oval/LoaderOval.mjs";import{useDropzoneState as n}from"./use-dropzone-state.mjs";import{cx as r}from"@mage-ui/styled-system/css";import{dropzoneBase as i,dropzoneBaseHint as a,dropzoneBaseIcon as o,dropzoneBaseIconSlot as s,dropzoneBaseInput as c,dropzoneBaseInputInner as l,dropzoneBaseLoader as u,dropzoneBaseLoaderRoot as d,dropzoneBaseRoot as f,dropzoneBaseSubtitle as p,dropzoneBaseTextSlot as m,dropzoneBaseTitle as h}from"@mage-ui/styled-system/recipes";import{Fragment as g,jsx as _,jsxs as v}from"react/jsx-runtime";import{useCallback as y,useRef as b}from"react";import{Dropzone as x}from"@mantine/dropzone";const S=({data:S,headers:C,children:w,initialFiles:T={},maxFiles:E,url:D,uploader:O,autoSend:k=!0,maxSize:A,onChange:j,accept:M,title:N,subtitle:P,hint:F,inputId:I,onFileUploaded:L,onRemoveFile:R,
|
|
1
|
+
import{Icon as e}from"../../data-display/icons/icon/Icon.mjs";import{LoaderOval as t}from"../../data-display/loader-oval/LoaderOval.mjs";import{useDropzoneState as n}from"./use-dropzone-state.mjs";import{cx as r}from"@mage-ui/styled-system/css";import{dropzoneBase as i,dropzoneBaseHint as a,dropzoneBaseIcon as o,dropzoneBaseIconSlot as s,dropzoneBaseInput as c,dropzoneBaseInputInner as l,dropzoneBaseLoader as u,dropzoneBaseLoaderRoot as d,dropzoneBaseRoot as f,dropzoneBaseSubtitle as p,dropzoneBaseTextSlot as m,dropzoneBaseTitle as h}from"@mage-ui/styled-system/recipes";import{Fragment as g,jsx as _,jsxs as v}from"react/jsx-runtime";import{useCallback as y,useRef as b}from"react";import{Dropzone as x}from"@mantine/dropzone";const S=({data:S,headers:C,children:w,initialFiles:T={},maxFiles:E,url:D,uploader:O,autoSend:k=!0,maxSize:A,onChange:j,accept:M,title:N,subtitle:P,hint:F,inputId:I,onFileUploaded:L,onRemoveFile:R,disabled:z=!1,classNames:B,direction:V=`default`,hideWhenFull:H=!1})=>{let U=b(null),W=b(new Map),{files:G,isUploading:K,uploadMultipleFiles:q,addFile:J,removeFile:Y}=n(D,T,L,C,O),X=b(G);X.current=G;let Z=y(e=>{if(R){let t=X.current[e];t&&Promise.resolve(R(t)).catch(console.error)}Y(e),W.current.delete(e),!k&&j&&j(Array.from(W.current.values()))},[Y,k,j,R]),Q=y(async e=>{let t=Object.keys(G).length,n=(E??1/0)-t;if(n<=0)return;let r=e.slice(0,n);if(k)await q(r,S);else{for(let e of r){let t=J(e);W.current.set(t,e)}j?.(Array.from(W.current.values()))}},[k,q,J,S,G,E,j]),$=E!==void 0&&Object.keys(G).length>=E;return v(`div`,{className:r(B?.dropzoneBase??i(),B?.root??f()),"data-direction":V,children:[(!H||!$)&&v(x,{ref:U,onDrop:Q,disabled:z||$,loading:K,accept:M,maxSize:A,preventDropOnDocument:!0,inputProps:{id:I},classNames:{root:B?.input?.root??r(c(),`group`),inner:B?.input?.inner??l()},children:[_(`div`,{className:B?.iconSlot??s(),children:K?_(t,{classNames:{loader:B?.loader?.loader??u(),root:B?.loader?.root??d()}}):v(g,{children:[_(x.Idle,{children:_(e,{name:`mage-dropzone-upload-01`,path:`/icons/sprite-mage.svg`,classNames:{icon:B?.dropzoneIcon?.icon??o()}})}),_(x.Accept,{children:_(e,{name:`mage-dropzone-thumbs-up`,path:`/icons/sprite-mage.svg`,classNames:{icon:B?.dropzoneIcon?.icon??o()}})}),_(x.Reject,{children:_(e,{name:`mage-dropzone-thumbs-down`,path:`/icons/sprite-mage.svg`,classNames:{icon:B?.dropzoneIcon?.icon??o()}})})]})}),v(`div`,{className:B?.textSlot??m(),children:[_(`span`,{className:B?.title??h(),children:N||`Upload files`}),_(`span`,{className:B?.subtitle??p(),children:P||`Drag images here or click to select files`}),_(`span`,{className:B?.hint??a(),children:F||`Attach as many files as you like, each file should not exceed 5mb`})]})]}),w({files:G,isUploading:K,removeFile:Z})]})};export{S as DropzoneBase};
|
|
2
2
|
//# sourceMappingURL=DropzoneBase.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropzoneBase.mjs","names":["MantineDropzone"],"sources":["../../../../src/components/controls/dropzone/DropzoneBase.tsx"],"sourcesContent":["import { type ReactNode, useCallback, useRef } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n dropzoneBase,\n dropzoneBaseHint,\n dropzoneBaseIcon,\n dropzoneBaseIconSlot,\n dropzoneBaseInput,\n dropzoneBaseInputInner,\n dropzoneBaseLoader,\n dropzoneBaseLoaderRoot,\n dropzoneBaseRoot,\n dropzoneBaseSubtitle,\n dropzoneBaseTextSlot,\n dropzoneBaseTitle,\n} from '@mage-ui/styled-system/recipes';\nimport { Dropzone as MantineDropzone } from '@mantine/dropzone';\nimport {\n Icon,\n type IconProps,\n LoaderOval,\n type LoaderOvalProps,\n} from '@/components/data-display';\n\nimport type {\n Uploader,\n UploadProgress,\n UploadResponse,\n} from './upload-service';\nimport { useDropzoneState } from './use-dropzone-state';\n\nexport type { Uploader, UploadProgress, UploadResponse };\n\nexport type FileData = {\n id: string;\n name: string;\n size: number;\n type: string;\n date: string;\n uploaded: boolean;\n loading: boolean;\n url: string;\n token?: string;\n error?: string;\n progress?: number; // (0-100)\n};\n\nexport type DropzoneBaseProps = {\n children: ({\n files,\n isUploading,\n removeFile,\n }: {\n files: Record<string, FileData>;\n isUploading: boolean;\n removeFile: (id: string) => void;\n }) => ReactNode;\n initialFiles?: Record<string, FileData>;\n maxFiles?: number;\n /**\n * Endpoint used by the built-in FormData uploader. Required when\n * `autoSend=true` (default) AND no custom `uploader` is provided.\n * Ignored if `uploader` is provided.\n */\n url?: string;\n /**\n * Custom upload function that replaces the built-in FormData POST.\n * Use it for multi-step flows (e.g. presigned S3) or any non-standard\n * transport. When set, the `url` prop is ignored.\n */\n uploader?: Uploader;\n /** When false, files are added to state but not uploaded automatically. Default: true. */\n autoSend?: boolean;\n /** Maximum file size in bytes. Files exceeding this will be rejected. */\n maxSize?: number;\n /** Called when the file list changes (added or removed). Useful when autoSend=false. */\n onChange?: (files: File[]) => void;\n data?: Record<string, unknown>;\n headers?: Record<string, string>;\n /**\n * Files the dropzone accepts. Forwarded directly to Mantine's\n * `<Dropzone accept>`.\n *\n * Two formats are supported:\n * - **Map (preferred)**: `{ [mimeType]: ['.ext', ...] }` — matches\n * the native `react-dropzone` shape and produces a correct\n * `<input accept>` with MIME + extension pairs. Required when any\n * key would otherwise be a bare extension string.\n * - **Array**: `string[]` of MIME types (no `.ext` entries) — kept\n * for backward compatibility. Mixing `.ext` strings into the\n * array triggers a `Skipped \"...\" because it is not a valid MIME\n * type` warning from `react-dropzone` v15+.\n */\n accept?: string[] | Record<string, string[]>;\n title?: ReactNode;\n subtitle?: ReactNode;\n hint?: ReactNode;\n inputId?: string;\n onFileUploaded?: (file: FileData) => void;\n /** Called when a file is about to be removed. Use to trigger server-side deletion. Fire-and-forget — errors are swallowed. */\n onRemoveFile?: (file: FileData) => void | Promise<void>;\n hideWhenFull?: boolean;\n classNames?: {\n dropzoneBase?: string;\n root?: string;\n input?: {\n root?: string;\n inner?: string;\n };\n iconSlot?: string;\n dropzoneIcon?: IconProps['classNames'];\n loader?: LoaderOvalProps['classNames'];\n textSlot?: string;\n title?: string;\n subtitle?: string;\n hint?: string;\n };\n direction?: 'default' | 'reverse';\n};\n\nexport const DropzoneBase = ({\n data,\n headers,\n children,\n initialFiles = {},\n maxFiles,\n url,\n uploader,\n autoSend = true,\n maxSize,\n onChange,\n accept,\n title,\n subtitle,\n hint,\n inputId,\n onFileUploaded,\n onRemoveFile,\n classNames,\n direction = 'default',\n hideWhenFull = false,\n}: DropzoneBaseProps) => {\n const dropzoneRef = useRef<HTMLDivElement>(null);\n const rawFilesRef = useRef<Map<string, File>>(new Map());\n const {\n files,\n isUploading,\n uploadMultipleFiles,\n addFile,\n removeFile: hookRemoveFile,\n } = useDropzoneState(url, initialFiles, onFileUploaded, headers, uploader);\n\n const filesRef = useRef<Record<string, FileData>>(files);\n filesRef.current = files;\n\n const removeFile = useCallback(\n (id: string) => {\n if (onRemoveFile) {\n const fileData = filesRef.current[id];\n if (fileData) {\n Promise.resolve(onRemoveFile(fileData)).catch(console.error);\n }\n }\n hookRemoveFile(id);\n rawFilesRef.current.delete(id);\n if (!autoSend && onChange) {\n onChange(Array.from(rawFilesRef.current.values()));\n }\n },\n [hookRemoveFile, autoSend, onChange, onRemoveFile],\n );\n\n const handleDrop = useCallback(\n async (acceptedFiles: File[]) => {\n const currentCount = Object.keys(files).length;\n const max = maxFiles ?? Number.POSITIVE_INFINITY;\n const remainingSlots = max - currentCount;\n if (remainingSlots <= 0) {\n return;\n }\n const filesToProcess = acceptedFiles.slice(0, remainingSlots);\n if (autoSend) {\n await uploadMultipleFiles(filesToProcess, data);\n } else {\n for (const file of filesToProcess) {\n const id = addFile(file);\n rawFilesRef.current.set(id, file);\n }\n onChange?.(Array.from(rawFilesRef.current.values()));\n }\n },\n [autoSend, uploadMultipleFiles, addFile, data, files, maxFiles, onChange],\n );\n\n const isFull =\n maxFiles !== undefined && Object.keys(files).length >= maxFiles;\n\n return (\n <div\n className={cx(\n classNames?.dropzoneBase ?? dropzoneBase(),\n classNames?.root ?? dropzoneBaseRoot(),\n )}\n data-direction={direction}\n >\n {(!hideWhenFull || !isFull) && (\n <MantineDropzone\n ref={dropzoneRef}\n onDrop={handleDrop}\n disabled={isFull}\n loading={isUploading}\n accept={accept}\n maxSize={maxSize}\n preventDropOnDocument\n inputProps={{ id: inputId }}\n classNames={{\n root: classNames?.input?.root ?? cx(dropzoneBaseInput(), 'group'),\n inner: classNames?.input?.inner ?? dropzoneBaseInputInner(),\n }}\n >\n <div className={classNames?.iconSlot ?? dropzoneBaseIconSlot()}>\n {isUploading ? (\n <LoaderOval\n classNames={{\n loader: classNames?.loader?.loader ?? dropzoneBaseLoader(),\n root: classNames?.loader?.root ?? dropzoneBaseLoaderRoot(),\n }}\n />\n ) : (\n <>\n <MantineDropzone.Idle>\n <Icon\n name='mage-dropzone-upload-01'\n path='/icons/sprite-mage.svg'\n classNames={{\n icon:\n classNames?.dropzoneIcon?.icon ?? dropzoneBaseIcon(),\n }}\n />\n </MantineDropzone.Idle>\n <MantineDropzone.Accept>\n <Icon\n name='mage-dropzone-thumbs-up'\n path='/icons/sprite-mage.svg'\n classNames={{\n icon:\n classNames?.dropzoneIcon?.icon ?? dropzoneBaseIcon(),\n }}\n />\n </MantineDropzone.Accept>\n <MantineDropzone.Reject>\n <Icon\n name='mage-dropzone-thumbs-down'\n path='/icons/sprite-mage.svg'\n classNames={{\n icon:\n classNames?.dropzoneIcon?.icon ?? dropzoneBaseIcon(),\n }}\n />\n </MantineDropzone.Reject>\n </>\n )}\n </div>\n <div className={classNames?.textSlot ?? dropzoneBaseTextSlot()}>\n <span className={classNames?.title ?? dropzoneBaseTitle()}>\n {title || 'Upload files'}\n </span>\n <span className={classNames?.subtitle ?? dropzoneBaseSubtitle()}>\n {subtitle || 'Drag images here or click to select files'}\n </span>\n <span className={classNames?.hint ?? dropzoneBaseHint()}>\n {hint ||\n 'Attach as many files as you like, each file should not exceed 5mb'}\n </span>\n </div>\n </MantineDropzone>\n )}\n {children({ files, isUploading, removeFile })}\n </div>\n );\n};\n"],"mappings":"8tBAyHA,MAAa,GAAgB,CAC3B,OACA,UACA,WACA,eAAe,EAAE,CACjB,WACA,MACA,WACA,WAAW,GACX,UACA,WACA,SACA,QACA,WACA,OACA,UACA,iBACA,eACA,aACA,YAAY,UACZ,eAAe,MACQ,CACvB,IAAM,EAAc,EAAuB,KAAK,CAC1C,EAAc,EAA0B,IAAI,IAAM,CAClD,CACJ,QACA,cACA,sBACA,UACA,WAAY,GACV,EAAiB,EAAK,EAAc,EAAgB,EAAS,EAAS,CAEpE,EAAW,EAAiC,EAAM,CACxD,EAAS,QAAU,EAEnB,IAAM,EAAa,EAChB,GAAe,CACd,GAAI,EAAc,CAChB,IAAM,EAAW,EAAS,QAAQ,GAC9B,GACF,QAAQ,QAAQ,EAAa,EAAS,CAAC,CAAC,MAAM,QAAQ,MAAM,CAGhE,EAAe,EAAG,CAClB,EAAY,QAAQ,OAAO,EAAG,CAC1B,CAAC,GAAY,GACf,EAAS,MAAM,KAAK,EAAY,QAAQ,QAAQ,CAAC,CAAC,EAGtD,CAAC,EAAgB,EAAU,EAAU,EAAa,CACnD,CAEK,EAAa,EACjB,KAAO,IAA0B,CAC/B,IAAM,EAAe,OAAO,KAAK,EAAM,CAAC,OAElC,GADM,GAAY,KACK,EAC7B,GAAI,GAAkB,EACpB,OAEF,IAAM,EAAiB,EAAc,MAAM,EAAG,EAAe,CAC7D,GAAI,EACF,MAAM,EAAoB,EAAgB,EAAK,KAC1C,CACL,IAAK,IAAM,KAAQ,EAAgB,CACjC,IAAM,EAAK,EAAQ,EAAK,CACxB,EAAY,QAAQ,IAAI,EAAI,EAAK,CAEnC,IAAW,MAAM,KAAK,EAAY,QAAQ,QAAQ,CAAC,CAAC,GAGxD,CAAC,EAAU,EAAqB,EAAS,EAAM,EAAO,EAAU,EAAS,CAC1E,CAEK,EACJ,IAAa,IAAA,IAAa,OAAO,KAAK,EAAM,CAAC,QAAU,EAEzD,OACE,EAAC,MAAD,CACE,UAAW,EACT,GAAY,cAAgB,GAAc,CAC1C,GAAY,MAAQ,GAAkB,CACvC,CACD,iBAAgB,WALlB,EAOI,CAAC,GAAgB,CAAC,IAClB,EAACA,EAAD,CACE,IAAK,EACL,OAAQ,EACR,SAAU,EACV,QAAS,EACD,SACC,UACT,sBAAA,GACA,WAAY,CAAE,GAAI,EAAS,CAC3B,WAAY,CACV,KAAM,GAAY,OAAO,MAAQ,EAAG,GAAmB,CAAE,QAAQ,CACjE,MAAO,GAAY,OAAO,OAAS,GAAwB,CAC5D,UAZH,CAcE,EAAC,MAAD,CAAK,UAAW,GAAY,UAAY,GAAsB,UAC3D,EACC,EAAC,EAAD,CACE,WAAY,CACV,OAAQ,GAAY,QAAQ,QAAU,GAAoB,CAC1D,KAAM,GAAY,QAAQ,MAAQ,GAAwB,CAC3D,CACD,CAAA,CAEF,EAAA,EAAA,CAAA,SAAA,CACE,EAACA,EAAgB,KAAjB,CAAA,SACE,EAAC,EAAD,CACE,KAAK,0BACL,KAAK,yBACL,WAAY,CACV,KACE,GAAY,cAAc,MAAQ,GAAkB,CACvD,CACD,CAAA,CACmB,CAAA,CACvB,EAACA,EAAgB,OAAjB,CAAA,SACE,EAAC,EAAD,CACE,KAAK,0BACL,KAAK,yBACL,WAAY,CACV,KACE,GAAY,cAAc,MAAQ,GAAkB,CACvD,CACD,CAAA,CACqB,CAAA,CACzB,EAACA,EAAgB,OAAjB,CAAA,SACE,EAAC,EAAD,CACE,KAAK,4BACL,KAAK,yBACL,WAAY,CACV,KACE,GAAY,cAAc,MAAQ,GAAkB,CACvD,CACD,CAAA,CACqB,CAAA,CACxB,CAAA,CAAA,CAED,CAAA,CACN,EAAC,MAAD,CAAK,UAAW,GAAY,UAAY,GAAsB,UAA9D,CACE,EAAC,OAAD,CAAM,UAAW,GAAY,OAAS,GAAmB,UACtD,GAAS,eACL,CAAA,CACP,EAAC,OAAD,CAAM,UAAW,GAAY,UAAY,GAAsB,UAC5D,GAAY,4CACR,CAAA,CACP,EAAC,OAAD,CAAM,UAAW,GAAY,MAAQ,GAAkB,UACpD,GACC,oEACG,CAAA,CACH,GACU,GAEnB,EAAS,CAAE,QAAO,cAAa,aAAY,CAAC,CACzC"}
|
|
1
|
+
{"version":3,"file":"DropzoneBase.mjs","names":["MantineDropzone"],"sources":["../../../../src/components/controls/dropzone/DropzoneBase.tsx"],"sourcesContent":["import { type ReactNode, useCallback, useRef } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n dropzoneBase,\n dropzoneBaseHint,\n dropzoneBaseIcon,\n dropzoneBaseIconSlot,\n dropzoneBaseInput,\n dropzoneBaseInputInner,\n dropzoneBaseLoader,\n dropzoneBaseLoaderRoot,\n dropzoneBaseRoot,\n dropzoneBaseSubtitle,\n dropzoneBaseTextSlot,\n dropzoneBaseTitle,\n} from '@mage-ui/styled-system/recipes';\nimport { Dropzone as MantineDropzone } from '@mantine/dropzone';\nimport {\n Icon,\n type IconProps,\n LoaderOval,\n type LoaderOvalProps,\n} from '@/components/data-display';\n\nimport type {\n Uploader,\n UploadProgress,\n UploadResponse,\n} from './upload-service';\nimport { useDropzoneState } from './use-dropzone-state';\n\nexport type { Uploader, UploadProgress, UploadResponse };\n\nexport type FileData = {\n id: string;\n name: string;\n size: number;\n type: string;\n date: string;\n uploaded: boolean;\n loading: boolean;\n url: string;\n token?: string;\n error?: string;\n progress?: number; // (0-100)\n};\n\nexport type DropzoneBaseProps = {\n children: ({\n files,\n isUploading,\n removeFile,\n }: {\n files: Record<string, FileData>;\n isUploading: boolean;\n removeFile: (id: string) => void;\n }) => ReactNode;\n initialFiles?: Record<string, FileData>;\n maxFiles?: number;\n /**\n * Endpoint used by the built-in FormData uploader. Required when\n * `autoSend=true` (default) AND no custom `uploader` is provided.\n * Ignored if `uploader` is provided.\n */\n url?: string;\n /**\n * Custom upload function that replaces the built-in FormData POST.\n * Use it for multi-step flows (e.g. presigned S3) or any non-standard\n * transport. When set, the `url` prop is ignored.\n */\n uploader?: Uploader;\n /** When false, files are added to state but not uploaded automatically. Default: true. */\n autoSend?: boolean;\n /** Maximum file size in bytes. Files exceeding this will be rejected. */\n maxSize?: number;\n /** Called when the file list changes (added or removed). Useful when autoSend=false. */\n onChange?: (files: File[]) => void;\n data?: Record<string, unknown>;\n headers?: Record<string, string>;\n /**\n * Files the dropzone accepts. Forwarded directly to Mantine's\n * `<Dropzone accept>`.\n *\n * Two formats are supported:\n * - **Map (preferred)**: `{ [mimeType]: ['.ext', ...] }` — matches\n * the native `react-dropzone` shape and produces a correct\n * `<input accept>` with MIME + extension pairs. Required when any\n * key would otherwise be a bare extension string.\n * - **Array**: `string[]` of MIME types (no `.ext` entries) — kept\n * for backward compatibility. Mixing `.ext` strings into the\n * array triggers a `Skipped \"...\" because it is not a valid MIME\n * type` warning from `react-dropzone` v15+.\n */\n accept?: string[] | Record<string, string[]>;\n title?: ReactNode;\n subtitle?: ReactNode;\n hint?: ReactNode;\n inputId?: string;\n onFileUploaded?: (file: FileData) => void;\n /** Called when a file is about to be removed. Use to trigger server-side deletion. Fire-and-forget — errors are swallowed. */\n onRemoveFile?: (file: FileData) => void | Promise<void>;\n disabled?: boolean;\n hideWhenFull?: boolean;\n classNames?: {\n dropzoneBase?: string;\n root?: string;\n input?: {\n root?: string;\n inner?: string;\n };\n iconSlot?: string;\n dropzoneIcon?: IconProps['classNames'];\n loader?: LoaderOvalProps['classNames'];\n textSlot?: string;\n title?: string;\n subtitle?: string;\n hint?: string;\n };\n direction?: 'default' | 'reverse';\n};\n\nexport const DropzoneBase = ({\n data,\n headers,\n children,\n initialFiles = {},\n maxFiles,\n url,\n uploader,\n autoSend = true,\n maxSize,\n onChange,\n accept,\n title,\n subtitle,\n hint,\n inputId,\n onFileUploaded,\n onRemoveFile,\n disabled = false,\n classNames,\n direction = 'default',\n hideWhenFull = false,\n}: DropzoneBaseProps) => {\n const dropzoneRef = useRef<HTMLDivElement>(null);\n const rawFilesRef = useRef<Map<string, File>>(new Map());\n const {\n files,\n isUploading,\n uploadMultipleFiles,\n addFile,\n removeFile: hookRemoveFile,\n } = useDropzoneState(url, initialFiles, onFileUploaded, headers, uploader);\n\n const filesRef = useRef<Record<string, FileData>>(files);\n filesRef.current = files;\n\n const removeFile = useCallback(\n (id: string) => {\n if (onRemoveFile) {\n const fileData = filesRef.current[id];\n if (fileData) {\n Promise.resolve(onRemoveFile(fileData)).catch(console.error);\n }\n }\n hookRemoveFile(id);\n rawFilesRef.current.delete(id);\n if (!autoSend && onChange) {\n onChange(Array.from(rawFilesRef.current.values()));\n }\n },\n [hookRemoveFile, autoSend, onChange, onRemoveFile],\n );\n\n const handleDrop = useCallback(\n async (acceptedFiles: File[]) => {\n const currentCount = Object.keys(files).length;\n const max = maxFiles ?? Number.POSITIVE_INFINITY;\n const remainingSlots = max - currentCount;\n if (remainingSlots <= 0) {\n return;\n }\n const filesToProcess = acceptedFiles.slice(0, remainingSlots);\n if (autoSend) {\n await uploadMultipleFiles(filesToProcess, data);\n } else {\n for (const file of filesToProcess) {\n const id = addFile(file);\n rawFilesRef.current.set(id, file);\n }\n onChange?.(Array.from(rawFilesRef.current.values()));\n }\n },\n [autoSend, uploadMultipleFiles, addFile, data, files, maxFiles, onChange],\n );\n\n const isFull =\n maxFiles !== undefined && Object.keys(files).length >= maxFiles;\n\n return (\n <div\n className={cx(\n classNames?.dropzoneBase ?? dropzoneBase(),\n classNames?.root ?? dropzoneBaseRoot(),\n )}\n data-direction={direction}\n >\n {(!hideWhenFull || !isFull) && (\n <MantineDropzone\n ref={dropzoneRef}\n onDrop={handleDrop}\n disabled={disabled || isFull}\n loading={isUploading}\n accept={accept}\n maxSize={maxSize}\n preventDropOnDocument\n inputProps={{ id: inputId }}\n classNames={{\n root: classNames?.input?.root ?? cx(dropzoneBaseInput(), 'group'),\n inner: classNames?.input?.inner ?? dropzoneBaseInputInner(),\n }}\n >\n <div className={classNames?.iconSlot ?? dropzoneBaseIconSlot()}>\n {isUploading ? (\n <LoaderOval\n classNames={{\n loader: classNames?.loader?.loader ?? dropzoneBaseLoader(),\n root: classNames?.loader?.root ?? dropzoneBaseLoaderRoot(),\n }}\n />\n ) : (\n <>\n <MantineDropzone.Idle>\n <Icon\n name='mage-dropzone-upload-01'\n path='/icons/sprite-mage.svg'\n classNames={{\n icon:\n classNames?.dropzoneIcon?.icon ?? dropzoneBaseIcon(),\n }}\n />\n </MantineDropzone.Idle>\n <MantineDropzone.Accept>\n <Icon\n name='mage-dropzone-thumbs-up'\n path='/icons/sprite-mage.svg'\n classNames={{\n icon:\n classNames?.dropzoneIcon?.icon ?? dropzoneBaseIcon(),\n }}\n />\n </MantineDropzone.Accept>\n <MantineDropzone.Reject>\n <Icon\n name='mage-dropzone-thumbs-down'\n path='/icons/sprite-mage.svg'\n classNames={{\n icon:\n classNames?.dropzoneIcon?.icon ?? dropzoneBaseIcon(),\n }}\n />\n </MantineDropzone.Reject>\n </>\n )}\n </div>\n <div className={classNames?.textSlot ?? dropzoneBaseTextSlot()}>\n <span className={classNames?.title ?? dropzoneBaseTitle()}>\n {title || 'Upload files'}\n </span>\n <span className={classNames?.subtitle ?? dropzoneBaseSubtitle()}>\n {subtitle || 'Drag images here or click to select files'}\n </span>\n <span className={classNames?.hint ?? dropzoneBaseHint()}>\n {hint ||\n 'Attach as many files as you like, each file should not exceed 5mb'}\n </span>\n </div>\n </MantineDropzone>\n )}\n {children({ files, isUploading, removeFile })}\n </div>\n );\n};\n"],"mappings":"8tBA0HA,MAAa,GAAgB,CAC3B,OACA,UACA,WACA,eAAe,EAAE,CACjB,WACA,MACA,WACA,WAAW,GACX,UACA,WACA,SACA,QACA,WACA,OACA,UACA,iBACA,eACA,WAAW,GACX,aACA,YAAY,UACZ,eAAe,MACQ,CACvB,IAAM,EAAc,EAAuB,KAAK,CAC1C,EAAc,EAA0B,IAAI,IAAM,CAClD,CACJ,QACA,cACA,sBACA,UACA,WAAY,GACV,EAAiB,EAAK,EAAc,EAAgB,EAAS,EAAS,CAEpE,EAAW,EAAiC,EAAM,CACxD,EAAS,QAAU,EAEnB,IAAM,EAAa,EAChB,GAAe,CACd,GAAI,EAAc,CAChB,IAAM,EAAW,EAAS,QAAQ,GAC9B,GACF,QAAQ,QAAQ,EAAa,EAAS,CAAC,CAAC,MAAM,QAAQ,MAAM,CAGhE,EAAe,EAAG,CAClB,EAAY,QAAQ,OAAO,EAAG,CAC1B,CAAC,GAAY,GACf,EAAS,MAAM,KAAK,EAAY,QAAQ,QAAQ,CAAC,CAAC,EAGtD,CAAC,EAAgB,EAAU,EAAU,EAAa,CACnD,CAEK,EAAa,EACjB,KAAO,IAA0B,CAC/B,IAAM,EAAe,OAAO,KAAK,EAAM,CAAC,OAElC,GADM,GAAY,KACK,EAC7B,GAAI,GAAkB,EACpB,OAEF,IAAM,EAAiB,EAAc,MAAM,EAAG,EAAe,CAC7D,GAAI,EACF,MAAM,EAAoB,EAAgB,EAAK,KAC1C,CACL,IAAK,IAAM,KAAQ,EAAgB,CACjC,IAAM,EAAK,EAAQ,EAAK,CACxB,EAAY,QAAQ,IAAI,EAAI,EAAK,CAEnC,IAAW,MAAM,KAAK,EAAY,QAAQ,QAAQ,CAAC,CAAC,GAGxD,CAAC,EAAU,EAAqB,EAAS,EAAM,EAAO,EAAU,EAAS,CAC1E,CAEK,EACJ,IAAa,IAAA,IAAa,OAAO,KAAK,EAAM,CAAC,QAAU,EAEzD,OACE,EAAC,MAAD,CACE,UAAW,EACT,GAAY,cAAgB,GAAc,CAC1C,GAAY,MAAQ,GAAkB,CACvC,CACD,iBAAgB,WALlB,EAOI,CAAC,GAAgB,CAAC,IAClB,EAACA,EAAD,CACE,IAAK,EACL,OAAQ,EACR,SAAU,GAAY,EACtB,QAAS,EACD,SACC,UACT,sBAAA,GACA,WAAY,CAAE,GAAI,EAAS,CAC3B,WAAY,CACV,KAAM,GAAY,OAAO,MAAQ,EAAG,GAAmB,CAAE,QAAQ,CACjE,MAAO,GAAY,OAAO,OAAS,GAAwB,CAC5D,UAZH,CAcE,EAAC,MAAD,CAAK,UAAW,GAAY,UAAY,GAAsB,UAC3D,EACC,EAAC,EAAD,CACE,WAAY,CACV,OAAQ,GAAY,QAAQ,QAAU,GAAoB,CAC1D,KAAM,GAAY,QAAQ,MAAQ,GAAwB,CAC3D,CACD,CAAA,CAEF,EAAA,EAAA,CAAA,SAAA,CACE,EAACA,EAAgB,KAAjB,CAAA,SACE,EAAC,EAAD,CACE,KAAK,0BACL,KAAK,yBACL,WAAY,CACV,KACE,GAAY,cAAc,MAAQ,GAAkB,CACvD,CACD,CAAA,CACmB,CAAA,CACvB,EAACA,EAAgB,OAAjB,CAAA,SACE,EAAC,EAAD,CACE,KAAK,0BACL,KAAK,yBACL,WAAY,CACV,KACE,GAAY,cAAc,MAAQ,GAAkB,CACvD,CACD,CAAA,CACqB,CAAA,CACzB,EAACA,EAAgB,OAAjB,CAAA,SACE,EAAC,EAAD,CACE,KAAK,4BACL,KAAK,yBACL,WAAY,CACV,KACE,GAAY,cAAc,MAAQ,GAAkB,CACvD,CACD,CAAA,CACqB,CAAA,CACxB,CAAA,CAAA,CAED,CAAA,CACN,EAAC,MAAD,CAAK,UAAW,GAAY,UAAY,GAAsB,UAA9D,CACE,EAAC,OAAD,CAAM,UAAW,GAAY,OAAS,GAAmB,UACtD,GAAS,eACL,CAAA,CACP,EAAC,OAAD,CAAM,UAAW,GAAY,UAAY,GAAsB,UAC5D,GAAY,4CACR,CAAA,CACP,EAAC,OAAD,CAAM,UAAW,GAAY,MAAQ,GAAkB,UACpD,GACC,oEACG,CAAA,CACH,GACU,GAEnB,EAAS,CAAE,QAAO,cAAa,aAAY,CAAC,CACzC"}
|
|
@@ -1,7 +1,12 @@
|
|
|
1
1
|
import { BaseFileInputProps } from "./BaseFileInput.mjs";
|
|
2
|
-
import
|
|
2
|
+
import { ReactElement } from "react";
|
|
3
3
|
|
|
4
4
|
//#region src/components/controls/file-input/FileInputMultiple.d.ts
|
|
5
|
+
type FileInputMultipleHandle = {
|
|
6
|
+
/** Returns the current pending files. */getFiles: () => File[]; /** Programmatically set the pending files. */
|
|
7
|
+
setPendingFiles: (files: File[] | null) => void; /** Clear all pending files and reset the input. */
|
|
8
|
+
clear: () => void;
|
|
9
|
+
};
|
|
5
10
|
type FileInputMultipleProps = Omit<BaseFileInputProps, 'multiple' | 'onChange' | 'valueComponent'> & {
|
|
6
11
|
onChange?: (files: File[] | null) => void;
|
|
7
12
|
badgeClassNames?: {
|
|
@@ -10,22 +15,20 @@ type FileInputMultipleProps = Omit<BaseFileInputProps, 'multiple' | 'onChange' |
|
|
|
10
15
|
section?: string;
|
|
11
16
|
label?: string;
|
|
12
17
|
};
|
|
18
|
+
/** When true, new file selections are merged with previously selected files
|
|
19
|
+
* instead of replacing them. */
|
|
20
|
+
accumulate?: boolean;
|
|
21
|
+
/** Extension → MIME type map used to build the `accept` attribute and
|
|
22
|
+
* resolve MIME types. Example: `{ pdf: 'application/pdf' }`. */
|
|
23
|
+
acceptedTypes?: Record<string, string>;
|
|
24
|
+
/** Fires when the accumulated file list changes (after merge when
|
|
25
|
+
* `accumulate` is true). Unlike `onChange`, which reflects the raw input
|
|
26
|
+
* event, this callback returns the full pending file list. */
|
|
27
|
+
onSelect?: (files: File[] | null) => void;
|
|
13
28
|
};
|
|
14
|
-
declare const FileInputMultiple: ({
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
onFocus,
|
|
18
|
-
onChange,
|
|
19
|
-
label,
|
|
20
|
-
description,
|
|
21
|
-
placeholder,
|
|
22
|
-
error,
|
|
23
|
-
accept,
|
|
24
|
-
required,
|
|
25
|
-
disabled,
|
|
26
|
-
classNames,
|
|
27
|
-
badgeClassNames
|
|
28
|
-
}: FileInputMultipleProps) => react_jsx_runtime0.JSX.Element;
|
|
29
|
+
declare const FileInputMultiple: (props: FileInputMultipleProps & {
|
|
30
|
+
ref?: React.Ref<FileInputMultipleHandle>;
|
|
31
|
+
}) => ReactElement;
|
|
29
32
|
//#endregion
|
|
30
|
-
export { FileInputMultiple, FileInputMultipleProps };
|
|
33
|
+
export { FileInputMultiple, FileInputMultipleHandle, FileInputMultipleProps };
|
|
31
34
|
//# sourceMappingURL=FileInputMultiple.d.mts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FileInputMultiple.d.mts","names":[],"sources":["../../../../src/components/controls/file-input/FileInputMultiple.tsx"],"mappings":";;;;
|
|
1
|
+
{"version":3,"file":"FileInputMultiple.d.mts","names":[],"sources":["../../../../src/components/controls/file-input/FileInputMultiple.tsx"],"mappings":";;;;KAgBY,uBAAA;2CAEV,QAAA,QAAgB,IAAA,IAFiB;EAIjC,eAAA,GAAkB,KAAA,EAAO,IAAA,oBAAI;EAE7B,KAAA;AAAA;AAAA,KAGU,sBAAA,GAAyB,IAAA,CACnC,kBAAA;EAGA,QAAA,IAAY,KAAA,EAAO,IAAA;EACnB,eAAA;IACE,KAAA;IACA,IAAA;IACA,OAAA;IACA,KAAA;EAAA;;;EAIF,UAAA;EATmB;;EAYnB,aAAA,GAAgB,MAAA;EAIO;;;EAAvB,QAAA,IAAY,KAAA,EAAO,IAAA;AAAA;AAAA,cA2HR,iBAAA,GACX,KAAA,EAAO,sBAAA;EACL,GAAA,GAAM,KAAA,CAAM,GAAA,CAAI,uBAAA;AAAA,MAEf,YAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{Badge as e}from"../../data-display/badge/Badge.mjs";import{BaseFileInput as t}from"./BaseFileInput.mjs";import{fileInputBadge as n}from"@mage-ui/styled-system/recipes";import{Fragment as r,jsx as i}from"react/jsx-runtime";const
|
|
1
|
+
import{Badge as e}from"../../data-display/badge/Badge.mjs";import{BaseFileInput as t}from"./BaseFileInput.mjs";import{fileInputBadge as n}from"@mage-ui/styled-system/recipes";import{Fragment as r,jsx as i}from"react/jsx-runtime";import{forwardRef as a,useImperativeHandle as o,useRef as s}from"react";const c=({badgeClassNames:t})=>({value:a})=>a?i(r,{children:(Array.isArray(a)?a:[a]).map(r=>i(e,{classNames:{badge:t?.badge??n(),root:t?.root,section:t?.section,label:t?.label},children:r.name},`${r.name}-${r.lastModified}`))}):null,l=e=>{if(!e)return;let t=Object.keys(e).map(e=>`.${e}`),n=[...new Set(Object.values(e))];return[...t,...n].join(`,`)};function u({name:e,onBlur:n,onFocus:r,onChange:a,onSelect:u,label:d,description:f,placeholder:p,error:m,accept:h,required:g,disabled:_,classNames:v,badgeClassNames:y,accumulate:b=!1,acceptedTypes:x},S){let C=s([]);o(S,()=>({getFiles:()=>C.current,setPendingFiles:e=>{C.current=e??[],u?.(e)},clear:()=>{C.current=[],u?.(null)}}));let w=e=>{if(!e){C.current=[],u?.(null),a?.(null);return}let t=b?[...C.current,...e]:e;C.current=t,u?.(t),a?.(e)};return i(t,{name:e,onBlur:n,onFocus:r,label:d,description:f,placeholder:p,error:m,accept:l(x)??h,required:g,disabled:_,classNames:v,multiple:!0,valueComponent:c({badgeClassNames:y}),onChange:e=>{w(e)}})}const d=a(u);export{d as FileInputMultiple};
|
|
2
2
|
//# sourceMappingURL=FileInputMultiple.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FileInputMultiple.mjs","names":[],"sources":["../../../../src/components/controls/file-input/FileInputMultiple.tsx"],"sourcesContent":["import { fileInputBadge } from '@mage-ui/styled-system/recipes';\nimport { Badge } from '@/components/data-display/badge/Badge';\n\nimport {\n BaseFileInput,\n type BaseFileInputProps,\n type FileInputValueComponent,\n} from './BaseFileInput';\n\nexport type FileInputMultipleProps = Omit<\n BaseFileInputProps,\n 'multiple' | 'onChange' | 'valueComponent'\n> & {\n onChange?: (files: File[] | null) => void;\n badgeClassNames?: {\n badge?: string;\n root?: string;\n section?: string;\n label?: string;\n };\n};\n\nconst createValueComponent = ({\n badgeClassNames,\n}: {\n badgeClassNames?: {\n badge?: string;\n root?: string;\n section?: string;\n label?: string;\n };\n}): FileInputValueComponent => {\n return ({ value }) => {\n if (!value) return null;\n\n const files = Array.isArray(value) ? value : [value];\n\n return (\n <>\n {files.map((file) => (\n <Badge\n key={`${file.name}-${file.lastModified}`}\n classNames={{\n badge: badgeClassNames?.badge ?? fileInputBadge(),\n root: badgeClassNames?.root,\n section: badgeClassNames?.section,\n label: badgeClassNames?.label,\n }}\n >\n {file.name}\n </Badge>\n ))}\n </>\n );\n };\n};\n\
|
|
1
|
+
{"version":3,"file":"FileInputMultiple.mjs","names":[],"sources":["../../../../src/components/controls/file-input/FileInputMultiple.tsx"],"sourcesContent":["import {\n forwardRef,\n type ReactElement,\n useImperativeHandle,\n useRef,\n} from 'react';\n\nimport { fileInputBadge } from '@mage-ui/styled-system/recipes';\nimport { Badge } from '@/components/data-display/badge/Badge';\n\nimport {\n BaseFileInput,\n type BaseFileInputProps,\n type FileInputValueComponent,\n} from './BaseFileInput';\n\nexport type FileInputMultipleHandle = {\n /** Returns the current pending files. */\n getFiles: () => File[];\n /** Programmatically set the pending files. */\n setPendingFiles: (files: File[] | null) => void;\n /** Clear all pending files and reset the input. */\n clear: () => void;\n};\n\nexport type FileInputMultipleProps = Omit<\n BaseFileInputProps,\n 'multiple' | 'onChange' | 'valueComponent'\n> & {\n onChange?: (files: File[] | null) => void;\n badgeClassNames?: {\n badge?: string;\n root?: string;\n section?: string;\n label?: string;\n };\n /** When true, new file selections are merged with previously selected files\n * instead of replacing them. */\n accumulate?: boolean;\n /** Extension → MIME type map used to build the `accept` attribute and\n * resolve MIME types. Example: `{ pdf: 'application/pdf' }`. */\n acceptedTypes?: Record<string, string>;\n /** Fires when the accumulated file list changes (after merge when\n * `accumulate` is true). Unlike `onChange`, which reflects the raw input\n * event, this callback returns the full pending file list. */\n onSelect?: (files: File[] | null) => void;\n};\n\nconst createValueComponent = ({\n badgeClassNames,\n}: {\n badgeClassNames?: {\n badge?: string;\n root?: string;\n section?: string;\n label?: string;\n };\n}): FileInputValueComponent => {\n return ({ value }) => {\n if (!value) return null;\n\n const files = Array.isArray(value) ? value : [value];\n\n return (\n <>\n {files.map((file) => (\n <Badge\n key={`${file.name}-${file.lastModified}`}\n classNames={{\n badge: badgeClassNames?.badge ?? fileInputBadge(),\n root: badgeClassNames?.root,\n section: badgeClassNames?.section,\n label: badgeClassNames?.label,\n }}\n >\n {file.name}\n </Badge>\n ))}\n </>\n );\n };\n};\n\nconst buildAcceptString = (\n acceptedTypes: Record<string, string> | undefined,\n): string | undefined => {\n if (!acceptedTypes) return undefined;\n const exts = Object.keys(acceptedTypes).map((ext) => `.${ext}`);\n const mimes = [...new Set(Object.values(acceptedTypes))];\n return [...exts, ...mimes].join(',');\n};\n\nfunction FileInputMultipleInner(\n {\n name,\n onBlur,\n onFocus,\n onChange,\n onSelect,\n label,\n description,\n placeholder,\n error,\n accept,\n required,\n disabled,\n classNames,\n badgeClassNames,\n accumulate = false,\n acceptedTypes,\n }: FileInputMultipleProps,\n ref: React.ForwardedRef<FileInputMultipleHandle>,\n) {\n const pendingFilesRef = useRef<File[]>([]);\n\n useImperativeHandle(ref, () => ({\n getFiles: () => pendingFilesRef.current,\n setPendingFiles: (files) => {\n pendingFilesRef.current = files ?? [];\n onSelect?.(files);\n },\n clear: () => {\n pendingFilesRef.current = [];\n onSelect?.(null);\n },\n }));\n\n const handleChange = (files: File[] | null) => {\n if (!files) {\n pendingFilesRef.current = [];\n onSelect?.(null);\n onChange?.(null);\n return;\n }\n\n const merged = accumulate ? [...pendingFilesRef.current, ...files] : files;\n\n pendingFilesRef.current = merged;\n onSelect?.(merged);\n onChange?.(files);\n };\n\n const acceptAttr = buildAcceptString(acceptedTypes) ?? accept;\n\n return (\n <BaseFileInput\n name={name}\n onBlur={onBlur}\n onFocus={onFocus}\n label={label}\n description={description}\n placeholder={placeholder}\n error={error}\n accept={acceptAttr}\n required={required}\n disabled={disabled}\n classNames={classNames}\n multiple={true}\n valueComponent={createValueComponent({\n badgeClassNames,\n })}\n onChange={(payload) => {\n handleChange(payload as File[] | null);\n }}\n />\n );\n}\n\nexport const FileInputMultiple = forwardRef(FileInputMultipleInner) as (\n props: FileInputMultipleProps & {\n ref?: React.Ref<FileInputMultipleHandle>;\n },\n) => ReactElement;\n"],"mappings":"6SAgDA,MAAM,GAAwB,CAC5B,sBASQ,CAAE,WACH,EAKH,EAAA,EAAA,CAAA,UAHY,MAAM,QAAQ,EAAM,CAAG,EAAQ,CAAC,EAAM,EAIzC,IAAK,GACV,EAAC,EAAD,CAEE,WAAY,CACV,MAAO,GAAiB,OAAS,GAAgB,CACjD,KAAM,GAAiB,KACvB,QAAS,GAAiB,QAC1B,MAAO,GAAiB,MACzB,UAEA,EAAK,KACA,CATD,GAAG,EAAK,KAAK,GAAG,EAAK,eASpB,CACR,CACD,CAAA,CAnBc,KAwBjB,EACJ,GACuB,CACvB,GAAI,CAAC,EAAe,OACpB,IAAM,EAAO,OAAO,KAAK,EAAc,CAAC,IAAK,GAAQ,IAAI,IAAM,CACzD,EAAQ,CAAC,GAAG,IAAI,IAAI,OAAO,OAAO,EAAc,CAAC,CAAC,CACxD,MAAO,CAAC,GAAG,EAAM,GAAG,EAAM,CAAC,KAAK,IAAI,EAGtC,SAAS,EACP,CACE,OACA,SACA,UACA,WACA,WACA,QACA,cACA,cACA,QACA,SACA,WACA,WACA,aACA,kBACA,aAAa,GACb,iBAEF,EACA,CACA,IAAM,EAAkB,EAAe,EAAE,CAAC,CAE1C,EAAoB,OAAY,CAC9B,aAAgB,EAAgB,QAChC,gBAAkB,GAAU,CAC1B,EAAgB,QAAU,GAAS,EAAE,CACrC,IAAW,EAAM,EAEnB,UAAa,CACX,EAAgB,QAAU,EAAE,CAC5B,IAAW,KAAK,EAEnB,EAAE,CAEH,IAAM,EAAgB,GAAyB,CAC7C,GAAI,CAAC,EAAO,CACV,EAAgB,QAAU,EAAE,CAC5B,IAAW,KAAK,CAChB,IAAW,KAAK,CAChB,OAGF,IAAM,EAAS,EAAa,CAAC,GAAG,EAAgB,QAAS,GAAG,EAAM,CAAG,EAErE,EAAgB,QAAU,EAC1B,IAAW,EAAO,CAClB,IAAW,EAAM,EAKnB,OACE,EAAC,EAAD,CACQ,OACE,SACC,UACF,QACM,cACA,cACN,QACP,OAXe,EAAkB,EAAc,EAAI,EAYzC,WACA,WACE,aACZ,SAAU,GACV,eAAgB,EAAqB,CACnC,kBACD,CAAC,CACF,SAAW,GAAY,CACrB,EAAa,EAAyB,EAExC,CAAA,CAIN,MAAa,EAAoB,EAAW,EAAuB"}
|
|
@@ -1,18 +1,15 @@
|
|
|
1
1
|
import { S3InitBody, S3UploadConfig } from "../dropzone/use-s3-upload.mjs";
|
|
2
|
-
import { FileInputMultipleProps } from "./FileInputMultiple.mjs";
|
|
2
|
+
import { FileInputMultipleHandle, FileInputMultipleProps } from "./FileInputMultiple.mjs";
|
|
3
3
|
import { UploadedS3File } from "./FileInputS3.mjs";
|
|
4
4
|
import { ReactElement } from "react";
|
|
5
5
|
|
|
6
6
|
//#region src/components/controls/file-input/FileInputMultipleS3.d.ts
|
|
7
|
-
type FileInputMultipleS3Handle = {
|
|
7
|
+
type FileInputMultipleS3Handle = FileInputMultipleHandle & {
|
|
8
8
|
upload: () => Promise<UploadedS3File[] | null>;
|
|
9
|
-
setPendingFiles: (files: File[] | null) => void;
|
|
10
9
|
};
|
|
11
10
|
type FileInputMultipleS3Props<TBody extends S3InitBody = S3InitBody> = Omit<FileInputMultipleProps, 'onChange'> & S3UploadConfig<TBody> & {
|
|
12
11
|
autoUpload?: boolean;
|
|
13
|
-
accumulate?: boolean;
|
|
14
12
|
onChange?: (results: UploadedS3File[] | null) => void;
|
|
15
|
-
onSelect?: (files: File[] | null) => void;
|
|
16
13
|
};
|
|
17
14
|
declare const FileInputMultipleS3: <TBody extends S3InitBody = S3InitBody>(props: FileInputMultipleS3Props<TBody> & {
|
|
18
15
|
ref?: React.Ref<FileInputMultipleS3Handle>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FileInputMultipleS3.d.mts","names":[],"sources":["../../../../src/components/controls/file-input/FileInputMultipleS3.tsx"],"mappings":";;;;;;
|
|
1
|
+
{"version":3,"file":"FileInputMultipleS3.d.mts","names":[],"sources":["../../../../src/components/controls/file-input/FileInputMultipleS3.tsx"],"mappings":";;;;;;KAwBY,yBAAA,GAA4B,uBAAA;EACtC,MAAA,QAAc,OAAA,CAAQ,cAAA;AAAA;AAAA,KAGZ,wBAAA,eAAuC,UAAA,GAAa,UAAA,IAC9D,IAAA,CAAK,sBAAA,gBACH,cAAA,CAAe,KAAA;EACb,UAAA;EACA,QAAA,IAAY,OAAA,EAAS,cAAA;AAAA;AAAA,cAoGd,mBAAA,iBACG,UAAA,GAAa,UAAA,EAE3B,KAAA,EAAO,wBAAA,CAAyB,KAAA;EAC9B,GAAA,GAAM,KAAA,CAAM,GAAA,CAAI,yBAAA;AAAA,MAEf,YAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{defaultGetErrorMessage as e,useS3Upload as t}from"../dropzone/use-s3-upload.mjs";import{FileInputMultiple as n}from"./FileInputMultiple.mjs";import{jsx as r}from"react/jsx-runtime";import{forwardRef as i,useImperativeHandle as a,useRef as o,useState as s}from"react";function c({onChange:i,onSelect:c,autoUpload:l=!0,accumulate:u=!1,
|
|
1
|
+
import{defaultGetErrorMessage as e,useS3Upload as t}from"../dropzone/use-s3-upload.mjs";import{FileInputMultiple as n}from"./FileInputMultiple.mjs";import{jsx as r}from"react/jsx-runtime";import{forwardRef as i,useImperativeHandle as a,useRef as o,useState as s}from"react";function c({onChange:i,onSelect:c,autoUpload:l=!0,accumulate:u=!1,acceptedTypes:d,initUrl:f,buildInitBody:p,register:m,getHeaders:h,getErrorMessage:g=e,resolveUploadedUrl:_,texts:v,error:y,disabled:b,...x},S){let[C,w]=s(null),[T,E]=s(!1),D=o(null),{upload:O}=t({initUrl:f,buildInitBody:p,register:m,getHeaders:h,getErrorMessage:g,resolveUploadedUrl:_,acceptedTypes:d,texts:v}),k=async e=>{E(!0);try{let t=[];for(let n of e)t.push(await O(n));return i?.(t),t}catch(e){return w(e instanceof Error?e.message:`Upload failed`),null}finally{E(!1)}};a(S,()=>({getFiles:()=>D.current?.getFiles()??[],setPendingFiles:e=>{D.current?.setPendingFiles(e)},clear:()=>{D.current?.clear()},upload:()=>{let e=D.current?.getFiles()??[];return e.length===0?Promise.resolve(null):k(e)}}));let A=e=>{if(w(null),!e){i?.(null);return}l&&k(e)},j=e=>{c?.(e)};return r(n,{...x,ref:D,accumulate:u,acceptedTypes:d,onChange:A,onSelect:j,disabled:b??T,error:y??C??void 0})}const l=i(c);export{l as FileInputMultipleS3};
|
|
2
2
|
//# sourceMappingURL=FileInputMultipleS3.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FileInputMultipleS3.mjs","names":[],"sources":["../../../../src/components/controls/file-input/FileInputMultipleS3.tsx"],"sourcesContent":["import {\n forwardRef,\n type ReactElement,\n useImperativeHandle,\n useRef,\n useState,\n} from 'react';\n\nimport {\n defaultGetErrorMessage,\n type S3InitBody,\n type S3UploadConfig,\n useS3Upload,\n} from '@/components/controls/dropzone/use-s3-upload';\n\nimport {\n FileInputMultiple,\n type FileInputMultipleProps,\n} from './FileInputMultiple';\nimport type { UploadedS3File } from './FileInputS3';\n\nexport type { UploadedS3File };\n\nexport type FileInputMultipleS3Handle = {\n upload: () => Promise<UploadedS3File[] | null>;\n
|
|
1
|
+
{"version":3,"file":"FileInputMultipleS3.mjs","names":[],"sources":["../../../../src/components/controls/file-input/FileInputMultipleS3.tsx"],"sourcesContent":["import {\n forwardRef,\n type ReactElement,\n useImperativeHandle,\n useRef,\n useState,\n} from 'react';\n\nimport {\n defaultGetErrorMessage,\n type S3InitBody,\n type S3UploadConfig,\n useS3Upload,\n} from '@/components/controls/dropzone/use-s3-upload';\n\nimport {\n FileInputMultiple,\n type FileInputMultipleHandle,\n type FileInputMultipleProps,\n} from './FileInputMultiple';\nimport type { UploadedS3File } from './FileInputS3';\n\nexport type { UploadedS3File };\n\nexport type FileInputMultipleS3Handle = FileInputMultipleHandle & {\n upload: () => Promise<UploadedS3File[] | null>;\n};\n\nexport type FileInputMultipleS3Props<TBody extends S3InitBody = S3InitBody> =\n Omit<FileInputMultipleProps, 'onChange'> &\n S3UploadConfig<TBody> & {\n autoUpload?: boolean;\n onChange?: (results: UploadedS3File[] | null) => void;\n };\n\nfunction FileInputMultipleS3Inner<TBody extends S3InitBody = S3InitBody>(\n {\n onChange,\n onSelect,\n autoUpload = true,\n accumulate = false,\n acceptedTypes,\n initUrl,\n buildInitBody,\n register,\n getHeaders,\n getErrorMessage = defaultGetErrorMessage,\n resolveUploadedUrl,\n texts,\n error,\n disabled,\n ...fileInputMultipleProps\n }: FileInputMultipleS3Props<TBody>,\n ref: React.ForwardedRef<FileInputMultipleS3Handle>,\n) {\n const [uploadError, setUploadError] = useState<string | null>(null);\n const [isUploading, setIsUploading] = useState(false);\n const baseRef = useRef<FileInputMultipleHandle>(null);\n\n const { upload } = useS3Upload<TBody>({\n initUrl,\n buildInitBody,\n register,\n getHeaders,\n getErrorMessage,\n resolveUploadedUrl,\n acceptedTypes,\n texts,\n });\n\n const doUpload = async (files: File[]): Promise<UploadedS3File[] | null> => {\n setIsUploading(true);\n try {\n const results: UploadedS3File[] = [];\n for (const file of files) {\n results.push(await upload(file));\n }\n onChange?.(results);\n return results;\n } catch (e) {\n setUploadError(e instanceof Error ? e.message : 'Upload failed');\n return null;\n } finally {\n setIsUploading(false);\n }\n };\n\n useImperativeHandle(ref, () => ({\n getFiles: () => baseRef.current?.getFiles() ?? [],\n setPendingFiles: (files) => {\n baseRef.current?.setPendingFiles(files);\n },\n clear: () => {\n baseRef.current?.clear();\n },\n upload: () => {\n const files = baseRef.current?.getFiles() ?? [];\n if (files.length === 0) return Promise.resolve(null);\n return doUpload(files);\n },\n }));\n\n // onChange fires with only the NEW files from the input (not accumulated).\n // Use it to trigger auto-upload so we never re-upload already-uploaded files.\n const handleNewFiles = (newFiles: File[] | null) => {\n setUploadError(null);\n if (!newFiles) {\n onChange?.(null);\n return;\n }\n if (autoUpload) doUpload(newFiles);\n };\n\n // onSelect fires with the full accumulated list. Forward to consumer.\n const handleAccumulatedFiles = (allFiles: File[] | null) => {\n onSelect?.(allFiles);\n };\n\n return (\n <FileInputMultiple\n {...fileInputMultipleProps}\n ref={baseRef}\n accumulate={accumulate}\n acceptedTypes={acceptedTypes}\n onChange={handleNewFiles}\n onSelect={handleAccumulatedFiles}\n disabled={disabled ?? isUploading}\n error={error ?? uploadError ?? undefined}\n />\n );\n}\n\nexport const FileInputMultipleS3 = forwardRef(FileInputMultipleS3Inner) as <\n TBody extends S3InitBody = S3InitBody,\n>(\n props: FileInputMultipleS3Props<TBody> & {\n ref?: React.Ref<FileInputMultipleS3Handle>;\n },\n) => ReactElement;\n"],"mappings":"kRAmCA,SAAS,EACP,CACE,WACA,WACA,aAAa,GACb,aAAa,GACb,gBACA,UACA,gBACA,WACA,aACA,kBAAkB,EAClB,qBACA,QACA,QACA,WACA,GAAG,GAEL,EACA,CACA,GAAM,CAAC,EAAa,GAAkB,EAAwB,KAAK,CAC7D,CAAC,EAAa,GAAkB,EAAS,GAAM,CAC/C,EAAU,EAAgC,KAAK,CAE/C,CAAE,UAAW,EAAmB,CACpC,UACA,gBACA,WACA,aACA,kBACA,qBACA,gBACA,QACD,CAAC,CAEI,EAAW,KAAO,IAAoD,CAC1E,EAAe,GAAK,CACpB,GAAI,CACF,IAAM,EAA4B,EAAE,CACpC,IAAK,IAAM,KAAQ,EACjB,EAAQ,KAAK,MAAM,EAAO,EAAK,CAAC,CAGlC,OADA,IAAW,EAAQ,CACZ,QACA,EAAG,CAEV,OADA,EAAe,aAAa,MAAQ,EAAE,QAAU,gBAAgB,CACzD,YACC,CACR,EAAe,GAAM,GAIzB,EAAoB,OAAY,CAC9B,aAAgB,EAAQ,SAAS,UAAU,EAAI,EAAE,CACjD,gBAAkB,GAAU,CAC1B,EAAQ,SAAS,gBAAgB,EAAM,EAEzC,UAAa,CACX,EAAQ,SAAS,OAAO,EAE1B,WAAc,CACZ,IAAM,EAAQ,EAAQ,SAAS,UAAU,EAAI,EAAE,CAE/C,OADI,EAAM,SAAW,EAAU,QAAQ,QAAQ,KAAK,CAC7C,EAAS,EAAM,EAEzB,EAAE,CAIH,IAAM,EAAkB,GAA4B,CAElD,GADA,EAAe,KAAK,CAChB,CAAC,EAAU,CACb,IAAW,KAAK,CAChB,OAEE,GAAY,EAAS,EAAS,EAI9B,EAA0B,GAA4B,CAC1D,IAAW,EAAS,EAGtB,OACE,EAAC,EAAD,CACE,GAAI,EACJ,IAAK,EACO,aACG,gBACf,SAAU,EACV,SAAU,EACV,SAAU,GAAY,EACtB,MAAO,GAAS,GAAe,IAAA,GAC/B,CAAA,CAIN,MAAa,EAAsB,EAAW,EAAyB"}
|
|
@@ -15,7 +15,7 @@ import { FileData } from "./dropzone/DropzoneBase.mjs";
|
|
|
15
15
|
import { Dropzone, DropzoneProps } from "./dropzone/Dropzone.mjs";
|
|
16
16
|
import { DropzoneS3, DropzoneS3Props } from "./dropzone/DropzoneS3.mjs";
|
|
17
17
|
import { FileInput, FileInputProps } from "./file-input/FileInput.mjs";
|
|
18
|
-
import { FileInputMultiple, FileInputMultipleProps } from "./file-input/FileInputMultiple.mjs";
|
|
18
|
+
import { FileInputMultiple, FileInputMultipleHandle, FileInputMultipleProps } from "./file-input/FileInputMultiple.mjs";
|
|
19
19
|
import { FileInputS3, FileInputS3Handle, FileInputS3Props, UploadedS3File } from "./file-input/FileInputS3.mjs";
|
|
20
20
|
import { FileInputMultipleS3, FileInputMultipleS3Handle, FileInputMultipleS3Props } from "./file-input/FileInputMultipleS3.mjs";
|
|
21
21
|
import { PasswordInput, PasswordInputProps } from "./password-input/PasswordInput.mjs";
|
|
@@ -71,7 +71,7 @@ import { FileData } from "./controls/dropzone/DropzoneBase.mjs";
|
|
|
71
71
|
import { Dropzone, DropzoneProps } from "./controls/dropzone/Dropzone.mjs";
|
|
72
72
|
import { DropzoneS3, DropzoneS3Props } from "./controls/dropzone/DropzoneS3.mjs";
|
|
73
73
|
import { FileInput, FileInputProps } from "./controls/file-input/FileInput.mjs";
|
|
74
|
-
import { FileInputMultiple, FileInputMultipleProps } from "./controls/file-input/FileInputMultiple.mjs";
|
|
74
|
+
import { FileInputMultiple, FileInputMultipleHandle, FileInputMultipleProps } from "./controls/file-input/FileInputMultiple.mjs";
|
|
75
75
|
import { FileInputS3, FileInputS3Handle, FileInputS3Props, UploadedS3File } from "./controls/file-input/FileInputS3.mjs";
|
|
76
76
|
import { FileInputMultipleS3, FileInputMultipleS3Handle, FileInputMultipleS3Props } from "./controls/file-input/FileInputMultipleS3.mjs";
|
|
77
77
|
import { PasswordInput, PasswordInputProps } from "./controls/password-input/PasswordInput.mjs";
|
package/dist/index.d.mts
CHANGED
|
@@ -71,7 +71,7 @@ import { FileData } from "./components/controls/dropzone/DropzoneBase.mjs";
|
|
|
71
71
|
import { Dropzone, DropzoneProps } from "./components/controls/dropzone/Dropzone.mjs";
|
|
72
72
|
import { DropzoneS3, DropzoneS3Props } from "./components/controls/dropzone/DropzoneS3.mjs";
|
|
73
73
|
import { FileInput, FileInputProps } from "./components/controls/file-input/FileInput.mjs";
|
|
74
|
-
import { FileInputMultiple, FileInputMultipleProps } from "./components/controls/file-input/FileInputMultiple.mjs";
|
|
74
|
+
import { FileInputMultiple, FileInputMultipleHandle, FileInputMultipleProps } from "./components/controls/file-input/FileInputMultiple.mjs";
|
|
75
75
|
import { FileInputS3, FileInputS3Handle, FileInputS3Props, UploadedS3File } from "./components/controls/file-input/FileInputS3.mjs";
|
|
76
76
|
import { FileInputMultipleS3, FileInputMultipleS3Handle, FileInputMultipleS3Props } from "./components/controls/file-input/FileInputMultipleS3.mjs";
|
|
77
77
|
import { PasswordInput, PasswordInputProps } from "./components/controls/password-input/PasswordInput.mjs";
|
|
@@ -106,4 +106,4 @@ import { Modals } from "./components/overlays/modal/index.mjs";
|
|
|
106
106
|
import { Toast, ToastIntent, ToastOptions, ToastProviderProps } from "./components/overlays/toast/Toast.mjs";
|
|
107
107
|
import { Tooltip, TooltipProps } from "./components/overlays/tooltip/Tooltip.mjs";
|
|
108
108
|
import { MageUiProvider, MageUiProviderProps } from "./providers/MageUiProvider.mjs";
|
|
109
|
-
export { Autocomplete, AutocompleteProps, Avatar, AvatarDropzone, AvatarDropzoneProps, AvatarDropzoneS3, AvatarDropzoneS3Props, AvatarProps, AvatarUpload, AvatarUploadProps, Badge, BadgeProps, Breadcrumbs, BreadcrumbsBarProps, BreadcrumbsProps, Button, ButtonAction, ButtonActionProps, ButtonIcon, ButtonIconProps, ButtonIconVisual, ButtonIconVisualProps, ButtonLoader, ButtonProps, ButtonVisual, ButtonVisualProps, Calendar, CalendarEvent, CalendarProps, CalendarView, Card, CardBase, CardBody, CardClassNames, CardFooter, CardHeader, CardProps, CardRoot, Checkbox, CheckboxProps, CheckboxTree, CheckboxTreeItem, CheckboxTreeProps, ColumnDef, Combobox, ComboboxProps, DEFAULT_DATA_TABLE_LABELS, DataTable, DataTableBottomSlot, DataTableBottomSlotProps, DataTableClassNames, DataTableColumnMeta, DataTableContextProvider, DataTableContextValue, DataTableExpansionConfig, DataTableExtraColumnConfig, DataTableFeedback, DataTableFiltersConfig, DataTableLabels, DataTablePageSize, DataTablePageSizeProps, DataTablePagination, DataTablePaginationConfig, DataTablePaginationProps, DataTableProps, DataTableRecord, DataTableSearchConfig, DataTableSelectionConfig, DataTableSortingConfig, DataTableTableConfig, DataTableTopSlot, DataTableTopSlotProps, DateLocalizer, DatePicker, DatePickerClassNames, DatePickerDate, DatePickerProps, DatePickerValue, DateTimePicker, DateTimePickerClassNames, DateTimePickerDate, DateTimePickerProps, DateTimePickerValue, DescriptionList, DescriptionListClassNames, DescriptionListItemProps, DescriptionListProps, Details, DetailsProps, DocumentItem, DocumentItemProps, Dropzone, DropzoneProps, DropzoneS3, DropzoneS3Props, DropzoneS3Texts, ExpandedState, Fieldset, FieldsetProps, FileData, FileIcon, FileIconProps, FileInput, FileInputMultiple, FileInputMultipleProps, FileInputMultipleS3, FileInputMultipleS3Handle, FileInputMultipleS3Props, FileInputProps, FileInputS3, FileInputS3Handle, FileInputS3Props, FileMetadata, FluidGrid, FluidGridProps, Form, FormDropzoneS3Props, FormProps, FormS3Context, FormS3ContextValue, Grid, GridClassNames, HorizontalDivider, HorizontalDividerProps, Icon, IconProps, IconRaw, IconRawProps, IconSvg, IconSvgProps, IconWrapped, IconWrappedProps, Indicator, IndicatorProps, LoaderDot, LoaderDotProps, LoaderOval, LoaderOvalProps, LogoImage, LogoImageProps, LogoSvg, LogoSvgProps, MageUiProvider, MageUiProviderProps, Menu, MenuProps, Modal, ModalClassNames, ModalIntent, ModalProps, ModalRegistry, ModalRegistryEntry, ModalRootProps, Modals, MultiForm, MultiFormContext, MultiFormContextValue, MultiFormProps, MultiFormStep, MultiFormStepProps, MultiStepFormProps, NavigationMenu, NavigationMenuProps, NoSsr, NotificationBanner, NotificationBannerIntent, NotificationBannerProps, PASSWORD_RULES, Pagination, PaginationClassNames, PaginationRootProps, PaginationState, PasswordInput, PasswordInputProps, PasswordRule, PasswordRuleDefinition, PasswordSegment, PasswordStrengthInput, PasswordStrengthInputProps, Progress, ProgressClassNames, ProgressProps, Radio, RadioProps, RemovableItem, RemovableItemProps, RequestResponse, ResourceItem, ResourceItemProps, RowSelectionState, S3FileMeta, S3InitBody, S3InitResponse, S3UploadCallback, Schema, SchemaProps, ScrollArea, ScrollAreaAutosize, ScrollAreaAutosizeProps, ScrollAreaClassNames, ScrollAreaProps, Select, SelectProps, Sidebar, SidebarClassNames, SidebarProps, SortingState, Stepper, StepperClassNames, StepperProps, StepperStepProps, Switch, SwitchGroup, SwitchGroupProps, SwitchProps, Table, TableBodyProps, TableCaptionProps, TableCellProps, TableClassNames, TableFootProps, TableHeadProps, TableHeaderCellProps, TableProps, TableRowProps, Tag, TagGroup, TagGroupProps, TagProps, TextInput, TextInputProps, Textarea, TextareaProps, Toast, ToastIntent, ToastOptions, ToastProviderProps, Tooltip, TooltipProps, UploadTarget, UploadedFile, UploadedFileDetails, UploadedFileDetailsProps, UploadedFileProps, UploadedFiles, UploadedFilesClassNames, UploadedFilesItemClassNames, UploadedFilesItemProps, UploadedFilesProps, UploadedS3File, UploadingFiles, UploadingFilesClassNames, UploadingFilesItemClassNames, UploadingFilesItemErrorClassNames, UploadingFilesItemErrorProps, UploadingFilesItemProps, UploadingFilesProps, Virtual, VirtualItem, VirtualPadding, VirtualProps, VisuallyHidden, VisuallyHiddenProps, YearPicker, YearPickerClassNames, YearPickerDate, YearPickerProps, YearPickerValue, getFileExtension, useDataTableContext, useFormS3Context, useMultiFormContext, usePasswordRules, z };
|
|
109
|
+
export { Autocomplete, AutocompleteProps, Avatar, AvatarDropzone, AvatarDropzoneProps, AvatarDropzoneS3, AvatarDropzoneS3Props, AvatarProps, AvatarUpload, AvatarUploadProps, Badge, BadgeProps, Breadcrumbs, BreadcrumbsBarProps, BreadcrumbsProps, Button, ButtonAction, ButtonActionProps, ButtonIcon, ButtonIconProps, ButtonIconVisual, ButtonIconVisualProps, ButtonLoader, ButtonProps, ButtonVisual, ButtonVisualProps, Calendar, CalendarEvent, CalendarProps, CalendarView, Card, CardBase, CardBody, CardClassNames, CardFooter, CardHeader, CardProps, CardRoot, Checkbox, CheckboxProps, CheckboxTree, CheckboxTreeItem, CheckboxTreeProps, ColumnDef, Combobox, ComboboxProps, DEFAULT_DATA_TABLE_LABELS, DataTable, DataTableBottomSlot, DataTableBottomSlotProps, DataTableClassNames, DataTableColumnMeta, DataTableContextProvider, DataTableContextValue, DataTableExpansionConfig, DataTableExtraColumnConfig, DataTableFeedback, DataTableFiltersConfig, DataTableLabels, DataTablePageSize, DataTablePageSizeProps, DataTablePagination, DataTablePaginationConfig, DataTablePaginationProps, DataTableProps, DataTableRecord, DataTableSearchConfig, DataTableSelectionConfig, DataTableSortingConfig, DataTableTableConfig, DataTableTopSlot, DataTableTopSlotProps, DateLocalizer, DatePicker, DatePickerClassNames, DatePickerDate, DatePickerProps, DatePickerValue, DateTimePicker, DateTimePickerClassNames, DateTimePickerDate, DateTimePickerProps, DateTimePickerValue, DescriptionList, DescriptionListClassNames, DescriptionListItemProps, DescriptionListProps, Details, DetailsProps, DocumentItem, DocumentItemProps, Dropzone, DropzoneProps, DropzoneS3, DropzoneS3Props, DropzoneS3Texts, ExpandedState, Fieldset, FieldsetProps, FileData, FileIcon, FileIconProps, FileInput, FileInputMultiple, FileInputMultipleHandle, FileInputMultipleProps, FileInputMultipleS3, FileInputMultipleS3Handle, FileInputMultipleS3Props, FileInputProps, FileInputS3, FileInputS3Handle, FileInputS3Props, FileMetadata, FluidGrid, FluidGridProps, Form, FormDropzoneS3Props, FormProps, FormS3Context, FormS3ContextValue, Grid, GridClassNames, HorizontalDivider, HorizontalDividerProps, Icon, IconProps, IconRaw, IconRawProps, IconSvg, IconSvgProps, IconWrapped, IconWrappedProps, Indicator, IndicatorProps, LoaderDot, LoaderDotProps, LoaderOval, LoaderOvalProps, LogoImage, LogoImageProps, LogoSvg, LogoSvgProps, MageUiProvider, MageUiProviderProps, Menu, MenuProps, Modal, ModalClassNames, ModalIntent, ModalProps, ModalRegistry, ModalRegistryEntry, ModalRootProps, Modals, MultiForm, MultiFormContext, MultiFormContextValue, MultiFormProps, MultiFormStep, MultiFormStepProps, MultiStepFormProps, NavigationMenu, NavigationMenuProps, NoSsr, NotificationBanner, NotificationBannerIntent, NotificationBannerProps, PASSWORD_RULES, Pagination, PaginationClassNames, PaginationRootProps, PaginationState, PasswordInput, PasswordInputProps, PasswordRule, PasswordRuleDefinition, PasswordSegment, PasswordStrengthInput, PasswordStrengthInputProps, Progress, ProgressClassNames, ProgressProps, Radio, RadioProps, RemovableItem, RemovableItemProps, RequestResponse, ResourceItem, ResourceItemProps, RowSelectionState, S3FileMeta, S3InitBody, S3InitResponse, S3UploadCallback, Schema, SchemaProps, ScrollArea, ScrollAreaAutosize, ScrollAreaAutosizeProps, ScrollAreaClassNames, ScrollAreaProps, Select, SelectProps, Sidebar, SidebarClassNames, SidebarProps, SortingState, Stepper, StepperClassNames, StepperProps, StepperStepProps, Switch, SwitchGroup, SwitchGroupProps, SwitchProps, Table, TableBodyProps, TableCaptionProps, TableCellProps, TableClassNames, TableFootProps, TableHeadProps, TableHeaderCellProps, TableProps, TableRowProps, Tag, TagGroup, TagGroupProps, TagProps, TextInput, TextInputProps, Textarea, TextareaProps, Toast, ToastIntent, ToastOptions, ToastProviderProps, Tooltip, TooltipProps, UploadTarget, UploadedFile, UploadedFileDetails, UploadedFileDetailsProps, UploadedFileProps, UploadedFiles, UploadedFilesClassNames, UploadedFilesItemClassNames, UploadedFilesItemProps, UploadedFilesProps, UploadedS3File, UploadingFiles, UploadingFilesClassNames, UploadingFilesItemClassNames, UploadingFilesItemErrorClassNames, UploadingFilesItemErrorProps, UploadingFilesItemProps, UploadingFilesProps, Virtual, VirtualItem, VirtualPadding, VirtualProps, VisuallyHidden, VisuallyHiddenProps, YearPicker, YearPickerClassNames, YearPickerDate, YearPickerProps, YearPickerValue, getFileExtension, useDataTableContext, useFormS3Context, useMultiFormContext, usePasswordRules, z };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mage-ui/components",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.177",
|
|
4
4
|
"private": false,
|
|
5
5
|
"description": "",
|
|
6
6
|
"keywords": [],
|
|
@@ -26,7 +26,7 @@
|
|
|
26
26
|
"tsdown": "^0.21.4",
|
|
27
27
|
"typescript": "^5.9.3",
|
|
28
28
|
"@mage-ui/styled-system": "1.0.8",
|
|
29
|
-
"@mage-ui/preset": "1.0.
|
|
29
|
+
"@mage-ui/preset": "1.0.177"
|
|
30
30
|
},
|
|
31
31
|
"peerDependencies": {
|
|
32
32
|
"@dnd-kit/core": "^6.3.1",
|