material-plus-ui 1.3.1 → 1.4.0

package/dist/components/transfer/MPTransfer.d.ts

@@ -0,0 +1,98 @@
+import * as React from 'react';
+import type { MPMessages } from '../../internal/i18n.js';
+import type { MPColor, MPSize, MPVariant } from '../../types.js';
+/** One thing that can be on either side. */
+export interface MPTransferItem {
+    /** What identifies it, and what `value` is a list of. */
+    value: string;
+    /** What the row says. */
+    label: React.ReactNode;
+    /** In the list, but not movable. */
+    disabled?: boolean;
+}
+export interface MPTransferProps extends Omit<React.ComponentPropsWithoutRef<'div'>, 'color' | 'defaultValue' | 'onChange'> {
+    /** Everything that can be on either side, in the order both lists show it. */
+    items: readonly MPTransferItem[];
+    /** What is on the trailing side. Use with `onValueChange` for a controlled pair. */
+    value?: readonly string[];
+    /** What starts there, for an uncontrolled one. */
+    defaultValue?: readonly string[];
+    onValueChange?: (value: string[]) => void;
+    /** The heading over the leading list. Defaults to the word in `locale`. */
+    sourceLabel?: React.ReactNode;
+    /** And over the trailing one. */
+    targetLabel?: React.ReactNode;
+    /**
+     * Puts a filter above each list.
+     * @default false
+     */
+    searchable?: boolean;
+    /**
+     * How tall each list is — a number in pixels, or any CSS length.
+     * @default 220
+     */
+    height?: number | string;
+    /** Nothing can be ticked or moved. */
+    disabled?: boolean;
+    /**
+     * How much surface each panel paints, on the **container** ladder — the panels
+     * hold rows of somebody else's labels, so they are never dyed.
+     * @default 'outlined'
+     */
+    variant?: MPVariant;
+    /**
+     * The scale of the whole control: the rows, the headings, the filter and the
+     * two arrows.
+     * @default 'md'
+     */
+    size?: MPSize;
+    /**
+     * Which accent family the ticks and the arrows read.
+     * @default 'primary'
+     */
+    color?: MPColor;
+    /**
+     * Which language the headings, the arrows and the filter are written in. Falls
+     * back to the nearest `MPLocaleProvider`, then to English.
+     */
+    locale?: string;
+    /** Overrides for the words themselves. They win over the translation. */
+    labels?: Partial<MPMessages['transfer']>;
+}
+/**
+ * Two lists and the arrows between them: everything that could be chosen on one
+ * side, everything that has been on the other.
+ *
+ * This is the shape for a choice that is **long** — the columns in a report, the
+ * permissions on a role, the people on a channel — where an
+ * [MPCombobox](./combobox) with forty chips in its field stops being readable
+ * and a column of forty checkboxes gives no answer at all to "what did I
+ * actually pick". Below about a dozen options, one of those two is the smaller
+ * component and the better one.
+ *
+ * ## Ticking is not choosing
+ *
+ * The two are deliberately separate, and it is the whole of the interaction.
+ * `value` is **which side a row is on**; a tick is a mark on a row saying it
+ * should move next time an arrow is pressed. So `onValueChange` fires on the
+ * arrow and never on a tick, and a caller storing `value` is storing the answer
+ * rather than the working.
+ *
+ * Moving drops the ticks on what moved and keeps the rest: a row that has
+ * arrived on the other side is not still waiting to be sent there, and a row the
+ * filter was hiding was never part of that press.
+ *
+ * ## The order never changes
+ *
+ * Both lists draw in the order of `items`, so a row sent across and back lands
+ * where it started. A component that appended to the far list instead would
+ * reorder the reader's own list every time they changed their mind.
+ *
+ * ## Why it is not one component with a `mode`
+ *
+ * Because the panels are one function called twice, which is what makes the two
+ * sides provably identical: the same heading strip, the same select-all, the
+ * same filter, the same empty line. The only thing that differs between them is
+ * which way its arrow points.
+ */
+export declare const MPTransfer: React.ForwardRefExoticComponent<MPTransferProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/transfer/MPTransfer.js

@@ -0,0 +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 s}from"../checkbox/MPCheckbox.js";import{MPIcon as r}from"../icon/MPIcon.js";import{MPIconButton as n}from"../icon-button/MPIconButton.js";import{MPTextField as i}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 h}from"../../internal/messages/transfer.js";import{hasContent as f,META_TEXT as u,SHEET_PAD_X as p}from"../../internal/scale.js";const v={xs:"py-1",sm:"py-1.5",md:"py-2",lg:"py-2.5",xl:"py-3"},b={xs:"py-0.5",sm:"py-1",md:"py-1",lg:"py-1.5",xl:"py-2"};function g({title:t,rows:r,total:n,ticked:o,onTick:c,onTickAll:m,search:d,onSearch:h,searchable:f,disabled:g,height:x,messages:w,variant:k,size:j,color:y}){const S=r.filter(e=>!e.disabled),N=S.filter(e=>o.has(e.value)),z=S.length>0&&N.length===S.length,C=N.length>0&&!z,T=p[j];return a(l,{variant:k,size:j,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",T,v[j]].join(" "),children:[e("div",{className:"min-w-0 flex-1",children:e(s,{size:j,color:y,checked:z,indeterminate:C,disabled:g||0===S.length,label:e("span",{className:"block truncate font-medium",children:t}),onCheckedChange:e=>m(e)})}),a("span",{className:`text-mp-on-surface-variant shrink-0 tabular-nums ${u}`,children:[N.length,"/",n]})]}),f?e("div",{className:`${T} ${v[j]}`,children:e(i,{size:j,fullWidth:!0,disabled:g,placeholder:w.search,"aria-label":w.search,value:d,onChange:h})}):null,e("div",{className:`mp-transfer__list flex flex-col overflow-y-auto overscroll-contain ${T} ${v[j]}`,style:{height:x},children:0===r.length?e("span",{className:`text-mp-on-surface-variant ${u} ${b[j]}`,children:w.empty}):r.map((a,t)=>e("div",{className:b[j],children:e(s,{size:j,color:y,label:a.label,checked:o.has(a.value),disabled:g||a.disabled,onCheckedChange:e=>c(a.value,e)})},`${t}:${a.value}`))})]})}function x(e,a){return""===a||("string"!=typeof e.label||e.label.toLowerCase().includes(a.toLowerCase()))}export const MPTransfer=/*@__PURE__*/t.forwardRef(function({items:l,value:s,defaultValue:i,onValueChange:u,sourceLabel:p,targetLabel:v,searchable:b=!1,height:w=220,disabled:k=!1,variant:j="outlined",size:y="md",color:S="primary",locale:N,labels:z,className:C,...T},$){const _=c(N),M=m(h,_,z),[P,L]=t.useState(i??[]),A=s??P,[B,I]=t.useState(()=>new Set),[V,E]=t.useState(""),[F,R]=t.useState(""),W=t.useMemo(()=>new Set(A),[A]),q=l.filter(e=>!W.has(e.value)),D=l.filter(e=>W.has(e.value));t.useEffect(()=>{const e=new Set(l.map(e=>e.value));I(a=>{const t=[...a].filter(a=>e.has(a));return t.length===a.size?a:new Set(t)})},[l]);const G=(e,a)=>{I(t=>{const l=new Set(t);return a?l.add(e):l.delete(e),l})},H=(e,a)=>{I(t=>{const l=new Set(t);for(const t of e)t.disabled||(a?l.add(t.value):l.delete(t.value));return l})},J=(e,a)=>{const t=e.filter(e=>!e.disabled&&B.has(e.value));if(0===t.length)return;const r=new Set(t.map(e=>e.value)),n=a?l.filter(e=>W.has(e.value)||r.has(e.value)).map(e=>e.value):A.filter(e=>!r.has(e));I(e=>new Set([...e].filter(e=>!r.has(e)))),(e=>{void 0===s&&L(e),u?.(e)})(n)},K=q.filter(e=>x(e,V)),O=D.filter(e=>x(e,F)),Q=K.some(e=>!e.disabled&&B.has(e.value)),U=O.some(e=>!e.disabled&&B.has(e.value)),X=d(w),Y={ticked:B,disabled:k,height:X,messages:M,variant:j,size:y,color:S,searchable:b};return a("div",{ref:$,"data-mp-size":y,className:["mp-transfer grid w-full items-center gap-3","[grid-template-columns:minmax(0,1fr)]","min-[600px]:[grid-template-columns:minmax(0,1fr)_auto_minmax(0,1fr)]",C??""].filter(Boolean).join(" "),...T,children:[e(g,{...Y,title:f(p)?p:M.source,rows:K,total:q.length,onTick:G,onTickAll:e=>H(K,e),search:V,onSearch:E}),a("div",{className:"flex flex-row justify-center gap-2 min-[600px]:flex-col",children:[e(n,{size:y,color:S,variant:"text"===j?"text":"outlined",label:M.toTarget,disabled:k||!Q,onClick:()=>J(K,!0),icon:e(r,{icon:o,className:"rotate-90 min-[600px]:rotate-0"})}),e(n,{size:y,color:S,variant:"text"===j?"text":"outlined",label:M.toSource,disabled:k||!U,onClick:()=>J(O,!1),icon:e(r,{icon:o,className:"-rotate-90 min-[600px]:rotate-180"})})]}),e(g,{...Y,title:f(v)?v:M.target,rows:O,total:D.length,onTick:G,onTickAll:e=>H(O,e),search:F,onSearch:R})]})});

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

@@ -0,0 +1,2 @@
+export { MPTransfer } from './MPTransfer.js';
+export type { MPTransferItem, MPTransferProps } from './MPTransfer.js';

package/dist/components/transfer/index.js

@@ -0,0 +1 @@
+export{MPTransfer}from"./MPTransfer.js";

package/dist/constants/glyphs.d.ts

@@ -60,3 +60,13 @@ export declare const ClockIcon: import("react").ForwardRefExoticComponent<Omit<i
 export declare const StarIcon: import("react").ForwardRefExoticComponent<Omit<import("lucide-react").LucideProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
 /** Work in progress, spun by whatever is waiting on it. */
 export declare const SpinnerIcon: import("react").ForwardRefExoticComponent<Omit<import("lucide-react").LucideProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
+/**
+ * Three lines: the navigation a window has become too narrow to show.
+ *
+ * The one glyph in the set that is a picture of a *menu* rather than a picture
+ * of what pressing it does, and it is here anyway. Thirty years of it have made
+ * it the one shape a reader recognises with no word beside it, which is the only
+ * argument that ever justifies a symbol — and `MPSidebarTrigger` gives it a
+ * name for the readers it still says nothing to.
+ */
+export declare const MenuIcon: import("react").ForwardRefExoticComponent<Omit<import("lucide-react").LucideProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;

package/dist/constants/glyphs.js

@@ -1,2 +1,2 @@
 "use client";
-import{ArrowDown as o,ArrowRight as n,ArrowUp as t,CalendarDays as c,Check as r,ChevronDown as e,ChevronLeft as s,ChevronRight as p,ChevronsLeft as x,ChevronsRight as I,ChevronUp as i,CircleAlert as h,CircleCheck as C,Clock as a,Copy as l,Ellipsis as v,ExternalLink as f,Eye as d,EyeOff as w,Info as g,Link as k,LoaderCircle as A,Minus as L,Plus as R,Search as S,Star as m,TriangleAlert as y,Upload as U,X as b}from"lucide-react";export const VisibilityIcon=d;export const VisibilityOffIcon=w;export const CloseIcon=b;export const CheckIcon=r;export const ChevronDownIcon=e;export const ChevronUpIcon=i;export const ChevronLeftIcon=s;export const ChevronRightIcon=p;export const ChevronsLeftIcon=x;export const ChevronsRightIcon=I;export const SearchIcon=S;export const ArrowUpIcon=t;export const ArrowDownIcon=o;export const ArrowRightIcon=n;export const MoreIcon=v;export const LinkIcon=k;export const ExternalLinkIcon=f;export const CopyIcon=l;export const InfoIcon=g;export const SuccessIcon=C;export const WarningIcon=y;export const ErrorIcon=h;export const AddIcon=R;export const RemoveIcon=L;export const UploadIcon=U;export const CalendarIcon=c;export const ClockIcon=a;export const StarIcon=m;export const SpinnerIcon=A;
+import{ArrowDown as o,ArrowRight as n,ArrowUp as t,CalendarDays as c,Check as r,ChevronDown as e,ChevronLeft as s,ChevronRight as p,ChevronsLeft as x,ChevronsRight as I,ChevronUp as i,CircleAlert as h,CircleCheck as C,Clock as a,Copy as l,Ellipsis as v,ExternalLink as f,Eye as d,EyeOff as w,Info as g,Link as k,LoaderCircle as A,Menu as L,Minus as R,Plus as S,Search as m,Star as u,TriangleAlert as y,Upload as U,X as b}from"lucide-react";export const VisibilityIcon=d;export const VisibilityOffIcon=w;export const CloseIcon=b;export const CheckIcon=r;export const ChevronDownIcon=e;export const ChevronUpIcon=i;export const ChevronLeftIcon=s;export const ChevronRightIcon=p;export const ChevronsLeftIcon=x;export const ChevronsRightIcon=I;export const SearchIcon=m;export const ArrowUpIcon=t;export const ArrowDownIcon=o;export const ArrowRightIcon=n;export const MoreIcon=v;export const LinkIcon=k;export const ExternalLinkIcon=f;export const CopyIcon=l;export const InfoIcon=g;export const SuccessIcon=C;export const WarningIcon=y;export const ErrorIcon=h;export const AddIcon=S;export const RemoveIcon=R;export const UploadIcon=U;export const CalendarIcon=c;export const ClockIcon=a;export const StarIcon=u;export const SpinnerIcon=A;export const MenuIcon=L;

package/dist/constants/icons.d.ts

@@ -56,6 +56,7 @@ export declare const ICONS: {
     readonly 'arrow-down': import("react").ForwardRefExoticComponent<Omit<import("lucide-react").LucideProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
     readonly 'arrow-right': import("react").ForwardRefExoticComponent<Omit<import("lucide-react").LucideProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
     readonly more: import("react").ForwardRefExoticComponent<Omit<import("lucide-react").LucideProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
+    readonly menu: import("react").ForwardRefExoticComponent<Omit<import("lucide-react").LucideProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
     readonly link: import("react").ForwardRefExoticComponent<Omit<import("lucide-react").LucideProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
     readonly 'external-link': import("react").ForwardRefExoticComponent<Omit<import("lucide-react").LucideProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
     readonly copy: import("react").ForwardRefExoticComponent<Omit<import("lucide-react").LucideProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;

package/dist/constants/icons.js

@@ -1 +1 @@
-export*from"./glyphs.js";import{VisibilityIcon as r,VisibilityOffIcon as o,CloseIcon as e,CheckIcon as n,ChevronDownIcon as c,ChevronUpIcon as i,ChevronLeftIcon as s,ChevronRightIcon as h,ChevronsLeftIcon as l,ChevronsRightIcon as t,SearchIcon as a,ArrowUpIcon as p,ArrowDownIcon as v,ArrowRightIcon as f,MoreIcon as d,LinkIcon as g,ExternalLinkIcon as w,CopyIcon as m,InfoIcon as y,SuccessIcon as k,WarningIcon as u,ErrorIcon as x,AddIcon as b,RemoveIcon as j,UploadIcon as C,CalendarIcon as I,ClockIcon as N,StarIcon as O,SpinnerIcon as S}from"./glyphs.js";export const ICONS={visibility:r,"visibility-off":o,close:e,check:n,"chevron-down":c,"chevron-up":i,"chevron-left":s,"chevron-right":h,"chevrons-left":l,"chevrons-right":t,search:a,"arrow-up":p,"arrow-down":v,"arrow-right":f,more:d,link:g,"external-link":w,copy:m,info:y,success:k,warning:u,error:x,add:b,remove:j,upload:C,calendar:I,clock:N,star:O,spinner:S};
+export*from"./glyphs.js";import{VisibilityIcon as r,VisibilityOffIcon as o,CloseIcon as e,CheckIcon as n,ChevronDownIcon as c,ChevronUpIcon as i,ChevronLeftIcon as s,ChevronRightIcon as h,ChevronsLeftIcon as l,ChevronsRightIcon as t,SearchIcon as a,ArrowUpIcon as p,ArrowDownIcon as v,ArrowRightIcon as f,MoreIcon as d,MenuIcon as g,LinkIcon as m,ExternalLinkIcon as w,CopyIcon as u,InfoIcon as y,SuccessIcon as k,WarningIcon as x,ErrorIcon as b,AddIcon as j,RemoveIcon as C,UploadIcon as I,CalendarIcon as N,ClockIcon as O,StarIcon as S,SpinnerIcon as q}from"./glyphs.js";export const ICONS={visibility:r,"visibility-off":o,close:e,check:n,"chevron-down":c,"chevron-up":i,"chevron-left":s,"chevron-right":h,"chevrons-left":l,"chevrons-right":t,search:a,"arrow-up":p,"arrow-down":v,"arrow-right":f,more:d,menu:g,link:m,"external-link":w,copy:u,info:y,success:k,warning:x,error:b,add:j,remove:C,upload:I,calendar:N,clock:O,star:S,spinner:q};

package/dist/index.d.ts

@@ -16,6 +16,7 @@ export * from './components/animate-typing/index.js';
 export * from './components/animate-zoom/index.js';
 export * from './components/aspect-ratio/index.js';
 export * from './components/avatar/index.js';
+export * from './components/avatar-group/index.js';
 export * from './components/badge/index.js';
 export * from './components/blockquote/index.js';
 export * from './components/bottom-navigation/index.js';
@@ -31,6 +32,7 @@ export * from './components/chip/index.js';
 export * from './components/collapsible/index.js';
 export * from './components/color-picker/index.js';
 export * from './components/combobox/index.js';
+export * from './components/command-palette/index.js';
 export * from './components/container/index.js';
 export * from './components/date-picker/index.js';
 export * from './components/date-range-picker/index.js';
@@ -39,18 +41,25 @@ export * from './components/dialog/index.js';
 export * from './components/divider/index.js';
 export * from './components/drawer/index.js';
 export * from './components/empty/index.js';
+export * from './components/fieldset/index.js';
 export * from './components/file-picker/index.js';
 export * from './components/floating-action-button/index.js';
+export * from './components/footer/index.js';
+export * from './components/form/index.js';
 export * from './components/grid/index.js';
+export * from './components/header/index.js';
 export * from './components/highlight/index.js';
 export * from './components/icon/index.js';
 export * from './components/icon-button/index.js';
 export * from './components/list/index.js';
 export * from './components/locale/index.js';
 export * from './components/menu/index.js';
+export * from './components/menubar/index.js';
+export * from './components/navigation-menu/index.js';
 export * from './components/number-field/index.js';
 export * from './components/otp-field/index.js';
 export * from './components/overlay/index.js';
+export * from './components/page-layout/index.js';
 export * from './components/pagination/index.js';
 export * from './components/panes/index.js';
 export * from './components/pill/index.js';
@@ -63,6 +72,7 @@ export * from './components/rating/index.js';
 export * from './components/segmented-button/index.js';
 export * from './components/select/index.js';
 export * from './components/shortcut/index.js';
+export * from './components/sidebar/index.js';
 export * from './components/skeleton/index.js';
 export * from './components/slider/index.js';
 export * from './components/snackbar/index.js';
@@ -74,5 +84,8 @@ export * from './components/text-field/index.js';
 export * from './components/text-link/index.js';
 export * from './components/time-picker/index.js';
 export * from './components/timeline/index.js';
+export * from './components/toggle/index.js';
+export * from './components/toggle-group/index.js';
 export * from './components/tooltip/index.js';
+export * from './components/transfer/index.js';
 export * from './components/typography/index.js';

package/dist/index.js

@@ -1 +1 @@
-export*from"./types.js";export{registerMPMessages}from"./internal/i18n.js";export*from"./constants/icons.js";export*from"./components/accordion/index.js";export*from"./components/alert/index.js";export*from"./components/animate-appear/index.js";export*from"./components/animate-blink/index.js";export*from"./components/animate-fade/index.js";export*from"./components/animate-grow/index.js";export*from"./components/animate-headline/index.js";export*from"./components/animate-lighting/index.js";export*from"./components/animate-marquee/index.js";export*from"./components/animate-rotate/index.js";export*from"./components/animate-slide/index.js";export*from"./components/animate-typing/index.js";export*from"./components/animate-zoom/index.js";export*from"./components/aspect-ratio/index.js";export*from"./components/avatar/index.js";export*from"./components/badge/index.js";export*from"./components/blockquote/index.js";export*from"./components/bottom-navigation/index.js";export*from"./components/box/index.js";export*from"./components/breadcrumb/index.js";export*from"./components/button/index.js";export*from"./components/button-group/index.js";export*from"./components/card/index.js";export*from"./components/carousel/index.js";export*from"./components/chat-bubble/index.js";export*from"./components/checkbox/index.js";export*from"./components/chip/index.js";export*from"./components/collapsible/index.js";export*from"./components/color-picker/index.js";export*from"./components/combobox/index.js";export*from"./components/container/index.js";export*from"./components/date-picker/index.js";export*from"./components/date-range-picker/index.js";export*from"./components/date-time-picker/index.js";export*from"./components/dialog/index.js";export*from"./components/divider/index.js";export*from"./components/drawer/index.js";export*from"./components/empty/index.js";export*from"./components/file-picker/index.js";export*from"./components/floating-action-button/index.js";export*from"./components/grid/index.js";export*from"./components/highlight/index.js";export*from"./components/icon/index.js";export*from"./components/icon-button/index.js";export*from"./components/list/index.js";export*from"./components/locale/index.js";export*from"./components/menu/index.js";export*from"./components/number-field/index.js";export*from"./components/otp-field/index.js";export*from"./components/overlay/index.js";export*from"./components/pagination/index.js";export*from"./components/panes/index.js";export*from"./components/pill/index.js";export*from"./components/popover/index.js";export*from"./components/progress-box/index.js";export*from"./components/progress-circular/index.js";export*from"./components/progress-linear/index.js";export*from"./components/radio-group/index.js";export*from"./components/rating/index.js";export*from"./components/segmented-button/index.js";export*from"./components/select/index.js";export*from"./components/shortcut/index.js";export*from"./components/skeleton/index.js";export*from"./components/slider/index.js";export*from"./components/snackbar/index.js";export*from"./components/spoiler/index.js";export*from"./components/switch/index.js";export*from"./components/table/index.js";export*from"./components/tabs/index.js";export*from"./components/text-field/index.js";export*from"./components/text-link/index.js";export*from"./components/time-picker/index.js";export*from"./components/timeline/index.js";export*from"./components/tooltip/index.js";export*from"./components/typography/index.js";
+export*from"./types.js";export{registerMPMessages}from"./internal/i18n.js";export*from"./constants/icons.js";export*from"./components/accordion/index.js";export*from"./components/alert/index.js";export*from"./components/animate-appear/index.js";export*from"./components/animate-blink/index.js";export*from"./components/animate-fade/index.js";export*from"./components/animate-grow/index.js";export*from"./components/animate-headline/index.js";export*from"./components/animate-lighting/index.js";export*from"./components/animate-marquee/index.js";export*from"./components/animate-rotate/index.js";export*from"./components/animate-slide/index.js";export*from"./components/animate-typing/index.js";export*from"./components/animate-zoom/index.js";export*from"./components/aspect-ratio/index.js";export*from"./components/avatar/index.js";export*from"./components/avatar-group/index.js";export*from"./components/badge/index.js";export*from"./components/blockquote/index.js";export*from"./components/bottom-navigation/index.js";export*from"./components/box/index.js";export*from"./components/breadcrumb/index.js";export*from"./components/button/index.js";export*from"./components/button-group/index.js";export*from"./components/card/index.js";export*from"./components/carousel/index.js";export*from"./components/chat-bubble/index.js";export*from"./components/checkbox/index.js";export*from"./components/chip/index.js";export*from"./components/collapsible/index.js";export*from"./components/color-picker/index.js";export*from"./components/combobox/index.js";export*from"./components/command-palette/index.js";export*from"./components/container/index.js";export*from"./components/date-picker/index.js";export*from"./components/date-range-picker/index.js";export*from"./components/date-time-picker/index.js";export*from"./components/dialog/index.js";export*from"./components/divider/index.js";export*from"./components/drawer/index.js";export*from"./components/empty/index.js";export*from"./components/fieldset/index.js";export*from"./components/file-picker/index.js";export*from"./components/floating-action-button/index.js";export*from"./components/footer/index.js";export*from"./components/form/index.js";export*from"./components/grid/index.js";export*from"./components/header/index.js";export*from"./components/highlight/index.js";export*from"./components/icon/index.js";export*from"./components/icon-button/index.js";export*from"./components/list/index.js";export*from"./components/locale/index.js";export*from"./components/menu/index.js";export*from"./components/menubar/index.js";export*from"./components/navigation-menu/index.js";export*from"./components/number-field/index.js";export*from"./components/otp-field/index.js";export*from"./components/overlay/index.js";export*from"./components/page-layout/index.js";export*from"./components/pagination/index.js";export*from"./components/panes/index.js";export*from"./components/pill/index.js";export*from"./components/popover/index.js";export*from"./components/progress-box/index.js";export*from"./components/progress-circular/index.js";export*from"./components/progress-linear/index.js";export*from"./components/radio-group/index.js";export*from"./components/rating/index.js";export*from"./components/segmented-button/index.js";export*from"./components/select/index.js";export*from"./components/shortcut/index.js";export*from"./components/sidebar/index.js";export*from"./components/skeleton/index.js";export*from"./components/slider/index.js";export*from"./components/snackbar/index.js";export*from"./components/spoiler/index.js";export*from"./components/switch/index.js";export*from"./components/table/index.js";export*from"./components/tabs/index.js";export*from"./components/text-field/index.js";export*from"./components/text-link/index.js";export*from"./components/time-picker/index.js";export*from"./components/timeline/index.js";export*from"./components/toggle/index.js";export*from"./components/toggle-group/index.js";export*from"./components/tooltip/index.js";export*from"./components/transfer/index.js";export*from"./components/typography/index.js";

package/dist/internal/Calendar.js

@@ -1,2 +1,2 @@
 "use client";
-import{jsx as e,jsxs as o,Fragment as t}from"react/jsx-runtime";import*as n from"react";import{MPButton as r}from"../components/button/MPButton.js";import{MPIcon as l}from"../components/icon/MPIcon.js";import{MPIconButton as a}from"../components/icon-button/MPIconButton.js";import{ChevronDownIcon as s,ChevronLeftIcon as c,ChevronRightIcon as i}from"../constants/icons.js";import{MPStateLayer as u}from"./StateLayer.js";import{CONTROL_ICON as m,META_TEXT as d,PROSE_TEXT as h}from"./scale.js";import{VISUALLY_HIDDEN as p}from"./visually-hidden.js";import{addDays as f,addMonths as g,addYears as v,calendarWeeks as y,compareDay as w,dateFormatter as x,daysInMonth as b,isDayOutside as D,isMonthBeforeYear as S,isSameDay as N,isSameMonth as M,isValidDate as P,makeDate as _,meridiemLabels as C,monthLabels as j,startOfDay as k,startOfMonth as z,today as F,weekdayLabels as Y,withTime as A,YEAR_PAGE_SIZE as E,yearPageStart as B}from"./date.js";const R={xs:"1.75rem",sm:"2rem",md:"2.5rem",lg:"2.75rem",xl:"3rem"},T={xs:"xs",sm:"xs",md:"sm",lg:"sm",xl:"md"},$=/*@__PURE__*/["group relative flex cursor-pointer items-center justify-center overflow-hidden","box-border appearance-none bg-transparent font-[inherit] tabular-nums select-none","transition-[background-color,border-color,color]","duration-(--mp-sys-motion-duration-short4)","outline-mp-secondary focus-visible:z-10 focus-visible:outline-2","focus-visible:outline-offset-[-2px] focus-visible:outline-solid outline-none"].join(" ");function H({children:t,label:n,selected:r,inRange:l=!1,rangeEdge:a=null,current:s=!1,muted:c=!1,disabled:i=!1,focused:m=!1,className:d,onClick:h,onPointerEnter:p,onKeyDown:f}){return o("button",{type:"button",role:"gridcell","aria-label":n,"aria-selected":r,"aria-current":s?"date":void 0,"aria-disabled":i||void 0,tabIndex:m?0:-1,"data-focus-target":m?"true":void 0,className:[$,"start"===a?"rounded-s-mp-full":"end"===a?"rounded-e-mp-full":"middle"===a?"rounded-none":"rounded-mp-full",i?"cursor-default text-mp-on-surface/38":r?"bg-(--_mp-accent) text-(--_mp-on-accent)":l?"bg-(--_mp-accent-container) text-(--_mp-on-accent-container)":s?"border border-(--_mp-accent) text-(--_mp-accent)":c?"text-mp-on-surface-variant":"text-mp-on-surface",d??""].filter(Boolean).join(" "),onClick:()=>{i||h()},onPointerEnter:p,onKeyDown:f,children:[i?null:e(u,{}),t]})}function K({size:n,color:u,view:d,month:p,locale:f,labels:g,showPreviousButton:v,showNextButton:y,onStep:w,onViewChange:x}){const b=j(f,"long")[p.getMonth()],D=String(p.getFullYear()),N=S(f),M=T[n],P="day"===d?[g.previousMonth,g.nextMonth]:"month"===d?[g.previousYear,g.nextYear]:[g.previousYears,g.nextYears],_=(o,t)=>t?e(a,{size:M,color:u,label:P[-1===o?0:1],icon:e(l,{icon:-1===o?c:i,size:m[M],className:"rtl:rotate-180"}),onClick:()=>w(o)}):e("span",{"aria-hidden":"true",className:"size-(--_mp-cell)"}),C=o=>e(l,{icon:s,size:m[M],className:["transition-transform duration-(--mp-sys-motion-duration-short4)",o?"rotate-180":""].filter(Boolean).join(" ")}),k=e(r,{variant:"text",size:M,color:u,"aria-label":g.chooseMonth,"aria-expanded":"month"===d,endIcon:C("month"===d),onClick:()=>x("month"===d?"day":"month"),children:b},"month"),z=e(r,{variant:"text",size:M,color:u,className:"tabular-nums","aria-label":g.chooseYear,"aria-expanded":"year"===d,endIcon:C("year"===d),onClick:()=>x("year"===d?"day":"year"),children:D},"year"),F=B(p.getFullYear());return o("div",{className:"flex items-center justify-between gap-1",children:[_(-1,v),e("div",{className:"flex min-w-0 flex-1 items-center justify-center gap-1",children:"year"===d?e("span",{className:`text-mp-on-surface flex h-(--_mp-cell) items-center tabular-nums ${h[n]}`,children:`${F}–${F+E-1}`}):"month"===d?z:o(t,N?{children:[k,z]}:{children:[z,k]})}),_(1,y)]})}export function MPCalendar({size:t,color:r,locale:l,weekStartsOn:a,month:s,onMonthChange:c,selected:i,rangeStart:u=null,rangeEnd:m=null,onSelect:d,onPreviewChange:h,minDate:p,maxDate:f,shouldDisableDate:y,showOutsideDays:w=!0,autoFocus:x=!1,showPreviousButton:b=!0,showNextButton:S=!0,labels:N}){const[C,j]=n.useState("day"),Y=n.useMemo(()=>i.filter(P),[i]),[A,B]=n.useState(()=>{const e=Y.find(e=>M(e,s));return e?k(e):M(F(),s)?F():z(s)}),T=n.useRef(x),$=n.useRef(null);n.useEffect(()=>{B(e=>M(e,s)?e:z(s))},[s]),n.useLayoutEffect(()=>{T.current&&(T.current=!1,$.current?.querySelector('[data-focus-target="true"]')?.focus({preventScroll:!0}))});const H=n.useCallback(e=>D(e,p,f)||(y?.(e)??!1),[p,f,y]),q=e=>{T.current=!0,j(e)},I=e=>{T.current=!0,c(e)};return o("div",{ref:$,className:"mp-calendar flex flex-col gap-1",style:{"--_mp-cell":R[t]},onPointerLeave:()=>h?.(null),children:[e(K,{size:t,color:r,view:C,month:s,locale:l,labels:N,showPreviousButton:b,showNextButton:S,onStep:e=>{c("day"===C?g(s,e):v(s,"month"===C?e:e*E))},onViewChange:q}),e("div",{className:"h-[calc(var(--_mp-cell)*7)] w-[calc(var(--_mp-cell)*7)]",children:"day"===C?e(L,{size:t,locale:l,weekStartsOn:a,month:s,chosen:Y,rangeStart:u,rangeEnd:m,focusedDate:A,showOutsideDays:w,isDisabled:H,onSelect:e=>{B(e),d(e)},onPreviewChange:h,onMoveFocus:e=>{T.current=!0,B(e),M(e,s)||c(z(e))}}):"month"===C?e(O,{size:t,locale:l,month:s,chosen:Y,minDate:p,maxDate:f,onMoveCursor:I,onPick:e=>{c(_(s.getFullYear(),e,1)),q("day")}}):e(U,{size:t,month:s,chosen:Y,minDate:p,maxDate:f,onMoveCursor:I,onPick:e=>{c(_(e,s.getMonth(),1)),q("month")}})})]})}function L({size:t,locale:r,weekStartsOn:l,month:a,chosen:s,rangeStart:c,rangeEnd:i,focusedDate:u,showOutsideDays:m,isDisabled:p,onSelect:v,onPreviewChange:b,onMoveFocus:D}){const S=Y(r,l,"narrow"),_=Y(r,l,"long"),C=(k=i,P(j=c)&&P(k)?w(j,k)<=0?[j,k]:[k,j]:null);var j,k;const z=F(),A=n.useMemo(()=>{const e=x(r,{dateStyle:"full"});return y(a,l).map(o=>o.map(o=>({date:o,label:e.format(o)})))},[a,l,r]),E=n.useRef(null),B=n.useRef(a);n.useLayoutEffect(()=>{const e=E.current,o=B.current;if(B.current=a,!e||M(o,a))return;const t=o.getTime()<a.getTime(),n="rtl"===getComputedStyle(e).direction;e.style.setProperty("--_mp-calendar-from",String(t===n?-1:1)),e.dataset.mpPaged="true",e.style.animationName="none",e.offsetWidth,e.style.animationName=""},[a]);return o("div",{role:"grid","aria-label":x(r,{year:"numeric",month:"long"}).format(a),className:"flex h-full flex-col",children:[e("div",{role:"rowgroup",children:e("div",{role:"row",className:"grid grid-cols-7",children:S.map((o,t)=>e("span",{role:"columnheader","aria-label":_[t],className:`text-mp-on-surface-variant flex h-(--_mp-cell) items-center justify-center select-none ${d}`,children:o},t))})}),e("div",{ref:E,role:"rowgroup",className:"mp-calendar__page flex flex-1 flex-col",children:A.map((o,n)=>e("div",{role:"row",className:"grid grid-cols-7",children:o.map(({date:o,label:n})=>{const r=!M(o,a);if(r&&!m)return e("span",{role:"gridcell","aria-hidden":"true",className:"size-(--_mp-cell)"},o.getTime());const c=s.some(e=>N(e,o)),i=null!==C&&w(o,C[0])>=0&&w(o,C[1])<=0,d=null!==C&&i&&N(o,C[0]),y=null!==C&&i&&N(o,C[1]);return e(H,{label:n,selected:c,inRange:i&&!c,rangeEdge:i?d&&y?"both":d?"start":y?"end":"middle":null,current:N(o,z)&&!c,muted:r,disabled:p(o),focused:N(o,u),className:`size-(--_mp-cell) ${h[t]}`,onClick:()=>v(o),onPointerEnter:()=>b?.(o),onKeyDown:e=>((e,o)=>{const t=(o.getDay()-l+7)%7,n={ArrowLeft:()=>f(o,-1),ArrowRight:()=>f(o,1),ArrowUp:()=>f(o,-7),ArrowDown:()=>f(o,7),Home:()=>f(o,-t),End:()=>f(o,6-t),PageUp:()=>g(o,e.shiftKey?-12:-1),PageDown:()=>g(o,e.shiftKey?12:1)}[e.key];n&&(e.preventDefault(),D(n()))})(e,o),children:o.getDate()},o.getTime())})},n))})]})}function O({size:o,locale:t,month:n,chosen:r,minDate:l,maxDate:a,onMoveCursor:s,onPick:c}){const i=j(t,"short"),u=j(t,"long"),m=n.getFullYear(),d=new Date,p=e=>{const o={ArrowLeft:-1,ArrowRight:1,ArrowUp:-3,ArrowDown:3,PageUp:-12,PageDown:12}[e.key];void 0!==o&&(e.preventDefault(),s(g(z(n),o)))};return e("div",{role:"grid",className:"flex h-full flex-col justify-evenly",children:[0,1,2,3].map(t=>e("div",{role:"row",className:"grid grid-cols-3 gap-1",children:[0,1,2].map(s=>{const f=3*t+s,g=_(m,f,1),v=_(m,f,b(m,f));return e(H,{label:`${u[f]} ${m}`,selected:r.some(e=>e.getFullYear()===m&&e.getMonth()===f),current:d.getFullYear()===m&&d.getMonth()===f,disabled:P(l)&&w(v,l)<0||P(a)&&w(g,a)>0,focused:f===n.getMonth(),className:`h-(--_mp-cell) w-full ${h[o]}`,onClick:()=>c(f),onKeyDown:p,children:i[f]},f)})},t))})}function U({size:o,month:t,chosen:n,minDate:r,maxDate:l,onMoveCursor:a,onPick:s}){const c=B(t.getFullYear()),i=(new Date).getFullYear(),u=e=>{const o={ArrowLeft:-1,ArrowRight:1,ArrowUp:-4,ArrowDown:4,PageUp:-E,PageDown:E}[e.key];void 0!==o&&(e.preventDefault(),a(v(z(t),o)))};return e("div",{role:"grid",className:"flex h-full flex-col justify-evenly",children:[0,1,2].map(a=>e("div",{role:"row",className:"grid grid-cols-4 gap-1",children:[0,1,2,3].map(m=>{const d=c+4*a+m;return e(H,{label:String(d),selected:n.some(e=>e.getFullYear()===d),current:d===i,disabled:P(r)&&d<r.getFullYear()||P(l)&&d>l.getFullYear(),focused:d===t.getFullYear(),className:`h-(--_mp-cell) w-full ${h[o]}`,onClick:()=>s(d),onKeyDown:u,children:d},d)})},a))})}function q(e){const o=e.parentElement;if(!o)return;const t=e.getBoundingClientRect(),n=o.getBoundingClientRect(),r=t.top-n.top-o.clientTop+o.scrollTop,l=r+t.height;r<o.scrollTop?o.scrollTop=r:l>o.scrollTop+o.clientHeight&&(o.scrollTop=l-o.clientHeight)}export function MPTimeGrid({size:t,locale:r,value:l,referenceDate:a,onChange:s,hour12:c,showSeconds:i,hourStep:m,minuteStep:d,secondStep:f,shouldDisableTime:g,autoFocus:v=!1,labels:y}){const w=l??a,b=n.useRef(null),[D,S]=n.useMemo(()=>C(r),[r]);n.useEffect(()=>{const e=b.current;if(e?.querySelectorAll('[data-chosen="true"]').forEach(q),v){const o=e?.querySelector('[role="listbox"]');(o?.querySelector('[data-chosen="true"]')??o?.querySelector('[role="option"]'))?.focus({preventScroll:!0})}},[v]);const N=n.useMemo(()=>{const e=Math.ceil((c?12:24)/m),o=Array.from({length:e},(e,o)=>o*m);return c?o.map(e=>0===e?12:e):o},[c,m]),M=n.useMemo(()=>Array.from({length:Math.ceil(60/d)},(e,o)=>o*d),[d]),P=n.useMemo(()=>Array.from({length:Math.ceil(60/f)},(e,o)=>o*f),[f]),_=e=>String(e).padStart(2,"0"),j=c?w.getHours()%12||12:w.getHours(),k=(n,r,a,i,m)=>e("div",{role:"listbox","aria-label":r,className:["mp-time-grid__column flex flex-col gap-0.5 overflow-y-auto overscroll-contain","h-[calc(var(--_mp-cell)*7)] w-[calc(var(--_mp-cell)*1.75)]","scroll-py-0.5 [scrollbar-width:thin]"].join(" "),children:a.map(r=>{const a=((e,o)=>A(w,"hour"===e?{hours:c?o%12+(w.getHours()>=12?12:0):o}:"minute"===e?{minutes:o}:"second"===e?{seconds:o}:{hours:w.getHours()%12+12*o}))(n,r),d=null!==l&&i(r),p=g?.(a,n)??!1;return o("button",{type:"button",role:"option","aria-selected":d,"aria-disabled":p||void 0,"data-chosen":d?"true":void 0,className:[$,"rounded-mp-full h-(--_mp-cell) w-full shrink-0",h[t],p?"cursor-default text-mp-on-surface/38":d?"bg-(--_mp-accent) text-(--_mp-on-accent)":"text-mp-on-surface"].join(" "),onClick:()=>{p||s(a)},children:[p?null:e(u,{}),m(r)]},r)})},n);return o("div",{ref:b,className:"mp-time-grid flex gap-1",style:{"--_mp-cell":R[t]},children:[k("hour",y.hour,N,e=>e===j,e=>c?String(e):_(e)),k("minute",y.minute,M,e=>e===w.getMinutes(),_),i?k("second",y.second,P,e=>e===w.getSeconds(),_):null,c?k("meridiem",y.meridiem,[0,1],e=>(w.getHours()>=12?1:0)===e,e=>0===e?D:S):null,e("span",{className:p,"aria-live":"polite",children:null===l?"":x(r,{hour:"numeric",minute:"2-digit",...i?{second:"2-digit"}:{}}).format(l)})]})}
+import{jsx as e,jsxs as t,Fragment as n}from"react/jsx-runtime";import*as o from"react";import{MPButton as r}from"../components/button/MPButton.js";import{MPIcon as l}from"../components/icon/MPIcon.js";import{MPIconButton as a}from"../components/icon-button/MPIconButton.js";import{ChevronDownIcon as s,ChevronLeftIcon as c,ChevronRightIcon as i}from"../constants/icons.js";import{MPStateLayer as u}from"./StateLayer.js";import{CONTROL_ICON as m,META_TEXT as d,PROSE_TEXT as h}from"./scale.js";import{VISUALLY_HIDDEN as f}from"./visually-hidden.js";import{addDays as p,addMonths as g,addYears as v,calendarWeeks as y,compareDay as w,dateFormatter as x,daysInMonth as b,isDayOutside as D,isMonthBeforeYear as S,isSameDay as M,isSameMonth as N,isValidDate as P,makeDate as _,meridiemLabels as C,monthLabels as k,startOfDay as j,startOfMonth as z,today as F,weekdayLabels as A,withTime as E,YEAR_PAGE_SIZE as T,yearPageStart as Y}from"./date.js";const B={xs:"1.75rem",sm:"2rem",md:"2.5rem",lg:"2.75rem",xl:"3rem"},R={xs:"xs",sm:"xs",md:"sm",lg:"sm",xl:"md"},H=/*@__PURE__*/["group relative flex cursor-pointer items-center justify-center overflow-hidden","box-border appearance-none bg-transparent font-[inherit] tabular-nums select-none","transition-[background-color,border-color,color]","duration-(--mp-sys-motion-duration-short4)","outline-mp-secondary focus-visible:z-10 focus-visible:outline-2","focus-visible:outline-offset-[-2px] focus-visible:outline-solid outline-none"].join(" ");function $({children:n,label:o,selected:r,inRange:l=!1,rangeEdge:a=null,current:s=!1,muted:c=!1,disabled:i=!1,focused:m=!1,className:d,onClick:h,onPointerEnter:f,onKeyDown:p}){return t("button",{type:"button",role:"gridcell","aria-label":o,"aria-selected":r,"aria-current":s?"date":void 0,"aria-disabled":i||void 0,tabIndex:m?0:-1,"data-focus-target":m?"true":void 0,className:[H,"start"===a?"rounded-s-mp-full":"end"===a?"rounded-e-mp-full":"middle"===a?"rounded-none":"rounded-mp-full",i?"cursor-default text-mp-on-surface/38":r?"bg-(--_mp-accent) text-(--_mp-on-accent)":l?"bg-(--_mp-accent-container) text-(--_mp-on-accent-container)":s?"border border-(--_mp-accent) text-(--_mp-accent)":c?"text-mp-on-surface-variant":"text-mp-on-surface",d??""].filter(Boolean).join(" "),onClick:()=>{i||h()},onPointerEnter:f,onKeyDown:p,children:[i?null:e(u,{}),n]})}function K({size:o,color:u,view:d,month:f,locale:p,labels:g,showPreviousButton:v,showNextButton:y,onStep:w,onViewChange:x}){const b=k(p,"long")[f.getMonth()],D=String(f.getFullYear()),M=S(p),N=R[o],P="day"===d?[g.previousMonth,g.nextMonth]:"month"===d?[g.previousYear,g.nextYear]:[g.previousYears,g.nextYears],_=(t,n)=>n?e(a,{size:N,color:u,label:P[-1===t?0:1],icon:e(l,{icon:-1===t?c:i,size:m[N],className:"rtl:rotate-180"}),onClick:()=>w(t)}):e("span",{"aria-hidden":"true",className:"size-(--_mp-cell)"}),C=t=>e(l,{icon:s,size:m[N],className:["transition-transform duration-(--mp-sys-motion-duration-short4)",t?"rotate-180":""].filter(Boolean).join(" ")}),j=e(r,{variant:"text",size:N,color:u,"aria-label":g.chooseMonth,"aria-expanded":"month"===d,endIcon:C("month"===d),onClick:()=>x("month"===d?"day":"month"),children:b},"month"),z=e(r,{variant:"text",size:N,color:u,className:"tabular-nums","aria-label":g.chooseYear,"aria-expanded":"year"===d,endIcon:C("year"===d),onClick:()=>x("year"===d?"day":"year"),children:D},"year"),F=Y(f.getFullYear());return t("div",{className:"flex items-center justify-between gap-1",children:[_(-1,v),e("div",{className:"flex min-w-0 flex-1 items-center justify-center gap-1",children:"year"===d?e("span",{className:`text-mp-on-surface flex h-(--_mp-cell) items-center tabular-nums ${h[o]}`,children:`${F}–${F+T-1}`}):"month"===d?z:t(n,M?{children:[j,z]}:{children:[z,j]})}),_(1,y)]})}export function MPCalendar({size:n,color:r,locale:l,weekStartsOn:a,month:s,onMonthChange:c,selected:i,rangeStart:u=null,rangeEnd:m=null,onSelect:d,onPreviewChange:h,minDate:f,maxDate:p,shouldDisableDate:y,showOutsideDays:w=!0,autoFocus:x=!1,showPreviousButton:b=!0,showNextButton:S=!0,labels:M}){const[C,k]=o.useState("day"),A=o.useMemo(()=>i.filter(P),[i]),[E,Y]=o.useState(()=>{const e=A.find(e=>N(e,s));return e?j(e):N(F(),s)?F():z(s)}),R=o.useRef(x),H=o.useRef(null);o.useEffect(()=>{Y(e=>N(e,s)?e:z(s))},[s]),o.useLayoutEffect(()=>{R.current&&(R.current=!1,H.current?.querySelector('[data-focus-target="true"]')?.focus({preventScroll:!0}))});const $=o.useCallback(e=>D(e,f,p)||(y?.(e)??!1),[f,p,y]),L=e=>{R.current=!0,k(e)},q=e=>{R.current=!0,c(e)};return t("div",{ref:H,className:"mp-calendar flex flex-col gap-1",style:{"--_mp-cell":B[n]},onPointerLeave:()=>h?.(null),children:[e(K,{size:n,color:r,view:C,month:s,locale:l,labels:M,showPreviousButton:b,showNextButton:S,onStep:e=>{c("day"===C?g(s,e):v(s,"month"===C?e:e*T))},onViewChange:L}),e("div",{className:"h-[calc(var(--_mp-cell)*7)] w-[calc(var(--_mp-cell)*7)]",children:"day"===C?e(U,{size:n,locale:l,weekStartsOn:a,month:s,chosen:A,rangeStart:u,rangeEnd:m,focusedDate:E,showOutsideDays:w,isDisabled:$,onSelect:e=>{Y(e),d(e)},onPreviewChange:h,onMoveFocus:e=>{R.current=!0,Y(e),N(e,s)||c(z(e))}}):"month"===C?e(I,{size:n,locale:l,month:s,chosen:A,minDate:f,maxDate:p,onMoveCursor:q,onPick:e=>{c(_(s.getFullYear(),e,1)),L("day")}}):e(O,{size:n,month:s,chosen:A,minDate:f,maxDate:p,onMoveCursor:q,onPick:e=>{c(_(e,s.getMonth(),1)),L("month")}})})]})}function L(e){return"rtl"===getComputedStyle(e).direction?-1:1}function U({size:n,locale:r,weekStartsOn:l,month:a,chosen:s,rangeStart:c,rangeEnd:i,focusedDate:u,showOutsideDays:m,isDisabled:f,onSelect:v,onPreviewChange:b,onMoveFocus:D}){const S=A(r,l,"narrow"),_=A(r,l,"long"),C=(j=i,P(k=c)&&P(j)?w(k,j)<=0?[k,j]:[j,k]:null);var k,j;const z=F(),E=o.useMemo(()=>{const e=x(r,{dateStyle:"full"});return y(a,l).map(t=>t.map(t=>({date:t,label:e.format(t)})))},[a,l,r]),T=o.useRef(null),Y=o.useRef(a);o.useLayoutEffect(()=>{const e=T.current,t=Y.current;if(Y.current=a,!e||N(t,a))return;const n=t.getTime()<a.getTime(),o="rtl"===getComputedStyle(e).direction;e.style.setProperty("--_mp-calendar-from",String(n===o?-1:1)),e.dataset.mpPaged="true",e.style.animationName="none",e.offsetWidth,e.style.animationName=""},[a]);return t("div",{role:"grid","aria-label":x(r,{year:"numeric",month:"long"}).format(a),className:"flex h-full flex-col",children:[e("div",{role:"rowgroup",children:e("div",{role:"row",className:"grid grid-cols-7",children:S.map((t,n)=>e("span",{role:"columnheader","aria-label":_[n],className:`text-mp-on-surface-variant flex h-(--_mp-cell) items-center justify-center select-none ${d}`,children:t},n))})}),e("div",{ref:T,role:"rowgroup",className:"mp-calendar__page flex flex-1 flex-col",children:E.map((t,o)=>e("div",{role:"row",className:"grid grid-cols-7",children:t.map(({date:t,label:o})=>{const r=!N(t,a);if(r&&!m)return e("span",{role:"gridcell","aria-hidden":"true",className:"size-(--_mp-cell)"},t.getTime());const c=s.some(e=>M(e,t)),i=null!==C&&w(t,C[0])>=0&&w(t,C[1])<=0,d=null!==C&&i&&M(t,C[0]),y=null!==C&&i&&M(t,C[1]);return e($,{label:o,selected:c,inRange:i&&!c,rangeEdge:i?d&&y?"both":d?"start":y?"end":"middle":null,current:M(t,z)&&!c,muted:r,disabled:f(t),focused:M(t,u),className:`size-(--_mp-cell) ${h[n]}`,onClick:()=>v(t),onPointerEnter:()=>b?.(t),onKeyDown:e=>((e,t)=>{const n=(t.getDay()-l+7)%7,o=L(e.currentTarget),r={ArrowLeft:()=>p(t,-o),ArrowRight:()=>p(t,o),ArrowUp:()=>p(t,-7),ArrowDown:()=>p(t,7),Home:()=>p(t,-n),End:()=>p(t,6-n),PageUp:()=>g(t,e.shiftKey?-12:-1),PageDown:()=>g(t,e.shiftKey?12:1)}[e.key];r&&(e.preventDefault(),D(r()))})(e,t),children:t.getDate()},t.getTime())})},o))})]})}function I({size:t,locale:n,month:o,chosen:r,minDate:l,maxDate:a,onMoveCursor:s,onPick:c}){const i=k(n,"short"),u=k(n,"long"),m=o.getFullYear(),d=new Date,f=e=>{const t=L(e.currentTarget),n={ArrowLeft:-t,ArrowRight:t,ArrowUp:-3,ArrowDown:3,PageUp:-12,PageDown:12}[e.key];void 0!==n&&(e.preventDefault(),s(g(z(o),n)))};return e("div",{role:"grid",className:"flex h-full flex-col justify-evenly",children:[0,1,2,3].map(n=>e("div",{role:"row",className:"grid grid-cols-3 gap-1",children:[0,1,2].map(s=>{const p=3*n+s,g=_(m,p,1),v=_(m,p,b(m,p));return e($,{label:`${u[p]} ${m}`,selected:r.some(e=>e.getFullYear()===m&&e.getMonth()===p),current:d.getFullYear()===m&&d.getMonth()===p,disabled:P(l)&&w(v,l)<0||P(a)&&w(g,a)>0,focused:p===o.getMonth(),className:`h-(--_mp-cell) w-full ${h[t]}`,onClick:()=>c(p),onKeyDown:f,children:i[p]},p)})},n))})}function O({size:t,month:n,chosen:o,minDate:r,maxDate:l,onMoveCursor:a,onPick:s}){const c=Y(n.getFullYear()),i=(new Date).getFullYear(),u=e=>{const t=L(e.currentTarget),o={ArrowLeft:-t,ArrowRight:t,ArrowUp:-4,ArrowDown:4,PageUp:-T,PageDown:T}[e.key];void 0!==o&&(e.preventDefault(),a(v(z(n),o)))};return e("div",{role:"grid",className:"flex h-full flex-col justify-evenly",children:[0,1,2].map(a=>e("div",{role:"row",className:"grid grid-cols-4 gap-1",children:[0,1,2,3].map(m=>{const d=c+4*a+m;return e($,{label:String(d),selected:o.some(e=>e.getFullYear()===d),current:d===i,disabled:P(r)&&d<r.getFullYear()||P(l)&&d>l.getFullYear(),focused:d===n.getFullYear(),className:`h-(--_mp-cell) w-full ${h[t]}`,onClick:()=>s(d),onKeyDown:u,children:d},d)})},a))})}function q(e,t){return Number.isFinite(e)?Math.min(t,Math.max(1,Math.round(e))):1}function V(e){const t=e.parentElement;if(!t)return;const n=e.getBoundingClientRect(),o=t.getBoundingClientRect(),r=n.top-o.top-t.clientTop+t.scrollTop,l=r+n.height;r<t.scrollTop?t.scrollTop=r:l>t.scrollTop+t.clientHeight&&(t.scrollTop=l-t.clientHeight)}export function MPTimeGrid({size:n,locale:r,value:l,referenceDate:a,onChange:s,hour12:c,showSeconds:i,hourStep:m,minuteStep:d,secondStep:p,shouldDisableTime:g,autoFocus:v=!1,labels:y}){const w=l??a,b=o.useRef(null),[D,S]=o.useMemo(()=>C(r),[r]);o.useEffect(()=>{const e=b.current;if(e?.querySelectorAll('[data-chosen="true"]').forEach(V),v){const t=e?.querySelector('[role="listbox"]');(t?.querySelector('[data-chosen="true"]')??t?.querySelector('[role="option"]'))?.focus({preventScroll:!0})}},[v]);const M=o.useMemo(()=>{const e=c?12:24,t=q(m,e),n=Array.from({length:Math.ceil(e/t)},(e,n)=>n*t);return c?n.map(e=>0===e?12:e):n},[c,m]),N=o.useMemo(()=>{const e=q(d,60);return Array.from({length:Math.ceil(60/e)},(t,n)=>n*e)},[d]),P=o.useMemo(()=>{const e=q(p,60);return Array.from({length:Math.ceil(60/e)},(t,n)=>n*e)},[p]),_=e=>String(e).padStart(2,"0"),k=c?w.getHours()%12||12:w.getHours(),[j,z]=o.useState({}),F=(o,r,a,i,m)=>{const d=null===l?-1:a.findIndex(e=>i(e)),f=j[o]??(d>=0?d:0);return e("div",{role:"listbox","aria-label":r,className:["mp-time-grid__column flex flex-col gap-0.5 overflow-y-auto overscroll-contain","h-[calc(var(--_mp-cell)*7)] w-[calc(var(--_mp-cell)*1.75)]","scroll-py-0.5 [scrollbar-width:thin]"].join(" "),onKeyDown:e=>{const t={ArrowDown:1,ArrowUp:-1,PageDown:5,PageUp:-5}[e.key],n=void 0!==t?(e=>{const t=[...e.children].indexOf(document.activeElement);return t>=0?t:f})(e.currentTarget)+t:"Home"===e.key?0:"End"===e.key?a.length-1:null;null!==n&&(e.preventDefault(),((e,t)=>{const n=Math.min(a.length-1,Math.max(0,e)),r=t.children[n];z(e=>({...e,[o]:n})),r instanceof HTMLElement&&(r.focus({preventScroll:!0}),V(r))})(n,e.currentTarget))},children:a.map((r,a)=>{const d=((e,t)=>E(w,"hour"===e?{hours:c?t%12+(w.getHours()>=12?12:0):t}:"minute"===e?{minutes:t}:"second"===e?{seconds:t}:{hours:w.getHours()%12+12*t}))(o,r),p=null!==l&&i(r),v=g?.(d,o)??!1;return t("button",{type:"button",role:"option","aria-selected":p,"aria-disabled":v||void 0,"data-chosen":p?"true":void 0,tabIndex:a===f?0:-1,className:[H,"rounded-mp-full h-(--_mp-cell) w-full shrink-0",h[n],v?"cursor-default text-mp-on-surface/38":p?"bg-(--_mp-accent) text-(--_mp-on-accent)":"text-mp-on-surface"].join(" "),onFocus:()=>z(e=>({...e,[o]:a})),onClick:()=>{v||s(d)},children:[v?null:e(u,{}),m(r)]},r)})},o)};return t("div",{ref:b,className:"mp-time-grid flex gap-1",style:{"--_mp-cell":B[n]},children:[F("hour",y.hour,M,e=>e===k,e=>c?String(e):_(e)),F("minute",y.minute,N,e=>e===w.getMinutes(),_),i?F("second",y.second,P,e=>e===w.getSeconds(),_):null,c?F("meridiem",y.meridiem,[0,1],e=>(w.getHours()>=12?1:0)===e,e=>0===e?D:S):null,e("span",{className:f,"aria-live":"polite",children:null===l?"":x(r,{hour:"numeric",minute:"2-digit",...i?{second:"2-digit"}:{}}).format(l)})]})}

package/dist/internal/FieldOutline.js

@@ -1,2 +1,2 @@
 "use client";
-import{jsx as r,Fragment as e,jsxs as t}from"react/jsx-runtime";import*as o from"react";import{Field as n}from"@base-ui/react/field";import{PROSE_TEXT as a}from"./scale.js";const i={xs:"left-1",sm:"left-2",md:"left-3",lg:"left-3",xl:"left-4"},s={xs:"top-[18px]",sm:"top-[18px]",md:"top-5",lg:"top-5",xl:"top-5"};function d(o,n){return t(e,{children:[o,n?r("span",{"aria-hidden":"true",children:" *"}):null]})}export function MPFieldOutline({label:e,required:t=!1,notched:o=!0}){return r("fieldset",{"aria-hidden":"true",className:["pointer-events-none absolute inset-0 -top-[5px] m-0 min-w-0 px-2 pt-0","rounded-mp-xs border border-mp-outline","transition-[border-color] duration-(--mp-sys-motion-duration-short4)","group-hover:border-mp-on-surface","group-focus-within:border-2 group-focus-within:border-mp-primary","group-data-focused:border-2 group-data-focused:border-mp-primary","group-data-invalid:border-mp-error","group-data-disabled:border-mp-on-surface/12"].join(" "),children:e?r("legend",{className:["text-mp-body-small invisible float-none block h-[11px] w-auto overflow-hidden p-0","leading-none","ease-mp-standard transition-[max-width,padding]","duration-(--mp-sys-motion-duration-short4)",o?"max-w-full px-1":"max-w-0 px-0"].join(" "),children:d(e,t)}):null})}export function MPFieldLabel({size:e,label:t,required:o=!1,htmlFor:p,shrunk:l=!0,multiline:u=!1}){return r(n.Label,{htmlFor:p,"data-mp-shrunk":l?"":void 0,className:["text-mp-on-surface-variant","ease-mp-standard transition-[color,top,font-size,max-width]","duration-(--mp-sys-motion-duration-short4)","absolute -translate-y-1/2 px-1 leading-none",i[e],l?"text-mp-body-small pointer-events-auto top-0 max-w-none":[a[e],"pointer-events-none max-w-[calc(100%-2rem)] truncate",u?s[e]:"top-1/2"].join(" "),"group-focus-within:text-mp-primary","group-data-focused:text-mp-primary","group-data-invalid:text-mp-error","group-data-disabled:text-mp-on-surface/38"].join(" "),children:d(t,o)})}export function useFloatingLabel({floating:r,filled:e,pinned:t=!1}){const[n,a]=o.useState(!1);return{shrunk:!r||e||n||t,focusProps:{onFocusCapture:()=>a(!0),onBlurCapture:r=>{r.currentTarget.contains(r.relatedTarget)||a(!1)}}}}
+import{jsx as r,Fragment as t,jsxs as e}from"react/jsx-runtime";import*as o from"react";import{Field as a}from"@base-ui/react/field";import{PROSE_TEXT as n}from"./scale.js";const i={xs:"start-1",sm:"start-2",md:"start-3",lg:"start-3",xl:"start-4"},s={xs:"top-[18px]",sm:"top-[18px]",md:"top-5",lg:"top-5",xl:"top-5"};function d(o,a){return e(t,{children:[o,a?r("span",{"aria-hidden":"true",children:" *"}):null]})}export function MPFieldOutline({label:t,required:e=!1,notched:o=!0}){return r("fieldset",{"aria-hidden":"true",className:["pointer-events-none absolute inset-0 -top-[5px] m-0 min-w-0 px-2 pt-0","rounded-mp-xs border border-mp-outline","transition-[border-color] duration-(--mp-sys-motion-duration-short4)","group-hover:border-mp-on-surface","group-focus-within:border-2 group-focus-within:border-mp-primary","group-data-focused:border-2 group-data-focused:border-mp-primary","group-data-invalid:border-mp-error","group-data-disabled:border-mp-on-surface/12"].join(" "),children:t?r("legend",{className:["text-mp-body-small invisible float-none block h-[11px] w-auto overflow-hidden p-0","leading-none","ease-mp-standard transition-[max-width,padding]","duration-(--mp-sys-motion-duration-short4)",o?"max-w-full px-1":"max-w-0 px-0"].join(" "),children:d(t,e)}):null})}export function MPFieldLabel({size:t,label:e,required:o=!1,htmlFor:p,shrunk:u=!0,multiline:l=!1}){return r(a.Label,{htmlFor:p,"data-mp-shrunk":u?"":void 0,className:["text-mp-on-surface-variant","ease-mp-standard transition-[color,top,font-size,max-width]","duration-(--mp-sys-motion-duration-short4)","absolute -translate-y-1/2 px-1 leading-none",i[t],u?"text-mp-body-small pointer-events-auto top-0 max-w-none":[n[t],"pointer-events-none max-w-[calc(100%-2rem)] truncate",l?s[t]:"top-1/2"].join(" "),"group-focus-within:text-mp-primary","group-data-focused:text-mp-primary","group-data-invalid:text-mp-error","group-data-disabled:text-mp-on-surface/38"].join(" "),children:d(e,o)})}export function useFloatingLabel({floating:r,filled:t,pinned:e=!1}){const[a,n]=o.useState(!1);return{shrunk:!r||t||a||e,focusProps:{onFocusCapture:()=>n(!0),onBlurCapture:r=>{r.currentTarget.contains(r.relatedTarget)||n(!1)}}}}

package/dist/internal/SupportingText.d.ts

@@ -20,4 +20,4 @@ export declare function MPSupportingText({ description, errorMessage, className
     errorMessage?: React.ReactNode;
     /** Whatever inset lines the text up with the control it belongs to. */
     className?: string;
-}): React.JSX.Element | null;
+}): React.JSX.Element;

package/dist/internal/SupportingText.js

@@ -1,2 +1,2 @@
 "use client";
-import{jsx as r}from"react/jsx-runtime";import{Field as e}from"@base-ui/react/field";import{META_TEXT as t,hasContent as o}from"./scale.js";export function MPSupportingText({description:a,errorMessage:s,className:i}){const n=["mp-supporting-text block",t,"data-disabled:text-mp-on-surface/38",i??""].filter(Boolean).join(" ");return o(s)?r(e.Error,{match:!0,className:`${n} text-mp-error`,children:s}):o(a)?r(e.Description,{className:`${n} text-mp-on-surface-variant`,children:a}):null}
+import{jsx as r}from"react/jsx-runtime";import{Field as e}from"@base-ui/react/field";import{META_TEXT as t,hasContent as o}from"./scale.js";export function MPSupportingText({description:a,errorMessage:s,className:i}){const c=["mp-supporting-text block",t,"data-disabled:text-mp-on-surface/38",i??""].filter(Boolean).join(" ");return o(s)?r(e.Error,{match:!0,className:`${c} text-mp-error`,children:s}):o(a)?r(e.Description,{className:`${c} text-mp-on-surface-variant`,children:a}):r(e.Error,{className:`${c} text-mp-error`})}

package/dist/internal/animate.d.ts

@@ -52,28 +52,11 @@ export declare const ANIM_BASE = "mp-anim";
 export declare const ANIMATION_CLASS: Record<MPAnimation, string>;
 /** A curve, as the stylesheet spells it. */
 export declare function easingValue(easing: MPEasing): string;
-/**
- * A duration, as the stylesheet spells it.
- *
- * A number is milliseconds and lands as milliseconds. Nothing at all lands as
- * the effect's own Material token, so a page that retunes its motion moves this
- * animation with it.
- */
-export declare function durationValue(duration: number | undefined, effect: MPAnimation, mode?: MPAnimateMode): string;
 /** A number is pixels; a string is already a CSS length. */
 export declare function lengthValue(value: number | string): string;
 /** `'infinite'` reaches CSS as the word; a count reaches it as the number. */
 export declare function repeatValue(repeat: MPAnimateRepeat): string;
 export declare function isInfinite(repeat: MPAnimateRepeat | undefined): boolean;
-/**
- * `normal`, `reverse`, `alternate`, `alternate-reverse` — the four CSS already
- * has, assembled from the two props that mean something to a caller.
- *
- * `mode="out"` is a reversed run rather than a keyframe of its own, which is
- * also why a reversed animation ends held on its own first frame: `fill-mode`
- * is `both`, so a faded-out element stays faded out instead of snapping back.
- */
-export declare function directionValue(mode: MPAnimateMode, alternate: boolean | undefined): string;
 export interface AnimationSlotOptions {
     /** Which effect's tokens to fall back to, and which keyframe to run. */
     effect: MPAnimation;

package/dist/internal/animate.js

@@ -1,2 +1,2 @@
 "use client";
-import*as e from"react";export const ANIM_BASE="mp-anim";export const ANIMATION_CLASS={fade:"mp-anim-fade",grow:"mp-anim-scale",slide:"mp-anim-slide",zoom:"mp-anim-scale",rotate:"mp-anim-rotate",blink:"mp-anim-blink"};const n={fade:{in:"medium2",out:"short4"},grow:{in:"medium4",out:"short4"},slide:{in:"medium4",out:"short4"},zoom:{in:"medium4",out:"short4"},rotate:{in:"long2",out:"medium2"},blink:{in:"extra-long4",out:"extra-long4"}},t={fade:"emphasized-decelerate",grow:"emphasized-decelerate",slide:"emphasized-decelerate",zoom:"emphasized-decelerate",rotate:"emphasized-decelerate",blink:"standard"};export function easingValue(e){return`var(--mp-sys-motion-easing-${e})`}export function durationValue(e,t,i="in"){return void 0!==e?`${e}ms`:`var(--mp-sys-motion-duration-${n[t][i]})`}export function lengthValue(e){return"number"==typeof e?`${e}px`:e}export function repeatValue(e){return"infinite"===e?"infinite":String(e)}export function isInfinite(e){return"infinite"===e}export function directionValue(e,n){return"out"===e?n?"alternate-reverse":"reverse":n?"alternate":"normal"}export function animationSlots(e){const n=e.mode??"in",i={"--_mp-anim-duration":durationValue(e.duration,e.effect,n),"--_mp-anim-delay":`${e.delay}ms`,"--_mp-anim-ease":easingValue(e.easing??t[e.effect]),"--_mp-anim-repeat":repeatValue(e.repeat),"--_mp-anim-direction":directionValue(n,e.alternate)};return void 0!==e.opacity&&(i["--_mp-anim-opacity"]=String(e.opacity)),void 0!==e.scale&&(i["--_mp-anim-scale"]=String(e.scale)),void 0!==e.x&&(i["--_mp-anim-x"]=e.x),void 0!==e.y&&(i["--_mp-anim-y"]=e.y),void 0!==e.angle&&(i["--_mp-anim-angle"]=e.angle),void 0!==e.angleTo&&(i["--_mp-anim-angle-to"]=e.angleTo),i}export function slideOffsets(e,n){const t=lengthValue(n),i="number"==typeof n?-n+"px":`calc(-1 * ${t})`;switch(e){case"top":return{x:"0px",y:i};case"bottom":return{x:"0px",y:t};case"left":return{x:i,y:"0px"};default:return{x:t,y:"0px"}}}const i="(prefers-reduced-motion: reduce)";function a(e){if("undefined"==typeof window||!window.matchMedia)return()=>{};const n=window.matchMedia(i);return n.addEventListener("change",e),()=>n.removeEventListener("change",e)}function r(){return!("undefined"==typeof window||!window.matchMedia)&&window.matchMedia(i).matches}function o(){return!1}export function usePrefersReducedMotion(){return e.useSyncExternalStore(a,r,o)}export function useAnimationRun({trigger:n,play:t,once:i,threshold:a,paused:r,infinite:o}){const s=e.useRef(null),[u,m]=e.useState("mount"===n),[c,d]=e.useState(0),l=e.useCallback(()=>{m(!0),d(e=>e+1)},[]);e.useLayoutEffect(()=>{const e=s.current;if(!e||0===c)return;const n=[e,...e.querySelectorAll(".mp-anim, .mp-marquee-track")];for(const e of n)e.style.animationName="none";e.offsetWidth;for(const e of n)e.style.animationName=""},[c]),e.useEffect(()=>{if("visible"!==n)return;const e=s.current;if(!e||"undefined"==typeof IntersectionObserver)return void m(!0);const t=new IntersectionObserver(([e])=>{e.isIntersecting?(l(),i&&t.disconnect()):i||m(!1)},{threshold:a});return t.observe(e),()=>t.disconnect()},[n,i,a,l]),e.useEffect(()=>{"manual"===n&&(t?l():m(!1))},[n,t,l]);const p=e.useCallback(()=>{o&&m(!1)},[o]),f="hover"===n?{onPointerEnter:l,onFocus:l,onPointerLeave:p,onBlur:p}:{};return{ref:e.useCallback(e=>{s.current=e},[]),state:u&&!r?"running":"paused",started:u,handlers:f}}export function useAnimateElement(e){const{trigger:n,play:t,once:i,threshold:a,paused:r,infinite:o,...s}=e,u=useAnimationRun({trigger:n,play:t,once:i,threshold:a,paused:r,infinite:o});return{ref:u.ref,className:`mp-anim ${ANIMATION_CLASS[s.effect]}`,style:{...animationSlots(s),"--_mp-anim-state":u.state},props:{...u.handlers,"data-mp-animation":s.effect,"data-mp-state":u.state}}}
+import*as e from"react";export const ANIM_BASE="mp-anim";export const ANIMATION_CLASS={fade:"mp-anim-fade",grow:"mp-anim-scale",slide:"mp-anim-slide",zoom:"mp-anim-scale",rotate:"mp-anim-rotate",blink:"mp-anim-blink"};const n={fade:{in:"medium2",out:"short4"},grow:{in:"medium4",out:"short4"},slide:{in:"medium4",out:"short4"},zoom:{in:"medium4",out:"short4"},rotate:{in:"long2",out:"medium2"},blink:{in:"extra-long4",out:"extra-long4"}},t={fade:"emphasized-decelerate",grow:"emphasized-decelerate",slide:"emphasized-decelerate",zoom:"emphasized-decelerate",rotate:"emphasized-decelerate",blink:"standard"};export function easingValue(e){return`var(--mp-sys-motion-easing-${e})`}function i(e,t,i="in"){return void 0!==e?`${e}ms`:`var(--mp-sys-motion-duration-${n[t][i]})`}export function lengthValue(e){return"number"==typeof e?`${e}px`:e}export function repeatValue(e){return"infinite"===e?"infinite":String(e)}export function isInfinite(e){return"infinite"===e}function a(e,n){return"out"===e?n?"alternate-reverse":"reverse":n?"alternate":"normal"}export function animationSlots(e){const n=e.mode??"in",r={"--_mp-anim-duration":i(e.duration,e.effect,n),"--_mp-anim-delay":`${e.delay}ms`,"--_mp-anim-ease":easingValue(e.easing??t[e.effect]),"--_mp-anim-repeat":repeatValue(e.repeat),"--_mp-anim-direction":a(n,e.alternate)};return void 0!==e.opacity&&(r["--_mp-anim-opacity"]=String(e.opacity)),void 0!==e.scale&&(r["--_mp-anim-scale"]=String(e.scale)),void 0!==e.x&&(r["--_mp-anim-x"]=e.x),void 0!==e.y&&(r["--_mp-anim-y"]=e.y),void 0!==e.angle&&(r["--_mp-anim-angle"]=e.angle),void 0!==e.angleTo&&(r["--_mp-anim-angle-to"]=e.angleTo),r}export function slideOffsets(e,n){const t=lengthValue(n),i="number"==typeof n?-n+"px":`calc(-1 * ${t})`;switch(e){case"top":return{x:"0px",y:i};case"bottom":return{x:"0px",y:t};case"left":return{x:i,y:"0px"};default:return{x:t,y:"0px"}}}const r="(prefers-reduced-motion: reduce)";function o(e){if("undefined"==typeof window||!window.matchMedia)return()=>{};const n=window.matchMedia(r);return n.addEventListener("change",e),()=>n.removeEventListener("change",e)}function s(){return!("undefined"==typeof window||!window.matchMedia)&&window.matchMedia(r).matches}function m(){return!1}export function usePrefersReducedMotion(){return e.useSyncExternalStore(o,s,m)}export function useAnimationRun({trigger:n,play:t,once:i,threshold:a,paused:r,infinite:o}){const s=e.useRef(null),[m,u]=e.useState("mount"===n),[c,d]=e.useState(0),l=e.useCallback(()=>{u(!0),d(e=>e+1)},[]);e.useLayoutEffect(()=>{const e=s.current;if(!e||0===c)return;const n=[e,...e.querySelectorAll(".mp-anim, .mp-marquee-track")];for(const e of n)e.style.animationName="none";e.offsetWidth;for(const e of n)e.style.animationName=""},[c]),e.useEffect(()=>{if("visible"!==n)return;const e=s.current;if(!e||"undefined"==typeof IntersectionObserver)return void u(!0);const t=new IntersectionObserver(([e])=>{e.isIntersecting?(l(),i&&t.disconnect()):i||u(!1)},{threshold:a});return t.observe(e),()=>t.disconnect()},[n,i,a,l]),e.useEffect(()=>{"manual"===n&&(t?l():u(!1))},[n,t,l]);const p=e.useCallback(()=>{o&&u(!1)},[o]),f="hover"===n?{onPointerEnter:l,onFocus:l,onPointerLeave:p,onBlur:p}:{};return{ref:e.useCallback(e=>{s.current=e},[]),state:m&&!r?"running":"paused",started:m,handlers:f}}export function useAnimateElement(e){const{trigger:n,play:t,once:i,threshold:a,paused:r,infinite:o,...s}=e,m=useAnimationRun({trigger:n,play:t,once:i,threshold:a,paused:r,infinite:o});return{ref:m.ref,className:`mp-anim ${ANIMATION_CLASS[s.effect]}`,style:{...animationSlots(s),"--_mp-anim-state":m.state},props:{...m.handlers,"data-mp-animation":s.effect,"data-mp-state":m.state}}}

package/dist/internal/avatar-group.d.ts

@@ -0,0 +1,22 @@
+/**
+ * What an avatar inherits from the stack around it.
+ *
+ * Its own module rather than a file `MPAvatarGroup` exports, for the reason
+ * `button-group.ts` gives: both sides import it — the group provides the
+ * context and the avatar reads it — so putting it in either component would
+ * make one of them pull in the other, and an `MPAvatar` that dragged a group
+ * nobody used into the bundle is dead weight on every page with a face on it.
+ *
+ * Every field is optional and every one of them may legitimately be `undefined`.
+ * An avatar reads the group as a *fallback*, so "not set on the group" has to
+ * keep meaning "use the avatar's own default" rather than turning into one.
+ */
+import * as React from 'react';
+import type { MPColor, MPSize, MPVariant } from '../types.js';
+export interface MPAvatarGroupContextValue {
+    size?: MPSize;
+    shape?: 'circle' | 'square';
+    variant?: MPVariant;
+    color?: MPColor;
+}
+export declare const MPAvatarGroupContext: React.Context<MPAvatarGroupContextValue | null>;

package/dist/internal/avatar-group.js

@@ -0,0 +1,2 @@
+"use client";
+import*as t from"react";export const MPAvatarGroupContext=/*@__PURE__*/t.createContext(null);

package/dist/internal/button-group.d.ts

@@ -11,7 +11,7 @@
  * meaning "use the button's own default" rather than turning into one.
  */
 import * as React from 'react';
-import type { MPColor, MPSize, MPVariant } from '../types.js';
+import type { MPColor, MPOrientation, MPSize, MPVariant } from '../types.js';
 export interface MPButtonGroupContextValue {
     variant?: MPVariant;
     size?: MPSize;
@@ -19,3 +19,22 @@ export interface MPButtonGroupContextValue {
     disabled?: boolean;
 }
 export declare const MPButtonGroupContext: React.Context<MPButtonGroupContextValue | null>;
+/**
+ * The corners that face a neighbour.
+ *
+ * MD3's connected button group keeps the run's *outer* corners fully round and
+ * cuts the inner ones back to `corner-small`, so the row reads as one shape that
+ * has been divided rather than as three pills that happen to be adjacent. The
+ * seam is a 2px gap rather than a border, which is what lets a filled group work
+ * at all: two filled buttons sharing an edge merge into one blob, and a hairline
+ * between them would be the only line on the page drawn between two fills.
+ *
+ * Logical properties (`s`/`e`) rather than left/right: under RTL the first
+ * button is on the right, and `rounded-l-none` would flatten the wrong side.
+ *
+ * It is here rather than in `MPButtonGroup`, which was its first reader, because
+ * `MPToggleGroup` is a connected run of exactly the same shape — and two copies
+ * of one table is how a run of toggles ends up cut differently from a run of
+ * buttons beside it.
+ */
+export declare const GROUP_JOIN: Record<MPOrientation, string>;

package/dist/internal/button-group.js

@@ -1,2 +1,2 @@
 "use client";
-import*as t from"react";export const MPButtonGroupContext=/*@__PURE__*/t.createContext(null);
+import*as t from"react";export const MPButtonGroupContext=/*@__PURE__*/t.createContext(null);export const GROUP_JOIN={horizontal:"[&>*:not(:first-child)]:rounded-s-mp-sm [&>*:not(:last-child)]:rounded-e-mp-sm",vertical:"[&>*:not(:first-child)]:rounded-t-mp-sm [&>*:not(:last-child)]:rounded-b-mp-sm"};

package/dist/internal/color.d.ts

@@ -58,10 +58,6 @@ export interface MPColorValue {
 /** The three ways the picker will write a colour back out. */
 export type MPColorFormat = 'hex' | 'rgb' | 'hsl';
 export declare function clamp(value: number, min: number, max: number): number;
-export declare function hsvToRgb({ h, s, v }: MPHsv): MPRgb;
-export declare function rgbToHsv({ r, g, b }: MPRgb): MPHsv;
-export declare function rgbToHsl({ r, g, b }: MPRgb): MPHsl;
-export declare function hslToRgb({ h, s, l }: MPHsl): MPRgb;
 /**
  * A CSS colour string, or `null` if it is not one this understands.
  *
@@ -71,7 +67,6 @@ export declare function hslToRgb({ h, s, l }: MPHsl): MPRgb;
  * honest way back from `rebeccapurple` to a point on the panel.
  */
 export declare function parseColor(input: string): MPColorValue | null;
-export declare function rgbToHex({ r, g, b }: MPRgb, alpha?: number): string;
 /**
  * The value the component hands back, in whichever notation was asked for.
  *

package/dist/internal/color.js

@@ -1 +1 @@
-export function clamp(r,t,n){return r<t?t:r>n?n:r}function r(r){const t=r%360;return t<0?t+360:t}export function hsvToRgb({h:t,s:n,v:o}){const e=r(t)/60,a=clamp(n,0,100)/100,s=clamp(o,0,100)/100,c=s*a,l=c*(1-Math.abs(e%2-1)),u=s-c,i=Math.floor(e)%6,[g,h,f]=[[c,l,0],[l,c,0],[0,c,l],[0,l,c],[l,0,c],[c,0,l]][i];return{r:Math.round(255*(g+u)),g:Math.round(255*(h+u)),b:Math.round(255*(f+u))}}export function rgbToHsv({r:t,g:n,b:o}){const e=clamp(t,0,255)/255,a=clamp(n,0,255)/255,s=clamp(o,0,255)/255,c=Math.max(e,a,s),l=c-Math.min(e,a,s);let u=0;return 0!==l&&(u=c===e?(a-s)/l%6:c===a?(s-e)/l+2:(e-a)/l+4),{h:r(60*u),s:0===c?0:l/c*100,v:100*c}}export function rgbToHsl({r:r,g:t,b:n}){const{h:o,s:e,v:a}=rgbToHsv({r:r,g:t,b:n}),s=a/100,c=s*(1-e/100/2),l=Math.min(c,1-c);return{h:o,s:0===l?0:(s-c)/l*100,l:100*c}}export function hslToRgb({h:r,s:t,l:n}){const o=clamp(n,0,100)/100,e=o+clamp(t,0,100)/100*Math.min(o,1-o);return hsvToRgb({h:r,s:0===e?0:2*(1-o/e)*100,v:100*e})}const t=/^#?([0-9a-f]{3,8})$/i;export function parseColor(r){const n=r.trim().toLowerCase();if(!n)return null;if(n.startsWith("#")||t.test(n))return function(r){const n=t.exec(r.trim());if(!n)return null;const o=n[1],e=3===o.length||4===o.length?[...o].map(r=>r+r).join(""):o;if(6!==e.length&&8!==e.length)return null;const a=r=>parseInt(e.slice(2*r,2*r+2),16);return{hsv:rgbToHsv({r:a(0),g:a(1),b:a(2)}),alpha:8===e.length?a(3)/255:1}}(n);const o=/^(rgba?|hsla?)\((.*)\)$/.exec(n);if(!o)return null;const[,e,a]=o,s=function(r){return r.match(/-?[\d.]+%?/g)??[]}(a),c=s.map(r=>parseFloat(r));if(c.length<3||c.some(Number.isNaN))return null;const l=function(r,t){return t.length<=3?1:clamp(r[3]?.endsWith("%")?t[3]/100:t[3],0,1)}(s,c);return e.startsWith("rgb")?{hsv:rgbToHsv({r:c[0],g:c[1],b:c[2]}),alpha:l}:{hsv:rgbToHsv(hslToRgb({h:c[0],s:c[1],l:c[2]})),alpha:l}}function n(r){return clamp(Math.round(r),0,255).toString(16).padStart(2,"0")}export function rgbToHex({r:r,g:t,b:o},e=1){const a=`#${n(r)}${n(t)}${n(o)}`;return e>=1?a:`${a}${n(255*e)}`}function o(r){return String(Math.round(100*clamp(r,0,1))/100)}export function formatColor(r,t,n){const e=hsvToRgb(r);if("hex"===n)return rgbToHex(e,t);if("rgb"===n){const r=`${e.r}, ${e.g}, ${e.b}`;return t>=1?`rgb(${r})`:`rgba(${r}, ${o(t)})`}const{h:a,s:s,l:c}=rgbToHsl(e),l=`${Math.round(a)}, ${Math.round(s)}%, ${Math.round(c)}%`;return t>=1?`hsl(${l})`:`hsla(${l}, ${o(t)})`}export function cssColor(r,t=1){const{r:n,g:e,b:a}=hsvToRgb(r);return t>=1?`rgb(${n}, ${e}, ${a})`:`rgba(${n}, ${e}, ${a}, ${o(t)})`}export function readableInk(r){const{r:t,g:n,b:o}=hsvToRgb(r),e=r=>{const t=r/255;return t<=.03928?t/12.92:((t+.055)/1.055)**2.4};return.2126*e(t)+.7152*e(n)+.0722*e(o)>.42?"#000000":"#ffffff"}export const DEFAULT_SWATCHES=["#000000","#4b5563","#9ca3af","#ffffff","#ef4444","#f97316","#f59e0b","#84cc16","#22c55e","#14b8a6","#06b6d4","#3b82f6","#6366f1","#8b5cf6","#d946ef","#ec4899"];export const CHECKER_BACKGROUND={backgroundImage:"linear-gradient(45deg, var(--_mp-color-outline-variant) 25%, transparent 25%), linear-gradient(-45deg, var(--_mp-color-outline-variant) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, var(--_mp-color-outline-variant) 75%), linear-gradient(-45deg, transparent 75%, var(--_mp-color-outline-variant) 75%)",backgroundSize:"8px 8px",backgroundPosition:"0 0, 0 4px, 4px -4px, -4px 0"};
+export function clamp(n,t,r){return n<t?t:n>r?r:n}function n(n){const t=n%360;return t<0?t+360:t}function t({h:t,s:r,v:a}){const o=n(t)/60,e=clamp(r,0,100)/100,c=clamp(a,0,100)/100,u=c*e,l=u*(1-Math.abs(o%2-1)),i=c-u,s=Math.floor(o)%6,[f,h,p]=[[u,l,0],[l,u,0],[0,u,l],[0,l,u],[l,0,u],[u,0,l]][s];return{r:Math.round(255*(f+i)),g:Math.round(255*(h+i)),b:Math.round(255*(p+i))}}function r({r:t,g:r,b:a}){const o=clamp(t,0,255)/255,e=clamp(r,0,255)/255,c=clamp(a,0,255)/255,u=Math.max(o,e,c),l=u-Math.min(o,e,c);let i=0;return 0!==l&&(i=u===o?(e-c)/l%6:u===e?(c-o)/l+2:(o-e)/l+4),{h:n(60*i),s:0===u?0:l/u*100,v:100*u}}function a({h:n,s:r,l:a}){const o=clamp(a,0,100)/100,e=o+clamp(r,0,100)/100*Math.min(o,1-o);return t({h:n,s:0===e?0:2*(1-o/e)*100,v:100*e})}const o=/^#?([0-9a-f]{3,8})$/i;export function parseColor(n){const t=n.trim().toLowerCase();if(!t)return null;if(t.startsWith("#")||o.test(t))return function(n){const t=o.exec(n.trim());if(!t)return null;const a=t[1],e=3===a.length||4===a.length?[...a].map(n=>n+n).join(""):a;if(6!==e.length&&8!==e.length)return null;const c=n=>parseInt(e.slice(2*n,2*n+2),16);return{hsv:r({r:c(0),g:c(1),b:c(2)}),alpha:8===e.length?c(3)/255:1}}(t);const e=/^(rgba?|hsla?)\((.*)\)$/.exec(t);if(!e)return null;const[,c,u]=e,l=function(n){return n.match(/-?[\d.]+%?/g)??[]}(u),i=l.map(n=>parseFloat(n));if(i.length<3||i.some(Number.isNaN))return null;const s=function(n,t){return t.length<=3?1:clamp(n[3]?.endsWith("%")?t[3]/100:t[3],0,1)}(l,i);return c.startsWith("rgb")?{hsv:r({r:i[0],g:i[1],b:i[2]}),alpha:s}:{hsv:r(a({h:i[0],s:i[1],l:i[2]})),alpha:s}}function e(n){return clamp(Math.round(n),0,255).toString(16).padStart(2,"0")}function c(n){return String(Math.round(100*clamp(n,0,1))/100)}export function formatColor(n,a,o){const u=t(n);if("hex"===o)return function({r:n,g:t,b:r},a=1){const o=`#${e(n)}${e(t)}${e(r)}`;return a>=1?o:`${o}${e(255*a)}`}(u,a);if("rgb"===o){const n=`${u.r}, ${u.g}, ${u.b}`;return a>=1?`rgb(${n})`:`rgba(${n}, ${c(a)})`}const{h:l,s:i,l:s}=function({r:n,g:t,b:a}){const{h:o,s:e,v:c}=r({r:n,g:t,b:a}),u=c/100,l=u*(1-e/100/2),i=Math.min(l,1-l);return{h:o,s:0===i?0:(u-l)/i*100,l:100*l}}(u),f=`${Math.round(l)}, ${Math.round(i)}%, ${Math.round(s)}%`;return a>=1?`hsl(${f})`:`hsla(${f}, ${c(a)})`}export function cssColor(n,r=1){const{r:a,g:o,b:e}=t(n);return r>=1?`rgb(${a}, ${o}, ${e})`:`rgba(${a}, ${o}, ${e}, ${c(r)})`}export function readableInk(n){const{r:r,g:a,b:o}=t(n),e=n=>{const t=n/255;return t<=.03928?t/12.92:((t+.055)/1.055)**2.4};return.2126*e(r)+.7152*e(a)+.0722*e(o)>.42?"#000000":"#ffffff"}export const DEFAULT_SWATCHES=["#000000","#4b5563","#9ca3af","#ffffff","#ef4444","#f97316","#f59e0b","#84cc16","#22c55e","#14b8a6","#06b6d4","#3b82f6","#6366f1","#8b5cf6","#d946ef","#ec4899"];export const CHECKER_BACKGROUND={backgroundImage:"linear-gradient(45deg, var(--_mp-color-outline-variant) 25%, transparent 25%), linear-gradient(-45deg, var(--_mp-color-outline-variant) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, var(--_mp-color-outline-variant) 75%), linear-gradient(-45deg, transparent 75%, var(--_mp-color-outline-variant) 75%)",backgroundSize:"8px 8px",backgroundPosition:"0 0, 0 4px, 4px -4px, -4px 0"};

package/dist/internal/date.js

@@ -1 +1 @@
-export const YEAR_PAGE_SIZE=12;export function makeDate(t,e,r){const n=new Date(0);return n.setFullYear(t,e,r),n.setHours(0,0,0,0),n}export function isValidDate(t){return t instanceof Date&&!Number.isNaN(t.getTime())}export function startOfDay(t){const e=new Date(t.getTime());return e.setHours(0,0,0,0),e}export function startOfMonth(t){return makeDate(t.getFullYear(),t.getMonth(),1)}export function daysInMonth(t,e){return makeDate(t,e+1,0).getDate()}export function today(){return startOfDay(new Date)}export function addDays(t,e){const r=new Date(t.getTime());return r.setDate(r.getDate()+e),r}export function addMonths(t,e){const r=new Date(t.getTime()),n=makeDate(t.getFullYear(),t.getMonth()+e,1);return r.setFullYear(n.getFullYear(),n.getMonth(),Math.min(t.getDate(),daysInMonth(n.getFullYear(),n.getMonth()))),r}export function addYears(t,e){return addMonths(t,12*e)}export function compareDay(t,e){return startOfDay(t).getTime()-startOfDay(e).getTime()}export function isSameDay(t,e){return isValidDate(t)&&isValidDate(e)&&0===compareDay(t,e)}export function isSameMonth(t,e){return isValidDate(t)&&isValidDate(e)&&t.getFullYear()===e.getFullYear()&&t.getMonth()===e.getMonth()}export function isDayOutside(t,e,r){return!!(isValidDate(e)&&compareDay(t,e)<0)||isValidDate(r)&&compareDay(t,r)>0}export function secondsOfDay(t){return 3600*t.getHours()+60*t.getMinutes()+t.getSeconds()}export function timeUnitSpan(t,e){const r=secondsOfDay(e);if("hour"===t){const t=3600*Math.floor(r/3600);return[t,t+3599]}if("minute"===t){const t=60*Math.floor(r/60);return[t,t+59]}if("second"===t)return[r,r];const n=e.getHours()<12?0:43200;return[n,n+43200-1]}export function withTime(t,e){const r=new Date(t.getTime());return r.setHours(e.hours??r.getHours(),e.minutes??r.getMinutes(),e.seconds??r.getSeconds(),0),r}export function mergeDateAndTime(t,e){return withTime(startOfDay(t),{hours:e.getHours(),minutes:e.getMinutes(),seconds:e.getSeconds()})}export function calendarWeeks(t,e){const r=startOfMonth(t),n=(r.getDay()-e+7)%7,o=addDays(r,-n);return Array.from({length:6},(t,e)=>Array.from({length:7},(t,r)=>addDays(o,7*e+r)))}export function yearPageStart(t){return t-(t%12+12)%12}const t=new Map;export function dateFormatter(e,r){const n=`${e??""}\0${JSON.stringify(r)}`;let o=t.get(n);return o||(o=new Intl.DateTimeFormat(e,r),t.set(n,o)),o}export function formatDate(t,e,r){return isValidDate(t)?dateFormatter(e,r).format(t):""}const e=Array.from({length:24},(t,e)=>new Date(2027,e%12,21+e%7,e,58,58));export function displaySamples(t,r){const n=dateFormatter(t,r);return[...new Set(e.map(t=>n.format(t)))]}export function withPlaceholder(t,e){return"string"==typeof e&&""!==e?[...t,e]:t}export function toISODate(t){const e=t=>String(t).padStart(2,"0");return`${String(t.getFullYear()).padStart(4,"0")}-${e(t.getMonth()+1)}-${e(t.getDate())}`}export function toISOTime(t,e=!1){const r=t=>String(t).padStart(2,"0"),n=`${r(t.getHours())}:${r(t.getMinutes())}`;return e?`${n}:${r(t.getSeconds())}`:n}export function toISODateTime(t,e=!1){return`${toISODate(t)}T${toISOTime(t,e)}`}const r=makeDate(2021,7,1),n=new Map;export function weekdayLabels(t,e,o="narrow"){const a=`w ${t??""} ${e} ${o}`;let s=n.get(a);if(!s){const i=dateFormatter(t,{weekday:o});s=Array.from({length:7},(t,n)=>i.format(addDays(r,(e+n)%7))),n.set(a,s)}return s}export function monthLabels(t,e="short"){const r=`m ${t??""} ${e}`;let o=n.get(r);if(!o){const a=dateFormatter(t,{month:e});o=Array.from({length:12},(t,e)=>a.format(makeDate(2021,e,1))),n.set(r,o)}return o}export function isMonthBeforeYear(t){const e=dateFormatter(t,{year:"numeric",month:"long"}).formatToParts(r);return e.findIndex(t=>"month"===t.type)<e.findIndex(t=>"year"===t.type)}export function isHour12(t){const e=dateFormatter(t,{hour:"numeric"}).resolvedOptions();return e.hourCycle?"h11"===e.hourCycle||"h12"===e.hourCycle:!0===e.hour12}export function meridiemLabels(t){const e=dateFormatter(t,{hour:"numeric",hour12:!0}),n=t=>{const n=e.formatToParts(withTime(r,{hours:t})).find(t=>"dayPeriod"===t.type);return n?.value??(t<12?"AM":"PM")};return[n(9),n(21)]}export function localeWeekStart(t){try{const e=t??(new Intl.DateTimeFormat).resolvedOptions().locale,r=new Intl.Locale(e),n="function"==typeof r.getWeekInfo?r.getWeekInfo():r.weekInfo;if("number"==typeof n?.firstDay)return n.firstDay%7}catch{}return 0}
+export const YEAR_PAGE_SIZE=12;export function makeDate(t,e,r){const n=new Date(0);return n.setFullYear(t,e,r),n.setHours(0,0,0,0),n}export function isValidDate(t){return t instanceof Date&&!Number.isNaN(t.getTime())}export function startOfDay(t){const e=new Date(t.getTime());return e.setHours(0,0,0,0),e}export function startOfMonth(t){return makeDate(t.getFullYear(),t.getMonth(),1)}export function daysInMonth(t,e){return makeDate(t,e+1,0).getDate()}export function today(){return startOfDay(new Date)}export function addDays(t,e){const r=new Date(t.getTime());return r.setDate(r.getDate()+e),r}export function addMonths(t,e){const r=new Date(t.getTime()),n=makeDate(t.getFullYear(),t.getMonth()+e,1);return r.setFullYear(n.getFullYear(),n.getMonth(),Math.min(t.getDate(),daysInMonth(n.getFullYear(),n.getMonth()))),r}export function addYears(t,e){return addMonths(t,12*e)}export function compareDay(t,e){return startOfDay(t).getTime()-startOfDay(e).getTime()}export function isSameDay(t,e){return isValidDate(t)&&isValidDate(e)&&0===compareDay(t,e)}export function isSameMonth(t,e){return isValidDate(t)&&isValidDate(e)&&t.getFullYear()===e.getFullYear()&&t.getMonth()===e.getMonth()}export function isDayOutside(t,e,r){return!!(isValidDate(e)&&compareDay(t,e)<0)||isValidDate(r)&&compareDay(t,r)>0}export function secondsOfDay(t){return 3600*t.getHours()+60*t.getMinutes()+t.getSeconds()}export function timeUnitSpan(t,e){const r=secondsOfDay(e);if("hour"===t){const t=3600*Math.floor(r/3600);return[t,t+3599]}if("minute"===t){const t=60*Math.floor(r/60);return[t,t+59]}if("second"===t)return[r,r];const n=e.getHours()<12?0:43200;return[n,n+43200-1]}export function withTime(t,e){const r=new Date(t.getTime());return r.setHours(e.hours??r.getHours(),e.minutes??r.getMinutes(),e.seconds??r.getSeconds(),0),r}export function mergeDateAndTime(t,e){return withTime(startOfDay(t),{hours:e.getHours(),minutes:e.getMinutes(),seconds:e.getSeconds()})}export function calendarWeeks(t,e){const r=startOfMonth(t),n=(r.getDay()-e+7)%7,o=addDays(r,-n);return Array.from({length:6},(t,e)=>Array.from({length:7},(t,r)=>addDays(o,7*e+r)))}export function yearPageStart(t){return t-(t%12+12)%12}function t(t,e,r){if(t.set(e,r),t.size>64){const e=t.keys().next();e.done||t.delete(e.value)}return r}const e=new Map;export function dateFormatter(r,n){const o=`${r??""}\0${JSON.stringify(n)}`,a=e.get(o);return a||t(e,o,new Intl.DateTimeFormat(r,n))}export function formatDate(t,e,r){return isValidDate(t)?dateFormatter(e,r).format(t):""}const r=Array.from({length:24},(t,e)=>new Date(2027,e%12,21+e%7,e,58,58));export function displaySamples(t,e){const n=dateFormatter(t,e);return[...new Set(r.map(t=>n.format(t)))]}export function withPlaceholder(t,e){return"string"==typeof e&&""!==e?[...t,e]:t}export function toISODate(t){const e=t=>String(t).padStart(2,"0");return`${String(t.getFullYear()).padStart(4,"0")}-${e(t.getMonth()+1)}-${e(t.getDate())}`}export function toISOTime(t,e=!1){const r=t=>String(t).padStart(2,"0"),n=`${r(t.getHours())}:${r(t.getMinutes())}`;return e?`${n}:${r(t.getSeconds())}`:n}export function toISODateTime(t,e=!1){return`${toISODate(t)}T${toISOTime(t,e)}`}const n=makeDate(2021,7,1),o=new Map;export function weekdayLabels(e,r,a="narrow"){const u=`w ${e??""} ${r} ${a}`,i=o.get(u);if(i)return i;const s=dateFormatter(e,{weekday:a});return t(o,u,Array.from({length:7},(t,e)=>s.format(addDays(n,(r+e)%7))))}export function monthLabels(e,r="short"){const n=`m ${e??""} ${r}`,a=o.get(n);if(a)return a;const u=dateFormatter(e,{month:r});return t(o,n,Array.from({length:12},(t,e)=>u.format(makeDate(2021,e,1))))}export function isMonthBeforeYear(t){const e=dateFormatter(t,{year:"numeric",month:"long"}).formatToParts(n);return e.findIndex(t=>"month"===t.type)<e.findIndex(t=>"year"===t.type)}export function isHour12(t){const e=dateFormatter(t,{hour:"numeric"}).resolvedOptions();return e.hourCycle?"h11"===e.hourCycle||"h12"===e.hourCycle:!0===e.hour12}export function meridiemLabels(t){const e=dateFormatter(t,{hour:"numeric",hour12:!0}),r=t=>{const r=e.formatToParts(withTime(n,{hours:t})).find(t=>"dayPeriod"===t.type);return r?.value??(t<12?"AM":"PM")};return[r(9),r(21)]}export function localeWeekStart(t){try{const e=t??(new Intl.DateTimeFormat).resolvedOptions().locale,r=new Intl.Locale(e),n="function"==typeof r.getWeekInfo?r.getWeekInfo():r.weekInfo;if("number"==typeof n?.firstDay)return n.firstDay%7}catch{}return 0}