material-plus-ui 1.8.0 → 1.10.0

package/dist/components/radio-group/MPRadioGroup.js

@@ -1,2 +1,2 @@
 "use client";
-import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as a from"react";import{Radio as i}from"@base-ui/react/radio";import{RadioGroup as l}from"@base-ui/react/radio-group";import{Field as n}from"@base-ui/react/field";import{accentSlots as o}from"../../internal/accent.js";import{DOT_MOTION as t}from"../../internal/mark.js";import{MPStateLayer as s}from"../../internal/StateLayer.js";import{MPSupportingText as d}from"../../internal/SupportingText.js";import{META_TEXT as c,PROSE_TEXT as m,hasContent as p}from"../../internal/scale.js";import{useMPColor as u,useMPSize as f}from"../../internal/config.js";const x={xs:{ring:"size-4",fill:"size-2",halo:"size-8"},sm:{ring:"size-[18px]",fill:"size-[10px]",halo:"size-9"},md:{ring:"size-5",fill:"size-2.5",halo:"size-10"},lg:{ring:"size-[22px]",fill:"size-3",halo:"size-11"},xl:{ring:"size-6",fill:"size-3",halo:"size-12"}},h=/*@__PURE__*/a.createContext({size:"md",readOnly:!1,invalid:!1});export const MPRadio=/*@__PURE__*/a.forwardRef(function({value:l,label:o,description:d,disabled:u=!1,id:f,className:g,style:b},z){const j=a.useContext(h),v=x[j.size],y=a.useId(),N=f??y;return e(n.Root,{className:["mp-radio inline-block max-w-full align-top",g??""].filter(Boolean).join(" "),style:b,disabled:u,"data-mp-value":l,children:r("div",{className:["flex items-start gap-3",m[j.size]].join(" "),children:[e("span",{className:"flex h-[1lh] shrink-0 items-center",children:r(i.Root,{ref:z,id:N,value:l,disabled:u,className:["mp-radio__dot group relative inline-flex shrink-0 items-center justify-center","box-border rounded-full border-2 p-0","appearance-none bg-transparent font-[inherit] outline-none","transition-[border-color] duration-(--mp-sys-motion-duration-short4)",v.ring,u?"border-mp-on-surface/38 cursor-default":[j.readOnly?"cursor-default":"cursor-pointer",j.invalid?"border-mp-error":"border-mp-on-surface-variant","data-checked:border-(--_mp-accent)"].join(" ")].join(" "),children:[u?null:e(s,{layer:["top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 rounded-full",v.halo,"bg-mp-on-surface","group-data-checked:bg-(--_mp-accent)"].join(" ")}),e(i.Indicator,{className:["mp-radio__fill rounded-full",v.fill,t,u?"bg-mp-on-surface/38":"bg-(--_mp-accent)"].join(" ")})]})}),p(o)||p(d)?r("span",{className:"flex min-w-0 flex-col gap-0.5",children:[p(o)?e(n.Label,{htmlFor:N,className:["leading-[1.4]",u?"text-mp-on-surface/38 cursor-default":j.readOnly?"text-mp-on-surface":"text-mp-on-surface cursor-pointer"].join(" "),children:o}):null,p(d)?e(n.Description,{className:`${c} text-mp-on-surface-variant data-disabled:text-mp-on-surface/38 m-0`,children:d}):null]}):null]})})});export const MPRadioGroup=/*@__PURE__*/a.forwardRef(function({value:i,defaultValue:t,onValueChange:s,label:m,description:x,errorMessage:g,orientation:b="vertical",size:z,color:j,required:v=!1,disabled:y=!1,readOnly:N=!1,name:R,children:_,className:k,style:w},O){const M=f(z),C=u(j),V=p(g),I=V?"error":C,P=a.useId(),S=a.useMemo(()=>({size:M,readOnly:N,invalid:V}),[M,N,V]);return e(h.Provider,{value:S,children:r(n.Root,{className:["mp-radio-group flex flex-col gap-2",k??""].filter(Boolean).join(" "),disabled:y,invalid:V,"data-mp-size":M,"data-mp-orientation":b,style:{...o(I),...w},children:[p(m)?r("span",{id:P,className:[c,y?"text-mp-on-surface/38":"text-mp-on-surface-variant"].join(" "),children:[m,v?e("span",{"aria-hidden":"true",children:" *"}):null]}):null,e(l,{ref:O,"aria-labelledby":p(m)?P:void 0,value:i,defaultValue:t,onValueChange:e=>s?.(String(e??"")),disabled:y,readOnly:N,required:v,name:R,className:["flex","horizontal"===b?"flex-row flex-wrap gap-x-6 gap-y-2":"flex-col gap-2"].join(" "),children:_}),e(d,{description:x,errorMessage:g})]})})});
+import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as a from"react";import{Radio as i}from"@base-ui/react/radio";import{RadioGroup as l}from"@base-ui/react/radio-group";import{Field as n}from"@base-ui/react/field";import{accentSlots as o}from"../../internal/accent.js";import{DOT_MOTION as s}from"../../internal/mark.js";import{MPStateLayer as t}from"../../internal/StateLayer.js";import{MPSupportingText as d}from"../../internal/SupportingText.js";import{META_TEXT as c,PROSE_TEXT as m,hasContent as p}from"../../internal/scale.js";import{useMPColor as u,useMPSize as f}from"../../internal/config.js";const x={xs:{ring:"size-4",fill:"size-2",halo:"size-8"},sm:{ring:"size-[18px]",fill:"size-[10px]",halo:"size-9"},md:{ring:"size-5",fill:"size-2.5",halo:"size-10"},lg:{ring:"size-[22px]",fill:"size-3",halo:"size-11"},xl:{ring:"size-6",fill:"size-3",halo:"size-12"}},g=/*@__PURE__*/a.createContext({size:"md",readOnly:!1,invalid:!1});export const MPRadio=/*@__PURE__*/a.forwardRef(function({value:l,label:o,description:d,disabled:u=!1,id:f,className:h,style:b},z){const j=a.useContext(g),v=x[j.size],y=a.useId(),N=f??y;return e(n.Root,{className:["mp-radio inline-block max-w-full align-top",h??""].filter(Boolean).join(" "),style:b,disabled:u,"data-mp-value":l,children:r("div",{className:["flex items-start gap-3",m[j.size]].join(" "),children:[e("span",{className:"flex h-[1lh] shrink-0 items-center",children:r(i.Root,{ref:z,id:N,value:l,disabled:u,className:["mp-radio__dot group relative inline-flex shrink-0 items-center justify-center","box-border rounded-full border-2 p-0","appearance-none bg-transparent font-[inherit] outline-none","transition-[border-color] duration-(--mp-sys-motion-duration-short4)",v.ring,u?"border-mp-on-surface/38 cursor-default":[j.readOnly?"cursor-default":"cursor-pointer",j.invalid?"border-mp-error":"border-mp-on-surface-variant","data-checked:border-(--_mp-accent)"].join(" ")].join(" "),children:[u?null:e(t,{layer:["top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 rounded-full",v.halo,"bg-mp-on-surface","group-data-checked:bg-(--_mp-accent)"].join(" ")}),e(i.Indicator,{className:["mp-radio__fill rounded-full",v.fill,s,u?"bg-mp-on-surface/38":"bg-(--_mp-accent)"].join(" ")})]})}),p(o)||p(d)?r("span",{className:"flex min-w-0 flex-col gap-0.5",children:[p(o)?e(n.Label,{className:["leading-[1.4]",u?"text-mp-on-surface/38 cursor-default":j.readOnly?"text-mp-on-surface":"text-mp-on-surface cursor-pointer"].join(" "),children:o}):null,p(d)?e(n.Description,{className:`${c} text-mp-on-surface-variant data-disabled:text-mp-on-surface/38 m-0`,children:d}):null]}):null]})})});export const MPRadioGroup=/*@__PURE__*/a.forwardRef(function({value:i,defaultValue:s,onValueChange:t,label:m,description:x,errorMessage:h,orientation:b="vertical",size:z,color:j,required:v=!1,disabled:y=!1,readOnly:N=!1,name:R,children:_,className:k,style:w},O){const M=f(z),C=u(j),V=p(h),I=V?"error":C,P=a.useId(),S=a.useMemo(()=>({size:M,readOnly:N,invalid:V}),[M,N,V]);return e(g.Provider,{value:S,children:r(n.Root,{className:["mp-radio-group flex flex-col gap-2",k??""].filter(Boolean).join(" "),disabled:y,invalid:V,"data-mp-size":M,"data-mp-orientation":b,style:{...o(I),...w},children:[p(m)?r("span",{id:P,className:[c,y?"text-mp-on-surface/38":"text-mp-on-surface-variant"].join(" "),children:[m,v?e("span",{"aria-hidden":"true",children:" *"}):null]}):null,e(l,{ref:O,"aria-labelledby":p(m)?P:void 0,value:i,defaultValue:s,onValueChange:e=>t?.(String(e??"")),disabled:y,readOnly:N,required:v,name:R,className:["flex","horizontal"===b?"flex-row flex-wrap gap-x-6 gap-y-2":"flex-col gap-2"].join(" "),children:_}),e(d,{description:x,errorMessage:h})]})})});

package/dist/components/scatter-chart/MPScatterChart.d.ts

@@ -1,6 +1,10 @@
 import * as React from 'react';
 import { type CartesianChartProps } from '../../internal/ChartFrame.js';
-export interface MPScatterChartProps extends CartesianChartProps {
+/**
+ * No `zoom`: what a drag would cut is a row of category slots, and a scatter
+ * has two value axes and no row. Crop it with `xAxis` and `yAxis` instead.
+ */
+export interface MPScatterChartProps extends Omit<CartesianChartProps, 'zoom'> {
     /**
      * Sizes each mark by its point's `z`, so a third number rides along.
      *

package/dist/components/scatter-chart/MPScatterChart.js

@@ -1,2 +1,2 @@
 "use client";
-import{jsx as r}from"react/jsx-runtime";import{CartesianFrame as e}from"../../internal/ChartFrame.js";import{MARKER_RADIUS as s,MARK_SHAPES as a,bubbleRadius as t,markPath as c,pointX as i}from"../../internal/chart.js";export function MPScatterChart({bubble:o=!1,maxRadius:l=22,shapes:n=!0,...u}){const h=r=>n?a[r%a.length]:"circle";return r(e,{...u,xScale:"value",includeZero:!1,markRadius:20,markInset:o?l+2:s.xl+2,marks:({values:r,visible:e,valuePx:a,categoryValuePx:c,categories:n,size:u})=>{const h=s[u],m=o?r.reduce((r,s,a)=>e[a]?s.reduce((r,e)=>Math.max(r,e.z??0),r):r,0):0;return r.flatMap((r,s)=>e[s]?r.flatMap((r,e)=>{const u=i(r,e,n);if(null===r.value||null===u)return[];const d=o?t(r.z??0,m,l,h):h+1;return[{series:s,index:e,x:c(u),y:a(r.value),r:d}]}):[])},swatch:(e,s)=>r("svg",{width:10,height:10,viewBox:"0 0 10 10","aria-hidden":"true",className:"block",children:r("path",{d:c(h(e),5,5,4),fill:"cross"===h(e)?"none":s,stroke:s,strokeWidth:"cross"===h(e)?1.5:0})}),children:({marks:e,colors:s,activeMark:a,hovered:t})=>r("g",{className:"mp-scatter-chart__marks",children:e.map((e,i)=>{const o=h(e.series),l=a===e,n=null!==t&&t!==e.series;return r("path",{d:c(o,e.x,e.y,l?e.r+1.5:e.r),fill:"cross"===o?"none":s[e.series],stroke:"cross"===o?s[e.series]:"var(--_mp-color-surface)",strokeWidth:"cross"===o?2:1.5,strokeLinecap:"round",opacity:n?.15:l?1:.85},i)})})})}
+import{jsx as r}from"react/jsx-runtime";import*as e from"react";import{CartesianFrame as s}from"../../internal/ChartFrame.js";import{MARKER_RADIUS as a,MARK_SHAPES as t,bubbleRadius as c,markPath as o,pointX as i}from"../../internal/chart.js";export function MPScatterChart({bubble:l=!1,maxRadius:n=22,shapes:u=!0,...m}){const h=e.useCallback((e,s)=>{const a=u?t[e%t.length]:"circle";return r("svg",{width:10,height:10,viewBox:"0 0 10 10","aria-hidden":"true",className:"block",children:r("path",{d:o(a,5,5,4),fill:"cross"===a?"none":s,stroke:s,strokeWidth:"cross"===a?1.5:0})})},[u]);return r(s,{...m,xScale:"value",includeZero:!1,markRadius:20,markInset:l?n+2:a.xl+2,marks:({values:r,visible:e,valuePx:s,categoryValuePx:t,categories:o,size:u})=>{const m=a[u],h=l?r.reduce((r,s,a)=>e[a]?s.reduce((r,e)=>Math.max(r,e.z??0),r):r,0):0;return r.flatMap((r,a)=>e[a]?r.flatMap((r,e)=>{const u=i(r,e,o);if(null===r.value||null===u)return[];const d=l?c(r.z??0,h,n,m):m+1;return[{series:a,index:e,x:t(u),y:s(r.value),r:d}]}):[])},swatch:h,children:({marks:e,colors:s,activeMark:a,hovered:c})=>r("g",{className:"mp-scatter-chart__marks",children:e.map((e,i)=>{const l=(n=e.series,u?t[n%t.length]:"circle");var n;const m=a===e,h=null!==c&&c!==e.series;return r("path",{d:o(l,e.x,e.y,m?e.r+1.5:e.r),fill:"cross"===l?"none":s[e.series],stroke:"cross"===l?s[e.series]:"var(--_mp-color-surface)",strokeWidth:"cross"===l?2:1.5,strokeLinecap:"round",opacity:h?.15:m?1:.85},i)})})})}

package/dist/components/sidebar/MPSidebar.d.ts

@@ -55,6 +55,17 @@ export interface MPSidebarProps extends Omit<React.ComponentPropsWithoutRef<'asi
      * to bring it back would be a sidebar the reader has lost.
      */
     collapseBelow?: MPPageCollapse;
+    /**
+     * Keeps the sidebar's contents in the document while it is a closed drawer,
+     * hidden, rather than taking them out.
+     *
+     * Collapsed, a sidebar is a modal drawer, and a closed one is not on the page
+     * at all — so below `collapseBelow` its links vanished from the page a
+     * crawler renders at a phone's width. Turn it on for a sidebar that is the
+     * site's navigation. See `MPDrawer`'s own `keepMounted`.
+     * @default false
+     */
+    keepMounted?: boolean;
     /**
      * Whether the drawer is open. Only meaningful once the sidebar has collapsed;
      * a column is not opened, it is there.

package/dist/components/sidebar/MPSidebar.js

@@ -1,2 +1,2 @@
 "use client";
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as r from"react";import{MPDrawer as n}from"../drawer/MPDrawer.js";import{pixelsIn as o}from"../../internal/length.js";import{useMPLocale as i,useMPMessages as a}from"../../internal/locale.js";import{LAYOUT as s}from"../../internal/messages/layout.js";import{barSurface as l,drawerSide as d,EXPANDED_ONLY as u,MPPageLayoutContext as c,MPSidebarSideContext as m,useMPCollapsed as p}from"../../internal/page-layout.js";import{sheetPadX as f,sheetPadY as v}from"../../internal/density.js";import{useMPDensity as b,useMPSize as y}from"../../internal/config.js";const h={xs:"15rem",sm:"18rem",md:"22.5rem",lg:"26rem",xl:"30rem"};function g(e,t){return null==e?t:"number"==typeof e?e:o(e,"undefined"==typeof window?void 0:window.innerWidth)??t}export const MPSidebar=/*@__PURE__*/r.forwardRef(function({side:o,width:w,minWidth:x=160,maxWidth:j=480,resizable:_=!1,onResize:R,onResizeEnd:k,collapseBelow:C,open:z,defaultOpen:P=!1,onOpenChange:E,sticky:M=!0,title:L,variant:B="outlined",elevation:S,size:N,density:A,padded:D=!0,label:O,locale:$,className:I,style:W,children:T,...X},K){const V=y(N),q=b(A),F=r.useContext(c),G=r.useContext(m),H=o??G??"start",J=i($??F.locale),Q=a(s,J),U=C??(F.present?F.collapseBelow:"none"),Y=p(U),[Z,ee]=r.useState(P),te=void 0!==z,re=te?z:F.present?F.open[H]:Z,ne=e=>{te||(F.present?F.setOpen(H,e):ee(e)),E?.(e)},oe=void 0===w?h[V]:"number"==typeof w?`${w}px`:w,ie=r.useRef(null),ae=r.useRef(oe),se=r.useRef(null),le=r.useId();ae.current!==oe&&(ae.current=oe,ie.current=null);const de=ie.current??oe,ue=r.useRef(null),ce=r.useCallback(e=>{ue.current=e,"function"==typeof K?K(e):K&&(K.current=e)},[K]),me=r.useRef(null);r.useEffect(()=>()=>me.current?.(),[]);const pe=e=>{const t=ue.current;if(!t)return e;const r=Math.min(g(j,480),Math.max(g(x,160),Math.round(e)));return ie.current=`${r}px`,t.style.setProperty("--_mp-sidebar-width",ie.current),se.current?.setAttribute("aria-valuenow",String(r)),r};return Y?e(n,{side:d(H),mode:"modal",open:re,onOpenChange:ne,title:L??O??Q.sidebar,size:V,locale:J,extent:void 0===w?void 0:de,className:I,style:W,children:T}):t("aside",{ref:ce,"aria-label":O??Q.sidebar,"data-mp-size":V,"data-mp-variant":B,"data-mp-side":H,className:["mp-sidebar text-mp-on-surface relative box-border flex min-w-0 shrink-0 flex-col","w-(--_mp-sidebar-width)",l(B,S),"outlined"===B?"border-mp-outline-variant "+("start"===H?"border-e":"border-s"):"","content"===F.scroll?"h-full":M?["self-start sticky [top:var(--_mp-layout-header,0px)]","[height:calc(100dvh_-_var(--_mp-layout-header,0px)_-_var(--_mp-layout-footer,0px))]"].join(" "):"",u[U],I??""].filter(Boolean).join(" "),style:{"--_mp-sidebar-width":de,...W},...X,children:[e("div",{id:le,className:["mp-sidebar__body min-h-0 flex-1 overflow-y-auto overscroll-contain",D?`${f(V,q)} ${v(V,q)}`:""].filter(Boolean).join(" "),children:T}),_?e("div",{ref:se,role:"separator","aria-orientation":"vertical","aria-label":Q.resizeSidebar,"aria-valuemin":Math.round(g(x,160)),"aria-valuemax":Math.round(g(j,480)),"aria-valuenow":Math.round(g(de,g(h[V],360))),"aria-controls":le,tabIndex:0,className:["mp-sidebar__handle absolute inset-y-0 z-1 w-2 cursor-col-resize bg-transparent","start"===H?"-me-1 end-0":"-ms-1 start-0","hover:bg-mp-outline-variant data-dragging:bg-mp-outline-variant","transition-colors duration-(--mp-sys-motion-duration-short4)","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-0","focus-visible:outline-solid outline-none"].join(" "),onPointerDown:e=>{const t=ue.current;if(!t||0!==e.button)return;const r=e.currentTarget;r.setPointerCapture(e.pointerId),r.dataset.dragging="true";const n=document.body.style.getPropertyValue("-webkit-user-select");document.body.style.setProperty("-webkit-user-select","none");const o=e.clientX,i=t.getBoundingClientRect().width,a="rtl"===getComputedStyle(t).direction,s="start"===H===a?-1:1;let l=i;const d=e=>{l=pe(i+(e.clientX-o)*s),R?.(l)},u=()=>{me.current=null,r.removeEventListener("pointermove",d),r.removeEventListener("pointerup",c),r.removeEventListener("pointercancel",c),delete r.dataset.dragging,n?document.body.style.setProperty("-webkit-user-select",n):document.body.style.removeProperty("-webkit-user-select")},c=()=>{u(),k?.(l)};me.current=u,r.addEventListener("pointermove",d),r.addEventListener("pointerup",c),r.addEventListener("pointercancel",c)},onKeyDown:e=>{if("ArrowLeft"!==e.key&&"ArrowRight"!==e.key)return;e.preventDefault();const t="rtl"===getComputedStyle(e.currentTarget).direction,r="start"===H===t?-1:1;(e=>{const t=ue.current;if(!t)return;const r=pe(t.getBoundingClientRect().width+e);R?.(r),k?.(r)})(("ArrowRight"===e.key?16:-16)*r)}}):null]})});
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as r from"react";import{MPDrawer as n}from"../drawer/MPDrawer.js";import{pixelsIn as o}from"../../internal/length.js";import{useMPLocale as i,useMPMessages as a}from"../../internal/locale.js";import{LAYOUT as s}from"../../internal/messages/layout.js";import{barSurface as l,drawerSide as d,EXPANDED_ONLY as u,MPPageLayoutContext as c,MPSidebarSideContext as m,useMPCollapsed as p}from"../../internal/page-layout.js";import{sheetPadX as f,sheetPadY as v}from"../../internal/density.js";import{useMPDensity as b,useMPSize as y}from"../../internal/config.js";const h={xs:"15rem",sm:"18rem",md:"22.5rem",lg:"26rem",xl:"30rem"};function g(e,t){return null==e?t:"number"==typeof e?e:o(e,"undefined"==typeof window?void 0:window.innerWidth)??t}export const MPSidebar=/*@__PURE__*/r.forwardRef(function({side:o,width:w,minWidth:x=160,maxWidth:j=480,resizable:_=!1,onResize:k,onResizeEnd:R,collapseBelow:C,keepMounted:M=!1,open:z,defaultOpen:P=!1,onOpenChange:E,sticky:L=!0,title:B,variant:S="outlined",elevation:N,size:A,density:D,padded:O=!0,label:$,locale:I,className:W,style:T,children:X,...K},V){const q=y(A),F=b(D),G=r.useContext(c),H=r.useContext(m),J=o??H??"start",Q=i(I??G.locale),U=a(s,Q),Y=C??(G.present?G.collapseBelow:"none"),Z=p(Y),[ee,te]=r.useState(P),re=void 0!==z,ne=re?z:G.present?G.open[J]:ee,oe=e=>{re||(G.present?G.setOpen(J,e):te(e)),E?.(e)},ie=void 0===w?h[q]:"number"==typeof w?`${w}px`:w,ae=r.useRef(null),se=r.useRef(ie),le=r.useRef(null),de=r.useId();se.current!==ie&&(se.current=ie,ae.current=null);const ue=ae.current??ie,ce=r.useRef(null),me=r.useCallback(e=>{ce.current=e,"function"==typeof V?V(e):V&&(V.current=e)},[V]),pe=r.useRef(null);r.useEffect(()=>()=>pe.current?.(),[]);const fe=e=>{const t=ce.current;if(!t)return e;const r=Math.min(g(j,480),Math.max(g(x,160),Math.round(e)));return ae.current=`${r}px`,t.style.setProperty("--_mp-sidebar-width",ae.current),le.current?.setAttribute("aria-valuenow",String(r)),r};return Z?e(n,{side:d(J),mode:"modal",open:ne,onOpenChange:oe,title:B??$??U.sidebar,keepMounted:M,size:q,locale:Q,extent:void 0===w?void 0:ue,className:W,style:T,children:X}):t("aside",{ref:me,"aria-label":$??U.sidebar,"data-mp-size":q,"data-mp-variant":S,"data-mp-side":J,className:["mp-sidebar text-mp-on-surface relative box-border flex min-w-0 shrink-0 flex-col","w-(--_mp-sidebar-width)",l(S,N),"outlined"===S?"border-mp-outline-variant "+("start"===J?"border-e":"border-s"):"","content"===G.scroll?"h-full":L?["self-start sticky [top:var(--_mp-layout-header,0px)]","[height:calc(100dvh_-_var(--_mp-layout-header,0px)_-_var(--_mp-layout-footer,0px))]"].join(" "):"",u[Y],W??""].filter(Boolean).join(" "),style:{"--_mp-sidebar-width":ue,...T},...K,children:[e("div",{id:de,className:["mp-sidebar__body min-h-0 flex-1 overflow-y-auto overscroll-contain",O?`${f(q,F)} ${v(q,F)}`:""].filter(Boolean).join(" "),children:X}),_?e("div",{ref:le,role:"separator","aria-orientation":"vertical","aria-label":U.resizeSidebar,"aria-valuemin":Math.round(g(x,160)),"aria-valuemax":Math.round(g(j,480)),"aria-valuenow":Math.round(g(ue,g(h[q],360))),"aria-controls":de,tabIndex:0,className:["mp-sidebar__handle absolute inset-y-0 z-1 w-2 cursor-col-resize bg-transparent","start"===J?"-me-1 end-0":"-ms-1 start-0","hover:bg-mp-outline-variant data-dragging:bg-mp-outline-variant","transition-colors duration-(--mp-sys-motion-duration-short4)","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-0","focus-visible:outline-solid outline-none"].join(" "),onPointerDown:e=>{const t=ce.current;if(!t||0!==e.button)return;const r=e.currentTarget;r.setPointerCapture(e.pointerId),r.dataset.dragging="true";const n=document.body.style.getPropertyValue("-webkit-user-select");document.body.style.setProperty("-webkit-user-select","none");const o=e.clientX,i=t.getBoundingClientRect().width,a="rtl"===getComputedStyle(t).direction,s="start"===J===a?-1:1;let l=i;const d=e=>{l=fe(i+(e.clientX-o)*s),k?.(l)},u=()=>{pe.current=null,r.removeEventListener("pointermove",d),r.removeEventListener("pointerup",c),r.removeEventListener("pointercancel",c),delete r.dataset.dragging,n?document.body.style.setProperty("-webkit-user-select",n):document.body.style.removeProperty("-webkit-user-select")},c=()=>{u(),R?.(l)};pe.current=u,r.addEventListener("pointermove",d),r.addEventListener("pointerup",c),r.addEventListener("pointercancel",c)},onKeyDown:e=>{if("ArrowLeft"!==e.key&&"ArrowRight"!==e.key)return;e.preventDefault();const t="rtl"===getComputedStyle(e.currentTarget).direction,r="start"===J===t?-1:1;(e=>{const t=ce.current;if(!t)return;const r=fe(t.getBoundingClientRect().width+e);k?.(r),R?.(r)})(("ArrowRight"===e.key?16:-16)*r)}}):null]})});

package/dist/components/slider/MPSlider.d.ts

@@ -59,6 +59,11 @@ export interface MPSliderProps {
     showValue?: boolean;
     /** How the readout is written. Passed to `Intl.NumberFormat`. */
     format?: Intl.NumberFormatOptions;
+    /**
+     * The locale the readout and the announced value are written in. Defaults to
+     * the nearest `MPLocaleProvider`, then to the runtime's own.
+     */
+    locale?: string;
     /**
      * Which way the slider runs. A vertical slider has no length of its own, so
      * give it a height — the default is a starting point, not a rule.

package/dist/components/slider/MPSlider.js

@@ -1,2 +1,2 @@
 "use client";
-import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as t from"react";import{Slider as r}from"@base-ui/react/slider";import{accentSlots as s}from"../../internal/accent.js";import{MPStateLayer as n}from"../../internal/StateLayer.js";import{META_TEXT as l,hasContent as i}from"../../internal/scale.js";import{useMPColor as o,useMPSize as m}from"../../internal/config.js";const u={xs:{thickness:"h-0.5",cross:"w-0.5",handle:"size-3.5",strip:"h-8",stripCross:"w-8"},sm:{thickness:"h-[3px]",cross:"w-[3px]",handle:"size-4",strip:"h-9",stripCross:"w-9"},md:{thickness:"h-1",cross:"w-1",handle:"size-5",strip:"h-10",stripCross:"w-10"},lg:{thickness:"h-1.5",cross:"w-1.5",handle:"size-6",strip:"h-11",stripCross:"w-11"},xl:{thickness:"h-2",cross:"w-2",handle:"size-7",strip:"h-12",stripCross:"w-12"}},c=/*@__PURE__*/["duration-(--mp-sys-motion-duration-short2) ease-mp-standard","motion-reduce:transition-none"].join(" "),d={xs:"size-[2px]",sm:"size-[2px]",md:"size-[3px]",lg:"size-1",xl:"size-1.5"},p={xs:"size-8",sm:"size-9",md:"size-10",lg:"size-11",xl:"size-12"};export const MPSlider=/*@__PURE__*/t.forwardRef(function({value:f,defaultValue:h,onValueChange:g,onValueCommitted:b,min:x=0,max:v=100,step:w=1,marks:j,label:y,description:z,showValue:N=!1,format:_,orientation:k="horizontal",size:C,color:V,disabled:A=!1,name:M,"aria-label":S,className:$,style:I},B){const L=m(C),R=o(V),T="vertical"===k,F=u[L],P=t.useId(),X=f??h,Y=Array.isArray(X)?X.length:1,q=t.useMemo(()=>{if(!j||v<=x)return[];if(!0!==j)return j.filter(e=>e.value>=x&&e.value<=v);const e=Math.floor((v-x)/w);return!Number.isFinite(e)||e<1||e>50?[]:Array.from({length:e+1},(e,a)=>({value:x+a*w}))},[j,x,v,w]),[D,E]=t.useState(h),G=f??D,H=t.useMemo(()=>{const e=Array.isArray(G)?G:void 0===G?[]:[G];return 0===e.length?null:1===e.length?{from:x,to:e[0]}:{from:Math.min(...e),to:Math.max(...e)}},[G,x]),J=e=>(e-x)/(v-x)*100+"%";return a(r.Root,{ref:B,value:f,defaultValue:h,onValueChange:e=>{void 0===f&&E(e),g?.(e)},onValueCommitted:e=>b?.(e),min:x,max:v,step:w,disabled:A,orientation:k,format:_,name:M,"data-mp-size":L,className:["mp-slider flex",T?"w-fit flex-col items-center gap-2":"w-full flex-col gap-1",A?"cursor-default":"",$??""].filter(Boolean).join(" "),style:{...s(R),...I},children:[i(y)||N?a("div",{className:["flex w-full items-baseline gap-2",l].join(" "),children:[i(y)?e(r.Label,{className:A?"text-mp-on-surface/38":"text-mp-on-surface-variant",children:y}):null,N?e(r.Value,{className:["ms-auto tabular-nums",A?"text-mp-on-surface/38":"text-mp-on-surface"].join(" ")}):null]}):null,e(r.Control,{className:["mp-slider__control group/rail flex touch-none items-center justify-center select-none",T?`${F.stripCross} h-40 flex-col`:`w-full ${F.strip}`,A?"":"cursor-pointer"].filter(Boolean).join(" "),children:a(r.Track,{className:["mp-slider__track rounded-mp-full relative",T?`${F.cross} h-full`:`${F.thickness} w-full`,A?"bg-mp-on-surface/12":"bg-mp-surface-container-highest"].join(" "),children:[e(r.Indicator,{className:["rounded-mp-full","[transition-property:inset-inline-start,width,bottom,height]",c,"group-data-dragging/rail:transition-none",A?"bg-mp-on-surface/38":"bg-(--_mp-accent)"].join(" ")}),q.map(a=>{const t=null!==H&&a.value>=H.from&&a.value<=H.to;return e("span",{"aria-hidden":"true",className:["mp-slider__tick pointer-events-none absolute rounded-full",d[L],A?"bg-mp-on-surface/38":t?"bg-(--_mp-on-accent)":"bg-mp-on-surface-variant"].join(" "),style:T?{bottom:J(a.value),insetInlineStart:"50%",transform:"translate(-50%, 50%)"}:{insetInlineStart:J(a.value),top:"50%",transform:"translate(-50%, -50%)"}},`tick:${a.value}`)}),Array.from({length:Y},(a,t)=>e(r.Thumb,{index:t,"aria-label":i(y)?void 0:S,"aria-describedby":i(z)?P:void 0,className:["mp-slider__handle group rounded-mp-full relative outline-none","[transition-property:inset-inline-start,bottom]",c,"data-dragging:transition-none",F.handle,A?"bg-mp-on-surface/38 cursor-default":"bg-(--_mp-accent) cursor-grab active:cursor-grabbing"].join(" "),children:A?null:e(n,{layer:["top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 rounded-full",p[L],"bg-(--_mp-accent)"].join(" "),className:"group-data-dragging:opacity-16"})},t))]})}),q.some(e=>i(e.label))?e("div",{"aria-hidden":"true",className:["mp-slider__marks relative",l,T?"h-full":"w-full",A?"text-mp-on-surface/38":"text-mp-on-surface-variant"].join(" "),style:T?void 0:{height:"1lh"},children:q.map(a=>i(a.label)?e("span",{className:"absolute whitespace-nowrap",style:T?{bottom:J(a.value),transform:"translateY(50%)"}:{insetInlineStart:J(a.value),transform:"translateX(-50%)"},children:a.label},`label:${a.value}`):null)}):null,i(z)?e("div",{id:P,className:[l,A?"text-mp-on-surface/38":"text-mp-on-surface-variant"].join(" "),children:z}):null]})});
+import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as t from"react";import{Slider as r}from"@base-ui/react/slider";import{accentSlots as s}from"../../internal/accent.js";import{MPStateLayer as n}from"../../internal/StateLayer.js";import{META_TEXT as l,hasContent as i}from"../../internal/scale.js";import{useMPColor as o,useMPSize as m}from"../../internal/config.js";import{useMPLocale as c}from"../../internal/locale.js";import{checkServerLocale as u,intlLocale as p}from"../../internal/intl.js";const d={xs:{thickness:"h-0.5",cross:"w-0.5",handle:"size-3.5",strip:"h-8",stripCross:"w-8"},sm:{thickness:"h-[3px]",cross:"w-[3px]",handle:"size-4",strip:"h-9",stripCross:"w-9"},md:{thickness:"h-1",cross:"w-1",handle:"size-5",strip:"h-10",stripCross:"w-10"},lg:{thickness:"h-1.5",cross:"w-1.5",handle:"size-6",strip:"h-11",stripCross:"w-11"},xl:{thickness:"h-2",cross:"w-2",handle:"size-7",strip:"h-12",stripCross:"w-12"}},f=/*@__PURE__*/["duration-(--mp-sys-motion-duration-short2) ease-mp-standard","motion-reduce:transition-none"].join(" "),h={xs:"size-[2px]",sm:"size-[2px]",md:"size-[3px]",lg:"size-1",xl:"size-1.5"},g={xs:"size-8",sm:"size-9",md:"size-10",lg:"size-11",xl:"size-12"};export const MPSlider=/*@__PURE__*/t.forwardRef(function({value:b,defaultValue:x,onValueChange:v,onValueCommitted:j,min:w=0,max:y=100,step:z=1,marks:N,label:_,description:k,showValue:C=!1,format:V,locale:A,orientation:M="horizontal",size:S,color:$,disabled:I=!1,name:B,"aria-label":L,className:R,style:T},F){const P=m(S),X=o($),Y=c(A),q="vertical"===M;u(Y);const D=d[P],E=t.useId(),G=b??x,H=Array.isArray(G)?G.length:1,J=t.useMemo(()=>{if(!N||y<=w)return[];if(!0!==N)return N.filter(e=>e.value>=w&&e.value<=y);const e=Math.floor((y-w)/z);return!Number.isFinite(e)||e<1||e>50?[]:Array.from({length:e+1},(e,a)=>({value:w+a*z}))},[N,w,y,z]),[K,O]=t.useState(x),Q=b??K,U=t.useMemo(()=>{const e=Array.isArray(Q)?Q:void 0===Q?[]:[Q];return 0===e.length?null:1===e.length?{from:w,to:e[0]}:{from:Math.min(...e),to:Math.max(...e)}},[Q,w]),W=e=>(e-w)/(y-w)*100+"%";return a(r.Root,{ref:F,value:b,defaultValue:x,onValueChange:e=>{void 0===b&&O(e),v?.(e)},onValueCommitted:e=>j?.(e),min:w,max:y,step:z,disabled:I,orientation:M,format:V,locale:p(Y),name:B,"data-mp-size":P,className:["mp-slider flex",q?"w-fit flex-col items-center gap-2":"w-full flex-col gap-1",I?"cursor-default":"",R??""].filter(Boolean).join(" "),style:{...s(X),...T},children:[i(_)||C?a("div",{className:["flex w-full items-baseline gap-2",l].join(" "),children:[i(_)?e(r.Label,{className:I?"text-mp-on-surface/38":"text-mp-on-surface-variant",children:_}):null,C?e(r.Value,{className:["ms-auto tabular-nums",I?"text-mp-on-surface/38":"text-mp-on-surface"].join(" ")}):null]}):null,e(r.Control,{className:["mp-slider__control group/rail flex touch-none items-center justify-center select-none",q?`${D.stripCross} h-40 flex-col`:`w-full ${D.strip}`,I?"":"cursor-pointer"].filter(Boolean).join(" "),children:a(r.Track,{className:["mp-slider__track rounded-mp-full relative",q?`${D.cross} h-full`:`${D.thickness} w-full`,I?"bg-mp-on-surface/12":"bg-mp-surface-container-highest"].join(" "),children:[e(r.Indicator,{className:["rounded-mp-full","[transition-property:inset-inline-start,width,bottom,height]",f,"group-data-dragging/rail:transition-none",I?"bg-mp-on-surface/38":"bg-(--_mp-accent)"].join(" ")}),J.map(a=>{const t=null!==U&&a.value>=U.from&&a.value<=U.to;return e("span",{"aria-hidden":"true",className:["mp-slider__tick pointer-events-none absolute rounded-full",h[P],I?"bg-mp-on-surface/38":t?"bg-(--_mp-on-accent)":"bg-mp-on-surface-variant"].join(" "),style:q?{bottom:W(a.value),insetInlineStart:"50%",transform:"translate(-50%, 50%)"}:{insetInlineStart:W(a.value),top:"50%",transform:"translate(-50%, -50%)"}},`tick:${a.value}`)}),Array.from({length:H},(a,t)=>e(r.Thumb,{index:t,"aria-label":i(_)?void 0:L,"aria-describedby":i(k)?E:void 0,className:["mp-slider__handle group rounded-mp-full relative outline-none","[transition-property:inset-inline-start,bottom]",f,"data-dragging:transition-none",D.handle,I?"bg-mp-on-surface/38 cursor-default":"bg-(--_mp-accent) cursor-grab active:cursor-grabbing"].join(" "),children:I?null:e(n,{layer:["top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 rounded-full",g[P],"bg-(--_mp-accent)"].join(" "),className:"group-data-dragging:opacity-16"})},t))]})}),J.some(e=>i(e.label))?e("div",{"aria-hidden":"true",className:["mp-slider__marks relative",l,q?"h-full":"w-full",I?"text-mp-on-surface/38":"text-mp-on-surface-variant"].join(" "),style:q?void 0:{height:"1lh"},children:J.map(a=>i(a.label)?e("span",{className:"absolute whitespace-nowrap",style:q?{bottom:W(a.value),transform:"translateY(50%)"}:{insetInlineStart:W(a.value),transform:"translateX(-50%)"},children:a.label},`label:${a.value}`):null)}):null,i(k)?e("div",{id:E,className:[l,I?"text-mp-on-surface/38":"text-mp-on-surface-variant"].join(" "),children:k}):null]})});

package/dist/components/snackbar/MPSnackbar.js

@@ -1,2 +1,2 @@
 "use client";
-import{jsx as t,jsxs as e}from"react/jsx-runtime";import*as o from"react";import{Toast as s}from"@base-ui/react/toast";import{MPIcon as i}from"../icon/MPIcon.js";import{CloseIcon as n}from"../../constants/icons.js";import{accentSlots as a}from"../../internal/accent.js";import{useMPLocale as r,useMPMessages as l}from"../../internal/locale.js";import{COMMON as m}from"../../internal/messages/common.js";import{MPStateLayer as c}from"../../internal/StateLayer.js";import{cssLength as p}from"../../internal/length.js";import{PORTAL_LAYER as d}from"../../internal/surface.js";import{useMPSize as u}from"../../internal/config.js";const f={"top-start":"top-0 items-start","top-center":"top-0 items-center","top-end":"top-0 items-end","bottom-start":"bottom-0 flex-col-reverse items-start","bottom-center":"bottom-0 flex-col-reverse items-center","bottom-end":"bottom-0 flex-col-reverse items-end"},b=/*@__PURE__*/["transition-[opacity,translate] duration-(--mp-sys-motion-duration-short4)","ease-mp-standard","data-starting-style:opacity-0 data-ending-style:opacity-0"].join(" "),x={top:"motion-safe:data-starting-style:-translate-y-full motion-safe:data-ending-style:-translate-y-full",bottom:"motion-safe:data-starting-style:translate-y-full motion-safe:data-ending-style:translate-y-full"},y={xs:"text-mp-body-small",sm:"text-mp-body-small",md:"text-mp-body-medium",lg:"text-mp-body-medium",xl:"text-mp-body-large"},h={xs:"min-h-9 gap-1.5 py-1.5 ps-3 pe-1.5",sm:"min-h-10 gap-2 py-2 ps-3.5 pe-2",md:"min-h-12 gap-2 py-2.5 ps-4 pe-2",lg:"min-h-14 gap-3 py-3 ps-5 pe-2.5",xl:"min-h-16 gap-3 py-3.5 pe-3 ps-6"},g={xs:16,sm:18,md:20,lg:22,xl:24};function v(t){const{color:e,icon:o,position:s,className:i,message:n,actionLabel:a,onAction:r,...l}=t;return{...l,title:n,data:{color:e,icon:o,position:s,className:i},actionProps:void 0===a?void 0:{children:a,onClick:r}}}export function useMPSnackbar(){const t=s.useToastManager();return o.useMemo(()=>({add:e=>t.add(v(e)),close:e=>t.close(e),update:(e,o)=>t.update(e,v(o)),promise:(e,o)=>t.promise(e,{loading:v(o.loading),success:t=>v("function"==typeof o.success?o.success(t):o.success),error:t=>v("function"==typeof o.error?o.error(t):o.error)}),snackbars:t.toasts}),[t])}function j({toast:o,color:r,size:l,showClose:m,closeLabel:p,swipeDirection:d,edge:u}){const f=o.data?.color??r,v=o.data?.icon,j={"--_mp-plate":f?`var(--_mp-color-${f}-container)`:"var(--_mp-color-inverse-surface)","--_mp-on-plate":f?`var(--_mp-color-on-${f}-container)`:"var(--_mp-color-inverse-on-surface)","--_mp-plate-action":f?`var(--_mp-color-${f})`:"var(--_mp-color-inverse-primary)",...f?a(f):null};return e(s.Root,{toast:o,swipeDirection:d,"data-mp-size":l,className:["mp-snackbar rounded-mp-xs shadow-mp-3 pointer-events-auto flex w-full items-center","bg-(--_mp-plate) text-(--_mp-on-plate) outline-none",h[l],y[l],b,x[u],"data-limited:hidden",o.data?.className??""].filter(Boolean).join(" "),style:j,children:[v?t("span",{className:"flex shrink-0 items-center",children:v}):null,t(s.Title,{render:t("span",{}),className:"min-w-0 flex-1 py-0.5 ps-1 [min-inline-size:min(280px,100%)]"}),t(s.Action,{className:["text-mp-label-large flex shrink-0 cursor-pointer items-center","rounded-mp-full h-8 px-3 text-(--_mp-plate-action)","transition-colors duration-(--mp-sys-motion-duration-short4)","hover:bg-(--_mp-plate-action)/8 focus-visible:bg-(--_mp-plate-action)/10","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-2","focus-visible:outline-solid outline-none"].join(" ")}),m?e(s.Close,{"aria-label":p,className:["group rounded-mp-full relative flex size-8 shrink-0 cursor-pointer","items-center justify-center text-(--_mp-on-plate)","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-2","focus-visible:outline-solid outline-none"].join(" "),children:[t(c,{}),t(i,{icon:n,size:g[l]})]}):null]})}const w=["top-start","top-center","top-end","bottom-start","bottom-center","bottom-end"];function _({position:e,fallback:o,width:i,...n}){const{toasts:a}=s.useToastManager(),r=a.filter(t=>(t.data?.position??o)===e),l=e.startsWith("top")?"top":"bottom",m=["top"===l?"up":"down","left","right"];return t(s.Portal,{children:t(s.Viewport,{className:[d,"pointer-events-none fixed inset-x-0 flex flex-col gap-2 p-4",f[e]].join(" "),children:r.map(e=>t("div",{className:"w-full",style:{maxWidth:p(i)},children:t(j,{toast:e,swipeDirection:m,edge:l,...n})},e.id))})})}export function MPSnackbarProvider({color:o,position:i="bottom-start",timeout:n=5e3,limit:a=3,width:c=600,size:p,showClose:d=!0,closeLabel:f,locale:b,children:x}){const y=u(p),h=r(b),g=l(m,h);return e(s.Provider,{timeout:n,limit:a,children:[x,w.map(e=>t(_,{position:e,fallback:i,width:c,color:o,size:y,showClose:d,closeLabel:f??g.close},e))]})}
+import{jsx as t,jsxs as e}from"react/jsx-runtime";import*as o from"react";import{Toast as s}from"@base-ui/react/toast";import{MPIcon as n}from"../icon/MPIcon.js";import{CloseIcon as i}from"../../constants/icons.js";import{accentSlots as a}from"../../internal/accent.js";import{useMPLocale as r,useMPMessages as l}from"../../internal/locale.js";import{COMMON as c}from"../../internal/messages/common.js";import{MPStateLayer as m}from"../../internal/StateLayer.js";import{cssLength as p}from"../../internal/length.js";import{PORTAL_LAYER as d}from"../../internal/surface.js";import{useMPSize as u}from"../../internal/config.js";const f={"top-start":"top-0 items-start","top-center":"top-0 items-center","top-end":"top-0 items-end","bottom-start":"bottom-0 flex-col-reverse items-start","bottom-center":"bottom-0 flex-col-reverse items-center","bottom-end":"bottom-0 flex-col-reverse items-end"},b=/*@__PURE__*/["transition-[opacity,translate] duration-(--mp-sys-motion-duration-short4)","ease-mp-standard","data-starting-style:opacity-0 data-ending-style:opacity-0"].join(" "),x={top:"motion-safe:data-starting-style:-translate-y-full motion-safe:data-ending-style:-translate-y-full",bottom:"motion-safe:data-starting-style:translate-y-full motion-safe:data-ending-style:translate-y-full"},h={xs:"text-mp-body-small",sm:"text-mp-body-small",md:"text-mp-body-medium",lg:"text-mp-body-medium",xl:"text-mp-body-large"},y={xs:"min-h-9 gap-1.5 py-1.5 ps-3 pe-1.5",sm:"min-h-10 gap-2 py-2 ps-3.5 pe-2",md:"min-h-12 gap-2 py-2.5 ps-4 pe-2",lg:"min-h-14 gap-3 py-3 ps-5 pe-2.5",xl:"min-h-16 gap-3 py-3.5 pe-3 ps-6"},g={xs:16,sm:18,md:20,lg:22,xl:24};function v(t){const{color:e,icon:o,position:s,className:n,message:i,actionLabel:a,onAction:r,...l}=t;return{...l,title:i,data:{color:e,icon:o,position:s,className:n},actionProps:void 0===a?void 0:{children:a,onClick:r}}}export function useMPSnackbar(){const t=s.useToastManager();return o.useMemo(()=>({add:e=>t.add(v(e)),close:e=>t.close(e),update:(e,o)=>t.update(e,v(o)),promise:(e,o)=>t.promise(e,{loading:v(o.loading),success:t=>v("function"==typeof o.success?o.success(t):o.success),error:t=>v("function"==typeof o.error?o.error(t):o.error)}),snackbars:t.toasts}),[t])}function j({toast:o,color:r,size:l,showClose:c,closeLabel:p,swipeDirection:d,edge:u}){const f=o.data?.color??r,v=o.data?.icon,j={"--_mp-plate":f?`var(--_mp-color-${f}-container)`:"var(--_mp-color-inverse-surface)","--_mp-on-plate":f?`var(--_mp-color-on-${f}-container)`:"var(--_mp-color-inverse-on-surface)","--_mp-plate-action":f?`var(--_mp-color-${f})`:"var(--_mp-color-inverse-primary)",...f?a(f):null};return e(s.Root,{toast:o,swipeDirection:d,"data-mp-size":l,className:["mp-snackbar rounded-mp-xs shadow-mp-3 pointer-events-auto flex w-full items-center","bg-(--_mp-plate) text-(--_mp-on-plate) outline-none",y[l],h[l],b,x[u],"data-limited:hidden",o.data?.className??""].filter(Boolean).join(" "),style:j,children:[v?t("span",{className:"flex shrink-0 items-center",children:v}):null,t(s.Title,{render:t("span",{}),className:"min-w-0 flex-1 py-0.5 ps-1 [min-inline-size:min(280px,100%)]"}),t(s.Action,{className:["text-mp-label-large flex shrink-0 cursor-pointer items-center","rounded-mp-full h-8 px-3 text-(--_mp-plate-action)","transition-colors duration-(--mp-sys-motion-duration-short4)","hover:bg-(--_mp-plate-action)/8 focus-visible:bg-(--_mp-plate-action)/10","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-2","focus-visible:outline-solid outline-none"].join(" ")}),c?e(s.Close,{"aria-label":p,className:["group rounded-mp-full relative flex size-8 shrink-0 cursor-pointer","items-center justify-center text-(--_mp-on-plate)","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-2","focus-visible:outline-solid outline-none"].join(" "),children:[t(m,{}),t(n,{icon:i,size:g[l]})]}):null]})}const _=["top-start","top-center","top-end","bottom-start","bottom-center","bottom-end"];function w({fallback:e,width:o,...n}){const{toasts:i}=s.useToastManager();return t(s.Portal,{children:t(s.Viewport,{className:`${d} pointer-events-none fixed inset-0`,children:_.map(s=>{const a=i.filter(t=>(t.data?.position??e)===s);if(0===a.length)return null;const r=s.startsWith("top")?"top":"bottom",l=["top"===r?"up":"down","left","right"];return t("div",{"data-mp-position":s,className:["mp-snackbar__stack pointer-events-none absolute inset-x-0 flex flex-col gap-2 p-4",f[s]].join(" "),children:a.map(e=>t("div",{className:"w-full",style:{maxWidth:p(o)},children:t(j,{toast:e,swipeDirection:l,edge:r,...n})},e.id))},s)})})})}export function MPSnackbarProvider({color:o,position:n="bottom-start",timeout:i=5e3,limit:a=3,width:m=600,size:p,showClose:d=!0,closeLabel:f,locale:b,children:x}){const h=u(p),y=r(b),g=l(c,y);return e(s.Provider,{timeout:i,limit:a,children:[x,t(w,{fallback:n,width:m,color:o,size:h,showClose:d,closeLabel:f??g.close})]})}

package/dist/components/sparkline/MPSparkline.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { MPChartCurve, MPColor, MPSize } from '../../types.js';
+import type { MPChartCurve, MPChartGaps, MPColor, MPSize } from '../../types.js';
 /** What the series is drawn as. */
 export type MPSparklineShape = 'line' | 'area' | 'bar';
 export interface MPSparklineProps extends Omit<React.ComponentPropsWithoutRef<'div'>, 'color' | 'children'> {
@@ -12,6 +12,19 @@ export interface MPSparklineProps extends Omit<React.ComponentPropsWithoutRef<'d
     shape?: MPSparklineShape;
     /** How the line between two points is drawn. @default 'linear' */
     curve?: MPChartCurve;
+    /**
+     * What the shape does where the series has no value.
+     *
+     * `break` stops and starts again, `connect` joins the two sides with a dashed
+     * run, and `zero` reads the missing point as a zero and opens the scale to
+     * hold it. The sentence this mark is read out as counts the readings it
+     * actually has, whichever is chosen.
+     *
+     * `bar` has no line to join, so it takes `zero` and reads `connect` as
+     * `break`.
+     * @default 'break'
+     */
+    gaps?: MPChartGaps;
     /**
      * Marks the newest point.
      *

package/dist/components/sparkline/MPSparkline.js

@@ -1,2 +1,2 @@
 "use client";
-import{jsx as e,Fragment as t,jsxs as r}from"react/jsx-runtime";import*as n from"react";import{numberFormatter as i}from"../../internal/intl.js";import{useMPLocale as l,useMPMessages as o}from"../../internal/locale.js";import{useMPSize as a}from"../../internal/config.js";import{fillMessage as s}from"../../internal/i18n.js";import{SPARKLINE as m}from"../../internal/messages/sparkline.js";import{TABLE as c}from"../../internal/messages/table.js";import{cssLength as p}from"../../internal/length.js";import{areaPath as f,barPath as h,extentOf as u,linePath as d,seriesColor as g}from"../../internal/chart.js";const b={xs:16,sm:24,md:32,lg:44,xl:56},k={xs:1.25,sm:1.5,md:2,lg:2.5,xl:3};export const MPSparkline=/*@__PURE__*/n.forwardRef(function({data:x,shape:j="line",curve:y="linear",endDot:v=!0,baseline:w,min:M,max:N,width:F="100%",height:L,color:$,label:z,locale:B,size:E,className:R,style:W,...A},D){const P=a(E),S=l(B),q=o(m,S),C=o(c,S),G=L??b[P],H=k[P],I=g(0,$),J=100,K=G,O="bar"===j?0:H/2,Q=u(x,M,N),T=Q.max-Q.min,U=e=>K-O-(e-Q.min)/T*(K-2*O),V=x.length>1?J/(x.length-1):0,X=x.map((e,t)=>null!==e&&Number.isFinite(e)?{x:x.length>1?t*V:50,y:U(e)}:null),Y=w??Q.min,Z=[...X].reverse().find(e=>null!==e)??null,_=n.useMemo(()=>{if(void 0!==z)return z;const e=x.filter(e=>null!==e&&Number.isFinite(e));if(0===e.length)return C.empty;const t=i(S);return s(q.summary,{count:t.format(e.length),first:t.format(e[0]),last:t.format(e[e.length-1])})},[z,x,S,q.summary,C.empty]);return e("div",{ref:D,"data-mp-size":P,className:["mp-sparkline block",R??""].filter(Boolean).join(" "),style:{width:p(F),...W},...A,children:r("svg",{role:"img","aria-label":_,viewBox:`0 0 100 ${K}`,preserveAspectRatio:"none",width:"100%",height:G,style:{display:"block",overflow:"visible"},children:["bar"===j?x.map((t,r)=>{if(null===t||!Number.isFinite(t))return null;const n=J/x.length,i=Math.max(.5,n-2),l=U(Y),o=U(t);return e("path",{d:h(r*n+(n-i)/2,Math.min(o,l),i,Math.abs(l-o),i/3,t>=Y?"top":"bottom"),fill:I,opacity:v&&r===x.length-1?1:.55},r)}):r(t,{children:["area"===j?e("path",{d:f(X,U(Y),y),fill:I,opacity:.16}):null,e("path",{d:d(X,y),fill:"none",stroke:I,strokeWidth:H,strokeLinecap:"round",strokeLinejoin:"round",vectorEffect:"non-scaling-stroke",opacity:.55})]}),v&&Z&&"bar"!==j?e("path",{d:`M${Z.x} ${Z.y}h0`,stroke:I,strokeWidth:2.5*H,strokeLinecap:"round",vectorEffect:"non-scaling-stroke"}):null]})})});
+import{jsx as e,Fragment as t,jsxs as r}from"react/jsx-runtime";import*as n from"react";import{numberFormatter as i}from"../../internal/intl.js";import{useMPLocale as l,useMPMessages as o}from"../../internal/locale.js";import{useMPSize as a}from"../../internal/config.js";import{fillMessage as s}from"../../internal/i18n.js";import{SPARKLINE as m}from"../../internal/messages/sparkline.js";import{TABLE as c}from"../../internal/messages/table.js";import{cssLength as p}from"../../internal/length.js";import{BRIDGE_DASH as f,areaPath as h,barPath as u,bridgePath as d,extentOf as g,linePath as k,seriesColor as b,withoutGaps as y}from"../../internal/chart.js";const x={xs:16,sm:24,md:32,lg:44,xl:56},j={xs:1.25,sm:1.5,md:2,lg:2.5,xl:3};export const MPSparkline=/*@__PURE__*/n.forwardRef(function({data:v,shape:w="line",curve:M="linear",gaps:N="break",endDot:F=!0,baseline:$,min:L,max:z,width:E="100%",height:W,color:B,label:D,locale:R,size:A,className:P,style:S,...q},C){const G=a(A),H=l(R),I=o(m,H),J=o(c,H),K=W??x[G],O=j[G],Q=b(0,B),T=100,U=K,V="bar"===w?0:O/2,X="zero"===N?v.map(e=>null!==e&&Number.isFinite(e)?e:0):v,Y=g(X,L,z),Z=Y.max-Y.min,_=e=>U-V-(e-Y.min)/Z*(U-2*V),ee=v.length>1?T/(v.length-1):0,te=X.map((e,t)=>null!==e&&Number.isFinite(e)?{x:v.length>1?t*ee:50,y:_(e)}:null),re="connect"===N&&"bar"!==w,ne=$??Y.min,ie=[...te].reverse().find(e=>null!==e)??null,le=n.useMemo(()=>{if(void 0!==D)return D;const e=v.filter(e=>null!==e&&Number.isFinite(e));if(0===e.length)return J.empty;const t=i(H);return s(I.summary,{count:t.format(e.length),first:t.format(e[0]),last:t.format(e[e.length-1])})},[D,v,H,I.summary,J.empty]);return e("div",{ref:C,"data-mp-size":G,className:["mp-sparkline block",P??""].filter(Boolean).join(" "),style:{width:p(E),...S},...q,children:r("svg",{role:"img","aria-label":le,viewBox:`0 0 100 ${U}`,preserveAspectRatio:"none",width:"100%",height:K,style:{display:"block",overflow:"visible"},children:["bar"===w?X.map((t,r)=>{if(null===t||!Number.isFinite(t))return null;const n=T/v.length,i=Math.max(.5,n-2),l=_(ne),o=_(t);return e("path",{d:u(r*n+(n-i)/2,Math.min(o,l),i,Math.abs(l-o),i/3,t>=ne?"top":"bottom"),fill:Q,opacity:F&&r===v.length-1?1:.55},r)}):r(t,{children:["area"===w?e("path",{d:h(re?y(te):te,_(ne),M),fill:Q,opacity:.16}):null,e("path",{d:k(te,M),fill:"none",stroke:Q,strokeWidth:O,strokeLinecap:"round",strokeLinejoin:"round",vectorEffect:"non-scaling-stroke",opacity:.55}),re?e("path",{d:d(te),fill:"none",stroke:Q,strokeWidth:O,strokeDasharray:`${O*f} ${O*f}`,strokeLinecap:"round",vectorEffect:"non-scaling-stroke",opacity:.55}):null]}),F&&ie&&"bar"!==w?e("path",{d:`M${ie.x} ${ie.y}h0`,stroke:Q,strokeWidth:2.5*O,strokeLinecap:"round",vectorEffect:"non-scaling-stroke"}):null]})})});

package/dist/components/switch/MPSwitch.js

@@ -1,2 +1,2 @@
 "use client";
-import{jsx as e,Fragment as t,jsxs as a}from"react/jsx-runtime";import*as r from"react";import{Switch as n}from"@base-ui/react/switch";import{Field as i}from"@base-ui/react/field";import{MPIcon as s}from"../icon/MPIcon.js";import{CheckIcon as o,CloseIcon as c}from"../../constants/icons.js";import{accentSlots as l}from"../../internal/accent.js";import{MPStateLayer as d}from"../../internal/StateLayer.js";import{MPSupportingText as h}from"../../internal/SupportingText.js";import{PROSE_TEXT as m,hasContent as p}from"../../internal/scale.js";import{useMPColor as u,useMPSize as f}from"../../internal/config.js";const g={xs:{track:"h-5 w-8",thumb:"start-[5px] size-2.5 data-checked:start-[15px] data-checked:size-3.5",halo:"size-8",glyph:8},sm:{track:"h-6 w-10",thumb:"start-1.5 size-3 data-checked:start-[19px] data-checked:size-[18px]",halo:"size-9",glyph:10},md:{track:"h-8 w-13",thumb:"start-2 size-4 data-checked:start-6 data-checked:size-6",halo:"size-10",glyph:14},lg:{track:"h-9 w-15",thumb:"start-[9px] size-[18px] data-checked:start-7 data-checked:size-7",halo:"size-11",glyph:16},xl:{track:"h-10 w-17",thumb:"start-2.5 size-5 data-checked:start-[33px] data-checked:size-[30px]",halo:"size-12",glyph:18}};export const MPSwitch=/*@__PURE__*/r.forwardRef(function({checked:k,defaultChecked:b,onCheckedChange:x,label:y,description:j,errorMessage:z,icons:w=!1,labelPlacement:N="end",size:_,color:C,required:M=!1,disabled:v=!1,readOnly:P=!1,name:R,id:S,fullWidth:W=!1,className:q,style:B},F){const I=f(_),L=u(C),O=p(z),T=O?"error":L,A=g[I],D=r.useId(),E=S??D,G=e("span",{className:"flex h-[1lh] shrink-0 items-center",children:e(n.Root,{ref:F,id:E,name:R,checked:k,defaultChecked:b,required:M,disabled:v,readOnly:P,onCheckedChange:e=>x?.(e),className:["mp-switch__track group relative box-border inline-flex shrink-0 p-0","rounded-mp-full appearance-none font-[inherit] outline-none","transition-[background-color,box-shadow]","duration-(--mp-sys-motion-duration-short4) ease-mp-standard",A.track,v?["bg-mp-surface-container-highest inset-ring-2 inset-ring-mp-on-surface/12","cursor-default","data-checked:bg-mp-on-surface/12 data-checked:inset-ring-0"].join(" "):[P?"cursor-default":"cursor-pointer","bg-mp-surface-container-highest inset-ring-2",O?"inset-ring-mp-error":"inset-ring-mp-outline","data-checked:inset-ring-0 data-checked:bg-(--_mp-accent)"].join(" ")].join(" "),children:a(n.Thumb,{className:["mp-switch__thumb absolute top-1/2 flex -translate-y-1/2 items-center justify-center","rounded-full","transition-[inset-inline-start,width,height,background-color]","duration-(--mp-sys-motion-duration-short4) ease-mp-standard",A.thumb,v?"bg-mp-on-surface/38 data-checked:bg-mp-surface-container-highest":[O?"bg-mp-error":"bg-mp-outline","data-checked:bg-(--_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",A.halo,"bg-mp-on-surface group-data-checked:bg-(--_mp-accent)"].join(" ")}),w?a(t,{children:[e("span",{className:["absolute inset-0 flex items-center justify-center","transition-opacity duration-(--mp-sys-motion-duration-short4)","ease-mp-standard opacity-0 group-data-checked:opacity-100",v?"text-mp-surface-container-highest":"text-(--_mp-accent)"].join(" "),children:e(s,{icon:o,size:A.glyph,strokeWidth:3})}),e("span",{className:["absolute inset-0 flex items-center justify-center","text-mp-surface-container-highest","transition-opacity duration-(--mp-sys-motion-duration-short4)","ease-mp-standard group-data-checked:opacity-0"].join(" "),children:e(s,{icon:c,size:A.glyph,strokeWidth:3})})]}):null]})})}),H=p(y)||p(j)||O?a("span",{className:["flex min-w-0 flex-col gap-0.5","start"===N?"flex-1":""].filter(Boolean).join(" "),children:[p(y)?a(i.Label,{htmlFor:E,className:["leading-[1.4]",v?"text-mp-on-surface/38 cursor-default":P?"text-mp-on-surface":"text-mp-on-surface cursor-pointer"].join(" "),children:[y,M?e("span",{"aria-hidden":"true",children:" *"}):null]}):null,e(h,{description:j,errorMessage:z})]}):null;return e(i.Root,{className:["mp-switch align-top",W?"flex w-full":"inline-flex",q??""].filter(Boolean).join(" "),disabled:v,invalid:O,"data-mp-size":I,style:{...l(T),...B},children:e("div",{className:["flex w-full items-start gap-3",m[I]].join(" "),children:a(t,"start"===N?{children:[H,G]}:{children:[G,H]})})})});
+import{jsx as e,Fragment as t,jsxs as a}from"react/jsx-runtime";import*as r from"react";import{Switch as n}from"@base-ui/react/switch";import{Field as i}from"@base-ui/react/field";import{MPIcon as s}from"../icon/MPIcon.js";import{CheckIcon as o,CloseIcon as c}from"../../constants/icons.js";import{accentSlots as l}from"../../internal/accent.js";import{MPStateLayer as d}from"../../internal/StateLayer.js";import{MPSupportingText as h}from"../../internal/SupportingText.js";import{PROSE_TEXT as m,hasContent as p}from"../../internal/scale.js";import{useMPColor as u,useMPSize as f}from"../../internal/config.js";const g={xs:{track:"h-5 w-8",thumb:"start-[5px] size-2.5 data-checked:start-[15px] data-checked:size-3.5",halo:"size-8",glyph:8},sm:{track:"h-6 w-10",thumb:"start-1.5 size-3 data-checked:start-[19px] data-checked:size-[18px]",halo:"size-9",glyph:10},md:{track:"h-8 w-13",thumb:"start-2 size-4 data-checked:start-6 data-checked:size-6",halo:"size-10",glyph:14},lg:{track:"h-9 w-15",thumb:"start-[9px] size-[18px] data-checked:start-7 data-checked:size-7",halo:"size-11",glyph:16},xl:{track:"h-10 w-17",thumb:"start-2.5 size-5 data-checked:start-[33px] data-checked:size-[30px]",halo:"size-12",glyph:18}};export const MPSwitch=/*@__PURE__*/r.forwardRef(function({checked:k,defaultChecked:b,onCheckedChange:x,label:y,description:j,errorMessage:z,icons:w=!1,labelPlacement:N="end",size:_,color:C,required:M=!1,disabled:v=!1,readOnly:P=!1,name:R,id:S,fullWidth:W=!1,className:q,style:B},I){const L=f(_),O=u(C),T=p(z),F=T?"error":O,A=g[L],D=r.useId(),E=S??D,G=e("span",{className:"flex h-[1lh] shrink-0 items-center",children:e(n.Root,{ref:I,id:E,name:R,checked:k,defaultChecked:b,required:M,disabled:v,readOnly:P,onCheckedChange:e=>x?.(e),className:["mp-switch__track group relative box-border inline-flex shrink-0 p-0","rounded-mp-full appearance-none font-[inherit] outline-none","transition-[background-color,box-shadow]","duration-(--mp-sys-motion-duration-short4) ease-mp-standard",A.track,v?["bg-mp-surface-container-highest inset-ring-2 inset-ring-mp-on-surface/12","cursor-default","data-checked:bg-mp-on-surface/12 data-checked:inset-ring-0"].join(" "):[P?"cursor-default":"cursor-pointer","bg-mp-surface-container-highest inset-ring-2",T?"inset-ring-mp-error":"inset-ring-mp-outline","data-checked:inset-ring-0 data-checked:bg-(--_mp-accent)"].join(" ")].join(" "),children:a(n.Thumb,{className:["mp-switch__thumb absolute top-1/2 flex -translate-y-1/2 items-center justify-center","rounded-full","transition-[inset-inline-start,width,height,background-color]","duration-(--mp-sys-motion-duration-short4) ease-mp-standard",A.thumb,v?"bg-mp-on-surface/38 data-checked:bg-mp-surface-container-highest":[T?"bg-mp-error":"bg-mp-outline","data-checked:bg-(--_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",A.halo,"bg-mp-on-surface group-data-checked:bg-(--_mp-accent)"].join(" ")}),w?a(t,{children:[e("span",{className:["absolute inset-0 flex items-center justify-center","transition-opacity duration-(--mp-sys-motion-duration-short4)","ease-mp-standard opacity-0 group-data-checked:opacity-100",v?"text-mp-surface-container-highest":"text-(--_mp-accent)"].join(" "),children:e(s,{icon:o,size:A.glyph,strokeWidth:3})}),e("span",{className:["absolute inset-0 flex items-center justify-center","text-mp-surface-container-highest","transition-opacity duration-(--mp-sys-motion-duration-short4)","ease-mp-standard group-data-checked:opacity-0"].join(" "),children:e(s,{icon:c,size:A.glyph,strokeWidth:3})})]}):null]})})}),H=p(y)||p(j)||T?a("span",{className:["flex min-w-0 flex-col gap-0.5","start"===N?"flex-1":""].filter(Boolean).join(" "),children:[p(y)?a(i.Label,{className:["leading-[1.4]",v?"text-mp-on-surface/38 cursor-default":P?"text-mp-on-surface":"text-mp-on-surface cursor-pointer"].join(" "),children:[y,M?e("span",{"aria-hidden":"true",children:" *"}):null]}):null,e(h,{description:j,errorMessage:z})]}):null;return e(i.Root,{className:["mp-switch align-top",W?"flex w-full":"inline-flex",q??""].filter(Boolean).join(" "),disabled:v,invalid:T,"data-mp-size":L,style:{...l(F),...B},children:e("div",{className:["flex w-full items-start gap-3",m[L]].join(" "),children:a(t,"start"===N?{children:[H,G]}:{children:[G,H]})})})});

package/dist/components/tabs/MPTabs.js

@@ -1,2 +1,2 @@
 "use client";
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as a from"react";import{Tabs as i}from"@base-ui/react/tabs";import{accentSlots as n}from"../../internal/accent.js";import{MPStateLayer as o}from"../../internal/StateLayer.js";import{CONTROL_GAP as r,hasContent as l,SHEET_GAP as s}from"../../internal/scale.js";import{useMPColor as c,useMPSize as u}from"../../internal/config.js";const d=/*@__PURE__*/a.createContext({variant:"primary",size:"md",iconPosition:"top",fullWidth:!1}),m={xs:"h-8",sm:"h-10",md:"h-12",lg:"h-14",xl:"h-16"},p={xs:"h-11",sm:"h-13",md:"h-16",lg:"h-18",xl:"h-20"},f={xs:"text-mp-label-medium",sm:"text-mp-label-large",md:"text-mp-title-small",lg:"text-mp-title-small",xl:"text-mp-title-medium"},h={xs:"px-3",sm:"px-3.5",md:"px-4",lg:"px-5",xl:"px-6"},b={xs:12,sm:14,md:16,lg:20,xl:24},v={xs:18,sm:20,md:24,lg:24,xl:28};function x(e,t,i,n=""){a.Children.toArray(e).forEach(e=>{if(!a.isValidElement(e))return void(l(e)&&t.push(e));if(e.type===a.Fragment)return void x(e.props.children,t,i,`${n}${String(e.key)}/`);const o=n?a.cloneElement(e,{key:`${n}${String(e.key)}`}):e;e.type===MPTabPanel?i.push(o):t.push(o)})}export const MPTabs=/*@__PURE__*/a.forwardRef(function({variant:o="primary",color:r,size:l,value:m,defaultValue:p,onValueChange:f,iconPosition:h,activateOnFocus:v=!1,loopFocus:y=!0,divider:w=!0,fullWidth:g=!1,className:_,style:j,children:P,"aria-label":k,...N},M){const z=c(r),C=u(l),R=h??("primary"===o?"top":"start"),$=a.useMemo(()=>({variant:o,size:C,iconPosition:R,fullWidth:g}),[o,C,R,g]),S=a.useRef(null),[W,E]=a.useState(null),F=a.useCallback(()=>{const e=S.current;if(!e)return;const t=e.scrollWidth-e.clientWidth,a=Math.abs(e.scrollLeft),i=t-a,n="rtl"===getComputedStyle(e).direction,o=(n?i:a)>1,r=(n?a:i)>1;E(o&&r?"both":o?"left":r?"right":null)},[]);a.useEffect(F),a.useEffect(()=>{const e=S.current;if(!e||"undefined"==typeof ResizeObserver)return;const t=new ResizeObserver(F);return t.observe(e),()=>t.disconnect()},[F]);const T=[],V=[];return x(P,T,V),e(d.Provider,{value:$,children:t(i.Root,{ref:M,value:m,defaultValue:p,onValueChange:e=>f?.(e),"data-mp-size":C,"data-mp-variant":o,className:["mp-tabs flex min-w-0 flex-col",s[C],_??""].filter(Boolean).join(" "),style:{...n(z),"--_mp-tab-inset":`${b[C]}px`,...j},...N,children:[t(i.List,{ref:S,"aria-label":k,activateOnFocus:v,loopFocus:y,"data-mp-overflow":W??void 0,onScroll:F,className:["mp-tabs__list relative flex shrink-0",w?"border-mp-outline-variant border-b":"",g?"w-full":"","overflow-x-auto overflow-y-hidden","[scrollbar-width:none] [&::-webkit-scrollbar]:hidden"].filter(Boolean).join(" "),children:[T,e(i.Indicator,{className:["mp-tabs__indicator pointer-events-none absolute bottom-0","bg-(--_mp-accent)","primary"===o?["h-0.75 rounded-t-full","left-[calc(var(--active-tab-left)_+_var(--_mp-tab-inset))]","w-[calc(var(--active-tab-width)_-_2_*_var(--_mp-tab-inset))]"].join(" "):"left-(--active-tab-left) h-0.5 w-(--active-tab-width)","[transition-property:left,width]","duration-(--mp-sys-motion-duration-short4) ease-mp-standard"].join(" ")})]}),V]})})});export const MPTab=/*@__PURE__*/a.forwardRef(function({value:n,icon:s,disabled:c=!1,className:u,children:b,...x},y){const{variant:w,size:g,iconPosition:_,fullWidth:j}=a.useContext(d),P="top"===_&&l(s);return t(i.Tab,{ref:y,value:n,disabled:c,className:["mp-tabs__tab group relative flex shrink-0 items-center justify-center","box-border appearance-none border-0 bg-transparent font-[inherit] whitespace-nowrap select-none","overflow-hidden outline-none","transition-[color] duration-(--mp-sys-motion-duration-short4) ease-mp-standard",P?`flex-col gap-1 ${p[g]}`:`flex-row ${m[g]}`,P?"":r[g],f[g],h[g],c?"text-mp-on-surface/38 cursor-default":["text-mp-on-surface-variant cursor-pointer","primary"===w?"data-active:text-(--_mp-accent)":"data-active:text-mp-on-surface"].join(" "),"outline-mp-secondary focus-visible:outline-2 focus-visible:-outline-offset-2","focus-visible:outline-solid",j?"flex-1":"",u??""].filter(Boolean).join(" "),...x,children:[c?null:e(o,{}),l(s)?e("span",{className:"relative flex shrink-0 items-center justify-center",style:{width:v[g],height:v[g]},children:s}):null,l(b)?e("span",{className:"relative truncate",children:b}):null]})});export const MPTabPanel=/*@__PURE__*/a.forwardRef(function({value:t,keepMounted:a=!1,className:n,children:o,...r},l){return e(i.Panel,{ref:l,value:t,keepMounted:a,className:["mp-tabs__panel text-mp-on-surface min-w-0 flex-1","rounded-mp-xs outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-2","focus-visible:outline-solid outline-none","transition-opacity duration-(--mp-sys-motion-duration-short4) ease-mp-standard","data-starting-style:opacity-0",n??""].filter(Boolean).join(" "),...r,children:o})});
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as n from"react";import{Tabs as a}from"@base-ui/react/tabs";import{accentSlots as r}from"../../internal/accent.js";import{MPStateLayer as i}from"../../internal/StateLayer.js";import{CONTROL_GAP as o,hasContent as l,SHEET_GAP as s}from"../../internal/scale.js";import{useMPColor as c,useMPSize as u}from"../../internal/config.js";const d=/*@__PURE__*/n.createContext({variant:"primary",size:"md",iconPosition:"top",fullWidth:!1}),m={xs:"h-8",sm:"h-10",md:"h-12",lg:"h-14",xl:"h-16"},f={xs:"h-11",sm:"h-13",md:"h-16",lg:"h-18",xl:"h-20"},p={xs:"text-mp-label-medium",sm:"text-mp-label-large",md:"text-mp-title-small",lg:"text-mp-title-small",xl:"text-mp-title-medium"},h={xs:"px-3",sm:"px-3.5",md:"px-4",lg:"px-5",xl:"px-6"},b={xs:12,sm:14,md:16,lg:20,xl:24},v={xs:18,sm:20,md:24,lg:24,xl:28};function x(e,t,a,r=""){n.Children.toArray(e).forEach(e=>{if(!n.isValidElement(e))return void(l(e)&&t.push(e));if(e.type===n.Fragment)return void x(e.props.children,t,a,`${r}${String(e.key)}/`);const i=r?n.cloneElement(e,{key:`${r}${String(e.key)}`}):e;e.type===MPTabPanel?a.push(i):t.push(i)})}export const MPTabs=/*@__PURE__*/n.forwardRef(function({variant:i="primary",color:o,size:l,value:m,defaultValue:f,onValueChange:p,iconPosition:h,activateOnFocus:v=!1,loopFocus:y=!0,divider:w=!0,fullWidth:g=!1,className:_,style:j,children:P,"aria-label":k,...M},N){const R=c(o),z=u(l),C=h??("primary"===i?"top":"start"),F=n.useMemo(()=>({variant:i,size:z,iconPosition:C,fullWidth:g}),[i,z,C,g]),$=n.useRef(null),[O,S]=n.useState(null),W=n.useCallback(()=>{const e=$.current;if(!e)return;const t=e.scrollWidth-e.clientWidth,n=Math.abs(e.scrollLeft),a=t-n,r="rtl"===getComputedStyle(e).direction,i=(r?a:n)>1,o=(r?n:a)>1;S(i&&o?"both":i?"left":o?"right":null)},[]);n.useEffect(()=>{const e=$.current;if(W(),!e)return;const t="undefined"==typeof ResizeObserver?null:new ResizeObserver(W),n=()=>{if(t){t.disconnect(),t.observe(e);for(const n of e.children)t.observe(n)}};n();const a="undefined"==typeof MutationObserver?null:new MutationObserver(()=>{n(),W()});return a?.observe(e,{childList:!0}),()=>{t?.disconnect(),a?.disconnect()}},[W]);const E=n.useRef(0);n.useEffect(()=>()=>cancelAnimationFrame(E.current),[]);const T=[],V=[];return x(P,T,V),e(d.Provider,{value:F,children:t(a.Root,{ref:N,value:m,defaultValue:f,onValueChange:e=>p?.(e),"data-mp-size":z,"data-mp-variant":i,className:["mp-tabs flex min-w-0 flex-col",s[z],_??""].filter(Boolean).join(" "),style:{...r(R),"--_mp-tab-inset":`${b[z]}px`,...j},...M,children:[t(a.List,{ref:$,"aria-label":k,activateOnFocus:v,loopFocus:y,"data-mp-overflow":O??void 0,onScroll:()=>{0===E.current&&(E.current=requestAnimationFrame(()=>{E.current=0,W()}))},className:["mp-tabs__list relative flex shrink-0",w?"border-mp-outline-variant border-b":"",g?"w-full":"","overflow-x-auto overflow-y-hidden","[scrollbar-width:none] [&::-webkit-scrollbar]:hidden"].filter(Boolean).join(" "),children:[T,e(a.Indicator,{className:["mp-tabs__indicator pointer-events-none absolute bottom-0","bg-(--_mp-accent)","primary"===i?["h-0.75 rounded-t-full","left-[calc(var(--active-tab-left)_+_var(--_mp-tab-inset))]","w-[calc(var(--active-tab-width)_-_2_*_var(--_mp-tab-inset))]"].join(" "):"left-(--active-tab-left) h-0.5 w-(--active-tab-width)","[transition-property:left,width]","duration-(--mp-sys-motion-duration-short4) ease-mp-standard"].join(" ")})]}),V]})})});export const MPTab=/*@__PURE__*/n.forwardRef(function({value:r,icon:s,disabled:c=!1,className:u,children:b,...x},y){const{variant:w,size:g,iconPosition:_,fullWidth:j}=n.useContext(d),P="top"===_&&l(s);return t(a.Tab,{ref:y,value:r,disabled:c,className:["mp-tabs__tab group relative flex shrink-0 items-center justify-center","box-border appearance-none border-0 bg-transparent font-[inherit] whitespace-nowrap select-none","overflow-hidden outline-none","transition-[color] duration-(--mp-sys-motion-duration-short4) ease-mp-standard",P?`flex-col gap-1 ${f[g]}`:`flex-row ${m[g]}`,P?"":o[g],p[g],h[g],c?"text-mp-on-surface/38 cursor-default":["text-mp-on-surface-variant cursor-pointer","primary"===w?"data-active:text-(--_mp-accent)":"data-active:text-mp-on-surface"].join(" "),"outline-mp-secondary focus-visible:outline-2 focus-visible:-outline-offset-2","focus-visible:outline-solid",j?"flex-1":"",u??""].filter(Boolean).join(" "),...x,children:[c?null:e(i,{}),l(s)?e("span",{className:"relative flex shrink-0 items-center justify-center",style:{width:v[g],height:v[g]},children:s}):null,l(b)?e("span",{className:"relative truncate",children:b}):null]})});export const MPTabPanel=/*@__PURE__*/n.forwardRef(function({value:t,keepMounted:n=!1,className:r,children:i,...o},l){return e(a.Panel,{ref:l,value:t,keepMounted:n,className:["mp-tabs__panel text-mp-on-surface min-w-0 flex-1","rounded-mp-xs outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-2","focus-visible:outline-solid outline-none","transition-opacity duration-(--mp-sys-motion-duration-short4) ease-mp-standard","data-starting-style:opacity-0",r??""].filter(Boolean).join(" "),...o,children:i})});

package/dist/components/text-field/MPTextField.js

@@ -1,2 +1,2 @@
 "use client";
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as o from"react";import{Field as n}from"@base-ui/react/field";import{MPIcon as r}from"../icon/MPIcon.js";import{MPFieldLabel as a,MPFieldOutline as i,useFloatingLabel as l}from"../../internal/FieldOutline.js";import{MPSupportingText as s}from"../../internal/SupportingText.js";import{VisibilityIcon as d,VisibilityOffIcon as p}from"../../constants/icons.js";import{useMPLocale as u,useMPMessages as c}from"../../internal/locale.js";import{TEXT_FIELD as m}from"../../internal/messages/text-field.js";import{useMPSize as f}from"../../internal/config.js";const x={xs:{padding:"px-2",control:"py-1.5",text:"text-mp-body-medium",icon:16},sm:{padding:"px-3",control:"py-2.5",text:"text-mp-body-medium",icon:18},md:{padding:"px-4",control:"py-4",text:"text-mp-body-large",icon:20},lg:{padding:"px-4",control:"py-5",text:"text-mp-body-large",icon:22},xl:{padding:"px-5",control:"py-6",text:"text-mp-body-large",icon:24}};export const MPTextField=/*@__PURE__*/o.forwardRef(function({value:b,name:g,type:y="text",placeholder:h,autoComplete:v,label:w,floatingLabel:C=!0,onChange:j,onFormReset:k,onSubmit:M,onKeyDown:z,onKeyUp:D,onFocus:F,onBlur:N,onClick:E,onDoubleClick:P,onContextMenu:S,errorMessage:B="",required:K=!1,fullWidth:q=!1,readOnly:L=!1,autoFocus:R=!1,size:U,disabled:I=!1,disableEnterKey:O=!1,rows:T,maxLength:$,startIcon:_,resizable:W=!1,id:A,locale:G,passwordLabels:H,className:J,style:Q},V){const X=f(U),Y=u(G),Z=c(m,Y,H),ee=o.useRef(null),[te,oe]=o.useState(!1),[ne,re]=o.useState(!1),[ae,ie]=o.useState(b),le=o.useId(),se=A??le,de=!!T,pe=B.length>0,ue=x[X],ce=ne?ae:b,{shrunk:me,focusProps:fe}=l({floating:C&&!!w,filled:ce.length>0,pinned:!!_}),xe=o.useCallback(e=>{ee.current=e,"function"==typeof V?V(e):V&&(V.current=e)},[V]),be=e=>{e.preventDefault()};return o.useEffect(()=>{ne||ie(b)},[b,ne]),o.useEffect(()=>{R&&!window.matchMedia("(max-width: 599.95px)").matches&&ee.current?.focus()},[]),t(n.Root,{className:["mp-text-field group relative",q?"w-full":"inline-block","align-top",J??""].filter(Boolean).join(" "),style:Q,disabled:I,invalid:pe,"data-mp-size":X,...fe,children:[t("div",{className:["relative flex w-full items-center gap-2",ue.padding,de?"py-2":""].filter(Boolean).join(" "),children:[e(i,{label:w,required:K,notched:me}),_?e("span",{className:"text-mp-on-surface-variant group-data-disabled:text-mp-on-surface/38 flex shrink-0 items-center",children:_}):null,e(n.Control,{render:de?e("textarea",{rows:T}):e("input",{}),id:se,name:g,type:de?void 0:te?"text":y,required:K,readOnly:L,disabled:I,autoComplete:v,placeholder:me?h:void 0,maxLength:$,value:ce,ref:xe,className:[`${ue.text} text-mp-on-surface w-full min-w-0 flex-1`,"font-[family-name:var(--mp-sys-typescale-body-large-font)]","appearance-none border-0 bg-transparent px-0 outline-none","caret-mp-primary",ue.control,de?"py-0":"",de&&W?"resize-y":"resize-none","search"===y?"[&::-webkit-search-cancel-button]:hidden":"","group-data-disabled:text-mp-on-surface/38","placeholder:text-mp-on-surface-variant group-data-disabled:placeholder:text-mp-on-surface/38"].filter(Boolean).join(" "),onChange:e=>{k?.();const t=e.target.value;ne&&ie(t),j?.(t)},onCompositionStart:()=>{re(!0),ie(b)},onCompositionUpdate:e=>{ie(e.target.value)},onCompositionEnd:e=>{re(!1);const t=e.target.value;k?.(),j?.(t),ie(t)},onKeyUp:D,onFocus:F,onBlur:N,onClick:E,onDoubleClick:P,onContextMenu:S,onKeyDown:e=>{if(z?.(e),!e.defaultPrevented&&"Enter"===e.key){if(function(e){const t=e.nativeEvent;return t.isComposing||229===t.keyCode}(e))return;M?.(),(O||M&&!de)&&e.preventDefault()}}}),"password"!==y||de?null:e("button",{type:"button","aria-label":te?Z.hidePassword:Z.showPassword,onClick:()=>oe(e=>!e),onMouseDown:be,onMouseUp:be,disabled:I,className:["text-mp-on-surface-variant -me-1 flex shrink-0 items-center justify-center","cursor-pointer appearance-none border-0 bg-transparent p-1 font-[inherit]","rounded-full","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-1","focus-visible:outline-solid outline-none","hover:text-mp-on-surface focus-visible:text-mp-primary","disabled:text-mp-on-surface/38 disabled:cursor-default"].join(" "),children:e(r,{icon:te?d:p,size:ue.icon})}),w?e(a,{size:X,label:w,required:K,htmlFor:se,shrunk:me,multiline:de}):null]}),e(s,{errorMessage:B,className:`mp-text-field__support mt-1 ${ue.padding}`})]})});
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as o from"react";import{Field as n}from"@base-ui/react/field";import{MPIcon as r}from"../icon/MPIcon.js";import{MPFieldLabel as a,MPFieldOutline as i,useFloatingLabel as l}from"../../internal/FieldOutline.js";import{MPSupportingText as s}from"../../internal/SupportingText.js";import{VisibilityIcon as d,VisibilityOffIcon as p}from"../../constants/icons.js";import{useMPLocale as u,useMPMessages as c}from"../../internal/locale.js";import{TEXT_FIELD as m}from"../../internal/messages/text-field.js";import{useMPSize as f}from"../../internal/config.js";const x={xs:{padding:"px-2",control:"py-1.5",text:"text-mp-body-medium",icon:16},sm:{padding:"px-3",control:"py-2.5",text:"text-mp-body-medium",icon:18},md:{padding:"px-4",control:"py-4",text:"text-mp-body-large",icon:20},lg:{padding:"px-4",control:"py-5",text:"text-mp-body-large",icon:22},xl:{padding:"px-5",control:"py-6",text:"text-mp-body-large",icon:24}};export const MPTextField=/*@__PURE__*/o.forwardRef(function({value:b,name:g,type:y="text",placeholder:h,autoComplete:v,label:w,floatingLabel:C=!0,onChange:j,onFormReset:k,onSubmit:M,onKeyDown:z,onKeyUp:D,onFocus:N,onBlur:E,onClick:F,onDoubleClick:P,onContextMenu:S,errorMessage:B="",required:K=!1,fullWidth:q=!1,readOnly:L=!1,autoFocus:R=!1,size:U,disabled:I=!1,disableEnterKey:O=!1,rows:T,maxLength:$,startIcon:_,resizable:W=!1,id:A,locale:G,passwordLabels:H,className:J,style:Q},V){const X=f(U),Y=u(G),Z=c(m,Y,H),ee=o.useRef(null),[te,oe]=o.useState(!1),[ne,re]=o.useState(!1),[ae,ie]=o.useState(b),le=o.useId(),se=A??le,de=!!T,pe=B.length>0,ue=x[X],ce=ne?ae:b,{shrunk:me,focusProps:fe}=l({floating:C&&!!w,filled:ce.length>0,pinned:!!_}),xe=o.useCallback(e=>{ee.current=e,"function"==typeof V?V(e):V&&(V.current=e)},[V]),be=e=>{e.preventDefault()};return o.useEffect(()=>{ne||ie(b)},[b,ne]),o.useEffect(()=>{R&&!window.matchMedia("(max-width: 599.95px)").matches&&ee.current?.focus()},[]),t(n.Root,{className:["mp-text-field group relative",q?"w-full":"inline-block","align-top",J??""].filter(Boolean).join(" "),style:Q,disabled:I,invalid:pe,"data-mp-size":X,...fe,children:[t("div",{className:["relative flex w-full items-center gap-2",ue.padding,de?"py-2":""].filter(Boolean).join(" "),children:[e(i,{label:w,required:K,notched:me}),_?e("span",{className:"text-mp-on-surface-variant group-data-disabled:text-mp-on-surface/38 flex shrink-0 items-center",children:_}):null,e(n.Control,{render:de?e("textarea",{rows:T}):e("input",{}),id:se,name:g,type:de?void 0:te?"text":y,required:K,readOnly:L,disabled:I,autoComplete:v,placeholder:me?h:void 0,maxLength:$,value:ce,ref:xe,className:[`${ue.text} text-mp-on-surface w-full min-w-0 flex-1`,"font-[family-name:var(--mp-sys-typescale-body-large-font)]","appearance-none border-0 bg-transparent px-0 outline-none","caret-mp-primary",ue.control,de?"py-0":"",de&&W?"resize-y":"resize-none","search"===y?"[&::-webkit-search-cancel-button]:hidden":"","group-data-disabled:text-mp-on-surface/38","placeholder:text-mp-on-surface-variant group-data-disabled:placeholder:text-mp-on-surface/38"].filter(Boolean).join(" "),onChange:e=>{k?.();const t=e.target.value;ne&&ie(t),j?.(t)},onCompositionStart:()=>{re(!0),ie(b)},onCompositionUpdate:e=>{ie(e.target.value)},onCompositionEnd:e=>{re(!1);const t=e.target.value;k?.(),j?.(t),ie(t)},onKeyUp:D,onFocus:N,onBlur:E,onClick:F,onDoubleClick:P,onContextMenu:S,onKeyDown:e=>{if(z?.(e),!e.defaultPrevented&&"Enter"===e.key){if(function(e){const t=e.nativeEvent;return t.isComposing||229===t.keyCode}(e))return;M?.(),(O||M&&!de)&&e.preventDefault()}}}),"password"!==y||de?null:e("button",{type:"button","aria-label":te?Z.hidePassword:Z.showPassword,onClick:()=>oe(e=>!e),onMouseDown:be,onMouseUp:be,disabled:I,className:["text-mp-on-surface-variant -me-1 flex shrink-0 items-center justify-center","cursor-pointer appearance-none border-0 bg-transparent p-1 font-[inherit]","rounded-full","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-1","focus-visible:outline-solid outline-none","hover:text-mp-on-surface focus-visible:text-mp-primary","disabled:text-mp-on-surface/38 disabled:cursor-default"].join(" "),children:e(r,{icon:te?d:p,size:ue.icon})}),w?e(a,{size:X,label:w,required:K,shrunk:me,multiline:de}):null]}),e(s,{errorMessage:B,className:`mp-text-field__support mt-1 ${ue.padding}`})]})});

package/dist/components/timeline-chart/MPTimelineChart.d.ts

@@ -1,8 +1,12 @@
 import * as React from 'react';
 import { type ChartBaseProps } from '../../internal/ChartChrome.js';
 import type { MPChartAxis, MPTimelineSeries } from '../../types.js';
-/** No `legend`: the rows are the axis, so there is nothing for one to identify. */
-export interface MPTimelineChartProps extends Omit<ChartBaseProps, 'legend'> {
+/**
+ * No `legend`: the rows are the axis, so there is nothing for one to identify.
+ * No `labelColor` either — with no legend to ink, the only text left is a span's
+ * own label, and that is written **on** the bar rather than beside it.
+ */
+export interface MPTimelineChartProps extends Omit<ChartBaseProps, 'legend' | 'labelColor'> {
     /** The rows, top to bottom. Each carries its own spans. */
     series: readonly MPTimelineSeries[];
     /** The row axis. */

package/dist/components/timeline-chart/MPTimelineChart.js

@@ -1,2 +1,2 @@
 "use client";
-import{jsx as a,jsxs as e}from"react/jsx-runtime";import*as t from"react";import{CartesianFrame as r}from"../../internal/ChartFrame.js";import{ChartTable as n}from"../../internal/ChartChrome.js";import{useMPLocale as o,useMPMessages as l}from"../../internal/locale.js";import{CHART as s}from"../../internal/messages/chart.js";import{TABLE as i}from"../../internal/messages/table.js";import{formatTimeTick as m,timeScale as p}from"../../internal/time-scale.js";import{BAR_RADIUS as c,CHART_FONT_SIZE as u,MARK_GAP as f,barPath as x,seriesColor as d,textWidth as h,toNumber as b}from"../../internal/chart.js";function g(a,e,t){return null!=a&&!1!==a&&""!==a&&("string"!=typeof a&&"number"!=typeof a||e>=h(String(a),t)+16)}export function MPTimelineChart({series:h,yAxis:y,xAxis:M,spanLabels:j=!0,...k}){const v=o(k.locale),$=l(s,v),C=l(i,v),P=t.useMemo(()=>h.map(a=>a.data.map(a=>{const e=b(a.start),t=b(a.end);return null===e||null===t?null:{from:Math.min(e,t),to:Math.max(e,t),span:a}}).filter(a=>null!==a)),[h]),S=P.flat(),A=S.length>0?{min:Math.min(...S.map(a=>a.from)),max:Math.max(...S.map(a=>a.to))}:null,_=p(A,{min:M?.min,max:M?.max,tickCount:M?.tickCount}),z=t.useCallback(a=>m(a,_.unit,v),[_.unit,v]),F=t.useMemo(()=>[{data:h.map(()=>0)}],[h]),N=h.map((a,e)=>a.name??String(e+1)),T=h.map((a,e)=>d(e,a.color));return a(r,{...k,series:F,categories:N,horizontal:!0,inset:!1,bandRatio:.62,scale:_,includeZero:!1,legend:!1,xAxis:y,yAxis:{...M,tickFormat:M?.tickFormat??(a=>z(Number(a)))},marks:({plot:a,band:e,valuePx:t,categoryPx:r})=>P.flatMap((n,o)=>n.map((n,l)=>{const s=t(n.from),i=t(n.to),m=a.top+r(o);return{series:o,index:l,x:(s+i)/2,y:m,r:e.band/2,rx:Math.max(1,Math.abs(i-s)/2),ry:e.band/2}})),markTooltip:a=>{const e=P[a.series]?.[a.index];return e?{heading:void 0===e.span.label||null===e.span.label?N[a.series]:`${N[a.series]} · ${String(e.span.label)}`,items:[{seriesIndex:a.series,color:e.span.color?d(0,e.span.color):T[a.series],value:e.to-e.from,formatted:`${z(e.from)} – ${z(e.to)}`}]}:null},table:e=>a(n,{id:e,caption:k.label??$.table,corner:y?.label??$.category,categories:N,names:[$.table],values:[P.map(a=>({value:a.length,label:a.map(a=>`${z(a.from)} – ${z(a.to)}`).join("; ")}))],format:a=>String(a),locale:v,empty:C.empty}),children:({plot:t,band:r,valuePx:n,categoryPx:o,activeMark:l,size:s})=>{const i=u[s]-1;return a("g",{className:"mp-timeline-chart__spans",children:P.map((s,m)=>s.map((s,p)=>{const u=n(s.from),h=n(s.to),b=Math.max(2,r.band-f),y=t.top+o(m)-b/2,M=Math.max(1,h-u),k=l?.series===m&&l?.index===p,v=s.span.color?d(0,s.span.color):T[m];return e("g",{children:[a("path",{d:x(u,y,M,b,c,"both"),fill:v,opacity:k?1:.85,stroke:k?"var(--_mp-color-on-surface)":"none",strokeWidth:k?1.5:0}),j&&g(s.span.label,M,i)?a("text",{x:u+8,y:t.top+o(m),dominantBaseline:"central",fill:"var(--_mp-color-surface)",fontSize:i,children:s.span.label}):null]},`${m}-${p}`)}))})}})}
+import{jsx as a,jsxs as e}from"react/jsx-runtime";import*as t from"react";import{CartesianFrame as r}from"../../internal/ChartFrame.js";import{ChartTable as n}from"../../internal/ChartChrome.js";import{useMPLocale as o,useMPMessages as l}from"../../internal/locale.js";import{CHART as s}from"../../internal/messages/chart.js";import{TABLE as i}from"../../internal/messages/table.js";import{formatTimeTick as m,timeScale as p}from"../../internal/time-scale.js";import{BAR_RADIUS as c,CHART_FONT_SIZE as u,MARK_GAP as f,barPath as x,bounds as d,seriesColor as b,textWidth as h,toNumber as g}from"../../internal/chart.js";function y(a,e,t){return null!=a&&!1!==a&&""!==a&&("string"!=typeof a&&"number"!=typeof a||e>=h(String(a),t)+16)}export function MPTimelineChart({series:h,yAxis:j,xAxis:M,spanLabels:k=!0,...v}){const $=o(v.locale),C=l(s,$),P=l(i,$),S=t.useMemo(()=>h.map(a=>a.data.map(a=>{const e=g(a.start),t=g(a.end);return null===e||null===t?null:{from:Math.min(e,t),to:Math.max(e,t),span:a}}).filter(a=>null!==a)),[h]),A=S.flat(),_=d(A.map(a=>a.from)),z=d(A.map(a=>a.to)),F=_&&z?{min:_.min,max:z.max}:null,N=p(F,{min:M?.min,max:M?.max,tickCount:M?.tickCount}),T=t.useCallback(a=>m(a,N.unit,$),[N.unit,$]),B=t.useMemo(()=>[{data:h.map(()=>0)}],[h]),I=h.map((a,e)=>a.name??String(e+1)),L=h.map((a,e)=>b(e,a.color));return a(r,{...v,series:B,categories:I,horizontal:!0,inset:!1,bandRatio:.62,scale:N,includeZero:!1,legend:!1,xAxis:j,yAxis:{...M,tickFormat:M?.tickFormat??(a=>T(Number(a)))},marks:({plot:a,band:e,valuePx:t,categoryPx:r})=>S.flatMap((n,o)=>n.map((n,l)=>{const s=t(n.from),i=t(n.to),m=a.top+r(o);return{series:o,index:l,x:(s+i)/2,y:m,r:e.band/2,rx:Math.max(1,Math.abs(i-s)/2),ry:e.band/2}})),markTooltip:a=>{const e=S[a.series]?.[a.index];return e?{heading:void 0===e.span.label||null===e.span.label?I[a.series]:`${I[a.series]} · ${String(e.span.label)}`,items:[{seriesIndex:a.series,color:e.span.color?b(0,e.span.color):L[a.series],value:e.to-e.from,formatted:`${T(e.from)} – ${T(e.to)}`}]}:null},table:e=>a(n,{id:e,caption:v.label??C.table,corner:j?.label??C.category,categories:I,names:[C.table],values:[S.map(a=>({value:a.length,label:a.map(a=>`${T(a.from)} – ${T(a.to)}`).join("; ")}))],format:a=>String(a),locale:$,empty:P.empty}),children:({plot:t,band:r,valuePx:n,categoryPx:o,activeMark:l,size:s})=>{const i=u[s]-1;return a("g",{className:"mp-timeline-chart__spans",children:S.map((s,m)=>s.map((s,p)=>{const u=n(s.from),d=n(s.to),h=Math.max(2,r.band-f),g=t.top+o(m)-h/2,j=Math.max(1,d-u),M=l?.series===m&&l?.index===p,v=s.span.color?b(0,s.span.color):L[m];return e("g",{children:[a("path",{d:x(u,g,j,h,c,"both"),fill:v,opacity:M?1:.85,stroke:M?"var(--_mp-color-on-surface)":"none",strokeWidth:M?1.5:0}),k&&y(s.span.label,j,i)?a("text",{x:u+8,y:t.top+o(m),dominantBaseline:"central",fill:"var(--_mp-color-surface)",fontSize:i,children:s.span.label}):null]},`${m}-${p}`)}))})}})}

package/dist/components/tour/MPTour.js

@@ -1,2 +1,2 @@
 "use client";
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as n from"react";import{Popover as o}from"@base-ui/react/popover";import{MPButton as i}from"../button/MPButton.js";import{MPIcon as r}from"../icon/MPIcon.js";import{CloseIcon as s}from"../../constants/icons.js";import{accentSlots as l}from"../../internal/accent.js";import{useMPColor as a,useMPSize as c}from"../../internal/config.js";import{fillMessage as m}from"../../internal/i18n.js";import{useMPLocale as u,useMPMessages as p}from"../../internal/locale.js";import{COMMON as d}from"../../internal/messages/common.js";import{TOUR as f}from"../../internal/messages/tour.js";import{CONTROL_ICON as h,META_TEXT as g,PROSE_TEXT as x,SHEET_GAP as v,SHEET_PAD as j,SHEET_TITLE as b,hasContent as w}from"../../internal/scale.js";import{MPStateLayer as N}from"../../internal/StateLayer.js";import{FADE as y,PORTAL_LAYER as S}from"../../internal/surface.js";import{VISUALLY_HIDDEN as k}from"../../internal/visually-hidden.js";const _={xs:"max-w-56",sm:"max-w-64",md:"max-w-80",lg:"max-w-96",xl:"max-w-md"},B={xs:"xs",sm:"xs",md:"sm",lg:"sm",xl:"md"};function z({spot:t,className:n}){return e("div",null===t?{"aria-hidden":"true",className:["mp-tour__scrim bg-mp-scrim/32 pointer-events-none fixed inset-0 z-40",n??""].filter(Boolean).join(" ")}:{"aria-hidden":"true",className:["mp-tour__scrim rounded-mp-xs pointer-events-none fixed z-40","shadow-[0_0_0_9999px_color-mix(in_oklab,var(--_mp-color-scrim)_32%,transparent)]","transition-[top,left,width,height] duration-(--mp-sys-motion-duration-medium1)","ease-mp-standard motion-reduce:transition-none",n??""].filter(Boolean).join(" "),style:{top:t.top,left:t.left,width:t.width,height:t.height}})}export function MPTour({steps:C,open:M,defaultOpen:P=!1,onOpenChange:$,step:O,defaultStep:R=0,onStepChange:q,onFinish:E,scrim:F=!0,skippable:I=!0,dismissible:T=!0,scrollIntoView:A=!0,locale:D,labels:H,size:L,color:V,className:W,style:G,classNames:J}){const K=c(L),Q=a(V),U=u(D),X=p(f,U,H),Y=p(d,U),[Z,ee]=n.useState(P),[te,ne]=n.useState(R),oe=M??Z,ie=Math.min(O??te,Math.max(0,C.length-1)),re=C[ie],[se,le]=n.useState(null),[ae,ce]=n.useState(""),me=n.useRef(ie);n.useEffect(()=>{if(!oe)return me.current=ie,void ce("");if(me.current===ie)return;me.current=ie;const e=m(X.position,{index:String(ie+1),total:String(C.length)}),t=C[ie]?.title;ce("string"==typeof t&&""!==t?`${e}. ${t}`:e)},[oe,ie,C,X.position]);const ue=e=>{void 0===M&&ee(e),$?.(e)},pe=e=>{void 0===O&&ne(e),q?.(e)},de=re?.target,fe=re?.padding??6;if(n.useEffect(()=>{if(!oe||!de)return;const e=document.querySelector(de);if(!(e instanceof HTMLElement))return;A&&e.scrollIntoView({block:"center",inline:"nearest",behavior:"smooth"});let t=0,n="";const o=()=>{const i=e.getBoundingClientRect(),r=`${i.top} ${i.left} ${i.width} ${i.height}`;r!==n&&(n=r,le({selector:de,spot:{top:i.top-fe,left:i.left-fe,width:i.width+2*fe,height:i.height+2*fe}})),t=requestAnimationFrame(o)};return o(),()=>cancelAnimationFrame(t)},[oe,de,fe,A]),0===C.length)return null;const he=oe&&de&&se?.selector===de?se.spot:null,ge=0===ie,xe=ie===C.length-1,ve=B[K],je=w(re?.title)||w(re?.content);return t(o.Root,{open:oe,onOpenChange:(e,t)=>{e?ue(!0):"outside-press"===t.reason||"focus-out"===t.reason||"escape-key"===t.reason&&!T?t.cancel():ue(!1)},children:[oe&&F?e(z,{spot:he,className:J?.scrim}):null,e(o.Portal,{children:e(o.Positioner,{className:S,side:re?.side??"bottom",align:re?.align??"center",sideOffset:de?10:0,collisionPadding:12,anchor:()=>de?document.querySelector(de):{getBoundingClientRect:()=>new DOMRect(window.innerWidth/2,window.innerHeight/2,0,0)},children:t(o.Popup,{"data-mp-size":K,className:["mp-tour rounded-mp-md relative box-border flex flex-col outline-none","bg-mp-surface-container text-mp-on-surface shadow-mp-3",j[K],v[K],x[K],_[K],y,W??""].filter(Boolean).join(" "),style:{...l(Q),...G},children:[je?t("div",{className:"flex items-start gap-3",children:[t("div",{className:"flex min-w-0 flex-1 flex-col gap-1",children:[w(re?.title)?e(o.Title,{className:["text-mp-on-surface m-0 font-medium",b[K],J?.title??""].filter(Boolean).join(" "),children:re?.title}):null,w(re?.content)?e(o.Description,{className:["text-mp-on-surface-variant m-0 min-w-0",J?.content??""].filter(Boolean).join(" "),children:re?.content}):null]}),T?t("button",{type:"button","aria-label":Y.close,onClick:()=>ue(!1),className:["group/close rounded-mp-full text-mp-on-surface-variant relative -me-1 -mt-1","flex size-8 shrink-0 cursor-pointer items-center justify-center","appearance-none border-0 bg-transparent font-[inherit]","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-1","focus-visible:outline-solid outline-none",J?.close??""].filter(Boolean).join(" "),children:[e(N,{className:"group-hover/close:opacity-8 group-focus-visible/close:opacity-10"}),e(r,{icon:s,size:h[K]})]}):null]}):null,e("span",{className:k,"aria-live":"polite",children:ae}),t("div",{className:["flex items-center gap-2",J?.footer??""].filter(Boolean).join(" "),children:[e("span",{className:`text-mp-on-surface-variant shrink-0 tabular-nums ${g}`,children:m(X.position,{index:String(ie+1),total:String(C.length)})}),t("div",{className:"ms-auto flex items-center gap-1",children:[I&&!xe?e(i,{size:ve,variant:"text",color:"secondary",onClick:()=>ue(!1),children:X.skip}):null,ge?null:e(i,{size:ve,variant:"outlined",color:Q,onClick:()=>pe(ie-1),children:X.previous}),e(i,{size:ve,color:Q,onClick:()=>xe?(E?.(),void ue(!1)):pe(ie+1),children:xe?X.done:X.next})]})]})]})})})]})}
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as n from"react";import{Popover as o}from"@base-ui/react/popover";import{MPButton as i}from"../button/MPButton.js";import{MPIcon as r}from"../icon/MPIcon.js";import{CloseIcon as s}from"../../constants/icons.js";import{accentSlots as l}from"../../internal/accent.js";import{useMPColor as a,useMPSize as c}from"../../internal/config.js";import{fillMessage as m}from"../../internal/i18n.js";import{useMPLocale as p,useMPMessages as u}from"../../internal/locale.js";import{COMMON as d}from"../../internal/messages/common.js";import{TOUR as f}from"../../internal/messages/tour.js";import{CONTROL_ICON as h,META_TEXT as g,PROSE_TEXT as x,SHEET_GAP as v,SHEET_PAD as j,SHEET_TITLE as w,hasContent as b}from"../../internal/scale.js";import{MPStateLayer as y}from"../../internal/StateLayer.js";import{FADE as N,PORTAL_LAYER as S}from"../../internal/surface.js";import{VISUALLY_HIDDEN as k}from"../../internal/visually-hidden.js";const $={xs:"max-w-56",sm:"max-w-64",md:"max-w-80",lg:"max-w-96",xl:"max-w-md"},_={xs:"xs",sm:"xs",md:"sm",lg:"sm",xl:"md"};function B({spot:t,className:n,holeRef:o}){return e("div",null===t?{"aria-hidden":"true",className:["mp-tour__scrim bg-mp-scrim/32 pointer-events-none fixed inset-0 z-40",n??""].filter(Boolean).join(" ")}:{ref:o,"aria-hidden":"true",className:["mp-tour__scrim rounded-mp-xs pointer-events-none fixed z-40","shadow-[0_0_0_9999px_color-mix(in_oklab,var(--_mp-color-scrim)_32%,transparent)]","transition-[top,left,width,height] duration-(--mp-sys-motion-duration-medium1)","ease-mp-standard motion-reduce:transition-none",n??""].filter(Boolean).join(" "),style:{top:t.top,left:t.left,width:t.width,height:t.height}})}export function MPTour({steps:z,open:C,defaultOpen:R=!1,onOpenChange:M,step:P,defaultStep:O=0,onStepChange:q,onFinish:E,scrim:F=!0,skippable:I=!0,dismissible:T=!0,scrollIntoView:A=!0,locale:D,labels:H,size:L,color:V,className:W,style:G,classNames:J}){const K=c(L),Q=a(V),U=p(D),X=u(f,U,H),Y=u(d,U),[Z,ee]=n.useState(R),[te,ne]=n.useState(O),oe=C??Z,ie=Math.min(P??te,Math.max(0,z.length-1)),re=z[ie],[se,le]=n.useState(null),ae=n.useRef(null),[ce,me]=n.useState(""),pe=n.useRef(ie);n.useEffect(()=>{if(!oe)return pe.current=ie,void me("");if(pe.current===ie)return;pe.current=ie;const e=m(X.position,{index:String(ie+1),total:String(z.length)}),t=z[ie]?.title;me("string"==typeof t&&""!==t?`${e}. ${t}`:e)},[oe,ie,z,X.position]);const ue=e=>{void 0===C&&ee(e),M?.(e)},de=e=>{void 0===P&&ne(e),q?.(e)},fe=re?.target,he=re?.padding??6;if(n.useEffect(()=>{if(!oe||!fe)return;const e=document.querySelector(fe);if(!(e instanceof HTMLElement))return;A&&e.scrollIntoView({block:"center",inline:"nearest",behavior:"smooth"});let t=0,n="",o=!1;const i=()=>{const r=e.getBoundingClientRect(),s=`${r.top} ${r.left} ${r.width} ${r.height}`;if(s!==n){n=s;const e={top:r.top-he,left:r.left-he,width:r.width+2*he,height:r.height+2*he},t=ae.current;o&&t?(t.style.top=`${e.top}px`,t.style.left=`${e.left}px`,t.style.width=`${e.width}px`,t.style.height=`${e.height}px`):(o=!0,le({selector:fe,spot:e}))}t=requestAnimationFrame(i)};return i(),()=>cancelAnimationFrame(t)},[oe,fe,he,A]),0===z.length)return null;const ge=oe&&fe&&se?.selector===fe?se.spot:null,xe=0===ie,ve=ie===z.length-1,je=_[K],we=b(re?.title)||b(re?.content);return t(o.Root,{open:oe,onOpenChange:(e,t)=>{e?ue(!0):"outside-press"===t.reason||"focus-out"===t.reason||"escape-key"===t.reason&&!T?t.cancel():ue(!1)},children:[oe&&F?e(B,{spot:ge,className:J?.scrim,holeRef:ae}):null,e(o.Portal,{children:e(o.Positioner,{className:S,side:re?.side??"bottom",align:re?.align??"center",sideOffset:fe?10:0,collisionPadding:12,anchor:()=>fe?document.querySelector(fe):{getBoundingClientRect:()=>new DOMRect(window.innerWidth/2,window.innerHeight/2,0,0)},children:t(o.Popup,{"data-mp-size":K,className:["mp-tour rounded-mp-md relative box-border flex flex-col outline-none","bg-mp-surface-container text-mp-on-surface shadow-mp-3",j[K],v[K],x[K],$[K],N,W??""].filter(Boolean).join(" "),style:{...l(Q),...G},children:[we?t("div",{className:"flex items-start gap-3",children:[t("div",{className:"flex min-w-0 flex-1 flex-col gap-1",children:[b(re?.title)?e(o.Title,{className:["text-mp-on-surface m-0 font-medium",w[K],J?.title??""].filter(Boolean).join(" "),children:re?.title}):null,b(re?.content)?e(o.Description,{className:["text-mp-on-surface-variant m-0 min-w-0",J?.content??""].filter(Boolean).join(" "),children:re?.content}):null]}),T?t("button",{type:"button","aria-label":Y.close,onClick:()=>ue(!1),className:["group/close rounded-mp-full text-mp-on-surface-variant relative -me-1 -mt-1","flex size-8 shrink-0 cursor-pointer items-center justify-center","appearance-none border-0 bg-transparent font-[inherit]","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-1","focus-visible:outline-solid outline-none",J?.close??""].filter(Boolean).join(" "),children:[e(y,{className:"group-hover/close:opacity-8 group-focus-visible/close:opacity-10"}),e(r,{icon:s,size:h[K]})]}):null]}):null,e("span",{className:k,"aria-live":"polite",children:ce}),t("div",{className:["flex items-center gap-2",J?.footer??""].filter(Boolean).join(" "),children:[e("span",{className:`text-mp-on-surface-variant shrink-0 tabular-nums ${g}`,children:m(X.position,{index:String(ie+1),total:String(z.length)})}),t("div",{className:"ms-auto flex items-center gap-1",children:[I&&!ve?e(i,{size:je,variant:"text",color:"secondary",onClick:()=>ue(!1),children:X.skip}):null,xe?null:e(i,{size:je,variant:"outlined",color:Q,onClick:()=>de(ie-1),children:X.previous}),e(i,{size:je,color:Q,onClick:()=>ve?(E?.(),void ue(!1)):de(ie+1),children:ve?X.done:X.next})]})]})]})})})]})}

package/dist/components/transfer/MPTransfer.js

@@ -1,2 +1,2 @@
 "use client";
-import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as t from"react";import{MPBox as l}from"../box/MPBox.js";import{MPCheckbox as r}from"../checkbox/MPCheckbox.js";import{MPIcon as s}from"../icon/MPIcon.js";import{MPIconButton as i}from"../icon-button/MPIconButton.js";import{MPTextField as n}from"../text-field/MPTextField.js";import{ArrowRightIcon as o}from"../../constants/icons.js";import{useMPLocale as c,useMPMessages as m}from"../../internal/locale.js";import{cssLength as d}from"../../internal/length.js";import{TRANSFER as u}from"../../internal/messages/transfer.js";import{fillMessage as h}from"../../internal/i18n.js";import{VISUALLY_HIDDEN as f}from"../../internal/visually-hidden.js";import{useMPColor as p,useMPSize as v}from"../../internal/config.js";import{hasContent as g,META_TEXT as b,SHEET_PAD_X as x}from"../../internal/scale.js";const w={xs:"py-1",sm:"py-1.5",md:"py-2",lg:"py-2.5",xl:"py-3"},k={xs:"py-0.5",sm:"py-1",md:"py-1",lg:"py-1.5",xl:"py-2"},S=new Set;function j({title:s,rows:i,total:o,ticked:c,arrived:m,onTick:d,onTickAll:u,search:h,onSearch:f,searchable:p,disabled:v,height:g,messages:S,variant:j,size:y,color:N}){const T=i.filter(e=>!e.disabled),z=T.filter(e=>c.has(e.value)),C=T.length>0&&z.length===T.length,$=z.length>0&&!C,_=x[y],M=t.useId();return a(l,{variant:j,size:y,padded:!1,className:"mp-transfer__panel flex min-w-0 flex-col overflow-hidden",children:[a("div",{className:["mp-transfer__heading border-mp-outline-variant flex items-center gap-2 border-b",_,w[y]].join(" "),children:[e("div",{className:"min-w-0 flex-1",children:e(r,{size:y,color:N,checked:C,indeterminate:$,disabled:v||0===T.length,label:e("span",{id:M,className:"block truncate font-medium",children:s}),onCheckedChange:e=>u(e)})}),a("span",{className:`text-mp-on-surface-variant shrink-0 tabular-nums ${b}`,children:[z.length,"/",o]})]}),p?e("div",{className:`${_} ${w[y]}`,children:e(n,{size:y,fullWidth:!0,disabled:v,placeholder:S.search,"aria-label":S.search,value:h,onChange:f})}):null,e("div",{role:"group","aria-labelledby":M,className:`mp-transfer__list flex flex-col overflow-y-auto overscroll-contain ${_} ${w[y]}`,style:{height:g},children:0===i.length?e("span",{className:`text-mp-on-surface-variant ${b} ${k[y]}`,children:S.empty}):i.map((a,t)=>e("div",{className:[k[y],m.has(a.value)?"mp-row-arrive":""].filter(Boolean).join(" "),children:e(r,{size:y,color:N,label:a.label,checked:c.has(a.value),disabled:v||a.disabled,onCheckedChange:e=>d(a.value,e)})},`${t}:${a.value}`))})]})}function y(e,a){if(""===a)return e;const t=a.toLowerCase();return e.filter(e=>"string"!=typeof e.label||e.label.toLowerCase().includes(t))}export const MPTransfer=/*@__PURE__*/t.forwardRef(function({items:l,value:r,defaultValue:n,onValueChange:b,sourceLabel:x,targetLabel:w,searchable:k=!1,height:N=220,disabled:T=!1,variant:z="outlined",size:C,color:$,locale:_,labels:M,className:P,...B},L){const A=v(C),I=p($),V=c(_),E=m(u,V,M),[F,R]=t.useState(n??[]),W=r??F,[q,D]=t.useState(()=>new Set),[G,H]=t.useState(()=>({values:new Set,toTarget:!0})),[J,K]=t.useState(""),[O,Q]=t.useState(""),[U,X]=t.useState(null),Y=t.useMemo(()=>new Set(W),[W]),Z=l.filter(e=>!Y.has(e.value)),ee=l.filter(e=>Y.has(e.value));t.useEffect(()=>{const e=new Set(l.map(e=>e.value));D(a=>{const t=[...a].filter(a=>e.has(a));return t.length===a.size?a:new Set(t)})},[l]);const ae=(e,a)=>{D(t=>{const l=new Set(t);return a?l.add(e):l.delete(e),l})},te=(e,a)=>{D(t=>{const l=new Set(t);for(const t of e)t.disabled||(a?l.add(t.value):l.delete(t.value));return l})},le=(e,a)=>{const t=e.filter(e=>!e.disabled&&q.has(e.value));if(0===t.length)return;const s=new Set(t.map(e=>e.value)),i=a?l.filter(e=>Y.has(e.value)||s.has(e.value)).map(e=>e.value):W.filter(e=>!s.has(e));D(e=>new Set([...e].filter(e=>!s.has(e)))),H({values:s,toTarget:a}),X(e=>{return{tick:(e?.tick??0)+1,text:h(E.moved,{count:String(t.length),list:(l=a?w:x,r=a?E.target:E.source,"string"==typeof l&&""!==l?l:r)})};var l,r}),(e=>{void 0===r&&R(e),b?.(e)})(i)},re=y(Z,J),se=y(ee,O),ie=re.some(e=>!e.disabled&&q.has(e.value)),ne=se.some(e=>!e.disabled&&q.has(e.value)),oe=d(N),ce={ticked:q,disabled:T,height:oe,messages:E,variant:z,size:A,color:I,searchable:k};return a("div",{ref:L,"data-mp-size":A,className:["mp-transfer grid w-full items-center gap-3","[grid-template-columns:minmax(0,1fr)]","mp-medium:[grid-template-columns:minmax(0,1fr)_auto_minmax(0,1fr)]",P??""].filter(Boolean).join(" "),...B,children:[e(j,{...ce,title:g(x)?x:E.source,rows:re,total:Z.length,arrived:G.toTarget?S:G.values,onTick:ae,onTickAll:e=>te(re,e),search:J,onSearch:K}),a("div",{className:"flex flex-row justify-center gap-2 mp-medium:flex-col",children:[e(i,{size:A,color:I,variant:"text"===z?"text":"outlined",label:E.toTarget,disabled:T||!ie,onClick:()=>le(re,!0),icon:e(s,{icon:o,className:"rotate-90 mp-medium:rotate-0"})}),e(i,{size:A,color:I,variant:"text"===z?"text":"outlined",label:E.toSource,disabled:T||!ne,onClick:()=>le(se,!1),icon:e(s,{icon:o,className:"-rotate-90 mp-medium:rotate-180"})})]}),e("span",{className:f,"aria-live":"polite","aria-atomic":"true",children:U?e("span",{children:U.text},U.tick):null}),e(j,{...ce,title:g(w)?w:E.target,rows:se,total:ee.length,arrived:G.toTarget?G.values:S,onTick:ae,onTickAll:e=>te(se,e),search:O,onSearch:Q})]})});
+import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as t from"react";import{MPBox as l}from"../box/MPBox.js";import{MPCheckbox as r}from"../checkbox/MPCheckbox.js";import{MPIcon as s}from"../icon/MPIcon.js";import{MPIconButton as i}from"../icon-button/MPIconButton.js";import{MPTextField as n}from"../text-field/MPTextField.js";import{ArrowRightIcon as o}from"../../constants/icons.js";import{useMPLocale as c,useMPMessages as m}from"../../internal/locale.js";import{cssLength as d}from"../../internal/length.js";import{TRANSFER as u}from"../../internal/messages/transfer.js";import{fillMessage as h}from"../../internal/i18n.js";import{VISUALLY_HIDDEN as f}from"../../internal/visually-hidden.js";import{useMPColor as p,useMPSize as v}from"../../internal/config.js";import{hasContent as g,META_TEXT as b,SHEET_PAD_X as x}from"../../internal/scale.js";import{occurrenceKeys as w}from"../../internal/occurrence.js";const j={xs:"py-1",sm:"py-1.5",md:"py-2",lg:"py-2.5",xl:"py-3"},k={xs:"py-0.5",sm:"py-1",md:"py-1",lg:"py-1.5",xl:"py-2"},S=new Set;function y({title:s,rows:i,total:o,ticked:c,arrived:m,onTick:d,onTickAll:u,search:h,onSearch:f,searchable:p,disabled:v,height:g,messages:S,variant:y,size:N,color:T}){const z=i.filter(e=>!e.disabled),C=t.useMemo(()=>w(i,e=>e.value),[i]),M=z.filter(e=>c.has(e.value)),_=z.length>0&&M.length===z.length,$=M.length>0&&!_,P=x[N],B=t.useId();return a(l,{variant:y,size:N,padded:!1,className:"mp-transfer__panel flex min-w-0 flex-col overflow-hidden",children:[a("div",{className:["mp-transfer__heading border-mp-outline-variant flex items-center gap-2 border-b",P,j[N]].join(" "),children:[e("div",{className:"min-w-0 flex-1",children:e(r,{size:N,color:T,checked:_,indeterminate:$,disabled:v||0===z.length,label:e("span",{id:B,className:"block truncate font-medium",children:s}),onCheckedChange:e=>u(e)})}),a("span",{className:`text-mp-on-surface-variant shrink-0 tabular-nums ${b}`,children:[M.length,"/",o]})]}),p?e("div",{className:`${P} ${j[N]}`,children:e(n,{size:N,fullWidth:!0,disabled:v,placeholder:S.search,"aria-label":S.search,value:h,onChange:f})}):null,e("div",{role:"group","aria-labelledby":B,className:`mp-transfer__list flex flex-col overflow-y-auto overscroll-contain ${P} ${j[N]}`,style:{height:g},children:0===i.length?e("span",{className:`text-mp-on-surface-variant ${b} ${k[N]}`,children:S.empty}):i.map(a=>e("div",{className:[k[N],m.has(a.value)?"mp-row-arrive":""].filter(Boolean).join(" "),children:e(r,{size:N,color:T,label:a.label,checked:c.has(a.value),disabled:v||a.disabled,onCheckedChange:e=>d(a.value,e)})},C.get(a)))})]})}function N(e,a){if(""===a)return e;const t=a.toLowerCase();return e.filter(e=>"string"!=typeof e.label||e.label.toLowerCase().includes(t))}export const MPTransfer=/*@__PURE__*/t.forwardRef(function({items:l,value:r,defaultValue:n,onValueChange:b,sourceLabel:x,targetLabel:w,searchable:j=!1,height:k=220,disabled:T=!1,variant:z="outlined",size:C,color:M,locale:_,labels:$,className:P,...B},L){const A=v(C),I=p(M),V=c(_),E=m(u,V,$),[F,R]=t.useState(n??[]),W=r??F,[q,D]=t.useState(()=>new Set),[G,H]=t.useState(()=>({values:new Set,toTarget:!0})),[J,K]=t.useState(""),[O,Q]=t.useState(""),[U,X]=t.useState(null),Y=t.useMemo(()=>new Set(W),[W]),Z=l.filter(e=>!Y.has(e.value)),ee=l.filter(e=>Y.has(e.value));t.useEffect(()=>{const e=new Set(l.map(e=>e.value));D(a=>{const t=[...a].filter(a=>e.has(a));return t.length===a.size?a:new Set(t)})},[l]);const ae=(e,a)=>{D(t=>{const l=new Set(t);return a?l.add(e):l.delete(e),l})},te=(e,a)=>{D(t=>{const l=new Set(t);for(const t of e)t.disabled||(a?l.add(t.value):l.delete(t.value));return l})},le=(e,a)=>{const t=e.filter(e=>!e.disabled&&q.has(e.value));if(0===t.length)return;const s=new Set(t.map(e=>e.value)),i=a?l.filter(e=>Y.has(e.value)||s.has(e.value)).map(e=>e.value):W.filter(e=>!s.has(e));D(e=>new Set([...e].filter(e=>!s.has(e)))),H({values:s,toTarget:a}),X(e=>{return{tick:(e?.tick??0)+1,text:h(E.moved,{count:String(t.length),list:(l=a?w:x,r=a?E.target:E.source,"string"==typeof l&&""!==l?l:r)})};var l,r}),(e=>{void 0===r&&R(e),b?.(e)})(i)},re=N(Z,J),se=N(ee,O),ie=re.some(e=>!e.disabled&&q.has(e.value)),ne=se.some(e=>!e.disabled&&q.has(e.value)),oe=d(k),ce={ticked:q,disabled:T,height:oe,messages:E,variant:z,size:A,color:I,searchable:j};return a("div",{ref:L,"data-mp-size":A,className:["mp-transfer grid w-full items-center gap-3","[grid-template-columns:minmax(0,1fr)]","mp-medium:[grid-template-columns:minmax(0,1fr)_auto_minmax(0,1fr)]",P??""].filter(Boolean).join(" "),...B,children:[e(y,{...ce,title:g(x)?x:E.source,rows:re,total:Z.length,arrived:G.toTarget?S:G.values,onTick:ae,onTickAll:e=>te(re,e),search:J,onSearch:K}),a("div",{className:"flex flex-row justify-center gap-2 mp-medium:flex-col",children:[e(i,{size:A,color:I,variant:"text"===z?"text":"outlined",label:E.toTarget,disabled:T||!ie,onClick:()=>le(re,!0),icon:e(s,{icon:o,className:"rotate-90 mp-medium:rotate-0"})}),e(i,{size:A,color:I,variant:"text"===z?"text":"outlined",label:E.toSource,disabled:T||!ne,onClick:()=>le(se,!1),icon:e(s,{icon:o,className:"-rotate-90 mp-medium:rotate-180"})})]}),e("span",{className:f,"aria-live":"polite","aria-atomic":"true",children:U?e("span",{children:U.text},U.tick):null}),e(y,{...ce,title:g(w)?w:E.target,rows:se,total:ee.length,arrived:G.toTarget?G.values:S,onTick:ae,onTickAll:e=>te(se,e),search:O,onSearch:Q})]})});

package/dist/components/tree-select/MPTreeSelect.js

@@ -1,2 +1,2 @@
 "use client";
-import{jsx as e,jsxs as l}from"react/jsx-runtime";import*as a from"react";import{MPTreeItem as n,MPTreeView as r}from"../tree-view/MPTreeView.js";import{MPPickerShell as t}from"../../internal/Picker.js";import{useMPLocale as o,useMPMessages as i}from"../../internal/locale.js";import{COMBOBOX as s}from"../../internal/messages/combobox.js";import{TRANSFER as c}from"../../internal/messages/transfer.js";import{PICKER as d}from"../../internal/messages/picker.js";import{META_TEXT as p}from"../../internal/scale.js";import{useMPColor as m,useMPSize as u}from"../../internal/config.js";function h(e,l=new Map){for(const a of e)l.set(a.value,a),a.children&&h(a.children,l);return l}const f=e=>e.trim().toLocaleLowerCase();function v(e){return f(e.searchLabel??("string"==typeof e.label?e.label:String(e.value)))}function g(e,l){if(""===l)return e;const a=[];for(const n of e){const e=n.children?g(n.children,l):void 0,r=v(n).includes(l);(r||e&&e.length>0)&&a.push({...n,children:r?n.children:e})}return a}function b(e,l=[]){for(const a of e)a.children&&a.children.length>0&&(l.push(a.value),b(a.children,l));return l}export const MPTreeSelect=/*@__PURE__*/a.forwardRef(function({items:v=[],value:x,defaultValue:j,onValueChange:y,multiple:C=!1,selectableBranches:S=!1,defaultExpanded:w,expanded:N,onExpandedChange:M,open:O,defaultOpen:_,onOpenChange:k,placeholder:P,clearable:V=!1,closeOnSelect:z,searchable:B=!1,searchPlaceholder:E,locale:L,format:T,labels:A,name:I,size:R,color:D,readOnly:q=!1,disabled:F=!1,classNames:G,...H},J){const K=u(R),Q=m(D),U=o(L),W=i(s,U),X=i(d,U,A),Y=i(c,U),Z=e=>null==e?[]:Array.isArray(e)?e:[e],[$,ee]=a.useState(()=>Z(j)),le=void 0!==x?Z(x):$,[ae,ne]=a.useState(_??!1),re=O??ae,[te,oe]=a.useState(""),ie=a.useMemo(()=>h(v),[v]),se=f(te),ce=a.useMemo(()=>g(v,se),[v,se]),de=a.useMemo(()=>""===se?void 0:b(ce),[se,ce]),[pe,me]=a.useState(()=>w??[]),ue=de??N??pe,he=e=>{de||(void 0===N&&me(e),M?.(e))},fe=e=>{e&&(q||F)||(void 0===O&&ne(e),e||oe(""),k?.(e))},ve=e=>{void 0===x&&ee(e),y?.(e)},ge=e=>e.selectable??(!(e.children&&e.children.length>0)||S),be=e=>l=>{l.preventDefault(),e.children&&e.children.length>0&&he(ue.includes(e.value)?ue.filter(l=>l!==e.value):[...ue,e.value])},xe=le.map(e=>ie.get(e)).filter(e=>void 0!==e),je=0===xe.length?P??"":T?T(xe):xe.map(e=>e.label).reduce((e,l,a)=>0===a?[l]:[...e,", ",l],[]),ye=l=>l.map(l=>e(n,{value:l.value,label:l.label,startIcon:l.startIcon,disabled:l.disabled,onClick:ge(l)?void 0:be(l),className:G?.item,children:l.children?ye(l.children):null},l.value));return e(t,{...H,slug:"tree-select",size:K,color:Q,readOnly:q,disabled:F,triggerRef:J,display:je,empty:0===xe.length,clearable:V,onClear:()=>ve([]),open:re,onOpenChange:fe,labels:X,hiddenValues:I?le.map(e=>({name:I,value:String(e)})):void 0,children:l("div",{className:["mp-tree-select__popup flex max-h-80 w-64 flex-col gap-2",G?.popup??""].filter(Boolean).join(" "),children:[B?e("input",{type:"text",value:te,placeholder:E??Y.search,"aria-label":E??Y.search,onChange:e=>oe(e.currentTarget.value),className:["mp-tree-select__search text-mp-on-surface w-full shrink-0 bg-transparent","placeholder:text-mp-on-surface-variant px-1 py-1 [font:inherit] outline-none"].join(" ")}):null,e("div",{className:"min-h-0 flex-1 overflow-auto",children:0===ce.length?e("p",{className:["mp-tree-select__empty text-mp-on-surface-variant m-0 px-1 py-2",p,G?.empty??""].filter(Boolean).join(" "),children:W.empty}):e(r,{size:K,variant:"text",multiple:C,selected:le,onSelectedChange:e=>{const l=e.filter(e=>ie.has(e));ve(C?l:l.slice(-1)),(z??!C)&&fe(!1)},expanded:ue,onExpandedChange:he,className:G?.tree,children:ye(ce)})})]})})});
+import{jsx as e,jsxs as l}from"react/jsx-runtime";import*as a from"react";import{MPTreeItem as n,MPTreeView as r}from"../tree-view/MPTreeView.js";import{MPPickerShell as t}from"../../internal/Picker.js";import{useMPLocale as o,useMPMessages as s}from"../../internal/locale.js";import{COMBOBOX as i}from"../../internal/messages/combobox.js";import{TRANSFER as c}from"../../internal/messages/transfer.js";import{PICKER as d}from"../../internal/messages/picker.js";import{META_TEXT as p}from"../../internal/scale.js";import{useMPColor as u,useMPSize as m}from"../../internal/config.js";function h(e,l=new Map){for(const a of e)l.set(a.value,a),a.children&&h(a.children,l);return l}const f=e=>e.trim().toLocaleLowerCase(),v=new WeakMap;function g(e){let l=v.get(e);return void 0===l&&(l=f(e.searchLabel??("string"==typeof e.label?e.label:String(e.value))),v.set(e,l)),l}function b(e,l){if(""===l)return e;const a=[];for(const n of e){const e=n.children?b(n.children,l):void 0,r=g(n).includes(l);(r||e&&e.length>0)&&a.push({...n,children:r?n.children:e})}return a}function x(e,l=[]){for(const a of e)a.children&&a.children.length>0&&(l.push(a.value),x(a.children,l));return l}export const MPTreeSelect=/*@__PURE__*/a.forwardRef(function({items:v=[],value:g,defaultValue:j,onValueChange:y,multiple:C=!1,selectableBranches:w=!1,defaultExpanded:S,expanded:M,onExpandedChange:N,open:O,defaultOpen:_,onOpenChange:k,placeholder:V,clearable:P=!1,closeOnSelect:z,searchable:B=!1,searchPlaceholder:E,locale:L,format:T,labels:A,name:D,size:I,color:R,readOnly:W=!1,disabled:q=!1,classNames:F,...G},H){const J=m(I),K=u(R),Q=o(L),U=s(i,Q),X=s(d,Q,A),Y=s(c,Q),Z=e=>null==e?[]:Array.isArray(e)?e:[e],[$,ee]=a.useState(()=>Z(j)),le=void 0!==g?Z(g):$,[ae,ne]=a.useState(_??!1),re=O??ae,[te,oe]=a.useState(""),se=a.useMemo(()=>h(v),[v]),ie=f(a.useDeferredValue(te)),ce=a.useMemo(()=>b(v,ie),[v,ie]),de=a.useMemo(()=>""===ie?void 0:x(ce),[ie,ce]),[pe,ue]=a.useState(()=>S??[]),me=de??M??pe,he=e=>{de||(void 0===M&&ue(e),N?.(e))},fe=e=>{e&&(W||q)||(void 0===O&&ne(e),e||oe(""),k?.(e))},ve=e=>{void 0===g&&ee(e),y?.(e)},ge=e=>e.selectable??(!(e.children&&e.children.length>0)||w),be=e=>l=>{l.preventDefault(),e.children&&e.children.length>0&&he(me.includes(e.value)?me.filter(l=>l!==e.value):[...me,e.value])},xe=le.map(e=>se.get(e)).filter(e=>void 0!==e),je=0===xe.length?V??"":T?T(xe):xe.map(e=>e.label).reduce((e,l,a)=>0===a?[l]:[...e,", ",l],[]),ye=l=>l.map(l=>e(n,{value:l.value,label:l.label,startIcon:l.startIcon,disabled:l.disabled,onClick:ge(l)?void 0:be(l),className:F?.item,children:l.children?ye(l.children):null},l.value));return e(t,{...G,slug:"tree-select",size:J,color:K,readOnly:W,disabled:q,triggerRef:H,display:je,empty:0===xe.length,clearable:P,onClear:()=>ve([]),open:re,onOpenChange:fe,labels:X,hiddenValues:D?le.map(e=>({name:D,value:String(e)})):void 0,children:l("div",{className:["mp-tree-select__popup flex max-h-80 w-64 flex-col gap-2",F?.popup??""].filter(Boolean).join(" "),children:[B?e("input",{type:"text",value:te,placeholder:E??Y.search,"aria-label":E??Y.search,onChange:e=>oe(e.currentTarget.value),className:["mp-tree-select__search text-mp-on-surface w-full shrink-0 bg-transparent","placeholder:text-mp-on-surface-variant px-1 py-1 [font:inherit] outline-none"].join(" ")}):null,e("div",{className:"min-h-0 flex-1 overflow-auto",children:0===ce.length?e("p",{className:["mp-tree-select__empty text-mp-on-surface-variant m-0 px-1 py-2",p,F?.empty??""].filter(Boolean).join(" "),children:U.empty}):e(r,{size:J,variant:"text",multiple:C,selected:le,onSelectedChange:e=>{const l=e.filter(e=>se.has(e));ve(C?l:l.slice(-1)),(z??!C)&&fe(!1)},expanded:me,onExpandedChange:he,className:F?.tree,children:ye(ce)})})]})})});

package/dist/components/tree-view/MPTreeView.d.ts

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import type { useRender } from '@base-ui/react/use-render';
 import type { MPDensity, MPElevation, MPSize, MPVariant } from '../../types.js';
 /**
  * How the hierarchy is drawn between the rows.
@@ -86,6 +87,13 @@ export interface MPTreeItemProps extends Omit<React.ComponentPropsWithoutRef<'li
     action?: React.ReactNode;
     /** Renders the row as a link, for a tree that is navigation. */
     href?: string;
+    /**
+     * Renders the row's `<a>` as something else — a router's `Link`, so a press is a
+     * client-side navigation and the page is prefetched. `href` and the classes
+     * still go through, so `render={<NextLink />}` needs the URL written once.
+     * Ignored where there is no link to replace.
+     */
+    render?: useRender.RenderProp;
     /** Fires when the row is pressed, before it opens or is chosen. */
     onClick?: React.MouseEventHandler<HTMLElement>;
     /**

package/dist/components/tree-view/MPTreeView.js

@@ -1,2 +1,2 @@
 "use client";
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as r from"react";import{MPIcon as n}from"../icon/MPIcon.js";import{ChevronDownIcon as a}from"../../constants/icons.js";import{containerSurface as o}from"../../internal/elevation.js";import{MPStateLayer as i}from"../../internal/StateLayer.js";import{CONTROL_GAP as s,CONTROL_ICON as l,PROSE_TEXT as c,hasContent as u}from"../../internal/scale.js";import{useMPDensity as d,useMPSize as m}from"../../internal/config.js";const p=/*@__PURE__*/r.createContext({size:"md",density:0,disabled:!1,expandedKeys:new Set,selectedKeys:new Set,activeKey:null,toggle:()=>{},select:()=>{},activate:()=>{},register:()=>()=>{}}),f=/*@__PURE__*/r.createContext(!1),g={xs:28,sm:32,md:40,lg:48,xl:56},x={xs:14,sm:16,md:20,lg:24,xl:28},v={xs:"px-1.5",sm:"px-2",md:"px-2.5",lg:"px-3",xl:"px-3.5"},h="rounded-mp-full",b={none:"",simple:"mp-tree--simple",folder:"mp-tree--folder"};function y(e,t){return Math.max(24,g[e]+4*t)}function w(e){return Array.from(e.querySelectorAll('[role="treeitem"]')).filter(e=>null===e.closest("[data-mp-closing]"))}const k=e=>String(e);export const MPTreeView=/*@__PURE__*/r.forwardRef(function({variant:t="outlined",elevation:n,size:a,density:i,lines:s="simple",expanded:l,defaultExpanded:c,onExpandedChange:u,selected:f,defaultSelected:g,onSelectedChange:v,multiple:h=!1,disabled:C=!1,label:j,className:N,style:S,children:_,onKeyDown:A,...K},D){const P=m(a),E=d(i),[R,M]=r.useState(c??[]),[I,z]=r.useState(g??[]),[B,F]=r.useState(null),T=l??R,V=f??I,L=r.useRef(null),$=r.useCallback(e=>{L.current=e,"function"==typeof D?D(e):D&&(D.current=e)},[D]),q=r.useCallback(e=>{const t=k(e),r=l??R,n=r.some(e=>k(e)===t)?r.filter(e=>k(e)!==t):[...r,e];void 0===l&&M(n),u?.(n)},[l,R,u]),H=r.useCallback(e=>{const t=k(e),r=f??I,n=r.some(e=>k(e)===t),a=h?n?r.filter(e=>k(e)!==t):[...r,e]:[e];void 0===f&&z(a),v?.(a)},[h,f,I,v]),O=r.useRef(new Map),U=r.useCallback((e,t)=>(O.current.set(e,t),()=>{O.current.delete(e)}),[]),G=r.useMemo(()=>T.map(k).join("\0"),[T]),J=r.useMemo(()=>V.map(k).join("\0"),[V]),Q=r.useMemo(()=>({size:P,density:E,disabled:C,expandedKeys:new Set(T.map(k)),selectedKeys:new Set(V.map(k)),activeKey:B,toggle:q,select:H,activate:F,register:U}),[P,E,C,G,J,B,q,H,U]);return r.useEffect(()=>{if(null!==B&&O.current.has(B))return;const e=L.current;if(!e)return;const t=w(e);t.length>0&&F(t[0].dataset.mpValue??null)}),e(p.Provider,{value:Q,children:e("ul",{ref:$,role:"tree","aria-label":j,"aria-multiselectable":h||void 0,"data-mp-size":P,"data-mp-variant":t,className:["mp-tree rounded-mp-md m-0 box-border flex list-none flex-col p-1",o(t,n),"text-mp-on-surface",b[s],N??""].filter(Boolean).join(" "),style:{"--_mp-tree-indent":`${x[P]}px`,"--_mp-tree-row":`${y(P,E)}px`,...S},onKeyDown:function(e){if(A?.(e),e.defaultPrevented)return;const t=L.current,r=e.target?.closest?.('[role="treeitem"]');if(!t||!r||!t.contains(r))return;const n=w(t),a=n.indexOf(r);if(-1===a)return;const o=t=>{t&&(e.preventDefault(),F(t.dataset.mpValue??null),t.focus())},i=e=>{const t=e.dataset.mpValue;t&&O.current.get(t)?.toggle()},s="rtl"===getComputedStyle(t).direction,l=s?"ArrowLeft":"ArrowRight",c=s?"ArrowRight":"ArrowLeft",u=r.getAttribute("aria-expanded");switch(e.key){case"ArrowDown":o(n[a+1]);break;case"ArrowUp":o(n[a-1]);break;case"Home":o(n[0]);break;case"End":o(n[n.length-1]);break;case l:"false"===u?(e.preventDefault(),i(r)):"true"===u&&o(n[a+1]);break;case c:"true"===u?(e.preventDefault(),i(r)):o(r.parentElement?.closest('[role="treeitem"]'));break;case"Enter":case" ":e.preventDefault(),r.click()}},...K,children:_})})});export const MPTreeItem=/*@__PURE__*/r.forwardRef(function({value:o,label:d,startIcon:m,endIcon:g,action:x,href:b,expandable:y,disabled:w=!1,className:C,children:j,onClick:N,...S},_){const{size:A,disabled:K,expandedKeys:D,selectedKeys:P,activeKey:E,toggle:R,select:M,activate:I,register:z}=r.useContext(p),B=r.useId(),F=o??B,T=k(F),V=r.useRef(null),L=r.useCallback(e=>{V.current=e,"function"==typeof _?_(e):_&&(_.current=e)},[_]),$=r.Children.toArray(j),q=y??$.length>0,H=q&&D.has(T),O=P.has(T),U=w||K,G=r.useRef({toggle:()=>{}});G.current.toggle=()=>{!U&&q&&R(F)};const J=r.useContext(f);r.useEffect(()=>J?void 0:z(T,G.current),[J,T,z]);const[Q,W]=r.useState(H),[X,Y]=r.useState(H),Z=r.useRef(null);r.useEffect(()=>{if(H){W(!0);const e=requestAnimationFrame(()=>Y(!0));return()=>cancelAnimationFrame(e)}Y(!1);const e=Z.current;(null===e||getComputedStyle(e).transitionDuration.split(",").every(e=>0===Number.parseFloat(e)))&&W(!1)},[H]);const ee=["mp-tree__row group relative flex min-w-0 flex-1 items-center overflow-hidden text-start","h-(--_mp-tree-row) no-underline",v[A],h,s[A],c[A],"transition-[background-color,color] duration-(--mp-sys-motion-duration-short4)","ease-mp-standard motion-reduce:transition-none","group-focus-visible/tree-item:outline-mp-secondary","group-focus-visible/tree-item:outline-2 group-focus-visible/tree-item:-outline-offset-2","group-focus-visible/tree-item:outline-solid",U?"text-mp-on-surface/38 cursor-default":O?"bg-mp-secondary-container text-mp-on-secondary-container cursor-pointer":"text-mp-on-surface cursor-pointer"].filter(Boolean).join(" "),te=t(r.Fragment,{children:[U?null:e(i,{}),e("span",{"aria-hidden":"true",onClick:e=>{!U&&q&&(e.stopPropagation(),e.preventDefault(),V.current?.focus(),I(T),R(F))},className:["mp-tree__arrow relative flex h-[1lh] w-[1.15em] shrink-0 items-center justify-center","transition-[rotate] duration-(--mp-sys-motion-duration-short4)","ease-mp-standard motion-reduce:transition-none",q?"text-mp-on-surface-variant":"",H?"rotate-0":"-rotate-90 rtl:rotate-90"].filter(Boolean).join(" "),children:q?e(n,{icon:a,size:l[A]-6}):null}),u(m)?e("span",{className:"text-mp-on-surface-variant relative flex h-[1lh] shrink-0 items-center",children:m}):null,e("span",{className:"relative min-w-0 flex-1 truncate",children:d}),u(g)?e("span",{className:"text-mp-on-surface-variant relative flex h-[1lh] shrink-0 items-center",children:g}):null]});return t("li",{ref:L,role:"treeitem","aria-expanded":q?H:void 0,"aria-selected":!!O||void 0,"aria-disabled":U||void 0,"data-mp-value":T,tabIndex:E===T?0:-1,className:["mp-tree__item group/tree-item relative block",C??""].filter(Boolean).join(" "),style:{outline:"none"},onClick:function(e){e.stopPropagation(),U?e.preventDefault():(V.current?.focus(),I(T),N?.(e),e.defaultPrevented||(q&&R(F),M(F)))},...S,children:[t("div",{className:"flex w-full items-center",children:[b&&!U?e("a",{href:b,tabIndex:-1,className:ee,"aria-current":O?"page":void 0,children:te}):e("div",{className:ee,children:te}),u(x)?e("span",{className:`mp-tree__action flex shrink-0 items-center ${v[A]}`,onClick:e=>e.stopPropagation(),children:x}):null]}),q&&Q&&$.length>0?e("div",{ref:Z,"data-mp-closing":H?void 0:"",className:["mp-tree__branch grid","transition-[grid-template-rows] duration-(--mp-sys-motion-duration-short4)","ease-mp-standard motion-reduce:transition-none",X?"grid-rows-[1fr]":"pointer-events-none grid-rows-[0fr]"].join(" "),onTransitionEnd:e=>{e.target!==e.currentTarget||"grid-template-rows"!==e.propertyName||H||W(!1)},children:e("ul",{role:"group",className:"m-0 min-h-0 list-none overflow-hidden ps-(--_mp-tree-indent)",children:e(f.Provider,{value:J||!H,children:j})})}):null]})});
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as r from"react";import{useBrowserLayoutEffect as n}from"../../internal/layout-effect.js";import{RenderedLink as o}from"../../internal/RenderedLink.js";import{MPIcon as a}from"../icon/MPIcon.js";import{ChevronDownIcon as s}from"../../constants/icons.js";import{containerSurface as i}from"../../internal/elevation.js";import{MPStateLayer as l}from"../../internal/StateLayer.js";import{CONTROL_GAP as c,CONTROL_ICON as u,PROSE_TEXT as d,hasContent as m}from"../../internal/scale.js";import{useMPDensity as p,useMPSize as f}from"../../internal/config.js";function g(e){let t=e;const r=new Set;return{get:()=>t,set:e=>{if(e.expanded!==t.expanded||e.selected!==t.selected||e.active!==t.active){t=e;for(const e of r)e()}},subscribe:e=>(r.add(e),()=>{r.delete(e)})}}const x=/*@__PURE__*/r.createContext({size:"md",density:0,disabled:!1,store:g({expanded:new Set,selected:new Set,active:null}),toggle:()=>{},select:()=>{},activate:()=>{},register:()=>()=>{}}),v=/*@__PURE__*/r.createContext(!1),h={xs:28,sm:32,md:40,lg:48,xl:56},b={xs:14,sm:16,md:20,lg:24,xl:28},w={xs:"px-1.5",sm:"px-2",md:"px-2.5",lg:"px-3",xl:"px-3.5"},y="rounded-mp-full",k={none:"",simple:"mp-tree--simple",folder:"mp-tree--folder"};function j(e,t){return Math.max(24,h[e]+4*t)}function S(e){return Array.from(e.querySelectorAll('[role="treeitem"]')).filter(e=>null===e.closest("[data-mp-closing]"))}const C=e=>String(e);export const MPTreeView=/*@__PURE__*/r.forwardRef(function({variant:t="outlined",elevation:o,size:a,density:s,lines:l="simple",expanded:c,defaultExpanded:u,onExpandedChange:d,selected:m,defaultSelected:v,onSelectedChange:h,multiple:w=!1,disabled:y=!1,label:N,className:_,style:A,children:R,onKeyDown:D,...E},M){const P=f(a),I=p(s),[z,B]=r.useState(u??[]),[F,L]=r.useState(v??[]),[T,V]=r.useState(null),$=c??z,q=m??F,K=r.useRef(null),H=r.useCallback(e=>{K.current=e,"function"==typeof M?M(e):M&&(M.current=e)},[M]),O=r.useCallback(e=>{const t=C(e),r=c??z,n=r.some(e=>C(e)===t)?r.filter(e=>C(e)!==t):[...r,e];void 0===c&&B(n),d?.(n)},[c,z,d]),U=r.useCallback(e=>{const t=C(e),r=m??F,n=r.some(e=>C(e)===t),o=w?n?r.filter(e=>C(e)!==t):[...r,e]:[e];void 0===m&&L(o),h?.(o)},[w,m,F,h]),G=r.useRef(new Map),J=r.useCallback((e,t)=>(G.current.set(e,t),()=>{G.current.delete(e)}),[]),Q=r.useMemo(()=>$.map(C).join("\0"),[$]),W=r.useMemo(()=>q.map(C).join("\0"),[q]),X=r.useMemo(()=>new Set($.map(C)),[Q]),Y=r.useMemo(()=>new Set(q.map(C)),[W]),Z=r.useRef(null);Z.current??=g({expanded:X,selected:Y,active:T});const ee=Z.current;n(()=>{ee.set({expanded:X,selected:Y,active:T})},[ee,X,Y,T]);const te=r.useMemo(()=>({size:P,density:I,disabled:y,store:ee,toggle:O,select:U,activate:V,register:J}),[P,I,y,ee,O,U,J]);return r.useEffect(()=>{if(null!==T&&G.current.has(T))return;const e=K.current;if(!e)return;const t=S(e);t.length>0&&V(t[0].dataset.mpValue??null)}),e(x.Provider,{value:te,children:e("ul",{ref:H,role:"tree","aria-label":N,"aria-multiselectable":w||void 0,"data-mp-size":P,"data-mp-variant":t,className:["mp-tree rounded-mp-md m-0 box-border flex list-none flex-col p-1",i(t,o),"text-mp-on-surface",k[l],_??""].filter(Boolean).join(" "),style:{"--_mp-tree-indent":`${b[P]}px`,"--_mp-tree-row":`${j(P,I)}px`,...A},onKeyDown:function(e){if(D?.(e),e.defaultPrevented)return;const t=K.current,r=e.target?.closest?.('[role="treeitem"]');if(!t||!r||!t.contains(r))return;const n=S(t),o=n.indexOf(r);if(-1===o)return;const a=t=>{t&&(e.preventDefault(),V(t.dataset.mpValue??null),t.focus())},s=e=>{const t=e.dataset.mpValue;t&&G.current.get(t)?.toggle()},i="rtl"===getComputedStyle(t).direction,l=i?"ArrowLeft":"ArrowRight",c=i?"ArrowRight":"ArrowLeft",u=r.getAttribute("aria-expanded");switch(e.key){case"ArrowDown":a(n[o+1]);break;case"ArrowUp":a(n[o-1]);break;case"Home":a(n[0]);break;case"End":a(n[n.length-1]);break;case l:"false"===u?(e.preventDefault(),s(r)):"true"===u&&a(n[o+1]);break;case c:"true"===u?(e.preventDefault(),s(r)):a(r.parentElement?.closest('[role="treeitem"]'));break;case"Enter":case" ":e.preventDefault(),r.click()}},...E,children:R})})});export const MPTreeItem=/*@__PURE__*/r.forwardRef(function({value:n,label:i,startIcon:p,endIcon:f,action:g,href:h,render:b,expandable:k,disabled:j=!1,className:S,children:N,onClick:_,...A},R){const{size:D,disabled:E,store:M,toggle:P,select:I,activate:z,register:B}=r.useContext(x),F=r.useId(),L=n??F,T=C(L),V=r.useRef(null),$=r.useCallback(e=>{V.current=e,"function"==typeof R?R(e):R&&(R.current=e)},[R]),q=r.Children.toArray(N),K=k??q.length>0,H=()=>function(e,t){return(e.expanded.has(t)?1:0)|(e.selected.has(t)?2:0)|(e.active===t?4:0)}(M.get(),T),O=r.useSyncExternalStore(M.subscribe,H,H),U=K&&!!(1&O),G=!!(2&O),J=j||E,Q=r.useRef({toggle:()=>{}});Q.current.toggle=()=>{!J&&K&&P(L)};const W=r.useContext(v);r.useEffect(()=>W?void 0:B(T,Q.current),[W,T,B]);const[X,Y]=r.useState(U),[Z,ee]=r.useState(U),te=r.useRef(null);r.useEffect(()=>{if(U){Y(!0);const e=requestAnimationFrame(()=>ee(!0));return()=>cancelAnimationFrame(e)}ee(!1);const e=te.current;(null===e||getComputedStyle(e).transitionDuration.split(",").every(e=>0===Number.parseFloat(e)))&&Y(!1)},[U]);const re=["mp-tree__row group relative flex min-w-0 flex-1 items-center overflow-hidden text-start","h-(--_mp-tree-row) no-underline",w[D],y,c[D],d[D],"transition-[background-color,color] duration-(--mp-sys-motion-duration-short4)","ease-mp-standard motion-reduce:transition-none","group-focus-visible/tree-item:outline-mp-secondary","group-focus-visible/tree-item:outline-2 group-focus-visible/tree-item:-outline-offset-2","group-focus-visible/tree-item:outline-solid",J?"text-mp-on-surface/38 cursor-default":G?"bg-mp-secondary-container text-mp-on-secondary-container cursor-pointer":"text-mp-on-surface cursor-pointer"].filter(Boolean).join(" "),ne=t(r.Fragment,{children:[J?null:e(l,{}),e("span",{"aria-hidden":"true",onClick:e=>{!J&&K&&(e.stopPropagation(),e.preventDefault(),V.current?.focus(),z(T),P(L))},className:["mp-tree__arrow relative flex h-[1lh] w-[1.15em] shrink-0 items-center justify-center","transition-[rotate] duration-(--mp-sys-motion-duration-short4)","ease-mp-standard motion-reduce:transition-none",K?"text-mp-on-surface-variant":"",U?"rotate-0":"-rotate-90 rtl:rotate-90"].filter(Boolean).join(" "),children:K?e(a,{icon:s,size:u[D]-6}):null}),m(p)?e("span",{className:"text-mp-on-surface-variant relative flex h-[1lh] shrink-0 items-center",children:p}):null,e("span",{className:"relative min-w-0 flex-1 truncate",children:i}),m(f)?e("span",{className:"text-mp-on-surface-variant relative flex h-[1lh] shrink-0 items-center",children:f}):null]});return t("li",{ref:$,role:"treeitem","aria-expanded":K?U:void 0,"aria-selected":!!G||void 0,"aria-disabled":J||void 0,"data-mp-value":T,tabIndex:4&O?0:-1,className:["mp-tree__item group/tree-item relative block",S??""].filter(Boolean).join(" "),style:{outline:"none"},onClick:function(e){e.stopPropagation(),J?e.preventDefault():(V.current?.focus(),z(T),_?.(e),e.defaultPrevented||(K&&P(L),I(L)))},...A,children:[t("div",{className:"flex w-full items-center",children:[h&&!J?e(o,{render:b,props:{href:h,tabIndex:-1,className:re,"aria-current":G?"page":void 0,children:ne}}):e("div",{className:re,children:ne}),m(g)?e("span",{className:`mp-tree__action flex shrink-0 items-center ${w[D]}`,onClick:e=>e.stopPropagation(),children:g}):null]}),K&&X&&q.length>0?e("div",{ref:te,"data-mp-closing":U?void 0:"",className:["mp-tree__branch grid","transition-[grid-template-rows] duration-(--mp-sys-motion-duration-short4)","ease-mp-standard motion-reduce:transition-none",Z?"grid-rows-[1fr]":"pointer-events-none grid-rows-[0fr]"].join(" "),onTransitionEnd:e=>{e.target!==e.currentTarget||"grid-template-rows"!==e.propertyName||U||Y(!1)},children:e("ul",{role:"group",className:"m-0 min-h-0 list-none overflow-hidden ps-(--_mp-tree-indent)",children:e(v.Provider,{value:W||!U,children:N})})}):null]})});

package/dist/components/typography/MPTypography.d.ts

@@ -83,7 +83,7 @@ export interface MPTypographyProps extends Omit<React.ComponentPropsWithoutRef<'
      * `transition="fade"` is the whole of what most callers want; the object form
      * takes a duration, an edge to come from, or a scale to start at. Anything
      * that has to run again — on scroll, on hover, under your own control — is an
-     * [MPAnimateFade](../motion/animate-fade) and its siblings.
+     * [MPAnimateFade](../transitions/animate-fade) and its siblings.
      */
     transition?: MPTransition;
 }