@mage-ui/components 0.0.51 → 0.0.53

package/dist/components/buttons/button/Button.d.ts

@@ -8,6 +8,7 @@ type ButtonProps = ComponentProps<'button'> & {
     inner?: string;
     label?: string;
     section?: string;
+    loader?: string;
   };
   startSlot?: ReactNode;
   endSlot?: ReactNode;

package/dist/components/buttons/button/Button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Button.d.ts","names":[],"sources":["../../../../src/components/buttons/button/Button.tsx"],"sourcesContent":[],"mappings":";;;;KAUY,WAAA,GAAc;;;IAAd,KAAA,CAAA,EAAA,MAAW;IAAA,KAAA,CAAA,EAAA,MAAA;IAAG,OAAA,CAAA,EAAA,MAAA;;WAQd,CAAA,EADE,SACF;SACC,CAAA,EADD,SACC;EAAS,QAAA,CAAA,EAAT,SAAS;AAGtB,CAAA;AAsBC,cAtBY,MAsBZ,EAAA,CAAA;EAAA,UAAA;EAAA,SAAA;EAAA,OAAA;EAAA,QAAA;EAAA,GAAA;AAAA,CAAA,EAhBE,WAgBF,EAAA,GAhBa,kBAAA,CAAA,GAAA,CAAA,OAgBb"}
+{"version":3,"file":"Button.d.ts","names":[],"sources":["../../../../src/components/buttons/button/Button.tsx"],"sourcesContent":[],"mappings":";;;;KAWY,WAAA,GAAc;;;IAAd,KAAA,CAAA,EAAA,MAAW;IAAA,KAAA,CAAA,EAAA,MAAA;IAAG,OAAA,CAAA,EAAA,MAAA;IAQZ,MAAA,CAAA,EAAA,MAAA;;WAED,CAAA,EAFC,SAED;EAAS,OAAA,CAAA,EADV,SACU;EAGT,QAAA,CAuBZ,EA1BY,SA0BZ;CAAA;AAvBsB,cAAV,MAAU,EAAA,CAAA;EAAA,UAAA;EAAA,SAAA;EAAA,OAAA;EAAA,QAAA;EAAA,GAAA;AAAA,CAAA,EAMpB,WANoB,EAAA,GAMT,kBAAA,CAAA,GAAA,CAAA,OANS"}

package/dist/components/buttons/button/Button.js

@@ -1,2 +1,2 @@
-import{button as e,buttonInner as t,buttonLabel as n,buttonSection as r}from"@mage-ui/styled-system/recipes";import{Button as i}from"@mantine/core";import{jsx as a}from"react/jsx-runtime";const o=({classNames:o,startSlot:s,endSlot:c,children:l,...u})=>a(i,{classNames:{root:o?.root??e(),inner:o?.inner??t(),label:o?.label??n(),section:o?.section??r()},leftSection:s,rightSection:c,...u,children:l});export{o as Button};
+import{button as e,buttonInner as t,buttonLabel as n,buttonLoader as r,buttonSection as i}from"@mage-ui/styled-system/recipes";import{Button as a}from"@mantine/core";import{jsx as o}from"react/jsx-runtime";const s=({classNames:s,startSlot:c,endSlot:l,children:u,...d})=>o(a,{classNames:{root:s?.root??e(),inner:s?.inner??t(),label:s?.label??n(),section:s?.section??i(),loader:s?.loader??r()},leftSection:c,rightSection:l,...d,children:u});export{s as Button};
 //# sourceMappingURL=Button.js.map

package/dist/components/buttons/button/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","names":["Button","MantineButton"],"sources":["../../../../src/components/buttons/button/Button.tsx"],"sourcesContent":["import type { ComponentProps, ReactNode } from 'react';\n\nimport {\n  button,\n  buttonInner,\n  buttonLabel,\n  buttonSection,\n} from '@mage-ui/styled-system/recipes';\nimport { Button as MantineButton } from '@mantine/core';\n\nexport type ButtonProps = ComponentProps<'button'> & {\n  classNames?: {\n    root?: string;\n    inner?: string;\n    label?: string;\n    section?: string;\n  };\n  startSlot?: ReactNode;\n  endSlot?: ReactNode;\n  children?: ReactNode;\n};\n\nexport const Button = ({\n  classNames,\n  startSlot,\n  endSlot,\n  children,\n  ...props\n}: ButtonProps) => {\n  return (\n    <MantineButton\n      classNames={{\n        root: classNames?.root ?? button(),\n        inner: classNames?.inner ?? buttonInner(),\n        label: classNames?.label ?? buttonLabel(),\n        section: classNames?.section ?? buttonSection(),\n      }}\n      leftSection={startSlot}\n      rightSection={endSlot}\n      {...props}\n    >\n      {children}\n    </MantineButton>\n  );\n};\n"],"mappings":"4LAsBA,MAAaA,GAAU,CACrB,aACA,YACA,UACA,WACA,GAAG,KAGD,EAACC,EAAAA,CACC,WAAY,CACV,KAAM,GAAY,MAAQ,GAAQ,CAClC,MAAO,GAAY,OAAS,GAAa,CACzC,MAAO,GAAY,OAAS,GAAa,CACzC,QAAS,GAAY,SAAW,GAAe,CAChD,CACD,YAAa,EACb,aAAc,EACd,GAAI,EAEH,YACa"}
+{"version":3,"file":"Button.js","names":["Button","MantineButton"],"sources":["../../../../src/components/buttons/button/Button.tsx"],"sourcesContent":["import type { ComponentProps, ReactNode } from 'react';\n\nimport {\n  button,\n  buttonInner,\n  buttonLabel,\n  buttonLoader,\n  buttonSection,\n} from '@mage-ui/styled-system/recipes';\nimport { Button as MantineButton } from '@mantine/core';\n\nexport type ButtonProps = ComponentProps<'button'> & {\n  classNames?: {\n    root?: string;\n    inner?: string;\n    label?: string;\n    section?: string;\n    loader?: string;\n  };\n  startSlot?: ReactNode;\n  endSlot?: ReactNode;\n  children?: ReactNode;\n};\n\nexport const Button = ({\n  classNames,\n  startSlot,\n  endSlot,\n  children,\n  ...props\n}: ButtonProps) => {\n  return (\n    <MantineButton\n      classNames={{\n        root: classNames?.root ?? button(),\n        inner: classNames?.inner ?? buttonInner(),\n        label: classNames?.label ?? buttonLabel(),\n        section: classNames?.section ?? buttonSection(),\n        loader: classNames?.loader ?? buttonLoader(),\n      }}\n      leftSection={startSlot}\n      rightSection={endSlot}\n      {...props}\n    >\n      {children}\n    </MantineButton>\n  );\n};\n"],"mappings":"8MAwBA,MAAaA,GAAU,CACrB,aACA,YACA,UACA,WACA,GAAG,KAGD,EAACC,EAAAA,CACC,WAAY,CACV,KAAM,GAAY,MAAQ,GAAQ,CAClC,MAAO,GAAY,OAAS,GAAa,CACzC,MAAO,GAAY,OAAS,GAAa,CACzC,QAAS,GAAY,SAAW,GAAe,CAC/C,OAAQ,GAAY,QAAU,GAAc,CAC7C,CACD,YAAa,EACb,aAAc,EACd,GAAI,EAEH,YACa"}

package/dist/components/buttons/button-icon/ButtonIcon.d.ts

@@ -1,5 +1,5 @@
 import { ButtonProps } from "../button/Button.js";
-import * as react_jsx_runtime5 from "react/jsx-runtime";
+import * as react_jsx_runtime4 from "react/jsx-runtime";
 
 //#region src/components/buttons/button-icon/ButtonIcon.d.ts
 type ButtonIconProps = ButtonProps & {
@@ -15,7 +15,7 @@ declare const ButtonIcon: ({
   icon,
   classNames,
   ...props
-}: ButtonIconProps) => react_jsx_runtime5.JSX.Element;
+}: ButtonIconProps) => react_jsx_runtime4.JSX.Element;
 //#endregion
 export { ButtonIcon, ButtonIconProps };
 //# sourceMappingURL=ButtonIcon.d.ts.map

package/dist/components/controls/dropdown/Menu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Menu.d.ts","names":[],"sources":["../../../../src/components/controls/dropdown/Menu.tsx"],"sourcesContent":[],"mappings":";;;;;KAQY,SAAA,GAAY,KACtB;UAGQ,KAAA,CAAM;;;IAJJ,MAAA,CAAA,EAAS,MAAA;IAAA,QAAA,CAAA,EAAA,MAAA;;kBAAG,CAAA,EAAA;IAId,IAAA,CAAM,EAAA,MAAA;IAYH,KAAM,CAAA,EAAA,MAAA;IACP,KAAM,CAAA,EAAA,MAAA;IACJ,OAAM,CAAA,EAAA,MAAA;EAAS,CAAA;EAGhB,QA+CZ,CAAA,EApDY,KAAA,CAAM,SAoDlB;EAAA,OAAA,CAAA,EAnDW,KAAA,CAAM,SAmDjB;cAlDa,KAAA,CAAM;;cAGP;;;;;;;;;;KASV,YAAS,kBAAA,CAAA,GAAA,CAAA;;;;OA6CkB,kBAAe,MAAA,CAAA;;;;KALxC,eAAA;OAKyB,EAAA,MAAA;UAAe,EAHjC,KAAA,CAAM,SAG2B;CAAA"}
+{"version":3,"file":"Menu.d.ts","names":[],"sources":["../../../../src/components/controls/dropdown/Menu.tsx"],"sourcesContent":[],"mappings":";;;;;KAQY,SAAA,GAAY,KACtB;UAGQ,KAAA,CAAM;;;IAJJ,MAAA,CAAA,EAAS,MAAA;IAAA,QAAA,CAAA,EAAA,MAAA;;kBAAG,CAAA,EAAA;IAId,IAAA,CAAM,EAAA,MAAA;IAYH,KAAM,CAAA,EAAA,MAAA;IACP,KAAM,CAAA,EAAA,MAAA;IACJ,OAAM,CAAA,EAAA,MAAA;EAAS,CAAA;EAGhB,QAgDZ,CAAA,EArDY,KAAA,CAAM,SAqDlB;EAAA,OAAA,CAAA,EApDW,KAAA,CAAM,SAoDjB;cAnDa,KAAA,CAAM;;cAGP;;;;;;;;;;KASV,YAAS,kBAAA,CAAA,GAAA,CAAA;;;;OA8CkB,kBAAe,MAAA,CAAA;;;;KALxC,eAAA;OAKyB,EAAA,MAAA;UAAe,EAHjC,KAAA,CAAM,SAG2B;CAAA"}

package/dist/components/controls/dropdown/Menu.js

@@ -1,2 +1,2 @@
-import{Button as e}from"../../buttons/button/Button.js";import{DropdownBase as t}from"./DropdownBase.js";import{comboboxOption as n,dropdown as r}from"@mage-ui/styled-system/recipes";import{jsx as i}from"react/jsx-runtime";import{Children as a,isValidElement as o}from"react";const s=({label:c,a11yLabel:l,classNames:u,buttonClassNames:d,children:f,endSlot:p,startSlot:m,...h})=>{let g=a.toArray(f).filter(e=>o(e)&&e.type===s.Option);return i(t,{setSelectedOption:()=>{},target:i(e,{classNames:d,...l&&{"aria-label":l},children:c}),classNames:{dropdown:u?.dropdown??r()},startSlot:m,endSlot:p,...h,children:g.map(e=>{let{value:r,children:a}=e.props;return i(t.Option,{value:r,classNames:{option:u?.option??n()},children:a})})})},c=({children:e})=>e;c.displayName=`Menu.Option`,s.Option=c;export{s as Menu};
+import{Button as e}from"../../buttons/button/Button.js";import{DropdownBase as t}from"./DropdownBase.js";import{comboboxOption as n,dropdown as r}from"@mage-ui/styled-system/recipes";import{jsx as i}from"react/jsx-runtime";import{Children as a,isValidElement as o}from"react";const s=({label:c,a11yLabel:l,classNames:u,buttonClassNames:d,children:f,endSlot:p,startSlot:m,...h})=>{let g=a.toArray(f).filter(e=>o(e)&&e.type===s.Option);return i(t,{setSelectedOption:()=>{},target:i(e,{classNames:d,...l&&{"aria-label":l},children:c}),classNames:{dropdown:u?.dropdown??r()},startSlot:m,endSlot:p,...h,children:g.map(e=>{let{value:r,children:a}=e.props;return i(t.Option,{value:r,classNames:{option:u?.option??n()},children:a},r)})})},c=({children:e})=>e;c.displayName=`Menu.Option`,s.Option=c;export{s as Menu};
 //# sourceMappingURL=Menu.js.map

package/dist/components/controls/dropdown/Menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"Menu.js","names":["children"],"sources":["../../../../src/components/controls/dropdown/Menu.tsx"],"sourcesContent":["import { Children, isValidElement } from 'react';\n\nimport { comboboxOption, dropdown } from '@mage-ui/styled-system/recipes';\n// import type { FloatingPosition, PopoverWidth } from '@mantine/core';\nimport { Button } from '@/components/buttons';\n\nimport { DropdownBase, type DropdownBaseProps } from './DropdownBase';\n\nexport type MenuProps = Omit<\n  DropdownBaseProps,\n  'setSelectedOption' | 'target' | 'opened'\n> & {\n  label?: React.ReactNode;\n  a11yLabel?: string;\n  classNames?: {\n    option?: string;\n    dropdown?: string;\n  };\n  buttonClassNames?: {\n    root?: string;\n    inner?: string;\n    label?: string;\n    section?: string;\n  };\n  children?: React.ReactNode;\n  endSlot?: React.ReactNode;\n  startSlot?: React.ReactNode;\n};\n\nexport const Menu = ({\n  label,\n  a11yLabel,\n  classNames,\n  buttonClassNames,\n  children,\n  endSlot,\n  startSlot,\n  ...props\n}: MenuProps) => {\n  const options = Children.toArray(children).filter(\n    (child): child is React.ReactElement<MenuOptionProps> =>\n      isValidElement(child) && child.type === Menu.Option,\n  );\n\n  return (\n    <DropdownBase\n      setSelectedOption={() => {}}\n      target={\n        <Button\n          classNames={buttonClassNames}\n          {...(a11yLabel && { 'aria-label': a11yLabel })}\n        >\n          {label}\n        </Button>\n      }\n      classNames={{\n        dropdown: classNames?.dropdown ?? dropdown(),\n      }}\n      startSlot={startSlot}\n      endSlot={endSlot}\n      {...props}\n    >\n      {options.map((child) => {\n        const { value, children } = child.props;\n\n        return (\n          <DropdownBase.Option\n            value={value}\n            classNames={{ option: classNames?.option ?? comboboxOption() }}\n          >\n            {children}\n          </DropdownBase.Option>\n        );\n      })}\n    </DropdownBase>\n  );\n};\n\ntype MenuOptionProps = {\n  value: string;\n  children: React.ReactNode;\n};\n\nconst Option = ({ children }: MenuOptionProps) => {\n  return children;\n};\n\nOption.displayName = 'Menu.Option';\nMenu.Option = Option;\n"],"mappings":"oRA6BA,MAAa,GAAQ,CACnB,QACA,YACA,aACA,mBACA,WACA,UACA,YACA,GAAG,KACY,CACf,IAAM,EAAU,EAAS,QAAQ,EAAS,CAAC,OACxC,GACC,EAAe,EAAM,EAAI,EAAM,OAAS,EAAK,OAChD,CAED,OACE,EAAC,EAAA,CACC,sBAAyB,GACzB,OACE,EAAC,EAAA,CACC,WAAY,EACZ,GAAK,GAAa,CAAE,aAAc,EAAW,UAE5C,GACM,CAEX,WAAY,CACV,SAAU,GAAY,UAAY,GAAU,CAC7C,CACU,YACF,UACT,GAAI,WAEH,EAAQ,IAAK,GAAU,CACtB,GAAM,CAAE,QAAO,SAAA,GAAa,EAAM,MAElC,OACE,EAAC,EAAa,OAAA,CACL,QACP,WAAY,CAAE,OAAQ,GAAY,QAAU,GAAgB,CAAE,UAE7DA,GACmB,EAExB,EACW,EASb,GAAU,CAAE,cACT,EAGT,EAAO,YAAc,cACrB,EAAK,OAAS"}
+{"version":3,"file":"Menu.js","names":["children"],"sources":["../../../../src/components/controls/dropdown/Menu.tsx"],"sourcesContent":["import { Children, isValidElement } from 'react';\n\nimport { comboboxOption, dropdown } from '@mage-ui/styled-system/recipes';\n// import type { FloatingPosition, PopoverWidth } from '@mantine/core';\nimport { Button } from '@/components/buttons';\n\nimport { DropdownBase, type DropdownBaseProps } from './DropdownBase';\n\nexport type MenuProps = Omit<\n  DropdownBaseProps,\n  'setSelectedOption' | 'target' | 'opened'\n> & {\n  label?: React.ReactNode;\n  a11yLabel?: string;\n  classNames?: {\n    option?: string;\n    dropdown?: string;\n  };\n  buttonClassNames?: {\n    root?: string;\n    inner?: string;\n    label?: string;\n    section?: string;\n  };\n  children?: React.ReactNode;\n  endSlot?: React.ReactNode;\n  startSlot?: React.ReactNode;\n};\n\nexport const Menu = ({\n  label,\n  a11yLabel,\n  classNames,\n  buttonClassNames,\n  children,\n  endSlot,\n  startSlot,\n  ...props\n}: MenuProps) => {\n  const options = Children.toArray(children).filter(\n    (child): child is React.ReactElement<MenuOptionProps> =>\n      isValidElement(child) && child.type === Menu.Option,\n  );\n\n  return (\n    <DropdownBase\n      setSelectedOption={() => {}}\n      target={\n        <Button\n          classNames={buttonClassNames}\n          {...(a11yLabel && { 'aria-label': a11yLabel })}\n        >\n          {label}\n        </Button>\n      }\n      classNames={{\n        dropdown: classNames?.dropdown ?? dropdown(),\n      }}\n      startSlot={startSlot}\n      endSlot={endSlot}\n      {...props}\n    >\n      {options.map((child) => {\n        const { value, children } = child.props;\n\n        return (\n          <DropdownBase.Option\n            key={value}\n            value={value}\n            classNames={{ option: classNames?.option ?? comboboxOption() }}\n          >\n            {children}\n          </DropdownBase.Option>\n        );\n      })}\n    </DropdownBase>\n  );\n};\n\ntype MenuOptionProps = {\n  value: string;\n  children: React.ReactNode;\n};\n\nconst Option = ({ children }: MenuOptionProps) => {\n  return children;\n};\n\nOption.displayName = 'Menu.Option';\nMenu.Option = Option;\n"],"mappings":"oRA6BA,MAAa,GAAQ,CACnB,QACA,YACA,aACA,mBACA,WACA,UACA,YACA,GAAG,KACY,CACf,IAAM,EAAU,EAAS,QAAQ,EAAS,CAAC,OACxC,GACC,EAAe,EAAM,EAAI,EAAM,OAAS,EAAK,OAChD,CAED,OACE,EAAC,EAAA,CACC,sBAAyB,GACzB,OACE,EAAC,EAAA,CACC,WAAY,EACZ,GAAK,GAAa,CAAE,aAAc,EAAW,UAE5C,GACM,CAEX,WAAY,CACV,SAAU,GAAY,UAAY,GAAU,CAC7C,CACU,YACF,UACT,GAAI,WAEH,EAAQ,IAAK,GAAU,CACtB,GAAM,CAAE,QAAO,SAAA,GAAa,EAAM,MAElC,OACE,EAAC,EAAa,OAAA,CAEL,QACP,WAAY,CAAE,OAAQ,GAAY,QAAU,GAAgB,CAAE,UAE7DA,GAJI,EAKe,EAExB,EACW,EASb,GAAU,CAAE,cACT,EAGT,EAAO,YAAc,cACrB,EAAK,OAAS"}

package/dist/components/navigation/breadcrumbs/Breadcrumbs.d.ts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime4 from "react/jsx-runtime";
+import * as react_jsx_runtime5 from "react/jsx-runtime";
 import { ReactNode } from "react";
 
 //#region src/components/navigation/breadcrumbs/Breadcrumbs.d.ts
@@ -17,7 +17,7 @@ declare const Breadcrumbs: {
     separator,
     children,
     classNames
-  }: BreadcrumbsProps): react_jsx_runtime4.JSX.Element;
+  }: BreadcrumbsProps): react_jsx_runtime5.JSX.Element;
   Item: {
     ({
       children

package/dist/panda.json

@@ -85,6 +85,7 @@
       "buttonInner": [],
       "buttonLabel": [],
       "buttonSection": [],
+      "buttonLoader": [],
       "buttonIcon": [
         "variant]___[value:filled]___[recipe:buttonIcon",
         "color]___[value:neutral]___[recipe:buttonIcon",
@@ -164,22 +165,22 @@
         "size]___[value:s]___[recipe:inputButton",
         "color]___[value:neutral]___[recipe:inputButton"
       ],
-      "multiSwitchSettings": [],
-      "multiSwitchRoot": [],
-      "multiSwitchLabel": [],
-      "multiSwitchGroupRoot": [],
-      "radioRoot": [],
       "radio": [],
+      "radioBody": [],
+      "radioDescription": [],
+      "radioError": [],
       "radioIcon": [],
       "radioInner": [],
-      "radioBody": [],
-      "radioLabelWrapper": [],
       "radioLabel": [
         "size]___[value:l]___[recipe:radioLabel"
       ],
-      "radioDescription": [],
-      "radioError": [],
+      "radioLabelWrapper": [],
+      "radioRoot": [],
       "radioGroupRoot": [],
+      "multiSwitchSettings": [],
+      "multiSwitchRoot": [],
+      "multiSwitchLabel": [],
+      "multiSwitchGroupRoot": [],
       "radioOnlyIconRoot": [],
       "radioOnlyIconSettings": [],
       "radioOnlyIcon": [],

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mage-ui/components",
-  "version": "0.0.51",
+  "version": "0.0.53",
   "private": false,
   "description": "",
   "keywords": [],
@@ -26,8 +26,8 @@
     "rimraf": "^6.0.1",
     "tsdown": "^0.15.6",
     "typescript": "^5.9.3",
-    "@mage-ui/preset": "0.0.51",
-    "@mage-ui/styled-system": "0.0.51"
+    "@mage-ui/preset": "0.0.53",
+    "@mage-ui/styled-system": "0.0.53"
   },
   "peerDependencies": {
     "@hookform/resolvers": "^5.2.2",