npm - @mage-ui/components - Versions diffs - 1.0.70 → 1.0.72 - Mend

@mage-ui/components 1.0.70 → 1.0.72

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.

Files changed (113) hide show

package/dist/components/controls/dropdown/DropdownTargetTextInput.d.mts CHANGED Viewed

@@ -2,6 +2,7 @@ import { TextInputProps } from "../text-input/TextInput.mjs";
 import { DropdownChevronProps } from "./DropdownChevron.mjs";
 import { DropdownClearButtonProps } from "./DropdownClearButton.mjs";
 import "react/jsx-runtime";
+import { ReactNode } from "react";
 //#region src/components/controls/dropdown/DropdownTargetTextInput.d.ts
 type DropdownTargetTextInputProps = Omit<TextInputProps, 'classNames'> & {
@@ -13,6 +14,7 @@ type DropdownTargetTextInputProps = Omit<TextInputProps, 'classNames'> & {
   showChevron?: boolean;
   clearable?: boolean;
   closeOnBlur?: boolean;
+  startSlot?: ReactNode;
 };
 //#endregion
 export { DropdownTargetTextInputProps };

package/dist/components/controls/dropdown/DropdownTargetTextInput.d.mts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DropdownTargetTextInput.d.mts","names":[],"sources":["../../../../src/components/controls/dropdown/DropdownTargetTextInput.tsx"],"mappings":"~~;;;;;;KAkBY~~,4BAAA,GAA+B,IAAA,CACzC,cAAA;EAGA,UAAA,GAAa,IAAA,CAAK,WAAA,CAAY,cAAA;IAC5B,iBAAA;EAAA;EAEF,gBAAA,GAAmB,wBAAA;EACnB,YAAA,GAAe,oBAAA;EAEf,WAAA;EACA,SAAA;EACA,WAAA;AAAA"}
1	+ {"version":3,"file":"DropdownTargetTextInput.d.mts","names":[],"sources":["../../../../src/components/controls/dropdown/DropdownTargetTextInput.tsx"],"mappings":";;;;;;;KAoBY,4BAAA,GAA+B,IAAA,CACzC,cAAA;EAGA,UAAA,GAAa,IAAA,CAAK,WAAA,CAAY,cAAA;IAC5B,iBAAA;EAAA;EAEF,gBAAA,GAAmB,wBAAA;EACnB,YAAA,GAAe,oBAAA;EAEf,WAAA;EACA,SAAA;EACA,WAAA;EACA,SAAA,GAAY,SAAA;AAAA"}

package/dist/components/controls/dropdown/DropdownTargetTextInput.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-import{TextInput as e}from"../text-input/TextInput.mjs";import{useDropdownContext as t}from"./DropdownContextProvider.mjs";import{DropdownEndSlot as n}from"./DropdownEndSlot.mjs";import{dropdownTextInput as r,dropdownTextInputDescription as i,dropdownTextInputError as a,dropdownTextInputInput as o,dropdownTextInputLabel as s,dropdownTextInputRequired as c,dropdownTextInputRoot as l,dropdownTextInputSection as u,dropdownTextInputWrapper as d}from"@mage-ui/styled-system/recipes";import{jsx as f}from"react/jsx-runtime";const p=({classNames:p,clearable:m,showChevron:h,clearButtonProps:g,chevronProps:_,closeOnBlur:v=!0,...y})=>{let{store:b,value:x,query:S,setQuery:C}=t(),w=m&&(S??x?.value??``)!==``,T={"--dropdown-text-input-right-section-pointer-events":w?`auto`:`none`};return f(e,{readOnly:!1,value:S??x?.value??``,endSlot:f(n,{clearable:w,showChevron:h,clearButtonProps:g,chevronProps:_}),onFocus:e=>{e.stopPropagation(),e.preventDefault(),b.openDropdown()},onBlur:e=>{e.stopPropagation(),e.preventDefault(),v&&(b.closeDropdown(),C(void 0))},classNames:{textInput:p?.dropdownTextInput??r(),root:p?.root??l(),label:p?.label??s(),description:p?.description??i(),error:p?.error??a(),wrapper:p?.wrapper??d(),input:p?.input??o(),section:p?.section??u(),required:p?.required??c()},style:T,...y})};export{p as DropdownTargetTextInput};
+import{TextInput as e}from"../text-input/TextInput.mjs";import{useDropdownContext as t}from"./DropdownContextProvider.mjs";import{DropdownEndSlot as n}from"./DropdownEndSlot.mjs";import{dropdownTextInput as r,dropdownTextInputDescription as i,dropdownTextInputError as a,dropdownTextInputInput as o,dropdownTextInputLabel as s,dropdownTextInputRequired as c,dropdownTextInputRoot as l,dropdownTextInputSection as u,dropdownTextInputWrapper as d}from"@mage-ui/styled-system/recipes";import{jsx as f}from"react/jsx-runtime";const p=({classNames:p,clearable:m,showChevron:h,clearButtonProps:g,chevronProps:_,closeOnBlur:v=!0,startSlot:y,...b})=>{let{store:x,value:S,query:C,setQuery:w}=t(),T=m&&(C??S?.value??``)!==``,E={"--dropdown-text-input-right-section-pointer-events":T?`auto`:`none`};return f(e,{readOnly:!1,value:C??S?.value??``,startSlot:y,endSlot:f(n,{clearable:T,showChevron:h,clearButtonProps:g,chevronProps:_}),onFocus:e=>{e.stopPropagation(),e.preventDefault(),x.openDropdown()},onBlur:e=>{e.stopPropagation(),e.preventDefault(),v&&(x.closeDropdown(),w(void 0))},classNames:{textInput:p?.dropdownTextInput??r(),root:p?.root??l(),label:p?.label??s(),description:p?.description??i(),error:p?.error??a(),wrapper:p?.wrapper??d(),input:p?.input??o(),section:p?.section??u(),required:p?.required??c()},style:E,...b})};export{p as DropdownTargetTextInput};
 //# sourceMappingURL=DropdownTargetTextInput.mjs.map

package/dist/components/controls/dropdown/DropdownTargetTextInput.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DropdownTargetTextInput.mjs","names":[],"sources":["../../../../src/components/controls/dropdown/DropdownTargetTextInput.tsx"],"sourcesContent":["import {\n dropdownTextInput,\n dropdownTextInputDescription,\n dropdownTextInputError,\n dropdownTextInputInput,\n dropdownTextInputLabel,\n dropdownTextInputRequired,\n dropdownTextInputRoot,\n dropdownTextInputSection,\n dropdownTextInputWrapper,\n} from '@mage-ui/styled-system/recipes';\n\nimport { TextInput, type TextInputProps } from '../text-input/TextInput';\nimport type { DropdownChevronProps } from './DropdownChevron';\nimport type { DropdownClearButtonProps } from './DropdownClearButton';\nimport { useDropdownContext } from './DropdownContextProvider';\nimport { DropdownEndSlot } from './DropdownEndSlot';\n\nexport type DropdownTargetTextInputProps = Omit<\n TextInputProps,\n 'classNames'\n> & {\n classNames?: Omit<NonNullable<TextInputProps['classNames']>, 'textInput'> & {\n dropdownTextInput?: string;\n };\n clearButtonProps?: DropdownClearButtonProps;\n chevronProps?: DropdownChevronProps;\n\n showChevron?: boolean;\n clearable?: boolean;\n closeOnBlur?: boolean;\n};\n\nexport const DropdownTargetTextInput = ({\n classNames,\n clearable,\n showChevron,\n clearButtonProps,\n chevronProps,\n closeOnBlur = true,\n ...props\n}: DropdownTargetTextInputProps) => {\n const { store, value, query, setQuery } = useDropdownContext();\n const isClearable = clearable && (query ?? value?.value ?? '') !== '';\n\n const style = {\n '--dropdown-text-input-right-section-pointer-events': isClearable\n ? 'auto'\n : 'none',\n } as React.CSSProperties;\n\n return (\n <TextInput\n readOnly={false}\n value={query ?? value?.value ?? ''}\n endSlot={\n <DropdownEndSlot\n clearable={isClearable}\n showChevron={showChevron}\n clearButtonProps={clearButtonProps}\n chevronProps={chevronProps}\n />\n }\n onFocus={(e) => {\n e.stopPropagation();\n e.preventDefault();\n store.openDropdown();\n }}\n onBlur={(e) => {\n e.stopPropagation();\n e.preventDefault();\n if (closeOnBlur) {\n store.closeDropdown();\n setQuery(undefined);\n }\n }}\n classNames={{\n textInput: classNames?.dropdownTextInput ?? dropdownTextInput(),\n root: classNames?.root ?? dropdownTextInputRoot(),\n label: classNames?.label ?? dropdownTextInputLabel(),\n description: classNames?.description ?? dropdownTextInputDescription(),\n error: classNames?.error ?? dropdownTextInputError(),\n wrapper: classNames?.wrapper ?? dropdownTextInputWrapper(),\n input: classNames?.input ?? dropdownTextInputInput(),\n section: classNames?.section ?? dropdownTextInputSection(),\n required: classNames?.required ?? dropdownTextInputRequired(),\n }}\n style={style}\n {...props}\n />\n );\n};\n"],"mappings":"~~0gBAiCA~~,MAAa,GAA2B,CACtC,aACA,YACA,cACA,mBACA,eACA,cAAc,GACd,GAAG,KAC+B,CAClC,GAAM,CAAE,QAAO,QAAO,QAAO,YAAa,GAAoB,CACxD,EAAc,IAAc,GAAS,GAAO,OAAS,MAAQ,GAE7D,EAAQ,CACZ,qDAAsD,EAClD,OACA,OACL,CAED,OACE,EAAC,EAAA,CACC,SAAU,GACV,MAAO,GAAS,GAAO,OAAS,~~GAChC~~,QACE,EAAC,EAAA,CACC,UAAW,EACE,cACK,mBACJ,gBACd,CAEJ,QAAU,GAAM,CACd,EAAE,iBAAiB,CACnB,EAAE,gBAAgB,CAClB,EAAM,cAAc,EAEtB,OAAS,GAAM,CACb,EAAE,iBAAiB,CACnB,EAAE,gBAAgB,CACd,IACF,EAAM,eAAe,CACrB,EAAS,IAAA,GAAU,GAGvB,WAAY,CACV,UAAW,GAAY,mBAAqB,GAAmB,CAC/D,KAAM,GAAY,MAAQ,GAAuB,CACjD,MAAO,GAAY,OAAS,GAAwB,CACpD,YAAa,GAAY,aAAe,GAA8B,CACtE,MAAO,GAAY,OAAS,GAAwB,CACpD,QAAS,GAAY,SAAW,GAA0B,CAC1D,MAAO,GAAY,OAAS,GAAwB,CACpD,QAAS,GAAY,SAAW,GAA0B,CAC1D,SAAU,GAAY,UAAY,GAA2B,CAC9D,CACM,QACP,GAAI,GACJ"}
1	+ {"version":3,"file":"DropdownTargetTextInput.mjs","names":[],"sources":["../../../../src/components/controls/dropdown/DropdownTargetTextInput.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport {\n dropdownTextInput,\n dropdownTextInputDescription,\n dropdownTextInputError,\n dropdownTextInputInput,\n dropdownTextInputLabel,\n dropdownTextInputRequired,\n dropdownTextInputRoot,\n dropdownTextInputSection,\n dropdownTextInputWrapper,\n} from '@mage-ui/styled-system/recipes';\n\nimport { TextInput, type TextInputProps } from '../text-input/TextInput';\nimport type { DropdownChevronProps } from './DropdownChevron';\nimport type { DropdownClearButtonProps } from './DropdownClearButton';\nimport { useDropdownContext } from './DropdownContextProvider';\nimport { DropdownEndSlot } from './DropdownEndSlot';\n\nexport type DropdownTargetTextInputProps = Omit<\n TextInputProps,\n 'classNames'\n> & {\n classNames?: Omit<NonNullable<TextInputProps['classNames']>, 'textInput'> & {\n dropdownTextInput?: string;\n };\n clearButtonProps?: DropdownClearButtonProps;\n chevronProps?: DropdownChevronProps;\n\n showChevron?: boolean;\n clearable?: boolean;\n closeOnBlur?: boolean;\n startSlot?: ReactNode;\n};\n\nexport const DropdownTargetTextInput = ({\n classNames,\n clearable,\n showChevron,\n clearButtonProps,\n chevronProps,\n closeOnBlur = true,\n startSlot,\n ...props\n}: DropdownTargetTextInputProps) => {\n const { store, value, query, setQuery } = useDropdownContext();\n const isClearable = clearable && (query ?? value?.value ?? '') !== '';\n\n const style = {\n '--dropdown-text-input-right-section-pointer-events': isClearable\n ? 'auto'\n : 'none',\n } as React.CSSProperties;\n\n return (\n <TextInput\n readOnly={false}\n value={query ?? value?.value ?? ''}\n startSlot={startSlot}\n endSlot={\n <DropdownEndSlot\n clearable={isClearable}\n showChevron={showChevron}\n clearButtonProps={clearButtonProps}\n chevronProps={chevronProps}\n />\n }\n onFocus={(e) => {\n e.stopPropagation();\n e.preventDefault();\n store.openDropdown();\n }}\n onBlur={(e) => {\n e.stopPropagation();\n e.preventDefault();\n if (closeOnBlur) {\n store.closeDropdown();\n setQuery(undefined);\n }\n }}\n classNames={{\n textInput: classNames?.dropdownTextInput ?? dropdownTextInput(),\n root: classNames?.root ?? dropdownTextInputRoot(),\n label: classNames?.label ?? dropdownTextInputLabel(),\n description: classNames?.description ?? dropdownTextInputDescription(),\n error: classNames?.error ?? dropdownTextInputError(),\n wrapper: classNames?.wrapper ?? dropdownTextInputWrapper(),\n input: classNames?.input ?? dropdownTextInputInput(),\n section: classNames?.section ?? dropdownTextInputSection(),\n required: classNames?.required ?? dropdownTextInputRequired(),\n }}\n style={style}\n {...props}\n />\n );\n};\n"],"mappings":"0gBAoCA,MAAa,GAA2B,CACtC,aACA,YACA,cACA,mBACA,eACA,cAAc,GACd,YACA,GAAG,KAC+B,CAClC,GAAM,CAAE,QAAO,QAAO,QAAO,YAAa,GAAoB,CACxD,EAAc,IAAc,GAAS,GAAO,OAAS,MAAQ,GAE7D,EAAQ,CACZ,qDAAsD,EAClD,OACA,OACL,CAED,OACE,EAAC,EAAA,CACC,SAAU,GACV,MAAO,GAAS,GAAO,OAAS,GACrB,YACX,QACE,EAAC,EAAA,CACC,UAAW,EACE,cACK,mBACJ,gBACd,CAEJ,QAAU,GAAM,CACd,EAAE,iBAAiB,CACnB,EAAE,gBAAgB,CAClB,EAAM,cAAc,EAEtB,OAAS,GAAM,CACb,EAAE,iBAAiB,CACnB,EAAE,gBAAgB,CACd,IACF,EAAM,eAAe,CACrB,EAAS,IAAA,GAAU,GAGvB,WAAY,CACV,UAAW,GAAY,mBAAqB,GAAmB,CAC/D,KAAM,GAAY,MAAQ,GAAuB,CACjD,MAAO,GAAY,OAAS,GAAwB,CACpD,YAAa,GAAY,aAAe,GAA8B,CACtE,MAAO,GAAY,OAAS,GAAwB,CACpD,QAAS,GAAY,SAAW,GAA0B,CAC1D,MAAO,GAAY,OAAS,GAAwB,CACpD,QAAS,GAAY,SAAW,GAA0B,CAC1D,SAAU,GAAY,UAAY,GAA2B,CAC9D,CACM,QACP,GAAI,GACJ"}

package/dist/components/controls/dropdown/combobox/Combobox.d.mts CHANGED Viewed

@@ -3,6 +3,7 @@ import { ComboboxCreatableOptionProps } from "./ComboboxCreatableOption.mjs";
 import { ComboboxEmptyOptionProps } from "./ComboboxEmptyOption.mjs";
 import { ComboboxTargetProps } from "./ComboboxTarget.mjs";
 import * as react_jsx_runtime0 from "react/jsx-runtime";
+import { ReactNode } from "react";
 //#region src/components/controls/dropdown/combobox/Combobox.d.ts
 type ComboboxProps = Omit<DropdownProps, 'classNames' | 'target' | 'children'> & {
@@ -11,6 +12,7 @@ type ComboboxProps = Omit<DropdownProps, 'classNames' | 'target' | 'children'> &
   creatable?: boolean;
   emptyText?: string;
   clearButtonText?: string;
+  startSlot?: ReactNode;
   classNames?: DropdownProps['classNames'] & {
     creatable?: ComboboxCreatableOptionProps['classNames'];
     empty?: ComboboxEmptyOptionProps['classNames'];
@@ -27,6 +29,7 @@ declare const Combobox: ({
   creatable,
   clearButtonText,
   emptyText,
+  startSlot,
   classNames,
   ...props
 }: ComboboxProps) => react_jsx_runtime0.JSX.Element;

package/dist/components/controls/dropdown/combobox/Combobox.d.mts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Combobox.d.mts","names":[],"sources":["../../../../../src/components/controls/dropdown/combobox/Combobox.tsx"],"mappings":"~~;;;;;;;KAqCY~~,aAAA,GAAgB,IAAA,CAC1B,aAAA;EAGA,KAAA;EACA,WAAA;EACA,SAAA;EACA,SAAA;EACA,eAAA;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,SAAA;EAAA,eAAA;EAAA,SAAA;EAAA,UAAA;EAAA,GAAA;AAAA,~~GAQtB~~,aAAA,KAAa,kBAAA,CAAA,GAAA,CAAA,OAAA"}
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;EACA,WAAA;EACA,SAAA;EACA,SAAA;EACA,eAAA;EACA,SAAA,GAAY,SAAA;EACZ,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,SAAA;EAAA,eAAA;EAAA,SAAA;EAAA,SAAA;EAAA,UAAA;EAAA,GAAA;AAAA,GAStB,aAAA,KAAa,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/controls/dropdown/combobox/Combobox.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-import{Dropdown as e}from"../Dropdown.mjs";import{ComboboxOptions as t}from"./ComboboxOptions.mjs";import{ComboboxTarget as ee}from"./ComboboxTarget.mjs";import{combobox as n,comboboxChevron as r,comboboxChevronIcon as i,comboboxChevronIconRoot as a,comboboxChevronRoot as o,comboboxClearButton as s,comboboxClearButtonIcon as c,comboboxClearButtonIconRaw as l,comboboxClearButtonIconRawRoot as u,comboboxClearButtonRoot as d,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,placeholder:M,creatable:N,clearButtonText:P,emptyText:F=`No results`,classNames:I,...L})=>{let{creatable:R,empty:z,target:B,scrollArea:V,...H}=I||{},{clearButton:U,chevron:W,...G}=B||{},K={placeholder:M,label:j,classNames:{dropdownTextInput:G?.dropdownTextInput??x(),root:G?.root??D(),label:G?.label??T(),description:G?.description??S(),error:G?.error??C(),wrapper:G?.wrapper??k(),input:G?.input??w(),section:G?.section??O(),required:G?.required??E()},clearButtonProps:{label:P,classNames:{clearButton:U?.clearButton??s(),root:U?.root??d(),icon:U?.icon??c(),iconRaw:{iconRaw:U?.iconRaw?.iconRaw??l(),root:U?.iconRaw?.root??u()}}},chevronProps:{classNames:{chevron:W?.chevron??r(),root:W?.root??o(),open:{iconRaw:W?.open?.iconRaw??i(),root:W?.open?.root??a()},close:{iconRaw:W?.close?.iconRaw??i(),root:W?.close?.root??a()}}}},q=H?.dropdown??n(),J=H?.root??y(),Y=H?.options??v(),X=H?.option??p(),Z=z?.empty??f(),Q=H?.search,$={emptyText:F,classNames:{empty:z?.empty??Z}},te={creatable:N??!1,classNames:{create:R?.create,createIcon:{createIcon:R?.createIcon?.createIcon??m(),root:R?.createIcon?.root??_(),iconRaw:{iconRaw:R?.createIcon?.iconRaw?.iconRaw??h(),root:R?.createIcon?.iconRaw?.root??g()}}}};return A(e,{classNames:{dropdown:q,root:J,options:Y,option:X,empty:Z,search:Q},scrollAreaProps:{classNames:{dropdownScrollAreaAutosize:V?.dropdownScrollAreaAutosize??b()}},target:A(ee,{...K}),...L,children:A(t,{emptyProps:$,creatableProps:te})})};export{j as Combobox};
+import{Dropdown as e}from"../Dropdown.mjs";import{ComboboxOptions as t}from"./ComboboxOptions.mjs";import{ComboboxTarget as ee}from"./ComboboxTarget.mjs";import{combobox as n,comboboxChevron as r,comboboxChevronIcon as i,comboboxChevronIconRoot as a,comboboxChevronRoot as o,comboboxClearButton as s,comboboxClearButtonIcon as c,comboboxClearButtonIconRaw as l,comboboxClearButtonIconRawRoot as u,comboboxClearButtonRoot as d,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,placeholder:M,creatable:N,clearButtonText:P,emptyText:F=`No results`,startSlot:I,classNames:L,...R})=>{let{creatable:z,empty:B,target:V,scrollArea:H,...U}=L||{},{clearButton:W,chevron:G,...K}=V||{},q={placeholder:M,label:j,startSlot:I,classNames:{dropdownTextInput:K?.dropdownTextInput??x(),root:K?.root??D(),label:K?.label??T(),description:K?.description??S(),error:K?.error??C(),wrapper:K?.wrapper??k(),input:K?.input??w(),section:K?.section??O(),required:K?.required??E()},clearButtonProps:{label:P,classNames:{clearButton:W?.clearButton??s(),root:W?.root??d(),icon:W?.icon??c(),iconRaw:{iconRaw:W?.iconRaw?.iconRaw??l(),root:W?.iconRaw?.root??u()}}},chevronProps:{classNames:{chevron:G?.chevron??r(),root:G?.root??o(),open:{iconRaw:G?.open?.iconRaw??i(),root:G?.open?.root??a()},close:{iconRaw:G?.close?.iconRaw??i(),root:G?.close?.root??a()}}}},J=U?.dropdown??n(),Y=U?.root??y(),X=U?.options??v(),Z=U?.option??p(),Q=B?.empty??f(),$=U?.search,te={emptyText:F,classNames:{empty:B?.empty??Q}},ne={creatable:N??!1,classNames:{create:z?.create,createIcon:{createIcon:z?.createIcon?.createIcon??m(),root:z?.createIcon?.root??_(),iconRaw:{iconRaw:z?.createIcon?.iconRaw?.iconRaw??h(),root:z?.createIcon?.iconRaw?.root??g()}}}};return A(e,{classNames:{dropdown:J,root:Y,options:X,option:Z,empty:Q,search:$},scrollAreaProps:{classNames:{dropdownScrollAreaAutosize:H?.dropdownScrollAreaAutosize??b()}},target:A(ee,{...q}),...R,children:A(t,{emptyProps:te,creatableProps:ne})})};export{j as Combobox};
 //# sourceMappingURL=Combobox.mjs.map

package/dist/components/controls/dropdown/combobox/Combobox.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Combobox.mjs","names":[],"sources":["../../../../../src/components/controls/dropdown/combobox/Combobox.tsx"],"sourcesContent":["import {\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?: string;\n placeholder?: string;\n creatable?: boolean;\n emptyText?: string;\n clearButtonText?: 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 placeholder,\n creatable,\n clearButtonText,\n emptyText = 'No results',\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 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 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/~~BA2DA~~,MAAa,GAAY,CACvB,QACA,cACA,YACA,kBACA,YAAY,aACZ,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,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,GAAyB,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,EAAoB,GAAoB,UAAY,GAAU,CAC9D,EAAgB,GAAoB,MAAQ,GAAc,CAC1D,EAAmB,GAAoB,SAAW,GAAiB,CACnE,EAAkB,GAAoB,QAAU,GAAgB,CAChE,EAAiB,GAAiB,OAAS,GAAe,CAC1D,EAAkB,GAAoB,OAEtC,~~EAAa~~,CACjB,YACA,WAAY,CACV,MAAO,GAAiB,OAAS,EAClC,CACF,CAEK,GAAiB,CACrB,UAAW,GAAa,GACxB,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,EAAA,CACC,WAAY,CACV,SAAU,EACV,KAAM,EACN,QAAS,EACT,OAAQ,EACR,MAAO,EACP,OAAQ,EACT,CACD,gBAAiB,CACf,WAAY,CACV,2BACE,GAAsB,4BACtB,GAA4B,CAC/B,CACF,CACD,OAAQ,EAAC,GAAA,CAAe,GAAI,EAAA,CAAe,CAC3C,GAAI,WAEJ,EAAC,EAAA,CACa,~~aACI~~,mBAChB,EACO"}
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?: string;\n placeholder?: string;\n creatable?: boolean;\n emptyText?: string;\n clearButtonText?: string;\n startSlot?: ReactNode;\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 placeholder,\n creatable,\n clearButtonText,\n emptyText = 'No results',\n startSlot,\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 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 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/BA8DA,MAAa,GAAY,CACvB,QACA,cACA,YACA,kBACA,YAAY,aACZ,YACA,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,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,GAAyB,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,EAAoB,GAAoB,UAAY,GAAU,CAC9D,EAAgB,GAAoB,MAAQ,GAAc,CAC1D,EAAmB,GAAoB,SAAW,GAAiB,CACnE,EAAkB,GAAoB,QAAU,GAAgB,CAChE,EAAiB,GAAiB,OAAS,GAAe,CAC1D,EAAkB,GAAoB,OAEtC,GAAa,CACjB,YACA,WAAY,CACV,MAAO,GAAiB,OAAS,EAClC,CACF,CAEK,GAAiB,CACrB,UAAW,GAAa,GACxB,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,EAAA,CACC,WAAY,CACV,SAAU,EACV,KAAM,EACN,QAAS,EACT,OAAQ,EACR,MAAO,EACP,OAAQ,EACT,CACD,gBAAiB,CACf,WAAY,CACV,2BACE,GAAsB,4BACtB,GAA4B,CAC/B,CACF,CACD,OAAQ,EAAC,GAAA,CAAe,GAAI,EAAA,CAAe,CAC3C,GAAI,WAEJ,EAAC,EAAA,CACa,cACI,mBAChB,EACO"}

package/dist/components/controls/dropdown/select/Select.d.mts CHANGED Viewed

@@ -15,6 +15,7 @@ type SelectProps = Omit<DropdownProps, 'children' | 'classNames' | 'target'> & {
   searchPlaceholder?: string;
   searchStartSlot?: ReactNode;
   searchClassNames?: SelectSearchClassNames;
+  startSlot?: ReactNode;
   classNames?: DropdownProps['classNames'] & {
     target?: ComboboxTargetProps['classNames'] & {
       clearButton?: NonNullable<ComboboxTargetProps['clearButtonProps']>['classNames'];
@@ -33,6 +34,7 @@ declare const Select: ({
   searchPlaceholder,
   searchStartSlot,
   searchClassNames,
+  startSlot,
   classNames,
   ...props
 }: SelectProps) => react_jsx_runtime0.JSX.Element;

package/dist/components/controls/dropdown/select/Select.d.mts.map CHANGED Viewed

	@@ -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;EACA,WAAA;EACA,SAAA;EACA,eAAA;EACA,SAAA;EACA,UAAA;EACA,iBAAA;EACA,eAAA,GAAkB,SAAA;EAClB,gBAAA,GAAmB,sBAAA;EACnB,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,SAAA;EAAA,eAAA;EAAA,SAAA;EAAA,UAAA;EAAA,iBAAA;EAAA,eAAA;EAAA,gBAAA;EAAA,UAAA;EAAA,GAAA;AAAA,~~GAYpB~~,WAAA,KAAW,kBAAA,CAAA,GAAA,CAAA,OAAA"}
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;EACA,WAAA;EACA,SAAA;EACA,eAAA;EACA,SAAA;EACA,UAAA;EACA,iBAAA;EACA,eAAA,GAAkB,SAAA;EAClB,gBAAA,GAAmB,sBAAA;EACnB,SAAA,GAAY,SAAA;EACZ,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,SAAA;EAAA,eAAA;EAAA,SAAA;EAAA,UAAA;EAAA,iBAAA;EAAA,eAAA;EAAA,gBAAA;EAAA,SAAA;EAAA,UAAA;EAAA,GAAA;AAAA,GAapB,WAAA,KAAW,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/controls/dropdown/select/Select.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-import{Dropdown as e}from"../Dropdown.mjs";import{ComboboxOptions as t}from"../combobox/ComboboxOptions.mjs";import{ComboboxTarget as n}from"../combobox/ComboboxTarget.mjs";import{SelectSearch as r}from"./SelectSearch.mjs";import{select as i,selectChevron as a,selectChevronIcon as o,selectChevronIconRoot as s,selectChevronRoot as c,selectClearButton as l,selectClearButtonIcon as u,selectClearButtonIconRaw as d,selectClearButtonIconRawRoot as f,selectClearButtonRoot as p,selectEmpty as m,selectOption as h,selectOptions as g,selectRoot as _,selectScrollAreaAutosize as v,selectSearchInput as y,selectSearchSection as b,selectSearchWrapper as x,selectTextInput as S,selectTextInputDescription as C,selectTextInputError as w,selectTextInputInput as T,selectTextInputLabel as E,selectTextInputRequired as D,selectTextInputRoot as O,selectTextInputSection as k,selectTextInputWrapper as A}from"@mage-ui/styled-system/recipes";import{jsx as j}from"react/jsx-runtime";const M=({label:M,placeholder:N,clearable:P=!0,clearButtonText:F,emptyText:I,searchable:L,searchPlaceholder:R,searchStartSlot:z,searchClassNames:B,classNames:V,...H})=>{let{target:U,scrollArea:W,...G}=V||{},{clearButton:K,chevron:q,...J}=U||{},Y=I??(L?`No results`:void 0),X={placeholder:N,label:M,clearable:P,readOnly:!0,closeOnBlur:!L,classNames:{dropdownTextInput:J?.dropdownTextInput??S(),root:J?.root??O(),label:J?.label??E(),description:J?.description??C(),error:J?.error??w(),wrapper:J?.wrapper??A(),input:J?.input??T(),section:J?.section??k(),required:J?.required??D()},clearButtonProps:{label:F,classNames:{clearButton:K?.clearButton??l(),root:K?.root??p(),icon:K?.icon??u(),iconRaw:{iconRaw:K?.iconRaw?.iconRaw??d(),root:K?.iconRaw?.root??f()}}},chevronProps:{classNames:{chevron:q?.chevron??a(),root:q?.root??c(),open:{iconRaw:q?.open?.iconRaw??o(),root:q?.open?.root??s()},close:{iconRaw:q?.close?.iconRaw??o(),root:q?.close?.root??s()}}}};return j(e,{"data-searchable":L,classNames:{dropdown:G?.dropdown??i(),root:G?.root??_(),options:G?.options??g(),option:G?.option??h(),empty:G?.empty??m(),search:G?.search},scrollAreaProps:{classNames:{dropdownScrollAreaAutosize:W?.dropdownScrollAreaAutosize??v()}},target:j(n,{...X}),dropdownTopSlot:L&&j(r,{searchPlaceholder:R,startSlot:z,classNames:{input:B?.input??y(),wrapper:B?.wrapper??x(),section:B?.section??b()}}),...H,children:j(t,{emptyProps:{emptyText:Y,classNames:{empty:G?.empty??m()}},creatableProps:{creatable:!1}})})};export{M as Select};
+import{Dropdown as e}from"../Dropdown.mjs";import{ComboboxOptions as t}from"../combobox/ComboboxOptions.mjs";import{ComboboxTarget as n}from"../combobox/ComboboxTarget.mjs";import{SelectSearch as r}from"./SelectSearch.mjs";import{select as i,selectChevron as a,selectChevronIcon as o,selectChevronIconRoot as s,selectChevronRoot as c,selectClearButton as l,selectClearButtonIcon as u,selectClearButtonIconRaw as d,selectClearButtonIconRawRoot as f,selectClearButtonRoot as p,selectEmpty as m,selectOption as h,selectOptions as g,selectRoot as _,selectScrollAreaAutosize as v,selectSearchInput as y,selectSearchSection as b,selectSearchWrapper as x,selectTextInput as S,selectTextInputDescription as C,selectTextInputError as w,selectTextInputInput as T,selectTextInputLabel as E,selectTextInputRequired as D,selectTextInputRoot as O,selectTextInputSection as k,selectTextInputWrapper as A}from"@mage-ui/styled-system/recipes";import{jsx as j}from"react/jsx-runtime";const M=({label:M,placeholder:N,clearable:P=!0,clearButtonText:F,emptyText:I,searchable:L,searchPlaceholder:R,searchStartSlot:z,searchClassNames:B,startSlot:V,classNames:H,...U})=>{let{target:W,scrollArea:G,...K}=H||{},{clearButton:q,chevron:J,...Y}=W||{},X=I??(L?`No results`:void 0),Z={placeholder:N,label:M,clearable:P,readOnly:!0,closeOnBlur:!L,startSlot:V,classNames:{dropdownTextInput:Y?.dropdownTextInput??S(),root:Y?.root??O(),label:Y?.label??E(),description:Y?.description??C(),error:Y?.error??w(),wrapper:Y?.wrapper??A(),input:Y?.input??T(),section:Y?.section??k(),required:Y?.required??D()},clearButtonProps:{label:F,classNames:{clearButton:q?.clearButton??l(),root:q?.root??p(),icon:q?.icon??u(),iconRaw:{iconRaw:q?.iconRaw?.iconRaw??d(),root:q?.iconRaw?.root??f()}}},chevronProps:{classNames:{chevron:J?.chevron??a(),root:J?.root??c(),open:{iconRaw:J?.open?.iconRaw??o(),root:J?.open?.root??s()},close:{iconRaw:J?.close?.iconRaw??o(),root:J?.close?.root??s()}}}};return j(e,{"data-searchable":L,classNames:{dropdown:K?.dropdown??i(),root:K?.root??_(),options:K?.options??g(),option:K?.option??h(),empty:K?.empty??m(),search:K?.search},scrollAreaProps:{classNames:{dropdownScrollAreaAutosize:G?.dropdownScrollAreaAutosize??v()}},target:j(n,{...Z}),dropdownTopSlot:L&&j(r,{searchPlaceholder:R,startSlot:z,classNames:{input:B?.input??y(),wrapper:B?.wrapper??x(),section:B?.section??b()}}),...U,children:j(t,{emptyProps:{emptyText:X,classNames:{empty:K?.empty??m()}},creatableProps:{creatable:!1}})})};export{M as Select};
 //# sourceMappingURL=Select.mjs.map

package/dist/components/controls/dropdown/select/Select.mjs.map CHANGED Viewed

	@@ -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?: string;\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 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 placeholder,\n clearable = true,\n clearButtonText,\n emptyText,\n searchable,\n searchPlaceholder,\n searchStartSlot,\n searchClassNames,\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 clearable,\n readOnly: true,\n closeOnBlur: !searchable,\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":"~~s8BA8DA~~,MAAa,GAAU,CACrB,QACA,cACA,YAAY,GACZ,kBACA,YACA,aACA,oBACA,kBACA,mBACA,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,EACJ,IAAc,EAAa,aAAe,IAAA,IAEtC,EAAc,CAClB,cACA,QACA,YACA,SAAU,GACV,YAAa,CAAC,EACd,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,EAAA,CACC,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,EAAA,CAAe,GAAI,EAAA,CAAe,CAC3C,gBACE,GACE,EAAC,EAAA,CACoB,oBACnB,UAAW,EACX,WAAY,CACV,MAAO,GAAkB,OAAS,GAAmB,CACrD,QAAS,GAAkB,SAAW,GAAqB,CAC3D,QAAS,GAAkB,SAAW,GAAqB,CAC5D,EACD,CAGN,GAAI,WAEJ,EAAC,EAAA,CACC,WAAY,CACV,UAAW,EACX,WAAY,CACV,MAAO,GAAoB,OAAS,GAAa,CAClD,CACF,CACD,eAAgB,CACd,UAAW,GACZ,EACD,EACO"}
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?: string;\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 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 placeholder,\n clearable = true,\n clearButtonText,\n emptyText,\n searchable,\n searchPlaceholder,\n searchStartSlot,\n searchClassNames,\n startSlot,\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 clearable,\n readOnly: true,\n closeOnBlur: !searchable,\n startSlot,\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":"s8BA+DA,MAAa,GAAU,CACrB,QACA,cACA,YAAY,GACZ,kBACA,YACA,aACA,oBACA,kBACA,mBACA,YACA,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,EACJ,IAAc,EAAa,aAAe,IAAA,IAEtC,EAAc,CAClB,cACA,QACA,YACA,SAAU,GACV,YAAa,CAAC,EACd,YACA,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,EAAA,CACC,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,EAAA,CAAe,GAAI,EAAA,CAAe,CAC3C,gBACE,GACE,EAAC,EAAA,CACoB,oBACnB,UAAW,EACX,WAAY,CACV,MAAO,GAAkB,OAAS,GAAmB,CACrD,QAAS,GAAkB,SAAW,GAAqB,CAC3D,QAAS,GAAkB,SAAW,GAAqB,CAC5D,EACD,CAGN,GAAI,WAEJ,EAAC,EAAA,CACC,WAAY,CACV,UAAW,EACX,WAAY,CACV,MAAO,GAAoB,OAAS,GAAa,CAClD,CACF,CACD,eAAgB,CACd,UAAW,GACZ,EACD,EACO"}

package/dist/components/data-display/datatables/DataTable.d.mts ADDED Viewed

@@ -0,0 +1,103 @@
+import { TableClassNames, TableProps } from "../table/TableRoot.mjs";
+import "../table/Table.mjs";
+import { DataTableSlots } from "./DataTableSlotRow.mjs";
+import { DataTableLabels } from "./useDataTableContext.mjs";
+import { ReactNode } from "react";
+import { ColumnDef, ExpandedState, OnChangeFn, PaginationState, RowSelectionState, SortingState, TableOptions } from "@tanstack/react-table";
+//#region src/components/data-display/datatables/DataTable.d.ts
+type DataTableRecord = Record<string, unknown>;
+type DataTableSortingConfig = {
+  state: SortingState;
+  onChange: OnChangeFn<SortingState>;
+};
+type DataTablePaginationConfig = {
+  currentPage: number;
+  pageSize: number;
+  onChange: OnChangeFn<PaginationState>;
+  pageCount: number;
+  rowCount?: number;
+};
+type DataTableColumnMeta = {
+  classNames?: {
+    header?: string;
+    cell?: string;
+  };
+};
+type DataTableSelectionConfig<Data = unknown> = {
+  state: RowSelectionState;
+  onChange: OnChangeFn<RowSelectionState>;
+  getRowId?: (row: Data) => string;
+  isRowDisabled?: (row: Data) => boolean;
+  bulkActions?: (selectedIds: string[]) => ReactNode;
+};
+type DataTableExpansionConfig<Data = unknown> = {
+  state: ExpandedState;
+  onChange: OnChangeFn<ExpandedState>;
+  renderContent: (row: Data) => ReactNode;
+};
+type DataTableSearchConfig = {
+  placeholder?: string;
+  label?: string;
+};
+type DataTableFiltersConfig = {
+  initial: Record<string, unknown>;
+  render: (filters: Record<string, unknown>, onChange: (next: Record<string, unknown>) => void) => ReactNode;
+};
+type DataTableTableConfig = Omit<TableProps, 'children' | 'classNames'>;
+type DataTableClassNames = {
+  dataTable?: string;
+  root?: string;
+  viewport?: string;
+  header?: string;
+  sortButton?: string;
+  expandButton?: string;
+  slotRow?: string;
+  bulkBar?: string;
+  loading?: string;
+  empty?: string;
+  expandedContent?: string;
+  skeleton?: string;
+  table?: TableClassNames;
+};
+type DataTableManagedOptions<Data> = Partial<Omit<TableOptions<Data>, 'columns' | 'data' | 'onExpandedChange' | 'onPaginationChange' | 'onRowSelectionChange' | 'onSortingChange'>>;
+type DataTableExtraColumnConfig<Data> = {
+  column: ColumnDef<Data, unknown>;
+  position?: number;
+};
+type DataTableProps<Data> = {
+  data: Data[];
+  columns: ColumnDef<Data, unknown>[];
+  extraColumns?: DataTableExtraColumnConfig<Data>[];
+  sorting?: DataTableSortingConfig;
+  pagination?: DataTablePaginationConfig;
+  selection?: DataTableSelectionConfig<Data>;
+  expansion?: DataTableExpansionConfig<Data>;
+  loading?: boolean;
+  skeleton?: number;
+  onRefresh?: () => void | Promise<void>;
+  slots?: DataTableSlots;
+  classNames?: DataTableClassNames;
+  options?: DataTableManagedOptions<Data>;
+  labels?: Partial<DataTableLabels>;
+} & DataTableTableConfig;
+declare const DataTable: <Data>({
+  classNames,
+  slots,
+  loading,
+  skeleton,
+  pagination,
+  selection,
+  expansion,
+  data,
+  columns,
+  extraColumns,
+  sorting,
+  onRefresh,
+  options,
+  labels,
+  ...tableProps
+}: DataTableProps<Data>) => ReactNode;
+//#endregion
+export { DataTable, DataTableClassNames, DataTableColumnMeta, DataTableExpansionConfig, DataTableExtraColumnConfig, DataTableFiltersConfig, DataTablePaginationConfig, DataTableProps, DataTableRecord, DataTableSearchConfig, DataTableSelectionConfig, DataTableSortingConfig, DataTableTableConfig };
+//# sourceMappingURL=DataTable.d.mts.map

package/dist/components/data-display/datatables/DataTable.d.mts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"DataTable.d.mts","names":[],"sources":["../../../../src/components/data-display/datatables/DataTable.tsx"],"mappings":";;;;;;;;KA2BY,eAAA,GAAkB,MAAA;AAAA,KAElB,sBAAA;EACV,KAAA,EAAO,YAAA;EACP,QAAA,EAAU,UAAA,CAAW,YAAA;AAAA;AAAA,KAGX,yBAAA;EACV,WAAA;EACA,QAAA;EACA,QAAA,EAAU,UAAA,CAAW,eAAA;EACrB,SAAA;EACA,QAAA;AAAA;AAAA,KAGU,mBAAA;EACV,UAAA;IACE,MAAA;IACA,IAAA;EAAA;AAAA;AAAA,KAIQ,wBAAA;EACV,KAAA,EAAO,iBAAA;EACP,QAAA,EAAU,UAAA,CAAW,iBAAA;EACrB,QAAA,IAAY,GAAA,EAAK,IAAA;EACjB,aAAA,IAAiB,GAAA,EAAK,IAAA;EACtB,WAAA,IAAe,WAAA,eAA0B,SAAA;AAAA;AAAA,KAG/B,wBAAA;EACV,KAAA,EAAO,aAAA;EACP,QAAA,EAAU,UAAA,CAAW,aAAA;EACrB,aAAA,GAAgB,GAAA,EAAK,IAAA,KAAS,SAAA;AAAA;AAAA,KAGpB,qBAAA;EACV,WAAA;EACA,KAAA;AAAA;AAAA,KAGU,sBAAA;EACV,OAAA,EAAS,MAAA;EACT,MAAA,GACE,OAAA,EAAS,MAAA,mBACT,QAAA,GAAW,IAAA,EAAM,MAAA,+BACd,SAAA;AAAA;AAAA,KAGK,oBAAA,GAAuB,IAAA,CAAK,UAAA;AAAA,KAE5B,mBAAA;EACV,SAAA;EACA,IAAA;EACA,QAAA;EACA,MAAA;EACA,UAAA;EACA,YAAA;EACA,OAAA;EACA,OAAA;EACA,OAAA;EACA,KAAA;EACA,eAAA;EACA,QAAA;EACA,KAAA,GAAQ,eAAA;AAAA;AAAA,KAGL,uBAAA,SAAgC,OAAA,CACnC,IAAA,CACE,YAAA,CAAa,IAAA;AAAA,KAUL,0BAAA;EACV,MAAA,EAAQ,SAAA,CAAU,IAAA;EAClB,QAAA;AAAA;AAAA,KAGU,cAAA;EACV,IAAA,EAAM,IAAA;EACN,OAAA,EAAS,SAAA,CAAU,IAAA;EACnB,YAAA,GAAe,0BAAA,CAA2B,IAAA;EAC1C,OAAA,GAAU,sBAAA;EACV,UAAA,GAAa,yBAAA;EACb,SAAA,GAAY,wBAAA,CAAyB,IAAA;EACrC,SAAA,GAAY,wBAAA,CAAyB,IAAA;EACrC,OAAA;EACA,QAAA;EACA,SAAA,gBAAyB,OAAA;EACzB,KAAA,GAAQ,cAAA;EACR,UAAA,GAAa,mBAAA;EACb,OAAA,GAAU,uBAAA,CAAwB,IAAA;EAClC,MAAA,GAAS,OAAA,CAAQ,eAAA;AAAA,IACf,oBAAA;AAAA,cAES,SAAA;EAAoB,UAAA;EAAA,KAAA;EAAA,OAAA;EAAA,QAAA;EAAA,UAAA;EAAA,SAAA;EAAA,SAAA;EAAA,IAAA;EAAA,OAAA;EAAA,YAAA;EAAA,OAAA;EAAA,SAAA;EAAA,OAAA;EAAA,MAAA;EAAA,GAAA;AAAA,GAgB9B,cAAA,CAAe,IAAA,MAAQ,SAAA"}

package/dist/components/data-display/datatables/DataTable.mjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{Table as e}from"../table/Table.mjs";import{DataTableBody as t}from"./DataTableBody.mjs";import{DataTableContextProvider as n}from"./useDataTableContext.mjs";import{DataTableBulkBar as r}from"./DataTableBulkBar.mjs";import{DataTableHeader as i}from"./DataTableHeader.mjs";import{DataTableRootContainer as a}from"./DataTableRootContainer.mjs";import{DataTableSkeleton as o}from"./DataTableSkeleton.mjs";import{DataTableSlotRow as s}from"./DataTableSlotRow.mjs";import{DataTableViewport as c}from"./DataTableViewport.mjs";import{useDataTable as l}from"./useDataTable.mjs";import{jsx as u,jsxs as d}from"react/jsx-runtime";const f=({classNames:f,slots:p,loading:m,skeleton:h,pagination:g,selection:_,expansion:v,data:y,columns:b,extraColumns:x,sorting:S,onRefresh:C,options:w,labels:T,...E})=>{let{layout:D,contextValue:O,table:k}=l({data:y,columns:b,extraColumns:x,sorting:S,onRefresh:C,options:w,labels:T,classNames:f,loading:m,skeleton:h,pagination:g,selection:_,expansion:v,...E});return u(n,{value:O,children:d(a,{busy:m,classNames:f,children:[u(s,{classNames:{root:f?.slotRow},children:p?.top}),u(c,{className:f?.viewport,children:h!=null&&y.length===0?u(o,{rows:h,className:f?.skeleton}):d(e,{...E,layout:D,classNames:f?.table,children:[u(i,{loading:m,classNames:f,headerGroups:k.getHeaderGroups(),totalSize:k.getTotalSize()}),u(t,{rows:k.getRowModel().rows,colCount:k.getVisibleLeafColumns().length,loading:m,empty:p?.empty,emptyClassName:f?.empty,expandedContentClassName:f?.expandedContent,expansion:v,selection:_})]})}),u(s,{classNames:{root:f?.slotRow},children:p?.bottom}),u(r,{selectedIds:O.selectedIds,className:f?.bulkBar,selection:_})]})})};export{f as DataTable};
2	+ //# sourceMappingURL=DataTable.mjs.map

package/dist/components/data-display/datatables/DataTable.mjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"DataTable.mjs","names":[],"sources":["../../../../src/components/data-display/datatables/DataTable.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport type {\n ColumnDef,\n ExpandedState,\n OnChangeFn,\n PaginationState,\n RowSelectionState,\n SortingState,\n TableOptions,\n} from '@tanstack/react-table';\n\nimport { Table, type TableClassNames, type TableProps } from '../table/Table';\nimport { DataTableBody } from './DataTableBody';\nimport { DataTableBulkBar } from './DataTableBulkBar';\nimport { DataTableHeader } from './DataTableHeader';\nimport { DataTableRootContainer } from './DataTableRootContainer';\nimport { DataTableSkeleton } from './DataTableSkeleton';\nimport { DataTableSlotRow, type DataTableSlots } from './DataTableSlotRow';\nimport { DataTableViewport } from './DataTableViewport';\nimport { useDataTable } from './useDataTable';\nimport {\n DataTableContextProvider,\n type DataTableContextValue,\n type DataTableLabels,\n} from './useDataTableContext';\n\nexport type DataTableRecord = Record<string, unknown>;\n\nexport type DataTableSortingConfig = {\n state: SortingState;\n onChange: OnChangeFn<SortingState>;\n};\n\nexport type DataTablePaginationConfig = {\n currentPage: number;\n pageSize: number;\n onChange: OnChangeFn<PaginationState>;\n pageCount: number;\n rowCount?: number;\n};\n\nexport type DataTableColumnMeta = {\n classNames?: {\n header?: string;\n cell?: string;\n };\n};\n\nexport type DataTableSelectionConfig<Data = unknown> = {\n state: RowSelectionState;\n onChange: OnChangeFn<RowSelectionState>;\n getRowId?: (row: Data) => string;\n isRowDisabled?: (row: Data) => boolean;\n bulkActions?: (selectedIds: string[]) => ReactNode;\n};\n\nexport type DataTableExpansionConfig<Data = unknown> = {\n state: ExpandedState;\n onChange: OnChangeFn<ExpandedState>;\n renderContent: (row: Data) => ReactNode;\n};\n\nexport type DataTableSearchConfig = {\n placeholder?: string;\n label?: string;\n};\n\nexport type DataTableFiltersConfig = {\n initial: Record<string, unknown>;\n render: (\n filters: Record<string, unknown>,\n onChange: (next: Record<string, unknown>) => void,\n ) => ReactNode;\n};\n\nexport type DataTableTableConfig = Omit<TableProps, 'children' | 'classNames'>;\n\nexport type DataTableClassNames = {\n dataTable?: string;\n root?: string;\n viewport?: string;\n header?: string;\n sortButton?: string;\n expandButton?: string;\n slotRow?: string;\n bulkBar?: string;\n loading?: string;\n empty?: string;\n expandedContent?: string;\n skeleton?: string;\n table?: TableClassNames;\n};\n\ntype DataTableManagedOptions<Data> = Partial<\n Omit<\n TableOptions<Data>,\n | 'columns'\n | 'data'\n | 'onExpandedChange'\n | 'onPaginationChange'\n | 'onRowSelectionChange'\n | 'onSortingChange'\n >\n>;\n\nexport type DataTableExtraColumnConfig<Data> = {\n column: ColumnDef<Data, unknown>;\n position?: number;\n};\n\nexport type DataTableProps<Data> = {\n data: Data[];\n columns: ColumnDef<Data, unknown>[];\n extraColumns?: DataTableExtraColumnConfig<Data>[];\n sorting?: DataTableSortingConfig;\n pagination?: DataTablePaginationConfig;\n selection?: DataTableSelectionConfig<Data>;\n expansion?: DataTableExpansionConfig<Data>;\n loading?: boolean;\n skeleton?: number;\n onRefresh?: () => void | Promise<void>;\n slots?: DataTableSlots;\n classNames?: DataTableClassNames;\n options?: DataTableManagedOptions<Data>;\n labels?: Partial<DataTableLabels>;\n} & DataTableTableConfig;\n\nexport const DataTable = <Data,>({\n classNames,\n slots,\n loading,\n skeleton,\n pagination,\n selection,\n expansion,\n data,\n columns,\n extraColumns,\n sorting,\n onRefresh,\n options,\n labels,\n ...tableProps\n}: DataTableProps<Data>): ReactNode => {\n const { layout, contextValue, table } = useDataTable({\n data,\n columns,\n extraColumns,\n sorting,\n onRefresh,\n options,\n labels,\n classNames,\n loading,\n skeleton,\n pagination,\n selection,\n expansion,\n ...tableProps,\n });\n\n return (\n <DataTableContextProvider\n value={contextValue as DataTableContextValue<unknown>}\n >\n <DataTableRootContainer busy={loading} classNames={classNames}>\n <DataTableSlotRow classNames={{ root: classNames?.slotRow }}>\n {slots?.top}\n </DataTableSlotRow>\n\n <DataTableViewport className={classNames?.viewport}>\n {skeleton != null && data.length === 0 ? (\n <DataTableSkeleton\n rows={skeleton}\n className={classNames?.skeleton}\n />\n ) : (\n <Table\n {...tableProps}\n layout={layout}\n classNames={classNames?.table}\n >\n <DataTableHeader\n loading={loading}\n classNames={classNames}\n headerGroups={table.getHeaderGroups()}\n totalSize={table.getTotalSize()}\n />\n <DataTableBody\n rows={table.getRowModel().rows}\n colCount={table.getVisibleLeafColumns().length}\n loading={loading}\n empty={slots?.empty}\n emptyClassName={classNames?.empty}\n expandedContentClassName={classNames?.expandedContent}\n expansion={expansion}\n selection={selection}\n />\n </Table>\n )}\n </DataTableViewport>\n\n <DataTableSlotRow classNames={{ root: classNames?.slotRow }}>\n {slots?.bottom}\n </DataTableSlotRow>\n\n <DataTableBulkBar\n selectedIds={contextValue.selectedIds}\n className={classNames?.bulkBar}\n selection={selection}\n />\n </DataTableRootContainer>\n </DataTableContextProvider>\n );\n};\n"],"mappings":"knBAgIA,MAAa,GAAoB,CAC/B,aACA,QACA,UACA,WACA,aACA,YACA,YACA,OACA,UACA,eACA,UACA,YACA,UACA,SACA,GAAG,KACkC,CACrC,GAAM,CAAE,SAAQ,eAAc,SAAU,EAAa,CACnD,OACA,UACA,eACA,UACA,YACA,UACA,SACA,aACA,UACA,WACA,aACA,YACA,YACA,GAAG,EACJ,CAAC,CAEF,OACE,EAAC,EAAA,CACC,MAAO,WAEP,EAAC,EAAA,CAAuB,KAAM,EAAqB,uBACjD,EAAC,EAAA,CAAiB,WAAY,CAAE,KAAM,GAAY,QAAS,UACxD,GAAO,KACS,CAEnB,EAAC,EAAA,CAAkB,UAAW,GAAY,kBACvC,GAAY,MAAQ,EAAK,SAAW,EACnC,EAAC,EAAA,CACC,KAAM,EACN,UAAW,GAAY,UACvB,CAEF,EAAC,EAAA,CACC,GAAI,EACI,SACR,WAAY,GAAY,gBAExB,EAAC,EAAA,CACU,UACG,aACZ,aAAc,EAAM,iBAAiB,CACrC,UAAW,EAAM,cAAc,EAC/B,CACF,EAAC,EAAA,CACC,KAAM,EAAM,aAAa,CAAC,KAC1B,SAAU,EAAM,uBAAuB,CAAC,OAC/B,UACT,MAAO,GAAO,MACd,eAAgB,GAAY,MAC5B,yBAA0B,GAAY,gBAC3B,YACA,aACX,CAAA,EACI,EAEQ,CAEpB,EAAC,EAAA,CAAiB,WAAY,CAAE,KAAM,GAAY,QAAS,UACxD,GAAO,QACS,CAEnB,EAAC,EAAA,CACC,YAAa,EAAa,YAC1B,UAAW,GAAY,QACZ,aACX,GACqB,EACA"}

package/dist/components/data-display/datatables/DataTableBody.mjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{Table as e}from"../table/Table.mjs";import{dataTableEmpty as t,dataTableExpandedContent as n}from"@mage-ui/styled-system/recipes";import{Fragment as r,jsx as i,jsxs as a}from"react/jsx-runtime";import{flexRender as o}from"@tanstack/react-table";const s=({cell:t})=>{let n=t.column.columnDef.meta;return i(e.Cell,{classNames:n?.classNames?.cell?{td:n.classNames.cell}:void 0,children:o(t.column.columnDef.cell,t.getContext())})},c=({row:t,colCount:r,className:a,expansion:o})=>i(e.Row,{id:`data-table-expanded-${t.id}`,children:i(e.Cell,{colSpan:r,classNames:{td:a??n()},children:o.renderContent(t.original)})}),l=({row:t,colCount:n,expandedContentClassName:o,expansion:l,selection:u})=>a(r,{children:[i(e.Row,{"data-selected":t.getIsSelected()\|\|void 0,"data-disabled":u&&!t.getCanSelect()\|\|void 0,"data-expanded":t.getIsExpanded()\|\|void 0,children:t.getVisibleCells().map(e=>i(s,{cell:e},e.id))}),l&&t.getIsExpanded()?i(c,{row:t,colCount:n,className:o,expansion:l}):null]}),u=({colCount:n,className:r,children:a})=>i(e.Row,{children:i(e.Cell,{colSpan:n,classNames:{td:r??t()},children:a})}),d=({rows:t,colCount:n,loading:r,empty:a,emptyClassName:o,expandedContentClassName:s,expansion:c,selection:d})=>{let f=!r&&t.length===0;return i(e.Body,{children:f?i(u,{colCount:n,className:o,children:a}):t.map(e=>i(l,{row:e,colCount:n,expandedContentClassName:s,expansion:c,selection:d},e.id))})};export{d as DataTableBody};
2	+ //# sourceMappingURL=DataTableBody.mjs.map

package/dist/components/data-display/datatables/DataTableBody.mjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"DataTableBody.mjs","names":[],"sources":["../../../../src/components/data-display/datatables/DataTableBody.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport {\n dataTableEmpty,\n dataTableExpandedContent,\n} from '@mage-ui/styled-system/recipes';\nimport { flexRender, type Row } from '@tanstack/react-table';\n\nimport { Table } from '../table/Table';\nimport type {\n DataTableColumnMeta,\n DataTableExpansionConfig,\n DataTableProps,\n DataTableSelectionConfig,\n} from './DataTable';\n\n\ntype DataTableBodyProps<Data> = Pick<\n DataTableProps<Data>,\n 'loading' | 'expansion' | 'selection'\n> & {\n rows: Row<Data>[];\n colCount: number;\n empty?: ReactNode;\n emptyClassName?: string;\n expandedContentClassName?: string;\n};\n\nconst BodyCell = <Data,>({\n cell,\n}: {\n cell: import('@tanstack/react-table').Cell<Data, unknown>;\n}): ReactNode => {\n const columnMeta = cell.column.columnDef.meta as\n | DataTableColumnMeta\n | undefined;\n\n return (\n <Table.Cell\n classNames={\n columnMeta?.classNames?.cell\n ? { td: columnMeta.classNames.cell }\n : undefined\n }\n >\n {flexRender(cell.column.columnDef.cell, cell.getContext())}\n </Table.Cell>\n );\n};\n\nconst ExpandedRow = <Data,>({\n row,\n colCount,\n className,\n expansion,\n}: {\n row: Row<Data>;\n colCount: number;\n className?: string;\n expansion: DataTableExpansionConfig<Data>;\n}): ReactNode => (\n <Table.Row id={`data-table-expanded-${row.id}`}>\n <Table.Cell\n colSpan={colCount}\n classNames={{ td: className ?? dataTableExpandedContent() }}\n >\n {expansion.renderContent(row.original)}\n </Table.Cell>\n </Table.Row>\n);\n\nconst BodyRow = <Data,>({\n row,\n colCount,\n expandedContentClassName,\n expansion,\n selection,\n}: {\n row: Row<Data>;\n colCount: number;\n expandedContentClassName?: string;\n expansion?: DataTableExpansionConfig<Data>;\n selection?: DataTableSelectionConfig<Data>;\n}): ReactNode => (\n <>\n <Table.Row\n data-selected={row.getIsSelected() || undefined}\n data-disabled={(selection && !row.getCanSelect()) || undefined}\n data-expanded={row.getIsExpanded() || undefined}\n >\n {row.getVisibleCells().map((cell) => (\n <BodyCell key={cell.id} cell={cell} />\n ))}\n </Table.Row>\n {expansion && row.getIsExpanded() ? (\n <ExpandedRow\n row={row}\n colCount={colCount}\n className={expandedContentClassName}\n expansion={expansion}\n />\n ) : null}\n </>\n);\n\nconst EmptyRow = ({\n colCount,\n className,\n children,\n}: {\n colCount: number;\n className?: string;\n children?: ReactNode;\n}): ReactNode => (\n <Table.Row>\n <Table.Cell\n colSpan={colCount}\n classNames={{ td: className ?? dataTableEmpty() }}\n >\n {children}\n </Table.Cell>\n </Table.Row>\n);\n\nexport const DataTableBody = <Data,>({\n rows,\n colCount,\n loading,\n empty,\n emptyClassName,\n expandedContentClassName,\n expansion,\n selection,\n}: DataTableBodyProps<Data>): ReactNode => {\n const showEmptyState = !loading && rows.length === 0;\n\n return (\n <Table.Body>\n {showEmptyState ? (\n <EmptyRow colCount={colCount} className={emptyClassName}>\n {empty}\n </EmptyRow>\n ) : (\n rows.map((row) => (\n <BodyRow\n key={row.id}\n row={row}\n colCount={colCount}\n expandedContentClassName={expandedContentClassName}\n expansion={expansion}\n selection={selection}\n />\n ))\n )}\n </Table.Body>\n );\n};\n"],"mappings":"4PA4BA,MAAM,GAAmB,CACvB,UAGe,CACf,IAAM,EAAa,EAAK,OAAO,UAAU,KAIzC,OACE,EAAC,EAAM,KAAA,CACL,WACE,GAAY,YAAY,KACpB,CAAE,GAAI,EAAW,WAAW,KAAM,CAClC,IAAA,YAGL,EAAW,EAAK,OAAO,UAAU,KAAM,EAAK,YAAY,CAAC,EAC/C,EAIX,GAAsB,CAC1B,MACA,WACA,YACA,eAOA,EAAC,EAAM,IAAA,CAAI,GAAI,uBAAuB,EAAI,cACxC,EAAC,EAAM,KAAA,CACL,QAAS,EACT,WAAY,CAAE,GAAI,GAAa,GAA0B,CAAE,UAE1D,EAAU,cAAc,EAAI,SAAS,EAC3B,EACH,CAGR,GAAkB,CACtB,MACA,WACA,2BACA,YACA,eAQA,EAAA,EAAA,CAAA,SAAA,CACE,EAAC,EAAM,IAAA,CACL,gBAAe,EAAI,eAAe,EAAI,IAAA,GACtC,gBAAgB,GAAa,CAAC,EAAI,cAAc,EAAK,IAAA,GACrD,gBAAe,EAAI,eAAe,EAAI,IAAA,YAErC,EAAI,iBAAiB,CAAC,IAAK,GAC1B,EAAC,EAAA,CAA6B,OAAA,CAAf,EAAK,GAAkB,CACtC,EACQ,CACX,GAAa,EAAI,eAAe,CAC/B,EAAC,EAAA,CACM,MACK,WACV,UAAW,EACA,aACX,CACA,KAAA,CAAA,CACH,CAGC,GAAY,CAChB,WACA,YACA,cAMA,EAAC,EAAM,IAAA,CAAA,SACL,EAAC,EAAM,KAAA,CACL,QAAS,EACT,WAAY,CAAE,GAAI,GAAa,GAAgB,CAAE,CAEhD,YACU,CAAA,CACH,CAGD,GAAwB,CACnC,OACA,WACA,UACA,QACA,iBACA,2BACA,YACA,eACyC,CACzC,IAAM,EAAiB,CAAC,GAAW,EAAK,SAAW,EAEnD,OACE,EAAC,EAAM,KAAA,CAAA,SACJ,EACC,EAAC,EAAA,CAAmB,WAAU,UAAW,WACtC,GACQ,CAEX,EAAK,IAAK,GACR,EAAC,EAAA,CAEM,MACK,WACgB,2BACf,YACA,aALN,EAAI,GAMT,CACF,CAAA,CAEO"}

package/dist/components/data-display/datatables/DataTableBottomSlot.d.mts ADDED Viewed

@@ -0,0 +1,25 @@
+import { DataTablePageSizeProps } from "./DataTablePageSize.mjs";
+import { DataTablePaginationProps } from "./DataTablePagination.mjs";
+import { ReactNode } from "react";
+//#region src/components/data-display/datatables/DataTableBottomSlot.d.ts
+type DataTableBottomSlotClassNames = {
+  root?: string;
+  pageSize?: DataTablePageSizeProps['classNames'];
+  pagination?: DataTablePaginationProps['classNames'];
+};
+type DataTableBottomSlotProps = {
+  children?: ReactNode;
+  withPagination?: boolean;
+  pageSizeOptions?: number[];
+  classNames?: DataTableBottomSlotClassNames;
+};
+declare const DataTableBottomSlot: <Data>({
+  children,
+  withPagination,
+  pageSizeOptions,
+  classNames
+}: DataTableBottomSlotProps) => ReactNode;
+//#endregion
+export { DataTableBottomSlot, DataTableBottomSlotProps };
+//# sourceMappingURL=DataTableBottomSlot.d.mts.map

package/dist/components/data-display/datatables/DataTableBottomSlot.d.mts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"DataTableBottomSlot.d.mts","names":[],"sources":["../../../../src/components/data-display/datatables/DataTableBottomSlot.tsx"],"mappings":";;;;;KAUK,6BAAA;EACH,IAAA;EACA,QAAA,GAAW,sBAAA;EACX,UAAA,GAAa,wBAAA;AAAA;AAAA,KAGH,wBAAA;EACV,QAAA,GAAW,SAAA;EACX,cAAA;EACA,eAAA;EACA,UAAA,GAAa,6BAAA;AAAA;AAAA,cAcF,mBAAA;EAA8B,QAAA;EAAA,cAAA;EAAA,eAAA;EAAA;AAAA,GAKxC,wBAAA,KAA2B,SAAA"}

package/dist/components/data-display/datatables/DataTableBottomSlot.mjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{useDataTableContext as e}from"./useDataTableContext.mjs";import{DataTablePageSize as t}from"./DataTablePageSize.mjs";import{DataTablePagination as n}from"./DataTablePagination.mjs";import{dataTableBottomSlot as r}from"@mage-ui/styled-system/recipes";import{Fragment as i,jsx as a,jsxs as o}from"react/jsx-runtime";const s=(e,t)=>{let n=t??[15,25,50];return[...new Set([e,...n])].sort((e,t)=>e-t)},c=({children:c,withPagination:l=!1,pageSizeOptions:u,classNames:d})=>{let{pagination:f}=e(),p=f?s(f.pageSize,u):[],m=!!f&&p.length>1,h=(f?.pageCount??0)>0;return!l&&!(c!=null&&c!==!1)?null:o(i,{children:[l&&(m\|\|h)?o(`div`,{className:d?.root??r(),children:[m&&f?a(t,{value:f.pageSize,options:p,classNames:d?.pageSize,onChange:e=>{f.onChange(t=>({...t,pageIndex:0,pageSize:e}))}}):null,h?a(n,{withEdges:!0,classNames:d?.pagination}):null]}):null,c]})};export{c as DataTableBottomSlot};
2	+ //# sourceMappingURL=DataTableBottomSlot.mjs.map

package/dist/components/data-display/datatables/DataTableBottomSlot.mjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"DataTableBottomSlot.mjs","names":[],"sources":["../../../../src/components/data-display/datatables/DataTableBottomSlot.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { dataTableBottomSlot } from '@mage-ui/styled-system/recipes';\n\nimport type { DataTablePageSizeProps } from './DataTablePageSize';\nimport { DataTablePageSize } from './DataTablePageSize';\nimport type { DataTablePaginationProps } from './DataTablePagination';\nimport { DataTablePagination } from './DataTablePagination';\nimport { useDataTableContext } from './useDataTableContext';\n\ntype DataTableBottomSlotClassNames = {\n root?: string;\n pageSize?: DataTablePageSizeProps['classNames'];\n pagination?: DataTablePaginationProps['classNames'];\n};\n\nexport type DataTableBottomSlotProps = {\n children?: ReactNode;\n withPagination?: boolean;\n pageSizeOptions?: number[];\n classNames?: DataTableBottomSlotClassNames;\n};\n\nconst getPageSizeOptions = (\n pageSize: number,\n pageSizeOptions?: number[],\n): number[] => {\n const options = pageSizeOptions ?? [15, 25, 50];\n\n return [...new Set([pageSize, ...options])].sort(\n (left, right) => left - right,\n );\n};\n\nexport const DataTableBottomSlot = <Data,>({\n children,\n withPagination = false,\n pageSizeOptions,\n classNames,\n}: DataTableBottomSlotProps): ReactNode => {\n const { pagination } = useDataTableContext<Data>();\n const options = pagination\n ? getPageSizeOptions(pagination.pageSize, pageSizeOptions)\n : [];\n const showPageSize = Boolean(pagination) && options.length > 1;\n const showPagination = (pagination?.pageCount ?? 0) > 0;\n const hasChildren =\n children !== null && children !== undefined && children !== false;\n\n if (!withPagination && !hasChildren) {\n return null;\n }\n\n return (\n <>\n {withPagination && (showPageSize || showPagination) ? (\n <div className={classNames?.root ?? dataTableBottomSlot()}>\n {showPageSize && pagination ? (\n <DataTablePageSize\n value={pagination.pageSize}\n options={options}\n classNames={classNames?.pageSize}\n onChange={(nextPageSize) => {\n pagination.onChange((current) => ({\n ...current,\n pageIndex: 0,\n pageSize: nextPageSize,\n }));\n }}\n />\n ) : null}\n {showPagination ? (\n <DataTablePagination\n withEdges\n classNames={classNames?.pagination}\n />\n ) : null}\n </div>\n ) : null}\n {children}\n </>\n );\n};\n"],"mappings":"iUAuBA,MAAM,GACJ,EACA,IACa,CACb,IAAM,EAAU,GAAmB,CAAC,GAAI,GAAI,GAAG,CAE/C,MAAO,CAAC,GAAG,IAAI,IAAI,CAAC,EAAU,GAAG,EAAQ,CAAC,CAAC,CAAC,MACzC,EAAM,IAAU,EAAO,EACzB,EAGU,GAA8B,CACzC,WACA,iBAAiB,GACjB,kBACA,gBACyC,CACzC,GAAM,CAAE,cAAe,GAA2B,CAC5C,EAAU,EACZ,EAAmB,EAAW,SAAU,EAAgB,CACxD,EAAE,CACA,EAAe,EAAQ,GAAe,EAAQ,OAAS,EACvD,GAAkB,GAAY,WAAa,GAAK,EAQtD,MAJI,CAAC,GAAkB,EAFrB,GAAa,MAAkC,IAAa,IAGrD,KAIP,EAAA,EAAA,CAAA,SAAA,CACG,IAAmB,GAAgB,GAClC,EAAC,MAAA,CAAI,UAAW,GAAY,MAAQ,GAAqB,WACtD,GAAgB,EACf,EAAC,EAAA,CACC,MAAO,EAAW,SACT,UACT,WAAY,GAAY,SACxB,SAAW,GAAiB,CAC1B,EAAW,SAAU,IAAa,CAChC,GAAG,EACH,UAAW,EACX,SAAU,EACX,EAAE,GAEL,CACA,KACH,EACC,EAAC,EAAA,CACC,UAAA,GACA,WAAY,GAAY,YACxB,CACA,KAAA,EACA,CACJ,KACH,EAAA,CAAA,CACA"}

package/dist/components/data-display/datatables/DataTableBulkBar.mjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{useDataTableContext as e}from"./useDataTableContext.mjs";import{dataTableBulkBar as t}from"@mage-ui/styled-system/recipes";import{jsx as n,jsxs as r}from"react/jsx-runtime";const i=({selectedIds:i,className:a,selection:o})=>{let{labels:s}=e();return!o?.bulkActions\|\|i.length===0?null:r(`div`,{className:a??t(),children:[n(`span`,{children:s.selectedCount(i.length)}),o.bulkActions(i)]})};export{i as DataTableBulkBar};
2	+ //# sourceMappingURL=DataTableBulkBar.mjs.map

package/dist/components/data-display/datatables/DataTableBulkBar.mjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"DataTableBulkBar.mjs","names":[],"sources":["../../../../src/components/data-display/datatables/DataTableBulkBar.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { dataTableBulkBar } from '@mage-ui/styled-system/recipes';\n\nimport type { DataTableSelectionConfig } from './DataTable';\nimport { useDataTableContext } from './useDataTableContext';\n\ntype DataTableBulkBarProps<Data> = {\n selectedIds: string[];\n className?: string;\n selection?: DataTableSelectionConfig<Data>;\n};\n\nexport const DataTableBulkBar = <Data,>({\n selectedIds,\n className,\n selection,\n}: DataTableBulkBarProps<Data>): ReactNode => {\n const { labels } = useDataTableContext();\n\n if (!selection?.bulkActions || selectedIds.length === 0) {\n return null;\n }\n\n return (\n <div className={className ?? dataTableBulkBar()}>\n <span>{labels.selectedCount(selectedIds.length)}</span>\n {selection.bulkActions(selectedIds)}\n </div>\n );\n};\n"],"mappings":"oLAaA,MAAa,GAA2B,CACtC,cACA,YACA,eAC4C,CAC5C,GAAM,CAAE,UAAW,GAAqB,CAMxC,MAJI,CAAC,GAAW,aAAe,EAAY,SAAW,EAC7C,KAIP,EAAC,MAAA,CAAI,UAAW,GAAa,GAAkB,WAC7C,EAAC,OAAA,CAAA,SAAM,EAAO,cAAc,EAAY,OAAO,CAAA,CAAQ,CACtD,EAAU,YAAY,EAAY,CAAA,EAC/B"}

package/dist/components/data-display/datatables/DataTableColumns.mjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{Checkbox as e}from"../../controls/checkbox/Checkbox.mjs";import{dataTableExpandButton as t}from"@mage-ui/styled-system/recipes";import{jsx as n}from"react/jsx-runtime";const r=t=>({id:`_select`,size:40,header:({table:r})=>n(e,{"aria-label":t.selectAllRows,checked:r.getIsAllPageRowsSelected(),indeterminate:r.getIsSomePageRowsSelected()&&!r.getIsAllPageRowsSelected(),onChange:r.getToggleAllPageRowsSelectedHandler()}),cell:({row:r})=>n(e,{"aria-label":t.selectRow(r.index+1),checked:r.getIsSelected(),disabled:!r.getCanSelect(),onChange:r.getToggleSelectedHandler()})}),i=(e,r)=>({id:`_expand`,size:40,header:()=>null,cell:({row:i})=>n(`button`,{className:e??t(),type:`button`,onClick:i.getToggleExpandedHandler(),"data-expanded":i.getIsExpanded()\|\|void 0,"aria-expanded":i.getIsExpanded(),"aria-controls":`data-table-expanded-${i.id}`,"aria-label":i.getIsExpanded()?r.collapseRow:r.expandRow,children:n(`svg`,{width:`16`,height:`16`,viewBox:`0 0 16 16`,fill:`currentColor`,"aria-hidden":`true`,focusable:`false`,children:n(`path`,{d:`M6 4l4 4-4 4`,stroke:`currentColor`,strokeWidth:`1.5`,fill:`none`,strokeLinecap:`round`,strokeLinejoin:`round`})})})});export{i as getDataTableExpandColumn,r as getDataTableSelectColumn};
2	+ //# sourceMappingURL=DataTableColumns.mjs.map

package/dist/components/data-display/datatables/DataTableColumns.mjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"DataTableColumns.mjs","names":[],"sources":["../../../../src/components/data-display/datatables/DataTableColumns.tsx"],"sourcesContent":["import { dataTableExpandButton } from '@mage-ui/styled-system/recipes';\nimport type { ColumnDef } from '@tanstack/react-table';\n\nimport { Checkbox } from '../../controls/checkbox/Checkbox';\nimport type { DataTableLabels } from './useDataTableContext';\n\nexport const getDataTableSelectColumn = <Data,>(\n labels: DataTableLabels,\n): ColumnDef<Data, unknown> => ({\n id: '_select',\n size: 40,\n header: ({ table }) => {\n return (\n <Checkbox\n aria-label={labels.selectAllRows}\n checked={table.getIsAllPageRowsSelected()}\n indeterminate={\n table.getIsSomePageRowsSelected() && !table.getIsAllPageRowsSelected()\n }\n onChange={table.getToggleAllPageRowsSelectedHandler()}\n />\n );\n },\n cell: ({ row }) => (\n <Checkbox\n aria-label={labels.selectRow(row.index + 1)}\n checked={row.getIsSelected()}\n disabled={!row.getCanSelect()}\n onChange={row.getToggleSelectedHandler()}\n />\n ),\n});\n\nexport const getDataTableExpandColumn = <Data,>(\n className: string | undefined,\n labels: DataTableLabels,\n): ColumnDef<Data, unknown> => ({\n id: '_expand',\n size: 40,\n header: () => null,\n cell: ({ row }) => (\n <button\n className={className ?? dataTableExpandButton()}\n type='button'\n onClick={row.getToggleExpandedHandler()}\n data-expanded={row.getIsExpanded() || undefined}\n aria-expanded={row.getIsExpanded()}\n aria-controls={`data-table-expanded-${row.id}`}\n aria-label={row.getIsExpanded() ? labels.collapseRow : labels.expandRow}\n >\n <svg\n width='16'\n height='16'\n viewBox='0 0 16 16'\n fill='currentColor'\n aria-hidden='true'\n focusable='false'\n >\n <path\n d='M6 4l4 4-4 4'\n stroke='currentColor'\n strokeWidth='1.5'\n fill='none'\n strokeLinecap='round'\n strokeLinejoin='round'\n />\n </svg>\n </button>\n ),\n});\n"],"mappings":"+KAMA,MAAa,EACX,IAC8B,CAC9B,GAAI,UACJ,KAAM,GACN,QAAS,CAAE,WAEP,EAAC,EAAA,CACC,aAAY,EAAO,cACnB,QAAS,EAAM,0BAA0B,CACzC,cACE,EAAM,2BAA2B,EAAI,CAAC,EAAM,0BAA0B,CAExE,SAAU,EAAM,qCAAqC,EACrD,CAGN,MAAO,CAAE,SACP,EAAC,EAAA,CACC,aAAY,EAAO,UAAU,EAAI,MAAQ,EAAE,CAC3C,QAAS,EAAI,eAAe,CAC5B,SAAU,CAAC,EAAI,cAAc,CAC7B,SAAU,EAAI,0BAA0B,EACxC,CAEL,EAEY,GACX,EACA,KAC8B,CAC9B,GAAI,UACJ,KAAM,GACN,WAAc,KACd,MAAO,CAAE,SACP,EAAC,SAAA,CACC,UAAW,GAAa,GAAuB,CAC/C,KAAK,SACL,QAAS,EAAI,0BAA0B,CACvC,gBAAe,EAAI,eAAe,EAAI,IAAA,GACtC,gBAAe,EAAI,eAAe,CAClC,gBAAe,uBAAuB,EAAI,KAC1C,aAAY,EAAI,eAAe,CAAG,EAAO,YAAc,EAAO,mBAE9D,EAAC,MAAA,CACC,MAAM,KACN,OAAO,KACP,QAAQ,YACR,KAAK,eACL,cAAY,OACZ,UAAU,iBAEV,EAAC,OAAA,CACC,EAAE,eACF,OAAO,eACP,YAAY,MACZ,KAAK,OACL,cAAc,QACd,eAAe,SACf,EACE,EACC,CAEZ"}

package/dist/components/data-display/datatables/DataTableHeader.mjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{VisuallyHidden as e}from"../../misc/visually-hidden/VisuallyHidden.mjs";import{Table as t}from"../table/Table.mjs";import{useDataTableContext as n}from"./useDataTableContext.mjs";import{cx as r}from"@mage-ui/styled-system/css";import{dataTableHeader as i,dataTableLoading as a,dataTableSortButton as o}from"@mage-ui/styled-system/recipes";import{jsx as s,jsxs as c}from"react/jsx-runtime";import{flexRender as l}from"@tanstack/react-table";const u=e=>e===`asc`?`ascending`:e===`desc`?`descending`:`none`,d=({sorted:e})=>s(`span`,{"aria-hidden":!0,children:e===`asc`?`↑`:e===`desc`?`↓`:``}),f=({header:t,className:r})=>{let{labels:i}=n(),a=t.column.getIsSorted();return c(`button`,{className:r??o(),type:`button`,onClick:t.column.getToggleSortingHandler(),children:[s(`span`,{children:l(t.column.columnDef.header,t.getContext())}),s(d,{sorted:a}),s(e,{children:a===`asc`?i.sortedAscending:a===`desc`?i.sortedDescending:i.activateToSort})]})},p=({header:e,sortButtonClassName:t})=>e.isPlaceholder?null:e.column.getCanSort()?s(f,{header:e,className:t}):l(e.column.columnDef.header,e.getContext()),m=({header:e,totalSize:n,classNames:r})=>{let i=e.column.getCanSort(),a=e.column.getIsSorted(),o=e.column.columnDef.meta,c=n>0&&e.column.columnDef.size!==150?`${e.getSize()/n*100}%`:void 0;return s(t.HeaderCell,{classNames:o?.classNames?.header?{th:o.classNames.header}:void 0,scope:`col`,style:{width:c},"aria-sort":i?u(a):void 0,"data-sortable":i\|\|void 0,"data-sort":a\|\|void 0,children:s(p,{header:e,sortButtonClassName:r?.sortButton})})},h=({headerGroups:e,totalSize:n,loading:o,classNames:c})=>s(t.Head,{classNames:{thead:r(c?.header??i(),o?c?.loading??a():void 0)},"data-loading":o\|\|void 0,children:e.map(e=>s(t.Row,{children:e.headers.map(e=>s(m,{header:e,totalSize:n,classNames:c},e.id))},e.id))});export{h as DataTableHeader};
2	+ //# sourceMappingURL=DataTableHeader.mjs.map

package/dist/components/data-display/datatables/DataTableHeader.mjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"DataTableHeader.mjs","names":[],"sources":["../../../../src/components/data-display/datatables/DataTableHeader.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n dataTableHeader,\n dataTableLoading,\n dataTableSortButton,\n} from '@mage-ui/styled-system/recipes';\nimport {\n flexRender,\n type Header,\n type HeaderGroup,\n} from '@tanstack/react-table';\n\nimport { VisuallyHidden } from '../../misc/visually-hidden/VisuallyHidden';\nimport { Table } from '../table/Table';\nimport type { DataTableClassNames, DataTableColumnMeta } from './DataTable';\nimport { useDataTableContext } from './useDataTableContext';\n\ntype DataTableHeaderProps<Data> = {\n headerGroups: HeaderGroup<Data>[];\n totalSize: number;\n loading?: boolean;\n classNames?: Pick<DataTableClassNames, 'header' | 'loading' | 'sortButton'>;\n};\n\nconst getAriaSort = (sorted: false | 'asc' | 'desc') => {\n if (sorted === 'asc') return 'ascending';\n if (sorted === 'desc') return 'descending';\n return 'none';\n};\n\nconst SortIndicator = ({ sorted }: { sorted: false | 'asc' | 'desc' }) => (\n <span aria-hidden>\n {sorted === 'asc' ? '↑' : sorted === 'desc' ? '↓' : ''}\n </span>\n);\n\nconst SortButton = <Data,>({\n header,\n className,\n}: {\n header: Header<Data, unknown>;\n className?: string;\n}): ReactNode => {\n const { labels } = useDataTableContext();\n const sorted = header.column.getIsSorted();\n\n const getSortStatusText = () => {\n if (sorted === 'asc') return labels.sortedAscending;\n if (sorted === 'desc') return labels.sortedDescending;\n return labels.activateToSort;\n };\n\n return (\n <button\n className={className ?? dataTableSortButton()}\n type='button'\n onClick={header.column.getToggleSortingHandler()}\n >\n <span>\n {flexRender(header.column.columnDef.header, header.getContext())}\n </span>\n <SortIndicator sorted={sorted} />\n <VisuallyHidden>{getSortStatusText()}</VisuallyHidden>\n </button>\n );\n};\n\nconst HeaderCellContent = <Data,>({\n header,\n sortButtonClassName,\n}: {\n header: Header<Data, unknown>;\n sortButtonClassName?: string;\n}): ReactNode => {\n if (header.isPlaceholder) return null;\n\n if (header.column.getCanSort()) {\n return <SortButton header={header} className={sortButtonClassName} />;\n }\n\n return flexRender(header.column.columnDef.header, header.getContext());\n};\n\nconst HeaderCell = <Data,>({\n header,\n totalSize,\n classNames,\n}: {\n header: Header<Data, unknown>;\n totalSize: number;\n classNames?: Pick<DataTableClassNames, 'sortButton'>;\n}): ReactNode => {\n const canSort = header.column.getCanSort();\n const sorted = header.column.getIsSorted();\n const columnMeta = header.column.columnDef.meta as\n | DataTableColumnMeta\n | undefined;\n const width =\n totalSize > 0 && header.column.columnDef.size !== 150\n ? `${(header.getSize() / totalSize) * 100}%`\n : undefined;\n\n return (\n <Table.HeaderCell\n classNames={\n columnMeta?.classNames?.header\n ? { th: columnMeta.classNames.header }\n : undefined\n }\n scope='col'\n style={{ width }}\n aria-sort={canSort ? getAriaSort(sorted) : undefined}\n data-sortable={canSort || undefined}\n data-sort={(sorted || undefined) as string | undefined}\n >\n <HeaderCellContent\n header={header}\n sortButtonClassName={classNames?.sortButton}\n />\n </Table.HeaderCell>\n );\n};\n\nexport const DataTableHeader = <Data,>({\n headerGroups,\n totalSize,\n loading,\n classNames,\n}: DataTableHeaderProps<Data>): ReactNode => (\n <Table.Head\n classNames={{\n thead: cx(\n classNames?.header ?? dataTableHeader(),\n loading ? (classNames?.loading ?? dataTableLoading()) : undefined,\n ),\n }}\n data-loading={loading || undefined}\n >\n {headerGroups.map((headerGroup) => (\n <Table.Row key={headerGroup.id}>\n {headerGroup.headers.map((header) => (\n <HeaderCell\n key={header.id}\n header={header}\n totalSize={totalSize}\n classNames={classNames}\n />\n ))}\n </Table.Row>\n ))}\n </Table.Head>\n);\n"],"mappings":"+bA0BA,MAAM,EAAe,GACf,IAAW,MAAc,YACzB,IAAW,OAAe,aACvB,OAGH,GAAiB,CAAE,YACvB,EAAC,OAAA,CAAK,cAAA,YACH,IAAW,MAAQ,IAAM,IAAW,OAAS,IAAM,IAC/C,CAGH,GAAqB,CACzB,SACA,eAIe,CACf,GAAM,CAAE,UAAW,GAAqB,CAClC,EAAS,EAAO,OAAO,aAAa,CAQ1C,OACE,EAAC,SAAA,CACC,UAAW,GAAa,GAAqB,CAC7C,KAAK,SACL,QAAS,EAAO,OAAO,yBAAyB,WAEhD,EAAC,OAAA,CAAA,SACE,EAAW,EAAO,OAAO,UAAU,OAAQ,EAAO,YAAY,CAAC,CAAA,CAC3D,CACP,EAAC,EAAA,CAAsB,SAAA,CAAU,CACjC,EAAC,EAAA,CAAA,SAfC,IAAW,MAAc,EAAO,gBAChC,IAAW,OAAe,EAAO,iBAC9B,EAAO,eAawB,CAAkB,GAC/C,EAIP,GAA4B,CAChC,SACA,yBAKI,EAAO,cAAsB,KAE7B,EAAO,OAAO,YAAY,CACrB,EAAC,EAAA,CAAmB,SAAQ,UAAW,GAAuB,CAGhE,EAAW,EAAO,OAAO,UAAU,OAAQ,EAAO,YAAY,CAAC,CAGlE,GAAqB,CACzB,SACA,YACA,gBAKe,CACf,IAAM,EAAU,EAAO,OAAO,YAAY,CACpC,EAAS,EAAO,OAAO,aAAa,CACpC,EAAa,EAAO,OAAO,UAAU,KAGrC,EACJ,EAAY,GAAK,EAAO,OAAO,UAAU,OAAS,IAC9C,GAAI,EAAO,SAAS,CAAG,EAAa,IAAI,GACxC,IAAA,GAEN,OACE,EAAC,EAAM,WAAA,CACL,WACE,GAAY,YAAY,OACpB,CAAE,GAAI,EAAW,WAAW,OAAQ,CACpC,IAAA,GAEN,MAAM,MACN,MAAO,CAAE,QAAO,CAChB,YAAW,EAAU,EAAY,EAAO,CAAG,IAAA,GAC3C,gBAAe,GAAW,IAAA,GAC1B,YAAY,GAAU,IAAA,YAEtB,EAAC,EAAA,CACS,SACR,oBAAqB,GAAY,YACjC,EACe,EAIV,GAA0B,CACrC,eACA,YACA,UACA,gBAEA,EAAC,EAAM,KAAA,CACL,WAAY,CACV,MAAO,EACL,GAAY,QAAU,GAAiB,CACvC,EAAW,GAAY,SAAW,GAAkB,CAAI,IAAA,GACzD,CACF,CACD,eAAc,GAAW,IAAA,YAExB,EAAa,IAAK,GACjB,EAAC,EAAM,IAAA,CAAA,SACJ,EAAY,QAAQ,IAAK,GACxB,EAAC,EAAA,CAES,SACG,YACC,cAHP,EAAO,GAIZ,CACF,CAAA,CARY,EAAY,GAShB,CACZ,EACS"}

package/dist/components/data-display/datatables/DataTablePageSize.d.mts ADDED Viewed

@@ -0,0 +1,22 @@
+import { ReactNode } from "react";
+//#region src/components/data-display/datatables/DataTablePageSize.d.ts
+type DataTablePageSizeProps = {
+  value: number;
+  options: number[];
+  onChange: (size: number) => void;
+  label?: string;
+  classNames?: {
+    root?: string;
+  };
+};
+declare const DataTablePageSize: ({
+  value,
+  options,
+  onChange,
+  label,
+  classNames
+}: DataTablePageSizeProps) => ReactNode;
+//#endregion
+export { DataTablePageSize, DataTablePageSizeProps };
+//# sourceMappingURL=DataTablePageSize.d.mts.map

package/dist/components/data-display/datatables/DataTablePageSize.d.mts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"DataTablePageSize.d.mts","names":[],"sources":["../../../../src/components/data-display/datatables/DataTablePageSize.tsx"],"mappings":";;;KAMY,sBAAA;EACV,KAAA;EACA,OAAA;EACA,QAAA,GAAW,IAAA;EACX,KAAA;EACA,UAAA;IACE,IAAA;EAAA;AAAA;AAAA,cAIS,iBAAA;EAAqB,KAAA;EAAA,OAAA;EAAA,QAAA;EAAA,KAAA;EAAA;AAAA,GAM/B,sBAAA,KAAyB,SAAA"}

package/dist/components/data-display/datatables/DataTablePageSize.mjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{useDataTableContext as e}from"./useDataTableContext.mjs";import{dataTablePageSize as t}from"@mage-ui/styled-system/recipes";import{jsx as n,jsxs as r}from"react/jsx-runtime";const i=({value:i,options:a,onChange:o,label:s,classNames:c})=>{let{labels:l}=e(),u=s??l.rowsPerPage;return r(`label`,{className:c?.root??t(),children:[n(`span`,{children:u}),n(`select`,{value:i,onChange:e=>o(Number(e.target.value)),children:a.map(e=>n(`option`,{value:e,children:e},e))})]})};export{i as DataTablePageSize};
2	+ //# sourceMappingURL=DataTablePageSize.mjs.map

package/dist/components/data-display/datatables/DataTablePageSize.mjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"DataTablePageSize.mjs","names":[],"sources":["../../../../src/components/data-display/datatables/DataTablePageSize.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { dataTablePageSize } from '@mage-ui/styled-system/recipes';\n\nimport { useDataTableContext } from './useDataTableContext';\n\nexport type DataTablePageSizeProps = {\n value: number;\n options: number[];\n onChange: (size: number) => void;\n label?: string;\n classNames?: {\n root?: string;\n };\n};\n\nexport const DataTablePageSize = ({\n value,\n options,\n onChange,\n label,\n classNames,\n}: DataTablePageSizeProps): ReactNode => {\n const { labels } = useDataTableContext();\n const displayLabel = label ?? labels.rowsPerPage;\n\n return (\n <label className={classNames?.root ?? dataTablePageSize()}>\n <span>{displayLabel}</span>\n <select value={value} onChange={(e) => onChange(Number(e.target.value))}>\n {options.map((size) => (\n <option key={size} value={size}>\n {size}\n </option>\n ))}\n </select>\n </label>\n );\n};\n"],"mappings":"qLAgBA,MAAa,GAAqB,CAChC,QACA,UACA,WACA,QACA,gBACuC,CACvC,GAAM,CAAE,UAAW,GAAqB,CAClC,EAAe,GAAS,EAAO,YAErC,OACE,EAAC,QAAA,CAAM,UAAW,GAAY,MAAQ,GAAmB,WACvD,EAAC,OAAA,CAAA,SAAM,EAAA,CAAoB,CAC3B,EAAC,SAAA,CAAc,QAAO,SAAW,GAAM,EAAS,OAAO,EAAE,OAAO,MAAM,CAAC,UACpE,EAAQ,IAAK,GACZ,EAAC,SAAA,CAAkB,MAAO,WACvB,GADU,EAEJ,CACT,EACK,CAAA,EACH"}

package/dist/components/data-display/datatables/DataTablePagination.d.mts ADDED Viewed

@@ -0,0 +1,19 @@
+import { PaginationClassNames } from "../../navigations/pagination/Pagination.mjs";
+import { ReactNode } from "react";
+//#region src/components/data-display/datatables/DataTablePagination.d.ts
+type DataTablePaginationProps = {
+  withEdges?: boolean;
+  classNames?: {
+    root?: string;
+    pagination?: PaginationClassNames;
+    paginationWrapper?: string;
+  };
+};
+declare const DataTablePagination: ({
+  withEdges,
+  classNames
+}: DataTablePaginationProps) => ReactNode;
+//#endregion
+export { DataTablePagination, DataTablePaginationProps };
+//# sourceMappingURL=DataTablePagination.d.mts.map

package/dist/components/data-display/datatables/DataTablePagination.d.mts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"DataTablePagination.d.mts","names":[],"sources":["../../../../src/components/data-display/datatables/DataTablePagination.tsx"],"mappings":";;;;KAcY,wBAAA;EACV,SAAA;EACA,UAAA;IACE,IAAA;IACA,UAAA,GAAa,oBAAA;IACb,iBAAA;EAAA;AAAA;AAAA,cAIS,mBAAA;EAAuB,SAAA;EAAA;AAAA,GAGjC,wBAAA,KAA2B,SAAA"}

package/dist/components/data-display/datatables/DataTablePagination.mjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{useDataTableContext as e}from"./useDataTableContext.mjs";import{Pagination as t}from"../../navigations/pagination/Pagination.mjs";import{cx as n}from"@mage-ui/styled-system/css";import{dataTablePagination as r,paginationWrapper as i}from"@mage-ui/styled-system/recipes";import{jsx as a,jsxs as o}from"react/jsx-runtime";const s=({withEdges:s=!1,classNames:c})=>{let{pagination:l}=e();return l?a(`div`,{className:c?.root??r(),children:o(t.Root,{classNames:c?.pagination,total:l.pageCount,value:l.currentPage,onChange:e=>{l.onChange(t=>({...t,pageIndex:e-1}))},children:[s&&a(t.First,{}),o(`div`,{className:n(c?.paginationWrapper??i(),`group`),children:[a(t.Previous,{}),a(t.Items,{}),a(t.Next,{})]}),s&&a(t.Last,{})]})}):null};export{s as DataTablePagination};
2	+ //# sourceMappingURL=DataTablePagination.mjs.map

package/dist/components/data-display/datatables/DataTablePagination.mjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"DataTablePagination.mjs","names":[],"sources":["../../../../src/components/data-display/datatables/DataTablePagination.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n dataTablePagination,\n paginationWrapper,\n} from '@mage-ui/styled-system/recipes';\n\nimport {\n Pagination,\n type PaginationClassNames,\n} from '../../navigations/pagination/Pagination';\nimport { useDataTableContext } from './useDataTableContext';\n\nexport type DataTablePaginationProps = {\n withEdges?: boolean;\n classNames?: {\n root?: string;\n pagination?: PaginationClassNames;\n paginationWrapper?: string;\n };\n};\n\nexport const DataTablePagination = ({\n withEdges = false,\n classNames,\n}: DataTablePaginationProps): ReactNode => {\n const { pagination } = useDataTableContext();\n\n if (!pagination) {\n return null;\n }\n\n return (\n <div className={classNames?.root ?? dataTablePagination()}>\n <Pagination.Root\n classNames={classNames?.pagination}\n total={pagination.pageCount}\n value={pagination.currentPage}\n onChange={(page: number) => {\n pagination.onChange((current) => ({\n ...current,\n pageIndex: page - 1,\n }));\n }}\n >\n {withEdges && <Pagination.First />}\n <div\n className={cx(\n classNames?.paginationWrapper ?? paginationWrapper(),\n 'group',\n )}\n >\n <Pagination.Previous />\n <Pagination.Items />\n <Pagination.Next />\n </div>\n {withEdges && <Pagination.Last />}\n </Pagination.Root>\n </div>\n );\n};\n"],"mappings":"uUAuBA,MAAa,GAAuB,CAClC,YAAY,GACZ,gBACyC,CACzC,GAAM,CAAE,cAAe,GAAqB,CAM5C,OAJK,EAKH,EAAC,MAAA,CAAI,UAAW,GAAY,MAAQ,GAAqB,UACvD,EAAC,EAAW,KAAA,CACV,WAAY,GAAY,WACxB,MAAO,EAAW,UAClB,MAAO,EAAW,YAClB,SAAW,GAAiB,CAC1B,EAAW,SAAU,IAAa,CAChC,GAAG,EACH,UAAW,EAAO,EACnB,EAAE,YAGJ,GAAa,EAAC,EAAW,MAAA,EAAA,CAAQ,CAClC,EAAC,MAAA,CACC,UAAW,EACT,GAAY,mBAAqB,GAAmB,CACpD,QACD,WAED,EAAC,EAAW,SAAA,EAAA,CAAW,CACvB,EAAC,EAAW,MAAA,EAAA,CAAQ,CACpB,EAAC,EAAW,KAAA,EAAA,CAAO,GACf,CACL,GAAa,EAAC,EAAW,KAAA,EAAA,CAAO,GACjB,EACd,CA7BC"}

package/dist/components/data-display/datatables/{datatable-stateless/StatelessDataTableRootContainer.mjs → DataTableRootContainer.mjs} RENAMED Viewed

@@ -1,2 +1,2 @@
-import{cx as e}from"@mage-ui/styled-system/css";import{dataTable as t,dataTableRoot as n}from"@mage-ui/styled-system/recipes";import{jsx as r}from"react/jsx-runtime";const i=({busy:i,classNames:a,children:o})=>r(`div`,{"aria-busy":i||void 0,className:e(a?.dataTable??t(),a?.root??n()),children:o});export{i as StatelessDataTableRootContainer};
-//# sourceMappingURL=StatelessDataTableRootContainer.mjs.map
+import{cx as e}from"@mage-ui/styled-system/css";import{dataTable as t,dataTableRoot as n}from"@mage-ui/styled-system/recipes";import{jsx as r}from"react/jsx-runtime";const i=({busy:i,classNames:a,children:o})=>r(`div`,{"aria-busy":i||void 0,className:e(a?.dataTable??t(),a?.root??n()),children:o});export{i as DataTableRootContainer};
+//# sourceMappingURL=DataTableRootContainer.mjs.map

package/dist/components/data-display/datatables/DataTableRootContainer.mjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"DataTableRootContainer.mjs","names":["dataTableRecipe"],"sources":["../../../../src/components/data-display/datatables/DataTableRootContainer.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n dataTable as dataTableRecipe,\n dataTableRoot,\n} from '@mage-ui/styled-system/recipes';\n\nimport type { DataTableClassNames } from './DataTable';\n\ntype DataTableRootContainerProps = {\n busy?: boolean;\n classNames?: DataTableClassNames;\n children: ReactNode;\n};\n\nexport const DataTableRootContainer = ({\n busy,\n classNames,\n children,\n}: DataTableRootContainerProps): ReactNode => {\n return (\n <div\n aria-busy={busy || undefined}\n className={cx(\n classNames?.dataTable ?? dataTableRecipe(),\n classNames?.root ?? dataTableRoot(),\n )}\n >\n {children}\n </div>\n );\n};\n"],"mappings":"sKAgBA,MAAa,GAA0B,CACrC,OACA,aACA,cAGE,EAAC,MAAA,CACC,YAAW,GAAQ,IAAA,GACnB,UAAW,EACT,GAAY,WAAaA,GAAiB,CAC1C,GAAY,MAAQ,GAAe,CACpC,CAEA,YACG"}

package/dist/components/data-display/datatables/DataTableSkeleton.mjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{VisuallyHidden as e}from"../../misc/visually-hidden/VisuallyHidden.mjs";import{useDataTableContext as t}from"./useDataTableContext.mjs";import{dataTableSkeleton as n,dataTableSkeletonCell as r,dataTableSkeletonRow as i}from"@mage-ui/styled-system/recipes";import{jsx as a,jsxs as o}from"react/jsx-runtime";const s=[[`35%`,`45%`,`20%`],[`25%`,`55%`,`20%`],[`40%`,`35%`,`25%`]],c=({rows:c,className:l})=>{let{labels:u}=t();return o(`div`,{className:l??n(),role:`status`,"aria-busy":`true`,children:[a(e,{children:u.loading}),Array.from({length:c},(e,t)=>{let n=s[t%s.length];return a(`div`,{className:i(),children:n.map((e,t)=>a(`div`,{className:r(),style:{width:e}},t))},t)})]})};export{c as DataTableSkeleton};
2	+ //# sourceMappingURL=DataTableSkeleton.mjs.map