@mage-ui/components 0.0.80 → 0.0.81
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/buttons/button/Button.d.ts +2 -2
- package/dist/components/buttons/button-icon/ButtonIcon.d.ts +2 -2
- package/dist/components/controls/checkbox/Checkbox.d.ts +1 -0
- package/dist/components/controls/checkbox/Checkbox.d.ts.map +1 -1
- package/dist/components/controls/checkbox/Checkbox.js.map +1 -1
- package/dist/components/controls/dropdown/Combobox.d.ts +0 -1
- package/dist/components/controls/dropdown/Combobox.d.ts.map +1 -1
- package/dist/components/controls/dropdown/Combobox.js +1 -1
- package/dist/components/controls/dropdown/Combobox.js.map +1 -1
- package/dist/components/navigation/breadcrumbs/Breadcrumbs.d.ts +2 -2
- package/dist/components/navigation/tabs/Tabs.d.ts +5 -5
- package/package.json +3 -3
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as react_jsx_runtime5 from "react/jsx-runtime";
|
|
2
2
|
import { ComponentProps, ReactNode } from "react";
|
|
3
3
|
|
|
4
4
|
//#region src/components/buttons/button/Button.d.ts
|
|
@@ -20,7 +20,7 @@ declare const Button: ({
|
|
|
20
20
|
endSlot,
|
|
21
21
|
children,
|
|
22
22
|
...props
|
|
23
|
-
}: ButtonProps) =>
|
|
23
|
+
}: ButtonProps) => react_jsx_runtime5.JSX.Element;
|
|
24
24
|
//#endregion
|
|
25
25
|
export { Button, ButtonProps };
|
|
26
26
|
//# sourceMappingURL=Button.d.ts.map
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ButtonProps } from "../button/Button.js";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
3
3
|
|
|
4
4
|
//#region src/components/buttons/button-icon/ButtonIcon.d.ts
|
|
5
5
|
type ButtonIconProps = ButtonProps & {
|
|
@@ -15,7 +15,7 @@ declare const ButtonIcon: ({
|
|
|
15
15
|
icon,
|
|
16
16
|
classNames,
|
|
17
17
|
...props
|
|
18
|
-
}: ButtonIconProps) =>
|
|
18
|
+
}: ButtonIconProps) => react_jsx_runtime0.JSX.Element;
|
|
19
19
|
//#endregion
|
|
20
20
|
export { ButtonIcon, ButtonIconProps };
|
|
21
21
|
//# sourceMappingURL=ButtonIcon.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Checkbox.d.ts","names":[],"sources":["../../../../src/components/controls/checkbox/Checkbox.tsx"],"sourcesContent":[],"mappings":";;;KAeY,aAAA,GAAgB,KAAK;UACvB;EADE,WAAA,CAAA,EAEI,SAFS;EAAA,KAAA,CAAA,EAAA,MAAA;MAAQ,CAAA,EAAA,MAAA;SAAL,CAAA,EAAA,OAAA;OAClB,CAAA,EAKA,SALA;UACM,CAAA,EAAA,OAAA;
|
|
1
|
+
{"version":3,"file":"Checkbox.d.ts","names":[],"sources":["../../../../src/components/controls/checkbox/Checkbox.tsx"],"sourcesContent":[],"mappings":";;;KAeY,aAAA,GAAgB,KAAK;UACvB;EADE,WAAA,CAAA,EAEI,SAFS;EAAA,KAAA,CAAA,EAAA,MAAA;MAAQ,CAAA,EAAA,MAAA;SAAL,CAAA,EAAA,OAAA;OAClB,CAAA,EAKA,SALA;UACM,CAAA,EAAA,OAAA;eAIN,CAAA,EAAA,OAAA;EAAS,UAAA,CAAA,EAAA;IAeN,YAoBZ,CAAA,EAAA,MAAA;IAAA,mBAAA,CAAA,EAAA,MAAA;;IAjBE,YAAA,CAAA,EAAA,MAAA;IAAgB,aAAA,CAAA,EAAA,MAAA;IAAS,aAAA,CAAA,EAAA,MAAA;;;;;cAHf;;;;KAGV,gBAAgB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Checkbox.js","names":["Checkbox","CheckboxMantine"],"sources":["../../../../src/components/controls/checkbox/Checkbox.tsx"],"sourcesContent":["import type { ComponentProps, ReactNode } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n checkboxBody,\n checkboxDescription,\n checkboxError,\n checkboxIcon,\n checkboxInner,\n checkboxInput,\n checkboxLabel,\n checkboxLabelWrapper,\n} from '@mage-ui/styled-system/recipes';\nimport { Checkbox as CheckboxMantine } from '@mantine/core';\n\nexport type CheckboxProps = Omit<ComponentProps<'input'>, 'size'> & {\n error?: ReactNode;\n description?: ReactNode;\n value?: string;\n name?: string;\n checked?: boolean;\n label?: ReactNode;\n disabled?: boolean;\n classNames?: {\n checkboxBody?: string;\n checkboxDescription?: string;\n checkboxError?: string;\n checkboxIcon?: string;\n checkboxInner?: string;\n checkboxInput?: string;\n checkboxLabel?: string;\n checkboxLabelWrapper?: string;\n };\n};\n\nexport const Checkbox = ({\n classNames,\n ...props\n}: CheckboxProps): ReactNode => {\n return (\n <CheckboxMantine\n classNames={{\n body: classNames?.checkboxBody ?? checkboxBody(),\n labelWrapper:\n classNames?.checkboxLabelWrapper ?? checkboxLabelWrapper(),\n label: classNames?.checkboxLabel ?? checkboxLabel(),\n description: classNames?.checkboxDescription ?? checkboxDescription(),\n error: classNames?.checkboxError ?? checkboxError(),\n input: cx(classNames?.checkboxInput ?? checkboxInput(), 'peer'),\n inner: classNames?.checkboxInner ?? checkboxInner(),\n icon: classNames?.checkboxIcon ?? checkboxIcon(),\n }}\n {...props}\n />\n );\n};\n\nCheckbox.displayName = 'Checkbox';\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Checkbox.js","names":["Checkbox","CheckboxMantine"],"sources":["../../../../src/components/controls/checkbox/Checkbox.tsx"],"sourcesContent":["import type { ComponentProps, ReactNode } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n checkboxBody,\n checkboxDescription,\n checkboxError,\n checkboxIcon,\n checkboxInner,\n checkboxInput,\n checkboxLabel,\n checkboxLabelWrapper,\n} from '@mage-ui/styled-system/recipes';\nimport { Checkbox as CheckboxMantine } from '@mantine/core';\n\nexport type CheckboxProps = Omit<ComponentProps<'input'>, 'size'> & {\n error?: ReactNode;\n description?: ReactNode;\n value?: string;\n name?: string;\n checked?: boolean;\n label?: ReactNode;\n disabled?: boolean;\n indeterminate?: boolean;\n classNames?: {\n checkboxBody?: string;\n checkboxDescription?: string;\n checkboxError?: string;\n checkboxIcon?: string;\n checkboxInner?: string;\n checkboxInput?: string;\n checkboxLabel?: string;\n checkboxLabelWrapper?: string;\n };\n};\n\nexport const Checkbox = ({\n classNames,\n ...props\n}: CheckboxProps): ReactNode => {\n return (\n <CheckboxMantine\n classNames={{\n body: classNames?.checkboxBody ?? checkboxBody(),\n labelWrapper:\n classNames?.checkboxLabelWrapper ?? checkboxLabelWrapper(),\n label: classNames?.checkboxLabel ?? checkboxLabel(),\n description: classNames?.checkboxDescription ?? checkboxDescription(),\n error: classNames?.checkboxError ?? checkboxError(),\n input: cx(classNames?.checkboxInput ?? checkboxInput(), 'peer'),\n inner: classNames?.checkboxInner ?? checkboxInner(),\n icon: classNames?.checkboxIcon ?? checkboxIcon(),\n }}\n {...props}\n />\n );\n};\n\nCheckbox.displayName = 'Checkbox';\n"],"mappings":"gVAoCA,MAAaA,GAAY,CACvB,aACA,GAAG,KAGD,EAACC,EAAAA,CACC,WAAY,CACV,KAAM,GAAY,cAAgB,GAAc,CAChD,aACE,GAAY,sBAAwB,GAAsB,CAC5D,MAAO,GAAY,eAAiB,GAAe,CACnD,YAAa,GAAY,qBAAuB,GAAqB,CACrE,MAAO,GAAY,eAAiB,GAAe,CACnD,MAAO,EAAG,GAAY,eAAiB,GAAe,CAAE,OAAO,CAC/D,MAAO,GAAY,eAAiB,GAAe,CACnD,KAAM,GAAY,cAAgB,GAAc,CACjD,CACD,GAAI,GACJ,CAIN,EAAS,YAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Combobox.d.ts","names":[],"sources":["../../../../src/components/controls/dropdown/Combobox.tsx"],"sourcesContent":[],"mappings":";;;;;;
|
|
1
|
+
{"version":3,"file":"Combobox.d.ts","names":[],"sources":["../../../../src/components/controls/dropdown/Combobox.tsx"],"sourcesContent":[],"mappings":";;;;;;KAgBY,aAAA,GAAgB,KAC1B,qEAGA;;;IAJU,KAAA,EAAA,MAAa;EAAA,CAAA,GAAA,SAAA,EAAA,GAAA,IAAA;SACvB,EAAA;IAD0B,EAAA,EAAA,MAAA,GAAA,MAAA;IAI1B,KAAA,EAAA,MAAA;KAaY;EAAe,SAAA,CAAA,EAAA,OAAA;EAGhB,UAAA,CAoFZ,EAAA;IAAA,MAAA,CAAA,EAAA,MAAA;IApFwB,KAAA,CAAA,EAAA,MAAA;IAAA,MAAA,CAAA,EAAA,MAAA;;QAAA,CAAA,EAAA,MAAA;OAAA,CAAA,EAAA,MAAA;SAAA,CAAA,EAHX,KAAA,CAAM,SAGK;;AAAA,cAAZ,QAAY,EAAA,CAAA;EAAA,aAAA;EAAA,SAAA;EAAA,iBAAA;EAAA,cAAA;EAAA,OAAA;EAAA,OAAA;EAAA,UAAA;EAAA,MAAA;EAAA,KAAA;EAAA,GAAA;AAAA,CAAA,EAWtB,aAXsB,EAAA,GAWT,kBAAA,CAAA,GAAA,CAAA,OAXS"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{Icon as e}from"../../data-display/icons/icon/Icon.js";import{DropdownBase as t}from"./DropdownBase.js";import{InputText as n}from"../input-text/InputText.js";import{comboboxEmpty as r,comboboxOption as i,
|
|
1
|
+
import{Icon as e}from"../../data-display/icons/icon/Icon.js";import{DropdownBase as t}from"./DropdownBase.js";import{InputText as n}from"../input-text/InputText.js";import{comboboxEmpty as r,comboboxOption as i,icon as a,inputSection as o,selectSection as s}from"@mage-ui/styled-system/recipes";import{jsx as c,jsxs as l}from"react/jsx-runtime";import{useState as u}from"react";import{cx as d}from"@mage-ui/styled-system/css";const f=({defaultOpened:f=!1,creatable:p,setSelectedOption:m,selectedOption:h,endSlot:g,options:_,classNames:v,create:y,empty:b,...x})=>{let[S,C]=u(h?.value??``),w=(_.every(e=>e.value!==S)?_.filter(e=>e.value.toLowerCase().includes(S.toLowerCase().trim())):_).map(e=>c(t.Option,{value:e.value,active:h?.id===e.id,classNames:{option:v?.option??i()},children:e.value},e.id)),T=()=>p&&S?l(t.Option,{value:S,classNames:{option:v?.create??i({type:`create`})},children:[c(e,{name:`plus`,classNames:a({size:`m`})}),`${y??`Create`} '${S}'`]},S):c(t.Empty,{classNames:{empty:v?.empty??r()},children:b??`Nothing found`}),E=e=>{let t=_.find(t=>t.value===e);!t&&p&&e&&(t={id:`new`,value:e}),m(t)};return c(t,{readOnly:!1,target:c(n,{value:S,classNames:{section:v?.section??d(o(),s())},...x}),selectedOption:h,setQuery:C,setSelectedOption:e=>E(e),endSlot:g,children:w.length>0?w:c(T,{})})};export{f as Combobox};
|
|
2
2
|
//# sourceMappingURL=Combobox.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Combobox.js","names":[],"sources":["../../../../src/components/controls/dropdown/Combobox.tsx"],"sourcesContent":["import type React from 'react';\nimport { useState } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n comboboxEmpty,\n comboboxOption,\n
|
|
1
|
+
{"version":3,"file":"Combobox.js","names":[],"sources":["../../../../src/components/controls/dropdown/Combobox.tsx"],"sourcesContent":["import type React from 'react';\nimport { useState } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n comboboxEmpty,\n comboboxOption,\n icon,\n inputSection,\n selectSection,\n} from '@mage-ui/styled-system/recipes';\nimport { InputText, type InputTextProps } from '@/components/controls';\nimport { Icon } from '@/components/data-display';\n\nimport { DropdownBase, type DropdownBaseProps } from './DropdownBase';\n\nexport type ComboboxProps = Omit<\n DropdownBaseProps,\n 'children' | 'onClick' | 'setQuery' | 'target'\n> &\n InputTextProps & {\n setSelectedOption: (\n option: { id: string | number; value: string } | undefined,\n ) => void;\n options: { id: string | number; value: string }[];\n creatable?: boolean;\n classNames?: {\n option?: string;\n empty?: string;\n create?: string;\n };\n create?: string;\n empty?: string;\n endSlot?: React.ReactNode;\n };\n\nexport const Combobox = ({\n defaultOpened = false,\n creatable,\n setSelectedOption,\n selectedOption,\n endSlot,\n options,\n classNames,\n create,\n empty,\n ...props\n}: ComboboxProps) => {\n const [query, setQuery] = useState(selectedOption?.value ?? '');\n\n const shouldFilterOptions = options.every((item) => item.value !== query);\n const filteredOptions = shouldFilterOptions\n ? options.filter((item) =>\n item.value.toLowerCase().includes(query.toLowerCase().trim()),\n )\n : options;\n\n const dropdownOptions = filteredOptions.map((option) => (\n <DropdownBase.Option\n value={option.value}\n key={option.id}\n active={selectedOption?.id === option.id}\n classNames={{ option: classNames?.option ?? comboboxOption() }}\n >\n {option.value}\n </DropdownBase.Option>\n ));\n\n const MissingOption = () => {\n if (creatable && query) {\n return (\n <DropdownBase.Option\n value={query}\n key={query}\n classNames={{\n option: classNames?.create ?? comboboxOption({ type: 'create' }),\n }}\n >\n <Icon name='plus' classNames={icon({ size: 'm' })} />\n {`${create ?? 'Create'} '${query}'`}\n </DropdownBase.Option>\n );\n }\n return (\n <DropdownBase.Empty\n classNames={{ empty: classNames?.empty ?? comboboxEmpty() }}\n >\n {empty ?? 'Nothing found'}\n </DropdownBase.Empty>\n );\n };\n\n const onChange = (value: string | undefined) => {\n let selected = options.find((item) => item.value === value);\n if (!selected && creatable && value) {\n selected = { id: 'new', value };\n }\n setSelectedOption(selected);\n };\n\n return (\n <DropdownBase\n readOnly={false}\n target={\n <InputText\n value={query}\n classNames={{\n section: classNames?.section ?? cx(inputSection(), selectSection()),\n }}\n {...props}\n />\n }\n selectedOption={selectedOption}\n setQuery={setQuery}\n setSelectedOption={(option) => onChange(option)}\n endSlot={endSlot}\n >\n {dropdownOptions.length > 0 ? dropdownOptions : <MissingOption />}\n </DropdownBase>\n );\n};\n"],"mappings":"0aAoCA,MAAa,GAAY,CACvB,gBAAgB,GAChB,YACA,oBACA,iBACA,UACA,UACA,aACA,SACA,QACA,GAAG,KACgB,CACnB,GAAM,CAAC,EAAO,GAAY,EAAS,GAAgB,OAAS,GAAG,CASzD,GAPsB,EAAQ,MAAO,GAAS,EAAK,QAAU,EAAM,CAErE,EAAQ,OAAQ,GACd,EAAK,MAAM,aAAa,CAAC,SAAS,EAAM,aAAa,CAAC,MAAM,CAAC,CAC9D,CACD,GAEoC,IAAK,GAC3C,EAAC,EAAa,OAAA,CACZ,MAAO,EAAO,MAEd,OAAQ,GAAgB,KAAO,EAAO,GACtC,WAAY,CAAE,OAAQ,GAAY,QAAU,GAAgB,CAAE,UAE7D,EAAO,OAJH,EAAO,GAKQ,CACtB,CAEI,MACA,GAAa,EAEb,EAAC,EAAa,OAAA,CACZ,MAAO,EAEP,WAAY,CACV,OAAQ,GAAY,QAAU,EAAe,CAAE,KAAM,SAAU,CAAC,CACjE,WAED,EAAC,EAAA,CAAK,KAAK,OAAO,WAAY,EAAK,CAAE,KAAM,IAAK,CAAC,EAAI,CACpD,GAAG,GAAU,SAAS,IAAI,EAAM,GAAA,EAN5B,EAOe,CAIxB,EAAC,EAAa,MAAA,CACZ,WAAY,CAAE,MAAO,GAAY,OAAS,GAAe,CAAE,UAE1D,GAAS,iBACS,CAInB,EAAY,GAA8B,CAC9C,IAAI,EAAW,EAAQ,KAAM,GAAS,EAAK,QAAU,EAAM,CACvD,CAAC,GAAY,GAAa,IAC5B,EAAW,CAAE,GAAI,MAAO,QAAO,EAEjC,EAAkB,EAAS,EAG7B,OACE,EAAC,EAAA,CACC,SAAU,GACV,OACE,EAAC,EAAA,CACC,MAAO,EACP,WAAY,CACV,QAAS,GAAY,SAAW,EAAG,GAAc,CAAE,GAAe,CAAC,CACpE,CACD,GAAI,GACJ,CAEY,iBACN,WACV,kBAAoB,GAAW,EAAS,EAAO,CACtC,mBAER,EAAgB,OAAS,EAAI,EAAkB,EAAC,EAAA,EAAA,CAAgB,EACpD"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as react_jsx_runtime6 from "react/jsx-runtime";
|
|
2
2
|
import { ReactNode } from "react";
|
|
3
3
|
|
|
4
4
|
//#region src/components/navigation/breadcrumbs/Breadcrumbs.d.ts
|
|
@@ -17,7 +17,7 @@ declare const Breadcrumbs: {
|
|
|
17
17
|
separator,
|
|
18
18
|
children,
|
|
19
19
|
classNames
|
|
20
|
-
}: BreadcrumbsProps):
|
|
20
|
+
}: BreadcrumbsProps): react_jsx_runtime6.JSX.Element;
|
|
21
21
|
Item: {
|
|
22
22
|
({
|
|
23
23
|
children
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { TabsListProps } from "./TabsList.js";
|
|
2
2
|
import { TabsTabProps } from "./TabsTab.js";
|
|
3
3
|
import { TabsPanelProps } from "./TabsPanel.js";
|
|
4
|
-
import * as
|
|
4
|
+
import * as react_jsx_runtime1 from "react/jsx-runtime";
|
|
5
5
|
import React from "react";
|
|
6
6
|
|
|
7
7
|
//#region src/components/navigation/tabs/Tabs.d.ts
|
|
@@ -18,14 +18,14 @@ declare const Tabs: {
|
|
|
18
18
|
classNames,
|
|
19
19
|
children,
|
|
20
20
|
...props
|
|
21
|
-
}: TabsProps):
|
|
21
|
+
}: TabsProps): react_jsx_runtime1.JSX.Element;
|
|
22
22
|
displayName: string;
|
|
23
23
|
List: {
|
|
24
24
|
({
|
|
25
25
|
classNames,
|
|
26
26
|
children,
|
|
27
27
|
...props
|
|
28
|
-
}: TabsListProps):
|
|
28
|
+
}: TabsListProps): react_jsx_runtime1.JSX.Element;
|
|
29
29
|
displayName: string;
|
|
30
30
|
};
|
|
31
31
|
Tab: {
|
|
@@ -35,7 +35,7 @@ declare const Tabs: {
|
|
|
35
35
|
endSlot,
|
|
36
36
|
children,
|
|
37
37
|
...props
|
|
38
|
-
}: TabsTabProps):
|
|
38
|
+
}: TabsTabProps): react_jsx_runtime1.JSX.Element;
|
|
39
39
|
displayName: string;
|
|
40
40
|
};
|
|
41
41
|
Panel: {
|
|
@@ -43,7 +43,7 @@ declare const Tabs: {
|
|
|
43
43
|
classNames,
|
|
44
44
|
children,
|
|
45
45
|
...props
|
|
46
|
-
}: TabsPanelProps):
|
|
46
|
+
}: TabsPanelProps): react_jsx_runtime1.JSX.Element;
|
|
47
47
|
displayName: string;
|
|
48
48
|
};
|
|
49
49
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mage-ui/components",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.81",
|
|
4
4
|
"private": false,
|
|
5
5
|
"description": "",
|
|
6
6
|
"keywords": [],
|
|
@@ -26,8 +26,8 @@
|
|
|
26
26
|
"rimraf": "^6.0.1",
|
|
27
27
|
"tsdown": "^0.15.6",
|
|
28
28
|
"typescript": "^5.9.3",
|
|
29
|
-
"@mage-ui/preset": "0.0.
|
|
30
|
-
"@mage-ui/styled-system": "0.0.
|
|
29
|
+
"@mage-ui/preset": "0.0.81",
|
|
30
|
+
"@mage-ui/styled-system": "0.0.81"
|
|
31
31
|
},
|
|
32
32
|
"peerDependencies": {
|
|
33
33
|
"@hookform/resolvers": "^5.2.2",
|