material-plus-ui 1.1.0 → 1.3.0

package/README.md

@@ -22,7 +22,7 @@ It follows the specification directly rather than wrapping somebody's implementa
 - **It coexists.** Nothing here is page-level — no reset, no provider, no global styling — and it reads the `--md-sys-color-*` tokens your page already has if they are there. A project already running Material keeps its own setup.
 - **IME-safe by construction.** Korean, Japanese and Chinese composition survives whatever your `onChange` does with the value.
 - **Bring your own icons.** `MPIcon` takes a component or an element from any set. `lucide-react` ships with the package, gathered in one readable constants file.
-- **ESM only**, TypeScript declarations included, tree-shakeable — every component compiles to its own module.
+- **ESM only**, TypeScript declarations included, and tree-shakeable for real: one component is 3.4 kB gzipped and five are 7.4 kB, against 64 kB for all ninety-four. The stylesheet splits the same way.
 - **One runtime dependency.** React 18 or 19, Node.js 18 or later.
 
 ## Documentation
@@ -73,6 +73,26 @@ If Tailwind v4 is already in your project, import the token sheet instead:
 @import 'material-plus-ui/tailwind.css';
 ```
 
+A page that renders a handful of components can take the tokens and a sheet each instead of the whole 109 kB — 3.8 kB gzipped for one component against 15.6 kB for the lot. [The guide](https://material-plus.cdget.com/guide/getting-started#if-you-only-render-a-few-components) has the numbers and where the two paths cross.
+
+```ts
+import 'material-plus-ui/styles/tokens.css';
+import 'material-plus-ui/styles/button.css';
+```
+
+### Languages other than English
+
+The library carries English. Every other translation is a module you hand over, once, at startup:
+
+```ts
+import { registerMPMessages } from 'material-plus-ui';
+import { ko } from 'material-plus-ui/locales';
+
+registerMPMessages(ko);
+```
+
+After that `locale="ko"` resolves the way it always did. Eighteen languages ship; `registerMPMessages(...LOCALES)` takes all of them, a tag nobody registered falls back to English, and a table of your own is a plain object. See [the localisation guide](https://material-plus.cdget.com/design/localization).
+
 ## Usage
 
 There is no provider. Import a component and render it.

package/dist/components/accordion/MPAccordion.js

@@ -1 +1 @@
-import{jsx as e,jsxs as n}from"react/jsx-runtime";import*as t from"react";import{Accordion as i}from"@base-ui/react/accordion";import{MPIcon as a}from"../icon/MPIcon";import{ChevronDownIcon as r}from"../../constants/icons";import{MPStateLayer as o}from"../../internal/StateLayer";import{CONTROL_GAP as s,CONTROL_ICON as l,hasContent as d,META_TEXT as c,PROSE_TEXT as m,SHEET_PAD_X as u,SHEET_PAD_Y as f,SHEET_TITLE as p}from"../../internal/scale";import{CONTAINER_SURFACE as h}from"../../internal/surface";const x=t.createContext({size:"md",dividers:!0}),v=["h-(--accordion-panel-height) overflow-hidden","transition-[height] duration-(--mp-sys-motion-duration-short4) ease-mp-standard","motion-reduce:transition-none","data-starting-style:h-0 data-ending-style:h-0"].join(" "),b={xs:"pb-2.5",sm:"pb-3",md:"pb-4",lg:"pb-5",xl:"pb-6"};export const MPAccordion=t.forwardRef(function({multiple:n=!1,value:a,defaultValue:r,onValueChange:o,dividers:s=!0,disabled:l=!1,variant:d="outlined",size:c="md",hiddenUntilFound:m=!1,keepMounted:u=!1,className:f,children:p,...v},b){const N=t.useMemo(()=>({size:c,dividers:s}),[c,s]);return e(x.Provider,{value:N,children:e(i.Root,{ref:b,multiple:n,value:a,defaultValue:r,onValueChange:e=>o?.(e),disabled:l,hiddenUntilFound:m,keepMounted:u,"data-mp-size":c,"data-mp-variant":d,className:["mp-accordion rounded-mp-md flex w-full flex-col",h[d],"text-mp-on-surface",s?"overflow-hidden [&>div+div]:border-mp-outline-variant [&>div+div]:border-t":"p-1",f??""].filter(Boolean).join(" "),...v,children:p})})});export const MPAccordionItem=t.forwardRef(function({value:h,title:N,subtitle:g,startIcon:j,action:w,disabled:y=!1,className:z,children:M,...k},P){const{size:C,dividers:I}=t.useContext(x),V=u[C],B=f[C];return n(i.Item,{ref:P,value:h,disabled:y,className:["mp-accordion__item flex flex-col",z??""].filter(Boolean).join(" "),...k,children:[n(i.Header,{className:"m-0 flex w-full items-center font-[inherit]",children:[n(i.Trigger,{className:["group relative flex min-w-0 flex-1 cursor-pointer items-center text-start","appearance-none border-0 bg-transparent font-[inherit] text-inherit",V,B,s[C],I?"":"rounded-mp-sm","outline-mp-secondary focus-visible:outline-2 focus-visible:-outline-offset-2","focus-visible:outline-solid outline-none","disabled:text-mp-on-surface/38 disabled:cursor-default"].filter(Boolean).join(" "),children:[e(o,{}),d(j)?e("span",{className:"text-mp-on-surface-variant flex h-[1lh] shrink-0 items-center",children:j}):null,n("span",{className:"flex min-w-0 flex-1 flex-col",children:[d(N)?e("span",{className:`truncate ${p[C]}`,children:N}):null,d(g)?e("span",{className:`text-mp-on-surface-variant truncate ${c}`,children:g}):null]}),e("span",{className:["text-mp-on-surface-variant flex h-[1lh] shrink-0 items-center","transition-[rotate] duration-(--mp-sys-motion-duration-short4)","ease-mp-standard motion-reduce:transition-none","group-data-panel-open:rotate-180"].join(" "),children:e(a,{icon:r,size:l[C]})})]}),d(w)?e("span",{className:`flex shrink-0 items-center ${V}`,children:w}):null]}),e(i.Panel,{className:v,children:e("div",{className:["min-w-0",m[C],"text-mp-on-surface-variant",V,b[C]].join(" "),children:M})})]})});
+import{jsx as e,jsxs as n}from"react/jsx-runtime";import*as t from"react";import{Accordion as i}from"@base-ui/react/accordion";import{MPIcon as a}from"../icon/MPIcon";import{ChevronDownIcon as r}from"../../constants/icons";import{MPStateLayer as o}from"../../internal/StateLayer";import{CONTROL_GAP as s,CONTROL_ICON as l,hasContent as d,META_TEXT as c,PROSE_TEXT as m,SHEET_PAD_X as u,SHEET_PAD_Y as f,SHEET_TITLE as p}from"../../internal/scale";import{CONTAINER_SURFACE as h}from"../../internal/surface";const x=/*@__PURE__*/t.createContext({size:"md",dividers:!0}),v=["h-(--accordion-panel-height) overflow-hidden","transition-[height] duration-(--mp-sys-motion-duration-short4) ease-mp-standard","motion-reduce:transition-none","data-starting-style:h-0 data-ending-style:h-0"].join(" "),b={xs:"pb-2.5",sm:"pb-3",md:"pb-4",lg:"pb-5",xl:"pb-6"};export const MPAccordion=/*@__PURE__*/t.forwardRef(function({multiple:n=!1,value:a,defaultValue:r,onValueChange:o,dividers:s=!0,disabled:l=!1,variant:d="outlined",size:c="md",hiddenUntilFound:m=!1,keepMounted:u=!1,className:f,children:p,...v},b){const N=t.useMemo(()=>({size:c,dividers:s}),[c,s]);return e(x.Provider,{value:N,children:e(i.Root,{ref:b,multiple:n,value:a,defaultValue:r,onValueChange:e=>o?.(e),disabled:l,hiddenUntilFound:m,keepMounted:u,"data-mp-size":c,"data-mp-variant":d,className:["mp-accordion rounded-mp-md flex w-full flex-col",h[d],"text-mp-on-surface",s?"overflow-hidden [&>div+div]:border-mp-outline-variant [&>div+div]:border-t":"p-1",f??""].filter(Boolean).join(" "),...v,children:p})})});export const MPAccordionItem=/*@__PURE__*/t.forwardRef(function({value:h,title:N,subtitle:g,startIcon:j,action:w,disabled:y=!1,className:z,children:M,...k},P){const{size:C,dividers:I}=t.useContext(x),V=u[C],B=f[C];return n(i.Item,{ref:P,value:h,disabled:y,className:["mp-accordion__item flex flex-col",z??""].filter(Boolean).join(" "),...k,children:[n(i.Header,{className:"m-0 flex w-full items-center font-[inherit]",children:[n(i.Trigger,{className:["group relative flex min-w-0 flex-1 cursor-pointer items-center text-start","appearance-none border-0 bg-transparent font-[inherit] text-inherit",V,B,s[C],I?"":"rounded-mp-sm","outline-mp-secondary focus-visible:outline-2 focus-visible:-outline-offset-2","focus-visible:outline-solid outline-none","disabled:text-mp-on-surface/38 disabled:cursor-default"].filter(Boolean).join(" "),children:[e(o,{}),d(j)?e("span",{className:"text-mp-on-surface-variant flex h-[1lh] shrink-0 items-center",children:j}):null,n("span",{className:"flex min-w-0 flex-1 flex-col",children:[d(N)?e("span",{className:`truncate ${p[C]}`,children:N}):null,d(g)?e("span",{className:`text-mp-on-surface-variant truncate ${c}`,children:g}):null]}),e("span",{className:["text-mp-on-surface-variant flex h-[1lh] shrink-0 items-center","transition-[rotate] duration-(--mp-sys-motion-duration-short4)","ease-mp-standard motion-reduce:transition-none","group-data-panel-open:rotate-180"].join(" "),children:e(a,{icon:r,size:l[C]})})]}),d(w)?e("span",{className:`flex shrink-0 items-center ${V}`,children:w}):null]}),e(i.Panel,{className:v,children:e("div",{className:["min-w-0",m[C],"text-mp-on-surface-variant",V,b[C]].join(" "),children:M})})]})});

package/dist/components/alert/MPAlert.js

@@ -1 +1 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as n from"react";import{MPIcon as r}from"../icon/MPIcon";import{CloseIcon as a,ErrorIcon as l,InfoIcon as o}from"../../constants/icons";import{accentSlots as i}from"../../internal/accent";import{useMPLocale as s,useMPMessages as c}from"../../internal/locale";import{MPStateLayer as m}from"../../internal/StateLayer";import{CONTROL_ICON as d,hasContent as f,PROSE_TEXT as p,SHEET_GAP as u,SHEET_PAD as x,SHEET_TITLE as h,STACK_GAP as v}from"../../internal/scale";const b={filled:"bg-(--_mp-accent) text-(--_mp-on-accent)",tonal:"bg-(--_mp-accent-container) text-(--_mp-on-accent-container)",elevated:"shadow-mp-1 bg-mp-surface-container-low text-mp-on-surface",outlined:"border-mp-outline border bg-transparent text-mp-on-surface",text:"bg-transparent text-mp-on-surface"},y={filled:"",tonal:"",elevated:"text-(--_mp-accent)",outlined:"text-(--_mp-accent)",text:"text-(--_mp-accent)"},N={filled:"",tonal:"",elevated:"text-mp-on-surface-variant",outlined:"text-mp-on-surface-variant",text:"text-mp-on-surface-variant"},j={primary:"status",secondary:"status",tertiary:"status",error:"alert"};export const MPAlert=n.forwardRef(function({variant:n="tonal",color:g="primary",size:_="md",title:w,icon:z,action:k,onClose:B,closeLabel:C,locale:L,className:M,style:P,children:A,...I},R){const S=s(L),$=c("alert",S),q=y[n],D=f(w),E=void 0===z?e(r,{icon:"error"===g?l:o,size:d[_]}):z;return t("div",{ref:R,role:j[g],"data-mp-size":_,"data-mp-variant":n,className:["mp-alert rounded-mp-md flex w-full items-start","box-border",x[_],u[_],p[_],b[n],M??""].filter(Boolean).join(" "),style:{...i(g),...P},...I,children:[f(E)?e("span",{className:["flex h-[1lh] shrink-0 items-center",q].filter(Boolean).join(" "),children:E}):null,t("div",{className:`flex min-w-0 flex-1 flex-col ${v[_]}`,children:[D?e("div",{className:[h[_],q].filter(Boolean).join(" "),children:w}):null,f(A)?e("div",{className:D?N[n]:void 0,children:A}):null]}),f(k)?e("div",{className:"flex h-[1lh] shrink-0 items-center",children:k}):null,B?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:t("button",{type:"button","aria-label":C??$.dismiss,onClick:B,className:["group rounded-mp-full relative -m-1 flex size-8 cursor-pointer items-center","justify-center bg-transparent text-inherit","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-2","focus-visible:outline-solid outline-none"].join(" "),children:[e(m,{}),e(r,{icon:a,size:d[_]})]})}):null]})});
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as n from"react";import{MPIcon as r}from"../icon/MPIcon";import{CloseIcon as a,ErrorIcon as l,InfoIcon as o}from"../../constants/icons";import{accentSlots as i}from"../../internal/accent";import{useMPLocale as s,useMPMessages as c}from"../../internal/locale";import{MPStateLayer as m}from"../../internal/StateLayer";import{CONTROL_ICON as d,hasContent as f,PROSE_TEXT as p,SHEET_GAP as u,SHEET_PAD as x,SHEET_TITLE as h,STACK_GAP as v}from"../../internal/scale";const b={filled:"bg-(--_mp-accent) text-(--_mp-on-accent)",tonal:"bg-(--_mp-accent-container) text-(--_mp-on-accent-container)",elevated:"shadow-mp-1 bg-mp-surface-container-low text-mp-on-surface",outlined:"border-mp-outline border bg-transparent text-mp-on-surface",text:"bg-transparent text-mp-on-surface"},y={filled:"",tonal:"",elevated:"text-(--_mp-accent)",outlined:"text-(--_mp-accent)",text:"text-(--_mp-accent)"},N={filled:"",tonal:"",elevated:"text-mp-on-surface-variant",outlined:"text-mp-on-surface-variant",text:"text-mp-on-surface-variant"},j={primary:"status",secondary:"status",tertiary:"status",error:"alert"};export const MPAlert=/*@__PURE__*/n.forwardRef(function({variant:n="tonal",color:g="primary",size:_="md",title:w,icon:z,action:k,onClose:B,closeLabel:C,locale:L,className:M,style:P,children:A,...I},R){const S=s(L),$=c("alert",S),q=y[n],D=f(w),E=void 0===z?e(r,{icon:"error"===g?l:o,size:d[_]}):z;return t("div",{ref:R,role:j[g],"data-mp-size":_,"data-mp-variant":n,className:["mp-alert rounded-mp-md flex w-full items-start","box-border",x[_],u[_],p[_],b[n],M??""].filter(Boolean).join(" "),style:{...i(g),...P},...I,children:[f(E)?e("span",{className:["flex h-[1lh] shrink-0 items-center",q].filter(Boolean).join(" "),children:E}):null,t("div",{className:`flex min-w-0 flex-1 flex-col ${v[_]}`,children:[D?e("div",{className:[h[_],q].filter(Boolean).join(" "),children:w}):null,f(A)?e("div",{className:D?N[n]:void 0,children:A}):null]}),f(k)?e("div",{className:"flex h-[1lh] shrink-0 items-center",children:k}):null,B?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:t("button",{type:"button","aria-label":C??$.dismiss,onClick:B,className:["group rounded-mp-full relative -m-1 flex size-8 cursor-pointer items-center","justify-center bg-transparent text-inherit","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-2","focus-visible:outline-solid outline-none"].join(" "),children:[e(m,{}),e(r,{icon:a,size:d[_]})]})}):null]})});

package/dist/components/animate-appear/MPAnimateAppear.js

@@ -1 +1 @@
-import{jsx as e}from"react/jsx-runtime";import*as a from"react";import{useRender as t}from"@base-ui/react/use-render";import{ANIMATION_CLASS as r,ANIM_BASE as s,animationSlots as n,isInfinite as i,slideOffsets as o,useAnimationRun as l}from"../../internal/animate";export const MPAnimateAppear=a.forwardRef(function({duration:m,delay:p=0,easing:d,repeat:c=1,alternate:f,paused:y,trigger:u="mount",play:h,once:g=!0,threshold:x=.2,stagger:N=80,from:j="bottom",distance:A="0.75rem",fade:b=!0,reverse:E=!1,render:$,className:v,style:w,children:B,...C},M){const P=l({trigger:u,play:h,once:g,threshold:x,paused:y,infinite:i(c)}),{x:R,y:V}=o(j,A),_=a.Children.toArray(B),k=`${s} ${r.slide}`,q=_.map((t,r)=>{const s=E?_.length-1-r:r,i=n({effect:"slide",duration:m,delay:p+s*N,easing:d,repeat:c,alternate:f,x:R,y:V,opacity:b?0:1});if(!a.isValidElement(t))return e("span",{className:k,style:i,children:t},r);const o=t.props;return a.cloneElement(t,{className:[k,o.className].filter(Boolean).join(" "),style:{...i,...o.style}})});return t({render:$,ref:[M,P.ref],props:{...C,className:v,style:{"--_mp-anim-state":P.state,...w},...P.handlers,"data-mp-animation":"appear","data-mp-state":P.state,children:q}})});
+import{jsx as e}from"react/jsx-runtime";import*as a from"react";import{useRender as t}from"@base-ui/react/use-render";import{ANIMATION_CLASS as r,ANIM_BASE as s,animationSlots as n,isInfinite as i,slideOffsets as o,useAnimationRun as l}from"../../internal/animate";export const MPAnimateAppear=/*@__PURE__*/a.forwardRef(function({duration:m,delay:p=0,easing:d,repeat:c=1,alternate:f,paused:y,trigger:u="mount",play:h,once:g=!0,threshold:x=.2,stagger:N=80,from:j="bottom",distance:A="0.75rem",fade:b=!0,reverse:E=!1,render:$,className:v,style:w,children:B,...C},M){const P=l({trigger:u,play:h,once:g,threshold:x,paused:y,infinite:i(c)}),{x:R,y:V}=o(j,A),_=a.Children.toArray(B),k=`${s} ${r.slide}`,q=_.map((t,r)=>{const s=E?_.length-1-r:r,i=n({effect:"slide",duration:m,delay:p+s*N,easing:d,repeat:c,alternate:f,x:R,y:V,opacity:b?0:1});if(!a.isValidElement(t))return e("span",{className:k,style:i,children:t},r);const o=t.props;return a.cloneElement(t,{className:[k,o.className].filter(Boolean).join(" "),style:{...i,...o.style}})});return t({render:$,ref:[M,P.ref],props:{...C,className:v,style:{"--_mp-anim-state":P.state,...w},...P.handlers,"data-mp-animation":"appear","data-mp-state":P.state,children:q}})});

package/dist/components/animate-blink/MPAnimateBlink.js

@@ -1 +1 @@
-import*as e from"react";import{useRender as r}from"@base-ui/react/use-render";import{isInfinite as t,useAnimateElement as a}from"../../internal/animate";export const MPAnimateBlink=e.forwardRef(function({duration:e,delay:n=0,easing:i,repeat:o="infinite",alternate:s,paused:l,trigger:p="mount",play:c,once:d=!0,threshold:f=.2,min:m=0,render:u,className:y,style:g,children:h,...N},b){const k=a({effect:"blink",duration:e,delay:n,easing:i,repeat:o,alternate:s,opacity:m,trigger:p,play:c,once:d,threshold:f,paused:l,infinite:t(o)});return r({render:u,ref:[b,k.ref],props:{...N,className:[k.className,y].filter(Boolean).join(" "),style:{...k.style,...g},...k.props,children:h}})});
+import*as e from"react";import{useRender as r}from"@base-ui/react/use-render";import{isInfinite as t,useAnimateElement as a}from"../../internal/animate";export const MPAnimateBlink=/*@__PURE__*/e.forwardRef(function({duration:e,delay:n=0,easing:i,repeat:o="infinite",alternate:s,paused:l,trigger:p="mount",play:c,once:d=!0,threshold:f=.2,min:m=0,render:u,className:y,style:g,children:h,...N},b){const k=a({effect:"blink",duration:e,delay:n,easing:i,repeat:o,alternate:s,opacity:m,trigger:p,play:c,once:d,threshold:f,paused:l,infinite:t(o)});return r({render:u,ref:[b,k.ref],props:{...N,className:[k.className,y].filter(Boolean).join(" "),style:{...k.style,...g},...k.props,children:h}})});

package/dist/components/animate-fade/MPAnimateFade.js

@@ -1 +1 @@
-import*as e from"react";import{useRender as r}from"@base-ui/react/use-render";import{isInfinite as a,useAnimateElement as t}from"../../internal/animate";export const MPAnimateFade=e.forwardRef(function({duration:e,delay:n=0,easing:o,repeat:i=1,alternate:s,paused:l,trigger:d="mount",play:m,once:p=!0,threshold:c=.2,mode:f="in",from:u=0,render:y,className:g,style:h,children:N,...b},j){const w=t({effect:"fade",duration:e,delay:n,easing:o,repeat:i,alternate:s,mode:f,opacity:u,trigger:d,play:m,once:p,threshold:c,paused:l,infinite:a(i)});return r({render:y,ref:[j,w.ref],props:{...b,className:[w.className,g].filter(Boolean).join(" "),style:{...w.style,...h},...w.props,children:N}})});
+import*as e from"react";import{useRender as r}from"@base-ui/react/use-render";import{isInfinite as a,useAnimateElement as t}from"../../internal/animate";export const MPAnimateFade=/*@__PURE__*/e.forwardRef(function({duration:e,delay:n=0,easing:o,repeat:i=1,alternate:s,paused:l,trigger:d="mount",play:m,once:p=!0,threshold:c=.2,mode:f="in",from:u=0,render:y,className:g,style:h,children:N,...b},j){const w=t({effect:"fade",duration:e,delay:n,easing:o,repeat:i,alternate:s,mode:f,opacity:u,trigger:d,play:m,once:p,threshold:c,paused:l,infinite:a(i)});return r({render:y,ref:[j,w.ref],props:{...b,className:[w.className,g].filter(Boolean).join(" "),style:{...w.style,...h},...w.props,children:N}})});

package/dist/components/animate-grow/MPAnimateGrow.js

@@ -1 +1 @@
-import*as e from"react";import{useRender as r}from"@base-ui/react/use-render";import{isInfinite as a,useAnimateElement as t}from"../../internal/animate";export const MPAnimateGrow=e.forwardRef(function({duration:e,delay:n=0,easing:o,repeat:i=1,alternate:s,paused:l,trigger:d="mount",play:c,once:m=!0,threshold:f=.2,mode:p="in",from:g=.8,origin:u="center",fade:y=!0,render:h,className:w,style:N,children:b,...j},x){const A=t({effect:"grow",duration:e,delay:n,easing:o,repeat:i,alternate:s,mode:p,scale:g,opacity:y?0:1,trigger:d,play:c,once:m,threshold:f,paused:l,infinite:a(i)});return r({render:h,ref:[x,A.ref],props:{...j,className:[A.className,w].filter(Boolean).join(" "),style:{transformOrigin:u,...A.style,...N},...A.props,children:b}})});
+import*as e from"react";import{useRender as r}from"@base-ui/react/use-render";import{isInfinite as a,useAnimateElement as t}from"../../internal/animate";export const MPAnimateGrow=/*@__PURE__*/e.forwardRef(function({duration:e,delay:n=0,easing:o,repeat:i=1,alternate:s,paused:l,trigger:d="mount",play:c,once:m=!0,threshold:f=.2,mode:p="in",from:g=.8,origin:u="center",fade:y=!0,render:h,className:w,style:N,children:b,...j},x){const A=t({effect:"grow",duration:e,delay:n,easing:o,repeat:i,alternate:s,mode:p,scale:g,opacity:y?0:1,trigger:d,play:c,once:m,threshold:f,paused:l,infinite:a(i)});return r({render:h,ref:[x,A.ref],props:{...j,className:[A.className,w].filter(Boolean).join(" "),style:{transformOrigin:u,...A.style,...N},...A.props,children:b}})});

package/dist/components/animate-headline/MPAnimateHeadline.js

@@ -1 +1 @@
-import{jsx as e}from"react/jsx-runtime";import*as t from"react";import{easingValue as n,isInfinite as a,lengthValue as r,useAnimationRun as i,usePrefersReducedMotion as s}from"../../internal/animate";export const MPAnimateHeadline=t.forwardRef(function({duration:o,delay:l=0,easing:m,repeat:u="infinite",paused:c,trigger:d="mount",play:f,once:p=!0,threshold:h=.2,interval:v=2600,index:g,defaultIndex:y=0,onIndexChange:x,loop:E=!0,rise:N="100%",className:j,style:T,children:_,...C},M){const R=i({trigger:d,play:f,once:p,threshold:h,paused:c,infinite:a(u)}),k=s(),A=t.Children.toArray(_),B=A.length,[I,S]=t.useState(y),b=Math.min(g??I,Math.max(B-1,0)),[w,H]=t.useState(null),P=t.useRef(b);t.useEffect(()=>{P.current!==b&&(H(P.current),P.current=b)},[b]);const V=o??500;t.useEffect(()=>{if(null===w)return;const e=setTimeout(()=>H(null),V);return()=>clearTimeout(e)},[w,V]);const $=t.useCallback(()=>{const e=b+1;if(e>=B){if(!E)return;return void 0===g&&S(0),void x?.(0)}void 0===g&&S(e),x?.(e)},[b,B,E,g,x]),q=t.useRef(!1);return t.useEffect(()=>{if(void 0!==g||B<2||"running"!==R.state)return;if(!E&&b===B-1)return;const e=setTimeout(()=>{q.current=!0,$()},v+(q.current?0:l));return()=>clearTimeout(e)},[g,B,R.state,v,l,$,E,b]),e("div",{ref:e=>{R.ref(e),"function"==typeof M?M(e):M&&(M.current=e)},className:["mp-headline",j??""].filter(Boolean).join(" "),style:{...void 0===o?{}:{"--_mp-anim-duration":`${o}ms`},"--_mp-anim-rise":r(N),...m?{"--_mp-anim-ease":n(m)}:{},"--_mp-anim-state":R.state,...T},"data-mp-animation":"headline","data-mp-state":R.state,...R.handlers,...C,children:A.map((n,a)=>{const r=a===b?"active":a!==w||k?void 0:"leaving";if(!t.isValidElement(n))return e("span",{className:"mp-headline-item","data-mp-state":r,children:n},a);const i=n.props;return t.cloneElement(n,{key:a,className:["mp-headline-item",i.className].filter(Boolean).join(" "),"data-mp-state":r})})})});
+import{jsx as e}from"react/jsx-runtime";import*as t from"react";import{easingValue as n,isInfinite as a,lengthValue as r,useAnimationRun as i,usePrefersReducedMotion as s}from"../../internal/animate";export const MPAnimateHeadline=/*@__PURE__*/t.forwardRef(function({duration:o,delay:l=0,easing:m,repeat:u="infinite",paused:c,trigger:d="mount",play:f,once:p=!0,threshold:h=.2,interval:v=2600,index:g,defaultIndex:y=0,onIndexChange:x,loop:E=!0,rise:N="100%",className:j,style:T,children:_,...C},M){const R=i({trigger:d,play:f,once:p,threshold:h,paused:c,infinite:a(u)}),k=s(),A=t.Children.toArray(_),B=A.length,[I,S]=t.useState(y),b=Math.min(g??I,Math.max(B-1,0)),[w,H]=t.useState(null),P=t.useRef(b);t.useEffect(()=>{P.current!==b&&(H(P.current),P.current=b)},[b]);const V=o??500;t.useEffect(()=>{if(null===w)return;const e=setTimeout(()=>H(null),V);return()=>clearTimeout(e)},[w,V]);const $=t.useCallback(()=>{const e=b+1;if(e>=B){if(!E)return;return void 0===g&&S(0),void x?.(0)}void 0===g&&S(e),x?.(e)},[b,B,E,g,x]),q=t.useRef(!1);return t.useEffect(()=>{if(void 0!==g||B<2||"running"!==R.state)return;if(!E&&b===B-1)return;const e=setTimeout(()=>{q.current=!0,$()},v+(q.current?0:l));return()=>clearTimeout(e)},[g,B,R.state,v,l,$,E,b]),e("div",{ref:e=>{R.ref(e),"function"==typeof M?M(e):M&&(M.current=e)},className:["mp-headline",j??""].filter(Boolean).join(" "),style:{...void 0===o?{}:{"--_mp-anim-duration":`${o}ms`},"--_mp-anim-rise":r(N),...m?{"--_mp-anim-ease":n(m)}:{},"--_mp-anim-state":R.state,...T},"data-mp-animation":"headline","data-mp-state":R.state,...R.handlers,...C,children:A.map((n,a)=>{const r=a===b?"active":a!==w||k?void 0:"leaving";if(!t.isValidElement(n))return e("span",{className:"mp-headline-item","data-mp-state":r,children:n},a);const i=n.props;return t.cloneElement(n,{key:a,className:["mp-headline-item",i.className].filter(Boolean).join(" "),"data-mp-state":r})})})});

package/dist/components/animate-lighting/MPAnimateLighting.js

@@ -1 +1 @@
-import*as e from"react";import{useRender as r}from"@base-ui/react/use-render";import{accentSlots as a}from"../../internal/accent";import{isInfinite as n,repeatValue as t,useAnimationRun as m}from"../../internal/animate";const i={xs:"rounded-mp-xs",sm:"rounded-mp-sm",md:"rounded-mp-md",lg:"rounded-mp-lg",xl:"rounded-mp-xl"};export const MPAnimateLighting=e.forwardRef(function({duration:e=3e3,delay:o=0,repeat:d="infinite",alternate:p,paused:s,trigger:l="mount",play:c,once:g=!0,threshold:u=.2,color:f="primary",size:h="md",spread:_=3,arc:x=50,blur:y=4,reverse:w=!1,render:$,className:b,style:v,children:z,...N},j){const A=m({trigger:l,play:c,once:g,threshold:u,paused:s,infinite:n(d)});return r({render:$,ref:[j,A.ref],props:{...N,"data-mp-size":h,className:["mp-anim-lighting",i[h],b].filter(Boolean).join(" "),style:{...a(f),"--_mp-anim-duration":`${e}ms`,"--_mp-anim-delay":`${o}ms`,"--_mp-anim-repeat":t(d),"--_mp-anim-direction":w?p?"alternate-reverse":"reverse":p?"alternate":"normal","--_mp-anim-state":A.state,"--_mp-anim-glow-width":`${_}px`,"--_mp-anim-glow-arc":`${x}deg`,"--_mp-anim-glow-blur":`${y}px`,...v},...A.handlers,"data-mp-animation":"lighting","data-mp-state":A.state,children:z}})});
+import*as e from"react";import{useRender as r}from"@base-ui/react/use-render";import{accentSlots as a}from"../../internal/accent";import{isInfinite as n,repeatValue as t,useAnimationRun as m}from"../../internal/animate";const i={xs:"rounded-mp-xs",sm:"rounded-mp-sm",md:"rounded-mp-md",lg:"rounded-mp-lg",xl:"rounded-mp-xl"};export const MPAnimateLighting=/*@__PURE__*/e.forwardRef(function({duration:e=3e3,delay:o=0,repeat:d="infinite",alternate:p,paused:s,trigger:l="mount",play:c,once:g=!0,threshold:u=.2,color:f="primary",size:h="md",spread:_=3,arc:x=50,blur:y=4,reverse:w=!1,render:$,className:b,style:v,children:z,...N},j){const A=m({trigger:l,play:c,once:g,threshold:u,paused:s,infinite:n(d)});return r({render:$,ref:[j,A.ref],props:{...N,"data-mp-size":h,className:["mp-anim-lighting",i[h],b].filter(Boolean).join(" "),style:{...a(f),"--_mp-anim-duration":`${e}ms`,"--_mp-anim-delay":`${o}ms`,"--_mp-anim-repeat":t(d),"--_mp-anim-direction":w?p?"alternate-reverse":"reverse":p?"alternate":"normal","--_mp-anim-state":A.state,"--_mp-anim-glow-width":`${_}px`,"--_mp-anim-glow-arc":`${x}deg`,"--_mp-anim-glow-blur":`${y}px`,...v},...A.handlers,"data-mp-animation":"lighting","data-mp-state":A.state,children:z}})});

package/dist/components/animate-marquee/MPAnimateMarquee.js

@@ -1 +1 @@
-import{jsx as e}from"react/jsx-runtime";import*as r from"react";import{easingValue as t,isInfinite as a,lengthValue as n,repeatValue as i,useAnimationRun as o}from"../../internal/animate";export const MPAnimateMarquee=r.forwardRef(function({duration:s,delay:m=0,easing:p,repeat:u="infinite",alternate:l,paused:c,trigger:d="mount",play:f,once:h=!0,threshold:v=.2,orientation:g="horizontal",reverse:y=!1,speed:_=60,gap:q="2rem",copies:R=2,pauseOnHover:b=!0,className:x,style:M,children:j,...w},z){const N=o({trigger:d,play:f,once:h,threshold:v,paused:c,infinite:a(u)}),O=r.useRef(null),A=r.useRef(null),[G,H]=r.useState(0),S="vertical"===g;r.useEffect(()=>{const e=O.current,r=A.current;if(!e||!r)return;const t=()=>{const t=getComputedStyle(e),a=parseFloat(S?t.rowGap:t.columnGap)||0,n=S?r.offsetHeight:r.offsetWidth;H(n+a)};if(t(),"undefined"==typeof ResizeObserver)return;const a=new ResizeObserver(t);return a.observe(r),a.observe(e),()=>a.disconnect()},[S,j]);const $=s??(G>0?G/_*1e3:12e3);return e("div",{ref:e=>{O.current=e,N.ref(e),"function"==typeof z?z(e):z&&(z.current=e)},className:["mp-marquee",S?"mp-marquee-vertical":"",x??""].filter(Boolean).join(" "),style:{"--_mp-anim-gap":n(q),...p?{"--_mp-anim-ease":t(p)}:{},"--_mp-anim-duration":`${Math.round($)}ms`,"--_mp-anim-delay":`${m}ms`,"--_mp-anim-repeat":i(u),"--_mp-anim-direction":y?l?"alternate-reverse":"reverse":l?"alternate":"normal","--_mp-anim-state":N.state,...M},"data-mp-animation":"marquee","data-mp-state":N.state,"data-mp-pause-on-hover":b?"":void 0,...N.handlers,...w,children:Array.from({length:Math.max(1,R)},(r,t)=>(r=>e("div",{ref:0===r?A:void 0,className:"mp-marquee-track","aria-hidden":0===r?void 0:"true",children:j},r))(t))})});
+import{jsx as e}from"react/jsx-runtime";import*as r from"react";import{easingValue as t,isInfinite as a,lengthValue as n,repeatValue as i,useAnimationRun as o}from"../../internal/animate";export const MPAnimateMarquee=/*@__PURE__*/r.forwardRef(function({duration:s,delay:m=0,easing:p,repeat:u="infinite",alternate:l,paused:c,trigger:d="mount",play:f,once:h=!0,threshold:v=.2,orientation:g="horizontal",reverse:y=!1,speed:_=60,gap:q="2rem",copies:R=2,pauseOnHover:b=!0,className:x,style:M,children:j,...w},z){const N=o({trigger:d,play:f,once:h,threshold:v,paused:c,infinite:a(u)}),O=r.useRef(null),A=r.useRef(null),[G,H]=r.useState(0),S="vertical"===g;r.useEffect(()=>{const e=O.current,r=A.current;if(!e||!r)return;const t=()=>{const t=getComputedStyle(e),a=parseFloat(S?t.rowGap:t.columnGap)||0,n=S?r.offsetHeight:r.offsetWidth;H(n+a)};if(t(),"undefined"==typeof ResizeObserver)return;const a=new ResizeObserver(t);return a.observe(r),a.observe(e),()=>a.disconnect()},[S,j]);const $=s??(G>0?G/_*1e3:12e3);return e("div",{ref:e=>{O.current=e,N.ref(e),"function"==typeof z?z(e):z&&(z.current=e)},className:["mp-marquee",S?"mp-marquee-vertical":"",x??""].filter(Boolean).join(" "),style:{"--_mp-anim-gap":n(q),...p?{"--_mp-anim-ease":t(p)}:{},"--_mp-anim-duration":`${Math.round($)}ms`,"--_mp-anim-delay":`${m}ms`,"--_mp-anim-repeat":i(u),"--_mp-anim-direction":y?l?"alternate-reverse":"reverse":l?"alternate":"normal","--_mp-anim-state":N.state,...M},"data-mp-animation":"marquee","data-mp-state":N.state,"data-mp-pause-on-hover":b?"":void 0,...N.handlers,...w,children:Array.from({length:Math.max(1,R)},(r,t)=>(r=>e("div",{ref:0===r?A:void 0,className:"mp-marquee-track","aria-hidden":0===r?void 0:"true",children:j},r))(t))})});

package/dist/components/animate-rotate/MPAnimateRotate.js

@@ -1 +1 @@
-import*as e from"react";import{useRender as r}from"@base-ui/react/use-render";import{isInfinite as t,useAnimateElement as a}from"../../internal/animate";export const MPAnimateRotate=e.forwardRef(function({duration:e,delay:n=0,easing:o,repeat:i=1,alternate:s,paused:l,trigger:d="mount",play:m,once:c=!0,threshold:f=.2,mode:p="in",from:g=-180,to:u=0,origin:y="center",fade:h=!0,render:N,className:R,style:$,children:b,...j},w){const x=a({effect:"rotate",duration:e,delay:n,easing:o,repeat:i,alternate:s,mode:p,angle:`${g}deg`,angleTo:`${u}deg`,opacity:h?0:1,trigger:d,play:m,once:c,threshold:f,paused:l,infinite:t(i)});return r({render:N,ref:[w,x.ref],props:{...j,className:[x.className,R].filter(Boolean).join(" "),style:{transformOrigin:y,...x.style,...$},...x.props,children:b}})});
+import*as e from"react";import{useRender as r}from"@base-ui/react/use-render";import{isInfinite as t,useAnimateElement as a}from"../../internal/animate";export const MPAnimateRotate=/*@__PURE__*/e.forwardRef(function({duration:e,delay:n=0,easing:o,repeat:i=1,alternate:s,paused:l,trigger:d="mount",play:m,once:c=!0,threshold:f=.2,mode:p="in",from:g=-180,to:u=0,origin:y="center",fade:h=!0,render:N,className:R,style:$,children:b,...j},w){const x=a({effect:"rotate",duration:e,delay:n,easing:o,repeat:i,alternate:s,mode:p,angle:`${g}deg`,angleTo:`${u}deg`,opacity:h?0:1,trigger:d,play:m,once:c,threshold:f,paused:l,infinite:t(i)});return r({render:N,ref:[w,x.ref],props:{...j,className:[x.className,R].filter(Boolean).join(" "),style:{transformOrigin:y,...x.style,...$},...x.props,children:b}})});

package/dist/components/animate-slide/MPAnimateSlide.js

@@ -1 +1 @@
-import*as e from"react";import{useRender as r}from"@base-ui/react/use-render";import{isInfinite as t,slideOffsets as a,useAnimateElement as n}from"../../internal/animate";export const MPAnimateSlide=e.forwardRef(function({duration:e,delay:o=0,easing:i,repeat:s=1,alternate:l,paused:d,trigger:m="mount",play:c,once:p=!0,threshold:f=.2,mode:y="in",from:u="bottom",distance:g="100%",fade:h=!0,render:x,className:N,style:b,children:j,...w},A){const{x:B,y:M}=a(u,g),P=n({effect:"slide",duration:e,delay:o,easing:i,repeat:s,alternate:l,mode:y,x:B,y:M,opacity:h?0:1,trigger:m,play:c,once:p,threshold:f,paused:d,infinite:t(s)});return r({render:x,ref:[A,P.ref],props:{...w,className:[P.className,N].filter(Boolean).join(" "),style:{...P.style,...b},...P.props,children:j}})});
+import*as e from"react";import{useRender as r}from"@base-ui/react/use-render";import{isInfinite as t,slideOffsets as a,useAnimateElement as n}from"../../internal/animate";export const MPAnimateSlide=/*@__PURE__*/e.forwardRef(function({duration:e,delay:o=0,easing:i,repeat:s=1,alternate:l,paused:d,trigger:m="mount",play:c,once:p=!0,threshold:f=.2,mode:y="in",from:u="bottom",distance:g="100%",fade:h=!0,render:x,className:N,style:b,children:j,...w},A){const{x:B,y:M}=a(u,g),P=n({effect:"slide",duration:e,delay:o,easing:i,repeat:s,alternate:l,mode:y,x:B,y:M,opacity:h?0:1,trigger:m,play:c,once:p,threshold:f,paused:d,infinite:t(s)});return r({render:x,ref:[A,P.ref],props:{...w,className:[P.className,N].filter(Boolean).join(" "),style:{...P.style,...b},...P.props,children:j}})});

package/dist/components/animate-typing/MPAnimateTyping.js

@@ -1 +1 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as r from"react";import{isInfinite as n,useAnimationRun as a,usePrefersReducedMotion as i}from"../../internal/animate";import{VISUALLY_HIDDEN as s}from"../../internal/visually-hidden";function u(e){return"string"==typeof e||"number"==typeof e?String(e):Array.isArray(e)?e.map(u).join(""):""}export const MPAnimateTyping=r.forwardRef(function({text:o,speed:m=24,hold:c=1400,erase:f=!1,eraseSpeed:l,caret:d=!0,caretChar:p="|",duration:h,delay:g=0,repeat:y=1,paused:x,trigger:T="mount",play:v,once:j=!0,threshold:M=.2,className:N,style:S,children:w,...A},I){const E=a({trigger:T,play:v,once:j,threshold:M,paused:x,infinite:n(y)}),R=i(),b=o??u(w),C=r.useMemo(()=>function(e,t){if("undefined"!=typeof Intl&&"Segmenter"in Intl)return[...new Intl.Segmenter(t,{granularity:"grapheme"}).segment(e)].map(e=>e.segment);return[...e]}(b),[b]),P=C.length,[k,q]=r.useState(0),z=r.useRef(0),B=h&&P>0?h/P:1e3/Math.max(m,1),D=1e3/Math.max(l??2*m,1);return r.useEffect(()=>{z.current=0},[P]),r.useEffect(()=>{if(R||0===P)return void q(P);if(!E.started)return z.current=0,void q(0);if(x)return;let e,t=!1,r=z.current,n=1,a=!1;const i="infinite"===y?1/0:Math.max(1,y);if(r>=P&&1===i)return;const s=()=>{if(!t){if(a)return r-=1,z.current=r,q(r),r<=0&&(a=!1,n+=1),void(e=setTimeout(s,a?D:B));if(r+=1,z.current=r,q(r),r<P)e=setTimeout(s,B);else if(!(n>=i)){if(f)return a=!0,void(e=setTimeout(s,c));n+=1,e=setTimeout(()=>{t||(r=0,z.current=0,q(0),e=setTimeout(s,B))},c)}}};return q(r),e=setTimeout(s,0===r?g:B),()=>{t=!0,clearTimeout(e)}},[E.started,x,R,P,B,D,g,c,f,y]),t("div",{ref:e=>{E.ref(e),"function"==typeof I?I(e):I&&(I.current=e)},className:N,style:S,"data-mp-animation":"typing","data-mp-state":E.state,...E.handlers,...A,children:[e("span",{className:s,children:b}),t("span",{"aria-hidden":"true",className:"whitespace-pre-wrap",children:[C.slice(0,k).join(""),d?e("span",{className:"mp-typing-caret",children:p}):null]})]})});
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as r from"react";import{isInfinite as n,useAnimationRun as a,usePrefersReducedMotion as i}from"../../internal/animate";import{VISUALLY_HIDDEN as s}from"../../internal/visually-hidden";function u(e){return"string"==typeof e||"number"==typeof e?String(e):Array.isArray(e)?e.map(u).join(""):""}export const MPAnimateTyping=/*@__PURE__*/r.forwardRef(function({text:o,speed:m=24,hold:c=1400,erase:f=!1,eraseSpeed:l,caret:d=!0,caretChar:p="|",duration:h,delay:g=0,repeat:y=1,paused:x,trigger:T="mount",play:v,once:j=!0,threshold:M=.2,className:N,style:S,children:w,...A},I){const E=a({trigger:T,play:v,once:j,threshold:M,paused:x,infinite:n(y)}),R=i(),b=o??u(w),C=r.useMemo(()=>function(e,t){if("undefined"!=typeof Intl&&"Segmenter"in Intl)return[...new Intl.Segmenter(t,{granularity:"grapheme"}).segment(e)].map(e=>e.segment);return[...e]}(b),[b]),P=C.length,[k,q]=r.useState(0),z=r.useRef(0),B=h&&P>0?h/P:1e3/Math.max(m,1),D=1e3/Math.max(l??2*m,1);return r.useEffect(()=>{z.current=0},[P]),r.useEffect(()=>{if(R||0===P)return void q(P);if(!E.started)return z.current=0,void q(0);if(x)return;let e,t=!1,r=z.current,n=1,a=!1;const i="infinite"===y?1/0:Math.max(1,y);if(r>=P&&1===i)return;const s=()=>{if(!t){if(a)return r-=1,z.current=r,q(r),r<=0&&(a=!1,n+=1),void(e=setTimeout(s,a?D:B));if(r+=1,z.current=r,q(r),r<P)e=setTimeout(s,B);else if(!(n>=i)){if(f)return a=!0,void(e=setTimeout(s,c));n+=1,e=setTimeout(()=>{t||(r=0,z.current=0,q(0),e=setTimeout(s,B))},c)}}};return q(r),e=setTimeout(s,0===r?g:B),()=>{t=!0,clearTimeout(e)}},[E.started,x,R,P,B,D,g,c,f,y]),t("div",{ref:e=>{E.ref(e),"function"==typeof I?I(e):I&&(I.current=e)},className:N,style:S,"data-mp-animation":"typing","data-mp-state":E.state,...E.handlers,...A,children:[e("span",{className:s,children:b}),t("span",{"aria-hidden":"true",className:"whitespace-pre-wrap",children:[C.slice(0,k).join(""),d?e("span",{className:"mp-typing-caret",children:p}):null]})]})});

package/dist/components/animate-zoom/MPAnimateZoom.js

@@ -1 +1 @@
-import*as e from"react";import{useRender as r}from"@base-ui/react/use-render";import{isInfinite as a,useAnimateElement as t}from"../../internal/animate";export const MPAnimateZoom=e.forwardRef(function({duration:e,delay:o=0,easing:n,repeat:i=1,alternate:s,paused:l,trigger:m="mount",play:d,once:c=!0,threshold:f=.2,mode:p="in",from:u=.4,fade:y=!0,render:g,className:h,style:N,children:b,...j},w){const x=t({effect:"zoom",duration:e,delay:o,easing:n,repeat:i,alternate:s,mode:p,scale:u,opacity:y?0:1,trigger:m,play:d,once:c,threshold:f,paused:l,infinite:a(i)});return r({render:g,ref:[w,x.ref],props:{...j,className:[x.className,h].filter(Boolean).join(" "),style:{transformOrigin:"center",...x.style,...N},...x.props,children:b}})});
+import*as e from"react";import{useRender as r}from"@base-ui/react/use-render";import{isInfinite as a,useAnimateElement as t}from"../../internal/animate";export const MPAnimateZoom=/*@__PURE__*/e.forwardRef(function({duration:e,delay:o=0,easing:n,repeat:i=1,alternate:s,paused:l,trigger:m="mount",play:d,once:c=!0,threshold:f=.2,mode:p="in",from:u=.4,fade:y=!0,render:g,className:h,style:N,children:b,...j},w){const x=t({effect:"zoom",duration:e,delay:o,easing:n,repeat:i,alternate:s,mode:p,scale:u,opacity:y?0:1,trigger:m,play:d,once:c,threshold:f,paused:l,infinite:a(i)});return r({render:g,ref:[w,x.ref],props:{...j,className:[x.className,h].filter(Boolean).join(" "),style:{transformOrigin:"center",...x.style,...N},...x.props,children:b}})});

package/dist/components/aspect-ratio/MPAspectRatio.js

@@ -1 +1 @@
-import*as e from"react";import{useRender as o}from"@base-ui/react/use-render";const i={xs:"rounded-mp-xs",sm:"rounded-mp-sm",md:"rounded-mp-md",lg:"rounded-mp-md",xl:"rounded-mp-xl"},t=["[&>img]:size-full","[&>video]:size-full","[&>canvas]:size-full","[&>svg]:size-full","[&>iframe]:size-full","[&>picture]:size-full","[&>picture>img]:size-full"].join(" "),r={cover:"[&>img]:object-cover [&>video]:object-cover [&>picture>img]:object-cover",contain:"[&>img]:object-contain [&>video]:object-contain [&>picture>img]:object-contain",fill:"[&>img]:object-fill [&>video]:object-fill [&>picture>img]:object-fill",none:"[&>img]:object-none [&>video]:object-none [&>picture>img]:object-none"};export const MPAspectRatio=e.forwardRef(function({ratio:e=1,fit:c="cover",rounded:l=!1,size:n="md",render:s,className:d,style:m,children:a,...u},f){const p=["mp-aspect-ratio relative block w-full overflow-hidden",t,r[c],l?i[n]:"",d??""].filter(Boolean).join(" ");return o({render:s,ref:f,props:{"data-mp-size":n,className:p,style:{aspectRatio:e,...m},children:a,...u}})});
+import*as e from"react";import{useRender as o}from"@base-ui/react/use-render";const i={xs:"rounded-mp-xs",sm:"rounded-mp-sm",md:"rounded-mp-md",lg:"rounded-mp-md",xl:"rounded-mp-xl"},t=["[&>img]:size-full","[&>video]:size-full","[&>canvas]:size-full","[&>svg]:size-full","[&>iframe]:size-full","[&>picture]:size-full","[&>picture>img]:size-full"].join(" "),r={cover:"[&>img]:object-cover [&>video]:object-cover [&>picture>img]:object-cover",contain:"[&>img]:object-contain [&>video]:object-contain [&>picture>img]:object-contain",fill:"[&>img]:object-fill [&>video]:object-fill [&>picture>img]:object-fill",none:"[&>img]:object-none [&>video]:object-none [&>picture>img]:object-none"};export const MPAspectRatio=/*@__PURE__*/e.forwardRef(function({ratio:e=1,fit:c="cover",rounded:l=!1,size:n="md",render:s,className:d,style:m,children:a,...u},f){const p=["mp-aspect-ratio relative block w-full overflow-hidden",t,r[c],l?i[n]:"",d??""].filter(Boolean).join(" ");return o({render:s,ref:f,props:{"data-mp-size":n,className:p,style:{aspectRatio:e,...m},children:a,...u}})});

package/dist/components/avatar/MPAvatar.js

@@ -1 +1 @@
-import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as t from"react";import{Avatar as n}from"@base-ui/react/avatar";import{accentSlots as r}from"../../internal/accent";import{CONTROL_SQUARE as l,hasContent as i}from"../../internal/scale";import{VISUALLY_HIDDEN as o}from"../../internal/visually-hidden";const m={xs:"text-mp-label-medium",sm:"text-mp-label-large",md:"text-mp-title-large",lg:"text-mp-headline-small",xl:"text-mp-headline-medium"},s={xs:"rounded-mp-xs",sm:"rounded-mp-sm",md:"rounded-mp-md",lg:"rounded-mp-md",xl:"rounded-mp-md"},c={filled:"bg-(--_mp-accent) text-(--_mp-on-accent)",tonal:"bg-(--_mp-accent-container) text-(--_mp-on-accent-container)",elevated:"shadow-mp-1 bg-mp-surface-container-low text-(--_mp-accent)",outlined:"border-mp-outline border bg-transparent text-(--_mp-accent)",text:"text-mp-on-surface-variant bg-transparent"};function d(){return a("svg",{viewBox:"0 0 24 24",fill:"currentColor","aria-hidden":"true",className:"size-[60%]",children:[e("path",{d:"M12 12a4.5 4.5 0 1 0 0-9 4.5 4.5 0 0 0 0 9Z"}),e("path",{d:"M12 14.25c-4.28 0-7.75 2.42-7.75 5.4 0 .75.6 1.35 1.35 1.35h12.8c.75 0 1.35-.6 1.35-1.35 0-2.98-3.47-5.4-7.75-5.4Z"})]})}export const MPAvatar=t.forwardRef(function({src:t,srcSet:p,alt:u,name:f,initials:h,shape:x="circle",variant:g="tonal",size:v="md",color:b="primary",delay:y,imageProps:N,onLoadingStatusChange:j,className:w,style:z,children:_,...C},A){const B=f?function(e){const a=e.normalize("NFC").trim().split(/\s+/).filter(Boolean);return 0===a.length?"":((Array.from(a[0])[0]??"")+(a.length>1?Array.from(a[a.length-1])[0]??"":"")).toLocaleUpperCase()}(f):"",S=u??f,L=i(_)?_:(h??B)||e(d,{}),M=i(_)||Boolean(h??B),k=["mp-avatar relative inline-flex shrink-0 items-center justify-center overflow-hidden","align-middle leading-none font-medium whitespace-nowrap select-none",l[v],m[v],"circle"===x?"rounded-mp-full":s[v],c[g],w??""].filter(Boolean).join(" ");return a(n.Root,{ref:A,"data-mp-size":v,"data-mp-variant":g,className:k,style:{...r(b),...z},...C,children:[t?e(n.Image,{src:t,srcSet:p,alt:S??"",onLoadingStatusChange:j,...N,className:"size-full object-cover"}):null,a(n.Fallback,{delay:t?y:void 0,className:"flex size-full items-center justify-center",children:[S&&M?e("span",{className:o,children:S}):null,e("span",{"aria-hidden":!(!S||!M)||void 0,className:"contents",children:L})]})]})});
+import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as t from"react";import{Avatar as n}from"@base-ui/react/avatar";import{accentSlots as r}from"../../internal/accent";import{CONTROL_SQUARE as l,hasContent as i}from"../../internal/scale";import{VISUALLY_HIDDEN as o}from"../../internal/visually-hidden";const m={xs:"text-mp-label-medium",sm:"text-mp-label-large",md:"text-mp-title-large",lg:"text-mp-headline-small",xl:"text-mp-headline-medium"},s={xs:"rounded-mp-xs",sm:"rounded-mp-sm",md:"rounded-mp-md",lg:"rounded-mp-md",xl:"rounded-mp-md"},c={filled:"bg-(--_mp-accent) text-(--_mp-on-accent)",tonal:"bg-(--_mp-accent-container) text-(--_mp-on-accent-container)",elevated:"shadow-mp-1 bg-mp-surface-container-low text-(--_mp-accent)",outlined:"border-mp-outline border bg-transparent text-(--_mp-accent)",text:"text-mp-on-surface-variant bg-transparent"};function d(){return a("svg",{viewBox:"0 0 24 24",fill:"currentColor","aria-hidden":"true",className:"size-[60%]",children:[e("path",{d:"M12 12a4.5 4.5 0 1 0 0-9 4.5 4.5 0 0 0 0 9Z"}),e("path",{d:"M12 14.25c-4.28 0-7.75 2.42-7.75 5.4 0 .75.6 1.35 1.35 1.35h12.8c.75 0 1.35-.6 1.35-1.35 0-2.98-3.47-5.4-7.75-5.4Z"})]})}export const MPAvatar=/*@__PURE__*/t.forwardRef(function({src:t,srcSet:p,alt:u,name:f,initials:h,shape:x="circle",variant:g="tonal",size:v="md",color:b="primary",delay:y,imageProps:N,onLoadingStatusChange:j,className:w,style:z,children:_,...C},A){const B=f?function(e){const a=e.normalize("NFC").trim().split(/\s+/).filter(Boolean);return 0===a.length?"":((Array.from(a[0])[0]??"")+(a.length>1?Array.from(a[a.length-1])[0]??"":"")).toLocaleUpperCase()}(f):"",S=u??f,L=i(_)?_:(h??B)||e(d,{}),M=i(_)||Boolean(h??B),k=["mp-avatar relative inline-flex shrink-0 items-center justify-center overflow-hidden","align-middle leading-none font-medium whitespace-nowrap select-none",l[v],m[v],"circle"===x?"rounded-mp-full":s[v],c[g],w??""].filter(Boolean).join(" ");return a(n.Root,{ref:A,"data-mp-size":v,"data-mp-variant":g,className:k,style:{...r(b),...z},...C,children:[t?e(n.Image,{src:t,srcSet:p,alt:S??"",onLoadingStatusChange:j,...N,className:"size-full object-cover"}):null,a(n.Fallback,{delay:t?y:void 0,className:"flex size-full items-center justify-center",children:[S&&M?e("span",{className:o,children:S}):null,e("span",{"aria-hidden":!(!S||!M)||void 0,className:"contents",children:L})]})]})});

package/dist/components/badge/MPBadge.js

@@ -1 +1 @@
-import{jsx as e,Fragment as t,jsxs as m}from"react/jsx-runtime";import*as n from"react";import{accentSlots as a}from"../../internal/accent";import{hasContent as l}from"../../internal/scale";import{VISUALLY_HIDDEN as s}from"../../internal/visually-hidden";const i={xs:"h-3 min-w-3",sm:"h-3.5 min-w-3.5",md:"h-4 min-w-4",lg:"h-5 min-w-5",xl:"h-6 min-w-6"},o={xs:"size-1",sm:"size-1.5",md:"size-1.5",lg:"size-2",xl:"size-2.5"},r={xs:"text-mp-label-small",sm:"text-mp-label-small",md:"text-mp-label-small",lg:"text-mp-label-medium",xl:"text-mp-label-medium"},d={xs:"px-1",sm:"px-1",md:"px-1.5",lg:"px-1.5",xl:"px-2"},p={xs:{badge:"-mt-1.5 -mb-1.5 -ms-1.5 -me-1.5",dot:"-mt-0.5 -mb-0.5 -ms-0.5 -me-0.5"},sm:{badge:"-mt-1.5 -mb-1.5 -ms-1.5 -me-1.5",dot:"-mt-0.5 -mb-0.5 -ms-0.5 -me-0.5"},md:{badge:"-mt-2 -mb-2 -ms-2 -me-2",dot:"-mt-1 -mb-1 -ms-1 -me-1"},lg:{badge:"-mt-2.5 -mb-2.5 -ms-2.5 -me-2.5",dot:"-mt-1 -mb-1 -ms-1 -me-1"},xl:{badge:"-mt-3 -mb-3 -ms-3 -me-3",dot:"-mt-1.5 -mb-1.5 -ms-1.5 -me-1.5"}},c={"top-start":"top-0 start-0","top-end":"top-0 end-0","bottom-start":"bottom-0 start-0","bottom-end":"bottom-0 end-0"},b={"top-start":"mt-[7%] ms-[7%]","top-end":"mt-[7%] me-[7%]","bottom-start":"mb-[7%] ms-[7%]","bottom-end":"mb-[7%] me-[7%]"},x={filled:"bg-(--_mp-accent) text-(--_mp-on-accent)",tonal:"bg-(--_mp-accent-container) text-(--_mp-on-accent-container)",elevated:"shadow-mp-1 bg-mp-surface-container-low text-(--_mp-accent)",outlined:"border-mp-outline border bg-mp-surface-container text-(--_mp-accent)",text:"text-(--_mp-accent) bg-transparent"};export const MPBadge=n.forwardRef(function({variant:n="filled",size:u="md",color:g="error",content:f,max:h=99,dot:v=!1,showZero:w=!1,invisible:z=!1,placement:_="top-end",overlap:j="square",label:y,className:N,style:k,children:B,...$},q){const F=l(B),M=!l(f)||0===f&&!w,P=v||M,R=z||M&&!v,Z=["mp-badge pointer-events-none z-10 inline-flex shrink-0 items-center justify-center","rounded-mp-full tabular-nums whitespace-nowrap",x[n],P?o[u]:[i[u],r[u],d[u]].join(" "),F?`absolute ${c[_]}`:"relative align-middle",F?P?p[u].dot:p[u].badge:"",F&&"circle"===j?b[_]:"",R?"invisible":"",N??""].filter(Boolean).join(" "),A=function(e,t){return"number"==typeof e&&e>t?`${t}+`:e}(f,h),C=e("span",{ref:q,"data-mp-size":u,"data-mp-variant":n,className:Z,style:{...a(g),...k},"aria-hidden":!!R||void 0,...$,children:R?null:m(t,{children:[P||y?e("span",{className:s,children:y??A}):null,P?null:e("span",{"aria-hidden":!!y||void 0,children:A})]})});return F?m("span",{className:"relative inline-flex shrink-0 align-middle",children:[B,C]}):C});
+import{jsx as e,Fragment as t,jsxs as m}from"react/jsx-runtime";import*as a from"react";import{accentSlots as n}from"../../internal/accent";import{hasContent as s}from"../../internal/scale";import{VISUALLY_HIDDEN as i}from"../../internal/visually-hidden";const l={xs:"h-3 min-w-3",sm:"h-3.5 min-w-3.5",md:"h-4 min-w-4",lg:"h-5 min-w-5",xl:"h-6 min-w-6"},o={xs:"size-1",sm:"size-1.5",md:"size-1.5",lg:"size-2",xl:"size-2.5"},r={xs:"text-mp-label-small",sm:"text-mp-label-small",md:"text-mp-label-small",lg:"text-mp-label-medium",xl:"text-mp-label-medium"},d={xs:"px-1",sm:"px-1",md:"px-1.5",lg:"px-1.5",xl:"px-2"},p={xs:{badge:"-mt-1.5 -mb-1.5 -ms-1.5 -me-1.5",dot:"-mt-0.5 -mb-0.5 -ms-0.5 -me-0.5"},sm:{badge:"-mt-1.5 -mb-1.5 -ms-1.5 -me-1.5",dot:"-mt-0.5 -mb-0.5 -ms-0.5 -me-0.5"},md:{badge:"-mt-2 -mb-2 -ms-2 -me-2",dot:"-mt-1 -mb-1 -ms-1 -me-1"},lg:{badge:"-mt-2.5 -mb-2.5 -ms-2.5 -me-2.5",dot:"-mt-1 -mb-1 -ms-1 -me-1"},xl:{badge:"-mt-3 -mb-3 -ms-3 -me-3",dot:"-mt-1.5 -mb-1.5 -ms-1.5 -me-1.5"}},c={"top-start":"top-0 start-0","top-end":"top-0 end-0","bottom-start":"bottom-0 start-0","bottom-end":"bottom-0 end-0"},b={"top-start":"mt-[7%] ms-[7%]","top-end":"mt-[7%] me-[7%]","bottom-start":"mb-[7%] ms-[7%]","bottom-end":"mb-[7%] me-[7%]"},x={filled:"bg-(--_mp-accent) text-(--_mp-on-accent)",tonal:"bg-(--_mp-accent-container) text-(--_mp-on-accent-container)",elevated:"shadow-mp-1 bg-mp-surface-container-low text-(--_mp-accent)",outlined:"border-mp-outline border bg-mp-surface-container text-(--_mp-accent)",text:"text-(--_mp-accent) bg-transparent"};export const MPBadge=/*@__PURE__*/a.forwardRef(function({variant:a="filled",size:u="md",color:g="error",content:f,max:h=99,dot:v=!1,showZero:w=!1,invisible:y=!1,placement:z="top-end",overlap:_="square",label:j,className:N,style:k,children:B,...$},q){const F=s(B),M=!s(f)||0===f&&!w,P=v||M,R=y||M&&!v,Z=["mp-badge pointer-events-none z-10 inline-flex shrink-0 items-center justify-center","rounded-mp-full tabular-nums whitespace-nowrap",x[a],P?o[u]:[l[u],r[u],d[u]].join(" "),F?`absolute ${c[z]}`:"relative align-middle",F?P?p[u].dot:p[u].badge:"",F&&"circle"===_?b[z]:"","transition-[opacity,scale,visibility] duration-(--mp-sys-motion-duration-short4)","ease-mp-standard",R?"invisible scale-0 opacity-0":"",N??""].filter(Boolean).join(" "),A=function(e,t){return"number"==typeof e&&e>t?`${t}+`:e}(f,h),C=e("span",{ref:q,"data-mp-size":u,"data-mp-variant":a,className:Z,style:{...n(g),...k},"aria-hidden":!!R||void 0,...$,children:M&&!v?null:m(t,{children:[P||j?e("span",{className:i,children:j??A}):null,P?null:e("span",{"aria-hidden":!!j||void 0,children:A})]})});return F?m("span",{className:"relative inline-flex shrink-0 align-middle",children:[B,C]}):C});

package/dist/components/blockquote/MPBlockquote.js

@@ -1 +1 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as a from"react";import{accentSlots as r}from"../../internal/accent";import{hasContent as n,META_TEXT as i,SHEET_PAD as l}from"../../internal/scale";const o={xs:"text-mp-body-medium",sm:"text-mp-body-large",md:"text-mp-title-large",lg:"text-mp-headline-small",xl:"text-mp-headline-medium"},c="border-s-2 [border-inline-start-color:var(--_mp-accent)]",s={filled:"bg-(--_mp-accent) text-(--_mp-on-accent)",tonal:"bg-(--_mp-accent-container) text-(--_mp-on-accent-container)",elevated:"shadow-mp-1 bg-mp-surface-container-low text-mp-on-surface",outlined:"border-mp-outline-variant border border-s-2 bg-transparent text-mp-on-surface",text:"bg-transparent text-mp-on-surface"};function m(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",className:"size-full",children:e("path",{d:"M6.4 3.6c-2.3.9-3.7 2.8-3.7 5.1 0 2 1.2 3.3 2.8 3.3 1.4 0 2.5-1 2.5-2.4 0-1.3-.9-2.2-2.1-2.2-.2 0-.4 0-.6.1.3-1 1.1-1.8 2.2-2.3l-1.1-1.6ZM13.3 3.6c-2.3.9-3.7 2.8-3.7 5.1 0 2 1.2 3.3 2.8 3.3 1.4 0 2.5-1 2.5-2.4 0-1.3-.9-2.2-2.1-2.2-.2 0-.4 0-.6.1.3-1 1.1-1.8 2.2-2.3l-1.1-1.6Z",fill:"currentColor"})})}export const MPBlockquote=a.forwardRef(function({variant:a="text",size:d="md",color:p="primary",author:u,source:f,cite:x,icon:h,className:b,style:g,children:v,...y},N){const j=n(u)||n(f),w=void 0===h?e(m,{}):h,z="text"!==a,_=["mp-blockquote flex flex-col",o[d],c,z?"rounded-mp-md rounded-s-none":"",s[a],z?l[d]:"ps-4",b??""].filter(Boolean).join(" "),k=t("blockquote",{cite:x,children:[n(w)?e("span",{"aria-hidden":"true",className:"mb-1 block size-[2em] opacity-38",children:w}):null,v]}),q={...r(p),...g};return j?t("figure",{ref:N,"data-mp-size":d,"data-mp-variant":a,className:_,style:q,...y,children:[k,t("figcaption",{className:["mt-2 flex flex-wrap items-baseline gap-x-1.5",z?"opacity-80":"text-mp-on-surface-variant",i].join(" "),children:[n(u)?t("span",{className:"font-medium",children:[e("span",{"aria-hidden":"true",children:"— "}),u]}):null,n(f)?e("cite",{className:"not-italic",children:f}):null]})]}):e("div",{ref:N,"data-mp-size":d,"data-mp-variant":a,className:_,style:q,...y,children:k})});
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as a from"react";import{accentSlots as r}from"../../internal/accent";import{hasContent as n,META_TEXT as i,SHEET_PAD as l}from"../../internal/scale";const o={xs:"text-mp-body-medium",sm:"text-mp-body-large",md:"text-mp-title-large",lg:"text-mp-headline-small",xl:"text-mp-headline-medium"},c="border-s-2 [border-inline-start-color:var(--_mp-accent)]",s={filled:"bg-(--_mp-accent) text-(--_mp-on-accent)",tonal:"bg-(--_mp-accent-container) text-(--_mp-on-accent-container)",elevated:"shadow-mp-1 bg-mp-surface-container-low text-mp-on-surface",outlined:"border-mp-outline-variant border border-s-2 bg-transparent text-mp-on-surface",text:"bg-transparent text-mp-on-surface"};function m(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",className:"size-full",children:e("path",{d:"M6.4 3.6c-2.3.9-3.7 2.8-3.7 5.1 0 2 1.2 3.3 2.8 3.3 1.4 0 2.5-1 2.5-2.4 0-1.3-.9-2.2-2.1-2.2-.2 0-.4 0-.6.1.3-1 1.1-1.8 2.2-2.3l-1.1-1.6ZM13.3 3.6c-2.3.9-3.7 2.8-3.7 5.1 0 2 1.2 3.3 2.8 3.3 1.4 0 2.5-1 2.5-2.4 0-1.3-.9-2.2-2.1-2.2-.2 0-.4 0-.6.1.3-1 1.1-1.8 2.2-2.3l-1.1-1.6Z",fill:"currentColor"})})}export const MPBlockquote=/*@__PURE__*/a.forwardRef(function({variant:a="text",size:d="md",color:p="primary",author:u,source:f,cite:x,icon:h,className:b,style:g,children:v,...y},N){const j=n(u)||n(f),w=void 0===h?e(m,{}):h,z="text"!==a,_=["mp-blockquote flex flex-col",o[d],c,z?"rounded-mp-md rounded-s-none":"",s[a],z?l[d]:"ps-4",b??""].filter(Boolean).join(" "),k=t("blockquote",{cite:x,children:[n(w)?e("span",{"aria-hidden":"true",className:"mb-1 block size-[2em] opacity-38",children:w}):null,v]}),q={...r(p),...g};return j?t("figure",{ref:N,"data-mp-size":d,"data-mp-variant":a,className:_,style:q,...y,children:[k,t("figcaption",{className:["mt-2 flex flex-wrap items-baseline gap-x-1.5",z?"opacity-80":"text-mp-on-surface-variant",i].join(" "),children:[n(u)?t("span",{className:"font-medium",children:[e("span",{"aria-hidden":"true",children:"— "}),u]}):null,n(f)?e("cite",{className:"not-italic",children:f}):null]})]}):e("div",{ref:N,"data-mp-size":d,"data-mp-variant":a,className:_,style:q,...y,children:k})});

package/dist/components/bottom-navigation/MPBottomNavigation.js

@@ -1 +1 @@
-import{jsx as e,jsxs as a,Fragment as l}from"react/jsx-runtime";import*as t from"react";import{useRender as n}from"@base-ui/react/use-render";import{MPStateLayer as i}from"../../internal/StateLayer";import{hasContent as o}from"../../internal/scale";import{VISUALLY_HIDDEN as r}from"../../internal/visually-hidden";const s=t.createContext({value:null,change:()=>{},size:"md",labels:"all",disabled:!1}),c={xs:"h-14",sm:"h-16",md:"h-20",lg:"h-22",xl:"h-24"},m={xs:"h-6 w-12",sm:"h-7 w-14",md:"h-8 w-16",lg:"h-9 w-18",xl:"h-10 w-20"},d={xs:20,sm:22,md:24,lg:26,xl:28},u={xs:"text-mp-label-small",sm:"text-mp-label-small",md:"text-mp-label-medium",lg:"text-mp-label-medium",xl:"text-mp-label-large"},f={xs:"gap-0.5",sm:"gap-0.5",md:"gap-1",lg:"gap-1",xl:"gap-1.5"},p={static:"",absolute:"absolute inset-x-0 bottom-0 z-30",sticky:"sticky bottom-0 z-30",fixed:"fixed inset-x-0 bottom-0 z-40"};export const MPBottomNavigation=t.forwardRef(function({value:a,defaultValue:l=null,onValueChange:i,position:o="fixed",labels:r="all",size:m="md",divider:d=!1,safeArea:u=!0,disabled:f=!1,label:b,render:x,className:h,children:v,...g},w){const[y,z]=t.useState(l),N=void 0!==a,j=N?a:y,k=t.useCallback(e=>{N||z(e),i?.(e)},[N,i]),C=t.useMemo(()=>({value:j??null,change:k,size:m,labels:r,disabled:f}),[j,k,m,r,f]);return n({render:x??e("nav",{}),ref:w,props:{"aria-label":b,"data-mp-size":m,className:["mp-bottom-navigation bg-mp-surface-container text-mp-on-surface box-border w-full",d?"border-mp-outline-variant border-t":"",p[o],u?"pb-[env(safe-area-inset-bottom)]":"",h??""].filter(Boolean).join(" "),children:e(s.Provider,{value:C,children:e("div",{className:`flex w-full items-stretch ${c[m]}`,children:v})}),...g}})});export const MPBottomNavigationItem=t.forwardRef(function({value:n,icon:c,activeIcon:p,href:b,disabled:x=!1,className:h,children:v,onClick:g,...w},y){const z=t.useContext(s),N=x||z.disabled,j=null!==z.value&&z.value===n,k="all"===z.labels||"selected"===z.labels&&j,C=["mp-bottom-navigation__item group flex min-w-0 flex-1 flex-col items-center justify-center","box-border appearance-none bg-transparent px-1 font-[inherit] no-underline select-none",f[z.size],"outline-mp-secondary focus-visible:outline-2 focus-visible:-outline-offset-2","focus-visible:outline-solid outline-none",N?"text-mp-on-surface/38 cursor-default":j?"text-mp-on-surface cursor-pointer":"text-mp-on-surface-variant cursor-pointer",h??""].filter(Boolean).join(" "),B=a(l,{children:[o(c)||o(p)?a("span",{className:["relative flex shrink-0 items-center justify-center overflow-hidden","rounded-mp-full","transition-[background-color,color] duration-(--mp-sys-motion-duration-short4)",m[z.size],j&&!N?"bg-mp-secondary-container text-mp-on-secondary-container":""].filter(Boolean).join(" "),children:[N?null:e(i,{}),e("span",{className:"relative flex items-center justify-center",style:{width:d[z.size],height:d[z.size]},children:j?p??c:c})]}):null,o(v)?e("span",{className:k?`max-w-full truncate ${u[z.size]}`:r,children:v}):null]}),M=e=>{N?e.preventDefault():(z.change(n),g?.(e))};return b?e("a",{ref:y,href:N?void 0:b,"aria-current":j?"page":void 0,"aria-disabled":N||void 0,className:C,onClick:M,...w,children:B}):e("button",{ref:y,type:"button",disabled:N,"aria-current":j?"page":void 0,className:C,onClick:M,...w,children:B})});
+import{jsx as e,jsxs as t,Fragment as a}from"react/jsx-runtime";import*as l from"react";import{useRender as n}from"@base-ui/react/use-render";import{MPStateLayer as o}from"../../internal/StateLayer";import{hasContent as i}from"../../internal/scale";import{VISUALLY_HIDDEN as s}from"../../internal/visually-hidden";const r=/*@__PURE__*/l.createContext({value:null,change:()=>{},size:"md",labels:"all",disabled:!1}),m={xs:"h-14",sm:"h-16",md:"h-20",lg:"h-22",xl:"h-24"},d={xs:{box:"h-6 w-12",open:"w-12",shut:"w-6"},sm:{box:"h-7 w-14",open:"w-14",shut:"w-7"},md:{box:"h-8 w-16",open:"w-16",shut:"w-8"},lg:{box:"h-9 w-18",open:"w-18",shut:"w-9"},xl:{box:"h-10 w-20",open:"w-20",shut:"w-10"}},u={xs:20,sm:22,md:24,lg:26,xl:28},c={xs:"text-mp-label-small",sm:"text-mp-label-small",md:"text-mp-label-medium",lg:"text-mp-label-medium",xl:"text-mp-label-large"},p={xs:"gap-0.5",sm:"gap-0.5",md:"gap-1",lg:"gap-1",xl:"gap-1.5"},f={static:"",absolute:"absolute inset-x-0 bottom-0 z-30",sticky:"sticky bottom-0 z-30",fixed:"fixed inset-x-0 bottom-0 z-40"};export const MPBottomNavigation=/*@__PURE__*/l.forwardRef(function({value:t,defaultValue:a=null,onValueChange:o,position:i="fixed",labels:s="all",size:d="md",divider:u=!1,safeArea:c=!0,disabled:p=!1,label:b,render:x,className:h,children:v,...g},w){const[y,z]=l.useState(a),N=void 0!==t,j=N?t:y,k=l.useCallback(e=>{N||z(e),o?.(e)},[N,o]),C=l.useMemo(()=>({value:j??null,change:k,size:d,labels:s,disabled:p}),[j,k,d,s,p]);return n({render:x??e("nav",{}),ref:w,props:{"aria-label":b,"data-mp-size":d,className:["mp-bottom-navigation bg-mp-surface-container text-mp-on-surface box-border w-full",u?"border-mp-outline-variant border-t":"",f[i],c?"pb-[env(safe-area-inset-bottom)]":"",h??""].filter(Boolean).join(" "),children:e(r.Provider,{value:C,children:e("div",{className:`flex w-full items-stretch ${m[d]}`,children:v})}),...g}})});export const MPBottomNavigationItem=/*@__PURE__*/l.forwardRef(function({value:n,icon:m,activeIcon:f,href:b,disabled:x=!1,className:h,children:v,onClick:g,...w},y){const z=l.useContext(r),N=x||z.disabled,j=null!==z.value&&z.value===n,k="all"===z.labels||"selected"===z.labels&&j,C=["mp-bottom-navigation__item group flex min-w-0 flex-1 flex-col items-center justify-center","box-border appearance-none bg-transparent px-1 font-[inherit] no-underline select-none",p[z.size],"outline-mp-secondary focus-visible:outline-2 focus-visible:-outline-offset-2","focus-visible:outline-solid outline-none",N?"text-mp-on-surface/38 cursor-default":j?"text-mp-on-surface cursor-pointer":"text-mp-on-surface-variant cursor-pointer",h??""].filter(Boolean).join(" "),B=t(a,{children:[i(m)||i(f)?t("span",{className:["relative flex shrink-0 items-center justify-center overflow-hidden","rounded-mp-full","transition-[color] duration-(--mp-sys-motion-duration-short4)",d[z.size].box,j&&!N?"text-mp-on-secondary-container":""].filter(Boolean).join(" "),children:[N?null:e("span",{"aria-hidden":"true",className:["pointer-events-none absolute inset-y-0 left-1/2 -translate-x-1/2","rounded-mp-full bg-mp-secondary-container","transition-[width,opacity] duration-(--mp-sys-motion-duration-short4)","ease-mp-standard",j?`${d[z.size].open} opacity-100`:`${d[z.size].shut} opacity-0`].join(" ")}),N?null:e(o,{}),e("span",{className:"relative flex items-center justify-center",style:{width:u[z.size],height:u[z.size]},children:j?f??m:m})]}):null,i(v)?e("span",{className:k?`max-w-full truncate ${c[z.size]}`:s,children:v}):null]}),$=e=>{N?e.preventDefault():(z.change(n),g?.(e))};return b?e("a",{ref:y,href:N?void 0:b,"aria-current":j?"page":void 0,"aria-disabled":N||void 0,className:C,onClick:$,...w,children:B}):e("button",{ref:y,type:"button",disabled:N,"aria-current":j?"page":void 0,className:C,onClick:$,...w,children:B})});

package/dist/components/box/MPBox.js

@@ -1 +1 @@
-import*as r from"react";import{useRender as e}from"@base-ui/react/use-render";import{SHEET_PAD as a}from"../../internal/scale";import{CONTAINER_SURFACE as o}from"../../internal/surface";export const MPBox=r.forwardRef(function({variant:r="outlined",size:n="md",padded:t=!0,render:d,className:i,children:m,...s},p){return e({render:d,ref:p,props:{"data-mp-size":n,"data-mp-variant":r,className:["mp-box rounded-mp-md block","box-border",t?a[n]:"",o[r],"text-mp-on-surface",i??""].filter(Boolean).join(" "),children:m,...s}})});
+import*as r from"react";import{useRender as e}from"@base-ui/react/use-render";import{SHEET_PAD as a}from"../../internal/scale";import{CONTAINER_SURFACE as o}from"../../internal/surface";export const MPBox=/*@__PURE__*/r.forwardRef(function({variant:r="outlined",size:n="md",padded:t=!0,render:d,className:i,children:m,...s},p){return e({render:d,ref:p,props:{"data-mp-size":n,"data-mp-variant":r,className:["mp-box rounded-mp-md block","box-border",t?a[n]:"",o[r],"text-mp-on-surface",i??""].filter(Boolean).join(" "),children:m,...s}})});

package/dist/components/breadcrumb/MPBreadcrumb.js

@@ -1 +1 @@
-import{jsx as e,jsxs as n,Fragment as t}from"react/jsx-runtime";import*as r from"react";import{MPIcon as o}from"../icon/MPIcon";import{ArrowRightIcon as i,ChevronRightIcon as a,MoreIcon as s}from"../../constants/icons";import{accentSlots as l}from"../../internal/accent";import{CONTROL_GAP as c,hasContent as m,PROSE_TEXT as d}from"../../internal/scale";const u=r.createContext({size:"md",last:!1,position:null}),p={xs:"gap-1",sm:"gap-1.5",md:"gap-2",lg:"gap-2.5",xl:"gap-3"},h={xs:"rounded-mp-xs",sm:"rounded-mp-xs",md:"rounded-mp-xs",lg:"rounded-mp-sm",xl:"rounded-mp-sm"};const f=["chevron","arrow","slash","dot"];export const MPBreadcrumb=r.forwardRef(function({size:t="md",color:c="primary",separator:m="chevron",maxItems:h,itemsBeforeCollapse:x=1,itemsAfterCollapse:b=1,expandable:v=!0,label:g="Breadcrumb",expandLabel:N="Show hidden steps",structuredData:y=!1,className:k,style:B,children:j,...w},z){const[C,P]=r.useState(!1),M=r.Children.toArray(j).filter(r.isValidElement),I=M.length,S=M.some(e=>!0===e.props.current),L=!C&&!y&&void 0!==h&&I>Math.max(h,1)&&I-x-b>1?[...M.slice(0,Math.max(0,x)),null,...M.slice(I-Math.max(0,b))]:M,_="string"==typeof(A=m)&&f.includes(A)?function(n){switch(n){case"chevron":return e(o,{icon:a,size:"1.1em",className:"rtl:rotate-180"});case"arrow":return e(o,{icon:i,size:"1em",className:"rtl:rotate-180"});case"slash":return e("span",{"aria-hidden":"true",children:"/"});case"dot":return e("span",{"aria-hidden":"true",children:"·"});default:return null}}(m):m;var A;const E=r.useMemo(()=>Array.from({length:L.length},(e,n)=>({size:t,last:!S&&n===L.length-1,position:y?n+1:null})),[t,S,L.length,y]),F=["rounded-mp-xs text-mp-on-surface-variant inline-flex items-center px-0.5","appearance-none border-0 bg-transparent font-[inherit]","transition-[background-color,color] duration-(--mp-sys-motion-duration-short4)",v?["cursor-pointer hover:bg-(--_mp-accent-container) hover:text-(--_mp-on-accent-container)","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-1","focus-visible:outline-solid outline-none"].join(" "):""].filter(Boolean).join(" ");return e("nav",{ref:z,"aria-label":g,"data-mp-size":t,className:["mp-breadcrumb flex",d[t],k??""].filter(Boolean).join(" "),style:{...l(c),...B},...w,children:e("ol",{role:"list",itemScope:y||void 0,itemType:y?"https://schema.org/BreadcrumbList":void 0,className:`flex list-none flex-wrap items-center p-0 ${p[t]}`,children:L.map((t,i)=>n(r.Fragment,{children:[i>0?e("li",{"aria-hidden":"true",className:"text-mp-on-surface-variant flex shrink-0 items-center select-none",children:_}):null,t?e(u.Provider,{value:E[i],children:t}):e("li",{className:"flex shrink-0 items-center",children:v?e("button",{type:"button",className:F,"aria-label":N,onClick:()=>P(!0),children:e(o,{icon:s,size:"1.1em"})}):e("span",{className:F,"aria-hidden":"true",children:e(o,{icon:s,size:"1.1em"})})})]},t?t.key??i:"fold"))})})});export const MPBreadcrumbItem=r.forwardRef(function({href:o,onClick:i,startIcon:a,endIcon:s,current:l,disabled:d=!1,className:p,children:f,...x},b){const{size:v,last:g,position:N}=r.useContext(u),y=l??g,k=Boolean(o||i)&&!y&&!d,B=null!==N,j=["inline-flex min-w-0 items-center px-1 no-underline","appearance-none border-0 bg-transparent font-[inherit] text-[inherit]",c[v],h[v],"transition-[background-color,color] duration-(--mp-sys-motion-duration-short4)",d?"text-mp-on-surface/38 cursor-default":y?"text-mp-on-surface font-medium":k?["text-mp-on-surface-variant cursor-pointer","hover:bg-(--_mp-accent-container) hover:text-(--_mp-on-accent-container)","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-1","focus-visible:outline-solid outline-none"].join(" "):"text-mp-on-surface-variant"].filter(Boolean).join(" "),w=n(t,{children:[m(a)?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:a}):null,e("span",{className:"truncate",itemProp:B?"name":void 0,children:f}),m(s)?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:s}):null]});return n("li",{ref:b,itemProp:B?"itemListElement":void 0,itemScope:B||void 0,itemType:B?"https://schema.org/ListItem":void 0,className:["flex min-w-0 items-center",p??""].filter(Boolean).join(" "),...x,children:[B?e("meta",{itemProp:"position",content:String(N)}):null,k&&o?e("a",{href:o,itemProp:B?"item":void 0,className:j,onClick:i,children:w}):k?e("button",{type:"button",className:j,onClick:i,children:w}):e("span",{className:j,"aria-current":y?"page":void 0,"aria-disabled":d||void 0,children:w})]})});
+import{jsx as e,jsxs as n,Fragment as t}from"react/jsx-runtime";import*as r from"react";import{MPIcon as o}from"../icon/MPIcon";import{ArrowRightIcon as i,ChevronRightIcon as a,MoreIcon as s}from"../../constants/icons";import{accentSlots as l}from"../../internal/accent";import{CONTROL_GAP as c,hasContent as m,PROSE_TEXT as d}from"../../internal/scale";const u=/*@__PURE__*/r.createContext({size:"md",last:!1,position:null}),p={xs:"gap-1",sm:"gap-1.5",md:"gap-2",lg:"gap-2.5",xl:"gap-3"},h={xs:"rounded-mp-xs",sm:"rounded-mp-xs",md:"rounded-mp-xs",lg:"rounded-mp-sm",xl:"rounded-mp-sm"};const f=["chevron","arrow","slash","dot"];export const MPBreadcrumb=/*@__PURE__*/r.forwardRef(function({size:t="md",color:c="primary",separator:m="chevron",maxItems:h,itemsBeforeCollapse:x=1,itemsAfterCollapse:b=1,expandable:v=!0,label:g="Breadcrumb",expandLabel:N="Show hidden steps",structuredData:y=!1,className:k,style:B,children:j,...w},z){const[C,P]=r.useState(!1),M=r.Children.toArray(j).filter(r.isValidElement),I=M.length,S=M.some(e=>!0===e.props.current),L=!C&&!y&&void 0!==h&&I>Math.max(h,1)&&I-x-b>1?[...M.slice(0,Math.max(0,x)),null,...M.slice(I-Math.max(0,b))]:M,_="string"==typeof(A=m)&&f.includes(A)?function(n){switch(n){case"chevron":return e(o,{icon:a,size:"1.1em",className:"rtl:rotate-180"});case"arrow":return e(o,{icon:i,size:"1em",className:"rtl:rotate-180"});case"slash":return e("span",{"aria-hidden":"true",children:"/"});case"dot":return e("span",{"aria-hidden":"true",children:"·"});default:return null}}(m):m;var A;const E=r.useMemo(()=>Array.from({length:L.length},(e,n)=>({size:t,last:!S&&n===L.length-1,position:y?n+1:null})),[t,S,L.length,y]),F=["rounded-mp-xs text-mp-on-surface-variant inline-flex items-center px-0.5","appearance-none border-0 bg-transparent font-[inherit]","transition-[background-color,color] duration-(--mp-sys-motion-duration-short4)",v?["cursor-pointer hover:bg-(--_mp-accent-container) hover:text-(--_mp-on-accent-container)","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-1","focus-visible:outline-solid outline-none"].join(" "):""].filter(Boolean).join(" ");return e("nav",{ref:z,"aria-label":g,"data-mp-size":t,className:["mp-breadcrumb flex",d[t],k??""].filter(Boolean).join(" "),style:{...l(c),...B},...w,children:e("ol",{role:"list",itemScope:y||void 0,itemType:y?"https://schema.org/BreadcrumbList":void 0,className:`flex list-none flex-wrap items-center p-0 ${p[t]}`,children:L.map((t,i)=>n(r.Fragment,{children:[i>0?e("li",{"aria-hidden":"true",className:"text-mp-on-surface-variant flex shrink-0 items-center select-none",children:_}):null,t?e(u.Provider,{value:E[i],children:t}):e("li",{className:"flex shrink-0 items-center",children:v?e("button",{type:"button",className:F,"aria-label":N,onClick:()=>P(!0),children:e(o,{icon:s,size:"1.1em"})}):e("span",{className:F,"aria-hidden":"true",children:e(o,{icon:s,size:"1.1em"})})})]},t?t.key??i:"fold"))})})});export const MPBreadcrumbItem=/*@__PURE__*/r.forwardRef(function({href:o,onClick:i,startIcon:a,endIcon:s,current:l,disabled:d=!1,className:p,children:f,...x},b){const{size:v,last:g,position:N}=r.useContext(u),y=l??g,k=Boolean(o||i)&&!y&&!d,B=null!==N,j=["inline-flex min-w-0 items-center px-1 no-underline","appearance-none border-0 bg-transparent font-[inherit] text-[inherit]",c[v],h[v],"transition-[background-color,color] duration-(--mp-sys-motion-duration-short4)",d?"text-mp-on-surface/38 cursor-default":y?"text-mp-on-surface font-medium":k?["text-mp-on-surface-variant cursor-pointer","hover:bg-(--_mp-accent-container) hover:text-(--_mp-on-accent-container)","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-1","focus-visible:outline-solid outline-none"].join(" "):"text-mp-on-surface-variant"].filter(Boolean).join(" "),w=n(t,{children:[m(a)?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:a}):null,e("span",{className:"truncate",itemProp:B?"name":void 0,children:f}),m(s)?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:s}):null]});return n("li",{ref:b,itemProp:B?"itemListElement":void 0,itemScope:B||void 0,itemType:B?"https://schema.org/ListItem":void 0,className:["flex min-w-0 items-center",p??""].filter(Boolean).join(" "),...x,children:[B?e("meta",{itemProp:"position",content:String(N)}):null,k&&o?e("a",{href:o,itemProp:B?"item":void 0,className:j,onClick:i,children:w}):k?e("button",{type:"button",className:j,onClick:i,children:w}):e("span",{className:j,"aria-current":y?"page":void 0,"aria-disabled":d||void 0,children:w})]})});

package/dist/components/button/MPButton.js

@@ -1 +1 @@
-import{jsx as e,jsxs as o}from"react/jsx-runtime";import*as t from"react";import{Button as n}from"@base-ui/react/button";import{MPIcon as r}from"../icon/MPIcon";import{SpinnerIcon as a}from"../../constants/icons";import{accentSlots as i}from"../../internal/accent";import{MPButtonGroupContext as s}from"../../internal/button-group";import{useMPLocale as l,useMPMessages as c}from"../../internal/locale";import{MPStateLayer as m}from"../../internal/StateLayer";import{CONTROL_GAP as p,CONTROL_HEIGHT as d,CONTROL_ICON as u,CONTROL_PAD_X as f,CONTROL_SQUARE as b,CONTROL_TEXT as x,hasContent as g}from"../../internal/scale";const v={filled:"bg-(--_mp-accent) text-(--_mp-on-accent)",tonal:"bg-(--_mp-accent-container) text-(--_mp-on-accent-container)",elevated:"shadow-mp-1 hover:shadow-mp-2 bg-mp-surface-container-low text-(--_mp-accent)",outlined:"border-mp-outline border bg-transparent text-(--_mp-accent)",text:"bg-transparent text-(--_mp-accent)"},h={filled:"bg-mp-on-surface/12 text-mp-on-surface/38",tonal:"bg-mp-on-surface/12 text-mp-on-surface/38",elevated:"bg-mp-on-surface/12 text-mp-on-surface/38 shadow-none",outlined:"border-mp-on-surface/12 border bg-transparent text-mp-on-surface/38",text:"bg-transparent text-mp-on-surface/38"};export const MPButton=t.forwardRef(function({variant:w,size:y,color:_,disabled:j,startIcon:k,endIcon:z,loading:B=!1,loadingLabel:C,locale:I,fullWidth:N=!1,type:P="button",className:L,style:M,children:D,onClick:R,...S},W){const $=l(I),q=c("common",$),A=t.useContext(s),E=w??A?.variant??"filled",F=y??A?.size??"md",G=_??A?.color??"primary",H=j??A?.disabled??!1,J=!g(D);return o(n,{ref:W,type:P,disabled:H,"aria-busy":B||void 0,"aria-disabled":B||void 0,"data-mp-size":F,"data-mp-variant":E,"data-loading":B||void 0,className:["mp-button group relative inline-flex shrink-0 items-center justify-center","rounded-mp-full 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,border-color,box-shadow,color]","duration-(--mp-sys-motion-duration-short4)",d[F],x[F],p[F],J?`${b[F]} px-0`:f[F],H?h[E]:v[E],H?"cursor-default":"",B?"cursor-progress":"",N?"w-full":"",L??""].filter(Boolean).join(" "),style:{...i(G),...M},onClick:e=>{if(B)return e.preventDefault(),void e.stopPropagation();R?.(e)},...S,children:[H?null:e(m,{}),B?e(r,{icon:a,size:u[F],label:C??q.loading,className:"animate-spin"}):k,D,z]})});
+import{jsx as e,jsxs as o}from"react/jsx-runtime";import*as t from"react";import{Button as n}from"@base-ui/react/button";import{MPIcon as r}from"../icon/MPIcon";import{SpinnerIcon as a}from"../../constants/icons";import{accentSlots as i}from"../../internal/accent";import{MPButtonGroupContext as s}from"../../internal/button-group";import{useMPLocale as l,useMPMessages as c}from"../../internal/locale";import{MPStateLayer as m}from"../../internal/StateLayer";import{CONTROL_GAP as p,CONTROL_HEIGHT as d,CONTROL_ICON as u,CONTROL_PAD_X as f,CONTROL_SQUARE as b,CONTROL_TEXT as x,hasContent as g}from"../../internal/scale";const v={filled:"bg-(--_mp-accent) text-(--_mp-on-accent)",tonal:"bg-(--_mp-accent-container) text-(--_mp-on-accent-container)",elevated:"shadow-mp-1 hover:shadow-mp-2 bg-mp-surface-container-low text-(--_mp-accent)",outlined:"border-mp-outline border bg-transparent text-(--_mp-accent)",text:"bg-transparent text-(--_mp-accent)"},h={filled:"bg-mp-on-surface/12 text-mp-on-surface/38",tonal:"bg-mp-on-surface/12 text-mp-on-surface/38",elevated:"bg-mp-on-surface/12 text-mp-on-surface/38 shadow-none",outlined:"border-mp-on-surface/12 border bg-transparent text-mp-on-surface/38",text:"bg-transparent text-mp-on-surface/38"};export const MPButton=/*@__PURE__*/t.forwardRef(function({variant:w,size:y,color:_,disabled:j,startIcon:k,endIcon:z,loading:B=!1,loadingLabel:C,locale:I,fullWidth:N=!1,type:P="button",className:L,style:M,children:D,onClick:R,...S},W){const $=l(I),q=c("common",$),A=t.useContext(s),E=w??A?.variant??"filled",F=y??A?.size??"md",G=_??A?.color??"primary",H=j??A?.disabled??!1,J=!g(D);return o(n,{ref:W,type:P,disabled:H,"aria-busy":B||void 0,"aria-disabled":B||void 0,"data-mp-size":F,"data-mp-variant":E,"data-loading":B||void 0,className:["mp-button group relative inline-flex shrink-0 items-center justify-center","rounded-mp-full 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,border-color,box-shadow,color]","duration-(--mp-sys-motion-duration-short4)",d[F],x[F],p[F],J?`${b[F]} px-0`:f[F],H?h[E]:v[E],H?"cursor-default":"",B?"cursor-progress":"",N?"w-full":"",L??""].filter(Boolean).join(" "),style:{...i(G),...M},onClick:e=>{if(B)return e.preventDefault(),void e.stopPropagation();R?.(e)},...S,children:[H?null:e(m,{}),B?e(r,{icon:a,size:u[F],label:C??q.loading,className:"animate-spin"}):k,D,z]})});

package/dist/components/button-group/MPButtonGroup.js

@@ -1 +1 @@
-import{jsx as o}from"react/jsx-runtime";import*as r from"react";import{MPButtonGroupContext as e}from"../../internal/button-group";const t={horizontal:"[&>*:not(:first-child)]:rounded-s-mp-sm [&>*:not(:last-child)]:rounded-e-mp-sm",vertical:"[&>*:not(:first-child)]:rounded-t-mp-sm [&>*:not(:last-child)]:rounded-b-mp-sm"};export const MPButtonGroup=r.forwardRef(function({variant:i,size:l,color:n,disabled:a,orientation:s="horizontal",fullWidth:d=!1,className:c,children:m,...u},f){const p=r.useMemo(()=>({variant:i,size:l,color:n,disabled:a}),[i,l,n,a]);return o(e.Provider,{value:p,children:o("div",{ref:f,role:"group","data-mp-orientation":s,className:["mp-button-group inline-flex gap-0.5 align-middle","vertical"===s?"flex-col":"flex-row",t[s],"[&>*]:relative [&>*:focus-visible]:z-10",d?"flex w-full [&>*]:flex-1":"",c??""].filter(Boolean).join(" "),...u,children:m})})});
+import{jsx as o}from"react/jsx-runtime";import*as r from"react";import{MPButtonGroupContext as e}from"../../internal/button-group";const t={horizontal:"[&>*:not(:first-child)]:rounded-s-mp-sm [&>*:not(:last-child)]:rounded-e-mp-sm",vertical:"[&>*:not(:first-child)]:rounded-t-mp-sm [&>*:not(:last-child)]:rounded-b-mp-sm"};export const MPButtonGroup=/*@__PURE__*/r.forwardRef(function({variant:i,size:l,color:n,disabled:a,orientation:s="horizontal",fullWidth:d=!1,className:c,children:m,...u},f){const p=r.useMemo(()=>({variant:i,size:l,color:n,disabled:a}),[i,l,n,a]);return o(e.Provider,{value:p,children:o("div",{ref:f,role:"group","data-mp-orientation":s,className:["mp-button-group inline-flex gap-0.5 align-middle","vertical"===s?"flex-col":"flex-row",t[s],"[&>*]:relative [&>*:focus-visible]:z-10",d?"flex w-full [&>*]:flex-1":"",c??""].filter(Boolean).join(" "),...u,children:m})})});

package/dist/components/card/MPCard.js

@@ -1 +1 @@
-import{jsx as e,jsxs as l,Fragment as a}from"react/jsx-runtime";import*as r from"react";import{MPBox as n}from"../box/MPBox";import{hasContent as i,META_TEXT as o,PROSE_TEXT as t,SHEET_GAP as c,SHEET_PAD_X as s,SHEET_PAD_Y as d,SHEET_TITLE as m}from"../../internal/scale";export const MPCard=r.forwardRef(function({size:r="md",title:f,subtitle:u,headerAction:p,media:x,footer:h,dividers:_=!1,className:v,children:N,...w},b){const k=s[r],$=d[r],g=_?`${k} ${$}`:k,j=i(f)||i(u)||i(p),y=i(x),B=[j?{key:"header",className:"mp-card__header flex items-start gap-3",content:l(a,{children:[i(f)||i(u)?l("div",{className:"flex min-w-0 flex-1 flex-col",children:[i(f)?e("div",{className:`mp-card__title ${m[r]}`,children:f}):null,i(u)?e("div",{className:`text-mp-on-surface-variant ${o}`,children:u}):null]}):null,i(p)?e("div",{className:"ms-auto shrink-0",children:p}):null]})}:null,i(N)?{key:"content",className:`mp-card__body min-w-0 ${t[r]}`,content:N}:null,i(h)?{key:"footer",className:"mp-card__footer flex flex-wrap items-center gap-2",content:h}:null].filter(e=>null!==e);return l(n,{ref:b,size:r,padded:!1,className:["mp-card flex flex-col",y?"overflow-hidden":"",v??""].filter(Boolean).join(" "),...w,children:[y?e("div",{className:"mp-card__media [&_img]:block [&_img]:w-full [&_video]:block [&_video]:w-full",children:x}):null,B.length>0?e("div",{className:["flex min-w-0 flex-col",_?"":`${$} ${c[r]}`].filter(Boolean).join(" "),children:B.map((l,a)=>e("div",{className:[g,l.className,_&&a>0?"border-mp-outline-variant border-t":""].filter(Boolean).join(" "),children:l.content},l.key))}):null]})});
+import{jsx as e,jsxs as l,Fragment as a}from"react/jsx-runtime";import*as r from"react";import{MPBox as n}from"../box/MPBox";import{hasContent as i,META_TEXT as o,PROSE_TEXT as t,SHEET_GAP as c,SHEET_PAD_X as s,SHEET_PAD_Y as d,SHEET_TITLE as m}from"../../internal/scale";export const MPCard=/*@__PURE__*/r.forwardRef(function({size:r="md",title:f,subtitle:u,headerAction:p,media:x,footer:h,dividers:_=!1,className:v,children:N,...w},b){const k=s[r],$=d[r],g=_?`${k} ${$}`:k,j=i(f)||i(u)||i(p),y=i(x),B=[j?{key:"header",className:"mp-card__header flex items-start gap-3",content:l(a,{children:[i(f)||i(u)?l("div",{className:"flex min-w-0 flex-1 flex-col",children:[i(f)?e("div",{className:`mp-card__title ${m[r]}`,children:f}):null,i(u)?e("div",{className:`text-mp-on-surface-variant ${o}`,children:u}):null]}):null,i(p)?e("div",{className:"ms-auto shrink-0",children:p}):null]})}:null,i(N)?{key:"content",className:`mp-card__body min-w-0 ${t[r]}`,content:N}:null,i(h)?{key:"footer",className:"mp-card__footer flex flex-wrap items-center gap-2",content:h}:null].filter(e=>null!==e);return l(n,{ref:b,size:r,padded:!1,className:["mp-card flex flex-col",y?"overflow-hidden":"",v??""].filter(Boolean).join(" "),...w,children:[y?e("div",{className:"mp-card__media [&_img]:block [&_img]:w-full [&_video]:block [&_video]:w-full",children:x}):null,B.length>0?e("div",{className:["flex min-w-0 flex-col",_?"":`${$} ${c[r]}`].filter(Boolean).join(" "),children:B.map((l,a)=>e("div",{className:[g,l.className,_&&a>0?"border-mp-outline-variant border-t":""].filter(Boolean).join(" "),children:l.content},l.key))}):null]})});

package/dist/components/carousel/MPCarousel.js

@@ -1 +1 @@
-import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as t from"react";import{MPIconButton as n}from"../icon-button/MPIconButton";import{MPIcon as o}from"../icon/MPIcon";import{ChevronLeftIcon as a,ChevronRightIcon as i}from"../../constants/icons";import{accentSlots as l}from"../../internal/accent";import{CONTROL_ICON as s}from"../../internal/scale";import{CONTAINER_SURFACE as c}from"../../internal/surface";import{VISUALLY_HIDDEN as u}from"../../internal/visually-hidden";const d={xs:"start-1 end-1",sm:"start-1.5 end-1.5",md:"start-2 end-2",lg:"start-3 end-3",xl:"start-4 end-4"},m={xs:{rest:"h-1 w-1",current:"h-1 w-3",gap:"gap-1"},sm:{rest:"h-1 w-1",current:"h-1 w-3.5",gap:"gap-1"},md:{rest:"h-1.5 w-1.5",current:"h-1.5 w-4",gap:"gap-1.5"},lg:{rest:"h-1.5 w-1.5",current:"h-1.5 w-5",gap:"gap-2"},xl:{rest:"h-2 w-2",current:"h-2 w-6",gap:"gap-2"}},f=(e,r)=>`Slide ${e} of ${r}`;export const MPCarousel=t.forwardRef(function({value:p,defaultValue:h=0,onValueChange:b,loop:v=!0,autoPlay:w=!1,interval:g=5e3,arrows:x=!0,indicators:N=!0,variant:y="outlined",size:M="md",color:k="primary",label:R="Carousel",previousLabel:j="Previous slide",nextLabel:C="Next slide",slideLabel:P=f,className:z,style:I,children:$,...L},E){const S=t.Children.toArray($),T=S.length,[A,B]=t.useState(h),F=Math.min(Math.max(p??A,0),Math.max(T-1,0)),V=t.useRef(null),W=t.useRef([]),q=t.useRef(!1),_=t.useRef(!1),D=t.useRef(!1),[G,H]=t.useState(!1),J=t.useRef(F),K=t.useRef(b);J.current=F,K.current=b;const O=t.useCallback((e,r=!1)=>{if(0===T)return;const t=v?(e%T+T)%T:Math.min(Math.max(e,0),T-1);q.current=r,void 0===p&&B(t),t!==J.current&&K.current?.(t)},[T,v,p]);t.useEffect(()=>{if(q.current)return void(q.current=!1);if(!_.current)return void(_.current=!0);W.current[F]?.scrollIntoView({block:"nearest",inline:"start"}),D.current=!0;const e=window.setTimeout(()=>{D.current=!1},700);return()=>window.clearTimeout(e)},[F]),t.useEffect(()=>{if(!w||G||T<2)return;if(window.matchMedia?.("(prefers-reduced-motion: reduce)").matches)return;const e=window.setInterval(()=>{document.hidden||O(J.current+1)},g);return()=>window.clearInterval(e)},[w,G,T,g,O]);const Q=t.useRef(0);t.useEffect(()=>()=>cancelAnimationFrame(Q.current),[]);const U=F<=0,X=F>=T-1;return r("div",{ref:E,role:"region","aria-roledescription":"carousel","aria-label":R,"data-mp-size":M,"data-mp-variant":y,className:["mp-carousel flex w-full flex-col",z??""].filter(Boolean).join(" "),style:{...l(k),...I},onPointerEnter:()=>H(!0),onPointerLeave:()=>H(!1),onFocus:()=>H(!0),onBlur:e=>{e.currentTarget.contains(e.relatedTarget)||H(!1)},...L,children:[r("div",{className:["relative min-w-0 overflow-hidden","rounded-mp-md box-border",c[y],"text-mp-on-surface"].join(" "),children:[e("div",{ref:V,tabIndex:0,role:"group","aria-label":R,className:["flex min-w-0 snap-x snap-mandatory overflow-x-auto scroll-smooth","motion-reduce:scroll-auto","[scrollbar-width:none] [&::-webkit-scrollbar]:hidden","outline-mp-secondary focus-visible:outline-2 focus-visible:-outline-offset-2","focus-visible:outline-solid outline-none"].join(" "),onScroll:()=>{Q.current||(Q.current=requestAnimationFrame(()=>{Q.current=0;const e=V.current;if(!e||0===e.clientWidth||D.current)return;const r=Math.round(Math.abs(e.scrollLeft)/e.clientWidth);r!==J.current&&r>=0&&r<T&&O(r,!0)}))},children:S.map((r,t)=>e("div",{ref:e=>{W.current[t]=e,W.current.length=T},role:"group","aria-roledescription":"slide","aria-label":P(t+1,T),className:"w-full shrink-0 grow-0 basis-full snap-start",children:r},t))}),x&&T>1?r("div",{className:`pointer-events-none absolute inset-y-0 flex items-center ${d[M]}`,children:[e(n,{variant:"filled",size:M,color:k,label:j,disabled:!v&&U,className:"pointer-events-auto",icon:e(o,{icon:a,size:s[M],className:"rtl:rotate-180"}),onClick:()=>O(F-1)}),e("span",{className:"flex-1"}),e(n,{variant:"filled",size:M,color:k,label:C,disabled:!v&&X,className:"pointer-events-auto",icon:e(o,{icon:i,size:s[M],className:"rtl:rotate-180"}),onClick:()=>O(F+1)})]}):null]}),N&&T>1?e("div",{className:`flex shrink-0 items-center justify-center pt-2 ${m[M].gap}`,children:S.map((r,t)=>e("button",{type:"button","aria-label":P(t+1,T),"aria-current":t===F?"true":void 0,className:["rounded-mp-full cursor-pointer appearance-none border-0 p-0","transition-[width,background-color] duration-(--mp-sys-motion-duration-short4)","ease-mp-standard motion-reduce:transition-none","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-2","focus-visible:outline-solid outline-none",t===F?`${m[M].current} bg-(--_mp-accent)`:`${m[M].rest} bg-mp-outline-variant hover:bg-mp-outline`].join(" "),onClick:()=>O(t)},t))}):null,e("span",{className:u,"aria-live":w?"off":"polite",children:T>0?P(F+1,T):""})]})});
+import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as t from"react";import{MPIconButton as n}from"../icon-button/MPIconButton";import{MPIcon as o}from"../icon/MPIcon";import{ChevronLeftIcon as a,ChevronRightIcon as i}from"../../constants/icons";import{accentSlots as l}from"../../internal/accent";import{CONTROL_ICON as s}from"../../internal/scale";import{CONTAINER_SURFACE as c}from"../../internal/surface";import{VISUALLY_HIDDEN as u}from"../../internal/visually-hidden";const d={xs:"start-1 end-1",sm:"start-1.5 end-1.5",md:"start-2 end-2",lg:"start-3 end-3",xl:"start-4 end-4"},m={xs:{rest:"h-1 w-1",current:"h-1 w-3",gap:"gap-1"},sm:{rest:"h-1 w-1",current:"h-1 w-3.5",gap:"gap-1"},md:{rest:"h-1.5 w-1.5",current:"h-1.5 w-4",gap:"gap-1.5"},lg:{rest:"h-1.5 w-1.5",current:"h-1.5 w-5",gap:"gap-2"},xl:{rest:"h-2 w-2",current:"h-2 w-6",gap:"gap-2"}},f=(e,r)=>`Slide ${e} of ${r}`;export const MPCarousel=/*@__PURE__*/t.forwardRef(function({value:p,defaultValue:h=0,onValueChange:b,loop:v=!0,autoPlay:w=!1,interval:g=5e3,arrows:x=!0,indicators:N=!0,variant:y="outlined",size:M="md",color:k="primary",label:R="Carousel",previousLabel:j="Previous slide",nextLabel:C="Next slide",slideLabel:P=f,className:z,style:I,children:$,...L},E){const S=t.Children.toArray($),T=S.length,[A,B]=t.useState(h),F=Math.min(Math.max(p??A,0),Math.max(T-1,0)),V=t.useRef(null),W=t.useRef([]),q=t.useRef(!1),_=t.useRef(!1),D=t.useRef(!1),[G,H]=t.useState(!1),J=t.useRef(F),K=t.useRef(b);J.current=F,K.current=b;const O=t.useCallback((e,r=!1)=>{if(0===T)return;const t=v?(e%T+T)%T:Math.min(Math.max(e,0),T-1);q.current=r,void 0===p&&B(t),t!==J.current&&K.current?.(t)},[T,v,p]);t.useEffect(()=>{if(q.current)return void(q.current=!1);if(!_.current)return void(_.current=!0);W.current[F]?.scrollIntoView({block:"nearest",inline:"start"}),D.current=!0;const e=window.setTimeout(()=>{D.current=!1},700);return()=>window.clearTimeout(e)},[F]),t.useEffect(()=>{if(!w||G||T<2)return;if(window.matchMedia?.("(prefers-reduced-motion: reduce)").matches)return;const e=window.setInterval(()=>{document.hidden||O(J.current+1)},g);return()=>window.clearInterval(e)},[w,G,T,g,O]);const Q=t.useRef(0);t.useEffect(()=>()=>cancelAnimationFrame(Q.current),[]);const U=F<=0,X=F>=T-1;return r("div",{ref:E,role:"region","aria-roledescription":"carousel","aria-label":R,"data-mp-size":M,"data-mp-variant":y,className:["mp-carousel flex w-full flex-col",z??""].filter(Boolean).join(" "),style:{...l(k),...I},onPointerEnter:()=>H(!0),onPointerLeave:()=>H(!1),onFocus:()=>H(!0),onBlur:e=>{e.currentTarget.contains(e.relatedTarget)||H(!1)},...L,children:[r("div",{className:["relative min-w-0 overflow-hidden","rounded-mp-md box-border",c[y],"text-mp-on-surface"].join(" "),children:[e("div",{ref:V,tabIndex:0,role:"group","aria-label":R,className:["flex min-w-0 snap-x snap-mandatory overflow-x-auto scroll-smooth","motion-reduce:scroll-auto","[scrollbar-width:none] [&::-webkit-scrollbar]:hidden","outline-mp-secondary focus-visible:outline-2 focus-visible:-outline-offset-2","focus-visible:outline-solid outline-none"].join(" "),onScroll:()=>{Q.current||(Q.current=requestAnimationFrame(()=>{Q.current=0;const e=V.current;if(!e||0===e.clientWidth||D.current)return;const r=Math.round(Math.abs(e.scrollLeft)/e.clientWidth);r!==J.current&&r>=0&&r<T&&O(r,!0)}))},children:S.map((r,t)=>e("div",{ref:e=>{W.current[t]=e,W.current.length=T},role:"group","aria-roledescription":"slide","aria-label":P(t+1,T),className:"w-full shrink-0 grow-0 basis-full snap-start",children:r},t))}),x&&T>1?r("div",{className:`pointer-events-none absolute inset-y-0 flex items-center ${d[M]}`,children:[e(n,{variant:"filled",size:M,color:k,label:j,disabled:!v&&U,className:"pointer-events-auto",icon:e(o,{icon:a,size:s[M],className:"rtl:rotate-180"}),onClick:()=>O(F-1)}),e("span",{className:"flex-1"}),e(n,{variant:"filled",size:M,color:k,label:C,disabled:!v&&X,className:"pointer-events-auto",icon:e(o,{icon:i,size:s[M],className:"rtl:rotate-180"}),onClick:()=>O(F+1)})]}):null]}),N&&T>1?e("div",{className:`flex shrink-0 items-center justify-center pt-2 ${m[M].gap}`,children:S.map((r,t)=>e("button",{type:"button","aria-label":P(t+1,T),"aria-current":t===F?"true":void 0,className:["rounded-mp-full cursor-pointer appearance-none border-0 p-0","transition-[width,background-color] duration-(--mp-sys-motion-duration-short4)","ease-mp-standard motion-reduce:transition-none","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-2","focus-visible:outline-solid outline-none",t===F?`${m[M].current} bg-(--_mp-accent)`:`${m[M].rest} bg-mp-outline-variant hover:bg-mp-outline`].join(" "),onClick:()=>O(t)},t))}):null,e("span",{className:u,"aria-live":w?"off":"polite",children:T>0?P(F+1,T):""})]})});

package/dist/components/chat-bubble/MPChatBubble.js

@@ -1 +1 @@
-import{jsx as e,jsxs as n}from"react/jsx-runtime";import*as a from"react";import{MPIcon as r}from"../icon/MPIcon";import{CheckIcon as l,ClockIcon as t,ErrorIcon as i,LinkIcon as o}from"../../constants/icons";import{accentSlots as s}from"../../internal/accent";import{useMPLocale as c,useMPMessages as m}from"../../internal/locale";import{hasContent as d,META_TEXT as p,PROSE_TEXT as u}from"../../internal/scale";import{VISUALLY_HIDDEN as f}from"../../internal/visually-hidden";const h={xs:"px-2 py-1",sm:"px-2.5 py-1.5",md:"px-3 py-2",lg:"px-3.5 py-2.5",xl:"px-4 py-3"},b={start:"[border-start-start-radius:var(--mp-sys-shape-corner-extra-small)]",end:"[border-start-end-radius:var(--mp-sys-shape-corner-extra-small)]"},x={filled:"bg-(--_mp-accent) text-(--_mp-on-accent)",tonal:"bg-(--_mp-accent-container) text-(--_mp-on-accent-container)",elevated:"shadow-mp-1 bg-mp-surface-container-low text-mp-on-surface",outlined:"border-mp-outline-variant border bg-transparent text-mp-on-surface",text:"bg-mp-surface-container-low text-mp-on-surface"};function v(){return n("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",className:"size-full",children:[e("path",{d:"m1.5 8.5 2.75 2.75L9.5 6",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"}),e("path",{d:"M7 10.75 8.25 12l5.25-5.25",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"})]})}const g={sending:e(r,{icon:t,size:"1.15em"}),sent:e(r,{icon:l,size:"1.15em"}),delivered:e("span",{className:"block size-[1.15em]",children:e(v,{})}),read:e("span",{className:"block size-[1.15em]",children:e(v,{})}),failed:e(r,{icon:i,size:"1.15em"})},N={sending:"text-mp-on-surface-variant",sent:"text-mp-on-surface-variant",delivered:"text-mp-on-surface-variant",read:"text-(--_mp-accent)",failed:"text-mp-error"},w=["rounded-mp-sm block overflow-hidden border no-underline","[border-color:color-mix(in_oklab,currentColor_18%,transparent)]","[background-color:color-mix(in_oklab,currentColor_7%,transparent)]","hover:[background-color:color-mix(in_oklab,currentColor_12%,transparent)]","transition-[background-color] duration-(--mp-sys-motion-duration-short4) ease-mp-standard","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-2","focus-visible:outline-solid outline-none"].join(" "),y=["shrink-0 opacity-0","transition-opacity duration-(--mp-sys-motion-duration-short4) ease-mp-standard","group-hover/bubble:opacity-100 group-focus-within/bubble:opacity-100","[@media(hover:none)]:opacity-100"].join(" ");export const MPChatBubble=a.forwardRef(function({side:a="start",name:r,time:l,avatar:t,status:i,statusLabel:o,typing:v=!1,media:w,preview:j,actions:z,locale:C,variant:L="tonal",size:B="md",color:$="primary",className:M,style:P,children:W,...I},R){const T=c(C),q=m("chat",T),A="end"===a,D=d(r)||d(l),E=v||d(W)||Boolean(j);return n("div",{ref:R,"data-mp-size":B,"data-mp-variant":L,"data-mp-side":a,className:["mp-chat-bubble group/bubble flex w-full items-start gap-2",A?"flex-row-reverse":"",M??""].filter(Boolean).join(" "),style:{...s($),...P},...I,children:[d(t)?e("div",{className:"shrink-0",children:t}):null,n("div",{className:["flex min-w-0 max-w-[min(100%,32rem)] flex-col gap-1",A?"items-end":"items-start"].join(" "),children:[D?n("div",{className:`flex items-baseline gap-2 ${p}`,children:[d(r)?e("span",{className:"font-medium",children:r}):null,d(l)?e("span",{className:"text-mp-on-surface-variant",children:l}):null]}):null,n("div",{className:"flex min-w-0 items-center gap-1 "+(A?"flex-row-reverse":""),children:[n("div",{className:["mp-chat-bubble__sheet rounded-mp-xl flex min-w-0 flex-col overflow-hidden","box-border",b[a],x[L],u[B]].join(" "),children:[d(w)?e("div",{className:"[&_img]:block [&_img]:w-full [&_video]:block [&_video]:w-full",children:w}):null,E?n("div",{className:`flex min-w-0 flex-col gap-2 ${h[B]}`,children:[v?e(k,{label:q.typing}):d(W)?e("div",{className:"min-w-0 break-words whitespace-pre-line",children:W}):null,j?e(_,{preview:j}):null]}):null]}),d(z)?e("div",{className:y,children:z}):null]}),i?n("div",{className:`flex items-center gap-1 ${p} ${N[i]}`,children:[g[i],e("span",{className:f,children:o??q[i]})]}):null]})]})});function k({label:a}){return n("div",{className:"flex items-center gap-1 py-[0.35em]",role:"status",children:[[0,1,2].map(n=>e("span",{"aria-hidden":"true",className:"mp-chat-typing size-[0.45em] rounded-full bg-current",style:{"--_mp-index":n}},n)),e("span",{className:f,children:a})]})}function _({preview:a}){const{url:l,title:t,description:i,image:s,site:c,newTab:m=!1}=a;return n("a",{href:l,target:m?"_blank":void 0,rel:m?"noopener noreferrer":void 0,className:w,children:[s?e("img",{src:s,alt:"",className:"block h-28 w-full object-cover"}):null,n("div",{className:"flex flex-col gap-0.5 p-2",children:[d(c)?n("span",{className:"flex items-center gap-1 text-[0.85em] opacity-70",children:[e(r,{icon:o,size:"1em"}),e("span",{className:"truncate",children:c})]}):null,d(t)?e("span",{className:"font-medium",children:t}):null,d(i)?e("span",{className:"line-clamp-2 text-[0.9em] opacity-80",children:i}):null]})]})}
+import{jsx as e,jsxs as n}from"react/jsx-runtime";import*as a from"react";import{MPIcon as r}from"../icon/MPIcon";import{CheckIcon as l,ClockIcon as t,ErrorIcon as i,LinkIcon as o}from"../../constants/icons";import{accentSlots as s}from"../../internal/accent";import{useMPLocale as c,useMPMessages as m}from"../../internal/locale";import{hasContent as d,META_TEXT as p,PROSE_TEXT as u}from"../../internal/scale";import{VISUALLY_HIDDEN as f}from"../../internal/visually-hidden";const h={xs:"px-2 py-1",sm:"px-2.5 py-1.5",md:"px-3 py-2",lg:"px-3.5 py-2.5",xl:"px-4 py-3"},b={start:"[border-start-start-radius:var(--mp-sys-shape-corner-extra-small)]",end:"[border-start-end-radius:var(--mp-sys-shape-corner-extra-small)]"},x={filled:"bg-(--_mp-accent) text-(--_mp-on-accent)",tonal:"bg-(--_mp-accent-container) text-(--_mp-on-accent-container)",elevated:"shadow-mp-1 bg-mp-surface-container-low text-mp-on-surface",outlined:"border-mp-outline-variant border bg-transparent text-mp-on-surface",text:"bg-mp-surface-container-low text-mp-on-surface"};function v(){return n("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",className:"size-full",children:[e("path",{d:"m1.5 8.5 2.75 2.75L9.5 6",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"}),e("path",{d:"M7 10.75 8.25 12l5.25-5.25",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"})]})}const g={sending:e(r,{icon:t,size:"1.15em"}),sent:e(r,{icon:l,size:"1.15em"}),delivered:e("span",{className:"block size-[1.15em]",children:e(v,{})}),read:e("span",{className:"block size-[1.15em]",children:e(v,{})}),failed:e(r,{icon:i,size:"1.15em"})},N={sending:"text-mp-on-surface-variant",sent:"text-mp-on-surface-variant",delivered:"text-mp-on-surface-variant",read:"text-(--_mp-accent)",failed:"text-mp-error"},w=["rounded-mp-sm block overflow-hidden border no-underline","[border-color:color-mix(in_oklab,currentColor_18%,transparent)]","[background-color:color-mix(in_oklab,currentColor_7%,transparent)]","hover:[background-color:color-mix(in_oklab,currentColor_12%,transparent)]","transition-[background-color] duration-(--mp-sys-motion-duration-short4) ease-mp-standard","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-2","focus-visible:outline-solid outline-none"].join(" "),y=["shrink-0 opacity-0","transition-opacity duration-(--mp-sys-motion-duration-short4) ease-mp-standard","group-hover/bubble:opacity-100 group-focus-within/bubble:opacity-100","[@media(hover:none)]:opacity-100"].join(" ");export const MPChatBubble=/*@__PURE__*/a.forwardRef(function({side:a="start",name:r,time:l,avatar:t,status:i,statusLabel:o,typing:v=!1,media:w,preview:j,actions:z,locale:C,variant:L="tonal",size:B="md",color:$="primary",className:M,style:P,children:W,...I},R){const T=c(C),q=m("chat",T),A="end"===a,D=d(r)||d(l),E=v||d(W)||Boolean(j);return n("div",{ref:R,"data-mp-size":B,"data-mp-variant":L,"data-mp-side":a,className:["mp-chat-bubble group/bubble flex w-full items-start gap-2",A?"flex-row-reverse":"",M??""].filter(Boolean).join(" "),style:{...s($),...P},...I,children:[d(t)?e("div",{className:"shrink-0",children:t}):null,n("div",{className:["flex min-w-0 max-w-[min(100%,32rem)] flex-col gap-1",A?"items-end":"items-start"].join(" "),children:[D?n("div",{className:`flex items-baseline gap-2 ${p}`,children:[d(r)?e("span",{className:"font-medium",children:r}):null,d(l)?e("span",{className:"text-mp-on-surface-variant",children:l}):null]}):null,n("div",{className:"flex min-w-0 items-center gap-1 "+(A?"flex-row-reverse":""),children:[n("div",{className:["mp-chat-bubble__sheet rounded-mp-xl flex min-w-0 flex-col overflow-hidden","box-border",b[a],x[L],u[B]].join(" "),children:[d(w)?e("div",{className:"[&_img]:block [&_img]:w-full [&_video]:block [&_video]:w-full",children:w}):null,E?n("div",{className:`flex min-w-0 flex-col gap-2 ${h[B]}`,children:[v?e(k,{label:q.typing}):d(W)?e("div",{className:"min-w-0 break-words whitespace-pre-line",children:W}):null,j?e(_,{preview:j}):null]}):null]}),d(z)?e("div",{className:y,children:z}):null]}),i?n("div",{className:`flex items-center gap-1 ${p} ${N[i]}`,children:[g[i],e("span",{className:f,children:o??q[i]})]}):null]})]})});function k({label:a}){return n("div",{className:"flex items-center gap-1 py-[0.35em]",role:"status",children:[[0,1,2].map(n=>e("span",{"aria-hidden":"true",className:"mp-chat-typing size-[0.45em] rounded-full bg-current",style:{"--_mp-index":n}},n)),e("span",{className:f,children:a})]})}function _({preview:a}){const{url:l,title:t,description:i,image:s,site:c,newTab:m=!1}=a;return n("a",{href:l,target:m?"_blank":void 0,rel:m?"noopener noreferrer":void 0,className:w,children:[s?e("img",{src:s,alt:"",className:"block h-28 w-full object-cover"}):null,n("div",{className:"flex flex-col gap-0.5 p-2",children:[d(c)?n("span",{className:"flex items-center gap-1 text-[0.85em] opacity-70",children:[e(r,{icon:o,size:"1em"}),e("span",{className:"truncate",children:c})]}):null,d(t)?e("span",{className:"font-medium",children:t}):null,d(i)?e("span",{className:"line-clamp-2 text-[0.9em] opacity-80",children:i}):null]})]})}

package/dist/components/checkbox/MPCheckbox.js

@@ -1 +1 @@
-import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as a from"react";import{Checkbox as t}from"@base-ui/react/checkbox";import{Field as n}from"@base-ui/react/field";import{MPIcon as o}from"../icon/MPIcon";import{CheckIcon as i,RemoveIcon as c}from"../../constants/icons";import{accentSlots as s}from"../../internal/accent";import{MPStateLayer as d}from"../../internal/StateLayer";import{MPSupportingText as l}from"../../internal/SupportingText";import{PROSE_TEXT as m,hasContent as p}from"../../internal/scale";const h={xs:{box:"size-3.5",halo:"size-8",glyph:12},sm:{box:"size-4",halo:"size-9",glyph:14},md:{box:"size-[18px]",halo:"size-10",glyph:16},lg:{box:"size-5",halo:"size-11",glyph:18},xl:{box:"size-[22px]",halo:"size-12",glyph:20}};export const MPCheckbox=a.forwardRef(function({checked:u,defaultChecked:f,onCheckedChange:b,indeterminate:x=!1,label:g,description:k,errorMessage:y,size:z="md",color:j="primary",required:_=!1,disabled:v=!1,readOnly:C=!1,name:N,value:M,id:I},R){const q=p(y),w=q?"error":j,L=h[z],O=a.useId(),P=I??O;return e(n.Root,{className:"mp-checkbox inline-block align-top",disabled:v,invalid:q,"data-mp-size":z,style:s(w),children:r("div",{className:["flex items-start gap-3",m[z]].join(" "),children:[e("span",{className:"flex h-[1lh] shrink-0 items-center",children:r(t.Root,{ref:R,id:P,name:N,value:M,checked:u,defaultChecked:f,indeterminate:x,required:_,disabled:v,readOnly:C,onCheckedChange:e=>b?.(e),className:["mp-checkbox__tick group relative inline-flex shrink-0 items-center","box-border justify-center border-2 p-0","rounded-[calc(var(--mp-sys-shape-corner-extra-small)/2)]","appearance-none bg-transparent font-[inherit] outline-none","transition-[background-color,border-color]","duration-(--mp-sys-motion-duration-short4)",L.box,v?["border-mp-on-surface/38 cursor-default","data-checked:bg-mp-on-surface/38 data-checked:border-transparent","data-indeterminate:bg-mp-on-surface/38 data-indeterminate:border-transparent"].join(" "):[C?"cursor-default":"cursor-pointer",q?"border-mp-error":"border-mp-on-surface-variant","data-checked:border-transparent data-checked:bg-(--_mp-accent)","data-checked:text-(--_mp-on-accent)","data-indeterminate:border-transparent data-indeterminate:bg-(--_mp-accent)","data-indeterminate:text-(--_mp-on-accent)"].join(" ")].join(" "),children:[v?null:e(d,{layer:["top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 rounded-full",L.halo,"bg-mp-on-surface","group-data-checked:bg-(--_mp-accent)","group-data-indeterminate:bg-(--_mp-accent)"].join(" ")}),e(t.Indicator,{className:"flex items-center justify-center",children:e(o,{icon:x?c:i,size:L.glyph,strokeWidth:3})})]})}),p(g)||p(k)||q?r("span",{className:"flex min-w-0 flex-col gap-0.5",children:[p(g)?r(n.Label,{htmlFor:P,className:["leading-[1.4]",v?"text-mp-on-surface/38 cursor-default":C?"text-mp-on-surface":"text-mp-on-surface cursor-pointer"].join(" "),children:[g,_?e("span",{"aria-hidden":"true",children:" *"}):null]}):null,e(l,{description:k,errorMessage:y})]}):null]})})});
+import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as r from"react";import{Checkbox as t}from"@base-ui/react/checkbox";import{Field as n}from"@base-ui/react/field";import{MPIcon as o}from"../icon/MPIcon";import{CheckIcon as i,RemoveIcon as s}from"../../constants/icons";import{accentSlots as c}from"../../internal/accent";import{MPStateLayer as d}from"../../internal/StateLayer";import{MPSupportingText as l}from"../../internal/SupportingText";import{PROSE_TEXT as m,hasContent as p}from"../../internal/scale";const h={xs:{box:"size-3.5",halo:"size-8",glyph:12},sm:{box:"size-4",halo:"size-9",glyph:14},md:{box:"size-[18px]",halo:"size-10",glyph:16},lg:{box:"size-5",halo:"size-11",glyph:18},xl:{box:"size-[22px]",halo:"size-12",glyph:20}};export const MPCheckbox=/*@__PURE__*/r.forwardRef(function({checked:u,defaultChecked:f,onCheckedChange:b,indeterminate:x=!1,label:g,description:y,errorMessage:k,size:z="md",color:j="primary",required:_=!1,disabled:v=!1,readOnly:C=!1,name:N,value:M,id:I},R){const q=p(k),w=q?"error":j,L=h[z],O=r.useId(),P=I??O;return e(n.Root,{className:"mp-checkbox inline-block align-top",disabled:v,invalid:q,"data-mp-size":z,style:c(w),children:a("div",{className:["flex items-start gap-3",m[z]].join(" "),children:[e("span",{className:"flex h-[1lh] shrink-0 items-center",children:a(t.Root,{ref:R,id:P,name:N,value:M,checked:u,defaultChecked:f,indeterminate:x,required:_,disabled:v,readOnly:C,onCheckedChange:e=>b?.(e),className:["mp-checkbox__tick group relative inline-flex shrink-0 items-center","box-border justify-center border-2 p-0","rounded-[calc(var(--mp-sys-shape-corner-extra-small)/2)]","appearance-none bg-transparent font-[inherit] outline-none","transition-[background-color,border-color]","duration-(--mp-sys-motion-duration-short4)",L.box,v?["border-mp-on-surface/38 cursor-default","data-checked:bg-mp-on-surface/38 data-checked:border-transparent","data-indeterminate:bg-mp-on-surface/38 data-indeterminate:border-transparent"].join(" "):[C?"cursor-default":"cursor-pointer",q?"border-mp-error":"border-mp-on-surface-variant","data-checked:border-transparent data-checked:bg-(--_mp-accent)","data-checked:text-(--_mp-on-accent)","data-indeterminate:border-transparent data-indeterminate:bg-(--_mp-accent)","data-indeterminate:text-(--_mp-on-accent)"].join(" ")].join(" "),children:[v?null:e(d,{layer:["top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 rounded-full",L.halo,"bg-mp-on-surface","group-data-checked:bg-(--_mp-accent)","group-data-indeterminate:bg-(--_mp-accent)"].join(" ")}),e(t.Indicator,{className:["flex items-center justify-center","transition-[opacity,scale] duration-(--mp-sys-motion-duration-short4)","ease-mp-standard","data-starting-style:scale-60 data-starting-style:opacity-0","data-ending-style:scale-60 data-ending-style:opacity-0"].join(" "),children:e(o,{icon:x?s:i,size:L.glyph,strokeWidth:3})})]})}),p(g)||p(y)||q?a("span",{className:"flex min-w-0 flex-col gap-0.5",children:[p(g)?a(n.Label,{htmlFor:P,className:["leading-[1.4]",v?"text-mp-on-surface/38 cursor-default":C?"text-mp-on-surface":"text-mp-on-surface cursor-pointer"].join(" "),children:[g,_?e("span",{"aria-hidden":"true",children:" *"}):null]}):null,e(l,{description:y,errorMessage:k})]}):null]})})});

package/dist/components/chip/MPChip.js

@@ -1 +1 @@
-import{jsx as e,Fragment as t,jsxs as n}from"react/jsx-runtime";import*as o from"react";import{MPIcon as a}from"../icon/MPIcon";import{CloseIcon as r}from"../../constants/icons";import{accentSlots as i}from"../../internal/accent";import{useMPLocale as l,useMPMessages as c}from"../../internal/locale";import{hasContent as s}from"../../internal/scale";import{MPStateLayer as m}from"../../internal/StateLayer";const p={xs:"h-6",sm:"h-7",md:"h-8",lg:"h-10",xl:"h-12"},d={xs:"text-mp-label-medium",sm:"text-mp-label-medium",md:"text-mp-label-large",lg:"text-mp-label-large",xl:"text-mp-title-medium"},u={xs:"px-2",sm:"px-3",md:"px-4",lg:"px-5",xl:"px-6"},f={xs:"gap-1",sm:"gap-1.5",md:"gap-2",lg:"gap-2",xl:"gap-2.5"},x={xs:"rounded-mp-xs",sm:"rounded-mp-sm",md:"rounded-mp-sm",lg:"rounded-mp-sm",xl:"rounded-mp-md"},b={filled:"bg-(--_mp-accent) text-(--_mp-on-accent)",tonal:"bg-(--_mp-accent-container) text-(--_mp-on-accent-container)",elevated:"shadow-mp-1 bg-mp-surface-container-low text-mp-on-surface-variant",outlined:"border-mp-outline text-mp-on-surface-variant border bg-transparent",text:"text-mp-on-surface-variant bg-transparent"},g={filled:"bg-(--_mp-accent) text-(--_mp-on-accent)",tonal:"bg-(--_mp-accent-container) text-(--_mp-on-accent-container)",elevated:"shadow-mp-1 bg-(--_mp-accent-container) text-(--_mp-on-accent-container)",outlined:"border-mp-outline bg-(--_mp-accent-container) text-(--_mp-on-accent-container) border",text:"bg-(--_mp-accent-container) text-(--_mp-on-accent-container)"},h={filled:"bg-mp-on-surface/12 text-mp-on-surface/38",tonal:"bg-mp-on-surface/12 text-mp-on-surface/38",elevated:"bg-mp-on-surface/12 text-mp-on-surface/38 shadow-none",outlined:"border-mp-on-surface/12 text-mp-on-surface/38 border bg-transparent",text:"bg-transparent text-mp-on-surface/38"},v=["ms-0.5 -me-1 inline-flex shrink-0 cursor-pointer items-center justify-center","rounded-mp-full size-[1.35em] opacity-70","transition-opacity duration-(--mp-sys-motion-duration-short4)","hover:opacity-100 focus-visible:opacity-100","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-1","focus-visible:outline-solid outline-none","disabled:cursor-default disabled:opacity-38"].join(" "),y=["group relative flex min-w-0 flex-1 cursor-pointer items-center justify-center","self-stretch rounded-[inherit] font-[inherit] text-[inherit]","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(" ");export const MPChip=o.forwardRef(function({variant:o="outlined",size:_="md",color:w="primary",startIcon:j,endIcon:k,count:N,onDelete:z,deleteLabel:C,locale:I,selected:$,disabled:B=!1,className:L,style:M,children:P,onClick:D,...F},R){const S=l(I),q=c("common",S),A=Boolean(D)&&!B,E=["mp-chip relative inline-flex max-w-full shrink-0 items-center","box-border overflow-hidden align-middle leading-none whitespace-nowrap select-none","transition-[background-color,border-color,box-shadow,color]","duration-(--mp-sys-motion-duration-short4)",p[_],d[_],f[_],x[_],B?h[o]:$?g[o]:b[o],A?"ps-0":u[_],z?"pe-2":A?"pe-0":"",L??""].filter(Boolean).join(" "),G=n(t,{children:[j,s(P)?e("span",{className:"min-w-0 truncate",children:P}):null,k,s(N)?e("span",{className:["rounded-mp-full ms-0.5 inline-flex shrink-0 items-center justify-center px-1.5 py-px","text-[0.85em] leading-none font-medium tabular-nums","filled"===o?"bg-(--_mp-on-accent)/20 text-(--_mp-on-accent)":"bg-(--_mp-accent-container) text-(--_mp-on-accent-container)"].join(" "),children:N}):null]});return n("span",{ref:R,"data-mp-size":_,"data-mp-variant":o,"data-selected":$||void 0,className:E,style:{...i(w),...M},"aria-disabled":!(!B||A)||void 0,...F,children:[A?n("button",{type:"button","aria-pressed":$,className:`${y} ${f[_]} ${u[_]}`,onClick:D,children:[e(m,{}),G]}):G,z?e("button",{type:"button","aria-label":C??q.remove,disabled:B,className:v,onClick:z,children:e(a,{icon:r,size:"1em"})}):null]})});
+import{jsx as e,Fragment as t,jsxs as n}from"react/jsx-runtime";import*as o from"react";import{MPIcon as a}from"../icon/MPIcon";import{CloseIcon as r}from"../../constants/icons";import{accentSlots as i}from"../../internal/accent";import{useMPLocale as l,useMPMessages as c}from"../../internal/locale";import{hasContent as s}from"../../internal/scale";import{MPStateLayer as m}from"../../internal/StateLayer";const p={xs:"h-6",sm:"h-7",md:"h-8",lg:"h-10",xl:"h-12"},d={xs:"text-mp-label-medium",sm:"text-mp-label-medium",md:"text-mp-label-large",lg:"text-mp-label-large",xl:"text-mp-title-medium"},u={xs:"px-2",sm:"px-3",md:"px-4",lg:"px-5",xl:"px-6"},f={xs:"gap-1",sm:"gap-1.5",md:"gap-2",lg:"gap-2",xl:"gap-2.5"},x={xs:"rounded-mp-xs",sm:"rounded-mp-sm",md:"rounded-mp-sm",lg:"rounded-mp-sm",xl:"rounded-mp-md"},b={filled:"bg-(--_mp-accent) text-(--_mp-on-accent)",tonal:"bg-(--_mp-accent-container) text-(--_mp-on-accent-container)",elevated:"shadow-mp-1 bg-mp-surface-container-low text-mp-on-surface-variant",outlined:"border-mp-outline text-mp-on-surface-variant border bg-transparent",text:"text-mp-on-surface-variant bg-transparent"},g={filled:"bg-(--_mp-accent) text-(--_mp-on-accent)",tonal:"bg-(--_mp-accent-container) text-(--_mp-on-accent-container)",elevated:"shadow-mp-1 bg-(--_mp-accent-container) text-(--_mp-on-accent-container)",outlined:"border-mp-outline bg-(--_mp-accent-container) text-(--_mp-on-accent-container) border",text:"bg-(--_mp-accent-container) text-(--_mp-on-accent-container)"},h={filled:"bg-mp-on-surface/12 text-mp-on-surface/38",tonal:"bg-mp-on-surface/12 text-mp-on-surface/38",elevated:"bg-mp-on-surface/12 text-mp-on-surface/38 shadow-none",outlined:"border-mp-on-surface/12 text-mp-on-surface/38 border bg-transparent",text:"bg-transparent text-mp-on-surface/38"},v=["ms-0.5 -me-1 inline-flex shrink-0 cursor-pointer items-center justify-center","rounded-mp-full size-[1.35em] opacity-70","transition-opacity duration-(--mp-sys-motion-duration-short4)","hover:opacity-100 focus-visible:opacity-100","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-1","focus-visible:outline-solid outline-none","disabled:cursor-default disabled:opacity-38"].join(" "),y=["group relative flex min-w-0 flex-1 cursor-pointer items-center justify-center","self-stretch rounded-[inherit] font-[inherit] text-[inherit]","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(" ");export const MPChip=/*@__PURE__*/o.forwardRef(function({variant:o="outlined",size:_="md",color:w="primary",startIcon:j,endIcon:k,count:N,onDelete:z,deleteLabel:C,locale:I,selected:$,disabled:B=!1,className:L,style:M,children:P,onClick:D,...F},R){const S=l(I),q=c("common",S),A=Boolean(D)&&!B,E=["mp-chip relative inline-flex max-w-full shrink-0 items-center","box-border overflow-hidden align-middle leading-none whitespace-nowrap select-none","transition-[background-color,border-color,box-shadow,color]","duration-(--mp-sys-motion-duration-short4)",p[_],d[_],f[_],x[_],B?h[o]:$?g[o]:b[o],A?"ps-0":u[_],z?"pe-2":A?"pe-0":"",L??""].filter(Boolean).join(" "),G=n(t,{children:[j,s(P)?e("span",{className:"min-w-0 truncate",children:P}):null,k,s(N)?e("span",{className:["rounded-mp-full ms-0.5 inline-flex shrink-0 items-center justify-center px-1.5 py-px","text-[0.85em] leading-none font-medium tabular-nums","filled"===o?"bg-(--_mp-on-accent)/20 text-(--_mp-on-accent)":"bg-(--_mp-accent-container) text-(--_mp-on-accent-container)"].join(" "),children:N}):null]});return n("span",{ref:R,"data-mp-size":_,"data-mp-variant":o,"data-selected":$||void 0,className:E,style:{...i(w),...M},"aria-disabled":!(!B||A)||void 0,...F,children:[A?n("button",{type:"button","aria-pressed":$,className:`${y} ${f[_]} ${u[_]}`,onClick:D,children:[e(m,{}),G]}):G,z?e("button",{type:"button","aria-label":C??q.remove,disabled:B,className:v,onClick:z,children:e(a,{icon:r,size:"1em"})}):null]})});

package/dist/components/collapsible/MPCollapsible.js

@@ -1 +1 @@
-import{jsx as e,jsxs as n}from"react/jsx-runtime";import*as t from"react";import{Collapsible as a}from"@base-ui/react/collapsible";import{MPIcon as i}from"../icon/MPIcon";import{ChevronDownIcon as r}from"../../constants/icons";import{MPStateLayer as o}from"../../internal/StateLayer";import{CONTROL_GAP as s,CONTROL_ICON as l,hasContent as c,META_TEXT as d,PROSE_TEXT as m,SHEET_PAD_X as p,SHEET_PAD_Y as u,SHEET_TITLE as f}from"../../internal/scale";import{CONTAINER_SURFACE as h}from"../../internal/surface";const x=["h-(--collapsible-panel-height) overflow-hidden","transition-[height] duration-(--mp-sys-motion-duration-short4) ease-mp-standard","motion-reduce:transition-none","data-starting-style:h-0 data-ending-style:h-0"].join(" "),b={xs:"pb-2.5",sm:"pb-3",md:"pb-4",lg:"pb-5",xl:"pb-6"};export const MPCollapsible=t.forwardRef(function({open:t,defaultOpen:g=!1,onOpenChange:v,title:N,subtitle:j,startIcon:w,action:y,trigger:k,indicator:M=!0,disabled:O=!1,padded:z=!0,variant:C="outlined",size:P="md",hiddenUntilFound:$=!1,keepMounted:B=!1,className:F,children:I,...R},T){const U=p[P],L=u[P];return n(a.Root,{ref:T,open:t,defaultOpen:g,onOpenChange:e=>v?.(e),disabled:O,"data-mp-size":P,"data-mp-variant":C,className:["mp-collapsible rounded-mp-md flex w-full flex-col overflow-hidden",h[C],"text-mp-on-surface",F??""].filter(Boolean).join(" "),...R,children:[k?e(a.Trigger,{render:k}):n("div",{className:"flex w-full items-center",children:[n(a.Trigger,{className:["group relative flex min-w-0 flex-1 cursor-pointer items-center text-start","appearance-none border-0 bg-transparent font-[inherit] text-inherit",U,L,s[P],"outline-mp-secondary focus-visible:outline-2 focus-visible:-outline-offset-2","focus-visible:outline-solid outline-none","disabled:text-mp-on-surface/38 disabled:cursor-default"].join(" "),children:[e(o,{}),c(w)?e("span",{className:"text-mp-on-surface-variant flex h-[1lh] shrink-0 items-center",children:w}):null,n("span",{className:"flex min-w-0 flex-1 flex-col",children:[c(N)?e("span",{className:`truncate ${f[P]}`,children:N}):null,c(j)?e("span",{className:`text-mp-on-surface-variant truncate ${d}`,children:j}):null]}),M?e("span",{className:["text-mp-on-surface-variant flex h-[1lh] shrink-0 items-center","transition-[rotate] duration-(--mp-sys-motion-duration-short4)","ease-mp-standard motion-reduce:transition-none","group-data-panel-open:rotate-180"].join(" "),children:e(i,{icon:r,size:l[P]})}):null]}),c(y)?e("span",{className:`flex shrink-0 items-center ${U}`,children:y}):null]}),e(a.Panel,{hiddenUntilFound:$,keepMounted:B,className:x,children:e("div",{className:["min-w-0",m[P],"text-mp-on-surface-variant",z?U:"",z?k?L:b[P]:""].filter(Boolean).join(" "),children:I})})]})});
+import{jsx as e,jsxs as n}from"react/jsx-runtime";import*as t from"react";import{Collapsible as a}from"@base-ui/react/collapsible";import{MPIcon as i}from"../icon/MPIcon";import{ChevronDownIcon as r}from"../../constants/icons";import{MPStateLayer as o}from"../../internal/StateLayer";import{CONTROL_GAP as s,CONTROL_ICON as l,hasContent as c,META_TEXT as d,PROSE_TEXT as m,SHEET_PAD_X as p,SHEET_PAD_Y as u,SHEET_TITLE as f}from"../../internal/scale";import{CONTAINER_SURFACE as h}from"../../internal/surface";const x=["h-(--collapsible-panel-height) overflow-hidden","transition-[height] duration-(--mp-sys-motion-duration-short4) ease-mp-standard","motion-reduce:transition-none","data-starting-style:h-0 data-ending-style:h-0"].join(" "),b={xs:"pb-2.5",sm:"pb-3",md:"pb-4",lg:"pb-5",xl:"pb-6"};export const MPCollapsible=/*@__PURE__*/t.forwardRef(function({open:t,defaultOpen:g=!1,onOpenChange:v,title:N,subtitle:j,startIcon:w,action:y,trigger:k,indicator:M=!0,disabled:O=!1,padded:z=!0,variant:C="outlined",size:P="md",hiddenUntilFound:$=!1,keepMounted:B=!1,className:F,children:I,...R},T){const U=p[P],L=u[P];return n(a.Root,{ref:T,open:t,defaultOpen:g,onOpenChange:e=>v?.(e),disabled:O,"data-mp-size":P,"data-mp-variant":C,className:["mp-collapsible rounded-mp-md flex w-full flex-col overflow-hidden",h[C],"text-mp-on-surface",F??""].filter(Boolean).join(" "),...R,children:[k?e(a.Trigger,{render:k}):n("div",{className:"flex w-full items-center",children:[n(a.Trigger,{className:["group relative flex min-w-0 flex-1 cursor-pointer items-center text-start","appearance-none border-0 bg-transparent font-[inherit] text-inherit",U,L,s[P],"outline-mp-secondary focus-visible:outline-2 focus-visible:-outline-offset-2","focus-visible:outline-solid outline-none","disabled:text-mp-on-surface/38 disabled:cursor-default"].join(" "),children:[e(o,{}),c(w)?e("span",{className:"text-mp-on-surface-variant flex h-[1lh] shrink-0 items-center",children:w}):null,n("span",{className:"flex min-w-0 flex-1 flex-col",children:[c(N)?e("span",{className:`truncate ${f[P]}`,children:N}):null,c(j)?e("span",{className:`text-mp-on-surface-variant truncate ${d}`,children:j}):null]}),M?e("span",{className:["text-mp-on-surface-variant flex h-[1lh] shrink-0 items-center","transition-[rotate] duration-(--mp-sys-motion-duration-short4)","ease-mp-standard motion-reduce:transition-none","group-data-panel-open:rotate-180"].join(" "),children:e(i,{icon:r,size:l[P]})}):null]}),c(y)?e("span",{className:`flex shrink-0 items-center ${U}`,children:y}):null]}),e(a.Panel,{hiddenUntilFound:$,keepMounted:B,className:x,children:e("div",{className:["min-w-0",m[P],"text-mp-on-surface-variant",z?U:"",z?k?L:b[P]:""].filter(Boolean).join(" "),children:I})})]})});

package/dist/components/color-picker/MPColorPicker.js

@@ -1 +1 @@
-import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as r from"react";import{Field as n}from"@base-ui/react/field";import{Popover as l}from"@base-ui/react/popover";import{MPIcon as t}from"../icon/MPIcon";import{CheckIcon as o,CloseIcon as i}from"../../constants/icons";import{MPFieldLabel as s,MPFieldOutline as u,useFloatingLabel as c}from"../../internal/FieldOutline";import{MPStateLayer as d}from"../../internal/StateLayer";import{MPSupportingText as h}from"../../internal/SupportingText";import{CONTROL_ICON as p,META_TEXT as f,PROSE_TEXT as m,STACK_GAP as g,hasContent as v}from"../../internal/scale";import{FADE as b,PORTAL_LAYER as x}from"../../internal/surface";import{CHECKER_BACKGROUND as y,DEFAULT_SWATCHES as w,clamp as N,cssColor as k,formatColor as C,parseColor as j,readableInk as _}from"../../internal/color";const z={area:"Saturation and brightness",hue:"Hue",alpha:"Opacity",value:"Colour value",swatches:"Swatches",clear:"Clear",empty:"No colour"},P={xs:"w-40",sm:"w-44",md:"w-52",lg:"w-60",xl:"w-72"},$={xs:"h-24",sm:"h-28",md:"h-32",lg:"h-40",xl:"h-48"},M={xs:"h-2.5",sm:"h-3",md:"h-3.5",lg:"h-4",xl:"h-5"},T={xs:"gap-2",sm:"gap-2.5",md:"gap-3",lg:"gap-3.5",xl:"gap-4"},I={xs:12,sm:14,md:16,lg:18,xl:20},O={xs:{padding:"px-2",height:"h-8"},sm:{padding:"px-3",height:"h-10"},md:{padding:"px-4",height:"h-14"},lg:{padding:"px-4",height:"h-16"},xl:{padding:"px-5",height:"h-18"}},S="border-mp-outline-variant relative overflow-hidden border",A=["pointer-events-none absolute rounded-full border-2 border-white","[box-shadow:0_0_0_1px_rgb(0_0_0/0.35),0_1px_3px_rgb(0_0_0/0.4)]"].join(" ");function B(e,a,r){return{x:0===e.width?0:N((a-e.left)/e.width,0,1),y:0===e.height?0:N((r-e.top)/e.height,0,1)}}function D(e){const a=e.shiftKey?10:1;switch(e.key){case"ArrowLeft":return{x:-a,y:0};case"ArrowRight":return{x:a,y:0};case"ArrowUp":return{x:0,y:a};case"ArrowDown":return{x:0,y:-a};default:return null}}function L({hsv:n,alphaValue:l,onChange:i,text:s,onTextChange:u,withAlpha:c,swatches:d,editable:h,size:p,inert:m,labels:g}){const v=I[p],b=-v/2,x=k({h:n.h,s:100,v:100}),w=k(n),z=r.useRef(null),O=e=>({onPointerDown:a=>{if(m)return;const r=a.currentTarget.getBoundingClientRect();z.current=r,a.currentTarget.setPointerCapture(a.pointerId),e(B(r,a.clientX,a.clientY))},onPointerMove:a=>{const r=z.current;!m&&r&&a.currentTarget.hasPointerCapture(a.pointerId)&&e(B(r,a.clientX,a.clientY))},onPointerUp:()=>{z.current=null},onPointerCancel:()=>{z.current=null}}),L=(e,a,r,n)=>({role:"slider",tabIndex:m?-1:0,"aria-label":e,"aria-valuemin":0,"aria-valuemax":r,"aria-valuenow":Math.round(a),"aria-orientation":"horizontal","aria-disabled":m||void 0,onKeyDown:e=>{const a=D(e);!m&&a&&0!==a.x&&(e.preventDefault(),n(a.x))}}),R=["outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-2","focus-visible:outline-solid outline-none"].join(" "),q=r.useMemo(()=>d?d.map(e=>{const a=j(e);return{swatch:e,parsed:a,hex:null===a?null:C(a.hsv,a.alpha,"hex")}}):[],[d]),V=C(n,l,"hex");return a("div",{className:`mp-color-picker__panel flex flex-col ${P[p]} ${T[p]}`,children:[e("div",{...O(({x:e,y:a})=>i({hsv:{h:n.h,s:100*e,v:100*(1-a)},alpha:l})),role:"slider",tabIndex:m?-1:0,"aria-label":g.area,"aria-valuemin":0,"aria-valuemax":100,"aria-valuenow":Math.round(n.s),"aria-valuetext":`${Math.round(n.s)}%, ${Math.round(n.v)}%`,"aria-disabled":m||void 0,onKeyDown:e=>{const a=D(e);!m&&a&&(e.preventDefault(),i({hsv:{h:n.h,s:N(n.s+a.x,0,100),v:N(n.v+a.y,0,100)},alpha:l}))},className:[S,"rounded-mp-sm",$[p],R,m?"cursor-default":"cursor-crosshair touch-none"].join(" "),style:{backgroundColor:x,backgroundImage:"linear-gradient(to top, #000000, rgb(0 0 0 / 0)), linear-gradient(to right, #ffffff, rgb(255 255 255 / 0))"},children:e("span",{className:A,style:{width:v,height:v,left:`${n.s}%`,top:100-n.v+"%",marginLeft:b,marginTop:b,backgroundColor:w}})}),e("div",{...O(({x:e})=>i({hsv:{...n,h:360*e},alpha:l})),...L(g.hue,n.h,360,e=>i({hsv:{...n,h:(n.h+2*e+360)%360},alpha:l})),className:[S,"rounded-mp-full",M[p],R,m?"cursor-default":"cursor-pointer touch-none"].join(" "),style:{backgroundImage:"linear-gradient(to right, #ff0000 0%, #ffff00 16.66%, #00ff00 33.33%, #00ffff 50%, #0000ff 66.66%, #ff00ff 83.33%, #ff0000 100%)"},children:e("span",{className:A,style:{width:v,height:v,left:n.h/360*100+"%",top:"50%",marginLeft:b,marginTop:b,backgroundColor:x}})}),c?a("div",{...O(({x:e})=>i({hsv:n,alpha:e})),...L(g.alpha,100*l,100,e=>i({hsv:n,alpha:N(l+e/100,0,1)})),className:[S,"rounded-mp-full",M[p],R,m?"cursor-default":"cursor-pointer touch-none"].join(" "),style:y,children:[e("span",{"aria-hidden":"true",className:"absolute inset-0",style:{backgroundImage:`linear-gradient(to right, ${k(n,0)}, ${w})`}}),e("span",{className:A,style:{width:v,height:v,left:100*l+"%",top:"50%",marginLeft:b,marginTop:b,backgroundColor:k(n,l)}})]}):null,h?a("div",{className:`flex items-center ${T[p]}`,children:[e("span",{"aria-hidden":"true",className:"border-mp-outline-variant shrink-0 rounded-full border",style:{width:v+8,height:v+8,...y},children:e("span",{className:"block size-full rounded-full",style:{backgroundColor:k(n,l)}})}),e("input",{type:"text",value:s,readOnly:m,spellCheck:!1,autoComplete:"off","aria-label":g.value,onChange:e=>u(e.target.value),className:["rounded-mp-xs border-mp-outline text-mp-on-surface min-w-0 flex-1 border","bg-transparent px-2 py-1 font-mono lowercase",f,"focus-visible:border-mp-primary outline-none"].join(" ")})]}):null,q.length>0?e("div",{role:"group","aria-label":g.swatches,className:"grid grid-cols-8 gap-1",children:q.map(({swatch:a,parsed:r,hex:n},l)=>{const s=null!==r&&n===V;return e("button",{type:"button",disabled:m,"aria-label":a,"aria-pressed":s,onClick:()=>{r&&i({hsv:r.hsv,alpha:r.alpha})},className:["border-mp-outline-variant flex aspect-square items-center justify-center","rounded-full border",R,m?"cursor-default":"hover:shadow-mp-1 cursor-pointer"].join(" "),style:{backgroundColor:a},children:s&&r?e("span",{style:{color:_(r.hsv)},children:e(t,{icon:o,size:12})}):null},`${l}:${a}`)})}):null]})}const R={h:202,s:100,v:61};export const MPColorPicker=r.forwardRef(function({value:o,defaultValue:N="#00639b",onValueChange:_,format:P="hex",alpha:$=!1,swatches:M=w,inline:T=!1,editable:I=!0,label:S,floatingLabel:A=!0,description:B,errorMessage:D,required:q=!1,disabled:V=!1,readOnly:K=!1,clearable:F=!1,name:U,open:X,defaultOpen:Y=!1,onOpenChange:E,labels:H,size:W="md",fullWidth:G=!1,id:J,className:Q,style:Z},ee){const ae=r.useMemo(()=>({...z,...H}),[H]),re=v(D),ne=O[W],le=r.useId(),te=J??le,[oe,ie]=r.useState(N),se=o??oe,[ue,ce]=r.useState(Y),de=X??ue,[he,pe]=r.useState(()=>j(se)??{hsv:R,alpha:1}),[fe,me]=r.useState(()=>se),ge=C(he.hsv,$?he.alpha:1,P),ve=""===se;r.useEffect(()=>{const e=j(se);e?C(e.hsv,$?e.alpha:1,P)!==ge&&(me(se),pe(e)):me(se)},[se,ge,$,P]);const be=V||K,xe=F&&!be&&!ve,{shrunk:ye,focusProps:we}=c({floating:A&&v(S),filled:!ve,pinned:de}),Ne=(e,a)=>{pe(e);const r=C(e.hsv,$?e.alpha:1,P);me(a??r),void 0===o&&ie(r),_?.(r)},ke=e(L,{hsv:he.hsv,alphaValue:he.alpha,onChange:Ne,text:fe,onTextChange:e=>{me(e);const a=j(e);a&&Ne(a,e)},withAlpha:$,swatches:M,editable:I,size:W,inert:be,labels:ae}),Ce=e("span",{"aria-hidden":"true",className:"border-mp-outline-variant block size-5 shrink-0 rounded-full border",style:y,children:e("span",{className:"block size-full rounded-full",style:{backgroundColor:ve?"transparent":k(he.hsv,$?he.alpha:1)}})}),je=U?e("input",{type:"hidden",name:U,value:ve?"":ge}):null;return T?a("div",{ref:ee,"data-mp-size":W,className:["mp-color-picker flex flex-col",g[W],Q??""].filter(Boolean).join(" "),style:Z,children:[v(S)?a("span",{className:[f,V?"text-mp-on-surface/38":"text-mp-on-surface-variant"].join(" "),children:[S,q?e("span",{"aria-hidden":"true",children:" *"}):null]}):null,ke,v(D)?e("span",{className:`${f} text-mp-error`,children:D}):v(B)?e("span",{className:`${f} text-mp-on-surface-variant`,children:B}):null,je]}):a(n.Root,{ref:ee,disabled:V,invalid:re,"data-mp-size":W,className:["mp-color-picker group flex-col align-top",G?"flex w-full":"inline-flex w-fit",Q??""].filter(Boolean).join(" "),style:Z,...we,children:[a(l.Root,{open:de,onOpenChange:e=>{void 0===X&&ce(e),E?.(e)},children:[a("div",{className:"relative w-full",children:[a(l.Trigger,{id:te,disabled:V,nativeButton:!0,className:["relative flex w-full items-center gap-2 select-none","appearance-none bg-transparent font-[inherit] outline-none",ne.padding,xe?"pe-10":"",ne.height,m[W],V?"text-mp-on-surface/38 cursor-default":"text-mp-on-surface "+(K?"cursor-default":"cursor-pointer")].filter(Boolean).join(" "),children:[ve&&!ye?null:Ce,e("span",{className:["min-w-0 flex-1 truncate text-start",ve?"text-mp-on-surface-variant":""].filter(Boolean).join(" "),children:ve?ye?ae.empty:null:ge})]}),xe?a("button",{type:"button","aria-label":ae.clear,onClick:()=>{void 0===o&&ie(""),me(""),_?.("")},className:["group/clear rounded-mp-full text-mp-on-surface-variant absolute inset-y-0","end-1 my-auto flex size-8 cursor-pointer items-center justify-center","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-1","focus-visible:outline-solid outline-none"].join(" "),children:[e(d,{className:"group-hover/clear:opacity-8 group-focus-visible/clear:opacity-10"}),e(t,{icon:i,size:p[W]})]}):null,e(u,{label:S,required:q,notched:ye}),v(S)?e(s,{size:W,label:S,required:q,htmlFor:te,shrunk:ye}):null]}),e(l.Portal,{children:e(l.Positioner,{className:x,sideOffset:4,align:"start",children:e(l.Popup,{className:["mp-color-picker__popup rounded-mp-md shadow-mp-2 bg-mp-surface-container","text-mp-on-surface p-3 outline-none",m[W],b].join(" "),children:ke})})})]}),e(h,{description:B,errorMessage:D,className:ne.padding}),je]})});
+import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as r from"react";import{Field as n}from"@base-ui/react/field";import{Popover as t}from"@base-ui/react/popover";import{MPIcon as l}from"../icon/MPIcon";import{CheckIcon as o,CloseIcon as i}from"../../constants/icons";import{MPFieldLabel as s,MPFieldOutline as u,useFloatingLabel as c}from"../../internal/FieldOutline";import{MPStateLayer as d}from"../../internal/StateLayer";import{MPSupportingText as p}from"../../internal/SupportingText";import{CONTROL_ICON as h,META_TEXT as m,PROSE_TEXT as f,STACK_GAP as g,hasContent as v}from"../../internal/scale";import{FADE as b,PORTAL_LAYER as x}from"../../internal/surface";import{CHECKER_BACKGROUND as y,DEFAULT_SWATCHES as w,clamp as N,cssColor as k,formatColor as C,parseColor as j,readableInk as _}from"../../internal/color";const z={area:"Saturation and brightness",hue:"Hue",alpha:"Opacity",value:"Colour value",swatches:"Swatches",clear:"Clear",empty:"No colour"},P={xs:"w-40",sm:"w-44",md:"w-52",lg:"w-60",xl:"w-72"},$={xs:"h-24",sm:"h-28",md:"h-32",lg:"h-40",xl:"h-48"},M={xs:"h-2.5",sm:"h-3",md:"h-3.5",lg:"h-4",xl:"h-5"},T={xs:"gap-2",sm:"gap-2.5",md:"gap-3",lg:"gap-3.5",xl:"gap-4"},I={xs:12,sm:14,md:16,lg:18,xl:20},O={xs:{padding:"px-2",height:"h-8"},sm:{padding:"px-3",height:"h-10"},md:{padding:"px-4",height:"h-14"},lg:{padding:"px-4",height:"h-16"},xl:{padding:"px-5",height:"h-18"}},S="border-mp-outline-variant relative overflow-hidden border",A=["pointer-events-none absolute rounded-full border-2 border-white","[box-shadow:0_0_0_1px_rgb(0_0_0/0.35),0_1px_3px_rgb(0_0_0/0.4)]"].join(" ");function B(e,a,r){return{x:0===e.width?0:N((a-e.left)/e.width,0,1),y:0===e.height?0:N((r-e.top)/e.height,0,1)}}function D(e){const a=e.shiftKey?10:1;switch(e.key){case"ArrowLeft":return{x:-a,y:0};case"ArrowRight":return{x:a,y:0};case"ArrowUp":return{x:0,y:a};case"ArrowDown":return{x:0,y:-a};default:return null}}function L({hsv:n,alphaValue:t,onChange:i,text:s,onTextChange:u,withAlpha:c,swatches:d,editable:p,size:h,inert:f,labels:g}){const v=I[h],b=-v/2,x=k({h:n.h,s:100,v:100}),w=k(n),z=r.useRef(null),O=e=>({onPointerDown:a=>{if(f)return;const r=a.currentTarget.getBoundingClientRect();z.current=r,a.currentTarget.setPointerCapture(a.pointerId),e(B(r,a.clientX,a.clientY))},onPointerMove:a=>{const r=z.current;!f&&r&&a.currentTarget.hasPointerCapture(a.pointerId)&&e(B(r,a.clientX,a.clientY))},onPointerUp:()=>{z.current=null},onPointerCancel:()=>{z.current=null}}),L=(e,a,r,n)=>({role:"slider",tabIndex:f?-1:0,"aria-label":e,"aria-valuemin":0,"aria-valuemax":r,"aria-valuenow":Math.round(a),"aria-orientation":"horizontal","aria-disabled":f||void 0,onKeyDown:e=>{const a=D(e);!f&&a&&0!==a.x&&(e.preventDefault(),n(a.x))}}),R=["outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-2","focus-visible:outline-solid outline-none"].join(" "),q=r.useMemo(()=>d?d.map(e=>{const a=j(e);return{swatch:e,parsed:a,hex:null===a?null:C(a.hsv,a.alpha,"hex")}}):[],[d]),V=C(n,t,"hex");return a("div",{className:`mp-color-picker__panel flex flex-col ${P[h]} ${T[h]}`,children:[e("div",{...O(({x:e,y:a})=>i({hsv:{h:n.h,s:100*e,v:100*(1-a)},alpha:t})),role:"slider",tabIndex:f?-1:0,"aria-label":g.area,"aria-valuemin":0,"aria-valuemax":100,"aria-valuenow":Math.round(n.s),"aria-valuetext":`${Math.round(n.s)}%, ${Math.round(n.v)}%`,"aria-disabled":f||void 0,onKeyDown:e=>{const a=D(e);!f&&a&&(e.preventDefault(),i({hsv:{h:n.h,s:N(n.s+a.x,0,100),v:N(n.v+a.y,0,100)},alpha:t}))},className:[S,"rounded-mp-sm",$[h],R,f?"cursor-default":"cursor-crosshair touch-none"].join(" "),style:{backgroundColor:x,backgroundImage:"linear-gradient(to top, #000000, rgb(0 0 0 / 0)), linear-gradient(to right, #ffffff, rgb(255 255 255 / 0))"},children:e("span",{className:A,style:{width:v,height:v,left:`${n.s}%`,top:100-n.v+"%",marginLeft:b,marginTop:b,backgroundColor:w}})}),e("div",{...O(({x:e})=>i({hsv:{...n,h:360*e},alpha:t})),...L(g.hue,n.h,360,e=>i({hsv:{...n,h:(n.h+2*e+360)%360},alpha:t})),className:[S,"rounded-mp-full",M[h],R,f?"cursor-default":"cursor-pointer touch-none"].join(" "),style:{backgroundImage:"linear-gradient(to right, #ff0000 0%, #ffff00 16.66%, #00ff00 33.33%, #00ffff 50%, #0000ff 66.66%, #ff00ff 83.33%, #ff0000 100%)"},children:e("span",{className:A,style:{width:v,height:v,left:n.h/360*100+"%",top:"50%",marginLeft:b,marginTop:b,backgroundColor:x}})}),c?a("div",{...O(({x:e})=>i({hsv:n,alpha:e})),...L(g.alpha,100*t,100,e=>i({hsv:n,alpha:N(t+e/100,0,1)})),className:[S,"rounded-mp-full",M[h],R,f?"cursor-default":"cursor-pointer touch-none"].join(" "),style:y,children:[e("span",{"aria-hidden":"true",className:"absolute inset-0",style:{backgroundImage:`linear-gradient(to right, ${k(n,0)}, ${w})`}}),e("span",{className:A,style:{width:v,height:v,left:100*t+"%",top:"50%",marginLeft:b,marginTop:b,backgroundColor:k(n,t)}})]}):null,p?a("div",{className:`flex items-center ${T[h]}`,children:[e("span",{"aria-hidden":"true",className:"border-mp-outline-variant shrink-0 rounded-full border",style:{width:v+8,height:v+8,...y},children:e("span",{className:"block size-full rounded-full",style:{backgroundColor:k(n,t)}})}),e("input",{type:"text",value:s,readOnly:f,spellCheck:!1,autoComplete:"off","aria-label":g.value,onChange:e=>u(e.target.value),className:["rounded-mp-xs border-mp-outline text-mp-on-surface min-w-0 flex-1 border","bg-transparent px-2 py-1 font-mono lowercase",m,"focus-visible:border-mp-primary outline-none"].join(" ")})]}):null,q.length>0?e("div",{role:"group","aria-label":g.swatches,className:"grid grid-cols-8 gap-1",children:q.map(({swatch:a,parsed:r,hex:n},t)=>{const s=null!==r&&n===V;return e("button",{type:"button",disabled:f,"aria-label":a,"aria-pressed":s,onClick:()=>{r&&i({hsv:r.hsv,alpha:r.alpha})},className:["border-mp-outline-variant flex aspect-square items-center justify-center","rounded-full border","transition-[box-shadow] duration-(--mp-sys-motion-duration-short4)","ease-mp-standard",R,f?"cursor-default":"hover:shadow-mp-1 cursor-pointer"].join(" "),style:{backgroundColor:a},children:e("span",{"aria-hidden":"true",className:["transition-opacity duration-(--mp-sys-motion-duration-short4)","ease-mp-standard",s?"opacity-100":"opacity-0"].join(" "),style:r?{color:_(r.hsv)}:void 0,children:e(l,{icon:o,size:12})})},`${t}:${a}`)})}):null]})}const R={h:202,s:100,v:61};export const MPColorPicker=/*@__PURE__*/r.forwardRef(function({value:o,defaultValue:N="#00639b",onValueChange:_,format:P="hex",alpha:$=!1,swatches:M=w,inline:T=!1,editable:I=!0,label:S,floatingLabel:A=!0,description:B,errorMessage:D,required:q=!1,disabled:V=!1,readOnly:K=!1,clearable:F=!1,name:U,open:X,defaultOpen:Y=!1,onOpenChange:E,labels:H,size:W="md",fullWidth:G=!1,id:J,className:Q,style:Z},ee){const ae=r.useMemo(()=>({...z,...H}),[H]),re=v(D),ne=O[W],te=r.useId(),le=J??te,[oe,ie]=r.useState(N),se=o??oe,[ue,ce]=r.useState(Y),de=X??ue,[pe,he]=r.useState(()=>j(se)??{hsv:R,alpha:1}),[me,fe]=r.useState(()=>se),ge=C(pe.hsv,$?pe.alpha:1,P),ve=""===se;r.useEffect(()=>{const e=j(se);e?C(e.hsv,$?e.alpha:1,P)!==ge&&(fe(se),he(e)):fe(se)},[se,ge,$,P]);const be=V||K,xe=F&&!be&&!ve,{shrunk:ye,focusProps:we}=c({floating:A&&v(S),filled:!ve,pinned:de}),Ne=(e,a)=>{he(e);const r=C(e.hsv,$?e.alpha:1,P);fe(a??r),void 0===o&&ie(r),_?.(r)},ke=e(L,{hsv:pe.hsv,alphaValue:pe.alpha,onChange:Ne,text:me,onTextChange:e=>{fe(e);const a=j(e);a&&Ne(a,e)},withAlpha:$,swatches:M,editable:I,size:W,inert:be,labels:ae}),Ce=e("span",{"aria-hidden":"true",className:"border-mp-outline-variant block size-5 shrink-0 rounded-full border",style:y,children:e("span",{className:"block size-full rounded-full",style:{backgroundColor:ve?"transparent":k(pe.hsv,$?pe.alpha:1)}})}),je=U?e("input",{type:"hidden",name:U,value:ve?"":ge}):null;return T?a("div",{ref:ee,"data-mp-size":W,className:["mp-color-picker flex flex-col",g[W],Q??""].filter(Boolean).join(" "),style:Z,children:[v(S)?a("span",{className:[m,V?"text-mp-on-surface/38":"text-mp-on-surface-variant"].join(" "),children:[S,q?e("span",{"aria-hidden":"true",children:" *"}):null]}):null,ke,v(D)?e("span",{className:`${m} text-mp-error`,children:D}):v(B)?e("span",{className:`${m} text-mp-on-surface-variant`,children:B}):null,je]}):a(n.Root,{ref:ee,disabled:V,invalid:re,"data-mp-size":W,className:["mp-color-picker group flex-col align-top",G?"flex w-full":"inline-flex w-fit",Q??""].filter(Boolean).join(" "),style:Z,...we,children:[a(t.Root,{open:de,onOpenChange:e=>{void 0===X&&ce(e),E?.(e)},children:[a("div",{className:"relative w-full",children:[a(t.Trigger,{id:le,disabled:V,nativeButton:!0,className:["relative flex w-full items-center gap-2 select-none","appearance-none bg-transparent font-[inherit] outline-none",ne.padding,xe?"pe-10":"",ne.height,f[W],V?"text-mp-on-surface/38 cursor-default":"text-mp-on-surface "+(K?"cursor-default":"cursor-pointer")].filter(Boolean).join(" "),children:[ve&&!ye?null:Ce,e("span",{className:["min-w-0 flex-1 truncate text-start",ve?"text-mp-on-surface-variant":""].filter(Boolean).join(" "),children:ve?ye?ae.empty:null:ge})]}),xe?a("button",{type:"button","aria-label":ae.clear,onClick:()=>{void 0===o&&ie(""),fe(""),_?.("")},className:["group/clear rounded-mp-full text-mp-on-surface-variant absolute inset-y-0","end-1 my-auto flex size-8 cursor-pointer items-center justify-center","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-1","focus-visible:outline-solid outline-none"].join(" "),children:[e(d,{className:"group-hover/clear:opacity-8 group-focus-visible/clear:opacity-10"}),e(l,{icon:i,size:h[W]})]}):null,e(u,{label:S,required:q,notched:ye}),v(S)?e(s,{size:W,label:S,required:q,htmlFor:le,shrunk:ye}):null]}),e(t.Portal,{children:e(t.Positioner,{className:x,sideOffset:4,align:"start",children:e(t.Popup,{className:["mp-color-picker__popup rounded-mp-md shadow-mp-2 bg-mp-surface-container","text-mp-on-surface p-3 outline-none",f[W],b].join(" "),children:ke})})})]}),e(p,{description:B,errorMessage:D,className:ne.padding}),je]})});