@mage-ui/components 1.0.16 → 1.0.18

package/dist/components/data-display/icons/icon-svg/IconSvg.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconSvg.mjs","names":[],"sources":["../../../../../src/components/data-display/icons/icon-svg/IconSvg.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n  iconSvg,\n  iconSvgRoot,\n  iconSvgSvg,\n} from '@mage-ui/styled-system/recipes';\n\nexport type IconSvgProps = {\n  classNames?: {\n    iconSvg?: string;\n    root?: string;\n    svg?: string;\n  };\n  width?: number | string;\n  height?: number | string;\n  viewBox?: string;\n  children: ReactNode;\n};\n\nexport const IconSvg = ({\n  classNames,\n  children,\n  width,\n  height,\n  viewBox,\n}: IconSvgProps): ReactNode => {\n  return (\n    <span\n      className={cx(\n        classNames?.iconSvg ?? iconSvg(),\n        classNames?.root ?? iconSvgRoot(),\n      )}\n      aria-hidden='true'\n    >\n      <svg\n        className={classNames?.svg ?? iconSvgSvg()}\n        width={width}\n        height={height}\n        viewBox={viewBox}\n        aria-hidden='true'\n        focusable='false'\n        xmlns='http://www.w3.org/2000/svg'\n      >\n        {children}\n      </svg>\n    </span>\n  );\n};\n"],"mappings":"kLAqBA,MAAa,GAAW,CACtB,aACA,WACA,QACA,SACA,aAGE,EAAC,OAAA,CACC,UAAW,EACT,GAAY,SAAW,GAAS,CAChC,GAAY,MAAQ,GAAa,CAClC,CACD,cAAY,gBAEZ,EAAC,MAAA,CACC,UAAW,GAAY,KAAO,GAAY,CACnC,QACC,SACC,UACT,cAAY,OACZ,UAAU,QACV,MAAM,6BAEL,YACG,EACD"}

package/dist/components/data-display/index.d.mts

@@ -1,14 +1,18 @@
+import { AssignedUser, AssignedUserProps } from "./assigned-user/AssignedUser.mjs";
 import { Avatar, AvatarProps } from "./avatar/Avatar.mjs";
 import { Badge, BadgeProps } from "./badge/Badge.mjs";
-import { Tag, TagProps } from "./tag/Tag.mjs";
-import { TagGroup, TagGroupProps } from "./tag-group/TagGroup.mjs";
+import { Calendar, CalendarEvent, CalendarProps, DateLocalizer, momentLocalizer } from "./calendar/Calendar.mjs";
 import { Icon, IconProps } from "./icons/icon/Icon.mjs";
 import { IconRaw, IconRawProps } from "./icons/icon-raw/IconRaw.mjs";
+import { IconSvg, IconSvgProps } from "./icons/icon-svg/IconSvg.mjs";
 import { IconWrapped, IconWrappedProps } from "./icons/icon-wrapped/IconWrapped.mjs";
-import { UploadedFile, UploadedFileProps } from "./uploaded-file/UploadedFile.mjs";
+import { Indicator, IndicatorProps } from "./indicator/Indicator.mjs";
 import { LoaderDot, LoaderDotProps } from "./loader-dot/LoaderDot.mjs";
 import { LoaderOval, LoaderOvalProps } from "./loader-oval/LoaderOval.mjs";
-import { Calendar, CalendarEvent, CalendarProps, momentLocalizer } from "./calendar/Calendar.mjs";
 import { LogoImage, LogoImageProps } from "./logos/logo-image/LogoImage.mjs";
 import { LogoSvg, LogoSvgProps } from "./logos/logo-svg/LogoSvg.mjs";
-import { Indicator, IndicatorProps } from "./indicator/Indicator.mjs";
+import { RemovableItem, RemovableItemProps } from "./removable-item/RemovableItem.mjs";
+import { Tag, TagProps } from "./tag/Tag.mjs";
+import { TagGroup, TagGroupProps } from "./tag-group/TagGroup.mjs";
+import { UploadedFile, UploadedFileProps } from "./uploaded-file/UploadedFile.mjs";
+import { UploadedFileDetails, UploadedFileDetailsProps } from "./uploaded-file/UploadedFileDetails.mjs";

package/dist/components/data-display/indicator/Indicator.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"Indicator.d.mts","names":[],"sources":["../../../../src/components/data-display/indicator/Indicator.tsx"],"mappings":";;;;KASK,iBAAA;AAAA,KAkBO,cAAA,GAAiB,qBAAA;EAC3B,KAAA;EACA,SAAA;EACA,QAAA;EACA,MAAA;EACA,QAAA,GAAW,iBAAA;EACX,UAAA;IACE,SAAA;IACA,IAAA;IACA,KAAA;EAAA;AAAA;AAAA,cAaS,SAAA,EAAS,MAAA,CAAA,yBAAA,CAAA,IAAA,CAAA,cAAA,WAAA,MAAA,CAAA,aAAA,CAAA,cAAA"}
+{"version":3,"file":"Indicator.d.mts","names":[],"sources":["../../../../src/components/data-display/indicator/Indicator.tsx"],"mappings":";;;;KAUK,iBAAA;AAAA,KAkBO,cAAA,GAAiB,qBAAA;EAC3B,KAAA;EACA,SAAA;EACA,QAAA;EACA,MAAA;EACA,QAAA,GAAW,iBAAA;EACX,UAAA;IACE,SAAA;IACA,IAAA;IACA,KAAA;EAAA;AAAA;AAAA,cAaS,SAAA,EAAS,MAAA,CAAA,yBAAA,CAAA,IAAA,CAAA,cAAA,WAAA,MAAA,CAAA,aAAA,CAAA,cAAA"}

package/dist/components/data-display/indicator/Indicator.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Indicator.mjs","names":[],"sources":["../../../../src/components/data-display/indicator/Indicator.tsx"],"sourcesContent":["import { cx } from '@mage-ui/styled-system/css'\nimport { visuallyHidden } from '@mage-ui/styled-system/patterns'\nimport {\n  indicator,\n  indicatorLabel,\n  indicatorRoot,\n} from '@mage-ui/styled-system/recipes'\nimport { forwardRef, type ComponentPropsWithRef} from 'react'\n\ntype IndicatorPosition =\n  | 'top-start'\n  | 'top-center'\n  | 'top-end'\n  | 'bottom-start'\n  | 'bottom-end'\n  | 'bottom-center'\n  | 'center-start'\n  | 'center-end'\n  | 'center-center'\n\ntype Offset = {\n  top?: string\n  bottom?: string\n  left?: string\n  right?: string\n}\n\nexport type IndicatorProps = ComponentPropsWithRef<'div'> & {\n  label?: string | number\n  ariaLabel?: string\n  disabled?: boolean\n  offset?: number\n  position?: IndicatorPosition\n  classNames?: {\n    indicator?: string\n    root?: string\n    label?: string\n  }\n}\n\nconst calculateOffset = (position: string, offset: number) => {\n  const offsetLabel = {} as Offset\n  if (position.includes('top') && offset) offsetLabel.top = offset + 'px'\n  if (position.includes('bottom') && offset) offsetLabel.bottom = offset + 'px'\n  if (position.includes('start') && offset) offsetLabel.left = offset + 'px'\n  if (position.includes('end') && offset) offsetLabel.right = offset + 'px'\n  return offsetLabel\n}\n\nexport const Indicator = forwardRef<HTMLDivElement, IndicatorProps>(\n  (\n    {\n      children,\n      label = undefined,\n      disabled = false,\n      position = 'top-end',\n      offset = 0,\n      classNames,\n      ariaLabel\n    },\n    ref\n  ) => {\n    return (\n      <div\n        className={cx(\n          classNames?.indicator ?? indicator(),\n          classNames?.root ?? indicatorRoot()\n        )}\n        ref={ref}\n      >\n        {!disabled && (\n          <>\n            {ariaLabel && <span className={visuallyHidden()}>{ariaLabel}</span>}\n            <span\n              className={cx(\n                indicatorLabel({ position }),\n                classNames?.label\n              )}\n              style={calculateOffset(position, offset)}\n            >\n              {label}\n            </span>\n          </>\n        )}\n        {children}\n      </div>\n    )\n  }\n)\n\nIndicator.displayName = 'Indicator'"],"mappings":"sTAwCA,MAAM,GAAmB,EAAkB,IAAmB,CAC5D,IAAM,EAAc,EAAE,CAKtB,OAJI,EAAS,SAAS,MAAM,EAAI,IAAQ,EAAY,IAAM,EAAS,MAC/D,EAAS,SAAS,SAAS,EAAI,IAAQ,EAAY,OAAS,EAAS,MACrE,EAAS,SAAS,QAAQ,EAAI,IAAQ,EAAY,KAAO,EAAS,MAClE,EAAS,SAAS,MAAM,EAAI,IAAQ,EAAY,MAAQ,EAAS,MAC9D,GAGI,EAAY,GAErB,CACE,WACA,QAAQ,IAAA,GACR,WAAW,GACX,WAAW,UACX,SAAS,EACT,aACA,aAEF,IAGE,EAAC,MAAA,CACC,UAAW,EACT,GAAY,WAAa,GAAW,CACpC,GAAY,MAAQ,GAAe,CACpC,CACI,gBAEJ,CAAC,GACA,EAAA,EAAA,CAAA,SAAA,CACG,GAAa,EAAC,OAAA,CAAK,UAAW,GAAgB,UAAG,GAAiB,CACnE,EAAC,OAAA,CACC,UAAW,EACT,EAAe,CAAE,WAAU,CAAC,CAC5B,GAAY,MACb,CACD,MAAO,EAAgB,EAAU,EAAO,UAEvC,GACI,CAAA,CAAA,CACN,CAEJ,EAAA,EACG,CAGX,CAED,EAAU,YAAc"}
+{"version":3,"file":"Indicator.mjs","names":[],"sources":["../../../../src/components/data-display/indicator/Indicator.tsx"],"sourcesContent":["import { type ComponentPropsWithRef, forwardRef } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport { visuallyHidden } from '@mage-ui/styled-system/patterns';\nimport {\n  indicator,\n  indicatorLabel,\n  indicatorRoot,\n} from '@mage-ui/styled-system/recipes';\n\ntype IndicatorPosition =\n  | 'top-start'\n  | 'top-center'\n  | 'top-end'\n  | 'bottom-start'\n  | 'bottom-end'\n  | 'bottom-center'\n  | 'center-start'\n  | 'center-end'\n  | 'center-center';\n\ntype Offset = {\n  top?: string;\n  bottom?: string;\n  left?: string;\n  right?: string;\n};\n\nexport type IndicatorProps = ComponentPropsWithRef<'div'> & {\n  label?: string | number;\n  ariaLabel?: string;\n  disabled?: boolean;\n  offset?: number;\n  position?: IndicatorPosition;\n  classNames?: {\n    indicator?: string;\n    root?: string;\n    label?: string;\n  };\n};\n\nconst calculateOffset = (position: string, offset: number) => {\n  const offsetLabel = {} as Offset;\n  if (position.includes('top') && offset) offsetLabel.top = offset + 'px';\n  if (position.includes('bottom') && offset) offsetLabel.bottom = offset + 'px';\n  if (position.includes('start') && offset) offsetLabel.left = offset + 'px';\n  if (position.includes('end') && offset) offsetLabel.right = offset + 'px';\n  return offsetLabel;\n};\n\nexport const Indicator = forwardRef<HTMLDivElement, IndicatorProps>(\n  (\n    {\n      children,\n      label = undefined,\n      disabled = false,\n      position = 'top-end',\n      offset = 0,\n      classNames,\n      ariaLabel,\n    },\n    ref,\n  ) => {\n    return (\n      <div\n        className={cx(\n          classNames?.indicator ?? indicator(),\n          classNames?.root ?? indicatorRoot(),\n        )}\n        ref={ref}\n      >\n        {!disabled && (\n          <>\n            {ariaLabel && <span className={visuallyHidden()}>{ariaLabel}</span>}\n            <span\n              className={cx(indicatorLabel({ position }), classNames?.label)}\n              style={calculateOffset(position, offset)}\n            >\n              {label}\n            </span>\n          </>\n        )}\n        {children}\n      </div>\n    );\n  },\n);\n\nIndicator.displayName = 'Indicator';\n"],"mappings":"sTAyCA,MAAM,GAAmB,EAAkB,IAAmB,CAC5D,IAAM,EAAc,EAAE,CAKtB,OAJI,EAAS,SAAS,MAAM,EAAI,IAAQ,EAAY,IAAM,EAAS,MAC/D,EAAS,SAAS,SAAS,EAAI,IAAQ,EAAY,OAAS,EAAS,MACrE,EAAS,SAAS,QAAQ,EAAI,IAAQ,EAAY,KAAO,EAAS,MAClE,EAAS,SAAS,MAAM,EAAI,IAAQ,EAAY,MAAQ,EAAS,MAC9D,GAGI,EAAY,GAErB,CACE,WACA,QAAQ,IAAA,GACR,WAAW,GACX,WAAW,UACX,SAAS,EACT,aACA,aAEF,IAGE,EAAC,MAAA,CACC,UAAW,EACT,GAAY,WAAa,GAAW,CACpC,GAAY,MAAQ,GAAe,CACpC,CACI,gBAEJ,CAAC,GACA,EAAA,EAAA,CAAA,SAAA,CACG,GAAa,EAAC,OAAA,CAAK,UAAW,GAAgB,UAAG,GAAiB,CACnE,EAAC,OAAA,CACC,UAAW,EAAG,EAAe,CAAE,WAAU,CAAC,CAAE,GAAY,MAAM,CAC9D,MAAO,EAAgB,EAAU,EAAO,UAEvC,GACI,CAAA,CAAA,CACN,CAEJ,EAAA,EACG,CAGX,CAED,EAAU,YAAc"}

package/dist/components/data-display/loader-dot/LoaderDot.d.mts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime44 from "react/jsx-runtime";
+import * as react_jsx_runtime43 from "react/jsx-runtime";
 
 //#region src/components/data-display/loader-dot/LoaderDot.d.ts
 type LoaderDotProps = {
@@ -9,7 +9,7 @@ type LoaderDotProps = {
 };
 declare const LoaderDot: ({
   classNames
-}: LoaderDotProps) => react_jsx_runtime44.JSX.Element;
+}: LoaderDotProps) => react_jsx_runtime43.JSX.Element;
 //#endregion
 export { LoaderDot, LoaderDotProps };
 //# sourceMappingURL=LoaderDot.d.mts.map

package/dist/components/data-display/loader-dot/LoaderDot.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"LoaderDot.d.mts","names":[],"sources":["../../../../src/components/data-display/loader-dot/LoaderDot.tsx"],"mappings":";;;KAIY,cAAA;EACV,UAAA;IACE,MAAA;IACA,IAAA;EAAA;AAAA;AAAA,cAIS,SAAA;EAAc;AAAA,GAAgB,cAAA,KAAc,mBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"LoaderDot.d.mts","names":[],"sources":["../../../../src/components/data-display/loader-dot/LoaderDot.tsx"],"mappings":";;;KAIY,cAAA;EACV,UAAA;IACE,MAAA;IACA,IAAA;EAAA;AAAA;AAAA,cAIS,SAAA;EAAa;AAAA,GAAgB,cAAA,KAAc,mBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/data-display/loader-dot/LoaderDot.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"LoaderDot.mjs","names":[],"sources":["../../../../src/components/data-display/loader-dot/LoaderDot.tsx"],"sourcesContent":["import { cx } from '@mage-ui/styled-system/css';\nimport { loaderDot, loaderDotRoot } from '@mage-ui/styled-system/recipes';\nimport { Loader } from '@mantine/core';\n\nexport type LoaderDotProps = {\n  classNames?: {\n    loader?: string;\n    root?: string;\n  };\n};\n\nexport const LoaderDot =  ({ classNames }: LoaderDotProps) => {\n  return (\n    <Loader\n      type='dots'\n      classNames={{\n        root: cx(\n          classNames?.loader ?? loaderDot(),\n          classNames?.root ?? loaderDotRoot(),\n        ),\n      }}\n    />\n  );\n};\n"],"mappings":"6MAWA,MAAa,GAAc,CAAE,gBAEzB,EAAC,EAAA,CACC,KAAK,OACL,WAAY,CACV,KAAM,EACJ,GAAY,QAAU,GAAW,CACjC,GAAY,MAAQ,GAAe,CACpC,CACF,EACD"}
+{"version":3,"file":"LoaderDot.mjs","names":[],"sources":["../../../../src/components/data-display/loader-dot/LoaderDot.tsx"],"sourcesContent":["import { cx } from '@mage-ui/styled-system/css';\nimport { loaderDot, loaderDotRoot } from '@mage-ui/styled-system/recipes';\nimport { Loader } from '@mantine/core';\n\nexport type LoaderDotProps = {\n  classNames?: {\n    loader?: string;\n    root?: string;\n  };\n};\n\nexport const LoaderDot = ({ classNames }: LoaderDotProps) => {\n  return (\n    <Loader\n      type='dots'\n      classNames={{\n        root: cx(\n          classNames?.loader ?? loaderDot(),\n          classNames?.root ?? loaderDotRoot(),\n        ),\n      }}\n    />\n  );\n};\n"],"mappings":"6MAWA,MAAa,GAAa,CAAE,gBAExB,EAAC,EAAA,CACC,KAAK,OACL,WAAY,CACV,KAAM,EACJ,GAAY,QAAU,GAAW,CACjC,GAAY,MAAQ,GAAe,CACpC,CACF,EACD"}

package/dist/components/data-display/loader-oval/LoaderOval.d.mts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime45 from "react/jsx-runtime";
+import * as react_jsx_runtime44 from "react/jsx-runtime";
 
 //#region src/components/data-display/loader-oval/LoaderOval.d.ts
 type LoaderOvalProps = {
@@ -9,7 +9,7 @@ type LoaderOvalProps = {
 };
 declare const LoaderOval: ({
   classNames
-}: LoaderOvalProps) => react_jsx_runtime45.JSX.Element;
+}: LoaderOvalProps) => react_jsx_runtime44.JSX.Element;
 //#endregion
 export { LoaderOval, LoaderOvalProps };
 //# sourceMappingURL=LoaderOval.d.mts.map

package/dist/components/data-display/logos/logo-image/LogoImage.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"LogoImage.d.mts","names":[],"sources":["../../../../../src/components/data-display/logos/logo-image/LogoImage.tsx"],"mappings":";;;KAQY,cAAA;EACV,IAAA;EACA,GAAA;EACA,OAAA;EACA,GAAA;EACA,SAAA;EACA,KAAA;EACA,KAAA;EACA,MAAA;EACA,UAAA;IACE,IAAA;IACA,IAAA;IACA,KAAA;EAAA;AAAA,IAEA,qBAAA;AAAA,cAES,SAAA;EAAa,IAAA;EAAA,GAAA;EAAA,OAAA;EAAA,GAAA;EAAA,SAAA;EAAA,KAAA;EAAA,KAAA;EAAA,MAAA;EAAA,UAAA;EAAA,GAAA;AAAA,GAWvB,cAAA,KAAiB,SAAA"}
+{"version":3,"file":"LogoImage.d.mts","names":[],"sources":["../../../../../src/components/data-display/logos/logo-image/LogoImage.tsx"],"mappings":";;;KASY,cAAA;EACV,IAAA;EACA,GAAA;EACA,OAAA;EACA,GAAA;EACA,SAAA;EACA,KAAA;EACA,KAAA;EACA,MAAA;EACA,UAAA;IACE,IAAA;IACA,IAAA;IACA,KAAA;EAAA;AAAA,IAEA,qBAAA;AAAA,cAES,SAAA;EAAa,IAAA;EAAA,GAAA;EAAA,OAAA;EAAA,GAAA;EAAA,SAAA;EAAA,KAAA;EAAA,KAAA;EAAA,MAAA;EAAA,UAAA;EAAA,GAAA;AAAA,GAWvB,cAAA,KAAiB,SAAA"}

package/dist/components/data-display/logos/logo-image/LogoImage.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"LogoImage.mjs","names":[],"sources":["../../../../../src/components/data-display/logos/logo-image/LogoImage.tsx"],"sourcesContent":["import { cx } from '@mage-ui/styled-system/css';\nimport {\n  logoImage,\n  logoImageRoot,\n  logoImageImage,\n} from '@mage-ui/styled-system/recipes';\nimport type { ComponentPropsWithRef, ReactNode } from 'react';\n\nexport type LogoImageProps = {\n  href?: string;\n  src: string;\n  srcDark?: string;\n  alt: string;\n  ariaLabel?: string;\n  theme?: 'light' | 'dark';\n  width: number;\n  height: number;\n  classNames?: {\n    logo?: string;\n    root?: string;\n    image?: string;\n  };\n} & ComponentPropsWithRef<'a'>;\n\nexport const LogoImage = ({\n  href = '/',\n  src,\n  srcDark,\n  alt,\n  ariaLabel,\n  theme = 'light',\n  width,\n  height,\n  classNames,\n  ...props\n}: LogoImageProps): ReactNode => {\n  const resolvedSrc = theme === 'dark' && srcDark ? srcDark : src; // que vingui de fora\n\n  // TODO: possibilitat usar link next\n  // TODO: next image\n  // TODO: no té perquè tenir link\n  return (\n    <a\n      href={href}\n      aria-label={ariaLabel}\n      className={cx(\n        classNames?.logo ?? logoImage(),\n        classNames?.root ?? logoImageRoot(),\n      )}\n      {...props}\n    >\n      <img\n        src={resolvedSrc}\n        alt={alt}\n        width={width}\n        height={height}\n        loading='eager'\n        className={classNames?.image ?? logoImageImage()}\n      />\n    </a>\n  );\n};\n"],"mappings":"0LAwBA,MAAa,GAAa,CACxB,OAAO,IACP,MACA,UACA,MACA,YACA,QAAQ,QACR,QACA,SACA,aACA,GAAG,KAC4B,CAC/B,IAAM,EAAc,IAAU,QAAU,EAAU,EAAU,EAK5D,OACE,EAAC,IAAA,CACO,OACN,aAAY,EACZ,UAAW,EACT,GAAY,MAAQ,GAAW,CAC/B,GAAY,MAAQ,GAAe,CACpC,CACD,GAAI,WAEJ,EAAC,MAAA,CACC,IAAK,EACA,MACE,QACC,SACR,QAAQ,QACR,UAAW,GAAY,OAAS,GAAgB,EAChD,EACA"}
+{"version":3,"file":"LogoImage.mjs","names":[],"sources":["../../../../../src/components/data-display/logos/logo-image/LogoImage.tsx"],"sourcesContent":["import type { ComponentPropsWithRef, ReactNode } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n  logoImage,\n  logoImageImage,\n  logoImageRoot,\n} from '@mage-ui/styled-system/recipes';\n\nexport type LogoImageProps = {\n  href?: string;\n  src: string;\n  srcDark?: string;\n  alt: string;\n  ariaLabel?: string;\n  theme?: 'light' | 'dark';\n  width: number;\n  height: number;\n  classNames?: {\n    logo?: string;\n    root?: string;\n    image?: string;\n  };\n} & ComponentPropsWithRef<'a'>;\n\nexport const LogoImage = ({\n  href = '/',\n  src,\n  srcDark,\n  alt,\n  ariaLabel,\n  theme = 'light',\n  width,\n  height,\n  classNames,\n  ...props\n}: LogoImageProps): ReactNode => {\n  const resolvedSrc = theme === 'dark' && srcDark ? srcDark : src; // que vingui de fora\n\n  // TODO: possibilitat usar link next\n  // TODO: next image\n  // TODO: no té perquè tenir link\n  return (\n    <a\n      href={href}\n      aria-label={ariaLabel}\n      className={cx(\n        classNames?.logo ?? logoImage(),\n        classNames?.root ?? logoImageRoot(),\n      )}\n      {...props}\n    >\n      <img\n        src={resolvedSrc}\n        alt={alt}\n        width={width}\n        height={height}\n        loading='eager'\n        className={classNames?.image ?? logoImageImage()}\n      />\n    </a>\n  );\n};\n"],"mappings":"0LAyBA,MAAa,GAAa,CACxB,OAAO,IACP,MACA,UACA,MACA,YACA,QAAQ,QACR,QACA,SACA,aACA,GAAG,KAC4B,CAC/B,IAAM,EAAc,IAAU,QAAU,EAAU,EAAU,EAK5D,OACE,EAAC,IAAA,CACO,OACN,aAAY,EACZ,UAAW,EACT,GAAY,MAAQ,GAAW,CAC/B,GAAY,MAAQ,GAAe,CACpC,CACD,GAAI,WAEJ,EAAC,MAAA,CACC,IAAK,EACA,MACE,QACC,SACR,QAAQ,QACR,UAAW,GAAY,OAAS,GAAgB,EAChD,EACA"}

package/dist/components/data-display/logos/logo-svg/LogoSvg.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"LogoSvg.d.mts","names":[],"sources":["../../../../../src/components/data-display/logos/logo-svg/LogoSvg.tsx"],"mappings":";;;KAQY,YAAA;EACV,IAAA;EACA,SAAA;EACA,KAAA;EACA,MAAA;EACA,OAAA;EACA,QAAA,EAAU,SAAA;EACV,UAAA;IACE,IAAA;IACA,IAAA;IACA,GAAA;EAAA;AAAA,IAEA,qBAAA;AAAA,cAES,OAAA;EAAW,IAAA;EAAA,SAAA;EAAA,KAAA;EAAA,MAAA;EAAA,OAAA;EAAA,QAAA;EAAA,UAAA;EAAA,GAAA;AAAA,GASrB,YAAA,KAAe,SAAA"}
+{"version":3,"file":"LogoSvg.d.mts","names":[],"sources":["../../../../../src/components/data-display/logos/logo-svg/LogoSvg.tsx"],"mappings":";;;KASY,YAAA;EACV,IAAA;EACA,SAAA;EACA,KAAA;EACA,MAAA;EACA,OAAA;EACA,QAAA,EAAU,SAAA;EACV,UAAA;IACE,IAAA;IACA,IAAA;IACA,GAAA;EAAA;AAAA,IAEA,qBAAA;AAAA,cAES,OAAA;EAAW,IAAA;EAAA,SAAA;EAAA,KAAA;EAAA,MAAA;EAAA,OAAA;EAAA,QAAA;EAAA,UAAA;EAAA,GAAA;AAAA,GASrB,YAAA,KAAe,SAAA"}

package/dist/components/data-display/logos/logo-svg/LogoSvg.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"LogoSvg.mjs","names":[],"sources":["../../../../../src/components/data-display/logos/logo-svg/LogoSvg.tsx"],"sourcesContent":["import { cx } from '@mage-ui/styled-system/css';\nimport {\n  logoSvg,\n  logoSvgRoot,\n  logoSvgSvg,\n} from '@mage-ui/styled-system/recipes';\nimport type { ComponentPropsWithRef, ReactNode } from 'react';\n\nexport type LogoSvgProps = {\n  href?: string;\n  ariaLabel?: string;\n  width?: number | string;\n  height?: number | string;\n  viewBox?: string;\n  children: ReactNode;\n  classNames?: {\n    logo?: string;\n    root?: string;\n    svg?: string;\n  };\n} & ComponentPropsWithRef<'a'>;\n\nexport const LogoSvg = ({\n  href = '/',\n  ariaLabel,\n  width,\n  height,\n  viewBox,\n  children,\n  classNames,\n  ...props\n}: LogoSvgProps): ReactNode => {\n  return (\n    <a\n      href={href}\n      aria-label={ariaLabel}\n      className={cx(\n        classNames?.logo ?? logoSvg(),\n        classNames?.root ?? logoSvgRoot(),\n      )}\n      {...props}\n    >\n      <svg\n        width={width}\n        height={height}\n        viewBox={viewBox}\n        className={classNames?.svg ?? logoSvgSvg()}\n        fill='none'\n        aria-hidden='true'\n        focusable='false'\n        xmlns='http://www.w3.org/2000/svg'\n      >\n        {children}\n      </svg>\n    </a>\n  );\n};\n"],"mappings":"kLAsBA,MAAa,GAAW,CACtB,OAAO,IACP,YACA,QACA,SACA,UACA,WACA,aACA,GAAG,KAGD,EAAC,IAAA,CACO,OACN,aAAY,EACZ,UAAW,EACT,GAAY,MAAQ,GAAS,CAC7B,GAAY,MAAQ,GAAa,CAClC,CACD,GAAI,WAEJ,EAAC,MAAA,CACQ,QACC,SACC,UACT,UAAW,GAAY,KAAO,GAAY,CAC1C,KAAK,OACL,cAAY,OACZ,UAAU,QACV,MAAM,6BAEL,YACG,EACJ"}
+{"version":3,"file":"LogoSvg.mjs","names":[],"sources":["../../../../../src/components/data-display/logos/logo-svg/LogoSvg.tsx"],"sourcesContent":["import type { ComponentPropsWithRef, ReactNode } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n  logoSvg,\n  logoSvgRoot,\n  logoSvgSvg,\n} from '@mage-ui/styled-system/recipes';\n\nexport type LogoSvgProps = {\n  href?: string;\n  ariaLabel?: string;\n  width?: number | string;\n  height?: number | string;\n  viewBox?: string;\n  children: ReactNode;\n  classNames?: {\n    logo?: string;\n    root?: string;\n    svg?: string;\n  };\n} & ComponentPropsWithRef<'a'>;\n\nexport const LogoSvg = ({\n  href = '/',\n  ariaLabel,\n  width,\n  height,\n  viewBox,\n  children,\n  classNames,\n  ...props\n}: LogoSvgProps): ReactNode => {\n  return (\n    <a\n      href={href}\n      aria-label={ariaLabel}\n      className={cx(\n        classNames?.logo ?? logoSvg(),\n        classNames?.root ?? logoSvgRoot(),\n      )}\n      {...props}\n    >\n      <svg\n        width={width}\n        height={height}\n        viewBox={viewBox}\n        className={classNames?.svg ?? logoSvgSvg()}\n        fill='none'\n        aria-hidden='true'\n        focusable='false'\n        xmlns='http://www.w3.org/2000/svg'\n      >\n        {children}\n      </svg>\n    </a>\n  );\n};\n"],"mappings":"kLAuBA,MAAa,GAAW,CACtB,OAAO,IACP,YACA,QACA,SACA,UACA,WACA,aACA,GAAG,KAGD,EAAC,IAAA,CACO,OACN,aAAY,EACZ,UAAW,EACT,GAAY,MAAQ,GAAS,CAC7B,GAAY,MAAQ,GAAa,CAClC,CACD,GAAI,WAEJ,EAAC,MAAA,CACQ,QACC,SACC,UACT,UAAW,GAAY,KAAO,GAAY,CAC1C,KAAK,OACL,cAAY,OACZ,UAAU,QACV,MAAM,6BAEL,YACG,EACJ"}

package/dist/components/data-display/removable-item/RemovableItem.d.mts

@@ -0,0 +1,29 @@
+import { ButtonIconProps } from "../../buttons/button-icon/ButtonIcon.mjs";
+import "../../buttons/index.mjs";
+import * as react_jsx_runtime45 from "react/jsx-runtime";
+import { ReactNode } from "react";
+
+//#region src/components/data-display/removable-item/RemovableItem.d.ts
+type RemovableItemProps = {
+  startSlot?: ReactNode;
+  children: ReactNode;
+  onRemove: () => void;
+  removeButtonLabel?: string;
+  classNames?: {
+    container?: string;
+    root?: string;
+    section?: string;
+    content?: string;
+    buttonIcon?: ButtonIconProps['classNames'];
+  };
+};
+declare const RemovableItem: ({
+  startSlot,
+  children,
+  onRemove,
+  removeButtonLabel,
+  classNames
+}: RemovableItemProps) => react_jsx_runtime45.JSX.Element;
+//#endregion
+export { RemovableItem, RemovableItemProps };
+//# sourceMappingURL=RemovableItem.d.mts.map

package/dist/components/data-display/removable-item/RemovableItem.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RemovableItem.d.mts","names":[],"sources":["../../../../src/components/data-display/removable-item/RemovableItem.tsx"],"mappings":";;;;;;KAgBY,kBAAA;EACV,SAAA,GAAY,SAAA;EACZ,QAAA,EAAU,SAAA;EACV,QAAA;EACA,iBAAA;EACA,UAAA;IACE,SAAA;IACA,IAAA;IACA,OAAA;IACA,OAAA;IACA,UAAA,GAAa,eAAA;EAAA;AAAA;AAAA,cAIJ,aAAA;EAAiB,SAAA;EAAA,QAAA;EAAA,QAAA;EAAA,iBAAA;EAAA;AAAA,GAM3B,kBAAA,KAAkB,mBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/data-display/removable-item/RemovableItem.mjs

@@ -0,0 +1,2 @@
+import{ButtonIcon as e}from"../../buttons/button-icon/ButtonIcon.mjs";import{cx as t}from"@mage-ui/styled-system/css";import{removableItem as n,removableItemButtonIcon as r,removableItemButtonIconIcon as i,removableItemButtonIconIconRaw as a,removableItemButtonIconIconRawRoot as o,removableItemButtonIconRoot as s,removableItemContent as c,removableItemRoot as l,removableItemSection as u}from"@mage-ui/styled-system/recipes";import{jsx as d,jsxs as f}from"react/jsx-runtime";const p=({startSlot:p,children:m,onRemove:h,removeButtonLabel:g=`Remove`,classNames:_})=>f(`div`,{className:t(_?.container??n(),_?.root??l()),children:[p&&d(`div`,{className:_?.section??u(),children:p}),d(`div`,{className:_?.content??c(),children:m}),d(e,{label:g,onClick:h,path:`/icons/sprite-mage.svg`,name:`mage-removableitem-clear-button-x`,classNames:{buttonIcon:_?.buttonIcon?.buttonIcon??r(),root:_?.buttonIcon?.root??s(),icon:_?.buttonIcon?.icon??i(),iconRaw:{iconRaw:_?.buttonIcon?.iconRaw?.iconRaw??a(),root:_?.buttonIcon?.iconRaw?.root??o()}}})]});export{p as RemovableItem};
+//# sourceMappingURL=RemovableItem.mjs.map

package/dist/components/data-display/removable-item/RemovableItem.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RemovableItem.mjs","names":[],"sources":["../../../../src/components/data-display/removable-item/RemovableItem.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n  removableItem,\n  removableItemButtonIcon,\n  removableItemButtonIconIcon,\n  removableItemButtonIconIconRaw,\n  removableItemButtonIconIconRawRoot,\n  removableItemButtonIconRoot,\n  removableItemContent,\n  removableItemRoot,\n  removableItemSection,\n} from '@mage-ui/styled-system/recipes';\nimport { ButtonIcon, type ButtonIconProps } from '@/components/buttons';\n\nexport type RemovableItemProps = {\n  startSlot?: ReactNode;\n  children: ReactNode;\n  onRemove: () => void;\n  removeButtonLabel?: string;\n  classNames?: {\n    container?: string;\n    root?: string;\n    section?: string;\n    content?: string;\n    buttonIcon?: ButtonIconProps['classNames'];\n  };\n};\n\nexport const RemovableItem = ({\n  startSlot,\n  children,\n  onRemove,\n  removeButtonLabel = 'Remove',\n  classNames,\n}: RemovableItemProps) => {\n  return (\n    <div\n      className={cx(\n        classNames?.container ?? removableItem(),\n        classNames?.root ?? removableItemRoot(),\n      )}\n    >\n      {startSlot && (\n        <div className={classNames?.section ?? removableItemSection()}>\n          {startSlot}\n        </div>\n      )}\n\n      <div className={classNames?.content ?? removableItemContent()}>\n        {children}\n      </div>\n\n      <ButtonIcon\n        label={removeButtonLabel}\n        onClick={onRemove}\n        path='/icons/sprite-mage.svg'\n        name='mage-removableitem-clear-button-x'\n        classNames={{\n          buttonIcon:\n            classNames?.buttonIcon?.buttonIcon ?? removableItemButtonIcon(),\n          root: classNames?.buttonIcon?.root ?? removableItemButtonIconRoot(),\n          icon: classNames?.buttonIcon?.icon ?? removableItemButtonIconIcon(),\n          iconRaw: {\n            iconRaw:\n              classNames?.buttonIcon?.iconRaw?.iconRaw ??\n              removableItemButtonIconIconRaw(),\n            root:\n              classNames?.buttonIcon?.iconRaw?.root ??\n              removableItemButtonIconIconRawRoot(),\n          },\n        }}\n      />\n    </div>\n  );\n};\n"],"mappings":"6dA8BA,MAAa,GAAiB,CAC5B,YACA,WACA,WACA,oBAAoB,SACpB,gBAGE,EAAC,MAAA,CACC,UAAW,EACT,GAAY,WAAa,GAAe,CACxC,GAAY,MAAQ,GAAmB,CACxC,WAEA,GACC,EAAC,MAAA,CAAI,UAAW,GAAY,SAAW,GAAsB,UAC1D,GACG,CAGR,EAAC,MAAA,CAAI,UAAW,GAAY,SAAW,GAAsB,CAC1D,YACG,CAEN,EAAC,EAAA,CACC,MAAO,EACP,QAAS,EACT,KAAK,yBACL,KAAK,oCACL,WAAY,CACV,WACE,GAAY,YAAY,YAAc,GAAyB,CACjE,KAAM,GAAY,YAAY,MAAQ,GAA6B,CACnE,KAAM,GAAY,YAAY,MAAQ,GAA6B,CACnE,QAAS,CACP,QACE,GAAY,YAAY,SAAS,SACjC,GAAgC,CAClC,KACE,GAAY,YAAY,SAAS,MACjC,GAAoC,CACvC,CACF,EACD,GACE"}

package/dist/components/data-display/tag/Tag.d.mts

@@ -1,7 +1,7 @@
 import { BadgeProps } from "../badge/Badge.mjs";
 import { TagGroupProps } from "../tag-group/TagGroup.mjs";
 import "../index.mjs";
-import * as react_jsx_runtime40 from "react/jsx-runtime";
+import * as react_jsx_runtime46 from "react/jsx-runtime";
 
 //#region src/components/data-display/tag/Tag.d.ts
 type TagProps = Omit<BadgeProps, 'classNames'> & {
@@ -25,11 +25,11 @@ declare const Tag: {
     onRemove,
     classNames,
     children
-  }: TagProps): react_jsx_runtime40.JSX.Element;
+  }: TagProps): react_jsx_runtime46.JSX.Element;
   Group: ({
     children,
     classNames
-  }: TagGroupProps) => react_jsx_runtime40.JSX.Element;
+  }: TagGroupProps) => react_jsx_runtime46.JSX.Element;
 };
 //#endregion
 export { Tag, TagProps };

package/dist/components/data-display/tag/Tag.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Tag.mjs","names":[],"sources":["../../../../src/components/data-display/tag/Tag.tsx"],"sourcesContent":["import {\n  tag,\n  tagButtonIcon,\n  tagButtonIconIcon,\n  tagButtonIconIconRaw,\n  tagButtonIconIconRawRoot,\n  tagButtonIconRoot,\n  tagLabel,\n  tagRoot,\n  tagSection,\n} from '@mage-ui/styled-system/recipes';\nimport { ButtonIcon } from '@/components/buttons';\n\nimport { Badge, type BadgeProps } from '../badge/Badge';\nimport { TagGroup } from '../tag-group/TagGroup';\n\nexport type TagProps = Omit<BadgeProps, 'classNames'> & {\n  label: string;\n  onRemove?: () => void;\n  classNames?: BadgeProps['classNames'] & {\n    buttonIcon?: {\n      buttonIcon?: string;\n      root?: string;\n      icon?: string;\n      iconRaw?: {\n        iconRaw?: string;\n        root?: string;\n      };\n    };\n  };\n};\n\nexport const Tag = ({ label, onRemove, classNames, children }: TagProps) => {\n  return (\n    <Badge\n      endSlot={\n        <ButtonIcon\n          path='/icons/sprite-mage.svg'\n          label={label}\n          name='mage-tag-x'\n          onClick={(e) => {\n            e.stopPropagation();\n            onRemove?.();\n          }}\n          classNames={{\n            buttonIcon: classNames?.buttonIcon?.buttonIcon ?? tagButtonIcon(),\n            root: classNames?.buttonIcon?.root ?? tagButtonIconRoot(),\n            icon: classNames?.buttonIcon?.icon ?? tagButtonIconIcon(),\n            iconRaw: {\n              iconRaw:\n                classNames?.buttonIcon?.iconRaw?.iconRaw ?? tagButtonIconIconRaw(),\n              root:\n                classNames?.buttonIcon?.iconRaw?.root ?? tagButtonIconIconRawRoot(),\n            },\n          }}\n        />\n      }\n      classNames={{\n        badge: classNames?.badge ?? tag(),\n        root: classNames?.root ?? tagRoot(),\n        section: classNames?.section ?? tagSection(),\n        label: classNames?.label ?? tagLabel(),\n      }}\n    >\n      {children}\n    </Badge>\n  );\n};\n\nTag.Group = TagGroup;\n"],"mappings":"uaAgCA,MAAa,GAAO,CAAE,QAAO,WAAU,aAAY,cAE/C,EAAC,EAAA,CACC,QACE,EAAC,EAAA,CACC,KAAK,yBACE,QACP,KAAK,aACL,QAAU,GAAM,CACd,EAAE,iBAAiB,CACnB,KAAY,EAEd,WAAY,CACV,WAAY,GAAY,YAAY,YAAc,GAAe,CACjE,KAAM,GAAY,YAAY,MAAQ,GAAmB,CACzD,KAAM,GAAY,YAAY,MAAQ,GAAmB,CACzD,QAAS,CACP,QACE,GAAY,YAAY,SAAS,SAAW,GAAsB,CACpE,KACE,GAAY,YAAY,SAAS,MAAQ,GAA0B,CACtE,CACF,EACD,CAEJ,WAAY,CACV,MAAO,GAAY,OAAS,GAAK,CACjC,KAAM,GAAY,MAAQ,GAAS,CACnC,QAAS,GAAY,SAAW,GAAY,CAC5C,MAAO,GAAY,OAAS,GAAU,CACvC,CAEA,YACK,CAIZ,EAAI,MAAQ"}
+{"version":3,"file":"Tag.mjs","names":[],"sources":["../../../../src/components/data-display/tag/Tag.tsx"],"sourcesContent":["import {\n  tag,\n  tagButtonIcon,\n  tagButtonIconIcon,\n  tagButtonIconIconRaw,\n  tagButtonIconIconRawRoot,\n  tagButtonIconRoot,\n  tagLabel,\n  tagRoot,\n  tagSection,\n} from '@mage-ui/styled-system/recipes';\nimport { ButtonIcon } from '@/components/buttons';\n\nimport { Badge, type BadgeProps } from '../badge/Badge';\nimport { TagGroup } from '../tag-group/TagGroup';\n\nexport type TagProps = Omit<BadgeProps, 'classNames'> & {\n  label: string;\n  onRemove?: () => void;\n  classNames?: BadgeProps['classNames'] & {\n    buttonIcon?: {\n      buttonIcon?: string;\n      root?: string;\n      icon?: string;\n      iconRaw?: {\n        iconRaw?: string;\n        root?: string;\n      };\n    };\n  };\n};\n\nexport const Tag = ({ label, onRemove, classNames, children }: TagProps) => {\n  return (\n    <Badge\n      endSlot={\n        <ButtonIcon\n          path='/icons/sprite-mage.svg'\n          label={label}\n          name='mage-tag-x'\n          onClick={(e) => {\n            e.stopPropagation();\n            onRemove?.();\n          }}\n          classNames={{\n            buttonIcon: classNames?.buttonIcon?.buttonIcon ?? tagButtonIcon(),\n            root: classNames?.buttonIcon?.root ?? tagButtonIconRoot(),\n            icon: classNames?.buttonIcon?.icon ?? tagButtonIconIcon(),\n            iconRaw: {\n              iconRaw:\n                classNames?.buttonIcon?.iconRaw?.iconRaw ??\n                tagButtonIconIconRaw(),\n              root:\n                classNames?.buttonIcon?.iconRaw?.root ??\n                tagButtonIconIconRawRoot(),\n            },\n          }}\n        />\n      }\n      classNames={{\n        badge: classNames?.badge ?? tag(),\n        root: classNames?.root ?? tagRoot(),\n        section: classNames?.section ?? tagSection(),\n        label: classNames?.label ?? tagLabel(),\n      }}\n    >\n      {children}\n    </Badge>\n  );\n};\n\nTag.Group = TagGroup;\n"],"mappings":"uaAgCA,MAAa,GAAO,CAAE,QAAO,WAAU,aAAY,cAE/C,EAAC,EAAA,CACC,QACE,EAAC,EAAA,CACC,KAAK,yBACE,QACP,KAAK,aACL,QAAU,GAAM,CACd,EAAE,iBAAiB,CACnB,KAAY,EAEd,WAAY,CACV,WAAY,GAAY,YAAY,YAAc,GAAe,CACjE,KAAM,GAAY,YAAY,MAAQ,GAAmB,CACzD,KAAM,GAAY,YAAY,MAAQ,GAAmB,CACzD,QAAS,CACP,QACE,GAAY,YAAY,SAAS,SACjC,GAAsB,CACxB,KACE,GAAY,YAAY,SAAS,MACjC,GAA0B,CAC7B,CACF,EACD,CAEJ,WAAY,CACV,MAAO,GAAY,OAAS,GAAK,CACjC,KAAM,GAAY,MAAQ,GAAS,CACnC,QAAS,GAAY,SAAW,GAAY,CAC5C,MAAO,GAAY,OAAS,GAAU,CACvC,CAEA,YACK,CAIZ,EAAI,MAAQ"}

package/dist/components/data-display/tag-group/TagGroup.d.mts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime42 from "react/jsx-runtime";
+import * as react_jsx_runtime48 from "react/jsx-runtime";
 
 //#region src/components/data-display/tag-group/TagGroup.d.ts
 type TagGroupProps = {
@@ -11,7 +11,7 @@ type TagGroupProps = {
 declare const TagGroup: ({
   children,
   classNames
-}: TagGroupProps) => react_jsx_runtime42.JSX.Element;
+}: TagGroupProps) => react_jsx_runtime48.JSX.Element;
 //#endregion
 export { TagGroup, TagGroupProps };
 //# sourceMappingURL=TagGroup.d.mts.map

package/dist/components/data-display/tag-group/TagGroup.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"TagGroup.mjs","names":[],"sources":["../../../../src/components/data-display/tag-group/TagGroup.tsx"],"sourcesContent":["import { cx } from '@mage-ui/styled-system/css';\nimport { tagGroup, tagGroupRoot } from '@mage-ui/styled-system/recipes';\n\nexport type TagGroupProps = {\n  children: React.ReactNode;\n  classNames?: {\n    tagGroup?: string;\n    root?: string;\n  };\n};\n\nexport const TagGroup = ({ children, classNames }: TagGroupProps) => {\n  return (\n    <div className={cx(classNames?.tagGroup ?? tagGroup(), classNames?.root ?? tagGroupRoot())}>\n      {children}\n    </div>\n  )\n};\n"],"mappings":"oKAWA,MAAa,GAAY,CAAE,WAAU,gBAEjC,EAAC,MAAA,CAAI,UAAW,EAAG,GAAY,UAAY,GAAU,CAAE,GAAY,MAAQ,GAAc,CAAC,CACvF,YACG"}
+{"version":3,"file":"TagGroup.mjs","names":[],"sources":["../../../../src/components/data-display/tag-group/TagGroup.tsx"],"sourcesContent":["import { cx } from '@mage-ui/styled-system/css';\nimport { tagGroup, tagGroupRoot } from '@mage-ui/styled-system/recipes';\n\nexport type TagGroupProps = {\n  children: React.ReactNode;\n  classNames?: {\n    tagGroup?: string;\n    root?: string;\n  };\n};\n\nexport const TagGroup = ({ children, classNames }: TagGroupProps) => {\n  return (\n    <div\n      className={cx(\n        classNames?.tagGroup ?? tagGroup(),\n        classNames?.root ?? tagGroupRoot(),\n      )}\n    >\n      {children}\n    </div>\n  );\n};\n"],"mappings":"oKAWA,MAAa,GAAY,CAAE,WAAU,gBAEjC,EAAC,MAAA,CACC,UAAW,EACT,GAAY,UAAY,GAAU,CAClC,GAAY,MAAQ,GAAc,CACnC,CAEA,YACG"}

package/dist/components/data-display/uploaded-file/UploadedFile.d.mts

@@ -1,43 +1,41 @@
-import { ButtonIconProps } from "../../buttons/button-icon/ButtonIcon.mjs";
-import "../../buttons/index.mjs";
-import * as react_jsx_runtime43 from "react/jsx-runtime";
+import { IconProps } from "../icons/icon/Icon.mjs";
+import { IconWrappedProps } from "../icons/icon-wrapped/IconWrapped.mjs";
+import { RemovableItemProps } from "../removable-item/RemovableItem.mjs";
+import "../index.mjs";
+import * as react_jsx_runtime49 from "react/jsx-runtime";
 import { ReactNode } from "react";
 
 //#region src/components/data-display/uploaded-file/UploadedFile.d.ts
 type UploadedFileProps = {
   clearButtonLabel?: string;
-  startSlot?: ReactNode;
   fileName?: ReactNode;
+  fileType?: string;
   url?: string;
-  fileSize?: ReactNode;
-  fileDate?: ReactNode;
-  fileType?: ReactNode;
-  onRemove?: () => void;
+  children: ReactNode;
+  onRemove: () => void;
   classNames?: {
     uploadedFile?: string;
     root?: string;
     section?: string;
     content?: string;
     details?: string;
-    fileSize?: string;
-    fileDate?: string;
-    fileType?: string;
     fileLink?: string;
     fileName?: string;
-    buttonIcon?: ButtonIconProps['classNames'];
+    startIconWrapped?: IconWrappedProps['classNames'];
+    startIcon?: IconProps['classNames'];
+    removableItem?: RemovableItemProps['classNames'];
+    buttonIcon?: NonNullable<RemovableItemProps['classNames']>['buttonIcon'];
   };
 };
 declare const UploadedFile: ({
   clearButtonLabel,
-  startSlot,
   fileName,
-  url,
-  fileSize,
-  fileDate,
   fileType,
-  classNames,
-  onRemove
-}: UploadedFileProps) => react_jsx_runtime43.JSX.Element;
+  url,
+  children,
+  onRemove,
+  classNames
+}: UploadedFileProps) => react_jsx_runtime49.JSX.Element;
 //#endregion
 export { UploadedFile, UploadedFileProps };
 //# sourceMappingURL=UploadedFile.d.mts.map

package/dist/components/data-display/uploaded-file/UploadedFile.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"UploadedFile.d.mts","names":[],"sources":["../../../../src/components/data-display/uploaded-file/UploadedFile.tsx"],"mappings":";;;;;;KAsBY,iBAAA;EACV,gBAAA;EACA,SAAA,GAAY,SAAA;EACZ,QAAA,GAAW,SAAA;EACX,GAAA;EACA,QAAA,GAAW,SAAA;EACX,QAAA,GAAW,SAAA;EACX,QAAA,GAAW,SAAA;EACX,QAAA;EACA,UAAA;IACE,YAAA;IACA,IAAA;IACA,OAAA;IACA,OAAA;IACA,OAAA;IACA,QAAA;IACA,QAAA;IACA,QAAA;IACA,QAAA;IACA,QAAA;IACA,UAAA,GAAa,eAAA;EAAA;AAAA;AAAA,cAIJ,YAAA;EAAgB,gBAAA;EAAA,SAAA;EAAA,QAAA;EAAA,GAAA;EAAA,QAAA;EAAA,QAAA;EAAA,QAAA;EAAA,UAAA;EAAA;AAAA,GAU1B,iBAAA,KAAiB,mBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"UploadedFile.d.mts","names":[],"sources":["../../../../src/components/data-display/uploaded-file/UploadedFile.tsx"],"mappings":";;;;;;;;KAyBY,iBAAA;EACV,gBAAA;EACA,QAAA,GAAW,SAAA;EACX,QAAA;EACA,GAAA;EACA,QAAA,EAAU,SAAA;EACV,QAAA;EACA,UAAA;IACE,YAAA;IACA,IAAA;IACA,OAAA;IACA,OAAA;IACA,OAAA;IACA,QAAA;IACA,QAAA;IACA,gBAAA,GAAmB,gBAAA;IACnB,SAAA,GAAY,SAAA;IACZ,aAAA,GAAgB,kBAAA;IAChB,UAAA,GAAa,WAAA,CAAY,kBAAA;EAAA;AAAA;AAAA,cAIhB,YAAA;EAAgB,gBAAA;EAAA,QAAA;EAAA,QAAA;EAAA,GAAA;EAAA,QAAA;EAAA,QAAA;EAAA;AAAA,GAQ1B,iBAAA,KAAiB,mBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/data-display/uploaded-file/UploadedFile.mjs

@@ -1,2 +1,2 @@
-import{ButtonIcon as e}from"../../buttons/button-icon/ButtonIcon.mjs";import{cx as t}from"@mage-ui/styled-system/css";import{uploadedFile as n,uploadedFileButtonIcon as r,uploadedFileButtonIconIcon as i,uploadedFileButtonIconIconRaw as a,uploadedFileButtonIconIconRawRoot as o,uploadedFileButtonIconRoot as s,uploadedFileContent as c,uploadedFileDate as l,uploadedFileDetails as u,uploadedFileLink as d,uploadedFileName as f,uploadedFileRoot as p,uploadedFileSection as m,uploadedFileSize as h,uploadedFileType as g}from"@mage-ui/styled-system/recipes";import{jsx as _,jsxs as v}from"react/jsx-runtime";const y=({clearButtonLabel:y=`Remove file`,startSlot:b,fileName:x,url:S,fileSize:C,fileDate:w,fileType:T,classNames:E,onRemove:D})=>v(`div`,{className:t(E?.uploadedFile??n(),E?.root??p()),children:[b&&_(`div`,{className:E?.section??m(),children:b}),v(`div`,{className:E?.content??c(),children:[S?_(`a`,{href:S,target:`_blank`,rel:`noopener noreferrer`,download:!0,className:E?.fileLink??d(),children:x}):_(`span`,{className:E?.fileName??f(),children:x}),v(`div`,{className:E?.details??u(),children:[C&&_(`span`,{className:E?.fileSize??h(),children:C}),w&&_(`span`,{className:E?.fileDate??l(),children:w}),T&&_(`span`,{className:E?.fileType??g(),children:T})]})]}),D&&_(e,{label:y,onClick:()=>D?.(),path:`/icons/sprite-mage.svg`,name:`mage-uploadedfile-clear-button-x`,classNames:{buttonIcon:E?.buttonIcon?.buttonIcon??r(),root:E?.buttonIcon?.root??s(),icon:E?.buttonIcon?.icon??i(),iconRaw:{iconRaw:E?.buttonIcon?.iconRaw?.iconRaw??a(),root:E?.buttonIcon?.iconRaw?.root??o()}}})]});export{y as UploadedFile};
+import{RemovableItem as e}from"../removable-item/RemovableItem.mjs";import{UploadedFileIcon as t}from"./UploadedFileIcon.mjs";import{uploadedFile as n,uploadedFileButtonIcon as r,uploadedFileButtonIconIcon as i,uploadedFileButtonIconIconRaw as a,uploadedFileButtonIconIconRawRoot as o,uploadedFileButtonIconRoot as s,uploadedFileContent as c,uploadedFileDetails as l,uploadedFileLink as u,uploadedFileName as d,uploadedFileRoot as f,uploadedFileSection as p}from"@mage-ui/styled-system/recipes";import{jsx as m,jsxs as h}from"react/jsx-runtime";const g=({clearButtonLabel:g=`Remove file`,fileName:_,fileType:v,url:y,children:b,onRemove:x,classNames:S})=>h(e,{startSlot:m(t,{fileType:v,fileName:typeof _==`string`?_:void 0,classNames:{startIconWrapped:S?.startIconWrapped,startIcon:S?.startIcon}}),onRemove:x,removeButtonLabel:g,classNames:{container:S?.removableItem?.container??S?.uploadedFile??n(),root:S?.removableItem?.root??S?.root??f(),section:S?.removableItem?.section??S?.section??p(),content:S?.removableItem?.content??S?.content??c(),buttonIcon:{buttonIcon:S?.buttonIcon?.buttonIcon??S?.removableItem?.buttonIcon?.buttonIcon??r(),root:S?.buttonIcon?.root??S?.removableItem?.buttonIcon?.root??s(),icon:S?.buttonIcon?.icon??S?.removableItem?.buttonIcon?.icon??i(),iconRaw:{iconRaw:S?.buttonIcon?.iconRaw?.iconRaw??S?.removableItem?.buttonIcon?.iconRaw?.iconRaw??a(),root:S?.buttonIcon?.iconRaw?.root??S?.removableItem?.buttonIcon?.iconRaw?.root??o()}}},children:[y?m(`a`,{href:y,target:`_blank`,rel:`noopener noreferrer`,download:!0,className:S?.fileLink??u(),children:_}):m(`span`,{className:S?.fileName??d(),children:_}),m(`div`,{className:S?.details??l(),children:b})]});export{g as UploadedFile};
 //# sourceMappingURL=UploadedFile.mjs.map

package/dist/components/data-display/uploaded-file/UploadedFile.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"UploadedFile.mjs","names":[],"sources":["../../../../src/components/data-display/uploaded-file/UploadedFile.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n  uploadedFile,\n  uploadedFileButtonIcon,\n  uploadedFileButtonIconIcon,\n  uploadedFileButtonIconIconRaw,\n  uploadedFileButtonIconIconRawRoot,\n  uploadedFileButtonIconRoot,\n  uploadedFileContent,\n  uploadedFileDetails,\n  uploadedFileDate,\n  uploadedFileName,\n  uploadedFileSize,\n  uploadedFileType,\n  uploadedFileRoot,\n  uploadedFileSection,\n  uploadedFileLink,\n} from '@mage-ui/styled-system/recipes';\nimport { ButtonIcon, type ButtonIconProps } from '@/components/buttons';\n\nexport type UploadedFileProps = {\n  clearButtonLabel?: string;\n  startSlot?: ReactNode;\n  fileName?: ReactNode;\n  url?: string;\n  fileSize?: ReactNode;\n  fileDate?: ReactNode;\n  fileType?: ReactNode;\n  onRemove?: () => void;\n  classNames?: {\n    uploadedFile?: string;\n    root?: string;\n    section?: string;\n    content?: string;\n    details?: string;\n    fileSize?: string;\n    fileDate?: string;\n    fileType?: string;\n    fileLink?: string;\n    fileName?: string;\n    buttonIcon?: ButtonIconProps['classNames'];\n  };\n};\n\nexport const UploadedFile = ({\n  clearButtonLabel = 'Remove file',\n  startSlot,\n  fileName,\n  url,\n  fileSize,\n  fileDate,\n  fileType,\n  classNames,\n  onRemove,\n}: UploadedFileProps) => {\n  return (\n    <div\n      className={cx(\n        classNames?.uploadedFile ?? uploadedFile(),\n        classNames?.root ?? uploadedFileRoot(),\n      )}\n    >\n      {startSlot && (\n        <div className={classNames?.section ?? uploadedFileSection()}>\n          {startSlot}\n        </div>\n      )}\n      <div className={classNames?.content ?? uploadedFileContent()}>\n        {url ? (\n          <a\n            href={url}\n            target='_blank'\n            rel='noopener noreferrer'\n            download\n            className={classNames?.fileLink ?? uploadedFileLink()}\n          >\n            {fileName}\n          </a>\n        ) : (\n          <span className={classNames?.fileName ?? uploadedFileName()}>\n            {fileName}\n          </span>\n        )}\n\n        {/* TODO: children i sical, crear components per a mostrar el contingut */}\n        <div className={classNames?.details ?? uploadedFileDetails()}>\n          {fileSize && (\n            <span className={classNames?.fileSize ?? uploadedFileSize()}>\n              {fileSize}\n            </span>\n          )}\n          {fileDate && (\n            <span className={classNames?.fileDate ?? uploadedFileDate()}>\n              {fileDate}\n            </span>\n          )}\n          {fileType && (\n            <span className={classNames?.fileType ?? uploadedFileType()}>\n              {fileType}\n            </span>\n          )}\n        </div>\n      </div>\n\n      {onRemove && (\n        <ButtonIcon\n          label={clearButtonLabel}\n          onClick={() => onRemove?.()}\n          path='/icons/sprite-mage.svg'\n          name='mage-uploadedfile-clear-button-x'\n          classNames={{\n            buttonIcon:\n              classNames?.buttonIcon?.buttonIcon ?? uploadedFileButtonIcon(),\n            root: classNames?.buttonIcon?.root ?? uploadedFileButtonIconRoot(),\n            icon: classNames?.buttonIcon?.icon ?? uploadedFileButtonIconIcon(),\n            iconRaw: {\n              iconRaw:\n                classNames?.buttonIcon?.iconRaw?.iconRaw ??\n                uploadedFileButtonIconIconRaw(),\n              root:\n                classNames?.buttonIcon?.iconRaw?.root ??\n                uploadedFileButtonIconIconRawRoot(),\n            },\n          }}\n        />\n      )}\n    </div>\n  );\n};\n"],"mappings":"2lBA8CA,MAAa,GAAgB,CAC3B,mBAAmB,cACnB,YACA,WACA,MACA,WACA,WACA,WACA,aACA,cAGE,EAAC,MAAA,CACC,UAAW,EACT,GAAY,cAAgB,GAAc,CAC1C,GAAY,MAAQ,GAAkB,CACvC,WAEA,GACC,EAAC,MAAA,CAAI,UAAW,GAAY,SAAW,GAAqB,UACzD,GACG,CAER,EAAC,MAAA,CAAI,UAAW,GAAY,SAAW,GAAqB,WACzD,EACC,EAAC,IAAA,CACC,KAAM,EACN,OAAO,SACP,IAAI,sBACJ,SAAA,GACA,UAAW,GAAY,UAAY,GAAkB,UAEpD,GACC,CAEJ,EAAC,OAAA,CAAK,UAAW,GAAY,UAAY,GAAkB,UACxD,GACI,CAIT,EAAC,MAAA,CAAI,UAAW,GAAY,SAAW,GAAqB,WACzD,GACC,EAAC,OAAA,CAAK,UAAW,GAAY,UAAY,GAAkB,UACxD,GACI,CAER,GACC,EAAC,OAAA,CAAK,UAAW,GAAY,UAAY,GAAkB,UACxD,GACI,CAER,GACC,EAAC,OAAA,CAAK,UAAW,GAAY,UAAY,GAAkB,UACxD,GACI,GAEL,CAAA,EACF,CAEL,GACC,EAAC,EAAA,CACC,MAAO,EACP,YAAe,KAAY,CAC3B,KAAK,yBACL,KAAK,mCACL,WAAY,CACV,WACE,GAAY,YAAY,YAAc,GAAwB,CAChE,KAAM,GAAY,YAAY,MAAQ,GAA4B,CAClE,KAAM,GAAY,YAAY,MAAQ,GAA4B,CAClE,QAAS,CACP,QACE,GAAY,YAAY,SAAS,SACjC,GAA+B,CACjC,KACE,GAAY,YAAY,SAAS,MACjC,GAAmC,CACtC,CACF,EACD,GAEA"}
+{"version":3,"file":"UploadedFile.mjs","names":[],"sources":["../../../../src/components/data-display/uploaded-file/UploadedFile.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport {\n  uploadedFile,\n  uploadedFileButtonIcon,\n  uploadedFileButtonIconIcon,\n  uploadedFileButtonIconIconRaw,\n  uploadedFileButtonIconIconRawRoot,\n  uploadedFileButtonIconRoot,\n  uploadedFileContent,\n  uploadedFileDetails,\n  uploadedFileLink,\n  uploadedFileName,\n  uploadedFileRoot,\n  uploadedFileSection,\n} from '@mage-ui/styled-system/recipes';\nimport {\n  type IconProps,\n  type IconWrappedProps,\n  RemovableItem,\n  type RemovableItemProps,\n} from '@/components/data-display';\n\nimport { UploadedFileIcon } from './UploadedFileIcon';\n\nexport type UploadedFileProps = {\n  clearButtonLabel?: string;\n  fileName?: ReactNode;\n  fileType?: string;\n  url?: string;\n  children: ReactNode;\n  onRemove: () => void;\n  classNames?: {\n    uploadedFile?: string;\n    root?: string;\n    section?: string;\n    content?: string;\n    details?: string;\n    fileLink?: string;\n    fileName?: string;\n    startIconWrapped?: IconWrappedProps['classNames'];\n    startIcon?: IconProps['classNames'];\n    removableItem?: RemovableItemProps['classNames'];\n    buttonIcon?: NonNullable<RemovableItemProps['classNames']>['buttonIcon'];\n  };\n};\n\nexport const UploadedFile = ({\n  clearButtonLabel = 'Remove file',\n  fileName,\n  fileType,\n  url,\n  children,\n  onRemove,\n  classNames,\n}: UploadedFileProps) => {\n  return (\n    <RemovableItem\n      startSlot={\n        <UploadedFileIcon\n          fileType={fileType}\n          fileName={typeof fileName === 'string' ? fileName : undefined}\n          classNames={{\n            startIconWrapped: classNames?.startIconWrapped,\n            startIcon: classNames?.startIcon,\n          }}\n        />\n      }\n      onRemove={onRemove}\n      removeButtonLabel={clearButtonLabel}\n      classNames={{\n        container:\n          classNames?.removableItem?.container ??\n          classNames?.uploadedFile ??\n          uploadedFile(),\n        root:\n          classNames?.removableItem?.root ??\n          classNames?.root ??\n          uploadedFileRoot(),\n        section:\n          classNames?.removableItem?.section ??\n          classNames?.section ??\n          uploadedFileSection(),\n        content:\n          classNames?.removableItem?.content ??\n          classNames?.content ??\n          uploadedFileContent(),\n        buttonIcon: {\n          buttonIcon:\n            classNames?.buttonIcon?.buttonIcon ??\n            classNames?.removableItem?.buttonIcon?.buttonIcon ??\n            uploadedFileButtonIcon(),\n          root:\n            classNames?.buttonIcon?.root ??\n            classNames?.removableItem?.buttonIcon?.root ??\n            uploadedFileButtonIconRoot(),\n          icon:\n            classNames?.buttonIcon?.icon ??\n            classNames?.removableItem?.buttonIcon?.icon ??\n            uploadedFileButtonIconIcon(),\n          iconRaw: {\n            iconRaw:\n              classNames?.buttonIcon?.iconRaw?.iconRaw ??\n              classNames?.removableItem?.buttonIcon?.iconRaw?.iconRaw ??\n              uploadedFileButtonIconIconRaw(),\n            root:\n              classNames?.buttonIcon?.iconRaw?.root ??\n              classNames?.removableItem?.buttonIcon?.iconRaw?.root ??\n              uploadedFileButtonIconIconRawRoot(),\n          },\n        },\n      }}\n    >\n      {/* TODO: comentar link */}\n      {url ? (\n        <a\n          href={url}\n          target='_blank'\n          rel='noopener noreferrer'\n          download\n          className={classNames?.fileLink ?? uploadedFileLink()}\n        >\n          {fileName}\n        </a>\n      ) : (\n        <span className={classNames?.fileName ?? uploadedFileName()}>\n          {fileName}\n        </span>\n      )}\n\n      <div className={classNames?.details ?? uploadedFileDetails()}>\n        {children}\n      </div>\n    </RemovableItem>\n  );\n};\n"],"mappings":"iiBA+CA,MAAa,GAAgB,CAC3B,mBAAmB,cACnB,WACA,WACA,MACA,WACA,WACA,gBAGE,EAAC,EAAA,CACC,UACE,EAAC,EAAA,CACW,WACV,SAAU,OAAO,GAAa,SAAW,EAAW,IAAA,GACpD,WAAY,CACV,iBAAkB,GAAY,iBAC9B,UAAW,GAAY,UACxB,EACD,CAEM,WACV,kBAAmB,EACnB,WAAY,CACV,UACE,GAAY,eAAe,WAC3B,GAAY,cACZ,GAAc,CAChB,KACE,GAAY,eAAe,MAC3B,GAAY,MACZ,GAAkB,CACpB,QACE,GAAY,eAAe,SAC3B,GAAY,SACZ,GAAqB,CACvB,QACE,GAAY,eAAe,SAC3B,GAAY,SACZ,GAAqB,CACvB,WAAY,CACV,WACE,GAAY,YAAY,YACxB,GAAY,eAAe,YAAY,YACvC,GAAwB,CAC1B,KACE,GAAY,YAAY,MACxB,GAAY,eAAe,YAAY,MACvC,GAA4B,CAC9B,KACE,GAAY,YAAY,MACxB,GAAY,eAAe,YAAY,MACvC,GAA4B,CAC9B,QAAS,CACP,QACE,GAAY,YAAY,SAAS,SACjC,GAAY,eAAe,YAAY,SAAS,SAChD,GAA+B,CACjC,KACE,GAAY,YAAY,SAAS,MACjC,GAAY,eAAe,YAAY,SAAS,MAChD,GAAmC,CACtC,CACF,CACF,WAGA,EACC,EAAC,IAAA,CACC,KAAM,EACN,OAAO,SACP,IAAI,sBACJ,SAAA,GACA,UAAW,GAAY,UAAY,GAAkB,UAEpD,GACC,CAEJ,EAAC,OAAA,CAAK,UAAW,GAAY,UAAY,GAAkB,UACxD,GACI,CAGT,EAAC,MAAA,CAAI,UAAW,GAAY,SAAW,GAAqB,CACzD,YACG,CAAA,EACQ"}

package/dist/components/data-display/uploaded-file/UploadedFileDetails.d.mts

@@ -0,0 +1,23 @@
+import * as react_jsx_runtime38 from "react/jsx-runtime";
+import { ReactNode } from "react";
+
+//#region src/components/data-display/uploaded-file/UploadedFileDetails.d.ts
+type UploadedFileDetailsProps = {
+  fileSize?: ReactNode;
+  fileDate?: ReactNode;
+  fileType?: ReactNode;
+  classNames?: {
+    fileSize?: string;
+    fileDate?: string;
+    fileType?: string;
+  };
+};
+declare const UploadedFileDetails: ({
+  fileSize,
+  fileDate,
+  fileType,
+  classNames
+}: UploadedFileDetailsProps) => react_jsx_runtime38.JSX.Element;
+//#endregion
+export { UploadedFileDetails, UploadedFileDetailsProps };
+//# sourceMappingURL=UploadedFileDetails.d.mts.map

package/dist/components/data-display/uploaded-file/UploadedFileDetails.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"UploadedFileDetails.d.mts","names":[],"sources":["../../../../src/components/data-display/uploaded-file/UploadedFileDetails.tsx"],"mappings":";;;;KAQY,wBAAA;EACV,QAAA,GAAW,SAAA;EACX,QAAA,GAAW,SAAA;EACX,QAAA,GAAW,SAAA;EACX,UAAA;IACE,QAAA;IACA,QAAA;IACA,QAAA;EAAA;AAAA;AAAA,cAIS,mBAAA;EAAuB,QAAA;EAAA,QAAA;EAAA,QAAA;EAAA;AAAA,GAKjC,wBAAA,KAAwB,mBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/data-display/uploaded-file/UploadedFileDetails.mjs

@@ -0,0 +1,2 @@
+import{uploadedFileDate as e,uploadedFileSize as t,uploadedFileType as n}from"@mage-ui/styled-system/recipes";import{Fragment as r,jsx as i,jsxs as a}from"react/jsx-runtime";const o=({fileSize:o,fileDate:s,fileType:c,classNames:l})=>a(r,{children:[o&&i(`span`,{className:l?.fileSize??t(),children:o}),s&&i(`span`,{className:l?.fileDate??e(),children:s}),c&&i(`span`,{className:l?.fileType??n(),children:c})]});export{o as UploadedFileDetails};
+//# sourceMappingURL=UploadedFileDetails.mjs.map

package/dist/components/data-display/uploaded-file/UploadedFileDetails.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"UploadedFileDetails.mjs","names":[],"sources":["../../../../src/components/data-display/uploaded-file/UploadedFileDetails.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport {\n  uploadedFileDate,\n  uploadedFileSize,\n  uploadedFileType,\n} from '@mage-ui/styled-system/recipes';\n\nexport type UploadedFileDetailsProps = {\n  fileSize?: ReactNode;\n  fileDate?: ReactNode;\n  fileType?: ReactNode;\n  classNames?: {\n    fileSize?: string;\n    fileDate?: string;\n    fileType?: string;\n  };\n};\n\nexport const UploadedFileDetails = ({\n  fileSize,\n  fileDate,\n  fileType,\n  classNames,\n}: UploadedFileDetailsProps) => {\n  return (\n    <>\n      {fileSize && (\n        <span className={classNames?.fileSize ?? uploadedFileSize()}>\n          {fileSize}\n        </span>\n      )}\n      {fileDate && (\n        <span className={classNames?.fileDate ?? uploadedFileDate()}>\n          {fileDate}\n        </span>\n      )}\n      {fileType && (\n        <span className={classNames?.fileType ?? uploadedFileType()}>\n          {fileType}\n        </span>\n      )}\n    </>\n  );\n};\n"],"mappings":"8KAmBA,MAAa,GAAuB,CAClC,WACA,WACA,WACA,gBAGE,EAAA,EAAA,CAAA,SAAA,CACG,GACC,EAAC,OAAA,CAAK,UAAW,GAAY,UAAY,GAAkB,UACxD,GACI,CAER,GACC,EAAC,OAAA,CAAK,UAAW,GAAY,UAAY,GAAkB,UACxD,GACI,CAER,GACC,EAAC,OAAA,CAAK,UAAW,GAAY,UAAY,GAAkB,UACxD,GACI,GAER"}

package/dist/components/data-display/uploaded-file/UploadedFileIcon.mjs

@@ -0,0 +1,2 @@
+import{Icon as e}from"../icons/icon/Icon.mjs";import{IconWrapped as t}from"../icons/icon-wrapped/IconWrapped.mjs";import{uploadedFileStartIcon as n,uploadedFileStartIconIconRaw as r,uploadedFileStartIconIconRawRoot as i,uploadedFileStartIconRoot as a,uploadedFileStartIconWrapped as o,uploadedFileStartIconWrappedRoot as s}from"@mage-ui/styled-system/recipes";import{jsx as c}from"react/jsx-runtime";const l=[{match:e=>e.startsWith(`image/`),type:`image`},{match:e=>e.startsWith(`video/`),type:`video`},{match:e=>e.startsWith(`audio/`),type:`audio`},{match:e=>e===`application/pdf`,type:`pdf`},{match:e=>e.startsWith(`text/`),type:`text`},{match:e=>[`application/zip`,`application/x-zip-compressed`,`application/x-rar-compressed`,`application/x-7z-compressed`].includes(e),type:`archive`}],u={png:`image`,jpg:`image`,jpeg:`image`,webp:`image`,gif:`image`,mp4:`video`,mov:`video`,webm:`video`,mp3:`audio`,wav:`audio`,txt:`text`,md:`text`,csv:`text`,pdf:`pdf`,zip:`archive`,rar:`archive`,"7z":`archive`},d={image:`mage-uploaded-file-image`,video:`mage-uploaded-file-video`,audio:`mage-uploaded-file-audio`,text:`mage-uploaded-file-text`,pdf:`mage-uploaded-file-pdf`,archive:`mage-uploaded-file-archive`,default:`mage-uploaded-file-attachment`},f=(e,t)=>{if(e){let t=l.find(({match:t})=>t(e));if(t)return d[t.type]}if(t){let e=t.split(`.`).pop()?.toLowerCase();if(e&&u[e])return d[u[e]]}return d.default},p=({fileType:l,fileName:u,classNames:d})=>{let p=f(l,u);return c(t,{classNames:{iconWrapped:d?.startIconWrapped?.iconWrapped??o(),root:d?.startIconWrapped?.root??s()},children:c(e,{name:p,path:`/icons/sprite-mage.svg`,classNames:{icon:d?.startIcon?.icon??n(),root:d?.startIcon?.root??a(),iconRaw:{iconRaw:d?.startIcon?.iconRaw?.iconRaw??r(),root:d?.startIcon?.iconRaw?.root??i()}}})})};export{p as UploadedFileIcon};
+//# sourceMappingURL=UploadedFileIcon.mjs.map

package/dist/components/data-display/uploaded-file/UploadedFileIcon.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"UploadedFileIcon.mjs","names":[],"sources":["../../../../src/components/data-display/uploaded-file/UploadedFileIcon.tsx"],"sourcesContent":["import {\n  uploadedFileStartIcon,\n  uploadedFileStartIconIconRaw,\n  uploadedFileStartIconIconRawRoot,\n  uploadedFileStartIconRoot,\n  uploadedFileStartIconWrapped,\n  uploadedFileStartIconWrappedRoot,\n} from '@mage-ui/styled-system/recipes';\nimport {\n  Icon,\n  type IconProps,\n  IconWrapped,\n  type IconWrappedProps,\n} from '@/components/data-display';\n\ntype FileIconType =\n  | 'image'\n  | 'video'\n  | 'audio'\n  | 'text'\n  | 'pdf'\n  | 'archive'\n  | 'default';\n\nconst MIME_ICON_MAP: Array<{\n  match: (mime: string) => boolean;\n  type: FileIconType;\n}> = [\n  { match: (m) => m.startsWith('image/'), type: 'image' },\n  { match: (m) => m.startsWith('video/'), type: 'video' },\n  { match: (m) => m.startsWith('audio/'), type: 'audio' },\n  { match: (m) => m === 'application/pdf', type: 'pdf' },\n  { match: (m) => m.startsWith('text/'), type: 'text' },\n  {\n    match: (m) =>\n      [\n        'application/zip',\n        'application/x-zip-compressed',\n        'application/x-rar-compressed',\n        'application/x-7z-compressed',\n      ].includes(m),\n    type: 'archive',\n  },\n];\n\nconst EXTENSION_ICON_MAP: Record<string, FileIconType> = {\n  png: 'image',\n  jpg: 'image',\n  jpeg: 'image',\n  webp: 'image',\n  gif: 'image',\n  mp4: 'video',\n  mov: 'video',\n  webm: 'video',\n  mp3: 'audio',\n  wav: 'audio',\n  txt: 'text',\n  md: 'text',\n  csv: 'text',\n  pdf: 'pdf',\n  zip: 'archive',\n  rar: 'archive',\n  '7z': 'archive',\n};\n\nconst ICON_NAME_MAP: Record<FileIconType, string> = {\n  image: 'mage-uploaded-file-image',\n  video: 'mage-uploaded-file-video',\n  audio: 'mage-uploaded-file-audio',\n  text: 'mage-uploaded-file-text',\n  pdf: 'mage-uploaded-file-pdf',\n  archive: 'mage-uploaded-file-archive',\n  default: 'mage-uploaded-file-attachment',\n};\n\nconst resolveIconName = (fileType?: string, fileName?: string): string => {\n  if (fileType) {\n    const match = MIME_ICON_MAP.find(({ match }) => match(fileType));\n    if (match) return ICON_NAME_MAP[match.type];\n  }\n\n  if (fileName) {\n    const ext = fileName.split('.').pop()?.toLowerCase();\n    if (ext && EXTENSION_ICON_MAP[ext]) {\n      return ICON_NAME_MAP[EXTENSION_ICON_MAP[ext]];\n    }\n  }\n\n  return ICON_NAME_MAP.default;\n};\n\nexport type UploadedFileIconProps = {\n  fileType?: string;\n  fileName?: string;\n  classNames?: {\n    startIconWrapped?: IconWrappedProps['classNames'];\n    startIcon?: IconProps['classNames'];\n  };\n};\n\nexport const UploadedFileIcon = ({\n  fileType,\n  fileName,\n  classNames,\n}: UploadedFileIconProps) => {\n  const iconName = resolveIconName(fileType, fileName);\n\n  return (\n    <IconWrapped\n      classNames={{\n        iconWrapped:\n          classNames?.startIconWrapped?.iconWrapped ??\n          uploadedFileStartIconWrapped(),\n        root:\n          classNames?.startIconWrapped?.root ??\n          uploadedFileStartIconWrappedRoot(),\n      }}\n    >\n      <Icon\n        name={iconName}\n        path='/icons/sprite-mage.svg'\n        classNames={{\n          icon: classNames?.startIcon?.icon ?? uploadedFileStartIcon(),\n          root: classNames?.startIcon?.root ?? uploadedFileStartIconRoot(),\n          iconRaw: {\n            iconRaw:\n              classNames?.startIcon?.iconRaw?.iconRaw ??\n              uploadedFileStartIconIconRaw(),\n            root:\n              classNames?.startIcon?.iconRaw?.root ??\n              uploadedFileStartIconIconRawRoot(),\n          },\n        }}\n      />\n    </IconWrapped>\n  );\n};\n"],"mappings":"gZAwBA,MAAM,EAGD,CACH,CAAE,MAAQ,GAAM,EAAE,WAAW,SAAS,CAAE,KAAM,QAAS,CACvD,CAAE,MAAQ,GAAM,EAAE,WAAW,SAAS,CAAE,KAAM,QAAS,CACvD,CAAE,MAAQ,GAAM,EAAE,WAAW,SAAS,CAAE,KAAM,QAAS,CACvD,CAAE,MAAQ,GAAM,IAAM,kBAAmB,KAAM,MAAO,CACtD,CAAE,MAAQ,GAAM,EAAE,WAAW,QAAQ,CAAE,KAAM,OAAQ,CACrD,CACE,MAAQ,GACN,CACE,kBACA,+BACA,+BACA,8BACD,CAAC,SAAS,EAAE,CACf,KAAM,UACP,CACF,CAEK,EAAmD,CACvD,IAAK,QACL,IAAK,QACL,KAAM,QACN,KAAM,QACN,IAAK,QACL,IAAK,QACL,IAAK,QACL,KAAM,QACN,IAAK,QACL,IAAK,QACL,IAAK,OACL,GAAI,OACJ,IAAK,OACL,IAAK,MACL,IAAK,UACL,IAAK,UACL,KAAM,UACP,CAEK,EAA8C,CAClD,MAAO,2BACP,MAAO,2BACP,MAAO,2BACP,KAAM,0BACN,IAAK,yBACL,QAAS,6BACT,QAAS,gCACV,CAEK,GAAmB,EAAmB,IAA8B,CACxE,GAAI,EAAU,CACZ,IAAM,EAAQ,EAAc,MAAM,CAAE,WAAY,EAAM,EAAS,CAAC,CAChE,GAAI,EAAO,OAAO,EAAc,EAAM,MAGxC,GAAI,EAAU,CACZ,IAAM,EAAM,EAAS,MAAM,IAAI,CAAC,KAAK,EAAE,aAAa,CACpD,GAAI,GAAO,EAAmB,GAC5B,OAAO,EAAc,EAAmB,IAI5C,OAAO,EAAc,SAYV,GAAoB,CAC/B,WACA,WACA,gBAC2B,CAC3B,IAAM,EAAW,EAAgB,EAAU,EAAS,CAEpD,OACE,EAAC,EAAA,CACC,WAAY,CACV,YACE,GAAY,kBAAkB,aAC9B,GAA8B,CAChC,KACE,GAAY,kBAAkB,MAC9B,GAAkC,CACrC,UAED,EAAC,EAAA,CACC,KAAM,EACN,KAAK,yBACL,WAAY,CACV,KAAM,GAAY,WAAW,MAAQ,GAAuB,CAC5D,KAAM,GAAY,WAAW,MAAQ,GAA2B,CAChE,QAAS,CACP,QACE,GAAY,WAAW,SAAS,SAChC,GAA8B,CAChC,KACE,GAAY,WAAW,SAAS,MAChC,GAAkC,CACrC,CACF,EACD,EACU"}

package/dist/components/forms/Form.d.mts

@@ -0,0 +1,114 @@
+import { TextInputProps } from "../controls/text-input/TextInput.mjs";
+import { PasswordSegment } from "../controls/password-input/PasswordStrengthInput.mjs";
+import { PasswordRuleDefinition } from "../controls/password-input/usePasswordRules.mjs";
+import "../index.mjs";
+import * as react_jsx_runtime52 from "react/jsx-runtime";
+import React, { ReactNode } from "react";
+import { FieldValues, UseFormSetError } from "react-hook-form";
+import { ZodObject, ZodTypeAny } from "zod";
+
+//#region src/components/forms/Form.d.ts
+type FormResponse = {
+  body?: object;
+  details?: string;
+  status?: number;
+  url?: string;
+};
+type FormProps<T extends FieldValues> = {
+  $fetcher: (params: {
+    data: T;
+  }) => Promise<unknown>;
+  onValidSubmit?: (response: FormResponse) => void;
+  onInvalidSubmit?: (params: {
+    message: string;
+    setError: UseFormSetError<T>;
+    status: number;
+  }) => void;
+  invalidStatus?: number[];
+  children: ReactNode;
+  schema?: ZodObject<Record<string, ZodTypeAny>>;
+  t?: (key: string, bindings?: Record<string, string>, fallback?: string) => string | React.ReactNode;
+};
+declare const Form: {
+  <T extends FieldValues>({
+    $fetcher,
+    onValidSubmit,
+    onInvalidSubmit,
+    invalidStatus,
+    children,
+    schema,
+    t
+  }: FormProps<T>): react_jsx_runtime52.JSX.Element;
+  displayName: string;
+  TextInput: {
+    ({
+      $rule,
+      isSubmitting,
+      ...props
+    }: {
+      $rule?: string;
+      error?: string;
+      isSubmitting?: boolean;
+    } & TextInputProps): react_jsx_runtime52.JSX.Element;
+    displayName: string;
+  };
+  Submit: {
+    ({
+      children
+    }: {
+      children: React.ReactNode;
+    }): react_jsx_runtime52.JSX.Element;
+    displayName: string;
+  };
+  Hidden: {
+    ({
+      name,
+      value,
+      ...props
+    }: {
+      name?: string;
+      value?: string;
+      defaultValue?: string;
+    } & React.InputHTMLAttributes<HTMLInputElement>): react_jsx_runtime52.JSX.Element;
+    displayName: string;
+  };
+  Checkbox: {
+    ({
+      $rule,
+      error,
+      isSubmitting,
+      children,
+      ...props
+    }: {
+      $rule?: string;
+      error?: string;
+      isSubmitting?: boolean;
+      name: string;
+    } & React.InputHTMLAttributes<HTMLInputElement>): react_jsx_runtime52.JSX.Element;
+    displayName: string;
+  };
+  Password: {
+    ({
+      error,
+      isSubmitting,
+      strengthBar,
+      value,
+      name,
+      rules,
+      segments
+    }: {
+      $rule?: string;
+      error?: string;
+      isSubmitting?: boolean;
+      strengthBar?: boolean;
+      value?: string;
+      name: string;
+      rules?: PasswordRuleDefinition[];
+      segments?: PasswordSegment[];
+    }): react_jsx_runtime52.JSX.Element;
+    displayName: string;
+  };
+};
+//#endregion
+export { Form, FormProps };
+//# sourceMappingURL=Form.d.mts.map

package/dist/components/forms/Form.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Form.d.mts","names":[],"sources":["../../../src/components/forms/Form.tsx"],"mappings":";;;;;;;;;;KAaK,YAAA;EACH,IAAA;EACA,OAAA;EACA,MAAA;EACA,GAAA;AAAA;AAAA,KAGU,SAAA,WAAoB,WAAA;EAC9B,QAAA,GAAW,MAAA;IAAU,IAAA,EAAM,CAAA;EAAA,MAAQ,OAAA;EACnC,aAAA,IAAiB,QAAA,EAAU,YAAA;EAC3B,eAAA,IAAmB,MAAA;IACjB,OAAA;IACA,QAAA,EAAU,eAAA,CAAgB,CAAA;IAC1B,MAAA;EAAA;EAEF,aAAA;EACA,QAAA,EAAU,SAAA;EACV,MAAA,GAAS,SAAA,CAAU,MAAA,SAAe,UAAA;EAClC,CAAA,IACE,GAAA,UACA,QAAA,GAAW,MAAA,kBACX,QAAA,uBACY,KAAA,CAAM,SAAA;AAAA;AAAA,cAWT,IAAA;EAAA,WAAkB,WAAA;IAAW,QAAA;IAAA,aAAA;IAAA,eAAA;IAAA,aAAA;IAAA,QAAA;IAAA,MAAA;IAAA;EAAA,GAQvC,SAAA,CAAU,CAAA,IAAE,mBAAA,CAAA,GAAA,CAAA,OAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAlCR,eAAA;IAAA"}

package/dist/components/forms/Form.mjs

@@ -0,0 +1,2 @@
+import{FormCheckbox as e}from"./controls/FormCheckbox.mjs";import{FormHidden as t}from"./controls/FormHidden.mjs";import{FormPassword as n}from"./controls/FormPassword.mjs";import{FormSubmit as r}from"./controls/FormSubmit.mjs";import{FormTextInput as i}from"./controls/FormTextInput.mjs";import{FormBase as a}from"./FormBase.mjs";import{FormErrorBox as o}from"./FormErrorBox.mjs";import{jsx as s}from"react/jsx-runtime";const c=({$fetcher:e,onValidSubmit:t,onInvalidSubmit:n,invalidStatus:r=[],children:i,schema:c,t:l})=>s(a,{onSubmit:async({data:i,setError:a})=>{await e({data:i}).then(e=>{let n=e;if(n?.statusCode&&n.statusCode>=400)throw n;t?.(e||{})}).catch(e=>{switch(e.statusCode){case 400:case 422:e.cause?.issues&&Object.keys(e.cause.issues).forEach(t=>{a(t,{type:`server`,message:e.cause?.issues?.[t]})}),a(`root.serverError`,{type:`server`,message:e?.message??`Something went wrong`});break;default:if(r.includes(e.statusCode)){n?.({message:e.message,setError:a,status:e.statusCode});break}throw e}})},schema:c,errorBox:o,t:l,children:i});c.displayName=`Form`,c.TextInput=i,c.Submit=r,c.Hidden=t,c.Checkbox=e,c.Password=n;export{c as Form};
+//# sourceMappingURL=Form.mjs.map

package/dist/components/forms/Form.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Form.mjs","names":[],"sources":["../../../src/components/forms/Form.tsx"],"sourcesContent":["import type React from 'react';\nimport type { ReactNode } from 'react';\nimport type { FieldValues, UseFormSetError } from 'react-hook-form';\nimport type { ZodObject, ZodTypeAny } from 'zod';\n\nimport { FormCheckbox } from './controls/FormCheckbox';\nimport { FormHidden } from './controls/FormHidden';\nimport { FormPassword } from './controls/FormPassword';\nimport { FormSubmit } from './controls/FormSubmit';\nimport { FormTextInput } from './controls/FormTextInput';\nimport { FormBase } from './FormBase';\nimport { FormErrorBox } from './FormErrorBox';\n\ntype FormResponse = {\n  body?: object;\n  details?: string;\n  status?: number;\n  url?: string;\n};\n\nexport type FormProps<T extends FieldValues> = {\n  $fetcher: (params: { data: T }) => Promise<unknown>;\n  onValidSubmit?: (response: FormResponse) => void;\n  onInvalidSubmit?: (params: {\n    message: string;\n    setError: UseFormSetError<T>;\n    status: number;\n  }) => void;\n  invalidStatus?: number[];\n  children: ReactNode;\n  schema?: ZodObject<Record<string, ZodTypeAny>>;\n  t?: (\n    key: string,\n    bindings?: Record<string, string>,\n    fallback?: string,\n  ) => string | React.ReactNode;\n};\n\ntype FormError = {\n  statusCode: number;\n  message: string;\n  cause?: {\n    issues: Record<string, string>;\n  };\n};\n\nexport const Form = <T extends FieldValues>({\n  $fetcher,\n  onValidSubmit,\n  onInvalidSubmit,\n  invalidStatus = [],\n  children,\n  schema,\n  t,\n}: FormProps<T>) => {\n  const onSubmit = async ({\n    data,\n    setError,\n  }: {\n    data: FieldValues;\n    setError: UseFormSetError<FieldValues>;\n  }) => {\n    await $fetcher({ data: data as T })\n      .then((response) => {\n        const res = response as FormError & FormResponse;\n        if (res?.statusCode && res.statusCode >= 400) {\n          throw res;\n        }\n\n        onValidSubmit?.((response || {}) as FormResponse);\n      })\n      .catch((error: FormError) => {\n        switch (error.statusCode) {\n          case 400:\n          case 422: {\n            if (error.cause?.issues) {\n              Object.keys(error.cause.issues).forEach((key) => {\n                setError(key, {\n                  type: 'server',\n                  message: error.cause?.issues?.[key],\n                });\n              });\n            }\n            setError('root.serverError', {\n              type: 'server',\n              message: error?.message ?? 'Something went wrong',\n            });\n            break;\n          }\n          default:\n            if (invalidStatus.includes(error.statusCode)) {\n              onInvalidSubmit?.({\n                message: error.message,\n                setError: setError as UseFormSetError<T>,\n                status: error.statusCode,\n              });\n              break;\n            }\n            throw error;\n        }\n      });\n  };\n\n  return (\n    <FormBase onSubmit={onSubmit} schema={schema} errorBox={FormErrorBox} t={t}>\n      {children}\n    </FormBase>\n  );\n};\n\nForm.displayName = 'Form';\nForm.TextInput = FormTextInput;\nForm.Submit = FormSubmit;\nForm.Hidden = FormHidden;\nForm.Checkbox = FormCheckbox;\nForm.Password = FormPassword;\n"],"mappings":"qaA8CA,MAAa,GAA+B,CAC1C,WACA,gBACA,kBACA,gBAAgB,EAAE,CAClB,WACA,SACA,OAmDE,EAAC,EAAA,CAAmB,SAjDL,MAAO,CACtB,OACA,cAII,CACJ,MAAM,EAAS,CAAQ,OAAW,CAAC,CAChC,KAAM,GAAa,CAClB,IAAM,EAAM,EACZ,GAAI,GAAK,YAAc,EAAI,YAAc,IACvC,MAAM,EAGR,IAAiB,GAAY,EAAE,CAAkB,EACjD,CACD,MAAO,GAAqB,CAC3B,OAAQ,EAAM,WAAd,CACE,IAAK,KACL,IAAK,KACC,EAAM,OAAO,QACf,OAAO,KAAK,EAAM,MAAM,OAAO,CAAC,QAAS,GAAQ,CAC/C,EAAS,EAAK,CACZ,KAAM,SACN,QAAS,EAAM,OAAO,SAAS,GAChC,CAAC,EACF,CAEJ,EAAS,mBAAoB,CAC3B,KAAM,SACN,QAAS,GAAO,SAAW,uBAC5B,CAAC,CACF,MAEF,QACE,GAAI,EAAc,SAAS,EAAM,WAAW,CAAE,CAC5C,IAAkB,CAChB,QAAS,EAAM,QACL,WACV,OAAQ,EAAM,WACf,CAAC,CACF,MAEF,MAAM,IAEV,EAIkC,SAAQ,SAAU,EAAiB,IACtE,YACQ,CAIf,EAAK,YAAc,OACnB,EAAK,UAAY,EACjB,EAAK,OAAS,EACd,EAAK,OAAS,EACd,EAAK,SAAW,EAChB,EAAK,SAAW"}

package/dist/components/forms/FormBase.mjs

@@ -0,0 +1,2 @@
+"use client";import{controls as e}from"./controls/index.mjs";import{RegisteredFormChildren as t}from"./controls/register-components.mjs";import{extractFormRules as n}from"./rules/extract-form-rules.mjs";import{jsx as r,jsxs as i}from"react/jsx-runtime";import{useEffect as a}from"react";import{FormProvider as o,useForm as s}from"react-hook-form";import*as c from"zod";import{zodResolver as l}from"@hookform/resolvers/zod";const u=({errorBox:u,onWatch:d,onSubmit:f,children:p,schema:m=c.object({}),t:h})=>{let g=s({shouldFocusError:!0,resolver:l(m?m.and(n(p,e)):n(p,e))}),{register:_,handleSubmit:v,setError:y,formState:{errors:b},watch:x}=g;return a(()=>{let{unsubscribe:e}=x(e=>{d?.(e)});return()=>e()},[x,d]),i(o,{...g,t:h,children:[r(u,{errors:b}),r(`form`,{onSubmit:v(e=>f({data:e,setError:y})),children:r(t,{register:_,componentTypes:e,errors:b,t:h,children:p})})]})};export{u as FormBase};
+//# sourceMappingURL=FormBase.mjs.map

package/dist/components/forms/FormBase.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormBase.mjs","names":["z"],"sources":["../../../src/components/forms/FormBase.tsx"],"sourcesContent":["'use client';\n\nimport type React from 'react';\nimport { useEffect } from 'react';\nimport type {\n  DeepPartialSkipArrayKey,\n  FieldErrors,\n  FieldValues,\n  UseFormSetError,\n} from 'react-hook-form';\nimport { FormProvider, useForm } from 'react-hook-form';\nimport * as z from 'zod';\n\nimport { zodResolver } from '@hookform/resolvers/zod';\n\nimport { controls } from './controls';\nimport { RegisteredFormChildren } from './controls/register-components';\nimport { extractFormRules } from './rules/extract-form-rules';\n\ntype FormProps = {\n  children: React.ReactNode;\n  schema?: z.ZodObject<Record<string, z.ZodTypeAny>>;\n  errorBox: React.ComponentType<{ errors: FieldErrors }>;\n  onWatch?: (values: DeepPartialSkipArrayKey<FieldValues>) => void;\n  onSubmit: (args: {\n    data: FieldValues;\n    setError: UseFormSetError<FieldValues>;\n  }) => void | Promise<void>;\n  t?: (\n    key: string,\n    bindings?: Record<string, string>,\n    fallback?: string,\n  ) => string | React.ReactNode;\n};\n\nexport const FormBase = ({\n  errorBox: ErrorBox,\n  onWatch,\n  onSubmit,\n  children,\n  schema = z.object({}),\n  t,\n}: FormProps) => {\n  const rules = (\n    schema\n      ? schema.and(extractFormRules(children, controls) as z.ZodTypeAny)\n      : (extractFormRules(children, controls) as z.ZodTypeAny)\n  ) as z.ZodType<FieldValues, FieldValues>;\n\n  const form = useForm({\n    shouldFocusError: true,\n    resolver: zodResolver(rules),\n  });\n\n  const {\n    register,\n    handleSubmit,\n    setError,\n    formState: { errors },\n    watch,\n  } = form;\n\n  useEffect(() => {\n    const { unsubscribe } = watch((values) => {\n      onWatch?.(values);\n    });\n    return () => unsubscribe();\n  }, [watch, onWatch]);\n\n  return (\n    <FormProvider {...form} {...({ t } as Record<string, unknown>)}>\n      <ErrorBox errors={errors} />\n      <form onSubmit={handleSubmit((data) => onSubmit({ data, setError }))}>\n        <RegisteredFormChildren\n          register={register}\n          componentTypes={controls}\n          errors={errors}\n          t={t}\n        >\n          {children}\n        </RegisteredFormChildren>\n      </form>\n    </FormProvider>\n  );\n};\n"],"mappings":"uaAmCA,MAAa,GAAY,CACvB,SAAU,EACV,UACA,WACA,WACA,SAASA,EAAE,OAAO,EAAE,CAAC,CACrB,OACe,CAOf,IAAM,EAAO,EAAQ,CACnB,iBAAkB,GAClB,SAAU,EAPV,EACI,EAAO,IAAI,EAAiB,EAAU,EAAS,CAAiB,CAC/D,EAAiB,EAAU,EAAS,CAKb,CAC7B,CAAC,CAEI,CACJ,WACA,eACA,WACA,UAAW,CAAE,UACb,SACE,EASJ,OAPA,MAAgB,CACd,GAAM,CAAE,eAAgB,EAAO,GAAW,CACxC,IAAU,EAAO,EACjB,CACF,UAAa,GAAa,EACzB,CAAC,EAAO,EAAQ,CAAC,CAGlB,EAAC,EAAA,CAAa,GAAI,EAAa,cAC7B,EAAC,EAAA,CAAiB,SAAA,CAAU,CAC5B,EAAC,OAAA,CAAK,SAAU,EAAc,GAAS,EAAS,CAAE,OAAM,WAAU,CAAC,CAAC,UAClE,EAAC,EAAA,CACW,WACV,eAAgB,EACR,SACL,IAEF,YACsB,EACpB,CAAA,EACM"}

package/dist/components/forms/FormErrorBox.mjs

@@ -0,0 +1,2 @@
+import{jsx as e}from"react/jsx-runtime";const t=({errors:t})=>t.root?.serverError&&e(`div`,{style:{color:`red`},children:t.root.serverError.message});export{t as FormErrorBox};
+//# sourceMappingURL=FormErrorBox.mjs.map

package/dist/components/forms/FormErrorBox.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormErrorBox.mjs","names":[],"sources":["../../../src/components/forms/FormErrorBox.tsx"],"sourcesContent":["import type { FieldErrors } from 'react-hook-form';\n\nexport const FormErrorBox = ({ errors }: { errors: FieldErrors }) =>\n  errors.root?.serverError && (\n    <div style={{ color: 'red' }}>{errors.root.serverError.message}</div>\n  );\n"],"mappings":"wCAEA,MAAa,GAAgB,CAAE,YAC7B,EAAO,MAAM,aACX,EAAC,MAAA,CAAI,MAAO,CAAE,MAAO,MAAO,UAAG,EAAO,KAAK,YAAY,SAAc"}