@mage-ui/components 1.0.88 → 1.0.89

package/dist/components/data-display/calendar/Calendar.d.mts

@@ -1,12 +1,7 @@
-import { CalendarEventVariantProps } from "@mage-ui/styled-system/recipes";
 import * as react_jsx_runtime0 from "react/jsx-runtime";
-import "dayjs/locale/es";
-import "dayjs/locale/ca";
-import "dayjs/locale/en";
 import { CalendarProps, DateLocalizer, Event, Event as CalendarEvent, View } from "react-big-calendar";
 
 //#region src/components/data-display/calendar/Calendar.d.ts
-type CalendarVariant = NonNullable<CalendarEventVariantProps['variant']>;
 type CalendarView = View;
 type CalendarProps$1 = Omit<CalendarProps<Event>, 'localizer'> & {
   classNames?: {
@@ -33,5 +28,5 @@ declare const Calendar$1: ({
   ...props
 }: CalendarProps$1) => react_jsx_runtime0.JSX.Element;
 //#endregion
-export { Calendar$1 as Calendar, type CalendarEvent, CalendarProps$1 as CalendarProps, CalendarVariant, CalendarView, type DateLocalizer };
+export { Calendar$1 as Calendar, type CalendarEvent, CalendarProps$1 as CalendarProps, CalendarView, type DateLocalizer };
 //# sourceMappingURL=Calendar.d.mts.map

package/dist/components/data-display/calendar/Calendar.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"Calendar.d.mts","names":[],"sources":["../../../../src/components/data-display/calendar/Calendar.tsx"],"mappings":";;;;;;;;KA8CY,eAAA,GAAkB,WAAA,CAAY,yBAAA;AAAA,KAC9B,YAAA,GAAe,IAAA;AAAA,KAOf,eAAA,GAAgB,IAAA,CAAK,aAAA,CAAiB,KAAA;EAChD,UAAA;IACE,QAAA;IACA,IAAA;IACA,OAAA;IACA,KAAA;IACA,KAAA;IACA,MAAA;IACA,QAAA;IACA,KAAA;EAAA;AAAA;AAAA,cA+BS,UAAA;EAAY,UAAA;EAAA,OAAA;EAAA,WAAA;EAAA,UAAA;EAAA,eAAA;EAAA,OAAA;EAAA,MAAA;EAAA,eAAA;EAAA,IAAA;EAAA,GAAA;AAAA,GAWtB,eAAA,KAAa,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"Calendar.d.mts","names":[],"sources":["../../../../src/components/data-display/calendar/Calendar.tsx"],"mappings":";;;;KA6CY,YAAA,GAAe,IAAA;AAAA,KAOf,eAAA,GAAgB,IAAA,CAAK,aAAA,CAAiB,KAAA;EAChD,UAAA;IACE,QAAA;IACA,IAAA;IACA,OAAA;IACA,KAAA;IACA,KAAA;IACA,MAAA;IACA,QAAA;IACA,KAAA;EAAA;AAAA;AAAA,cA+BS,UAAA;EAAY,UAAA;EAAA,OAAA;EAAA,WAAA;EAAA,UAAA;EAAA,eAAA;EAAA,OAAA;EAAA,MAAA;EAAA,eAAA;EAAA,IAAA;EAAA,GAAA;AAAA,GAWtB,eAAA,KAAa,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/data-display/calendar/Calendar.mjs

@@ -1,2 +1,2 @@
-import{Tooltip as e}from"../../overlays/tooltip/Tooltip.mjs";import{cx as t}from"@mage-ui/styled-system/css";import{calendar as n,calendarAgenda as r,calendarEvent as i,calendarMonth as a,calendarPopup as o,calendarRoot as s,calendarTimeGrid as c,calendarToolbar as l}from"@mage-ui/styled-system/recipes";import{jsx as u,jsxs as d}from"react/jsx-runtime";import{useState as f}from"react";import p from"dayjs";import"dayjs/locale/es";import"dayjs/locale/ca";import"dayjs/locale/en";import{Calendar as m,dayjsLocalizer as h}from"react-big-calendar";const g=h(p),_=e=>({monthHeaderFormat:t=>p(t).locale(e).format(`MMMM [de] YYYY`).replace(/^./,e=>e.toUpperCase()),dayHeaderFormat:t=>p(t).locale(e).format(`dddd D [de] MMMM`),timeGutterFormat:`HH:mm`}),v=(e,t,n)=>{let r=t.title?.(e)??e.title,i=t.start?.(e)??e.start,a=t.end?.(e)??e.end,o=!e.allDay&&i&&a;return!r&&!o?null:d(`div`,{children:[o?d(`div`,{children:[p(i).locale(n).format(`HH:mm`),` -`,` `,p(a).locale(n).format(`HH:mm`)]}):null,r?u(`strong`,{children:r}):null]})},y=({classNames:d,culture:p=`es`,defaultView:h=`month`,components:y,eventPropGetter:b,formats:x,onView:S,tooltipAccessor:C,view:w,...T})=>{let[E,D]=f(w??h??`month`),O=w??E,k=O===`month`||O===`week`||O===`day`,A=k?({event:t,accessors:n,children:r})=>{let i=v(t,n,p);return!r||!i?r??null:u(e,{label:i,position:`top`,withArrow:!0,children:r})}:void 0,j=!k||(y?.eventWrapper||A)&&C===void 0?null:C,M={..._(p),...x??{}},N=A||y?.eventWrapper?{...y,eventWrapper:y?.eventWrapper??A}:y;return u(m,{className:t(d?.calendar??n(),d?.root??s(),d?.toolbar??l(),d?.month??a(),d?.agenda??r(),d?.timeGrid??c(),d?.popup??o()),localizer:g,culture:p,defaultView:h,eventPropGetter:(e,n,r,a)=>{let o=b?.(e,n,r,a),{variant:s}=e;return{...o,className:t(d?.event,i({variant:s}),o?.className)}},formats:M,onView:e=>{w===void 0&&D(e),S?.(e)},components:N,tooltipAccessor:j,view:w,...T})};export{y as Calendar};
+import{Tooltip as e}from"../../overlays/tooltip/Tooltip.mjs";import{cx as t}from"@mage-ui/styled-system/css";import{calendar as n,calendarAgenda as r,calendarEvent as i,calendarMonth as a,calendarPopup as o,calendarRoot as s,calendarTimeGrid as c,calendarToolbar as l}from"@mage-ui/styled-system/recipes";import{jsx as u,jsxs as d}from"react/jsx-runtime";import{useState as f}from"react";import p from"dayjs";import"dayjs/locale/es";import"dayjs/locale/ca";import"dayjs/locale/en";import{Calendar as m,dayjsLocalizer as h}from"react-big-calendar";const g=h(p),_=e=>({monthHeaderFormat:t=>p(t).locale(e).format(`MMMM [de] YYYY`).replace(/^./,e=>e.toUpperCase()),dayHeaderFormat:t=>p(t).locale(e).format(`dddd D [de] MMMM`),timeGutterFormat:`HH:mm`}),v=(e,t,n)=>{let r=t.title?.(e)??e.title,i=t.start?.(e)??e.start,a=t.end?.(e)??e.end,o=!e.allDay&&i&&a;return!r&&!o?null:d(`div`,{children:[o?d(`div`,{children:[p(i).locale(n).format(`HH:mm`),` -`,` `,p(a).locale(n).format(`HH:mm`)]}):null,r?u(`strong`,{children:r}):null]})},y=({classNames:d,culture:p=`es`,defaultView:h=`month`,components:y,eventPropGetter:b,formats:x,onView:S,tooltipAccessor:C,view:w,...T})=>{let[E,D]=f(w??h??`month`),O=w??E,k=O===`month`||O===`week`||O===`day`,A=k?({event:t,accessors:n,children:r})=>{let i=v(t,n,p);return!r||!i?r??null:u(e,{label:i,position:`top`,withArrow:!0,children:r})}:void 0,j=!k||(y?.eventWrapper||A)&&C===void 0?null:C,M={..._(p),...x??{}},N=A||y?.eventWrapper?{...y,eventWrapper:y?.eventWrapper??A}:y;return u(m,{className:t(d?.calendar??n(),d?.root??s(),d?.toolbar??l(),d?.month??a(),d?.agenda??r(),d?.timeGrid??c(),d?.popup??o()),localizer:g,culture:p,defaultView:h,eventPropGetter:(e,n,r,a)=>{let o=b?.(e,n,r,a);return{...o,className:t(d?.event,i(),o?.className)}},formats:M,onView:e=>{w===void 0&&D(e),S?.(e)},components:N,tooltipAccessor:j,view:w,...T})};export{y as Calendar};
 //# sourceMappingURL=Calendar.mjs.map

package/dist/components/data-display/calendar/Calendar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Calendar.mjs","names":["Calendar","BigCalendar"],"sources":["../../../../src/components/data-display/calendar/Calendar.tsx"],"sourcesContent":["import dayjs from 'dayjs';\nimport { type ReactNode, useState } from 'react';\nimport 'dayjs/locale/es';\nimport 'dayjs/locale/ca';\nimport 'dayjs/locale/en';\nimport {\n  Calendar as BigCalendar,\n  type CalendarProps as BigCalendarProps,\n  dayjsLocalizer,\n  type Event,\n  type EventWrapperProps,\n  type View,\n} from 'react-big-calendar';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport type { CalendarEventVariantProps } from '@mage-ui/styled-system/recipes';\nimport {\n  calendar,\n  calendarAgenda,\n  calendarEvent,\n  calendarMonth,\n  calendarPopup,\n  calendarRoot,\n  calendarTimeGrid,\n  calendarToolbar,\n} from '@mage-ui/styled-system/recipes';\n\nimport { Tooltip } from '../../overlays/tooltip/Tooltip';\n\nexport type { DateLocalizer, Event as CalendarEvent } from 'react-big-calendar';\n\nconst localizer = dayjsLocalizer(dayjs);\n\nconst getDefaultFormats = (culture: string) => {\n  return {\n    monthHeaderFormat: (date: Date) =>\n      dayjs(date)\n        .locale(culture)\n        .format('MMMM [de] YYYY')\n        .replace(/^./, (str) => str.toUpperCase()),\n    dayHeaderFormat: (date: Date) =>\n      dayjs(date).locale(culture).format('dddd D [de] MMMM'),\n    timeGutterFormat: 'HH:mm',\n  };\n};\n\nexport type CalendarVariant = NonNullable<CalendarEventVariantProps['variant']>;\nexport type CalendarView = View;\n\ntype CalendarEventWrapperProps = EventWrapperProps<Event> & {\n  children?: ReactNode;\n  type?: 'date' | 'time';\n};\n\nexport type CalendarProps = Omit<BigCalendarProps<Event>, 'localizer'> & {\n  classNames?: {\n    calendar?: string;\n    root?: string;\n    toolbar?: string;\n    month?: string;\n    event?: string;\n    agenda?: string;\n    timeGrid?: string;\n    popup?: string;\n  };\n};\n\nconst getEventTooltipContent = (\n  event: Event,\n  accessors: CalendarEventWrapperProps['accessors'],\n  culture: string,\n) => {\n  const title = accessors.title?.(event) ?? event.title;\n  const start = accessors.start?.(event) ?? event.start;\n  const end = accessors.end?.(event) ?? event.end;\n  const showTimeRange = !event.allDay && start && end;\n\n  if (!title && !showTimeRange) {\n    return null;\n  }\n\n  return (\n    <div>\n      {showTimeRange ? (\n        <div>\n          {dayjs(start).locale(culture).format('HH:mm')} -{' '}\n          {dayjs(end).locale(culture).format('HH:mm')}\n        </div>\n      ) : null}\n      {title ? <strong>{title}</strong> : null}\n    </div>\n  );\n};\n\nexport const Calendar = ({\n  classNames,\n  culture = 'es',\n  defaultView = 'month',\n  components,\n  eventPropGetter,\n  formats,\n  onView,\n  tooltipAccessor,\n  view,\n  ...props\n}: CalendarProps) => {\n  const [internalView, setInternalView] = useState<CalendarView>(\n    view ?? defaultView ?? 'month',\n  );\n  const currentView = view ?? internalView;\n  const showTooltip =\n    currentView === 'month' || currentView === 'week' || currentView === 'day';\n  const defaultEventWrapper = showTooltip\n    ? ({ event, accessors, children }: CalendarEventWrapperProps) => {\n        const label = getEventTooltipContent(event, accessors, culture);\n\n        if (!children || !label) {\n          return children ?? null;\n        }\n\n        return (\n          <Tooltip label={label} position='top' withArrow>\n            {children}\n          </Tooltip>\n        );\n      }\n    : undefined;\n  const resolvedTooltipAccessor =\n    !showTooltip ||\n    ((components?.eventWrapper || defaultEventWrapper) &&\n      tooltipAccessor === undefined)\n      ? null\n      : tooltipAccessor;\n  const mergedFormats = {\n    ...getDefaultFormats(culture),\n    ...(formats ?? {}),\n  };\n  const resolvedComponents =\n    defaultEventWrapper || components?.eventWrapper\n      ? {\n          ...components,\n          eventWrapper: components?.eventWrapper ?? defaultEventWrapper,\n        }\n      : components;\n\n  const handleView = (nextView: CalendarView) => {\n    if (view === undefined) {\n      setInternalView(nextView);\n    }\n\n    onView?.(nextView);\n  };\n\n  const handleEventProps = (\n    event: Event,\n    start: Date,\n    end: Date,\n    isSelected: boolean,\n  ) => {\n    const customProps = eventPropGetter?.(event, start, end, isSelected);\n    const { variant } = event as { variant?: CalendarVariant };\n\n    return {\n      ...customProps,\n      className: cx(\n        classNames?.event,\n        calendarEvent({ variant }),\n        customProps?.className,\n      ),\n    };\n  };\n\n  return (\n    <BigCalendar\n      className={cx(\n        classNames?.calendar ?? calendar(),\n        classNames?.root ?? calendarRoot(),\n        classNames?.toolbar ?? calendarToolbar(),\n        classNames?.month ?? calendarMonth(),\n        classNames?.agenda ?? calendarAgenda(),\n        classNames?.timeGrid ?? calendarTimeGrid(),\n        classNames?.popup ?? calendarPopup(),\n      )}\n      localizer={localizer}\n      culture={culture}\n      defaultView={defaultView}\n      eventPropGetter={handleEventProps}\n      formats={mergedFormats}\n      onView={handleView}\n      components={resolvedComponents}\n      tooltipAccessor={resolvedTooltipAccessor}\n      view={view}\n      {...props}\n    />\n  );\n};\n"],"mappings":"miBA+BA,MAAM,EAAY,EAAe,EAAM,CAEjC,EAAqB,IAClB,CACL,kBAAoB,GAClB,EAAM,EAAK,CACR,OAAO,EAAQ,CACf,OAAO,iBAAiB,CACxB,QAAQ,KAAO,GAAQ,EAAI,aAAa,CAAC,CAC9C,gBAAkB,GAChB,EAAM,EAAK,CAAC,OAAO,EAAQ,CAAC,OAAO,mBAAmB,CACxD,iBAAkB,QACnB,EAwBG,GACJ,EACA,EACA,IACG,CACH,IAAM,EAAQ,EAAU,QAAQ,EAAM,EAAI,EAAM,MAC1C,EAAQ,EAAU,QAAQ,EAAM,EAAI,EAAM,MAC1C,EAAM,EAAU,MAAM,EAAM,EAAI,EAAM,IACtC,EAAgB,CAAC,EAAM,QAAU,GAAS,EAMhD,MAJI,CAAC,GAAS,CAAC,EACN,KAIP,EAAC,MAAA,CAAA,SAAA,CACE,EACC,EAAC,MAAA,CAAA,SAAA,CACE,EAAM,EAAM,CAAC,OAAO,EAAQ,CAAC,OAAO,QAAQ,CAAC,KAAG,IAChD,EAAM,EAAI,CAAC,OAAO,EAAQ,CAAC,OAAO,QAAQ,GACvC,CACJ,KACH,EAAQ,EAAC,SAAA,CAAA,SAAQ,EAAA,CAAe,CAAG,KAAA,CAAA,CAChC,EAIGA,GAAY,CACvB,aACA,UAAU,KACV,cAAc,QACd,aACA,kBACA,UACA,SACA,kBACA,OACA,GAAG,KACgB,CACnB,GAAM,CAAC,EAAc,GAAmB,EACtC,GAAQ,GAAe,QACxB,CACK,EAAc,GAAQ,EACtB,EACJ,IAAgB,SAAW,IAAgB,QAAU,IAAgB,MACjE,EAAsB,GACvB,CAAE,QAAO,YAAW,cAA0C,CAC7D,IAAM,EAAQ,EAAuB,EAAO,EAAW,EAAQ,CAM/D,MAJI,CAAC,GAAY,CAAC,EACT,GAAY,KAInB,EAAC,EAAA,CAAe,QAAO,SAAS,MAAM,UAAA,GACnC,YACO,EAGd,IAAA,GACE,EACJ,CAAC,IACC,GAAY,cAAgB,IAC5B,IAAoB,IAAA,GAClB,KACA,EACA,EAAgB,CACpB,GAAG,EAAkB,EAAQ,CAC7B,GAAI,GAAW,EAAE,CAClB,CACK,EACJ,GAAuB,GAAY,aAC/B,CACE,GAAG,EACH,aAAc,GAAY,cAAgB,EAC3C,CACD,EA6BN,OACE,EAACC,EAAAA,CACC,UAAW,EACT,GAAY,UAAY,GAAU,CAClC,GAAY,MAAQ,GAAc,CAClC,GAAY,SAAW,GAAiB,CACxC,GAAY,OAAS,GAAe,CACpC,GAAY,QAAU,GAAgB,CACtC,GAAY,UAAY,GAAkB,CAC1C,GAAY,OAAS,GAAe,CACrC,CACU,YACF,UACI,cACb,iBAhCF,EACA,EACA,EACA,IACG,CACH,IAAM,EAAc,IAAkB,EAAO,EAAO,EAAK,EAAW,CAC9D,CAAE,WAAY,EAEpB,MAAO,CACL,GAAG,EACH,UAAW,EACT,GAAY,MACZ,EAAc,CAAE,UAAS,CAAC,CAC1B,GAAa,UACd,CACF,EAkBC,QAAS,EACT,OA3CgB,GAA2B,CACzC,IAAS,IAAA,IACX,EAAgB,EAAS,CAG3B,IAAS,EAAS,EAuChB,WAAY,EACZ,gBAAiB,EACX,OACN,GAAI,GACJ"}
+{"version":3,"file":"Calendar.mjs","names":["Calendar","BigCalendar"],"sources":["../../../../src/components/data-display/calendar/Calendar.tsx"],"sourcesContent":["import dayjs from 'dayjs';\nimport { type ReactNode, useState } from 'react';\nimport 'dayjs/locale/es';\nimport 'dayjs/locale/ca';\nimport 'dayjs/locale/en';\nimport {\n  Calendar as BigCalendar,\n  type CalendarProps as BigCalendarProps,\n  dayjsLocalizer,\n  type Event,\n  type EventWrapperProps,\n  type View,\n} from 'react-big-calendar';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n  calendar,\n  calendarAgenda,\n  calendarEvent,\n  calendarMonth,\n  calendarPopup,\n  calendarRoot,\n  calendarTimeGrid,\n  calendarToolbar,\n} from '@mage-ui/styled-system/recipes';\n\nimport { Tooltip } from '../../overlays/tooltip/Tooltip';\n\nexport type { DateLocalizer, Event as CalendarEvent } from 'react-big-calendar';\n\nconst localizer = dayjsLocalizer(dayjs);\n\nconst getDefaultFormats = (culture: string) => {\n  return {\n    monthHeaderFormat: (date: Date) =>\n      dayjs(date)\n        .locale(culture)\n        .format('MMMM [de] YYYY')\n        .replace(/^./, (str) => str.toUpperCase()),\n    dayHeaderFormat: (date: Date) =>\n      dayjs(date).locale(culture).format('dddd D [de] MMMM'),\n    timeGutterFormat: 'HH:mm',\n  };\n};\n\nexport type CalendarView = View;\n\ntype CalendarEventWrapperProps = EventWrapperProps<Event> & {\n  children?: ReactNode;\n  type?: 'date' | 'time';\n};\n\nexport type CalendarProps = Omit<BigCalendarProps<Event>, 'localizer'> & {\n  classNames?: {\n    calendar?: string;\n    root?: string;\n    toolbar?: string;\n    month?: string;\n    event?: string;\n    agenda?: string;\n    timeGrid?: string;\n    popup?: string;\n  };\n};\n\nconst getEventTooltipContent = (\n  event: Event,\n  accessors: CalendarEventWrapperProps['accessors'],\n  culture: string,\n) => {\n  const title = accessors.title?.(event) ?? event.title;\n  const start = accessors.start?.(event) ?? event.start;\n  const end = accessors.end?.(event) ?? event.end;\n  const showTimeRange = !event.allDay && start && end;\n\n  if (!title && !showTimeRange) {\n    return null;\n  }\n\n  return (\n    <div>\n      {showTimeRange ? (\n        <div>\n          {dayjs(start).locale(culture).format('HH:mm')} -{' '}\n          {dayjs(end).locale(culture).format('HH:mm')}\n        </div>\n      ) : null}\n      {title ? <strong>{title}</strong> : null}\n    </div>\n  );\n};\n\nexport const Calendar = ({\n  classNames,\n  culture = 'es',\n  defaultView = 'month',\n  components,\n  eventPropGetter,\n  formats,\n  onView,\n  tooltipAccessor,\n  view,\n  ...props\n}: CalendarProps) => {\n  const [internalView, setInternalView] = useState<CalendarView>(\n    view ?? defaultView ?? 'month',\n  );\n  const currentView = view ?? internalView;\n  const showTooltip =\n    currentView === 'month' || currentView === 'week' || currentView === 'day';\n  const defaultEventWrapper = showTooltip\n    ? ({ event, accessors, children }: CalendarEventWrapperProps) => {\n        const label = getEventTooltipContent(event, accessors, culture);\n\n        if (!children || !label) {\n          return children ?? null;\n        }\n\n        return (\n          <Tooltip label={label} position='top' withArrow>\n            {children}\n          </Tooltip>\n        );\n      }\n    : undefined;\n  const resolvedTooltipAccessor =\n    !showTooltip ||\n    ((components?.eventWrapper || defaultEventWrapper) &&\n      tooltipAccessor === undefined)\n      ? null\n      : tooltipAccessor;\n  const mergedFormats = {\n    ...getDefaultFormats(culture),\n    ...(formats ?? {}),\n  };\n  const resolvedComponents =\n    defaultEventWrapper || components?.eventWrapper\n      ? {\n          ...components,\n          eventWrapper: components?.eventWrapper ?? defaultEventWrapper,\n        }\n      : components;\n\n  const handleView = (nextView: CalendarView) => {\n    if (view === undefined) {\n      setInternalView(nextView);\n    }\n\n    onView?.(nextView);\n  };\n\n  const handleEventProps = (\n    event: Event,\n    start: Date,\n    end: Date,\n    isSelected: boolean,\n  ) => {\n    const customProps = eventPropGetter?.(event, start, end, isSelected);\n\n    return {\n      ...customProps,\n      className: cx(classNames?.event, calendarEvent(), customProps?.className),\n    };\n  };\n\n  return (\n    <BigCalendar\n      className={cx(\n        classNames?.calendar ?? calendar(),\n        classNames?.root ?? calendarRoot(),\n        classNames?.toolbar ?? calendarToolbar(),\n        classNames?.month ?? calendarMonth(),\n        classNames?.agenda ?? calendarAgenda(),\n        classNames?.timeGrid ?? calendarTimeGrid(),\n        classNames?.popup ?? calendarPopup(),\n      )}\n      localizer={localizer}\n      culture={culture}\n      defaultView={defaultView}\n      eventPropGetter={handleEventProps}\n      formats={mergedFormats}\n      onView={handleView}\n      components={resolvedComponents}\n      tooltipAccessor={resolvedTooltipAccessor}\n      view={view}\n      {...props}\n    />\n  );\n};\n"],"mappings":"miBA8BA,MAAM,EAAY,EAAe,EAAM,CAEjC,EAAqB,IAClB,CACL,kBAAoB,GAClB,EAAM,EAAK,CACR,OAAO,EAAQ,CACf,OAAO,iBAAiB,CACxB,QAAQ,KAAO,GAAQ,EAAI,aAAa,CAAC,CAC9C,gBAAkB,GAChB,EAAM,EAAK,CAAC,OAAO,EAAQ,CAAC,OAAO,mBAAmB,CACxD,iBAAkB,QACnB,EAuBG,GACJ,EACA,EACA,IACG,CACH,IAAM,EAAQ,EAAU,QAAQ,EAAM,EAAI,EAAM,MAC1C,EAAQ,EAAU,QAAQ,EAAM,EAAI,EAAM,MAC1C,EAAM,EAAU,MAAM,EAAM,EAAI,EAAM,IACtC,EAAgB,CAAC,EAAM,QAAU,GAAS,EAMhD,MAJI,CAAC,GAAS,CAAC,EACN,KAIP,EAAC,MAAD,CAAA,SAAA,CACG,EACC,EAAC,MAAD,CAAA,SAAA,CACG,EAAM,EAAM,CAAC,OAAO,EAAQ,CAAC,OAAO,QAAQ,CAAC,KAAG,IAChD,EAAM,EAAI,CAAC,OAAO,EAAQ,CAAC,OAAO,QAAQ,CACvC,CAAA,CAAA,CACJ,KACH,EAAQ,EAAC,SAAD,CAAA,SAAS,EAAe,CAAA,CAAG,KAChC,CAAA,CAAA,EAIGA,GAAY,CACvB,aACA,UAAU,KACV,cAAc,QACd,aACA,kBACA,UACA,SACA,kBACA,OACA,GAAG,KACgB,CACnB,GAAM,CAAC,EAAc,GAAmB,EACtC,GAAQ,GAAe,QACxB,CACK,EAAc,GAAQ,EACtB,EACJ,IAAgB,SAAW,IAAgB,QAAU,IAAgB,MACjE,EAAsB,GACvB,CAAE,QAAO,YAAW,cAA0C,CAC7D,IAAM,EAAQ,EAAuB,EAAO,EAAW,EAAQ,CAM/D,MAJI,CAAC,GAAY,CAAC,EACT,GAAY,KAInB,EAAC,EAAD,CAAgB,QAAO,SAAS,MAAM,UAAA,GACnC,WACO,CAAA,EAGd,IAAA,GACE,EACJ,CAAC,IACC,GAAY,cAAgB,IAC5B,IAAoB,IAAA,GAClB,KACA,EACA,EAAgB,CACpB,GAAG,EAAkB,EAAQ,CAC7B,GAAI,GAAW,EAAE,CAClB,CACK,EACJ,GAAuB,GAAY,aAC/B,CACE,GAAG,EACH,aAAc,GAAY,cAAgB,EAC3C,CACD,EAwBN,OACE,EAACC,EAAD,CACE,UAAW,EACT,GAAY,UAAY,GAAU,CAClC,GAAY,MAAQ,GAAc,CAClC,GAAY,SAAW,GAAiB,CACxC,GAAY,OAAS,GAAe,CACpC,GAAY,QAAU,GAAgB,CACtC,GAAY,UAAY,GAAkB,CAC1C,GAAY,OAAS,GAAe,CACrC,CACU,YACF,UACI,cACb,iBA3BF,EACA,EACA,EACA,IACG,CACH,IAAM,EAAc,IAAkB,EAAO,EAAO,EAAK,EAAW,CAEpE,MAAO,CACL,GAAG,EACH,UAAW,EAAG,GAAY,MAAO,GAAe,CAAE,GAAa,UAAU,CAC1E,EAkBC,QAAS,EACT,OAtCgB,GAA2B,CACzC,IAAS,IAAA,IACX,EAAgB,EAAS,CAG3B,IAAS,EAAS,EAkChB,WAAY,EACZ,gBAAiB,EACX,OACN,GAAI,EACJ,CAAA"}

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

@@ -1,5 +1,4 @@
 import { TableClassNames, TableProps } from "../table/TableRoot.mjs";
-import "../table/Table.mjs";
 import { DataTableBulkBarClassNames } from "./DataTableBulkBar.mjs";
 import { DataTableSlots } from "./DataTableSlotRow.mjs";
 import { DataTableLabels } from "./useDataTableContext.mjs";

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

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

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

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

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

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

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

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

package/dist/components/data-display/datatables/DataTableBulkBar.d.mts

@@ -1,4 +1,3 @@
-import "./DataTable.mjs";
 import { ReactNode } from "react";
 
 //#region src/components/data-display/datatables/DataTableBulkBar.d.ts

package/dist/components/data-display/datatables/DataTableBulkBar.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"DataTableBulkBar.d.mts","names":[],"sources":["../../../../src/components/data-display/datatables/DataTableBulkBar.tsx"],"mappings":";;;;KAyBY,0BAAA;EACV,IAAA;EACA,KAAA;EACA,UAAA;EACA,OAAA;EACA,UAAA;EACA,cAAA;AAAA"}
+{"version":3,"file":"DataTableBulkBar.d.mts","names":[],"sources":["../../../../src/components/data-display/datatables/DataTableBulkBar.tsx"],"mappings":";;;KAyBY,0BAAA;EACV,IAAA;EACA,KAAA;EACA,UAAA;EACA,OAAA;EACA,UAAA;EACA,cAAA;AAAA"}

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

@@ -1 +1 @@
-{"version":3,"file":"DataTableBulkBar.mjs","names":[],"sources":["../../../../src/components/data-display/datatables/DataTableBulkBar.tsx"],"sourcesContent":["import { type ReactNode, useState } from 'react';\n\nimport {\n  DndContext,\n  type DragEndEvent,\n  type Modifier,\n  useDraggable,\n} from '@dnd-kit/core';\nimport {\n  dataTableBulkBar,\n  dataTableBulkBarActions,\n  dataTableBulkBarCount,\n  dataTableBulkBarCountBadge,\n  dataTableBulkBarDragHandle,\n  dataTableBulkBarDragHandleIcon,\n} from '@mage-ui/styled-system/recipes';\nimport { Badge } from '@/components/data-display/badge/Badge';\nimport { Icon } from '@/components/data-display/icons/icon/Icon';\n\nimport type { DataTableSelectionConfig } from './DataTable';\nimport {\n  type DataTableLabels,\n  useDataTableContext,\n} from './useDataTableContext';\n\nexport type DataTableBulkBarClassNames = {\n  root?: string;\n  count?: string;\n  countBadge?: string;\n  actions?: string;\n  dragHandle?: string;\n  dragHandleIcon?: string;\n};\n\ntype DataTableBulkBarProps<Data> = {\n  selectedIds: string[];\n  className?: DataTableBulkBarClassNames;\n  selection?: DataTableSelectionConfig<Data>;\n  isDraggable?: boolean;\n};\n\ntype DataTableBulkBarContentProps<Data> = DataTableBulkBarProps<Data> & {\n  labels: DataTableLabels;\n};\n\nconst createRestrictModifier =\n  (coords: { x: number; y: number }): Modifier =>\n  ({ transform, activeNodeRect, containerNodeRect }) => {\n    if (!activeNodeRect || !containerNodeRect) {\n      return transform;\n    }\n\n    const adjustedRect = {\n      ...activeNodeRect,\n      left: activeNodeRect.left - activeNodeRect.width / 2 + coords.x,\n      right: activeNodeRect.right - activeNodeRect.width / 2 + coords.x,\n      top: activeNodeRect.top - activeNodeRect.height / 2 + coords.y,\n      bottom: activeNodeRect.bottom - activeNodeRect.height / 2 + coords.y,\n    };\n\n    return {\n      ...transform,\n      x: Math.max(\n        containerNodeRect.left - adjustedRect.left,\n        Math.min(containerNodeRect.right - adjustedRect.right, transform.x),\n      ),\n      y: Math.max(\n        containerNodeRect.top - adjustedRect.top,\n        Math.min(containerNodeRect.bottom - adjustedRect.bottom, transform.y),\n      ),\n    };\n  };\n\nconst DataTableBulkBarStatic = <Data,>({\n  selectedIds,\n  className,\n  selection,\n  labels,\n}: DataTableBulkBarContentProps<Data>) => {\n  return (\n    <div\n      className={className?.root ?? dataTableBulkBar()}\n      data-draggable={false}\n    >\n      <span className={className?.count ?? dataTableBulkBarCount()}>\n        {labels.selectedCount(\n          <Badge classNames={{ badge: dataTableBulkBarCountBadge() }}>\n            {selectedIds.length}\n          </Badge>,\n        )}\n      </span>\n      <div className={className?.actions ?? dataTableBulkBarActions()}>\n        {selection?.bulkActions?.(selectedIds)}\n      </div>\n    </div>\n  );\n};\n\ntype DraggableBulkBarWrapperProps<Data> = DataTableBulkBarProps<Data> & {\n  coordinates: { x: number; y: number };\n  labels: DataTableLabels;\n};\n\nconst DraggableBulkBarWrapper = <Data,>({\n  coordinates,\n  selectedIds,\n  className,\n  selection,\n  labels,\n}: DraggableBulkBarWrapperProps<Data>) => {\n  const { attributes, listeners, setNodeRef, isDragging, transform } =\n    useDraggable({\n      id: 'data-table-bulk-bar',\n    });\n\n  const style = transform\n    ? {\n        transform: `translate(calc(-50% + ${coordinates.x + transform.x}px), calc(-50% + ${coordinates.y + transform.y}px))`,\n      }\n    : {\n        transform: `translate(calc(-50% + ${coordinates.x}px), calc(-50% + ${coordinates.y}px))`,\n      };\n\n  return (\n    <div\n      ref={setNodeRef}\n      style={style}\n      className={className?.root ?? dataTableBulkBar()}\n      data-draggable={true}\n      data-is-dragging={isDragging}\n    >\n      <span\n        {...attributes}\n        {...listeners}\n        className={className?.dragHandle ?? dataTableBulkBarDragHandle()}\n        data-is-dragging={isDragging}\n        aria-hidden='true'\n      >\n        <Icon\n          name='mage-bulk-actions-dots-grid-2'\n          path='/icons/sprite-mage.svg'\n          classNames={{ icon: dataTableBulkBarDragHandleIcon() }}\n        />\n      </span>\n      <span className={className?.count ?? dataTableBulkBarCount()}>\n        {labels.selectedCount(\n          <Badge classNames={{ badge: dataTableBulkBarCountBadge() }}>\n            {selectedIds.length}\n          </Badge>,\n        )}\n      </span>\n      <div className={className?.actions ?? dataTableBulkBarActions()}>\n        {selection?.bulkActions?.(selectedIds)}\n      </div>\n    </div>\n  );\n};\n\nexport const DataTableBulkBar = <Data,>({\n  selectedIds,\n  className,\n  selection,\n  isDraggable = true,\n}: DataTableBulkBarProps<Data>): ReactNode => {\n  const { labels } = useDataTableContext();\n  const [coordinates, setCoordinates] = useState({ x: 0, y: 0 });\n\n  if (!selection?.bulkActions || selectedIds.length === 0) {\n    return null;\n  }\n\n  const handleDragEnd = (event: DragEndEvent) => {\n    const { delta } = event;\n    setCoordinates((prev) => ({\n      x: prev.x + delta.x,\n      y: prev.y + delta.y,\n    }));\n  };\n\n  if (!isDraggable) {\n    return (\n      <DataTableBulkBarStatic\n        selectedIds={selectedIds}\n        className={className}\n        selection={selection}\n        isDraggable={false}\n        labels={labels}\n      />\n    );\n  }\n\n  return (\n    <DndContext\n      onDragEnd={handleDragEnd}\n      modifiers={[createRestrictModifier(coordinates)]}\n    >\n      <DraggableBulkBarWrapper\n        coordinates={coordinates}\n        selectedIds={selectedIds}\n        className={className}\n        selection={selection}\n        labels={labels}\n      />\n    </DndContext>\n  );\n};\n"],"mappings":"ugBA6CA,MAAM,EACH,IACA,CAAE,YAAW,iBAAgB,uBAAwB,CACpD,GAAI,CAAC,GAAkB,CAAC,EACtB,OAAO,EAGT,IAAM,EAAe,CACnB,GAAG,EACH,KAAM,EAAe,KAAO,EAAe,MAAQ,EAAI,EAAO,EAC9D,MAAO,EAAe,MAAQ,EAAe,MAAQ,EAAI,EAAO,EAChE,IAAK,EAAe,IAAM,EAAe,OAAS,EAAI,EAAO,EAC7D,OAAQ,EAAe,OAAS,EAAe,OAAS,EAAI,EAAO,EACpE,CAED,MAAO,CACL,GAAG,EACH,EAAG,KAAK,IACN,EAAkB,KAAO,EAAa,KACtC,KAAK,IAAI,EAAkB,MAAQ,EAAa,MAAO,EAAU,EAAE,CACpE,CACD,EAAG,KAAK,IACN,EAAkB,IAAM,EAAa,IACrC,KAAK,IAAI,EAAkB,OAAS,EAAa,OAAQ,EAAU,EAAE,CACtE,CACF,EAGC,GAAiC,CACrC,cACA,YACA,YACA,YAGE,EAAC,MAAA,CACC,UAAW,GAAW,MAAQ,GAAkB,CAChD,iBAAgB,aAEhB,EAAC,OAAA,CAAK,UAAW,GAAW,OAAS,GAAuB,UACzD,EAAO,cACN,EAAC,EAAA,CAAM,WAAY,CAAE,MAAO,GAA4B,CAAE,UACvD,EAAY,QACP,CACT,EACI,CACP,EAAC,MAAA,CAAI,UAAW,GAAW,SAAW,GAAyB,UAC5D,GAAW,cAAc,EAAY,EAClC,CAAA,EACF,CASJ,GAAkC,CACtC,cACA,cACA,YACA,YACA,YACwC,CACxC,GAAM,CAAE,aAAY,YAAW,aAAY,aAAY,aACrD,EAAa,CACX,GAAI,sBACL,CAAC,CAUJ,OACE,EAAC,MAAA,CACC,IAAK,EACL,MAXU,EACV,CACE,UAAW,yBAAyB,EAAY,EAAI,EAAU,EAAE,mBAAmB,EAAY,EAAI,EAAU,EAAE,MAChH,CACD,CACE,UAAW,yBAAyB,EAAY,EAAE,mBAAmB,EAAY,EAAE,MACpF,CAMD,UAAW,GAAW,MAAQ,GAAkB,CAChD,iBAAgB,GAChB,mBAAkB,YAElB,EAAC,OAAA,CACC,GAAI,EACJ,GAAI,EACJ,UAAW,GAAW,YAAc,GAA4B,CAChE,mBAAkB,EAClB,cAAY,gBAEZ,EAAC,EAAA,CACC,KAAK,gCACL,KAAK,yBACL,WAAY,CAAE,KAAM,GAAgC,CAAE,EACtD,EACG,CACP,EAAC,OAAA,CAAK,UAAW,GAAW,OAAS,GAAuB,UACzD,EAAO,cACN,EAAC,EAAA,CAAM,WAAY,CAAE,MAAO,GAA4B,CAAE,UACvD,EAAY,QACP,CACT,EACI,CACP,EAAC,MAAA,CAAI,UAAW,GAAW,SAAW,GAAyB,UAC5D,GAAW,cAAc,EAAY,EAClC,GACF,EAIG,GAA2B,CACtC,cACA,YACA,YACA,cAAc,MAC8B,CAC5C,GAAM,CAAE,UAAW,GAAqB,CAClC,CAAC,EAAa,GAAkB,EAAS,CAAE,EAAG,EAAG,EAAG,EAAG,CAAC,CA0B9D,MAxBI,CAAC,GAAW,aAAe,EAAY,SAAW,EAC7C,KAWJ,EAaH,EAAC,EAAA,CACC,UAtBmB,GAAwB,CAC7C,GAAM,CAAE,SAAU,EAClB,EAAgB,IAAU,CACxB,EAAG,EAAK,EAAI,EAAM,EAClB,EAAG,EAAK,EAAI,EAAM,EACnB,EAAE,EAkBD,UAAW,CAAC,EAAuB,EAAY,CAAC,UAEhD,EAAC,EAAA,CACc,cACA,cACF,YACA,YACH,UACR,EACS,CAtBX,EAAC,EAAA,CACc,cACF,YACA,YACX,YAAa,GACL,UACR"}
+{"version":3,"file":"DataTableBulkBar.mjs","names":[],"sources":["../../../../src/components/data-display/datatables/DataTableBulkBar.tsx"],"sourcesContent":["import { type ReactNode, useState } from 'react';\n\nimport {\n  DndContext,\n  type DragEndEvent,\n  type Modifier,\n  useDraggable,\n} from '@dnd-kit/core';\nimport {\n  dataTableBulkBar,\n  dataTableBulkBarActions,\n  dataTableBulkBarCount,\n  dataTableBulkBarCountBadge,\n  dataTableBulkBarDragHandle,\n  dataTableBulkBarDragHandleIcon,\n} from '@mage-ui/styled-system/recipes';\nimport { Badge } from '@/components/data-display/badge/Badge';\nimport { Icon } from '@/components/data-display/icons/icon/Icon';\n\nimport type { DataTableSelectionConfig } from './DataTable';\nimport {\n  type DataTableLabels,\n  useDataTableContext,\n} from './useDataTableContext';\n\nexport type DataTableBulkBarClassNames = {\n  root?: string;\n  count?: string;\n  countBadge?: string;\n  actions?: string;\n  dragHandle?: string;\n  dragHandleIcon?: string;\n};\n\ntype DataTableBulkBarProps<Data> = {\n  selectedIds: string[];\n  className?: DataTableBulkBarClassNames;\n  selection?: DataTableSelectionConfig<Data>;\n  isDraggable?: boolean;\n};\n\ntype DataTableBulkBarContentProps<Data> = DataTableBulkBarProps<Data> & {\n  labels: DataTableLabels;\n};\n\nconst createRestrictModifier =\n  (coords: { x: number; y: number }): Modifier =>\n  ({ transform, activeNodeRect, containerNodeRect }) => {\n    if (!activeNodeRect || !containerNodeRect) {\n      return transform;\n    }\n\n    const adjustedRect = {\n      ...activeNodeRect,\n      left: activeNodeRect.left - activeNodeRect.width / 2 + coords.x,\n      right: activeNodeRect.right - activeNodeRect.width / 2 + coords.x,\n      top: activeNodeRect.top - activeNodeRect.height / 2 + coords.y,\n      bottom: activeNodeRect.bottom - activeNodeRect.height / 2 + coords.y,\n    };\n\n    return {\n      ...transform,\n      x: Math.max(\n        containerNodeRect.left - adjustedRect.left,\n        Math.min(containerNodeRect.right - adjustedRect.right, transform.x),\n      ),\n      y: Math.max(\n        containerNodeRect.top - adjustedRect.top,\n        Math.min(containerNodeRect.bottom - adjustedRect.bottom, transform.y),\n      ),\n    };\n  };\n\nconst DataTableBulkBarStatic = <Data,>({\n  selectedIds,\n  className,\n  selection,\n  labels,\n}: DataTableBulkBarContentProps<Data>) => {\n  return (\n    <div\n      className={className?.root ?? dataTableBulkBar()}\n      data-draggable={false}\n    >\n      <span className={className?.count ?? dataTableBulkBarCount()}>\n        {labels.selectedCount(\n          <Badge classNames={{ badge: dataTableBulkBarCountBadge() }}>\n            {selectedIds.length}\n          </Badge>,\n        )}\n      </span>\n      <div className={className?.actions ?? dataTableBulkBarActions()}>\n        {selection?.bulkActions?.(selectedIds)}\n      </div>\n    </div>\n  );\n};\n\ntype DraggableBulkBarWrapperProps<Data> = DataTableBulkBarProps<Data> & {\n  coordinates: { x: number; y: number };\n  labels: DataTableLabels;\n};\n\nconst DraggableBulkBarWrapper = <Data,>({\n  coordinates,\n  selectedIds,\n  className,\n  selection,\n  labels,\n}: DraggableBulkBarWrapperProps<Data>) => {\n  const { attributes, listeners, setNodeRef, isDragging, transform } =\n    useDraggable({\n      id: 'data-table-bulk-bar',\n    });\n\n  const style = transform\n    ? {\n        transform: `translate(calc(-50% + ${coordinates.x + transform.x}px), calc(-50% + ${coordinates.y + transform.y}px))`,\n      }\n    : {\n        transform: `translate(calc(-50% + ${coordinates.x}px), calc(-50% + ${coordinates.y}px))`,\n      };\n\n  return (\n    <div\n      ref={setNodeRef}\n      style={style}\n      className={className?.root ?? dataTableBulkBar()}\n      data-draggable={true}\n      data-is-dragging={isDragging}\n    >\n      <span\n        {...attributes}\n        {...listeners}\n        className={className?.dragHandle ?? dataTableBulkBarDragHandle()}\n        data-is-dragging={isDragging}\n        aria-hidden='true'\n      >\n        <Icon\n          name='mage-bulk-actions-dots-grid-2'\n          path='/icons/sprite-mage.svg'\n          classNames={{ icon: dataTableBulkBarDragHandleIcon() }}\n        />\n      </span>\n      <span className={className?.count ?? dataTableBulkBarCount()}>\n        {labels.selectedCount(\n          <Badge classNames={{ badge: dataTableBulkBarCountBadge() }}>\n            {selectedIds.length}\n          </Badge>,\n        )}\n      </span>\n      <div className={className?.actions ?? dataTableBulkBarActions()}>\n        {selection?.bulkActions?.(selectedIds)}\n      </div>\n    </div>\n  );\n};\n\nexport const DataTableBulkBar = <Data,>({\n  selectedIds,\n  className,\n  selection,\n  isDraggable = true,\n}: DataTableBulkBarProps<Data>): ReactNode => {\n  const { labels } = useDataTableContext();\n  const [coordinates, setCoordinates] = useState({ x: 0, y: 0 });\n\n  if (!selection?.bulkActions || selectedIds.length === 0) {\n    return null;\n  }\n\n  const handleDragEnd = (event: DragEndEvent) => {\n    const { delta } = event;\n    setCoordinates((prev) => ({\n      x: prev.x + delta.x,\n      y: prev.y + delta.y,\n    }));\n  };\n\n  if (!isDraggable) {\n    return (\n      <DataTableBulkBarStatic\n        selectedIds={selectedIds}\n        className={className}\n        selection={selection}\n        isDraggable={false}\n        labels={labels}\n      />\n    );\n  }\n\n  return (\n    <DndContext\n      onDragEnd={handleDragEnd}\n      modifiers={[createRestrictModifier(coordinates)]}\n    >\n      <DraggableBulkBarWrapper\n        coordinates={coordinates}\n        selectedIds={selectedIds}\n        className={className}\n        selection={selection}\n        labels={labels}\n      />\n    </DndContext>\n  );\n};\n"],"mappings":"ugBA6CA,MAAM,EACH,IACA,CAAE,YAAW,iBAAgB,uBAAwB,CACpD,GAAI,CAAC,GAAkB,CAAC,EACtB,OAAO,EAGT,IAAM,EAAe,CACnB,GAAG,EACH,KAAM,EAAe,KAAO,EAAe,MAAQ,EAAI,EAAO,EAC9D,MAAO,EAAe,MAAQ,EAAe,MAAQ,EAAI,EAAO,EAChE,IAAK,EAAe,IAAM,EAAe,OAAS,EAAI,EAAO,EAC7D,OAAQ,EAAe,OAAS,EAAe,OAAS,EAAI,EAAO,EACpE,CAED,MAAO,CACL,GAAG,EACH,EAAG,KAAK,IACN,EAAkB,KAAO,EAAa,KACtC,KAAK,IAAI,EAAkB,MAAQ,EAAa,MAAO,EAAU,EAAE,CACpE,CACD,EAAG,KAAK,IACN,EAAkB,IAAM,EAAa,IACrC,KAAK,IAAI,EAAkB,OAAS,EAAa,OAAQ,EAAU,EAAE,CACtE,CACF,EAGC,GAAiC,CACrC,cACA,YACA,YACA,YAGE,EAAC,MAAD,CACE,UAAW,GAAW,MAAQ,GAAkB,CAChD,iBAAgB,YAFlB,CAIE,EAAC,OAAD,CAAM,UAAW,GAAW,OAAS,GAAuB,UACzD,EAAO,cACN,EAAC,EAAD,CAAO,WAAY,CAAE,MAAO,GAA4B,CAAE,UACvD,EAAY,OACP,CAAA,CACT,CACI,CAAA,CACP,EAAC,MAAD,CAAK,UAAW,GAAW,SAAW,GAAyB,UAC5D,GAAW,cAAc,EAAY,CAClC,CAAA,CACF,GASJ,GAAkC,CACtC,cACA,cACA,YACA,YACA,YACwC,CACxC,GAAM,CAAE,aAAY,YAAW,aAAY,aAAY,aACrD,EAAa,CACX,GAAI,sBACL,CAAC,CAUJ,OACE,EAAC,MAAD,CACE,IAAK,EACL,MAXU,EACV,CACE,UAAW,yBAAyB,EAAY,EAAI,EAAU,EAAE,mBAAmB,EAAY,EAAI,EAAU,EAAE,MAChH,CACD,CACE,UAAW,yBAAyB,EAAY,EAAE,mBAAmB,EAAY,EAAE,MACpF,CAMD,UAAW,GAAW,MAAQ,GAAkB,CAChD,iBAAgB,GAChB,mBAAkB,WALpB,CAOE,EAAC,OAAD,CACE,GAAI,EACJ,GAAI,EACJ,UAAW,GAAW,YAAc,GAA4B,CAChE,mBAAkB,EAClB,cAAY,gBAEZ,EAAC,EAAD,CACE,KAAK,gCACL,KAAK,yBACL,WAAY,CAAE,KAAM,GAAgC,CAAE,CACtD,CAAA,CACG,CAAA,CACP,EAAC,OAAD,CAAM,UAAW,GAAW,OAAS,GAAuB,UACzD,EAAO,cACN,EAAC,EAAD,CAAO,WAAY,CAAE,MAAO,GAA4B,CAAE,UACvD,EAAY,OACP,CAAA,CACT,CACI,CAAA,CACP,EAAC,MAAD,CAAK,UAAW,GAAW,SAAW,GAAyB,UAC5D,GAAW,cAAc,EAAY,CAClC,CAAA,CACF,IAIG,GAA2B,CACtC,cACA,YACA,YACA,cAAc,MAC8B,CAC5C,GAAM,CAAE,UAAW,GAAqB,CAClC,CAAC,EAAa,GAAkB,EAAS,CAAE,EAAG,EAAG,EAAG,EAAG,CAAC,CA0B9D,MAxBI,CAAC,GAAW,aAAe,EAAY,SAAW,EAC7C,KAWJ,EAaH,EAAC,EAAD,CACE,UAtBmB,GAAwB,CAC7C,GAAM,CAAE,SAAU,EAClB,EAAgB,IAAU,CACxB,EAAG,EAAK,EAAI,EAAM,EAClB,EAAG,EAAK,EAAI,EAAM,EACnB,EAAE,EAkBD,UAAW,CAAC,EAAuB,EAAY,CAAC,UAEhD,EAAC,EAAD,CACe,cACA,cACF,YACA,YACH,SACR,CAAA,CACS,CAAA,CAtBX,EAAC,EAAD,CACe,cACF,YACA,YACX,YAAa,GACL,SACR,CAAA"}

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

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

package/dist/components/data-display/datatables/DataTableErrorState.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"DataTableErrorState.mjs","names":[],"sources":["../../../../src/components/data-display/datatables/DataTableErrorState.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { css } from '@mage-ui/styled-system/css';\n\ntype DataTableErrorStateProps = {\n  className?: string;\n  errorMessage?: string;\n};\n\nexport const DataTableErrorState = ({\n  className,\n  errorMessage = 'Error al cargar los datos. Por favor, reintenta más tarde.',\n}: DataTableErrorStateProps): ReactNode => {\n  return (\n    <div\n      className={\n        className ??\n        css({\n          color: 'red.500',\n          textAlign: 'center',\n          padding: '4',\n        })\n      }\n    >\n      {errorMessage}\n    </div>\n  );\n};\n"],"mappings":"yFASA,MAAa,GAAuB,CAClC,YACA,eAAe,gEAGb,EAAC,MAAA,CACC,UACE,GACA,EAAI,CACF,MAAO,UACP,UAAW,SACX,QAAS,IACV,CAAC,UAGH,GACG"}
+{"version":3,"file":"DataTableErrorState.mjs","names":[],"sources":["../../../../src/components/data-display/datatables/DataTableErrorState.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { css } from '@mage-ui/styled-system/css';\n\ntype DataTableErrorStateProps = {\n  className?: string;\n  errorMessage?: string;\n};\n\nexport const DataTableErrorState = ({\n  className,\n  errorMessage = 'Error al cargar los datos. Por favor, reintenta más tarde.',\n}: DataTableErrorStateProps): ReactNode => {\n  return (\n    <div\n      className={\n        className ??\n        css({\n          color: 'red.500',\n          textAlign: 'center',\n          padding: '4',\n        })\n      }\n    >\n      {errorMessage}\n    </div>\n  );\n};\n"],"mappings":"yFASA,MAAa,GAAuB,CAClC,YACA,eAAe,gEAGb,EAAC,MAAD,CACE,UACE,GACA,EAAI,CACF,MAAO,UACP,UAAW,SACX,QAAS,IACV,CAAC,UAGH,EACG,CAAA"}

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

@@ -1 +1 @@
-{"version":3,"file":"DataTableHeader.mjs","names":[],"sources":["../../../../src/components/data-display/datatables/DataTableHeader.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n  dataTableHeader,\n  dataTableLoading,\n  dataTableSortButton,\n  dataTableSortButtonIndicator,\n} from '@mage-ui/styled-system/recipes';\nimport {\n  flexRender,\n  type Header,\n  type HeaderGroup,\n} from '@tanstack/react-table';\nimport { Button } from '@/components/buttons';\n\nimport { VisuallyHidden } from '../../misc/visually-hidden/VisuallyHidden';\nimport { Icon } from '../icons/icon/Icon';\nimport { Table } from '../table/Table';\nimport type { DataTableClassNames, DataTableColumnMeta } from './DataTable';\nimport { useDataTableContext } from './useDataTableContext';\n\ntype DataTableHeaderProps<Data> = {\n  headerGroups: HeaderGroup<Data>[];\n  totalSize: number;\n  loading?: boolean;\n  classNames?: Pick<DataTableClassNames, 'header' | 'loading' | 'sortButton'>;\n};\n\nconst getAriaSort = (sorted: false | 'asc' | 'desc') => {\n  if (sorted === 'asc') return 'ascending';\n  if (sorted === 'desc') return 'descending';\n  return 'none';\n};\n\nconst SortIndicator = ({\n  sorted,\n  className,\n}: {\n  sorted: false | 'asc' | 'desc';\n  className?: string;\n}) => (\n  <Icon\n    path='/icons/sprite-mage.svg'\n    name={\n      sorted === 'asc'\n        ? 'mage-datatable-sort-arrow-narrow-up'\n        : sorted === 'desc'\n          ? 'mage-datatable-sort-arrow-narrow-down'\n          : 'mage-datatable-sort-switch-vertical-02'\n    }\n    classNames={{\n      icon: className ?? dataTableSortButtonIndicator(),\n    }}\n  />\n);\n\nconst SortButton = <Data,>({\n  header,\n  className,\n}: {\n  header: Header<Data, unknown>;\n  className?: string;\n}): ReactNode => {\n  const { labels } = useDataTableContext();\n  const sorted = header.column.getIsSorted();\n\n  const getSortStatusText = () => {\n    if (sorted === 'asc') return labels.sortedAscending;\n    if (sorted === 'desc') return labels.sortedDescending;\n    return labels.activateToSort;\n  };\n\n  return (\n    <Button\n      classNames={{\n        button: cx(className ?? dataTableSortButton(), 'group'),\n      }}\n      onClick={header.column.getToggleSortingHandler()}\n      endSlot={<SortIndicator sorted={sorted} />}\n    >\n      {flexRender(header.column.columnDef.header, header.getContext())}\n      <VisuallyHidden>{getSortStatusText()}</VisuallyHidden>\n    </Button>\n  );\n};\n\nconst HeaderCellContent = <Data,>({\n  header,\n  sortButtonClassName,\n}: {\n  header: Header<Data, unknown>;\n  sortButtonClassName?: string;\n}): ReactNode => {\n  if (header.isPlaceholder) return null;\n\n  if (header.column.getCanSort()) {\n    return <SortButton header={header} className={sortButtonClassName} />;\n  }\n\n  return flexRender(header.column.columnDef.header, header.getContext());\n};\n\nconst HeaderCell = <Data,>({\n  header,\n  totalSize,\n  classNames,\n}: {\n  header: Header<Data, unknown>;\n  totalSize: number;\n  classNames?: Pick<DataTableClassNames, 'sortButton'>;\n}): ReactNode => {\n  const canSort = header.column.getCanSort();\n  const sorted = header.column.getIsSorted();\n  const columnMeta = header.column.columnDef.meta as\n    | DataTableColumnMeta\n    | undefined;\n  const width =\n    totalSize > 0 && header.column.columnDef.size !== 150\n      ? `${(header.getSize() / totalSize) * 100}%`\n      : undefined;\n\n  return (\n    <Table.HeaderCell\n      classNames={\n        columnMeta?.classNames?.header\n          ? { th: columnMeta.classNames.header }\n          : undefined\n      }\n      scope='col'\n      style={{ width }}\n      aria-sort={canSort ? getAriaSort(sorted) : undefined}\n      data-sortable={canSort || undefined}\n      data-sort={(sorted || undefined) as string | undefined}\n    >\n      <HeaderCellContent\n        header={header}\n        sortButtonClassName={classNames?.sortButton}\n      />\n    </Table.HeaderCell>\n  );\n};\n\nexport const DataTableHeader = <Data,>({\n  headerGroups,\n  totalSize,\n  loading,\n  classNames,\n}: DataTableHeaderProps<Data>): ReactNode => (\n  <Table.Head\n    classNames={{\n      thead: cx(\n        classNames?.header ?? dataTableHeader(),\n        loading ? (classNames?.loading ?? dataTableLoading()) : undefined,\n      ),\n    }}\n    data-loading={loading || undefined}\n  >\n    {headerGroups.map((headerGroup) => (\n      <Table.Row key={headerGroup.id}>\n        {headerGroup.headers.map((header) => (\n          <HeaderCell\n            key={header.id}\n            header={header}\n            totalSize={totalSize}\n            classNames={classNames}\n          />\n        ))}\n      </Table.Row>\n    ))}\n  </Table.Head>\n);\n"],"mappings":"wkBA6BA,MAAM,EAAe,GACf,IAAW,MAAc,YACzB,IAAW,OAAe,aACvB,OAGH,GAAiB,CACrB,SACA,eAKA,EAAC,EAAA,CACC,KAAK,yBACL,KACE,IAAW,MACP,sCACA,IAAW,OACT,wCACA,yCAER,WAAY,CACV,KAAM,GAAa,GAA8B,CAClD,EACD,CAGE,GAAqB,CACzB,SACA,eAIe,CACf,GAAM,CAAE,UAAW,GAAqB,CAClC,EAAS,EAAO,OAAO,aAAa,CAQ1C,OACE,EAAC,EAAA,CACC,WAAY,CACV,OAAQ,EAAG,GAAa,GAAqB,CAAE,QAAQ,CACxD,CACD,QAAS,EAAO,OAAO,yBAAyB,CAChD,QAAS,EAAC,EAAA,CAAsB,SAAA,CAAU,WAEzC,EAAW,EAAO,OAAO,UAAU,OAAQ,EAAO,YAAY,CAAC,CAChE,EAAC,EAAA,CAAA,SAdC,IAAW,MAAc,EAAO,gBAChC,IAAW,OAAe,EAAO,iBAC9B,EAAO,eAYwB,CAAkB,CAAA,EAC/C,EAIP,GAA4B,CAChC,SACA,yBAKI,EAAO,cAAsB,KAE7B,EAAO,OAAO,YAAY,CACrB,EAAC,EAAA,CAAmB,SAAQ,UAAW,GAAuB,CAGhE,EAAW,EAAO,OAAO,UAAU,OAAQ,EAAO,YAAY,CAAC,CAGlE,GAAqB,CACzB,SACA,YACA,gBAKe,CACf,IAAM,EAAU,EAAO,OAAO,YAAY,CACpC,EAAS,EAAO,OAAO,aAAa,CACpC,EAAa,EAAO,OAAO,UAAU,KAGrC,EACJ,EAAY,GAAK,EAAO,OAAO,UAAU,OAAS,IAC9C,GAAI,EAAO,SAAS,CAAG,EAAa,IAAI,GACxC,IAAA,GAEN,OACE,EAAC,EAAM,WAAA,CACL,WACE,GAAY,YAAY,OACpB,CAAE,GAAI,EAAW,WAAW,OAAQ,CACpC,IAAA,GAEN,MAAM,MACN,MAAO,CAAE,QAAO,CAChB,YAAW,EAAU,EAAY,EAAO,CAAG,IAAA,GAC3C,gBAAe,GAAW,IAAA,GAC1B,YAAY,GAAU,IAAA,YAEtB,EAAC,EAAA,CACS,SACR,oBAAqB,GAAY,YACjC,EACe,EAIV,GAA0B,CACrC,eACA,YACA,UACA,gBAEA,EAAC,EAAM,KAAA,CACL,WAAY,CACV,MAAO,EACL,GAAY,QAAU,GAAiB,CACvC,EAAW,GAAY,SAAW,GAAkB,CAAI,IAAA,GACzD,CACF,CACD,eAAc,GAAW,IAAA,YAExB,EAAa,IAAK,GACjB,EAAC,EAAM,IAAA,CAAA,SACJ,EAAY,QAAQ,IAAK,GACxB,EAAC,EAAA,CAES,SACG,YACC,cAHP,EAAO,GAIZ,CACF,CAAA,CARY,EAAY,GAShB,CACZ,EACS"}
+{"version":3,"file":"DataTableHeader.mjs","names":[],"sources":["../../../../src/components/data-display/datatables/DataTableHeader.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n  dataTableHeader,\n  dataTableLoading,\n  dataTableSortButton,\n  dataTableSortButtonIndicator,\n} from '@mage-ui/styled-system/recipes';\nimport {\n  flexRender,\n  type Header,\n  type HeaderGroup,\n} from '@tanstack/react-table';\nimport { Button } from '@/components/buttons';\n\nimport { VisuallyHidden } from '../../misc/visually-hidden/VisuallyHidden';\nimport { Icon } from '../icons/icon/Icon';\nimport { Table } from '../table/Table';\nimport type { DataTableClassNames, DataTableColumnMeta } from './DataTable';\nimport { useDataTableContext } from './useDataTableContext';\n\ntype DataTableHeaderProps<Data> = {\n  headerGroups: HeaderGroup<Data>[];\n  totalSize: number;\n  loading?: boolean;\n  classNames?: Pick<DataTableClassNames, 'header' | 'loading' | 'sortButton'>;\n};\n\nconst getAriaSort = (sorted: false | 'asc' | 'desc') => {\n  if (sorted === 'asc') return 'ascending';\n  if (sorted === 'desc') return 'descending';\n  return 'none';\n};\n\nconst SortIndicator = ({\n  sorted,\n  className,\n}: {\n  sorted: false | 'asc' | 'desc';\n  className?: string;\n}) => (\n  <Icon\n    path='/icons/sprite-mage.svg'\n    name={\n      sorted === 'asc'\n        ? 'mage-datatable-sort-arrow-narrow-up'\n        : sorted === 'desc'\n          ? 'mage-datatable-sort-arrow-narrow-down'\n          : 'mage-datatable-sort-switch-vertical-02'\n    }\n    classNames={{\n      icon: className ?? dataTableSortButtonIndicator(),\n    }}\n  />\n);\n\nconst SortButton = <Data,>({\n  header,\n  className,\n}: {\n  header: Header<Data, unknown>;\n  className?: string;\n}): ReactNode => {\n  const { labels } = useDataTableContext();\n  const sorted = header.column.getIsSorted();\n\n  const getSortStatusText = () => {\n    if (sorted === 'asc') return labels.sortedAscending;\n    if (sorted === 'desc') return labels.sortedDescending;\n    return labels.activateToSort;\n  };\n\n  return (\n    <Button\n      classNames={{\n        button: cx(className ?? dataTableSortButton(), 'group'),\n      }}\n      onClick={header.column.getToggleSortingHandler()}\n      endSlot={<SortIndicator sorted={sorted} />}\n    >\n      {flexRender(header.column.columnDef.header, header.getContext())}\n      <VisuallyHidden>{getSortStatusText()}</VisuallyHidden>\n    </Button>\n  );\n};\n\nconst HeaderCellContent = <Data,>({\n  header,\n  sortButtonClassName,\n}: {\n  header: Header<Data, unknown>;\n  sortButtonClassName?: string;\n}): ReactNode => {\n  if (header.isPlaceholder) return null;\n\n  if (header.column.getCanSort()) {\n    return <SortButton header={header} className={sortButtonClassName} />;\n  }\n\n  return flexRender(header.column.columnDef.header, header.getContext());\n};\n\nconst HeaderCell = <Data,>({\n  header,\n  totalSize,\n  classNames,\n}: {\n  header: Header<Data, unknown>;\n  totalSize: number;\n  classNames?: Pick<DataTableClassNames, 'sortButton'>;\n}): ReactNode => {\n  const canSort = header.column.getCanSort();\n  const sorted = header.column.getIsSorted();\n  const columnMeta = header.column.columnDef.meta as\n    | DataTableColumnMeta\n    | undefined;\n  const width =\n    totalSize > 0 && header.column.columnDef.size !== 150\n      ? `${(header.getSize() / totalSize) * 100}%`\n      : undefined;\n\n  return (\n    <Table.HeaderCell\n      classNames={\n        columnMeta?.classNames?.header\n          ? { th: columnMeta.classNames.header }\n          : undefined\n      }\n      scope='col'\n      style={{ width }}\n      aria-sort={canSort ? getAriaSort(sorted) : undefined}\n      data-sortable={canSort || undefined}\n      data-sort={(sorted || undefined) as string | undefined}\n    >\n      <HeaderCellContent\n        header={header}\n        sortButtonClassName={classNames?.sortButton}\n      />\n    </Table.HeaderCell>\n  );\n};\n\nexport const DataTableHeader = <Data,>({\n  headerGroups,\n  totalSize,\n  loading,\n  classNames,\n}: DataTableHeaderProps<Data>): ReactNode => (\n  <Table.Head\n    classNames={{\n      thead: cx(\n        classNames?.header ?? dataTableHeader(),\n        loading ? (classNames?.loading ?? dataTableLoading()) : undefined,\n      ),\n    }}\n    data-loading={loading || undefined}\n  >\n    {headerGroups.map((headerGroup) => (\n      <Table.Row key={headerGroup.id}>\n        {headerGroup.headers.map((header) => (\n          <HeaderCell\n            key={header.id}\n            header={header}\n            totalSize={totalSize}\n            classNames={classNames}\n          />\n        ))}\n      </Table.Row>\n    ))}\n  </Table.Head>\n);\n"],"mappings":"wkBA6BA,MAAM,EAAe,GACf,IAAW,MAAc,YACzB,IAAW,OAAe,aACvB,OAGH,GAAiB,CACrB,SACA,eAKA,EAAC,EAAD,CACE,KAAK,yBACL,KACE,IAAW,MACP,sCACA,IAAW,OACT,wCACA,yCAER,WAAY,CACV,KAAM,GAAa,GAA8B,CAClD,CACD,CAAA,CAGE,GAAqB,CACzB,SACA,eAIe,CACf,GAAM,CAAE,UAAW,GAAqB,CAClC,EAAS,EAAO,OAAO,aAAa,CAQ1C,OACE,EAAC,EAAD,CACE,WAAY,CACV,OAAQ,EAAG,GAAa,GAAqB,CAAE,QAAQ,CACxD,CACD,QAAS,EAAO,OAAO,yBAAyB,CAChD,QAAS,EAAC,EAAD,CAAuB,SAAU,CAAA,UAL5C,CAOG,EAAW,EAAO,OAAO,UAAU,OAAQ,EAAO,YAAY,CAAC,CAChE,EAAC,EAAD,CAAA,SAdE,IAAW,MAAc,EAAO,gBAChC,IAAW,OAAe,EAAO,iBAC9B,EAAO,eAY0C,CAAA,CAC/C,IAIP,GAA4B,CAChC,SACA,yBAKI,EAAO,cAAsB,KAE7B,EAAO,OAAO,YAAY,CACrB,EAAC,EAAD,CAAoB,SAAQ,UAAW,EAAuB,CAAA,CAGhE,EAAW,EAAO,OAAO,UAAU,OAAQ,EAAO,YAAY,CAAC,CAGlE,GAAqB,CACzB,SACA,YACA,gBAKe,CACf,IAAM,EAAU,EAAO,OAAO,YAAY,CACpC,EAAS,EAAO,OAAO,aAAa,CACpC,EAAa,EAAO,OAAO,UAAU,KAGrC,EACJ,EAAY,GAAK,EAAO,OAAO,UAAU,OAAS,IAC9C,GAAI,EAAO,SAAS,CAAG,EAAa,IAAI,GACxC,IAAA,GAEN,OACE,EAAC,EAAM,WAAP,CACE,WACE,GAAY,YAAY,OACpB,CAAE,GAAI,EAAW,WAAW,OAAQ,CACpC,IAAA,GAEN,MAAM,MACN,MAAO,CAAE,QAAO,CAChB,YAAW,EAAU,EAAY,EAAO,CAAG,IAAA,GAC3C,gBAAe,GAAW,IAAA,GAC1B,YAAY,GAAU,IAAA,YAEtB,EAAC,EAAD,CACU,SACR,oBAAqB,GAAY,WACjC,CAAA,CACe,CAAA,EAIV,GAA0B,CACrC,eACA,YACA,UACA,gBAEA,EAAC,EAAM,KAAP,CACE,WAAY,CACV,MAAO,EACL,GAAY,QAAU,GAAiB,CACvC,EAAW,GAAY,SAAW,GAAkB,CAAI,IAAA,GACzD,CACF,CACD,eAAc,GAAW,IAAA,YAExB,EAAa,IAAK,GACjB,EAAC,EAAM,IAAP,CAAA,SACG,EAAY,QAAQ,IAAK,GACxB,EAAC,EAAD,CAEU,SACG,YACC,aACZ,CAJK,EAAO,GAIZ,CACF,CACQ,CATI,EAAY,GAShB,CACZ,CACS,CAAA"}

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

@@ -1 +1 @@
-{"version":3,"file":"DataTablePageSize.mjs","names":[],"sources":["../../../../src/components/data-display/datatables/DataTablePageSize.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport {\n  dataTablePageSize,\n  dataTablePageSizeInput,\n} from '@mage-ui/styled-system/recipes';\nimport { Select } from '@/components/controls/dropdown/select/Select';\n\nimport { useDataTableContext } from './useDataTableContext';\n\nexport type DataTablePageSizeProps = {\n  value: number;\n  options: number[];\n  onChange: (size: number) => void;\n  label?: string;\n  classNames?: {\n    pageSize?: string;\n    pageSizeInput?: string;\n  };\n};\n\nexport const DataTablePageSize = ({\n  value,\n  options,\n  onChange,\n  label,\n  classNames,\n}: DataTablePageSizeProps): ReactNode => {\n  const { labels } = useDataTableContext();\n  const displayLabel = label ?? labels.rowsPerPage;\n\n  return (\n    <Select\n      label={displayLabel}\n      options={options.map((size) => ({\n        id: String(size),\n        value: String(size),\n      }))}\n      defaultValue={{ id: String(value), value: String(value) }}\n      onChange={(val) => {\n        if (val?.value) {\n          onChange(Number(val.value));\n        }\n      }}\n      clearable={false}\n      classNames={{\n        target: {\n          dropdownTextInput: classNames?.pageSize ?? dataTablePageSize(),\n          input: classNames?.pageSizeInput ?? dataTablePageSizeInput(),\n        },\n      }}\n    />\n  );\n};\n"],"mappings":"0QAqBA,MAAa,GAAqB,CAChC,QACA,UACA,WACA,QACA,gBACuC,CACvC,GAAM,CAAE,UAAW,GAAqB,CAGxC,OACE,EAAC,EAAA,CACC,MAJiB,GAAS,EAAO,YAKjC,QAAS,EAAQ,IAAK,IAAU,CAC9B,GAAI,OAAO,EAAK,CAChB,MAAO,OAAO,EAAK,CACpB,EAAE,CACH,aAAc,CAAE,GAAI,OAAO,EAAM,CAAE,MAAO,OAAO,EAAM,CAAE,CACzD,SAAW,GAAQ,CACb,GAAK,OACP,EAAS,OAAO,EAAI,MAAM,CAAC,EAG/B,UAAW,GACX,WAAY,CACV,OAAQ,CACN,kBAAmB,GAAY,UAAY,GAAmB,CAC9D,MAAO,GAAY,eAAiB,GAAwB,CAC7D,CACF,EACD"}
+{"version":3,"file":"DataTablePageSize.mjs","names":[],"sources":["../../../../src/components/data-display/datatables/DataTablePageSize.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport {\n  dataTablePageSize,\n  dataTablePageSizeInput,\n} from '@mage-ui/styled-system/recipes';\nimport { Select } from '@/components/controls/dropdown/select/Select';\n\nimport { useDataTableContext } from './useDataTableContext';\n\nexport type DataTablePageSizeProps = {\n  value: number;\n  options: number[];\n  onChange: (size: number) => void;\n  label?: string;\n  classNames?: {\n    pageSize?: string;\n    pageSizeInput?: string;\n  };\n};\n\nexport const DataTablePageSize = ({\n  value,\n  options,\n  onChange,\n  label,\n  classNames,\n}: DataTablePageSizeProps): ReactNode => {\n  const { labels } = useDataTableContext();\n  const displayLabel = label ?? labels.rowsPerPage;\n\n  return (\n    <Select\n      label={displayLabel}\n      options={options.map((size) => ({\n        id: String(size),\n        value: String(size),\n      }))}\n      defaultValue={{ id: String(value), value: String(value) }}\n      onChange={(val) => {\n        if (val?.value) {\n          onChange(Number(val.value));\n        }\n      }}\n      clearable={false}\n      classNames={{\n        target: {\n          dropdownTextInput: classNames?.pageSize ?? dataTablePageSize(),\n          input: classNames?.pageSizeInput ?? dataTablePageSizeInput(),\n        },\n      }}\n    />\n  );\n};\n"],"mappings":"0QAqBA,MAAa,GAAqB,CAChC,QACA,UACA,WACA,QACA,gBACuC,CACvC,GAAM,CAAE,UAAW,GAAqB,CAGxC,OACE,EAAC,EAAD,CACE,MAJiB,GAAS,EAAO,YAKjC,QAAS,EAAQ,IAAK,IAAU,CAC9B,GAAI,OAAO,EAAK,CAChB,MAAO,OAAO,EAAK,CACpB,EAAE,CACH,aAAc,CAAE,GAAI,OAAO,EAAM,CAAE,MAAO,OAAO,EAAM,CAAE,CACzD,SAAW,GAAQ,CACb,GAAK,OACP,EAAS,OAAO,EAAI,MAAM,CAAC,EAG/B,UAAW,GACX,WAAY,CACV,OAAQ,CACN,kBAAmB,GAAY,UAAY,GAAmB,CAC9D,MAAO,GAAY,eAAiB,GAAwB,CAC7D,CACF,CACD,CAAA"}

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

@@ -1 +1 @@
-{"version":3,"file":"DataTablePagination.mjs","names":[],"sources":["../../../../src/components/data-display/datatables/DataTablePagination.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n  dataTablePagination,\n  paginationWrapper,\n} from '@mage-ui/styled-system/recipes';\n\nimport {\n  Pagination,\n  type PaginationClassNames,\n} from '../../navigations/pagination/Pagination';\nimport { useDataTableContext } from './useDataTableContext';\n\nexport type DataTablePaginationProps = {\n  withEdges?: boolean;\n  classNames?: {\n    root?: string;\n    pagination?: PaginationClassNames;\n    paginationWrapper?: string;\n  };\n};\n\nexport const DataTablePagination = ({\n  withEdges = false,\n  classNames,\n}: DataTablePaginationProps): ReactNode => {\n  const { pagination } = useDataTableContext();\n\n  if (!pagination) {\n    return null;\n  }\n\n  return (\n    <div className={classNames?.root ?? dataTablePagination()}>\n      <Pagination.Root\n        classNames={classNames?.pagination}\n        total={pagination.pageCount}\n        value={pagination.currentPage}\n        onChange={(page: number) => {\n          pagination.onChange((current) => ({\n            ...current,\n            pageIndex: page - 1,\n          }));\n        }}\n      >\n        {/* TODO: labels for the empty controls */}\n        {withEdges && <Pagination.First aria-label='First page' />}\n        <div\n          className={cx(\n            classNames?.paginationWrapper ?? paginationWrapper(),\n            'group',\n          )}\n        >\n          <Pagination.Previous aria-label='Previous page' />\n          <Pagination.Items />\n          <Pagination.Next aria-label='Next page' />\n        </div>\n        {withEdges && <Pagination.Last aria-label='Last page' />}\n      </Pagination.Root>\n    </div>\n  );\n};\n"],"mappings":"uUAuBA,MAAa,GAAuB,CAClC,YAAY,GACZ,gBACyC,CACzC,GAAM,CAAE,cAAe,GAAqB,CAM5C,OAJK,EAKH,EAAC,MAAA,CAAI,UAAW,GAAY,MAAQ,GAAqB,UACvD,EAAC,EAAW,KAAA,CACV,WAAY,GAAY,WACxB,MAAO,EAAW,UAClB,MAAO,EAAW,YAClB,SAAW,GAAiB,CAC1B,EAAW,SAAU,IAAa,CAChC,GAAG,EACH,UAAW,EAAO,EACnB,EAAE,YAIJ,GAAa,EAAC,EAAW,MAAA,CAAM,aAAW,aAAA,CAAe,CAC1D,EAAC,MAAA,CACC,UAAW,EACT,GAAY,mBAAqB,GAAmB,CACpD,QACD,WAED,EAAC,EAAW,SAAA,CAAS,aAAW,gBAAA,CAAkB,CAClD,EAAC,EAAW,MAAA,EAAA,CAAQ,CACpB,EAAC,EAAW,KAAA,CAAK,aAAW,YAAA,CAAc,GACtC,CACL,GAAa,EAAC,EAAW,KAAA,CAAK,aAAW,YAAA,CAAc,GACxC,EACd,CA9BC"}
+{"version":3,"file":"DataTablePagination.mjs","names":[],"sources":["../../../../src/components/data-display/datatables/DataTablePagination.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n  dataTablePagination,\n  paginationWrapper,\n} from '@mage-ui/styled-system/recipes';\n\nimport {\n  Pagination,\n  type PaginationClassNames,\n} from '../../navigations/pagination/Pagination';\nimport { useDataTableContext } from './useDataTableContext';\n\nexport type DataTablePaginationProps = {\n  withEdges?: boolean;\n  classNames?: {\n    root?: string;\n    pagination?: PaginationClassNames;\n    paginationWrapper?: string;\n  };\n};\n\nexport const DataTablePagination = ({\n  withEdges = false,\n  classNames,\n}: DataTablePaginationProps): ReactNode => {\n  const { pagination } = useDataTableContext();\n\n  if (!pagination) {\n    return null;\n  }\n\n  return (\n    <div className={classNames?.root ?? dataTablePagination()}>\n      <Pagination.Root\n        classNames={classNames?.pagination}\n        total={pagination.pageCount}\n        value={pagination.currentPage}\n        onChange={(page: number) => {\n          pagination.onChange((current) => ({\n            ...current,\n            pageIndex: page - 1,\n          }));\n        }}\n      >\n        {/* TODO: labels for the empty controls */}\n        {withEdges && <Pagination.First aria-label='First page' />}\n        <div\n          className={cx(\n            classNames?.paginationWrapper ?? paginationWrapper(),\n            'group',\n          )}\n        >\n          <Pagination.Previous aria-label='Previous page' />\n          <Pagination.Items />\n          <Pagination.Next aria-label='Next page' />\n        </div>\n        {withEdges && <Pagination.Last aria-label='Last page' />}\n      </Pagination.Root>\n    </div>\n  );\n};\n"],"mappings":"uUAuBA,MAAa,GAAuB,CAClC,YAAY,GACZ,gBACyC,CACzC,GAAM,CAAE,cAAe,GAAqB,CAM5C,OAJK,EAKH,EAAC,MAAD,CAAK,UAAW,GAAY,MAAQ,GAAqB,UACvD,EAAC,EAAW,KAAZ,CACE,WAAY,GAAY,WACxB,MAAO,EAAW,UAClB,MAAO,EAAW,YAClB,SAAW,GAAiB,CAC1B,EAAW,SAAU,IAAa,CAChC,GAAG,EACH,UAAW,EAAO,EACnB,EAAE,WARP,CAYG,GAAa,EAAC,EAAW,MAAZ,CAAkB,aAAW,aAAe,CAAA,CAC1D,EAAC,MAAD,CACE,UAAW,EACT,GAAY,mBAAqB,GAAmB,CACpD,QACD,UAJH,CAME,EAAC,EAAW,SAAZ,CAAqB,aAAW,gBAAkB,CAAA,CAClD,EAAC,EAAW,MAAZ,EAAoB,CAAA,CACpB,EAAC,EAAW,KAAZ,CAAiB,aAAW,YAAc,CAAA,CACtC,GACL,GAAa,EAAC,EAAW,KAAZ,CAAiB,aAAW,YAAc,CAAA,CACxC,GACd,CAAA,CA9BC"}

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

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

package/dist/components/data-display/datatables/DataTableSkeleton.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"DataTableSkeleton.mjs","names":[],"sources":["../../../../src/components/data-display/datatables/DataTableSkeleton.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport {\n  dataTableSkeleton,\n  dataTableSkeletonCell,\n  dataTableSkeletonRow,\n} from '@mage-ui/styled-system/recipes';\n\nimport { VisuallyHidden } from '../../misc/visually-hidden/VisuallyHidden';\nimport { useDataTableContext } from './useDataTableContext';\n\n// Cycling widths to give rows visual variety\nconst CELL_WIDTH_PATTERNS = [['100%']];\n\ntype DataTableSkeletonProps = {\n  rows: number;\n  className?: string;\n};\n\nexport const DataTableSkeleton = ({\n  rows,\n  className,\n}: DataTableSkeletonProps): ReactNode => {\n  const { labels } = useDataTableContext();\n\n  return (\n    <div className={className ?? dataTableSkeleton()}>\n      <VisuallyHidden>{labels.loading}</VisuallyHidden>\n      {Array.from({ length: rows }, (_, i) => {\n        const widths = CELL_WIDTH_PATTERNS[i % CELL_WIDTH_PATTERNS.length];\n\n        return (\n          <div key={i} className={dataTableSkeletonRow()}>\n            {widths.map((width, j) => (\n              <div\n                key={j}\n                className={dataTableSkeletonCell()}\n                style={{ width }}\n              />\n            ))}\n          </div>\n        );\n      })}\n    </div>\n  );\n};\n"],"mappings":"yTAYA,MAAM,EAAsB,CAAC,CAAC,OAAO,CAAC,CAOzB,GAAqB,CAChC,OACA,eACuC,CACvC,GAAM,CAAE,UAAW,GAAqB,CAExC,OACE,EAAC,MAAA,CAAI,UAAW,GAAa,GAAmB,WAC9C,EAAC,EAAA,CAAA,SAAgB,EAAO,QAAA,CAAyB,CAChD,MAAM,KAAK,CAAE,OAAQ,EAAM,EAAG,EAAG,IAAM,CACtC,IAAM,EAAS,EAAoB,EAAI,EAAoB,QAE3D,OACE,EAAC,MAAA,CAAY,UAAW,GAAsB,UAC3C,EAAO,KAAK,EAAO,IAClB,EAAC,MAAA,CAEC,UAAW,GAAuB,CAClC,MAAO,CAAE,QAAO,EAFX,EAGL,CACF,EAPM,EAQJ,EAER,CAAA,EACE"}
+{"version":3,"file":"DataTableSkeleton.mjs","names":[],"sources":["../../../../src/components/data-display/datatables/DataTableSkeleton.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport {\n  dataTableSkeleton,\n  dataTableSkeletonCell,\n  dataTableSkeletonRow,\n} from '@mage-ui/styled-system/recipes';\n\nimport { VisuallyHidden } from '../../misc/visually-hidden/VisuallyHidden';\nimport { useDataTableContext } from './useDataTableContext';\n\n// Cycling widths to give rows visual variety\nconst CELL_WIDTH_PATTERNS = [['100%']];\n\ntype DataTableSkeletonProps = {\n  rows: number;\n  className?: string;\n};\n\nexport const DataTableSkeleton = ({\n  rows,\n  className,\n}: DataTableSkeletonProps): ReactNode => {\n  const { labels } = useDataTableContext();\n\n  return (\n    <div className={className ?? dataTableSkeleton()}>\n      <VisuallyHidden>{labels.loading}</VisuallyHidden>\n      {Array.from({ length: rows }, (_, i) => {\n        const widths = CELL_WIDTH_PATTERNS[i % CELL_WIDTH_PATTERNS.length];\n\n        return (\n          <div key={i} className={dataTableSkeletonRow()}>\n            {widths.map((width, j) => (\n              <div\n                key={j}\n                className={dataTableSkeletonCell()}\n                style={{ width }}\n              />\n            ))}\n          </div>\n        );\n      })}\n    </div>\n  );\n};\n"],"mappings":"yTAYA,MAAM,EAAsB,CAAC,CAAC,OAAO,CAAC,CAOzB,GAAqB,CAChC,OACA,eACuC,CACvC,GAAM,CAAE,UAAW,GAAqB,CAExC,OACE,EAAC,MAAD,CAAK,UAAW,GAAa,GAAmB,UAAhD,CACE,EAAC,EAAD,CAAA,SAAiB,EAAO,QAAyB,CAAA,CAChD,MAAM,KAAK,CAAE,OAAQ,EAAM,EAAG,EAAG,IAAM,CACtC,IAAM,EAAS,EAAoB,EAAI,EAAoB,QAE3D,OACE,EAAC,MAAD,CAAa,UAAW,GAAsB,UAC3C,EAAO,KAAK,EAAO,IAClB,EAAC,MAAD,CAEE,UAAW,GAAuB,CAClC,MAAO,CAAE,QAAO,CAChB,CAHK,EAGL,CACF,CACE,CARI,EAQJ,EAER,CACE"}

package/dist/components/data-display/datatables/DataTableSlotRow.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"DataTableSlotRow.mjs","names":[],"sources":["../../../../src/components/data-display/datatables/DataTableSlotRow.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { dataTableSlotRow } from '@mage-ui/styled-system/recipes';\n\nexport type DataTableSlots = {\n  top?: ReactNode;\n  bottom?: ReactNode;\n  empty?: ReactNode;\n};\n\ntype DataTableSlotRowProps = {\n  children?: ReactNode;\n  classNames?: {\n    root?: string;\n  };\n};\n\nexport const DataTableSlotRow = ({\n  children,\n  classNames,\n}: DataTableSlotRowProps): ReactNode => {\n  if (children === null || children === undefined || children === false) {\n    return null;\n  }\n\n  return (\n    <div className={classNames?.root ?? dataTableSlotRow()}>{children}</div>\n  );\n};\n"],"mappings":"0GAiBA,MAAa,GAAoB,CAC/B,WACA,gBAEI,GAAa,MAAkC,IAAa,GACvD,KAIP,EAAC,MAAA,CAAI,UAAW,GAAY,MAAQ,GAAkB,CAAG,YAAe"}
+{"version":3,"file":"DataTableSlotRow.mjs","names":[],"sources":["../../../../src/components/data-display/datatables/DataTableSlotRow.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { dataTableSlotRow } from '@mage-ui/styled-system/recipes';\n\nexport type DataTableSlots = {\n  top?: ReactNode;\n  bottom?: ReactNode;\n  empty?: ReactNode;\n};\n\ntype DataTableSlotRowProps = {\n  children?: ReactNode;\n  classNames?: {\n    root?: string;\n  };\n};\n\nexport const DataTableSlotRow = ({\n  children,\n  classNames,\n}: DataTableSlotRowProps): ReactNode => {\n  if (children === null || children === undefined || children === false) {\n    return null;\n  }\n\n  return (\n    <div className={classNames?.root ?? dataTableSlotRow()}>{children}</div>\n  );\n};\n"],"mappings":"0GAiBA,MAAa,GAAoB,CAC/B,WACA,gBAEI,GAAa,MAAkC,IAAa,GACvD,KAIP,EAAC,MAAD,CAAK,UAAW,GAAY,MAAQ,GAAkB,CAAG,WAAe,CAAA"}

package/dist/components/data-display/datatables/DataTableTopSlot.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"DataTableTopSlot.mjs","names":[],"sources":["../../../../src/components/data-display/datatables/DataTableTopSlot.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport {\n  dataTableSearcher,\n  dataTableTopSlot,\n} from '@mage-ui/styled-system/recipes';\n\nimport { TextInput } from '../../controls/text-input/TextInput';\nimport { Icon } from '../icons/icon/Icon';\nimport type {\n  DataTableFiltersConfig,\n  DataTableSearchConfig,\n} from './DataTable';\n\ntype DataTableTopSlotClassNames = {\n  root?: string;\n};\n\nexport type DataTableTopSlotProps = {\n  children?: ReactNode;\n  search?: DataTableSearchConfig;\n  searchValue?: string;\n  onSearchChange?: (value: string) => void;\n  filters?: DataTableFiltersConfig;\n  filtersState?: Record<string, unknown>;\n  onFiltersChange?: (next: Record<string, unknown>) => void;\n  classNames?: DataTableTopSlotClassNames;\n};\n\nexport const DataTableTopSlot = ({\n  children,\n  search,\n  searchValue,\n  onSearchChange,\n  filters,\n  filtersState,\n  onFiltersChange,\n  classNames,\n}: DataTableTopSlotProps): ReactNode => {\n  const hasSearch = search != null;\n  const hasFilters =\n    filters != null && filtersState != null && onFiltersChange != null;\n  const hasChildren =\n    children !== null && children !== undefined && children !== false;\n\n  if (!hasSearch && !hasFilters && !hasChildren) {\n    return null;\n  }\n\n  return (\n    <div className={classNames?.root ?? dataTableTopSlot()}>\n      {hasFilters ? filters.render(filtersState, onFiltersChange) : null}\n      {hasSearch && onSearchChange ? (\n        <TextInput\n          placeholder={search.placeholder}\n          aria-label={search.label ?? search.placeholder}\n          value={searchValue ?? ''}\n          onChange={(event) => onSearchChange(event.currentTarget.value)}\n          startSlot={\n            <Icon path='/icons/sprite-mage.svg' name='mage-searcher-search' />\n          }\n          classNames={{\n            textInput: dataTableSearcher(),\n          }}\n          type='search'\n        />\n      ) : null}\n      {children}\n    </div>\n  );\n};\n"],"mappings":"6PA6BA,MAAa,GAAoB,CAC/B,WACA,SACA,cACA,iBACA,UACA,eACA,kBACA,gBACsC,CACtC,IAAM,EAAY,GAAU,KACtB,EACJ,GAAW,MAAQ,GAAgB,MAAQ,GAAmB,KAQhE,MAJI,CAAC,GAAa,CAAC,GAAc,EAF/B,GAAa,MAAkC,IAAa,IAGrD,KAIP,EAAC,MAAA,CAAI,UAAW,GAAY,MAAQ,GAAkB,WACnD,EAAa,EAAQ,OAAO,EAAc,EAAgB,CAAG,KAC7D,GAAa,EACZ,EAAC,EAAA,CACC,YAAa,EAAO,YACpB,aAAY,EAAO,OAAS,EAAO,YACnC,MAAO,GAAe,GACtB,SAAW,GAAU,EAAe,EAAM,cAAc,MAAM,CAC9D,UACE,EAAC,EAAA,CAAK,KAAK,yBAAyB,KAAK,wBAAyB,CAEpE,WAAY,CACV,UAAW,GAAmB,CAC/B,CACD,KAAK,UACL,CACA,KACH,IACG"}
+{"version":3,"file":"DataTableTopSlot.mjs","names":[],"sources":["../../../../src/components/data-display/datatables/DataTableTopSlot.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport {\n  dataTableSearcher,\n  dataTableTopSlot,\n} from '@mage-ui/styled-system/recipes';\n\nimport { TextInput } from '../../controls/text-input/TextInput';\nimport { Icon } from '../icons/icon/Icon';\nimport type {\n  DataTableFiltersConfig,\n  DataTableSearchConfig,\n} from './DataTable';\n\ntype DataTableTopSlotClassNames = {\n  root?: string;\n};\n\nexport type DataTableTopSlotProps = {\n  children?: ReactNode;\n  search?: DataTableSearchConfig;\n  searchValue?: string;\n  onSearchChange?: (value: string) => void;\n  filters?: DataTableFiltersConfig;\n  filtersState?: Record<string, unknown>;\n  onFiltersChange?: (next: Record<string, unknown>) => void;\n  classNames?: DataTableTopSlotClassNames;\n};\n\nexport const DataTableTopSlot = ({\n  children,\n  search,\n  searchValue,\n  onSearchChange,\n  filters,\n  filtersState,\n  onFiltersChange,\n  classNames,\n}: DataTableTopSlotProps): ReactNode => {\n  const hasSearch = search != null;\n  const hasFilters =\n    filters != null && filtersState != null && onFiltersChange != null;\n  const hasChildren =\n    children !== null && children !== undefined && children !== false;\n\n  if (!hasSearch && !hasFilters && !hasChildren) {\n    return null;\n  }\n\n  return (\n    <div className={classNames?.root ?? dataTableTopSlot()}>\n      {hasFilters ? filters.render(filtersState, onFiltersChange) : null}\n      {hasSearch && onSearchChange ? (\n        <TextInput\n          placeholder={search.placeholder}\n          aria-label={search.label ?? search.placeholder}\n          value={searchValue ?? ''}\n          onChange={(event) => onSearchChange(event.currentTarget.value)}\n          startSlot={\n            <Icon path='/icons/sprite-mage.svg' name='mage-searcher-search' />\n          }\n          classNames={{\n            textInput: dataTableSearcher(),\n          }}\n          type='search'\n        />\n      ) : null}\n      {children}\n    </div>\n  );\n};\n"],"mappings":"6PA6BA,MAAa,GAAoB,CAC/B,WACA,SACA,cACA,iBACA,UACA,eACA,kBACA,gBACsC,CACtC,IAAM,EAAY,GAAU,KACtB,EACJ,GAAW,MAAQ,GAAgB,MAAQ,GAAmB,KAQhE,MAJI,CAAC,GAAa,CAAC,GAAc,EAF/B,GAAa,MAAkC,IAAa,IAGrD,KAIP,EAAC,MAAD,CAAK,UAAW,GAAY,MAAQ,GAAkB,UAAtD,CACG,EAAa,EAAQ,OAAO,EAAc,EAAgB,CAAG,KAC7D,GAAa,EACZ,EAAC,EAAD,CACE,YAAa,EAAO,YACpB,aAAY,EAAO,OAAS,EAAO,YACnC,MAAO,GAAe,GACtB,SAAW,GAAU,EAAe,EAAM,cAAc,MAAM,CAC9D,UACE,EAAC,EAAD,CAAM,KAAK,yBAAyB,KAAK,uBAAyB,CAAA,CAEpE,WAAY,CACV,UAAW,GAAmB,CAC/B,CACD,KAAK,SACL,CAAA,CACA,KACH,EACG"}

package/dist/components/data-display/datatables/DataTableViewport.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"DataTableViewport.mjs","names":[],"sources":["../../../../src/components/data-display/datatables/DataTableViewport.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { dataTableViewport } from '@mage-ui/styled-system/recipes';\n\ntype DataTableViewportProps = {\n  className?: string;\n  children: ReactNode;\n};\n\nexport const DataTableViewport = ({\n  className,\n  children,\n}: DataTableViewportProps): ReactNode => {\n  return <div className={className ?? dataTableViewport()}>{children}</div>;\n};\n"],"mappings":"2GASA,MAAa,GAAqB,CAChC,YACA,cAEO,EAAC,MAAA,CAAI,UAAW,GAAa,GAAmB,CAAG,YAAe"}
+{"version":3,"file":"DataTableViewport.mjs","names":[],"sources":["../../../../src/components/data-display/datatables/DataTableViewport.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { dataTableViewport } from '@mage-ui/styled-system/recipes';\n\ntype DataTableViewportProps = {\n  className?: string;\n  children: ReactNode;\n};\n\nexport const DataTableViewport = ({\n  className,\n  children,\n}: DataTableViewportProps): ReactNode => {\n  return <div className={className ?? dataTableViewport()}>{children}</div>;\n};\n"],"mappings":"2GASA,MAAa,GAAqB,CAChC,YACA,cAEO,EAAC,MAAD,CAAK,UAAW,GAAa,GAAmB,CAAG,WAAe,CAAA"}

package/dist/components/data-display/description-list/DescriptionList.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"DescriptionList.mjs","names":[],"sources":["../../../../src/components/data-display/description-list/DescriptionList.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n  descriptionList,\n  descriptionListDescription,\n  descriptionListRoot,\n  descriptionListTerm,\n  descriptionListWrapper,\n} from '@mage-ui/styled-system/recipes';\n\nexport type DescriptionListClassNames = {\n  descriptionList?: string;\n  root?: string;\n  wrapper?: string;\n  term?: string;\n  description?: string;\n};\n\nexport type DescriptionListProps = {\n  children: ReactNode;\n  orientation?: 'horizontal' | 'vertical';\n  classNames?: DescriptionListClassNames;\n};\n\nexport type DescriptionListItemProps = {\n  term: ReactNode;\n  description?: ReactNode;\n  children?: ReactNode;\n  classNames?: DescriptionListClassNames;\n};\n\nconst Root = ({\n  children,\n  orientation = 'vertical',\n  classNames,\n}: DescriptionListProps): ReactNode => {\n  return (\n    <dl\n      data-orientation={orientation}\n      className={cx(\n        classNames?.descriptionList ?? descriptionList(),\n        classNames?.root ?? descriptionListRoot(),\n      )}\n    >\n      {children}\n    </dl>\n  );\n};\n\nconst Item = ({\n  term,\n  description,\n  children,\n  classNames,\n}: DescriptionListItemProps): ReactNode => {\n  const content = description ?? children;\n\n  return (\n    <div className={classNames?.wrapper ?? descriptionListWrapper()}>\n      <dt className={classNames?.term ?? descriptionListTerm()}>{term}</dt>\n\n      {content && (\n        <dd className={classNames?.description ?? descriptionListDescription()}>\n          {content}\n        </dd>\n      )}\n    </div>\n  );\n};\n\nexport const DescriptionList = Object.assign(Root, {\n  Item,\n});\n"],"mappings":"iRAuEA,MAAa,EAAkB,OAAO,QAvCxB,CACZ,WACA,cAAc,WACd,gBAGE,EAAC,KAAA,CACC,mBAAkB,EAClB,UAAW,EACT,GAAY,iBAAmB,GAAiB,CAChD,GAAY,MAAQ,GAAqB,CAC1C,CAEA,YACE,CAyB0C,CACjD,MAtBY,CACZ,OACA,cACA,WACA,gBACyC,CACzC,IAAM,EAAU,GAAe,EAE/B,OACE,EAAC,MAAA,CAAI,UAAW,GAAY,SAAW,GAAwB,WAC7D,EAAC,KAAA,CAAG,UAAW,GAAY,MAAQ,GAAqB,UAAG,GAAU,CAEpE,GACC,EAAC,KAAA,CAAG,UAAW,GAAY,aAAe,GAA4B,UACnE,GACE,CAAA,EAEH,EAMT,CAAC"}
+{"version":3,"file":"DescriptionList.mjs","names":[],"sources":["../../../../src/components/data-display/description-list/DescriptionList.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n  descriptionList,\n  descriptionListDescription,\n  descriptionListRoot,\n  descriptionListTerm,\n  descriptionListWrapper,\n} from '@mage-ui/styled-system/recipes';\n\nexport type DescriptionListClassNames = {\n  descriptionList?: string;\n  root?: string;\n  wrapper?: string;\n  term?: string;\n  description?: string;\n};\n\nexport type DescriptionListProps = {\n  children: ReactNode;\n  orientation?: 'horizontal' | 'vertical';\n  classNames?: DescriptionListClassNames;\n};\n\nexport type DescriptionListItemProps = {\n  term: ReactNode;\n  description?: ReactNode;\n  children?: ReactNode;\n  classNames?: DescriptionListClassNames;\n};\n\nconst Root = ({\n  children,\n  orientation = 'vertical',\n  classNames,\n}: DescriptionListProps): ReactNode => {\n  return (\n    <dl\n      data-orientation={orientation}\n      className={cx(\n        classNames?.descriptionList ?? descriptionList(),\n        classNames?.root ?? descriptionListRoot(),\n      )}\n    >\n      {children}\n    </dl>\n  );\n};\n\nconst Item = ({\n  term,\n  description,\n  children,\n  classNames,\n}: DescriptionListItemProps): ReactNode => {\n  const content = description ?? children;\n\n  return (\n    <div className={classNames?.wrapper ?? descriptionListWrapper()}>\n      <dt className={classNames?.term ?? descriptionListTerm()}>{term}</dt>\n\n      {content && (\n        <dd className={classNames?.description ?? descriptionListDescription()}>\n          {content}\n        </dd>\n      )}\n    </div>\n  );\n};\n\nexport const DescriptionList = Object.assign(Root, {\n  Item,\n});\n"],"mappings":"iRAuEA,MAAa,EAAkB,OAAO,QAvCxB,CACZ,WACA,cAAc,WACd,gBAGE,EAAC,KAAD,CACE,mBAAkB,EAClB,UAAW,EACT,GAAY,iBAAmB,GAAiB,CAChD,GAAY,MAAQ,GAAqB,CAC1C,CAEA,WACE,CAAA,CAyB0C,CACjD,MAtBY,CACZ,OACA,cACA,WACA,gBACyC,CACzC,IAAM,EAAU,GAAe,EAE/B,OACE,EAAC,MAAD,CAAK,UAAW,GAAY,SAAW,GAAwB,UAA/D,CACE,EAAC,KAAD,CAAI,UAAW,GAAY,MAAQ,GAAqB,UAAG,EAAU,CAAA,CAEpE,GACC,EAAC,KAAD,CAAI,UAAW,GAAY,aAAe,GAA4B,UACnE,EACE,CAAA,CAEH,IAMT,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"Icon.mjs","names":[],"sources":["../../../../../src/components/data-display/icons/icon/Icon.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n  type IconVariantProps,\n  icon,\n  iconIconRaw,\n  iconIconRawRoot,\n  iconRoot,\n} from '@mage-ui/styled-system/recipes';\nimport { IconRaw } from '@/components/data-display/icons/icon-raw/IconRaw';\n\nexport type IconProps = {\n  name: string;\n  path: string;\n  classNames?: {\n    icon?: string;\n    root?: string;\n    iconRaw?: {\n      iconRaw?: string;\n      root?: string;\n    };\n  };\n} & IconVariantProps;\n\nexport const Icon = ({ path, name, classNames }: IconProps): ReactNode => {\n  return (\n    <span\n      className={cx(classNames?.icon ?? icon(), classNames?.root ?? iconRoot())}\n    >\n      <IconRaw\n        classNames={{\n          iconRaw: classNames?.iconRaw?.iconRaw ?? iconIconRaw(),\n          root: classNames?.iconRaw?.root ?? iconIconRawRoot(),\n        }}\n        path={path}\n        name={name}\n      />\n    </span>\n  );\n};\n"],"mappings":"oPAyBA,MAAa,GAAQ,CAAE,OAAM,OAAM,gBAE/B,EAAC,OAAA,CACC,UAAW,EAAG,GAAY,MAAQ,GAAM,CAAE,GAAY,MAAQ,GAAU,CAAC,UAEzE,EAAC,EAAA,CACC,WAAY,CACV,QAAS,GAAY,SAAS,SAAW,GAAa,CACtD,KAAM,GAAY,SAAS,MAAQ,GAAiB,CACrD,CACK,OACA,QACN,EACG"}
+{"version":3,"file":"Icon.mjs","names":[],"sources":["../../../../../src/components/data-display/icons/icon/Icon.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n  type IconVariantProps,\n  icon,\n  iconIconRaw,\n  iconIconRawRoot,\n  iconRoot,\n} from '@mage-ui/styled-system/recipes';\nimport { IconRaw } from '@/components/data-display/icons/icon-raw/IconRaw';\n\nexport type IconProps = {\n  name: string;\n  path: string;\n  classNames?: {\n    icon?: string;\n    root?: string;\n    iconRaw?: {\n      iconRaw?: string;\n      root?: string;\n    };\n  };\n} & IconVariantProps;\n\nexport const Icon = ({ path, name, classNames }: IconProps): ReactNode => {\n  return (\n    <span\n      className={cx(classNames?.icon ?? icon(), classNames?.root ?? iconRoot())}\n    >\n      <IconRaw\n        classNames={{\n          iconRaw: classNames?.iconRaw?.iconRaw ?? iconIconRaw(),\n          root: classNames?.iconRaw?.root ?? iconIconRawRoot(),\n        }}\n        path={path}\n        name={name}\n      />\n    </span>\n  );\n};\n"],"mappings":"oPAyBA,MAAa,GAAQ,CAAE,OAAM,OAAM,gBAE/B,EAAC,OAAD,CACE,UAAW,EAAG,GAAY,MAAQ,GAAM,CAAE,GAAY,MAAQ,GAAU,CAAC,UAEzE,EAAC,EAAD,CACE,WAAY,CACV,QAAS,GAAY,SAAS,SAAW,GAAa,CACtD,KAAM,GAAY,SAAS,MAAQ,GAAiB,CACrD,CACK,OACA,OACN,CAAA,CACG,CAAA"}

package/dist/components/data-display/icons/icon-raw/IconRaw.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"IconRaw.mjs","names":[],"sources":["../../../../../src/components/data-display/icons/icon-raw/IconRaw.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef, ReactNode } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport { iconRaw, iconRawRoot } from '@mage-ui/styled-system/recipes';\n\nexport type IconRawProps = ComponentPropsWithoutRef<'svg'> & {\n  path: string;\n  name: string;\n  classNames?: {\n    iconRaw?: string;\n    root?: string;\n  };\n};\n\nexport const IconRaw = ({\n  path,\n  name,\n  classNames,\n  ...props\n}: IconRawProps): ReactNode => {\n  return (\n    <svg\n      {...props}\n      className={cx(\n        classNames?.iconRaw ?? iconRaw(),\n        classNames?.root ?? iconRawRoot(),\n        props.className,\n      )}\n      aria-hidden='true'\n      focusable='false'\n    >\n      <use href={`${path}#${name}`} />\n    </svg>\n  );\n};\n"],"mappings":"kKAcA,MAAa,GAAW,CACtB,OACA,OACA,aACA,GAAG,KAGD,EAAC,MAAA,CACC,GAAI,EACJ,UAAW,EACT,GAAY,SAAW,GAAS,CAChC,GAAY,MAAQ,GAAa,CACjC,EAAM,UACP,CACD,cAAY,OACZ,UAAU,iBAEV,EAAC,MAAA,CAAI,KAAM,GAAG,EAAK,GAAG,IAAA,CAAU,EAC5B"}
+{"version":3,"file":"IconRaw.mjs","names":[],"sources":["../../../../../src/components/data-display/icons/icon-raw/IconRaw.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef, ReactNode } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport { iconRaw, iconRawRoot } from '@mage-ui/styled-system/recipes';\n\nexport type IconRawProps = ComponentPropsWithoutRef<'svg'> & {\n  path: string;\n  name: string;\n  classNames?: {\n    iconRaw?: string;\n    root?: string;\n  };\n};\n\nexport const IconRaw = ({\n  path,\n  name,\n  classNames,\n  ...props\n}: IconRawProps): ReactNode => {\n  return (\n    <svg\n      {...props}\n      className={cx(\n        classNames?.iconRaw ?? iconRaw(),\n        classNames?.root ?? iconRawRoot(),\n        props.className,\n      )}\n      aria-hidden='true'\n      focusable='false'\n    >\n      <use href={`${path}#${name}`} />\n    </svg>\n  );\n};\n"],"mappings":"kKAcA,MAAa,GAAW,CACtB,OACA,OACA,aACA,GAAG,KAGD,EAAC,MAAD,CACE,GAAI,EACJ,UAAW,EACT,GAAY,SAAW,GAAS,CAChC,GAAY,MAAQ,GAAa,CACjC,EAAM,UACP,CACD,cAAY,OACZ,UAAU,iBAEV,EAAC,MAAD,CAAK,KAAM,GAAG,EAAK,GAAG,IAAU,CAAA,CAC5B,CAAA"}

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

@@ -1 +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    >\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,UAED,EAAC,MAAA,CACC,UAAW,GAAY,KAAO,GAAY,CACnC,QACC,SACC,UACT,cAAY,OACZ,UAAU,QACV,MAAM,6BAEL,YACG,EACD"}
+{"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    >\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,OAAD,CACE,UAAW,EACT,GAAY,SAAW,GAAS,CAChC,GAAY,MAAQ,GAAa,CAClC,UAED,EAAC,MAAD,CACE,UAAW,GAAY,KAAO,GAAY,CACnC,QACC,SACC,UACT,cAAY,OACZ,UAAU,QACV,MAAM,6BAEL,WACG,CAAA,CACD,CAAA"}

package/dist/components/data-display/icons/icon-wrapped/IconWrapped.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"IconWrapped.mjs","names":[],"sources":["../../../../../src/components/data-display/icons/icon-wrapped/IconWrapped.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport { iconWrapped, iconWrappedRoot } from '@mage-ui/styled-system/recipes';\nimport { ThemeIcon } from '@mantine/core';\n\nexport type IconWrappedProps = {\n  children: ReactNode;\n  classNames?: {\n    iconWrapped?: string;\n    root?: string;\n  };\n};\n\nexport const IconWrapped = ({\n  children,\n  classNames,\n}: IconWrappedProps): ReactNode => {\n  return (\n    <ThemeIcon\n      classNames={{\n        root: cx(\n          classNames?.iconWrapped ?? iconWrapped(),\n          classNames?.root ?? iconWrappedRoot(),\n        ),\n      }}\n      component={'span'}\n    >\n      {children}\n    </ThemeIcon>\n  );\n};\n"],"mappings":"oNAcA,MAAa,GAAe,CAC1B,WACA,gBAGE,EAAC,EAAA,CACC,WAAY,CACV,KAAM,EACJ,GAAY,aAAe,GAAa,CACxC,GAAY,MAAQ,GAAiB,CACtC,CACF,CACD,UAAW,OAEV,YACS"}
+{"version":3,"file":"IconWrapped.mjs","names":[],"sources":["../../../../../src/components/data-display/icons/icon-wrapped/IconWrapped.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport { iconWrapped, iconWrappedRoot } from '@mage-ui/styled-system/recipes';\nimport { ThemeIcon } from '@mantine/core';\n\nexport type IconWrappedProps = {\n  children: ReactNode;\n  classNames?: {\n    iconWrapped?: string;\n    root?: string;\n  };\n};\n\nexport const IconWrapped = ({\n  children,\n  classNames,\n}: IconWrappedProps): ReactNode => {\n  return (\n    <ThemeIcon\n      classNames={{\n        root: cx(\n          classNames?.iconWrapped ?? iconWrapped(),\n          classNames?.root ?? iconWrappedRoot(),\n        ),\n      }}\n      component={'span'}\n    >\n      {children}\n    </ThemeIcon>\n  );\n};\n"],"mappings":"oNAcA,MAAa,GAAe,CAC1B,WACA,gBAGE,EAAC,EAAD,CACE,WAAY,CACV,KAAM,EACJ,GAAY,aAAe,GAAa,CACxC,GAAY,MAAQ,GAAiB,CACtC,CACF,CACD,UAAW,OAEV,WACS,CAAA"}

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

@@ -1,7 +1,7 @@
 import { AssignedUser, AssignedUserProps } from "./assigned-user/AssignedUser.mjs";
 import { Avatar, AvatarProps } from "./avatar/Avatar.mjs";
 import { Badge, BadgeProps } from "./badge/Badge.mjs";
-import { Calendar, CalendarEvent, CalendarProps, CalendarVariant, CalendarView, DateLocalizer } from "./calendar/Calendar.mjs";
+import { Calendar, CalendarEvent, CalendarProps, CalendarView, DateLocalizer } from "./calendar/Calendar.mjs";
 import { TableClassNames, TableProps } from "./table/TableRoot.mjs";
 import { TableHeadProps } from "./table/TableHead.mjs";
 import { TableBodyProps } from "./table/TableBody.mjs";

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 { 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,GAAG,EAAO,KAChE,EAAS,SAAS,SAAS,EAAI,IAAQ,EAAY,OAAS,GAAG,EAAO,KACtE,EAAS,SAAS,QAAQ,EAAI,IAAQ,EAAY,KAAO,GAAG,EAAO,KACnE,EAAS,SAAS,MAAM,EAAI,IAAQ,EAAY,MAAQ,GAAG,EAAO,KAC/D,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"}
+{"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,GAAG,EAAO,KAChE,EAAS,SAAS,SAAS,EAAI,IAAQ,EAAY,OAAS,GAAG,EAAO,KACtE,EAAS,SAAS,QAAQ,EAAI,IAAQ,EAAY,KAAO,GAAG,EAAO,KACnE,EAAS,SAAS,MAAM,EAAI,IAAQ,EAAY,MAAQ,GAAG,EAAO,KAC/D,GAGI,EAAY,GAErB,CACE,WACA,QAAQ,IAAA,GACR,WAAW,GACX,WAAW,UACX,SAAS,EACT,aACA,aAEF,IAGE,EAAC,MAAD,CACE,UAAW,EACT,GAAY,WAAa,GAAW,CACpC,GAAY,MAAQ,GAAe,CACpC,CACI,eALP,CAOG,CAAC,GACA,EAAA,EAAA,CAAA,SAAA,CACG,GAAa,EAAC,OAAD,CAAM,UAAW,GAAgB,UAAG,EAAiB,CAAA,CACnE,EAAC,OAAD,CACE,UAAW,EAAG,EAAe,CAAE,WAAU,CAAC,CAAE,GAAY,MAAM,CAC9D,MAAO,EAAgB,EAAU,EAAO,UAEvC,EACI,CAAA,CACN,CAAA,CAAA,CAEJ,EACG,GAGX,CAED,EAAU,YAAc"}

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,GAAa,CAAE,gBAExB,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,EAAD,CACE,KAAK,OACL,WAAY,CACV,KAAM,EACJ,GAAY,QAAU,GAAW,CACjC,GAAY,MAAQ,GAAe,CACpC,CACF,CACD,CAAA"}

package/dist/components/data-display/loader-oval/LoaderOval.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"LoaderOval.mjs","names":[],"sources":["../../../../src/components/data-display/loader-oval/LoaderOval.tsx"],"sourcesContent":["import { cx } from '@mage-ui/styled-system/css';\nimport { loaderOval, loaderOvalRoot } from '@mage-ui/styled-system/recipes';\nimport { Loader } from '@mantine/core';\n\nexport type LoaderOvalProps = {\n  classNames?: {\n    loader?: string;\n    root?: string;\n  };\n};\n\nexport const LoaderOval = ({ classNames }: LoaderOvalProps) => {\n  return (\n    <Loader\n      type='oval'\n      classNames={{\n        root: cx(\n          classNames?.loader ?? loaderOval(),\n          classNames?.root ?? loaderOvalRoot(),\n        ),\n      }}\n    />\n  );\n};\n"],"mappings":"+MAWA,MAAa,GAAc,CAAE,gBAEzB,EAAC,EAAA,CACC,KAAK,OACL,WAAY,CACV,KAAM,EACJ,GAAY,QAAU,GAAY,CAClC,GAAY,MAAQ,GAAgB,CACrC,CACF,EACD"}
+{"version":3,"file":"LoaderOval.mjs","names":[],"sources":["../../../../src/components/data-display/loader-oval/LoaderOval.tsx"],"sourcesContent":["import { cx } from '@mage-ui/styled-system/css';\nimport { loaderOval, loaderOvalRoot } from '@mage-ui/styled-system/recipes';\nimport { Loader } from '@mantine/core';\n\nexport type LoaderOvalProps = {\n  classNames?: {\n    loader?: string;\n    root?: string;\n  };\n};\n\nexport const LoaderOval = ({ classNames }: LoaderOvalProps) => {\n  return (\n    <Loader\n      type='oval'\n      classNames={{\n        root: cx(\n          classNames?.loader ?? loaderOval(),\n          classNames?.root ?? loaderOvalRoot(),\n        ),\n      }}\n    />\n  );\n};\n"],"mappings":"+MAWA,MAAa,GAAc,CAAE,gBAEzB,EAAC,EAAD,CACE,KAAK,OACL,WAAY,CACV,KAAM,EACJ,GAAY,QAAU,GAAY,CAClC,GAAY,MAAQ,GAAgB,CACrC,CACF,CACD,CAAA"}

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 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"}
+{"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,IAAD,CACQ,OACN,aAAY,EACZ,UAAW,EACT,GAAY,MAAQ,GAAW,CAC/B,GAAY,MAAQ,GAAe,CACpC,CACD,GAAI,WAEJ,EAAC,MAAD,CACE,IAAK,EACA,MACE,QACC,SACR,QAAQ,QACR,UAAW,GAAY,OAAS,GAAgB,CAChD,CAAA,CACA,CAAA"}

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 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  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  width,\n  height,\n  viewBox,\n  children,\n  classNames,\n  ...props\n}: LogoSvgProps): ReactNode => {\n  return (\n    <span\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    </span>\n  );\n};\n"],"mappings":"kLAqBA,MAAa,GAAW,CACtB,QACA,SACA,UACA,WACA,aACA,GAAG,KAGD,EAAC,OAAA,CACC,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,EACD"}
+{"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  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  width,\n  height,\n  viewBox,\n  children,\n  classNames,\n  ...props\n}: LogoSvgProps): ReactNode => {\n  return (\n    <span\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    </span>\n  );\n};\n"],"mappings":"kLAqBA,MAAa,GAAW,CACtB,QACA,SACA,UACA,WACA,aACA,GAAG,KAGD,EAAC,OAAD,CACE,UAAW,EACT,GAAY,MAAQ,GAAS,CAC7B,GAAY,MAAQ,GAAa,CAClC,CACD,GAAI,WAEJ,EAAC,MAAD,CACS,QACC,SACC,UACT,UAAW,GAAY,KAAO,GAAY,CAC1C,KAAK,OACL,cAAY,OACZ,UAAU,QACV,MAAM,6BAEL,WACG,CAAA,CACD,CAAA"}

package/dist/components/data-display/notification-banner/NotificationBanner.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"NotificationBanner.mjs","names":[],"sources":["../../../../src/components/data-display/notification-banner/NotificationBanner.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef, ReactNode } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n  notificationBanner,\n  notificationBannerContent,\n  notificationBannerIcon,\n  notificationBannerIconIconRaw,\n  notificationBannerIconIconRawRoot,\n  notificationBannerIconRoot,\n  notificationBannerIconWrapped,\n  notificationBannerIconWrappedRoot,\n  notificationBannerRoot,\n  notificationBannerSection,\n  notificationBannerWrapper,\n} from '@mage-ui/styled-system/recipes';\n\nimport { Icon, type IconProps } from '../icons/icon/Icon';\nimport {\n  IconWrapped,\n  type IconWrappedProps,\n} from '../icons/icon-wrapped/IconWrapped';\n\nexport type NotificationBannerIntent =\n  | 'info'\n  | 'success'\n  | 'warning'\n  | 'danger';\n\nconst INTENT_ICON_NAME_MAP: Record<NotificationBannerIntent, string> = {\n  info: 'mage-notification-banner-info-circle',\n  success: 'mage-notification-banner-check-circle',\n  warning: 'mage-notification-banner-alert-triangle',\n  // danger: 'mage-notification-banner-x-circle',\n  danger: 'mage-notification-banner-alert-triangle',\n};\n\nexport type NotificationBannerProps = Omit<\n  ComponentPropsWithoutRef<'div'>,\n  'className'\n> & {\n  intent?: NotificationBannerIntent;\n  startSlot?: ReactNode;\n  children: ReactNode;\n  classNames?: {\n    notificationBanner?: string;\n    root?: string;\n    wrapper?: string;\n    section?: string;\n    content?: string;\n    iconWrapped?: IconWrappedProps['classNames'];\n    icon?: IconProps['classNames'];\n  };\n};\n\nexport const NotificationBanner = ({\n  intent = 'info',\n  startSlot,\n  children,\n  classNames,\n  ...props\n}: NotificationBannerProps): ReactNode => {\n  const iconName = INTENT_ICON_NAME_MAP[intent];\n\n  return (\n    <div\n      {...props}\n      data-intent={intent}\n      className={cx(\n        classNames?.notificationBanner ?? notificationBanner(),\n        classNames?.root ?? notificationBannerRoot(),\n      )}\n    >\n      <div className={classNames?.wrapper ?? notificationBannerWrapper()}>\n        <div className={classNames?.section ?? notificationBannerSection()}>\n          {startSlot ? (\n            startSlot\n          ) : (\n            <IconWrapped\n              classNames={{\n                iconWrapped:\n                  classNames?.iconWrapped?.iconWrapped ??\n                  notificationBannerIconWrapped(),\n                root:\n                  classNames?.iconWrapped?.root ??\n                  notificationBannerIconWrappedRoot(),\n              }}\n            >\n              <Icon\n                name={iconName}\n                path='/icons/sprite-mage.svg'\n                classNames={{\n                  icon: classNames?.icon?.icon ?? notificationBannerIcon(),\n                  root: classNames?.icon?.root ?? notificationBannerIconRoot(),\n                  iconRaw: {\n                    iconRaw:\n                      classNames?.icon?.iconRaw?.iconRaw ??\n                      notificationBannerIconIconRaw(),\n                    root:\n                      classNames?.icon?.iconRaw?.root ??\n                      notificationBannerIconIconRawRoot(),\n                  },\n                }}\n              />\n            </IconWrapped>\n          )}\n        </div>\n        <div className={classNames?.content ?? notificationBannerContent()}>\n          {children}\n        </div>\n      </div>\n    </div>\n  );\n};\n"],"mappings":"imBA6BA,MAAM,EAAiE,CACrE,KAAM,uCACN,QAAS,wCACT,QAAS,0CAET,OAAQ,0CACT,CAoBY,GAAsB,CACjC,SAAS,OACT,YACA,WACA,aACA,GAAG,KACqC,CACxC,IAAM,EAAW,EAAqB,GAEtC,OACE,EAAC,MAAA,CACC,GAAI,EACJ,cAAa,EACb,UAAW,EACT,GAAY,oBAAsB,GAAoB,CACtD,GAAY,MAAQ,GAAwB,CAC7C,UAED,EAAC,MAAA,CAAI,UAAW,GAAY,SAAW,GAA2B,WAChE,EAAC,MAAA,CAAI,UAAW,GAAY,SAAW,GAA2B,UAC/D,GAGC,EAAC,EAAA,CACC,WAAY,CACV,YACE,GAAY,aAAa,aACzB,GAA+B,CACjC,KACE,GAAY,aAAa,MACzB,GAAmC,CACtC,UAED,EAAC,EAAA,CACC,KAAM,EACN,KAAK,yBACL,WAAY,CACV,KAAM,GAAY,MAAM,MAAQ,GAAwB,CACxD,KAAM,GAAY,MAAM,MAAQ,GAA4B,CAC5D,QAAS,CACP,QACE,GAAY,MAAM,SAAS,SAC3B,GAA+B,CACjC,KACE,GAAY,MAAM,SAAS,MAC3B,GAAmC,CACtC,CACF,EACD,EACU,EAEZ,CACN,EAAC,MAAA,CAAI,UAAW,GAAY,SAAW,GAA2B,CAC/D,YACG,CAAA,EACF,EACF"}
+{"version":3,"file":"NotificationBanner.mjs","names":[],"sources":["../../../../src/components/data-display/notification-banner/NotificationBanner.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef, ReactNode } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n  notificationBanner,\n  notificationBannerContent,\n  notificationBannerIcon,\n  notificationBannerIconIconRaw,\n  notificationBannerIconIconRawRoot,\n  notificationBannerIconRoot,\n  notificationBannerIconWrapped,\n  notificationBannerIconWrappedRoot,\n  notificationBannerRoot,\n  notificationBannerSection,\n  notificationBannerWrapper,\n} from '@mage-ui/styled-system/recipes';\n\nimport { Icon, type IconProps } from '../icons/icon/Icon';\nimport {\n  IconWrapped,\n  type IconWrappedProps,\n} from '../icons/icon-wrapped/IconWrapped';\n\nexport type NotificationBannerIntent =\n  | 'info'\n  | 'success'\n  | 'warning'\n  | 'danger';\n\nconst INTENT_ICON_NAME_MAP: Record<NotificationBannerIntent, string> = {\n  info: 'mage-notification-banner-info-circle',\n  success: 'mage-notification-banner-check-circle',\n  warning: 'mage-notification-banner-alert-triangle',\n  // danger: 'mage-notification-banner-x-circle',\n  danger: 'mage-notification-banner-alert-triangle',\n};\n\nexport type NotificationBannerProps = Omit<\n  ComponentPropsWithoutRef<'div'>,\n  'className'\n> & {\n  intent?: NotificationBannerIntent;\n  startSlot?: ReactNode;\n  children: ReactNode;\n  classNames?: {\n    notificationBanner?: string;\n    root?: string;\n    wrapper?: string;\n    section?: string;\n    content?: string;\n    iconWrapped?: IconWrappedProps['classNames'];\n    icon?: IconProps['classNames'];\n  };\n};\n\nexport const NotificationBanner = ({\n  intent = 'info',\n  startSlot,\n  children,\n  classNames,\n  ...props\n}: NotificationBannerProps): ReactNode => {\n  const iconName = INTENT_ICON_NAME_MAP[intent];\n\n  return (\n    <div\n      {...props}\n      data-intent={intent}\n      className={cx(\n        classNames?.notificationBanner ?? notificationBanner(),\n        classNames?.root ?? notificationBannerRoot(),\n      )}\n    >\n      <div className={classNames?.wrapper ?? notificationBannerWrapper()}>\n        <div className={classNames?.section ?? notificationBannerSection()}>\n          {startSlot ? (\n            startSlot\n          ) : (\n            <IconWrapped\n              classNames={{\n                iconWrapped:\n                  classNames?.iconWrapped?.iconWrapped ??\n                  notificationBannerIconWrapped(),\n                root:\n                  classNames?.iconWrapped?.root ??\n                  notificationBannerIconWrappedRoot(),\n              }}\n            >\n              <Icon\n                name={iconName}\n                path='/icons/sprite-mage.svg'\n                classNames={{\n                  icon: classNames?.icon?.icon ?? notificationBannerIcon(),\n                  root: classNames?.icon?.root ?? notificationBannerIconRoot(),\n                  iconRaw: {\n                    iconRaw:\n                      classNames?.icon?.iconRaw?.iconRaw ??\n                      notificationBannerIconIconRaw(),\n                    root:\n                      classNames?.icon?.iconRaw?.root ??\n                      notificationBannerIconIconRawRoot(),\n                  },\n                }}\n              />\n            </IconWrapped>\n          )}\n        </div>\n        <div className={classNames?.content ?? notificationBannerContent()}>\n          {children}\n        </div>\n      </div>\n    </div>\n  );\n};\n"],"mappings":"imBA6BA,MAAM,EAAiE,CACrE,KAAM,uCACN,QAAS,wCACT,QAAS,0CAET,OAAQ,0CACT,CAoBY,GAAsB,CACjC,SAAS,OACT,YACA,WACA,aACA,GAAG,KACqC,CACxC,IAAM,EAAW,EAAqB,GAEtC,OACE,EAAC,MAAD,CACE,GAAI,EACJ,cAAa,EACb,UAAW,EACT,GAAY,oBAAsB,GAAoB,CACtD,GAAY,MAAQ,GAAwB,CAC7C,UAED,EAAC,MAAD,CAAK,UAAW,GAAY,SAAW,GAA2B,UAAlE,CACE,EAAC,MAAD,CAAK,UAAW,GAAY,SAAW,GAA2B,UAC/D,GAGC,EAAC,EAAD,CACE,WAAY,CACV,YACE,GAAY,aAAa,aACzB,GAA+B,CACjC,KACE,GAAY,aAAa,MACzB,GAAmC,CACtC,UAED,EAAC,EAAD,CACE,KAAM,EACN,KAAK,yBACL,WAAY,CACV,KAAM,GAAY,MAAM,MAAQ,GAAwB,CACxD,KAAM,GAAY,MAAM,MAAQ,GAA4B,CAC5D,QAAS,CACP,QACE,GAAY,MAAM,SAAS,SAC3B,GAA+B,CACjC,KACE,GAAY,MAAM,SAAS,MAC3B,GAAmC,CACtC,CACF,CACD,CAAA,CACU,CAAA,CAEZ,CAAA,CACN,EAAC,MAAD,CAAK,UAAW,GAAY,SAAW,GAA2B,CAC/D,WACG,CAAA,CACF,GACF,CAAA"}

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

@@ -1,5 +1,4 @@
 import { ButtonIconProps } from "../../buttons/button-icon/ButtonIcon.mjs";
-import "../../buttons/index.mjs";
 import * as react_jsx_runtime0 from "react/jsx-runtime";
 import { ReactNode } from "react";