material-plus-ui 1.0.0 → 1.2.0

package/dist/components/spoiler/MPSpoiler.js

@@ -1 +1 @@
-import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as a from"react";import{MPButton as o}from"../button/MPButton";import{useMPLocale as i,useMPMessages as n}from"../../internal/locale";import{hasContent as t,META_TEXT as l,SHEET_PAD as d,SHEET_PAD_X as s,SHEET_PAD_Y as c}from"../../internal/scale";import{CONTAINER_SURFACE as m}from"../../internal/surface";const p="[background-color:color-mix(in_oklab,var(--_mp-color-surface)_55%,transparent)]";export const MPSpoiler=a.forwardRef(function({revealed:u,defaultRevealed:f=!1,onRevealedChange:v,locale:x,label:h,hideLabel:b,description:j,action:N,reversible:g=!1,maxHeight:y,blur:z=10,padded:k=!0,variant:w="outlined",size:B="md",color:C="primary",className:R,children:_,...H},M){const P=i(x),S=n("spoiler",P),$=a.useId(),[I,L]=a.useState(f),q=u??I,A=e=>{void 0===u&&L(e),v?.(e)},D=!1===j?null:j??S.notice;return r("div",{ref:M,"data-mp-size":B,"data-mp-variant":w,"data-mp-revealed":q||void 0,className:["mp-spoiler rounded-mp-md relative isolate overflow-hidden","box-border",m[w],"text-mp-on-surface",R??""].filter(Boolean).join(" "),...H,children:[e("div",{id:$,className:["min-w-0",k?d[B]:"","transition-[filter] duration-(--mp-sys-motion-duration-short4) ease-mp-standard","motion-reduce:transition-none",q?"":"select-none"].filter(Boolean).join(" "),style:{filter:q?void 0:`blur(${z}px)`,maxHeight:q?void 0:y,overflow:q?void 0:"hidden"},inert:!q,children:_}),q?null:r("div",{className:["absolute inset-0 z-10 flex flex-col items-center justify-center gap-2 text-center",d[B],p].join(" "),children:[t(D)?e("p",{className:`text-mp-on-surface-variant m-0 ${l}`,children:D}):null,N??e(o,{variant:"tonal",size:B,color:C,onClick:()=>A(!0),"aria-expanded":!1,"aria-controls":$,children:h??S.reveal})]}),q&&g?e("div",{className:["flex justify-end",s[B],c[B],"pt-0"].join(" "),children:e(o,{variant:"text",size:B,color:C,onClick:()=>A(!1),"aria-expanded":!0,"aria-controls":$,children:b??S.hide})}):null]})});
+import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as a from"react";import{MPButton as o}from"../button/MPButton";import{inertProps as i}from"../../internal/inert";import{useMPLocale as n,useMPMessages as t}from"../../internal/locale";import{hasContent as l,META_TEXT as d,SHEET_PAD as s,SHEET_PAD_X as c,SHEET_PAD_Y as m}from"../../internal/scale";import{CONTAINER_SURFACE as p}from"../../internal/surface";const f="[background-color:color-mix(in_oklab,var(--_mp-color-surface)_55%,transparent)]";export const MPSpoiler=a.forwardRef(function({revealed:u,defaultRevealed:v=!1,onRevealedChange:x,locale:h,label:b,hideLabel:j,description:N,action:g,reversible:y=!1,maxHeight:z,blur:k=10,padded:w=!0,variant:B="outlined",size:C="md",color:R="primary",className:_,children:H,...M},P){const S=n(h),$=t("spoiler",S),I=a.useId(),[L,q]=a.useState(v),A=u??L,D=e=>{void 0===u&&q(e),x?.(e)},E=!1===N?null:N??$.notice;return r("div",{ref:P,"data-mp-size":C,"data-mp-variant":B,"data-mp-revealed":A||void 0,className:["mp-spoiler rounded-mp-md relative isolate overflow-hidden","box-border",p[B],"text-mp-on-surface",_??""].filter(Boolean).join(" "),...M,children:[e("div",{id:I,className:["min-w-0",w?s[C]:"","transition-[filter] duration-(--mp-sys-motion-duration-short4) ease-mp-standard","motion-reduce:transition-none",A?"":"select-none"].filter(Boolean).join(" "),style:{filter:A?void 0:`blur(${k}px)`,maxHeight:A?void 0:z,overflow:A?void 0:"hidden"},...i(!A),children:H}),A?null:r("div",{className:["absolute inset-0 z-10 flex flex-col items-center justify-center gap-2 text-center",s[C],f].join(" "),children:[l(E)?e("p",{className:`text-mp-on-surface-variant m-0 ${d}`,children:E}):null,g??e(o,{variant:"tonal",size:C,color:R,onClick:()=>D(!0),"aria-expanded":!1,"aria-controls":I,children:b??$.reveal})]}),A&&y?e("div",{className:["flex justify-end",c[C],m[C],"pt-0"].join(" "),children:e(o,{variant:"text",size:C,color:R,onClick:()=>D(!1),"aria-expanded":!0,"aria-controls":I,children:j??$.hide})}):null]})});

package/dist/components/switch/MPSwitch.d.ts

@@ -50,8 +50,8 @@ export interface MPSwitchProps {
     /** Name of the form control. */
     name?: string;
     /**
-     * The id put on the control and pointed at by the label. Derived from `name`
-     * when omitted, and generated when there is no name either.
+     * The id put on the control and pointed at by the label. Generated when it is
+     * left out.
      */
     id?: string;
     /**

package/dist/components/switch/MPSwitch.js

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

package/dist/components/table/MPTable.d.ts

@@ -70,7 +70,20 @@ export interface MPTableProps<Row> extends Omit<React.ComponentPropsWithoutRef<'
      * @default false
      */
     stickyHeader?: boolean;
-    /** Makes rows activatable. Also turns on the hover treatment. */
+    /**
+     * Makes rows activatable. Also turns on the hover treatment.
+     *
+     * A row that answers a press has to answer a keyboard too, so each one joins
+     * the tab order and takes Enter and Space. That is the honest minimum for a
+     * `<tr>` — a row cannot be wrapped in a `<button>` the way an
+     * [MPListItem](../layout/list) is, because a `<button>` is not something a
+     * `<tbody>` may contain.
+     *
+     * It is also worth knowing what it costs: a table of two hundred rows becomes
+     * two hundred tab stops. When the row's job is to *navigate*, put a link in
+     * the first cell instead — one tab stop per row that is already announced as
+     * a link and can be opened in a new tab.
+     */
     onRowClick?: (row: Row, index: number) => void;
     /**
      * How much surface the sheet around the table paints.

package/dist/components/table/MPTable.js

@@ -1 +1 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import{accentSlots as r}from"../../internal/accent";import{META_TEXT as a}from"../../internal/scale";import{CONTAINER_SURFACE as l}from"../../internal/surface";const o={xs:"0.625rem",sm:"0.75rem",md:"1rem",lg:"1.25rem",xl:"1.5rem"},m={xs:"0.375rem",sm:"0.625rem",md:"1rem",lg:"1.25rem",xl:"1.5rem"},n={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"},i={xs:"text-mp-label-medium",sm:"text-mp-label-medium",md:"text-mp-title-small",lg:"text-mp-title-small",xl:"text-mp-title-medium"},s=["[--_mp-row:transparent]","transition-[background-color] duration-(--mp-sys-motion-duration-short4)"].join(" ");export function MPTable({headers:c,items:d,getRowKey:p,caption:x,empty:u="No data",striped:y=!1,hoverable:h=!1,stickyHeader:g=!1,onRowClick:b,variant:f="outlined",size:v="md",color:w="primary",className:k,style:N,..._}){const j=o[v],$=m[v],C=Boolean(b),A=h||C,B={padding:`${$} ${j}`},z={...B,backgroundColor:"var(--_mp-color-surface-container)"},R={borderTop:"1px solid var(--_mp-color-outline-variant)",backgroundColor:"var(--_mp-row)"};return e("div",{"data-mp-size":v,"data-mp-variant":f,className:["mp-table rounded-mp-md overflow-x-auto",l[f],k??""].filter(Boolean).join(" "),style:{...r(w),...N},..._,children:t("table",{className:`text-mp-on-surface w-full text-start ${n[v]}`,style:{borderCollapse:"collapse"},children:[x?e("caption",{className:`text-mp-on-surface-variant ${a}`,style:{...B,textAlign:"start"},children:x}):null,e("colgroup",{children:c.map(t=>{return e("col",{style:void 0===t.width?void 0:{width:(r=t.width,"number"==typeof r?`${r}px`:r)}},t.key);var r})}),e("thead",{children:e("tr",{children:c.map(t=>e("th",{scope:"col",className:["text-mp-on-surface-variant whitespace-nowrap",i[v],g?"sticky top-0 z-10":""].filter(Boolean).join(" "),style:{...z,textAlign:t.align??"start"},children:t.label??t.key},t.key))})}),e("tbody",{children:0===d.length?e("tr",{className:s,style:R,children:e("td",{colSpan:c.length,className:"text-mp-on-surface-variant",style:{padding:`2rem ${j}`,textAlign:"center"},children:u})}):d.map((t,r)=>e("tr",{className:[s,y&&r%2==1?"[--_mp-row:var(--_mp-color-surface-container-low)]":"",A?"hover:[--_mp-row:var(--_mp-color-surface-container)]":"",C?"cursor-pointer":""].filter(Boolean).join(" "),style:R,onClick:b?()=>b(t,r):void 0,children:c.map(a=>e("td",{style:{...B,textAlign:a.align??"start"},children:a.render?a.render(t,r):t[a.key]},a.key))},p?p(t,r):r))})]})})}
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import{accentSlots as r}from"../../internal/accent";import{META_TEXT as o}from"../../internal/scale";import{CONTAINER_SURFACE as l}from"../../internal/surface";const a={xs:"0.625rem",sm:"0.75rem",md:"1rem",lg:"1.25rem",xl:"1.5rem"},n={xs:"0.375rem",sm:"0.625rem",md:"1rem",lg:"1.25rem",xl:"1.5rem"},i={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"},m={xs:"text-mp-label-medium",sm:"text-mp-label-medium",md:"text-mp-title-small",lg:"text-mp-title-small",xl:"text-mp-title-medium"},s=["[--_mp-row:transparent]","transition-[background-color] duration-(--mp-sys-motion-duration-short4)"].join(" ");export function MPTable({headers:c,items:d,getRowKey:p,caption:u,empty:x="No data",striped:y=!1,hoverable:f=!1,stickyHeader:v=!1,onRowClick:h,variant:b="outlined",size:g="md",color:w="primary",className:k,style:N,...j}){const _=a[g],$=n[g],C=Boolean(h),A=f||C,B={padding:`${$} ${_}`},z={...B,backgroundColor:"var(--_mp-color-surface-container)"},T={borderTop:"1px solid var(--_mp-color-outline-variant)",backgroundColor:"var(--_mp-row)"};return e("div",{"data-mp-size":g,"data-mp-variant":b,className:["mp-table rounded-mp-md overflow-x-auto",l[b],k??""].filter(Boolean).join(" "),style:{...r(w),...N},...j,children:t("table",{className:`text-mp-on-surface w-full text-start ${i[g]}`,style:{borderCollapse:"collapse"},children:[u?e("caption",{className:`text-mp-on-surface-variant ${o}`,style:{...B,textAlign:"start"},children:u}):null,e("colgroup",{children:c.map(t=>{return e("col",{style:void 0===t.width?void 0:{width:(r=t.width,"number"==typeof r?`${r}px`:r)}},t.key);var r})}),e("thead",{children:e("tr",{children:c.map(t=>e("th",{scope:"col",className:["text-mp-on-surface-variant whitespace-nowrap",m[g],v?"sticky top-0 z-10":""].filter(Boolean).join(" "),style:{...z,textAlign:t.align??"start"},children:t.label??t.key},t.key))})}),e("tbody",{children:0===d.length?e("tr",{className:s,style:T,children:e("td",{colSpan:c.length,className:"text-mp-on-surface-variant",style:{padding:`2rem ${_}`,textAlign:"center"},children:x})}):d.map((t,r)=>e("tr",{className:[s,y&&r%2==1?"[--_mp-row:var(--_mp-color-surface-container-low)]":"",A?"hover:[--_mp-row:var(--_mp-color-surface-container)]":"",C?["cursor-pointer","outline-mp-secondary focus-visible:outline-2","focus-visible:-outline-offset-2 focus-visible:outline-solid outline-none"].join(" "):""].filter(Boolean).join(" "),style:T,tabIndex:C?0:void 0,onClick:h?()=>h(t,r):void 0,onKeyDown:h?e=>{"Enter"!==e.key&&" "!==e.key||e.target===e.currentTarget&&(e.preventDefault(),h(t,r))}:void 0,children:c.map(o=>e("td",{style:{...B,textAlign:o.align??"start"},children:o.render?o.render(t,r):t[o.key]},o.key))},p?p(t,r):r))})]})})}

package/dist/components/tabs/MPTabs.d.ts

@@ -0,0 +1,145 @@
+import * as React from 'react';
+import type { MPColor, MPStyleProps } from '../../types';
+/**
+ * MD3's two kinds of tab.
+ *
+ * They are not two levels of emphasis, they are two *depths*: primary tabs are
+ * the top level of a screen, and secondary tabs divide the content inside one of
+ * them. The specification draws that difference three ways — the indicator is
+ * 3dp and rounded against 2dp and square, it hugs the label rather than filling
+ * the tab, and the chosen label takes the accent rather than the plain ink — and
+ * all three are here.
+ *
+ * There is deliberately no third value. A `variant` ladder like the buttons' one
+ * would be an emphasis axis, and a tab bar has nothing to be emphatic about: it
+ * is the map of a screen, not an action on it.
+ */
+export type MPTabsVariant = 'primary' | 'secondary';
+/** Where the glyph sits relative to the label. */
+export type MPTabIconPosition = 'top' | 'start';
+/**
+ * A tab's value. The same restraint `MPSelect` puts on its own — an identifier,
+ * not an arbitrary object, because it is also what picks out the panel.
+ */
+export type MPTabValue = string | number;
+export interface MPTabsProps extends MPStyleProps, Omit<React.ComponentPropsWithoutRef<'div'>, 'color' | 'defaultValue' | 'onChange'> {
+    /**
+     * Which of MD3's two kinds of tab bar this is: `primary` for the top level of
+     * a screen, `secondary` for a division inside one of its panels.
+     * @default 'primary'
+     */
+    variant?: MPTabsVariant;
+    /**
+     * Which accent family the chosen tab and the indicator read.
+     * @default 'primary'
+     */
+    color?: MPColor;
+    /** The chosen tab. Use with `onValueChange` for a controlled set. */
+    value?: MPTabValue | null;
+    /** Which starts chosen, for an uncontrolled set. */
+    defaultValue?: MPTabValue | null;
+    /** Called with the chosen tab's value. */
+    onValueChange?: (value: MPTabValue | null) => void;
+    /**
+     * Where a tab's glyph sits. Defaults to what the variant does in the
+     * specification: above the label on a primary tab, before it on a secondary
+     * one.
+     */
+    iconPosition?: MPTabIconPosition;
+    /**
+     * Whether moving the arrow keys also chooses the tab they land on.
+     *
+     * `false` by default. Automatic activation is only kind when every panel is
+     * already on the page; the moment one of them fetches, walking past four tabs
+     * fires four requests.
+     * @default false
+     */
+    activateOnFocus?: boolean;
+    /**
+     * Whether the arrow keys wrap from the last tab back to the first.
+     * @default true
+     */
+    loopFocus?: boolean;
+    /**
+     * The hairline under the bar, which is MD3's own divider between a tab bar and
+     * the content it is about. Turn it off inside a card that already has an edge.
+     * @default true
+     */
+    divider?: boolean;
+    /** The tabs share the bar's full width, each taking an equal part of it. */
+    fullWidth?: boolean;
+    /** The accessible name of the bar. */
+    'aria-label'?: string;
+    /** The `MPTab`s and the `MPTabPanel`s. */
+    children?: React.ReactNode;
+}
+export interface MPTabProps extends Omit<React.ComponentPropsWithoutRef<'button'>, 'value' | 'color'> {
+    /** Identifies the tab, and picks out the panel with the same value. */
+    value: MPTabValue;
+    /**
+     * The glyph. Drawn above or before the label depending on the bar's
+     * `iconPosition`, and sized by the bar's rung.
+     */
+    icon?: React.ReactNode;
+    /** Unavailable, but still listed. */
+    disabled?: boolean;
+    /** The tab's label. */
+    children?: React.ReactNode;
+}
+export interface MPTabPanelProps extends React.ComponentPropsWithoutRef<'div'> {
+    /** Which tab shows this panel. */
+    value: MPTabValue;
+    /**
+     * Keeps the panel in the DOM while it is hidden — for a panel that is
+     * expensive to build, or that holds form state which should survive being
+     * switched away from.
+     * @default false
+     */
+    keepMounted?: boolean;
+    children?: React.ReactNode;
+}
+/**
+ * One set of panels, one of which is shown.
+ *
+ * Base UI owns everything that makes a tab bar a tab bar rather than a row of
+ * buttons: roving focus so the whole bar is one tab stop, the arrow keys, Home
+ * and End, the `tab`/`tabpanel` roles and the `aria-controls` wiring between
+ * them, and the measurement that puts the indicator under the chosen tab. What
+ * is here is the Material surface and the ladders.
+ *
+ * The tabs and the panels are composed rather than passed as data, unlike
+ * [MPSelect](../inputs/select) — a panel is a subtree, and there is no useful
+ * shape for "an array of arbitrary React trees" that is not just children. They
+ * are sorted into the bar and the body here rather than made the caller's
+ * problem with a wrapper element they have to remember.
+ *
+ * ## Horizontal only
+ *
+ * There is no `orientation`, and the omission is the specification's. MD3 has no
+ * vertical tabs: a column of destinations down the side of a screen is a
+ * **navigation rail**, which is a different component with different behaviour —
+ * it switches what the *screen* is rather than which panel of one is showing,
+ * and it is not one tab stop with arrow keys inside it. A tab bar turned on its
+ * side would claim the tab contract while looking like the other thing.
+ *
+ * A bar with more tabs than room scrolls rather than wrapping, which is MD3's
+ * scrollable tabs: a tab bar on two lines has stopped being a bar, and the
+ * indicator has nowhere sensible to sit.
+ */
+export declare const MPTabs: React.ForwardRefExoticComponent<MPTabsProps & React.RefAttributes<HTMLDivElement>>;
+/**
+ * One tab.
+ *
+ * It has no `size`, no `color` and no `variant` of its own: all three belong to
+ * the bar, which is the only place they can be set once and mean the same thing
+ * for every tab. A bar whose third tab is a rung out is not a bar.
+ */
+export declare const MPTab: React.ForwardRefExoticComponent<MPTabProps & React.RefAttributes<HTMLButtonElement>>;
+/**
+ * The content behind one tab.
+ *
+ * Unmounted while it is hidden unless `keepMounted` says otherwise, which is the
+ * right default for the common case — four panels of which one is on screen —
+ * and the wrong one for a panel holding a half-filled form.
+ */
+export declare const MPTabPanel: React.ForwardRefExoticComponent<MPTabPanelProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/tabs/MPTabs.js

@@ -0,0 +1 @@
+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 o}from"../../internal/accent";import{MPStateLayer as n}from"../../internal/StateLayer";import{CONTROL_GAP as r,hasContent as l,SHEET_GAP as s}from"../../internal/scale";const c=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"},u={xs:"h-11",sm:"h-13",md:"h-16",lg:"h-18",xl:"h-20"},d={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"},p={xs:"px-3",sm:"px-3.5",md:"px-4",lg:"px-5",xl:"px-6"},f={xs:12,sm:14,md:16,lg:20,xl:24},h={xs:18,sm:20,md:24,lg:24,xl:28};function x(e,t,i,o=""){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,`${o}${String(e.key)}/`);const n=o?a.cloneElement(e,{key:`${o}${String(e.key)}`}):e;e.type===MPTabPanel?i.push(n):t.push(n)})}export const MPTabs=a.forwardRef(function({variant:n="primary",color:r="primary",size:l="md",value:m,defaultValue:u,onValueChange:d,iconPosition:p,activateOnFocus:h=!1,loopFocus:v=!0,divider:b=!0,fullWidth:y=!1,className:_,style:g,children:w,"aria-label":j,...P},N){const k=p??("primary"===n?"top":"start"),M=a.useMemo(()=>({variant:n,size:l,iconPosition:k,fullWidth:y}),[n,l,k,y]),$=[],z=[];return x(w,$,z),e(c.Provider,{value:M,children:t(i.Root,{ref:N,value:m,defaultValue:u,onValueChange:e=>d?.(e),"data-mp-size":l,"data-mp-variant":n,className:["mp-tabs flex min-w-0 flex-col",s[l],_??""].filter(Boolean).join(" "),style:{...o(r),"--_mp-tab-inset":`${f[l]}px`,...g},...P,children:[t(i.List,{"aria-label":j,activateOnFocus:h,loopFocus:v,className:["mp-tabs__list relative flex shrink-0",b?"border-mp-outline-variant border-b":"",y?"w-full":"","overflow-x-auto overflow-y-hidden"].filter(Boolean).join(" "),children:[$,e(i.Indicator,{className:["mp-tabs__indicator pointer-events-none absolute bottom-0","bg-(--_mp-accent)","primary"===n?["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(" ")})]}),z]})})});export const MPTab=a.forwardRef(function({value:o,icon:s,disabled:f=!1,className:x,children:v,...b},y){const{variant:_,size:g,iconPosition:w,fullWidth:j}=a.useContext(c),P="top"===w&&l(s);return t(i.Tab,{ref:y,value:o,disabled:f,className:["mp-tabs__tab group relative flex shrink-0 items-center justify-center","box-border appearance-none 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 ${u[g]}`:`flex-row ${m[g]}`,P?"":r[g],d[g],p[g],f?"text-mp-on-surface/38 cursor-default":["text-mp-on-surface-variant cursor-pointer","primary"===_?"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":"",x??""].filter(Boolean).join(" "),...b,children:[f?null:e(n,{}),l(s)?e("span",{className:"relative flex shrink-0 items-center justify-center",style:{width:h[g],height:h[g]},children:s}):null,l(v)?e("span",{className:"relative truncate",children:v}):null]})});export const MPTabPanel=a.forwardRef(function({value:t,keepMounted:a=!1,className:o,children:n,...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",o??""].filter(Boolean).join(" "),...r,children:n})});

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

@@ -0,0 +1,2 @@
+export { MPTab, MPTabPanel, MPTabs } from './MPTabs';
+export type { MPTabIconPosition, MPTabPanelProps, MPTabProps, MPTabsProps, MPTabsVariant, MPTabValue } from './MPTabs';

package/dist/components/tabs/index.js

@@ -0,0 +1 @@
+export{MPTab,MPTabPanel,MPTabs}from"./MPTabs";

package/dist/components/text-field/MPTextField.d.ts

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import type { MPMessages } from '../../internal/i18n';
 import type { MPStyleProps } from '../../types';
 /** The input modes this field is built for. */
 export type MPTextFieldType = 'email' | 'password' | 'text';
@@ -16,16 +17,35 @@ export interface MPTextFieldProps extends MPStyleProps {
      * @default 'text'
      */
     type?: MPTextFieldType;
-    /** Placeholder shown while the field is empty. */
+    /**
+     * Placeholder shown while the field is empty.
+     *
+     * With a floating label it is held back until the label has risen out of its
+     * way, which is the moment the field is focused. Two greyed strings in one box
+     * is not a hint, it is a collision.
+     */
     placeholder?: string;
     /** Native `autocomplete` token — `'email'`, `'current-password'`, `'off'`. */
     autoComplete?: string;
     /**
-     * Label above the field. Always drawn in the outline's notch rather than
-     * floating over the placeholder, so a field with a label and a field without
-     * one sit at the same height in a form.
+     * Label for the field, drawn in the outline's notch and — while the field is
+     * empty, unfocused and has no `startIcon` — resting on the field's own line
+     * where a placeholder would be. See `floatingLabel`.
      */
     label?: string;
+    /**
+     * Whether the label rests on the field's line while there is nothing to make
+     * room for, and rises into the notch on focus or on the first character.
+     *
+     * `false` pins it in the notch, which is the one thing a floating label costs:
+     * a field with a label and a field without one no longer sit at the same
+     * height in a form until both are filled.
+     *
+     * A `startIcon` holds the label up regardless. The icon is already standing
+     * where the resting label would be, and the two cannot share the spot.
+     * @default true
+     */
+    floatingLabel?: boolean;
     /** Marks the field required, both to assistive technology and to the label. */
     required?: boolean;
     /** Greys the field out and stops it taking input. */
@@ -67,11 +87,21 @@ export interface MPTextFieldProps extends MPStyleProps {
      */
     resizable?: boolean;
     /**
-     * The id put on the control and pointed at by the label. Derived from `name`
-     * when omitted, which is enough as long as no two fields on a page share a
-     * name.
+     * The id put on the control and pointed at by the label. Generated when it is
+     * left out.
      */
     id?: string;
+    /**
+     * Which language the reveal toggle's name is written in. Falls back to the
+     * nearest `MPLocaleProvider`, then to English.
+     *
+     * It is the only text a text field invents — everything else in it is yours —
+     * and until it was in the table it was the one string in the library with no
+     * way at all to change it.
+     */
+    locale?: string;
+    /** Overrides the two words the reveal toggle is announced by. */
+    passwordLabels?: Partial<MPMessages['textField']>;
     /**
      * Called with the field's text on every change, including each keystroke of
      * an in-progress composition. The field shows what was actually typed until

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

@@ -1 +1 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as o from"react";import{Field as a}from"@base-ui/react/field";import{MPIcon as n}from"../icon/MPIcon";import{MPFieldLabel as r,MPFieldOutline as l}from"../../internal/FieldOutline";import{VisibilityIcon as i,VisibilityOffIcon as s}from"../../constants/icons";const d={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=o.forwardRef(function({value:p,name:c,type:m="text",placeholder:u,autoComplete:f,label:x,onChange:b,onFormReset:y,onSubmit:g,errorMessage:h="",required:v=!1,fullWidth:w=!1,readOnly:C=!1,autoFocus:j=!1,size:k="md",disabled:z=!1,disableEnterKey:E=!1,rows:M,maxLength:N,startIcon:F,resizable:S=!1,id:q},D){const R=o.useRef(null),[I,O]=o.useState(!1),[B,K]=o.useState(!1),[L,P]=o.useState(p),U=o.useId(),$=q??`mp-text-field-${c??U}`,_=!!M,T=h.length>0,W=d[k],A=o.useCallback(e=>{R.current=e,"function"==typeof D?D(e):D&&(D.current=e)},[D]),G=e=>{e.preventDefault()};return o.useEffect(()=>{B||P(p)},[p,B]),o.useEffect(()=>{j&&!window.matchMedia("(max-width: 599.95px)").matches&&R.current?.focus()},[]),t(a.Root,{className:["mp-text-field group relative",w?"w-full":"inline-block","align-top"].join(" "),disabled:z,invalid:T,"data-mp-size":k,children:[t("div",{className:["relative flex w-full items-center gap-2",W.padding,_?"py-2":""].filter(Boolean).join(" "),children:[e(l,{label:x,required:v}),F?e("span",{className:"text-mp-on-surface-variant group-data-disabled:text-mp-on-surface/38 flex shrink-0 items-center",children:F}):null,e(a.Control,{render:_?e("textarea",{rows:M}):e("input",{}),id:$,name:c,type:_?void 0:I?"text":m,required:v,readOnly:C,disabled:z,autoComplete:f,placeholder:u,maxLength:N,value:B?L:p,ref:A,className:[`${W.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",W.control,_?"py-0":"",_&&S?"resize-y":"resize-none","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=>{y?.();const t=e.target.value;B&&P(t),b?.(t)},onCompositionStart:()=>{K(!0),P(p)},onCompositionUpdate:e=>{P(e.target.value)},onCompositionEnd:e=>{K(!1);const t=e.target.value;y?.(),b?.(t),P(t)},onKeyDown:e=>{"Enter"===e.key&&(g?.(),_&&!E||e.preventDefault())}}),"password"!==m||_?null:e("button",{type:"button","aria-label":I?"hide the password":"display the password",onClick:()=>O(e=>!e),onMouseDown:G,onMouseUp:G,disabled:z,className:["text-mp-on-surface-variant -mr-1 flex shrink-0 items-center justify-center","cursor-pointer appearance-none border-0 bg-transparent p-1 font-[inherit]","rounded-full outline-none","hover:text-mp-on-surface focus-visible:text-mp-primary","disabled:text-mp-on-surface/38 disabled:cursor-default"].join(" "),children:e(n,{icon:I?i:s,size:W.icon})})]}),x?e(r,{size:k,label:x,required:v,htmlFor:$}):null,T?e(a.Error,{match:!0,className:["mp-text-field__support text-mp-body-small text-mp-error mt-1 block",W.padding,"group-data-disabled:text-mp-on-surface/38"].join(" "),children:h}):null]})});
+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 a}from"../icon/MPIcon";import{MPFieldLabel as r,MPFieldOutline as l,useFloatingLabel as i}from"../../internal/FieldOutline";import{VisibilityIcon as s,VisibilityOffIcon as d}from"../../constants/icons";import{useMPLocale as p,useMPMessages as c}from"../../internal/locale";const u={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=o.forwardRef(function({value:m,name:f,type:x="text",placeholder:b,autoComplete:g,label:y,floatingLabel:h=!0,onChange:v,onFormReset:w,onSubmit:C,errorMessage:k="",required:j=!1,fullWidth:z=!1,readOnly:E=!1,autoFocus:F=!1,size:M="md",disabled:N=!1,disableEnterKey:P=!1,rows:S,maxLength:q,startIcon:D,resizable:L=!1,id:R,locale:I,passwordLabels:O},B){const K=p(I),U=c("textField",K,O),_=o.useRef(null),[T,W]=o.useState(!1),[$,A]=o.useState(!1),[G,H]=o.useState(m),J=o.useId(),Q=R??J,V=!!S,X=k.length>0,Y=u[M],Z=$?G:m,{shrunk:ee,focusProps:te}=i({floating:h&&!!y,filled:Z.length>0,pinned:!!D}),oe=o.useCallback(e=>{_.current=e,"function"==typeof B?B(e):B&&(B.current=e)},[B]),ne=e=>{e.preventDefault()};return o.useEffect(()=>{$||H(m)},[m,$]),o.useEffect(()=>{F&&!window.matchMedia("(max-width: 599.95px)").matches&&_.current?.focus()},[]),t(n.Root,{className:["mp-text-field group relative",z?"w-full":"inline-block","align-top"].join(" "),disabled:N,invalid:X,"data-mp-size":M,...te,children:[t("div",{className:["relative flex w-full items-center gap-2",Y.padding,V?"py-2":""].filter(Boolean).join(" "),children:[e(l,{label:y,required:j,notched:ee}),D?e("span",{className:"text-mp-on-surface-variant group-data-disabled:text-mp-on-surface/38 flex shrink-0 items-center",children:D}):null,e(n.Control,{render:V?e("textarea",{rows:S}):e("input",{}),id:Q,name:f,type:V?void 0:T?"text":x,required:j,readOnly:E,disabled:N,autoComplete:g,placeholder:ee?b:void 0,maxLength:q,value:Z,ref:oe,className:[`${Y.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",Y.control,V?"py-0":"",V&&L?"resize-y":"resize-none","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=>{w?.();const t=e.target.value;$&&H(t),v?.(t)},onCompositionStart:()=>{A(!0),H(m)},onCompositionUpdate:e=>{H(e.target.value)},onCompositionEnd:e=>{A(!1);const t=e.target.value;w?.(),v?.(t),H(t)},onKeyDown:e=>{if("Enter"===e.key){if(function(e){const t=e.nativeEvent;return t.isComposing||229===t.keyCode}(e))return;C?.(),V&&!P||e.preventDefault()}}}),"password"!==x||V?null:e("button",{type:"button","aria-label":T?U.hidePassword:U.showPassword,onClick:()=>W(e=>!e),onMouseDown:ne,onMouseUp:ne,disabled:N,className:["text-mp-on-surface-variant -mr-1 flex shrink-0 items-center justify-center","cursor-pointer appearance-none border-0 bg-transparent p-1 font-[inherit]","rounded-full outline-none","hover:text-mp-on-surface focus-visible:text-mp-primary","disabled:text-mp-on-surface/38 disabled:cursor-default"].join(" "),children:e(a,{icon:T?s:d,size:Y.icon})}),y?e(r,{size:M,label:y,required:j,htmlFor:Q,shrunk:ee,multiline:V}):null]}),X?e(n.Error,{match:!0,className:["mp-text-field__support text-mp-body-small text-mp-error mt-1 block",Y.padding,"group-data-disabled:text-mp-on-surface/38"].join(" "),children:k}):null]})});

package/dist/components/text-link/MPTextLink.js

@@ -1 +1 @@
-import{jsx as e,Fragment as n,jsxs as o}from"react/jsx-runtime";import*as r from"react";import{useRender as i}from"@base-ui/react/use-render";import{MPIcon as t}from"../icon/MPIcon";import{ExternalLinkIcon as l,LinkIcon as s}from"../../constants/icons";import{accentSlots as a}from"../../internal/accent";import{PROSE_TEXT as c}from"../../internal/scale";import{VISUALLY_HIDDEN as m}from"../../internal/visually-hidden";const p={always:"[&.mp-link]:underline",hover:"[&.mp-link]:no-underline [&.mp-link]:hover:underline",none:"[&.mp-link]:no-underline"},d=["[&.mp-link]:[text-underline-offset:0.2em]","[&.mp-link]:[text-decoration-thickness:0.08em]","[&.mp-link]:[text-decoration-color:color-mix(in_oklab,currentColor_45%,transparent)]","[&.mp-link]:hover:[text-decoration-color:currentColor]"].join(" ");export const MPTextLink=r.forwardRef(function({href:r,underline:u="always",color:f,size:h,newTab:k=!1,icon:x,newTabLabel:b="Opens in a new tab",render:v,className:y,style:w,children:j,...N},_){const g=x??k,T=!0===g?e(t,{icon:k?l:s,size:"0.95em"}):g,z=["mp-link cursor-pointer","transition-[color,text-decoration-color]","duration-(--mp-sys-motion-duration-short4)","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-2","focus-visible:outline-solid focus-visible:rounded-mp-xs outline-none",h?c[h]:"",p[u],d,f?"[&.mp-link]:text-(--_mp-accent)":"[&.mp-link]:text-inherit",y??""].filter(Boolean).join(" ");return i({render:v??e("a",{}),ref:_,props:{href:r,target:k?"_blank":void 0,rel:k?"noopener noreferrer":void 0,className:z,style:f?{...a(f),...w}:w,children:o(n,{children:[j,T?e("span",{className:"ms-[0.25em] inline-flex align-baseline",children:T}):null,k?o(n,{children:[" ",e("span",{className:m,children:b})]}):null]}),...N}})});
+import{jsx as e,Fragment as n,jsxs as o}from"react/jsx-runtime";import*as r from"react";import{useRender as i}from"@base-ui/react/use-render";import{MPIcon as t}from"../icon/MPIcon";import{ExternalLinkIcon as l,LinkIcon as s}from"../../constants/icons";import{accentSlots as a}from"../../internal/accent";import{PROSE_TEXT as c}from"../../internal/scale";import{VISUALLY_HIDDEN as m}from"../../internal/visually-hidden";const p={always:"[&.mp-link]:underline",hover:"[&.mp-link]:no-underline [&.mp-link]:hover:underline",none:"[&.mp-link]:no-underline"},d=["[&.mp-link]:[text-underline-offset:0.2em]","[&.mp-link]:[text-decoration-thickness:0.08em]","[&.mp-link]:[text-decoration-color:color-mix(in_oklab,currentColor_45%,transparent)]","[&.mp-link]:hover:[text-decoration-color:currentColor]"].join(" ");export const MPTextLink=r.forwardRef(function({href:r,underline:u="always",color:f,size:k,newTab:h=!1,icon:x,newTabLabel:b="Opens in a new tab",render:v,className:y,style:w,children:j,..._},g){const N=h?"_blank":_.target,T="_blank"===N,z=x??T,C=!0===z?e(t,{icon:T?l:s,size:"0.95em"}):z,L=["mp-link cursor-pointer","transition-[color,text-decoration-color]","duration-(--mp-sys-motion-duration-short4)","outline-mp-secondary focus-visible:outline-2 focus-visible:outline-offset-2","focus-visible:outline-solid focus-visible:rounded-mp-xs outline-none",k?c[k]:"",p[u],d,f?"[&.mp-link]:text-(--_mp-accent)":"[&.mp-link]:text-inherit",y??""].filter(Boolean).join(" ");return i({render:v??e("a",{}),ref:g,props:{href:r,target:N,rel:T?"noopener noreferrer":void 0,className:L,style:f?{...a(f),...w}:w,children:o(n,{children:[j,C?e("span",{className:"ms-[0.25em] inline-flex align-baseline",children:C}):null,T?o(n,{children:[" ",e("span",{className:m,children:b})]}):null]}),..._}})});

package/dist/components/time-picker/MPTimePicker.js

@@ -1 +1 @@
-import{jsx as e,jsxs as o}from"react/jsx-runtime";import*as n from"react";import{MPButton as l}from"../button/MPButton";import{MPIcon as r}from"../icon/MPIcon";import{ClockIcon as t}from"../../constants/icons";import{MPTimeGrid as a}from"../../internal/Calendar";import{FOOTER_SIZE as i,MPPickerFooter as s,MPPickerShell as c}from"../../internal/Picker";import{useMPLocale as u,useMPMessages as m}from"../../internal/locale";import{CONTROL_ICON as d}from"../../internal/scale";import{displaySamples as p,formatDate as h,isHour12 as f,isValidDate as g,secondsOfDay as S,timeUnitSpan as b,toISOTime as v,withPlaceholder as C,withTime as x}from"../../internal/date";export const MPTimePicker=n.forwardRef(function({value:k,defaultValue:w,onValueChange:z,open:D,defaultOpen:O,onOpenChange:y,referenceDate:M,minTime:P,maxTime:T,shouldDisableTime:j,hour12:I,showSeconds:V=!1,hourStep:B=1,minuteStep:N=1,secondStep:R=1,locale:F,format:H,placeholder:q,clearable:A=!1,showNowButton:E=!0,closeOnSelect:G=!1,labels:J,name:K,size:L="md",color:Q="primary",readOnly:U=!1,disabled:W=!1,startIcon:X,...Y},Z){const $=u(F),_=m("picker",$,J),ee=I??f($),[oe,ne]=n.useState(w??null),le=void 0!==k?k:oe,[re,te]=n.useState(O??!1),ae=D??re,[ie]=n.useState(()=>M??new Date),se=e=>{e&&(U||W)||(void 0===D&&te(e),y?.(e))},ce=e=>{void 0===k&&ne(e),z?.(e)},ue=n.useCallback((e,o)=>{const[n,l]=b(o,e);return!!(g(P)&&l<S(P))||(!!(g(T)&&n>S(T))||(j?.(e,o)??!1))},[P,T,j]),me=H??{hour:"numeric",minute:"2-digit",hour12:ee,...V?{second:"2-digit"}:{}},de=new Date,pe=x(M??ie,{hours:de.getHours(),minutes:de.getMinutes(),seconds:V?de.getSeconds():0}),he=E||A||!G,fe=n.useMemo(()=>C(p($,me),q),[$,me,q]);return e(c,{...Y,slug:"time-picker",size:L,color:Q,readOnly:U,disabled:W,name:K,triggerRef:Z,startIcon:X??e(r,{icon:t,size:d[L]}),display:g(le)?h(le,$,me):q??"",samples:fe,empty:!g(le),clearable:A,onClear:()=>ce(null),open:ae,onOpenChange:se,labels:_,hiddenValues:K?[{name:K,value:g(le)?v(le,V):""}]:void 0,children:o("div",{className:"flex flex-col "+(he?"gap-1.5":""),children:[e(a,{size:L,locale:$,value:g(le)?le:null,referenceDate:M??ie,onChange:e=>{ce(e),G&&se(!1)},hour12:ee,showSeconds:V,hourStep:B,minuteStep:N,secondStep:R,shouldDisableTime:ue,labels:_,autoFocus:!0}),he?o(s,{children:[A?e(l,{variant:"text",size:i[L],color:Q,onClick:()=>{ce(null),se(!1)},children:_.clear}):null,E?e(l,{variant:"text",size:i[L],color:Q,disabled:ue(pe,"second"),onClick:()=>{ce(pe),se(!1)},children:_.now}):null,G?null:e(l,{variant:"filled",size:i[L],color:Q,onClick:()=>se(!1),children:_.done})]}):null]})})});
+import{jsx as e,jsxs as o}from"react/jsx-runtime";import*as n from"react";import{MPButton as l}from"../button/MPButton";import{MPIcon as r}from"../icon/MPIcon";import{ClockIcon as t}from"../../constants/icons";import{MPTimeGrid as a}from"../../internal/Calendar";import{FOOTER_SIZE as i,MPPickerFooter as s,MPPickerShell as c,useDisplaySamples as u}from"../../internal/Picker";import{useMPLocale as d,useMPMessages as m}from"../../internal/locale";import{CONTROL_ICON as p}from"../../internal/scale";import{formatDate as h,isHour12 as f,isValidDate as g,secondsOfDay as S,timeUnitSpan as b,toISOTime as v,withPlaceholder as C,withTime as x}from"../../internal/date";export const MPTimePicker=n.forwardRef(function({value:k,defaultValue:w,onValueChange:z,open:D,defaultOpen:O,onOpenChange:y,referenceDate:P,minTime:T,maxTime:M,shouldDisableTime:j,hour12:I,showSeconds:V=!1,hourStep:B=1,minuteStep:N=1,secondStep:R=1,locale:F,format:H,placeholder:q,clearable:A=!1,showNowButton:E=!0,closeOnSelect:G=!1,labels:J,name:K,size:L="md",color:Q="primary",readOnly:U=!1,disabled:W=!1,startIcon:X,...Y},Z){const $=d(F),_=m("picker",$,J),ee=I??f($),[oe,ne]=n.useState(w??null),le=void 0!==k?k:oe,[re,te]=n.useState(O??!1),ae=D??re,[ie]=n.useState(()=>P??new Date),se=e=>{e&&(U||W)||(void 0===D&&te(e),y?.(e))},ce=e=>{void 0===k&&ne(e),z?.(e)},ue=n.useCallback((e,o)=>{const[n,l]=b(o,e);return!!(g(T)&&l<S(T))||(!!(g(M)&&n>S(M))||(j?.(e,o)??!1))},[T,M,j]),de=H??{hour:"numeric",minute:"2-digit",hour12:ee,...V?{second:"2-digit"}:{}},me=new Date,pe=x(P??ie,{hours:me.getHours(),minutes:me.getMinutes(),seconds:V?me.getSeconds():0}),he=E||A||!G,fe=C(u($,de),q);return e(c,{...Y,slug:"time-picker",size:L,color:Q,readOnly:U,disabled:W,triggerRef:Z,startIcon:void 0===X?e(r,{icon:t,size:p[L]}):X,display:g(le)?h(le,$,de):q??"",samples:fe,empty:!g(le),clearable:A,onClear:()=>ce(null),open:ae,onOpenChange:se,labels:_,hiddenValues:K?[{name:K,value:g(le)?v(le,V):""}]:void 0,children:o("div",{className:"flex flex-col "+(he?"gap-1.5":""),children:[e(a,{size:L,locale:$,value:g(le)?le:null,referenceDate:P??ie,onChange:e=>{ce(e),G&&se(!1)},hour12:ee,showSeconds:V,hourStep:B,minuteStep:N,secondStep:R,shouldDisableTime:ue,labels:_,autoFocus:!0}),he?o(s,{children:[A?e(l,{variant:"text",size:i[L],color:Q,onClick:()=>{ce(null),se(!1)},children:_.clear}):null,E?e(l,{variant:"text",size:i[L],color:Q,disabled:ue(pe,"second"),onClick:()=>{ce(pe),se(!1)},children:_.now}):null,G?null:e(l,{variant:"filled",size:i[L],color:Q,onClick:()=>se(!1),children:_.done})]}):null]})})});

package/dist/components/timeline/MPTimeline.js

@@ -1 +1 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as r from"react";import{useRender as n}from"@base-ui/react/use-render";import{accentSlots as l}from"../../internal/accent";import{hasContent as a,META_TEXT as o,PROSE_TEXT as i,SHEET_TITLE as s}from"../../internal/scale";const c=r.createContext(null),m=r.createContext({index:0,last:!1}),p={xs:"0.875rem",sm:"1rem",md:"1.25rem",lg:"1.5rem",xl:"1.875rem"},d={xs:"gap-2",sm:"gap-2.5",md:"gap-3",lg:"gap-3.5",xl:"gap-4"},u={xs:"pb-5",sm:"pb-6",md:"pb-7",lg:"pb-8",xl:"pb-10"},x={xs:"pe-5",sm:"pe-6",md:"pe-7",lg:"pe-8",xl:"pe-10"},f={solid:"border-solid",dashed:"border-dashed",dotted:"border-dotted",none:""},b={complete:"bg-(--_mp-accent) text-(--_mp-on-accent)",current:"bg-(--_mp-accent) text-(--_mp-on-accent) shadow-[0_0_0_0.25rem_var(--_mp-accent-container)]",upcoming:"border-mp-outline text-mp-on-surface-variant border-2 bg-transparent"},v={complete:"border-(--_mp-accent)",current:"border-mp-outline-variant",upcoming:"border-mp-outline-variant"},h={complete:"text-mp-on-surface",current:"text-(--_mp-accent)",upcoming:"text-mp-on-surface-variant"};export const MPTimelineItem=r.forwardRef(function({title:n,meta:g,bullet:_,status:N,color:y,connector:z="solid",className:j,style:w,children:$,...C},P){const B=r.useContext(c),{index:M,last:k}=r.useContext(m),R=B?.size??"md",T=B?.orientation??"vertical",A=y??B?.color??"primary",I=B?.active??null,q=N??(null===I?"upcoming":M<I?"complete":M===I?"current":"upcoming"),D="horizontal"===T,E="none"!==z&&!k,F=e("span",{"aria-hidden":"true",className:["rounded-mp-full relative z-10 flex shrink-0 items-center justify-center","size-(--_mp-bullet) text-[calc(var(--_mp-bullet)*0.5)] leading-none font-medium","tabular-nums [&>svg]:size-[0.6em]",b[q],"transition-[background-color,border-color,box-shadow,color]","duration-(--mp-sys-motion-duration-short4)"].join(" "),children:_}),G=E?e("span",{"aria-hidden":"true",className:["pointer-events-none absolute",D?"start-(--_mp-bullet) top-[calc(var(--_mp-bullet)/2_-_1px)] end-0 border-t-2":"top-(--_mp-bullet) start-[calc(var(--_mp-bullet)/2_-_1px)] bottom-0 border-s-2",f[z],v[q]].filter(Boolean).join(" ")}):null,H=t("div",{className:"flex min-w-0 flex-col gap-0.5 "+(D?"mt-2":""),children:[a(n)||a(g)?t("div",{className:"flex flex-wrap items-baseline gap-x-2",children:[a(n)?e("span",{className:`${s[R]} ${h[q]}`,children:n}):null,a(g)?e("span",{className:`text-mp-on-surface-variant ${o}`,children:g}):null]}):null,a($)?e("div",{className:`text-mp-on-surface-variant ${i[R]}`,children:$}):null]});return t("li",{ref:P,"aria-current":"current"===q?"step":void 0,"data-status":q,className:["relative",D?`flex min-w-0 flex-1 flex-col ${k?"":x[R]}`:`flex ${d[R]} ${k?"":u[R]}`,j??""].filter(Boolean).join(" "),style:{"--_mp-bullet":p[R],...l(A),...w},...C,children:[G,F,H]})});export const MPTimeline=r.forwardRef(function({active:t,size:l="md",color:a="primary",orientation:o="vertical",render:i,className:s,style:p,children:d,...u},x){const f=r.Children.toArray(d),b=f.length,v=r.useMemo(()=>({size:l,orientation:o,color:a,active:t??null}),[l,o,a,t]),h=n({render:i??e("ol",{}),ref:x,props:{role:"list","data-mp-size":l,className:["mp-timeline flex","horizontal"===o?"flex-row":"flex-col",s??""].filter(Boolean).join(" "),style:p,children:f.map((t,r)=>e(m.Provider,{value:{index:r,last:r===b-1},children:t},r)),...u}});return e(c.Provider,{value:v,children:h})});
+import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as t from"react";import{useRender as n}from"@base-ui/react/use-render";import{accentSlots as l}from"../../internal/accent";import{hasContent as a,META_TEXT as o,PROSE_TEXT as i,SHEET_TITLE as s}from"../../internal/scale";const c=t.createContext(null),m=t.createContext({index:0,last:!1}),p={xs:"0.875rem",sm:"1rem",md:"1.25rem",lg:"1.5rem",xl:"1.875rem"},d={xs:"gap-2",sm:"gap-2.5",md:"gap-3",lg:"gap-3.5",xl:"gap-4"},u={xs:"pb-5",sm:"pb-6",md:"pb-7",lg:"pb-8",xl:"pb-10"},x={xs:"pe-5",sm:"pe-6",md:"pe-7",lg:"pe-8",xl:"pe-10"},f={solid:"border-solid",dashed:"border-dashed",dotted:"border-dotted",none:""},b={complete:"bg-(--_mp-accent) text-(--_mp-on-accent)",current:"bg-(--_mp-accent) text-(--_mp-on-accent) shadow-[0_0_0_0.25rem_var(--_mp-accent-container)]",upcoming:"border-mp-outline text-mp-on-surface-variant border-2 bg-transparent"},v={complete:"border-(--_mp-accent)",current:"border-mp-outline-variant",upcoming:"border-mp-outline-variant"},h={complete:"text-mp-on-surface",current:"text-(--_mp-accent)",upcoming:"text-mp-on-surface-variant"};export const MPTimelineItem=t.forwardRef(function({title:n,meta:g,bullet:_,status:N,color:y,connector:z="solid",className:j,style:w,children:$,...C},M){const P=t.useContext(c),{index:B,last:k}=t.useContext(m),A=P?.size??"md",R=P?.orientation??"vertical",T=y??P?.color??"primary",I=P?.active??null,q=N??(null===I?"upcoming":B<I?"complete":B===I?"current":"upcoming"),D="horizontal"===R,E="none"!==z&&!k,F=e("span",{"aria-hidden":"true",className:["rounded-mp-full relative z-10 flex shrink-0 items-center justify-center","size-(--_mp-bullet) text-[calc(var(--_mp-bullet)*0.5)] leading-none font-medium","tabular-nums [&>svg]:size-[0.6em]",b[q],"transition-[background-color,border-color,box-shadow,color]","duration-(--mp-sys-motion-duration-short4)"].join(" "),children:_}),G=E?e("span",{"aria-hidden":"true",className:["pointer-events-none absolute",D?"start-(--_mp-bullet) top-[calc(var(--_mp-bullet)/2_-_1px)] end-0 border-t-2":"top-(--_mp-bullet) start-[calc(var(--_mp-bullet)/2_-_1px)] bottom-0 border-s-2",f[z],v[q]].filter(Boolean).join(" ")}):null,H=r("div",{className:"flex min-w-0 flex-col gap-0.5 "+(D?"mt-2":""),children:[a(n)||a(g)?r("div",{className:"flex flex-wrap items-baseline gap-x-2",children:[a(n)?e("span",{className:`${s[A]} ${h[q]}`,children:n}):null,a(g)?e("span",{className:`text-mp-on-surface-variant ${o}`,children:g}):null]}):null,a($)?e("div",{className:`text-mp-on-surface-variant ${i[A]}`,children:$}):null]});return r("li",{ref:M,"aria-current":"current"===q?"step":void 0,"data-status":q,className:["relative",D?`flex min-w-0 flex-1 flex-col ${k?"":x[A]}`:`flex ${d[A]} ${k?"":u[A]}`,j??""].filter(Boolean).join(" "),style:{"--_mp-bullet":p[A],...l(T),...w},...C,children:[G,F,H]})});export const MPTimeline=t.forwardRef(function({active:r,size:l="md",color:a="primary",orientation:o="vertical",render:i,className:s,style:p,children:d,...u},x){const f=t.Children.toArray(d),b=f.length,v=t.useMemo(()=>({size:l,orientation:o,color:a,active:r??null}),[l,o,a,r]),h=t.useMemo(()=>Array.from({length:b},(e,r)=>({index:r,last:r===b-1})),[b]),g=n({render:i??e("ol",{}),ref:x,props:{role:"list","data-mp-size":l,className:["mp-timeline flex","horizontal"===o?"flex-row":"flex-col",s??""].filter(Boolean).join(" "),style:p,children:f.map((r,t)=>e(m.Provider,{value:h[t],children:r},t)),...u}});return e(c.Provider,{value:v,children:g})});

package/dist/constants/icons.d.ts

@@ -14,6 +14,10 @@ export declare const ChevronUpIcon: import("react").ForwardRefExoticComponent<Om
 export declare const ChevronLeftIcon: import("react").ForwardRefExoticComponent<Omit<import("lucide-react").LucideProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
 /** Next, in a pager or a carousel. */
 export declare const ChevronRightIcon: import("react").ForwardRefExoticComponent<Omit<import("lucide-react").LucideProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
+/** First, in a pager: the stepper that jumps to an end rather than by one. */
+export declare const ChevronsLeftIcon: import("react").ForwardRefExoticComponent<Omit<import("lucide-react").LucideProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
+/** And last. */
+export declare const ChevronsRightIcon: import("react").ForwardRefExoticComponent<Omit<import("lucide-react").LucideProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
 /** Search, for a field's leading adornment. */
 export declare const SearchIcon: import("react").ForwardRefExoticComponent<Omit<import("lucide-react").LucideProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
 /** Sorted ascending: the arrow a table's sorted column carries. */
@@ -48,6 +52,12 @@ export declare const UploadIcon: import("react").ForwardRefExoticComponent<Omit<
 export declare const CalendarIcon: import("react").ForwardRefExoticComponent<Omit<import("lucide-react").LucideProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
 /** A time of day: what a time picker's trigger wears. */
 export declare const ClockIcon: import("react").ForwardRefExoticComponent<Omit<import("lucide-react").LucideProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
+/**
+ * A score. Drawn as an outline, and filled by whatever is scoring with it —
+ * lucide draws it `fill="none"`, and `MPRating` overlays a copy in `fill-current`
+ * rather than shipping a second glyph.
+ */
+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>>;
 /**
@@ -68,6 +78,8 @@ export declare const ICONS: {
     readonly 'chevron-up': import("react").ForwardRefExoticComponent<Omit<import("lucide-react").LucideProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
     readonly 'chevron-left': import("react").ForwardRefExoticComponent<Omit<import("lucide-react").LucideProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
     readonly 'chevron-right': import("react").ForwardRefExoticComponent<Omit<import("lucide-react").LucideProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
+    readonly 'chevrons-left': import("react").ForwardRefExoticComponent<Omit<import("lucide-react").LucideProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
+    readonly 'chevrons-right': import("react").ForwardRefExoticComponent<Omit<import("lucide-react").LucideProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
     readonly search: import("react").ForwardRefExoticComponent<Omit<import("lucide-react").LucideProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
     readonly 'arrow-up': import("react").ForwardRefExoticComponent<Omit<import("lucide-react").LucideProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
     readonly 'arrow-down': import("react").ForwardRefExoticComponent<Omit<import("lucide-react").LucideProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
@@ -85,6 +97,7 @@ export declare const ICONS: {
     readonly upload: import("react").ForwardRefExoticComponent<Omit<import("lucide-react").LucideProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
     readonly calendar: import("react").ForwardRefExoticComponent<Omit<import("lucide-react").LucideProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
     readonly clock: import("react").ForwardRefExoticComponent<Omit<import("lucide-react").LucideProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
+    readonly star: import("react").ForwardRefExoticComponent<Omit<import("lucide-react").LucideProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
     readonly spinner: import("react").ForwardRefExoticComponent<Omit<import("lucide-react").LucideProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
 };
 /** Every role name `ICONS` answers to. */

package/dist/constants/icons.js

@@ -1 +1 @@
-import{ArrowDown as o,ArrowRight as n,ArrowUp as c,CalendarDays as r,Check as e,ChevronDown as t,ChevronLeft as I,ChevronRight as i,ChevronUp as s,CircleAlert as p,CircleCheck as x,Clock as l,Copy as h,Ellipsis as a,ExternalLink as C,Eye as v,EyeOff as w,Info as d,Link as f,LoaderCircle as k,Minus as g,Plus as y,Search as A,TriangleAlert as u,Upload as S,X as b}from"lucide-react";export const VisibilityIcon=v;export const VisibilityOffIcon=w;export const CloseIcon=b;export const CheckIcon=e;export const ChevronDownIcon=t;export const ChevronUpIcon=s;export const ChevronLeftIcon=I;export const ChevronRightIcon=i;export const SearchIcon=A;export const ArrowUpIcon=c;export const ArrowDownIcon=o;export const ArrowRightIcon=n;export const MoreIcon=a;export const LinkIcon=f;export const ExternalLinkIcon=C;export const CopyIcon=h;export const InfoIcon=d;export const SuccessIcon=x;export const WarningIcon=u;export const ErrorIcon=p;export const AddIcon=y;export const RemoveIcon=g;export const UploadIcon=S;export const CalendarIcon=r;export const ClockIcon=l;export const SpinnerIcon=k;export const ICONS={visibility:VisibilityIcon,"visibility-off":VisibilityOffIcon,close:CloseIcon,check:CheckIcon,"chevron-down":ChevronDownIcon,"chevron-up":ChevronUpIcon,"chevron-left":ChevronLeftIcon,"chevron-right":ChevronRightIcon,search:SearchIcon,"arrow-up":ArrowUpIcon,"arrow-down":ArrowDownIcon,"arrow-right":ArrowRightIcon,more:MoreIcon,link:LinkIcon,"external-link":ExternalLinkIcon,copy:CopyIcon,info:InfoIcon,success:SuccessIcon,warning:WarningIcon,error:ErrorIcon,add:AddIcon,remove:RemoveIcon,upload:UploadIcon,calendar:CalendarIcon,clock:ClockIcon,spinner:SpinnerIcon};
+import{ArrowDown as o,ArrowRight as n,ArrowUp as c,CalendarDays as r,Check as t,ChevronDown as e,ChevronLeft as I,ChevronRight as s,ChevronsLeft as i,ChevronsRight as p,ChevronUp as h,CircleAlert as x,CircleCheck as a,Clock as l,Copy as v,Ellipsis as C,ExternalLink as f,Eye as w,EyeOff as d,Info as g,Link as k,LoaderCircle as y,Minus as S,Plus as A,Search as L,Star as R,TriangleAlert as u,Upload as b,X as m}from"lucide-react";export const VisibilityIcon=w;export const VisibilityOffIcon=d;export const CloseIcon=m;export const CheckIcon=t;export const ChevronDownIcon=e;export const ChevronUpIcon=h;export const ChevronLeftIcon=I;export const ChevronRightIcon=s;export const ChevronsLeftIcon=i;export const ChevronsRightIcon=p;export const SearchIcon=L;export const ArrowUpIcon=c;export const ArrowDownIcon=o;export const ArrowRightIcon=n;export const MoreIcon=C;export const LinkIcon=k;export const ExternalLinkIcon=f;export const CopyIcon=v;export const InfoIcon=g;export const SuccessIcon=a;export const WarningIcon=u;export const ErrorIcon=x;export const AddIcon=A;export const RemoveIcon=S;export const UploadIcon=b;export const CalendarIcon=r;export const ClockIcon=l;export const StarIcon=R;export const SpinnerIcon=y;export const ICONS={visibility:VisibilityIcon,"visibility-off":VisibilityOffIcon,close:CloseIcon,check:CheckIcon,"chevron-down":ChevronDownIcon,"chevron-up":ChevronUpIcon,"chevron-left":ChevronLeftIcon,"chevron-right":ChevronRightIcon,"chevrons-left":ChevronsLeftIcon,"chevrons-right":ChevronsRightIcon,search:SearchIcon,"arrow-up":ArrowUpIcon,"arrow-down":ArrowDownIcon,"arrow-right":ArrowRightIcon,more:MoreIcon,link:LinkIcon,"external-link":ExternalLinkIcon,copy:CopyIcon,info:InfoIcon,success:SuccessIcon,warning:WarningIcon,error:ErrorIcon,add:AddIcon,remove:RemoveIcon,upload:UploadIcon,calendar:CalendarIcon,clock:ClockIcon,star:StarIcon,spinner:SpinnerIcon};

package/dist/index.d.ts

@@ -2,10 +2,22 @@ export * from './types';
 export * from './constants/icons';
 export * from './components/accordion';
 export * from './components/alert';
+export * from './components/animate-appear';
+export * from './components/animate-blink';
+export * from './components/animate-fade';
+export * from './components/animate-grow';
+export * from './components/animate-headline';
+export * from './components/animate-lighting';
+export * from './components/animate-marquee';
+export * from './components/animate-rotate';
+export * from './components/animate-slide';
+export * from './components/animate-typing';
+export * from './components/animate-zoom';
 export * from './components/aspect-ratio';
 export * from './components/avatar';
 export * from './components/badge';
 export * from './components/blockquote';
+export * from './components/bottom-navigation';
 export * from './components/box';
 export * from './components/breadcrumb';
 export * from './components/button';
@@ -18,6 +30,7 @@ export * from './components/chip';
 export * from './components/collapsible';
 export * from './components/color-picker';
 export * from './components/combobox';
+export * from './components/container';
 export * from './components/date-picker';
 export * from './components/date-range-picker';
 export * from './components/date-time-picker';
@@ -26,6 +39,8 @@ export * from './components/divider';
 export * from './components/drawer';
 export * from './components/empty';
 export * from './components/file-picker';
+export * from './components/floating-action-button';
+export * from './components/grid';
 export * from './components/highlight';
 export * from './components/icon';
 export * from './components/icon-button';
@@ -35,6 +50,7 @@ export * from './components/menu';
 export * from './components/number-field';
 export * from './components/otp-field';
 export * from './components/overlay';
+export * from './components/pagination';
 export * from './components/panes';
 export * from './components/pill';
 export * from './components/popover';
@@ -42,6 +58,7 @@ export * from './components/progress-box';
 export * from './components/progress-circular';
 export * from './components/progress-linear';
 export * from './components/radio-group';
+export * from './components/rating';
 export * from './components/segmented-button';
 export * from './components/select';
 export * from './components/shortcut';
@@ -51,6 +68,7 @@ export * from './components/snackbar';
 export * from './components/spoiler';
 export * from './components/switch';
 export * from './components/table';
+export * from './components/tabs';
 export * from './components/text-field';
 export * from './components/text-link';
 export * from './components/time-picker';

package/dist/index.js

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