material-plus-ui 1.2.0 → 1.3.1

package/dist/components/combobox/MPCombobox.js

@@ -1 +1,2 @@
-import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as l from"react";import{Combobox as i}from"@base-ui/react/combobox";import{Field as n}from"@base-ui/react/field";import{MPChip as t}from"../chip/MPChip";import{MPIcon as o}from"../icon/MPIcon";import{AddIcon as r,CheckIcon as s,ChevronDownIcon as m,CloseIcon as c}from"../../constants/icons";import{MPFieldLabel as d,MPFieldOutline as u,useFloatingLabel as p}from"../../internal/FieldOutline";import{fillMessage as h}from"../../internal/i18n";import{useMPLocale as f,useMPMessages as g}from"../../internal/locale";import{MPStateLayer as b}from"../../internal/StateLayer";import{MPSupportingText as x}from"../../internal/SupportingText";import{CONTROL_ICON as v,PROSE_TEXT as y,hasContent as N}from"../../internal/scale";import{FADE as w,PORTAL_LAYER as C}from"../../internal/surface";const L={xs:{padding:"ps-2 pe-1",height:"h-8"},sm:{padding:"ps-3 pe-1.5",height:"h-10"},md:{padding:"ps-4 pe-2",height:"h-14"},lg:{padding:"ps-4 pe-2",height:"h-16"},xl:{padding:"ps-5 pe-2.5",height:"h-18"}},j={xs:"min-h-8 py-1",sm:"min-h-10 py-1.5",md:"min-h-14 py-3",lg:"min-h-16 py-3",xl:"min-h-18 py-3"},I={xs:"xs",sm:"xs",md:"sm",lg:"md",xl:"md"};function S(e){return null==e?[]:Array.isArray(e)?e.slice():[e]}export function MPCombobox({items:z,multiple:M,value:O,defaultValue:V,onValueChange:k,onInputValueChange:P,allowCustom:q=!0,customLabel:A,clearable:T=!1,emptyMessage:$="No matches",limit:R,placeholder:_,label:F,floatingLabel:E=!0,description:B,errorMessage:G,startIcon:H,size:W="md",fullWidth:D=!1,required:J=!1,disabled:K=!1,readOnly:Q=!1,name:U,open:X,defaultOpen:Y,onOpenChange:Z,clearLabel:ee,openLabel:ae,locale:le,removeLabel:ie,inputRef:ne,id:te,className:oe,style:re}){const se=f(le),me=g("common",se),ce=N(G),de=!0===M,ue=L[W],pe=l.useId(),he=te??pe,fe=l.useMemo(()=>z.map(e=>({value:e.value,label:e.label??String(e.value),disabled:e.disabled})),[z]),[ge,be]=l.useState(()=>S(V)),xe=void 0===O?ge:S(O),[ve,ye]=l.useState(""),{shrunk:Ne,focusProps:we}=p({floating:E&&N(F),filled:xe.length>0||""!==ve,pinned:!!H}),Ce=l.useCallback(e=>fe.find(a=>a.value===e)??{value:e,label:String(e),custom:!0},[fe]),Le=ve.trim(),je=Le.toLocaleLowerCase(),Ie=""===Le||fe.some(e=>e.label.toLocaleLowerCase()===je||String(e.value).toLocaleLowerCase()===je)||xe.some(e=>String(e).toLocaleLowerCase()===je),Se=!q||Q||K||Ie?null:Le,ze=l.useMemo(()=>null===Se?fe:[...fe,{value:Se,label:Se,custom:!0}],[fe,Se]),Me=de?xe.map(Ce):xe.length>0?Ce(xe[0]):null;const Oe=["min-w-0 flex-1 self-stretch bg-transparent font-[inherit] text-inherit outline-none","placeholder:text-mp-on-surface-variant",K?"text-mp-on-surface/38 cursor-default":"text-mp-on-surface caret-mp-primary"].join(" "),Ve=["group rounded-mp-full relative flex size-8 shrink-0 cursor-pointer items-center justify-center","text-mp-on-surface-variant","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-1","focus-visible:outline-solid outline-none","disabled:text-mp-on-surface/38 disabled:cursor-default"].join(" "),ke=a=>e(i.Input,{ref:ne,id:he,placeholder:Ne?_:void 0,className:de?`${Oe} min-w-16 ${a?"ms-1.5":""}`:Oe});return a(n.Root,{disabled:K,invalid:ce,"data-mp-size":W,className:["mp-combobox group flex-col align-top",D?"flex w-full":"inline-flex w-fit",oe??""].filter(Boolean).join(" "),style:re,...we,children:[a(i.Root,{name:U,items:ze,multiple:de,value:Me,onValueChange:e=>{!function(e){void 0===O&&be(e),k?.(de?e:e[0]??null)}((null===e?[]:Array.isArray(e)?e:[e]).map(e=>e.value))},onInputValueChange:e=>{ye(e),P?.(e)},open:X,defaultOpen:Y,onOpenChange:e=>Z?.(e),autoHighlight:!0,itemToStringLabel:e=>e.label,itemToStringValue:e=>String(e.value),isItemEqualToValue:(e,a)=>e.value===a.value,limit:R,disabled:K,readOnly:Q,required:J,children:[a("div",{className:"relative w-full",children:[a(i.InputGroup,{className:["relative flex w-full items-center gap-2",ue.padding,de?j[W]:ue.height,y[W],K?"cursor-default":"cursor-text"].join(" "),children:[H?e("span",{className:["flex shrink-0 items-center",K?"text-mp-on-surface/38":"text-mp-on-surface-variant"].join(" "),children:H}):null,de?e(i.Chips,{className:"flex min-w-0 flex-1 flex-wrap items-center gap-1",children:e(i.Value,{children:n=>a(l.Fragment,{children:[n.map(a=>e(i.Chip,{render:e(t,{variant:ce?"outlined":"tonal",color:ce?"error":"primary",size:I[W],disabled:K,endIcon:Q||K?null:e(i.ChipRemove,{"aria-label":ie?ie(a.label):h(me.removeNamed,{label:a.label}),className:"flex cursor-pointer items-center opacity-70 hover:opacity-100",children:e(o,{icon:c,size:16})})}),children:a.label},String(a.value))),ke(n.length>0)]})})}):ke(!1),T&&!Q?a(i.Clear,{"aria-label":ee??me.clear,className:Ve,children:[e(b,{}),e(o,{icon:c,size:v[W]})]}):null,a(i.Trigger,{"aria-label":ae??me.open,className:Ve,children:[e(b,{}),e(i.Icon,{className:["relative flex items-center","transition-transform duration-(--mp-sys-motion-duration-short4)","data-popup-open:rotate-180"].join(" "),children:e(o,{icon:m,size:v[W]})})]})]}),e(u,{label:F,required:J,notched:Ne}),N(F)?e(d,{size:W,label:F,required:J,htmlFor:he,shrunk:Ne}):null]}),e(i.Portal,{children:e(i.Positioner,{className:C,sideOffset:4,children:a(i.Popup,{className:["mp-combobox__popup rounded-mp-xs shadow-mp-2 bg-mp-surface-container p-2","text-mp-on-surface w-[var(--anchor-width)] outline-none","max-h-[min(20rem,var(--available-height))] overflow-y-auto overscroll-contain",y[W],w].join(" "),children:[e(i.Empty,{className:"text-mp-on-surface-variant px-3 py-2 empty:hidden",children:$}),e(i.List,{children:l=>a(i.Item,{value:l,disabled:l.disabled,className:["mp-combobox__item group rounded-mp-xs relative flex cursor-pointer","items-center gap-3 py-2 ps-2 pe-3 select-none outline-none","transition-[background-color,color]","duration-(--mp-sys-motion-duration-short4)","data-selected:bg-mp-secondary-container","data-selected:text-mp-on-secondary-container","data-disabled:text-mp-on-surface/38 data-disabled:cursor-default"].join(" "),children:[e(b,{className:"group-data-highlighted:opacity-8 group-data-disabled:opacity-0"}),e("span",{className:"flex size-5 shrink-0 items-center justify-center",children:l.custom?e(o,{icon:r,size:18}):e(i.ItemIndicator,{children:e(o,{icon:s,size:18})})}),e("span",{className:"min-w-0 flex-1 truncate",children:l.custom?A?A(l.label):`Add “${l.label}”`:l.label})]},`${l.custom?"custom:":""}${String(l.value)}`)})]})})})]}),e(x,{description:B,errorMessage:G,className:ue.padding})]})}
+"use client";
+import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as l from"react";import{Combobox as i}from"@base-ui/react/combobox";import{Field as n}from"@base-ui/react/field";import{MPChip as t}from"../chip/MPChip.js";import{MPIcon as r}from"../icon/MPIcon.js";import{AddIcon as o,CheckIcon as s,ChevronDownIcon as m,CloseIcon as c}from"../../constants/icons.js";import{MPFieldLabel as d,MPFieldOutline as u,useFloatingLabel as p}from"../../internal/FieldOutline.js";import{fillMessage as h}from"../../internal/i18n.js";import{useMPLocale as f,useMPMessages as g}from"../../internal/locale.js";import{COMMON as b}from"../../internal/messages/common.js";import{MPStateLayer as x}from"../../internal/StateLayer.js";import{MPSupportingText as v}from"../../internal/SupportingText.js";import{CONTROL_ICON as y,PROSE_TEXT as j,hasContent as N}from"../../internal/scale.js";import{FADE as w,PORTAL_LAYER as C}from"../../internal/surface.js";const L={xs:{padding:"ps-2 pe-1",height:"h-8"},sm:{padding:"ps-3 pe-1.5",height:"h-10"},md:{padding:"ps-4 pe-2",height:"h-14"},lg:{padding:"ps-4 pe-2",height:"h-16"},xl:{padding:"ps-5 pe-2.5",height:"h-18"}},I={xs:"min-h-8 py-1",sm:"min-h-10 py-1.5",md:"min-h-14 py-3",lg:"min-h-16 py-3",xl:"min-h-18 py-3"},S={xs:"xs",sm:"xs",md:"sm",lg:"md",xl:"md"};function z(e){return null==e?[]:Array.isArray(e)?e.slice():[e]}export function MPCombobox({items:M,multiple:O,value:V,defaultValue:k,onValueChange:P,onInputValueChange:q,allowCustom:A=!0,customLabel:T,clearable:$=!1,emptyMessage:R="No matches",limit:_,placeholder:F,label:E,floatingLabel:B=!0,description:G,errorMessage:H,startIcon:W,size:D="md",fullWidth:J=!1,required:K=!1,disabled:Q=!1,readOnly:U=!1,name:X,open:Y,defaultOpen:Z,onOpenChange:ee,clearLabel:ae,openLabel:le,locale:ie,removeLabel:ne,inputRef:te,id:re,className:oe,style:se}){const me=f(ie),ce=g(b,me),de=N(H),ue=!0===O,pe=L[D],he=l.useId(),fe=re??he,ge=l.useMemo(()=>M.map(e=>({value:e.value,label:e.label??String(e.value),disabled:e.disabled})),[M]),[be,xe]=l.useState(()=>z(k)),ve=void 0===V?be:z(V),[ye,je]=l.useState(""),{shrunk:Ne,focusProps:we}=p({floating:B&&N(E),filled:ve.length>0||""!==ye,pinned:!!W}),Ce=l.useCallback(e=>ge.find(a=>a.value===e)??{value:e,label:String(e),custom:!0},[ge]),Le=ye.trim(),Ie=Le.toLocaleLowerCase(),Se=""===Le||ge.some(e=>e.label.toLocaleLowerCase()===Ie||String(e.value).toLocaleLowerCase()===Ie)||ve.some(e=>String(e).toLocaleLowerCase()===Ie),ze=!A||U||Q||Se?null:Le,Me=l.useMemo(()=>null===ze?ge:[...ge,{value:ze,label:ze,custom:!0}],[ge,ze]),Oe=ue?ve.map(Ce):ve.length>0?Ce(ve[0]):null;const Ve=/*@__PURE__*/["min-w-0 flex-1 self-stretch bg-transparent font-[inherit] text-inherit outline-none","placeholder:text-mp-on-surface-variant",Q?"text-mp-on-surface/38 cursor-default":"text-mp-on-surface caret-mp-primary"].join(" "),ke=/*@__PURE__*/["group rounded-mp-full relative flex size-8 shrink-0 cursor-pointer items-center justify-center","text-mp-on-surface-variant","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-1","focus-visible:outline-solid outline-none","disabled:text-mp-on-surface/38 disabled:cursor-default"].join(" "),Pe=a=>e(i.Input,{ref:te,id:fe,placeholder:Ne?F:void 0,className:ue?`${Ve} min-w-16 ${a?"ms-1.5":""}`:Ve});return a(n.Root,{disabled:Q,invalid:de,"data-mp-size":D,className:["mp-combobox group flex-col align-top",J?"flex w-full":"inline-flex w-fit",oe??""].filter(Boolean).join(" "),style:se,...we,children:[a(i.Root,{name:X,items:Me,multiple:ue,value:Oe,onValueChange:e=>{!function(e){void 0===V&&xe(e),P?.(ue?e:e[0]??null)}((null===e?[]:Array.isArray(e)?e:[e]).map(e=>e.value))},onInputValueChange:e=>{je(e),q?.(e)},open:Y,defaultOpen:Z,onOpenChange:e=>ee?.(e),autoHighlight:!0,itemToStringLabel:e=>e.label,itemToStringValue:e=>String(e.value),isItemEqualToValue:(e,a)=>e.value===a.value,limit:_,disabled:Q,readOnly:U,required:K,children:[a("div",{className:"relative w-full",children:[a(i.InputGroup,{className:["relative flex w-full items-center gap-2",pe.padding,ue?I[D]:pe.height,j[D],Q?"cursor-default":"cursor-text"].join(" "),children:[W?e("span",{className:["flex shrink-0 items-center",Q?"text-mp-on-surface/38":"text-mp-on-surface-variant"].join(" "),children:W}):null,ue?e(i.Chips,{className:"flex min-w-0 flex-1 flex-wrap items-center gap-1",children:e(i.Value,{children:n=>a(l.Fragment,{children:[n.map(a=>e(i.Chip,{render:e(t,{variant:de?"outlined":"tonal",color:de?"error":"primary",size:S[D],disabled:Q,endIcon:U||Q?null:e(i.ChipRemove,{"aria-label":ne?ne(a.label):h(ce.removeNamed,{label:a.label}),className:"flex cursor-pointer items-center opacity-70 hover:opacity-100",children:e(r,{icon:c,size:16})})}),children:a.label},String(a.value))),Pe(n.length>0)]})})}):Pe(!1),$&&!U?a(i.Clear,{"aria-label":ae??ce.clear,className:ke,children:[e(x,{}),e(r,{icon:c,size:y[D]})]}):null,a(i.Trigger,{"aria-label":le??ce.open,className:ke,children:[e(x,{}),e(i.Icon,{className:["relative flex items-center","transition-transform duration-(--mp-sys-motion-duration-short4)","data-popup-open:rotate-180"].join(" "),children:e(r,{icon:m,size:y[D]})})]})]}),e(u,{label:E,required:K,notched:Ne}),N(E)?e(d,{size:D,label:E,required:K,htmlFor:fe,shrunk:Ne}):null]}),e(i.Portal,{children:e(i.Positioner,{className:C,sideOffset:4,children:a(i.Popup,{className:["mp-combobox__popup rounded-mp-xs shadow-mp-2 bg-mp-surface-container p-2","text-mp-on-surface w-[var(--anchor-width)] outline-none","max-h-[min(20rem,var(--available-height))] overflow-y-auto overscroll-contain",j[D],w].join(" "),children:[e(i.Empty,{className:"text-mp-on-surface-variant px-3 py-2 empty:hidden",children:R}),e(i.List,{children:l=>a(i.Item,{value:l,disabled:l.disabled,className:["mp-combobox__item group rounded-mp-xs relative flex cursor-pointer","items-center gap-3 py-2 ps-2 pe-3 select-none outline-none","transition-[background-color,color]","duration-(--mp-sys-motion-duration-short4)","data-selected:bg-mp-secondary-container","data-selected:text-mp-on-secondary-container","data-disabled:text-mp-on-surface/38 data-disabled:cursor-default"].join(" "),children:[e(x,{className:"group-data-highlighted:opacity-8 group-data-disabled:opacity-0"}),e("span",{className:"flex size-5 shrink-0 items-center justify-center",children:l.custom?e(r,{icon:o,size:18}):e(i.ItemIndicator,{children:e(r,{icon:s,size:18})})}),e("span",{className:"min-w-0 flex-1 truncate",children:l.custom?T?T(l.label):`Add “${l.label}”`:l.label})]},`${l.custom?"custom:":""}${String(l.value)}`)})]})})})]}),e(v,{description:G,errorMessage:H,className:pe.padding})]})}

package/dist/components/combobox/index.d.ts

@@ -1,2 +1,2 @@
-export { MPCombobox } from './MPCombobox';
-export type { MPComboboxOption, MPComboboxProps, MPComboboxValue } from './MPCombobox';
+export { MPCombobox } from './MPCombobox.js';
+export type { MPComboboxOption, MPComboboxProps, MPComboboxValue } from './MPCombobox.js';

package/dist/components/combobox/index.js

@@ -1 +1 @@
-export{MPCombobox}from"./MPCombobox";
+export{MPCombobox}from"./MPCombobox.js";

package/dist/components/container/MPContainer.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { useRender } from '@base-ui/react/use-render';
-import type { MPSize } from '../../types';
+import type { MPSize } from '../../types.js';
 export interface MPContainerProps extends React.ComponentPropsWithoutRef<'div'> {
     /**
      * How wide the content is allowed to get, on a ladder pinned to MD3's window

package/dist/components/container/MPContainer.js

@@ -1 +1 @@
-import*as e from"react";import{useRender as r}from"@base-ui/react/use-render";import{SHEET_PAD_X as m}from"../../internal/scale";const a={xs:"max-w-[30rem]",sm:"max-w-[37.5rem]",md:"max-w-[52.5rem]",lg:"max-w-[75rem]",xl:"max-w-[100rem]"};export const MPContainer=e.forwardRef(function({maxWidth:e="none",padded:n=!0,size:o="md",centered:t=!0,render:d,className:i,children:s,...c},l){return r({render:d,ref:l,props:{"data-mp-size":o,className:["mp-container block w-full","box-border","none"===e?"":a[e],t?"mx-auto":"",n?m[o]:"",i??""].filter(Boolean).join(" "),children:s,...c}})});
+import*as e from"react";import{useRender as r}from"@base-ui/react/use-render";import{SHEET_PAD_X as m}from"../../internal/scale.js";const a={xs:"max-w-[30rem]",sm:"max-w-[37.5rem]",md:"max-w-[52.5rem]",lg:"max-w-[75rem]",xl:"max-w-[100rem]"};export const MPContainer=/*@__PURE__*/e.forwardRef(function({maxWidth:e="none",padded:n=!0,size:o="md",centered:t=!0,render:s,className:d,children:i,...c},l){return r({render:s,ref:l,props:{"data-mp-size":o,className:["mp-container block w-full","box-border","none"===e?"":a[e],t?"mx-auto":"",n?m[o]:"",d??""].filter(Boolean).join(" "),children:i,...c}})});

package/dist/components/container/index.d.ts

@@ -1,2 +1,2 @@
-export { MPContainer } from './MPContainer';
-export type { MPContainerProps } from './MPContainer';
+export { MPContainer } from './MPContainer.js';
+export type { MPContainerProps } from './MPContainer.js';

package/dist/components/container/index.js

@@ -1 +1 @@
-export{MPContainer}from"./MPContainer";
+export{MPContainer}from"./MPContainer.js";

package/dist/components/date-picker/MPDatePicker.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
-import { type MPPickerLabels } from '../../internal/Calendar';
-import { type MPPickerShellProps } from '../../internal/Picker';
-import type { MPWeekday } from '../../types';
+import { type MPPickerLabels } from '../../internal/Calendar.js';
+import { type MPPickerShellProps } from '../../internal/Picker.js';
+import type { MPWeekday } from '../../types.js';
 export interface MPDatePickerProps extends MPPickerShellProps {
     /** The chosen day. Use with `onValueChange` for a controlled picker. */
     value?: Date | null;

package/dist/components/date-picker/MPDatePicker.js

@@ -1 +1,2 @@
-import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as l from"react";import{MPButton as o}from"../button/MPButton";import{MPIcon as t}from"../icon/MPIcon";import{CalendarIcon as n}from"../../constants/icons";import{MPCalendar as r}from"../../internal/Calendar";import{FOOTER_SIZE as i,MPPickerFooter as s,MPPickerShell as c,useDisplaySamples as d}from"../../internal/Picker";import{useMPLocale as m,useMPMessages as u}from"../../internal/locale";import{CONTROL_ICON as p}from"../../internal/scale";import{formatDate as f,isDayOutside as h,isValidDate as b,localeWeekStart as v,mergeDateAndTime as x,startOfDay as D,startOfMonth as g,toISODate as k,today as y,withPlaceholder as C}from"../../internal/date";export const MPDatePicker=l.forwardRef(function({value:O,defaultValue:S,onValueChange:z,open:M,defaultOpen:P,onOpenChange:w,defaultMonth:j,minDate:I,maxDate:V,shouldDisableDate:B,locale:R,weekStartsOn:E,format:F={dateStyle:"medium"},placeholder:N,clearable:T=!1,showTodayButton:q=!0,closeOnSelect:A=!0,labels:G,name:H,size:J="md",color:K="primary",readOnly:L=!1,disabled:Q=!1,startIcon:U,...W},X){const Y=m(R),Z=u("picker",Y,G),$=E??v(Y),[_,ee]=l.useState(S??null),ae=void 0!==O?O:_,[le,oe]=l.useState(P??!1),te=M??le,[ne,re]=l.useState(()=>g(b(ae)?ae:j??y()));l.useEffect(()=>{te&&re(g(b(ae)?ae:j??y()))},[te]);const ie=e=>{e&&(L||Q)||(void 0===M&&oe(e),w?.(e))},se=e=>{void 0===O&&ee(e),z?.(e)},ce=e=>{const a=b(ae)?x(e,ae):D(e);se(a),re(g(a)),A&&ie(!1)},de=y(),me=h(de,I,V)||(B?.(de)??!1),ue=q||T,pe=C(d(Y,F),N);return e(c,{...W,slug:"date-picker",size:J,color:K,readOnly:L,disabled:Q,triggerRef:X,startIcon:void 0===U?e(t,{icon:n,size:p[J]}):U,display:b(ae)?f(ae,Y,F):N??"",samples:pe,empty:!b(ae),clearable:T,onClear:()=>se(null),open:te,onOpenChange:ie,labels:Z,hiddenValues:H?[{name:H,value:b(ae)?k(ae):""}]:void 0,children:a("div",{className:"flex flex-col "+(ue?"gap-1.5":""),children:[e(r,{size:J,color:K,locale:Y,weekStartsOn:$,month:ne,onMonthChange:re,selected:[ae],onSelect:ce,minDate:I,maxDate:V,shouldDisableDate:B,labels:Z,autoFocus:!0}),ue?a(s,{children:[T?e(o,{variant:"text",size:i[J],color:K,onClick:()=>{se(null),ie(!1)},children:Z.clear}):null,q?e(o,{variant:"text",size:i[J],color:K,disabled:me,onClick:()=>ce(de),children:Z.today}):null]}):null]})})});
+"use client";
+import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as l from"react";import{MPButton as o}from"../button/MPButton.js";import{MPIcon as t}from"../icon/MPIcon.js";import{CalendarIcon as n}from"../../constants/icons.js";import{MPCalendar as r}from"../../internal/Calendar.js";import{FOOTER_SIZE as s,MPPickerFooter as i,MPPickerShell as c,useDisplaySamples as m}from"../../internal/Picker.js";import{useMPLocale as d,useMPMessages as u}from"../../internal/locale.js";import{PICKER as p}from"../../internal/messages/picker.js";import{CONTROL_ICON as f}from"../../internal/scale.js";import{formatDate as h,isDayOutside as j,isValidDate as b,localeWeekStart as v,mergeDateAndTime as x,startOfDay as g,startOfMonth as D,toISODate as k,today as y,withPlaceholder as C}from"../../internal/date.js";export const MPDatePicker=/*@__PURE__*/l.forwardRef(function({value:O,defaultValue:S,onValueChange:z,open:M,defaultOpen:P,onOpenChange:w,defaultMonth:I,minDate:V,maxDate:B,shouldDisableDate:R,locale:E,weekStartsOn:F,format:N={dateStyle:"medium"},placeholder:T,clearable:q=!1,showTodayButton:A=!0,closeOnSelect:G=!0,labels:H,name:J,size:K="md",color:L="primary",readOnly:Q=!1,disabled:U=!1,startIcon:W,...X},Y){const Z=d(E),$=u(p,Z,H),_=F??v(Z),[ee,ae]=l.useState(S??null),le=void 0!==O?O:ee,[oe,te]=l.useState(P??!1),ne=M??oe,[re,se]=l.useState(()=>D(b(le)?le:I??y()));l.useEffect(()=>{ne&&se(D(b(le)?le:I??y()))},[ne]);const ie=e=>{e&&(Q||U)||(void 0===M&&te(e),w?.(e))},ce=e=>{void 0===O&&ae(e),z?.(e)},me=e=>{const a=b(le)?x(e,le):g(e);ce(a),se(D(a)),G&&ie(!1)},de=y(),ue=j(de,V,B)||(R?.(de)??!1),pe=A||q,fe=C(m(Z,N),T);return e(c,{...X,slug:"date-picker",size:K,color:L,readOnly:Q,disabled:U,triggerRef:Y,startIcon:void 0===W?e(t,{icon:n,size:f[K]}):W,display:b(le)?h(le,Z,N):T??"",samples:fe,empty:!b(le),clearable:q,onClear:()=>ce(null),open:ne,onOpenChange:ie,labels:$,hiddenValues:J?[{name:J,value:b(le)?k(le):""}]:void 0,children:a("div",{className:"flex flex-col "+(pe?"gap-1.5":""),children:[e(r,{size:K,color:L,locale:Z,weekStartsOn:_,month:re,onMonthChange:se,selected:[le],onSelect:me,minDate:V,maxDate:B,shouldDisableDate:R,labels:$,autoFocus:!0}),pe?a(i,{children:[q?e(o,{variant:"text",size:s[K],color:L,onClick:()=>{ce(null),ie(!1)},children:$.clear}):null,A?e(o,{variant:"text",size:s[K],color:L,disabled:ue,onClick:()=>me(de),children:$.today}):null]}):null]})})});

package/dist/components/date-picker/index.d.ts

@@ -1,2 +1,2 @@
-export { MPDatePicker } from './MPDatePicker';
-export type { MPDatePickerProps } from './MPDatePicker';
+export { MPDatePicker } from './MPDatePicker.js';
+export type { MPDatePickerProps } from './MPDatePicker.js';

package/dist/components/date-picker/index.js

@@ -1 +1 @@
-export{MPDatePicker}from"./MPDatePicker";
+export{MPDatePicker}from"./MPDatePicker.js";

package/dist/components/date-range-picker/MPDateRangePicker.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
-import { type MPPickerLabels } from '../../internal/Calendar';
-import { type MPPickerShellProps } from '../../internal/Picker';
-import type { MPWeekday } from '../../types';
+import { type MPPickerLabels } from '../../internal/Calendar.js';
+import { type MPPickerShellProps } from '../../internal/Picker.js';
+import type { MPWeekday } from '../../types.js';
 /**
  * Two ends, either of which may be missing.
  *

package/dist/components/date-range-picker/MPDateRangePicker.js

@@ -1 +1,2 @@
-import{jsx as e,jsxs as l}from"react/jsx-runtime";import*as n from"react";import{MPButton as a}from"../button/MPButton";import{MPIcon as t}from"../icon/MPIcon";import{ArrowRightIcon as r,CalendarIcon as s}from"../../constants/icons";import{MPCalendar as o}from"../../internal/Calendar";import{FOOTER_SIZE as i,MPPickerFooter as c,MPPickerShell as u,useDisplaySamples as m}from"../../internal/Picker";import{useMPLocale as d,useMPMessages as p}from"../../internal/locale";import{MPWidthSizer as h}from"../../internal/WidthSizer";import{CONTROL_ICON as f,META_TEXT as v}from"../../internal/scale";import{addMonths as x,compareDay as g,formatDate as b,isValidDate as w,localeWeekStart as N,startOfDay as S,startOfMonth as C,toISODate as y,today as D,withPlaceholder as k}from"../../internal/date";const O={start:null,end:null};export const MPDateRangePicker=n.forwardRef(function({value:P,defaultValue:z,onValueChange:M,open:j,defaultOpen:B,onOpenChange:I,defaultMonth:R,minDate:V,maxDate:E,shouldDisableDate:F,locale:W,weekStartsOn:$,format:_={dateStyle:"medium"},monthCount:q=2,startPlaceholder:A,endPlaceholder:G,presets:H,clearable:J=!1,closeOnSelect:K=!0,labels:L,name:Q,size:T="md",color:U="primary",readOnly:X=!1,disabled:Y=!1,startIcon:Z,...ee},le){const ne=d(W),ae=p("picker",ne,L),te=$??N(ne),[re,se]=n.useState(z??O),oe=void 0!==P?P??O:re,ie=w(oe.start)?oe.start:null,ce=w(oe.end)?oe.end:null,[ue,me]=n.useState(B??!1),de=j??ue,[pe,he]=n.useState(null),[fe,ve]=n.useState(null),[xe,ge]=n.useState(()=>C(ie??R??D()));n.useEffect(()=>{de?ge(C(ie??R??D())):(he(null),ve(null))},[de]);const be=e=>{e&&(X||Y)||(void 0===j&&me(e),I?.(e))},we=e=>{void 0===P&&se(e),M?.(e)},Ne=pe??ie,Se=null!==pe?fe:ce,Ce=(l,n)=>w(l)?b(l,ne,_):e("span",{className:"text-mp-on-surface-variant",children:n??""}),ye=x(xe,1),De=2===q,ke=m(ne,_),Oe=null!==pe?ae.end:null===ie?ae.start:null,Pe={size:T,color:U,locale:ne,weekStartsOn:te,selected:[ie,ce,pe],rangeStart:Ne,rangeEnd:Se,onSelect:e=>{const l=S(e);if(null===pe)return he(l),ve(l),void we({start:l,end:null});const[n,a]=g(l,pe)<0?[l,pe]:[pe,l];he(null),ve(null),we({start:n,end:a}),K&&be(!1)},onPreviewChange:e=>{null!==pe&&ve(e??pe)},minDate:V,maxDate:E,shouldDisableDate:F,showOutsideDays:!1,labels:ae};return e(u,{...ee,slug:"date-range-picker",size:T,color:U,readOnly:X,disabled:Y,triggerRef:le,startIcon:void 0===Z?e(t,{icon:s,size:f[T]}):Z,display:l("span",{className:"flex min-w-0 items-center gap-1.5",children:[l("span",{className:"flex min-w-0 flex-col",children:[e("span",{className:"truncate",children:Ce(ie,A)}),e(h,{samples:k(ke,A)})]}),e("span",{"aria-hidden":"true",className:"text-mp-on-surface-variant flex shrink-0 items-center rtl:rotate-180",children:e(t,{icon:r,size:f[T]})}),l("span",{className:"flex min-w-0 flex-col",children:[e("span",{className:"truncate",children:Ce(ce,G)}),e(h,{samples:k(ke,G)})]})]}),empty:null===ie&&null===ce,clearable:J,onClear:()=>we(O),open:de,onOpenChange:be,labels:ae,hiddenValues:Q?[{name:Q,value:ie?y(ie):""},{name:Q,value:ce?y(ce):""}]:void 0,children:l("div",{className:"flex flex-col gap-1.5",children:[l("div",{className:"flex items-stretch gap-2",children:[H&&H.length>0?e("div",{className:"border-mp-outline-variant flex max-h-[calc(var(--_mp-cell,2.5rem)*8)] flex-col overflow-y-auto border-e pe-1.5",children:H.map((l,n)=>e(a,{variant:"text",size:i[T],color:U,className:"justify-start whitespace-nowrap",onClick:()=>(e=>{const l="function"==typeof e.value?e.value():e.value;he(null),ve(null),we(l),w(l.start)&&ge(C(l.start)),K&&be(!1)})(l),children:l.label},n))}):null,e(o,{...Pe,month:xe,onMonthChange:ge,showNextButton:!De,autoFocus:!0}),De?e(o,{...Pe,month:ye,onMonthChange:e=>ge(x(e,-1)),showPreviousButton:!1}):null]}),J||null!==Oe?l(c,{children:[null!==Oe?e("span",{className:`text-mp-on-surface-variant me-auto ${v}`,children:Oe}):null,J?e(a,{variant:"text",size:i[T],color:U,onClick:()=>{he(null),ve(null),we(O),be(!1)},children:ae.clear}):null]}):null]})})});
+"use client";
+import{jsx as e,jsxs as l}from"react/jsx-runtime";import*as n from"react";import{MPButton as a}from"../button/MPButton.js";import{MPIcon as t}from"../icon/MPIcon.js";import{ArrowRightIcon as r,CalendarIcon as s}from"../../constants/icons.js";import{MPCalendar as o}from"../../internal/Calendar.js";import{FOOTER_SIZE as i,MPPickerFooter as c,MPPickerShell as u,useDisplaySamples as m}from"../../internal/Picker.js";import{useMPLocale as d,useMPMessages as p}from"../../internal/locale.js";import{PICKER as h}from"../../internal/messages/picker.js";import{MPWidthSizer as f}from"../../internal/WidthSizer.js";import{CONTROL_ICON as v,META_TEXT as x}from"../../internal/scale.js";import{addMonths as g,compareDay as j,formatDate as b,isValidDate as w,localeWeekStart as N,startOfDay as S,startOfMonth as C,toISODate as y,today as D,withPlaceholder as k}from"../../internal/date.js";const O={start:null,end:null};export const MPDateRangePicker=/*@__PURE__*/n.forwardRef(function({value:P,defaultValue:z,onValueChange:M,open:B,defaultOpen:I,onOpenChange:R,defaultMonth:V,minDate:E,maxDate:F,shouldDisableDate:W,locale:$,weekStartsOn:_,format:q={dateStyle:"medium"},monthCount:A=2,startPlaceholder:G,endPlaceholder:H,presets:J,clearable:K=!1,closeOnSelect:L=!0,labels:Q,name:T,size:U="md",color:X="primary",readOnly:Y=!1,disabled:Z=!1,startIcon:ee,...le},ne){const ae=d($),te=p(h,ae,Q),re=_??N(ae),[se,oe]=n.useState(z??O),ie=void 0!==P?P??O:se,ce=w(ie.start)?ie.start:null,ue=w(ie.end)?ie.end:null,[me,de]=n.useState(I??!1),pe=B??me,[he,fe]=n.useState(null),[ve,xe]=n.useState(null),[ge,je]=n.useState(()=>C(ce??V??D()));n.useEffect(()=>{pe?je(C(ce??V??D())):(fe(null),xe(null))},[pe]);const be=e=>{e&&(Y||Z)||(void 0===B&&de(e),R?.(e))},we=e=>{void 0===P&&oe(e),M?.(e)},Ne=he??ce,Se=null!==he?ve:ue,Ce=(l,n)=>w(l)?b(l,ae,q):e("span",{className:"text-mp-on-surface-variant",children:n??""}),ye=g(ge,1),De=2===A,ke=m(ae,q),Oe=null!==he?te.end:null===ce?te.start:null,Pe={size:U,color:X,locale:ae,weekStartsOn:re,selected:[ce,ue,he],rangeStart:Ne,rangeEnd:Se,onSelect:e=>{const l=S(e);if(null===he)return fe(l),xe(l),void we({start:l,end:null});const[n,a]=j(l,he)<0?[l,he]:[he,l];fe(null),xe(null),we({start:n,end:a}),L&&be(!1)},onPreviewChange:e=>{null!==he&&xe(e??he)},minDate:E,maxDate:F,shouldDisableDate:W,showOutsideDays:!1,labels:te};return e(u,{...le,slug:"date-range-picker",size:U,color:X,readOnly:Y,disabled:Z,triggerRef:ne,startIcon:void 0===ee?e(t,{icon:s,size:v[U]}):ee,display:l("span",{className:"flex min-w-0 items-center gap-1.5",children:[l("span",{className:"flex min-w-0 flex-col",children:[e("span",{className:"truncate",children:Ce(ce,G)}),e(f,{samples:k(ke,G)})]}),e("span",{"aria-hidden":"true",className:"text-mp-on-surface-variant flex shrink-0 items-center rtl:rotate-180",children:e(t,{icon:r,size:v[U]})}),l("span",{className:"flex min-w-0 flex-col",children:[e("span",{className:"truncate",children:Ce(ue,H)}),e(f,{samples:k(ke,H)})]})]}),empty:null===ce&&null===ue,clearable:K,onClear:()=>we(O),open:pe,onOpenChange:be,labels:te,hiddenValues:T?[{name:T,value:ce?y(ce):""},{name:T,value:ue?y(ue):""}]:void 0,children:l("div",{className:"flex flex-col gap-1.5",children:[l("div",{className:"flex items-stretch gap-2",children:[J&&J.length>0?e("div",{className:"border-mp-outline-variant flex max-h-[calc(var(--_mp-cell,2.5rem)*8)] flex-col overflow-y-auto border-e pe-1.5",children:J.map((l,n)=>e(a,{variant:"text",size:i[U],color:X,className:"justify-start whitespace-nowrap",onClick:()=>(e=>{const l="function"==typeof e.value?e.value():e.value;fe(null),xe(null),we(l),w(l.start)&&je(C(l.start)),L&&be(!1)})(l),children:l.label},n))}):null,e(o,{...Pe,month:ge,onMonthChange:je,showNextButton:!De,autoFocus:!0}),De?e(o,{...Pe,month:ye,onMonthChange:e=>je(g(e,-1)),showPreviousButton:!1}):null]}),K||null!==Oe?l(c,{children:[null!==Oe?e("span",{className:`text-mp-on-surface-variant me-auto ${x}`,children:Oe}):null,K?e(a,{variant:"text",size:i[U],color:X,onClick:()=>{fe(null),xe(null),we(O),be(!1)},children:te.clear}):null]}):null]})})});

package/dist/components/date-range-picker/index.d.ts

@@ -1,2 +1,2 @@
-export { MPDateRangePicker } from './MPDateRangePicker';
-export type { MPDateRange, MPDateRangePickerProps, MPDateRangePreset } from './MPDateRangePicker';
+export { MPDateRangePicker } from './MPDateRangePicker.js';
+export type { MPDateRange, MPDateRangePickerProps, MPDateRangePreset } from './MPDateRangePicker.js';

package/dist/components/date-range-picker/index.js

@@ -1 +1 @@
-export{MPDateRangePicker}from"./MPDateRangePicker";
+export{MPDateRangePicker}from"./MPDateRangePicker.js";

package/dist/components/date-time-picker/MPDateTimePicker.d.ts

@@ -1,8 +1,8 @@
 import * as React from 'react';
-import { type MPPickerLabels } from '../../internal/Calendar';
-import { type MPPickerShellProps } from '../../internal/Picker';
-import { type MPTimeUnit } from '../../internal/date';
-import type { MPWeekday } from '../../types';
+import { type MPPickerLabels } from '../../internal/Calendar.js';
+import { type MPPickerShellProps } from '../../internal/Picker.js';
+import { type MPTimeUnit } from '../../internal/date.js';
+import type { MPWeekday } from '../../types.js';
 export interface MPDateTimePickerProps extends MPPickerShellProps {
     /** The chosen moment. Use with `onValueChange` for a controlled picker. */
     value?: Date | null;

package/dist/components/date-time-picker/MPDateTimePicker.js

@@ -1 +1,2 @@
-import{jsx as e,jsxs as o}from"react/jsx-runtime";import*as t from"react";import{MPButton as l}from"../button/MPButton";import{MPIcon as a}from"../icon/MPIcon";import{CalendarIcon as n}from"../../constants/icons";import{MPCalendar as r,MPTimeGrid as i}from"../../internal/Calendar";import{FOOTER_SIZE as s,MPPickerDivider as c,MPPickerFooter as d,MPPickerShell as m,useDisplaySamples as u}from"../../internal/Picker";import{useMPLocale as h,useMPMessages as p}from"../../internal/locale";import{CONTROL_ICON as f}from"../../internal/scale";import{formatDate as S,isDayOutside as b,isHour12 as g,isValidDate as v,localeWeekStart as D,mergeDateAndTime as x,startOfDay as C,startOfMonth as k,timeUnitSpan as w,toISODateTime as z,today as O,withPlaceholder as y,withTime as T}from"../../internal/date";export const MPDateTimePicker=t.forwardRef(function({value:M,defaultValue:P,onValueChange:j,open:I,defaultOpen:N,onOpenChange:V,defaultMonth:B,minDate:R,maxDate:E,shouldDisableDate:F,shouldDisableTime:q,locale:A,weekStartsOn:G,format:H,hour12:J,showSeconds:K=!1,hourStep:L=1,minuteStep:Q=1,secondStep:U=1,placeholder:W,clearable:X=!1,showNowButton:Y=!0,closeOnSelect:Z=!1,labels:$,name:_,size:ee="md",color:oe="primary",readOnly:te=!1,disabled:le=!1,startIcon:ae,...ne},re){const ie=h(A),se=p("picker",ie,$),ce=G??D(ie),de=J??g(ie),[me,ue]=t.useState(P??null),he=void 0!==M?M:me,[pe,fe]=t.useState(N??!1),Se=I??pe,[be,ge]=t.useState(()=>k(v(he)?he:B??O()));t.useEffect(()=>{Se&&ge(k(v(he)?he:B??O()))},[Se]);const ve=e=>{e&&(te||le)||(void 0===I&&fe(e),V?.(e))},De=e=>{void 0===M&&ue(e),j?.(e)},xe=t.useCallback((e,o)=>{const[t,l]=w(o,e),a=C(e).getTime();return!!(v(R)&&a+1e3*l<R.getTime())||(!!(v(E)&&a+1e3*t>E.getTime())||(q?.(e,o)??!1))},[R,E,q]),Ce=H??{dateStyle:"medium",timeStyle:"short",hour12:de},ke=new Date,we=T(ke,{seconds:K?ke.getSeconds():0}),ze=b(we,R,E)||(F?.(we)??!1)||xe(we,"second"),Oe=y(u(ie,Ce),W);return e(m,{...ne,slug:"date-time-picker",size:ee,color:oe,readOnly:te,disabled:le,triggerRef:re,startIcon:void 0===ae?e(a,{icon:n,size:f[ee]}):ae,display:v(he)?S(he,ie,Ce):W??"",samples:Oe,empty:!v(he),clearable:X,onClear:()=>De(null),open:Se,onOpenChange:ve,labels:se,hiddenValues:_?[{name:_,value:v(he)?z(he,K):""}]:void 0,children:o("div",{className:"flex flex-col gap-1.5",children:[o("div",{className:"flex items-stretch gap-2",children:[e(r,{size:ee,color:oe,locale:ie,weekStartsOn:ce,month:be,onMonthChange:ge,selected:[he],onSelect:e=>{const o=v(he)?x(e,he):C(e);De(o),ge(k(o)),Z&&ve(!1)},minDate:R,maxDate:E,shouldDisableDate:F,labels:se,autoFocus:!0}),e(c,{}),e(i,{size:ee,locale:ie,value:v(he)?he:null,referenceDate:v(he)?he:O(),onChange:De,hour12:de,showSeconds:K,hourStep:L,minuteStep:Q,secondStep:U,shouldDisableTime:xe,labels:se})]}),o(d,{children:[X?e(l,{variant:"text",size:s[ee],color:oe,onClick:()=>{De(null),ve(!1)},children:se.clear}):null,Y?e(l,{variant:"text",size:s[ee],color:oe,disabled:ze,onClick:()=>{De(we),ge(k(we))},children:se.now}):null,e(l,{variant:"filled",size:s[ee],color:oe,onClick:()=>ve(!1),children:se.done})]})]})})});
+"use client";
+import{jsx as e,jsxs as o}from"react/jsx-runtime";import*as t from"react";import{MPButton as l}from"../button/MPButton.js";import{MPIcon as a}from"../icon/MPIcon.js";import{CalendarIcon as n}from"../../constants/icons.js";import{MPCalendar as s,MPTimeGrid as r}from"../../internal/Calendar.js";import{FOOTER_SIZE as i,MPPickerDivider as c,MPPickerFooter as m,MPPickerShell as d,useDisplaySamples as u}from"../../internal/Picker.js";import{useMPLocale as p,useMPMessages as h}from"../../internal/locale.js";import{PICKER as f}from"../../internal/messages/picker.js";import{CONTROL_ICON as S}from"../../internal/scale.js";import{formatDate as b,isDayOutside as g,isHour12 as v,isValidDate as D,localeWeekStart as j,mergeDateAndTime as x,startOfDay as C,startOfMonth as k,timeUnitSpan as w,toISODateTime as z,today as O,withPlaceholder as y,withTime as T}from"../../internal/date.js";export const MPDateTimePicker=/*@__PURE__*/t.forwardRef(function({value:M,defaultValue:P,onValueChange:I,open:N,defaultOpen:V,onOpenChange:B,defaultMonth:R,minDate:E,maxDate:F,shouldDisableDate:q,shouldDisableTime:A,locale:G,weekStartsOn:H,format:J,hour12:K,showSeconds:L=!1,hourStep:Q=1,minuteStep:U=1,secondStep:W=1,placeholder:X,clearable:Y=!1,showNowButton:Z=!0,closeOnSelect:$=!1,labels:_,name:ee,size:oe="md",color:te="primary",readOnly:le=!1,disabled:ae=!1,startIcon:ne,...se},re){const ie=p(G),ce=h(f,ie,_),me=H??j(ie),de=K??v(ie),[ue,pe]=t.useState(P??null),he=void 0!==M?M:ue,[fe,Se]=t.useState(V??!1),be=N??fe,[ge,ve]=t.useState(()=>k(D(he)?he:R??O()));t.useEffect(()=>{be&&ve(k(D(he)?he:R??O()))},[be]);const De=e=>{e&&(le||ae)||(void 0===N&&Se(e),B?.(e))},je=e=>{void 0===M&&pe(e),I?.(e)},xe=t.useCallback((e,o)=>{const[t,l]=w(o,e),a=C(e).getTime();return!!(D(E)&&a+1e3*l<E.getTime())||(!!(D(F)&&a+1e3*t>F.getTime())||(A?.(e,o)??!1))},[E,F,A]),Ce=J??{dateStyle:"medium",timeStyle:"short",hour12:de},ke=new Date,we=T(ke,{seconds:L?ke.getSeconds():0}),ze=g(we,E,F)||(q?.(we)??!1)||xe(we,"second"),Oe=y(u(ie,Ce),X);return e(d,{...se,slug:"date-time-picker",size:oe,color:te,readOnly:le,disabled:ae,triggerRef:re,startIcon:void 0===ne?e(a,{icon:n,size:S[oe]}):ne,display:D(he)?b(he,ie,Ce):X??"",samples:Oe,empty:!D(he),clearable:Y,onClear:()=>je(null),open:be,onOpenChange:De,labels:ce,hiddenValues:ee?[{name:ee,value:D(he)?z(he,L):""}]:void 0,children:o("div",{className:"flex flex-col gap-1.5",children:[o("div",{className:"flex items-stretch gap-2",children:[e(s,{size:oe,color:te,locale:ie,weekStartsOn:me,month:ge,onMonthChange:ve,selected:[he],onSelect:e=>{const o=D(he)?x(e,he):C(e);je(o),ve(k(o)),$&&De(!1)},minDate:E,maxDate:F,shouldDisableDate:q,labels:ce,autoFocus:!0}),e(c,{}),e(r,{size:oe,locale:ie,value:D(he)?he:null,referenceDate:D(he)?he:O(),onChange:je,hour12:de,showSeconds:L,hourStep:Q,minuteStep:U,secondStep:W,shouldDisableTime:xe,labels:ce})]}),o(m,{children:[Y?e(l,{variant:"text",size:i[oe],color:te,onClick:()=>{je(null),De(!1)},children:ce.clear}):null,Z?e(l,{variant:"text",size:i[oe],color:te,disabled:ze,onClick:()=>{je(we),ve(k(we))},children:ce.now}):null,e(l,{variant:"filled",size:i[oe],color:te,onClick:()=>De(!1),children:ce.done})]})]})})});

package/dist/components/date-time-picker/index.d.ts

@@ -1,2 +1,2 @@
-export { MPDateTimePicker } from './MPDateTimePicker';
-export type { MPDateTimePickerProps } from './MPDateTimePicker';
+export { MPDateTimePicker } from './MPDateTimePicker.js';
+export type { MPDateTimePickerProps } from './MPDateTimePicker.js';

package/dist/components/date-time-picker/index.js

@@ -1 +1 @@
-export{MPDateTimePicker}from"./MPDateTimePicker";
+export{MPDateTimePicker}from"./MPDateTimePicker.js";

package/dist/components/dialog/MPDialog.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { Dialog } from '@base-ui/react/dialog';
-import type { MPColor, MPSize } from '../../types';
+import type { MPColor, MPSize } from '../../types.js';
 /**
  * A dialog takes `size` and `color` and stops there.
  *

package/dist/components/dialog/MPDialog.js

@@ -1 +1,2 @@
-import{jsx as e,jsxs as l}from"react/jsx-runtime";import{Dialog as t}from"@base-ui/react/dialog";import{MPIcon as i}from"../icon/MPIcon";import{CloseIcon as n}from"../../constants/icons";import{accentSlots as o}from"../../internal/accent";import{useMPLocale as s,useMPMessages as a}from"../../internal/locale";import{MPStateLayer as r}from"../../internal/StateLayer";import{SHEET_GAP as m,hasContent as c}from"../../internal/scale";import{FADE as p,PORTAL_LAYER as d,SCRIM as x,SHEET_MOTION as f}from"../../internal/surface";const u={xs:"max-w-[320px]",sm:"max-w-[400px]",md:"max-w-[560px]",lg:"max-w-[720px]",xl:"max-w-[960px]"},h=`transition-[opacity,scale] ${f}`,g=["motion-safe:data-starting-style:scale-95","motion-safe:data-ending-style:scale-95"].join(" "),y={xs:"p-3",sm:"p-4",md:"p-6",lg:"p-7",xl:"p-8"},v={xs:"px-3",sm:"px-4",md:"px-6",lg:"px-7",xl:"px-8"},b={xs:"py-3",sm:"py-4",md:"py-6",lg:"py-7",xl:"py-8"},w={xs:"text-mp-title-medium",sm:"text-mp-title-large",md:"text-mp-headline-small",lg:"text-mp-headline-medium",xl:"text-mp-headline-large"},j={xs:"text-mp-body-small",sm:"text-mp-body-small",md:"text-mp-body-medium",lg:"text-mp-body-large",xl:"text-mp-body-large"},N={xs:20,sm:22,md:24,lg:28,xl:32};export const MPDialogClose=t.Close;export function MPDialog({open:f,defaultOpen:$,onOpenChange:k,trigger:C,icon:P,title:B,description:z,actions:D,dividers:O=!1,showClose:M,closeLabel:L,locale:S,width:T,fullWidth:W=!0,fullScreen:I=!1,modal:R=!0,dismissible:V=!0,size:_="md",color:q="secondary",className:A,style:E,children:F}){const G=s(S),H=a("common",G),J=M??I,K=c(P),Q=c(B)||c(z)||K,U=c(D),X=O?y[_]:v[_],Y="border-mp-outline-variant border-t";return l(t.Root,{open:f,defaultOpen:$,modal:R,disablePointerDismissal:!V,onOpenChange:(e,l)=>{V||e||"escape-key"!==l.reason?k?.(e):l.cancel()},children:[C?e(t.Trigger,{render:C}):null,l(t.Portal,{children:[e(t.Backdrop,{className:`${d} fixed inset-0 ${p} ${x}`}),e(t.Viewport,{className:[d,"fixed inset-0 flex justify-center",I?"items-stretch":"items-center p-4"].join(" "),children:l(t.Popup,{"data-mp-size":_,className:["mp-dialog relative flex w-full flex-col overflow-hidden","bg-mp-surface-container-high text-mp-on-surface shadow-mp-3 outline-none",I?"h-full max-w-none rounded-none":`rounded-mp-xl max-h-full ${void 0===T?u[_]:""}`,I||W?"":"w-auto",O?"":`${b[_]} ${m[_]}`,h,I?"":g,A??""].filter(Boolean).join(" "),style:{...o(q),...void 0===T||I?null:{maxWidth:"number"==typeof T?`${T}px`:T},...E},children:[Q||J?l("div",{className:["flex shrink-0 items-start gap-3",X,K&&!J?"flex-col items-center text-center":""].filter(Boolean).join(" "),children:[K?e("span",{className:"flex shrink-0 items-center justify-center text-(--_mp-accent)",children:P}):null,l("div",{className:`flex min-w-0 flex-1 flex-col ${m[_]}`,children:[c(B)?e(t.Title,{className:`m-0 ${w[_]}`,children:B}):null,c(z)?e(t.Description,{className:`text-mp-on-surface-variant m-0 ${j[_]}`,children:z}):null]}),J?l(t.Close,{"aria-label":L??H.close,className:["group text-mp-on-surface-variant relative flex size-10 shrink-0","rounded-mp-full cursor-pointer items-center justify-center","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-2","focus-visible:outline-solid outline-none"].join(" "),children:[e(r,{}),e(i,{icon:n,size:N[_]})]}):null]}):null,c(F)?e("div",{className:["min-h-0 flex-1 overflow-y-auto overscroll-contain",j[_],X,O&&(Q||J)?Y:""].filter(Boolean).join(" "),children:F}):null,U?e("div",{className:["flex shrink-0 flex-wrap items-center justify-end gap-2",X,O?Y:""].filter(Boolean).join(" "),children:D}):null]})})]})]})}
+"use client";
+import{jsx as e,jsxs as l}from"react/jsx-runtime";import{Dialog as t}from"@base-ui/react/dialog";import{MPIcon as i}from"../icon/MPIcon.js";import{CloseIcon as n}from"../../constants/icons.js";import{accentSlots as s}from"../../internal/accent.js";import{useMPLocale as o,useMPMessages as a}from"../../internal/locale.js";import{COMMON as r}from"../../internal/messages/common.js";import{MPStateLayer as m}from"../../internal/StateLayer.js";import{SHEET_GAP as c,hasContent as p}from"../../internal/scale.js";import{FADE as d,PORTAL_LAYER as x,SCRIM as f,SHEET_MOTION as u}from"../../internal/surface.js";const h={xs:"max-w-[320px]",sm:"max-w-[400px]",md:"max-w-[560px]",lg:"max-w-[720px]",xl:"max-w-[960px]"},g=`transition-[opacity,scale] ${u}`,y=/*@__PURE__*/["motion-safe:data-starting-style:scale-95","motion-safe:data-ending-style:scale-95"].join(" "),j={xs:"p-3",sm:"p-4",md:"p-6",lg:"p-7",xl:"p-8"},v={xs:"px-3",sm:"px-4",md:"px-6",lg:"px-7",xl:"px-8"},b={xs:"py-3",sm:"py-4",md:"py-6",lg:"py-7",xl:"py-8"},w={xs:"text-mp-title-medium",sm:"text-mp-title-large",md:"text-mp-headline-small",lg:"text-mp-headline-medium",xl:"text-mp-headline-large"},N={xs:"text-mp-body-small",sm:"text-mp-body-small",md:"text-mp-body-medium",lg:"text-mp-body-large",xl:"text-mp-body-large"},$={xs:20,sm:22,md:24,lg:28,xl:32};export const MPDialogClose=t.Close;export function MPDialog({open:u,defaultOpen:k,onOpenChange:C,trigger:P,icon:B,title:z,description:D,actions:O,dividers:M=!1,showClose:L,closeLabel:S,locale:T,width:W,fullWidth:I=!0,fullScreen:R=!1,modal:V=!0,dismissible:_=!0,size:q="md",color:A="secondary",className:E,style:F,children:G}){const H=o(T),J=a(r,H),K=L??R,Q=p(B),U=p(z)||p(D)||Q,X=p(O),Y=M?j[q]:v[q],Z="border-mp-outline-variant border-t";return l(t.Root,{open:u,defaultOpen:k,modal:V,disablePointerDismissal:!_,onOpenChange:(e,l)=>{_||e||"escape-key"!==l.reason?C?.(e):l.cancel()},children:[P?e(t.Trigger,{render:P}):null,l(t.Portal,{children:[e(t.Backdrop,{className:`${x} fixed inset-0 ${d} ${f}`}),e(t.Viewport,{className:[x,"fixed inset-0 flex justify-center",R?"items-stretch":"items-center p-4"].join(" "),children:l(t.Popup,{"data-mp-size":q,className:["mp-dialog relative flex w-full flex-col overflow-hidden","bg-mp-surface-container-high text-mp-on-surface shadow-mp-3 outline-none",R?"h-full max-w-none rounded-none":`rounded-mp-xl max-h-full ${void 0===W?h[q]:""}`,R||I?"":"w-auto",M?"":`${b[q]} ${c[q]}`,g,R?"":y,E??""].filter(Boolean).join(" "),style:{...s(A),...void 0===W||R?null:{maxWidth:"number"==typeof W?`${W}px`:W},...F},children:[U||K?l("div",{className:["flex shrink-0 items-start gap-3",Y,Q&&!K?"flex-col items-center text-center":""].filter(Boolean).join(" "),children:[Q?e("span",{className:"flex shrink-0 items-center justify-center text-(--_mp-accent)",children:B}):null,l("div",{className:`flex min-w-0 flex-1 flex-col ${c[q]}`,children:[p(z)?e(t.Title,{className:`m-0 ${w[q]}`,children:z}):null,p(D)?e(t.Description,{className:`text-mp-on-surface-variant m-0 ${N[q]}`,children:D}):null]}),K?l(t.Close,{"aria-label":S??J.close,className:["group text-mp-on-surface-variant relative flex size-10 shrink-0","rounded-mp-full cursor-pointer items-center justify-center","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-2","focus-visible:outline-solid outline-none"].join(" "),children:[e(m,{}),e(i,{icon:n,size:$[q]})]}):null]}):null,p(G)?e("div",{className:["min-h-0 flex-1 overflow-y-auto overscroll-contain",N[q],Y,M&&(U||K)?Z:""].filter(Boolean).join(" "),children:G}):null,X?e("div",{className:["flex shrink-0 flex-wrap items-center justify-end gap-2",Y,M?Z:""].filter(Boolean).join(" "),children:O}):null]})})]})]})}

package/dist/components/dialog/index.d.ts

@@ -1,2 +1,2 @@
-export { MPDialog, MPDialogClose } from './MPDialog';
-export type { MPDialogCloseProps, MPDialogProps } from './MPDialog';
+export { MPDialog, MPDialogClose } from './MPDialog.js';
+export type { MPDialogCloseProps, MPDialogProps } from './MPDialog.js';

package/dist/components/dialog/index.js

@@ -1 +1 @@
-export{MPDialog,MPDialogClose}from"./MPDialog";
+export{MPDialog,MPDialogClose}from"./MPDialog.js";

package/dist/components/divider/MPDivider.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { MPAlign, MPColor, MPOrientation, MPSize } from '../../types';
+import type { MPAlign, MPColor, MPOrientation, MPSize } from '../../types.js';
 /** Where the label sits along a labelled divider. Ignored without a label. */
 export type MPDividerTextAlign = MPAlign;
 export interface MPDividerProps extends Omit<React.ComponentPropsWithoutRef<'div'>, 'color' | 'children'> {

package/dist/components/divider/MPDivider.js

@@ -1 +1,2 @@
-import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as t from"react";import{Separator as l}from"@base-ui/react/separator";import{hasContent as a}from"../../internal/scale";const i="[border-color:var(--_mp-line)]";function o(e){return"number"==typeof e?`${e}px`:e}const n={horizontal:{start:["w-4 shrink-0","flex-1"],center:["flex-1","flex-1"],end:["flex-1","w-4 shrink-0"]},vertical:{start:["h-4 shrink-0","flex-1"],center:["flex-1","flex-1"],end:["flex-1","h-4 shrink-0"]}},s={xs:"text-mp-label-small",sm:"text-mp-label-small",md:"text-mp-label-medium",lg:"text-mp-label-large",xl:"text-mp-label-large"},m={xs:"gap-1.5",sm:"gap-2",md:"gap-3",lg:"gap-3.5",xl:"gap-4"};export const MPDivider=t.forwardRef(function({orientation:t="horizontal",color:p,size:d="md",length:c,thickness:f,textAlign:h="center",className:x,style:u,children:v,...b},w){const g="vertical"===t,_=a(v),$={"--_mp-line":p?`var(--_mp-color-${p})`:"var(--_mp-color-outline-variant)","--_mp-rule":o(f)??"1px"},j=o(c),k={...$,...void 0===j?null:g?{height:j}:{width:j},...u};if(!_)return e(l,{ref:w,orientation:t,"data-mp-size":d,className:["mp-divider",g?"w-0 border-l [border-left-width:var(--_mp-rule)] "+(void 0===j?"self-stretch":""):"h-0 w-full border-t [border-top-width:var(--_mp-rule)]",i,x??""].filter(Boolean).join(" "),style:k,...b});const[N,y]=n[t][h],z=g?"w-0 border-l [border-left-width:var(--_mp-rule)]":"h-0 border-t [border-top-width:var(--_mp-rule)]";return r(l,{ref:w,orientation:t,"aria-label":"string"==typeof v?v:void 0,"data-mp-size":d,className:["mp-divider flex items-center",g?"w-auto flex-col "+(void 0===j?"self-stretch":""):"w-full",m[d],x??""].filter(Boolean).join(" "),style:k,...b,children:[e("span",{"aria-hidden":"true",className:`${z} ${N} ${i}`}),e("span",{className:["text-mp-on-surface-variant shrink-0 whitespace-nowrap",s[d],g?"[writing-mode:vertical-rl]":""].filter(Boolean).join(" "),children:v}),e("span",{"aria-hidden":"true",className:`${z} ${y} ${i}`})]})});
+"use client";
+import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as t from"react";import{Separator as l}from"@base-ui/react/separator";import{hasContent as a}from"../../internal/scale.js";const i="[border-color:var(--_mp-line)]";function o(e){return"number"==typeof e?`${e}px`:e}const n={horizontal:{start:["w-4 shrink-0","flex-1"],center:["flex-1","flex-1"],end:["flex-1","w-4 shrink-0"]},vertical:{start:["h-4 shrink-0","flex-1"],center:["flex-1","flex-1"],end:["flex-1","h-4 shrink-0"]}},s={xs:"text-mp-label-small",sm:"text-mp-label-small",md:"text-mp-label-medium",lg:"text-mp-label-large",xl:"text-mp-label-large"},m={xs:"gap-1.5",sm:"gap-2",md:"gap-3",lg:"gap-3.5",xl:"gap-4"};export const MPDivider=/*@__PURE__*/t.forwardRef(function({orientation:t="horizontal",color:p,size:d="md",length:c,thickness:f,textAlign:h="center",className:x,style:u,children:v,...b},w){const g="vertical"===t,_=a(v),$={"--_mp-line":p?`var(--_mp-color-${p})`:"var(--_mp-color-outline-variant)","--_mp-rule":o(f)??"1px"},j=o(c),k={...$,...void 0===j?null:g?{height:j}:{width:j},...u};if(!_)return e(l,{ref:w,orientation:t,"data-mp-size":d,className:["mp-divider",g?"w-0 border-l [border-left-width:var(--_mp-rule)] "+(void 0===j?"self-stretch":""):"h-0 w-full border-t [border-top-width:var(--_mp-rule)]",i,x??""].filter(Boolean).join(" "),style:k,...b});const[N,y]=n[t][h],z=g?"w-0 border-l [border-left-width:var(--_mp-rule)]":"h-0 border-t [border-top-width:var(--_mp-rule)]";return r(l,{ref:w,orientation:t,"aria-label":"string"==typeof v?v:void 0,"data-mp-size":d,className:["mp-divider flex items-center",g?"w-auto flex-col "+(void 0===j?"self-stretch":""):"w-full",m[d],x??""].filter(Boolean).join(" "),style:k,...b,children:[e("span",{"aria-hidden":"true",className:`${z} ${N} ${i}`}),e("span",{className:["text-mp-on-surface-variant shrink-0 whitespace-nowrap",s[d],g?"[writing-mode:vertical-rl]":""].filter(Boolean).join(" "),children:v}),e("span",{"aria-hidden":"true",className:`${z} ${y} ${i}`})]})});

package/dist/components/divider/index.d.ts

@@ -1,2 +1,2 @@
-export { MPDivider } from './MPDivider';
-export type { MPDividerProps, MPDividerTextAlign } from './MPDivider';
+export { MPDivider } from './MPDivider.js';
+export type { MPDividerProps, MPDividerTextAlign } from './MPDivider.js';

package/dist/components/divider/index.js

@@ -1 +1 @@
-export{MPDivider}from"./MPDivider";
+export{MPDivider}from"./MPDivider.js";

package/dist/components/drawer/MPDrawer.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { Dialog } from '@base-ui/react/dialog';
-import type { MPSide, MPSize } from '../../types';
+import type { MPSide, MPSize } from '../../types.js';
 /**
  * How the panel relates to the page, in MD3's own two words for it.
  *

package/dist/components/drawer/MPDrawer.js

@@ -1 +1,2 @@
-import{jsx as e,jsxs as t,Fragment as l}from"react/jsx-runtime";import*as a from"react";import{Dialog as o}from"@base-ui/react/dialog";import{MPIcon as n}from"../icon/MPIcon";import{CloseIcon as r}from"../../constants/icons";import{useMPLocale as i,useMPMessages as s}from"../../internal/locale";import{MPStateLayer as d}from"../../internal/StateLayer";import{hasContent as m,META_TEXT as c,PROSE_TEXT as f,SHEET_GAP as u,SHEET_PAD_X as p,SHEET_PAD_Y as x,SHEET_TITLE as h}from"../../internal/scale";import{FADE as b,PORTAL_LAYER as g,SCRIM as y,SHEET_MOTION as v}from"../../internal/surface";const w={xs:"w-60",sm:"w-72",md:"w-90",lg:"w-104",xl:"w-120"},$={left:"rounded-r-mp-lg",right:"rounded-l-mp-lg",top:"rounded-b-mp-xl",bottom:"rounded-t-mp-xl"},j={left:"border-r",right:"border-l",top:"border-b",bottom:"border-t"},N={left:"flex-row justify-start",right:"flex-row justify-end",top:"flex-col justify-start",bottom:"flex-col justify-end"},C={left:"motion-safe:data-starting-style:-translate-x-full motion-safe:data-ending-style:-translate-x-full",right:"motion-safe:data-starting-style:translate-x-full motion-safe:data-ending-style:translate-x-full",top:"motion-safe:data-starting-style:-translate-y-full motion-safe:data-ending-style:-translate-y-full",bottom:"motion-safe:data-starting-style:translate-y-full motion-safe:data-ending-style:translate-y-full"},k=`transition-[opacity,translate] ${v}`,z="border-mp-outline-variant border-t";export const MPDrawerClose=o.Close;export function MPDrawer({side:v="left",mode:P="modal",open:B,defaultOpen:D,onOpenChange:O,trigger:M,title:L,description:S,actions:T,dividers:F=!1,showClose:I,closeLabel:R,locale:V,extent:q,rounded:A=!0,dismissible:E=!0,size:G="md",className:H,style:J,children:K}){const Q=i(V),U=s("common",Q),W="modal"===P,X="left"===v||"right"===v,Y=I??W,Z=R??U.close,[_,ee]=a.useState(D??!0),te=B??_,le=p[G],ae=x[G],oe=F?`${le} ${ae}`:le,ne=m(L)||m(S),re=m(T),ie=void 0===q?null:{[X?"width":"height"]:"number"==typeof q?`${q}px`:q},se=["mp-drawer relative flex flex-col overflow-hidden box-border","border-mp-outline-variant outline-none",W?"bg-mp-surface-container-low shadow-mp-1":"bg-mp-surface","text-mp-on-surface",f[G],j[v],A?$[v]:"",W?`${k} ${C[v]}`:"",X?`h-full max-w-full ${void 0===q?w[G]:""}`:"w-full "+(void 0===q?"max-h-[85%]":""),F?"":`${ae} ${u[G]}`,H??""].filter(Boolean).join(" "),de=W?o.Title:"h2",me=W?o.Description:"p",ce=["group text-mp-on-surface-variant relative flex size-10 shrink-0","rounded-mp-full cursor-pointer items-center justify-center","appearance-none border-0 bg-transparent","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-2","focus-visible:outline-solid outline-none"].join(" "),fe=t(l,{children:[ne||Y?t("div",{className:`flex shrink-0 items-start gap-3 ${oe}`,children:[t("div",{className:"flex min-w-0 flex-1 flex-col",children:[m(L)?e(de,{className:`m-0 ${h[G]}`,children:L}):null,m(S)?e(me,{className:`text-mp-on-surface-variant m-0 ${c}`,children:S}):null]}),Y?W?t(o.Close,{"aria-label":Z,className:ce,children:[e(d,{}),e(n,{icon:r,size:20})]}):t("button",{type:"button","aria-label":Z,className:ce,onClick:()=>{void 0===B&&ee(!1),O?.(!1)},children:[e(d,{}),e(n,{icon:r,size:20})]}):null]}):null,m(K)?e("div",{className:["min-h-0 flex-1 overflow-y-auto overscroll-contain",oe,F&&(ne||Y)?z:"",F?"":"-my-1 py-1"].filter(Boolean).join(" "),children:K}):null,re?e("div",{className:["flex shrink-0 flex-wrap items-center justify-end gap-2",oe,F?z:""].filter(Boolean).join(" "),children:T}):null]});return W?t(o.Root,{open:B,defaultOpen:D,disablePointerDismissal:!E,onOpenChange:(e,t)=>{E||e||"escape-key"!==t.reason?O?.(e):t.cancel()},children:[M?e(o.Trigger,{render:M}):null,t(o.Portal,{children:[e(o.Backdrop,{className:`${g} fixed inset-0 ${b} ${y}`}),e(o.Viewport,{className:`${g} fixed inset-0 flex ${N[v]}`,children:e(o.Popup,{"data-mp-size":G,"data-mp-side":v,"data-mp-mode":P,className:se,style:{...ie,...J},children:fe})})]})]}):te?e("div",{"data-mp-size":G,"data-mp-side":v,"data-mp-mode":P,className:se,style:{...ie,...J},children:fe}):null}
+"use client";
+import{jsx as e,jsxs as t,Fragment as l}from"react/jsx-runtime";import*as a from"react";import{Dialog as o}from"@base-ui/react/dialog";import{MPIcon as n}from"../icon/MPIcon.js";import{CloseIcon as r}from"../../constants/icons.js";import{useMPLocale as i,useMPMessages as s}from"../../internal/locale.js";import{COMMON as d}from"../../internal/messages/common.js";import{MPStateLayer as m}from"../../internal/StateLayer.js";import{hasContent as f,META_TEXT as c,PROSE_TEXT as p,SHEET_GAP as u,SHEET_PAD_X as x,SHEET_PAD_Y as h,SHEET_TITLE as g}from"../../internal/scale.js";import{FADE as b,PORTAL_LAYER as y,SCRIM as v,SHEET_MOTION as w}from"../../internal/surface.js";const j={xs:"w-60",sm:"w-72",md:"w-90",lg:"w-104",xl:"w-120"},$={left:"rounded-r-mp-lg",right:"rounded-l-mp-lg",top:"rounded-b-mp-xl",bottom:"rounded-t-mp-xl"},N={left:"border-r",right:"border-l",top:"border-b",bottom:"border-t"},C={left:"flex-row justify-start",right:"flex-row justify-end",top:"flex-col justify-start",bottom:"flex-col justify-end"},k={left:"motion-safe:data-starting-style:-translate-x-full motion-safe:data-ending-style:-translate-x-full",right:"motion-safe:data-starting-style:translate-x-full motion-safe:data-ending-style:translate-x-full",top:"motion-safe:data-starting-style:-translate-y-full motion-safe:data-ending-style:-translate-y-full",bottom:"motion-safe:data-starting-style:translate-y-full motion-safe:data-ending-style:translate-y-full"},z=`transition-[opacity,translate] ${w}`,P="border-mp-outline-variant border-t";export const MPDrawerClose=o.Close;export function MPDrawer({side:w="left",mode:B="modal",open:D,defaultOpen:O,onOpenChange:M,trigger:L,title:S,description:T,actions:F,dividers:I=!1,showClose:R,closeLabel:V,locale:q,extent:A,rounded:E=!0,dismissible:G=!0,size:H="md",className:J,style:K,children:Q}){const U=i(q),W=s(d,U),X="modal"===B,Y="left"===w||"right"===w,Z=R??X,_=V??W.close,[ee,te]=a.useState(O??!0),le=D??ee,ae=x[H],oe=h[H],ne=I?`${ae} ${oe}`:ae,re=f(S)||f(T),ie=f(F),se=void 0===A?null:{[Y?"width":"height"]:"number"==typeof A?`${A}px`:A},de=["mp-drawer relative flex flex-col overflow-hidden box-border","border-mp-outline-variant outline-none",X?"bg-mp-surface-container-low shadow-mp-1":"bg-mp-surface","text-mp-on-surface",p[H],N[w],E?$[w]:"",X?`${z} ${k[w]}`:"",Y?`h-full max-w-full ${void 0===A?j[H]:""}`:"w-full "+(void 0===A?"max-h-[85%]":""),I?"":`${oe} ${u[H]}`,J??""].filter(Boolean).join(" "),me=X?o.Title:"h2",fe=X?o.Description:"p",ce=/*@__PURE__*/["group text-mp-on-surface-variant relative flex size-10 shrink-0","rounded-mp-full cursor-pointer items-center justify-center","appearance-none border-0 bg-transparent","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-2","focus-visible:outline-solid outline-none"].join(" "),pe=t(l,{children:[re||Z?t("div",{className:`flex shrink-0 items-start gap-3 ${ne}`,children:[t("div",{className:"flex min-w-0 flex-1 flex-col",children:[f(S)?e(me,{className:`m-0 ${g[H]}`,children:S}):null,f(T)?e(fe,{className:`text-mp-on-surface-variant m-0 ${c}`,children:T}):null]}),Z?X?t(o.Close,{"aria-label":_,className:ce,children:[e(m,{}),e(n,{icon:r,size:20})]}):t("button",{type:"button","aria-label":_,className:ce,onClick:()=>{void 0===D&&te(!1),M?.(!1)},children:[e(m,{}),e(n,{icon:r,size:20})]}):null]}):null,f(Q)?e("div",{className:["min-h-0 flex-1 overflow-y-auto overscroll-contain",ne,I&&(re||Z)?P:"",I?"":"-my-1 py-1"].filter(Boolean).join(" "),children:Q}):null,ie?e("div",{className:["flex shrink-0 flex-wrap items-center justify-end gap-2",ne,I?P:""].filter(Boolean).join(" "),children:F}):null]});return X?t(o.Root,{open:D,defaultOpen:O,disablePointerDismissal:!G,onOpenChange:(e,t)=>{G||e||"escape-key"!==t.reason?M?.(e):t.cancel()},children:[L?e(o.Trigger,{render:L}):null,t(o.Portal,{children:[e(o.Backdrop,{className:`${y} fixed inset-0 ${b} ${v}`}),e(o.Viewport,{className:`${y} fixed inset-0 flex ${C[w]}`,children:e(o.Popup,{"data-mp-size":H,"data-mp-side":w,"data-mp-mode":B,className:de,style:{...se,...K},children:pe})})]})]}):le?e("div",{"data-mp-size":H,"data-mp-side":w,"data-mp-mode":B,className:de,style:{...se,...K},children:pe}):null}

package/dist/components/drawer/index.d.ts

@@ -1,2 +1,2 @@
-export { MPDrawer, MPDrawerClose } from './MPDrawer';
-export type { MPDrawerCloseProps, MPDrawerMode, MPDrawerProps } from './MPDrawer';
+export { MPDrawer, MPDrawerClose } from './MPDrawer.js';
+export type { MPDrawerCloseProps, MPDrawerMode, MPDrawerProps } from './MPDrawer.js';

package/dist/components/drawer/index.js

@@ -1 +1 @@
-export{MPDrawer,MPDrawerClose}from"./MPDrawer";
+export{MPDrawer,MPDrawerClose}from"./MPDrawer.js";

package/dist/components/empty/MPEmpty.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { useRender } from '@base-ui/react/use-render';
-import type { MPSize, MPVariant } from '../../types';
+import type { MPSize, MPVariant } from '../../types.js';
 export interface MPEmptyProps extends Omit<React.ComponentPropsWithoutRef<'div'>, 'color' | 'title'> {
     /**
      * The headline. Defaults to the words for "nothing here" in `locale`; pass

package/dist/components/empty/MPEmpty.js

@@ -1 +1,2 @@
-import{jsx as e,jsxs as t,Fragment as r}from"react/jsx-runtime";import*as n from"react";import{useRender as a}from"@base-ui/react/use-render";import{useMPLocale as l,useMPMessages as s}from"../../internal/locale";import{hasContent as i,PROSE_TEXT as o,SHEET_GAP as m,SHEET_PAD_X as c,SHEET_TITLE as d}from"../../internal/scale";import{CONTAINER_SURFACE as p}from"../../internal/surface";const x={xs:"py-5",sm:"py-6",md:"py-8",lg:"py-10",xl:"py-12"},f={xs:"text-[1.5rem]",sm:"text-[1.75rem]",md:"text-[2.25rem]",lg:"text-[2.75rem]",xl:"text-[3.25rem]"};function u(){return t("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",className:"size-[1em]",children:[e("path",{d:"M1.75 9.75h3l.9 1.6h4.7l.9-1.6h3",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"}),e("path",{d:"m1.75 9.75 2.1-6a1.5 1.5 0 0 1 1.42-1h5.46a1.5 1.5 0 0 1 1.42 1l2.1 6v2a1.5 1.5 0 0 1-1.5 1.5h-9.5a1.5 1.5 0 0 1-1.5-1.5Z",stroke:"currentColor",strokeWidth:"1.5",strokeLinejoin:"round"})]})}export const MPEmpty=n.forwardRef(function({variant:n="text",size:h="md",title:v,icon:y,action:j,locale:N,render:k,className:g,style:w,children:z,...$},L){const B=l(N),C=s("empty",B),M=void 0===v?C.title:v,W=void 0===y?e(u,{}):y,b=i(M),E=["mp-empty flex w-full flex-col items-center justify-center text-center",c[h],x[h],"text"===n?"":"rounded-mp-md",m[h],p[n],"text-mp-on-surface",g??""].filter(Boolean).join(" ");return a({render:k,ref:L,props:{role:"status","data-mp-size":h,"data-mp-variant":n,className:E,style:w,children:t(r,{children:[i(W)?e("span",{className:`text-mp-on-surface-variant flex items-center ${f[h]} [&>svg]:size-[1em]`,children:W}):null,b||i(z)?t("div",{className:`flex max-w-prose flex-col items-center ${m[h]}`,children:[b?e("div",{className:d[h],children:M}):null,i(z)?e("div",{className:`${o[h]} ${b?"text-mp-on-surface-variant":""}`,children:z}):null]}):null,i(j)?e("div",{className:"flex flex-wrap items-center justify-center gap-2",children:j}):null]}),...$}})});
+"use client";
+import{jsx as e,jsxs as t,Fragment as r}from"react/jsx-runtime";import*as s from"react";import{useRender as n}from"@base-ui/react/use-render";import{useMPLocale as a,useMPMessages as l}from"../../internal/locale.js";import{EMPTY as i}from"../../internal/messages/empty.js";import{hasContent as o,PROSE_TEXT as m,SHEET_GAP as c,SHEET_PAD_X as d,SHEET_TITLE as p}from"../../internal/scale.js";import{CONTAINER_SURFACE as f}from"../../internal/surface.js";const x={xs:"py-5",sm:"py-6",md:"py-8",lg:"py-10",xl:"py-12"},u={xs:"text-[1.5rem]",sm:"text-[1.75rem]",md:"text-[2.25rem]",lg:"text-[2.75rem]",xl:"text-[3.25rem]"};function h(){return t("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",className:"size-[1em]",children:[e("path",{d:"M1.75 9.75h3l.9 1.6h4.7l.9-1.6h3",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"}),e("path",{d:"m1.75 9.75 2.1-6a1.5 1.5 0 0 1 1.42-1h5.46a1.5 1.5 0 0 1 1.42 1l2.1 6v2a1.5 1.5 0 0 1-1.5 1.5h-9.5a1.5 1.5 0 0 1-1.5-1.5Z",stroke:"currentColor",strokeWidth:"1.5",strokeLinejoin:"round"})]})}export const MPEmpty=/*@__PURE__*/s.forwardRef(function({variant:s="text",size:v="md",title:j,icon:y,action:N,locale:g,render:k,className:w,style:z,children:$,...L},B){const C=a(g),M=l(i,C),W=void 0===j?M.title:j,b=void 0===y?e(h,{}):y,E=o(W),F=["mp-empty flex w-full flex-col items-center justify-center text-center",d[v],x[v],"text"===s?"":"rounded-mp-md",c[v],f[s],"text-mp-on-surface",w??""].filter(Boolean).join(" ");return n({render:k,ref:B,props:{role:"status","data-mp-size":v,"data-mp-variant":s,className:F,style:z,children:t(r,{children:[o(b)?e("span",{className:`text-mp-on-surface-variant flex items-center ${u[v]} [&>svg]:size-[1em]`,children:b}):null,E||o($)?t("div",{className:`flex max-w-prose flex-col items-center ${c[v]}`,children:[E?e("div",{className:p[v],children:W}):null,o($)?e("div",{className:`${m[v]} ${E?"text-mp-on-surface-variant":""}`,children:$}):null]}):null,o(N)?e("div",{className:"flex flex-wrap items-center justify-center gap-2",children:N}):null]}),...L}})});

package/dist/components/empty/index.d.ts

@@ -1,2 +1,2 @@
-export { MPEmpty } from './MPEmpty';
-export type { MPEmptyProps } from './MPEmpty';
+export { MPEmpty } from './MPEmpty.js';
+export type { MPEmptyProps } from './MPEmpty.js';

package/dist/components/empty/index.js

@@ -1 +1 @@
-export{MPEmpty}from"./MPEmpty";
+export{MPEmpty}from"./MPEmpty.js";

package/dist/components/file-picker/MPFilePicker.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { MPStyleProps } from '../../types';
+import type { MPStyleProps } from '../../types.js';
 /** Why a file was turned away. One reason per file, in the order they are checked. */
 export type MPFileRejectionReason = 'type' | 'size' | 'count';
 export interface MPFileRejection {

package/dist/components/file-picker/MPFilePicker.js

@@ -1 +1,2 @@
-import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as n from"react";import{MPIcon as t}from"../icon/MPIcon";import{CloseIcon as a,UploadIcon as i}from"../../constants/icons";import{fillMessage as o}from"../../internal/i18n";import{useMPLocale as l,useMPMessages as s}from"../../internal/locale";import{MPStateLayer as c}from"../../internal/StateLayer";import{CONTROL_ICON as p,META_TEXT as m,PROSE_TEXT as u,STACK_GAP as d,hasContent as f}from"../../internal/scale";const h={xs:"p-4",sm:"p-5",md:"p-6",lg:"p-8",xl:"p-10"};export function formatFileSize(e){if(e<1e3)return`${e} B`;const r=["kB","MB","GB","TB"];let n=e/1e3,t=0;for(;n>=1e3&&t<r.length-1;)n/=1e3,t+=1;return`${n<10?n.toFixed(1):Math.round(n)} ${r[t]}`}function x(e,r){const n=e.name.toLowerCase(),t=e.type.toLowerCase();return r.split(",").map(e=>e.trim().toLowerCase()).filter(Boolean).some(e=>e.startsWith(".")?n.endsWith(e):e.endsWith("/*")?t.startsWith(e.slice(0,-1)):t===e)}export const MPFilePicker=n.forwardRef(function({accept:b,multiple:v=!1,maxSize:g,maxFiles:y,value:N,defaultValue:j,onFilesChange:k,onReject:w,label:z,description:C,errorMessage:I,title:B,hint:D,icon:F,showList:L=!0,removeLabel:M,locale:S,size:$="md",fullWidth:T=!0,required:W=!1,disabled:_=!1,readOnly:P=!1,name:R,id:E},O){const q=l(S),A=s("common",q),V=n.useRef(null);n.useImperativeHandle(O,()=>V.current,[]);const[G,H]=n.useState(()=>[...j??[]]),Y=N?[...N]:G,J=n.useRef(0),[K,Q]=n.useState(!1),U=f(I),X=_||P,Z=n.useId(),ee=n.useId(),re=n.useCallback(e=>{N||H(e),k?.(e)},[k,N]),ne=n.useCallback(e=>{const r=[],n=[],t=v?y??Number.POSITIVE_INFINITY:1,a=v?Y.length:0;for(const i of e)b&&!x(i,b)?n.push({file:i,reason:"type"}):void 0!==g&&i.size>g?n.push({file:i,reason:"size"}):a+r.length>=t?n.push({file:i,reason:"count"}):r.push(i);return{kept:r,rejections:n}},[b,Y.length,y,g,v]),te=n.useCallback(e=>{const{kept:r,rejections:n}=ne(e);n.length>0&&w?.(n),r.length>0&&re(v?[...Y,...r]:r)},[ne,re,Y,v,w]);return r("div",{className:["mp-file-picker flex-col align-top",d[$],T?"flex w-full":"inline-flex"].join(" "),"data-mp-size":$,"data-disabled":_||void 0,"data-invalid":U||void 0,children:[f(z)?r("span",{id:ee,className:[m,_?"text-mp-on-surface/38":U?"text-mp-error":"text-mp-on-surface-variant"].join(" "),children:[z,W?e("span",{"aria-hidden":"true",children:" *"}):null]}):null,r("div",{className:"flex w-full flex-col",onDragEnter:e=>{X||(e.preventDefault(),J.current+=1,Q(!0))},onDragOver:e=>{X||(e.preventDefault(),e.dataTransfer.dropEffect="copy")},onDragLeave:()=>{X||(J.current=Math.max(0,J.current-1),0===J.current&&Q(!1))},onDrop:e=>{X||(e.preventDefault(),J.current=0,Q(!1),te(Array.from(e.dataTransfer.files)))},children:[r("button",{type:"button",id:E,disabled:_,"aria-describedby":f(C)||U?Z:void 0,"aria-invalid":U||void 0,className:["mp-file-picker__zone group relative flex w-full flex-col items-center","justify-center gap-2 text-center","rounded-mp-md box-border border-2 border-dashed","appearance-none bg-transparent font-[inherit] outline-none","transition-[border-color,background-color] duration-(--mp-sys-motion-duration-short4)",h[$],u[$],_?"border-mp-on-surface/12 text-mp-on-surface/38 cursor-default":[P?"cursor-default":"cursor-pointer",U?"border-mp-error":"border-mp-outline-variant","text-mp-on-surface",K?"border-mp-primary bg-mp-primary/8":""].filter(Boolean).join(" ")].filter(Boolean).join(" "),onClick:()=>{!X&&V.current&&(V.current.value="",V.current.click())},children:[X?null:e(c,{layer:"inset-0 rounded-[inherit] bg-mp-primary"}),void 0===F?e(t,{icon:i,size:1.6*p[$],className:_?"":"text-mp-primary"}):f(F)?e("span",{className:_?"":"text-mp-primary",children:F}):null,e("span",{className:"font-medium",children:B??"Drop files here, or click to browse"}),f(D)?e("span",{className:[m,_?"text-mp-on-surface/38":"text-mp-on-surface-variant"].join(" "),children:D}):null]}),e("input",{ref:V,type:"file",name:R,accept:b,multiple:v,required:W&&0===Y.length,disabled:X,tabIndex:-1,"aria-labelledby":f(z)?ee:void 0,"aria-describedby":f(C)||U?Z:void 0,className:"absolute size-px overflow-hidden opacity-0 [clip-path:inset(50%)]",onChange:e=>te(Array.from(e.target.files??[]))})]}),L&&Y.length>0?e("ul",{className:["mp-file-picker__list m-0 flex w-full list-none flex-col p-0",d[$]].join(" "),children:Y.map((n,i)=>r("li",{className:["rounded-mp-xs bg-mp-surface-container-low flex w-full items-center gap-3","px-3 py-2",u[$],_?"text-mp-on-surface/38":"text-mp-on-surface"].join(" "),children:[e("span",{className:"min-w-0 flex-1 truncate",children:n.name}),e("span",{className:[m,"shrink-0 tabular-nums",_?"text-mp-on-surface/38":"text-mp-on-surface-variant"].join(" "),children:formatFileSize(n.size)}),X?null:r("button",{type:"button","aria-label":M?M(n.name):o(A.removeNamed,{label:n.name}),className:["group text-mp-on-surface-variant relative flex size-8 shrink-0","cursor-pointer appearance-none items-center justify-center rounded-full","bg-transparent p-0 font-[inherit] outline-none"].join(" "),onClick:()=>re(Y.filter((e,r)=>r!==i)),children:[e(c,{}),e(t,{icon:a,size:18})]})]},`${n.name}-${n.size}-${n.lastModified}-${i}`))}):null,U?e("span",{id:Z,className:[m,"text-mp-error"].join(" "),children:I}):f(C)?e("span",{id:Z,className:[m,_?"text-mp-on-surface/38":"text-mp-on-surface-variant"].join(" "),children:C}):null]})});
+"use client";
+import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as n from"react";import{MPIcon as t}from"../icon/MPIcon.js";import{CloseIcon as a,UploadIcon as i}from"../../constants/icons.js";import{fillMessage as o}from"../../internal/i18n.js";import{useMPLocale as l,useMPMessages as s}from"../../internal/locale.js";import{COMMON as c}from"../../internal/messages/common.js";import{MPStateLayer as p}from"../../internal/StateLayer.js";import{CONTROL_ICON as m,META_TEXT as u,PROSE_TEXT as d,STACK_GAP as f,hasContent as h}from"../../internal/scale.js";const x={xs:"p-4",sm:"p-5",md:"p-6",lg:"p-8",xl:"p-10"};export function formatFileSize(e){if(e<1e3)return`${e} B`;const r=["kB","MB","GB","TB"];let n=e/1e3,t=0;for(;n>=1e3&&t<r.length-1;)n/=1e3,t+=1;return`${n<10?n.toFixed(1):Math.round(n)} ${r[t]}`}function b(e,r){const n=e.name.toLowerCase(),t=e.type.toLowerCase();return r.split(",").map(e=>e.trim().toLowerCase()).filter(Boolean).some(e=>e.startsWith(".")?n.endsWith(e):e.endsWith("/*")?t.startsWith(e.slice(0,-1)):t===e)}export const MPFilePicker=/*@__PURE__*/n.forwardRef(function({accept:v,multiple:g=!1,maxSize:j,maxFiles:y,value:N,defaultValue:k,onFilesChange:w,onReject:z,label:C,description:I,errorMessage:B,title:D,hint:F,icon:L,showList:M=!0,removeLabel:S,locale:$,size:T="md",fullWidth:W=!0,required:_=!1,disabled:P=!1,readOnly:R=!1,name:E,id:O},q){const A=l($),V=s(c,A),G=n.useRef(null);n.useImperativeHandle(q,()=>G.current,[]);const[H,Y]=n.useState(()=>[...k??[]]),J=N?[...N]:H,K=n.useRef(0),[Q,U]=n.useState(!1),X=h(B),Z=P||R,ee=n.useId(),re=n.useId(),ne=n.useCallback(e=>{N||Y(e),w?.(e)},[w,N]),te=n.useCallback(e=>{const r=[],n=[],t=g?y??Number.POSITIVE_INFINITY:1,a=g?J.length:0;for(const i of e)v&&!b(i,v)?n.push({file:i,reason:"type"}):void 0!==j&&i.size>j?n.push({file:i,reason:"size"}):a+r.length>=t?n.push({file:i,reason:"count"}):r.push(i);return{kept:r,rejections:n}},[v,J.length,y,j,g]),ae=n.useCallback(e=>{const{kept:r,rejections:n}=te(e);n.length>0&&z?.(n),r.length>0&&ne(g?[...J,...r]:r)},[te,ne,J,g,z]);return r("div",{className:["mp-file-picker flex-col align-top",f[T],W?"flex w-full":"inline-flex"].join(" "),"data-mp-size":T,"data-disabled":P||void 0,"data-invalid":X||void 0,children:[h(C)?r("span",{id:re,className:[u,P?"text-mp-on-surface/38":X?"text-mp-error":"text-mp-on-surface-variant"].join(" "),children:[C,_?e("span",{"aria-hidden":"true",children:" *"}):null]}):null,r("div",{className:"flex w-full flex-col",onDragEnter:e=>{Z||(e.preventDefault(),K.current+=1,U(!0))},onDragOver:e=>{Z||(e.preventDefault(),e.dataTransfer.dropEffect="copy")},onDragLeave:()=>{Z||(K.current=Math.max(0,K.current-1),0===K.current&&U(!1))},onDrop:e=>{Z||(e.preventDefault(),K.current=0,U(!1),ae(Array.from(e.dataTransfer.files)))},children:[r("button",{type:"button",id:O,disabled:P,"aria-describedby":h(I)||X?ee:void 0,"aria-invalid":X||void 0,className:["mp-file-picker__zone group relative flex w-full flex-col items-center","justify-center gap-2 text-center","rounded-mp-md box-border border-2 border-dashed","appearance-none bg-transparent font-[inherit] outline-none","transition-[border-color,background-color] duration-(--mp-sys-motion-duration-short4)",x[T],d[T],P?"border-mp-on-surface/12 text-mp-on-surface/38 cursor-default":[R?"cursor-default":"cursor-pointer",X?"border-mp-error":"border-mp-outline-variant","text-mp-on-surface",Q?"border-mp-primary bg-mp-primary/8":""].filter(Boolean).join(" ")].filter(Boolean).join(" "),onClick:()=>{!Z&&G.current&&(G.current.value="",G.current.click())},children:[Z?null:e(p,{layer:"inset-0 rounded-[inherit] bg-mp-primary"}),void 0===L?e(t,{icon:i,size:1.6*m[T],className:P?"":"text-mp-primary"}):h(L)?e("span",{className:P?"":"text-mp-primary",children:L}):null,e("span",{className:"font-medium",children:D??"Drop files here, or click to browse"}),h(F)?e("span",{className:[u,P?"text-mp-on-surface/38":"text-mp-on-surface-variant"].join(" "),children:F}):null]}),e("input",{ref:G,type:"file",name:E,accept:v,multiple:g,required:_&&0===J.length,disabled:Z,tabIndex:-1,"aria-labelledby":h(C)?re:void 0,"aria-describedby":h(I)||X?ee:void 0,className:"absolute size-px overflow-hidden opacity-0 [clip-path:inset(50%)]",onChange:e=>ae(Array.from(e.target.files??[]))})]}),M&&J.length>0?e("ul",{className:["mp-file-picker__list m-0 flex w-full list-none flex-col p-0",f[T]].join(" "),children:J.map((n,i)=>r("li",{className:["rounded-mp-xs bg-mp-surface-container-low flex w-full items-center gap-3","px-3 py-2",d[T],P?"text-mp-on-surface/38":"text-mp-on-surface"].join(" "),children:[e("span",{className:"min-w-0 flex-1 truncate",children:n.name}),e("span",{className:[u,"shrink-0 tabular-nums",P?"text-mp-on-surface/38":"text-mp-on-surface-variant"].join(" "),children:formatFileSize(n.size)}),Z?null:r("button",{type:"button","aria-label":S?S(n.name):o(V.removeNamed,{label:n.name}),className:["group text-mp-on-surface-variant relative flex size-8 shrink-0","cursor-pointer appearance-none items-center justify-center rounded-full","bg-transparent p-0 font-[inherit] outline-none"].join(" "),onClick:()=>ne(J.filter((e,r)=>r!==i)),children:[e(p,{}),e(t,{icon:a,size:18})]})]},`${n.name}-${n.size}-${n.lastModified}-${i}`))}):null,X?e("span",{id:ee,className:[u,"text-mp-error"].join(" "),children:B}):h(I)?e("span",{id:ee,className:[u,P?"text-mp-on-surface/38":"text-mp-on-surface-variant"].join(" "),children:I}):null]})});

package/dist/components/file-picker/index.d.ts

@@ -1,2 +1,2 @@
-export { MPFilePicker, formatFileSize } from './MPFilePicker';
-export type { MPFilePickerProps, MPFileRejection, MPFileRejectionReason } from './MPFilePicker';
+export { MPFilePicker, formatFileSize } from './MPFilePicker.js';
+export type { MPFilePickerProps, MPFileRejection, MPFileRejectionReason } from './MPFilePicker.js';

package/dist/components/file-picker/index.js

@@ -1 +1 @@
-export{MPFilePicker,formatFileSize}from"./MPFilePicker";
+export{MPFilePicker,formatFileSize}from"./MPFilePicker.js";

package/dist/components/floating-action-button/MPFloatingActionButton.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { MPColor, MPCorner, MPPosition, MPSize } from '../../types';
+import type { MPColor, MPCorner, MPPosition, MPSize } from '../../types.js';
 /**
  * The three containers MD3 gives a floating button, and the reason there are not
  * five of them.

package/dist/components/floating-action-button/MPFloatingActionButton.js

@@ -1 +1,2 @@
-import{jsx as t,jsxs as e}from"react/jsx-runtime";import*as a from"react";import{Button as o}from"@base-ui/react/button";import{accentSlots as n}from"../../internal/accent";import{MPStateLayer as i}from"../../internal/StateLayer";import{hasContent as s}from"../../internal/scale";const r={filled:"bg-(--_mp-accent) text-(--_mp-on-accent)",tonal:"bg-(--_mp-accent-container) text-(--_mp-on-accent-container)",elevated:"bg-mp-surface-container-high text-(--_mp-accent)"},m={xs:"h-10",sm:"h-12",md:"h-14",lg:"h-18",xl:"h-24"},l={xs:"min-w-10 gap-0 px-0",sm:"min-w-12 gap-0 px-0",md:"min-w-14 gap-0 px-0",lg:"min-w-18 gap-0 px-0",xl:"min-w-24 gap-0 px-0"},p={xs:"rounded-mp-md",sm:"rounded-mp-lg",md:"rounded-mp-lg",lg:"rounded-mp-xl",xl:"rounded-mp-xl"},d={xs:24,sm:24,md:24,lg:30,xl:36},f={xs:"text-mp-label-large",sm:"text-mp-label-large",md:"text-mp-label-large",lg:"text-mp-title-medium",xl:"text-mp-title-medium"},c={xs:"min-w-16 gap-1.5 px-3",sm:"min-w-18 gap-2 px-4",md:"min-w-20 gap-2 px-4",lg:"min-w-24 gap-2.5 px-5",xl:"min-w-28 gap-3 px-6"},x={absolute:"absolute z-30",sticky:"sticky z-30",fixed:"fixed z-40"},u={"top-start":"top-(--_mp-fab-offset) start-(--_mp-fab-offset)","top-end":"top-(--_mp-fab-offset) end-(--_mp-fab-offset)","bottom-start":"bottom-(--_mp-fab-offset) start-(--_mp-fab-offset)","bottom-end":"bottom-(--_mp-fab-offset) end-(--_mp-fab-offset)"};export const MPFloatingActionButton=a.forwardRef(function({icon:a,label:b,extended:g=!1,variant:h="tonal",color:w="primary",size:y="md",position:_="fixed",corner:v="bottom-end",offset:j=16,disabled:k=!1,type:z="button",className:N,style:$,...B},A){return e(o,{ref:A,type:z,disabled:k,"aria-label":b,"data-mp-size":y,"data-mp-variant":h,className:["mp-fab group inline-flex shrink-0 items-center justify-center","box-border overflow-hidden align-middle whitespace-nowrap select-none","cursor-pointer appearance-none font-[inherit]","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-2","focus-visible:outline-solid outline-none","transition-[background-color,box-shadow,color,min-width,padding,gap]","duration-(--mp-sys-motion-duration-short4) ease-mp-standard",p[y],m[y],f[y],g?c[y]:l[y],k?"bg-mp-on-surface/12 text-mp-on-surface/38 cursor-default shadow-none":`${r[h]} shadow-mp-3`,"static"===_?"relative":`${x[_]} ${u[v]}`,N??""].filter(Boolean).join(" "),style:{...n(w),"--_mp-fab-offset":"number"==typeof j?`${j}px`:j,...$},...B,children:[k?null:t(i,{}),s(a)?t("span",{className:"relative flex shrink-0 items-center justify-center",style:{width:d[y],height:d[y]},children:a}):null,t("span",{className:["relative grid transition-[grid-template-columns]","duration-(--mp-sys-motion-duration-short4) ease-mp-standard",g?"grid-cols-[1fr]":"grid-cols-[0fr]"].join(" "),children:t("span",{className:"min-w-0 truncate",children:b})})]})});
+"use client";
+import{jsx as t,jsxs as e}from"react/jsx-runtime";import*as a from"react";import{Button as o}from"@base-ui/react/button";import{accentSlots as n}from"../../internal/accent.js";import{MPStateLayer as i}from"../../internal/StateLayer.js";import{hasContent as s}from"../../internal/scale.js";const r={filled:"bg-(--_mp-accent) text-(--_mp-on-accent)",tonal:"bg-(--_mp-accent-container) text-(--_mp-on-accent-container)",elevated:"bg-mp-surface-container-high text-(--_mp-accent)"},m={xs:"h-10",sm:"h-12",md:"h-14",lg:"h-18",xl:"h-24"},l={xs:"min-w-10 gap-0 px-0",sm:"min-w-12 gap-0 px-0",md:"min-w-14 gap-0 px-0",lg:"min-w-18 gap-0 px-0",xl:"min-w-24 gap-0 px-0"},p={xs:"rounded-mp-md",sm:"rounded-mp-lg",md:"rounded-mp-lg",lg:"rounded-mp-xl",xl:"rounded-mp-xl"},d={xs:24,sm:24,md:24,lg:30,xl:36},f={xs:"text-mp-label-large",sm:"text-mp-label-large",md:"text-mp-label-large",lg:"text-mp-title-medium",xl:"text-mp-title-medium"},c={xs:"min-w-16 gap-1.5 px-3",sm:"min-w-18 gap-2 px-4",md:"min-w-20 gap-2 px-4",lg:"min-w-24 gap-2.5 px-5",xl:"min-w-28 gap-3 px-6"},x={absolute:"absolute z-30",sticky:"sticky z-30",fixed:"fixed z-40"},u={"top-start":"top-(--_mp-fab-offset) start-(--_mp-fab-offset)","top-end":"top-(--_mp-fab-offset) end-(--_mp-fab-offset)","bottom-start":"bottom-(--_mp-fab-offset) start-(--_mp-fab-offset)","bottom-end":"bottom-(--_mp-fab-offset) end-(--_mp-fab-offset)"};export const MPFloatingActionButton=/*@__PURE__*/a.forwardRef(function({icon:a,label:b,extended:g=!1,variant:h="tonal",color:w="primary",size:y="md",position:_="fixed",corner:j="bottom-end",offset:v=16,disabled:k=!1,type:z="button",className:N,style:$,...B},A){return e(o,{ref:A,type:z,disabled:k,"aria-label":b,"data-mp-size":y,"data-mp-variant":h,className:["mp-fab group inline-flex shrink-0 items-center justify-center","box-border overflow-hidden align-middle whitespace-nowrap select-none","cursor-pointer appearance-none font-[inherit]","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-2","focus-visible:outline-solid outline-none","transition-[background-color,box-shadow,color,min-width,padding,gap]","duration-(--mp-sys-motion-duration-short4) ease-mp-standard",p[y],m[y],f[y],g?c[y]:l[y],k?"bg-mp-on-surface/12 text-mp-on-surface/38 cursor-default shadow-none":`${r[h]} shadow-mp-3`,"static"===_?"relative":`${x[_]} ${u[j]}`,N??""].filter(Boolean).join(" "),style:{...n(w),"--_mp-fab-offset":"number"==typeof v?`${v}px`:v,...$},...B,children:[k?null:t(i,{}),s(a)?t("span",{className:"relative flex shrink-0 items-center justify-center",style:{width:d[y],height:d[y]},children:a}):null,t("span",{className:["relative grid transition-[grid-template-columns]","duration-(--mp-sys-motion-duration-short4) ease-mp-standard",g?"grid-cols-[1fr]":"grid-cols-[0fr]"].join(" "),children:t("span",{className:"min-w-0 truncate",children:b})})]})});

package/dist/components/floating-action-button/index.d.ts

@@ -1,2 +1,2 @@
-export { MPFloatingActionButton } from './MPFloatingActionButton';
-export type { MPFloatingActionButtonProps, MPFloatingActionButtonVariant } from './MPFloatingActionButton';
+export { MPFloatingActionButton } from './MPFloatingActionButton.js';
+export type { MPFloatingActionButtonProps, MPFloatingActionButtonVariant } from './MPFloatingActionButton.js';

package/dist/components/floating-action-button/index.js

@@ -1 +1 @@
-export{MPFloatingActionButton}from"./MPFloatingActionButton";
+export{MPFloatingActionButton}from"./MPFloatingActionButton.js";

package/dist/components/grid/MPGrid.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { useRender } from '@base-ui/react/use-render';
-import type { MPResponsive } from '../../types';
+import type { MPResponsive } from '../../types.js';
 /**
  * How a row divides the space its items did not take.
  *

package/dist/components/grid/MPGrid.js

@@ -1 +1,2 @@
-import*as e from"react";import{useRender as t}from"@base-ui/react/use-render";const n=["compact","medium","expanded","large","extra-large"];function r(e,t,r){const a=function(e){return null==e?{}:"object"==typeof e?e:{compact:e}}(t),s={};for(const t of n){const n=a[t];void 0!==n&&(s[`--_mp-${e}-${t}`]=r(n))}return s}function a(e,t){return null==e?t:"object"==typeof e?{compact:t,...e}:e}function s(e){return String(Math.max(1,Math.round(e)))}function o(e){return String(Math.max(1,Math.round(e)))}function c(e){return String(Math.max(0,Math.round(e)))}function i(e){const t=.25*Math.max(0,e);return`${Number(t.toFixed(5))}rem`}const l={start:"justify-start",center:"justify-center",end:"justify-end","space-between":"justify-between","space-around":"justify-around","space-evenly":"justify-evenly"},f={start:"items-start",center:"items-center",end:"items-end",stretch:"items-stretch",baseline:"items-baseline"},u={start:"content-start",center:"content-center",end:"content-end","space-between":"content-between","space-around":"content-around","space-evenly":"content-evenly",stretch:"content-stretch"},p={auto:"self-auto",start:"self-start",center:"self-center",end:"self-end",stretch:"self-stretch",baseline:"self-baseline"};export const MPGrid=e.forwardRef(function({columns:e,spacing:n,rowSpacing:o,columnSpacing:c,justifyContent:p,alignItems:d,alignContent:m,wrap:y=!0,render:g,className:h,style:x,children:b,...j},w){return t({render:g,ref:w,props:{className:["mp-grid flex",y?"flex-wrap":"flex-nowrap","gap-x-(--_mp-gap-x) gap-y-(--_mp-gap-y)",p?l[p]:"",d?f[d]:"",m?u[m]:"",h??""].filter(Boolean).join(" "),style:{...r("cols",a(e,12),s),...r("gap-x",a(c??n,4),i),...r("gap-y",a(o??n,4),i),...x},children:b,...j}})});export const MPGridItem=e.forwardRef(function({span:e,offset:n,alignSelf:a,render:s,className:i,style:l,children:f,...u},d){return t({render:s,ref:d,props:{className:["mp-grid-item",a?p[a]:"",i??""].filter(Boolean).join(" "),style:{...r("span",e,o),...r("offset",n,c),...l},children:f,...u}})});
+"use client";
+import*as e from"react";import{useRender as t}from"@base-ui/react/use-render";const n=["compact","medium","expanded","large","extra-large"];function r(e,t,r){const a=function(e){return null==e?{}:"object"==typeof e?e:{compact:e}}(t),s={};for(const t of n){const n=a[t];void 0!==n&&(s[`--_mp-${e}-${t}`]=r(n))}return s}function a(e,t){return null==e?t:"object"==typeof e?{compact:t,...e}:e}function s(e){return String(Math.max(1,Math.round(e)))}function o(e){return String(Math.max(1,Math.round(e)))}function c(e){return String(Math.max(0,Math.round(e)))}function i(e){const t=.25*Math.max(0,e);return`${Number(t.toFixed(5))}rem`}const l={start:"justify-start",center:"justify-center",end:"justify-end","space-between":"justify-between","space-around":"justify-around","space-evenly":"justify-evenly"},f={start:"items-start",center:"items-center",end:"items-end",stretch:"items-stretch",baseline:"items-baseline"},u={start:"content-start",center:"content-center",end:"content-end","space-between":"content-between","space-around":"content-around","space-evenly":"content-evenly",stretch:"content-stretch"},p={auto:"self-auto",start:"self-start",center:"self-center",end:"self-end",stretch:"self-stretch",baseline:"self-baseline"};export const MPGrid=/*@__PURE__*/e.forwardRef(function({columns:e,spacing:n,rowSpacing:o,columnSpacing:c,justifyContent:p,alignItems:d,alignContent:m,wrap:y=!0,render:g,className:h,style:x,children:b,...j},w){return t({render:g,ref:w,props:{className:["mp-grid flex",y?"flex-wrap":"flex-nowrap","gap-x-(--_mp-gap-x) gap-y-(--_mp-gap-y)",p?l[p]:"",d?f[d]:"",m?u[m]:"",h??""].filter(Boolean).join(" "),style:{...r("cols",a(e,12),s),...r("gap-x",a(c??n,4),i),...r("gap-y",a(o??n,4),i),...x},children:b,...j}})});export const MPGridItem=/*@__PURE__*/e.forwardRef(function({span:e,offset:n,alignSelf:a,render:s,className:i,style:l,children:f,...u},d){return t({render:s,ref:d,props:{className:["mp-grid-item",a?p[a]:"",i??""].filter(Boolean).join(" "),style:{...r("span",e,o),...r("offset",n,c),...l},children:f,...u}})});

package/dist/components/grid/index.d.ts

@@ -1,2 +1,2 @@
-export { MPGrid, MPGridItem } from './MPGrid';
-export type { MPGridAlign, MPGridAlignSelf, MPGridItemProps, MPGridJustify, MPGridProps } from './MPGrid';
+export { MPGrid, MPGridItem } from './MPGrid.js';
+export type { MPGridAlign, MPGridAlignSelf, MPGridItemProps, MPGridJustify, MPGridProps } from './MPGrid.js';

package/dist/components/grid/index.js

@@ -1 +1 @@
-export{MPGrid,MPGridItem}from"./MPGrid";
+export{MPGrid,MPGridItem}from"./MPGrid.js";

package/dist/components/highlight/MPHighlight.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import type { MPTypographyWeight } from '../typography/MPTypography';
-import type { MPColor, MPVariant } from '../../types';
+import type { MPTypographyWeight } from '../typography/MPTypography.js';
+import type { MPColor, MPVariant } from '../../types.js';
 /**
  * The four weights a mark can be drawn at.
  *

package/dist/components/highlight/MPHighlight.js

@@ -1 +1,2 @@
-import{jsx as e}from"react/jsx-runtime";import*as n from"react";import{accentSlots as t}from"../../internal/accent";const r={filled:"bg-(--_mp-accent) text-(--_mp-on-accent)",tonal:"bg-(--_mp-accent-container) text-(--_mp-on-accent-container)",outlined:"border border-(--_mp-accent) bg-transparent text-(--_mp-accent)",text:"bg-transparent text-(--_mp-accent)"},o={regular:"font-normal",medium:"font-medium",semibold:"font-semibold",bold:"font-bold"},i=/[\p{L}\p{N}_]/u;function l(e){return e.replace(/[-.*+?^${}()|[\]\\]/g,"\\$&")}function a(e,n,t){const r=n>0?e[n-1]:"",o=t<e.length?e[t]:"";return!i.test(r)&&!i.test(o)}function c(e,n,t,r){n.lastIndex=0;const o=[];let i,l=0;for(;null!==(i=n.exec(e));){if(""===i[0]){n.lastIndex+=1;continue}const c=i.index,s=c+i[0].length;t&&!a(e,c,s)||(c>l&&o.push(e.slice(l,c)),o.push(r(i[0],String(c))),l=s)}return 0===o.length?e:(l<e.length&&o.push(e.slice(l)),o)}function s(e,t,r,o){if("string"==typeof e)return c(e,t,r,o);if("number"==typeof e)return c(String(e),t,r,o);if(Array.isArray(e))return n.Children.map(e,e=>s(e,t,r,o));if(n.isValidElement(e)){const i=e.props.children;return void 0===i||"function"==typeof i?e:n.cloneElement(e,void 0,s(i,t,r,o))}return e}export const MPHighlight=n.forwardRef(function({query:i,variant:a="tonal",color:c="tertiary",caseSensitive:u=!1,wholeWord:f=!1,underline:m=!1,weight:p,className:g,style:d,children:h,...x},b){const y=i instanceof RegExp?`re ${i.source} ${i.flags}`:Array.isArray(i)?`a ${i.join("\0")}`:`s ${i}`,_=n.useMemo(()=>function(e,n){if(e instanceof RegExp)return new RegExp(e.source,e.global?e.flags:`${e.flags}g`);const t=(Array.isArray(e)?e:[e]).map(e=>e.trim()).filter(Boolean).sort((e,n)=>n.length-e.length);return 0===t.length?null:new RegExp(t.map(l).join("|"),n?"gu":"giu")}(i,u),[y,u]),$=["rounded-mp-xs -mx-0.5 px-0.5","box-decoration-clone",r[a],m?"underline decoration-2 underline-offset-2":"",p?o[p]:""].filter(Boolean).join(" "),j=n.useMemo(()=>_?s(h,_,f,(n,t)=>e("mark",{className:$,children:n},t)):h,[h,_,f,$]);return e("span",{ref:b,className:["mp-highlight",g??""].filter(Boolean).join(" "),style:{...t(c),...d},...x,children:j})});
+"use client";
+import{jsx as e}from"react/jsx-runtime";import*as n from"react";import{accentSlots as t}from"../../internal/accent.js";const r={filled:"bg-(--_mp-accent) text-(--_mp-on-accent)",tonal:"bg-(--_mp-accent-container) text-(--_mp-on-accent-container)",outlined:"border border-(--_mp-accent) bg-transparent text-(--_mp-accent)",text:"bg-transparent text-(--_mp-accent)"},o={regular:"font-normal",medium:"font-medium",semibold:"font-semibold",bold:"font-bold"},i=/[\p{L}\p{N}_]/u;function l(e){return e.replace(/[-.*+?^${}()|[\]\\]/g,"\\$&")}function a(e,n,t){const r=n>0?e[n-1]:"",o=t<e.length?e[t]:"";return!i.test(r)&&!i.test(o)}function c(e,n,t,r){n.lastIndex=0;const o=[];let i,l=0;for(;null!==(i=n.exec(e));){if(""===i[0]){n.lastIndex+=1;continue}const c=i.index,s=c+i[0].length;t&&!a(e,c,s)||(c>l&&o.push(e.slice(l,c)),o.push(r(i[0],String(c))),l=s)}return 0===o.length?e:(l<e.length&&o.push(e.slice(l)),o)}function s(e,t,r,o){if("string"==typeof e)return c(e,t,r,o);if("number"==typeof e)return c(String(e),t,r,o);if(Array.isArray(e))return n.Children.map(e,e=>s(e,t,r,o));if(n.isValidElement(e)){const i=e.props.children;return void 0===i||"function"==typeof i?e:n.cloneElement(e,void 0,s(i,t,r,o))}return e}export const MPHighlight=/*@__PURE__*/n.forwardRef(function({query:i,variant:a="tonal",color:c="tertiary",caseSensitive:u=!1,wholeWord:f=!1,underline:m=!1,weight:p,className:g,style:d,children:h,...x},b){const y=i instanceof RegExp?`re ${i.source} ${i.flags}`:Array.isArray(i)?`a ${i.join("\0")}`:`s ${i}`,_=n.useMemo(()=>function(e,n){if(e instanceof RegExp)return new RegExp(e.source,e.global?e.flags:`${e.flags}g`);const t=(Array.isArray(e)?e:[e]).map(e=>e.trim()).filter(Boolean).sort((e,n)=>n.length-e.length);return 0===t.length?null:new RegExp(t.map(l).join("|"),n?"gu":"giu")}(i,u),[y,u]),j=["rounded-mp-xs -mx-0.5 px-0.5","box-decoration-clone",r[a],m?"underline decoration-2 underline-offset-2":"",p?o[p]:""].filter(Boolean).join(" "),$=n.useMemo(()=>_?s(h,_,f,(n,t)=>e("mark",{className:j,children:n},t)):h,[h,_,f,j]);return e("span",{ref:b,className:["mp-highlight",g??""].filter(Boolean).join(" "),style:{...t(c),...d},...x,children:$})});

package/dist/components/highlight/index.d.ts

@@ -1,2 +1,2 @@
-export { MPHighlight } from './MPHighlight';
-export type { MPHighlightProps, MPHighlightVariant } from './MPHighlight';
+export { MPHighlight } from './MPHighlight.js';
+export type { MPHighlightProps, MPHighlightVariant } from './MPHighlight.js';

package/dist/components/highlight/index.js

@@ -1 +1 @@
-export{MPHighlight}from"./MPHighlight";
+export{MPHighlight}from"./MPHighlight.js";

package/dist/components/icon/MPIcon.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { MPIconGlyph } from '../../types';
+import type { MPIconGlyph } from '../../types.js';
 export interface MPIconProps extends Omit<React.ComponentPropsWithoutRef<'span'>, 'color'> {
     /**
      * The glyph to draw: a component from an icon set, or an element of your own.

package/dist/components/icon/MPIcon.js

@@ -1 +1,2 @@
-import{jsx as e}from"react/jsx-runtime";import*as i from"react";function o(e){return!i.isValidElement(e)}export const MPIcon=i.forwardRef(function({icon:r,size:t,color:l,strokeWidth:n,center:s=!1,label:c,className:a,style:d,...f},m){const u=["mp-icon inline-flex shrink-0 items-center justify-center align-middle",void 0===t?"":"[&>svg]:block [&>svg]:size-full [&>img]:block [&>img]:size-full",s?"justify-self-center":"",a??""].filter(Boolean).join(" ");return e("span",{ref:m,className:u,style:{...void 0===t?{}:{width:t,height:t,fontSize:t},...void 0===l?{}:{color:l},...d},role:c?"img":void 0,"aria-label":c,"aria-hidden":!c||void 0,...f,children:o(r)?i.createElement(r,{size:t,color:void 0===l?"currentColor":l,strokeWidth:n}):r})});
+"use client";
+import{jsx as e}from"react/jsx-runtime";import*as i from"react";function o(e){return!i.isValidElement(e)}export const MPIcon=/*@__PURE__*/i.forwardRef(function({icon:r,size:t,color:l,strokeWidth:n,center:s=!1,label:c,className:a,style:d,...f},m){const u=["mp-icon inline-flex shrink-0 items-center justify-center align-middle",void 0===t?"":"[&>svg]:block [&>svg]:size-full [&>img]:block [&>img]:size-full",s?"justify-self-center":"",a??""].filter(Boolean).join(" ");return e("span",{ref:m,className:u,style:{...void 0===t?{}:{width:t,height:t,fontSize:t},...void 0===l?{}:{color:l},...d},role:c?"img":void 0,"aria-label":c,"aria-hidden":!c||void 0,...f,children:o(r)?i.createElement(r,{size:t,color:void 0===l?"currentColor":l,strokeWidth:n}):r})});

package/dist/components/icon/index.d.ts

@@ -1,2 +1,2 @@
-export { MPIcon } from './MPIcon';
-export type { MPIconProps } from './MPIcon';
+export { MPIcon } from './MPIcon.js';
+export type { MPIconProps } from './MPIcon.js';

package/dist/components/icon/index.js

@@ -1 +1 @@
-export{MPIcon}from"./MPIcon";
+export{MPIcon}from"./MPIcon.js";