@omni-design/components 0.7.3 → 0.7.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (23) hide show
  1. package/dist/index.esm.js +6 -6
  2. package/dist/index.esm.js.map +1 -1
  3. package/dist/index.js +6 -6
  4. package/dist/index.js.map +1 -1
  5. package/dist/types/components/Accordion/Accordion.d.ts +2 -1
  6. package/dist/types/components/Alert/Alert.d.ts +2 -1
  7. package/dist/types/components/Box/Box.d.ts +2 -25
  8. package/dist/types/components/ButtonGroup/ButtonGroup.d.ts +2 -1
  9. package/dist/types/components/Charts/BarChart.d.ts +33 -0
  10. package/dist/types/components/Charts/LineChart.d.ts +40 -0
  11. package/dist/types/components/Charts/PieChart.d.ts +38 -0
  12. package/dist/types/components/Charts/a11y.d.ts +65 -0
  13. package/dist/types/components/Charts/geometry.d.ts +72 -0
  14. package/dist/types/components/Charts/index.d.ts +5 -0
  15. package/dist/types/components/Charts/tokens.d.ts +37 -0
  16. package/dist/types/components/Input/Input.d.ts +108 -1
  17. package/dist/types/components/Rail/Rail.d.ts +3 -1
  18. package/dist/types/components/Snackbar/Snackbar.d.ts +2 -1
  19. package/dist/types/components/TextField/TextField.d.ts +24 -10
  20. package/dist/types/components/TreeView/TreeView.d.ts +2 -1
  21. package/dist/types/components/_shadows.d.ts +5 -5
  22. package/dist/types/components/index.d.ts +2 -0
  23. package/package.json +1 -1
package/dist/index.esm.js CHANGED
@@ -1,4 +1,4 @@
1
- import*as e from"react";import t,{useState as r,useRef as o,useCallback as n,useEffect as i,useId as a,useContext as l,createContext as s,useMemo as d,forwardRef as c,Children as u,isValidElement as p}from"react";import{Box as h,Badge as m,GlobalStyles as f,Button as g,Avatar as x,Checkbox as b,FormControlLabel as v,TextField as y,InputAdornment as S,FormHelperText as k,Stack as B,Tooltip as w,IconButton as C,Typography as T,Grid as I,Alert as A,Switch as z,ToggleButton as R,ToggleButtonGroup as E,Radio as P,FormControl as O,FormLabel as L,RadioGroup as M,Slider as W,Chip as D,Container as F,Tabs as N,Tab as H,Paper as V,Dialog as Q,DialogTitle as j,DialogContent as G,DialogContentText as U,DialogActions as X,Zoom as K,Grow as q,Fade as J,Slide as Y,AppBar as Z,Toolbar as $,List as _,ListItem as ee,ListItemButton as te,ListItemIcon as re,ListItemText as oe,Collapse as ne,Divider as ie,Drawer as ae,useTheme as le,useMediaQuery as se}from"@mui/material";import{jsx as de,jsxs as ce,Fragment as ue}from"react/jsx-runtime";import pe from"@mui/icons-material/ContentCopy";import he from"@mui/icons-material/Check";import me from"@mui/icons-material/Person";import fe from"@mui/icons-material/Remove";import ge from"@mui/icons-material/CheckCircleOutline";import xe from"@mui/icons-material/WarningAmber";import be from"@mui/icons-material/ErrorOutline";import ve from"@mui/icons-material/InfoOutlined";import ye from"react-dom";import Se from"@mui/icons-material/ExpandMore";import ke from"@mui/icons-material/Favorite";import Be from"@mui/icons-material/Home";import we from"@mui/icons-material/Delete";import Ce from"@mui/icons-material/Settings";import Te from"@mui/icons-material/Search";import Ie from"@mui/icons-material/Star";import Ae from"@mui/icons-material/Notifications";import ze from"@mui/icons-material/Visibility";import Re from"@mui/icons-material/ShoppingCart";import Ee from"@mui/icons-material/Lock";import Pe from"@mui/icons-material/Info";import Oe from"@mui/icons-material/HomeOutlined";import Le from"@mui/icons-material/FavoriteBorderOutlined";import Me from"@mui/icons-material/DeleteOutlined";import We from"@mui/icons-material/SettingsOutlined";import De from"@mui/icons-material/StarOutline";import Fe from"@mui/icons-material/PersonOutlined";import Ne from"@mui/icons-material/NotificationsOutlined";import He from"@mui/icons-material/VisibilityOutlined";import Ve from"@mui/icons-material/ShoppingCartOutlined";import Qe from"@mui/icons-material/LockOutlined";import je from"@mui/icons-material/HomeRounded";import Ge from"@mui/icons-material/FavoriteRounded";import Ue from"@mui/icons-material/DeleteRounded";import Xe from"@mui/icons-material/SettingsRounded";import Ke from"@mui/icons-material/SearchRounded";import qe from"@mui/icons-material/StarRounded";import Je from"@mui/icons-material/PersonRounded";import Ye from"@mui/icons-material/NotificationsRounded";import Ze from"@mui/icons-material/VisibilityRounded";import $e from"@mui/icons-material/ShoppingCartRounded";import _e from"@mui/icons-material/LockRounded";import et from"@mui/icons-material/InfoRounded";import tt from"@mui/icons-material/HomeTwoTone";import rt from"@mui/icons-material/FavoriteTwoTone";import ot from"@mui/icons-material/DeleteTwoTone";import nt from"@mui/icons-material/SettingsTwoTone";import it from"@mui/icons-material/SearchTwoTone";import at from"@mui/icons-material/StarTwoTone";import lt from"@mui/icons-material/PersonTwoTone";import st from"@mui/icons-material/NotificationsTwoTone";import dt from"@mui/icons-material/VisibilityTwoTone";import ct from"@mui/icons-material/ShoppingCartTwoTone";import ut from"@mui/icons-material/LockTwoTone";import pt from"@mui/icons-material/InfoTwoTone";import ht from"@mui/icons-material/HomeSharp";import mt from"@mui/icons-material/FavoriteSharp";import ft from"@mui/icons-material/DeleteSharp";import gt from"@mui/icons-material/SettingsSharp";import xt from"@mui/icons-material/SearchSharp";import bt from"@mui/icons-material/StarSharp";import vt from"@mui/icons-material/PersonSharp";import yt from"@mui/icons-material/NotificationsSharp";import St from"@mui/icons-material/VisibilitySharp";import kt from"@mui/icons-material/ShoppingCartSharp";import Bt from"@mui/icons-material/LockSharp";import wt from"@mui/icons-material/InfoSharp";import Ct from"@mui/icons-material/Code";import Tt from"@mui/icons-material/GridView";import It from"@mui/icons-material/Computer";import At from"@mui/icons-material/Add";import*as zt from"@mui/icons-material";import{Settings as Rt,Close as Et}from"@mui/icons-material";import Pt from"@mui/icons-material/Menu";import Ot from"@mui/icons-material/Close";import Lt from"@mui/icons-material/FormatBold";import Mt from"@mui/icons-material/FormatItalic";import Wt from"@mui/icons-material/FormatUnderlined";import Dt from"@mui/icons-material/FormatAlignLeft";import Ft from"@mui/icons-material/FormatAlignCenter";import Nt from"@mui/icons-material/KeyboardArrowUp";import Ht from"@mui/icons-material/KeyboardArrowDown";import"@mui/icons-material/FormatAlignRight";import"@mui/icons-material/ViewList";import"@mui/icons-material/ViewModule";import Vt from"@mui/material/CircularProgress";import"@mui/icons-material/StarBorder";import Qt from"@mui/icons-material/StarHalf";import jt from"@mui/icons-material/Cancel";import Gt from"@mui/icons-material/ExpandLess";import Ut from"@mui/icons-material/Image";import Xt from"@mui/icons-material/ChevronLeft";import Kt from"@mui/icons-material/ChevronRight";import qt from"@mui/icons-material/FirstPage";import Jt from"@mui/icons-material/LastPage";import Yt from"@mui/icons-material/Explore";import Zt from"@mui/icons-material/Radio";import $t from"@mui/icons-material/LibraryMusic";import _t from"@mui/icons-material/Bookmark";import er from"@mui/icons-material/Edit";import tr from"@mui/icons-material/Share";import"@mui/icons-material/FavoriteBorder";import"@mui/icons-material/DeleteOutline";import{useThemeProps as rr,styled as or,alpha as nr}from"@mui/material/styles";import ir from"@mui/material/Collapse";import ar from"@mui/material/Checkbox";import{createSvgIcon as lr}from"@mui/material/utils";import sr from"@mui/icons-material/CloudUpload";import dr from"@mui/icons-material/Mail";import"@mui/icons-material/Inbox";import cr from"@mui/icons-material/Folder";import"@mui/icons-material/MoreVert";import"@mui/icons-material/ImageOutlined";import ur from"@mui/icons-material/ArrowBack";import pr from"@mui/icons-material/AccountCircle";import hr from"@mui/icons-material/Twitter";import mr from"@mui/icons-material/GitHub";import fr from"@mui/icons-material/LinkedIn";import gr from"@mui/icons-material/Help";import xr from"@mui/icons-material/FolderOpen";import br from"@mui/icons-material/InsertDriveFile";import vr from"@mui/icons-material/PictureAsPdf";import yr from"@mui/icons-material/VideoLibrary";const Sr=e=>`var(--${e}-Font-Family)`,kr="var(--Font-Family-Display, var(--Font-Family-Header, var(--Header-Font-Family)))",Br="var(--Font-Family-Eyebrow, var(--Decorative-Font-Family))",wr=(e,t)=>`var(--${e}-Font-Family, ${t})`,Cr="var(--Font-Variation-Header, normal)",Tr=(e,t)=>`var(--Eyebrow-${e}-${t}, var(--Overline-${e}-${t}))`,Ir=e=>Tr(e,"Font-Size"),Ar=e=>Tr(e,"Font-Weight"),zr=e=>Tr(e,"Line-Height"),Rr=e=>Tr(e,"Letter-Spacing"),Er=e=>`var(--${e}-Font-Size)`,Pr=e=>`var(--${e}-Font-Weight)`,Or=e=>`calc(var(--${e}-Line-Height) * var(--Cognitive-Multiplier, 1))`,Lr=e=>`var(--${e}-Line-Height)`,Mr=e=>`var(--${e}-Letter-Spacing)`,Wr={"display-large":{component:"h1",fontFamily:wr("Display-Large",kr),fontSize:Er("Display-Large"),fontWeight:Pr("Display-Large"),lineHeight:Or("Display-Large"),letterSpacing:Mr("Display-Large"),defaultColor:"header",defaultWidth:"fill"},"display-medium":{component:"h1",fontFamily:wr("Display-Medium",kr),fontSize:Er("Display-Medium"),fontWeight:Pr("Display-Medium"),lineHeight:Or("Display-Medium"),letterSpacing:Mr("Display-Medium"),defaultColor:"header",defaultWidth:"fill"},"display-small":{component:"h2",fontFamily:wr("Display-Small",kr),fontSize:Er("Display-Small"),fontWeight:Pr("Display-Small"),lineHeight:Or("Display-Small"),letterSpacing:Mr("Display-Small"),defaultColor:"header",defaultWidth:"fill"},h1:{component:"h1",fontFamily:Sr("Header"),fontVariationSettings:Cr,fontSize:Er("H1"),fontWeight:Pr("H1"),lineHeight:Or("H1"),letterSpacing:Mr("H1"),defaultColor:"header",defaultWidth:"fill"},h2:{component:"h2",fontFamily:Sr("Header"),fontVariationSettings:Cr,fontSize:Er("H2"),fontWeight:Pr("H2"),lineHeight:Or("H2"),letterSpacing:Mr("H2"),defaultColor:"header",defaultWidth:"fill"},h3:{component:"h3",fontFamily:Sr("Header"),fontVariationSettings:Cr,fontSize:Er("H3"),fontWeight:Pr("H3"),lineHeight:Or("H3"),letterSpacing:Mr("H3"),defaultColor:"header",defaultWidth:"fill"},h4:{component:"h4",fontFamily:Sr("Header"),fontVariationSettings:Cr,fontSize:Er("H4"),fontWeight:Pr("H4"),lineHeight:Or("H4"),letterSpacing:Mr("H4"),defaultColor:"standard",defaultWidth:"fill"},h5:{component:"h5",fontFamily:Sr("Header"),fontVariationSettings:Cr,fontSize:Er("H5"),fontWeight:Pr("H5"),lineHeight:Or("H5"),letterSpacing:Mr("H5"),defaultColor:"standard",defaultWidth:"fill"},h6:{component:"h6",fontFamily:Sr("Header"),fontVariationSettings:Cr,fontSize:Er("H6"),fontWeight:Pr("H6"),lineHeight:Or("H6"),letterSpacing:Mr("H6"),defaultColor:"standard",defaultWidth:"fill"},"subtitle-large":{component:"p",fontFamily:Sr("Body"),fontSize:Er("Subtitle-Large"),fontWeight:Pr("Subtitle-Large"),lineHeight:Or("Subtitle-Large"),letterSpacing:Mr("Subtitle-Large"),defaultColor:"header",defaultWidth:"fill"},subtitle:{component:"p",fontFamily:Sr("Body"),fontSize:Er("Subtitle-Medium"),fontWeight:Pr("Subtitle-Medium"),lineHeight:Or("Subtitle-Medium"),letterSpacing:Mr("Subtitle-Medium"),defaultColor:"header",defaultWidth:"fill"},"subtitle-small":{component:"p",fontFamily:Sr("Body"),fontSize:Er("Subtitle-Small"),fontWeight:Pr("Subtitle-Small"),lineHeight:Or("Subtitle-Small"),letterSpacing:Mr("Subtitle-Small"),defaultColor:"header",defaultWidth:"fill"},"body-small":{component:"p",fontFamily:Sr("Body"),fontSize:Er("Body-Small"),fontWeight:Pr("Body-Small"),lineHeight:Or("Body-Small"),letterSpacing:Mr("Body-Small"),defaultColor:"standard",defaultWidth:"fill"},"body-small-semibold":{component:"p",fontFamily:Sr("Body"),fontSize:Er("Body-Small"),fontWeight:Pr("Body-Small-Semibold"),lineHeight:Or("Body-Small"),letterSpacing:Mr("Body-Small"),defaultColor:"standard",defaultWidth:"fill"},body:{component:"p",fontFamily:Sr("Body"),fontSize:Er("Body-Medium"),fontWeight:Pr("Body-Medium"),lineHeight:Or("Body-Medium"),letterSpacing:Mr("Body-Medium"),defaultColor:"standard",defaultWidth:"fill"},"body-medium":{component:"p",fontFamily:Sr("Body"),fontSize:Er("Body-Medium"),fontWeight:Pr("Body-Medium"),lineHeight:Or("Body-Medium"),letterSpacing:Mr("Body-Medium"),defaultColor:"standard",defaultWidth:"fill"},"body-semibold":{component:"p",fontFamily:Sr("Body"),fontSize:Er("Body-Medium"),fontWeight:Pr("Body-Medium-Semibold"),lineHeight:Or("Body-Medium"),letterSpacing:Mr("Body-Medium"),defaultColor:"standard",defaultWidth:"fill"},"body-medium-semibold":{component:"p",fontFamily:Sr("Body"),fontSize:Er("Body-Medium"),fontWeight:Pr("Body-Medium-Semibold"),lineHeight:Or("Body-Medium"),letterSpacing:Mr("Body-Medium"),defaultColor:"standard",defaultWidth:"fill"},"body-large":{component:"p",fontFamily:Sr("Body"),fontSize:Er("Body-Large"),fontWeight:Pr("Body-Large"),lineHeight:Or("Body-Large"),letterSpacing:Mr("Body-Large"),defaultColor:"standard",defaultWidth:"fill"},"body-large-semibold":{component:"p",fontFamily:Sr("Body"),fontSize:Er("Body-Large"),fontWeight:Pr("Body-Large-Semibold"),lineHeight:Or("Body-Large"),letterSpacing:Mr("Body-Large"),defaultColor:"standard",defaultWidth:"fill"},caption:{component:"span",fontFamily:Sr("Body"),fontSize:Er("Caption"),fontWeight:Pr("Caption"),lineHeight:Or("Caption"),letterSpacing:Mr("Caption"),defaultColor:"quiet",defaultWidth:"hug"},"caption-bold":{component:"span",fontFamily:Sr("Body"),fontSize:Er("Caption"),fontWeight:Pr("Caption-Bold"),lineHeight:Or("Caption"),letterSpacing:Mr("Caption"),defaultColor:"quiet",defaultWidth:"hug"},"label-extra-small":{component:"label",fontFamily:Sr("Body"),fontSize:Er("Label-ExtraSmall"),fontWeight:Pr("Label-ExtraSmall"),lineHeight:Lr("Label-ExtraSmall"),letterSpacing:Mr("Label-ExtraSmall"),defaultColor:"standard",defaultWidth:"hug"},"label-small":{component:"label",fontFamily:Sr("Body"),fontSize:Er("Label-Small"),fontWeight:Pr("Label-Small"),lineHeight:Lr("Label-Small"),letterSpacing:Mr("Label-Small"),defaultColor:"standard",defaultWidth:"hug"},label:{component:"label",fontFamily:Sr("Body"),fontSize:Er("Label-Medium"),fontWeight:Pr("Label-Medium"),lineHeight:Lr("Label-Medium"),letterSpacing:Mr("Label-Medium"),defaultColor:"standard",defaultWidth:"hug"},"label-medium":{component:"label",fontFamily:Sr("Body"),fontSize:Er("Label-Medium"),fontWeight:Pr("Label-Medium"),lineHeight:Lr("Label-Medium"),letterSpacing:Mr("Label-Medium"),defaultColor:"standard",defaultWidth:"hug"},"label-large":{component:"label",fontFamily:Sr("Body"),fontSize:Er("Label-Large"),fontWeight:Pr("Label-Large"),lineHeight:Lr("Label-Large"),letterSpacing:Mr("Label-Large"),defaultColor:"standard",defaultWidth:"hug"},legal:{component:"span",fontFamily:Sr("Body"),fontSize:Er("Legal"),fontWeight:Pr("Legal"),lineHeight:Or("Legal"),letterSpacing:Mr("Legal"),defaultColor:"quiet",defaultWidth:"hug"},"legal-semibold":{component:"span",fontFamily:Sr("Body"),fontSize:Er("Legal"),fontWeight:Pr("Legal-Semibold"),lineHeight:Or("Legal"),letterSpacing:Mr("Legal"),defaultColor:"quiet",defaultWidth:"hug"},"eyebrow-small":{component:"span",fontFamily:Br,fontSize:Ir("Small"),fontWeight:Ar("Small"),lineHeight:zr("Small"),letterSpacing:Rr("Small"),textTransform:"uppercase",defaultColor:"eyebrow",defaultWidth:"hug"},eyebrow:{component:"span",fontFamily:Br,fontSize:Ir("Medium"),fontWeight:Ar("Medium"),lineHeight:zr("Medium"),letterSpacing:Rr("Medium"),textTransform:"uppercase",defaultColor:"eyebrow",defaultWidth:"hug"},"eyebrow-large":{component:"span",fontFamily:Br,fontSize:Ir("Large"),fontWeight:Ar("Large"),lineHeight:zr("Large"),letterSpacing:Rr("Large"),textTransform:"uppercase",defaultColor:"eyebrow",defaultWidth:"hug"},"number-small":{component:"span",fontFamily:Sr("Body"),fontSize:Er("Number-Small"),fontWeight:Pr("Number-Small"),lineHeight:Lr("Number-Small"),letterSpacing:Mr("Number-Small"),fontVariantNumeric:"tabular-nums",defaultColor:"standard",defaultWidth:"hug"},"number-medium":{component:"span",fontFamily:Sr("Body"),fontSize:Er("Number-Medium"),fontWeight:Pr("Number-Medium"),lineHeight:Lr("Number-Medium"),letterSpacing:Mr("Number-Medium"),fontVariantNumeric:"tabular-nums",defaultColor:"standard",defaultWidth:"hug"},"number-large":{component:"span",fontFamily:Sr("Body"),fontSize:Er("Number-Large"),fontWeight:Pr("Number-Large"),lineHeight:Lr("Number-Large"),letterSpacing:Mr("Number-Large"),fontVariantNumeric:"tabular-nums",defaultColor:"standard",defaultWidth:"hug"},"button-extra-small":{component:"span",fontFamily:Sr("Body"),fontSize:Er("Button-ExtraSmall"),fontWeight:Pr("Button-ExtraSmall"),lineHeight:Lr("Button-ExtraSmall"),letterSpacing:Mr("Button-ExtraSmall"),defaultColor:"standard",defaultWidth:"hug"},"button-small":{component:"span",fontFamily:Sr("Body"),fontSize:Er("Button-Small"),fontWeight:Pr("Button-Small"),lineHeight:Lr("Button-Small"),letterSpacing:Mr("Button-Small"),defaultColor:"standard",defaultWidth:"hug"},button:{component:"span",fontFamily:Sr("Body"),fontSize:"var(--Button-Standard-Font-Size, var(--Button-Font-Size))",fontWeight:"var(--Button-Standard-Font-Weight, var(--Body-Font-Weight))",lineHeight:Lr("Button-Standard"),letterSpacing:Mr("Button-Standard"),defaultColor:"standard",defaultWidth:"hug"},"button-standard":{component:"span",fontFamily:Sr("Body"),fontSize:"var(--Button-Standard-Font-Size, var(--Button-Font-Size))",fontWeight:"var(--Button-Standard-Font-Weight, var(--Body-Font-Weight))",lineHeight:Lr("Button-Standard"),letterSpacing:Mr("Button-Standard"),defaultColor:"standard",defaultWidth:"hug"}},Dr={"overline-small":"eyebrow-small",overline:"eyebrow","overline-medium":"eyebrow","overline-large":"eyebrow-large","eyebrow-medium":"eyebrow","body-small-bold":"body-small-semibold","body-bold":"body-semibold","body-medium-bold":"body-semibold","body-large-bold":"body-large-semibold","subtitle-medium":"subtitle"},Fr={"eyebrow-small":"overline-small",eyebrow:"overline","eyebrow-large":"overline-large"},Nr={header:"var(--Header)",default:"var(--Header)",primary:"var(--Header-Primary)",secondary:"var(--Header-Secondary)",tertiary:"var(--Header-Tertiary)",neutral:"var(--Header-Neutral)",info:"var(--Header-Info)",success:"var(--Header-Success)",warning:"var(--Header-Warning)",error:"var(--Header-Error)"},Hr={standard:"var(--Text)",default:"var(--Text)",quiet:"var(--Quiet)",eyebrow:"var(--Eyebrow, var(--Quiet))",primary:"var(--Text-Primary)",secondary:"var(--Text-Secondary)",tertiary:"var(--Text-Tertiary)",neutral:"var(--Text-Neutral)",info:"var(--Text-Info)",success:"var(--Text-Success)",warning:"var(--Text-Warning)",error:"var(--Text-Error)"},Vr=new Set(["h1","h2","h3","h4","h5","h6","display-large","display-medium","display-small","subtitle-large","subtitle","subtitle-small"]);function Qr({children:e,textStyle:t="body",color:r,width:o,component:n,noWrap:i=!1,gutterBottom:a=!1,className:l="",sx:s={},...d}){const c=Dr[t]||t,u=Wr[c]||Wr.body,p="string"==typeof u.fontSize?u.fontSize.match(/--([\w-]+)-Font-Size/):null,m=p?p[1]:null,f=m?"var(--"+m+"-Text-Decoration, "+(u.textDecoration||"none")+")":u.textDecoration||"none",g=m?"var(--"+m+"-Text-Transform, "+(u.textTransform||"none")+")":u.textTransform||"none",x=function(e,t,r){const o=Vr.has(e);return(o?Nr:Hr)[t||r]||(o?Nr.header:Hr.standard)}(c,r,u.defaultColor),b=o||u.defaultWidth,v="fill"===b,y=n||u.component,S=r||u.defaultColor;return de(h,{component:y,className:"typography typography-"+c+(Fr[c]?" typography-"+Fr[c]:"")+" typography-color-"+S+" typography-width-"+b+" "+l,sx:{fontFamily:u.fontFamily,fontVariationSettings:u.fontVariationSettings||"normal",fontSize:u.fontSize,fontWeight:u.fontWeight,lineHeight:u.lineHeight,letterSpacing:u.letterSpacing,textDecoration:f,textTransform:g,fontVariantNumeric:u.fontVariantNumeric||"normal",color:x,display:v?"block":"inline",width:v?"100%":"auto",margin:0,marginBottom:a?"0.5em":0,padding:0,...i&&{overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},...s},...d,children:e})}const jr={"@supports (text-box-edge: cap alphabetic)":{textBoxTrim:"trim-both",textBoxEdge:"cap alphabetic",paddingTop:0,paddingBottom:0}},Gr=e=>de(Qr,{textStyle:"display-large",...e}),Ur=e=>de(Qr,{textStyle:"display-medium",...e}),Xr=e=>de(Qr,{textStyle:"display-small",...e}),Kr=e=>de(Qr,{textStyle:"h1",...e}),qr=e=>de(Qr,{textStyle:"h2",...e}),Jr=e=>de(Qr,{textStyle:"h3",...e}),Yr=e=>de(Qr,{textStyle:"h4",...e}),Zr=e=>de(Qr,{textStyle:"h5",...e}),$r=e=>de(Qr,{textStyle:"h6",...e}),_r=Yr,eo=e=>de(Qr,{textStyle:"subtitle-large",...e}),to=e=>de(Qr,{textStyle:"subtitle",...e}),ro=e=>de(Qr,{textStyle:"subtitle-small",...e}),oo=e=>de(Qr,{textStyle:"subtitle",...e}),no=eo,io=to,ao=e=>de(Qr,{textStyle:"body-small",...e}),lo=e=>de(Qr,{textStyle:"body-small-semibold",...e}),so=e=>de(Qr,{textStyle:"body-small-bold",...e}),co=e=>de(Qr,{textStyle:"body",...e}),uo=e=>de(Qr,{textStyle:"body-semibold",...e}),po=e=>de(Qr,{textStyle:"body-bold",...e}),ho=co,mo=ao,fo=e=>de(Qr,{textStyle:"body-large",...e}),go=e=>de(Qr,{textStyle:"body-large-semibold",...e}),xo=e=>de(Qr,{textStyle:"body-large-bold",...e}),bo=e=>de(Qr,{textStyle:"caption",...e}),vo=e=>de(Qr,{textStyle:"caption-bold",...e}),yo=e=>de(Qr,{textStyle:"label-extra-small",...e}),So=e=>de(Qr,{textStyle:"label-small",...e}),ko=e=>de(Qr,{textStyle:"label",...e}),Bo=e=>de(Qr,{textStyle:"label-large",...e}),wo=e=>de(Qr,{textStyle:"legal",...e}),Co=e=>de(Qr,{textStyle:"legal-semibold",...e}),To=e=>de(Qr,{textStyle:"eyebrow-small",...e}),Io=e=>de(Qr,{textStyle:"eyebrow",...e}),Ao=e=>de(Qr,{textStyle:"eyebrow",...e}),zo=e=>de(Qr,{textStyle:"eyebrow-large",...e}),Ro=To,Eo=Io,Po=Ao,Oo=zo,Lo=e=>de(Qr,{textStyle:"number-small",...e}),Mo=e=>de(Qr,{textStyle:"number-medium",...e}),Wo=e=>de(Qr,{textStyle:"number-large",...e}),Do=e=>de(Qr,{textStyle:"button-extra-small",...e}),Fo=e=>de(Qr,{textStyle:"button-small",...e}),No=e=>de(Qr,{textStyle:"button",...e}),Ho={default:"Default",primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info",success:"Success",warning:"Warning",error:"Error"},Vo={xs:"12px",small:"16px",medium:"24px",large:"32px"},Qo=Vo;function jo({children:e,color:t="default",size:r="medium",fontSize:o,disabled:n=!1,twoTone:i=!1,className:a="",sx:l={},"aria-label":s,...d}){const c=Ho[t]||"Default";return de(h,{component:"span",className:"icon icon-"+t+" icon-"+r+(n?" icon-disabled":"")+(i?" icon-twotone":"")+(a?" "+a:""),"aria-hidden":s?void 0:"true","aria-label":s||void 0,role:s?"img":void 0,sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",fontSize:"custom"===r&&o?"number"==typeof o?o+"px":o:Qo[r]||Qo.medium,color:"default"===t?"inherit":"var(--Icons-"+c+")",opacity:n?.38:1,cursor:n?"not-allowed":"inherit",lineHeight:1,flexShrink:0,...i&&{"--twotone-variant":"var(--Icons-Variant-"+c+")"},"& .MuiSvgIcon-root":{fontSize:"inherit",color:"inherit"},...l},...d,children:e})}const Go="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAkACQAAD/4QCSRXhpZgAATU0AKgAAAAgABAEaAAUAAAABAAAAPgEbAAUAAAABAAAARgEoAAMAAAABAAIAAIdpAAQAAAABAAAATgAAAAAAAACQAAAAAQAAAJAAAAABAAOShgAHAAAAEgAAAHigAgAEAAAAAQAAAKCgAwAEAAAAAQAAAKAAAAAAQVNDSUkAAABTY3JlZW5zaG90/+0AOFBob3Rvc2hvcCAzLjAAOEJJTQQEAAAAAAAAOEJJTQQlAAAAAAAQ1B2M2Y8AsgTpgAmY7PhCfv/iAihJQ0NfUFJPRklMRQABAQAAAhhhcHBsBAAAAG1udHJSR0IgWFlaIAfmAAEAAQAAAAAAAGFjc3BBUFBMAAAAAEFQUEwAAAAAAAAAAAAAAAAAAAAAAAD21gABAAAAANMtYXBwbAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACmRlc2MAAAD8AAAAMGNwcnQAAAEsAAAAUHd0cHQAAAF8AAAAFHJYWVoAAAGQAAAAFGdYWVoAAAGkAAAAFGJYWVoAAAG4AAAAFHJUUkMAAAHMAAAAIGNoYWQAAAHsAAAALGJUUkMAAAHMAAAAIGdUUkMAAAHMAAAAIG1sdWMAAAAAAAAAAQAAAAxlblVTAAAAFAAAABwARABpAHMAcABsAGEAeQAgAFAAM21sdWMAAAAAAAAAAQAAAAxlblVTAAAANAAAABwAQwBvAHAAeQByAGkAZwBoAHQAIABBAHAAcABsAGUAIABJAG4AYwAuACwAIAAyADAAMgAyWFlaIAAAAAAAAPbVAAEAAAAA0yxYWVogAAAAAAAAg98AAD2/////u1hZWiAAAAAAAABKvwAAsTcAAAq5WFlaIAAAAAAAACg4AAARCwAAyLlwYXJhAAAAAAADAAAAAmZmAADypwAADVkAABPQAAAKW3NmMzIAAAAAAAEMQgAABd7///MmAAAHkwAA/ZD///ui///9owAAA9wAAMBu/8AAEQgAoACgAwEiAAIRAQMRAf/EAB8AAAEFAQEBAQEBAAAAAAAAAAABAgMEBQYHCAkKC//EALUQAAIBAwMCBAMFBQQEAAABfQECAwAEEQUSITFBBhNRYQcicRQygZGhCCNCscEVUtHwJDNicoIJChYXGBkaJSYnKCkqNDU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6g4SFhoeIiYqSk5SVlpeYmZqio6Slpqeoqaqys7S1tre4ubrCw8TFxsfIycrS09TV1tfY2drh4uPk5ebn6Onq8fLz9PX29/j5+v/EAB8BAAMBAQEBAQEBAQEAAAAAAAABAgMEBQYHCAkKC//EALURAAIBAgQEAwQHBQQEAAECdwABAgMRBAUhMQYSQVEHYXETIjKBCBRCkaGxwQkjM1LwFWJy0QoWJDThJfEXGBkaJicoKSo1Njc4OTpDREVGR0hJSlNUVVZXWFlaY2RlZmdoaWpzdHV2d3h5eoKDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uLj5OXm5+jp6vLz9PX29/j5+v/bAEMAAgICAgICAwICAwQDAwMEBQQEBAQFBgUFBQUFBggGBgYGBgYICAgICAgICAkJCQkJCQsLCwsLDAwMDAwMDAwMDP/bAEMBAgICAwMDBQMDBQwIBwgMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDP/dAAQACv/aAAwDAQACEQMRAD8A8zt1v/D0/m2bbo85K9q664XRPGNl5N0iicc7W9R3FeO2vjF5FAmPB9eldRYvFfqJrWYJIOeDivntTvnRvqeleHfEupeA3EciBoYz8rgcjHr/AI/nXpdt+0p4sd1s7RozEw+V88/lXjlldedEbLVsOCMb+9XPCmk6f4S1yPWvs631uj+Z5bcjI54zU3a1izmlTVmpI+kbLxp8SdcjWVkuzHJ0ZIXCn6MRiultfD3i/UcPdgx57zSgfoMmufb9oZ9WgGl6dAqsw27OWZMf7IFT2XiDxJfKWbcPYkLn6dTXZSrJ/E2zza9Fp+6kj1bRPhjZXKeZr2sLCv8AcgAz/wB9Of6VrX/hL4M6NC39pOb9scieZnBx/sx7R+lebaXYatqlwEupRbx/xMSXP4ZIFehR+C/BUKBtRup7p2/g8zaCT22xgH9a7ou6uor5nJ5XPzw+LkHgGy+INld+AbH7MfPUXMSBlikywwVDd+xxX1HDe3Z8Norx2yIEzsz85z36Yr1SP4cfC6fVTqV1o0U7w4wsrLshDHZmUMeCfU89MDvU+peGPCWsWlxb+H4bG3iRWZhBOu2LaM7pmOQFC5/iABJr57MI1ZS5qTW/Q+lwFCPskqi6dT8o5LC78RfEqG32kRR3h83A6KG5Az7V+pfhHwl8MptKhgvIGhlVAN6yOjdO+Dj9K8W8KfDHTbXUrnWrh4BDCXnnkYjy1UOFwjcjAzksT9AOa9vtbLSJYhJHIsaFFZZEYeWQRwQR8pHoe9d2Fq3Wxw46hK99TtU+Evgu7XOm6tcRE9AWSQfqAf1rOufghqGC+maxBJ6eZGyH81J/lWF9ju4Rvs5xKuNwPXP5Uh1vX9PHyPIO3yOcV1upC2sTg9mZWqfDv4oaKrSWcomVeht7n/2V8Vwdj41+IXhzW44fEMV+0LkRwxNHnfIT03DjHvXp6+OvEtveRRyxzyLJwocDaD6sewFT+NfEVjDp/wBvuJ0a4WPk8dT2UfpXn1nztqDOyjTUFcf4h8TTHS/tWpzLG+zJTPyx8dPc+9fGHjTxve6o8lnp8jLbkkE92/wFWPFnja/1tjBJJ5cA/hHf3NeVahrVhZRNucZqU7LlR1KnzS5mMimitW3yH5qyNb8XW9vHtMn4Dk1w2qeKbaRyfOWJM9erH6CtXw5oN34iuo5Rp8ws2/5bSDG4+oBo6HZGkf/QwfiB+y3N4f8AEotfDV5P/Z8oJ8qRt+wjnhuuK8A1zS9b8AagYLhZvJzgSlG2ZHbdiv0u1v4m6Xd66BfW0tqckbZlIPT3roptF8MeLdKMN1bwvFOhIDBf0zXz9RLmbiz2I6o/MDT/ABdJcSJHc7lJ6HoDXsGhXk6qG3iSNux6V698RfgRZ3enqnhqNIZwBtYLnmvDh8OPiV4YuI4TD9pcuFAUAJ1xli3AHqTwO9Q3Zakzpp6I9M0ZLaC5+2aZARck44GdxPavYvDGqanqF2LGKDFwcfIFbHPfgGuG8AeDr7UZvMvNV0/yIZsTeTMZFjOSrI7KByCOzZz2HWvZF1/TtE8XQeFtE0+BnhgWSTU72VkTEoYL5UUfLuSrAAsT3GetEZq6S3OV4KUrtrQ9H0iPRZXuNPl1GKa7sYhPexwuZBARx5biLJDMx4GCeD71Q8MePvhh4i1K+tPDF6up3mmukUscKldsj7s4MhwdmDuP8ODmvz5+Ofjl/BvhrWdQ8KreafDreurCL1hMvmi2iLsVWQEBEclgqFgN3JB68d+zxJ8RNM8EeLvjHoTxARLKWminiVrydMzXBMZJEQXhdyozN0A446FJyjdM3hhIRkotH1j8fPF9kllq3g7whdBNUa3F5LOitJMktuXMUaPFl8bo2BJCjkEZya+dvhD8d7Pw14WiPjOS5thcM9qr2saTC4s5A8hZo2ILKkxkTgNgHuOvwp45+K/izxlq11rJ1W4im1SFxcMj7HXLncCqYxu2gEdx164Ot4s+IWh6p4I0e006eddSit4Ld5HVVmR7bAXBA5AYZUZzySevESwknbm6s3+tU4+7Doj7yv8A44aP4Ztv7XmS81WHTIv7LgW7uWSJDcPHIjFY2wzrGd0e8FMYBAJOOf8AEX7SenLYqLIRyWlhukkmIKzF5CGffGrbMYxhVJ6N2Ffnd4l8U3upaZJfapYPOLpk2XbthlKJ8v3RtAOe/PHUViXOvW1xp9o81x/pLoBNHsAiZFwFwoYkt0y20Z549dYYO0VF9zKpilJvTofo5pP7Sniy3TzNA2/2fIrNG/zMmBncNjA4Kngj8q9Z8B/tXQ3Rlg8Y+XmLHliFfLZnOQMh+AAQMkkAA5r8tfDfj3xB4dtTYaPIt7aEeY8arux3JAwD7EH0zmvR9a16x8XaLBFusE1WdoRO4QQzIgBzGuGAfsWcjIOBiieGlF6PQwUqc1qtT9d5fihpniLRRf6Msm6ZcASrg7lyCVI4Zc9COCOa8W1vVNQuyZdSdio6KTwK8K8EeKINAuNGsdNuXu7JbZ7a6gZyNlyER1YK3IO3J+XII7nFe66T4d1LxrK0sgMVucgHPII6+2PT2riUteXqU8PZ3Wx4zruvNJO1raQMcdTXKaVoOseKpLj7NalYoDh3kJJJPYV7zf8AgCPwnqMk05MkbDJZ+e3vXQ+Ar/Slgu7S3iJllkO3auR0PU1UV71mdEYKKufPPhz4bWk3iyyS+TcqkkoeQDmvvPUtA03SPD0DWsCJsTOAAD2r540T4d/EHW/HTGxT7PEWLJJt3fKT1xx/OvsvTPg/r0NvFca7eyXRC4KsQF/BRx+ta0acnfqTVrw0sf/R/Q3XfAeh61q8t1cWqM4zhiorirj4YvcPs02RoCgIRlzxXQzfEq1GoPGtvJyxHT+dddp3i7SoY1kkY72GTx09q82UISmzqi/d0PLn8J6/oNuqiRrx+24Z5/SvGfHeg+NZZXutZkkXS4Ip5VihkKyzufLJWQZXKqA+1RuP8q+yZfEVjdRl4sbirbN4IBIHH4V+dPxC+PE3/CRnwL8SC0D6deGOa7jgQQRGdd9uQN6yOAPuvsKk8MRXFjIx5LRuztwnNz7nKeLrzwjb2unQ6dqUumhJDqT6XZ3geSRIPmbzkuH2gyou3mPIHJU8g+M6P+0/4U0vxLcy6/oLMiGZkmQlbn7QS+RNvUhdhIjXyyAMkqQDXjVtHZa54k13xD4bsbmSSyYA3V1dC4uGmuDlmSzUIArqGUBWzlslj2+U9aW91XX7l55tl0JHEyMNpVBgAfgAAR1GMHnNTRwcG3FvU3qYycEpJHXeJ/iNqHijxTd3N8815pMt27w2k1w5jXzeApDPkjKjPPRRwM10ui/ErVNH8LyaPYzR2q299PcC1jbaGSVVyRnO3HIG3AINeD30yTXEv2oKs8TLtZMDKYIzxxnoSeppYLy08pVXAnAIQlSGZ2IyWY54AHAFet7OPLyW0PL9rPn529SzqkhglW6kO6Vi5bnlQcbVPJxgHIqCJ7htKMyyDBmO1CcnJ7gHgdvrVS6a4mm8hgGZgMkYJLeue+K7mfwwdO0uy1OaRJobmMMsUfytvZcnPGDt785HFVKrGKSfUzhRnNtxWxzlzr+oDTY9HS9lNqHVli3YCyAfewee5x+NczNEVl8xxtU9McfMOuB+NdTqWmtbi4tROsqQlcMY9hLNzt3dcj361z8jGaw3kFmQg5649eauEotXXUiaknyy6Fq01CS3xHbM2+UOH2k5KsMEfjXX6Fd3NhItxbgrcJkiUrvYLjJ2qxIyM4rzeKeaNy8R2kgKSOOK6jT2t5I+J/Ll+VlUA8PkYG4jGT+X0onEIaM+i/D3j6/XTLg5+ZrmO5WSUok0bx42vgEDAwM4zxnpzj78+D+s+N/HWmWl14VIsNNtIJklZCZpJriTJ+ZSCBswOBk7elfl3Zx2flpOsuJQC8kbIfmXBGM5/pivsn9nL4v3Xw+s5rW7kZ7e9bzPJ2hRvjG3b84G3C5JYHBXpzXlYmlFe8ejSqSasj9ErjwPqVzOq65+9Vo0DMeAWwM/L2r0DwJ8NdD0uOa6SBNzv1I7e1cL4b+JD+LdCW+UwTbxmOa1LNEY/wCEksASfU9Dxjiu+8N6l4imjkgEJCITlj0Yn0q6MYXuctST2Z6d4YXS7DVtoCq2MD869a1q+tU0/cGXha+SrHw9451HxGWs5Fjjbnc2fl59O9exXHg7xULZft995mRjaBgV1UpPlasZyldn/9L9DbTRdPkeSR4lDFj2rf0Dw/p5kZ3jBGT1ryOTxNrc8/8AoMGFzyT2Feg6LrOs3VssUMezAIY45zjk157cednRFpxR0t/o1iLrjai898fLjoPevy9/a3+IujW+vTWNvpdtNd6NLHGPNs4Z5PKZM5888xttKsi7WwRz6V9k+OvGGoaMIb6YyzJE2x54ULrEHwhfAHQElQTxuPoCR+JXx18earca441LdI96Z7p7iRm8y6EhCRNMdzbmRI1U5OQR6dfOlL21TkjpY9KnFUo88jz++8YavFJqFzpTrY2FzgSxWsmzeY+InfnJYMMjgHNeIXl/LLeS3gXMjPl5GYkvnk5/HrWjot6bnV3M5zHsfCnkHPt9RmsfVpBBeSxRgbW7V6tOmo6HDVqOauU5ZvtNz5qIF3YyoHHFem+DvAN9411Yi1hZI2YhSQSobHTgdMkYxXmkUS3V/aWsB5kZIzj1Y81+pXwn8EeLItJtx4I03TxHbJ+8vdTYhHl4+WJFILBe5PGeleXnGNnQhGnS+KXV9EetkeAp15yqVvhj0W7OD8B/seXmqXEF94lVBb4CTRRbl3YxhlOAeec8fSvojxf+zNoeu6Na6bZQrbS6euIcLgEYwN2wqeOo/kc16b4e8W/GjQtRisfEOlaHqVgdqvJprtFIgx94BmbcfbA+tfQKyfbbKC/EXkl1JdD1UgZIzXyOIxFeU1OVW7XbZH2mGw2GUHCNKye91qz8yvEv7JM7WNvMwBS0Dm4lLHc67SVAGCWO4ADOMAnrXxv4y+Gl54MWO6XesBn2TAjIVTkAkZHGcfSv1v8AiH4m+KV9ObPwzJpuiaah2yXF6qyyOc9QGyoXHtnPevnPXfhJ4w8SRXWfGel6lPcK6m0MMaDBHJUopw3oTxmurBZjWpSi3WTj1Tv/AJHDj8toVozUaLT6NW/zPy+v7KOK5KQ8q3I9OvOK0rW3jEqzXEyCFCCEQ5Yn/PU103xQ8JzeDNch06RHhLJ8yyfeDA85wSCPQivO5G3Dev314/CvuKNaNaCqQejPz+vQlRqOnPdHcx6qq3wufJbyy7CJRzgtnhfck/SvU/DNxp2oajYW2q3Vwbj7THCq7gCF2lSitwByRnLAHkcV45eRWcmjW0qExyptYgZKyZwMZ9R1H5V654E1CBNYs9K1WGJdO1VVtbmPJkVPMO1ZgGy0bq2GJHbpWdZJxNaUmnqfqZ8ENZ17V/Ar2tutlLBpg+xMsEbJcrJEo8l3y5BRkGBtGPlr68+F1zef2RG+p4ErDO0nkZr8yfCeq3vwr0DzrxdU0rUbK6iglWS1cWN2pnKxRvcqCjeYu9UPUHoOtfpL4Wae8it7iWB7M3caskZbLIxXOxxgbWHcc1y0GlLUVdNarY998O6hZR6kVJXcQK9J1OeFrcEEcjNfN2jeFNXu9Y8+K5ZFxz9favRtV03XbC2yLozbR90jFd8JPl2MG9T/0/0LtNNWwh/fqvua6XSoorGwa8kKkHLBCcZFed3Wq6prw8mAeVGeDtH9a6fw/p1zJD5V3LnZ8oyewrgk7z0OiL0Pj34meJm0/wAVa1o99dCWbULYtZWnmGJAturTKDjHLpuADHnaSvSvyG+LemWtzb3t8bc29zPdNcRvseOKZJixY7JDhWBwAF4wM85Jr9zfH/wD8B614ztfHWtRE3dtt3ESMqP5Cv5fnKpAdEDNnPQZxxxX4rftR6jpHiTx5J/wht3JNpaSfZIhIrogKudzRhudm4nDNztGTXmYfDuFa99z1J11Oi48uyPnPSrTT4ra3YtItxI75P8ACwCHAAwD1Gc59iOa5zVopjqOH4LEAFuBnjua7bxVZNoVxHp9pew3z2DG2ae3O+GR4mwzxt3UnODxkc9CK47WLv7ZiaTaspP3UG0AdOnTrXsxbep5k0krGj4Nt/P8aaRFKOHu0GMDHX8q/Wu98GeNfESaRa6dqA0rQbZN06wny5ZTtx8rlXReefmRs+3Wvyj+HsAl8beH/LdTK95ENmTnJOMnsP51/Rj8PtBs20O386NXXy16+hFfJcQJvGUrdE99Vv2PsuGUvqlXm79NHt3Pz9+HPw5+KWmeKftup6098kNwv+rEpiNsAQ6Odg3OeNuCFUjpzx98adNqd54enjZCskY+Xd97kHA/Suu1G40nTX+yW6orMMYUDJ/xo0W3kurC7kKlUchACMEdQTXkVf3lXdX1vZWPoaMFTpW1tpa7bf4nwz8RPCviDxrb/ZopLmBbVpWY25YSFnTETqykEeWecY+bp615f4a+CHi23sre8k8Q3L6ta3huTc7bgFoyADCY5maMDqSwyxPGcV9sC5Tw5qU41RCsQPlmRgApOeOenI5Fei6fa6Pf27T2aIGZeWGOa4sPiKkaToKS+5HTicLTlVVdxbfq7fdc/E/9rXSLiz1LSL29O6ZjJC8g/i2jIP19a+QQWjYNjgg/Lmv0V/b3tI7ZtFCBQRcycA5GNpx/Svzul3SToQv+sVcKenNfc8PN/UYJ9Lr8WfnXEkUsfO3W35HbaS9rPo8sNw2FOSpZgAhzlRt69e4p1hcxRXSTwyMNx4DA/Lt6+uRXORYitpreRmEn3QM/KwBz0retbQXVlBPAXEtuWzwCu3r6j/8AVmvWaR5EW3Y+8PCnijWPH3wiuNJtlN1baJqVm95cSSsXt48s4LR7TiMYYB84DkE4FfqF8L/EV34i0q11/V7GSzmDOiRs25GRflSZcAZVhyrEZwa/Mn9hjxTeaX44n0drC1kstUj8i8uXbbMmFbywqkgMmR8/Bxkc84r9jPDtjpMFkbWyiihijyqRxKERR6Ko4A+lclOPvtGldvY67wp4isF1Aws65xXa6zeRzshjYbSOea8Ts/C8bag90jlcHscZ5roru21WxgM4cuiDgHriuqMnynM276n/1P05fw3eabpRv5IREoXds4BA+naquneIPD1vpJLMryuCztnkHsPbFc9498W+Pp/DUktroz28Ey4LyMA6of4tg/rWt8MtG0VPAtut8iST3iu8zOAWJLEdfYdK4HK87R7HXGOiPmz4rWfi74jeFb3Q/DOsNod1JIDFdEZRoslXhkGDlJFOGxX5hfFr9mHWfhZLp+p39/Nq+iwqZL0wRkSvIsW9hAzmRUVmzgMM4HTPNfq5r2v6To8lzHd4jihkbaCcZCnivkj9pHSvFXxKOkaL4V1JbffbzSCBLhViYeW0nmGWMOSxUbBGQevOOTXn1ZWXM5WOug/e5Ern443iWl9qBS0LRWylm8uRs4QcYyByegzgc1zWpoUcKRtAyPY46EGvWvih4Zg8DRado6zTnUpYxd6isiBGjknUMkWfvcJjOcZJJxzXlF2oa1hk37mOeCecegGM/nXp0ZqSUlsclZWbT3GaJqsuh61Ya1B9+xuYbhffynDY/HGK/oi8LfEO2h8F2uqWzb4ZbZJoSOjI67lOfoa/nKIPfvX6i/sifFex8U+CT8M9cmUanoan7KHPM9iTxjPUxE7SP7u014PE+GnOlHEU943T9H/k/wAz6ThXFwhWlQqbS1Xqv+B+R90+EtV1DWbh/Ed/CSWIaFDzsQ/Mu4ZwCeCRWZrfxU8SaTdTxXzh1ckxpBHtRAPu8gnJ9c/pXI2fgrS08Q6f4iup7qW2tmMN1YrdTR2lzE3AMkaMBvXPyuMEcZyOK9dTT/gBFEP7Q8Paktx50eUieWcYX5nIYS/dOec4PHFfLYbB89FONS3e/wDwx91LENT5nSlL/Ck/1v8AgePx+ONS1mznh1q9hlhmO9UuvKiZRznLZ5HpnmuO8NfEDW9K12PStNuU1HS597RyRkSeXtO3yy4OGXnIZfTGa9O8eWXw18Q+Hr/wx4X8Mw2lpqaSW8tzdYku5I3LZWL5mMe5W25zkD0xmuE1K18P+CtOW7kENhp+lWhBOAkcUMa849gBXJjMMqdnGXNI3VSSV5x5F2dr/NbL77+h8N/tseIbrWtb8PWUyhJZUmuCnopYRr/I18XSRus0eBsKIjADqSRkfp1ruvit8Qbv4neP7zxNGpjtgRb2ERH+rtos7Mj1bJZvc1wSSKQ2QAy4IY+nXGK/SMsw0sPhadKe+79W7n5Lm+KjiMXUqx26eiVi0sr3Mwyg3RbmZgOcgd+36V7j8MtI8NeKZ7vTvFkxt5JLQm2mgBEjTj/VJhSAQxOCANxPTpXielRpLI8pJyPvLycqRyT7Z4/GvX/DOnWuq3linhmSaXVrYxMlvHG6tJeNKuI0HXbGoJaRsDnr0z0V37rRx0d7n1z+zf8ADr4geGfG0euTQPbQC8NtLDcRiSWKzKmXewJz8+1cMPuk5OeRX6l+G/EkSM9sPm2knNec/DjTrz4hxaLrDWqWEraFHFdGSZGmSaCU/u1jU/KpLEhm6kAZ5ruLb4e+L9DmuLyW0+02Zdm8xOGC+6+1cNKc2+YVVxb16HpWheJIbu/+zq2cHkV6vfywSWYUY5FfCl/4huvDWsm5hyV3ZI/GvY9F+KUOqw+VIcFFGc11wrx+FmfLJavY/9X9afiJq+nWPh27jbaSYWVQfUivheL4xWnhOx+y3c+1hkAZ6Z9KpfFD4u/6PJH55nkYcKDxXxlewah4pvmubtyATwOwrza9RJprc6YSctFsek+M/G8Xi+7kWFyImY8g9a1vBlwbeS3S5mkn+zktalySIHYBHZQeAWXgk9v15rQfB8KbQx4r2jRPD1lCF6ZGK4pU/aO7LVT2atFn5v8Ax7+FOo3/AMYdcnt7Wa7sI7Q6zdT3JEcRSIKLkxS5wyCVgvHzgHgHivlDxjZWMOraja6YIDaxTtJCIHZkjjb59gZxuO37ue+K/bL4veAl1/QpLTRdFW+OpSxrdSSSF3jKMWWSSJE3Tx7ifMQYbBBByAR8RXX7DfxBn1u3ksrm3bSpLgGRLjKzeU0mSPlU4bbjIdsjpu9OmhNr4h1KkWtD885EYwxRtxgEjPX5uRWj4X1jVvDfiTTda0Sd7W+tbhHikQ4I5wVI7qwyCDwQcGvs34v/ALLXi7wZoM/ia+RYYBqMFlBa2yCbebhtvmKV5VBtA+fozKuTya+ufhj+x/8AB/4W+FYPFfxTuFvPF8+mvPDp19PGojuHRiqxWo+ZnXIBJLAEGt5VlyO66MyjpOPI9bqx638O9ZtvFujRNc7Y7low0sR4BBHJUHt/k1T1z4aTPcmWHWJLeNjkRg5x9MnNcb4fsTpsaLbyFTGF27TgjHpV3XLnxC4LQ3bOuM5PUe1fltaskmtmfs2FnOm7xbOs0DwlYaMjXlxePcSjd88zD5dvoOgHevi/9qvxbc674YvdH0xythEu5mU489kcEn/cHb1PNezXF3rV2sltcXDurnDKMgHHX/JrzLx54Vs9X0uW2uukg25B6A8VWAxcYV4SlrZpmOZ0Z1qNTXVpo/L+3cI+WU9OoOKt+V5is8YOwYGeTyegzivpPwh8H/DSeNrnw74lvmt5jFv06S5hH2BpHbEf2qRXDBc8HC45yTivorw7+xh408SeOdOt9W8mHwfFIWu59P8ALgDbf3hECb5TIjMTGkjMTjkYGBX6jHERqRVSOz2fc/H61P2U3TqaNbo+H/Cuh65qMsj6Fbbj5MkU2SMtlGZgEOM/KMjg4xmvo74I/Bjxlr/hu/8AiV4Pkn0z+xbm3S4luIWZXilbEk9tMuQPLIIlVlZVX5icZx7N8KfBQ8e/tNatJp+kweFk8Nx3cjW8lu4WdI5fssDNEWAbd95mBXPUA9a/S/4f+F9K+Hdjf2dhHCBqs5ubtIIhFbvIVCHbDkqoKjBHfvWVSTlpbQlzUUrPU7v4P+F9Y0Twdp6axa2lrcKmAtoWZTAp/dBmcZY4ycjjnj1r6Ut9RtZbD7JgAsuCK8f0iS91S3WC0YQxooVVHACgYAUdgOwrTTw9q0b+Z9qYH0zU0/cXuoi99T51+J/wZ1+61KW+8NzNOJXZzbso+XJz8pHb61x2neF9W0lTHqtlJaS9ywIViPQ19y+H4Xs5M30hkPqx6VV+JSWF9oE8FtEstwyZjC4zuHSh0k1zItVJKPK3of/W4WGzm1NhJcyFifU12eleHUyuys3S7cnHBr0bSYnBXC14drnZJ2WhraZ4f2gZrvNP0kIAB2qtp8cgUZWvX/BfgrU/Ege5V47WzhO155emeuFUcsf85reFNyfLFHLOaW5zlrYEDg12+ieEfEGtOF02zkdSeZGG2MfV2wK9csNM8FeFIBO8QvJY8brm4AZQfZPuqPzrRHxR0l38hZ44lXgFvkXA9Pwr06WWVGrtHDPGUouzkcNrHhTwr4M8NX2v+N1j1YWUJufsoUNBlOmd3Lc+wH1r8ktMuJvGHxa8X+M9emNxe6jcRrZmQ5EFkY12QxDoqBlccd6/Qv8AaR8Yyx+Cb660i50+8S7hNuY42drhVYjcRn5eOOMV+YtpcXFrcw6lpZzeW4IMLjaZIyQWRh+AII6EA+orqx+QTxGW1IYfSe687dPn+Zllmf08LmdOddXgtH5X6/L8rn0lDEsEW2UfIpBXHHI6VV1G4gcPGZChIPBHIwKz7Xxt4av4oluLpIJ3Cjy5MoQxGeM8cdDg4Bpt1bwXypMkiyRsMqyMDkE+1fhePo1adR06kWn2aP33A1qVWmqlOSa7pmOIowpMS7tx+83b8KxtVsoEt5JrogRLlnJ4AAGa6TV9U8O6CIop7je5PMcYLt07hen44rx7xd4nXVJBHGGtrFMbYmOWduu9wucew5A9fT18g4Yx+YVVyQah1k1ovTu/JfhueFxDxXgcupNTmpT6RT1fr2XmzyPxNMJ7t7oJh7hlSJT1WIEgZ9zkn8favdv2ffjTqvwwfWbbVY21fQIrqMvaMxDRK/ytJC3Yg4JHQivDmgl1DUxMykKhG0ew79a6nwxZFTq8GwSJPC52n+LackE/T0r99wmUUaOHjhoL3Yq39efU/nrHZzWr154mcvek7/8AA/Q/QNfH/wAF/DXimHUNPgTSYPGCi9XU0JlgmuHwskdw+A0cgI6MCuDkGvb7nTl2q275XUOjD7rKRkMp7g9iK/LbTLH7VoM+gXh8y0fDwZ6wuOm3PftX1t+z/wDFy8i0VPhr4uZZ5tNJ/s+Wck+ZDknySTyMfwkHjpXJjOG0481DR9jTB8QtS5MQrrufUOjatcaNIFSTKk969KTWPtVv5r3Ww46DFeURW9p4kSSfQsJLHnfbOfmyDzsJJz9K5i4ku4i0LSum0kFTkEEdjXymJw1XDzcKisfU4bFU60Oem7o9M1bxBHakt9sbj3rmbL4i6TaXbfbp9/HAZ64l9BfUx80rt9Oa569+HNhM2Z2m/WuKTad0dJ//187TYpMjBr0PTFlUDFZ9lDaKBgV1tqsGBt614kYnROXQ7Hw1p9xql/DZmTy1c5kc9EReWb8BXdeMvixFpEC6R4dUR2NvCyK2cEleCSPUnqa4eyujp+g6rfxnDLEsQPoHOW/QV4Ncap9qtry3lf5iLjac90VZFH4gGvt+HMDB03Xmr3Pjc/x1RT9hTdjt4Pibrd5dOsVyzgjlSxII7jGe9RX+vXN9cB3k8tgPurwufXj2rwjwXqMlzO8q4LBsEentXrYiOFYKAfavrHSitUj5ZVG9zE8X3L3kMVtK7Og7Z4x9K8tl0SEEugwSeK9N135ihYZOD26VzLqGUENnOefpSS0NE7nK3fh+HUolgnRJDkAMQC/oRnr6Vw2vaNrelTTzz6gWt72SC0srZSf3ZyC7AEcHYrcivZ7GNPtiBuhPHfJzXK/E2EnUfDTpkILqfd9fJO3+uK4q+CoTalOCbv8A8A7KWNr0ouMJtKxjDScxq79cDBBP9c1nXWhJKcu2fXj8K6+MnIwu7jGeuMU+SINwO3YV1W6HFdvU4e08PW0cudpIxnNbMFpFZTM8a4J57elavlBA29SfQ8VWniBjLKCPx6UEPzHNpv7v7TYMSMAsnUjvxUSu6yR3qny7iE7lYcEEVWF3LZSbuSQB064BplzqEE5MqnacYI6VtGSMZQ7H0b4A+I9zZ7JJpWWUSH5snHQcD+de+/8ACbeHvEMSxapGIZ26XUOBID6kdGH1r84xq5tFljQkHBkB64K49PUVt6Z4/u4tqSSMdpHP0HX+VcOLw1GuuWornbhK9ak+anKx+jmjO+jzpMZVu7KQgLPH0Gezr1U/ofWvXo9MsNRgFxGAcjtX58eCvilNZzKrSbo3O1kblWHoe1fWXhjxxa29vHdxvm0kwME52MRnafb0NfEZrkzw37ynrH8j7LK82Vf93UVpfmf/0PQbTS4yOR+ZrorawjXGP51x8GoS4Azx9K3rW/c8Bv0rx00as3PEzC28HXdpEcSXSzYx1zHGCP1NfJcWsm8tkuY2OX+YrxnJQxsPXv2r6D8carLZ6dpMhPyyz3EWTxklAVz+K4r4vn1ZdA8Q3WnSFhBKxurUHPMZb94nHUqeor9LyNKOCh5/5s/O87beMnb+tEexfCaCE+C11fAZ7i7mVjjJ+RsBa9WWTdGA3yrzxjvXzp8ONek0PQdSsZWL20WrEW6j/aUyEj8CteswaxdahH5gVkGM8ivYjO8UmeR7Np6GlrBV281Tnadtc66gDCnoRW7h5ItkhyQAx4HWsiXH3CBgZ9fz9qnyLRn7XE6snU88DJ/AetcJ4ofXUh0ka1LG0k+otJaRohDxxJHIH3Z6nBXJx34zXq9hbrJcHOPlGQMevH9a818WSjUfiRBaf8s9IsAOenm3J3t+O1VrGrC8otN6fj6m0aloSi0tfw9DSgSQoM85A9c0oABOSR7danKgAHdwDjgY9BTWCopcgDuM8dK1Mio7rsx8x64qhLKNjE9yCen4VYMhkYrhhz15we9UZVyCucEn2PH9KlkmNdzoFO5eexPUj/8AVXKXlx1MRGe3OK6W7kRWI547dMnvjiuP1FfMLDA74HANZTdkVCN2YT6rP9o8pmyNrDkdcj8KiW7MROGPJ6isqcPBdKX4XnPqOD9aha5Vmyh24BAB/WvPnNt6npQgktDvdN16a2dVD4H97+or6r+FvjqJm/s29cPb3ACMHPHsR/SvhVZ2RgSc4OcV2uh6hcMcW8vluOR2yaOdTTpzV0w5XBqcWf/Z",Uo={default:"Default",primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral"},Xo={"xxx-small":{size:16,iconSize:10},"xx-small":{size:24,iconSize:14},"x-small":{size:32,iconSize:18},small:{size:40,iconSize:22},medium:{size:56,iconSize:28},large:{size:64,iconSize:32},"x-large":{size:80,iconSize:40},"xx-large":{size:160,iconSize:80}};const Ko={"xxx-small":"7px","xx-small":"var(--Legal-Font-Size)","x-small":"var(--Number-Small-Font-Size)",small:"var(--Number-Small-Font-Size)",medium:"var(--Number-Medium-Font-Size)",large:"var(--Number-Medium-Font-Size)","x-large":"var(--Number-Large-Font-Size)","xx-large":"var(--Number-Large-Font-Size)"};function qo({src:e,defaultPhoto:t=!0,alt:o,initials:n,icon:i,color:a="default",size:l="x-small",customSize:s,clickable:d=!1,onClick:c,insideButton:u=!1,className:p="",sx:m={},...f}){const[g,x]=r(!1),b="custom"===l&&s?{size:s}:Xo[l]||Xo.medium,v=Uo[a]||Uo.default,y=e||(!t||n||i?void 0:Go),S=y&&!g,k=!S&&n,B=!S&&!k,w=d||!!c,C=S?"transparent":"var(--Buttons-"+v+"-Button)",T="var(--Buttons-"+v+"-Border)",I="var(--Buttons-"+v+"-Text)";return ce(h,{component:w?"button":"div",type:w?"button":void 0,role:w?"button":"img","aria-label":o||n||"Avatar",tabIndex:w?0:void 0,onClick:w?c:void 0,className:"avatar avatar-"+l+" avatar-"+a+(w?" avatar-clickable":"")+(S?" avatar-image":k?" avatar-initials":" avatar-fallback")+(p?" "+p:""),sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",width:b.size+"px",height:b.size+"px",borderRadius:"50%",backgroundColor:C,color:I,fontFamily:"inherit",fontWeight:600,overflow:"hidden",flexShrink:0,border:S?"none":"2px solid "+T,...u&&{marginLeft:"2px",marginRight:"2px"},...w&&{cursor:"pointer",outline:"none",padding:0,transition:"background-color 0.15s ease, border-color 0.15s ease","&:hover":{backgroundColor:S?"rgba(0,0,0,0.08)":"var(--Buttons-Default-Hover)"},"&:active":{backgroundColor:S?"rgba(0,0,0,0.15)":"var(--Buttons-Default-Pressed)"},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"2px"}},...m},...f,children:[S&&de(h,{component:"img",src:y,alt:o||"Avatar",onError:()=>x(!0),sx:{width:"100%",height:"100%",objectFit:"cover",borderRadius:"50%"}}),k&&(()=>{const{Comp:e,token:t}=function(e){switch(e){case"xxx-small":case"xx-small":case"x-small":return{Comp:To,token:"Overline-Small"};case"small":case"medium":case"large":default:return{Comp:Io,token:"Overline-Medium"};case"x-large":case"xx-large":return{Comp:zo,token:"Overline-Large"}}}(l);return de(e,{sx:{color:"inherit",fontSize:Ko[l]||Ko.medium,lineHeight:1,textAlign:"center",marginInlineEnd:`calc(-1 * var(--${t}-Letter-Spacing, 0px))`,...jr},"aria-hidden":"true",children:n.slice(0,2).toUpperCase()})})(),B&&de(jo,{size:l,sx:{color:"inherit"},children:i||de(me,{})})]})}function Jo({children:e,max:r=5,size:o="medium",spacing:n=-8,className:i="",sx:a={},...l}){const s=t.Children.toArray(e),d=s.slice(0,r),c=s.length-r;return ce(h,{role:"group","aria-label":"Avatar group, "+s.length+" avatars",className:"avatar-group "+i,sx:{display:"inline-flex",alignItems:"center","& > *:not(:first-of-type)":{marginLeft:n+"px"},...a},...l,children:[d,c>0&&de(qo,{initials:"+"+c,size:o,color:"neutral",sx:{border:"2px solid var(--Background)",zIndex:0}})]})}const Yo=["primary","secondary","tertiary","neutral","info","success","warning","error"],Zo=e=>e.charAt(0).toUpperCase()+e.slice(1);function $o(){const e={};return Yo.forEach(t=>{e[t]=function(e){const t=Zo(e);return{bg:"var(--Buttons-"+t+"-Button)",text:"var(--Buttons-"+t+"-Text)",border:"none"}}(t),e[t+"-outline"]=function(e){return{bg:"var(--Background)",text:"var(--Text)",border:"1px solid var(--Buttons-"+Zo(e)+"-Border)"}}(t),e[t+"-light"]=function(e){const t=Zo(e);return{bg:"var(--Buttons-"+t+"-Button)",text:"var(--Buttons-"+t+"-Text)",border:"1px solid var(--Buttons-"+t+"-Border)"}}(t)}),e}const _o={small:{minW:16,height:16,fontSize:"10px",padding:"0 4px",dotSize:8},medium:{minW:20,height:20,fontSize:"12px",padding:"0 6px",dotSize:10},large:{minW:24,height:24,fontSize:"14px",padding:"0 8px",dotSize:12}};function en({variant:e="primary",size:t="medium",badgeContent:r,max:o=99,showZero:n=!1,invisible:i=!1,dot:a=!1,overlap:l="rectangular",anchorOrigin:s={vertical:"top",horizontal:"right"},children:d,className:c="",sx:u={},...p}){const h=$o(),f=h[e]||h.primary,g=_o[t]||_o.medium;let x=r;a?x="":"number"==typeof r&&r>o&&(x=o+"+");const b=i||!a&&!n&&(0===r||null==r),v={"& .MuiBadge-badge":{minWidth:a?g.dotSize:g.minW,height:a?g.dotSize:g.height,padding:a?0:g.padding,fontSize:g.fontSize,fontWeight:600,fontFamily:"var(--Body-Font-Family)",lineHeight:1,borderRadius:a?"50%":g.height/2+"px",backgroundColor:f.bg,color:f.text,border:f.border,boxSizing:"border-box",boxShadow:"0 0 0 1px var(--Background)",transition:"transform 0.2s ease, opacity 0.2s ease"},...u};return de(m,{badgeContent:a?"":x,max:o,showZero:n,invisible:b,overlap:l,anchorOrigin:s,variant:a?"dot":"standard",className:"badge-"+e+" "+c,sx:v,...p,children:d})}const tn={1:[[.5,1,1]],2:[[1,2,2],[2,4,4]],3:[[1,2,2],[2,4,4],[3,6,6]],4:[[1,2,2],[2,4,4],[4,8,8],[8,16,16]],5:[[1,2,2],[2,4,4],[4,8,8],[8,16,16],[16,32,32]]},rn=[.2,.17,.15,.13,.11];function on(e){return tn[e].map(([e,t,r],o)=>`${e}px ${t}px ${r}px ${`var(--Dropshadow-Color-${o+1}, rgba(var(--Dropshadow-Color, 20, 20, 20), ${rn[o]}))`}`).join(", ")}const nn=on(1),an=on(2),ln=on(3),sn=on(4),dn=on(5),cn=(e,t)=>0===e?"none":"var(--Effect-Level-"+e+", "+t+")",un={0:"none",1:cn(1,nn),2:cn(2,an),3:cn(3,ln),4:cn(4,sn),5:cn(5,dn)},pn={"black-white":"BlackWhite"},hn=e=>{return pn[e]||(t=e).charAt(0).toUpperCase()+t.slice(1);var t},mn={small:"Sm-",medium:"",large:"Lg-"};function fn(e,t){const r=hn(e),o=(e,t)=>`color-mix(in srgb, rgb(var(${e}, ${t})) calc(var(--Button-Bevel-Opacity, 0.5) * 100%), transparent)`,n="var(--_bevel)",i="calc(-1 * var(--_bevel))",a=mn[t],l=void 0===a?(e,t)=>t:(e,t)=>`var(--${a}Button-${e}, ${t})`;return[`inset ${l("Lowlight-Offset-x",i)} ${l("Lowlight-Offset-y",i)} ${l("Lowlight-Blur-Radius",n)} ${l("Lowlight-Spread",i)} `+o(`--Buttons-${r}-Lowlight`,"0 0 0"),`inset ${l("Highlight-Offset-x",n)} ${l("Highlight-Offset-y",n)} ${l("Highlight-Blur-Radius",n)} ${l("Highlight-Spread",i)} `+o(`--Buttons-${r}-Highlight`,"255 255 255")].join(", ")}const gn={small:"4px 2px",medium:"4px 2px",large:"4px"},xn={small:{avatar:"xxx-small",icon:"small"},medium:{avatar:"xx-small",icon:"medium"},large:{avatar:"small",icon:"large"}};function bn(e,r){if(!t.isValidElement(e))return e;const o=xn[r]||xn.medium;return e.type===qo?t.cloneElement(e,{size:o.avatar,insideButton:!0}):e.type===jo?t.cloneElement(e,{size:o.icon}):e}const vn=["default","primary","secondary","tertiary","neutral","info","success","warning","error"],yn=hn;function Sn(e,t=!1,r=!1,o="medium"){const n=yn(e),i=fn(e,o),a=t?nn:"none";return{backgroundColor:`var(--Buttons-${n}-Button)`,color:`var(--Buttons-${n}-Text)`,border:`var(--Button-Border-Width) solid var(--Buttons-${n}-Border)`,boxShadow:"none"===a?i:`${i}, ${a}`,position:"relative",zIndex:1,"& .MuiTouchRipple-rippleVisible":{color:`var(--Buttons-${n}-Hover)`,zIndex:-1},"&:hover":{backgroundColor:`var(--Buttons-${n}-Hover)`,boxShadow:`${i}, ${t?an:nn}`,...!r&&{transform:"translateY(-1px)"}},"&:active":{backgroundColor:`var(--Buttons-${n}-Pressed)`,boxShadow:i,...!r&&{transform:"translateY(0)"}},"&.Mui-focusVisible":{backgroundColor:`var(--Buttons-${n}-Button)`,outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"},"& .MuiTouchRipple-root":{zIndex:-1},"& .MuiTypography-root":{zIndex:1},"& .MuiButton-icon":{zIndex:1}}}function kn(e,t=!1){return{backgroundColor:"transparent",color:"var(--Text)",border:`var(--Button-Border-Width) solid var(--Buttons-${yn(e)}-Border)`,boxShadow:"none","& .MuiTouchRipple-rippleVisible":{color:"var(--Hover)"},"&:hover":{backgroundColor:"var(--Hover)",boxShadow:"none",...!t&&{transform:"translateY(-1px)"}},"&:active":{backgroundColor:"var(--Pressed)",...!t&&{transform:"translateY(0)"}},"&.Mui-focusVisible":{backgroundColor:"transparent",outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"}}}function Bn(e,t=!1){return{backgroundColor:"transparent",color:e?"var(--Hotlink)":"var(--Quiet)",border:"var(--Button-Border-Width) solid transparent",boxShadow:"none",textDecoration:"none",...e&&{"& .btn-text-content":{textDecoration:"underline"}},"& .MuiTouchRipple-rippleVisible":{color:"var(--Hover)"},"&:hover":{backgroundColor:"var(--Hover)",boxShadow:"none",...!t&&{transform:"translateY(-1px)"},...e?{"& .btn-text-content":{textDecoration:"none"}}:{color:"var(--Text)"}},"&:active":{backgroundColor:"var(--Pressed)",...!t&&{transform:"translateY(0)"},...e?{"& .btn-text-content":{textDecoration:"none"}}:{color:"var(--Text)"}},"&.Mui-focusVisible":{backgroundColor:"transparent",outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px",...e&&{"& .btn-text-content":{textDecoration:"none"}}}}}const wn=/-light$/,Cn=new Set;const Tn={small:"var(--Small-Button-Height)",medium:"var(--Button-Height)",large:"var(--Large-Button-Height)"},In={small:{minHeight:"var(--Small-Button-Height)",minWidth:"var(--Button-Min-Width)",fontSize:"13px","--_height":"var(--Small-Button-Height)"},large:{minHeight:"var(--Large-Button-Height)",minWidth:"var(--Lg-Button-Min-Width, var(--Button-Min-Width))",fontSize:"17px","--_height":"var(--Large-Button-Height)"},medium:{minHeight:"var(--Button-Height)",minWidth:"var(--Button-Min-Width)",fontSize:"15px","--_height":"var(--Button-Height)"}};function An({variant:e="default",size:r="medium",elevated:o=!1,selected:n=!1,fullWidth:i=!1,disabled:a=!1,iconOnly:l=!1,letterNumber:s=!1,avatar:d=!1,swatch:c=!1,swatchColor:u,startIcon:p,endIcon:m,startDecorator:b,endDecorator:v,badge:y=!1,badgeContent:S,badgeVariant:k="error",badgeSize:B,badgeDot:w=!1,badgeMax:C=99,badgeAnchorOrigin:T={vertical:"top",horizontal:"right"},children:I,className:A="",sx:z={},...R}){const E=l||d||c;if("production"!==process.env.NODE_ENV){const e=R["aria-label"]||R["aria-labelledby"]||R.title;E&&!e&&console.error('[OmniDesign] An icon-only <Button> has no accessible name. A screen reader announces it as just "button". Add aria-label="…" describing the ACTION ("Delete item"), not the icon ("trash").'),e&&t.Children.forEach(I,t=>{const r=t?.props?.["aria-label"]||t?.props?.titleAccess;r&&console.error('[OmniDesign] <Button> is labelled "'+e+'" but also contains an icon labelled "'+r+"\". A screen reader reads both. Remove the icon's label — the button owns the name.")})}const P=!E,O=i&&!E&&!s,L=function(e){const t=String(e||"default");if(!wn.test(t))return t;const r=t.replace(wn,"");return"production"===process.env.NODE_ENV||Cn.has(t)||(Cn.add(t),console.warn('[Button] variant="'+t+'" — the -light shape was removed. Rendering variant="'+r+'" (solid). Use a Buttons mode for colour and solid / -outline / ghost / text for shape.')),r}(!d&&!c||"ghost"!==e&&"text"!==e?e:"primary"),M=function(e,t=!1,r=!1,o="medium"){const n={};return vn.forEach(e=>{n[e]=Sn(e,t,r,o),n[`${e}-outline`]=kn(e,r)}),n["black-white"]=Sn("black-white",t,r,o),n["black-white-outline"]=kn("black-white",r),n.danger=Sn("error",t,r,o),n.outline=kn("default",r),n.ghost=Bn(e,r),n.text=Bn(e,r),n}(P,o,n,r),W=M[L]||M.default,D=function({size:e,iconOnly:t,letterNumber:r,avatar:o}){const n=In[e]||In.medium,i=Tn[e]||Tn.medium;if(t)return{height:i,width:i,minWidth:"unset",minHeight:"unset",fontSize:o?"small"===e?"var(--Button-ExtraSmall-Font-Size)":"large"===e?"18px":"14px":"small"===e?"0.875rem":n.fontSize,padding:"0","--_height":i};return r?{...n,minHeight:i,minWidth:i,padding:"0"}:{...n,padding:"large"===e?"0 var(--Lg-Button-Padding)":"0 var(--Button-Padding)"}}({size:r,iconOnly:E,letterNumber:s,avatar:d}),F="small"===r?Fo:No,N=void 0!==b?bn(b,r):void 0,H=void 0!==v?bn(v,r):void 0,V=B||("small"===r?"small":"large"===r?"large":"medium"),Q=ce(ue,{children:[de(f,{styles:{'[class*="btn-"] .MuiButton-startIcon, [class*="btn-"] .MuiButton-icon':{marginLeft:"0px !important",marginRight:"2px !important"},'[class*="btn-"] .MuiButton-endIcon':{marginLeft:"2px !important",marginRight:"0px !important"},'[class*="btn-"] .MuiButton-iconSizeSmall .MuiSvgIcon-root, [class*="btn-"] .MuiButton-iconSizeSmall > *':{fontSize:Vo.small+" !important"},'[class*="btn-"] .MuiButton-iconSizeMedium .MuiSvgIcon-root, [class*="btn-"] .MuiButton-iconSizeMedium > *':{fontSize:Vo.medium+" !important"},'[class*="btn-"] .MuiButton-iconSizeLarge .MuiSvgIcon-root, [class*="btn-"] .MuiButton-iconSizeLarge > *':{fontSize:Vo.large+" !important"}}}),de(g,{size:r,...O&&{fullWidth:!0},disabled:a,startIcon:void 0!==N?N:d?(()=>{if(d&&I){const e=Tn[r]||Tn.medium;return de(x,{sx:{width:e,height:e,backgroundColor:"inherit",color:"inherit",fontSize:"small"===r?"var(--Button-ExtraSmall-Font-Size)":"large"===r?"18px":"14px"},children:I})}return p})():p,endIcon:void 0!==H?H:m,className:`btn-${e} ${A}`,role:"button",sx:{borderRadius:d?"var(--Large-Button-Height)":l||c?"small"===r?"var(--Sm-Button-Icon-Radius, var(--Button-Icon-Radius))":"large"===r?"var(--Lg-Button-Icon-Radius, var(--Button-Icon-Radius))":"var(--Button-Icon-Radius)":"small"===r?"var(--Sm-Button-Radius, var(--Button-Radius))":"large"===r?"var(--Lg-Button-Radius, var(--Button-Radius))":"var(--Button-Radius)",textTransform:"none",fontWeight:"inherit",lineHeight:1,whiteSpace:"nowrap",flexShrink:0,transition:"background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, transform 0.15s ease-in-out","--_bevel":"min(calc(var(--Button-Bevel) * var(--_height) / 100), calc(var(--_height) / 5))",..."small"===r&&{position:"relative","&::before":{content:'""',position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)",width:"100%",height:"100%",minWidth:"var(--Target, 0px)",minHeight:"var(--Target, 0px)"}},...D,...W,"&.MuiButton-root":{padding:D.padding??"0 var(--Sizing-1)"},"& .MuiButton-startIcon":{display:"inherit",color:"inherit",marginLeft:"0px !important",marginRight:d?"0px !important":"2px !important"},...d&&{"& .MuiAvatar-root":{fontSize:"small"===r?"var(--Button-ExtraSmall-Font-Size)":"large"===r?"18px":"14px"}},"& .MuiButton-endIcon":{display:"inherit",color:"inherit",marginLeft:"2px !important",marginRight:"0px !important"},"& .MuiSvgIcon-root":{color:"inherit"},"&:focus-visible, &.Mui-focusVisible":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"},"&.Mui-disabled":{opacity:.6,cursor:"not-allowed",pointerEvents:"none",backgroundColor:W.backgroundColor,color:W.color,border:W.border,boxShadow:"none"},...c&&{border:"var(--Button-Border-Width) solid var(--Border)",padding:"1px",width:Tn[r]||Tn.medium,height:Tn[r]||Tn.medium,minWidth:"unset",minHeight:"unset",boxShadow:"none","--_bevel":"0",backgroundColor:"transparent !important","&:hover":{backgroundColor:"transparent !important",boxShadow:"none"},"&:active":{boxShadow:"none"},"&:hover .btn-swatch-inner":{filter:"brightness(0.9)"}},...O&&{width:"100%"},...z},...R,...c?{style:{backgroundColor:"transparent"}}:{},children:d?null:c?de(h,{className:"btn-swatch-inner",style:{width:"100%",height:"100%",borderRadius:"small"===r?"var(--Sm-Button-Icon-Inner-Radius, calc(var(--Button-Icon-Radius) - 2px))":"large"===r?"var(--Lg-Button-Icon-Inner-Radius, calc(var(--Button-Icon-Radius) - 2px))":"var(--Button-Icon-Inner-Radius, calc(var(--Button-Icon-Radius) - 2px))",...u?{backgroundColor:u}:{}}}):(()=>{if(E)return I;if(s){return de("small"===r?Do:F,{component:"span",sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",padding:"4px",color:"inherit",lineHeight:1,...jr},children:I})}return"string"==typeof I||"number"==typeof I?de(h,{component:"span",className:"btn-text-content",sx:{display:"inline-flex",alignItems:"center",padding:gn[r]||gn.medium},children:de(F,{component:"span",sx:{color:"inherit",...jr},children:I})}):I})()})]});return y?de(en,{variant:k,size:V,badgeContent:S,dot:w,max:C,anchorOrigin:T,showZero:0===S,children:Q}):Q}const zn=["default","primary","secondary","tertiary","neutral","info","success","warning","error","black-white"],Rn=e=>"Default"===e?"var(--Quiet)":"var(--Buttons-"+e+"-Border)";function En(){const e={};return zn.forEach(t=>{e[t]=function(e){const t=hn(e);return{color:t,borderToken:Rn(t),icon:"var(--Buttons-"+t+"-Border)"}}(t)}),e}const Pn=/-(outline|light|solid)$/,On=new Set;function Ln(e){const t=En();return t[function(e){const t=String(e||"default");if(!Pn.test(t))return t;const r=t.replace(Pn,"");return"production"===process.env.NODE_ENV||On.has(t)||(On.add(t),console.warn('[Checkbox] variant="'+t+'" — the -outline/-light/-solid shapes were removed; a Checkbox has one look and `variant` selects colour only. Rendering variant="'+r+'". Update the call site.')),r}(e)]||t.default}const Mn={small:{box:16,icon:12,labelSize:"13px",gap:6,touchTarget:24},medium:{box:20,icon:14,labelSize:"15px",gap:8,touchTarget:24},large:{box:24,icon:18,labelSize:"17px",gap:10,touchTarget:24}};function Wn({size:e,variant:t,checked:r,indeterminate:o}){const n=Ln(t),i=Mn[e]||Mn.medium,a=r||o,l=n.borderToken,s="small"===e?"var(--Sm-Checkbox-Radius, 3.2px)":"large"===e?"var(--Lg-Checkbox-Radius, 4.8px)":"var(--Checkbox-Radius, 4px)";return de(h,{className:"chk-box-icon",sx:{width:i.box,height:i.box,boxSizing:"border-box",borderRadius:s,border:"2px solid "+l,overflow:"hidden",flexShrink:0,transition:"border-color 0.15s ease-in-out"},children:de(h,{sx:{width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:"var(--Background)",color:"var(--Text)",transition:"background-color 0.15s ease-in-out"},children:a&&de(o?fe:he,{sx:{fontSize:i.icon,color:n.icon}})})})}function Dn({size:e,variant:t}){return de(Wn,{size:e,variant:t,checked:!1,indeterminate:!1})}function Fn({size:e,variant:t}){return de(Wn,{size:e,variant:t,checked:!0,indeterminate:!1})}function Nn({size:e,variant:t}){return de(Wn,{size:e,variant:t,checked:!1,indeterminate:!0})}function Hn({variant:e="primary",size:t="medium",label:r,checked:o,defaultChecked:n,indeterminate:i=!1,disabled:a=!1,onChange:l,name:s,value:d,className:c="",sx:u={},"aria-label":p,"aria-labelledby":h,"aria-describedby":m,inputProps:f={},...g}){Ln(e);const x=Mn[t]||Mn.medium,y="small"===t?ao:co,S={...f,...p&&{"aria-label":p},...h&&{"aria-labelledby":h},...m&&{"aria-describedby":m}},k=de(b,{checked:o,defaultChecked:n,indeterminate:i,disabled:a,onChange:l,name:s,value:d,icon:de(Dn,{size:t,variant:e}),checkedIcon:de(Fn,{size:t,variant:e}),indeterminateIcon:de(Nn,{size:t,variant:e}),className:"chk-"+e+" "+c,inputProps:S,disableRipple:!0,sx:{padding:(x.touchTarget-x.box)/2+"px",minWidth:24,minHeight:24,borderRadius:"var(--Checkbox-Radius, 4px)",color:"inherit",transition:"background-color 0.15s ease-in-out","&.Mui-checked, &.MuiCheckbox-indeterminate":{color:"inherit"},"&:hover":{backgroundColor:"transparent"},"&.Mui-focusVisible .chk-box-icon":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"},"&.Mui-disabled":{opacity:.6,cursor:"not-allowed",pointerEvents:"none"},...u},...g});return r?de(v,{control:k,label:de(y,{component:"span",sx:{color:a?"var(--Text-Quiet)":"var(--Text)",fontSize:x.labelSize,lineHeight:1.4,userSelect:"none"},children:r}),disabled:a,sx:{marginLeft:0,marginRight:0,gap:x.gap+"px",alignItems:"center","&.Mui-disabled .MuiTypography-root":{color:"var(--Text-Quiet)",opacity:.6}}}):k}const Vn=["primary","secondary","tertiary","neutral","info","success","warning","error"],Qn=e=>e.charAt(0).toUpperCase()+e.slice(1);function jn(e){return{bg:"var(--Hover)",border:"var(--Buttons-"+Qn(e)+"-Border)",text:"var(--Text)",focusBg:"var(--Hover)"}}function Gn(e){const t=Qn(e);return{bg:"var(--Buttons-"+t+"-Light-Button, var(--Hover))",border:"var(--Buttons-"+t+"-Border)",text:"var(--Text)",focusBg:"var(--Buttons-"+t+"-Light-Button, var(--Hover))"}}const Un={small:{height:"var(--Small-Button-Height)",fontSize:"13px",labelSize:"13px",padding:"4px var(--Input-Padding, 8px)",iconSize:16},medium:{height:"var(--Button-Height)",fontSize:"15px",labelSize:"15px",padding:"4px var(--Input-Padding, 12px)",iconSize:18},large:{height:"var(--Large-Button-Height)",fontSize:"17px",labelSize:"17px",padding:"4px var(--Input-Padding, 16px)",iconSize:20}},Xn={small:{height:"48px",fontSize:"13px",labelSize:"11px",padding:"20px var(--Input-Padding, 12px) 4px",leftPad:12,iconSize:16},medium:{height:"56px",fontSize:"15px",labelSize:"12px",padding:"22px var(--Input-Padding, 14px) 6px",leftPad:14,iconSize:18},large:{height:"64px",fontSize:"17px",labelSize:"14px",padding:"24px var(--Input-Padding, 16px) 6px",leftPad:16,iconSize:20}},Kn={info:ve,success:ge,warning:xe,error:be},qn={info:{border:"var(--Buttons-Info-Border)",icon:"var(--Icons-Info)",text:"var(--Hotlink)"},success:{border:"var(--Buttons-Success-Border)",icon:"var(--Icons-Success)",text:"var(--Text-Success)"},warning:{border:"var(--Buttons-Warning-Border)",icon:"var(--Icons-Warning)",text:"var(--Text-Warning)"},error:{border:"var(--Buttons-Error-Border)",icon:"var(--Icons-Error)",text:"var(--Text-Error)"}};function Jn({variant:e="primary-outline",size:t="medium",label:r,labelPosition:o="standard",placeholder:n,helperText:i,validation:a,validationMessage:l,disabled:s=!1,value:d,defaultValue:c,onChange:u,name:p,type:m="text",multiline:f=!1,rows:g,maxRows:x,startAdornment:b,endAdornment:v,fullWidth:B=!1,className:w="",sx:C={},"aria-label":T,"aria-labelledby":I,"aria-describedby":A,"aria-required":z,"aria-invalid":R,inputProps:E={},...P}){const O=function(){const e={};return Vn.forEach(t=>{e[t+"-outline"]=jn(t),e[t+"-light"]=Gn(t)}),e.outline=jn("primary"),e.light=Gn("primary"),e}(),L=O[e]||O["primary-outline"],M="floating"===o;e.endsWith("-light");const W=M?Xn[t]||Xn.medium:Un[t]||Un.medium,D=e.replace(/-outline$/,"").replace(/-light$/,"");Qn(D);const F="var(--Text)",N=a?qn[a]:null,H=a?Kn[a]:null,V=N?N.border:L.border,Q={...E,...T&&{"aria-label":T},...I&&{"aria-labelledby":I},...A&&{"aria-describedby":A},...z&&{"aria-required":z},...R&&{"aria-invalid":R}};return ce(h,{className:"inp-"+e+" "+w,sx:{width:B?"100%":"auto",...C},children:[(()=>{if(!r||M)return null;return de("small"===t?ao:co,{component:"label",sx:{display:"block",marginBottom:"6px",color:s?"var(--Quiet)":"var(--Text)",fontSize:W.labelSize,fontWeight:500,opacity:s?.6:1},children:r})})(),de(h,{sx:{border:"1px solid "+V,borderRadius:"small"===t?"var(--Sm-Input-Radius, var(--Input-Radius, var(--Style-Border-Radius)))":"large"===t?"var(--Lg-Input-Radius, var(--Input-Radius, var(--Style-Border-Radius)))":"var(--Input-Radius, var(--Style-Border-Radius))",overflow:"hidden",transition:"border-color 0.15s ease-in-out",boxShadow:"none","&:focus-within":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"}},children:de(h,{children:de(y,{value:d,defaultValue:c,onChange:u,name:p,type:m,disabled:s,placeholder:n,multiline:f,rows:g,maxRows:x,fullWidth:!0,label:M?r:void 0,variant:"outlined",size:"small"===t?"small":"medium",inputProps:Q,InputProps:{startAdornment:b?de(S,{position:"start",children:b}):void 0,endAdornment:(()=>{if(v)return de(S,{position:"end",children:v})})()},sx:{"& .MuiOutlinedInput-root":{backgroundColor:"var(--Hover)",color:"var(--Quiet)",fontSize:W.fontSize,minHeight:f?"auto":W.height,padding:0,borderRadius:0,transition:"color 0.15s ease-in-out",...M&&{alignItems:"flex-end"},"& fieldset":{border:"none"},"&.Mui-focused":{color:F},"&:not(.Mui-focused) .MuiOutlinedInput-input:not(:placeholder-shown)":{color:F},"&.Mui-disabled":{opacity:.6,cursor:"not-allowed"},"& input":{padding:W.padding,color:"inherit","&::placeholder":{color:"var(--Quiet)",opacity:1}},"& textarea":{padding:W.padding,color:"inherit","&::placeholder":{color:"var(--Quiet)",opacity:1}},"& .MuiInputAdornment-root":{color:"var(--Quiet)"},...M&&{"& .MuiInputAdornment-positionStart":{marginLeft:(W.leftPad||14)+"px",marginRight:"4px",marginBottom:"8px"},"& .MuiInputAdornment-positionEnd":{marginRight:"8px",marginBottom:"8px"},...b&&{"& input":{paddingLeft:"4px"},"& textarea":{paddingLeft:"4px"}}}},"& .MuiInputLabel-root":{color:"var(--Quiet)",fontSize:W.fontSize,transformOrigin:"top left",transform:"translate("+((W.leftPad||14)+(b?32:0))+"px, 16px) scale(1)","&.MuiInputLabel-shrink":{transform:"translate("+((W.leftPad||14)+(b?32:0))+"px, 6px) scale(0.75)",color:"var(--Quiet)"},"&.Mui-focused":{color:F},"&.Mui-disabled":{color:"var(--Quiet)",opacity:.6}},"& .MuiOutlinedInput-notchedOutline legend":{display:"none"},"& .MuiOutlinedInput-notchedOutline":{top:0},"& .MuiOutlinedInput-root.Mui-focused":{outline:"none"},"& .MuiOutlinedInput-root:focus-within":{outline:"none"}},...P})})}),a&&l?ce(h,{sx:{display:"flex",alignItems:"center",gap:"6px",marginTop:"4px",marginLeft:"2px"},children:[H&&de(H,{sx:{fontSize:W.iconSize,color:N.icon,flexShrink:0}}),de(k,{sx:{color:N.text,fontSize:"small"===t?"11px":"12px",margin:0},children:l})]}):i?de(k,{sx:{color:"var(--Quiet)",fontSize:"small"===t?"11px":"12px",marginTop:"4px",marginLeft:"2px"},children:i}):null]})}const Yn=e=>e.charAt(0).toUpperCase()+e.slice(1),Zn={small:{height:"var(--Small-Button-Height)",fontSize:"13px",padding:"4px 8px",iconSize:16},medium:{height:"var(--Button-Height)",fontSize:"14px",padding:"6px 12px",iconSize:18},large:{height:"var(--Large-Button-Height)",fontSize:"16px",padding:"8px 16px",iconSize:20}},$n={small:{height:48,fontSize:"13px",padding:"20px 12px 4px",labelSize:"11px",leftPad:12},medium:{height:56,fontSize:"14px",padding:"22px 14px 6px",labelSize:"12px",leftPad:14},large:{height:64,fontSize:"16px",padding:"24px 16px 6px",labelSize:"14px",leftPad:16}};function _n({options:e=[],value:a,defaultValue:l="",onChange:s,label:d,labelPosition:c="top",size:u="medium",variant:p="outline",color:m="primary",selectionStyle:f="default",mode:g="standard",placeholder:x="Select…",showDividers:b=!1,showColorLabels:v=!0,startDecoration:y,disabled:S=!1,fullWidth:k=!1,className:B="",sx:w={},...C}){const T="default"===m?"primary":m,I=Yn(T),A="var(--Buttons-"+I+"-Border)",z="default"===m?"var(--Text)":"var(--Text-"+I+")",[R,E]=r(l),[P,O]=r(!1),[L,M]=r(!1),[W,D]=r({top:0,left:0,width:0,direction:"down"}),F=o(null),N=o(null),[H,V]=r(null),[Q,j]=r(null),G=void 0!==a,U=G?a:R,X=e.flatMap(e=>e&&Array.isArray(e.options)?e.options:[e]).find(e=>("string"==typeof e?e:e.value)===U),K=X?"string"==typeof X?X:X.label:"",q=""!==U&&null!=U,J="floating"===c,Y="top"===c,Z="color"===g,$=J?$n[u]||$n.medium:Zn[u]||Zn.medium,_=n(e=>{G||E(e),s?.(e),O(!1),N.current?.focus()},[G,s]),ee=n(()=>{if(!N.current)return{top:0,left:0,width:0};const e=N.current.getBoundingClientRect(),t=window.innerHeight-e.bottom,r=e.top,o=t>=240||t>=r?"down":"up";return{top:"down"===o?e.bottom+4:void 0,bottom:"up"===o?window.innerHeight-e.top+4:void 0,left:e.left,width:e.width,direction:o}},[]),te=n(()=>{S||O(e=>(e||D(ee()),!e))},[S,ee]);i(()=>{if(!P)return;const e=e=>{!F.current||F.current.contains(e.target)||e.target.closest("[data-select-dropdown]")||O(!1)};return document.addEventListener("mousedown",e),()=>document.removeEventListener("mousedown",e)},[P]),i(()=>{if(!P||!N.current)return;const e=N.current.closest("[data-theme]"),t=N.current.closest("[data-surface]");V(e?.getAttribute("data-theme")||null),j(t?.getAttribute("data-surface")||null);const r=()=>D(ee());return window.addEventListener("scroll",r,!0),window.addEventListener("resize",r),()=>{window.removeEventListener("scroll",r,!0),window.removeEventListener("resize",r)}},[P,ee]);const re=o(null),oe=n(e=>{const t=re.current;if(!t)return;const r=t.querySelectorAll('[role="option"]');if(!r.length)return;const o=t.querySelector('[role="option"]:focus');let n=Array.prototype.indexOf.call(r,o);n="down"===e?n<r.length-1?n+1:0:n>0?n-1:r.length-1,r[n].focus()},[]);i(()=>{P&&requestAnimationFrame(()=>{const e=re.current;if(!e)return;const t=e.querySelector('[aria-selected="true"]'),r=e.querySelector('[role="option"]');(t||r)?.focus()})},[P]);const ne=P?ye.createPortal(de(h,{ref:re,"data-select-dropdown":!0,"data-theme":H||void 0,role:"listbox","aria-label":d||"Options",sx:{position:"fixed",top:W.top??"unset",bottom:W.bottom??"unset",left:W.left,width:W.width+"px",backgroundColor:"var(--Hover)",border:"1px solid var(--Buttons-Default-Border)",borderRadius:"var(--Dropdown-Frame-Radius, var(--Input-Radius, var(--Style-Border-Radius, 4px)))",boxShadow:"none",zIndex:99999,maxHeight:"240px",overflowY:"auto",py:.5},children:(()=>{const r=(e,r,o)=>{const n="string"==typeof e?e:e.value,i="string"==typeof e?e:e.label,a="object"==typeof e?e.color:null,l=n===U,s=function(e,t,r){const o=Yn(r||"default");return t?"solid"===e?{backgroundColor:"var(--Buttons-"+o+"-Button)",color:"var(--Buttons-"+o+"-Text)",border:"1px solid var(--Buttons-"+o+"-Border)",fontWeight:600}:"light"===e?{backgroundColor:"var(--Buttons-"+o+"-Light-Button)",color:"var(--Buttons-"+o+"-Light-Text)",border:"1px solid var(--Buttons-"+o+"-Light-Border)",fontWeight:600}:{backgroundColor:"var(--Buttons-"+o+"-Button)",color:"var(--Buttons-"+o+"-Text)",border:"1px solid var(--Buttons-"+o+"-Border)",fontWeight:600}:{color:"var(--Text)",backgroundColor:"transparent",border:"1px solid transparent"}}(f,l,T),d=r===o-1;return ce(t.Fragment,{children:[ce(h,{role:"option",tabIndex:-1,"aria-selected":l,"aria-label":Z&&!v?i:void 0,onClick:()=>_(n),onKeyDown:e=>((e,t)=>{if("Enter"===e.key||" "===e.key)return e.preventDefault(),void _(t);"ArrowDown"===e.key&&(e.preventDefault(),oe("down")),"ArrowUp"===e.key&&(e.preventDefault(),oe("up")),"Escape"===e.key&&(O(!1),N.current?.focus())})(e,n),sx:{display:"flex",alignItems:"center",gap:1,px:1.5,py:0,mx:.5,my:"1px",minHeight:$.height,cursor:"pointer",fontSize:$.fontSize,fontFamily:"inherit",borderRadius:"4px",outline:"none",...s,transition:"background-color 0.1s ease","&:hover":l?{}:{backgroundColor:"var(--Buttons-"+I+"-Hover)",color:"var(--Buttons-"+I+"-Text)"},"&:active":l?{}:{backgroundColor:"var(--Buttons-"+I+"-Pressed)",color:"var(--Buttons-"+I+"-Text)"},"&:focus-visible":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"}},children:[Z&&a&&de(h,{sx:{height:"calc("+$.height+" - 8px)",width:"calc("+$.height+" - 8px)",borderRadius:"var(--Input-Swatch-Radius, var(--Button-Radius))",backgroundColor:a,border:"1px solid "+(l?"var(--Buttons-"+I+"-Border)":"var(--Border)"),flexShrink:0}}),(!Z||v)&&de(ao,{style:{flex:1,color:"inherit",fontWeight:"inherit"},children:i}),l&&de(jo,{size:"small",sx:{opacity:.6,flexShrink:0},children:de(he,{})})]}),b&&!d&&de(h,{"aria-hidden":"true",sx:{height:"1px",backgroundColor:"var(--Border)",mx:1,my:.25}})]},n)};return e.map((o,n)=>{if(o&&Array.isArray(o.options)){const e=o.options;return ce(t.Fragment,{children:[de(h,{role:"presentation",sx:{px:1.5,pt:0===n?.75:1.25,pb:.5,fontSize:"11px",fontFamily:"inherit",fontWeight:700,letterSpacing:"0.06em",textTransform:"uppercase",color:"var(--Text-Quiet)"},children:o.label}),e.map((t,o)=>r(t,o,e.length))]},"group-"+(o.label||n))}return r(o,n,e.length)})})()}),document.body):null;return ce(h,{ref:F,className:"select-wrapper select-"+u+" select-label-"+c+" select-style-"+f+" select-variant-"+p+(P?" select-open":"")+(S?" select-disabled":"")+(B?" "+B:""),sx:{position:"relative",width:k?"100%":"auto",display:"inline-block",fontFamily:"inherit",...w},...C,children:[Y&&d&&de("small"===u?ao:co,{component:"label",style:{display:"block",marginBottom:"6px",color:S?"var(--Quiet)":"var(--Text)",fontWeight:500,opacity:S?.6:1},children:d}),de(h,{sx:{border:"1px solid "+A,borderRadius:"var(--Input-Radius, var(--Style-Border-Radius))",overflow:"hidden",transition:"border-color 0.15s ease",boxShadow:"none","&:focus-within":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"}},children:de(h,{children:ce(h,{ref:N,component:"button",type:"button",role:"combobox","aria-expanded":P,"aria-haspopup":"listbox","aria-label":d||x,tabIndex:S?-1:0,onClick:te,onKeyDown:e=>"Escape"===e.key?(O(!1),void N.current?.focus()):"Enter"===e.key||" "===e.key?(e.preventDefault(),void te()):P||"ArrowDown"!==e.key&&"ArrowUp"!==e.key?(P&&"ArrowDown"===e.key&&(e.preventDefault(),oe("down")),void(P&&"ArrowUp"===e.key&&(e.preventDefault(),oe("up")))):(e.preventDefault(),void O(!0)),onFocus:()=>M(!0),onBlur:()=>M(!1),sx:{display:"flex",alignItems:"center",gap:1,width:"100%",minWidth:140,height:$.height,padding:$.padding,backgroundColor:"var(--Hover)",border:"none",borderRadius:0,color:q||P?z:"var(--Quiet)",fontSize:$.fontSize,fontFamily:"inherit",cursor:S?"not-allowed":"pointer",opacity:S?.5:1,outline:"none",textAlign:"left",position:"relative",transition:"color 0.15s ease"},children:[y&&de(h,{sx:{display:"flex",alignItems:"center",flexShrink:0,color:"var(--Text-Quiet)"},children:y}),J&&d&&de(h,{sx:{position:"absolute",top:q||P?"6px":"50%",left:($.leftPad||14)+(y?32:0)+"px",transform:q||P?"scale(0.75)":"translateY(-50%)",transformOrigin:"top left",color:P?z:"var(--Quiet)",fontSize:$.fontSize,fontWeight:400,pointerEvents:"none",transition:"top 0.15s ease, transform 0.15s ease, color 0.15s ease"},children:d}),de(h,{sx:{flex:1,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",...J&&{mt:q||P?"8px":0}},children:Z&&q?ce(h,{sx:{display:"flex",alignItems:"center",gap:1},children:[de(h,{sx:{height:"calc("+$.height+" - 8px)",width:"calc("+$.height+" - 8px)",borderRadius:"var(--Input-Swatch-Radius, var(--Button-Radius))",backgroundColor:X&&"string"!=typeof X&&X.color||"transparent",border:"1px solid var(--Border)",flexShrink:0}}),v&&de(ao,{style:{color:"inherit",padding:0},children:K})]}):de(ao,{style:{color:"inherit",padding:0},children:q?K:J&&d?"":x})}),de(Se,{sx:{fontSize:($.iconSize||18)+"px",color:"var(--Text-Quiet)",transform:P?"rotate(180deg)":"rotate(0deg)",transition:"transform 0.2s ease",flexShrink:0}})]})})}),ne]})}const ei={default:"Default",primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info",success:"Success",warning:"Warning",error:"Error"},ti={default:"Default",primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info",success:"Success",warning:"Warning",error:"Error"},ri={default:"Default",primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info",success:"Success",warning:"Warning",error:"Error"},oi={small:{px:"10px",py:"6px",fontSize:"13px",iconSize:"16px",gap:"4px",indicatorThickness:"3px",minHeight:"32px"},medium:{px:"14px",py:"8px",fontSize:"14px",iconSize:"18px",gap:"6px",indicatorThickness:"3px",minHeight:"40px"},large:{px:"18px",py:"10px",fontSize:"16px",iconSize:"20px",gap:"8px",indicatorThickness:"3px",minHeight:"48px"}},ni=s({value:0,setValue:()=>{},variant:"standard",color:"primary",size:"medium",orientation:"horizontal",scrollable:!1,tabsId:""}),ii=()=>l(ni);function ai({children:e,defaultValue:t=0,value:o,onChange:i,variant:l="standard",color:s="primary",size:d="medium",orientation:c="horizontal",scrollable:u=!1,className:p="",sx:m={},...f}){const[g,x]=r(t),b=void 0!==o,v=b?o:g,y=a(),S=n(e=>{b||x(e),i?.(e)},[b,i]);return de(ni.Provider,{value:{value:v,setValue:S,variant:l,color:s,size:d,orientation:c,scrollable:u,tabsId:y},children:de(h,{className:"tabs tabs-"+c+" tabs-"+d+" tabs-"+l+("standard"!==l?" tabs-"+s:"")+(u?" tabs-scrollable":"")+" "+p,sx:{display:"flex",flexDirection:"horizontal"===c?"column":"row",width:"100%",overflow:"hidden",...m},...f,children:e})})}function li({children:e,rounded:a=!1,className:l="",sx:s={},...d}){const{variant:c,color:u,size:p,orientation:m,scrollable:f,tabsId:g}=ii(),x=o(null),b=o(null),[v,y]=r(!1),[S,k]=r(!1),B="horizontal"===m,w="standard"===c,C="light"===c,T="dark"===c,I=w?void 0:"solid"===c?ei[u]:C?ti[u]:T?ri[u]:void 0,A=w?void 0:T?"Surface-Dimmest":C?"Surface-Brightest":"Surface",z=n(()=>{const e=b.current;e&&f&&B&&(y(e.scrollLeft>1),k(e.scrollLeft<e.scrollWidth-e.clientWidth-1))},[f,B]);i(()=>{z();const e=b.current;if(!e||!f)return;e.addEventListener("scroll",z,{passive:!0});const t=new ResizeObserver(z);return t.observe(e),()=>{e.removeEventListener("scroll",z),t.disconnect()}},[f,z]);const R=e=>{const t=b.current;if(!t)return;const r=.6*t.clientWidth;t.scrollBy({left:e*r,behavior:"smooth"})},E={display:"inline-flex",alignItems:"center",justifyContent:"center",width:"28px",minWidth:"28px",border:"none",backgroundColor:"transparent",color:"var(--Text-Quiet)",cursor:"pointer",fontSize:"16px",fontFamily:"inherit",lineHeight:1,flexShrink:0,transition:"color 0.15s ease, background-color 0.15s ease","&:hover":{color:"var(--Text)",backgroundColor:"var(--Hover)"},"&:active":{backgroundColor:"var(--Pressed)"},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"-3px"},"&:disabled":{opacity:.3,cursor:"default","&:hover":{backgroundColor:"transparent",color:"var(--Text-Quiet)"}}},P=t.Children.toArray(e).filter(t.isValidElement).map((e,r)=>t.cloneElement(e,{_index:r,key:e.key||r}));return ce(h,{ref:x,"data-theme":I||void 0,"data-surface":A||void 0,className:"tab-list tab-list-"+c+" tab-list-"+p+" tab-list-"+m+(f?" tab-list-scrollable":"")+" "+l,onKeyDown:e=>{const t=f?b.current:x.current,r=t?.querySelectorAll('[role="tab"]:not([aria-disabled="true"])');if(!r?.length)return;const o=Array.from(r).indexOf(document.activeElement);if(o<0)return;const n=B?"ArrowRight":"ArrowDown",i=B?"ArrowLeft":"ArrowUp";if(e.key===n){e.preventDefault();const t=r[(o+1)%r.length];t.focus(),f&&t.scrollIntoView({block:"nearest",inline:"nearest",behavior:"smooth"})}else if(e.key===i){e.preventDefault();const t=r[(o-1+r.length)%r.length];t.focus(),f&&t.scrollIntoView({block:"nearest",inline:"nearest",behavior:"smooth"})}else"Home"===e.key?(e.preventDefault(),r[0].focus(),f&&r[0].scrollIntoView({block:"nearest",inline:"nearest",behavior:"smooth"})):"End"===e.key&&(e.preventDefault(),r[r.length-1].focus(),f&&r[r.length-1].scrollIntoView({block:"nearest",inline:"nearest",behavior:"smooth"}))},sx:{display:"flex",flexDirection:B?"row":"column",gap:0,position:"relative",backgroundColor:"var(--Background)",padding:"4px",overflow:"hidden",borderRadius:a?"var(--Style-Border-Radius)":0,...s},...d,children:[f&&B&&de(h,{component:"button","aria-label":"Scroll tabs left",onClick:()=>R(-1),disabled:!v,className:"tab-list-scroll-btn tab-list-scroll-btn-left",sx:E,children:"‹"}),de(h,f&&B?{ref:b,role:"tablist","aria-orientation":m,className:"tab-list-scroll-container",sx:{display:"flex",flexDirection:"row",overflowX:"auto",scrollbarWidth:"none","&::-webkit-scrollbar":{display:"none"},flex:1,minWidth:0},children:P}:{ref:b,role:"tablist","aria-orientation":m,sx:{display:"flex",flexDirection:B?"row":"column",flex:1},children:P}),f&&B&&de(h,{component:"button","aria-label":"Scroll tabs right",onClick:()=>R(1),disabled:!S,className:"tab-list-scroll-btn tab-list-scroll-btn-right",sx:E,children:"›"})]})}function si({children:e,value:t,_index:r=0,disabled:o=!1,startDecorator:n,endDecorator:i,iconOnly:a=!1,className:l="",sx:s={},...d}){const{value:c,setValue:u,variant:p,color:m,size:f,orientation:g,tabsId:x}=ii(),b=oi[f]||oi.medium,v="horizontal"===g,y="standard"===p,S="light"===p,k="dark"===p,B=void 0!==t?t:r,w=c===B,C=y?"var(--Buttons-"+({default:"Default",primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info",success:"Success",warning:"Warning",error:"Error"}[m]||"Default")+"-Border)":"var(--Text)";return ce(h,{component:"button",role:"tab",id:"tab-"+x+"-"+B,"data-theme":(y?void 0:"solid"===p?ei[m]:S?ti[m]:k?ri[m]:void 0)||void 0,"data-surface":(y?void 0:k?"Surface-Dimmest":S?"Surface-Brightest":"Surface")||void 0,"aria-selected":w,"aria-controls":"tabpanel-"+x+"-"+B,"aria-disabled":o||void 0,tabIndex:w?0:-1,onClick:()=>{o||u(B)},className:"tab tab-"+f+(w?" tab-selected":"")+(o?" tab-disabled":"")+(a?" tab-icon-only":"")+" "+l,sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",gap:b.gap,padding:a?"calc("+b.py+" + 4px) "+b.py+" "+b.py:"calc("+b.py+" + 4px) "+b.px+" "+b.py+" "+b.px,minHeight:b.minHeight,fontSize:b.fontSize,fontFamily:"inherit",fontWeight:500,lineHeight:1.3,color:w?"var(--Text)":"var(--Quiet)",backgroundColor:"transparent",border:"none",borderBottom:v?w?b.indicatorThickness+" solid "+C:b.indicatorThickness+" solid transparent":"none",borderRight:v?"none":w?b.indicatorThickness+" solid "+C:b.indicatorThickness+" solid transparent",cursor:o?"not-allowed":"pointer",opacity:o?.5:1,position:"relative",outline:"none",transition:"color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease",flexShrink:0,whiteSpace:"nowrap",...!o&&{"&:hover":{backgroundColor:"var(--Hover)"},"&:active":{backgroundColor:"var(--Pressed)"},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"-3px"}},...s},...d,children:[n&&de(h,{className:"tab-start-decorator",sx:{display:"inline-flex",fontSize:b.iconSize,lineHeight:1,flexShrink:0},children:n}),!a&&e&&de("small"===f?bo:ao,{style:{color:"inherit",fontWeight:"inherit"},children:e}),i&&de(h,{className:"tab-end-decorator",sx:{display:"inline-flex",fontSize:b.iconSize,lineHeight:1,flexShrink:0},children:i})]})}function di({children:e,value:t,className:r="",sx:o={},...n}){const{value:i,size:a,tabsId:l}=ii();return i===t?de(h,{role:"tabpanel",id:"tabpanel-"+l+"-"+t,"aria-labelledby":"tab-"+l+"-"+t,className:"tab-panel tab-panel-"+a+" "+r,sx:{paddingTop:"16px",fontSize:(oi[a]||oi.medium).fontSize,fontFamily:"inherit",color:"var(--Text)",...o},...n,children:e}):null}const ci=t.forwardRef(function({theme:e=null,surface:t="Surface",children:r,minHeight:o=160,sx:n={}},i){return de(h,{ref:i,"data-theme":e||void 0,"data-surface":t,sx:{p:4,display:"flex",alignItems:"center",justifyContent:"center",minHeight:o,backgroundColor:"var(--Background)",borderBottom:"1px solid var(--Border)",...n},children:r})}),ui="__null__",pi=[{label:"Default",value:ui},{label:"Primary",value:"Primary"},{label:"Secondary",value:"Secondary"},{label:"Tertiary",value:"Tertiary"},{label:"Neutral",value:"Neutral"},{label:"Info",value:"Info"},{label:"Success",value:"Success"},{label:"Warning",value:"Warning"},{label:"Error",value:"Error"}],hi=["Surface-Dimmest","Surface-Dim","Surface","Surface-Bright","Surface-Brightest","Container","Container-Highest","Container-High","Container-Low","Container-Lowest"];function mi({theme:e=null,onThemeChange:t,surface:r="Surface",onSurfaceChange:o,surfaces:n=hi,size:i="small"}){const a=n.map(e=>({value:e,label:e}));return ce(B,{direction:"row",spacing:1,sx:{alignItems:"center"},children:[de(h,{sx:{width:160},children:de(_n,{options:pi,value:e??ui,onChange:e=>t?.(e===ui?null:e),labelPosition:"none",size:i,variant:"outline",color:"default","aria-label":"Background theme",fullWidth:!0})}),de(h,{sx:{width:180},children:de(_n,{options:a,value:r,onChange:e=>o?.(e),labelPosition:"none",size:i,variant:"outline",color:"default","aria-label":"Surface",fullWidth:!0})})]})}function fi(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var gi,xi={exports:{}},bi={exports:{}},vi={};var yi,Si,ki,Bi,wi,Ci,Ti,Ii,Ai,zi,Ri,Ei,Pi,Oi,Li={};
1
+ import*as e from"react";import t,{useState as r,useId as n,useRef as o,useCallback as i,useEffect as a,useContext as l,createContext as s,useMemo as d,forwardRef as c,Children as u,isValidElement as p}from"react";import{Box as h,Badge as m,GlobalStyles as f,Button as g,Avatar as x,Checkbox as b,FormControlLabel as v,TextField as y,InputAdornment as S,FormHelperText as k,Stack as B,Tooltip as w,IconButton as C,Typography as T,Grid as I,Alert as A,Switch as z,ToggleButton as R,ToggleButtonGroup as E,Radio as P,FormControl as L,FormLabel as M,RadioGroup as W,Slider as O,Chip as D,Container as F,Tabs as N,Tab as H,Paper as V,Dialog as Q,DialogTitle as j,DialogContent as G,DialogContentText as U,DialogActions as X,Zoom as $,Grow as K,Fade as q,Slide as Y,AppBar as J,Toolbar as Z,List as _,ListItem as ee,ListItemButton as te,ListItemIcon as re,ListItemText as ne,Collapse as oe,Divider as ie,Drawer as ae,useTheme as le,useMediaQuery as se}from"@mui/material";import{jsx as de,jsxs as ce,Fragment as ue}from"react/jsx-runtime";import pe from"@mui/icons-material/ContentCopy";import he from"@mui/icons-material/Check";import me from"@mui/icons-material/Person";import fe from"@mui/icons-material/Remove";import ge from"@mui/icons-material/CheckCircleOutline";import xe from"@mui/icons-material/WarningAmber";import be from"@mui/icons-material/ErrorOutline";import ve from"@mui/icons-material/InfoOutlined";import ye from"react-dom";import Se from"@mui/icons-material/ExpandMore";import ke from"@mui/icons-material/Favorite";import Be from"@mui/icons-material/Home";import we from"@mui/icons-material/Delete";import Ce from"@mui/icons-material/Settings";import Te from"@mui/icons-material/Search";import Ie from"@mui/icons-material/Star";import Ae from"@mui/icons-material/Notifications";import ze from"@mui/icons-material/Visibility";import Re from"@mui/icons-material/ShoppingCart";import Ee from"@mui/icons-material/Lock";import Pe from"@mui/icons-material/Info";import Le from"@mui/icons-material/HomeOutlined";import Me from"@mui/icons-material/FavoriteBorderOutlined";import We from"@mui/icons-material/DeleteOutlined";import Oe from"@mui/icons-material/SettingsOutlined";import De from"@mui/icons-material/StarOutline";import Fe from"@mui/icons-material/PersonOutlined";import Ne from"@mui/icons-material/NotificationsOutlined";import He from"@mui/icons-material/VisibilityOutlined";import Ve from"@mui/icons-material/ShoppingCartOutlined";import Qe from"@mui/icons-material/LockOutlined";import je from"@mui/icons-material/HomeRounded";import Ge from"@mui/icons-material/FavoriteRounded";import Ue from"@mui/icons-material/DeleteRounded";import Xe from"@mui/icons-material/SettingsRounded";import $e from"@mui/icons-material/SearchRounded";import Ke from"@mui/icons-material/StarRounded";import qe from"@mui/icons-material/PersonRounded";import Ye from"@mui/icons-material/NotificationsRounded";import Je from"@mui/icons-material/VisibilityRounded";import Ze from"@mui/icons-material/ShoppingCartRounded";import _e from"@mui/icons-material/LockRounded";import et from"@mui/icons-material/InfoRounded";import tt from"@mui/icons-material/HomeTwoTone";import rt from"@mui/icons-material/FavoriteTwoTone";import nt from"@mui/icons-material/DeleteTwoTone";import ot from"@mui/icons-material/SettingsTwoTone";import it from"@mui/icons-material/SearchTwoTone";import at from"@mui/icons-material/StarTwoTone";import lt from"@mui/icons-material/PersonTwoTone";import st from"@mui/icons-material/NotificationsTwoTone";import dt from"@mui/icons-material/VisibilityTwoTone";import ct from"@mui/icons-material/ShoppingCartTwoTone";import ut from"@mui/icons-material/LockTwoTone";import pt from"@mui/icons-material/InfoTwoTone";import ht from"@mui/icons-material/HomeSharp";import mt from"@mui/icons-material/FavoriteSharp";import ft from"@mui/icons-material/DeleteSharp";import gt from"@mui/icons-material/SettingsSharp";import xt from"@mui/icons-material/SearchSharp";import bt from"@mui/icons-material/StarSharp";import vt from"@mui/icons-material/PersonSharp";import yt from"@mui/icons-material/NotificationsSharp";import St from"@mui/icons-material/VisibilitySharp";import kt from"@mui/icons-material/ShoppingCartSharp";import Bt from"@mui/icons-material/LockSharp";import wt from"@mui/icons-material/InfoSharp";import Ct from"@mui/icons-material/Code";import Tt from"@mui/icons-material/GridView";import It from"@mui/icons-material/Computer";import At from"@mui/icons-material/Add";import*as zt from"@mui/icons-material";import{Settings as Rt,Close as Et}from"@mui/icons-material";import Pt from"@mui/icons-material/Menu";import Lt from"@mui/icons-material/Close";import Mt from"@mui/icons-material/FormatBold";import Wt from"@mui/icons-material/FormatItalic";import Ot from"@mui/icons-material/FormatUnderlined";import Dt from"@mui/icons-material/FormatAlignLeft";import Ft from"@mui/icons-material/FormatAlignCenter";import Nt from"@mui/icons-material/KeyboardArrowUp";import Ht from"@mui/icons-material/KeyboardArrowDown";import"@mui/icons-material/FormatAlignRight";import"@mui/icons-material/ViewList";import"@mui/icons-material/ViewModule";import Vt from"@mui/material/CircularProgress";import"@mui/icons-material/StarBorder";import Qt from"@mui/icons-material/StarHalf";import jt from"@mui/icons-material/Cancel";import Gt from"@mui/icons-material/ExpandLess";import Ut from"@mui/icons-material/Image";import Xt from"@mui/icons-material/ChevronLeft";import $t from"@mui/icons-material/ChevronRight";import Kt from"@mui/icons-material/FirstPage";import qt from"@mui/icons-material/LastPage";import Yt from"@mui/icons-material/Explore";import Jt from"@mui/icons-material/Radio";import Zt from"@mui/icons-material/LibraryMusic";import _t from"@mui/icons-material/Bookmark";import er from"@mui/icons-material/Edit";import tr from"@mui/icons-material/Share";import"@mui/icons-material/FavoriteBorder";import"@mui/icons-material/DeleteOutline";import{useThemeProps as rr,styled as nr,alpha as or}from"@mui/material/styles";import ir from"@mui/material/Collapse";import ar from"@mui/material/Checkbox";import{createSvgIcon as lr}from"@mui/material/utils";import sr from"@mui/icons-material/CloudUpload";import dr from"@mui/icons-material/Mail";import"@mui/icons-material/Inbox";import cr from"@mui/icons-material/Folder";import"@mui/icons-material/MoreVert";import"@mui/icons-material/ImageOutlined";import ur from"@mui/icons-material/ArrowBack";import pr from"@mui/icons-material/AccountCircle";import hr from"@mui/icons-material/Twitter";import mr from"@mui/icons-material/GitHub";import fr from"@mui/icons-material/LinkedIn";import gr from"@mui/icons-material/Help";import xr from"@mui/icons-material/FolderOpen";import br from"@mui/icons-material/InsertDriveFile";import vr from"@mui/icons-material/PictureAsPdf";import yr from"@mui/icons-material/VideoLibrary";const Sr=e=>`var(--${e}-Font-Family)`,kr="var(--Font-Family-Display, var(--Font-Family-Header, var(--Header-Font-Family)))",Br="var(--Font-Family-Eyebrow, var(--Decorative-Font-Family))",wr=(e,t)=>`var(--${e}-Font-Family, ${t})`,Cr="var(--Font-Variation-Header, normal)",Tr=(e,t)=>`var(--Eyebrow-${e}-${t}, var(--Overline-${e}-${t}))`,Ir=e=>Tr(e,"Font-Size"),Ar=e=>Tr(e,"Font-Weight"),zr=e=>Tr(e,"Line-Height"),Rr=e=>Tr(e,"Letter-Spacing"),Er=e=>`var(--${e}-Font-Size)`,Pr=e=>`var(--${e}-Font-Weight)`,Lr=e=>`calc(var(--${e}-Line-Height) * var(--Cognitive-Multiplier, 1))`,Mr=e=>`var(--${e}-Line-Height)`,Wr=e=>`var(--${e}-Letter-Spacing)`,Or={"display-large":{component:"h1",fontFamily:wr("Display-Large",kr),fontSize:Er("Display-Large"),fontWeight:Pr("Display-Large"),lineHeight:Lr("Display-Large"),letterSpacing:Wr("Display-Large"),defaultColor:"header",defaultWidth:"fill"},"display-medium":{component:"h1",fontFamily:wr("Display-Medium",kr),fontSize:Er("Display-Medium"),fontWeight:Pr("Display-Medium"),lineHeight:Lr("Display-Medium"),letterSpacing:Wr("Display-Medium"),defaultColor:"header",defaultWidth:"fill"},"display-small":{component:"h2",fontFamily:wr("Display-Small",kr),fontSize:Er("Display-Small"),fontWeight:Pr("Display-Small"),lineHeight:Lr("Display-Small"),letterSpacing:Wr("Display-Small"),defaultColor:"header",defaultWidth:"fill"},h1:{component:"h1",fontFamily:Sr("Header"),fontVariationSettings:Cr,fontSize:Er("H1"),fontWeight:Pr("H1"),lineHeight:Lr("H1"),letterSpacing:Wr("H1"),defaultColor:"header",defaultWidth:"fill"},h2:{component:"h2",fontFamily:Sr("Header"),fontVariationSettings:Cr,fontSize:Er("H2"),fontWeight:Pr("H2"),lineHeight:Lr("H2"),letterSpacing:Wr("H2"),defaultColor:"header",defaultWidth:"fill"},h3:{component:"h3",fontFamily:Sr("Header"),fontVariationSettings:Cr,fontSize:Er("H3"),fontWeight:Pr("H3"),lineHeight:Lr("H3"),letterSpacing:Wr("H3"),defaultColor:"header",defaultWidth:"fill"},h4:{component:"h4",fontFamily:Sr("Header"),fontVariationSettings:Cr,fontSize:Er("H4"),fontWeight:Pr("H4"),lineHeight:Lr("H4"),letterSpacing:Wr("H4"),defaultColor:"standard",defaultWidth:"fill"},h5:{component:"h5",fontFamily:Sr("Header"),fontVariationSettings:Cr,fontSize:Er("H5"),fontWeight:Pr("H5"),lineHeight:Lr("H5"),letterSpacing:Wr("H5"),defaultColor:"standard",defaultWidth:"fill"},h6:{component:"h6",fontFamily:Sr("Header"),fontVariationSettings:Cr,fontSize:Er("H6"),fontWeight:Pr("H6"),lineHeight:Lr("H6"),letterSpacing:Wr("H6"),defaultColor:"standard",defaultWidth:"fill"},"subtitle-large":{component:"p",fontFamily:Sr("Body"),fontSize:Er("Subtitle-Large"),fontWeight:Pr("Subtitle-Large"),lineHeight:Lr("Subtitle-Large"),letterSpacing:Wr("Subtitle-Large"),defaultColor:"header",defaultWidth:"fill"},subtitle:{component:"p",fontFamily:Sr("Body"),fontSize:Er("Subtitle-Medium"),fontWeight:Pr("Subtitle-Medium"),lineHeight:Lr("Subtitle-Medium"),letterSpacing:Wr("Subtitle-Medium"),defaultColor:"header",defaultWidth:"fill"},"subtitle-small":{component:"p",fontFamily:Sr("Body"),fontSize:Er("Subtitle-Small"),fontWeight:Pr("Subtitle-Small"),lineHeight:Lr("Subtitle-Small"),letterSpacing:Wr("Subtitle-Small"),defaultColor:"header",defaultWidth:"fill"},"body-small":{component:"p",fontFamily:Sr("Body"),fontSize:Er("Body-Small"),fontWeight:Pr("Body-Small"),lineHeight:Lr("Body-Small"),letterSpacing:Wr("Body-Small"),defaultColor:"standard",defaultWidth:"fill"},"body-small-semibold":{component:"p",fontFamily:Sr("Body"),fontSize:Er("Body-Small"),fontWeight:Pr("Body-Small-Semibold"),lineHeight:Lr("Body-Small"),letterSpacing:Wr("Body-Small"),defaultColor:"standard",defaultWidth:"fill"},body:{component:"p",fontFamily:Sr("Body"),fontSize:Er("Body-Medium"),fontWeight:Pr("Body-Medium"),lineHeight:Lr("Body-Medium"),letterSpacing:Wr("Body-Medium"),defaultColor:"standard",defaultWidth:"fill"},"body-medium":{component:"p",fontFamily:Sr("Body"),fontSize:Er("Body-Medium"),fontWeight:Pr("Body-Medium"),lineHeight:Lr("Body-Medium"),letterSpacing:Wr("Body-Medium"),defaultColor:"standard",defaultWidth:"fill"},"body-semibold":{component:"p",fontFamily:Sr("Body"),fontSize:Er("Body-Medium"),fontWeight:Pr("Body-Medium-Semibold"),lineHeight:Lr("Body-Medium"),letterSpacing:Wr("Body-Medium"),defaultColor:"standard",defaultWidth:"fill"},"body-medium-semibold":{component:"p",fontFamily:Sr("Body"),fontSize:Er("Body-Medium"),fontWeight:Pr("Body-Medium-Semibold"),lineHeight:Lr("Body-Medium"),letterSpacing:Wr("Body-Medium"),defaultColor:"standard",defaultWidth:"fill"},"body-large":{component:"p",fontFamily:Sr("Body"),fontSize:Er("Body-Large"),fontWeight:Pr("Body-Large"),lineHeight:Lr("Body-Large"),letterSpacing:Wr("Body-Large"),defaultColor:"standard",defaultWidth:"fill"},"body-large-semibold":{component:"p",fontFamily:Sr("Body"),fontSize:Er("Body-Large"),fontWeight:Pr("Body-Large-Semibold"),lineHeight:Lr("Body-Large"),letterSpacing:Wr("Body-Large"),defaultColor:"standard",defaultWidth:"fill"},caption:{component:"span",fontFamily:Sr("Body"),fontSize:Er("Caption"),fontWeight:Pr("Caption"),lineHeight:Lr("Caption"),letterSpacing:Wr("Caption"),defaultColor:"quiet",defaultWidth:"hug"},"caption-bold":{component:"span",fontFamily:Sr("Body"),fontSize:Er("Caption"),fontWeight:Pr("Caption-Bold"),lineHeight:Lr("Caption"),letterSpacing:Wr("Caption"),defaultColor:"quiet",defaultWidth:"hug"},"label-extra-small":{component:"label",fontFamily:Sr("Body"),fontSize:Er("Label-ExtraSmall"),fontWeight:Pr("Label-ExtraSmall"),lineHeight:Mr("Label-ExtraSmall"),letterSpacing:Wr("Label-ExtraSmall"),defaultColor:"standard",defaultWidth:"hug"},"label-small":{component:"label",fontFamily:Sr("Body"),fontSize:Er("Label-Small"),fontWeight:Pr("Label-Small"),lineHeight:Mr("Label-Small"),letterSpacing:Wr("Label-Small"),defaultColor:"standard",defaultWidth:"hug"},label:{component:"label",fontFamily:Sr("Body"),fontSize:Er("Label-Medium"),fontWeight:Pr("Label-Medium"),lineHeight:Mr("Label-Medium"),letterSpacing:Wr("Label-Medium"),defaultColor:"standard",defaultWidth:"hug"},"label-medium":{component:"label",fontFamily:Sr("Body"),fontSize:Er("Label-Medium"),fontWeight:Pr("Label-Medium"),lineHeight:Mr("Label-Medium"),letterSpacing:Wr("Label-Medium"),defaultColor:"standard",defaultWidth:"hug"},"label-large":{component:"label",fontFamily:Sr("Body"),fontSize:Er("Label-Large"),fontWeight:Pr("Label-Large"),lineHeight:Mr("Label-Large"),letterSpacing:Wr("Label-Large"),defaultColor:"standard",defaultWidth:"hug"},legal:{component:"span",fontFamily:Sr("Body"),fontSize:Er("Legal"),fontWeight:Pr("Legal"),lineHeight:Lr("Legal"),letterSpacing:Wr("Legal"),defaultColor:"quiet",defaultWidth:"hug"},"legal-semibold":{component:"span",fontFamily:Sr("Body"),fontSize:Er("Legal"),fontWeight:Pr("Legal-Semibold"),lineHeight:Lr("Legal"),letterSpacing:Wr("Legal"),defaultColor:"quiet",defaultWidth:"hug"},"eyebrow-small":{component:"span",fontFamily:Br,fontSize:Ir("Small"),fontWeight:Ar("Small"),lineHeight:zr("Small"),letterSpacing:Rr("Small"),textTransform:"uppercase",defaultColor:"eyebrow",defaultWidth:"hug"},eyebrow:{component:"span",fontFamily:Br,fontSize:Ir("Medium"),fontWeight:Ar("Medium"),lineHeight:zr("Medium"),letterSpacing:Rr("Medium"),textTransform:"uppercase",defaultColor:"eyebrow",defaultWidth:"hug"},"eyebrow-large":{component:"span",fontFamily:Br,fontSize:Ir("Large"),fontWeight:Ar("Large"),lineHeight:zr("Large"),letterSpacing:Rr("Large"),textTransform:"uppercase",defaultColor:"eyebrow",defaultWidth:"hug"},"number-small":{component:"span",fontFamily:Sr("Body"),fontSize:Er("Number-Small"),fontWeight:Pr("Number-Small"),lineHeight:Mr("Number-Small"),letterSpacing:Wr("Number-Small"),fontVariantNumeric:"tabular-nums",defaultColor:"standard",defaultWidth:"hug"},"number-medium":{component:"span",fontFamily:Sr("Body"),fontSize:Er("Number-Medium"),fontWeight:Pr("Number-Medium"),lineHeight:Mr("Number-Medium"),letterSpacing:Wr("Number-Medium"),fontVariantNumeric:"tabular-nums",defaultColor:"standard",defaultWidth:"hug"},"number-large":{component:"span",fontFamily:Sr("Body"),fontSize:Er("Number-Large"),fontWeight:Pr("Number-Large"),lineHeight:Mr("Number-Large"),letterSpacing:Wr("Number-Large"),fontVariantNumeric:"tabular-nums",defaultColor:"standard",defaultWidth:"hug"},"button-extra-small":{component:"span",fontFamily:Sr("Body"),fontSize:Er("Button-ExtraSmall"),fontWeight:Pr("Button-ExtraSmall"),lineHeight:Mr("Button-ExtraSmall"),letterSpacing:Wr("Button-ExtraSmall"),defaultColor:"standard",defaultWidth:"hug"},"button-small":{component:"span",fontFamily:Sr("Body"),fontSize:Er("Button-Small"),fontWeight:Pr("Button-Small"),lineHeight:Mr("Button-Small"),letterSpacing:Wr("Button-Small"),defaultColor:"standard",defaultWidth:"hug"},button:{component:"span",fontFamily:Sr("Body"),fontSize:"var(--Button-Standard-Font-Size, var(--Button-Font-Size))",fontWeight:"var(--Button-Standard-Font-Weight, var(--Body-Font-Weight))",lineHeight:Mr("Button-Standard"),letterSpacing:Wr("Button-Standard"),defaultColor:"standard",defaultWidth:"hug"},"button-standard":{component:"span",fontFamily:Sr("Body"),fontSize:"var(--Button-Standard-Font-Size, var(--Button-Font-Size))",fontWeight:"var(--Button-Standard-Font-Weight, var(--Body-Font-Weight))",lineHeight:Mr("Button-Standard"),letterSpacing:Wr("Button-Standard"),defaultColor:"standard",defaultWidth:"hug"}},Dr={"overline-small":"eyebrow-small",overline:"eyebrow","overline-medium":"eyebrow","overline-large":"eyebrow-large","eyebrow-medium":"eyebrow","body-small-bold":"body-small-semibold","body-bold":"body-semibold","body-medium-bold":"body-semibold","body-large-bold":"body-large-semibold","subtitle-medium":"subtitle"},Fr={"eyebrow-small":"overline-small",eyebrow:"overline","eyebrow-large":"overline-large"},Nr={header:"var(--Header)",default:"var(--Header)",primary:"var(--Header-Primary)",secondary:"var(--Header-Secondary)",tertiary:"var(--Header-Tertiary)",neutral:"var(--Header-Neutral)",info:"var(--Header-Info)",success:"var(--Header-Success)",warning:"var(--Header-Warning)",error:"var(--Header-Error)"},Hr={standard:"var(--Text)",default:"var(--Text)",quiet:"var(--Quiet)",eyebrow:"var(--Eyebrow, var(--Quiet))",primary:"var(--Text-Primary)",secondary:"var(--Text-Secondary)",tertiary:"var(--Text-Tertiary)",neutral:"var(--Text-Neutral)",info:"var(--Text-Info)",success:"var(--Text-Success)",warning:"var(--Text-Warning)",error:"var(--Text-Error)"},Vr=new Set(["h1","h2","h3","h4","h5","h6","display-large","display-medium","display-small","subtitle-large","subtitle","subtitle-small"]);function Qr({children:e,textStyle:t="body",color:r,width:n,component:o,noWrap:i=!1,gutterBottom:a=!1,className:l="",sx:s={},...d}){const c=Dr[t]||t,u=Or[c]||Or.body,p="string"==typeof u.fontSize?u.fontSize.match(/--([\w-]+)-Font-Size/):null,m=p?p[1]:null,f=m?"var(--"+m+"-Text-Decoration, "+(u.textDecoration||"none")+")":u.textDecoration||"none",g=m?"var(--"+m+"-Text-Transform, "+(u.textTransform||"none")+")":u.textTransform||"none",x=function(e,t,r){const n=Vr.has(e);return(n?Nr:Hr)[t||r]||(n?Nr.header:Hr.standard)}(c,r,u.defaultColor),b=n||u.defaultWidth,v="fill"===b,y=o||u.component,S=r||u.defaultColor;return de(h,{component:y,className:"typography typography-"+c+(Fr[c]?" typography-"+Fr[c]:"")+" typography-color-"+S+" typography-width-"+b+" "+l,sx:{fontFamily:u.fontFamily,fontVariationSettings:u.fontVariationSettings||"normal",fontSize:u.fontSize,fontWeight:u.fontWeight,lineHeight:u.lineHeight,letterSpacing:u.letterSpacing,textDecoration:f,textTransform:g,fontVariantNumeric:u.fontVariantNumeric||"normal",color:x,display:v?"block":"inline",width:v?"100%":"auto",margin:0,marginBottom:a?"0.5em":0,padding:0,...i&&{overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},...s},...d,children:e})}const jr={"@supports (text-box-edge: cap alphabetic)":{textBoxTrim:"trim-both",textBoxEdge:"cap alphabetic",paddingTop:0,paddingBottom:0}},Gr=e=>de(Qr,{textStyle:"display-large",...e}),Ur=e=>de(Qr,{textStyle:"display-medium",...e}),Xr=e=>de(Qr,{textStyle:"display-small",...e}),$r=e=>de(Qr,{textStyle:"h1",...e}),Kr=e=>de(Qr,{textStyle:"h2",...e}),qr=e=>de(Qr,{textStyle:"h3",...e}),Yr=e=>de(Qr,{textStyle:"h4",...e}),Jr=e=>de(Qr,{textStyle:"h5",...e}),Zr=e=>de(Qr,{textStyle:"h6",...e}),_r=Yr,en=e=>de(Qr,{textStyle:"subtitle-large",...e}),tn=e=>de(Qr,{textStyle:"subtitle",...e}),rn=e=>de(Qr,{textStyle:"subtitle-small",...e}),nn=e=>de(Qr,{textStyle:"subtitle",...e}),on=en,an=tn,ln=e=>de(Qr,{textStyle:"body-small",...e}),sn=e=>de(Qr,{textStyle:"body-small-semibold",...e}),dn=e=>de(Qr,{textStyle:"body-small-bold",...e}),cn=e=>de(Qr,{textStyle:"body",...e}),un=e=>de(Qr,{textStyle:"body-semibold",...e}),pn=e=>de(Qr,{textStyle:"body-bold",...e}),hn=cn,mn=ln,fn=e=>de(Qr,{textStyle:"body-large",...e}),gn=e=>de(Qr,{textStyle:"body-large-semibold",...e}),xn=e=>de(Qr,{textStyle:"body-large-bold",...e}),bn=e=>de(Qr,{textStyle:"caption",...e}),vn=e=>de(Qr,{textStyle:"caption-bold",...e}),yn=e=>de(Qr,{textStyle:"label-extra-small",...e}),Sn=e=>de(Qr,{textStyle:"label-small",...e}),kn=e=>de(Qr,{textStyle:"label",...e}),Bn=e=>de(Qr,{textStyle:"label-large",...e}),wn=e=>de(Qr,{textStyle:"legal",...e}),Cn=e=>de(Qr,{textStyle:"legal-semibold",...e}),Tn=e=>de(Qr,{textStyle:"eyebrow-small",...e}),In=e=>de(Qr,{textStyle:"eyebrow",...e}),An=e=>de(Qr,{textStyle:"eyebrow",...e}),zn=e=>de(Qr,{textStyle:"eyebrow-large",...e}),Rn=Tn,En=In,Pn=An,Ln=zn,Mn=e=>de(Qr,{textStyle:"number-small",...e}),Wn=e=>de(Qr,{textStyle:"number-medium",...e}),On=e=>de(Qr,{textStyle:"number-large",...e}),Dn=e=>de(Qr,{textStyle:"button-extra-small",...e}),Fn=e=>de(Qr,{textStyle:"button-small",...e}),Nn=e=>de(Qr,{textStyle:"button",...e}),Hn={default:"Default",primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info",success:"Success",warning:"Warning",error:"Error"},Vn={xs:"12px",small:"16px",medium:"24px",large:"32px"};function Qn({children:e,color:t="default",size:r="medium",fontSize:n,disabled:o=!1,twoTone:i=!1,className:a="",sx:l={},"aria-label":s,...d}){const c=Hn[t]||"Default";return de(h,{component:"span",className:"icon icon-"+t+" icon-"+r+(o?" icon-disabled":"")+(i?" icon-twotone":"")+(a?" "+a:""),"aria-hidden":s?void 0:"true","aria-label":s||void 0,role:s?"img":void 0,sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",fontSize:"custom"===r&&n?"number"==typeof n?n+"px":n:Vn[r]||Vn.medium,color:"default"===t?"inherit":"var(--Icons-"+c+")",opacity:o?.38:1,cursor:o?"not-allowed":"inherit",lineHeight:1,flexShrink:0,...i&&{"--twotone-variant":"var(--Icons-Variant-"+c+")"},"& .MuiSvgIcon-root":{fontSize:"inherit",color:"inherit"},...l},...d,children:e})}const jn="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAkACQAAD/4QCSRXhpZgAATU0AKgAAAAgABAEaAAUAAAABAAAAPgEbAAUAAAABAAAARgEoAAMAAAABAAIAAIdpAAQAAAABAAAATgAAAAAAAACQAAAAAQAAAJAAAAABAAOShgAHAAAAEgAAAHigAgAEAAAAAQAAAKCgAwAEAAAAAQAAAKAAAAAAQVNDSUkAAABTY3JlZW5zaG90/+0AOFBob3Rvc2hvcCAzLjAAOEJJTQQEAAAAAAAAOEJJTQQlAAAAAAAQ1B2M2Y8AsgTpgAmY7PhCfv/iAihJQ0NfUFJPRklMRQABAQAAAhhhcHBsBAAAAG1udHJSR0IgWFlaIAfmAAEAAQAAAAAAAGFjc3BBUFBMAAAAAEFQUEwAAAAAAAAAAAAAAAAAAAAAAAD21gABAAAAANMtYXBwbAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACmRlc2MAAAD8AAAAMGNwcnQAAAEsAAAAUHd0cHQAAAF8AAAAFHJYWVoAAAGQAAAAFGdYWVoAAAGkAAAAFGJYWVoAAAG4AAAAFHJUUkMAAAHMAAAAIGNoYWQAAAHsAAAALGJUUkMAAAHMAAAAIGdUUkMAAAHMAAAAIG1sdWMAAAAAAAAAAQAAAAxlblVTAAAAFAAAABwARABpAHMAcABsAGEAeQAgAFAAM21sdWMAAAAAAAAAAQAAAAxlblVTAAAANAAAABwAQwBvAHAAeQByAGkAZwBoAHQAIABBAHAAcABsAGUAIABJAG4AYwAuACwAIAAyADAAMgAyWFlaIAAAAAAAAPbVAAEAAAAA0yxYWVogAAAAAAAAg98AAD2/////u1hZWiAAAAAAAABKvwAAsTcAAAq5WFlaIAAAAAAAACg4AAARCwAAyLlwYXJhAAAAAAADAAAAAmZmAADypwAADVkAABPQAAAKW3NmMzIAAAAAAAEMQgAABd7///MmAAAHkwAA/ZD///ui///9owAAA9wAAMBu/8AAEQgAoACgAwEiAAIRAQMRAf/EAB8AAAEFAQEBAQEBAAAAAAAAAAABAgMEBQYHCAkKC//EALUQAAIBAwMCBAMFBQQEAAABfQECAwAEEQUSITFBBhNRYQcicRQygZGhCCNCscEVUtHwJDNicoIJChYXGBkaJSYnKCkqNDU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6g4SFhoeIiYqSk5SVlpeYmZqio6Slpqeoqaqys7S1tre4ubrCw8TFxsfIycrS09TV1tfY2drh4uPk5ebn6Onq8fLz9PX29/j5+v/EAB8BAAMBAQEBAQEBAQEAAAAAAAABAgMEBQYHCAkKC//EALURAAIBAgQEAwQHBQQEAAECdwABAgMRBAUhMQYSQVEHYXETIjKBCBRCkaGxwQkjM1LwFWJy0QoWJDThJfEXGBkaJicoKSo1Njc4OTpDREVGR0hJSlNUVVZXWFlaY2RlZmdoaWpzdHV2d3h5eoKDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uLj5OXm5+jp6vLz9PX29/j5+v/bAEMAAgICAgICAwICAwQDAwMEBQQEBAQFBgUFBQUFBggGBgYGBgYICAgICAgICAkJCQkJCQsLCwsLDAwMDAwMDAwMDP/bAEMBAgICAwMDBQMDBQwIBwgMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDP/dAAQACv/aAAwDAQACEQMRAD8A8zt1v/D0/m2bbo85K9q664XRPGNl5N0iicc7W9R3FeO2vjF5FAmPB9eldRYvFfqJrWYJIOeDivntTvnRvqeleHfEupeA3EciBoYz8rgcjHr/AI/nXpdt+0p4sd1s7RozEw+V88/lXjlldedEbLVsOCMb+9XPCmk6f4S1yPWvs631uj+Z5bcjI54zU3a1izmlTVmpI+kbLxp8SdcjWVkuzHJ0ZIXCn6MRiultfD3i/UcPdgx57zSgfoMmufb9oZ9WgGl6dAqsw27OWZMf7IFT2XiDxJfKWbcPYkLn6dTXZSrJ/E2zza9Fp+6kj1bRPhjZXKeZr2sLCv8AcgAz/wB9Of6VrX/hL4M6NC39pOb9scieZnBx/sx7R+lebaXYatqlwEupRbx/xMSXP4ZIFehR+C/BUKBtRup7p2/g8zaCT22xgH9a7ou6uor5nJ5XPzw+LkHgGy+INld+AbH7MfPUXMSBlikywwVDd+xxX1HDe3Z8Norx2yIEzsz85z36Yr1SP4cfC6fVTqV1o0U7w4wsrLshDHZmUMeCfU89MDvU+peGPCWsWlxb+H4bG3iRWZhBOu2LaM7pmOQFC5/iABJr57MI1ZS5qTW/Q+lwFCPskqi6dT8o5LC78RfEqG32kRR3h83A6KG5Az7V+pfhHwl8MptKhgvIGhlVAN6yOjdO+Dj9K8W8KfDHTbXUrnWrh4BDCXnnkYjy1UOFwjcjAzksT9AOa9vtbLSJYhJHIsaFFZZEYeWQRwQR8pHoe9d2Fq3Wxw46hK99TtU+Evgu7XOm6tcRE9AWSQfqAf1rOufghqGC+maxBJ6eZGyH81J/lWF9ju4Rvs5xKuNwPXP5Uh1vX9PHyPIO3yOcV1upC2sTg9mZWqfDv4oaKrSWcomVeht7n/2V8Vwdj41+IXhzW44fEMV+0LkRwxNHnfIT03DjHvXp6+OvEtveRRyxzyLJwocDaD6sewFT+NfEVjDp/wBvuJ0a4WPk8dT2UfpXn1nztqDOyjTUFcf4h8TTHS/tWpzLG+zJTPyx8dPc+9fGHjTxve6o8lnp8jLbkkE92/wFWPFnja/1tjBJJ5cA/hHf3NeVahrVhZRNucZqU7LlR1KnzS5mMimitW3yH5qyNb8XW9vHtMn4Dk1w2qeKbaRyfOWJM9erH6CtXw5oN34iuo5Rp8ws2/5bSDG4+oBo6HZGkf/QwfiB+y3N4f8AEotfDV5P/Z8oJ8qRt+wjnhuuK8A1zS9b8AagYLhZvJzgSlG2ZHbdiv0u1v4m6Xd66BfW0tqckbZlIPT3roptF8MeLdKMN1bwvFOhIDBf0zXz9RLmbiz2I6o/MDT/ABdJcSJHc7lJ6HoDXsGhXk6qG3iSNux6V698RfgRZ3enqnhqNIZwBtYLnmvDh8OPiV4YuI4TD9pcuFAUAJ1xli3AHqTwO9Q3Zakzpp6I9M0ZLaC5+2aZARck44GdxPavYvDGqanqF2LGKDFwcfIFbHPfgGuG8AeDr7UZvMvNV0/yIZsTeTMZFjOSrI7KByCOzZz2HWvZF1/TtE8XQeFtE0+BnhgWSTU72VkTEoYL5UUfLuSrAAsT3GetEZq6S3OV4KUrtrQ9H0iPRZXuNPl1GKa7sYhPexwuZBARx5biLJDMx4GCeD71Q8MePvhh4i1K+tPDF6up3mmukUscKldsj7s4MhwdmDuP8ODmvz5+Ofjl/BvhrWdQ8KreafDreurCL1hMvmi2iLsVWQEBEclgqFgN3JB68d+zxJ8RNM8EeLvjHoTxARLKWminiVrydMzXBMZJEQXhdyozN0A446FJyjdM3hhIRkotH1j8fPF9kllq3g7whdBNUa3F5LOitJMktuXMUaPFl8bo2BJCjkEZya+dvhD8d7Pw14WiPjOS5thcM9qr2saTC4s5A8hZo2ILKkxkTgNgHuOvwp45+K/izxlq11rJ1W4im1SFxcMj7HXLncCqYxu2gEdx164Ot4s+IWh6p4I0e006eddSit4Ld5HVVmR7bAXBA5AYZUZzySevESwknbm6s3+tU4+7Doj7yv8A44aP4Ztv7XmS81WHTIv7LgW7uWSJDcPHIjFY2wzrGd0e8FMYBAJOOf8AEX7SenLYqLIRyWlhukkmIKzF5CGffGrbMYxhVJ6N2Ffnd4l8U3upaZJfapYPOLpk2XbthlKJ8v3RtAOe/PHUViXOvW1xp9o81x/pLoBNHsAiZFwFwoYkt0y20Z549dYYO0VF9zKpilJvTofo5pP7Sniy3TzNA2/2fIrNG/zMmBncNjA4Kngj8q9Z8B/tXQ3Rlg8Y+XmLHliFfLZnOQMh+AAQMkkAA5r8tfDfj3xB4dtTYaPIt7aEeY8arux3JAwD7EH0zmvR9a16x8XaLBFusE1WdoRO4QQzIgBzGuGAfsWcjIOBiieGlF6PQwUqc1qtT9d5fihpniLRRf6Msm6ZcASrg7lyCVI4Zc9COCOa8W1vVNQuyZdSdio6KTwK8K8EeKINAuNGsdNuXu7JbZ7a6gZyNlyER1YK3IO3J+XII7nFe66T4d1LxrK0sgMVucgHPII6+2PT2riUteXqU8PZ3Wx4zruvNJO1raQMcdTXKaVoOseKpLj7NalYoDh3kJJJPYV7zf8AgCPwnqMk05MkbDJZ+e3vXQ+Ar/Slgu7S3iJllkO3auR0PU1UV71mdEYKKufPPhz4bWk3iyyS+TcqkkoeQDmvvPUtA03SPD0DWsCJsTOAAD2r540T4d/EHW/HTGxT7PEWLJJt3fKT1xx/OvsvTPg/r0NvFca7eyXRC4KsQF/BRx+ta0acnfqTVrw0sf/R/Q3XfAeh61q8t1cWqM4zhiorirj4YvcPs02RoCgIRlzxXQzfEq1GoPGtvJyxHT+dddp3i7SoY1kkY72GTx09q82UISmzqi/d0PLn8J6/oNuqiRrx+24Z5/SvGfHeg+NZZXutZkkXS4Ip5VihkKyzufLJWQZXKqA+1RuP8q+yZfEVjdRl4sbirbN4IBIHH4V+dPxC+PE3/CRnwL8SC0D6deGOa7jgQQRGdd9uQN6yOAPuvsKk8MRXFjIx5LRuztwnNz7nKeLrzwjb2unQ6dqUumhJDqT6XZ3geSRIPmbzkuH2gyou3mPIHJU8g+M6P+0/4U0vxLcy6/oLMiGZkmQlbn7QS+RNvUhdhIjXyyAMkqQDXjVtHZa54k13xD4bsbmSSyYA3V1dC4uGmuDlmSzUIArqGUBWzlslj2+U9aW91XX7l55tl0JHEyMNpVBgAfgAAR1GMHnNTRwcG3FvU3qYycEpJHXeJ/iNqHijxTd3N8815pMt27w2k1w5jXzeApDPkjKjPPRRwM10ui/ErVNH8LyaPYzR2q299PcC1jbaGSVVyRnO3HIG3AINeD30yTXEv2oKs8TLtZMDKYIzxxnoSeppYLy08pVXAnAIQlSGZ2IyWY54AHAFet7OPLyW0PL9rPn529SzqkhglW6kO6Vi5bnlQcbVPJxgHIqCJ7htKMyyDBmO1CcnJ7gHgdvrVS6a4mm8hgGZgMkYJLeue+K7mfwwdO0uy1OaRJobmMMsUfytvZcnPGDt785HFVKrGKSfUzhRnNtxWxzlzr+oDTY9HS9lNqHVli3YCyAfewee5x+NczNEVl8xxtU9McfMOuB+NdTqWmtbi4tROsqQlcMY9hLNzt3dcj361z8jGaw3kFmQg5649eauEotXXUiaknyy6Fq01CS3xHbM2+UOH2k5KsMEfjXX6Fd3NhItxbgrcJkiUrvYLjJ2qxIyM4rzeKeaNy8R2kgKSOOK6jT2t5I+J/Ll+VlUA8PkYG4jGT+X0onEIaM+i/D3j6/XTLg5+ZrmO5WSUok0bx42vgEDAwM4zxnpzj78+D+s+N/HWmWl14VIsNNtIJklZCZpJriTJ+ZSCBswOBk7elfl3Zx2flpOsuJQC8kbIfmXBGM5/pivsn9nL4v3Xw+s5rW7kZ7e9bzPJ2hRvjG3b84G3C5JYHBXpzXlYmlFe8ejSqSasj9ErjwPqVzOq65+9Vo0DMeAWwM/L2r0DwJ8NdD0uOa6SBNzv1I7e1cL4b+JD+LdCW+UwTbxmOa1LNEY/wCEksASfU9Dxjiu+8N6l4imjkgEJCITlj0Yn0q6MYXuctST2Z6d4YXS7DVtoCq2MD869a1q+tU0/cGXha+SrHw9451HxGWs5Fjjbnc2fl59O9exXHg7xULZft995mRjaBgV1UpPlasZyldn/9L9DbTRdPkeSR4lDFj2rf0Dw/p5kZ3jBGT1ryOTxNrc8/8AoMGFzyT2Feg6LrOs3VssUMezAIY45zjk157cednRFpxR0t/o1iLrjai898fLjoPevy9/a3+IujW+vTWNvpdtNd6NLHGPNs4Z5PKZM5888xttKsi7WwRz6V9k+OvGGoaMIb6YyzJE2x54ULrEHwhfAHQElQTxuPoCR+JXx18earca441LdI96Z7p7iRm8y6EhCRNMdzbmRI1U5OQR6dfOlL21TkjpY9KnFUo88jz++8YavFJqFzpTrY2FzgSxWsmzeY+InfnJYMMjgHNeIXl/LLeS3gXMjPl5GYkvnk5/HrWjot6bnV3M5zHsfCnkHPt9RmsfVpBBeSxRgbW7V6tOmo6HDVqOauU5ZvtNz5qIF3YyoHHFem+DvAN9411Yi1hZI2YhSQSobHTgdMkYxXmkUS3V/aWsB5kZIzj1Y81+pXwn8EeLItJtx4I03TxHbJ+8vdTYhHl4+WJFILBe5PGeleXnGNnQhGnS+KXV9EetkeAp15yqVvhj0W7OD8B/seXmqXEF94lVBb4CTRRbl3YxhlOAeec8fSvojxf+zNoeu6Na6bZQrbS6euIcLgEYwN2wqeOo/kc16b4e8W/GjQtRisfEOlaHqVgdqvJprtFIgx94BmbcfbA+tfQKyfbbKC/EXkl1JdD1UgZIzXyOIxFeU1OVW7XbZH2mGw2GUHCNKye91qz8yvEv7JM7WNvMwBS0Dm4lLHc67SVAGCWO4ADOMAnrXxv4y+Gl54MWO6XesBn2TAjIVTkAkZHGcfSv1v8AiH4m+KV9ObPwzJpuiaah2yXF6qyyOc9QGyoXHtnPevnPXfhJ4w8SRXWfGel6lPcK6m0MMaDBHJUopw3oTxmurBZjWpSi3WTj1Tv/AJHDj8toVozUaLT6NW/zPy+v7KOK5KQ8q3I9OvOK0rW3jEqzXEyCFCCEQ5Yn/PU103xQ8JzeDNch06RHhLJ8yyfeDA85wSCPQivO5G3Dev314/CvuKNaNaCqQejPz+vQlRqOnPdHcx6qq3wufJbyy7CJRzgtnhfck/SvU/DNxp2oajYW2q3Vwbj7THCq7gCF2lSitwByRnLAHkcV45eRWcmjW0qExyptYgZKyZwMZ9R1H5V654E1CBNYs9K1WGJdO1VVtbmPJkVPMO1ZgGy0bq2GJHbpWdZJxNaUmnqfqZ8ENZ17V/Ar2tutlLBpg+xMsEbJcrJEo8l3y5BRkGBtGPlr68+F1zef2RG+p4ErDO0nkZr8yfCeq3vwr0DzrxdU0rUbK6iglWS1cWN2pnKxRvcqCjeYu9UPUHoOtfpL4Wae8it7iWB7M3caskZbLIxXOxxgbWHcc1y0GlLUVdNarY998O6hZR6kVJXcQK9J1OeFrcEEcjNfN2jeFNXu9Y8+K5ZFxz9favRtV03XbC2yLozbR90jFd8JPl2MG9T/0/0LtNNWwh/fqvua6XSoorGwa8kKkHLBCcZFed3Wq6prw8mAeVGeDtH9a6fw/p1zJD5V3LnZ8oyewrgk7z0OiL0Pj34meJm0/wAVa1o99dCWbULYtZWnmGJAturTKDjHLpuADHnaSvSvyG+LemWtzb3t8bc29zPdNcRvseOKZJixY7JDhWBwAF4wM85Jr9zfH/wD8B614ztfHWtRE3dtt3ESMqP5Cv5fnKpAdEDNnPQZxxxX4rftR6jpHiTx5J/wht3JNpaSfZIhIrogKudzRhudm4nDNztGTXmYfDuFa99z1J11Oi48uyPnPSrTT4ra3YtItxI75P8ACwCHAAwD1Gc59iOa5zVopjqOH4LEAFuBnjua7bxVZNoVxHp9pew3z2DG2ae3O+GR4mwzxt3UnODxkc9CK47WLv7ZiaTaspP3UG0AdOnTrXsxbep5k0krGj4Nt/P8aaRFKOHu0GMDHX8q/Wu98GeNfESaRa6dqA0rQbZN06wny5ZTtx8rlXReefmRs+3Wvyj+HsAl8beH/LdTK95ENmTnJOMnsP51/Rj8PtBs20O386NXXy16+hFfJcQJvGUrdE99Vv2PsuGUvqlXm79NHt3Pz9+HPw5+KWmeKftup6098kNwv+rEpiNsAQ6Odg3OeNuCFUjpzx98adNqd54enjZCskY+Xd97kHA/Suu1G40nTX+yW6orMMYUDJ/xo0W3kurC7kKlUchACMEdQTXkVf3lXdX1vZWPoaMFTpW1tpa7bf4nwz8RPCviDxrb/ZopLmBbVpWY25YSFnTETqykEeWecY+bp615f4a+CHi23sre8k8Q3L6ta3huTc7bgFoyADCY5maMDqSwyxPGcV9sC5Tw5qU41RCsQPlmRgApOeOenI5Fei6fa6Pf27T2aIGZeWGOa4sPiKkaToKS+5HTicLTlVVdxbfq7fdc/E/9rXSLiz1LSL29O6ZjJC8g/i2jIP19a+QQWjYNjgg/Lmv0V/b3tI7ZtFCBQRcycA5GNpx/Svzul3SToQv+sVcKenNfc8PN/UYJ9Lr8WfnXEkUsfO3W35HbaS9rPo8sNw2FOSpZgAhzlRt69e4p1hcxRXSTwyMNx4DA/Lt6+uRXORYitpreRmEn3QM/KwBz0retbQXVlBPAXEtuWzwCu3r6j/8AVmvWaR5EW3Y+8PCnijWPH3wiuNJtlN1baJqVm95cSSsXt48s4LR7TiMYYB84DkE4FfqF8L/EV34i0q11/V7GSzmDOiRs25GRflSZcAZVhyrEZwa/Mn9hjxTeaX44n0drC1kstUj8i8uXbbMmFbywqkgMmR8/Bxkc84r9jPDtjpMFkbWyiihijyqRxKERR6Ko4A+lclOPvtGldvY67wp4isF1Aws65xXa6zeRzshjYbSOea8Ts/C8bag90jlcHscZ5roru21WxgM4cuiDgHriuqMnynM276n/1P05fw3eabpRv5IREoXds4BA+naquneIPD1vpJLMryuCztnkHsPbFc9498W+Pp/DUktroz28Ey4LyMA6of4tg/rWt8MtG0VPAtut8iST3iu8zOAWJLEdfYdK4HK87R7HXGOiPmz4rWfi74jeFb3Q/DOsNod1JIDFdEZRoslXhkGDlJFOGxX5hfFr9mHWfhZLp+p39/Nq+iwqZL0wRkSvIsW9hAzmRUVmzgMM4HTPNfq5r2v6To8lzHd4jihkbaCcZCnivkj9pHSvFXxKOkaL4V1JbffbzSCBLhViYeW0nmGWMOSxUbBGQevOOTXn1ZWXM5WOug/e5Ern443iWl9qBS0LRWylm8uRs4QcYyByegzgc1zWpoUcKRtAyPY46EGvWvih4Zg8DRado6zTnUpYxd6isiBGjknUMkWfvcJjOcZJJxzXlF2oa1hk37mOeCecegGM/nXp0ZqSUlsclZWbT3GaJqsuh61Ya1B9+xuYbhffynDY/HGK/oi8LfEO2h8F2uqWzb4ZbZJoSOjI67lOfoa/nKIPfvX6i/sifFex8U+CT8M9cmUanoan7KHPM9iTxjPUxE7SP7u014PE+GnOlHEU943T9H/k/wAz6ThXFwhWlQqbS1Xqv+B+R90+EtV1DWbh/Ed/CSWIaFDzsQ/Mu4ZwCeCRWZrfxU8SaTdTxXzh1ckxpBHtRAPu8gnJ9c/pXI2fgrS08Q6f4iup7qW2tmMN1YrdTR2lzE3AMkaMBvXPyuMEcZyOK9dTT/gBFEP7Q8Paktx50eUieWcYX5nIYS/dOec4PHFfLYbB89FONS3e/wDwx91LENT5nSlL/Ck/1v8AgePx+ONS1mznh1q9hlhmO9UuvKiZRznLZ5HpnmuO8NfEDW9K12PStNuU1HS597RyRkSeXtO3yy4OGXnIZfTGa9O8eWXw18Q+Hr/wx4X8Mw2lpqaSW8tzdYku5I3LZWL5mMe5W25zkD0xmuE1K18P+CtOW7kENhp+lWhBOAkcUMa849gBXJjMMqdnGXNI3VSSV5x5F2dr/NbL77+h8N/tseIbrWtb8PWUyhJZUmuCnopYRr/I18XSRus0eBsKIjADqSRkfp1ruvit8Qbv4neP7zxNGpjtgRb2ERH+rtos7Mj1bJZvc1wSSKQ2QAy4IY+nXGK/SMsw0sPhadKe+79W7n5Lm+KjiMXUqx26eiVi0sr3Mwyg3RbmZgOcgd+36V7j8MtI8NeKZ7vTvFkxt5JLQm2mgBEjTj/VJhSAQxOCANxPTpXielRpLI8pJyPvLycqRyT7Z4/GvX/DOnWuq3linhmSaXVrYxMlvHG6tJeNKuI0HXbGoJaRsDnr0z0V37rRx0d7n1z+zf8ADr4geGfG0euTQPbQC8NtLDcRiSWKzKmXewJz8+1cMPuk5OeRX6l+G/EkSM9sPm2knNec/DjTrz4hxaLrDWqWEraFHFdGSZGmSaCU/u1jU/KpLEhm6kAZ5ruLb4e+L9DmuLyW0+02Zdm8xOGC+6+1cNKc2+YVVxb16HpWheJIbu/+zq2cHkV6vfywSWYUY5FfCl/4huvDWsm5hyV3ZI/GvY9F+KUOqw+VIcFFGc11wrx+FmfLJavY/9X9afiJq+nWPh27jbaSYWVQfUivheL4xWnhOx+y3c+1hkAZ6Z9KpfFD4u/6PJH55nkYcKDxXxlewah4pvmubtyATwOwrza9RJprc6YSctFsek+M/G8Xi+7kWFyImY8g9a1vBlwbeS3S5mkn+zktalySIHYBHZQeAWXgk9v15rQfB8KbQx4r2jRPD1lCF6ZGK4pU/aO7LVT2atFn5v8Ax7+FOo3/AMYdcnt7Wa7sI7Q6zdT3JEcRSIKLkxS5wyCVgvHzgHgHivlDxjZWMOraja6YIDaxTtJCIHZkjjb59gZxuO37ue+K/bL4veAl1/QpLTRdFW+OpSxrdSSSF3jKMWWSSJE3Tx7ifMQYbBBByAR8RXX7DfxBn1u3ksrm3bSpLgGRLjKzeU0mSPlU4bbjIdsjpu9OmhNr4h1KkWtD885EYwxRtxgEjPX5uRWj4X1jVvDfiTTda0Sd7W+tbhHikQ4I5wVI7qwyCDwQcGvs34v/ALLXi7wZoM/ia+RYYBqMFlBa2yCbebhtvmKV5VBtA+fozKuTya+ufhj+x/8AB/4W+FYPFfxTuFvPF8+mvPDp19PGojuHRiqxWo+ZnXIBJLAEGt5VlyO66MyjpOPI9bqx638O9ZtvFujRNc7Y7low0sR4BBHJUHt/k1T1z4aTPcmWHWJLeNjkRg5x9MnNcb4fsTpsaLbyFTGF27TgjHpV3XLnxC4LQ3bOuM5PUe1fltaskmtmfs2FnOm7xbOs0DwlYaMjXlxePcSjd88zD5dvoOgHevi/9qvxbc674YvdH0xythEu5mU489kcEn/cHb1PNezXF3rV2sltcXDurnDKMgHHX/JrzLx54Vs9X0uW2uukg25B6A8VWAxcYV4SlrZpmOZ0Z1qNTXVpo/L+3cI+WU9OoOKt+V5is8YOwYGeTyegzivpPwh8H/DSeNrnw74lvmt5jFv06S5hH2BpHbEf2qRXDBc8HC45yTivorw7+xh408SeOdOt9W8mHwfFIWu59P8ALgDbf3hECb5TIjMTGkjMTjkYGBX6jHERqRVSOz2fc/H61P2U3TqaNbo+H/Cuh65qMsj6Fbbj5MkU2SMtlGZgEOM/KMjg4xmvo74I/Bjxlr/hu/8AiV4Pkn0z+xbm3S4luIWZXilbEk9tMuQPLIIlVlZVX5icZx7N8KfBQ8e/tNatJp+kweFk8Nx3cjW8lu4WdI5fssDNEWAbd95mBXPUA9a/S/4f+F9K+Hdjf2dhHCBqs5ubtIIhFbvIVCHbDkqoKjBHfvWVSTlpbQlzUUrPU7v4P+F9Y0Twdp6axa2lrcKmAtoWZTAp/dBmcZY4ycjjnj1r6Ut9RtZbD7JgAsuCK8f0iS91S3WC0YQxooVVHACgYAUdgOwrTTw9q0b+Z9qYH0zU0/cXuoi99T51+J/wZ1+61KW+8NzNOJXZzbso+XJz8pHb61x2neF9W0lTHqtlJaS9ywIViPQ19y+H4Xs5M30hkPqx6VV+JSWF9oE8FtEstwyZjC4zuHSh0k1zItVJKPK3of/W4WGzm1NhJcyFifU12eleHUyuys3S7cnHBr0bSYnBXC14drnZJ2WhraZ4f2gZrvNP0kIAB2qtp8cgUZWvX/BfgrU/Ege5V47WzhO155emeuFUcsf85reFNyfLFHLOaW5zlrYEDg12+ieEfEGtOF02zkdSeZGG2MfV2wK9csNM8FeFIBO8QvJY8brm4AZQfZPuqPzrRHxR0l38hZ44lXgFvkXA9Pwr06WWVGrtHDPGUouzkcNrHhTwr4M8NX2v+N1j1YWUJufsoUNBlOmd3Lc+wH1r8ktMuJvGHxa8X+M9emNxe6jcRrZmQ5EFkY12QxDoqBlccd6/Qv8AaR8Yyx+Cb660i50+8S7hNuY42drhVYjcRn5eOOMV+YtpcXFrcw6lpZzeW4IMLjaZIyQWRh+AII6EA+orqx+QTxGW1IYfSe687dPn+Zllmf08LmdOddXgtH5X6/L8rn0lDEsEW2UfIpBXHHI6VV1G4gcPGZChIPBHIwKz7Xxt4av4oluLpIJ3Cjy5MoQxGeM8cdDg4Bpt1bwXypMkiyRsMqyMDkE+1fhePo1adR06kWn2aP33A1qVWmqlOSa7pmOIowpMS7tx+83b8KxtVsoEt5JrogRLlnJ4AAGa6TV9U8O6CIop7je5PMcYLt07hen44rx7xd4nXVJBHGGtrFMbYmOWduu9wucew5A9fT18g4Yx+YVVyQah1k1ovTu/JfhueFxDxXgcupNTmpT6RT1fr2XmzyPxNMJ7t7oJh7hlSJT1WIEgZ9zkn8favdv2ffjTqvwwfWbbVY21fQIrqMvaMxDRK/ytJC3Yg4JHQivDmgl1DUxMykKhG0ew79a6nwxZFTq8GwSJPC52n+LackE/T0r99wmUUaOHjhoL3Yq39efU/nrHZzWr154mcvek7/8AA/Q/QNfH/wAF/DXimHUNPgTSYPGCi9XU0JlgmuHwskdw+A0cgI6MCuDkGvb7nTl2q275XUOjD7rKRkMp7g9iK/LbTLH7VoM+gXh8y0fDwZ6wuOm3PftX1t+z/wDFy8i0VPhr4uZZ5tNJ/s+Wck+ZDknySTyMfwkHjpXJjOG0481DR9jTB8QtS5MQrrufUOjatcaNIFSTKk969KTWPtVv5r3Ww46DFeURW9p4kSSfQsJLHnfbOfmyDzsJJz9K5i4ku4i0LSum0kFTkEEdjXymJw1XDzcKisfU4bFU60Oem7o9M1bxBHakt9sbj3rmbL4i6TaXbfbp9/HAZ64l9BfUx80rt9Oa569+HNhM2Z2m/WuKTad0dJ//187TYpMjBr0PTFlUDFZ9lDaKBgV1tqsGBt614kYnROXQ7Hw1p9xql/DZmTy1c5kc9EReWb8BXdeMvixFpEC6R4dUR2NvCyK2cEleCSPUnqa4eyujp+g6rfxnDLEsQPoHOW/QV4Ncap9qtry3lf5iLjac90VZFH4gGvt+HMDB03Xmr3Pjc/x1RT9hTdjt4Pibrd5dOsVyzgjlSxII7jGe9RX+vXN9cB3k8tgPurwufXj2rwjwXqMlzO8q4LBsEentXrYiOFYKAfavrHSitUj5ZVG9zE8X3L3kMVtK7Og7Z4x9K8tl0SEEugwSeK9N135ihYZOD26VzLqGUENnOefpSS0NE7nK3fh+HUolgnRJDkAMQC/oRnr6Vw2vaNrelTTzz6gWt72SC0srZSf3ZyC7AEcHYrcivZ7GNPtiBuhPHfJzXK/E2EnUfDTpkILqfd9fJO3+uK4q+CoTalOCbv8A8A7KWNr0ouMJtKxjDScxq79cDBBP9c1nXWhJKcu2fXj8K6+MnIwu7jGeuMU+SINwO3YV1W6HFdvU4e08PW0cudpIxnNbMFpFZTM8a4J57elavlBA29SfQ8VWniBjLKCPx6UEPzHNpv7v7TYMSMAsnUjvxUSu6yR3qny7iE7lYcEEVWF3LZSbuSQB064BplzqEE5MqnacYI6VtGSMZQ7H0b4A+I9zZ7JJpWWUSH5snHQcD+de+/8ACbeHvEMSxapGIZ26XUOBID6kdGH1r84xq5tFljQkHBkB64K49PUVt6Z4/u4tqSSMdpHP0HX+VcOLw1GuuWornbhK9ak+anKx+jmjO+jzpMZVu7KQgLPH0Gezr1U/ofWvXo9MsNRgFxGAcjtX58eCvilNZzKrSbo3O1kblWHoe1fWXhjxxa29vHdxvm0kwME52MRnafb0NfEZrkzw37ynrH8j7LK82Vf93UVpfmf/0PQbTS4yOR+ZrorawjXGP51x8GoS4Azx9K3rW/c8Bv0rx00as3PEzC28HXdpEcSXSzYx1zHGCP1NfJcWsm8tkuY2OX+YrxnJQxsPXv2r6D8carLZ6dpMhPyyz3EWTxklAVz+K4r4vn1ZdA8Q3WnSFhBKxurUHPMZb94nHUqeor9LyNKOCh5/5s/O87beMnb+tEexfCaCE+C11fAZ7i7mVjjJ+RsBa9WWTdGA3yrzxjvXzp8ONek0PQdSsZWL20WrEW6j/aUyEj8CteswaxdahH5gVkGM8ivYjO8UmeR7Np6GlrBV281Tnadtc66gDCnoRW7h5ItkhyQAx4HWsiXH3CBgZ9fz9qnyLRn7XE6snU88DJ/AetcJ4ofXUh0ka1LG0k+otJaRohDxxJHIH3Z6nBXJx34zXq9hbrJcHOPlGQMevH9a818WSjUfiRBaf8s9IsAOenm3J3t+O1VrGrC8otN6fj6m0aloSi0tfw9DSgSQoM85A9c0oABOSR7danKgAHdwDjgY9BTWCopcgDuM8dK1Mio7rsx8x64qhLKNjE9yCen4VYMhkYrhhz15we9UZVyCucEn2PH9KlkmNdzoFO5eexPUj/8AVXKXlx1MRGe3OK6W7kRWI547dMnvjiuP1FfMLDA74HANZTdkVCN2YT6rP9o8pmyNrDkdcj8KiW7MROGPJ6isqcPBdKX4XnPqOD9aha5Vmyh24BAB/WvPnNt6npQgktDvdN16a2dVD4H97+or6r+FvjqJm/s29cPb3ACMHPHsR/SvhVZ2RgSc4OcV2uh6hcMcW8vluOR2yaOdTTpzV0w5XBqcWf/Z",Gn={default:"Default",primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral"},Un={"xxx-small":{size:16,iconSize:10},"xx-small":{size:24,iconSize:14},"x-small":{size:32,iconSize:18},small:{size:40,iconSize:22},medium:{size:56,iconSize:28},large:{size:64,iconSize:32},"x-large":{size:80,iconSize:40},"xx-large":{size:160,iconSize:80}};const Xn="var(--Button-Border-Width, 1px)";function $n({src:e,defaultPhoto:t=!0,alt:n,initials:o,icon:i,color:a="default",size:l="x-small",customSize:s,clickable:d=!1,onClick:c,insideButton:u=!1,className:p="",sx:m={},...f}){const[g,x]=r(!1),b="custom"===l&&s?{size:s}:Un[l]||Un.medium,v=Gn[a]||Gn.default,y=e||(!t||o||i?void 0:jn),S=y&&!g,k=!S&&o,B=!S&&!k,w=d||!!c,C=S?"transparent":"var(--Buttons-"+v+"-Button)",T="var(--Buttons-"+v+"-Border)",I="var(--Buttons-"+v+"-Text)";return ce(h,{component:w?"button":"div",type:w?"button":void 0,role:w?"button":"img","aria-label":n||o||"Avatar",tabIndex:w?0:void 0,onClick:w?c:void 0,className:"avatar avatar-"+l+" avatar-"+a+(w?" avatar-clickable":"")+(S?" avatar-image":k?" avatar-initials":" avatar-fallback")+(p?" "+p:""),sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",width:b.size+"px",height:b.size+"px",borderRadius:"50%",backgroundColor:C,color:I,fontFamily:"inherit",fontWeight:600,overflow:"hidden",flexShrink:0,border:S?Xn+" solid var(--Border)":k?Xn+" solid "+T:"none",...u&&{marginLeft:"2px",marginRight:"2px"},...w&&{cursor:"pointer",outline:"none",padding:0,transition:"background-color 0.15s ease, border-color 0.15s ease","&:hover":{backgroundColor:S?"rgba(0,0,0,0.08)":"var(--Buttons-Default-Hover)"},"&:active":{backgroundColor:S?"rgba(0,0,0,0.15)":"var(--Buttons-Default-Pressed)"},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"2px"}},...m},...f,children:[S&&de(h,{component:"img",src:y,alt:n||"Avatar",onError:()=>x(!0),sx:{width:"100%",height:"100%",objectFit:"cover",borderRadius:"50%"}}),k&&(()=>{const e=function(e){switch(e){case"xxx-small":case"xx-small":case"x-small":case"small":return Mn;case"medium":case"large":default:return Wn;case"x-large":case"xx-large":return On}}(l);return de(e,{sx:{color:"inherit",fontSize:(t=b.size,Math.round(7*t/12)+"px"),lineHeight:1,textAlign:"center",...jr},"aria-hidden":"true",children:o.slice(0,2).toUpperCase()});var t})(),B&&de(Qn,{size:l,sx:{color:"inherit"},children:i||de(me,{})})]})}function Kn({children:e,max:r=5,size:n="medium",spacing:o=-8,className:i="",sx:a={},...l}){const s=t.Children.toArray(e),d=s.slice(0,r),c=s.length-r;return ce(h,{role:"group","aria-label":"Avatar group, "+s.length+" avatars",className:"avatar-group "+i,sx:{display:"inline-flex",alignItems:"center","& > *:not(:first-of-type)":{marginLeft:o+"px"},...a},...l,children:[d,c>0&&de($n,{initials:"+"+c,size:n,color:"neutral",sx:{border:"2px solid var(--Background)",zIndex:0}})]})}const qn=["primary","secondary","tertiary","neutral","info","success","warning","error"],Yn=e=>e.charAt(0).toUpperCase()+e.slice(1);function Jn(){const e={};return qn.forEach(t=>{e[t]=function(e){const t=Yn(e);return{bg:"var(--Buttons-"+t+"-Button)",text:"var(--Buttons-"+t+"-Text)",border:"none"}}(t),e[t+"-outline"]=function(e){return{bg:"var(--Background)",text:"var(--Text)",border:"1px solid var(--Buttons-"+Yn(e)+"-Border)"}}(t),e[t+"-light"]=function(e){const t=Yn(e);return{bg:"var(--Buttons-"+t+"-Button)",text:"var(--Buttons-"+t+"-Text)",border:"1px solid var(--Buttons-"+t+"-Border)"}}(t)}),e}const Zn={small:{size:"var(--Sizing-2)",padX:"var(--Sizing-Half)",dot:"var(--Sizing-1)",digits:"var(--Sm-Button-Numbers)"},medium:{size:"var(--Sizing-2-and-Half)",padX:"6px",dot:"10px",digits:"var(--Button-Numbers)"},large:{size:"var(--Sizing-3)",padX:"var(--Sizing-1)",dot:"var(--Sizing-1-and-Half)",digits:"var(--Lg-Button-Numbers)"}};function _n({variant:e="primary",size:t="medium",badgeContent:r,max:n=99,showZero:o=!1,invisible:i=!1,dot:a=!1,overlap:l="rectangular",anchorOrigin:s={vertical:"top",horizontal:"right"},children:d,className:c="",sx:u={},...p}){const h=Jn(),f=h[e]||h.primary,g=Zn[t]||Zn.medium;let x=r;a?x="":"number"==typeof r&&r>n&&(x=n+"+");const b=i||!a&&!o&&(0===r||null==r),v={"& .MuiBadge-badge":{minWidth:a?g.dot:g.size,height:a?g.dot:g.size,padding:a?0:"0 "+g.padX,fontFamily:"var(--Button-Small-Font-Family)",fontWeight:"var(--Button-Small-Font-Weight)",lineHeight:"var(--Button-Small-Line-Height)",letterSpacing:"var(--Button-Small-Letter-Spacing)",fontSize:g.digits,borderRadius:a?g.dot:g.size,backgroundColor:f.bg,color:f.text,border:f.border,boxSizing:"border-box",boxShadow:"0 0 0 1px var(--Background)",transition:"transform 0.2s ease, opacity 0.2s ease"},...u};return de(m,{badgeContent:a?"":x,max:n,showZero:o,invisible:b,overlap:l,anchorOrigin:s,variant:a?"dot":"standard",className:"badge-"+e+" "+c,sx:v,...p,children:d})}const eo={1:[[.3,.5,.7,0,.41],[1.3,2.5,3.4,-1.2,.205]],2:[[.3,.5,.7,0,.41],[.6,1.2,1.6,-1.2,.273],[3,6,8.1,-2.5,.137]],3:[[.3,.5,.7,0,.41],[.3,.7,.9,-.6,.328],[1,2,2.7,-1.2,.246],[2.8,5.6,7.5,-1.9,.164],[6.3,12.5,16.9,-2.5,.082]],4:[[.3,.5,.7,0,.41],[.4,.7,1,-.5,.342],[1.2,2.4,3.2,-1,.273],[3.4,6.9,9.3,-1.5,.205],[7.8,15.6,21.1,-2,.137],[15,30,40.5,-2.5,.068]],5:[[.3,.5,.7,0,.41],[.4,.7,1,-.4,.359],[1.1,2.2,3,-.7,.308],[3.1,6.3,8.5,-1.1,.256],[7.1,14.2,19.2,-1.4,.205],[13.6,27.3,36.8,-1.8,.154],[23.4,46.8,63.2,-2.1,.103],[37,74,99.9,-2.5,.051]]};function to(e){return eo[e].map(function(e){return e[0]+"px "+e[1]+"px "+e[2]+"px "+e[3]+"px rgba(var(--Dropshadow-Color, 20, 20, 20), "+e[4]+")"}).join(", ")}const ro=(e,t)=>0===e?"none":"var(--Effect-Level-"+e+", "+t+")",no=ro(1,to(1)),oo=ro(2,to(2)),io=ro(3,to(3)),ao=ro(4,to(4)),lo=ro(5,to(5)),so={0:"none",1:no,2:oo,3:io,4:ao,5:lo},co={"black-white":"BlackWhite"},uo=e=>{return co[e]||(t=e).charAt(0).toUpperCase()+t.slice(1);var t},po={small:"Sm-",medium:"",large:"Lg-"};function ho(e,t){const r=uo(e),n=(e,t)=>`color-mix(in srgb, rgb(var(${e}, ${t})) calc(var(--Button-Bevel-Opacity, 0.5) * 100%), transparent)`,o="var(--_bevel)",i="calc(-1 * var(--_bevel))",a=po[t],l=void 0===a?(e,t)=>t:(e,t)=>`var(--${a}Button-${e}, ${t})`;return[`inset ${l("Lowlight-Offset-x",i)} ${l("Lowlight-Offset-y",i)} ${l("Lowlight-Blur-Radius",o)} ${l("Lowlight-Spread",i)} `+n(`--Buttons-${r}-Lowlight`,"0 0 0"),`inset ${l("Highlight-Offset-x",o)} ${l("Highlight-Offset-y",o)} ${l("Highlight-Blur-Radius",o)} ${l("Highlight-Spread",i)} `+n(`--Buttons-${r}-Highlight`,"255 255 255")].join(", ")}const mo={small:"var(--Sm-Button-Text-Padding)",medium:"var(--Button-Text-Padding)",large:"var(--Lg-Button-Text-Padding)"},fo=e=>"small"===e?"var(--Sm-Avatar-Text)":"large"===e?"var(--Lg-Avatar-Text)":"var(--Avatar-Text)",go={small:{avatar:"xxx-small",icon:"small"},medium:{avatar:"xx-small",icon:"medium"},large:{avatar:"small",icon:"large"}};function xo(e,r){if(!t.isValidElement(e))return e;const n=go[r]||go.medium;return e.type===$n?t.cloneElement(e,{size:n.avatar,insideButton:!0}):e.type===Qn?t.cloneElement(e,{size:n.icon}):e}const bo=["default","primary","secondary","tertiary","neutral","info","success","warning","error"],vo=uo;function yo(e,t=!1,r=!1,n="medium"){const o=vo(e),i=ho(e,n),a=t?no:"none";return{backgroundColor:`var(--Buttons-${o}-Button)`,color:`var(--Buttons-${o}-Text)`,border:`var(--Button-Border-Width) solid var(--Buttons-${o}-Border)`,boxShadow:"none"===a?i:`${i}, ${a}`,position:"relative",zIndex:1,"& .MuiTouchRipple-rippleVisible":{color:`var(--Buttons-${o}-Hover)`,zIndex:-1},"&:hover":{backgroundColor:`var(--Buttons-${o}-Hover)`,boxShadow:`${i}, ${t?oo:no}`,...!r&&{transform:"translateY(-1px)"}},"&:active":{backgroundColor:`var(--Buttons-${o}-Pressed)`,boxShadow:i,...!r&&{transform:"translateY(0)"}},"&.Mui-focusVisible":{backgroundColor:`var(--Buttons-${o}-Button)`,outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"},"& .MuiTouchRipple-root":{zIndex:-1},"& .MuiTypography-root":{zIndex:1},"& .MuiButton-icon":{zIndex:1}}}function So(e,t=!1){return{backgroundColor:"transparent",color:"var(--Text)",border:`var(--Button-Border-Width) solid var(--Buttons-${vo(e)}-Border)`,boxShadow:"none","& .MuiTouchRipple-rippleVisible":{color:"var(--Hover)"},"&:hover":{backgroundColor:"var(--Hover)",boxShadow:"none",...!t&&{transform:"translateY(-1px)"}},"&:active":{backgroundColor:"var(--Pressed)",...!t&&{transform:"translateY(0)"}},"&.Mui-focusVisible":{backgroundColor:"transparent",outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"}}}function ko(e,t=!1){return{backgroundColor:"transparent",color:e?"var(--Hotlink)":"var(--Quiet)",border:"var(--Button-Border-Width) solid transparent",boxShadow:"none",textDecoration:"none",...e&&{"& .btn-text-content":{textDecoration:"underline"}},"& .MuiTouchRipple-rippleVisible":{color:"var(--Hover)"},"&:hover":{backgroundColor:"var(--Hover)",boxShadow:"none",...!t&&{transform:"translateY(-1px)"},...e?{"& .btn-text-content":{textDecoration:"none"}}:{color:"var(--Text)"}},"&:active":{backgroundColor:"var(--Pressed)",...!t&&{transform:"translateY(0)"},...e?{"& .btn-text-content":{textDecoration:"none"}}:{color:"var(--Text)"}},"&.Mui-focusVisible":{backgroundColor:"transparent",outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px",...e&&{"& .btn-text-content":{textDecoration:"none"}}}}}const Bo=/-light$/,wo=new Set;const Co={small:"var(--Small-Button-Height)",medium:"var(--Button-Height)",large:"var(--Large-Button-Height)"},To={small:{minHeight:"var(--Small-Button-Height)",minWidth:"var(--Button-Min-Width)",fontSize:"var(--Sm-Button-Text)","--_height":"var(--Small-Button-Height)"},large:{minHeight:"var(--Large-Button-Height)",minWidth:"var(--Lg-Button-Min-Width, var(--Button-Min-Width))",fontSize:"var(--Lg-Button-Text)","--_height":"var(--Large-Button-Height)"},medium:{minHeight:"var(--Button-Height)",minWidth:"var(--Button-Min-Width)",fontSize:"var(--Button-Text)","--_height":"var(--Button-Height)"}};function Io({variant:e="default",size:r="medium",elevated:n=!1,selected:o=!1,fullWidth:i=!1,disabled:a=!1,iconOnly:l=!1,letterNumber:s=!1,avatar:d=!1,swatch:c=!1,swatchColor:u,startIcon:p,endIcon:m,startDecorator:b,endDecorator:v,badge:y=!1,badgeContent:S,badgeVariant:k="error",badgeSize:B,badgeDot:w=!1,badgeMax:C=99,badgeAnchorOrigin:T={vertical:"top",horizontal:"right"},children:I,className:A="",sx:z={},...R}){const E=l||d||c,P=E||s;if("production"!==process.env.NODE_ENV){const e=R["aria-label"]||R["aria-labelledby"]||R.title;P&&!e&&console.error('[OmniDesign] A <Button> with no visible text has no accessible name. A screen reader announces it as just "button" — or, for letterNumber, reads the characters ("123") as if they were the label. Add aria-label="…" describing the ACTION ("Your account"), not the content ("JD") or the icon ("trash").'),e&&t.Children.forEach(I,t=>{const r=t?.props?.["aria-label"]||t?.props?.titleAccess;r&&console.error('[OmniDesign] <Button> is labelled "'+e+'" but also contains an icon labelled "'+r+"\". A screen reader reads both. Remove the icon's label — the button owns the name.")})}const L=!E,M=i&&!E&&!s,W=function(e){const t=String(e||"default");if(!Bo.test(t))return t;const r=t.replace(Bo,"");return"production"===process.env.NODE_ENV||wo.has(t)||(wo.add(t),console.warn('[Button] variant="'+t+'" — the -light shape was removed. Rendering variant="'+r+'" (solid). Use a Buttons mode for colour and solid / -outline / ghost / text for shape.')),r}(!d&&!c||"ghost"!==e&&"text"!==e?e:"primary"),O=function(e,t=!1,r=!1,n="medium"){const o={};return bo.forEach(e=>{o[e]=yo(e,t,r,n),o[`${e}-outline`]=So(e,r)}),o["black-white"]=yo("black-white",t,r,n),o["black-white-outline"]=So("black-white",r),o.danger=yo("error",t,r,n),o.outline=So("default",r),o.ghost=ko(e,r),o.text=ko(e,r),o}(L,n,o,r),D=O[W]||O.default,F=function({size:e,iconOnly:t,letterNumber:r,avatar:n}){const o=To[e]||To.medium,i=Co[e]||Co.medium;if(t)return{height:i,width:i,minWidth:"unset",minHeight:"unset",fontSize:n?fo(e):"small"===e?"0.875rem":o.fontSize,padding:"0","--_height":i};return r?{...o,minHeight:i,minWidth:i,padding:"0"}:{...o,padding:"large"===e?"0 var(--Lg-Button-Padding)":"0 var(--Button-Padding)"}}({size:r,iconOnly:E,letterNumber:s,avatar:d}),N="small"===r?Fn:Nn,H=void 0!==b?xo(b,r):void 0,V=void 0!==v?xo(v,r):void 0,Q=B||("small"===r?"small":"large"===r?"large":"medium"),j=ce(ue,{children:[de(f,{styles:{'[class*="btn-"] .MuiButton-startIcon, [class*="btn-"] .MuiButton-icon':{marginLeft:"0px !important",marginRight:"2px !important"},'[class*="btn-"] .MuiButton-endIcon':{marginLeft:"2px !important",marginRight:"0px !important"},'[class*="btn-"] .MuiButton-iconSizeSmall .MuiSvgIcon-root, [class*="btn-"] .MuiButton-iconSizeSmall > *':{fontSize:"var(--Sm-Button-Icon) !important"},'[class*="btn-"] .MuiButton-iconSizeMedium .MuiSvgIcon-root, [class*="btn-"] .MuiButton-iconSizeMedium > *':{fontSize:"var(--Button-Icon) !important"},'[class*="btn-"] .MuiButton-iconSizeLarge .MuiSvgIcon-root, [class*="btn-"] .MuiButton-iconSizeLarge > *':{fontSize:"var(--Lg-Button-Icon) !important"}}}),de(g,{size:r,...M&&{fullWidth:!0},disabled:a,startIcon:void 0!==H?H:d?(()=>{if(d&&I){const e=Co[r]||Co.medium,t=fo(r);return de(x,{sx:{width:e,height:e,backgroundColor:"inherit",color:"inherit",fontSize:t},children:I})}return p})():p,endIcon:void 0!==V?V:m,className:`btn-${e} ${A}`,role:"button",sx:{borderRadius:d?"var(--Large-Button-Height)":l||c?"small"===r?"var(--Sm-Button-Icon-Radius, var(--Button-Icon-Radius))":"large"===r?"var(--Lg-Button-Icon-Radius, var(--Button-Icon-Radius))":"var(--Button-Icon-Radius)":"small"===r?"var(--Sm-Button-Radius, var(--Button-Radius))":"large"===r?"var(--Lg-Button-Radius, var(--Button-Radius))":"var(--Button-Radius)",textTransform:"none",fontWeight:"inherit",lineHeight:1,whiteSpace:"nowrap",flexShrink:0,transition:"background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, transform 0.15s ease-in-out","--_bevel":"min(calc(var(--Button-Bevel) * var(--_height) / 100), calc(var(--_height) / 5))",..."small"===r&&{position:"relative","&::before":{content:'""',position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)",width:"100%",height:"100%",minWidth:"var(--Target, 0px)",minHeight:"var(--Target, 0px)"}},...F,...D,"&.MuiButton-root":{padding:F.padding??"0 var(--Sizing-1)"},"& .MuiButton-startIcon":{display:"inherit",color:"inherit",marginLeft:"0px !important",marginRight:d?"0px !important":"2px !important"},...d&&{"& .MuiAvatar-root":{fontSize:fo(r)}},"& .MuiButton-endIcon":{display:"inherit",color:"inherit",marginLeft:"2px !important",marginRight:"0px !important"},"& .MuiSvgIcon-root":{color:"inherit"},"&:focus-visible, &.Mui-focusVisible":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"},"&.Mui-disabled":{opacity:.6,cursor:"not-allowed",pointerEvents:"none",backgroundColor:D.backgroundColor,color:D.color,border:D.border,boxShadow:"none"},...c&&{border:"var(--Button-Border-Width) solid var(--Border)",padding:"1px",width:Co[r]||Co.medium,height:Co[r]||Co.medium,minWidth:"unset",minHeight:"unset",boxShadow:"none","--_bevel":"0",backgroundColor:"transparent !important","&:hover":{backgroundColor:"transparent !important",boxShadow:"none"},"&:active":{boxShadow:"none"},"&:hover .btn-swatch-inner":{filter:"brightness(0.9)"}},...M&&{width:"100%"},...z},...R,...c?{style:{backgroundColor:"transparent"}}:{},children:d?null:c?de(h,{className:"btn-swatch-inner",style:{width:"100%",height:"100%",borderRadius:"small"===r?"var(--Sm-Button-Icon-Inner-Radius, calc(var(--Button-Icon-Radius) - 2px))":"large"===r?"var(--Lg-Button-Icon-Inner-Radius, calc(var(--Button-Icon-Radius) - 2px))":"var(--Button-Icon-Inner-Radius, calc(var(--Button-Icon-Radius) - 2px))",...u?{backgroundColor:u}:{}}}):(()=>{if(E)return I;if(s){return de("small"===r?Dn:N,{component:"span",sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",padding:"4px",color:"inherit",lineHeight:1,...jr},children:I})}return"string"==typeof I||"number"==typeof I?de(h,{component:"span",className:"btn-text-content",sx:{display:"inline-flex",alignItems:"center",padding:mo[r]||mo.medium},children:de(N,{component:"span",sx:{color:"inherit",...jr},children:I})}):I})()})]});return y?de(_n,{variant:k,size:Q,badgeContent:S,dot:w,max:C,anchorOrigin:T,showZero:0===S,children:j}):j}const Ao=["default","primary","secondary","tertiary","neutral","info","success","warning","error","black-white"],zo=e=>"Default"===e?"var(--Quiet)":"var(--Buttons-"+e+"-Border)";function Ro(){const e={};return Ao.forEach(t=>{e[t]=function(e){const t=uo(e);return{color:t,borderToken:zo(t),icon:"var(--Buttons-"+t+"-Border)"}}(t)}),e}const Eo=/-(outline|light|solid)$/,Po=new Set;function Lo(e){const t=Ro();return t[function(e){const t=String(e||"default");if(!Eo.test(t))return t;const r=t.replace(Eo,"");return"production"===process.env.NODE_ENV||Po.has(t)||(Po.add(t),console.warn('[Checkbox] variant="'+t+'" — the -outline/-light/-solid shapes were removed; a Checkbox has one look and `variant` selects colour only. Rendering variant="'+r+'". Update the call site.')),r}(e)]||t.default}const Mo={small:{box:16,icon:12,labelSize:"13px",gap:6,touchTarget:24},medium:{box:20,icon:14,labelSize:"15px",gap:8,touchTarget:24},large:{box:24,icon:18,labelSize:"17px",gap:10,touchTarget:24}};function Wo({size:e,variant:t,checked:r,indeterminate:n}){const o=Lo(t),i=Mo[e]||Mo.medium,a=r||n,l=o.borderToken,s="small"===e?"var(--Sm-Checkbox-Radius, 3.2px)":"large"===e?"var(--Lg-Checkbox-Radius, 4.8px)":"var(--Checkbox-Radius, 4px)";return de(h,{className:"chk-box-icon",sx:{width:i.box,height:i.box,boxSizing:"border-box",borderRadius:s,border:"2px solid "+l,overflow:"hidden",flexShrink:0,transition:"border-color 0.15s ease-in-out"},children:de(h,{sx:{width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:"var(--Background)",color:"var(--Text)",transition:"background-color 0.15s ease-in-out"},children:a&&de(n?fe:he,{sx:{fontSize:i.icon,color:o.icon}})})})}function Oo({size:e,variant:t}){return de(Wo,{size:e,variant:t,checked:!1,indeterminate:!1})}function Do({size:e,variant:t}){return de(Wo,{size:e,variant:t,checked:!0,indeterminate:!1})}function Fo({size:e,variant:t}){return de(Wo,{size:e,variant:t,checked:!1,indeterminate:!0})}function No({variant:e="primary",size:t="medium",label:r,checked:n,defaultChecked:o,indeterminate:i=!1,disabled:a=!1,onChange:l,name:s,value:d,className:c="",sx:u={},"aria-label":p,"aria-labelledby":h,"aria-describedby":m,inputProps:f={},...g}){Lo(e);const x=Mo[t]||Mo.medium,y="small"===t?ln:cn,S={...f,...p&&{"aria-label":p},...h&&{"aria-labelledby":h},...m&&{"aria-describedby":m}},k=de(b,{checked:n,defaultChecked:o,indeterminate:i,disabled:a,onChange:l,name:s,value:d,icon:de(Oo,{size:t,variant:e}),checkedIcon:de(Do,{size:t,variant:e}),indeterminateIcon:de(Fo,{size:t,variant:e}),className:"chk-"+e+" "+c,inputProps:S,disableRipple:!0,sx:{padding:(x.touchTarget-x.box)/2+"px",minWidth:24,minHeight:24,borderRadius:"var(--Checkbox-Radius, 4px)",color:"inherit",transition:"background-color 0.15s ease-in-out","&.Mui-checked, &.MuiCheckbox-indeterminate":{color:"inherit"},"&:hover":{backgroundColor:"transparent"},"&.Mui-focusVisible .chk-box-icon":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"},"&.Mui-disabled":{opacity:.6,cursor:"not-allowed",pointerEvents:"none"},...u},...g});return r?de(v,{control:k,label:de(y,{component:"span",sx:{color:a?"var(--Text-Quiet)":"var(--Text)",fontSize:x.labelSize,lineHeight:1.4,userSelect:"none"},children:r}),disabled:a,sx:{marginLeft:0,marginRight:0,gap:x.gap+"px",alignItems:"center","&.Mui-disabled .MuiTypography-root":{color:"var(--Text-Quiet)",opacity:.6}}}):k}const Ho=["primary","secondary","tertiary","neutral","info","success","warning","error"],Vo=e=>e.charAt(0).toUpperCase()+e.slice(1);function Qo(e){return{bg:"var(--Hover)",border:"var(--Buttons-"+Vo(e)+"-Border)",text:"var(--Text)",focusBg:"var(--Hover)"}}function jo(e){const t=Vo(e);return{bg:"var(--Buttons-"+t+"-Light-Button, var(--Hover))",border:"var(--Buttons-"+t+"-Border)",text:"var(--Text)",focusBg:"var(--Buttons-"+t+"-Light-Button, var(--Hover))"}}const Go={small:{height:"var(--Small-Button-Height)",fontSize:"13px",labelSize:"13px",padding:"4px var(--Input-Padding, 8px)",iconSize:16},medium:{height:"var(--Button-Height)",fontSize:"15px",labelSize:"15px",padding:"4px var(--Input-Padding, 12px)",iconSize:18},large:{height:"var(--Large-Button-Height)",fontSize:"17px",labelSize:"17px",padding:"4px var(--Input-Padding, 16px)",iconSize:20}},Uo={small:{height:"48px",fontSize:"13px",labelSize:"11px",padding:"20px var(--Input-Padding, 12px) 4px",padTop:20,padBottom:4,leftPad:12,iconSize:16},medium:{height:"56px",fontSize:"15px",labelSize:"12px",padding:"22px var(--Input-Padding, 14px) 6px",padTop:22,padBottom:6,leftPad:14,iconSize:18},large:{height:"64px",fontSize:"17px",labelSize:"14px",padding:"24px var(--Input-Padding, 16px) 6px",padTop:24,padBottom:6,leftPad:16,iconSize:20}},Xo={small:{resting:"Body-Small",shrunk:"Label-ExtraSmall"},medium:{resting:"Body-Medium",shrunk:"Label-Small"},large:{resting:"Body-Large",shrunk:"Label-Medium"}},$o=e=>({fontSize:"var(--"+e+"-Font-Size)",fontWeight:"var(--"+e+"-Font-Weight)",letterSpacing:"var(--"+e+"-Letter-Spacing)"});const Ko={info:ve,success:ge,warning:xe,error:be},qo={info:{border:"var(--Buttons-Info-Border)",icon:"var(--Icons-Info)",text:"var(--Hotlink)"},success:{border:"var(--Buttons-Success-Border)",icon:"var(--Icons-Success)",text:"var(--Text-Success)"},warning:{border:"var(--Buttons-Warning-Border)",icon:"var(--Icons-Warning)",text:"var(--Text-Warning)"},error:{border:"var(--Buttons-Error-Border)",icon:"var(--Icons-Error)",text:"var(--Text-Error)"}};function Yo({variant:e="primary-outline",size:t="medium",label:r,labelPosition:o="standard",placeholder:i,helperText:a,validation:l,validationMessage:s,disabled:d=!1,id:c,value:u,defaultValue:p,onChange:m,name:f,type:g="text",multiline:x=!1,rows:b,maxRows:v,resize:B="vertical",startAdornment:w,endAdornment:C,fullWidth:T=!1,className:I="",sx:A={},"aria-label":z,"aria-labelledby":R,"aria-describedby":E,"aria-required":P,"aria-invalid":L,inputProps:M={},...W}){const O=function(){const e={};return Ho.forEach(t=>{e[t+"-outline"]=Qo(t),e[t+"-light"]=jo(t)}),e.outline=Qo("primary"),e.light=jo("primary"),e}(),D=O[e]||O["primary-outline"],F="floating"===o;e.endsWith("-light");const N=F?Uo[t]||Uo.medium:Go[t]||Go.medium,H=n(),V=c||H,{labelX:Q,padX:j,restingY:G,shrunkY:U}=function(e,t){const r=parseInt(e.height,10)||56,n=parseInt(e.fontSize,10)||15,o="var(--Input-Padding, "+(e.leftPad||14)+"px)",i=(e.iconSize||18)+8;return{labelX:t?"calc("+o+" + "+i+"px)":o,padX:o,clearance:t?i:0,restingY:Math.round((r-1.4375*n)/2),shrunkY:6}}(N,!!w),X=Xo[t]||Xo.medium,$=e.replace(/-outline$/,"").replace(/-light$/,"");Vo($);const K="var(--Text)",q=l?qo[l]:null,Y=l?Ko[l]:null,J=q?q.border:D.border,Z={...M,...z&&{"aria-label":z},...R&&{"aria-labelledby":R},...E&&{"aria-describedby":E},...P&&{"aria-required":P},...L&&{"aria-invalid":L}};return ce(h,{className:"inp-"+e+" "+I,sx:{width:T?"100%":"auto",...A},children:[(()=>{if(!r||F)return null;return de("small"===t?ln:cn,{component:"label",htmlFor:V,sx:{display:"block",marginBottom:"6px",color:d?"var(--Quiet)":"var(--Text)",fontSize:N.labelSize,fontWeight:500,opacity:d?.6:1},children:r})})(),de(h,{sx:{border:"1px solid "+J,borderRadius:"small"===t?"var(--Sm-Input-Radius, var(--Input-Radius, var(--Style-Border-Radius)))":"large"===t?"var(--Lg-Input-Radius, var(--Input-Radius, var(--Style-Border-Radius)))":"var(--Input-Radius, var(--Style-Border-Radius))",overflow:"hidden",transition:"border-color 0.15s ease-in-out",boxShadow:"none","&:focus-within":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"}},children:de(h,{children:de(y,{value:u,defaultValue:p,onChange:m,name:f,type:g,disabled:d,placeholder:i,id:V,multiline:x,rows:b,maxRows:v,fullWidth:!0,label:F?r:void 0,variant:"outlined",size:"small"===t?"small":"medium",inputProps:Z,InputProps:{startAdornment:w?de(S,{position:"start",children:w}):void 0,endAdornment:(()=>{if(C)return de(S,{position:"end",children:C})})()},sx:{"& .MuiOutlinedInput-root":{backgroundColor:"var(--Hover)",color:"var(--Quiet)",fontSize:N.fontSize,minHeight:x?"auto":N.height,padding:0,borderRadius:0,transition:"color 0.15s ease-in-out",...F&&{alignItems:"stretch"},"& fieldset":{border:"none"},"&.Mui-focused":{color:K},"&:not(.Mui-focused) .MuiOutlinedInput-input:not(:placeholder-shown)":{color:K},"&.Mui-disabled":{opacity:.6,cursor:"not-allowed"},"& input":{padding:N.padding,color:"inherit","&::placeholder":{color:"var(--Quiet)",opacity:1}},"& textarea":{padding:N.padding,color:"inherit",resize:B,"&::placeholder":{color:"var(--Quiet)",opacity:1}},"& .MuiInputAdornment-root":{color:"var(--Quiet)"},...F&&{"& .MuiInputAdornment-root":{maxHeight:"none",height:"auto",alignSelf:"stretch",alignItems:"center",paddingTop:N.padTop+"px",paddingBottom:N.padBottom+"px",marginTop:0,marginBottom:0},"& .MuiInputAdornment-positionStart":{marginLeft:j,marginRight:"8px",width:N.iconSize+"px",minWidth:N.iconSize+"px",justifyContent:"center"},"& .MuiInputAdornment-positionEnd":{marginRight:"8px"},...w&&{"& input":{paddingLeft:0},"& textarea":{paddingLeft:0}}}},"& .MuiInputLabel-root":{color:"var(--Quiet)",fontFamily:"var(--Font-Families-Body, var(--Body-Font-Family))",...$o(X.resting),transformOrigin:"top left",transition:"transform 0.15s ease, font-size 0.15s ease, color 0.15s ease",transform:"translate("+Q+", "+G+"px)","&.MuiInputLabel-shrink":{transform:"translate("+Q+", "+U+"px)",...$o(X.shrunk),color:"var(--Quiet)"},"&.Mui-focused":{color:K},"&.Mui-disabled":{color:"var(--Quiet)",opacity:.6}},"& .MuiOutlinedInput-notchedOutline legend":{display:"none"},"& .MuiOutlinedInput-notchedOutline":{top:0},"& .MuiOutlinedInput-root.Mui-focused":{outline:"none"},"& .MuiOutlinedInput-root:focus-within":{outline:"none"}},...W})})}),l&&s?ce(h,{sx:{display:"flex",alignItems:"center",gap:"6px",marginTop:"4px",marginLeft:"2px"},children:[Y&&de(Y,{sx:{fontSize:N.iconSize,color:q.icon,flexShrink:0}}),de(k,{sx:{color:q.text,fontSize:"small"===t?"11px":"12px",margin:0},children:s})]}):a?de(k,{sx:{color:"var(--Quiet)",fontSize:"small"===t?"11px":"12px",marginTop:"4px",marginLeft:"2px"},children:a}):null]})}const Jo=e=>e.charAt(0).toUpperCase()+e.slice(1),Zo={small:{height:"var(--Small-Button-Height)",fontSize:"13px",padding:"4px 8px",iconSize:16},medium:{height:"var(--Button-Height)",fontSize:"14px",padding:"6px 12px",iconSize:18},large:{height:"var(--Large-Button-Height)",fontSize:"16px",padding:"8px 16px",iconSize:20}},_o={small:{height:48,fontSize:"13px",padding:"20px 12px 4px",labelSize:"11px",leftPad:12},medium:{height:56,fontSize:"14px",padding:"22px 14px 6px",labelSize:"12px",leftPad:14},large:{height:64,fontSize:"16px",padding:"24px 16px 6px",labelSize:"14px",leftPad:16}};function ei({options:e=[],value:n,defaultValue:l="",onChange:s,label:d,labelPosition:c="top",size:u="medium",variant:p="outline",color:m="primary",selectionStyle:f="default",mode:g="standard",placeholder:x="Select…",showDividers:b=!1,showColorLabels:v=!0,startDecoration:y,disabled:S=!1,fullWidth:k=!1,className:B="",sx:w={},...C}){const T="default"===m?"primary":m,I=Jo(T),A="var(--Buttons-"+I+"-Border)",z="default"===m?"var(--Text)":"var(--Text-"+I+")",[R,E]=r(l),[P,L]=r(!1),[M,W]=r(!1),[O,D]=r({top:0,left:0,width:0,direction:"down"}),F=o(null),N=o(null),[H,V]=r(null),[Q,j]=r(null),G=void 0!==n,U=G?n:R,X=e.flatMap(e=>e&&Array.isArray(e.options)?e.options:[e]).find(e=>("string"==typeof e?e:e.value)===U),$=X?"string"==typeof X?X:X.label:"",K=""!==U&&null!=U,q="floating"===c,Y="top"===c,J="color"===g,Z=q?_o[u]||_o.medium:Zo[u]||Zo.medium,_=i(e=>{G||E(e),s?.(e),L(!1),N.current?.focus()},[G,s]),ee=i(()=>{if(!N.current)return{top:0,left:0,width:0};const e=N.current.getBoundingClientRect(),t=window.innerHeight-e.bottom,r=e.top,n=t>=240||t>=r?"down":"up";return{top:"down"===n?e.bottom+4:void 0,bottom:"up"===n?window.innerHeight-e.top+4:void 0,left:e.left,width:e.width,direction:n}},[]),te=i(()=>{S||L(e=>(e||D(ee()),!e))},[S,ee]);a(()=>{if(!P)return;const e=e=>{!F.current||F.current.contains(e.target)||e.target.closest("[data-select-dropdown]")||L(!1)};return document.addEventListener("mousedown",e),()=>document.removeEventListener("mousedown",e)},[P]),a(()=>{if(!P||!N.current)return;const e=N.current.closest("[data-theme]"),t=N.current.closest("[data-surface]");V(e?.getAttribute("data-theme")||null),j(t?.getAttribute("data-surface")||null);const r=()=>D(ee());return window.addEventListener("scroll",r,!0),window.addEventListener("resize",r),()=>{window.removeEventListener("scroll",r,!0),window.removeEventListener("resize",r)}},[P,ee]);const re=o(null),ne=i(e=>{const t=re.current;if(!t)return;const r=t.querySelectorAll('[role="option"]');if(!r.length)return;const n=t.querySelector('[role="option"]:focus');let o=Array.prototype.indexOf.call(r,n);o="down"===e?o<r.length-1?o+1:0:o>0?o-1:r.length-1,r[o].focus()},[]);a(()=>{P&&requestAnimationFrame(()=>{const e=re.current;if(!e)return;const t=e.querySelector('[aria-selected="true"]'),r=e.querySelector('[role="option"]');(t||r)?.focus()})},[P]);const oe=P?ye.createPortal(de(h,{ref:re,"data-select-dropdown":!0,"data-theme":H||void 0,role:"listbox","aria-label":d||"Options",sx:{position:"fixed",top:O.top??"unset",bottom:O.bottom??"unset",left:O.left,width:O.width+"px",backgroundColor:"var(--Hover)",border:"1px solid var(--Buttons-Default-Border)",borderRadius:"var(--Dropdown-Frame-Radius, var(--Input-Radius, var(--Style-Border-Radius, 4px)))",boxShadow:"none",zIndex:99999,maxHeight:"240px",overflowY:"auto",py:.5},children:(()=>{const r=(e,r,n)=>{const o="string"==typeof e?e:e.value,i="string"==typeof e?e:e.label,a="object"==typeof e?e.color:null,l=o===U,s=function(e,t,r){const n=Jo(r||"default");return t?"solid"===e?{backgroundColor:"var(--Buttons-"+n+"-Button)",color:"var(--Buttons-"+n+"-Text)",border:"1px solid var(--Buttons-"+n+"-Border)",fontWeight:600}:"light"===e?{backgroundColor:"var(--Buttons-"+n+"-Light-Button)",color:"var(--Buttons-"+n+"-Light-Text)",border:"1px solid var(--Buttons-"+n+"-Light-Border)",fontWeight:600}:{backgroundColor:"var(--Buttons-"+n+"-Button)",color:"var(--Buttons-"+n+"-Text)",border:"1px solid var(--Buttons-"+n+"-Border)",fontWeight:600}:{color:"var(--Text)",backgroundColor:"transparent",border:"1px solid transparent"}}(f,l,T),d=r===n-1;return ce(t.Fragment,{children:[ce(h,{role:"option",tabIndex:-1,"aria-selected":l,"aria-label":J&&!v?i:void 0,onClick:()=>_(o),onKeyDown:e=>((e,t)=>{if("Enter"===e.key||" "===e.key)return e.preventDefault(),void _(t);"ArrowDown"===e.key&&(e.preventDefault(),ne("down")),"ArrowUp"===e.key&&(e.preventDefault(),ne("up")),"Escape"===e.key&&(L(!1),N.current?.focus())})(e,o),sx:{display:"flex",alignItems:"center",gap:1,px:1.5,py:0,mx:.5,my:"1px",minHeight:Z.height,cursor:"pointer",fontSize:Z.fontSize,fontFamily:"inherit",borderRadius:"4px",outline:"none",...s,transition:"background-color 0.1s ease","&:hover":l?{}:{backgroundColor:"var(--Buttons-"+I+"-Hover)",color:"var(--Buttons-"+I+"-Text)"},"&:active":l?{}:{backgroundColor:"var(--Buttons-"+I+"-Pressed)",color:"var(--Buttons-"+I+"-Text)"},"&:focus-visible":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"}},children:[J&&a&&de(h,{sx:{height:"calc("+Z.height+" - 8px)",width:"calc("+Z.height+" - 8px)",borderRadius:"var(--Input-Swatch-Radius, var(--Button-Radius))",backgroundColor:a,border:"1px solid "+(l?"var(--Buttons-"+I+"-Border)":"var(--Border)"),flexShrink:0}}),(!J||v)&&de(ln,{style:{flex:1,color:"inherit",fontWeight:"inherit"},children:i}),l&&de(Qn,{size:"small",sx:{opacity:.6,flexShrink:0},children:de(he,{})})]}),b&&!d&&de(h,{"aria-hidden":"true",sx:{height:"1px",backgroundColor:"var(--Border)",mx:1,my:.25}})]},o)};return e.map((n,o)=>{if(n&&Array.isArray(n.options)){const e=n.options;return ce(t.Fragment,{children:[de(h,{role:"presentation",sx:{px:1.5,pt:0===o?.75:1.25,pb:.5,fontSize:"11px",fontFamily:"inherit",fontWeight:700,letterSpacing:"0.06em",textTransform:"uppercase",color:"var(--Text-Quiet)"},children:n.label}),e.map((t,n)=>r(t,n,e.length))]},"group-"+(n.label||o))}return r(n,o,e.length)})})()}),document.body):null;return ce(h,{ref:F,className:"select-wrapper select-"+u+" select-label-"+c+" select-style-"+f+" select-variant-"+p+(P?" select-open":"")+(S?" select-disabled":"")+(B?" "+B:""),sx:{position:"relative",width:k?"100%":"auto",display:"inline-block",fontFamily:"inherit",...w},...C,children:[Y&&d&&de("small"===u?ln:cn,{component:"label",style:{display:"block",marginBottom:"6px",color:S?"var(--Quiet)":"var(--Text)",fontWeight:500,opacity:S?.6:1},children:d}),de(h,{sx:{border:"1px solid "+A,borderRadius:"var(--Input-Radius, var(--Style-Border-Radius))",overflow:"hidden",transition:"border-color 0.15s ease",boxShadow:"none","&:focus-within":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"}},children:de(h,{children:ce(h,{ref:N,component:"button",type:"button",role:"combobox","aria-expanded":P,"aria-haspopup":"listbox","aria-label":d||x,tabIndex:S?-1:0,onClick:te,onKeyDown:e=>"Escape"===e.key?(L(!1),void N.current?.focus()):"Enter"===e.key||" "===e.key?(e.preventDefault(),void te()):P||"ArrowDown"!==e.key&&"ArrowUp"!==e.key?(P&&"ArrowDown"===e.key&&(e.preventDefault(),ne("down")),void(P&&"ArrowUp"===e.key&&(e.preventDefault(),ne("up")))):(e.preventDefault(),void L(!0)),onFocus:()=>W(!0),onBlur:()=>W(!1),sx:{display:"flex",alignItems:"center",gap:1,width:"100%",minWidth:140,height:Z.height,padding:Z.padding,backgroundColor:"var(--Hover)",border:"none",borderRadius:0,color:K||P?z:"var(--Quiet)",fontSize:Z.fontSize,fontFamily:"inherit",cursor:S?"not-allowed":"pointer",opacity:S?.5:1,outline:"none",textAlign:"left",position:"relative",transition:"color 0.15s ease"},children:[y&&de(h,{sx:{display:"flex",alignItems:"center",flexShrink:0,color:"var(--Text-Quiet)"},children:y}),q&&d&&de(h,{sx:{position:"absolute",top:K||P?"6px":"50%",left:(Z.leftPad||14)+(y?32:0)+"px",transform:K||P?"scale(0.75)":"translateY(-50%)",transformOrigin:"top left",color:P?z:"var(--Quiet)",fontSize:Z.fontSize,fontWeight:400,pointerEvents:"none",transition:"top 0.15s ease, transform 0.15s ease, color 0.15s ease"},children:d}),de(h,{sx:{flex:1,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",...q&&{mt:K||P?"8px":0}},children:J&&K?ce(h,{sx:{display:"flex",alignItems:"center",gap:1},children:[de(h,{sx:{height:"calc("+Z.height+" - 8px)",width:"calc("+Z.height+" - 8px)",borderRadius:"var(--Input-Swatch-Radius, var(--Button-Radius))",backgroundColor:X&&"string"!=typeof X&&X.color||"transparent",border:"1px solid var(--Border)",flexShrink:0}}),v&&de(ln,{style:{color:"inherit",padding:0},children:$})]}):de(ln,{style:{color:"inherit",padding:0},children:K?$:q&&d?"":x})}),de(Se,{sx:{fontSize:(Z.iconSize||18)+"px",color:"var(--Text-Quiet)",transform:P?"rotate(180deg)":"rotate(0deg)",transition:"transform 0.2s ease",flexShrink:0}})]})})}),oe]})}const ti={default:"Default",primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info",success:"Success",warning:"Warning",error:"Error"},ri={default:"Default",primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info",success:"Success",warning:"Warning",error:"Error"},ni={default:"Default",primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info",success:"Success",warning:"Warning",error:"Error"},oi={small:{px:"var(--Sm-Button-Padding, 8px)",fontSize:"var(--Sm-Button-Text, 14px)",iconSize:"var(--Sm-Button-Icon, 20px)",textPad:"var(--Sm-Button-Text-Padding, 4px)",indicatorThickness:"2px",minHeight:"var(--Sm-Button-Height, 24px)"},medium:{px:"var(--Button-Padding, 8px)",fontSize:"var(--Button-Text, 16px)",iconSize:"var(--Button-Icon, 20px)",textPad:"var(--Button-Text-Padding, 4px)",indicatorThickness:"2px",minHeight:"var(--Button-Height, 32px)"},large:{px:"var(--Lg-Button-Padding, 16px)",fontSize:"var(--Lg-Button-Text, 20px)",iconSize:"var(--Lg-Button-Icon, 32px)",textPad:"var(--Lg-Button-Text-Padding, 8px)",indicatorThickness:"2px",minHeight:"var(--Lg-Button-Height, 56px)"}},ii=s({value:0,setValue:()=>{},variant:"standard",color:"primary",size:"medium",orientation:"horizontal",scrollable:!1,tabsId:""}),ai=()=>l(ii);function li({children:e,defaultValue:t=0,value:o,onChange:a,variant:l="standard",color:s="primary",size:d="medium",orientation:c="horizontal",scrollable:u=!1,className:p="",sx:m={},...f}){const[g,x]=r(t),b=void 0!==o,v=b?o:g,y=n(),S=i(e=>{b||x(e),a?.(e)},[b,a]);return de(ii.Provider,{value:{value:v,setValue:S,variant:l,color:s,size:d,orientation:c,scrollable:u,tabsId:y},children:de(h,{className:"tabs tabs-"+c+" tabs-"+d+" tabs-"+l+("standard"!==l?" tabs-"+s:"")+(u?" tabs-scrollable":"")+" "+p,sx:{display:"flex",flexDirection:"horizontal"===c?"column":"row",width:"100%",overflow:"hidden",...m},...f,children:e})})}function si({children:e,rounded:n=!1,className:l="",sx:s={},...d}){const{variant:c,color:u,size:p,orientation:m,scrollable:f,tabsId:g}=ai(),x=o(null),b=o(null),[v,y]=r(!1),[S,k]=r(!1),B="horizontal"===m,w="standard"===c,C="light"===c,T="dark"===c,I=w?void 0:"solid"===c?ti[u]:C?ri[u]:T?ni[u]:void 0,A=w?void 0:T?"Surface-Dimmest":C?"Surface-Brightest":"Surface",z=i(()=>{const e=b.current;e&&f&&B&&(y(e.scrollLeft>1),k(e.scrollLeft<e.scrollWidth-e.clientWidth-1))},[f,B]);a(()=>{z();const e=b.current;if(!e||!f)return;e.addEventListener("scroll",z,{passive:!0});const t=new ResizeObserver(z);return t.observe(e),()=>{e.removeEventListener("scroll",z),t.disconnect()}},[f,z]);const R=e=>{const t=b.current;if(!t)return;const r=.6*t.clientWidth;t.scrollBy({left:e*r,behavior:"smooth"})},E={display:"inline-flex",alignItems:"center",justifyContent:"center",width:"28px",minWidth:"28px",border:"none",backgroundColor:"transparent",color:"var(--Text-Quiet)",cursor:"pointer",fontSize:"16px",fontFamily:"inherit",lineHeight:1,flexShrink:0,transition:"color 0.15s ease, background-color 0.15s ease","&:hover":{color:"var(--Text)",backgroundColor:"var(--Hover)"},"&:active":{backgroundColor:"var(--Pressed)"},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"-3px"},"&:disabled":{opacity:.3,cursor:"default","&:hover":{backgroundColor:"transparent",color:"var(--Text-Quiet)"}}},P=t.Children.toArray(e).filter(t.isValidElement).map((e,r)=>t.cloneElement(e,{_index:r,key:e.key||r}));return ce(h,{ref:x,"data-theme":I||void 0,"data-surface":A||void 0,className:"tab-list tab-list-"+c+" tab-list-"+p+" tab-list-"+m+(f?" tab-list-scrollable":"")+" "+l,onKeyDown:e=>{const t=f?b.current:x.current,r=t?.querySelectorAll('[role="tab"]:not([aria-disabled="true"])');if(!r?.length)return;const n=Array.from(r).indexOf(document.activeElement);if(n<0)return;const o=B?"ArrowRight":"ArrowDown",i=B?"ArrowLeft":"ArrowUp";if(e.key===o){e.preventDefault();const t=r[(n+1)%r.length];t.focus(),f&&t.scrollIntoView({block:"nearest",inline:"nearest",behavior:"smooth"})}else if(e.key===i){e.preventDefault();const t=r[(n-1+r.length)%r.length];t.focus(),f&&t.scrollIntoView({block:"nearest",inline:"nearest",behavior:"smooth"})}else"Home"===e.key?(e.preventDefault(),r[0].focus(),f&&r[0].scrollIntoView({block:"nearest",inline:"nearest",behavior:"smooth"})):"End"===e.key&&(e.preventDefault(),r[r.length-1].focus(),f&&r[r.length-1].scrollIntoView({block:"nearest",inline:"nearest",behavior:"smooth"}))},sx:{display:"flex",flexDirection:B?"row":"column",gap:0,position:"relative",backgroundColor:"var(--Background)",padding:"4px",overflow:"hidden",borderRadius:n?"var(--Style-Border-Radius)":0,...s},...d,children:[f&&B&&de(h,{component:"button","aria-label":"Scroll tabs left",onClick:()=>R(-1),disabled:!v,className:"tab-list-scroll-btn tab-list-scroll-btn-left",sx:E,children:"‹"}),de(h,f&&B?{ref:b,role:"tablist","aria-orientation":m,className:"tab-list-scroll-container",sx:{display:"flex",flexDirection:"row",overflowX:"auto",scrollbarWidth:"none","&::-webkit-scrollbar":{display:"none"},flex:1,minWidth:0},children:P}:{ref:b,role:"tablist","aria-orientation":m,sx:{display:"flex",flexDirection:B?"row":"column",flex:1},children:P}),f&&B&&de(h,{component:"button","aria-label":"Scroll tabs right",onClick:()=>R(1),disabled:!S,className:"tab-list-scroll-btn tab-list-scroll-btn-right",sx:E,children:"›"})]})}function di({children:e,value:t,_index:r=0,disabled:n=!1,startDecorator:o,endDecorator:i,iconOnly:a=!1,className:l="",sx:s={},...d}){const{value:c,setValue:u,variant:p,color:m,size:f,orientation:g,tabsId:x}=ai(),b=oi[f]||oi.medium,v="horizontal"===g,y="standard"===p,S="light"===p,k="dark"===p,B=void 0!==t?t:r,w=c===B,C=y?"var(--Buttons-"+({default:"Default",primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info",success:"Success",warning:"Warning",error:"Error"}[m]||"Default")+"-Border)":"var(--Text)";return ce(h,{component:"button",role:"tab",id:"tab-"+x+"-"+B,"data-theme":(y?void 0:"solid"===p?ti[m]:S?ri[m]:k?ni[m]:void 0)||void 0,"data-surface":(y?void 0:k?"Surface-Dimmest":S?"Surface-Brightest":"Surface")||void 0,"aria-selected":w,"aria-controls":"tabpanel-"+x+"-"+B,"aria-disabled":n||void 0,tabIndex:w?0:-1,onClick:()=>{n||u(B)},className:"tab tab-"+f+(w?" tab-selected":"")+(n?" tab-disabled":"")+(a?" tab-icon-only":"")+" "+l,sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",gap:"2px",padding:"0 "+(a?"0":b.px),minHeight:b.minHeight,fontSize:b.fontSize,fontFamily:"inherit",fontWeight:500,lineHeight:1.3,color:w?"var(--Text)":"var(--Quiet)",backgroundColor:"transparent",border:"none",borderBottom:v?w?b.indicatorThickness+" solid "+C:b.indicatorThickness+" solid transparent":"none",borderRight:v?"none":w?b.indicatorThickness+" solid "+C:b.indicatorThickness+" solid transparent",cursor:n?"not-allowed":"pointer",opacity:n?.5:1,position:"relative",outline:"none",transition:"color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease",flexShrink:0,whiteSpace:"nowrap",...!n&&{"&:hover":{backgroundColor:"var(--Hover)"},"&:active":{backgroundColor:"var(--Pressed)"},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"-3px"}},...s},...d,children:[o&&de(h,{className:"tab-start-decorator",sx:{display:"inline-flex",fontSize:b.iconSize,lineHeight:1,flexShrink:0},children:o}),!a&&e&&(()=>{const t="small"===f?bn:ln;return de(h,{className:"tab-label",sx:{display:"inline-flex",alignItems:"center",padding:"4px "+b.textPad},children:de(t,{style:{color:"inherit",fontWeight:"inherit"},children:e})})})(),i&&de(h,{className:"tab-end-decorator",sx:{display:"inline-flex",fontSize:b.iconSize,lineHeight:1,flexShrink:0},children:i})]})}function ci({children:e,value:t,className:r="",sx:n={},...o}){const{value:i,size:a,tabsId:l}=ai();return i===t?de(h,{role:"tabpanel",id:"tabpanel-"+l+"-"+t,"aria-labelledby":"tab-"+l+"-"+t,className:"tab-panel tab-panel-"+a+" "+r,sx:{paddingTop:"16px",fontSize:(oi[a]||oi.medium).fontSize,fontFamily:"inherit",color:"var(--Text)",...n},...o,children:e}):null}const ui=t.forwardRef(function({theme:e=null,surface:t="Surface",children:r,minHeight:n=160,sx:o={}},i){return de(h,{ref:i,"data-theme":e||void 0,"data-surface":t,sx:{p:4,display:"flex",alignItems:"center",justifyContent:"center",minHeight:n,backgroundColor:"var(--Background)",borderBottom:"1px solid var(--Border)",...o},children:r})}),pi="__null__",hi=[{label:"Default",value:pi},{label:"Primary",value:"Primary"},{label:"Secondary",value:"Secondary"},{label:"Tertiary",value:"Tertiary"},{label:"Neutral",value:"Neutral"},{label:"Info",value:"Info"},{label:"Success",value:"Success"},{label:"Warning",value:"Warning"},{label:"Error",value:"Error"}],mi=["Surface-Dimmest","Surface-Dim","Surface","Surface-Bright","Surface-Brightest","Container","Container-Highest","Container-High","Container-Low","Container-Lowest"];function fi({theme:e=null,onThemeChange:t,surface:r="Surface",onSurfaceChange:n,surfaces:o=mi,size:i="small"}){const a=o.map(e=>({value:e,label:e}));return ce(B,{direction:"row",spacing:1,sx:{alignItems:"center"},children:[de(h,{sx:{width:160},children:de(ei,{options:hi,value:e??pi,onChange:e=>t?.(e===pi?null:e),labelPosition:"none",size:i,variant:"outline",color:"default","aria-label":"Background theme",fullWidth:!0})}),de(h,{sx:{width:180},children:de(ei,{options:a,value:r,onChange:e=>n?.(e),labelPosition:"none",size:i,variant:"outline",color:"default","aria-label":"Surface",fullWidth:!0})})]})}function gi(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var xi,bi={exports:{}},vi={exports:{}},yi={};var Si,ki,Bi,wi,Ci,Ti,Ii,Ai,zi,Ri,Ei,Pi,Li,Mi,Wi={};
2
2
  /** @license React v16.13.1
3
3
  * react-is.development.js
4
4
  *
@@ -6,12 +6,12 @@ import*as e from"react";import t,{useState as r,useRef as o,useCallback as n,use
6
6
  *
7
7
  * This source code is licensed under the MIT license found in the
8
8
  * LICENSE file in the root directory of this source tree.
9
- */function Mi(){return Si||(Si=1,"production"===process.env.NODE_ENV?bi.exports=function(){if(gi)return vi;gi=1;var e="function"==typeof Symbol&&Symbol.for,t=e?Symbol.for("react.element"):60103,r=e?Symbol.for("react.portal"):60106,o=e?Symbol.for("react.fragment"):60107,n=e?Symbol.for("react.strict_mode"):60108,i=e?Symbol.for("react.profiler"):60114,a=e?Symbol.for("react.provider"):60109,l=e?Symbol.for("react.context"):60110,s=e?Symbol.for("react.async_mode"):60111,d=e?Symbol.for("react.concurrent_mode"):60111,c=e?Symbol.for("react.forward_ref"):60112,u=e?Symbol.for("react.suspense"):60113,p=e?Symbol.for("react.suspense_list"):60120,h=e?Symbol.for("react.memo"):60115,m=e?Symbol.for("react.lazy"):60116,f=e?Symbol.for("react.block"):60121,g=e?Symbol.for("react.fundamental"):60117,x=e?Symbol.for("react.responder"):60118,b=e?Symbol.for("react.scope"):60119;function v(e){if("object"==typeof e&&null!==e){var p=e.$$typeof;switch(p){case t:switch(e=e.type){case s:case d:case o:case i:case n:case u:return e;default:switch(e=e&&e.$$typeof){case l:case c:case m:case h:case a:return e;default:return p}}case r:return p}}}function y(e){return v(e)===d}return vi.AsyncMode=s,vi.ConcurrentMode=d,vi.ContextConsumer=l,vi.ContextProvider=a,vi.Element=t,vi.ForwardRef=c,vi.Fragment=o,vi.Lazy=m,vi.Memo=h,vi.Portal=r,vi.Profiler=i,vi.StrictMode=n,vi.Suspense=u,vi.isAsyncMode=function(e){return y(e)||v(e)===s},vi.isConcurrentMode=y,vi.isContextConsumer=function(e){return v(e)===l},vi.isContextProvider=function(e){return v(e)===a},vi.isElement=function(e){return"object"==typeof e&&null!==e&&e.$$typeof===t},vi.isForwardRef=function(e){return v(e)===c},vi.isFragment=function(e){return v(e)===o},vi.isLazy=function(e){return v(e)===m},vi.isMemo=function(e){return v(e)===h},vi.isPortal=function(e){return v(e)===r},vi.isProfiler=function(e){return v(e)===i},vi.isStrictMode=function(e){return v(e)===n},vi.isSuspense=function(e){return v(e)===u},vi.isValidElementType=function(e){return"string"==typeof e||"function"==typeof e||e===o||e===d||e===i||e===n||e===u||e===p||"object"==typeof e&&null!==e&&(e.$$typeof===m||e.$$typeof===h||e.$$typeof===a||e.$$typeof===l||e.$$typeof===c||e.$$typeof===g||e.$$typeof===x||e.$$typeof===b||e.$$typeof===f)},vi.typeOf=v,vi}():bi.exports=(yi||(yi=1,"production"!==process.env.NODE_ENV&&function(){var e="function"==typeof Symbol&&Symbol.for,t=e?Symbol.for("react.element"):60103,r=e?Symbol.for("react.portal"):60106,o=e?Symbol.for("react.fragment"):60107,n=e?Symbol.for("react.strict_mode"):60108,i=e?Symbol.for("react.profiler"):60114,a=e?Symbol.for("react.provider"):60109,l=e?Symbol.for("react.context"):60110,s=e?Symbol.for("react.async_mode"):60111,d=e?Symbol.for("react.concurrent_mode"):60111,c=e?Symbol.for("react.forward_ref"):60112,u=e?Symbol.for("react.suspense"):60113,p=e?Symbol.for("react.suspense_list"):60120,h=e?Symbol.for("react.memo"):60115,m=e?Symbol.for("react.lazy"):60116,f=e?Symbol.for("react.block"):60121,g=e?Symbol.for("react.fundamental"):60117,x=e?Symbol.for("react.responder"):60118,b=e?Symbol.for("react.scope"):60119;function v(e){if("object"==typeof e&&null!==e){var p=e.$$typeof;switch(p){case t:var f=e.type;switch(f){case s:case d:case o:case i:case n:case u:return f;default:var g=f&&f.$$typeof;switch(g){case l:case c:case m:case h:case a:return g;default:return p}}case r:return p}}}var y=s,S=d,k=l,B=a,w=t,C=c,T=o,I=m,A=h,z=r,R=i,E=n,P=u,O=!1;function L(e){return v(e)===d}Li.AsyncMode=y,Li.ConcurrentMode=S,Li.ContextConsumer=k,Li.ContextProvider=B,Li.Element=w,Li.ForwardRef=C,Li.Fragment=T,Li.Lazy=I,Li.Memo=A,Li.Portal=z,Li.Profiler=R,Li.StrictMode=E,Li.Suspense=P,Li.isAsyncMode=function(e){return O||(O=!0,console.warn("The ReactIs.isAsyncMode() alias has been deprecated, and will be removed in React 17+. Update your code to use ReactIs.isConcurrentMode() instead. It has the exact same API.")),L(e)||v(e)===s},Li.isConcurrentMode=L,Li.isContextConsumer=function(e){return v(e)===l},Li.isContextProvider=function(e){return v(e)===a},Li.isElement=function(e){return"object"==typeof e&&null!==e&&e.$$typeof===t},Li.isForwardRef=function(e){return v(e)===c},Li.isFragment=function(e){return v(e)===o},Li.isLazy=function(e){return v(e)===m},Li.isMemo=function(e){return v(e)===h},Li.isPortal=function(e){return v(e)===r},Li.isProfiler=function(e){return v(e)===i},Li.isStrictMode=function(e){return v(e)===n},Li.isSuspense=function(e){return v(e)===u},Li.isValidElementType=function(e){return"string"==typeof e||"function"==typeof e||e===o||e===d||e===i||e===n||e===u||e===p||"object"==typeof e&&null!==e&&(e.$$typeof===m||e.$$typeof===h||e.$$typeof===a||e.$$typeof===l||e.$$typeof===c||e.$$typeof===g||e.$$typeof===x||e.$$typeof===b||e.$$typeof===f)},Li.typeOf=v}()),Li)),bi.exports}
9
+ */function Oi(){return ki||(ki=1,"production"===process.env.NODE_ENV?vi.exports=function(){if(xi)return yi;xi=1;var e="function"==typeof Symbol&&Symbol.for,t=e?Symbol.for("react.element"):60103,r=e?Symbol.for("react.portal"):60106,n=e?Symbol.for("react.fragment"):60107,o=e?Symbol.for("react.strict_mode"):60108,i=e?Symbol.for("react.profiler"):60114,a=e?Symbol.for("react.provider"):60109,l=e?Symbol.for("react.context"):60110,s=e?Symbol.for("react.async_mode"):60111,d=e?Symbol.for("react.concurrent_mode"):60111,c=e?Symbol.for("react.forward_ref"):60112,u=e?Symbol.for("react.suspense"):60113,p=e?Symbol.for("react.suspense_list"):60120,h=e?Symbol.for("react.memo"):60115,m=e?Symbol.for("react.lazy"):60116,f=e?Symbol.for("react.block"):60121,g=e?Symbol.for("react.fundamental"):60117,x=e?Symbol.for("react.responder"):60118,b=e?Symbol.for("react.scope"):60119;function v(e){if("object"==typeof e&&null!==e){var p=e.$$typeof;switch(p){case t:switch(e=e.type){case s:case d:case n:case i:case o:case u:return e;default:switch(e=e&&e.$$typeof){case l:case c:case m:case h:case a:return e;default:return p}}case r:return p}}}function y(e){return v(e)===d}return yi.AsyncMode=s,yi.ConcurrentMode=d,yi.ContextConsumer=l,yi.ContextProvider=a,yi.Element=t,yi.ForwardRef=c,yi.Fragment=n,yi.Lazy=m,yi.Memo=h,yi.Portal=r,yi.Profiler=i,yi.StrictMode=o,yi.Suspense=u,yi.isAsyncMode=function(e){return y(e)||v(e)===s},yi.isConcurrentMode=y,yi.isContextConsumer=function(e){return v(e)===l},yi.isContextProvider=function(e){return v(e)===a},yi.isElement=function(e){return"object"==typeof e&&null!==e&&e.$$typeof===t},yi.isForwardRef=function(e){return v(e)===c},yi.isFragment=function(e){return v(e)===n},yi.isLazy=function(e){return v(e)===m},yi.isMemo=function(e){return v(e)===h},yi.isPortal=function(e){return v(e)===r},yi.isProfiler=function(e){return v(e)===i},yi.isStrictMode=function(e){return v(e)===o},yi.isSuspense=function(e){return v(e)===u},yi.isValidElementType=function(e){return"string"==typeof e||"function"==typeof e||e===n||e===d||e===i||e===o||e===u||e===p||"object"==typeof e&&null!==e&&(e.$$typeof===m||e.$$typeof===h||e.$$typeof===a||e.$$typeof===l||e.$$typeof===c||e.$$typeof===g||e.$$typeof===x||e.$$typeof===b||e.$$typeof===f)},yi.typeOf=v,yi}():vi.exports=(Si||(Si=1,"production"!==process.env.NODE_ENV&&function(){var e="function"==typeof Symbol&&Symbol.for,t=e?Symbol.for("react.element"):60103,r=e?Symbol.for("react.portal"):60106,n=e?Symbol.for("react.fragment"):60107,o=e?Symbol.for("react.strict_mode"):60108,i=e?Symbol.for("react.profiler"):60114,a=e?Symbol.for("react.provider"):60109,l=e?Symbol.for("react.context"):60110,s=e?Symbol.for("react.async_mode"):60111,d=e?Symbol.for("react.concurrent_mode"):60111,c=e?Symbol.for("react.forward_ref"):60112,u=e?Symbol.for("react.suspense"):60113,p=e?Symbol.for("react.suspense_list"):60120,h=e?Symbol.for("react.memo"):60115,m=e?Symbol.for("react.lazy"):60116,f=e?Symbol.for("react.block"):60121,g=e?Symbol.for("react.fundamental"):60117,x=e?Symbol.for("react.responder"):60118,b=e?Symbol.for("react.scope"):60119;function v(e){if("object"==typeof e&&null!==e){var p=e.$$typeof;switch(p){case t:var f=e.type;switch(f){case s:case d:case n:case i:case o:case u:return f;default:var g=f&&f.$$typeof;switch(g){case l:case c:case m:case h:case a:return g;default:return p}}case r:return p}}}var y=s,S=d,k=l,B=a,w=t,C=c,T=n,I=m,A=h,z=r,R=i,E=o,P=u,L=!1;function M(e){return v(e)===d}Wi.AsyncMode=y,Wi.ConcurrentMode=S,Wi.ContextConsumer=k,Wi.ContextProvider=B,Wi.Element=w,Wi.ForwardRef=C,Wi.Fragment=T,Wi.Lazy=I,Wi.Memo=A,Wi.Portal=z,Wi.Profiler=R,Wi.StrictMode=E,Wi.Suspense=P,Wi.isAsyncMode=function(e){return L||(L=!0,console.warn("The ReactIs.isAsyncMode() alias has been deprecated, and will be removed in React 17+. Update your code to use ReactIs.isConcurrentMode() instead. It has the exact same API.")),M(e)||v(e)===s},Wi.isConcurrentMode=M,Wi.isContextConsumer=function(e){return v(e)===l},Wi.isContextProvider=function(e){return v(e)===a},Wi.isElement=function(e){return"object"==typeof e&&null!==e&&e.$$typeof===t},Wi.isForwardRef=function(e){return v(e)===c},Wi.isFragment=function(e){return v(e)===n},Wi.isLazy=function(e){return v(e)===m},Wi.isMemo=function(e){return v(e)===h},Wi.isPortal=function(e){return v(e)===r},Wi.isProfiler=function(e){return v(e)===i},Wi.isStrictMode=function(e){return v(e)===o},Wi.isSuspense=function(e){return v(e)===u},Wi.isValidElementType=function(e){return"string"==typeof e||"function"==typeof e||e===n||e===d||e===i||e===o||e===u||e===p||"object"==typeof e&&null!==e&&(e.$$typeof===m||e.$$typeof===h||e.$$typeof===a||e.$$typeof===l||e.$$typeof===c||e.$$typeof===g||e.$$typeof===x||e.$$typeof===b||e.$$typeof===f)},Wi.typeOf=v}()),Wi)),vi.exports}
10
10
  /*
11
11
  object-assign
12
12
  (c) Sindre Sorhus
13
13
  @license MIT
14
- */function Wi(){if(Bi)return ki;Bi=1;var e=Object.getOwnPropertySymbols,t=Object.prototype.hasOwnProperty,r=Object.prototype.propertyIsEnumerable;return ki=function(){try{if(!Object.assign)return!1;var e=new String("abc");if(e[5]="de","5"===Object.getOwnPropertyNames(e)[0])return!1;for(var t={},r=0;r<10;r++)t["_"+String.fromCharCode(r)]=r;if("0123456789"!==Object.getOwnPropertyNames(t).map(function(e){return t[e]}).join(""))return!1;var o={};return"abcdefghijklmnopqrst".split("").forEach(function(e){o[e]=e}),"abcdefghijklmnopqrst"===Object.keys(Object.assign({},o)).join("")}catch(e){return!1}}()?Object.assign:function(o,n){for(var i,a,l=function(e){if(null==e)throw new TypeError("Object.assign cannot be called with null or undefined");return Object(e)}(o),s=1;s<arguments.length;s++){for(var d in i=Object(arguments[s]))t.call(i,d)&&(l[d]=i[d]);if(e){a=e(i);for(var c=0;c<a.length;c++)r.call(i,a[c])&&(l[a[c]]=i[a[c]])}}return l},ki}function Di(){if(Ci)return wi;Ci=1;return wi="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"}function Fi(){return Ii?Ti:(Ii=1,Ti=Function.call.bind(Object.prototype.hasOwnProperty))}if("production"!==process.env.NODE_ENV){var Ni=Mi();xi.exports=function(){if(Ei)return Ri;Ei=1;var e=Mi(),t=Wi(),r=Di(),o=Fi(),n=function(){if(zi)return Ai;zi=1;var e=function(){};if("production"!==process.env.NODE_ENV){var t=Di(),r={},o=Fi();e=function(e){var t="Warning: "+e;"undefined"!=typeof console&&console.error(t);try{throw new Error(t)}catch(e){}}}function n(n,i,a,l,s){if("production"!==process.env.NODE_ENV)for(var d in n)if(o(n,d)){var c;try{if("function"!=typeof n[d]){var u=Error((l||"React class")+": "+a+" type `"+d+"` is invalid; it must be a function, usually from the `prop-types` package, but received `"+typeof n[d]+"`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");throw u.name="Invariant Violation",u}c=n[d](i,d,l,a,null,t)}catch(e){c=e}if(!c||c instanceof Error||e((l||"React class")+": type specification of "+a+" `"+d+"` is invalid; the type checker function must return `null` or an `Error` but returned a "+typeof c+". You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument)."),c instanceof Error&&!(c.message in r)){r[c.message]=!0;var p=s?s():"";e("Failed "+a+" type: "+c.message+(null!=p?p:""))}}}return n.resetWarningCache=function(){"production"!==process.env.NODE_ENV&&(r={})},Ai=n}(),i=function(){};function a(){return null}return"production"!==process.env.NODE_ENV&&(i=function(e){var t="Warning: "+e;"undefined"!=typeof console&&console.error(t);try{throw new Error(t)}catch(e){}}),Ri=function(l,s){var d="function"==typeof Symbol&&Symbol.iterator,c="<<anonymous>>",u={array:f("array"),bigint:f("bigint"),bool:f("boolean"),func:f("function"),number:f("number"),object:f("object"),string:f("string"),symbol:f("symbol"),any:m(a),arrayOf:function(e){return m(function(t,o,n,i,a){if("function"!=typeof e)return new h("Property `"+a+"` of component `"+n+"` has invalid PropType notation inside arrayOf.");var l=t[o];if(!Array.isArray(l))return new h("Invalid "+i+" `"+a+"` of type `"+b(l)+"` supplied to `"+n+"`, expected an array.");for(var s=0;s<l.length;s++){var d=e(l,s,n,i,a+"["+s+"]",r);if(d instanceof Error)return d}return null})},element:m(function(e,t,r,o,n){var i=e[t];return l(i)?null:new h("Invalid "+o+" `"+n+"` of type `"+b(i)+"` supplied to `"+r+"`, expected a single ReactElement.")}),elementType:m(function(t,r,o,n,i){var a=t[r];return e.isValidElementType(a)?null:new h("Invalid "+n+" `"+i+"` of type `"+b(a)+"` supplied to `"+o+"`, expected a single ReactElement type.")}),instanceOf:function(e){return m(function(t,r,o,n,i){if(!(t[r]instanceof e)){var a=e.name||c;return new h("Invalid "+n+" `"+i+"` of type `"+((l=t[r]).constructor&&l.constructor.name?l.constructor.name:c)+"` supplied to `"+o+"`, expected instance of `"+a+"`.")}var l;return null})},node:m(function(e,t,r,o,n){return x(e[t])?null:new h("Invalid "+o+" `"+n+"` supplied to `"+r+"`, expected a ReactNode.")}),objectOf:function(e){return m(function(t,n,i,a,l){if("function"!=typeof e)return new h("Property `"+l+"` of component `"+i+"` has invalid PropType notation inside objectOf.");var s=t[n],d=b(s);if("object"!==d)return new h("Invalid "+a+" `"+l+"` of type `"+d+"` supplied to `"+i+"`, expected an object.");for(var c in s)if(o(s,c)){var u=e(s,c,i,a,l+"."+c,r);if(u instanceof Error)return u}return null})},oneOf:function(e){return Array.isArray(e)?m(function(t,r,o,n,i){for(var a=t[r],l=0;l<e.length;l++)if(p(a,e[l]))return null;var s=JSON.stringify(e,function(e,t){return"symbol"===v(t)?String(t):t});return new h("Invalid "+n+" `"+i+"` of value `"+String(a)+"` supplied to `"+o+"`, expected one of "+s+".")}):("production"!==process.env.NODE_ENV&&i(arguments.length>1?"Invalid arguments supplied to oneOf, expected an array, got "+arguments.length+" arguments. A common mistake is to write oneOf(x, y, z) instead of oneOf([x, y, z]).":"Invalid argument supplied to oneOf, expected an array."),a)},oneOfType:function(e){if(!Array.isArray(e))return"production"!==process.env.NODE_ENV&&i("Invalid argument supplied to oneOfType, expected an instance of array."),a;for(var t=0;t<e.length;t++){var n=e[t];if("function"!=typeof n)return i("Invalid argument supplied to oneOfType. Expected an array of check functions, but received "+y(n)+" at index "+t+"."),a}return m(function(t,n,i,a,l){for(var s=[],d=0;d<e.length;d++){var c=(0,e[d])(t,n,i,a,l,r);if(null==c)return null;c.data&&o(c.data,"expectedType")&&s.push(c.data.expectedType)}return new h("Invalid "+a+" `"+l+"` supplied to `"+i+"`"+(s.length>0?", expected one of type ["+s.join(", ")+"]":"")+".")})},shape:function(e){return m(function(t,o,n,i,a){var l=t[o],s=b(l);if("object"!==s)return new h("Invalid "+i+" `"+a+"` of type `"+s+"` supplied to `"+n+"`, expected `object`.");for(var d in e){var c=e[d];if("function"!=typeof c)return g(n,i,a,d,v(c));var u=c(l,d,n,i,a+"."+d,r);if(u)return u}return null})},exact:function(e){return m(function(n,i,a,l,s){var d=n[i],c=b(d);if("object"!==c)return new h("Invalid "+l+" `"+s+"` of type `"+c+"` supplied to `"+a+"`, expected `object`.");var u=t({},n[i],e);for(var p in u){var m=e[p];if(o(e,p)&&"function"!=typeof m)return g(a,l,s,p,v(m));if(!m)return new h("Invalid "+l+" `"+s+"` key `"+p+"` supplied to `"+a+"`.\nBad object: "+JSON.stringify(n[i],null," ")+"\nValid keys: "+JSON.stringify(Object.keys(e),null," "));var f=m(d,p,a,l,s+"."+p,r);if(f)return f}return null})}};function p(e,t){return e===t?0!==e||1/e==1/t:e!=e&&t!=t}function h(e,t){this.message=e,this.data=t&&"object"==typeof t?t:{},this.stack=""}function m(e){if("production"!==process.env.NODE_ENV)var t={},o=0;function n(n,a,l,d,u,p,m){if(d=d||c,p=p||l,m!==r){if(s){var f=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use `PropTypes.checkPropTypes()` to call them. Read more at http://fb.me/use-check-prop-types");throw f.name="Invariant Violation",f}if("production"!==process.env.NODE_ENV&&"undefined"!=typeof console){var g=d+":"+l;!t[g]&&o<3&&(i("You are manually calling a React.PropTypes validation function for the `"+p+"` prop on `"+d+"`. This is deprecated and will throw in the standalone `prop-types` package. You may be seeing this warning due to a third-party PropTypes library. See https://fb.me/react-warning-dont-call-proptypes for details."),t[g]=!0,o++)}}return null==a[l]?n?null===a[l]?new h("The "+u+" `"+p+"` is marked as required in `"+d+"`, but its value is `null`."):new h("The "+u+" `"+p+"` is marked as required in `"+d+"`, but its value is `undefined`."):null:e(a,l,d,u,p)}var a=n.bind(null,!1);return a.isRequired=n.bind(null,!0),a}function f(e){return m(function(t,r,o,n,i,a){var l=t[r];return b(l)!==e?new h("Invalid "+n+" `"+i+"` of type `"+v(l)+"` supplied to `"+o+"`, expected `"+e+"`.",{expectedType:e}):null})}function g(e,t,r,o,n){return new h((e||"React class")+": "+t+" type `"+r+"."+o+"` is invalid; it must be a function, usually from the `prop-types` package, but received `"+n+"`.")}function x(e){switch(typeof e){case"number":case"string":case"undefined":return!0;case"boolean":return!e;case"object":if(Array.isArray(e))return e.every(x);if(null===e||l(e))return!0;var t=function(e){var t=e&&(d&&e[d]||e["@@iterator"]);if("function"==typeof t)return t}(e);if(!t)return!1;var r,o=t.call(e);if(t!==e.entries){for(;!(r=o.next()).done;)if(!x(r.value))return!1}else for(;!(r=o.next()).done;){var n=r.value;if(n&&!x(n[1]))return!1}return!0;default:return!1}}function b(e){var t=typeof e;return Array.isArray(e)?"array":e instanceof RegExp?"object":function(e,t){return"symbol"===e||!!t&&("Symbol"===t["@@toStringTag"]||"function"==typeof Symbol&&t instanceof Symbol)}(t,e)?"symbol":t}function v(e){if(null==e)return""+e;var t=b(e);if("object"===t){if(e instanceof Date)return"date";if(e instanceof RegExp)return"regexp"}return t}function y(e){var t=v(e);switch(t){case"array":case"object":return"an "+t;case"boolean":case"date":case"regexp":return"a "+t;default:return t}}return h.prototype=Error.prototype,u.checkPropTypes=n,u.resetWarningCache=n.resetWarningCache,u.PropTypes=u,u},Ri}()(Ni.isElement,!0)}else xi.exports=function(){if(Oi)return Pi;Oi=1;var e=Di();function t(){}function r(){}return r.resetWarningCache=t,Pi=function(){function o(t,r,o,n,i,a){if(a!==e){var l=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw l.name="Invariant Violation",l}}function n(){return o}o.isRequired=o;var i={array:o,bigint:o,bool:o,func:o,number:o,object:o,string:o,symbol:o,any:o,arrayOf:n,element:o,elementType:o,instanceOf:n,node:o,objectOf:n,oneOf:n,oneOfType:n,shape:n,exact:n,checkPropTypes:r,resetWarningCache:t};return i.PropTypes=i,i},Pi}()();var Hi=fi(xi.exports);function Vi({code:e,label:t="Copy code"}){const[o,n]=r(!1);return de(w,{title:o?"Copied!":t,children:de(C,{size:"small",onClick:async()=>{try{await navigator.clipboard.writeText(e),n(!0),setTimeout(()=>n(!1),2e3)}catch(e){console.error("Copy failed:",e)}},"aria-label":o?"Copied":t,sx:{color:o?"var(--Icons-Success, var(--Text))":"var(--Quiet)","&:hover":{backgroundColor:"var(--Hover)",color:"var(--Text)"},"&:focus-visible":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"}},children:de(o?he:pe,{fontSize:"small"})})})}Vi.propTypes={code:Hi.string.isRequired,label:Hi.string};function Qi({code:e="",language:t="JSX",showCopy:r=!0,showHeader:o=!0,maxHeight:n,wrap:i=!1,sx:a={},...l}){return ce(h,{"data-theme":"Neutral","data-surface":"Surface-Dimmest",sx:{backgroundColor:"var(--Background)",borderRadius:"min(var(--Card-Radius, var(--Style-Border-Radius)), 12px)",overflow:"hidden",...a},...l,children:[o&&(t||r)&&ce(h,{sx:{display:"flex",alignItems:"center",justifyContent:"space-between",gap:1,px:2,py:1,borderBottom:"1px solid var(--Border)",minHeight:40},children:[de(bo,{color:"quiet",children:t}),r&&e?de(Vi,{code:e}):null]}),de(h,{sx:{p:2,overflow:"auto",maxHeight:n},children:de(h,{component:"pre",sx:{margin:0,fontFamily:"inherit"},children:de(h,{component:"code",sx:{fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:"13px",lineHeight:1.6,color:"var(--Text)",whiteSpace:i?"pre-wrap":"pre",wordBreak:i?"break-word":"normal",display:"block"},children:e})})})]})}function ji(e){if(!e)return null;const t=e.trim();if(/^#[0-9a-f]{3}$/i.test(t))return{r:parseInt(t[1]+t[1],16),g:parseInt(t[2]+t[2],16),b:parseInt(t[3]+t[3],16),a:1};if(/^#[0-9a-f]{6}$/i.test(t))return{r:parseInt(t.substring(1,3),16),g:parseInt(t.substring(3,5),16),b:parseInt(t.substring(5,7),16),a:1};if(/^#[0-9a-f]{8}$/i.test(t))return{r:parseInt(t.substring(1,3),16),g:parseInt(t.substring(3,5),16),b:parseInt(t.substring(5,7),16),a:parseInt(t.substring(7,9),16)/255};const r=t.match(/rgba?\(\s*([\d.]+)[,\s]+([\d.]+)[,\s]+([\d.]+)(?:[,\s/]+([\d.]+%?))?\s*\)/);if(r){let e=1;return void 0!==r[4]&&(e=r[4].endsWith("%")?parseFloat(r[4])/100:parseFloat(r[4])),{r:Math.round(parseFloat(r[1])),g:Math.round(parseFloat(r[2])),b:Math.round(parseFloat(r[3])),a:e}}return null}function Gi(e,t){if(!e||!t)return e||t;if(e.a>=1)return e;const r=e.a;return{r:Math.round(e.r*r+t.r*(1-r)),g:Math.round(e.g*r+t.g*(1-r)),b:Math.round(e.b*r+t.b*(1-r)),a:1}}function Ui(e){const t=e=>e<=.03928?e/12.92:Math.pow((e+.055)/1.055,2.4);return.2126*t(e.r/255)+.7152*t(e.g/255)+.0722*t(e.b/255)}function Xi(e,t,r){const o=ji(e),n=ji(t),i=ji(r);if(!o||!n)return null;const a=i?Gi(n,i):n.a<1?null:n;if(!a)return null;const l=Gi(o,a);if(!l)return null;const s=Ui(l),d=Ui(a);return((Math.max(s,d)+.05)/(Math.min(s,d)+.05)).toFixed(2)}function Ki(e){return"undefined"==typeof window?null:getComputedStyle(document.documentElement).getPropertyValue(e).trim()}Qi.propTypes={code:Hi.string,language:Hi.string,showCopy:Hi.bool,showHeader:Hi.bool,maxHeight:Hi.oneOfType([Hi.number,Hi.string]),wrap:Hi.bool,sx:Hi.object};const qi={"display-large":"Display Large","display-medium":"Display Medium","display-small":"Display Small",h1:"H1",h2:"H2",h3:"H3",h4:"H4",h5:"H5",h6:"H6","subtitle-small":"Subtitle Small",subtitle:"Subtitle Medium","subtitle-large":"Subtitle Large","body-small":"Body Small","body-small-semibold":"Body Small Semibold",body:"Body Medium","body-semibold":"Body Medium Semibold","body-large":"Body Large","body-large-semibold":"Body Large Semibold",label:"Label","label-small":"Label Small","label-large":"Label Large",caption:"Caption","caption-bold":"Caption Bold",legal:"Legal","legal-semibold":"Legal Semibold",eyebrow:"Eyebrow Medium","eyebrow-small":"Eyebrow Small","eyebrow-large":"Eyebrow Large",button:"Button Standard","button-small":"Button Small","button-extra-small":"Button Extra Small","number-large":"Number Large","number-medium":"Number Medium","number-small":"Number Small"};function Ji(){const e=({color:e})=>ce(h,{sx:{textAlign:"center"},children:[de(h,{sx:{width:"80px",height:"80px",backgroundColor:`var(${e.var})`,borderRadius:"8px",border:"1px solid var(--Border)",mb:1,mx:"auto"}}),de(T,{variant:"body2",sx:{fontWeight:600,fontSize:"12px",color:"var(--Text)",mb:.5,wordBreak:"break-word"},children:e.name}),de(T,{variant:"caption",sx:{color:"var(--Text-Secondary)",display:"block",fontSize:"10px",fontFamily:"monospace",wordBreak:"break-all"},children:e.var})]});return ce(B,{spacing:6,children:[ce(h,{children:[de(T,{variant:"h5",sx:{mb:3,fontWeight:700},children:"Brand Colors (Static)"}),de(B,{direction:"row",spacing:3,sx:{justifyContent:"center",flexWrap:"wrap",gap:3},children:[{name:"Primary",var:"--Primary-Color-11"},{name:"Secondary",var:"--Secondary-Color-11"},{name:"Tertiary",var:"--Tertiary-Color-11"}].map(t=>de(e,{color:t},t.var))})]}),ce(h,{children:[de(T,{variant:"h5",sx:{mb:3,fontWeight:700},children:"Background Colors (Dynamic)"}),de(T,{variant:"body2",sx:{mb:3,color:"var(--Text-Secondary)"},children:"Update based on selected Background variant and Mode"}),de(I,{container:!0,spacing:2,sx:{justifyContent:"center"},children:[{name:"Default Background",cssVar:"var(--Theme-Default-Surfaces-Surface)"},{name:"Primary Background",cssVar:"var(--Theme-Primary-Surfaces-Surface)"},{name:"Secondary Background",cssVar:"var(--Theme-Secondary-Surfaces-Surface)"},{name:"Tertiary Background",cssVar:"var(--Theme-Tertiary-Surfaces-Surface)"},{name:"Neutral Background",cssVar:"var(--Theme-Neutral-Surfaces-Surface)"},{name:"Neutral-Variant Background",cssVar:"var(--Theme-Neutral-Variant-Surfaces-Surface)"}].map(e=>de(I,{item:!0,sx:{display:"flex",justifyContent:"center"},children:ce(h,{sx:{textAlign:"center"},children:[de(h,{sx:{minWidth:"max(var(--Button-Height), var(--Min-Button-Width))",minHeight:"var(--Button-Height)",backgroundColor:e.cssVar,borderRadius:"var(--Style-Border-Radius)",border:"2px solid var(--Border)",mb:1}}),de(T,{variant:"body2",sx:{fontWeight:600,fontSize:"12px",color:"var(--Text)",wordBreak:"break-word"},children:e.name})]})},e.name))})]}),ce(h,{children:[de(T,{variant:"h5",sx:{mb:3,fontWeight:700},children:"Dynamic Colors (Update with Mode, Background & Surface)"}),de(A,{severity:"info",sx:{backgroundColor:"var(--Container-Low)",mb:3,border:"1px solid var(--Border)"},children:ce(T,{variant:"body2",children:["Most colors update automatically based on the current"," ",de("strong",{children:"Mode"})," (Light/Dark), ",de("strong",{children:"Background"})," ","variant, and ",de("strong",{children:"Surface"})," theme. Only Primary, Secondary, and Tertiary colors are fixed brand colors."]})}),de(T,{variant:"body2",sx:{mb:3,color:"var(--Text-Secondary)"},children:"These colors automatically adapt based on:"}),ce(B,{spacing:1,sx:{mb:4},children:[ce(h,{sx:{display:"flex",gap:2},children:[de(T,{variant:"body2",sx:{fontWeight:600,minWidth:80},children:"Mode:"}),de(T,{variant:"body2",children:"Light or Dark theme"})]}),ce(h,{sx:{display:"flex",gap:2},children:[de(T,{variant:"body2",sx:{fontWeight:600,minWidth:80},children:"Background:"}),de(T,{variant:"body2",children:"Default, Primary, Secondary, Tertiary, Neutral, or Neutral-Variant"})]}),ce(h,{sx:{display:"flex",gap:2},children:[de(T,{variant:"body2",sx:{fontWeight:600,minWidth:80},children:"Surface:"}),de(T,{variant:"body2",children:"Theme surface layer selection"})]})]}),de(B,{spacing:4,children:[{name:"Layout & Surfaces",colors:[{name:"Background",var:"--Background"},{name:"Border",var:"--Border"},{name:"Border-Variant",var:"--Border-Variant"}]},{name:"Text & Links",colors:[{name:"Header",var:"--Header"},{name:"Text",var:"--Text"},{name:"Text-Quiet",var:"--Text-Quiet"},{name:"Hotlink",var:"--Hotlink"},{name:"Hotlink-Visited",var:"--Hotlink-Visited"}]},{name:"Buttons - Primary",colors:[{name:"Button BG",var:"--Button-Primary-Button"},{name:"Button Text",var:"--Button-Primary-Text"},{name:"Button Hover",var:"--Button-Primary-Hover"},{name:"Button Active",var:"--Button-Primary-Pressed"},{name:"Focus-Visible",var:"--Focus-Visible"}]},{name:"Buttons - Secondary",colors:[{name:"Button BG",var:"--Button-Secondary-Button"},{name:"Button Text",var:"--Button-Secondary-Text"},{name:"Button Hover",var:"--Button-Secondary-Hover"},{name:"Button Active",var:"--Button-Secondary-Pressed"},{name:"Focus-Visible",var:"--Focus-Visible"}]},{name:"Buttons - State",colors:[{name:"Info Button",var:"--Button-Info-Button"},{name:"Success Button",var:"--Button-Success-Button"},{name:"Warning Button",var:"--Button-Warning-Button"},{name:"Error Button",var:"--Button-Error-Button"}]},{name:"Icons",colors:[{name:"Default",var:"--Icons-Default"},{name:"Primary",var:"--Icons-Primary"},{name:"Secondary",var:"--Icons-Secondary"},{name:"Tertiary",var:"--Icons-Tertiary"},{name:"Neutral",var:"--Icons-Neutral"},{name:"Info",var:"--Icons-Info"},{name:"Success",var:"--Icons-Success"},{name:"Warning",var:"--Icons-Warning"},{name:"Error",var:"--Icons-Error"}]},{name:"Chips & Badges",colors:[{name:"Primary BG",var:"--Tags-Primary-BG"},{name:"Primary Text",var:"--Tags-Primary-Text"},{name:"Secondary BG",var:"--Tags-Secondary-BG"},{name:"Secondary Text",var:"--Tags-Secondary-Text"},{name:"Tertiary BG",var:"--Tags-Tertiary-BG"},{name:"Tertiary Text",var:"--Tags-Tertiary-Text"},{name:"Neutral BG",var:"--Tags-Neutral-BG"},{name:"Neutral Text",var:"--Tags-Neutral-Text"},{name:"Info BG",var:"--Tags-Info-BG"},{name:"Info Text",var:"--Tags-Info-Text"},{name:"Success BG",var:"--Tags-Success-BG"},{name:"Success Text",var:"--Tags-Success-Text"},{name:"Warning BG",var:"--Tags-Warning-BG"},{name:"Warning Text",var:"--Tags-Warning-Text"},{name:"Error BG",var:"--Tags-Error-BG"},{name:"Error Text",var:"--Tags-Error-Text"}]}].map(t=>ce(h,{children:[de(T,{variant:"h6",sx:{mb:2,fontWeight:600},children:t.name}),de(I,{container:!0,spacing:2,sx:{justifyContent:"center"},children:t.colors.map(t=>de(I,{item:!0,sx:{display:"flex",justifyContent:"center"},children:de(e,{color:t})},t.var))})]},t.name))})]}),ce(h,{sx:{pt:4,borderTop:"1px solid var(--Border)"},children:[de(T,{variant:"h5",sx:{mb:2,fontWeight:700},children:"How to Use"}),ce(B,{spacing:2,children:[ce(h,{children:[de(T,{variant:"h6",sx:{fontWeight:600,mb:1},children:"Static Colors"}),ce(T,{variant:"body2",sx:{color:"var(--Text-Secondary)"},children:["Use brand colors (",de("code",{style:{backgroundColor:"var(--Container)",padding:"2px 4px",borderRadius:"4px"},children:"--Primary-Color-11"}),","," ",de("code",{style:{backgroundColor:"var(--Container)",padding:"2px 4px",borderRadius:"4px"},children:"--Secondary-Color-11"}),","," ",de("code",{style:{backgroundColor:"var(--Container)",padding:"2px 4px",borderRadius:"4px"},children:"--Tertiary-Color-11"}),") for brand elements that should never change."]})]}),ce(h,{children:[de(T,{variant:"h6",sx:{fontWeight:600,mb:1},children:"Dynamic Colors"}),de(T,{variant:"body2",sx:{color:"var(--Text-Secondary)"},children:"Use dynamic color variables for all UI elements. They will automatically update when users change Mode, Background, or Surface settings."})]}),ce(h,{children:[de(T,{variant:"h6",sx:{fontWeight:600,mb:1},children:"Example Usage"}),de(h,{component:"pre",sx:{backgroundColor:"var(--Container)",p:2,borderRadius:"8px",overflow:"auto",fontSize:"12px",border:"1px solid var(--Border)",color:"var(--Text)"},children:"/* Dynamic - updates with theme changes */\ncolor: var(--Text);\nbackgroundColor: var(--Background);\nborderColor: var(--Border);\n\n/* Static - brand colors stay the same */\naccentColor: var(--Primary-Color-11);"})]})]})]})]})}function Yi(){const e=({name:e,varName:t,baseValue:r})=>de(h,{sx:{mb:2},children:ce(h,{sx:{display:"flex",alignItems:"center",gap:2,mb:1},children:[de(h,{"aria-hidden":"true",sx:{width:`var(${t})`,minWidth:20,height:24,backgroundColor:"var(--Buttons-Primary-Button)",borderRadius:.5,border:"1px solid var(--Border)"}}),ce(B,{spacing:.5,children:[de(T,{variant:"subtitle2",sx:{fontWeight:600},children:e}),de(T,{variant:"caption",sx:{color:"var(--Text-Secondary)"},children:t}),ce(T,{variant:"caption",sx:{color:"var(--Text-Secondary)"},children:["Base: ",r," (with cognitive multiplier)"]})]})]})}),t=({name:e,varName:t,value:r})=>ce(h,{sx:{mb:2},children:[de(h,{"aria-hidden":"true",sx:{width:100,height:r,backgroundColor:"var(--Buttons-Primary-Button)",borderRadius:1,border:"1px solid var(--Border)",mb:1}}),de(T,{variant:"subtitle2",sx:{fontWeight:600},children:e}),de(T,{variant:"caption",sx:{color:"var(--Text-Secondary)",display:"block"},children:t}),de(T,{variant:"caption",sx:{color:"var(--Text-Secondary)"},children:r})]});return ce(B,{spacing:3,sx:{p:2},children:[ce("section",{children:[de(T,{variant:"h5",component:"h2",sx:{mb:2,fontWeight:700},children:"Spacing Scale"}),de(T,{variant:"body2",sx:{mb:3,color:"var(--Text-Secondary)"},children:"Spacing values are multiplied by the cognitive multiplier for accessibility. Each spacing value includes a visual reference and text label for clarity."}),de(B,{spacing:1,children:[{name:"Quarter",var:"--Spacing-Quarter",baseValue:"2px"},{name:"Half",var:"--Spacing-Half",baseValue:"4px"},{name:"1-and-Half",var:"--Spacing-1-and-Half",baseValue:"12px"},{name:"1",var:"--Spacing-1",baseValue:"8px"},{name:"2",var:"--Spacing-2",baseValue:"16px"},{name:"3",var:"--Spacing-3",baseValue:"24px"},{name:"4",var:"--Spacing-4",baseValue:"32px"},{name:"5",var:"--Spacing-5",baseValue:"40px"},{name:"6",var:"--Spacing-6",baseValue:"48px"},{name:"7",var:"--Spacing-7",baseValue:"56px"},{name:"8",var:"--Spacing-8",baseValue:"64px"},{name:"9",var:"--Spacing-9",baseValue:"72px"},{name:"10",var:"--Spacing-10",baseValue:"80px"}].map(t=>de(e,{name:t.name,varName:t.var,baseValue:t.baseValue},t.var))})]}),ce("section",{children:[de(T,{variant:"h5",component:"h2",sx:{mb:2,fontWeight:700},children:"Sizing Scale"}),de(T,{variant:"body2",sx:{mb:3,color:"var(--Text-Secondary)"},children:"Fixed sizing values for components and layouts. Each size is labeled with its CSS variable and pixel value."}),de(I,{container:!0,spacing:3,children:[{name:"Quarter",var:"--Sizing-Quarter",value:"2px"},{name:"Half",var:"--Sizing-Half",value:"4px"},{name:"1-and-Half",var:"--Sizing-1-and-Half",value:"12px"},{name:"1",var:"--Sizing-1",value:"8px"},{name:"2",var:"--Sizing-2",value:"16px"},{name:"3",var:"--Sizing-3",value:"24px"},{name:"4",var:"--Sizing-4",value:"32px"},{name:"5",var:"--Sizing-5",value:"40px"},{name:"6",var:"--Sizing-6",value:"48px"},{name:"7",var:"--Sizing-7",value:"56px"},{name:"8",var:"--Sizing-8",value:"64px"},{name:"9",var:"--Sizing-9",value:"72px"},{name:"10",var:"--Sizing-10",value:"80px"},{name:"11",var:"--Sizing-11",value:"88px"},{name:"12",var:"--Sizing-12",value:"96px"},{name:"13",var:"--Sizing-13",value:"104px"},{name:"14",var:"--Sizing-14",value:"112px"},{name:"15",var:"--Sizing-15",value:"160px"},{name:"16",var:"--Sizing-16",value:"240px"},{name:"17",var:"--Sizing-17",value:"320px"},{name:"18",var:"--Sizing-18",value:"480px"}].map(e=>de(I,{item:!0,xs:12,sm:6,md:4,lg:3,children:de(t,{name:e.name,varName:e.var,value:e.value})},e.var))})]}),ce("section",{children:[de(T,{variant:"h5",component:"h2",sx:{mb:2,fontWeight:700},children:"Negative Sizing"}),de(T,{variant:"body2",sx:{mb:3,color:"var(--Text-Secondary)"},children:"Negative values for margins and offsets. Use these to reduce or remove default spacing when needed."}),de(I,{container:!0,spacing:3,children:[{name:"Negative-Quarter",var:"--Sizing-Negative-Quarter",value:"-2px"},{name:"Negative-Half",var:"--Sizing-Negative-Half",value:"-4px"},{name:"Negative-1-and-Half",var:"--Sizing-Negative-1-and-Half",value:"-12px"},{name:"Negative-1",var:"--Sizing-Negative-1",value:"-8px"}].map(e=>de(I,{item:!0,xs:12,sm:6,md:4,lg:3,children:ce(h,{children:[de(T,{variant:"subtitle2",sx:{fontWeight:600},children:e.name}),de(T,{variant:"caption",sx:{color:"var(--Text-Secondary)",display:"block"},children:e.var}),de(T,{variant:"caption",sx:{color:"var(--Text-Secondary)"},children:e.value})]})},e.var))})]}),ce("section",{style:{paddingTop:24,borderTop:"1px solid var(--Border)"},children:[de(T,{variant:"h5",component:"h2",sx:{mb:2,fontWeight:700},children:"Container Padding"}),ce(h,{sx:{p:"var(--Spacing-3)",backgroundColor:"var(--Container-Low)",border:"2px dashed var(--Buttons-Primary-Button)",borderRadius:1},children:[ce(T,{variant:"body2",children:["Default container padding: ",de("strong",{children:"var(--Spacing-3)"})," = 24px"]}),de(T,{variant:"caption",sx:{color:"var(--Text-Secondary)",display:"block",mt:1},children:"Use this variable for consistent padding around main content areas."})]})]}),ce("section",{style:{paddingTop:24,borderTop:"1px solid var(--Border)"},children:[de(T,{variant:"h5",component:"h2",sx:{mb:3,fontWeight:700},children:"Practical Examples"}),ce("article",{children:[de(T,{variant:"h6",component:"h3",sx:{mb:2,fontWeight:600},children:"Padding Examples"}),de(T,{variant:"caption",sx:{color:"var(--Text-Secondary)",mb:2,display:"block"},children:"Different padding values create different visual breathing room."}),de(I,{container:!0,spacing:2,sx:{mb:4},children:["var(--Spacing-1)","var(--Spacing-2)","var(--Spacing-3)","var(--Spacing-4)"].map(e=>de(I,{item:!0,xs:12,sm:6,children:ce(h,{sx:{p:e,backgroundColor:"var(--Container)",border:"1px solid var(--Border)",borderRadius:1},children:[ce(T,{variant:"subtitle2",children:["Padding: ",e]}),de(T,{variant:"caption",sx:{display:"block",mt:1,color:"var(--Text-Secondary)"},children:"Content with spacing applied"})]})},e))})]}),ce("article",{children:[de(T,{variant:"h6",component:"h3",sx:{mb:2,fontWeight:600},children:"Gap Examples"}),de(T,{variant:"caption",sx:{color:"var(--Text-Secondary)",mb:2,display:"block"},children:"Gap controls spacing between flex/grid children without adding extra elements."}),de(B,{spacing:3,children:["var(--Spacing-1)","var(--Spacing-2)","var(--Spacing-3)"].map(e=>ce(h,{children:[de(B,{direction:"row",spacing:e,sx:{mb:1},children:[1,2,3].map(e=>de(h,{"aria-hidden":"true",sx:{width:60,height:60,backgroundColor:"var(--Buttons-Primary-Button)",borderRadius:1,flexShrink:0}},e))}),ce(T,{variant:"caption",sx:{color:"var(--Text-Secondary)"},children:["Gap: ",e]})]},e))})]})]}),ce(h,{role:"note",sx:{p:2,backgroundColor:"var(--Container-Low)",borderRadius:1,borderLeft:"4px solid var(--Buttons-Primary-Button)",mt:3},children:[de(T,{variant:"subtitle2",sx:{fontWeight:600,mb:1},children:"✓ Accessibility Best Practices Used"}),ce("ul",{style:{margin:"0.5rem 0",paddingLeft:"1.5rem"},children:[de("li",{children:ce(T,{variant:"caption",children:[de("strong",{children:'aria-hidden="true"'})," on purely decorative visual elements"]})}),de("li",{children:de(T,{variant:"caption",children:"All spacing information conveyed through text labels and values"})}),de("li",{children:ce(T,{variant:"caption",children:["No empty decorative ",de("code",{children:"<div>"})," elements in DOM"]})}),de("li",{children:ce(T,{variant:"caption",children:["Semantic HTML: ",de("code",{children:"<section>"})," and ",de("code",{children:"<article>"})," for structure"]})}),de("li",{children:de(T,{variant:"caption",children:"CSS-based spacing (padding/margin) for actual layout, not decorative divs"})}),de("li",{children:de(T,{variant:"caption",children:"Full keyboard navigation and screen reader support"})})]})]})]})}Object.entries({Display:["display-large","display-medium","display-small"],Headings:["h1","h2","h3","h4","h5","h6"],Subtitle:["subtitle-small","subtitle","subtitle-large"],Body:["body-small","body-small-semibold","body","body-semibold","body-large","body-large-semibold"],Label:["label","label-small","label-large"],Caption:["caption","caption-bold"],Legal:["legal","legal-semibold"],Eyebrow:["eyebrow-small","eyebrow","eyebrow-large"],Button:["button-extra-small","button-small","button"],Number:["number-large","number-medium","number-small"]}).map(([e,t])=>({label:e,options:t.map(e=>({value:e,label:qi[e]}))}));const Zi=["default","primary","secondary","tertiary","neutral","info","success","warning","error"],$i=e=>e.charAt(0).toUpperCase()+e.slice(1);function _i(e){const t=$i(e);return{type:"outline",color:t,trackOff:"var(--Background)",trackOffBorder:"var(--Border-Variant)",trackOn:"var(--Buttons-"+t+"-Button)",trackOnBorder:"var(--Buttons-"+t+"-Border)",dotOff:"var(--Quiet)",dotOn:"var(--Buttons-"+t+"-Text)",iconOff:"var(--Background)",iconOn:"var(--Buttons-"+t+"-Button)"}}function ea(e){const t=$i(e);return{type:"light",color:t,trackOff:"var(--Border-Variant)",trackOffBorder:"transparent",trackOn:"var(--"+t+"-Color-11)",trackOnBorder:"var(--Buttons-"+t+"-Border)",dotOff:"var(--Quiet)",dotOn:"var(--Buttons-"+t+"-Border)",iconOff:"var(--Border-Variant)",iconOn:"var(--"+t+"-Color-11)",dataTheme:t,dataSurface:"Surface-Brightest"}}const ta={small:{trackW:28,trackH:16,dotRadius:"var(--Sizing-2, 16px)",icon:8},medium:{trackW:40,trackH:24,dotRadius:"var(--Sizing-2-and-Half, 20px)",icon:16},large:{trackW:56,trackH:32,dotRadius:"var(--Sizing-2-and-Half, 20px)",icon:16}};function ra({variant:e="default",size:t="medium",checked:r,defaultChecked:o,onChange:n,disabled:i=!1,label:a,labelPlacement:l="end",name:s,value:d,icon:c,iconOn:u,iconOff:p,className:h="",sx:m={},"aria-label":f,"aria-labelledby":g,...x}){const b=function(){const e={};return Zi.forEach(t=>{e[t+"-outline"]=_i(t),e[t+"-light"]=ea(t)}),e.default={type:"themed",trackOff:"var(--Background)",trackOffBorder:"var(--Quiet)",trackOn:"var(--Buttons-Default-Button)",trackOnBorder:"var(--Buttons-Default-Border)",dotOff:"var(--Quiet)",dotOn:"var(--Buttons-Default-Text)",iconOff:"var(--Background)",iconOn:"var(--Buttons-Default-Button)"},e["default-outline"]={type:"themed",trackOff:"var(--Background)",trackOffBorder:"var(--Quiet)",trackOn:"var(--Buttons-Default-Button)",trackOnBorder:"var(--Buttons-Default-Border)",dotOff:"var(--Quiet)",dotOn:"var(--Buttons-Default-Text)",iconOff:"var(--Background)",iconOn:"var(--Buttons-Default-Button)"},e.outline={type:"themed",trackOff:"var(--Background)",trackOffBorder:"var(--Quiet)",trackOn:"var(--Buttons-Default-Button)",trackOnBorder:"var(--Buttons-Default-Border)",dotOff:"var(--Quiet)",dotOn:"var(--Buttons-Default-Text)",iconOff:"var(--Background)",iconOn:"var(--Buttons-Default-Button)"},e.primary=_i("primary"),e.light=ea("primary"),e}(),y=b[e]||b.default,S=ta[t]||ta.medium,k="small"===t?ao:co,B=S.trackH-4,w=Math.max(24,S.trackW),C=Math.max(24,S.trackH),T=(C-S.trackH)/2,I={width:B,height:B,borderRadius:S.dotRadius,boxShadow:"none",border:"none",display:"flex",alignItems:"center",justifyContent:"center",transition:"background-color 0.15s ease","& > *":{width:S.icon,height:S.icon,display:"block"}},A={width:S.trackW,minWidth:24,height:C,minHeight:24,padding:0,overflow:"visible",opacity:i?"var(--Disabled, 0.38)":1,"& .MuiSwitch-switchBase":{position:"absolute",top:0,left:0,width:"100%",height:"100%",display:"flex",justifyContent:"flex-start",alignItems:"center",paddingTop:0,paddingBottom:0,paddingLeft:"2px",paddingRight:w-S.trackW+2+"px",color:"transparent",transition:"justify-content 0.15s ease",transform:"none","& .MuiSwitch-input":{left:0,top:0,width:"100%",height:"100%",margin:0},"& .MuiSwitch-thumb":{...I,backgroundColor:y.dotOff,color:y.iconOff},"&.Mui-checked":{justifyContent:"flex-end",transform:"none","& .MuiSwitch-thumb":{...I,backgroundColor:y.dotOn,color:y.iconOn},"& + .MuiSwitch-track":{backgroundColor:y.trackOn,borderColor:y.trackOnBorder,opacity:1}},"&:hover, &.Mui-checked:hover":{backgroundColor:"transparent"},"&:hover + .MuiSwitch-track":{boxShadow:an},"&:active + .MuiSwitch-track":{boxShadow:nn},"&.Mui-focusVisible + .MuiSwitch-track":{outline:"1px solid var(--Focus-Visible)",outlineOffset:"2px"},"&.Mui-disabled + .MuiSwitch-track":{opacity:1}},"& .MuiSwitch-track":{width:S.trackW,height:S.trackH,borderRadius:"var(--Sizing-3, 24px)",backgroundColor:y.trackOff,border:"1px solid "+y.trackOffBorder,boxSizing:"border-box",opacity:1,position:"absolute",top:T,left:0,transition:"background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease"},...m},R=e.includes("-light")||"light"===e,E=void 0!==p?p:c,P=void 0!==u?u:c,O=e=>de("span",{className:"MuiSwitch-thumb",children:e}),L=de(z,{...void 0!==E||void 0!==P?{icon:O(E),checkedIcon:O(P)}:{},checked:r,defaultChecked:o,onChange:n,disabled:i,name:s,value:d,slotProps:{input:{...f?{"aria-label":f}:{},...g?{"aria-labelledby":g}:{}}},className:"switch-"+e+" "+h,sx:A,disableRipple:!0,...R&&y.dataTheme?{"data-theme":y.dataTheme,"data-surface":y.dataSurface||"Surface-Dim"}:{},...x});return a?de(v,{control:L,label:de(k,{component:"span",sx:{color:i?"var(--Text-Quiet)":"var(--Text)",fontSize:"small"===t?"13px":"15px",fontWeight:500,opacity:i?.6:1},children:a}),labelPlacement:l,sx:{gap:"8px",marginLeft:0,marginRight:0}}):L}const oa=ra,na=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",ia={default:"Default",quiet:"Quiet",primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info",success:"Success",warning:"Warning",error:"Error"},aa=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}],la=["filled","outlined","rounded","twotone","sharp"],sa={filled:"Filled",outlined:"Outlined",rounded:"Rounded",twotone:"Two Tone",sharp:"Sharp"},da={Home:{filled:Be,outlined:Oe,rounded:je,twotone:tt,sharp:ht},Favorite:{filled:ke,outlined:Le,rounded:Ge,twotone:rt,sharp:mt},Delete:{filled:we,outlined:Me,rounded:Ue,twotone:ot,sharp:ft},Settings:{filled:Ce,outlined:We,rounded:Xe,twotone:nt,sharp:gt},Search:{filled:Te,outlined:Te,rounded:Ke,twotone:it,sharp:xt},Star:{filled:Ie,outlined:De,rounded:qe,twotone:at,sharp:bt},Person:{filled:me,outlined:Fe,rounded:Je,twotone:lt,sharp:vt},Notifications:{filled:Ae,outlined:Ne,rounded:Ye,twotone:st,sharp:yt},Visibility:{filled:ze,outlined:He,rounded:Ze,twotone:dt,sharp:St},ShoppingCart:{filled:Re,outlined:Ve,rounded:$e,twotone:ct,sharp:kt},Lock:{filled:Ee,outlined:Qe,rounded:_e,twotone:ut,sharp:Bt},Info:{filled:Pe,outlined:ve,rounded:et,twotone:pt,sharp:wt}};function ca({ratio:e,threshold:t}){if(!e)return de(bo,{style:{color:"var(--Text-Quiet)"},children:"--"});const r=parseFloat(e)>=t;return ce(h,{sx:{display:"inline-flex",alignItems:"center",gap:.5},children:[ce(h,{sx:{px:1,py:.25,borderRadius:"4px",fontSize:"11px",fontWeight:700,backgroundColor:r?"var(--Tags-Success-BG)":"var(--Tags-Error-BG)",color:r?"var(--Tags-Success-Text)":"var(--Tags-Error-Text)"},children:[e,":1"]}),de(bo,{style:{color:r?"var(--Tags-Success-Text)":"var(--Tags-Error-Text)"},children:r?"Pass":"Fail"})]})}function ua({label:e,ratio:t,threshold:r,note:o}){return ce(h,{sx:{display:"flex",justifyContent:"space-between",alignItems:"flex-start",py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(h,{sx:{flex:1},children:[de(ao,{style:{color:"var(--Text)"},children:e}),o&&de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:o})]}),de(ca,{ratio:t,threshold:r})]})}function pa({label:e,selected:t,onClick:r}){return de(An,{selected:t,variant:t?"primary":"primary-outline",size:"small",onClick:r,children:e})}function ha(){const[e,t]=r("filled"),[o,n]=r("default"),[a,l]=r("medium"),[s,d]=r("40"),[c,u]=r(!1),[p,m]=r("Home"),[f,g]=r(""),[x,b]=r({}),v=ia[o]||"Default",y="twotone"===e,S="custom"===a?(parseInt(s,10)||40)+"px":{xs:"12px",small:"16px",medium:"24px",large:"36px"}[a]||"24px",k=function(e,t){return da[e]?.[t]||da[e]?.filled||Be}(p,e),w=function(e){return{outlined:"Outlined",rounded:"Rounded",twotone:"TwoTone",sharp:"Sharp"}[e]||""}(e),C=p+w+"Icon",T=f.trim().length>0,A="<Icon>\n <"+C+' />\n</Icon>\n{/* aria-hidden="true" by default */}',z='<Icon aria-label="'+(T?f.trim():p+" icon")+'">\n <'+C+' />\n</Icon>\n{/* role="img" added automatically */}';return i(()=>{b({background:Ki("--Background"),iconColor:Ki("--Icons-"+v),iconVariant:Ki("--Icons-Variant-"+v)})},[o,v]),ce(h,{sx:{pb:8},children:[de(Jr,{children:"Icon"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(h,{sx:{p:4,display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",minHeight:200,backgroundColor:"var(--Background)",borderBottom:"1px solid var(--Border)",gap:2},children:de(jo,{color:o,size:a,fontSize:"custom"===a?parseInt(s,10)||40:void 0,disabled:c,twoTone:y,"aria-label":T?f.trim():void 0,children:de(k,{})})}),de(Qi,{code:(()=>{const e=[];"default"!==o&&e.push('color="'+o+'"'),"custom"===a?(e.push('size="custom"'),e.push("fontSize={"+(parseInt(s,10)||40)+"}")):"medium"!==a&&e.push('size="'+a+'"'),y&&e.push("twoTone"),c&&e.push("disabled"),T&&e.push('aria-label="'+f.trim()+'"');const t=e.length?" "+e.join(" "):"";return"import "+C+" from '@mui/icons-material/"+p+(w||"")+"';\n\n<Icon"+t+">\n <"+C+" />\n</Icon>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(ai,{defaultValue:0,variant:"standard",color:"primary",children:[ce(li,{children:[de(si,{children:"Playground"}),de(si,{children:"Accessibility"})]}),de(di,{value:0,children:ce(h,{sx:{p:3},children:[ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"ICON"}),de(h,{component:"input",type:"text",value:p,onChange:e=>m(e.target.value),placeholder:"e.g. Home, Favorite, Delete",sx:{width:"100%",padding:"6px 10px",fontSize:"13px",fontFamily:"inherit",border:"1px solid var(--Border)",borderRadius:"4px",backgroundColor:"var(--Background)",color:"var(--Text)",boxSizing:"border-box","&:focus":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"1px",borderColor:"var(--Focus-Visible)"}}}),ce(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:["Enter a MUI icon name."," ",de(h,{component:"a",href:"https://mui.com/material-ui/material-icons/",target:"_blank",rel:"noopener noreferrer",sx:{color:"var(--Text-Primary)",textDecoration:"underline","&:hover":{color:"var(--Header-Primary)"}},children:"Browse MUI Icons ↗"})]})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"STYLE"}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:la.map(r=>de(pa,{label:sa[r],selected:e===r,onClick:()=>t(r)},r))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:aa.map(e=>ce(h,{children:[de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:e.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:e.colors.map(e=>{const t=ia[e],r=o===e;return de(h,{component:"button",onClick:()=>n(e),"aria-label":"Select "+na(e),"aria-pressed":r,title:na(e),sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Icons-"+t+")",border:r?"2px solid var(--Text)":"1px solid var(--Border)",outline:r?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:r&&de(he,{sx:{fontSize:16,color:"var(--Background)",pointerEvents:"none"}})},e)})})]},e.label))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:["xs","small","medium","large","custom"].map(e=>de(pa,{label:"xs"===e?"XS":na(e),selected:a===e,onClick:()=>l(e)},e))}),"custom"===a&&ce(h,{sx:{display:"flex",alignItems:"center",gap:1,mt:1.5},children:[de(h,{component:"input",type:"number",value:s,onChange:e=>d(e.target.value),"aria-label":"Custom font size in pixels",sx:{width:72,padding:"4px 8px",fontSize:"13px",fontFamily:"inherit",border:"1px solid var(--Border)",borderRadius:"4px",backgroundColor:"var(--Background)",color:"var(--Text)",outline:"none","&:focus":{borderColor:"var(--Focus-Visible)"}}}),de(bo,{style:{color:"var(--Text-Quiet)"},children:"px"})]})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"ARIA LABEL"}),de(h,{component:"input",type:"text",value:f,onChange:e=>g(e.target.value),placeholder:"Leave empty for decorative (aria-hidden)",sx:{width:"100%",padding:"6px 10px",fontSize:"13px",fontFamily:"inherit",border:"1px solid var(--Border)",borderRadius:"4px",backgroundColor:"var(--Background)",color:"var(--Text)",boxSizing:"border-box","&:focus":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"1px",borderColor:"var(--Focus-Visible)"}}}),de(bo,{style:{color:T?"var(--Tags-Success-Text)":"var(--Text-Quiet)",display:"block",marginTop:6},children:T?'✓ Meaningful — role="img" aria-label="'+f.trim()+'"':'Decorative — aria-hidden="true" (invisible to screen readers)'})]}),ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Disabled"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Reduces opacity to 0.38"})]}),de(ra,{checked:c,onChange:e=>u(e.target.checked),size:"small","aria-label":"Toggle disabled"})]})]})}),de(di,{value:1,children:ce(h,{sx:{p:3},children:[ce(ao,{color:"quiet",style:{marginBottom:24},children:[sa[e]," / ",na(o)," / ","custom"===a?s+"px":a,T?" / meaningful":" / decorative"]}),ce(B,{spacing:3,children:[ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"Icon Contrast (WCAG 1.4.11 — 3:1)"}),de(ao,{color:"quiet",style:{marginBottom:16},children:"Non-text elements must contrast 3:1 against the page background."}),de(ua,{label:"var(--Icons-"+v+") vs. var(--Background)",ratio:Xi(x.iconColor,x.background),threshold:3,note:C+" at "+S+" in "+na(o)+" color"}),y&&de(ua,{label:"var(--Icons-Variant-"+v+") vs. var(--Background)",ratio:Xi(x.iconVariant,x.background),threshold:3,note:"Two-tone secondary fill — must also meet 3:1"})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"ARIA and Semantics"}),ce(B,{spacing:0,children:[ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)",backgroundColor:T?"var(--Tags-Success-BG, rgba(0,200,0,0.05))":"transparent",px:1,borderRadius:"4px"},children:[ce(ao,{style:{fontWeight:600},children:["Current icon — ",T?"meaningful ✓":"decorative"]}),de(h,{component:"pre",sx:{fontFamily:"monospace",fontSize:"11px",color:"var(--Text-Quiet)",mt:.5,whiteSpace:"pre-wrap",wordBreak:"break-word",margin:0},children:T?z:A})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ao,{children:"Decorative (no aria-label):"}),de(bo,{style:{color:"var(--Text-Quiet)"},children:'aria-hidden="true" is applied automatically. The icon is invisible to screen readers. Use this when the icon is purely visual — e.g. a decorative bullet or inline illustration.'}),de(h,{component:"pre",sx:{fontFamily:"monospace",fontSize:"11px",color:"var(--Text-Quiet)",mt:.5,whiteSpace:"pre-wrap",wordBreak:"break-word",margin:0},children:A})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ao,{children:"Meaningful (with aria-label):"}),de(bo,{style:{color:"var(--Text-Quiet)"},children:'role="img" is added automatically. The label is announced by screen readers. Use this when the icon conveys information that is not present in surrounding text.'}),de(h,{component:"pre",sx:{fontFamily:"monospace",fontSize:"11px",color:"var(--Text-Quiet)",mt:.5,whiteSpace:"pre-wrap",wordBreak:"break-word",margin:0},children:z})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ao,{children:["Disabled state",c?" ← current":"",":"]}),de(bo,{style:{color:"var(--Text-Quiet)"},children:"Opacity 0.38 — visual cue only. To disable an action, disable the wrapping interactive element (button, link), not the icon itself."})]}),y&&ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ao,{children:["Two-tone",y?" ← current":"",":"]}),ce(bo,{style:{color:"var(--Text-Quiet)"},children:["Secondary fill uses var(--Icons-Variant-",v,"). Both the primary and secondary fills must meet 3:1 contrast independently."]})]}),ce(h,{sx:{py:1.5},children:[ce(ao,{children:["Touch target — ",S," icon","small"===a?" ⚠":" ✓",":"]}),de(bo,{style:{color:"var(--Text-Quiet)"},children:"small"===a?"Small icons (20px) need a 24px minimum target area around them (WCAG 2.5.5). Wrap in a button with padding.":"Icon is "+S+" — meets 24px minimum. Ensure the wrapping interactive element also meets 24×24px."})]})]})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"Size Reference"}),de(B,{spacing:0,children:[{label:"Small",s:"small",px:"20px",note:"Inline text, compact UI"},{label:"Medium",s:"medium",px:"24px",note:"Standard UI — default"},{label:"Large",s:"large",px:"36px",note:"Emphasis, empty states, hero areas"},{label:"Custom",s:"custom",px:"any",note:"Ensure 24×24px minimum touch target (WCAG 2.5.5)"}].map(({label:e,s:t,px:r,note:o},n,i)=>ce(h,{sx:{py:1.5,borderBottom:n<i.length-1?"1px solid var(--Border)":"none",display:"flex",justifyContent:"space-between",alignItems:"flex-start"},children:[ce(h,{children:[ce(ao,{children:[e," — ",r]}),de(bo,{style:{color:"var(--Text-Quiet)"},children:o})]}),a===t&&de(h,{sx:{px:1,py:.25,borderRadius:"4px",fontSize:"11px",fontWeight:700,backgroundColor:"var(--Tags-Success-BG)",color:"var(--Tags-Success-Text)"},children:"current"})]},e))})]})]})]})})]})})})]})]})}const ma={default:"Default",primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info",success:"Success",warning:"Warning",error:"Error",white:"White",black:"Black"},fa={small:{size:32,iconSize:"16px",borderRadius:"8px"},medium:{size:40,iconSize:"20px",borderRadius:"10px"},large:{size:48,iconSize:"24px",borderRadius:"12px"}};function ga({children:e,color:t="primary",variant:r="solid",size:o="medium",className:n="",sx:i={},...a}){const l=fa[o]||fa.medium,s=ma[t]||ma.primary;let d,c;switch(r){case"light":d=s,c="Surface-Brightest";break;case"dark":d=s,c="Surface-Dimmest";break;default:d=s,c="Surface"}return de(h,{"data-theme":d,"data-surface":c,className:"icon-badge icon-badge-"+r+" icon-badge-"+o+" icon-badge-"+t+" "+n,sx:{width:l.size,height:l.size,borderRadius:l.borderRadius,backgroundColor:"var(--Background)",color:"var(--Text)",display:"flex",alignItems:"center",justifyContent:"center",flexShrink:0,"& svg":{width:l.iconSize,height:l.iconSize,fontSize:l.iconSize,color:"inherit",stroke:"currentColor"},...i},...a,children:e})}const xa={default:"Default-Light",primary:"Primary-Light",secondary:"Secondary-Light",tertiary:"Tertiary-Light",neutral:"Neutral-Light",info:"Info-Light",success:"Success-Light",warning:"Warning-Light",error:"Error-Light"};function ba({variant:e="outlined",color:o="default",size:n="medium",disabled:i=!1,orientation:a="horizontal",spacing:l=0,fit:s,fullWidth:d=!1,equalWidth:c=!1,value:u,defaultValue:p,onChange:m,children:f,className:g="",sx:x={},"aria-label":b,...v}){const[y,S]=r(p??null),k=void 0!==u,B=k?u:y,w="horizontal"===a,C=0===l,T="light"===e,I="ghost"===e,A=s??(d?"fill":c?"equal":"hug"),z="fill"===A,R="equal"===A&&w,E=(P=o).charAt(0).toUpperCase()+P.slice(1);var P;const O="var(--Buttons-"+E+"-Border)",L="var(--Buttons-"+E+"-Button)",M="var(--Buttons-"+E+"-Text)",W=xa[o]||"Default-Light",D=t.Children.toArray(f).filter(Boolean),F=D.length,N=(e,t)=>r=>{k||S(e),m?.(e,r),t?.(r)},H=D.map((e,r)=>{if(!t.isValidElement(e))return e;const a=0===r,l=r===F-1,s=e.props.value??r,d=B===s;let c;if(C&&F>1){const e="var(--Style-Border-Radius)";c=w?a&&l?e:a?e+" 0 0 "+e:l?"0 "+e+" "+e+" 0":"0":a&&l?e:a?e+" "+e+" 0 0":l?"0 0 "+e+" "+e:"0"}const u={...C&&F>1?{borderRadius:c,...!a&&(w?{marginLeft:"calc(-1 * var(--Button-Border-Width))"}:{marginTop:"calc(-1 * var(--Button-Border-Width))"}),position:"relative","&:hover, &:focus-visible":{zIndex:1}}:{},...d?{backgroundColor:L+" !important",color:M+" !important",borderColor:O+" !important","&:hover, &:active, &.Mui-focusVisible, &:focus-visible":{backgroundColor:L+" !important",color:M+" !important",borderColor:O+" !important"}}:{},...d?{}:{color:"var(--Quiet)",backgroundColor:"transparent","&:hover":{backgroundColor:"var(--Hover)",color:"var(--Text)",zIndex:1},"&:active":{backgroundColor:"var(--Pressed)",color:"var(--Buttons-Default-Text)"}},...I?{border:"none !important","&:hover":{border:"none !important"}}:{},"&:focus-visible":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px",zIndex:2},...e.props.sx},p=t.cloneElement(e,{variant:e.props.variant??(I?"ghost":d?o:o+"-outline"),size:e.props.size??n,disabled:e.props.disabled??i,onClick:N(s,e.props.onClick),"aria-pressed":d,sx:u});return T&&!d?de(h,{"data-theme":W,"data-surface":"Surface",sx:{display:"contents"},children:p},r):t.cloneElement(p,{key:r})});return de(h,{role:"group","aria-label":b,className:"btn-group btn-group-"+e+" btn-group-"+o+" "+g,sx:{...R?{display:z?"grid":"inline-grid",gridAutoFlow:"column",gridAutoColumns:"1fr",justifyItems:"stretch",alignItems:"stretch",width:z?"100%":"fit-content"}:{display:z?"flex":"inline-flex",flexDirection:w?"row":"column",alignItems:"stretch",width:z?"100%":"auto"},gap:C?0:l,border:"none",borderRadius:"var(--Style-Border-Radius)",...x},...v,children:H})}const va=["Link","Chip","Badge","Caption","Label","Tag","BodySmall","LegalSemibold","Legal","LabelSmall","LabelExtraSmall","EyebrowSmall","ButtonSmall"];function ya(e){let r=!1;return t.Children.forEach(e,e=>{(function(e){if(!t.isValidElement(e))return!1;const r=e.props||{};if("small"===r.size)return!0;if("small"===r["data-size"])return!0;if(24===r.height||24===r.minHeight)return!0;if("24px"===r.height||"24px"===r.minHeight)return!0;if(r.sx){const e=r.sx.minHeight||r.sx.height;if(24===e||"24px"===e)return!0}const o=e.type;if(o){const e=o.displayName||o.name||"";if(va.some(t=>e.includes(t)))return!0}return!1})(e)&&(r=!0)}),r}function Sa({children:e,gap:t,spacing:r,direction:o="column",enforceMinGap:n=!0,minGapToken:i="--min-stack-gap",divider:a,flexWrap:l,useFlexGap:s=!0,alignItems:c,justifyContent:u,sx:p={},className:h="",...m}){const f=void 0!==t?t:r,g=n&&ya(e),x=d(()=>{if(!g)return f;const e=function(e,t=8){return null==e?0:"number"==typeof e?e*t:"string"==typeof e?e.endsWith("px")?parseFloat(e):e.endsWith("rem")?parseFloat(e)*parseFloat(getComputedStyle(document.documentElement).fontSize||"16"):parseFloat(e)*t||0:0}(f),t=function(e,t=8){if("undefined"==typeof window)return t;const r=getComputedStyle(document.documentElement).getPropertyValue(e).trim();return r?r.endsWith("rem")?parseFloat(r)*parseFloat(getComputedStyle(document.documentElement).fontSize):parseFloat(r)||t:t}(i,8);return e>=t?f:"var("+i+", "+t+"px)"},[g,f,i]);return de(B,{direction:o,spacing:s?void 0:x,gap:s?x:void 0,divider:a,flexWrap:l,useFlexGap:s,alignItems:c,justifyContent:u,className:"omni-stack"+(g?" omni-stack-min-gap-enforced":"")+(h?" "+h:""),sx:{background:"var(--Background)",boxSizing:"border-box",...g?{"&::before":{display:"none"}}:{},...p},"data-min-gap-enforced":g?"true":void 0,...m,children:e})}const ka=e=>de(Sa,{direction:"row",alignItems:"center",...e}),Ba=e=>de(Sa,{direction:"column",...e}),wa=e=>de(Sa,{direction:"column",alignItems:"center",justifyContent:"center",...e}),Ca=e=>de(Sa,{direction:"row",alignItems:"center",justifyContent:"space-between",...e}),Ta=e=>de(Sa,{direction:"row",flexWrap:"wrap",...e}),Ia=({breakpoint:e="sm",...t})=>de(Sa,{direction:{xs:"column",[e]:"row"},...t}),Aa=Sa,za=Ta,Ra=e=>de(h,{sx:{borderBottom:"1px solid var(--Border)",width:"100%"},...e}),Ea=({sx:e,...t})=>de(Sa,{sx:{px:2,...e},...t}),Pa=({sx:e,...t})=>de(Sa,{sx:{overflowY:"auto",...e},...t}),Oa={default:"Default",primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info",success:"Success",warning:"Warning",error:"Error"},La={small:{gap:"8px",fontSize:"13px",padding:"var(--Card-Padding)"},medium:{gap:"12px",fontSize:"14px",padding:"var(--Card-Padding)"},large:{gap:"16px",fontSize:"16px",padding:"var(--Card-Padding)"}},Ma=s({variant:"default",color:"primary",size:"medium",orientation:"vertical"});function Wa({children:e,variant:t="solid",color:r="default",surface:o,size:n="medium",orientation:i="vertical",clickable:a=!1,selected:l=!1,elevated:s=!1,draggable:d=!1,onClick:c,href:u,className:p="",sx:m={},...f}){const g="default"===r,x=g?"":Oa[r],b=o||(g?"Container":"dark"===t?"Surface-Dimmest":"light"===t?"Surface-Brightest":"Surface"),v=La[n]||La.medium,y="horizontal"===i,S=!!d,k=a||!!c||!!u||l||S,B=u?"a":"div",w=l?`var(--Buttons-${(e=>e.charAt(0).toUpperCase()+e.slice(1))("default"===r?"Default":r)}-Border)`:"var(--Buttons-Default-Border)",C=k?l?`2px solid ${w}`:"1px solid var(--Buttons-Default-Border)":"1px solid var(--Border-Variant)",T=s?ln:an,I=s?sn:ln,A=s?an:nn;return de(Ma.Provider,{value:{variant:t,color:r,size:n,orientation:i},children:de(h,{component:B,href:u||void 0,onClick:k?c:void 0,role:k?"button":void 0,tabIndex:k?0:void 0,"aria-pressed":!!l||void 0,draggable:S||void 0,className:"card card-"+t+" card-"+n+" card-"+i+(k?" card-clickable":"")+(l?" card-selected":"")+(s?" card-elevated":"")+(S?" card-draggable":"")+" "+p,sx:{display:"flex",border:C,borderRadius:"var(--Card-Radius)",boxShadow:T,overflow:"hidden",textDecoration:"none",transition:"box-shadow 0.2s ease, border-color 0.2s ease, transform 0.1s ease",...k&&!S&&{cursor:"pointer","&:hover":{borderColor:"var(--Buttons-Default-Border)",boxShadow:I,transform:"translateY(-1px)"},"&:active":{transform:"translateY(0) scale(0.995)",boxShadow:A},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"3px",borderRadius:"calc(var(--Card-Radius) + 3px)"}},...S&&{cursor:"grab","&:hover":{borderColor:"var(--Buttons-Default-Border)",boxShadow:I},"&:active":{cursor:"grabbing",zIndex:10,boxShadow:sn,transform:"scale(1.02)",borderWidth:"2px",borderColor:"var(--Buttons-Primary-Border)"},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"3px"}},...m},onKeyDown:k?e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),c?.())}:void 0,...f,children:de(h,{"data-theme":x||void 0,"data-surface":b,sx:{display:"flex",flexDirection:y?"row":"column",gap:v.gap,padding:v.padding,backgroundColor:"var(--Background)",color:"var(--Text)",fontSize:v.fontSize,fontFamily:"inherit",borderRadius:"inherit",position:"relative",flex:1,minWidth:0,overflow:"hidden"},children:e})})})}function Da({children:e,className:t="",sx:r={},...o}){const{size:n}=l(Ma);return de(h,{className:"card-content "+t,sx:{display:"flex",flexDirection:"column",gap:(La[n]||La.medium).gap,flex:1,minWidth:0,...r},...o,children:e})}const Fa=e=>de(Wa,{clickable:!0,selected:e.selected,...e}),Na=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",Ha=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary"]},{label:"Core",colors:["white","black"]},{label:"State",colors:["info","success","warning","error"]}],Va=[Be,Ct,ge,Ie,Tt,It];function Qa(){const[e,t]=r("primary"),[o,n]=r("solid"),[i,a]=r("medium"),l=Va[0];return ce(Ba,{spacing:4,style:{paddingBottom:64},children:[de(Jr,{children:"Icon Badge"}),ce("div",{style:{display:"grid",gridTemplateColumns:"1fr 1fr",gap:24},children:[de(Wa,{padding:"medium",children:ce(Ba,{spacing:4,alignItems:"center",children:[de("div",{style:{padding:40},children:de(ga,{color:e,variant:o,size:i,children:de(l,{})})}),de(ka,{spacing:4,alignItems:"flex-end",children:["small","medium","large"].map(t=>ce(Ba,{spacing:1,alignItems:"center",children:[de(ga,{color:e,variant:o,size:t,children:de(l,{})}),de(ao,{style:{color:"var(--Quiet)"},children:Na(t)})]},t))}),ce(Ba,{spacing:1,alignItems:"center",children:[de(ao,{style:{color:"var(--Quiet)",fontWeight:600,fontSize:"0.7rem"},children:"Variants"}),de(ka,{spacing:3,children:["solid","light","dark"].map(t=>ce(Ba,{spacing:1,alignItems:"center",children:[de(ga,{color:e,variant:t,size:"medium",children:de(l,{})}),de(ao,{style:{color:"var(--Quiet)",fontSize:"0.65rem"},children:Na(t)})]},t))})]}),ce(Ba,{spacing:1,alignItems:"center",children:[de(ao,{style:{color:"var(--Quiet)",fontWeight:600,fontSize:"0.7rem"},children:"All Colors"}),de(ka,{spacing:2,style:{flexWrap:"wrap",justifyContent:"center"},children:Ha.flatMap(e=>e.colors).map(e=>ce(Ba,{spacing:0,alignItems:"center",children:[de(ga,{color:e,variant:o,size:"small",children:de(l,{})}),de(ao,{style:{color:"var(--Quiet)",fontSize:"0.55rem"},children:Na(e)})]},e))})]})]})}),de(Wa,{padding:"medium",children:ce(Ba,{spacing:4,children:[de(Jr,{style:{fontSize:"1rem"},children:"Playground"}),ce(Ba,{spacing:2,children:[de(ko,{children:"Color"}),Ha.map(r=>ce(Ba,{spacing:1,children:[de(ao,{style:{color:"var(--Quiet)",fontWeight:600,fontSize:"0.7rem"},children:r.label}),de(ka,{spacing:1,children:r.colors.map(r=>de(An,{variant:e===r?"default":"outline",size:"small",onClick:()=>t(r),children:Na(r)},r))})]},r.label))]}),ce(Ba,{spacing:1,children:[de(ko,{children:"Variant"}),de(ba,{size:"small",children:["solid","light","dark"].map(e=>de(An,{variant:o===e?"default":"outline",size:"small",onClick:()=>n(e),children:Na(e)},e))})]}),ce(Ba,{spacing:1,children:[de(ko,{children:"Size"}),de(ba,{size:"small",children:["small","medium","large"].map(e=>de(An,{variant:i===e?"default":"outline",size:"small",onClick:()=>a(e),children:Na(e)},e))})]}),ce(Ba,{spacing:0,children:[ce(ao,{style:{color:"var(--Quiet)"},children:["data-theme: ",Na(e),"light"===o?"-Light":""]}),ce(ao,{style:{color:"var(--Quiet)"},children:["data-surface: ","dark"===o?"Surface-Dimmest":"Surface"]}),de(ao,{style:{color:"var(--Quiet)"},children:"bg: var(--Background)"}),de(ao,{style:{color:"var(--Quiet)"},children:"icon: var(--Text)"})]})]})})]})]})}const ja={primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info",success:"Success",warning:"Warning",error:"Error"},Ga={small:{size:32,iconSize:16,fontSize:"13px",px:12,gap:6},medium:{size:48,iconSize:24,fontSize:"14px",px:16,gap:8},large:{size:56,iconSize:36,fontSize:"15px",px:20,gap:10}};function Ua({children:e,icon:t,label:r,variant:o="solid",color:n="primary",size:i="medium",extended:a=!1,animate:l=!1,disabled:s=!1,onClick:d,ariaLabel:c,className:u="",sx:p={},...m}){const f=function(e,t){const r=ja[t]||"Primary";return"light"===e?{bg:"var(--Buttons-"+r+"-Light-Button)",text:"var(--Buttons-"+r+"-Light-Text)",border:"var(--Buttons-"+r+"-Light-Border)",hover:"var(--Buttons-"+r+"-Light-Hover)",active:"var(--Buttons-"+r+"-Light-Pressed)"}:{bg:"var(--Buttons-"+r+"-Button)",text:"var(--Buttons-"+r+"-Text)",border:"var(--Buttons-"+r+"-Border)",hover:"var(--Buttons-"+r+"-Hover)",active:"var(--Buttons-"+r+"-Pressed)"}}(o,n),g=Ga[i]||Ga.medium,x=t||e||de(At,{sx:{fontSize:g.iconSize}}),b=c||r||"Action";return ce(ue,{children:[l&&de("style",{children:"\n@keyframes fab-pulse {\n 0% { box-shadow: 0 0 0 0 rgba(var(--pulse-rgb, 0,0,0), 0.4); }\n 70% { box-shadow: 0 0 0 12px rgba(var(--pulse-rgb, 0,0,0), 0); }\n 100% { box-shadow: 0 0 0 0 rgba(var(--pulse-rgb, 0,0,0), 0); }\n}\n"}),ce(h,{component:"button",type:"button",role:"button","aria-label":b,onClick:d,disabled:s,className:"fab fab-"+o+" fab-"+n+" fab-"+i+(a?" fab-extended":"")+(l?" fab-animate":"")+(s?" fab-disabled":"")+(u?" "+u:""),sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",gap:a?g.gap+"px":0,...a?{height:g.size+"px",borderRadius:g.size/2+"px",px:g.px+"px"}:{width:g.size+"px",height:g.size+"px",borderRadius:"50%"},backgroundColor:f.bg,color:f.text,border:"var(--Button-Border-Width) solid "+f.border,"--_height":g.size+"px","--_bevel":"min(calc(var(--Button-Bevel) * var(--_height) / 100), calc(var(--_height) / 5))",boxShadow:`${fn(n)}, ${ln}`,fontSize:g.fontSize,fontFamily:"inherit",fontWeight:600,cursor:s?"not-allowed":"pointer",opacity:s?.5:1,outline:"none",flexShrink:0,transition:"background-color 0.15s ease, box-shadow 0.2s ease, transform 0.1s ease","&:hover":s?{}:{backgroundColor:f.hover,boxShadow:`${fn(n)}, ${sn}`},"&:active":s?{}:{backgroundColor:f.active,transform:"scale(0.96)",boxShadow:fn(n)},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"2px"},...l&&!s&&{animation:"fab-pulse 2s infinite"},...p},...m,children:[de(h,{sx:{display:"flex",alignItems:"center",justifyContent:"center",fontSize:g.iconSize+"px",color:"inherit","& .MuiSvgIcon-root":{fontSize:"inherit",color:"inherit"}},children:x}),a&&r&&de(h,{component:"span",sx:{whiteSpace:"nowrap",lineHeight:1},children:r})]})]})}const Xa=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",Ka=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}],qa={default:"Tertiary",primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info",success:"Success",warning:"Warning",error:"Error"};function Ja({label:e,selected:t,onClick:r}){return de(An,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function Ya({color:e,selected:t,onClick:r}){const o=qa[e]||"Primary";return de(h,{component:"button",onClick:()=>r(e),"aria-label":"Select "+Xa(e),"aria-pressed":t,title:Xa(e),sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+o+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Buttons-"+o+"-Text)",pointerEvents:"none"}})})}function Za({value:e,onChange:t,placeholder:r,label:o}){return ce(h,{children:[o&&de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4},children:o}),de(h,{component:"input",type:"text",value:e,onChange:e=>t(e.target.value),placeholder:r,sx:{width:"100%",padding:"6px 10px",fontSize:"13px",fontFamily:"inherit",border:"1px solid var(--Border)",borderRadius:"4px",backgroundColor:"var(--Background)",color:"var(--Text)",outline:"none","&:focus":{borderColor:"var(--Focus-Visible)"}}})]})}function $a(){const[e,t]=r("default"),[o,n]=r("medium"),[i,a]=r("Add"),[l,s]=r(!1),[d,c]=r("Create"),[u,p]=r(!1),[m,f]=r(!1),[g,x]=r(null),[b,v]=r("Surface"),y="default"===e?"tertiary":e;return ce(h,{sx:{pb:8},children:[de(Jr,{children:"Floating Action Button"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ci,{theme:g,children:de(Ua,{color:y,size:o,icon:(()=>{const e=zt[i]||zt.Add;return de(jo,{size:"medium",children:de(e,{})})})(),extended:l,label:d,animate:u,disabled:m,ariaLabel:l?d:i})}),de(Qi,{code:(()=>{const t=[];return"default"!==e&&t.push('color="'+e+'"'),"medium"!==o&&t.push('size="'+o+'"'),t.push("icon={<"+i+"Icon />}"),l&&(t.push("extended"),t.push('label="'+d+'"')),u&&t.push("animate"),m&&t.push("disabled"),t.push('ariaLabel="'+(l?d:i)+'"'),"<Fab\n "+t.join("\n ")+"\n/>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(ai,{defaultValue:0,variant:"standard",color:"primary",children:[ce(li,{children:[de(si,{children:"Playground"}),de(si,{children:"Accessibility"})]}),de(di,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(mi,{theme:g,onThemeChange:x,surface:b,onSurfaceChange:v})}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:Ka.map(r=>ce(h,{children:[de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:r.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:r.colors.map(r=>de(Ya,{color:r,selected:e===r,onClick:t},r))})]},r.label))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",spacing:1,children:["small","medium","large"].map(e=>de(Ja,{label:Xa(e),selected:o===e,onClick:()=>n(e)},e))})]}),ce(h,{sx:{mt:3},children:[de(Za,{label:"Icon Name",value:i,onChange:a,placeholder:"Add"}),ce(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:4},children:[de("a",{href:"https://mui.com/material-ui/material-icons/",target:"_blank",rel:"noopener noreferrer",style:{color:"var(--Hotlink)"},children:"Material icon"})," name (e.g. Add, Edit, Favorite, Share)"]})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"OPTIONS"}),ce(h,{sx:{display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Extended"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Pill shape with icon + text label"})]}),de(ra,{checked:l,onChange:e=>s(e.target.checked),size:"small","aria-label":"Extended"})]}),l&&de(h,{sx:{mt:1.5},children:de(Za,{label:"Label Text",value:d,onChange:c,placeholder:"Create"})}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Animation"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Pulse ring effect to draw attention"})]}),de(ra,{checked:u,onChange:e=>p(e.target.checked),size:"small","aria-label":"Animation"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Disabled"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Non-interactive state"})]}),de(ra,{checked:m,onChange:e=>f(e.target.checked),size:"small","aria-label":"Disabled"})]})]})]})}),de(di,{value:1,children:de(h,{sx:{p:3},children:ce(B,{spacing:3,children:[ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"ARIA and Semantics"}),ce(B,{spacing:0,children:[ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ao,{children:"Role:"}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:'<button role="button" aria-label="...">'})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ao,{children:"Label:"}),de(bo,{style:{color:"var(--Text-Quiet)"},children:l?"Extended: visible label provides accessible name.":"Icon-only: aria-label is required."})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ao,{children:"Focus:"}),de(bo,{style:{color:"var(--Text-Quiet)"},children:"3px solid var(--Focus-Visible) with 2px offset."})]}),ce(h,{sx:{py:1.5},children:[de(ao,{children:"Disabled:"}),de(bo,{style:{color:"var(--Text-Quiet)"},children:"HTML disabled attribute. 50% opacity, removed from tab order."})]})]})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"Best Practices"}),ce(B,{spacing:0,children:[ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ao,{children:"One per screen:"}),de(bo,{style:{color:"var(--Text-Quiet)"},children:"FABs represent the primary action. Use at most one per view."})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ao,{children:"Extended for clarity:"}),de(bo,{style:{color:"var(--Text-Quiet)"},children:"Use extended variant when the icon alone may be ambiguous."})]}),ce(h,{sx:{py:1.5},children:[de(ao,{children:"Animation:"}),de(bo,{style:{color:"var(--Text-Quiet)"},children:"Use sparingly. Respect prefers-reduced-motion."})]})]})]})]})})})]})})})]})]})}function _a({items:e=[],sections:t,value:o,defaultValue:i=0,onChange:a,expandable:l=!1,expandedWidth:s="partial",defaultExpanded:d=!1,fabAction:c,className:u="",sx:p={},...m}){const[f,g]=r(i),[x,b]=r(d),v=void 0!==o,y=v?o:f,S=n(e=>{v||g(e),a?.(e)},[v,a]),k=l&&x;return ce(h,{component:"nav",role:"navigation","aria-label":"Navigation rail","data-theme":"Default","data-surface":"Surface-Dim",className:"rail"+(k?" rail-expanded":" rail-collapsed")+" "+u,sx:{display:"flex",flexDirection:"column",width:(k?"full"===s?320:240:72)+"px",minHeight:"100%",backgroundColor:"var(--Background)",borderRight:"1px solid var(--Border)",fontFamily:"inherit",transition:"width 0.25s ease",overflow:"hidden",flexShrink:0,...p},...m,children:[l&&de(h,{sx:{display:"flex",justifyContent:k?"flex-start":"center",px:k?1.5:0,height:56,alignItems:"center"},children:de(An,{iconOnly:!0,variant:"ghost",size:"small",onClick:()=>b(e=>!e),"aria-label":k?"Collapse menu":"Expand menu",children:de(jo,{size:"small",sx:{color:"inherit"},children:de(k?Ot:Pt,{})})})}),c&&de(h,{sx:{px:k?2:1,py:1,flexShrink:0},children:de(An,{variant:"primary-light",size:"medium",onClick:c.onClick,"aria-label":c.label||"Action",startIcon:c.icon?de(jo,{size:"small",sx:{color:"inherit"},children:c.icon}):void 0,sx:{width:k?"100%":56,borderRadius:k?"28px":"var(--Style-Border-Radius)",justifyContent:k?"flex-start":"center",transition:"all 0.2s ease"},children:k?c.label:null})}),de(h,{role:"tablist","aria-orientation":"vertical",sx:{flex:1,overflowY:"auto",overflowX:"hidden",py:.5},children:(()=>{if(t&&t.length>0){const e=[];let r=0;return t.forEach((t,o)=>{o>0&&e.push(de(h,{"aria-hidden":"true",sx:{height:"1px",backgroundColor:"var(--Border)",mx:k?2:1.5,my:.5}},"divider-"+o)),t.items.forEach(t=>{const o=r;e.push(de(el,{icon:t.icon,label:t.label,badge:t.badge,selected:y===o,expanded:k,onClick:()=>S(o)},"item-"+o)),r++})}),e}return e.map((e,t)=>de(el,{icon:e.icon,label:e.label,badge:e.badge,selected:y===t,expanded:k,onClick:()=>S(t)},t))})()})]})}function el({icon:e,label:t,badge:r,selected:o,expanded:n,onClick:i}){const a="var(--Buttons-Default-Button)",l="var(--Buttons-Default-Text)";return ce(h,{component:"button",type:"button",role:"tab","aria-selected":o,"aria-label":t,onClick:i,sx:{display:"flex",flexDirection:n?"row":"column",alignItems:"center",justifyContent:n?"flex-start":"center",gap:n?1.5:.25,width:"100%",height:56,px:n?2.5:.5,border:"none",borderRadius:0,backgroundColor:n&&o?a:"transparent",color:o?l:"var(--Quiet)",cursor:"pointer",fontFamily:"inherit",textAlign:n?"left":"center",transition:"background-color 0.15s ease, color 0.15s ease",outline:"none","&:hover":o?{}:{backgroundColor:"var(--Hover)",color:"var(--Text)"},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"-3px"}},children:[ce(h,{sx:{position:"relative",display:"flex",alignItems:"center",justifyContent:"center",...!n&&{width:o?56:24,height:32,borderRadius:"16px",backgroundColor:o?a:"transparent",transition:"background-color 0.2s ease, width 0.2s ease"},...n&&{flexShrink:0}},children:[de(jo,{size:"small",sx:{color:"inherit"},children:e}),r&&de(tl,{value:r})]}),t&&de(bo,{style:{color:"inherit",fontWeight:500,whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis",...n?{flex:1}:{maxWidth:"100%",fontSize:"11px"}},children:t})]})}function tl({value:e}){return de(h,{sx:{position:"absolute",top:-4,right:-6,minWidth:16,height:16,borderRadius:"8px",backgroundColor:"var(--Tags-Error-BG)",color:"var(--Tags-Error-Text)",fontSize:"10px",fontWeight:700,px:.5,display:"flex",alignItems:"center",justifyContent:"center",lineHeight:1},children:e})}const rl=[{icon:de(Be,{}),label:"Home"},{icon:de(Te,{}),label:"Search"},{icon:de(ke,{}),label:"Favorites",badge:3},{icon:de(me,{}),label:"Profile"},{icon:de(Ce,{}),label:"Settings"}];function ol({label:e,selected:t,onClick:r}){return de(An,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function nl(){const[e,t]=r(!0),[o,n]=r("partial"),[i,a]=r(!1),[l,s]=r(null),[d,c]=r("Surface");return ce(h,{sx:{pb:8},children:[de(Jr,{children:"Rail"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[ce(ci,{theme:l,surface:d,sx:{minHeight:400,alignItems:"stretch",p:0},children:[de(_a,{items:rl,expandable:e,expandedWidth:o,fabAction:i?{icon:de(At,{}),label:"Create",onClick:()=>{}}:void 0}),de(h,{sx:{flex:1,p:3},children:de(ao,{style:{color:"var(--Quiet)"},children:"Main content area"})})]}),de(Qi,{code:(()=>{const t=["items={items}"];return e&&(t.push("expandable"),"partial"!==o&&t.push('expandedWidth="full"')),i&&t.push('fabAction={{ icon: <AddIcon />, label: "Create", onClick: handleCreate }}'),t.push("value={activeIndex}"),t.push("onChange={setActiveIndex}"),"<Rail\n "+t.join("\n ")+"\n/>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(ai,{defaultValue:0,variant:"standard",color:"primary",children:[ce(li,{children:[de(si,{children:"Playground"}),de(si,{children:"Accessibility"})]}),de(di,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(mi,{theme:l,onThemeChange:s,surface:d,onSurfaceChange:c})}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"EXPANDED WIDTH"}),de(B,{direction:"row",spacing:1,children:["partial","full"].map(e=>{return de(ol,{label:(t=e,t?t.charAt(0).toUpperCase()+t.slice(1):""),selected:o===e,onClick:()=>n(e)},e);var t})})]}),ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Expandable"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Toggle between collapsed and expanded"})]}),de(ra,{variant:"default-outline",checked:e,onChange:e=>t(e.target.checked),size:"small","aria-label":"Expandable"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"FAB Action"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Show create button at top"})]}),de(ra,{variant:"default-outline",checked:i,onChange:e=>a(e.target.checked),size:"small","aria-label":"FAB action"})]})]})}),de(di,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Nav",value:'<nav role="navigation" aria-label="Navigation rail">'},{label:"Items",value:'role="tab" aria-selected on each item'},{label:"TabList",value:'role="tablist" aria-orientation="vertical"'},{label:"Toggle",value:'aria-label="Expand/Collapse menu"'},{label:"Focus",value:"outline: 3px solid var(--Focus-Visible); outline-offset: -3px"},{label:"Badge",value:"Visual only — announced via aria-label on parent item"}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ao,{children:[e,":"]}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}const il={default:{theme:"Default"},primary:{theme:"Primary"},"primary-light":{theme:"Primary",surface:"Surface-Brightest"},white:{theme:"Neutral",surface:"Surface-Brightest"},black:{theme:"Neutral",surface:"Surface-Dimmest"}};function al({items:e=[],value:t,defaultValue:o,onChange:i,type:a="floating",orientation:l="horizontal",color:s="default",fab:d,className:c="",sx:u={},...p}){const[m,f]=r(o??null),g=void 0!==t,x=g?t:m,b=n(e=>{const t=x===e?null:e;g||f(t),i?.(t)},[g,x,i]),v=il[s]||il.default,y=v.theme,S=v.surface,k="vertical"===l,B="floating"===a,w=de(h,{role:"toolbar","aria-orientation":l,"aria-label":"Toolbar","data-theme":y,"data-surface":S||"Surface",className:"toolbar toolbar-"+a+" toolbar-"+l+" toolbar-"+s+" "+c,sx:{display:"inline-flex",flexDirection:k?"column":"row",alignItems:"center",gap:"4px",backgroundColor:"var(--Background)",border:"1px solid var(--Border-Variant)",borderRadius:B?"56px":"var(--Style-Border-Radius)",padding:B?"8px 16px":"8px",fontFamily:"inherit",flexShrink:0,...B&&{boxShadow:an},...u},...p,children:e.map((e,t)=>{const r=x===t;return de(An,{iconOnly:!0,variant:r?"default":"ghost",size:"small",onClick:()=>b(t),"aria-label":e.label,"aria-checked":r,role:"radio",children:de(jo,{size:"small",sx:{color:"inherit"},children:e.icon})},e.key||t)})});return d&&B?ce(h,{sx:{display:"inline-flex",flexDirection:k?"column":"row",alignItems:"center",gap:1},children:[w,de(An,{iconOnly:!0,variant:"default",size:"large",onClick:d.onClick,"aria-label":d.label||"Action",sx:{borderRadius:"50%",width:56,height:56,minWidth:"unset",minHeight:"unset"},children:de(jo,{size:"medium",sx:{color:"inherit"},children:d.icon})})]}):w}const ll=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",sl=[{icon:de(Lt,{}),label:"Bold"},{icon:de(Mt,{}),label:"Italic"},{icon:de(Wt,{}),label:"Underline"},{icon:de(Dt,{}),label:"Align left"},{icon:de(Ft,{}),label:"Align center"}];function dl({label:e,selected:t,onClick:r}){return de(An,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function cl(){const[e,t]=r("floating"),[o,n]=r("default"),[i,a]=r("horizontal"),[l,s]=r(!1),[d,c]=r(null),[u,p]=r("Surface");return ce(h,{sx:{pb:8},children:[de(Jr,{children:"Toolbar"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ci,{theme:d,surface:u,sx:{minHeight:200},children:de(al,{items:sl,type:e,color:o,orientation:i,fab:l&&"floating"===e?{icon:de(At,{}),label:"Create",onClick:()=>{}}:void 0})}),de(Qi,{code:(()=>{const t=["items={items}"];return"floating"!==e&&t.push('type="contextual"'),"default"!==o&&t.push('color="'+o+'"'),"horizontal"!==i&&t.push('orientation="vertical"'),l&&t.push('fab={{ icon: <AddIcon />, label: "Create", onClick: handleCreate }}'),t.push("value={selected}"),t.push("onChange={setSelected}"),"<Toolbar\n "+t.join("\n ")+"\n/>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(ai,{defaultValue:0,variant:"standard",color:"primary",children:[ce(li,{children:[de(si,{children:"Playground"}),de(si,{children:"Accessibility"})]}),de(di,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(mi,{theme:d,onThemeChange:c,surface:u,onSurfaceChange:p})}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"TYPE"}),de(B,{direction:"row",spacing:1,children:["floating","contextual"].map(r=>de(dl,{label:ll(r),selected:e===r,onClick:()=>t(r)},r))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:["default","primary","primary-light","white","black"].map(e=>de(dl,{label:ll(e),selected:o===e,onClick:()=>n(e)},e))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"ORIENTATION"}),de(B,{direction:"row",spacing:1,children:["horizontal","vertical"].map(e=>de(dl,{label:ll(e),selected:i===e,onClick:()=>a(e)},e))})]}),"floating"===e&&ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"FAB Button"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Add FAB to the right of toolbar"})]}),de(ra,{variant:"default-outline",checked:l,onChange:e=>s(e.target.checked),size:"small","aria-label":"FAB button"})]})]})}),de(di,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Role",value:'role="toolbar" aria-orientation aria-label'},{label:"Items",value:'role="radio" aria-checked on each icon button'},{label:"Selection",value:"Toggle — click selected again to deselect"},{label:"Focus",value:"Uses Button component focus styles"},{label:"Floating",value:"borderRadius 56px, padding 16px, Effect-Level-2 shadow"},{label:"Contextual",value:"Standard border-radius, padding 8px, no shadow"}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ao,{children:[e,":"]}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}const ul={small:{height:"var(--Small-Button-Height)",fontSize:"13px",padding:"4px 8px",iconSize:16,btnSize:28},medium:{height:"var(--Button-Height)",fontSize:"14px",padding:"6px 12px",iconSize:18,btnSize:36},large:{height:"var(--Large-Button-Height)",fontSize:"16px",padding:"8px 16px",iconSize:20,btnSize:44}};function pl({value:e,defaultValue:t=0,onChange:a,min:l,max:s,step:d=1,variant:c="outlined",style:u="outline",color:p="default",size:m="medium",label:f,labelPosition:g="top",placeholder:x,helperText:b,disabled:v=!1,fullWidth:y=!1,className:S="",sx:k={},...B}){const[w,C]=r(t),[T,I]=r(!1),A=o(null),z=void 0!==e,R=z?e:w,E=""!==R&&null!=R,P=(O="default"===p?"primary":p).charAt(0).toUpperCase()+O.slice(1);var O;const L="var(--Buttons-"+P+"-Border)",M="default"===p?"var(--Text)":"var(--Text-"+P+")",W="outlined"===c,D="floating"===g,F="top"===g,N=ul[m]||ul.medium,H="small"===m?ao:co,V=n(e=>{let t="number"==typeof e?e:parseFloat(e);isNaN(t)&&(t=0),void 0!==l&&t<l&&(t=l),void 0!==s&&t>s&&(t=s),z||C(t),a?.(t)},[z,a,l,s]),Q=o(R);Q.current=R;const j=n(e=>{if(v)return;const t="number"==typeof Q.current?Q.current:parseFloat(Q.current)||0;void 0!==l&&e<0&&t<=l||void 0!==s&&e>0&&t>=s||V(t+e*d)},[v,d,l,s,V]),G=void 0!==l&&R<=l,U=void 0!==s&&R>=s,X=o(null),K=o(null),q=n(()=>{X.current&&(clearTimeout(X.current),X.current=null),K.current&&(clearInterval(K.current),K.current=null)},[]),J=n(e=>{v||(q(),j(e),X.current=setTimeout(()=>{let t=120,r=0;const o=()=>{j(e),r+=1,10===r&&t>60?(clearInterval(K.current),t=60,K.current=setInterval(o,t)):30===r&&t>30&&(clearInterval(K.current),t=30,K.current=setInterval(o,t))};K.current=setInterval(o,t)},400))},[v,j,q]);i(()=>q,[q]);const Y=e=>({onPointerDown:t=>{if(void 0===t.button||0===t.button){t.preventDefault();try{t.currentTarget.setPointerCapture?.(t.pointerId)}catch(e){}J(e)}},onPointerUp:e=>{try{e.currentTarget.releasePointerCapture?.(e.pointerId)}catch(e){}q()},onPointerCancel:q,onPointerLeave:q,onKeyDown:t=>{"Enter"!==t.key&&" "!==t.key||t.repeat||(t.preventDefault(),J(e))},onKeyUp:e=>{"Enter"!==e.key&&" "!==e.key||q()},onBlur:q}),Z=e=>{const t=e.target.value;if(""===t||"-"===t)return void(z||C(t));const r=parseFloat(t);isNaN(r)||V(r)},$=e=>{"ArrowUp"===e.key&&(e.preventDefault(),j(1)),"ArrowDown"===e.key&&(e.preventDefault(),j(-1))},_={display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:"var(--Buttons-"+P+"-Light-Button, transparent)",color:"var(--Buttons-"+P+"-Light-Text, var(--Text))",cursor:"pointer",outline:"none",flexShrink:0,border:"none",transition:"background-color 0.15s ease","&:hover":{backgroundColor:"var(--Buttons-"+P+"-Hover)"},"&:active":{backgroundColor:"var(--Buttons-"+P+"-Pressed)"},"&:focus-visible":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"1px"},"&:disabled":{opacity:.4,cursor:"not-allowed"}},ee={},te=()=>F&&f?de(H,{component:"label",style:{display:"block",marginBottom:"6px",color:v?"var(--Quiet)":"var(--Text)",fontWeight:500,opacity:v?.6:1},children:f}):null;return ce(h,W?{className:"numberfield numberfield-outlined"+(v?" numberfield-disabled":"")+(S?" "+S:""),sx:{width:y?"100%":"auto",fontFamily:"inherit",...k},...B,children:[te(),de(h,{sx:{border:"1px solid "+L,borderRadius:"small"===m?"var(--Sm-Input-Radius, var(--Input-Radius, var(--Style-Border-Radius)))":"large"===m?"var(--Lg-Input-Radius, var(--Input-Radius, var(--Style-Border-Radius)))":"var(--Input-Radius, var(--Style-Border-Radius))",overflow:"hidden",transition:"border-color 0.15s ease",boxShadow:"none",opacity:v?.5:1,"&:focus-within":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"}},children:de(h,{...ee,children:ce(h,{sx:{position:"relative",display:"flex",alignItems:"stretch",minHeight:N.height,backgroundColor:"var(--Hover)"},children:[D&&f&&de(h,{sx:{position:"absolute",top:E||T?"6px":"50%",left:"14px",transform:E||T?"scale(0.75)":"translateY(-50%)",transformOrigin:"top left",color:T?M:"var(--Quiet)",fontSize:N.fontSize,fontWeight:400,pointerEvents:"none",transition:"top 0.15s ease, transform 0.15s ease, color 0.15s ease",zIndex:1},children:f}),de(h,{component:"input",ref:A,type:"text",inputMode:"numeric",role:"spinbutton","aria-valuenow":"number"==typeof R?R:void 0,"aria-valuemin":l,"aria-valuemax":s,"aria-label":f||"Number",value:R,onChange:Z,onKeyDown:$,onFocus:()=>I(!0),onBlur:()=>I(!1),disabled:v,placeholder:D?void 0:x||"",sx:{flex:1,border:"none",outline:"none",backgroundColor:"transparent",color:E||T?M:"var(--Quiet)",fontSize:N.fontSize,fontFamily:"var(--Body-Font-Family)",fontWeight:"var(--Body-Font-Weight)",padding:D?"22px 14px 6px":N.padding,minWidth:0,"&::placeholder":{color:"var(--Quiet)",opacity:1},"&:disabled":{cursor:"not-allowed"}}}),ce(h,{sx:{display:"flex",flexDirection:"column",borderLeft:"1px solid "+L},children:[de(h,{component:"button",type:"button","aria-label":"Increase",...Y(1),disabled:v||U,sx:{..._,flex:1,width:32,borderBottom:"1px solid "+L},children:de(jo,{size:"small",children:de(Nt,{})})}),de(h,{component:"button",type:"button","aria-label":"Decrease",...Y(-1),disabled:v||G,sx:{..._,flex:1,width:32},children:de(jo,{size:"small",children:de(Ht,{})})})]})]})})}),b&&de(ao,{style:{color:"var(--Quiet)",marginTop:"4px",marginLeft:"2px"},children:b})]}:{className:"numberfield numberfield-spinner"+(v?" numberfield-disabled":"")+(S?" "+S:""),sx:{fontFamily:"inherit",...k},...B,children:[te(),ce(h,{sx:{display:"inline-flex",alignItems:"center",gap:"small"===m?.5:1,opacity:v?.5:1},children:[de(h,{component:"button",type:"button","aria-label":"Decrease",...Y(-1),disabled:v||G,sx:{..._,width:N.btnSize,height:N.btnSize,borderRadius:"small"===m?"var(--Sm-Button-Icon-Radius, var(--Button-Icon-Radius, var(--Style-Border-Radius)))":"large"===m?"var(--Lg-Button-Icon-Radius, var(--Button-Icon-Radius, var(--Style-Border-Radius)))":"var(--Button-Icon-Radius, var(--Style-Border-Radius))",border:"1px solid "+L},children:de(jo,{size:"small",children:de(fe,{})})}),de(h,{sx:{border:"1px solid "+L,borderRadius:"small"===m?"var(--Sm-Input-Radius, var(--Input-Radius, var(--Style-Border-Radius)))":"large"===m?"var(--Lg-Input-Radius, var(--Input-Radius, var(--Style-Border-Radius)))":"var(--Input-Radius, var(--Style-Border-Radius))",overflow:"hidden","&:focus-within":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"}},children:de(h,{...ee,children:de(h,{component:"input",ref:A,type:"text",inputMode:"numeric",role:"spinbutton","aria-valuenow":"number"==typeof R?R:void 0,"aria-valuemin":l,"aria-valuemax":s,"aria-label":f||"Number",value:R,onChange:Z,onKeyDown:$,onFocus:()=>I(!0),onBlur:()=>I(!1),disabled:v,sx:{width:"small"===m?40:56,minHeight:N.height,textAlign:"center",border:"none",outline:"none",backgroundColor:"var(--Hover)",color:"var(--Text)",fontSize:N.fontSize,fontFamily:"var(--Body-Font-Family)",fontWeight:600,"&:disabled":{cursor:"not-allowed"}}})})}),de(h,{component:"button",type:"button","aria-label":"Increase",...Y(1),disabled:v||U,sx:{..._,width:N.btnSize,height:N.btnSize,borderRadius:"small"===m?"var(--Sm-Button-Icon-Radius, var(--Button-Icon-Radius, var(--Style-Border-Radius)))":"large"===m?"var(--Lg-Button-Icon-Radius, var(--Button-Icon-Radius, var(--Style-Border-Radius)))":"var(--Button-Icon-Radius, var(--Style-Border-Radius))",border:"1px solid "+L},children:de(jo,{size:"small",children:de(At,{})})})]}),b&&de(ao,{style:{color:"var(--Quiet)",marginTop:"4px",marginLeft:"2px"},children:b})]})}const hl=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",ml=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}];function fl({label:e,selected:t,onClick:r}){return de(An,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function gl({color:e,selected:t,onClick:r}){const o=hl(e);return de(h,{component:"button",onClick:()=>r(e),"aria-label":"Select "+o,"aria-pressed":t,title:o,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+o+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Buttons-"+o+"-Text)",pointerEvents:"none"}})})}function xl(){const[e,t]=r("outlined"),[o,n]=r("outline"),[i,a]=r("default"),[l,s]=r("medium"),[d,c]=r("top"),[u,p]=r(!0),[m,f]=r(!1),[g,x]=r(!1),[b,v]=r(null),[y,S]=r("Surface");return ce(h,{sx:{pb:8},children:[de(Jr,{children:"Number Field"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ci,{theme:b,surface:y,children:de(h,{sx:{width:"100%",maxWidth:"outlined"===e?300:"auto"},children:de(pl,{variant:e,style:o,color:i,size:l,label:u?"Quantity":void 0,labelPosition:d,min:0,max:100,disabled:m,fullWidth:g&&"outlined"===e})})}),de(Qi,{code:(()=>{const t=['variant="'+e+'"'];return"outline"!==o&&t.push('style="'+o+'"'),"default"!==i&&t.push('color="'+i+'"'),"medium"!==l&&t.push('size="'+l+'"'),u&&t.push('label="Quantity"'),"top"!==d&&t.push('labelPosition="'+d+'"'),t.push("min={0}"),t.push("max={100}"),m&&t.push("disabled"),g&&"outlined"===e&&t.push("fullWidth"),t.push("value={value}"),t.push("onChange={setValue}"),"<NumberField\n "+t.join("\n ")+"\n/>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(ai,{defaultValue:0,variant:"standard",color:"primary",children:[ce(li,{children:[de(si,{children:"Playground"}),de(si,{children:"Accessibility"})]}),de(di,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(mi,{theme:b,onThemeChange:v,surface:y,onSurfaceChange:S})}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"VARIANT"}),de(B,{direction:"row",spacing:1,children:["outlined","spinner"].map(r=>de(fl,{label:hl(r),selected:e===r,onClick:()=>t(r)},r))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"STYLE"}),de(B,{direction:"row",spacing:1,children:["outline","light"].map(e=>de(fl,{label:hl(e),selected:o===e,onClick:()=>n(e)},e))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:ml.map(e=>ce(h,{children:[de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:e.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:e.colors.map(e=>de(gl,{color:e,selected:i===e,onClick:a},e))})]},e.label))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",spacing:1,children:["small","medium","large"].map(e=>de(fl,{label:hl(e),selected:l===e,onClick:()=>s(e)},e))})]}),"outlined"===e&&ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"LABEL"}),de(B,{direction:"row",spacing:1,children:["top","floating","none"].map(e=>de(fl,{label:"none"===e?"None":hl(e),selected:d===e,onClick:()=>c(e)},e))})]}),ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Show Label"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Text label above field"})]}),de(ra,{variant:"default-outline",checked:u,onChange:e=>p(e.target.checked),size:"small","aria-label":"Show label"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Disabled"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Non-interactive state"})]}),de(ra,{variant:"default-outline",checked:m,onChange:e=>f(e.target.checked),size:"small","aria-label":"Disabled"})]}),"outlined"===e&&ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Full Width"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Stretch to container"})]}),de(ra,{variant:"default-outline",checked:g,onChange:e=>x(e.target.checked),size:"small","aria-label":"Full width"})]})]})}),de(di,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Role",value:'role="spinbutton" with aria-valuenow, aria-valuemin, aria-valuemax'},{label:"Label",value:"aria-label from label prop. Always provide a label."},{label:"Keyboard",value:"ArrowUp/Down increment/decrement. Direct text entry supported."},{label:"Steppers",value:'aria-label="Increase" / "Decrease" on stepper buttons'},{label:"Focus",value:"outline: 2px solid var(--Focus-Visible); outline-offset: 2px"},{label:"Disabled",value:"HTML disabled. Steppers also disabled at min/max bounds."}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ao,{children:[e,":"]}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}function bl({children:e,selected:t=!1,onChange:r,value:o,sx:n={},...i}){return de(R,{value:o,selected:t,onChange:r,sx:{border:"1px solid var(--Border)",color:"var(--Text)",backgroundColor:t?"var(--Buttons-Primary-Button)":"transparent","&:hover":{backgroundColor:t?"var(--Buttons-Primary-Button)":"var(--Container-High)"},"&.Mui-selected":{backgroundColor:"var(--Buttons-Primary-Button)",color:"#fff","&:hover":{backgroundColor:"var(--Buttons-Primary-Button)"}},textTransform:"none",fontWeight:500,...n},...i,children:e})}const vl=["default","primary","secondary","tertiary","neutral","black-white","info","success","warning","error"],yl=["fill","outline","ghost"];function Sl(){const e={};return vl.forEach(t=>{yl.forEach(r=>{e["fill"===r?t:t+"-"+r]=function(e,t){const r=hn(e),o={color:e,style:t,bg:"transparent",text:"var(--Quiet)",hover:"var(--Buttons-"+r+"-Hover)",hoverText:"var(--Buttons-"+r+"-Text)"};return"ghost"===t?{...o,border:"transparent",selectedBg:"transparent",selectedText:"var(--Buttons-"+r+"-Border)",selectedRing:"inset 0 0 0 2px var(--Buttons-"+r+"-Border)",bevel:!1}:"outline"===t?{...o,border:"var(--Buttons-"+r+"-Border)",selectedBg:"transparent",selectedText:"var(--Buttons-"+r+"-Border)",selectedRing:"inset 0 0 0 2px var(--Buttons-"+r+"-Border)",bevel:!1}:{...o,border:"var(--Buttons-"+r+"-Border)",selectedBg:"var(--Buttons-"+r+"-Button)",selectedText:"var(--Buttons-"+r+"-Text)",selectedRing:null,bevel:!0}}(t,r)})}),e}const kl={small:{height:"var(--Small-Button-Height)",fontSize:"13px",padding:"4px 10px",iconSize:16,gap:4,swatchRadius:"var(--Sm-Input-Swatch-Radius, 18px)"},medium:{height:"var(--Button-Height)",fontSize:"15px",padding:"6px 14px",iconSize:18,gap:6,swatchRadius:"var(--Input-Swatch-Radius, 26px)"},large:{height:"var(--Large-Button-Height)",fontSize:"17px",padding:"8px 18px",iconSize:20,gap:8,swatchRadius:"var(--Lg-Input-Swatch-Radius, 50px)"}};function Bl({variant:e="primary",size:t="medium",value:r,defaultValue:o,onChange:n,exclusive:i=!0,orientation:a="horizontal",disabled:l=!1,fullWidth:s=!1,children:d,className:c="",sx:u={},"aria-label":p,...h}){const m=Sl(),f=m[e]||m.default,g=kl[t]||kl.medium,x="vertical"===a,b={gap:0,border:"ghost"===f.style?"none":"1px solid "+f.border,borderRadius:"var(--Style-Border-Radius)",overflow:"hidden",...s&&{width:"100%"},display:"grid",gridAutoFlow:x?"row":"column",...x?{gridAutoRows:"1fr"}:{gridAutoColumns:"1fr"},"& .MuiToggleButtonGroup-grouped":{margin:0,borderLeft:0,borderTop:0,"&.Mui-selected + &.Mui-selected":{marginLeft:0,marginTop:0,borderLeft:0,borderTop:0}},"& .MuiToggleButton-root":{height:g.height,fontSize:g.fontSize,padding:g.padding,fontFamily:"inherit",fontWeight:500,textTransform:"none",letterSpacing:"0",lineHeight:1.4,backgroundColor:f.bg,color:f.text,border:"none",borderRadius:0,transition:"background-color 0.15s ease, color 0.15s ease","& .tbtn-start, & .tbtn-end":{display:"inline-flex",alignItems:"center",flexShrink:0,"& > *":{width:g.iconSize,height:g.iconSize,display:"block"}},"& .tbtn-start":{marginRight:"2px"},"& .tbtn-end":{marginLeft:"2px"},"& .tbtn-swatch":{display:"block",flexShrink:0,width:g.iconSize,height:g.iconSize,borderRadius:g.swatchRadius,border:"1px solid var(--Border-Variant)"},"& .tbtn-swatch:not(:only-child)":{marginRight:"2px"},"--_height":g.height,"--_bevel":"var(--Button-Bevel-Px, min(calc(var(--Button-Bevel, 0) * var(--_height) / 100), calc(var(--_height) / 5)))",...s&&{flex:1},..."ghost"===f.style?{}:x?{"&:not(:last-of-type)":{borderBottom:"1px solid "+f.border}}:{"&:not(:last-of-type)":{borderRight:"1px solid "+f.border}},"&:hover":{backgroundColor:f.hover,color:f.hoverText},"&.Mui-selected":{backgroundColor:f.selectedBg,color:f.selectedText,...f.bevel?{boxShadow:fn(f.color)}:{},...f.selectedRing?{boxShadow:f.selectedRing}:{}},"&.Mui-selected:hover":{backgroundColor:f.selectedBg,color:f.selectedText,...f.bevel?{boxShadow:fn(f.color)}:{},...f.selectedRing?{boxShadow:f.selectedRing}:{}},"&.Mui-focusVisible":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"-2px",zIndex:1},"&.Mui-disabled":{opacity:.6,color:f.text,backgroundColor:f.bg},"&.Mui-disabled.Mui-selected":{opacity:.6,backgroundColor:f.selectedBg,color:f.selectedText},"& .MuiSvgIcon-root":{fontSize:g.iconSize},"& > *:not(:only-child)":{marginRight:g.gap/2,marginLeft:g.gap/2}},...u};return de(E,{value:r,defaultValue:o,onChange:n,exclusive:i,orientation:a,disabled:l,className:"toggle-group-"+e+" "+c,sx:b,"aria-label":p,...h,children:d})}const wl=e=>de(Bl,{variant:"default",...e}),Cl=e=>de(Bl,{variant:"primary",...e}),Tl=e=>de(Bl,{variant:"secondary",...e}),Il=e=>de(Bl,{variant:"tertiary",...e}),Al=e=>de(Bl,{variant:"neutral",...e}),zl=e=>de(Bl,{variant:"black-white",...e}),Rl=e=>de(Bl,{variant:"info",...e}),El=e=>de(Bl,{variant:"success",...e}),Pl=e=>de(Bl,{variant:"warning",...e}),Ol=e=>de(Bl,{variant:"error",...e});function Ll({label:e,value:t="",onChange:o,placeholder:n,error:i=!1,errorMessage:a="",disabled:l=!1,helperText:s="",variant:d="outlined",size:c="medium",type:u="text",required:p=!1,fullWidth:m=!0,startAdornment:f,endAdornment:g,sx:x={},"aria-label":b,"aria-labelledby":v,...B}){const[w,C]=r(!1),T=i?"var(--Buttons-Error-Border)":w?"var(--Buttons-Primary-Border)":"var(--Border)",I=i||w?"var(--Text)":"var(--Text-Quiet)",A="var(--Text)";return ce(h,{sx:{width:m?"100%":"auto"},children:[de(y,{label:e,value:t,onChange:o,placeholder:n,disabled:l,variant:d,size:c,type:u,required:p,onFocus:()=>C(!0),onBlur:()=>C(!1),error:i,fullWidth:m,slotProps:{htmlInput:{...b?{"aria-label":b}:{},...v?{"aria-labelledby":v}:{}},input:{"data-surface":l?"Container-Low":"Container",style:{color:A},startAdornment:f?de(S,{position:"start",children:f}):void 0,endAdornment:g?de(S,{position:"end",children:g}):void 0}},sx:{width:m?"100%":"auto","& .MuiOutlinedInput-root":{backgroundColor:"var(--Background)",transition:"all 0.2s ease-in-out",color:A,"& fieldset":{borderColor:T,transition:"border-color 0.2s ease-in-out"},"&:hover fieldset":{borderColor:i?"var(--Buttons-Error-Border)":"var(--Buttons-Primary-Border)"},"&.Mui-focused fieldset":{borderColor:i?"var(--Buttons-Error-Border)":"var(--Buttons-Primary-Border)",borderWidth:"2px"},"&.Mui-disabled":{backgroundColor:"var(--Background)",opacity:.6}},"& .MuiInputLabel-root":{color:I,transition:"all 0.2s ease-in-out",fontSize:"14px",fontWeight:500,"&.Mui-focused":{color:"var(--Text)",fontWeight:600},"&.Mui-error":{color:"var(--Text)"},"&.Mui-disabled":{color:"var(--Text-Secondary)",opacity:.6}},"& .MuiFormHelperText-root":{color:i?"var(--Buttons-Error-Border)":"var(--Text-Secondary)",marginTop:"4px",fontSize:"12px"},...x},...B}),i&&a&&de(k,{error:!0,sx:{color:"var(--Buttons-Error-Border)",marginTop:"4px",fontSize:"12px",fontWeight:500},children:a})]})}function Ml({label:e="Email",...t}){return de(Ll,{label:e,type:"email",placeholder:"user@example.com",...t})}function Wl({label:e="Password",...t}){return de(Ll,{label:e,type:"password",...t})}function Dl({label:e="Search",placeholder:t="Type to search...",...r}){return de(Ll,{label:e,type:"search",placeholder:t,...r})}function Fl({label:e="Number",...t}){return de(Ll,{label:e,type:"number",...t})}function Nl({label:e="Phone",placeholder:t="(555) 123-4567",...r}){return de(Ll,{label:e,type:"tel",placeholder:t,...r})}function Hl({label:e="Website",placeholder:t="https://example.com",...r}){return de(Ll,{label:e,type:"url",placeholder:t,...r})}function Vl({label:e,value:t="",onChange:o,placeholder:n,error:i=!1,errorMessage:a="",disabled:l=!1,helperText:s="",rows:d=4,required:c=!1,fullWidth:u=!0,sx:p={},...m}){const[f,g]=r(!1);return ce(h,{sx:{width:u?"100%":"auto"},children:[de(y,{label:e,value:t,onChange:o,placeholder:n,disabled:l,variant:"outlined",multiline:!0,rows:d,required:c,fullWidth:u,onFocus:()=>g(!0),onBlur:()=>g(!1),error:i,slotProps:{input:{"data-surface":l?"Container-Low":"Container",style:{color:"var(--Text)"}}},sx:{width:u?"100%":"auto","& .MuiOutlinedInput-root":{backgroundColor:"var(--Background)",transition:"all 0.2s ease-in-out",color:"var(--Text)","& fieldset":{borderColor:i?"var(--Buttons-Error-Border)":f?"var(--Buttons-Primary-Border)":"var(--Border)",transition:"border-color 0.2s ease-in-out"},"&:hover fieldset":{borderColor:i?"var(--Buttons-Error-Border)":"var(--Buttons-Primary-Border)"},"&.Mui-focused fieldset":{borderColor:i?"var(--Buttons-Error-Border)":"var(--Buttons-Primary-Border)",borderWidth:"2px"},"&.Mui-disabled":{backgroundColor:"var(--Background)",opacity:.6}},"& .MuiInputLabel-root":{color:i||f?"var(--Text)":"var(--Text-Quiet)",transition:"all 0.2s ease-in-out",fontSize:"14px",fontWeight:500,"&.Mui-focused":{color:"var(--Text)",fontWeight:600},"&.Mui-error":{color:"var(--Text)"},"&.Mui-disabled":{color:"var(--Text-Secondary)",opacity:.6}},...p},...m}),i&&a&&de(k,{error:!0,sx:{color:"var(--Buttons-Error-Border)",marginTop:"4px",fontSize:"12px",fontWeight:500},children:a})]})}function Ql({fields:e=[],spacing:t=2,sx:r={},...o}){return de(h,{sx:{display:"flex",flexDirection:"column",gap:`var(--Spacing-${t})`,width:"100%",...r},...o,children:e.map(e=>de(Ll,{...e},e.id))})}const jl=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",Gl=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}],Ul=[{value:"apple",label:"Apple"},{value:"banana",label:"Banana"},{value:"cherry",label:"Cherry"},{value:"date",label:"Date"},{value:"elderberry",label:"Elderberry"}],Xl=[{value:"primary",label:"Primary",color:"var(--Buttons-Primary-Button)"},{value:"secondary",label:"Secondary",color:"var(--Buttons-Secondary-Button)"},{value:"tertiary",label:"Tertiary",color:"var(--Buttons-Tertiary-Button)"},{value:"neutral",label:"Neutral",color:"var(--Buttons-Neutral-Button)"},{value:"info",label:"Info",color:"var(--Buttons-Info-Button)"},{value:"success",label:"Success",color:"var(--Buttons-Success-Button)"},{value:"warning",label:"Warning",color:"var(--Buttons-Warning-Button)"},{value:"error",label:"Error",color:"var(--Buttons-Error-Button)"}];function Kl({label:e,selected:t,onClick:r}){return de(An,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function ql({color:e,selected:t,onClick:r}){const o=jl(e);return de(h,{component:"button",onClick:()=>r(e),"aria-label":"Select "+o,"aria-pressed":t,title:o,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+o+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Buttons-"+o+"-Text)",pointerEvents:"none"}})})}function Jl(){const[e,t]=r("outline"),[o,n]=r("default"),[i,a]=r("medium"),[l,s]=r("top"),[d,c]=r("Fruit"),[u,p]=r(!1),[m,f]=r(!1),[g,x]=r(!0),[b,v]=r(!1),[y,S]=r("Search"),[k,w]=r(""),[C,T]=r(null),[A,z]=r("Surface"),[R,E]=r(!1),[P,O]=r(!0);return ce(h,{sx:{pb:8},children:[de(Jr,{children:"Select"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ci,{theme:C,surface:A,children:de(h,{sx:{width:"100%",maxWidth:360},children:de(_n,{variant:e,color:o,size:i,label:d,labelPosition:l,mode:R?"color":void 0,showColorLabels:R?P:void 0,options:R?Xl:Ul,value:k,onChange:w,showDividers:u,disabled:m,fullWidth:g,startDecoration:b?(()=>{const e=zt[y]||zt.Search;return de(jo,{size:"small",children:de(e,{})})})():void 0})})}),de(Qi,{code:(()=>{const t=[];return"outline"!==e&&t.push('variant="'+e+'"'),"default"!==o&&t.push('color="'+o+'"'),"medium"!==i&&t.push('size="'+i+'"'),d&&t.push('label="'+d+'"'),"top"!==l&&t.push('labelPosition="'+l+'"'),R&&t.push('mode="color"'),R&&!P&&t.push("showColorLabels={false}"),u&&t.push("showDividers"),m&&t.push("disabled"),g&&t.push("fullWidth"),b&&t.push("startDecoration={<Icon><"+y+"Icon /></Icon>}"),t.push("options={options}"),t.push("value={value}"),t.push("onChange={setValue}"),"<Select\n "+t.join("\n ")+"\n/>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(ai,{defaultValue:0,variant:"standard",color:"primary",children:[ce(li,{children:[de(si,{children:"Playground"}),de(si,{children:"Accessibility"})]}),de(di,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(mi,{theme:C,onThemeChange:T,surface:A,onSurfaceChange:z})}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"STYLE"}),de(B,{direction:"row",spacing:1,children:["outline","light"].map(r=>de(Kl,{label:jl(r),selected:e===r,onClick:()=>t(r)},r))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:Gl.map(e=>ce(h,{children:[de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:e.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:e.colors.map(e=>de(ql,{color:e,selected:o===e,onClick:n},e))})]},e.label))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",spacing:1,children:["small","medium","large"].map(e=>de(Kl,{label:jl(e),selected:i===e,onClick:()=>a(e)},e))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"LABEL"}),de(B,{direction:"row",spacing:1,children:["top","floating","none"].map(e=>de(Kl,{label:"none"===e?"None":jl(e),selected:l===e,onClick:()=>s(e)},e))})]}),ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Start Icon"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Icon rendered before the value"})]}),de(ra,{checked:b,onChange:e=>v(e.target.checked),size:"small","aria-label":"Start icon"})]}),b&&ce(h,{sx:{mt:2},children:[de(Jn,{label:"Icon Name",value:y,onChange:e=>S(e.target.value),placeholder:"Search",variant:"primary-outline",size:"small",fullWidth:!0}),ce(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:4},children:[de("a",{href:"https://mui.com/material-ui/material-icons/",target:"_blank",rel:"noopener noreferrer",style:{color:"var(--Hotlink)"},children:"Material icon"})," name (e.g. Search, Add, Edit, Filter, Sort, Star)"]})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Dividers"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Lines between options"})]}),de(ra,{checked:u,onChange:e=>p(e.target.checked),size:"small","aria-label":"Show dividers"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Disabled"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Non-interactive state"})]}),de(ra,{checked:m,onChange:e=>f(e.target.checked),size:"small","aria-label":"Disabled"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Color Mode"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Render swatches alongside each option. Swatch size scales to Select height, radius follows the brand's button radius."})]}),de(ra,{checked:R,onChange:e=>E(e.target.checked),size:"small","aria-label":"Color mode"})]}),R&&ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Show Color Labels"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Hide to render a swatch-only trigger (no text). Useful for compact color pickers."})]}),de(ra,{checked:P,onChange:e=>O(e.target.checked),size:"small","aria-label":"Show color labels"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Full Width"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Stretch to container width"})]}),de(ra,{checked:g,onChange:e=>x(e.target.checked),size:"small","aria-label":"Full width"})]})]})}),de(di,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Trigger",value:'role="combobox" aria-expanded="true|false" aria-haspopup="listbox"'},{label:"Dropdown",value:'role="listbox" aria-label="..."'},{label:"Options",value:'role="option" aria-selected="true|false"'},{label:"Label",value:"aria-label from label prop. Always provide a label."},{label:"Keyboard",value:"Enter/Space opens. Escape closes. Arrow keys when open."},{label:"Focus",value:"outline: 2px solid var(--Focus-Visible); outline-offset: 2px (on outer shell)"}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ao,{children:[e,":"]}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}const Yl={small:{height:"var(--Small-Button-Height)",fontSize:"13px",padding:"4px 8px",iconSize:16},medium:{height:"var(--Button-Height)",fontSize:"14px",padding:"6px 12px",iconSize:18},large:{height:"var(--Large-Button-Height)",fontSize:"16px",padding:"8px 16px",iconSize:20}},Zl={small:{height:"48px",fontSize:"13px",padding:"20px 12px 4px",leftPad:12},medium:{height:"56px",fontSize:"14px",padding:"22px 14px 6px",leftPad:14},large:{height:"64px",fontSize:"16px",padding:"24px 16px 6px",leftPad:16}};function $l({options:e=[],value:t,defaultValue:a=null,onChange:l,inputValue:s,onInputChange:d,label:c,labelPosition:u="top",placeholder:p="Type to search",helperText:m,size:f="medium",variant:g="outline",color:x="primary",loading:b=!1,loadingText:v="Loading…",noOptionsText:y="No options",freeSolo:S=!1,clearable:k=!0,disabled:B=!1,fullWidth:w=!1,className:C="",sx:T={},...I}){const A=(z="default"===x?"primary":x).charAt(0).toUpperCase()+z.slice(1);var z;const R="var(--Buttons-"+A+"-Border)",E="default"===x?"var(--Text)":"var(--Text-"+A+")",[P,O]=r(a),[L,M]=r(a?"string"==typeof a?a:a.label||"":""),[W,D]=r(!1),[F,N]=r(!1),[H,V]=r(-1),Q=o(null),j=o(null),G=void 0!==t,U=void 0!==s,X=G?t:P,K=U?s:L,q="floating"===u,J="top"===u,Y=""!==K,Z=q?Zl[f]||Zl.medium:Yl[f]||Yl.medium,$=K?e.filter(e=>("string"==typeof e?e:e.label).toLowerCase().includes(K.toLowerCase())):e,_=n(e=>{U||M(e),d?.(e)},[U,d]),ee=n(e=>{const t="string"==typeof e?e:e.label;G||O(e),_(t),l?.(e),D(!1),V(-1),j.current?.focus()},[G,l,_]);i(()=>{if(!W)return;const e=e=>{Q.current&&!Q.current.contains(e.target)&&D(!1)};return document.addEventListener("mousedown",e),()=>document.removeEventListener("mousedown",e)},[W]);return ce(h,{ref:Q,className:"autocomplete autocomplete-"+f+" autocomplete-variant-"+g+(W?" autocomplete-open":"")+(B?" autocomplete-disabled":"")+(C?" "+C:""),sx:{position:"relative",width:w?"100%":"auto",display:"inline-block",fontFamily:"inherit",...T},...I,children:[J&&c&&de("small"===f?ao:co,{component:"label",style:{display:"block",marginBottom:"6px",color:B?"var(--Quiet)":"var(--Text)",fontWeight:500,opacity:B?.6:1},children:c}),de(h,{sx:{border:"1px solid "+R,borderRadius:"small"===f?"var(--Sm-Input-Radius, var(--Input-Radius, var(--Style-Border-Radius)))":"large"===f?"var(--Lg-Input-Radius, var(--Input-Radius, var(--Style-Border-Radius)))":"var(--Input-Radius, var(--Style-Border-Radius))",overflow:"hidden",transition:"border-color 0.15s ease",boxShadow:"none",opacity:B?.5:1,"&:focus-within":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"}},children:de(h,{children:ce(h,{sx:{position:"relative",display:"flex",alignItems:"center",minHeight:Z.height,backgroundColor:"var(--Hover)"},children:[q&&c&&de(h,{sx:{position:"absolute",top:Y||F?"6px":"50%",left:(Z.leftPad||14)+"px",transform:Y||F?"scale(0.75)":"translateY(-50%)",transformOrigin:"top left",color:F?E:"var(--Quiet)",fontSize:Z.fontSize,fontWeight:400,pointerEvents:"none",zIndex:1,transition:"top 0.15s ease, transform 0.15s ease, color 0.15s ease"},children:c}),de(h,{component:"input",ref:j,type:"text",role:"combobox","aria-expanded":W,"aria-haspopup":"listbox","aria-autocomplete":"list","aria-label":c||p,autoComplete:"off",value:K,onChange:e=>{_(e.target.value),W||D(!0),V(-1)},onKeyDown:e=>{if("Escape"!==e.key){if("ArrowDown"===e.key){if(e.preventDefault(),!W)return void D(!0);V(e=>Math.min(e+1,$.length-1))}"ArrowUp"===e.key&&(e.preventDefault(),V(e=>Math.max(e-1,0))),"Enter"===e.key&&W&&H>=0&&$[H]&&(e.preventDefault(),ee($[H]))}else D(!1)},onFocus:()=>{N(!0),D(!0)},onBlur:()=>N(!1),disabled:B,placeholder:q?void 0:p,sx:{flex:1,border:"none",outline:"none",backgroundColor:"transparent",color:Y||F?E:"var(--Quiet)",fontSize:Z.fontSize,fontFamily:"var(--Body-Font-Family)",fontWeight:"var(--Body-Font-Weight)",padding:Z.padding,minWidth:0,"&::placeholder":{color:"var(--Quiet)",opacity:1,fontFamily:"var(--Body-Font-Family)",fontWeight:"var(--Body-Font-Weight)"},"&:disabled":{cursor:"not-allowed"}}}),b&&W&&de(Vt,{size:16,sx:{mr:1,color:"var(--Quiet)"}}),k&&K&&!B&&de(h,{component:"button",type:"button","aria-label":"Clear",onClick:()=>{G||O(null),_(""),l?.(null),j.current?.focus()},sx:{display:"flex",alignItems:"center",justifyContent:"center",width:20,height:20,borderRadius:"50%",mr:.5,border:"none",backgroundColor:"transparent",color:"var(--Quiet)",cursor:"pointer","&:hover":{color:"var(--Text)",backgroundColor:"var(--Hover)"},"&:focus-visible":{outline:"2px solid var(--Focus-Visible)"}},children:de(Ot,{sx:{fontSize:14}})}),de(h,{component:"button",type:"button","aria-label":W?"Close":"Open",tabIndex:-1,onClick:()=>{B||D(!W)},sx:{display:"flex",alignItems:"center",justifyContent:"center",width:28,height:"100%",border:"none",backgroundColor:"transparent",color:"var(--Quiet)",cursor:B?"not-allowed":"pointer"},children:de(Se,{sx:{fontSize:(Z.iconSize||18)+"px",transform:W?"rotate(180deg)":"rotate(0deg)",transition:"transform 0.2s ease"}})})]})})}),m&&de(h,{sx:{fontSize:"12px",color:"var(--Quiet)",mt:"4px",ml:"2px"},children:m}),W&&de(h,{role:"listbox","aria-label":c||"Options",sx:{position:"absolute",top:"100%",left:0,right:0,mt:.5,backgroundColor:"var(--Hover)",border:"1px solid var(--Buttons-Default-Border)",borderRadius:"var(--Style-Border-Radius)",boxShadow:"none",zIndex:9999,maxHeight:240,overflowY:"auto",py:.5},children:b?de(h,{sx:{px:1.5,py:2,textAlign:"center",fontSize:Z.fontSize,color:"var(--Quiet)"},children:v}):0===$.length?de(h,{sx:{px:1.5,py:2,textAlign:"center",fontSize:Z.fontSize,color:"var(--Quiet)"},children:y}):$.map((e,t)=>{const r="string"==typeof e?e:e.label,o="string"==typeof e?e:e.value,n=r===(X?"string"==typeof X?X:X.label:null),i=function(e,t){return t?{backgroundColor:"transparent",color:"var(--Text)",fontWeight:600}:e?{backgroundColor:"var(--Hover)",color:"var(--Text)"}:{backgroundColor:"transparent",color:"var(--Text-Quiet)"}}(t===H,n);return ce(h,{role:"option","aria-selected":n,onClick:()=>ee(e),onMouseEnter:()=>V(t),sx:{display:"flex",alignItems:"center",gap:1,px:1.5,py:0,mx:.5,minHeight:Z.height,borderRadius:"4px",cursor:"pointer",fontSize:Z.fontSize,fontFamily:"inherit",...i,transition:"background-color 0.1s ease","&:active":{backgroundColor:"var(--Pressed)"}},children:[de(ao,{style:{flex:1,color:"inherit",fontWeight:"inherit"},children:r}),n&&de(jo,{size:"small",sx:{opacity:.6,flexShrink:0},children:de(he,{})})]},o||r)})})]})}const _l=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",es=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}],ts=[{value:"apple",label:"Apple"},{value:"banana",label:"Banana"},{value:"cherry",label:"Cherry"},{value:"date",label:"Date"},{value:"elderberry",label:"Elderberry"},{value:"fig",label:"Fig"},{value:"grape",label:"Grape"}];function rs({label:e,selected:t,onClick:r}){return de(An,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function os({color:e,selected:t,onClick:r}){const o=_l(e);return de(h,{component:"button",onClick:()=>r(e),"aria-label":"Select "+o,"aria-pressed":t,title:o,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+o+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Buttons-"+o+"-Text)",pointerEvents:"none"}})})}function ns(){const[e,t]=r("outline"),[o,n]=r("default"),[i,a]=r("medium"),[l,s]=r("top"),[d,c]=r("Fruit"),[u,p]=r(!0),[m,f]=r(!1),[g,x]=r(!0),[b,v]=r(null),[y,S]=r("Surface");return ce(h,{sx:{pb:8},children:[de(Jr,{children:"Autocomplete"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ci,{theme:b,surface:y,children:de(h,{sx:{width:"100%",maxWidth:360},children:de($l,{variant:e,color:o,size:i,label:d,labelPosition:l,options:ts,clearable:u,disabled:m,fullWidth:g})})}),de(Qi,{code:(()=>{const t=[];return"outline"!==e&&t.push('variant="'+e+'"'),"default"!==o&&t.push('color="'+o+'"'),"medium"!==i&&t.push('size="'+i+'"'),d&&t.push('label="'+d+'"'),"top"!==l&&t.push('labelPosition="'+l+'"'),u||t.push("clearable={false}"),m&&t.push("disabled"),g&&t.push("fullWidth"),t.push("options={options}"),t.push("onChange={handleChange}"),"<Autocomplete\n "+t.join("\n ")+"\n/>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(ai,{defaultValue:0,variant:"standard",color:"primary",children:[ce(li,{children:[de(si,{children:"Playground"}),de(si,{children:"Accessibility"})]}),de(di,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(mi,{theme:b,onThemeChange:v,surface:y,onSurfaceChange:S})}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"STYLE"}),de(B,{direction:"row",spacing:1,children:["outline","light"].map(r=>de(rs,{label:_l(r),selected:e===r,onClick:()=>t(r)},r))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:es.map(e=>ce(h,{children:[de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:e.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:e.colors.map(e=>de(os,{color:e,selected:o===e,onClick:n},e))})]},e.label))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",spacing:1,children:["small","medium","large"].map(e=>de(rs,{label:_l(e),selected:i===e,onClick:()=>a(e)},e))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"LABEL"}),de(B,{direction:"row",spacing:1,children:["top","floating","none"].map(e=>de(rs,{label:"none"===e?"None":_l(e),selected:l===e,onClick:()=>s(e)},e))})]}),ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Clearable"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Show clear button when has value"})]}),de(ra,{checked:u,onChange:e=>p(e.target.checked),size:"small","aria-label":"Clearable"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Disabled"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Non-interactive state"})]}),de(ra,{checked:m,onChange:e=>f(e.target.checked),size:"small","aria-label":"Disabled"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Full Width"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Stretch to container width"})]}),de(ra,{checked:g,onChange:e=>x(e.target.checked),size:"small","aria-label":"Full width"})]})]})}),de(di,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Input",value:'role="combobox" aria-expanded aria-haspopup="listbox" aria-autocomplete="list"'},{label:"Dropdown",value:'role="listbox" aria-label="..."'},{label:"Options",value:'role="option" aria-selected="true|false"'},{label:"Label",value:"aria-label from label prop. Always provide a label."},{label:"Keyboard",value:"Arrow keys navigate, Enter selects, Escape closes."},{label:"Focus",value:"outline: 2px solid var(--Focus-Visible); outline-offset: 2px (on outer shell)"}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ao,{children:[e,":"]}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}const is=["default","primary","secondary","tertiary","neutral","info","success","warning","error","black-white"],as=hn,ls={small:{touchTarget:24,box:16,dot:8,gap:4,LabelComp:ao},medium:{touchTarget:24,box:20,dot:9.5,gap:8,LabelComp:co},large:{touchTarget:24,box:24,dot:9.5,gap:12,LabelComp:fo}};function ss({size:e,color:t,checked:r}){const o=as(t),n="Default"===o?"var(--Quiet)":"var(--Buttons-"+o+"-Border)",i="var(--Buttons-"+o+"-Border)",a=ls[e]||ls.medium;return de(h,{className:"radio-circle-icon",sx:{width:a.box,height:a.box,boxSizing:"border-box",borderRadius:"50%",border:"2px solid "+n,overflow:"hidden",flexShrink:0,backgroundColor:"var(--Background)",display:"flex",alignItems:"center",justifyContent:"center",transition:"border-color 0.15s ease-in-out"},children:r&&de(h,{sx:{width:a.dot,height:a.dot,borderRadius:"50%",backgroundColor:i,transition:"transform 0.15s ease-in-out"}})})}function ds({color:e="primary",size:t="medium",label:r,labelPlacement:o="end",checked:n,disabled:i=!1,onChange:a,name:l,value:s,className:d="",sx:c={},"aria-label":u,"aria-labelledby":p,"aria-describedby":h,inputProps:m={},...f}){const g=is.includes(e)?e:"primary",x=ls[t]||ls.medium,b=x.LabelComp,y=(x.touchTarget-x.box)/2,S={...m,...u&&{"aria-label":u},...p&&{"aria-labelledby":p},...h&&{"aria-describedby":h}},k=de(P,{checked:n,disabled:i,onChange:a,name:l,value:s,icon:de(ss,{size:t,color:g,checked:!1}),checkedIcon:de(ss,{size:t,color:g,checked:!0}),className:"radio-"+g+" "+d,inputProps:S,disableRipple:!0,sx:{padding:y+"px",width:x.touchTarget,height:x.touchTarget,minWidth:x.touchTarget,minHeight:x.touchTarget,boxSizing:"border-box",borderRadius:"50%",color:"inherit",transition:"background-color 0.15s ease-in-out","&.Mui-checked":{color:"inherit"},"&:hover":{backgroundColor:"transparent"},"&.Mui-focusVisible .radio-circle-icon":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"},"&.Mui-disabled":{opacity:.6,cursor:"not-allowed",pointerEvents:"none"},...c},...f});return r?de(v,{control:k,label:de(b,{component:"span",sx:{color:i?"var(--Text-Quiet)":"var(--Text)",lineHeight:1.4,userSelect:"none"},children:r}),labelPlacement:o,disabled:i,sx:{marginLeft:0,marginRight:0,gap:x.gap+"px",alignItems:"center","&.Mui-disabled .MuiTypography-root":{color:"var(--Text-Quiet)",opacity:.6}}}):k}function cs({color:e="primary",size:t="medium",label:r,options:o=[],value:n,onChange:i,orientation:a="vertical",labelPlacement:l="end",disabled:s=!1,spacing:d=1,name:c,className:u="",sx:p={},"aria-label":h,"aria-labelledby":m,...f}){return ce(O,{component:"fieldset",disabled:s,className:"radio-group-"+e+" "+u,sx:p,children:[r&&de(L,{component:"legend",sx:{color:s?"var(--Text-Quiet)":"var(--Text)",fontSize:"small"===t?"13px":"15px",fontWeight:500,mb:1,"&.Mui-focused":{color:"var(--Text)"},"&.Mui-disabled":{color:"var(--Text-Quiet)",opacity:.6}},children:r}),de(M,{value:n,onChange:i,name:c,"aria-label":h,"aria-labelledby":m,row:"horizontal"===a,sx:{display:"flex",flexDirection:"horizontal"===a?"row":"column",flexWrap:"horizontal"===a?"wrap":"nowrap",alignItems:"horizontal"===a?"center":"flex-start",gap:d},...f,children:o.map(r=>de(ds,{color:e,size:t,label:r.label,labelPlacement:l,value:r.value,disabled:r.disabled||s},r.value))})]})}const us=ds,ps=["default","primary","secondary","tertiary","neutral","info","success","warning","error"];const hs={small:{visual:12,track:2,labelSize:11},medium:{visual:16,track:4,labelSize:12},large:{visual:20,track:6,labelSize:13}};function ms({variant:e="primary",size:t="medium",value:r,defaultValue:o,onChange:n,onChangeCommitted:i,min:a=0,max:l=100,step:s=1,marks:d=!1,valueLabelDisplay:c="off",orientation:u="horizontal",track:p="normal",disabled:m=!1,label:f,name:g,className:x="",sx:b={},"aria-label":v,"aria-labelledby":y,...S}){const k=function(){const e={};return ps.forEach(t=>{e[t]=function(e){const t=(r=e).charAt(0).toUpperCase()+r.slice(1);var r;return{thumb:"var(--Buttons-"+t+"-Button)",thumbBorder:"1px solid var(--Buttons-"+t+"-Border)",track:"var(--Buttons-"+t+"-Button)",trackBorder:"1px solid var(--Buttons-"+t+"-Border)",rail:"var(--Border-Variant)",valueLabel:"var(--Buttons-"+t+"-Text)",valueLabelText:"var(--Buttons-"+t+"-Button)"}}(t)}),e}(),B=k[e]||k.primary,w=hs[t]||hs.medium,C="vertical"===u,T=Array.isArray(r)||Array.isArray(o),I="inverted"===p,A="small"===t?ao:co,z=w.track+2,R=I?B.track:B.rail,E=I?B.trackBorder:null,P=I?B.rail:B.track,O=I?null:B.trackBorder,L={color:"transparent"===B.track?B.thumb:B.track,height:C?void 0:z,width:C?z:void 0,"& .MuiSlider-rail":{backgroundColor:R,border:E||"none",boxSizing:E?"content-box":"border-box",opacity:1,height:C?void 0:E?w.track:z,width:C?E?w.track:z:void 0,borderRadius:z/2},"& .MuiSlider-track":{boxSizing:O?"content-box":"border-box",backgroundColor:P,border:O||"none",height:C?void 0:O?w.track:z,width:C?O?w.track:z:void 0,borderRadius:z/2},"& .MuiSlider-thumb":{width:24,height:24,backgroundColor:"transparent",border:"none",boxShadow:"none",transition:"none","--_height":w.visual+"px","--_bevel":"min(calc(var(--Button-Bevel) * var(--_height) / 100), calc(var(--_height) / 5))","&::after":{display:"none"},"&::before":{content:'""',position:"absolute",width:w.visual,height:w.visual,borderRadius:"50%",backgroundColor:B.thumb,border:B.thumbBorder||"none",boxShadow:`${fn(e)}, ${nn}`,transition:"box-shadow 0.15s ease-in-out",top:"50%",left:"50%",transform:"translate(-50%, -50%)"},"&:hover::before":{boxShadow:`${fn(e)}, ${an}`},"&.Mui-active::before":{boxShadow:fn(e)},"&.Mui-focusVisible":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px",borderRadius:"50%"},"&.Mui-focusVisible::before":{boxShadow:`${fn(e)}, ${an}`}},...T?C?{'& .MuiSlider-thumb[data-index="0"]::before':{top:0,left:"50%",transform:"translateX(-50%)"},'& .MuiSlider-thumb[data-index="1"]::before':{top:"auto",bottom:0,left:"50%",transform:"translateX(-50%)"}}:{'& .MuiSlider-thumb[data-index="0"]::before':{left:"auto",right:0,top:"50%",transform:"translateY(-50%)"},'& .MuiSlider-thumb[data-index="1"]::before':{left:0,right:"auto",top:"50%",transform:"translateY(-50%)"}}:{},"& .MuiSlider-valueLabel":{backgroundColor:B.valueLabel,color:B.valueLabelText,fontSize:w.labelSize,fontWeight:600,borderRadius:"6px",padding:"2px 8px","&::before":{backgroundColor:B.valueLabel}},"& .MuiSlider-mark":{backgroundColor:B.rail,width:C?z:2,height:C?2:z,borderRadius:1},"& .MuiSlider-markActive":{backgroundColor:B.thumb,opacity:.6},"& .MuiSlider-markLabel":{color:"var(--Text-Quiet)",fontSize:w.labelSize},"&.Mui-disabled":{opacity:.6,cursor:"not-allowed",pointerEvents:"none","& .MuiSlider-thumb::before":{boxShadow:"none"}},...b},M=de(W,{value:r,defaultValue:o,onChange:n,onChangeCommitted:i,min:a,max:l,step:s,marks:d,valueLabelDisplay:c,orientation:u,track:"inverted"===p?"inverted":!1!==p&&"normal",disabled:m,name:g,"aria-label":v,"aria-labelledby":y,className:"slider-"+e+" "+x,sx:L,...S});return f?ce(h,{sx:{width:C?"auto":"100%",height:C?"100%":"auto",display:"flex",flexDirection:"column",gap:"4px"},children:[de(A,{component:"label",sx:{color:m?"var(--Text-Quiet)":"var(--Text)",fontSize:"small"===t?"13px":"15px",fontWeight:500,opacity:m?.6:1},children:f}),M]}):M}const fs=ms,gs=ms,xs={default:"Default",primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info",success:"Success",warning:"Warning",error:"Error"},bs={small:{iconSize:16,minHit:24,gap:0,focusInset:-3,focusWidth:3},medium:{iconSize:24,minHit:24,gap:0,focusInset:-3,focusWidth:3},large:{iconSize:36,minHit:void 0,gap:2,focusInset:2,focusWidth:2}};function vs({value:e,defaultValue:t,onChange:o,max:n=5,precision:i=1,color:a="default",size:l="medium",readOnly:s=!1,disabled:d=!1,emptyLabel:c="No rating",className:u="",sx:p={},...m}){const[f,g]=r(t??null),[x,b]=r(null),v=void 0!==e,y=v?e:f,S=null!==x?x:y,k=.5===i,B=!s&&!d,w=xs[a]||xs.default,C=bs[l]||bs.medium,T="var(--Buttons-"+w+"-Button)",I="var(--Buttons-"+w+"-Border)",A=e=>{if(!B)return;const t=e===y?null:e;v||g(t),o?.(t)},z=(e,t)=>{if(!B||!k)return;b(t?e+.5:e+1)},R=B?{"&:hover":{filter:"drop-shadow(0 2px 4px rgba(var(--Dropshadow-Color), 0.22)) drop-shadow(0 1px 2px rgba(var(--Dropshadow-Color), 0.28))","& .MuiSvgIcon-root":{stroke:"var(--Buttons-"+w+"-Border)",strokeWidth:1}}}:{},E=e=>{const t=e+1,r=e+.5,o=null!==S&&t<=S,a=null!==S&&!o&&k&&r<=S,l=a?Qt:Ie,s=((e,t)=>e||t?{color:T,filter:"drop-shadow(0 1px 2px rgba(var(--Dropshadow-Color), 0.28))",transition:"filter 0.15s ease","& .MuiSvgIcon-root":{stroke:I,strokeWidth:.5}}:{color:"transparent","& .MuiSvgIcon-root":{stroke:"var(--Quiet)",strokeWidth:1}})(o,a);return k&&B?ce(h,{sx:{position:"relative",display:"inline-flex",cursor:"pointer",...s,...R},onMouseLeave:()=>b(null),children:[de(h,{sx:{position:"absolute",left:0,top:0,width:"50%",height:"100%",zIndex:1,cursor:"pointer"},onMouseEnter:()=>z(e,!0),onClick:()=>A(r)}),de(h,{sx:{position:"absolute",right:0,top:0,width:"50%",height:"100%",zIndex:1,cursor:"pointer"},onMouseEnter:()=>z(e,!1),onClick:()=>A(t)}),de(l,{sx:{fontSize:C.iconSize,transition:"color 0.1s ease, filter 0.1s ease"}})]},e):de(h,{component:B?"button":"span",type:B?"button":void 0,role:B?"radio":void 0,"aria-checked":o,"aria-label":t+" star"+(1!==t?"s":""),tabIndex:B?0:-1,onClick:()=>A(t),onMouseEnter:()=>B&&b(t),onMouseLeave:()=>B&&b(null),onKeyDown:e=>{if(B&&("ArrowRight"!==e.key&&"ArrowUp"!==e.key||(e.preventDefault(),A(Math.min((y||0)+i,n))),"ArrowLeft"===e.key||"ArrowDown"===e.key)){e.preventDefault();const t=Math.max((y||0)-i,0);A(t||null)}},sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",border:"none",backgroundColor:"transparent",padding:0,...C.minHit&&{minWidth:C.minHit+"px",minHeight:C.minHit+"px"},cursor:d?"not-allowed":B?"pointer":"default",outline:"none",transition:"transform 0.1s ease",...s,...R,"&:active":B?{transform:"scale(0.95)"}:{},"&:focus-visible":B?{outline:C.focusWidth+"px solid var(--Focus-Visible)",outlineOffset:C.focusInset+"px",borderRadius:"2px"}:{},"&:disabled":{cursor:"not-allowed",opacity:.5}},children:de(l,{sx:{fontSize:C.iconSize,transition:"color 0.1s ease, filter 0.1s ease"}})},e)};return ce(h,{role:B?"radiogroup":"img","aria-label":"Rating"+(null!==y?": "+y+" of "+n+" stars":": "+c),className:"rating rating-"+a+" rating-"+l+(s?" rating-readonly":"")+(d?" rating-disabled":"")+(null===y?" rating-empty":"")+(u?" "+u:""),sx:{display:"inline-flex",alignItems:"center",gap:C.gap+"px",opacity:d?.5:1,fontFamily:"inherit",...p},...m,children:[Array.from({length:n},(e,t)=>E(t)),null===y&&!x&&de(bo,{style:{color:"var(--Quiet)",marginLeft:4},children:c})]})}const ys={small:{height:"var(--Small-Button-Height)",fontSize:"13px",iconSize:18,px:12},medium:{height:"var(--Button-Height)",fontSize:"14px",iconSize:20,px:16},large:{height:"var(--Large-Button-Height)",fontSize:"15px",iconSize:22,px:16}};function Ss({value:e,defaultValue:t="",onChange:n,onFocus:i,onBlur:a,onClear:l,onSubmit:s,placeholder:d="Search…",size:c="medium",color:u="default",showClearButton:p=!0,disabled:m=!1,ariaLabel:f="Search",className:g="",sx:x={},...b}){const[v,y]=r(t),[S,k]=r(!1),B=o(null),w=void 0!==e,C=w?e:v,T=C.length>0,I=S||T,A=(e=>e.charAt(0).toUpperCase()+e.slice(1))("default"===u?"primary":u),z="default"===u?"var(--Text)":"var(--Text-"+A+")",R=ys[c]||ys.medium,E=()=>{w||y(""),n?.(""),l?.(),B.current?.focus()};return de(h,{className:"search-field search-field-"+c+(S?" search-field-focused":"")+(T?" search-field-filled":"")+(m?" search-field-disabled":"")+(g?" "+g:""),sx:{display:"flex",boxSizing:"border-box",...x},...b,children:de(h,{sx:{border:"1px solid "+("var(--Buttons-"+A+"-Border)"),borderRadius:"small"===c?"var(--Sm-Input-Radius, var(--Input-Radius, var(--Style-Border-Radius)))":"large"===c?"var(--Lg-Input-Radius, var(--Input-Radius, var(--Style-Border-Radius)))":"var(--Input-Radius, var(--Style-Border-Radius))",overflow:"hidden",opacity:m?.5:1,transition:"border-color 0.15s ease, box-shadow 0.15s ease",boxShadow:"none",width:"100%","&:focus-within":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"}},children:ce(h,{sx:{display:"flex",alignItems:"center",gap:1,width:"100%",boxSizing:"border-box",minHeight:R.height,px:R.px+"px",backgroundColor:"var(--Hover)"},children:[de(jo,{size:"small",sx:{color:I?z:"var(--Quiet)",flexShrink:0,transition:"color 0.15s ease"},children:de(Te,{})}),de(h,{component:"input",ref:B,type:"text",role:"searchbox","aria-label":f,value:C,onChange:e=>{const t=e.target.value;w||y(t),n?.(t,e)},onFocus:e=>{k(!0),i?.(e)},onBlur:e=>{k(!1),a?.(e)},onKeyDown:e=>{"Enter"===e.key&&s?.(C,e),"Escape"===e.key&&T&&E()},placeholder:d,disabled:m,sx:{flex:1,border:"none",outline:"none",backgroundColor:"transparent",color:I?z:"var(--Quiet)",fontSize:R.fontSize,fontFamily:"var(--Body-Font-Family)",fontWeight:"var(--Body-Font-Weight)",minWidth:0,"&::placeholder":{color:"var(--Quiet)",opacity:1,fontFamily:"var(--Body-Font-Family)",fontWeight:"var(--Body-Font-Weight)"},"&:disabled":{cursor:"not-allowed"}}}),p&&T&&!m&&de(h,{component:"button",type:"button","aria-label":"Clear search",onClick:E,sx:{display:"flex",alignItems:"center",justifyContent:"center",width:R.iconSize+4,height:R.iconSize+4,borderRadius:"50%",border:"none",backgroundColor:"transparent",color:"var(--Quiet)",cursor:"pointer",flexShrink:0,padding:0,transition:"color 0.15s ease, background-color 0.15s ease","&:hover":{backgroundColor:"var(--Hover)",color:z},"&:focus-visible":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"1px"}},children:de(jo,{size:"small",children:de(Ot,{})})})]})})})}const ks=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",Bs=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}];function ws({label:e,selected:t,onClick:r}){return de(An,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function Cs({color:e,selected:t,onClick:r}){const o=ks(e);return de(h,{component:"button",onClick:()=>r(e),"aria-label":"Select "+o,"aria-pressed":t,title:o,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+o+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Buttons-"+o+"-Text)",pointerEvents:"none"}})})}function Ts(){const[e,t]=r("default"),[o,n]=r("medium"),[i,a]=r(!1),[l,s]=r(!0),[d,c]=r(null),[u,p]=r("Surface");return ce(h,{sx:{pb:8},children:[de(Jr,{children:"Search Field"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ci,{theme:d,surface:u,children:de(h,{sx:{width:"100%",maxWidth:400},children:de(Ss,{color:e,size:o,disabled:i,showClearButton:l,placeholder:"Search..."})})}),de(Qi,{code:(()=>{const t=[];return"default"!==e&&t.push('color="'+e+'"'),"medium"!==o&&t.push('size="'+o+'"'),l||t.push("showClearButton={false}"),i&&t.push("disabled"),t.push('placeholder="Search..."'),t.push("onChange={handleSearch}"),"<SearchField\n "+t.join("\n ")+"\n/>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(ai,{defaultValue:0,variant:"standard",color:"primary",children:[ce(li,{children:[de(si,{children:"Playground"}),de(si,{children:"Accessibility"})]}),de(di,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(mi,{theme:d,onThemeChange:c,surface:u,onSurfaceChange:p})}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:Bs.map(r=>ce(h,{children:[de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:r.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:r.colors.map(r=>de(Cs,{color:r,selected:e===r,onClick:t},r))})]},r.label))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",spacing:1,children:["small","medium","large"].map(e=>de(ws,{label:ks(e),selected:o===e,onClick:()=>n(e)},e))})]}),ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Clear Button"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Show clear when has value"})]}),de(ra,{variant:"default-outline",checked:l,onChange:e=>s(e.target.checked),size:"small","aria-label":"Clear button"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Disabled"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Non-interactive state"})]}),de(ra,{variant:"default-outline",checked:i,onChange:e=>a(e.target.checked),size:"small","aria-label":"Disabled"})]})]})}),de(di,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Role",value:'role="searchbox" on the input element'},{label:"Label",value:'aria-label="Search" (configurable via ariaLabel prop)'},{label:"Clear",value:'aria-label="Clear search" on clear button'},{label:"Keyboard",value:"Enter submits, Escape clears"},{label:"Focus",value:"outline: 2px solid var(--Focus-Visible); outline-offset: 2px"}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ao,{children:[e,":"]}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}const Is=["primary","secondary","tertiary","neutral","info","success","warning","error"],As=e=>e.charAt(0).toUpperCase()+e.slice(1);function zs(){const e={};return Is.forEach(t=>{e[t]=function(e){const t=As(e);return{bg:"var(--Buttons-"+t+"-Button)",text:"var(--Buttons-"+t+"-Text)",border:"none",hoverBg:"var(--Buttons-"+t+"-Hover)",activeBg:"var(--Buttons-"+t+"-Pressed)"}}(t),e[t+"-outline"]=function(e){return{bg:"var(--Background)",text:"var(--Text)",border:"1px solid var(--Buttons-"+As(e)+"-Border)",hoverBg:"var(--Hover)",activeBg:"var(--Hover)"}}(t),e[t+"-light"]=function(e){const t=As(e);return{bg:"var(--Buttons-"+t+"-Button)",text:"var(--Buttons-"+t+"-Text)",border:"1px solid var(--Buttons-"+t+"-Border)",hoverBg:"var(--Buttons-"+t+"-Hover)",activeBg:"var(--Buttons-"+t+"-Pressed)"}}(t)}),e}const Rs={small:{height:24,fontSize:"12px",iconSize:16,padding:"0 8px",deleteSize:16,gap:4},medium:{height:32,fontSize:"13px",iconSize:18,padding:"0 12px",deleteSize:18,gap:6},large:{height:40,fontSize:"14px",iconSize:20,padding:"0 16px",deleteSize:24,gap:8}},Es=c(function({size:e,onClick:t,...r},o){const n="large"===e?24:"medium"===e?18:16;return de(h,{ref:o,component:"button",onClick:e=>{e.stopPropagation(),t&&t(e)},onKeyDown:e=>{"Enter"!==e.key&&"Backspace"!==e.key&&"Delete"!==e.key||(e.stopPropagation(),t&&t(e))},"aria-label":"Remove",role:"button",tabIndex:0,sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",minWidth:24,minHeight:24,width:n,height:n,padding:0,margin:0,marginLeft:"2px",marginRight:"-4px",border:"none",borderRadius:"50%",backgroundColor:"transparent",color:"inherit",opacity:.7,cursor:"pointer",position:"relative",flexShrink:0,transition:"opacity 0.15s ease, background-color 0.15s ease","&:hover":{opacity:1,backgroundColor:"rgba(0,0,0,0.08)"},"&:focus-visible":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"1px"},...n<24&&{"&::after":{content:'""',position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)",minWidth:24,minHeight:24}}},...r,children:de(jt,{sx:{fontSize:n,pointerEvents:"none"}})})});function Ps({variant:e="primary",size:t="medium",label:r,clickable:o=!1,disabled:n=!1,selected:i=!1,selectionMode:a,onDelete:l,onClick:s,startDecorator:d,endDecorator:c,children:u,className:p="",sx:m={},...f}){const g=zs(),x=g[e]||g.primary,b=l?"large":t,v=Rs[b]||Rs.medium,y=o||!!s||!!a,S={};"radio"===a?(S.role="radio",S["aria-checked"]=i):"checkbox"===a&&(S.role="checkbox",S["aria-checked"]=i);const k=i?{outline:"2px solid var(--Buttons-Primary-Button)",outlineOffset:"1px"}:{},B=r||u,w={height:v.height,fontSize:v.fontSize,fontWeight:500,fontFamily:"inherit",borderRadius:v.height/2+"px",padding:v.padding,boxSizing:"border-box",position:"relative",backgroundColor:x.bg,color:x.text,border:x.border,...k,..."small"===b&&{"&::after":{content:'""',position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)",minWidth:24,minHeight:24,width:"100%",height:"100%"}},...y&&!n?{cursor:"pointer",transition:"background-color 0.15s ease, outline 0.15s ease","&:hover":{backgroundColor:x.hoverBg},"&:active":{backgroundColor:x.activeBg}}:{},"&:focus-visible, &.Mui-focusVisible":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"},...n?{opacity:.5,cursor:"not-allowed",pointerEvents:"none"}:{},boxShadow:"none","& .MuiChip-label":{padding:0,fontSize:"inherit",fontWeight:"inherit",fontFamily:"inherit",lineHeight:1.2,display:"flex",alignItems:"center",gap:v.gap+"px"},"& .MuiChip-icon":{margin:0,marginLeft:"-2px",color:"inherit",fontSize:v.iconSize},"& .MuiChip-deleteIcon":{display:"none"},...m},C=ce(h,{component:"span",sx:{display:"inline-flex",alignItems:"center",gap:v.gap+"px",lineHeight:1},children:[d&&de(h,{component:"span",sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",flexShrink:0,"& .MuiSvgIcon-root":{fontSize:v.iconSize},"& .MuiAvatar-root":{width:v.iconSize+4,height:v.iconSize+4,fontSize:Math.round(.65*v.iconSize)+"px"}},children:d}),B,c&&de(h,{component:"span",sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",flexShrink:0,"& .MuiSvgIcon-root":{fontSize:v.iconSize},"& .MuiAvatar-root":{width:v.iconSize+4,height:v.iconSize+4,fontSize:Math.round(.65*v.iconSize)+"px"}},children:c}),l&&de(Es,{size:b,onClick:l})]});return de(D,{label:C,clickable:y&&!n,disabled:n,onClick:y?s:void 0,className:"chip-"+e+" "+p,sx:w,...S,...f})}const Os={body:{fontFamily:"var(--Body-Font-Family)",lineHeight:"calc(var(--Body-Line-Height) * var(--Cognitive-Multiplier, 1))",fontSize:"var(--Body-Font-Size)",fontWeight:"var(--Body-Font-Weight)",letterSpacing:"var(--Body-Letter-Spacing)"},"body-small":{fontFamily:"var(--Body-Font-Family)",lineHeight:"calc(var(--Body-Small-Line-Height) * var(--Cognitive-Multiplier, 1))",fontSize:"var(--Body-Small-Font-Size)",fontWeight:"var(--Body-Font-Weight)",letterSpacing:"var(--Body-Small-Letter-Spacing)"},"body-large":{fontFamily:"var(--Body-Font-Family)",lineHeight:"calc(var(--Body-Large-Line-Height) * var(--Cognitive-Multiplier, 1))",fontSize:"var(--Body-Large-Font-Size)",fontWeight:"var(--Body-Font-Weight)",letterSpacing:"var(--Body-Large-Letter-Spacing)"},"body-semibold":{fontFamily:"var(--Body-Font-Family)",lineHeight:"calc(var(--Body-Line-Height) * var(--Cognitive-Multiplier, 1))",fontSize:"var(--Body-Font-Size)",fontWeight:"var(--Body-Semibold-Font-Weight)",letterSpacing:"var(--Body-Letter-Spacing)"},"body-bold":{fontFamily:"var(--Body-Font-Family)",lineHeight:"calc(var(--Body-Line-Height) * var(--Cognitive-Multiplier, 1))",fontSize:"var(--Body-Font-Size)",fontWeight:"var(--Body-Bold-Font-Weight)",letterSpacing:"var(--Body-Letter-Spacing)"},button:{fontFamily:"var(--Body-Font-Family)",lineHeight:"var(--Button-Line-Height)",fontSize:"var(--Button-Font-Size)",fontWeight:"var(--Button-Font-Weight)",letterSpacing:"var(--Button-Letter-Spacing)"},label:{fontFamily:"var(--Body-Font-Family)",lineHeight:"var(--Label-Line-Height)",fontSize:"var(--Label-Font-Size)",fontWeight:"var(--Label-Font-Weight)",letterSpacing:"var(--Label-Letter-Spacing)"},caption:{fontFamily:"var(--Body-Font-Family)",lineHeight:"calc(var(--Body-Small-Line-Height) * var(--Cognitive-Multiplier, 1))",fontSize:"var(--Body-Small-Font-Size)",fontWeight:"var(--Body-Font-Weight)",letterSpacing:"var(--Body-Small-Letter-Spacing)"}},Ls="var(--Link-Visited, var(--Hotlink-Visited))",Ms={primary:{base:"var(--Link, var(--Hotlink))",visited:Ls},standard:{base:"var(--Text)",visited:Ls},quiet:{base:"var(--Text-Quiet)",visited:Ls}};function Ws({children:e,href:t,target:r,rel:o,textStyle:n="body",color:i="primary",disabled:a=!1,onClick:l,className:s="",sx:d={},...c}){const u=Os[n]||Os.body,p=Ms[i]||Ms.primary;return de(h,{component:"a",href:a?void 0:t,target:r,rel:"_blank"===r?o||"noopener noreferrer":o,onClick:a?e=>e.preventDefault():l,"aria-disabled":a||void 0,tabIndex:a?-1:void 0,className:"link link-"+n+" link-color-"+i+(a?" link-disabled":"")+" "+s,sx:{fontFamily:u.fontFamily,lineHeight:u.lineHeight,fontSize:u.fontSize,fontWeight:u.fontWeight,letterSpacing:u.letterSpacing,textDecoration:"underline",textUnderlineOffset:"3px",textDecorationThickness:"1px",color:p.base,cursor:a?"not-allowed":"pointer",opacity:a?.5:1,pointerEvents:a?"none":"auto",display:"inline-flex",alignItems:"center",minHeight:"24px",minWidth:"24px",transition:"color 0.15s ease, text-decoration-color 0.15s ease",...!a&&{"&:hover":{textDecorationThickness:"2px"},"&:visited":{color:p.visited},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"2px",borderRadius:"2px"},"&:active":{textDecorationThickness:"2px"}},...d},...c,children:e})}function Ds({label:e,selected:t,onClick:r}){return de(An,{selected:t,variant:t?"primary":"primary-outline",size:"small",onClick:r,children:e})}function Fs({code:e}){return de(Qi,{code:e,language:"JSX",wrap:!0,sx:{mt:1}})}function Ns({passes:e}){return ce(h,{sx:{display:"inline-flex",alignItems:"center",gap:.5,px:1.5,py:.5,borderRadius:"20px",backgroundColor:e?"var(--Tags-Success-BG)":"var(--Tags-Error-BG)",color:e?"var(--Tags-Success-Text)":"var(--Tags-Error-Text)",fontSize:"12px",fontWeight:600},children:[de(e?ge:xe,{sx:{fontSize:14}}),e?"WCAG Pass":"WCAG Fail"]})}function Hs({leftLabel:e,rightLabel:t,leftContent:r,rightContent:o,leftCode:n,rightCode:i,leftPasses:a,rightPasses:l}){return ce(I,{container:!0,spacing:3,children:[de(I,{item:!0,xs:12,md:6,children:ce(h,{sx:{p:2,border:"1px solid var(--Border)",borderRadius:"var(--Style-Border-Radius)",backgroundColor:"var(--Background)",height:"100%"},children:[ce(h,{sx:{display:"flex",alignItems:"center",justifyContent:"space-between",mb:2},children:[de(ao,{style:{fontWeight:600},children:e}),de(Ns,{passes:a})]}),de(h,{sx:{p:2,backgroundColor:"var(--Surface-Dim, var(--Surface))",borderRadius:"var(--Style-Border-Radius)",minHeight:80},children:r}),de(Fs,{code:n})]})}),de(I,{item:!0,xs:12,md:6,children:ce(h,{sx:{p:2,border:"1px solid var(--Border)",borderRadius:"var(--Style-Border-Radius)",backgroundColor:"var(--Background)",height:"100%"},children:[ce(h,{sx:{display:"flex",alignItems:"center",justifyContent:"space-between",mb:2},children:[de(ao,{style:{fontWeight:600},children:t}),de(Ns,{passes:l})]}),de(h,{sx:{p:2,backgroundColor:"var(--Surface-Dim, var(--Surface))",borderRadius:"var(--Style-Border-Radius)",minHeight:80},children:o}),de(Fs,{code:i})]})})]})}function Vs(){const[e,t]=r("column"),[o,n]=r(.5),[i,a]=r("small"),[l,s]=r(!0),[d,c]=r(!1),[u,p]=r(null),[m,f]=r("Surface"),g={small:{label:"Small links ⚡",content:ce(ue,{children:[de(Ws,{href:"#",size:"small",children:"Terms of Service"}),de(Ws,{href:"#",size:"small",children:"Privacy Policy"}),de(Ws,{href:"#",size:"small",children:"Cookie Settings"})]})},chips:{label:"Chips ⚡",content:ce(ue,{children:[de(Ps,{label:"React",size:"small"}),de(Ps,{label:"TypeScript",size:"small"}),de(Ps,{label:"Design System",size:"small"})]})},normal:{label:"Normal buttons",content:ce(ue,{children:[de(An,{variant:"primary",size:"medium",children:"Primary"}),de(An,{variant:"secondary",size:"medium",children:"Secondary"})]})},mixed:{label:"Mixed ⚡",content:ce(ue,{children:[de(An,{variant:"primary",size:"medium",children:"Save changes"}),de(Ws,{href:"#",size:"small",children:"Or discard"})]})}},x=["small","chips","mixed"].includes(i),b=l&&x;return ce(I,{container:!0,spacing:3,sx:{mt:1},children:[ce(I,{item:!0,xs:12,md:7,children:[de(ci,{theme:u,children:ce(h,{sx:{width:"100%"},children:[b&&ce(h,{sx:{mb:2,px:2,py:1,borderRadius:"var(--Style-Border-Radius)",backgroundColor:"var(--Tags-Warning-BG)",color:"var(--Tags-Warning-Text)",fontSize:"12px",fontWeight:600,display:"flex",alignItems:"center",gap:1},children:[de(xe,{sx:{fontSize:16}}),"Small child detected — gap raised to var(--min-stack-gap)"]}),de(Sa,{direction:e,gap:o,enforceMinGap:l,flexWrap:d?"wrap":void 0,children:g[i].content})]})}),de(Fs,{code:(()=>{const t=["<OmniStack"];return"column"!==e&&t.push(' direction="'+e+'"'),t.push(" gap={"+o+"}"),l||t.push(" enforceMinGap={false}"),d&&t.push(' flexWrap="wrap"'),t.push(">"),t.push(" {children}"),t.push("</OmniStack>"),t.join("\n")})()})]}),de(I,{item:!0,xs:12,md:5,children:ce(h,{sx:{display:"flex",flexDirection:"column",gap:3},children:[de(mi,{theme:u,onThemeChange:p,surface:m,onSurfaceChange:f}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"CHILDREN"}),de(h,{sx:{display:"flex",flexWrap:"wrap",gap:1},children:Object.entries(g).map(([e,{label:t}])=>de(Ds,{label:t,selected:i===e,onClick:()=>a(e)},e))})]}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"DIRECTION"}),de(h,{sx:{display:"flex",gap:1},children:["row","column"].map(r=>{return de(Ds,{label:(o=r,o?o.charAt(0).toUpperCase()+o.slice(1):""),selected:e===r,onClick:()=>t(r)},r);var o})})]}),ce(h,{children:[ce(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:["GAP — ",o," unit",b?" → raised to var(--min-stack-gap)":""]}),ce(h,{sx:{display:"flex",alignItems:"center",gap:2},children:[de(h,{component:"input",type:"range",min:0,max:6,step:.5,value:o,onChange:e=>n(Number(e.target.value)),sx:{flex:1,accentColor:"var(--Primary-Color-10)"}}),de(bo,{style:{color:"var(--Text)",minWidth:24,textAlign:"right"},children:o})]})]}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"OPTIONS"}),ce(h,{sx:{display:"flex",flexDirection:"column",gap:1.5},children:[ce(h,{sx:{display:"flex",alignItems:"flex-start",justifyContent:"space-between"},children:[ce(h,{children:[de(ao,{children:"Enforce min gap"}),de(bo,{style:{color:b?"var(--Tags-Warning-Text)":"var(--Text-Quiet)",display:"block"},children:b?"⚡ Active — small child detected":x?"Off — WCAG 2.5.8 risk":"No small children detected"})]}),de(ra,{checked:l,onChange:e=>s(e.target.checked),size:"small"})]}),ce(h,{sx:{display:"flex",alignItems:"center",justifyContent:"space-between"},children:[de(ao,{children:"Flex wrap"}),de(ra,{checked:d,onChange:e=>c(e.target.checked),size:"small"})]})]})]})]})})]})}function Qs(){return ce(h,{sx:{pb:8},children:[de(Jr,{children:"Stack"}),de(co,{style:{color:"var(--Text-Quiet)",marginTop:8,marginBottom:32,maxWidth:640},children:"OmniStack is a layout primitive built on MUI Stack with one intelligent addition: it automatically enforces a minimum gap between children when it detects small (24px) interactive components — protecting WCAG 2.5.8 compliance without any extra developer effort."}),ce(ai,{defaultValue:0,variant:"standard",color:"primary",children:[ce(li,{children:[de(si,{children:"Why it matters"}),de(si,{children:"Playground"}),de(si,{children:"API"})]}),de(di,{value:0,children:ce(h,{sx:{pt:3,display:"flex",flexDirection:"column",gap:4},children:[ce(h,{sx:{p:3,backgroundColor:"var(--Background)",border:"1px solid var(--Border)",borderRadius:"var(--Style-Border-Radius)"},children:[de(Jr,{children:"The problem"}),de(co,{style:{color:"var(--Text-Quiet)",marginTop:8,marginBottom:16},children:"WCAG 2.5.8 requires that small interactive targets (24px) have enough surrounding space that they don’t overlap adjacent targets. Every layout library leaves this entirely to the developer — meaning it’s silently violated constantly."}),de(Hs,{leftLabel:"Plain MUI Stack — gap too small",rightLabel:"OmniStack — gap auto-enforced",leftPasses:!1,rightPasses:!0,leftContent:ce(h,{sx:{display:"flex",flexDirection:"column",gap:"4px"},children:[de(Ws,{href:"#",size:"small",children:"Terms of Service"}),de(Ws,{href:"#",size:"small",children:"Privacy Policy"}),de(Ws,{href:"#",size:"small",children:"Cookie Settings"})]}),rightContent:ce(Sa,{gap:.5,children:[de(Ws,{href:"#",size:"small",children:"Terms of Service"}),de(Ws,{href:"#",size:"small",children:"Privacy Policy"}),de(Ws,{href:"#",size:"small",children:"Cookie Settings"})]}),leftCode:'<Stack gap={0.5}>\n <Link size="small">Terms of Service</Link>\n <Link size="small">Privacy Policy</Link>\n <Link size="small">Cookie Settings</Link>\n</Stack>\n// ⚠ gap=4px — targets overlap',rightCode:'<OmniStack gap={0.5}>\n <Link size="small">Terms of Service</Link>\n <Link size="small">Privacy Policy</Link>\n <Link size="small">Cookie Settings</Link>\n</OmniStack>\n// ✓ small child detected → gap enforced'})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Background)",border:"1px solid var(--Border)",borderRadius:"var(--Style-Border-Radius)"},children:[de(Jr,{children:"Mixed component sizes"}),de(co,{style:{color:"var(--Text-Quiet)",marginTop:8,marginBottom:16},children:"One small child is enough to trigger enforcement for the whole stack — the most common case is a normal button paired with a small cancel link."}),de(Hs,{leftLabel:"Without enforcement",rightLabel:"With enforcement",leftPasses:!1,rightPasses:!0,leftContent:ce(h,{sx:{display:"flex",flexDirection:"column",gap:"2px"},children:[de(An,{variant:"primary",size:"medium",children:"Save changes"}),de(Ws,{href:"#",size:"small",children:"Or discard"})]}),rightContent:ce(Sa,{gap:.25,children:[de(An,{variant:"primary",size:"medium",children:"Save changes"}),de(Ws,{href:"#",size:"small",children:"Or discard"})]}),leftCode:'<Stack gap={0.25}>\n <Button size="medium">Save changes</Button>\n <Link size="small">Or discard</Link>\n</Stack>\n// ⚠ Link is 24px — gap too tight',rightCode:'<OmniStack gap={0.25}>\n <Button size="medium">Save changes</Button>\n <Link size="small">Or discard</Link>\n</OmniStack>\n// ✓ Link detected → gap enforced'})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Background)",border:"1px solid var(--Border)",borderRadius:"var(--Style-Border-Radius)"},children:[de(Jr,{children:"How detection works"}),de(co,{style:{color:"var(--Text-Quiet)",marginTop:8,marginBottom:16},children:"OmniStack inspects children at render time using a priority-ordered signal chain. Any one signal is enough to trigger enforcement."}),de(h,{sx:{display:"flex",flexDirection:"column"},children:[{signal:'size="small" prop',example:'<Link size="small" />'},{signal:'data-size="small"',example:'<div data-size="small" />'},{signal:"height={24}",example:"<Box height={24} />"},{signal:"minHeight={24}",example:"<Box minHeight={24} />"},{signal:"sx.minHeight: 24",example:"<Box sx={{ minHeight: 24 }} />"},{signal:"Known component name",example:"Link, Chip, Badge, Caption…"}].map(({signal:e,example:t},r,o)=>ce(h,{sx:{display:"flex",alignItems:"center",gap:2,py:1.5,borderBottom:r<o.length-1?"1px solid var(--Border)":"none"},children:[de(h,{sx:{width:8,height:8,borderRadius:"50%",backgroundColor:"var(--Primary-Color-10)",flexShrink:0}}),de(ao,{style:{flex:"0 0 200px"},children:e}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Background)",border:"1px solid var(--Border)",borderRadius:"var(--Style-Border-Radius)"},children:[de(Jr,{children:"Token-driven minimum"}),de(co,{style:{color:"var(--Text-Quiet)",marginTop:8,marginBottom:16},children:"The minimum gap is a CSS custom property, not a hardcoded value — so it respects your brand spacing scale and responds to theme changes without re-rendering."}),de(Fs,{code:":root {\n --min-stack-gap: 8px; /* Set in your theme.css */\n}\n\n/* OmniStack substitutes the variable, not the value: */\ngap: var(--min-stack-gap, 8px);\n\n/* Dark mode, brand overrides, and media queries\n all work automatically — no re-render needed. */"})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Background)",border:"1px solid var(--Border)",borderRadius:"var(--Style-Border-Radius)"},children:[de(Jr,{children:"Auditable opt-out"}),ce(co,{style:{color:"var(--Text-Quiet)",marginTop:8,marginBottom:16},children:["Use ",de("code",{children:"enforceMinGap={false}"})," to opt out. This creates a searchable pattern accessibility audits can grep for — a conscious waiver, not a silent violation."]}),de(Fs,{code:'<OmniStack gap={0.5} enforceMinGap={false}>\n {/* Explicitly waived — auditors can grep:\n enforceMinGap={false}\n to find all waivers in the codebase. */}\n <Link size="small">Terms</Link>\n <Link size="small">Privacy</Link>\n</OmniStack>'})]})]})}),de(di,{value:1,children:de(Vs,{})}),de(di,{value:2,children:ce(h,{sx:{pt:3},children:[de(Jr,{children:"OmniStack props"}),de(co,{style:{color:"var(--Text-Quiet)",marginTop:4,marginBottom:16},children:"All standard MUI Stack props are supported. These are OmniStack additions:"}),de(h,{sx:{border:"1px solid var(--Border)",borderRadius:"var(--Style-Border-Radius)",overflow:"hidden",mb:4},children:[{prop:"enforceMinGap",type:"boolean",default:"true",desc:"Enable/disable smart gap enforcement."},{prop:"minGapToken",type:"string",default:'"--min-stack-gap"',desc:"CSS variable name for the minimum gap value."},{prop:"gap",type:"number|string",default:"undefined",desc:"Desired gap. Enforced against minGapToken when small children detected."},{prop:"direction",type:"string|object",default:'"column"',desc:"Stack direction. Supports responsive breakpoint objects."},{prop:"flexWrap",type:"string",default:"undefined",desc:'"wrap" | "nowrap" | "wrap-reverse"'},{prop:"divider",type:"ReactNode",default:"undefined",desc:"Element rendered between each child."}].map(({prop:e,type:t,default:r,desc:o},n,i)=>ce(h,{sx:{display:"grid",gridTemplateColumns:"160px 160px 1fr",gap:2,px:2,py:1.5,alignItems:"start",borderBottom:n<i.length-1?"1px solid var(--Border)":"none",backgroundColor:n%2==0?"transparent":"var(--Surface-Dim, var(--Surface))"},children:[de(bo,{style:{fontFamily:"monospace",color:"var(--Primary-Color-10)",fontWeight:600},children:e}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t}),ce(h,{children:[de(bo,{style:{color:"var(--Text)"},children:o}),ce(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:2},children:["Default: ",r]})]})]},e))}),de(Jr,{children:"Convenience exports"}),de(h,{sx:{border:"1px solid var(--Border)",borderRadius:"var(--Style-Border-Radius)",overflow:"hidden",mb:4},children:[{name:"Stack",desc:"Alias for OmniStack — drop-in MUI Stack replacement"},{name:"HStack",desc:'direction="row" alignItems="center"'},{name:"VStack",desc:'direction="column"'},{name:"CenteredStack",desc:'direction="column" alignItems="center" justifyContent="center"'},{name:"SpaceBetweenStack",desc:'direction="row" justifyContent="space-between"'},{name:"WrapStack",desc:'direction="row" flexWrap="wrap"'},{name:"ResponsiveStack",desc:"column on xs, row on sm+ (breakpoint configurable)"},{name:"GridStack",desc:"Alias for WrapStack"},{name:"InsetStack",desc:"OmniStack with px: 2 horizontal padding"},{name:"ScrollStack",desc:"OmniStack with overflowY: auto"}].map(({name:e,desc:t},r,o)=>ce(h,{sx:{display:"grid",gridTemplateColumns:"200px 1fr",gap:2,px:2,py:1.5,borderBottom:r<o.length-1?"1px solid var(--Border)":"none",backgroundColor:r%2==0?"transparent":"var(--Surface-Dim, var(--Surface))"},children:[de(bo,{style:{fontFamily:"monospace",color:"var(--Primary-Color-10)",fontWeight:600},children:e}),de(bo,{style:{color:"var(--Text-Quiet)"},children:t})]},e))}),de(Jr,{children:"Debug attributes"}),de(Fs,{code:'/* When enforcement is active, OmniStack adds: */\nclassName="omni-stack omni-stack-min-gap-enforced"\ndata-min-gap-enforced="true"\n\n/* Target in CSS: */\n.omni-stack-min-gap-enforced { outline: 2px dashed orange; }\n\n/* Query in tests: */\ncontainer.querySelector(\'[data-min-gap-enforced="true"]\')'})]})})]})]})}function js({children:e,theme:t,surface:r,elevation:o=0,component:n="div",className:i="",sx:a={},style:l,...s}){const d=Math.max(0,Math.min(5,0|o));if(!d)return de(h,{component:n,"data-theme":t||void 0,"data-surface":r||void 0,className:"omni-box"+(i?" "+i:""),sx:{background:"var(--Background)",boxSizing:"border-box",...a},style:l,...s,children:e});const c=l||{},{width:u,height:p,minWidth:m,minHeight:f,maxWidth:g,maxHeight:x,borderRadius:b,margin:v,marginTop:y,marginRight:S,marginBottom:k,marginLeft:B,...w}=c,C={width:u,height:p,minWidth:m,minHeight:f,maxWidth:g,maxHeight:x,borderRadius:b,margin:v,marginTop:y,marginRight:S,marginBottom:k,marginLeft:B},{width:T,height:I,borderRadius:A,...z}=a;return de(h,{component:n,className:"omni-box-elevation"+(i?" "+i:""),"data-elevation":d,sx:{boxShadow:un[d],boxSizing:"border-box",width:T,height:I,borderRadius:A},style:C,...s,children:de(h,{"data-theme":t||void 0,"data-surface":r||void 0,className:"omni-box",sx:{width:"100%",height:"100%",background:"var(--Background)",borderRadius:"inherit",boxSizing:"border-box",...z},style:w,children:e})})}const Gs=["Surface","Surface-Dim","Surface-Bright","Container","Container-Low","Container-Lowest","Container-High"],Us=["Default","Primary","Primary-Light","Secondary","Secondary-Light","Tertiary","Tertiary-Light","Neutral","Neutral-Light","Info-Light","Success-Light","Warning-Light","Error-Light"];function Xs({label:e,selected:t,onClick:r}){return de(An,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function Ks(){const[e,t]=r(""),[o,n]=r(""),[i,a]=r(null),[l,s]=r("Surface");return ce(js,{sx:{pb:8},children:[de(Jr,{children:"Box"}),ce(co,{color:"quiet",style:{marginTop:8,marginBottom:24,maxWidth:720},children:["Bare layout primitive — a slot that participates in the design-system cascade (",de("code",{children:"data-theme"})," / ",de("code",{children:"data-surface"}),") without carrying any chrome. Reach for ",de("code",{children:"<Ratio>"})," or",de("code",{children:" <Card>"})," when you need padding, borders, or shadow."]}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ci,{theme:i,surface:l,children:de(js,{sx:{width:"100%",maxWidth:400},children:de(js,{theme:e||void 0,surface:o||void 0,children:ce(js,{sx:{padding:3,backgroundColor:"var(--Background)",color:"var(--Text)",borderRadius:"var(--Style-Border-Radius)",border:"1px dashed var(--Border-Variant)"},children:[de(Zr,{children:"Box content"}),de(co,{style:{color:"var(--Text-Quiet)",marginTop:6},children:"Anything dropped inside resolves tokens against the Box's theme / surface, if you set them."})]})})})}),de(Qi,{code:(()=>{const t=[];e&&t.push('theme="'+e+'"'),o&&t.push('surface="'+o+'"');return"<Box"+(t.length?" "+t.join(" "):"")+">\n {/* anything */}\n</Box>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(js,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(ai,{defaultValue:0,variant:"standard",color:"primary",children:[ce(li,{children:[de(si,{children:"Playground"}),de(si,{children:"When to use"})]}),de(di,{value:0,children:ce(js,{sx:{p:3},children:[de(js,{sx:{mb:3},children:de(mi,{theme:i,onThemeChange:a,surface:l,onSurfaceChange:s})}),ce(js,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"THEME (optional)"}),ce(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:[de(Xs,{label:"None",selected:!e,onClick:()=>t("")}),Us.map(r=>de(Xs,{label:r,selected:e===r,onClick:()=>t(r)},r))]})]}),ce(js,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SURFACE (optional)"}),ce(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:[de(Xs,{label:"None",selected:!o,onClick:()=>n("")}),Gs.map(e=>de(Xs,{label:e,selected:o===e,onClick:()=>n(e)},e))]}),ce(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:["Both props are pass-throughs to ",de("code",{children:"data-theme"})," ","and ",de("code",{children:"data-surface"}),". Leave empty to inherit from the parent zone."]})]})]})}),de(di,{value:1,children:de(js,{sx:{p:3},children:ce(B,{spacing:2,children:[ce(js,{children:[de(ao,{style:{fontWeight:700},children:"Reach for Box when…"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:4},children:"you need a wrapper to scope a theme / surface zone, or you want a typed JSX root without painting any visual styling."})]}),ce(js,{children:[de(ao,{style:{fontWeight:700},children:"Use Ratio when…"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:4},children:"the container needs a fixed proportion (image, video, embed, hero tile) — it carries the same theme / color shell Box used to."})]}),ce(js,{children:[de(ao,{style:{fontWeight:700},children:"Use Card when…"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:4},children:"the container has a title, body, and actions — Card handles the standard 2-layer chrome plus header / footer slots."})]})]})})})]})})})]})]})}function qs({children:e,maxWidth:t="lg",disableGutters:r=!1,sx:o={},...n}){return de(F,{maxWidth:t,disableGutters:r,"data-surface":"Surface",sx:{backgroundColor:"var(--Background)",color:"var(--Text)",transition:"all 0.2s ease-in-out",...o},...n,children:e})}function Js({children:e,container:t=!1,item:r=!1,spacing:o=2,sx:n={},...i}){return de(I,{container:t,item:r,spacing:o,sx:{transition:"all 0.2s ease-in-out",...n},...i,children:e})}function Ys({theme:e,surface:t="Surface",as:r="section",padding:o,className:n,style:i,children:a,...l}){return de(r,{...e?{"data-theme":e}:{},"data-surface":t,className:n,style:{background:"var(--Background)",color:"var(--Text)",...void 0!==o?{padding:o}:{},...i},...l,children:a})}function Zs(){return ce("div",{children:[de(Jr,{style:{marginBottom:12},children:"Section"}),ce(co,{color:"quiet",style:{marginBottom:32,maxWidth:720},children:[de("code",{children:"<Section>"})," bundles ",de("code",{children:"data-theme"})," +"," ",de("code",{children:"data-surface"})," + background paint into one component. Use anywhere you'd otherwise reach for"," ",de("code",{children:"<section data-theme data-surface style={{ background: var(--Background) }}>"}),". For wrapping without painting (e.g. AppBar's themed zone), use"," ",de("code",{children:"<ThemedZone>"}),"."]}),de(Jr,{style:{marginTop:24,marginBottom:12},children:"Theme + surface"}),de(ao,{color:"quiet",style:{marginBottom:16,display:"block"},children:'Sets data-theme="Primary-Light" + data-surface="Surface", paints --Background.'}),ce(Ys,{theme:"Primary-Light",surface:"Surface",padding:"32px",style:{borderRadius:8},children:[de(Jr,{children:"Primary-Light surface"}),de(co,{children:"Body text picks up --Text automatically."}),de(ao,{color:"quiet",children:"Quiet text picks up --Text-Quiet."}),de("div",{style:{marginTop:12},children:de(An,{variant:"primary",children:"Primary button"})})]}),de(Jr,{style:{marginTop:32,marginBottom:12},children:"Container surface"}),ce(Ys,{surface:"Container",padding:"32px",style:{borderRadius:8},children:[de(Jr,{children:"Container surface (inherits theme)"}),de(co,{children:"Useful for card-like regions."})]}),de(Jr,{style:{marginTop:32,marginBottom:12},children:"Different element"}),ce(ao,{color:"quiet",style:{marginBottom:16,display:"block"},children:["Pass ",de("code",{children:'as="article"'}),", ",de("code",{children:'as="footer"'}),", etc."]}),ce(Ys,{as:"article",theme:"Neutral-Dark",surface:"Surface",padding:"32px",style:{borderRadius:8},children:[de(Jr,{children:"Neutral-Dark article"}),de(co,{children:"Renders as an <article> element."})]})]})}const $s=["1:1","3:4","4:3","16:9","9:16","2:3","3:2","1:2","2:1","9:21","21:9","5:7","7:5","4:5","5:4","5:3","3:5","16:10","10:16","Golden-Horizontal","Golden-Vertical"],_s="1.618034",ed={"1:1":"1 / 1","3:4":"3 / 4","4:3":"4 / 3","16:9":"16 / 9","9:16":"9 / 16","2:3":"2 / 3","3:2":"3 / 2","1:2":"1 / 2","2:1":"2 / 1","9:21":"9 / 21","21:9":"21 / 9","5:7":"5 / 7","7:5":"7 / 5","4:5":"4 / 5","5:4":"5 / 4","5:3":"5 / 3","3:5":"3 / 5","16:10":"16 / 10","10:16":"10 / 16","Golden-Horizontal":_s+" / 1","Golden-Vertical":"1 / "+_s},td={none:0,xs:1,sm:2,md:3,lg:4,xl:6};function rd({ratio:e="1:1",children:r,variant:o="default",color:n="default",padding:i="none",fit:a="width",placeholder:l=!0,elevated:s=!1,clickable:d=!1,onClick:c,maxWidth:u,maxHeight:p,component:m="div",className:f="",sx:g={},...x}){const b=ed[e]||ed["1:1"],v=(y="default"===n?"Default":n).charAt(0).toUpperCase()+y.slice(1);var y;const S=l&&0===t.Children.count(r),k="default"===n?void 0:v,B="dark"===o?"Surface-Dimmest":"light"===o?"Surface-Brightest":void 0,w=void 0!==td[i]?td[i]:td.none,C=d||!!c,T="default"===o,I=s?ln:an,A=s?sn:ln;return de(h,{component:m,onClick:C?c:void 0,role:C?"button":void 0,tabIndex:C?0:void 0,className:"ratio ratio-"+e.toLowerCase()+" ratio-"+o+(C?" ratio-clickable":"")+(s?" ratio-elevated":"")+(f?" "+f:""),sx:{aspectRatio:b,flex:"0 0 auto",..."height"===a?{height:"100%",width:"auto",minHeight:24}:{width:"100%",height:"auto",minWidth:24},...void 0!==u&&{maxWidth:u},...void 0!==p&&{maxHeight:p},border:T?"none":"1px solid var(--Border-Variant)",borderRadius:T?0:"var(--Style-Border-Radius)",boxShadow:T?"none":I,overflow:"hidden",transition:"box-shadow 0.2s ease, border-color 0.2s ease",...C&&{cursor:"pointer","&:hover":{borderColor:"var(--Buttons-Default-Border)",boxShadow:A},"&:active":{transform:"scale(0.995)"},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"3px"}},...!C&&!T&&{"&:hover":{boxShadow:A}},...g},...x,children:de(h,{"data-theme":k||void 0,"data-surface":B,sx:{width:"100%",height:"100%",padding:w,backgroundColor:S?"var(--Border)":"var(--Background)",color:"var(--Text)",fontFamily:"inherit",borderRadius:T?0:"calc(var(--Style-Border-Radius) - 1px)",...S?{display:"flex",alignItems:"center",justifyContent:"center"}:{"& > *":{width:"100%",height:"100%"}}},children:S?de(jo,{size:"large",sx:{color:"var(--Background)"},children:de(Ut,{})}):r})})}const od=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",nd=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}],id=["default","solid","light","dark"],ad=["none","xs","sm","md","lg","xl"];function ld({label:e,selected:t,onClick:r}){return de(An,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function sd({color:e,selected:t,onClick:r,variant:o}){const n=od(e);return de(js,{component:"button","data-theme":{solid:n,light:n+"-Light",dark:n,default:void 0}[o],"data-surface":{solid:"Surface",light:"Surface",dark:"Surface-Dimmest",default:"Surface"}[o],onClick:()=>r(e),"aria-label":"Select "+n,"aria-pressed":t,title:n,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Background)",border:t?"2px solid var(--Text)":"2px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Text)",pointerEvents:"none"}})})}function dd(){const[e,t]=r("1:1"),[o,n]=r("solid"),[i,a]=r("primary"),[l,s]=r("none"),[d,c]=r(!1),[u,p]=r(!1),[h,m]=r(null),[f,g]=r("Surface");return ce(js,{sx:{pb:8},children:[de(Jr,{children:"Ratio"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ci,{theme:h,surface:f,children:de(js,{sx:{width:"100%",maxWidth:480},children:de(rd,{ratio:e,variant:o,color:i,padding:l,elevated:d,clickable:u})})}),de(Qi,{code:(()=>{const t=['ratio="'+e+'"'];return"default"!==o&&t.push('variant="'+o+'"'),"default"!==i&&t.push('color="'+i+'"'),"none"!==l&&t.push('padding="'+l+'"'),d&&t.push("elevated"),u&&t.push("clickable onClick={handleClick}"),"<Ratio "+t.join(" ")+">\n {/* your content */}\n</Ratio>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(js,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(ai,{defaultValue:0,variant:"standard",color:"primary",children:[ce(li,{children:[de(si,{children:"Playground"}),de(si,{children:"Reference"})]}),de(di,{value:0,children:ce(js,{sx:{p:3},children:[de(js,{sx:{mb:3},children:de(mi,{theme:h,onThemeChange:m,surface:f,onSurfaceChange:g})}),ce(js,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"VARIANT"}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:id.map(e=>de(ld,{label:od(e),selected:o===e,onClick:()=>n(e)},e))})]}),ce(js,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:nd.map(e=>ce(js,{children:[de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:e.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:e.colors.map(e=>de(sd,{color:e,selected:i===e,onClick:a,variant:"default"===o?"solid":o},e))})]},e.label))})]}),ce(js,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"PADDING"}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:ad.map(e=>de(ld,{label:"none"===e?"None":e.toUpperCase(),selected:l===e,onClick:()=>s(e)},e))})]}),ce(js,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"RATIO"}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:$s.map(r=>de(ld,{label:r,selected:e===r,onClick:()=>t(r)},r))})]}),ce(js,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(js,{children:[de(ko,{children:"Elevated"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Bumps the shadow up one level"})]}),de(ra,{checked:d,onChange:e=>c(e.target.checked),size:"small","aria-label":"Elevated"})]}),ce(js,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(js,{children:[de(ko,{children:"Clickable"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Adds hover, press, and focus-visible"})]}),de(ra,{checked:u,onChange:e=>p(e.target.checked),size:"small","aria-label":"Clickable"})]})]})}),de(di,{value:1,children:de(js,{sx:{p:3},children:ce(B,{spacing:3,children:[ce(js,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"Common use cases"}),de(B,{spacing:0,children:[{label:"1:1",value:"Square thumbnails, avatars, product tiles"},{label:"16:9",value:"Video, hero images, modern displays"},{label:"4:3",value:"Classic photo, presentation slides"},{label:"3:2",value:"DSLR photography, print frames"},{label:"21:9",value:"Cinematic ultrawide"},{label:"9:16 / 4:5 / 5:7",value:"Portrait social media (Stories, Reels, prints)"},{label:"16:10",value:"Laptop / monitor displays"},{label:"Golden-Horizontal",value:"φ : 1 — design framing for cards, hero blocks"},{label:"Golden-Vertical",value:"1 : φ — vertical posters, sidebars"}].map(({label:e,value:t})=>ce(js,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ao,{children:e}),de(bo,{style:{color:"var(--Text-Quiet)"},children:t})]},e))})]}),ce(co,{color:"quiet",children:["Built on native CSS ",de("code",{children:"aspect-ratio"}),". The themed shell mirrors Box — pick a variant + color to paint the frame, or keep ",de("code",{children:'variant="default"'}),"for a borderless ratio container."]})]})})})]})})})]})]})}const cd=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",ud=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}],pd=[{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}];function hd({label:e,selected:t,onClick:r}){return de(An,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function md({color:e,selected:t,onClick:r}){const o=cd(e);return de(h,{component:"button",onClick:()=>r(e),"aria-label":"Select "+o,"aria-pressed":t,title:o,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+o+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Buttons-"+o+"-Text)",pointerEvents:"none"}})})}function fd(){const[e,t]=r("standard"),[o,n]=r("default"),[i,a]=r("medium"),[l,s]=r("horizontal"),[d,c]=r(null),[u,p]=r("Surface"),[m,f]=r(!1),g="standard"===e?ud:pd;return ce(h,{sx:{pb:8},children:[de(Jr,{children:"Tabs"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ci,{theme:d,surface:u,children:de(h,{sx:{width:"100%",maxWidth:"vertical"===l?500:"100%",display:"flex",flexDirection:"vertical"===l?"row":"column"},children:ce(ai,{defaultValue:0,variant:e,color:o,size:i,orientation:l,children:[ce(li,{rounded:m,children:[de(si,{children:"Overview"}),de(si,{children:"Features"}),de(si,{children:"Pricing"})]}),de(di,{value:0,children:de(h,{sx:{p:2},children:de(co,{style:{color:"var(--Quiet)"},children:"Overview content goes here."})})}),de(di,{value:1,children:de(h,{sx:{p:2},children:de(co,{style:{color:"var(--Quiet)"},children:"Features content goes here."})})}),de(di,{value:2,children:de(h,{sx:{p:2},children:de(co,{style:{color:"var(--Quiet)"},children:"Pricing content goes here."})})})]})})}),de(Qi,{code:(()=>{const t=[];return"standard"!==e&&t.push('variant="'+e+'"'),"default"!==o&&t.push('color="'+o+'"'),"medium"!==i&&t.push('size="'+i+'"'),"horizontal"!==l&&t.push('orientation="vertical"'),"<Tabs defaultValue={0}"+(t.length?" "+t.join(" "):"")+">\n <TabList"+(m?" rounded":"")+">\n <Tab>Overview</Tab>\n <Tab>Features</Tab>\n <Tab>Pricing</Tab>\n </TabList>\n <TabPanel value={0}>Overview content</TabPanel>\n <TabPanel value={1}>Features content</TabPanel>\n <TabPanel value={2}>Pricing content</TabPanel>\n</Tabs>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(ai,{defaultValue:0,variant:"standard",color:"primary",children:[ce(li,{children:[de(si,{children:"Playground"}),de(si,{children:"Accessibility"})]}),de(di,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(mi,{theme:d,onThemeChange:c,surface:u,onSurfaceChange:p})}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"STYLE"}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:["standard","solid","light","dark"].map(r=>de(hd,{label:cd("standard"===r?"default":r),selected:e===r,onClick:()=>(e=>{t(e),"standard"!==e&&"default"===o&&n("primary")})(r)},r))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:g.map(e=>ce(h,{children:[de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:e.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:e.colors.map(e=>de(md,{color:e,selected:o===e,onClick:n},e))})]},e.label))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",spacing:1,children:["small","medium","large"].map(e=>de(hd,{label:cd(e),selected:i===e,onClick:()=>a(e)},e))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"ORIENTATION"}),de(B,{direction:"row",spacing:1,children:["horizontal","vertical"].map(e=>de(hd,{label:cd(e),selected:l===e,onClick:()=>s(e)},e))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SHAPE"}),de(ra,{label:"Rounded corners",checked:m,onChange:e=>f(e.target.checked)}),ce(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:["Off by default. When on, the TabList applies"," ",de("code",{children:"var(--Style-Border-Radius)"})," and clips the active tab's background to fit the rounded shell (",de("code",{children:"overflow: hidden"})," is always on)."]})]})]})}),de(di,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"TabList",value:'role="tablist" aria-orientation'},{label:"Tab",value:'role="tab" aria-selected aria-controls={panelId}'},{label:"TabPanel",value:'role="tabpanel" aria-labelledby={tabId}'},{label:"Keyboard",value:"Arrow keys navigate tabs. Home/End jump to first/last."},{label:"Focus",value:"outline: 3px solid var(--Focus-Visible); outline-offset: -3px"},{label:"Indicator",value:"Standard: var(--Buttons-{C}-Border). Themed: var(--Text)."}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ao,{children:[e,":"]}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}const gd={small:{fontSize:"var(--Body-Small-Font-Size)",gap:"6px",py:"4px"},medium:{fontSize:"var(--Body-Font-Size)",gap:"8px",py:"6px"},large:{fontSize:"var(--Body-Large-Font-Size)",gap:"10px",py:"8px"}};function xd({children:e,separator:r="/",size:o="medium",condense:n=!1,maxItems:i=4,itemsBeforeCollapse:a=1,itemsAfterCollapse:l=1,backOnlyMobile:s=!1,onExpand:d,className:c="",sx:m={},...f}){const g=gd[o]||gd.medium,x=u.toArray(e).filter(p),b=x.length,v=n&&b>i;let y=x;const[S,k]=t.useState(!1);if(v&&!S){const e=x.slice(0,a),t=x.slice(b-l);y=[...e,de(h,{component:"button",onClick:()=>{k(!0),d?.()},"aria-label":"Show full breadcrumb trail",className:"breadcrumb-ellipsis",sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",background:"none",border:"none",padding:"2px 4px",cursor:"pointer",fontFamily:"inherit",fontSize:"inherit",color:"var(--Quiet)",borderRadius:"4px","&:hover":{backgroundColor:"var(--Hover)",color:"var(--Text)"},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"1px"}},children:"…"},"__breadcrumb-ellipsis"),...t]}const B=[];y.forEach((e,t)=>{const o=v&&!S?t===y.length-1:t===b-1;B.push(de(h,{component:"li",className:"breadcrumb-item"+(o?" breadcrumb-current":""),sx:{display:"inline-flex",alignItems:"center",...o&&{color:"var(--Text)",fontWeight:600},...!o&&{color:"var(--Quiet)"},maxWidth:"200px","& > *":{overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"}},...o?{"aria-current":"page"}:{},children:e},"crumb-"+t)),t<y.length-1&&B.push(de(h,{component:"li",role:"presentation","aria-hidden":"true",className:"breadcrumb-separator",sx:{display:"inline-flex",alignItems:"center",color:"var(--Quiet)",userSelect:"none",fontSize:"inherit",lineHeight:1,flexShrink:0},children:r},"sep-"+t))});const w=b>=2?x[b-2]:null;return ce(h,{component:"nav","aria-label":"Breadcrumb",className:"breadcrumbs breadcrumbs-"+o+" "+c,sx:{fontSize:g.fontSize,fontFamily:"var(--Body-Font-Family)",lineHeight:1.5,...m},...f,children:[de(h,{component:"ol",className:"breadcrumbs-list",sx:{display:"flex",flexWrap:"wrap",alignItems:"center",gap:g.gap,listStyle:"none",margin:0,padding:0,...s&&{"@media (max-width: 600px)":{display:"none"}}},children:B}),s&&w&&ce(h,{className:"breadcrumbs-back-mobile",sx:{display:"none","@media (max-width: 600px)":{display:"flex",alignItems:"center",gap:"4px",fontSize:g.fontSize,color:"var(--Link)"}},children:[de(h,{component:"span","aria-hidden":"true",sx:{fontSize:"1.1em",lineHeight:1},children:"←"}),t.cloneElement(w,{style:{...w.props?.style||{},textDecoration:"underline",textUnderlineOffset:"3px"}})]})]})}function bd({children:e,href:t,className:r="",sx:o={},...n}){const i=!!t;return de(h,{component:i?"a":"span",href:t||void 0,className:"breadcrumb-link "+r,sx:{color:"inherit",textDecoration:i?"underline":"none",textUnderlineOffset:"3px",textDecorationThickness:"1px",cursor:i?"pointer":"default",transition:"color 0.15s ease",...i&&{"&:hover":{color:"var(--Link-Hover)",textDecorationThickness:"2px"},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"2px",borderRadius:"2px"}},...o},...n,children:e})}const vd=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"";function yd({label:e,selected:t,onClick:r}){return de(An,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function Sd(){const[e,t]=r("medium"),[o,n]=r("/"),[i,a]=r(!1),[l,s]=r(null),[d,c]=r("Surface");return ce(h,{sx:{pb:8},children:[de(Jr,{children:"Breadcrumbs"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ci,{theme:l,surface:d,children:ce(xd,{size:e,separator:o,condense:i,maxItems:3,children:[de(bd,{href:"#",children:"Home"}),de(bd,{href:"#",children:"Products"}),de(bd,{href:"#",children:"Shoes"}),de(bd,{children:"Running Shoes"})]})}),de(Qi,{code:(()=>{const t=[];return"medium"!==e&&t.push('size="'+e+'"'),"/"!==o&&t.push('separator="'+o+'"'),i&&t.push("condense maxItems={3}"),"<Breadcrumbs"+(t.length?" "+t.join(" "):"")+'>\n <BreadcrumbItem href="/">Home</BreadcrumbItem>\n <BreadcrumbItem href="/products">Products</BreadcrumbItem>\n <BreadcrumbItem href="/products/shoes">Shoes</BreadcrumbItem>\n <BreadcrumbItem>Running Shoes</BreadcrumbItem>\n</Breadcrumbs>'})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(ai,{defaultValue:0,variant:"standard",color:"primary",children:[ce(li,{children:[de(si,{children:"Playground"}),de(si,{children:"Accessibility"})]}),de(di,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(mi,{theme:l,onThemeChange:s,surface:d,onSurfaceChange:c})}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",spacing:1,children:["small","medium","large"].map(r=>de(yd,{label:vd(r),selected:e===r,onClick:()=>t(r)},r))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SEPARATOR"}),de(B,{direction:"row",spacing:1,children:["/","›","→","·","|"].map(e=>de(yd,{label:e,selected:o===e,onClick:()=>n(e)},e))})]}),ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Condense"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Collapse middle items into ellipsis"})]}),de(ra,{variant:"default-outline",checked:i,onChange:e=>a(e.target.checked),size:"small","aria-label":"Condense"})]})]})}),de(di,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Nav",value:'<nav aria-label="Breadcrumb">'},{label:"List",value:"<ol> with <li> for each crumb"},{label:"Current",value:'aria-current="page" on the last item'},{label:"Links",value:"BreadcrumbItem renders <a> when href is provided"},{label:"Ellipsis",value:'Expandable button with aria-label="Show full breadcrumb trail"'},{label:"Separator",value:'aria-hidden="true" — decorative only'}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ao,{children:[e,":"]}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}const kd={small:{btnSize:"small",fontSize:"13px",gap:"2px"},medium:{btnSize:"medium",fontSize:"14px",gap:"4px"},large:{btnSize:"large",fontSize:"16px",gap:"4px"}};function Bd({count:e=10,page:t,defaultPage:o=1,onChange:i,color:a="default",size:l="medium",siblingCount:s=1,boundaryCount:d=1,disabled:c=!1,showFirstButton:u=!1,showLastButton:p=!1,className:m="",sx:f={},...g}){const[x,b]=r(o),v=void 0!==t,y=v?t:x;(e=>{e.charAt(0).toUpperCase(),e.slice(1)})("default"===a?"Default":a);const S=kd[l]||kd.medium,k=n(t=>{const r=Math.max(1,Math.min(e,t));v||b(r),i?.(r)},[e,v,i]),B=function({count:e,page:t,siblingCount:r=1,boundaryCount:o=1}){const n=(e,t)=>Array.from({length:t-e+1},(t,r)=>e+r);if(2*r+3+2*o>=e)return n(1,e);const i=Math.max(t-r,o+1),a=Math.min(t+r,e-o),l=i>o+2,s=a<e-o-1;if(!l&&s)return[...n(1,Math.min(3+2*r+o,e)),"ellipsis-right",...n(e-o+1,e)];if(l&&!s){const t=n(Math.max(e-(3+2*r+o)+1,1),e);return[...n(1,o),"ellipsis-left",...t]}return l&&s?[...n(1,o),"ellipsis-left",...n(i,a),"ellipsis-right",...n(e-o+1,e)]:n(1,e)}({count:e,page:y,siblingCount:s,boundaryCount:d}),w="default"===a?"default":a;return de(h,{component:"nav","aria-label":"Pagination",className:"pagination pagination-"+a+" pagination-"+l+" "+m,sx:{display:"inline-flex",...f},...g,children:ce(h,{component:"ul",sx:{display:"flex",alignItems:"center",gap:S.gap,listStyle:"none",m:0,p:0,flexWrap:"wrap"},children:[u&&de(h,{component:"li",children:de(An,{iconOnly:!0,variant:w+"-outline",size:S.btnSize,disabled:c||1===y,onClick:()=>k(1),"aria-label":"Go to first page",children:de(jo,{size:"small",children:de(qt,{})})})}),de(h,{component:"li",children:de(An,{iconOnly:!0,variant:w+"-outline",size:S.btnSize,disabled:c||1===y,onClick:()=>k(y-1),"aria-label":"Go to previous page",children:de(jo,{size:"small",children:de(Xt,{})})})}),B.map((e,t)=>{if("string"==typeof e)return de(h,{component:"li",children:de(bo,{style:{color:"var(--Quiet)",padding:"0 4px"},"aria-hidden":"true",children:"…"})},e+"-"+t);const r=e===y;return de(h,{component:"li",children:de(An,{variant:r?w:w+"-outline",size:S.btnSize,disabled:c,onClick:()=>k(e),"aria-label":"Page "+e,"aria-current":r?"page":void 0,letterNumber:!0,children:e})},e)}),de(h,{component:"li",children:de(An,{iconOnly:!0,variant:w+"-outline",size:S.btnSize,disabled:c||y===e,onClick:()=>k(y+1),"aria-label":"Go to next page",children:de(jo,{size:"small",children:de(Kt,{})})})}),p&&de(h,{component:"li",children:de(An,{iconOnly:!0,variant:w+"-outline",size:S.btnSize,disabled:c||y===e,onClick:()=>k(e),"aria-label":"Go to last page",children:de(jo,{size:"small",children:de(Jt,{})})})})]})})}const wd=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",Cd=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}];function Td({label:e,selected:t,onClick:r}){return de(An,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function Id({color:e,selected:t,onClick:r}){const o=wd(e);return de(h,{component:"button",onClick:()=>r(e),"aria-label":"Select "+o,"aria-pressed":t,title:o,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+o+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Buttons-"+o+"-Text)",pointerEvents:"none"}})})}function Ad(){const[e,t]=r("default"),[o,n]=r("medium"),[i,a]=r(10),[l,s]=r(!1),[d,c]=r(!1),[u,p]=r(!1),[m,f]=r(null),[g,x]=r("Surface");return ce(h,{sx:{pb:8},children:[de(Jr,{children:"Pagination"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ci,{theme:m,surface:g,children:de(Bd,{color:e,size:o,count:i,showFirstButton:l,showLastButton:d,disabled:u})}),de(Qi,{code:(()=>{const t=[];return"default"!==e&&t.push('color="'+e+'"'),"medium"!==o&&t.push('size="'+o+'"'),10!==i&&t.push("count={"+i+"}"),l&&t.push("showFirstButton"),d&&t.push("showLastButton"),u&&t.push("disabled"),t.push("onChange={handlePageChange}"),1===t.length?"<Pagination onChange={handlePageChange} />":"<Pagination\n "+t.join("\n ")+"\n/>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(ai,{defaultValue:0,variant:"standard",color:"primary",children:[ce(li,{children:[de(si,{children:"Playground"}),de(si,{children:"Accessibility"})]}),de(di,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(mi,{theme:m,onThemeChange:f,surface:g,onSurfaceChange:x})}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:Cd.map(r=>ce(h,{children:[de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:r.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:r.colors.map(r=>de(Id,{color:r,selected:e===r,onClick:t},r))})]},r.label))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",spacing:1,children:["small","medium","large"].map(e=>de(Td,{label:wd(e),selected:o===e,onClick:()=>n(e)},e))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"PAGES"}),de(B,{direction:"row",spacing:1,children:[5,10,20,50].map(e=>de(Td,{label:String(e),selected:i===e,onClick:()=>a(e)},e))})]}),ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"First/Last Buttons"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Show jump to first/last page"})]}),de(ra,{variant:"default-outline",checked:l,onChange:e=>{s(e.target.checked),c(e.target.checked)},size:"small","aria-label":"First/last buttons"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Disabled"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Non-interactive state"})]}),de(ra,{variant:"default-outline",checked:u,onChange:e=>p(e.target.checked),size:"small","aria-label":"Disabled"})]})]})}),de(di,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Nav",value:'<nav aria-label="Pagination">'},{label:"List",value:"<ol> with <li> for each button"},{label:"Current",value:'aria-current="page" on selected page'},{label:"Labels",value:'aria-label="Page N", "Go to previous/next/first/last page"'},{label:"Keyboard",value:"Tab navigates between buttons"},{label:"Focus",value:"Uses Button component focus styles"}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ao,{children:[e,":"]}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}const zd=e=>e.charAt(0).toUpperCase()+e.slice(1),Rd={small:{py:"4px",itemPx:"8px",itemPy:"4px",fontSize:"13px",minWidth:"140px"},medium:{py:"6px",itemPx:"12px",itemPy:"6px",fontSize:"14px",minWidth:"160px"},large:{py:"8px",itemPx:"16px",itemPy:"8px",fontSize:"16px",minWidth:"180px"}},Ed=s({open:!1,setOpen:()=>{},anchorRef:{current:null},menuId:"",buttonId:"",variant:"outline",color:"default",size:"medium"}),Pd=()=>l(Ed);function Od({children:e,variant:t="outline",color:i="default",size:l="medium",open:s,onOpenChange:d,...c}){const[u,p]=r(!1),m=void 0!==s,f=m?s:u,g=o(null),x=a(),b="menu-"+x,v="menubtn-"+x,y=n(e=>{const t="function"==typeof e?e(f):e;m?d?.(t):p(t)},[m,f,d]);return de(Ed.Provider,{value:{open:f,setOpen:y,anchorRef:g,menuId:b,buttonId:v,variant:t,color:i,size:l},children:de(h,{sx:{display:"inline-flex",position:"relative"},...c,children:e})})}function Ld({children:e,className:t="",sx:r={},...o}){const{open:n,setOpen:i,anchorRef:a,menuId:l,buttonId:s,size:d,color:c}=Pd(),u=Rd[d]||Rd.medium,p=zd("default"===c?"Default":c);return ce(h,{component:"button",ref:a,id:s,"aria-haspopup":"true","aria-expanded":n,"aria-controls":n?l:void 0,onClick:()=>i(e=>!e),className:"menu-button "+t,sx:{display:"inline-flex",alignItems:"center",gap:"6px",padding:u.itemPy+" "+u.itemPx,fontSize:u.fontSize,fontFamily:"inherit",fontWeight:600,color:"var(--Text)",backgroundColor:"var(--Background)",border:"1px solid var(--Buttons-"+p+"-Border)",borderRadius:"var(--Style-Border-Radius)",cursor:"pointer",boxShadow:"none",transition:"box-shadow 0.15s ease","&:focus-visible":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"},...r},onKeyDown:e=>{"ArrowDown"!==e.key&&"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),i(!0))},...o,children:["string"==typeof e?de("small"===d?ao:co,{style:{color:"inherit",fontWeight:600},children:e}):e,de(jo,{size:"small",sx:{color:"var(--Quiet)",transition:"transform 0.2s ease",transform:n?"rotate(180deg)":"rotate(0deg)"},children:de(Se,{})})]})}function Md({children:e,className:t="",placement:r="bottom-start",sx:n={},...a}){const{open:l,setOpen:s,anchorRef:d,menuId:c,buttonId:u,variant:p,color:m,size:f}=Pd(),g=o(null),x=Rd[f]||Rd.medium,b=zd("default"===m?"Default":m),v="var(--Buttons-"+b+"-Border)",y="light"===p?"default"===m?"Default":b:"solid"===p?b:void 0,S="light"===p?"Surface-Brightest":"solid"===p?"Surface":void 0;return i(()=>{if(l&&g.current){const e=g.current.querySelector('[role="menuitem"]:not([aria-disabled="true"])');e&&e.focus()}},[l]),i(()=>{if(!l)return;const e=e=>{g.current&&!g.current.contains(e.target)&&d.current&&!d.current.contains(e.target)&&s(!1)};return document.addEventListener("mousedown",e),()=>document.removeEventListener("mousedown",e)},[l,s,d]),i(()=>{if(!l)return;const e=e=>{"Escape"===e.key&&(s(!1),d.current?.focus())};return document.addEventListener("keydown",e),()=>document.removeEventListener("keydown",e)},[l,s,d]),l?de(h,{className:"menu menu-"+p+" "+t,sx:{position:"absolute",top:"100%",left:"bottom-end"===r?"auto":0,right:"bottom-end"===r?0:"auto",zIndex:99999,marginTop:"4px",border:"1px solid "+v,borderRadius:"var(--Dropdown-Frame-Radius, var(--Input-Radius, var(--Style-Border-Radius, 4px)))",boxShadow:"none",overflow:"hidden",...n},children:de(h,{ref:g,id:c,role:"menu","aria-labelledby":u,"data-theme":y,"data-surface":S,sx:{minWidth:x.minWidth,backgroundColor:"var(--Background)",color:"var(--Text)",fontSize:x.fontSize,fontFamily:"inherit",padding:x.py+" 0",outline:"none",borderRadius:"calc(var(--Dropdown-Frame-Radius, var(--Input-Radius, var(--Style-Border-Radius, 4px))) - 1px)"},onKeyDown:e=>{const t=g.current?.querySelectorAll('[role="menuitem"]:not([aria-disabled="true"])');if(!t?.length)return;const r=Array.from(t).indexOf(document.activeElement);"ArrowDown"===e.key?(e.preventDefault(),t[(r+1)%t.length].focus()):"ArrowUp"===e.key?(e.preventDefault(),t[(r-1+t.length)%t.length].focus()):"Home"===e.key?(e.preventDefault(),t[0].focus()):"End"===e.key?(e.preventDefault(),t[t.length-1].focus()):"Tab"===e.key&&s(!1)},...a,children:e})}):null}function Wd({children:e,onClick:t,selected:r=!1,disabled:o=!1,className:n="",sx:i={},...a}){const{setOpen:l,size:s}=Pd(),d=Rd[s]||Rd.medium,c="small"===s?ao:co,u=()=>{o||(t?.(),l(!1))};return de(h,{role:"menuitem",tabIndex:o?-1:0,"aria-disabled":o||void 0,"aria-selected":r||void 0,onClick:u,onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),u())},className:"menu-item"+(r?" menu-item-selected":"")+" "+n,sx:{display:"flex",alignItems:"center",gap:"8px",padding:d.itemPy+" "+d.itemPx,color:o?"var(--Quiet)":r?"var(--Text)":"var(--Quiet)",backgroundColor:r?"var(--Hover)":"transparent",cursor:o?"not-allowed":"pointer",opacity:o?.5:1,outline:"none",transition:"background-color 0.1s ease, color 0.1s ease",userSelect:"none",...!o&&{"&:hover":{backgroundColor:"var(--Hover)",color:"var(--Text)"},"&:focus-visible":{backgroundColor:"var(--Hover)",color:"var(--Text)",outline:"3px solid var(--Focus-Visible)",outlineOffset:"-3px"}},...i},...a,children:de(c,{style:{color:"inherit",fontWeight:r?600:"inherit"},children:e})})}function Dd({className:e="",sx:t={},...r}){return de(h,{component:"hr",role:"separator",className:"menu-divider "+e,sx:{border:"none",borderTop:"1px solid var(--Border)",margin:"4px 0",...t},...r})}const Fd=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",Nd=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}];function Hd({label:e,selected:t,onClick:r}){return de(An,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function Vd({color:e,selected:t,onClick:r}){const o=Fd(e);return de(h,{component:"button",onClick:()=>r(e),"aria-label":"Select "+o,"aria-pressed":t,title:o,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+o+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Buttons-"+o+"-Text)",pointerEvents:"none"}})})}function Qd(){const[e,t]=r("outline"),[o,n]=r("default"),[i,a]=r("medium"),[l,s]=r(null),[d,c]=r("Surface");return ce(h,{sx:{pb:8},children:[de(Jr,{children:"Menu"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ci,{theme:l,surface:d,sx:{minHeight:250,alignItems:"flex-start",pt:6},children:ce(Od,{variant:e,color:o,size:i,children:[de(Ld,{children:"Actions"}),ce(Md,{children:[de(Wd,{children:"Edit"}),de(Wd,{children:"Duplicate"}),de(Wd,{selected:!0,children:"Archive"}),de(Dd,{}),de(Wd,{disabled:!0,children:"Delete"})]})]})}),de(Qi,{code:(()=>{const t=[];return"outline"!==e&&t.push('variant="'+e+'"'),"default"!==o&&t.push('color="'+o+'"'),"medium"!==i&&t.push('size="'+i+'"'),"<Dropdown "+t.join(" ")+">\n <MenuButton>Actions</MenuButton>\n <Menu>\n <MenuItem>Edit</MenuItem>\n <MenuItem>Duplicate</MenuItem>\n <MenuDivider />\n <MenuItem>Delete</MenuItem>\n </Menu>\n</Dropdown>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(ai,{defaultValue:0,variant:"standard",color:"primary",children:[ce(li,{children:[de(si,{children:"Playground"}),de(si,{children:"Accessibility"})]}),de(di,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(mi,{theme:l,onThemeChange:s,surface:d,onSurfaceChange:c})}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"STYLE"}),de(B,{direction:"row",spacing:1,children:["outline","solid","light"].map(r=>de(Hd,{label:Fd(r),selected:e===r,onClick:()=>t(r)},r))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:Nd.map(e=>ce(h,{children:[de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:e.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:e.colors.map(e=>de(Vd,{color:e,selected:o===e,onClick:n},e))})]},e.label))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",spacing:1,children:["small","medium","large"].map(e=>de(Hd,{label:Fd(e),selected:i===e,onClick:()=>a(e)},e))})]})]})}),de(di,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Button",value:'aria-haspopup="true" aria-expanded aria-controls'},{label:"Menu",value:'role="menu" aria-labelledby={buttonId}'},{label:"Items",value:'role="menuitem" with tabIndex'},{label:"Selected",value:'aria-selected="true" on active item'},{label:"Disabled",value:'aria-disabled="true", not focusable'},{label:"Keyboard",value:"Arrow keys navigate. Enter/Space selects. Escape closes."},{label:"Focus",value:"First item focused on open. Focus returns to button on close."}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ao,{children:[e,":"]}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}const jd={default:"Nav-Bar",primary:"Primary","primary-light":"Primary-Light","primary-medium":"Primary-Medium","primary-dark":"Primary-Dark",white:"White",black:"Black"};function Gd({items:e=[],value:t,defaultValue:o=0,onChange:i,showLabels:a=!0,labelOrientation:l="vertical",backfill:s=!0,barColor:d="default",fixed:c=!0,className:u="",sx:p={},...m}){const[f,g]=r(o),x=void 0!==t,b=x?t:f,v=n(e=>{x||g(e),i?.(e)},[x,i]),y="horizontal"===(e.length>4?"vertical":l);return de(h,{component:"nav",role:"navigation","aria-label":"Bottom navigation","data-theme":jd[d]||jd.default,"data-surface":"Surface-Dim",className:"bottom-nav bottom-nav-"+d+(a?" bottom-nav-labels":"")+(y&&a?" bottom-nav-horizontal":"")+(s?" bottom-nav-backfill":"")+(c?" bottom-nav-fixed":"")+(u?" "+u:""),sx:{display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:"var(--Background)",borderTop:"1px solid var(--Border)",fontFamily:"inherit",width:"100%",...c&&{position:"fixed",bottom:0,left:0,right:0,zIndex:1100},...p},...m,children:de(h,{role:"tablist",sx:{display:"flex",alignItems:"center",justifyContent:"space-around",width:"100%",maxWidth:600,height:a&&!y?72:64,px:1},children:e.map((e,t)=>{const r=t===b;return de(Ud,{icon:e.icon,label:e.label,selected:r,showLabel:a,horizontal:y,backfill:s,onClick:()=>v(t),ariaLabel:e.label||"Tab "+(t+1)},e.key||t)})})})}function Ud({icon:e,label:t,selected:r,showLabel:o,horizontal:n,backfill:i,onClick:a,ariaLabel:l}){const s="var(--Text-Quiet)",d="var(--Text)",c="var(--Buttons-Primary-Text)",u=r?i&&n?c:d:s,p=!n,m=ce(h,{sx:{display:"flex",flexDirection:n?"row":"column",alignItems:"center",justifyContent:"center",gap:n?.75:0,...r&&i&&{backgroundColor:"var(--Buttons-Primary-Button)",border:"1px solid var(--Buttons-Primary-Border)",borderRadius:"16px",px:n?2:2.5,py:.5},...r&&i?{}:{px:n?1:0,border:"1px solid transparent"},transition:"background-color 0.2s ease, border-color 0.2s ease"},children:[de(h,{sx:{display:"flex",alignItems:"center",justifyContent:"center",fontSize:"24px",color:r?i?c:d:s,transition:"color 0.15s ease","& .MuiSvgIcon-root":{fontSize:"inherit",color:"inherit"}},children:e}),o&&n&&t&&de(h,{sx:{fontSize:"13px",fontWeight:r?600:500,color:r&&i?c:r?d:s,whiteSpace:"nowrap",lineHeight:1,transition:"color 0.15s ease"},children:t})]});return ce(h,{component:"button",type:"button",role:"tab","aria-selected":r,"aria-label":l,onClick:a,sx:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",flex:1,gap:p&&o?.25:0,border:"none",backgroundColor:"transparent",cursor:"pointer",outline:"none",fontFamily:"inherit",py:1,minWidth:0,transition:"transform 0.1s ease","&:hover":{transform:"scale(1.04)"},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"-2px",borderRadius:"8px"}},children:[m,o&&p&&t&&de(h,{sx:{fontSize:"11px",fontWeight:r?600:400,color:u,whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis",maxWidth:"100%",lineHeight:1.2,mt:.25,transition:"color 0.15s ease"},children:t})]})}const Xd={Home:de(Be,{sx:{fontSize:"inherit"}}),Explore:de(Yt,{sx:{fontSize:"inherit"}}),Radio:de(Zt,{sx:{fontSize:"inherit"}}),Library:de($t,{sx:{fontSize:"inherit"}}),Favorite:de(ke,{sx:{fontSize:"inherit"}}),Person:de(me,{sx:{fontSize:"inherit"}}),Search:de(Te,{sx:{fontSize:"inherit"}}),Settings:de(Ce,{sx:{fontSize:"inherit"}}),Notifications:de(Ae,{sx:{fontSize:"inherit"}}),Cart:de(Re,{sx:{fontSize:"inherit"}}),Star:de(Ie,{sx:{fontSize:"inherit"}}),Bookmark:de(_t,{sx:{fontSize:"inherit"}})},Kd=Object.keys(Xd),qd=[{icon:"Home",label:"Home"},{icon:"Explore",label:"Browse"},{icon:"Radio",label:"Radio"},{icon:"Library",label:"Library"}],Jd=[{value:"default",label:"Default",desc:'data-theme="Nav-Bar"'},{value:"primary",label:"Primary",desc:'data-theme="Primary"'},{value:"primary-light",label:"Primary Light",desc:'data-theme="Primary-Light"'},{value:"primary-medium",label:"Primary Medium",desc:'data-theme="Primary-Medium"'},{value:"primary-dark",label:"Primary Dark",desc:'data-theme="Primary-Dark"'},{value:"white",label:"White",desc:'data-theme="White"'},{value:"black",label:"Black",desc:'data-theme="Black"'}];function Yd({label:e,selected:t,onClick:r,disabled:o}){return de(h,{component:"button",onClick:r,disabled:o,sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",cursor:o?"not-allowed":"pointer",border:"2px solid var(--Buttons-Primary-Button)",borderRadius:"var(--Style-Border-Radius)",backgroundColor:t?"var(--Buttons-Primary-Button)":"transparent",color:t?"var(--Buttons-Primary-Text)":"var(--Text)",padding:"4px 12px",fontSize:"14px",fontFamily:"inherit",fontWeight:500,whiteSpace:"nowrap",flexShrink:0,opacity:o?.4:1,transition:"background-color 0.15s ease, color 0.15s ease","&:hover":{backgroundColor:o?"transparent":t?"var(--Buttons-Primary-Hover)":"var(--Surface-Dim)"},"&:focus-visible":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"}},children:e})}function Zd({value:e,onChange:t,placeholder:r,sx:o}){return de(h,{component:"input",type:"text",value:e,onChange:e=>t(e.target.value),placeholder:r,sx:{flex:1,padding:"4px 8px",fontSize:"13px",fontFamily:"inherit",border:"1px solid var(--Border)",borderRadius:"4px",backgroundColor:"var(--Background)",color:"var(--Text)",outline:"none",minWidth:0,"&:focus":{borderColor:"var(--Focus-Visible)"},...o}})}function $d({value:e,onChange:t,options:r,label:o}){return de(h,{component:"select",value:e,onChange:e=>t(e.target.value),"aria-label":o,sx:{padding:"4px 6px",fontSize:"13px",fontFamily:"inherit",border:"1px solid var(--Border)",borderRadius:"4px",backgroundColor:"var(--Background)",color:"var(--Text)",outline:"none",cursor:"pointer","&:focus":{borderColor:"var(--Focus-Visible)"}},children:r.map(e=>de("option",{value:"string"==typeof e?e:e.value,children:"string"==typeof e?e:e.label},"string"==typeof e?e:e.value))})}function _d({value:e,onChange:t,min:r,max:o,label:n}){return ce(h,{sx:{display:"flex",alignItems:"center",gap:1},children:[de(bo,{style:{color:"var(--Text-Quiet)",flexShrink:0,width:90},children:n}),de("button",{type:"button",onClick:()=>{e>r&&t(e-1)},disabled:e<=r,style:{width:28,height:28,display:"flex",alignItems:"center",justifyContent:"center",border:"1px solid var(--Border)",borderRadius:"4px",backgroundColor:"var(--Background)",color:"var(--Text)",cursor:e<=r?"not-allowed":"pointer",fontSize:"14px",opacity:e<=r?.4:1,fontFamily:"inherit"},children:"−"}),de(h,{sx:{fontWeight:700,fontSize:"14px",minWidth:24,textAlign:"center"},children:e}),de("button",{type:"button",onClick:()=>{e<o&&t(e+1)},disabled:e>=o,style:{width:28,height:28,display:"flex",alignItems:"center",justifyContent:"center",border:"1px solid var(--Border)",borderRadius:"4px",backgroundColor:"var(--Background)",color:"var(--Text)",cursor:e>=o?"not-allowed":"pointer",fontSize:"14px",opacity:e>=o?.4:1,fontFamily:"inherit"},children:"+"})]})}function ec({label:e,checked:t,onChange:r,caption:o,disabled:n}){return ce(h,{sx:{py:.5,opacity:n?.4:1},children:[de(v,{control:de(b,{checked:t,onChange:e=>r(e.target.checked),size:"small",disabled:n,sx:{color:"var(--Text-Quiet)","&.Mui-checked":{color:"var(--Buttons-Primary-Button)"}}}),label:de(ko,{children:e}),sx:{m:0}}),o&&de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginLeft:32},children:o})]})}function tc(){const[e,t]=r(0),[o,n]=r(0),[a,l]=r(!0),[s,d]=r(!0),[c,u]=r("vertical"),[p,m]=r(!0),[f,g]=r("default"),[x,b]=r(4),[v,y]=r(qd.map(e=>({icon:e.icon,label:e.label}))),S=x<=4;i(()=>{x>4&&"horizontal"===c&&u("vertical")},[x,c]),i(()=>{y(e=>{const t=[],r=[{icon:"Favorite",label:"Favorites"},{icon:"Person",label:"Profile"}];for(let o=0;o<x;o++)if(e[o])t.push(e[o]);else{const e=r[o-qd.length]||{icon:Kd[o%Kd.length],label:Kd[o%Kd.length]};t.push(e)}return t}),n(e=>Math.min(e,x-1))},[x]);const k=(e,t,r)=>{y(o=>{const n=[...o];return n[e]={...n[e],[t]:r},n})},w=v.slice(0,x).map(e=>({icon:Xd[e.icon]||Xd.Home,label:e.label}));return ce(h,{sx:{pb:8},children:[de(Jr,{children:"Bottom Navigation"}),ce(N,{value:e,onChange:(e,r)=>t(r),sx:{mt:3,mb:0,borderBottom:"1px solid var(--Border)","& .MuiTabs-indicator":{backgroundColor:"var(--Buttons-Primary-Button)",height:3},"& .MuiTab-root":{color:"var(--Text-Quiet)",textTransform:"none",fontWeight:500,"&.Mui-selected":{color:"var(--Text)"}}},children:[de(H,{label:"Playground"}),de(H,{label:"Accessibility"})]}),0===e&&ce(I,{container:!0,sx:{minHeight:400},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"calc((100vw - 432px) / 2)"},flexShrink:0},children:[ce(h,{sx:{p:4,display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",minHeight:300,backgroundColor:"var(--Background)",borderBottom:"1px solid var(--Border)",gap:4},children:[de(h,{sx:{width:"100%",maxWidth:500,overflow:"hidden",boxShadow:"0 2px 12px rgba(0,0,0,0.08)"},children:de(Gd,{items:w,value:o,onChange:n,showLabels:s,labelOrientation:c,backfill:p,barColor:f,fixed:!1},"bn-"+x+"-"+c+"-"+p+"-"+s+"-"+f)}),ce(bo,{style:{color:"var(--Text-Quiet)",textAlign:"center"},children:[x," items · ",s?"horizontal"===c&&S?"Horizontal labels":"Vertical labels":"Icons only",p?" · Backfill":""," · ",(Jd.find(e=>e.value===f)||Jd[0]).label]})]}),de(Qi,{code:(()=>{const e=[];e.push("const items = ["),w.forEach((t,r)=>{const o=v[r];e.push(" { icon: <"+o.icon+"Icon />, label: '"+o.label+"' },")}),e.push("];"),e.push("");const t=[];return t.push("items={items}"),"default"!==f&&t.push('barColor="'+f+'"'),s||t.push("showLabels={false}"),s&&"horizontal"===c&&S&&t.push('labelOrientation="horizontal"'),p||t.push("backfill={false}"),a||t.push("fixed={false}"),e.push("<BottomNavigation"),t.forEach(t=>e.push(" "+t)),e.push("/>"),e.join("\n")})(),language:"JSX",sx:{borderRadius:0,borderBottom:"1px solid var(--Border)"}})]}),ce(I,{item:!0,sx:{width:{xs:"calc(100vw - 432px)",md:"calc((100vw - 432px) / 2)"},flexShrink:0,p:3,backgroundColor:"var(--Container)",overflowY:"auto"},children:[de(Yr,{children:"Playground"}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"BAR COLOR"}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:Jd.map(e=>de(Yd,{label:e.label,selected:f===e.value,onClick:()=>g(e.value)},e.value))}),ce(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:[(Jd.find(e=>e.value===f)||Jd[0]).desc,' · data-surface="Surface-Dim" · bg: var(--Background)']})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"OPTIONS"}),ce(B,{spacing:0,children:[de(ec,{label:"Fixed",checked:a,onChange:l,caption:"Position fixed to bottom of viewport."}),de(ec,{label:"Labels",checked:s,onChange:d,caption:"Show text labels with icons."}),de(ec,{label:"Selected Backfill",checked:p,onChange:m,caption:"Pill on selected: bg var(--Buttons-Primary-Button), border var(--Buttons-Primary-Border), icon var(--Buttons-Primary-Text)."})]})]}),s&&ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"LABEL ORIENTATION"}),ce(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:[de(Yd,{label:"Vertical",selected:"vertical"===c,onClick:()=>u("vertical")}),de(Yd,{label:"Horizontal",selected:"horizontal"===c&&S,onClick:()=>{S&&u("horizontal")},disabled:!S})]}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:S?"vertical"===c?"Icon above label (default). Label below pill.":"Icon beside label. Label inside pill when backfill is on.":"Horizontal is only available with 4 or fewer items. Reduce item count to enable."})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"NAVIGATION ITEMS"}),de(_d,{label:"Count",value:x,onChange:b,min:3,max:6}),de(B,{spacing:1.5,sx:{mt:2},children:v.slice(0,x).map((e,t)=>ce(h,{sx:{display:"flex",alignItems:"center",gap:1,flexWrap:"nowrap"},children:[de(bo,{style:{color:"var(--Text-Quiet)",flexShrink:0,width:16,textAlign:"right"},children:t+1}),de($d,{value:e.icon,onChange:e=>k(t,"icon",e),options:Kd,label:"Item "+(t+1)+" icon"}),s&&de(Zd,{value:e.label,onChange:e=>k(t,"label",e),placeholder:"Label"})]},t))})]})]})]}),1===e&&ce(h,{sx:{p:4},children:[de(Yr,{children:"Accessibility Requirements"}),ce(ao,{color:"quiet",style:{marginBottom:32},children:[x," items · ",s?"Labels "+c:"Icons only",p?" · Backfill":""," · ",(Jd.find(e=>e.value===f)||Jd[0]).label]}),ce(B,{spacing:4,children:[ce(h,{sx:{p:3,backgroundColor:"var(--Container)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"ARIA and Semantics"}),ce(B,{spacing:0,children:[ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ao,{children:"Landmark:"}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:'<nav role="navigation" aria-label="Bottom navigation">'})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ao,{children:"Tab list:"}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:'role="tablist"'})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ao,{children:"Tab items:"}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:'role="tab", aria-selected, aria-label'})]}),ce(h,{sx:{py:1.5},children:[de(ao,{children:"Focus:"}),de(bo,{style:{color:"var(--Text-Quiet)"},children:"3px solid var(--Focus-Visible) on :focus-visible."})]})]})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Container)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"Token Reference"}),ce(B,{spacing:0,children:[ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ao,{children:"Bar:"}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:'Always: data-surface="Surface-Dim" · bg: var(--Background). Theme set by data-theme (Nav-Bar, Primary, Primary-Light, etc.).'})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ao,{children:"Unselected icon/label:"}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:"var(--Text-Quiet)"})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ao,{children:"Selected (no backfill):"}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:"var(--Text)"})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ao,{children:"Selected backfill pill:"}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:"bg: var(--Buttons-Primary-Button) · border: 1px solid var(--Buttons-Primary-Border) · icon/text: var(--Buttons-Primary-Text)"})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ao,{children:"Backfill + horizontal label:"}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:"Label inside pill: var(--Buttons-Primary-Text)"})]}),ce(h,{sx:{py:1.5},children:[de(ao,{children:"Backfill + vertical label:"}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:"Label below pill: var(--Text)"})]})]})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Container)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"Best Practices"}),ce(B,{spacing:0,children:[ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ao,{children:"Item count:"}),de(bo,{style:{color:"var(--Text-Quiet)"},children:"3–5 recommended. 6 maximum."})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ao,{children:"Horizontal layout:"}),de(bo,{style:{color:"var(--Text-Quiet)"},children:"Only available with 4 or fewer items."})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ao,{children:"Labels:"}),de(bo,{style:{color:"var(--Text-Quiet)"},children:"Always recommended for clarity."})]}),ce(h,{sx:{py:1.5},children:[de(ao,{children:"Fixed:"}),de(bo,{style:{color:"var(--Text-Quiet)"},children:"Add bottom padding to main content to avoid overlap."})]})]})]})]})]})]})}const rc={default:"Default",primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info",success:"Success",warning:"Warning",error:"Error"},oc={small:{indicator:24,fontSize:"11px",labelFontSize:"13px",connectorThickness:2,gap:0},medium:{indicator:32,fontSize:"13px",labelFontSize:"14px",connectorThickness:2,gap:0},large:{indicator:40,fontSize:"16px",labelFontSize:"16px",connectorThickness:2,gap:0}},nc=s({orientation:"horizontal",size:"medium",color:"primary",activeStep:0,clickable:!1,onStepClick:null,dashedIncomplete:!1,totalSteps:0}),ic=()=>l(nc);function ac({children:e,orientation:r="horizontal",size:o="medium",color:n="primary",activeStep:i=0,clickable:a=!1,onStepClick:l,dashedIncomplete:s=!1,className:d="",sx:c={},...u}){const p=t.Children.toArray(e).filter(t.isValidElement),m=p.length,f="horizontal"===r;return de(nc.Provider,{value:{orientation:r,size:o,color:n,activeStep:i,clickable:a,onStepClick:l,dashedIncomplete:s,totalSteps:m},children:de(h,{component:"ol",role:"list","aria-label":"Progress",className:"stepper stepper-"+r+" stepper-"+o+" stepper-"+n+" "+d,sx:{display:"flex",flexDirection:f?"row":"column",alignItems:f?"flex-start":"stretch",listStyle:"none",margin:0,padding:0,width:"100%",gap:0,...c},...u,children:p.map((e,r)=>t.cloneElement(e,{_index:r,key:e.key||r}))})})}function lc({children:e,icon:t,label:r,_index:o=0,className:n="",sx:i={},...a}){const{orientation:l,size:s,color:d,activeStep:c,clickable:u,onStepClick:p,dashedIncomplete:m,totalSteps:f}=ic(),g=oc[s]||oc.medium,x=rc[d]||"Primary",b="horizontal"===l,v=o===c,y=o<c,S=o>c,k=o===f-1,B=t||o+1,w=r||e,C="var(--Buttons-"+x+"-Border)",T=v||y?"var(--Buttons-"+x+"-Button)":"transparent",I=v||y?"var(--Buttons-"+x+"-Text)":"var(--Text)",A=v||y?"var(--Buttons-"+x+"-Hover)":"var(--Hover)",z=v||y?"var(--Buttons-"+x+"-Pressed)":"var(--Pressed)",R=de(h,{component:u?"button":"div",onClick:u?()=>p?.(o):void 0,onKeyDown:u?e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),p?.(o))}:void 0,tabIndex:u?0:void 0,role:u?"button":void 0,"aria-label":u?"Go to step "+(o+1):void 0,"aria-current":v?"step":void 0,className:"step-indicator step-indicator-"+s+(v?" step-indicator-active":"")+(y?" step-indicator-completed":"")+(S?" step-indicator-incomplete":"")+(u?" step-indicator-clickable":""),sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",width:g.indicator+"px",height:g.indicator+"px",minWidth:g.indicator+"px",minHeight:g.indicator+"px",borderRadius:"50%",border:(v?"2px":"1px")+" solid "+C,backgroundColor:T,color:I,fontSize:g.fontSize,fontFamily:"inherit",fontWeight:700,lineHeight:1,flexShrink:0,position:"relative",transition:"background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease",cursor:u?"pointer":"default",outline:"none",padding:0,..."small"===s&&{"&::after":{content:'""',position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)",width:"24px",height:"24px",borderRadius:"50%"}},...u&&{"&:hover":{backgroundColor:A},"&:active":{backgroundColor:z},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"2px"}}},children:B}),E=k?null:de(h,{className:"step-connector"+(y?" step-connector-completed":"")+(S?" step-connector-incomplete":"")+(m&&S?" step-connector-dashed":""),"aria-hidden":"true",sx:{flex:1,...b?{height:g.connectorThickness+"px",minWidth:"20px",alignSelf:"flex-start",marginTop:g.indicator/2-g.connectorThickness/2+"px",marginLeft:"8px",marginRight:"8px"}:{width:g.connectorThickness+"px",minHeight:"24px",marginLeft:g.indicator/2-g.connectorThickness/2+"px",marginTop:"4px",marginBottom:"4px"},backgroundColor:y?"var(--Buttons-"+x+"-Button)":"var(--Border)",...m&&S&&{backgroundColor:"transparent",backgroundImage:b?"repeating-linear-gradient(90deg, var(--Border) 0px, var(--Border) 6px, transparent 6px, transparent 12px)":"repeating-linear-gradient(180deg, var(--Border) 0px, var(--Border) 6px, transparent 6px, transparent 12px)",backgroundSize:b?"12px 100%":"100% 12px"},transition:"background-color 0.15s ease"}}),P=w?de("small"===s?bo:ao,{style:{fontWeight:v?600:400,color:v||y?"var(--Text)":"var(--Quiet)",textAlign:b?"center":"left",whiteSpace:"nowrap",lineHeight:1.3},children:w}):null;return ce(h,b?{component:"li",className:"step step-"+s+" step-horizontal"+(v?" step-active":"")+(y?" step-completed":"")+(S?" step-incomplete":"")+" "+n,sx:{display:"flex",alignItems:"center",flex:k?"none":1,...i},...a,children:[ce(h,{sx:{display:"flex",flexDirection:"column",alignItems:"center",flexShrink:0},children:[R,P&&de(h,{sx:{mt:"4px"},children:P})]}),E]}:{component:"li",className:"step step-"+s+" step-vertical"+(v?" step-active":"")+(y?" step-completed":"")+(S?" step-incomplete":"")+" "+n,sx:{display:"flex",flexDirection:"column",alignItems:"flex-start",...i},...a,children:[ce(h,{sx:{display:"flex",alignItems:"center",gap:"8px"},children:[R,P]}),E]})}const sc=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",dc=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}],cc=["Account","Details","Review","Confirm","Complete","Done"];function uc({label:e,selected:t,onClick:r}){return de(An,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function pc({color:e,selected:t,onClick:r}){const o=sc(e);return de(h,{component:"button",onClick:()=>r(e),"aria-label":"Select "+o,"aria-pressed":t,title:o,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+o+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Buttons-"+o+"-Text)",pointerEvents:"none"}})})}function hc(){const[e,t]=r("default"),[o,n]=r("medium"),[i,a]=r("horizontal"),[l,s]=r(4),[d,c]=r(1),[u,p]=r(!1),[m,f]=r(!1),[g,x]=r(null),[b,v]=r("Surface");return ce(h,{sx:{pb:8},children:[de(Jr,{children:"Stepper"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ci,{theme:g,surface:b,children:de(h,{sx:{width:"100%",maxWidth:"vertical"===i?300:"100%"},children:de(ac,{color:e,size:o,orientation:i,activeStep:d,clickable:u,onStepClick:u?c:void 0,dashedIncomplete:m,children:cc.slice(0,l).map(e=>de(lc,{label:e},e))})})}),de(Qi,{code:(()=>{const t=[];return"default"!==e&&t.push('color="'+e+'"'),"medium"!==o&&t.push('size="'+o+'"'),"horizontal"!==i&&t.push('orientation="vertical"'),t.push("activeStep={"+d+"}"),u&&t.push("clickable onStepClick={setActiveStep}"),m&&t.push("dashedIncomplete"),"<Stepper "+t.join(" ")+">\n"+cc.slice(0,l).map(e=>' <Step label="'+e+'" />').join("\n")+"\n</Stepper>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(ai,{defaultValue:0,variant:"standard",color:"primary",children:[ce(li,{children:[de(si,{children:"Playground"}),de(si,{children:"Accessibility"})]}),de(di,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(mi,{theme:g,onThemeChange:x,surface:b,onSurfaceChange:v})}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"STEPS"}),de(B,{direction:"row",spacing:1,children:[2,3,4,5,6].map(e=>de(uc,{label:String(e),selected:l===e,onClick:()=>{s(e),d>=e&&c(e-1)}},e))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"ACTIVE STEP"}),de(B,{direction:"row",spacing:1,children:cc.slice(0,l).map((e,t)=>de(uc,{label:String(t+1),selected:d===t,onClick:()=>c(t)},t))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:dc.map(r=>ce(h,{children:[de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:r.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:r.colors.map(r=>de(pc,{color:r,selected:e===r,onClick:t},r))})]},r.label))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",spacing:1,children:["small","medium","large"].map(e=>de(uc,{label:sc(e),selected:o===e,onClick:()=>n(e)},e))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"ORIENTATION"}),de(B,{direction:"row",spacing:1,children:["horizontal","vertical"].map(e=>de(uc,{label:sc(e),selected:i===e,onClick:()=>a(e)},e))})]}),ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Clickable"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Steps are interactive buttons"})]}),de(ra,{variant:"default-outline",checked:u,onChange:e=>p(e.target.checked),size:"small","aria-label":"Clickable"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Dashed Incomplete"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Dashed connector for future steps"})]}),de(ra,{variant:"default-outline",checked:m,onChange:e=>f(e.target.checked),size:"small","aria-label":"Dashed incomplete"})]})]})}),de(di,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Container",value:'<ol role="list" aria-label="Progress">'},{label:"Steps",value:"<li> elements with step state classes"},{label:"Active",value:'aria-current="step" on the active indicator'},{label:"Clickable",value:'role="button" aria-label="Go to step N" with tabIndex'},{label:"Focus",value:"outline: 3px solid var(--Focus-Visible); outline-offset: 2px"},{label:"Connectors",value:'aria-hidden="true" — decorative only'}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ao,{children:[e,":"]}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}function mc({actions:e=[],variant:t="solid",color:a="default",direction:l="up",speed:s=50,showTooltips:d=!0,open:c,onOpen:u,onClose:p,icon:m,ariaLabel:f="Speed Dial",className:g="",sx:x={},...b}){const[v,y]=r(!1),S=void 0!==c,k=S?c:v,B=o(null),C=t,T=n(()=>{k?(S||y(!1),p?.()):(S||y(!0),u?.())},[k,S,u,p]),I=n((e,t)=>{e.onClick?.(t),S||y(!1),p?.()},[S,p]);i(()=>{if(!k)return;const e=e=>{B.current&&!B.current.contains(e.target)&&(S||y(!1),p?.())};return document.addEventListener("mousedown",e),()=>document.removeEventListener("mousedown",e)},[k,S,p]),i(()=>{if(!k)return;const e=e=>{"Escape"===e.key&&(S||y(!1),p?.())};return document.addEventListener("keydown",e),()=>document.removeEventListener("keydown",e)},[k,S,p]);const A="up"===l||"down"===l,z="up"===l||"down"===l?"left":"top";return ce(h,{ref:B,className:"speed-dial speed-dial-"+t+" speed-dial-"+a+" speed-dial-"+l+" "+g,sx:{position:"relative",display:"inline-flex",overflow:"visible",width:A?"56px":"auto",height:A?"auto":"56px",...x},...b,children:[de(Ua,{size:"large",variant:C,color:a,onClick:T,"aria-label":f,"aria-expanded":k,"aria-haspopup":"menu",sx:{position:"relative",zIndex:2},children:de(h,{sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",transition:"transform 0.3s ease",transform:k?"rotate(45deg)":"rotate(0deg)"},children:m||de(At,{})})}),de(h,{role:"menu",sx:{position:"absolute",inset:0,pointerEvents:"none",overflow:"visible"},children:e.map((e,t)=>{const r=(e=>{const t=56+44*e;switch(l){case"up":default:return{bottom:t+"px",left:"12px"};case"down":return{top:t+"px",left:"12px"};case"left":return{right:t+"px",top:"12px"};case"right":return{left:t+"px",top:"12px"}}})(t),o=t*s,n=de(Ua,{size:"small",variant:C,color:a,role:"menuitem","aria-label":e.name||"Action "+(t+1),onClick:()=>I(e,t),sx:{position:"absolute",...r,opacity:k?1:0,transform:k?"scale(1)":"scale(0.3)",transition:"opacity 0.2s ease, transform 0.2s ease",transitionDelay:k?o+"ms":"0ms",pointerEvents:k?"auto":"none"},children:e.icon||de(At,{})},e.key||t);return d&&e.name?de(w,{title:e.name,placement:z,arrow:!0,open:!!k&&void 0,slotProps:{tooltip:{sx:{backgroundColor:"var(--Container)",color:"var(--Text)",fontSize:"12px",fontWeight:500,border:"1px solid var(--Border)",boxShadow:"0 2px 8px rgba(0,0,0,0.12)"}},arrow:{sx:{color:"var(--Container)"}}},children:n},e.key||t):n})})]})}const fc=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",gc=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}],xc=[{name:"Edit",icon:de(jo,{size:"small",sx:{color:"inherit"},children:de(er,{})})},{name:"Share",icon:de(jo,{size:"small",sx:{color:"inherit"},children:de(tr,{})})},{name:"Delete",icon:de(jo,{size:"small",sx:{color:"inherit"},children:de(we,{})})},{name:"Favorite",icon:de(jo,{size:"small",sx:{color:"inherit"},children:de(ke,{})})}];function bc({label:e,selected:t,onClick:r}){return de(An,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function vc({color:e,selected:t,onClick:r}){const o=fc(e);return de(h,{component:"button",onClick:()=>r(e),"aria-label":"Select "+o,"aria-pressed":t,title:o,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+o+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Buttons-"+o+"-Text)",pointerEvents:"none"}})})}function yc(){const[e,t]=r("solid"),[o,n]=r("default"),[i,a]=r("up"),[l,s]=r(!0),[d,c]=r(null),[u,p]=r("Surface");return ce(h,{sx:{pb:8},children:[de(Jr,{children:"Speed Dial"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ci,{theme:d,surface:u,sx:{minHeight:300,alignItems:"flex-end",justifyContent:"center"},children:de(mc,{variant:e,color:o,direction:i,showTooltips:l,actions:xc,ariaLabel:"Quick actions"})}),de(Qi,{code:(()=>{const t=[];return"solid"!==e&&t.push('variant="'+e+'"'),"default"!==o&&t.push('color="'+o+'"'),"up"!==i&&t.push('direction="'+i+'"'),l||t.push("showTooltips={false}"),t.push("actions={actions}"),t.push('ariaLabel="Quick actions"'),"<SpeedDial\n "+t.join("\n ")+"\n/>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(ai,{defaultValue:0,variant:"standard",color:"primary",children:[ce(li,{children:[de(si,{children:"Playground"}),de(si,{children:"Accessibility"})]}),de(di,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(mi,{theme:d,onThemeChange:c,surface:u,onSurfaceChange:p})}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"STYLE"}),de(B,{direction:"row",spacing:1,children:["solid","outline"].map(r=>de(bc,{label:fc(r),selected:e===r,onClick:()=>t(r)},r))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:gc.map(e=>ce(h,{children:[de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:e.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:e.colors.map(e=>de(vc,{color:e,selected:o===e,onClick:n},e))})]},e.label))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"DIRECTION"}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:["up","down","left","right"].map(e=>de(bc,{label:fc(e),selected:i===e,onClick:()=>a(e)},e))})]}),ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Tooltips"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Show labels beside actions"})]}),de(ra,{variant:"default-outline",checked:l,onChange:e=>s(e.target.checked),size:"small","aria-label":"Show tooltips"})]})]})}),de(di,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"FAB",value:'aria-expanded, aria-haspopup="menu", aria-label'},{label:"Actions",value:'role="menu" container, role="menuitem" on each action'},{label:"Labels",value:"aria-label on each action from name prop"},{label:"Keyboard",value:"Escape closes. Click outside closes."},{label:"Focus",value:"outline: 3px solid var(--Focus-Visible); outline-offset: 2px"}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ao,{children:[e,":"]}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}const Sc={primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",black:"BW",white:"BW"};function kc(e,t){return"var(--"+(Sc[e]||"Primary")+"-Color-"+t+")"}const Bc={primary:{linear:[{family:"primary",tone:8,position:0},{family:"primary",tone:11,position:100}],radial:[{family:"primary",tone:8,position:0},{family:"primary",tone:11,position:100}],mesh:[{family:"primary",tone:8,x:20,y:20,spread:60},{family:"primary",tone:9,x:80,y:30,spread:50},{family:"primary",tone:10,x:50,y:80,spread:55}],meshCard:[{family:"primary",tone:3,x:10,y:10,spread:60},{family:"primary",tone:6,x:80,y:20,spread:50},{family:"primary",tone:9,x:40,y:80,spread:55}]},secondary:{linear:[{family:"secondary",tone:7,position:0},{family:"secondary",tone:10,position:100}],radial:[{family:"secondary",tone:7,position:0},{family:"secondary",tone:10,position:100}],mesh:[{family:"secondary",tone:7,x:15,y:25,spread:55},{family:"secondary",tone:9,x:75,y:35,spread:50},{family:"secondary",tone:11,x:45,y:75,spread:60}],meshCard:[{family:"secondary",tone:2,x:15,y:15,spread:55},{family:"secondary",tone:5,x:85,y:25,spread:50},{family:"secondary",tone:8,x:50,y:75,spread:60}]},tertiary:{linear:[{family:"tertiary",tone:8,position:0},{family:"tertiary",tone:11,position:100}],radial:[{family:"tertiary",tone:8,position:0},{family:"tertiary",tone:11,position:100}],mesh:[{family:"tertiary",tone:8,x:25,y:15,spread:55},{family:"tertiary",tone:10,x:70,y:40,spread:50},{family:"tertiary",tone:11,x:40,y:85,spread:55}],meshCard:[{family:"tertiary",tone:3,x:20,y:10,spread:60},{family:"tertiary",tone:7,x:75,y:30,spread:50},{family:"tertiary",tone:10,x:45,y:80,spread:55}]},black:{linear:[{family:"black",tone:10,position:0},{family:"neutral",tone:3,position:100}],radial:[{family:"black",tone:10,position:0},{family:"neutral",tone:3,position:100}],mesh:[{family:"black",tone:10,x:0,y:0,spread:100},{family:"primary",tone:3,x:25,y:25,spread:50},{family:"secondary",tone:4,x:75,y:35,spread:45},{family:"tertiary",tone:3,x:50,y:80,spread:50}],meshCard:[{family:"black",tone:11,x:0,y:0,spread:100},{family:"primary",tone:5,x:20,y:20,spread:55},{family:"secondary",tone:8,x:80,y:30,spread:45},{family:"tertiary",tone:10,x:45,y:80,spread:50}]},white:{linear:[{family:"white",tone:2,position:0},{family:"neutral",tone:9,position:100}],radial:[{family:"white",tone:2,position:0},{family:"neutral",tone:9,position:100}],mesh:[{family:"white",tone:2,x:0,y:0,spread:100},{family:"primary",tone:9,x:25,y:25,spread:50},{family:"secondary",tone:8,x:75,y:35,spread:45},{family:"tertiary",tone:9,x:50,y:80,spread:50}],meshCard:[{family:"white",tone:1,x:0,y:0,spread:100},{family:"primary",tone:4,x:20,y:20,spread:55},{family:"secondary",tone:7,x:80,y:30,spread:45},{family:"tertiary",tone:10,x:45,y:80,spread:50}]}};function wc(e,t){const r=Bc[e]||Bc.primary;return(r[t]||r.linear).map(e=>({...e}))}function Cc({variant:e="linear",color:t="primary",angle:r=135,stops:o=null,position:n=null,blobs:i=null,cardProps:a={},minHeight:l=300,children:s,className:d="",sx:c={},...u}){const p="meshCard"===e,m="mesh"===e||p,f="radial"===e,g="linear"===e||f,x=o||wc(t,f?"radial":"linear"),b=i||wc(t,p?"meshCard":"mesh"),v=m?function(e){if(!e||0===e.length)return"none";const t=e.map(e=>{const t=kc(e.family,e.tone),r=e.spread||40;return"radial-gradient(circle at "+e.x+"% "+e.y+"%, "+t+" 0%, transparent "+r+"%)"}),r=kc(e[0].family,e[0].tone);return t.push(r),t.join(", ")}(b):f?function(e,t){if(!e||0===e.length)return"none";const r=[...e].sort((e,t)=>e.position-t.position).map(e=>kc(e.family,e.tone)+" "+e.position+"%"),o=t||{x:50,y:50};return"radial-gradient(circle at "+o.x+"% "+o.y+"%, "+r.join(", ")+")"}(x,n||{x:50,y:50}):function(e,t){return e&&0!==e.length?"linear-gradient("+t+"deg, "+[...e].sort((e,t)=>e.position-t.position).map(e=>kc(e.family,e.tone)+" "+e.position+"%").join(", ")+")":"none"}(x,r),y=g?x[0]:b[0];var S,k;const B=function(e){return"dark"===e?"var(--BW-Color-1)":"var(--BW-Color-6)"}((S=y?.tone||8,"black"===(k=y?.family||"primary")||"white"===k?S<=5?"light":"dark":S<=5?"dark":"light"));return de(h,p?{className:"gradient gradient-mesh-card "+d,sx:{background:v,minHeight:l,borderRadius:"var(--Card-Radius)",display:"flex",alignItems:"center",justifyContent:"center",padding:"var(--Card-Padding)",position:"relative",overflow:"hidden",...c},...u,children:de(Wa,{variant:"solid",...a,children:de(Da,{children:s})})}:{className:"gradient gradient-"+e+" "+d,sx:{background:v,minHeight:l,borderRadius:"var(--Card-Radius)",color:B,display:"flex",alignItems:"center",justifyContent:"center",position:"relative",overflow:"hidden",...c},...u,children:s})}const Tc=e=>de(Cc,{variant:"linear",...e}),Ic=e=>de(Cc,{variant:"radial",...e}),Ac=e=>de(Cc,{variant:"mesh",...e}),zc=e=>de(Cc,{variant:"meshCard",...e});function Rc({children:e,surface:t="Container",outlined:r=!1,variant:o=(r?"outlined":"elevation"),sx:n={},...i}){const{dataSurface:a,elevation:l}=function(e="Container"){const t={"Container-Lowest":{elevation:0,zIndex:0},"Container-Low":{elevation:1,zIndex:100},Container:{elevation:4,zIndex:200},"Container-High":{elevation:8,zIndex:300},"Container-Highest":{elevation:12,zIndex:400}},r=t[e]||t.Container;return{dataSurface:e,elevation:r.elevation,zIndex:r.zIndex}}(t);return de(V,{variant:o,elevation:r?0:l,"data-surface":a,sx:{padding:2,borderRadius:"8px",transition:"all 0.2s ease-in-out",...n},...i,children:e})}function Ec({open:e=!1,onClose:t,anchorRef:n,placement:a="bottom-end",theme:l="Default",surface:s="Surface-Bright",width:d=320,maxHeight:c=400,children:u,sx:p={}}){const m=o(null),[f,g]=r({top:0,left:0,right:"auto"});return i(()=>{if(!e||!n?.current)return;const t=n.current.getBoundingClientRect();g("bottom-end"===a?{top:t.bottom+6,right:window.innerWidth-t.right,left:"auto"}:{top:t.bottom+6,left:t.left,right:"auto"})},[e,n,a]),i(()=>{if(!e)return;const r=e=>{m.current?.contains(e.target)||n?.current?.contains(e.target)||t?.()};return document.addEventListener("pointerdown",r),()=>document.removeEventListener("pointerdown",r)},[e,t,n]),i(()=>{if(!e)return;const r=e=>{"Escape"===e.key&&t?.()};return document.addEventListener("keydown",r),()=>document.removeEventListener("keydown",r)},[e,t]),e?ye.createPortal(de(h,{ref:m,"data-theme":l,"data-surface":s,sx:{position:"fixed",top:f.top,left:f.left,right:f.right,zIndex:2e9,width:d,maxHeight:c,overflowY:"auto",backgroundColor:"var(--Background)",border:"1px solid var(--Border)",borderRadius:"var(--Style-Border-Radius)",boxShadow:sn,...p},children:u}),document.body):null}["default","primary","secondary","tertiary","neutral"].map(e=>{return{value:e,label:(t=e,t?t.charAt(0).toUpperCase()+t.slice(1):"")};var t});const Pc=s(null),Oc=["Default","Primary-Light","Primary","Secondary-Light","Secondary","Tertiary-Light","Tertiary","Neutral-Light","Neutral","Error-Light","Success-Light","Warning-Light","Info-Light","Primary-Dark","Secondary-Dark","Tertiary-Dark","Neutral-Dark","Error-Dark","Success-Dark","Warning-Dark","Info-Dark","App-Bar","Nav-Bar","Status"],Lc=["Professional","Modern","Bold","Playful"],Mc=["Surface-Dimmest","Surface-Dim","Surface","Surface-Bright","Surface-Brightest","Container","Container-Low","Container-Lowest","Container-High","Container-Highest"],Wc={"light-tonal":{theme:"Primary",rootSurface:"Surface-Brightest"},"grey-professional":{theme:"Neutral",rootSurface:"Surface"},"dark-professional":{theme:"Neutral-Dark",rootSurface:"Surface"}},Dc="omni-foundation",Fc="omni-core",Nc="omni-typography",Hc="omni-mode",Vc="omni-base",Qc="omni-styles";function jc(e){document.getElementById(e)?.remove()}function Gc(e,t,r){return t?function(e){return!(!e||"string"!=typeof e)&&(e.startsWith("http")||e.startsWith("/")||e.endsWith(".css"))}(t)?function(e,t,r){const o=document.getElementById(e);return o?"LINK"===o.tagName&&o.getAttribute("href")!==t?new Promise((e,r)=>{o.onload=()=>e(o),o.onerror=()=>r(new Error(`OmniDesignProvider: failed to load ${t}`)),o.setAttribute("href",t)}):Promise.resolve(o):new Promise((o,n)=>{const i=document.createElement("link");i.id=e,i.rel="stylesheet",i.setAttribute("data-omni","true"),i.onload=()=>o(i),i.onerror=()=>n(new Error(`OmniDesignProvider: failed to load ${t}`)),i.href=t;const a=r?document.getElementById(r):null;a?document.head.insertBefore(i,a):document.head.appendChild(i)})}(e,t,r):function(e,t,r){if(!t)return Promise.resolve(null);const o=document.getElementById(e);if(o)return o.textContent=t,Promise.resolve(o);const n=document.createElement("style");n.id=e,n.setAttribute("data-omni","true"),n.textContent=t;const i=r?document.getElementById(r):null;return i?document.head.insertBefore(n,i):document.head.appendChild(n),Promise.resolve(n)}(e,t,r):Promise.resolve(null)}function Uc({themeURL:e,foundationCSS:t,coreCSS:a,typographyCSS:l,lightModeCSS:s,darkModeCSS:c,baseCSS:u,stylesCSS:p,defaultTheme:h="Default",defaultStyle:m="Modern",defaultSurface:f="Surface",surfaceStyle:g,defaultDarkMode:x=!1,darkTheme:b="Neutral-Dark",darkMode:v,onDarkModeChange:y,className:S,style:k,fullHeight:B=!0,children:w}){const[C,T]=r(x),I=void 0!==v,A=I?v:C,[z,R]=r({foundation:t??null,core:a??null,typography:l??null,lightMode:s??null,darkMode:c??null,base:u??null,styles:p??null}),[E,P]=r({}),O=o(!0);i(()=>(O.current=!0,()=>{O.current=!1}),[]),i(()=>{e&&(X("loading"),async function(e){const t=/\.json(\?|$)/.test(e)?e:`${e.replace(/\/$/,"")}/theme.json`,r=e.replace(/\/$/,"").replace(/\/theme\.json(\?.*)?$/,""),o=await fetch(t);if(!o.ok)throw new Error(`OmniDesignProvider: could not load theme manifest from ${t} (${o.status})`);const n=await o.json(),i=e=>e?/^https?:\/\//i.test(e)?e:`${r}/${e}`:null;return{foundationURL:i(n.foundation),coreURL:i(n.core),typographyURL:i(n.typography),lightModeURL:i(n.lightMode),darkModeURL:i(n.darkMode),baseURL:i(n.base),stylesURL:i(n.styles),defaultTheme:n.defaultTheme??null,defaultStyle:n.defaultStyle??null,defaultSurface:n.defaultSurface??null,darkTheme:n.darkTheme??null,name:n.name??null}}(e).then(e=>{O.current&&(R({foundation:t??e.foundationURL,core:a??e.coreURL,typography:l??e.typographyURL,lightMode:s??e.lightModeURL,darkMode:c??e.darkModeURL,base:u??e.baseURL,styles:p??e.stylesURL}),P({defaultTheme:e.defaultTheme,defaultStyle:e.defaultStyle,defaultSurface:e.defaultSurface,darkTheme:e.darkTheme,name:e.name}))}).catch(e=>{O.current&&(console.error("OmniDesignProvider: manifest error:",e),q(e.message),X("error"))}))},[e]);const L=g?Wc[g]?.theme??h:"Default"!==h?h:E.defaultTheme??h,M=g?Wc[g]?.rootSurface??f:E.defaultSurface??f,W=E.defaultStyle??m,D="Neutral-Dark"!==b?b:E.darkTheme??b,[F,N]=r(L),[H,V]=r(W),[Q,j]=r(M),G=!!(e||t||a||l||s||c||u||p),[U,X]=r(G?"loading":"ready"),[K,q]=r(null);i(()=>{const{foundation:e,core:t,typography:r,base:o,styles:n}=z;if(e||t||r||o||n)return X("loading"),q(null),Promise.all([Gc(Dc,e),Gc(Fc,t),Gc(Nc,r).catch(e=>{console.warn("OmniDesignProvider: typography CSS did not load —",e.message)}),Gc(Vc,o),Gc(Qc,n)]).then(()=>{O.current&&X("ready")}).catch(e=>{O.current&&(console.error("OmniDesignProvider CSS error:",e),q(e.message),X("error"))}),()=>{jc(Dc),jc(Fc),jc(Nc),jc(Vc),jc(Qc)};X("ready")},[z.foundation,z.core,z.typography,z.base,z.styles]),i(()=>{const e=A?z.darkMode:z.lightMode;e&&Gc(Hc,e,Vc).catch(e=>console.error("OmniDesignProvider mode CSS error:",e))},[A,z.lightMode,z.darkMode]),i(()=>()=>jc(Hc),[]);const J=A?D:F,Y=n(()=>{I?y?.(!A):T(e=>!e)},[I,A,y]),Z=n(e=>{Oc.includes(e)||console.warn(`OmniDesignProvider: unknown theme "${e}"`),N(e)},[]),$=n(e=>{Lc.includes(e)||console.warn(`OmniDesignProvider: unknown style "${e}"`),V(e)},[]),_=n(e=>{Mc.includes(e)||console.warn(`OmniDesignProvider: unknown surface "${e}"`),j(e)},[]),ee=d(()=>({theme:J,style:H,surface:Q,isDark:A,cssStatus:U,cssError:K,setTheme:Z,setStyle:$,setSurface:_,toggleDarkMode:Y,themes:Oc,styles:Lc,surfaces:Mc,name:E.name??null}),[J,H,Q,A,U,K,Z,$,_,Y,E.name]);return ce(Pc.Provider,{value:ee,children:[de("style",{"data-omni":"hide-during-load",children:'[data-omni-css="loading"]{visibility:hidden}'}),de("div",{"data-theme":J,"data-style":H,"data-surface":Q,"data-omni-css":U,className:S,style:{...B?{minHeight:"100vh"}:{},...k},children:w})]})}function Xc(){const e=l(Pc);if(!e)throw new Error("useOmniDesign must be used inside a <OmniDesignProvider>");return e}function Kc({theme:e,surface:t,as:r="div",children:o,className:n,style:i,...a}){return de(r,{"data-theme":e,"data-surface":t,className:n,style:i,...a,children:o})}function qc({surface:e,as:t="div",children:r,className:o,style:n,...i}){return de(t,{"data-surface":e,className:o,style:n,...i,children:r})}const Jc=e=>c(function(t,r){return de(Y,{direction:e,ref:r,...t})}),Yc={fade:c(function(e,t){return de(J,{ref:t,...e})}),grow:c(function(e,t){return de(q,{ref:t,...e})}),zoom:c(function(e,t){return de(K,{ref:t,...e})}),"slide-up":Jc("up"),"slide-down":Jc("down"),"slide-left":Jc("left"),"slide-right":Jc("right")},Zc={backgroundColor:"var(--Background)",color:"var(--Text)",border:"1px solid var(--Border)",borderRadius:"var(--Style-Border-Radius)",boxShadow:"0 8px 32px rgba(0,0,0,0.18)"},$c={color:"var(--Text)",fontWeight:600,fontSize:"18px",fontFamily:"inherit",borderBottom:"1px solid var(--Border)",display:"flex",justifyContent:"space-between",alignItems:"center",py:1.5,px:3},_c={color:"var(--Text)",fontFamily:"inherit",fontSize:"14px",lineHeight:1.6,py:3,px:3},eu={borderTop:"1px solid var(--Border)",px:3,py:1.5,gap:1},tu={fontFamily:"inherit",fontWeight:500,fontSize:"14px",borderRadius:"var(--Style-Border-Radius)",padding:"6px 16px",cursor:"pointer",border:"none",transition:"background-color 0.15s, color 0.15s","&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"1px"}},ru={primary:{...tu,backgroundColor:"var(--Buttons-Primary-Button)",color:"var(--Buttons-Primary-Text)",border:"1px solid var(--Buttons-Primary-Border)","&:hover":{backgroundColor:"var(--Buttons-Primary-Hover)"}},outline:{...tu,backgroundColor:"transparent",color:"var(--Text)",border:"1px solid var(--Border)","&:hover":{backgroundColor:"var(--Hover)"}}};function ou({open:e=!1,onClose:t,title:r,children:o,actions:n,maxWidth:i="sm",fullScreen:a=!1,scroll:l="body",alert:s=!1,nonModal:d=!1,transition:c,transitionDuration:u=300,titleId:p="dialog-title",contentId:m="dialog-description",className:f="",sx:g={},PaperProps:x={},...b}){const v=c?Yc[c]:void 0;let y;try{y=Xc()}catch{y=null}const S=y?.theme||"Default",k=y?.style||"Modern",B=y?.surface||"Surface";return ce(Q,{open:e,onClose:(e,r)=>{s&&"backdropClick"===r||s&&"escapeKeyDown"===r||t?.(e,r)},maxWidth:!a&&i,fullScreen:a,fullWidth:!a,scroll:l,hideBackdrop:d,disableEnforceFocus:d,disableEscapeKeyDown:s,TransitionComponent:v,transitionDuration:u,"aria-labelledby":p,"aria-describedby":m,className:"dialog dialog-"+i+(a?" dialog-fullscreen":"")+(s?" dialog-alert":"")+(f?" "+f:""),style:{zIndex:1e7},slotProps:{backdrop:{sx:{backgroundColor:d?"transparent":"rgba(0,0,0,0.5)"}}},PaperProps:{...x,"data-theme":S,"data-style":k,"data-surface":B,sx:{...Zc,...a&&{borderRadius:0,border:"none"},...x.sx},role:s?"alertdialog":"dialog"},...b,children:[r&&ce(j,{id:p,sx:$c,children:[r,!s&&t&&de(C,{"aria-label":"Close dialog",onClick:e=>t(e,"closeButton"),size:"small",sx:{color:"var(--Text-Quiet)","&:hover":{backgroundColor:"var(--Hover)"}},children:de(Ot,{fontSize:"small"})})]}),de(G,{dividers:"paper"===l,sx:{..._c,..."paper"===l&&{maxHeight:a?"none":"400px",overflowY:"auto",borderColor:"var(--Border)"}},children:s?de(U,{id:m,sx:{color:"var(--Text)",fontFamily:"inherit",fontSize:"14px",lineHeight:1.6},children:o}):de(h,{id:m,children:o})}),n&&de(X,{sx:eu,children:n})]})}function nu({open:e,onClose:t,title:r,children:o,confirmText:n="Confirm",cancelText:i="Cancel",onConfirm:a,onCancel:l,...s}){return de(ou,{open:e,onClose:t,title:r,alert:!0,...s,actions:ce(ue,{children:[de(h,{component:"button",type:"button",onClick:l||t,sx:ru.outline,children:i}),de(h,{component:"button",type:"button",onClick:a||t,sx:ru.primary,children:n})]}),children:o})}function iu({open:e,onClose:t,title:r,children:o,submitText:n="Submit",cancelText:i="Cancel",onSubmit:a,...l}){return de(ou,{open:e,onClose:t,title:r,...l,actions:ce(ue,{children:[de(h,{component:"button",type:"button",onClick:t,sx:ru.outline,children:i}),de(h,{component:"button",type:"button",onClick:a,sx:ru.primary,children:n})]}),children:o})}function au({label:e,selected:t,onClick:r}){return de(An,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function lu(){const[e,t]=r(!1),[o,n]=r("sm"),[i,a]=r(!1),[l,s]=r("none"),[d,c]=r(!1),[u,p]=r(!1),[m,f]=r(null),[g,x]=r("Surface");return ce(h,{sx:{pb:8},children:[de(Jr,{children:"Dialog"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ci,{theme:m,surface:g,children:de(An,{variant:"default",onClick:()=>t(!0),children:"Open Dialog"})}),de(Qi,{code:(()=>{const e=["open={open}","onClose={handleClose}"];return"sm"!==o&&e.push('maxWidth="'+o+'"'),i&&e.push("fullScreen"),d&&e.push("alert"),u&&e.push("nonModal"),"none"!==l&&e.push('transition="'+l+'"'),e.push('title="Dialog Title"'),e.push('actions={<><Button variant="default-outline" onClick={handleClose}>Cancel</Button><Button variant="default" onClick={handleClose}>Confirm</Button></>}'),"<Dialog\n "+e.join("\n ")+"\n>\n Dialog content goes here.\n</Dialog>"})(),language:"JSX",wrap:!0,sx:{mt:2}}),de(ou,{open:e,onClose:(e,r)=>{d&&"backdropClick"===r||t(!1)},maxWidth:o,fullScreen:i,alert:d,nonModal:u,transition:"none"!==l?l:void 0,title:"Dialog Title",actions:ce(ue,{children:[de(An,{variant:"default-outline",size:"small",onClick:()=>t(!1),children:"Cancel"}),de(An,{variant:"default",size:"small",onClick:()=>t(!1),children:"Confirm"})]}),children:de(co,{children:"This is the dialog content. You can put any information here that requires user attention or action."})})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(ai,{defaultValue:0,variant:"standard",color:"primary",children:[ce(li,{children:[de(si,{children:"Playground"}),de(si,{children:"Accessibility"})]}),de(di,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(mi,{theme:m,onThemeChange:f,surface:g,onSurfaceChange:x})}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),ce(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:[["xs","sm","md","lg","xl"].map(e=>de(au,{label:e.toUpperCase(),selected:o===e,onClick:()=>{n(e),a(!1)}},e)),de(au,{label:"Full Screen",selected:i,onClick:()=>a(!i)})]})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"TRANSITION"}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:["none","slide-up","slide-down","grow","fade","zoom"].map(e=>{return de(au,{label:(t=e,t?t.charAt(0).toUpperCase()+t.slice(1):""),selected:l===e,onClick:()=>s(e)},e);var t})})]}),ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Alert"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"No backdrop dismiss, no Escape"})]}),de(ra,{variant:"default-outline",checked:d,onChange:e=>c(e.target.checked),size:"small","aria-label":"Alert mode"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Non-Modal"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"No backdrop, interact with content behind"})]}),de(ra,{variant:"default-outline",checked:u,onChange:e=>p(e.target.checked),size:"small","aria-label":"Non-modal"})]})]})}),de(di,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Role",value:'role="dialog" (standard) or role="alertdialog" (alert mode)'},{label:"Label",value:"aria-labelledby links to title, aria-describedby links to content"},{label:"Focus",value:"Focus trapped inside dialog. Returns to trigger on close."},{label:"Keyboard",value:"Escape closes (unless alert). Tab cycles through focusable elements."},{label:"Backdrop",value:"Click closes (unless alert or non-modal)"},{label:"Close",value:'Close button with aria-label="Close dialog"'}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ao,{children:[e,":"]}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}const su={primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info-Medium",success:"Success-Medium",warning:"Warning-Medium",error:"Error-Medium"},du={primary:"Primary-Light",secondary:"Secondary-Light",tertiary:"Tertiary-Light",neutral:"Neutral-Light",info:"Info-Light",success:"Success-Light",warning:"Warning-Light",error:"Error-Light"},cu={small:{maxWidth:400,padding:"24px"},medium:{maxWidth:560,padding:"32px"},large:{maxWidth:720,padding:"40px"}},uu={fade:{enter:{from:{opacity:0},to:{opacity:1}},name:"modal-fade"},"slide-up":{enter:{from:{opacity:0,transform:"translateY(40px)"},to:{opacity:1,transform:"translateY(0)"}},name:"modal-slide-up"},"slide-down":{enter:{from:{opacity:0,transform:"translateY(-40px)"},to:{opacity:1,transform:"translateY(0)"}},name:"modal-slide-down"},zoom:{enter:{from:{opacity:0,transform:"scale(0.85)"},to:{opacity:1,transform:"scale(1)"}},name:"modal-zoom"}};function pu(e){const t=uu[e];if(!t)return"";const{from:r,to:o}=t.enter,n=Object.entries(r).map(([e,t])=>e+":"+t).join(";"),i=Object.entries(o).map(([e,t])=>e+":"+t).join(";");return"@keyframes "+t.name+" { from {"+n+"} to {"+i+"} }@keyframes "+t.name+"-backdrop { from { opacity: 0 } to { opacity: 1 } }"}function hu({open:e,onClose:t,children:n,title:a,variant:l="default",color:s="primary",size:d="medium",layout:c="center",transition:u="fade",transitionSpeed:p=250,closeOnBackdrop:m=!0,showCloseButton:f=!0,className:g="",sx:x={},...b}){const v=o(null),y=o(null),[S,k]=r(!1);let B;try{B=Xc()}catch{B=null}const w=B?.theme||"Default",C=B?.style||"Modern",T="soft"===l,I="solid"===l,A="fullscreen"===c,z=I?su[s]:T?du[s]:null,R=cu[d]||cu.medium,E=uu[u],P=E?E.name:void 0,O=p+"ms";return i(()=>(e?(y.current=document.activeElement,k(!0),requestAnimationFrame(()=>{v.current?.focus()}),document.body.style.overflow="hidden"):(k(!1),document.body.style.overflow="",y.current?.focus()),()=>{document.body.style.overflow=""}),[e]),i(()=>{if(!e)return;const r=e=>{"Escape"===e.key&&t?.()};return document.addEventListener("keydown",r),()=>document.removeEventListener("keydown",r)},[e,t]),e||S?ce(ue,{children:["none"!==u&&de("style",{children:pu(u)}),de(h,{"aria-hidden":"true",onClick:m?t:void 0,sx:{position:"fixed",inset:0,zIndex:1e7,backgroundColor:"rgba(0,0,0,0.5)",...P&&{animation:P+"-backdrop "+O+" ease-out forwards"}}}),ce(h,{role:"dialog","aria-modal":"true","aria-label":a||"Modal",ref:v,tabIndex:-1,"data-surface":"Container-High","data-theme":z||w,"data-style":C,className:"modal modal-"+l+" modal-"+d+" modal-"+c+(T||I?" modal-"+s:"")+(g?" "+g:""),sx:{position:"fixed",zIndex:10000001,outline:"none",fontFamily:"inherit",...A?{inset:0,borderRadius:0}:{top:"50%",left:"50%",transform:"translate(-50%, -50%)",maxWidth:R.maxWidth+"px",width:"calc(100% - 32px)",maxHeight:"calc(100vh - 64px)",borderRadius:"var(--Modal-Radius, var(--Style-Border-Radius))"},backgroundColor:"var(--Background)",color:"var(--Text)",boxShadow:"0 8px 32px rgba(0,0,0,0.24)",display:"flex",flexDirection:"column",overflow:"hidden",...P&&{animation:P+" "+O+" ease-out forwards"},...x},...b,children:[(a||f)&&ce(h,{sx:{display:"flex",alignItems:"center",justifyContent:"space-between",px:A?4:R.padding,pt:A?3:R.padding,pb:0,flexShrink:0},children:[a&&de(h,{sx:{fontSize:"small"===d?"18px":"large"===d?"24px":"20px",fontWeight:700,color:"var(--Text)",flex:1},children:a}),f&&de(h,{component:"button",type:"button","aria-label":"Close modal",onClick:t,sx:{display:"flex",alignItems:"center",justifyContent:"center",width:32,height:32,borderRadius:"50%",border:"none",backgroundColor:"transparent",color:"var(--Text-Quiet)",cursor:"pointer",flexShrink:0,ml:1,transition:"background-color 0.15s ease, color 0.15s ease","&:hover":{backgroundColor:"var(--Hover)",color:"var(--Text)"},"&:focus-visible":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"}},children:de(Ot,{sx:{fontSize:20}})})]}),de(h,{sx:{flex:1,overflowY:"auto",px:A?4:R.padding,pt:A?3:"16px",pb:A?3:R.padding,color:"var(--Text)",fontSize:"small"===d?"13px":"14px",lineHeight:1.6},children:n})]})]}):null}const mu={small:{width:"240px",height:"200px"},medium:{width:"320px",height:"280px"},large:{width:"420px",height:"380px"}},fu={left:{borderRight:"1px solid var(--Border)"},right:{borderLeft:"1px solid var(--Border)"},top:{borderBottom:"1px solid var(--Border)"},bottom:{borderTop:"1px solid var(--Border)"}},gu={left:{top:0,left:0,bottom:0},right:{top:0,right:0,bottom:0},top:{top:0,left:0,right:0},bottom:{bottom:0,left:0,right:0}},xu={left:"translateX(-100%)",right:"translateX(100%)",top:"translateY(-100%)",bottom:"translateY(100%)"};function bu({children:e,open:t=!1,onClose:r,size:a="medium",anchor:l="left",hideBackdrop:s=!1,className:d="",sx:c={},...u}){const p=o(null),m=o(null),f="left"===l||"right"===l;let g;try{g=Xc()}catch{g=null}const x=g?.theme||"Default",b=g?.style||"Modern",v=mu[a]||mu.medium;i(()=>{if(!t)return;const e=e=>{"Escape"===e.key&&r?.()};return document.addEventListener("keydown",e),()=>document.removeEventListener("keydown",e)},[t,r]),i(()=>{t?(m.current=document.activeElement,requestAnimationFrame(()=>{const e=p.current?.querySelector('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');e?e.focus():p.current?.focus()})):m.current&&(m.current.focus(),m.current=null)},[t]),i(()=>{if(t){const e=document.body.style.overflow;return document.body.style.overflow="hidden",()=>{document.body.style.overflow=e}}},[t]);const y=n(e=>{if("Tab"!==e.key||!p.current)return;const t=p.current.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');if(!t.length)return;const r=t[0],o=t[t.length-1];e.shiftKey?document.activeElement===r&&(e.preventDefault(),o.focus()):document.activeElement===o&&(e.preventDefault(),r.focus())},[]);return t?ce(ue,{children:[!s&&de(h,{onClick:()=>r?.(),"aria-hidden":"true",sx:{position:"fixed",inset:0,zIndex:1e7,backgroundColor:"rgba(0, 0, 0, 0.5)",transition:"opacity 0.3s ease"}}),de(h,{ref:p,role:"dialog","aria-modal":"true",tabIndex:-1,"data-theme":x,"data-style":b,"data-surface":"Surface-Dim",onKeyDown:y,className:"drawer drawer-"+a+" drawer-"+l+" "+d,sx:{position:"fixed",zIndex:10000001,...gu[l],...f?{width:v.width,height:"100%"}:{height:v.height,width:"100%"},backgroundColor:"var(--Background)",color:"var(--Text)",...fu[l],boxShadow:ln,display:"flex",flexDirection:"column",outline:"none",overflow:"hidden",animation:"drawer-slide-in 0.3s ease forwards","@keyframes drawer-slide-in":{from:{transform:xu[l]},to:{transform:"translate(0, 0)"}},...c},...u,children:e})]}):null}function vu({onClick:e,className:t="",sx:r={},...o}){return de(h,{sx:{position:"absolute",top:"12px",right:"12px",zIndex:1,...r},className:t,...o,children:de(An,{iconOnly:!0,variant:"ghost",size:"small",onClick:e,"aria-label":"Close drawer",children:de(jo,{size:"small",children:de(Ot,{})})})})}function yu({children:e,className:t="",sx:r={},...o}){return de(h,{className:"drawer-header "+t,sx:{display:"flex",alignItems:"center",justifyContent:"space-between",padding:"16px",borderBottom:"1px solid var(--Border)",flexShrink:0,...r},...o,children:e})}function Su({children:e,className:t="",sx:r={},...o}){return de(h,{className:"drawer-content "+t,sx:{flex:1,overflowY:"auto",padding:"16px",...r},...o,children:e})}function ku(){return ku=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var o in r)({}).hasOwnProperty.call(r,o)&&(e[o]=r[o])}return e},ku.apply(null,arguments)}const Bu={};function wu(t,r){const o=e.useRef(Bu);return o.current===Bu&&(o.current=t(r)),o}function Cu(e,t,r,o){const n=wu(Tu).current;return function(e,t,r,o,n){return e.refs[0]!==t||e.refs[1]!==r||e.refs[2]!==o||e.refs[3]!==n}(n,e,t,r,o)&&function(e,t){if(e.refs=t,t.every(e=>null==e))return void(e.callback=null);e.callback=r=>{if(e.cleanup&&(e.cleanup(),e.cleanup=null),null!=r){const o=Array(t.length).fill(null);for(let e=0;e<t.length;e+=1){const n=t[e];if(null!=n)switch(typeof n){case"function":{const t=n(r);"function"==typeof t&&(o[e]=t);break}case"object":n.current=r}}e.cleanup=()=>{for(let e=0;e<t.length;e+=1){const r=t[e];if(null!=r)switch(typeof r){case"function":{const t=o[e];"function"==typeof t?t():r(null);break}case"object":r.current=null}}}}}}(n,[e,t,r,o]),n.callback}function Tu(){return{callback:null,cleanup:null,refs:[]}}function Iu(e,t,r=void 0){const o={};for(const n in e){const i=e[n];let a="",l=!0;for(let e=0;e<i.length;e+=1){const o=i[e];o&&(a+=(!0===l?"":" ")+t(o),l=!1,r&&r[o]&&(a+=" "+r[o]))}o[n]=a}return o}function Au(e){var t,r,o="";if("string"==typeof e||"number"==typeof e)o+=e;else if("object"==typeof e)if(Array.isArray(e)){var n=e.length;for(t=0;t<n;t++)e[t]&&(r=Au(e[t]))&&(o&&(o+=" "),o+=r)}else for(r in e)e[r]&&(o&&(o+=" "),o+=r);return o}function zu(){for(var e,t,r=0,o="",n=arguments.length;r<n;r++)(e=arguments[r])&&(t=Au(e))&&(o&&(o+=" "),o+=t);return o}function Ru(e,t=[]){if(void 0===e)return{};const r={};return Object.keys(e).filter(r=>r.match(/^on[A-Z]/)&&"function"==typeof e[r]&&!t.includes(r)).forEach(t=>{r[t]=e[t]}),r}function Eu(e){if(void 0===e)return{};const t={};return Object.keys(e).filter(t=>!(t.match(/^on[A-Z]/)&&"function"==typeof e[t])).forEach(r=>{t[r]=e[r]}),t}function Pu(e,t,r){return"function"==typeof e?e(t,r):e}function Ou(t){const{elementType:r,externalSlotProps:o,ownerState:n,skipResolvingSlotProps:i=!1,...a}=t,l=i?{}:Pu(o,n),{props:s,internalRef:d}=function(e){const{getSlotProps:t,additionalProps:r,externalSlotProps:o,externalForwardedProps:n,className:i}=e;if(!t){const e=zu(r?.className,i,n?.className,o?.className),t={...r?.style,...n?.style,...o?.style},a={...r,...n,...o};return e.length>0&&(a.className=e),Object.keys(t).length>0&&(a.style=t),{props:a,internalRef:void 0}}const a=Ru({...n,...o}),l=Eu(o),s=Eu(n),d=t(a),c=zu(d?.className,r?.className,i,n?.className,o?.className),u={...d?.style,...r?.style,...n?.style,...o?.style},p={...d,...r,...s,...l};return c.length>0&&(p.className=c),Object.keys(u).length>0&&(p.style=u),{props:p,internalRef:d.ref}}({...a,externalSlotProps:l}),c=function(e,t,r){return void 0===e||"string"==typeof e?t:{...t,ownerState:{...t.ownerState,...r}}}(r,{...s,ref:function(...t){const r=e.useRef(void 0),o=e.useCallback(e=>{const r=t.map(t=>{if(null==t)return null;if("function"==typeof t){const r=t,o=r(e);return"function"==typeof o?o:()=>{r(null)}}return t.current=e,()=>{t.current=null}});return()=>{r.forEach(e=>e?.())}},t);return e.useMemo(()=>t.every(e=>null==e)?null:e=>{r.current&&(r.current(),r.current=void 0),null!=e&&(r.current=o(e))},t)}(d,l?.ref,t.additionalProps?.ref)},n);return c}const Lu=new Set;function Mu(e,t="warning"){if("production"===process.env.NODE_ENV)return;const r=Array.isArray(e)?e.join("\n"):e;Lu.has(r)||(Lu.add(r),"error"===t?console.error(r):console.warn(r))}function Wu(e){return rr}const Du=e=>e,Fu=(()=>{let e=Du;return{configure(t){e=t},generate:t=>e(t),reset(){e=Du}}})(),Nu={active:"active",checked:"checked",completed:"completed",disabled:"disabled",error:"error",expanded:"expanded",focused:"focused",focusVisible:"focusVisible",open:"open",readOnly:"readOnly",required:"required",selected:"selected"};function Hu(e,t,r="Mui"){const o=Nu[t];return o?`${r}-${o}`:`${Fu.generate(e)}-${t}`}function Vu(e,t,r="Mui"){const o={};return t.forEach(t=>{o[t]=Hu(e,t,r)}),o}function Qu(e){return Hu("MuiSimpleTreeView",e)}Vu("MuiSimpleTreeView",["root","item","itemContent","itemGroupTransition","itemIconContainer","itemLabel","itemCheckbox"]);const ju=Object.freeze([]),Gu=Object.freeze({}),Uu=e.createContext(null);"production"!==process.env.NODE_ENV&&(Uu.displayName="TreeViewContext");const Xu=()=>{const t=e.useContext(Uu);if(null==t)throw new Error(["MUI X: Could not find the Tree View context.","It looks like you rendered your component outside of a SimpleTreeView or RichTreeView parent component.","This can also happen if you are bundling multiple versions of the Tree View."].join("\n"));return t},Ku=e.createContext({classes:{},slots:{},slotProps:{}});"production"!==process.env.NODE_ENV&&(Ku.displayName="TreeViewStyleContext");const qu=()=>e.useContext(Ku);function Ju(t){const{store:r,apiRef:o,rootRef:n,classes:i=Gu,slots:a=Gu,slotProps:l=Gu,children:s}=t,d=(t=>{const{store:r,apiRef:o,rootRef:n}=t,i=wu(()=>r.buildPublicAPI()).current;!function(e,t){null!=t&&null==t.current&&(t.current=e)}(i,o);const a=e.useCallback(e=>{let t=null,o=null;const n=[],i={};r.itemPluginManager.listPlugins().forEach(r=>{const a=r({props:e,rootRef:t,contentRef:o});a?.rootRef&&(t=a.rootRef),a?.contentRef&&(o=a.contentRef),a?.propsEnhancers&&(n.push(a.propsEnhancers),Object.keys(a.propsEnhancers).forEach(e=>{i[e]=!0}))});const a=Object.fromEntries(Object.keys(i).map(e=>{return[e,(t=e,e=>{const r={};return n.forEach(o=>{const n=o[t];null!=n&&Object.assign(r,n(e))}),r})];var t}));return{contentRef:o,rootRef:t,propsEnhancers:a}},[r]),l=e.useCallback(({itemId:e,children:t,idAttribute:o})=>{let n=t;const i=r.itemPluginManager.listWrappers();for(let t=i.length-1;t>=0;t-=1)n=(0,i[t])({store:r,itemId:e,children:n,idAttribute:o});return n},[r]);return e.useMemo(()=>({runItemPlugins:a,wrapItem:l,publicAPI:i,store:r,rootRef:n}),[a,l,i,r,n])})({store:r,apiRef:o,rootRef:n}),c=e.useMemo(()=>({classes:i,slots:{collapseIcon:a.collapseIcon,expandIcon:a.expandIcon,endIcon:a.endIcon},slotProps:{collapseIcon:l.collapseIcon,expandIcon:l.expandIcon,endIcon:l.endIcon}}),[i,a.collapseIcon,a.expandIcon,a.endIcon,l.collapseIcon,l.expandIcon,l.endIcon]);return de(Uu.Provider,{value:d,children:de(Ku.Provider,{value:c,children:s})})}function Yu(e,t){if(null==e)return{};var r={};for(var o in e)if({}.hasOwnProperty.call(e,o)){if(-1!==t.indexOf(o))continue;r[o]=e[o]}return r}const Zu=["apiRef","slots","slotProps","disabledItemsFocusable","onItemClick","itemChildrenIndentation","id","expandedItems","defaultExpandedItems","onExpandedItemsChange","onItemExpansionToggle","expansionTrigger","disableSelection","selectedItems","defaultSelectedItems","multiSelect","checkboxSelection","selectionPropagation","onSelectedItemsChange","onItemSelectionToggle","onItemFocus"];var $u=(e,t,r)=>{if(1===t.length&&t[0]===r){let t=!1;try{const r={};e(r)===r&&(t=!0)}catch{}if(t){let e;try{throw new Error}catch(t){({stack:e}=t)}console.warn("The result function returned its own inputs without modification. e.g\n`createSelector([state => state.todos], todos => todos)`\nThis could lead to inefficient memoization and unnecessary re-renders.\nEnsure transformation logic is in the result function, and extraction logic is in the input selectors.",{stack:e})}}},_u=(e,t,r)=>{const{memoize:o,memoizeOptions:n}=t,{inputSelectorResults:i,inputSelectorResultsCopy:a}=e,l=o(()=>({}),...n);if(!(l.apply(null,i)===l.apply(null,a))){let e;try{throw new Error}catch(t){({stack:e}=t)}console.warn("An input selector returned a different result when passed same arguments.\nThis means your output selector will likely run more frequently than intended.\nAvoid returning a new reference inside your input selector, e.g.\n`createSelector([state => state.todos.map(todo => todo.id)], todoIds => todoIds.length)`",{arguments:r,firstInputs:i,secondInputs:a,stack:e})}},ep={inputStabilityCheck:"once",identityFunctionCheck:"once"},tp=Symbol("NOT_FOUND");var rp=e=>Array.isArray(e)?e:[e];function op(e){const t=Array.isArray(e[0])?e[0]:e;return function(e,t="expected all items to be functions, instead received the following types: "){if(!e.every(e=>"function"==typeof e)){const r=e.map(e=>"function"==typeof e?`function ${e.name||"unnamed"}()`:typeof e).join(", ");throw new TypeError(`${t}[${r}]`)}}(t,"createSelector expects all input-selectors to be functions, but received the following types: "),t}function np(e,t){const r=[],{length:o}=e;for(let n=0;n<o;n++)r.push(e[n].apply(null,t));return r}var ip=(e,t)=>e===t;var ap="undefined"!=typeof WeakRef?WeakRef:class{constructor(e){this.value=e}deref(){return this.value}};function lp(){return{s:0,v:void 0,o:null,p:null}}function sp(e,t={}){let r={s:0,v:void 0,o:null,p:null};const{resultEqualityCheck:o}=t;let n,i=0;function a(){let t=r;const{length:a}=arguments;for(let e=0,r=a;e<r;e++){const r=arguments[e];if("function"==typeof r||"object"==typeof r&&null!==r){let e=t.o;null===e&&(t.o=e=new WeakMap);const o=e.get(r);void 0===o?(t=lp(),e.set(r,t)):t=o}else{let e=t.p;null===e&&(t.p=e=new Map);const o=e.get(r);void 0===o?(t=lp(),e.set(r,t)):t=o}}const l=t;let s;if(1===t.s)s=t.v;else if(s=e.apply(null,arguments),i++,o){const e=n?.deref?.()??n;null!=e&&o(e,s)&&(s=e,0!==i&&i--);n="object"==typeof s&&null!==s||"function"==typeof s?new ap(s):s}return l.s=1,l.v=s,s}return a.clearCache=()=>{r={s:0,v:void 0,o:null,p:null},a.resetResultsCount()},a.resultsCount=()=>i,a.resetResultsCount=()=>{i=0},a}function dp(e,...t){const r="function"==typeof e?{memoize:e,memoizeOptions:t}:e,o=(...e)=>{let t,o=0,n=0,i={},a=e.pop();"object"==typeof a&&(i=a,a=e.pop()),function(e,t="expected a function, instead received "+typeof e){if("function"!=typeof e)throw new TypeError(t)}(a,`createSelector expects an output function after the inputs, but received: [${typeof a}]`);const l={...r,...i},{memoize:s,memoizeOptions:d=[],argsMemoize:c=sp,argsMemoizeOptions:u=[],devModeChecks:p={}}=l,h=rp(d),m=rp(u),f=op(e),g=s(function(){return o++,a.apply(null,arguments)},...h);let x=!0;const b=c(function(){n++;const e=np(f,arguments);if(t=g.apply(null,e),"production"!==process.env.NODE_ENV){const{identityFunctionCheck:r,inputStabilityCheck:o}=((e,t)=>{const{identityFunctionCheck:r,inputStabilityCheck:o}={...ep,...t};return{identityFunctionCheck:{shouldRun:"always"===r||"once"===r&&e,run:$u},inputStabilityCheck:{shouldRun:"always"===o||"once"===o&&e,run:_u}}})(x,p);if(r.shouldRun&&r.run(a,e,t),o.shouldRun){const t=np(f,arguments);o.run({inputSelectorResults:e,inputSelectorResultsCopy:t},{memoize:s,memoizeOptions:h},arguments)}x&&(x=!1)}return t},...m);return Object.assign(b,{resultFunc:a,memoizedResultFunc:g,dependencies:f,dependencyRecomputations:()=>n,resetDependencyRecomputations:()=>{n=0},lastResult:()=>t,recomputations:()=>o,resetRecomputations:()=>{o=0},memoize:s,argsMemoize:c})};return Object.assign(o,{withTypes:()=>o}),o}var cp=dp(sp),up=Object.assign((e,t=cp)=>{!function(e,t="expected an object, instead received "+typeof e){if("object"!=typeof e)throw new TypeError(t)}(e,"createStructuredSelector expects first argument to be an object where each property is a selector, instead received a "+typeof e);const r=Object.keys(e),o=t(r.map(t=>e[t]),(...e)=>e.reduce((e,t,o)=>(e[r[o]]=t,e),{}));return o},{withTypes:()=>up});const pp=dp({memoize:function(e,t){const r="object"==typeof t?t:{equalityCheck:t},{equalityCheck:o=ip,maxSize:n=1,resultEqualityCheck:i}=r,a=function(e){return function(t,r){if(null===t||null===r||t.length!==r.length)return!1;const{length:o}=t;for(let n=0;n<o;n++)if(!e(t[n],r[n]))return!1;return!0}}(o);let l=0;const s=n<=1?function(e){let t;return{get:r=>t&&e(t.key,r)?t.value:tp,put(e,r){t={key:e,value:r}},getEntries:()=>t?[t]:[],clear(){t=void 0}}}(a):function(e,t){let r=[];function o(e){const o=r.findIndex(r=>t(e,r.key));if(o>-1){const e=r[o];return o>0&&(r.splice(o,1),r.unshift(e)),e.value}return tp}return{get:o,put:function(t,n){o(t)===tp&&(r.unshift({key:t,value:n}),r.length>e&&r.pop())},getEntries:function(){return r},clear:function(){r=[]}}}(n,a);function d(){let t=s.get(arguments);if(t===tp){if(t=e.apply(null,arguments),l++,i){const e=s.getEntries().find(e=>i(e.value,t));e&&(t=e.value,0!==l&&l--)}s.put(arguments,t)}return t}return d.clearCache=()=>{s.clear(),d.resetResultsCount()},d.resultsCount=()=>l,d.resetResultsCount=()=>{l=0},d},memoizeOptions:{maxSize:1,equalityCheck:Object.is}}),hp=(e,t,r,o,n,i,a,l,...s)=>{if(s.length>0)throw new Error("Unsupported number of selectors");let d;if(e&&t&&r&&o&&n&&i&&a&&l)d=(s,d,c,u)=>{const p=e(s,d,c,u),h=t(s,d,c,u),m=r(s,d,c,u),f=o(s,d,c,u),g=n(s,d,c,u),x=i(s,d,c,u),b=a(s,d,c,u);return l(p,h,m,f,g,x,b,d,c,u)};else if(e&&t&&r&&o&&n&&i&&a)d=(l,s,d,c)=>{const u=e(l,s,d,c),p=t(l,s,d,c),h=r(l,s,d,c),m=o(l,s,d,c),f=n(l,s,d,c),g=i(l,s,d,c);return a(u,p,h,m,f,g,s,d,c)};else if(e&&t&&r&&o&&n&&i)d=(a,l,s,d)=>{const c=e(a,l,s,d),u=t(a,l,s,d),p=r(a,l,s,d),h=o(a,l,s,d),m=n(a,l,s,d);return i(c,u,p,h,m,l,s,d)};else if(e&&t&&r&&o&&n)d=(i,a,l,s)=>{const d=e(i,a,l,s),c=t(i,a,l,s),u=r(i,a,l,s),p=o(i,a,l,s);return n(d,c,u,p,a,l,s)};else if(e&&t&&r&&o)d=(n,i,a,l)=>{const s=e(n,i,a,l),d=t(n,i,a,l),c=r(n,i,a,l);return o(s,d,c,i,a,l)};else if(e&&t&&r)d=(o,n,i,a)=>{const l=e(o,n,i,a),s=t(o,n,i,a);return r(l,s,n,i,a)};else if(e&&t)d=(r,o,n,i)=>{const a=e(r,o,n,i);return t(a,o,n,i)};else{if(!e)throw new Error("Missing arguments");d=e}return d},mp=(...e)=>{const t=new WeakMap;let r=1;const o=e[e.length-1],n=e.length-1||1,i=Math.max(o.length-n,0);if(i>3)throw new Error("Unsupported number of arguments");return(n,a,l,s)=>{let d=n.__cacheKey__;d||(d={id:r},n.__cacheKey__=d,r+=1);let c=t.get(d);if(!c){const r=1===e.length?[e=>e,o]:e;let n=e;const a=[void 0,void 0,void 0];switch(i){case 0:break;case 1:n=[...r.slice(0,-1),()=>a[0],o];break;case 2:n=[...r.slice(0,-1),()=>a[0],()=>a[1],o];break;case 3:n=[...r.slice(0,-1),()=>a[0],()=>a[1],()=>a[2],o];break;default:throw new Error("Unsupported number of arguments")}c=pp(...n),c.selectorArgs=a,t.set(d,c)}switch(i){case 3:c.selectorArgs[2]=s;case 2:c.selectorArgs[1]=l;case 1:c.selectorArgs[0]=a}switch(i){case 0:return c(n);case 1:return c(n,a);case 2:return c(n,a,l);case 3:return c(n,a,l,s);default:throw new Error("unreachable")}}};var fp,gp={exports:{}},xp={};var bp,vp={};
14
+ */function Di(){if(wi)return Bi;wi=1;var e=Object.getOwnPropertySymbols,t=Object.prototype.hasOwnProperty,r=Object.prototype.propertyIsEnumerable;return Bi=function(){try{if(!Object.assign)return!1;var e=new String("abc");if(e[5]="de","5"===Object.getOwnPropertyNames(e)[0])return!1;for(var t={},r=0;r<10;r++)t["_"+String.fromCharCode(r)]=r;if("0123456789"!==Object.getOwnPropertyNames(t).map(function(e){return t[e]}).join(""))return!1;var n={};return"abcdefghijklmnopqrst".split("").forEach(function(e){n[e]=e}),"abcdefghijklmnopqrst"===Object.keys(Object.assign({},n)).join("")}catch(e){return!1}}()?Object.assign:function(n,o){for(var i,a,l=function(e){if(null==e)throw new TypeError("Object.assign cannot be called with null or undefined");return Object(e)}(n),s=1;s<arguments.length;s++){for(var d in i=Object(arguments[s]))t.call(i,d)&&(l[d]=i[d]);if(e){a=e(i);for(var c=0;c<a.length;c++)r.call(i,a[c])&&(l[a[c]]=i[a[c]])}}return l},Bi}function Fi(){if(Ti)return Ci;Ti=1;return Ci="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"}function Ni(){return Ai?Ii:(Ai=1,Ii=Function.call.bind(Object.prototype.hasOwnProperty))}if("production"!==process.env.NODE_ENV){var Hi=Oi();bi.exports=function(){if(Pi)return Ei;Pi=1;var e=Oi(),t=Di(),r=Fi(),n=Ni(),o=function(){if(Ri)return zi;Ri=1;var e=function(){};if("production"!==process.env.NODE_ENV){var t=Fi(),r={},n=Ni();e=function(e){var t="Warning: "+e;"undefined"!=typeof console&&console.error(t);try{throw new Error(t)}catch(e){}}}function o(o,i,a,l,s){if("production"!==process.env.NODE_ENV)for(var d in o)if(n(o,d)){var c;try{if("function"!=typeof o[d]){var u=Error((l||"React class")+": "+a+" type `"+d+"` is invalid; it must be a function, usually from the `prop-types` package, but received `"+typeof o[d]+"`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");throw u.name="Invariant Violation",u}c=o[d](i,d,l,a,null,t)}catch(e){c=e}if(!c||c instanceof Error||e((l||"React class")+": type specification of "+a+" `"+d+"` is invalid; the type checker function must return `null` or an `Error` but returned a "+typeof c+". You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument)."),c instanceof Error&&!(c.message in r)){r[c.message]=!0;var p=s?s():"";e("Failed "+a+" type: "+c.message+(null!=p?p:""))}}}return o.resetWarningCache=function(){"production"!==process.env.NODE_ENV&&(r={})},zi=o}(),i=function(){};function a(){return null}return"production"!==process.env.NODE_ENV&&(i=function(e){var t="Warning: "+e;"undefined"!=typeof console&&console.error(t);try{throw new Error(t)}catch(e){}}),Ei=function(l,s){var d="function"==typeof Symbol&&Symbol.iterator,c="<<anonymous>>",u={array:f("array"),bigint:f("bigint"),bool:f("boolean"),func:f("function"),number:f("number"),object:f("object"),string:f("string"),symbol:f("symbol"),any:m(a),arrayOf:function(e){return m(function(t,n,o,i,a){if("function"!=typeof e)return new h("Property `"+a+"` of component `"+o+"` has invalid PropType notation inside arrayOf.");var l=t[n];if(!Array.isArray(l))return new h("Invalid "+i+" `"+a+"` of type `"+b(l)+"` supplied to `"+o+"`, expected an array.");for(var s=0;s<l.length;s++){var d=e(l,s,o,i,a+"["+s+"]",r);if(d instanceof Error)return d}return null})},element:m(function(e,t,r,n,o){var i=e[t];return l(i)?null:new h("Invalid "+n+" `"+o+"` of type `"+b(i)+"` supplied to `"+r+"`, expected a single ReactElement.")}),elementType:m(function(t,r,n,o,i){var a=t[r];return e.isValidElementType(a)?null:new h("Invalid "+o+" `"+i+"` of type `"+b(a)+"` supplied to `"+n+"`, expected a single ReactElement type.")}),instanceOf:function(e){return m(function(t,r,n,o,i){if(!(t[r]instanceof e)){var a=e.name||c;return new h("Invalid "+o+" `"+i+"` of type `"+((l=t[r]).constructor&&l.constructor.name?l.constructor.name:c)+"` supplied to `"+n+"`, expected instance of `"+a+"`.")}var l;return null})},node:m(function(e,t,r,n,o){return x(e[t])?null:new h("Invalid "+n+" `"+o+"` supplied to `"+r+"`, expected a ReactNode.")}),objectOf:function(e){return m(function(t,o,i,a,l){if("function"!=typeof e)return new h("Property `"+l+"` of component `"+i+"` has invalid PropType notation inside objectOf.");var s=t[o],d=b(s);if("object"!==d)return new h("Invalid "+a+" `"+l+"` of type `"+d+"` supplied to `"+i+"`, expected an object.");for(var c in s)if(n(s,c)){var u=e(s,c,i,a,l+"."+c,r);if(u instanceof Error)return u}return null})},oneOf:function(e){return Array.isArray(e)?m(function(t,r,n,o,i){for(var a=t[r],l=0;l<e.length;l++)if(p(a,e[l]))return null;var s=JSON.stringify(e,function(e,t){return"symbol"===v(t)?String(t):t});return new h("Invalid "+o+" `"+i+"` of value `"+String(a)+"` supplied to `"+n+"`, expected one of "+s+".")}):("production"!==process.env.NODE_ENV&&i(arguments.length>1?"Invalid arguments supplied to oneOf, expected an array, got "+arguments.length+" arguments. A common mistake is to write oneOf(x, y, z) instead of oneOf([x, y, z]).":"Invalid argument supplied to oneOf, expected an array."),a)},oneOfType:function(e){if(!Array.isArray(e))return"production"!==process.env.NODE_ENV&&i("Invalid argument supplied to oneOfType, expected an instance of array."),a;for(var t=0;t<e.length;t++){var o=e[t];if("function"!=typeof o)return i("Invalid argument supplied to oneOfType. Expected an array of check functions, but received "+y(o)+" at index "+t+"."),a}return m(function(t,o,i,a,l){for(var s=[],d=0;d<e.length;d++){var c=(0,e[d])(t,o,i,a,l,r);if(null==c)return null;c.data&&n(c.data,"expectedType")&&s.push(c.data.expectedType)}return new h("Invalid "+a+" `"+l+"` supplied to `"+i+"`"+(s.length>0?", expected one of type ["+s.join(", ")+"]":"")+".")})},shape:function(e){return m(function(t,n,o,i,a){var l=t[n],s=b(l);if("object"!==s)return new h("Invalid "+i+" `"+a+"` of type `"+s+"` supplied to `"+o+"`, expected `object`.");for(var d in e){var c=e[d];if("function"!=typeof c)return g(o,i,a,d,v(c));var u=c(l,d,o,i,a+"."+d,r);if(u)return u}return null})},exact:function(e){return m(function(o,i,a,l,s){var d=o[i],c=b(d);if("object"!==c)return new h("Invalid "+l+" `"+s+"` of type `"+c+"` supplied to `"+a+"`, expected `object`.");var u=t({},o[i],e);for(var p in u){var m=e[p];if(n(e,p)&&"function"!=typeof m)return g(a,l,s,p,v(m));if(!m)return new h("Invalid "+l+" `"+s+"` key `"+p+"` supplied to `"+a+"`.\nBad object: "+JSON.stringify(o[i],null," ")+"\nValid keys: "+JSON.stringify(Object.keys(e),null," "));var f=m(d,p,a,l,s+"."+p,r);if(f)return f}return null})}};function p(e,t){return e===t?0!==e||1/e==1/t:e!=e&&t!=t}function h(e,t){this.message=e,this.data=t&&"object"==typeof t?t:{},this.stack=""}function m(e){if("production"!==process.env.NODE_ENV)var t={},n=0;function o(o,a,l,d,u,p,m){if(d=d||c,p=p||l,m!==r){if(s){var f=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use `PropTypes.checkPropTypes()` to call them. Read more at http://fb.me/use-check-prop-types");throw f.name="Invariant Violation",f}if("production"!==process.env.NODE_ENV&&"undefined"!=typeof console){var g=d+":"+l;!t[g]&&n<3&&(i("You are manually calling a React.PropTypes validation function for the `"+p+"` prop on `"+d+"`. This is deprecated and will throw in the standalone `prop-types` package. You may be seeing this warning due to a third-party PropTypes library. See https://fb.me/react-warning-dont-call-proptypes for details."),t[g]=!0,n++)}}return null==a[l]?o?null===a[l]?new h("The "+u+" `"+p+"` is marked as required in `"+d+"`, but its value is `null`."):new h("The "+u+" `"+p+"` is marked as required in `"+d+"`, but its value is `undefined`."):null:e(a,l,d,u,p)}var a=o.bind(null,!1);return a.isRequired=o.bind(null,!0),a}function f(e){return m(function(t,r,n,o,i,a){var l=t[r];return b(l)!==e?new h("Invalid "+o+" `"+i+"` of type `"+v(l)+"` supplied to `"+n+"`, expected `"+e+"`.",{expectedType:e}):null})}function g(e,t,r,n,o){return new h((e||"React class")+": "+t+" type `"+r+"."+n+"` is invalid; it must be a function, usually from the `prop-types` package, but received `"+o+"`.")}function x(e){switch(typeof e){case"number":case"string":case"undefined":return!0;case"boolean":return!e;case"object":if(Array.isArray(e))return e.every(x);if(null===e||l(e))return!0;var t=function(e){var t=e&&(d&&e[d]||e["@@iterator"]);if("function"==typeof t)return t}(e);if(!t)return!1;var r,n=t.call(e);if(t!==e.entries){for(;!(r=n.next()).done;)if(!x(r.value))return!1}else for(;!(r=n.next()).done;){var o=r.value;if(o&&!x(o[1]))return!1}return!0;default:return!1}}function b(e){var t=typeof e;return Array.isArray(e)?"array":e instanceof RegExp?"object":function(e,t){return"symbol"===e||!!t&&("Symbol"===t["@@toStringTag"]||"function"==typeof Symbol&&t instanceof Symbol)}(t,e)?"symbol":t}function v(e){if(null==e)return""+e;var t=b(e);if("object"===t){if(e instanceof Date)return"date";if(e instanceof RegExp)return"regexp"}return t}function y(e){var t=v(e);switch(t){case"array":case"object":return"an "+t;case"boolean":case"date":case"regexp":return"a "+t;default:return t}}return h.prototype=Error.prototype,u.checkPropTypes=o,u.resetWarningCache=o.resetWarningCache,u.PropTypes=u,u},Ei}()(Hi.isElement,!0)}else bi.exports=function(){if(Mi)return Li;Mi=1;var e=Fi();function t(){}function r(){}return r.resetWarningCache=t,Li=function(){function n(t,r,n,o,i,a){if(a!==e){var l=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw l.name="Invariant Violation",l}}function o(){return n}n.isRequired=n;var i={array:n,bigint:n,bool:n,func:n,number:n,object:n,string:n,symbol:n,any:n,arrayOf:o,element:n,elementType:n,instanceOf:o,node:n,objectOf:o,oneOf:o,oneOfType:o,shape:o,exact:o,checkPropTypes:r,resetWarningCache:t};return i.PropTypes=i,i},Li}()();var Vi=gi(bi.exports);function Qi({code:e,label:t="Copy code"}){const[n,o]=r(!1);return de(w,{title:n?"Copied!":t,children:de(C,{size:"small",onClick:async()=>{try{await navigator.clipboard.writeText(e),o(!0),setTimeout(()=>o(!1),2e3)}catch(e){console.error("Copy failed:",e)}},"aria-label":n?"Copied":t,sx:{color:n?"var(--Icons-Success, var(--Text))":"var(--Quiet)","&:hover":{backgroundColor:"var(--Hover)",color:"var(--Text)"},"&:focus-visible":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"}},children:de(n?he:pe,{fontSize:"small"})})})}Qi.propTypes={code:Vi.string.isRequired,label:Vi.string};function ji({code:e="",language:t="JSX",showCopy:r=!0,showHeader:n=!0,maxHeight:o,wrap:i=!1,sx:a={},...l}){return ce(h,{"data-theme":"Neutral","data-surface":"Surface-Dimmest",sx:{backgroundColor:"var(--Background)",borderRadius:"min(var(--Card-Radius, var(--Style-Border-Radius)), 12px)",overflow:"hidden",...a},...l,children:[n&&(t||r)&&ce(h,{sx:{display:"flex",alignItems:"center",justifyContent:"space-between",gap:1,px:2,py:1,borderBottom:"1px solid var(--Border)",minHeight:40},children:[de(bn,{color:"quiet",children:t}),r&&e?de(Qi,{code:e}):null]}),de(h,{sx:{p:2,overflow:"auto",maxHeight:o},children:de(h,{component:"pre",sx:{margin:0,fontFamily:"inherit"},children:de(h,{component:"code",sx:{fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:"13px",lineHeight:1.6,color:"var(--Text)",whiteSpace:i?"pre-wrap":"pre",wordBreak:i?"break-word":"normal",display:"block"},children:e})})})]})}function Gi(e){if(!e)return null;const t=e.trim();if(/^#[0-9a-f]{3}$/i.test(t))return{r:parseInt(t[1]+t[1],16),g:parseInt(t[2]+t[2],16),b:parseInt(t[3]+t[3],16),a:1};if(/^#[0-9a-f]{6}$/i.test(t))return{r:parseInt(t.substring(1,3),16),g:parseInt(t.substring(3,5),16),b:parseInt(t.substring(5,7),16),a:1};if(/^#[0-9a-f]{8}$/i.test(t))return{r:parseInt(t.substring(1,3),16),g:parseInt(t.substring(3,5),16),b:parseInt(t.substring(5,7),16),a:parseInt(t.substring(7,9),16)/255};const r=t.match(/rgba?\(\s*([\d.]+)[,\s]+([\d.]+)[,\s]+([\d.]+)(?:[,\s/]+([\d.]+%?))?\s*\)/);if(r){let e=1;return void 0!==r[4]&&(e=r[4].endsWith("%")?parseFloat(r[4])/100:parseFloat(r[4])),{r:Math.round(parseFloat(r[1])),g:Math.round(parseFloat(r[2])),b:Math.round(parseFloat(r[3])),a:e}}return null}function Ui(e,t){if(!e||!t)return e||t;if(e.a>=1)return e;const r=e.a;return{r:Math.round(e.r*r+t.r*(1-r)),g:Math.round(e.g*r+t.g*(1-r)),b:Math.round(e.b*r+t.b*(1-r)),a:1}}function Xi(e){const t=e=>e<=.03928?e/12.92:Math.pow((e+.055)/1.055,2.4);return.2126*t(e.r/255)+.7152*t(e.g/255)+.0722*t(e.b/255)}function $i(e,t,r){const n=Gi(e),o=Gi(t),i=Gi(r);if(!n||!o)return null;const a=i?Ui(o,i):o.a<1?null:o;if(!a)return null;const l=Ui(n,a);if(!l)return null;const s=Xi(l),d=Xi(a);return((Math.max(s,d)+.05)/(Math.min(s,d)+.05)).toFixed(2)}function Ki(e){return"undefined"==typeof window?null:getComputedStyle(document.documentElement).getPropertyValue(e).trim()}ji.propTypes={code:Vi.string,language:Vi.string,showCopy:Vi.bool,showHeader:Vi.bool,maxHeight:Vi.oneOfType([Vi.number,Vi.string]),wrap:Vi.bool,sx:Vi.object};const qi={"display-large":"Display Large","display-medium":"Display Medium","display-small":"Display Small",h1:"H1",h2:"H2",h3:"H3",h4:"H4",h5:"H5",h6:"H6","subtitle-small":"Subtitle Small",subtitle:"Subtitle Medium","subtitle-large":"Subtitle Large","body-small":"Body Small","body-small-semibold":"Body Small Semibold",body:"Body Medium","body-semibold":"Body Medium Semibold","body-large":"Body Large","body-large-semibold":"Body Large Semibold",label:"Label","label-small":"Label Small","label-large":"Label Large",caption:"Caption","caption-bold":"Caption Bold",legal:"Legal","legal-semibold":"Legal Semibold",eyebrow:"Eyebrow Medium","eyebrow-small":"Eyebrow Small","eyebrow-large":"Eyebrow Large",button:"Button Standard","button-small":"Button Small","button-extra-small":"Button Extra Small","number-large":"Number Large","number-medium":"Number Medium","number-small":"Number Small"};function Yi(){const e=({color:e})=>ce(h,{sx:{textAlign:"center"},children:[de(h,{sx:{width:"80px",height:"80px",backgroundColor:`var(${e.var})`,borderRadius:"8px",border:"1px solid var(--Border)",mb:1,mx:"auto"}}),de(T,{variant:"body2",sx:{fontWeight:600,fontSize:"12px",color:"var(--Text)",mb:.5,wordBreak:"break-word"},children:e.name}),de(T,{variant:"caption",sx:{color:"var(--Text-Secondary)",display:"block",fontSize:"10px",fontFamily:"monospace",wordBreak:"break-all"},children:e.var})]});return ce(B,{spacing:6,children:[ce(h,{children:[de(T,{variant:"h5",sx:{mb:3,fontWeight:700},children:"Brand Colors (Static)"}),de(B,{direction:"row",spacing:3,sx:{justifyContent:"center",flexWrap:"wrap",gap:3},children:[{name:"Primary",var:"--Primary-Color-11"},{name:"Secondary",var:"--Secondary-Color-11"},{name:"Tertiary",var:"--Tertiary-Color-11"}].map(t=>de(e,{color:t},t.var))})]}),ce(h,{children:[de(T,{variant:"h5",sx:{mb:3,fontWeight:700},children:"Background Colors (Dynamic)"}),de(T,{variant:"body2",sx:{mb:3,color:"var(--Text-Secondary)"},children:"Update based on selected Background variant and Mode"}),de(I,{container:!0,spacing:2,sx:{justifyContent:"center"},children:[{name:"Default Background",cssVar:"var(--Theme-Default-Surfaces-Surface)"},{name:"Primary Background",cssVar:"var(--Theme-Primary-Surfaces-Surface)"},{name:"Secondary Background",cssVar:"var(--Theme-Secondary-Surfaces-Surface)"},{name:"Tertiary Background",cssVar:"var(--Theme-Tertiary-Surfaces-Surface)"},{name:"Neutral Background",cssVar:"var(--Theme-Neutral-Surfaces-Surface)"},{name:"Neutral-Variant Background",cssVar:"var(--Theme-Neutral-Variant-Surfaces-Surface)"}].map(e=>de(I,{item:!0,sx:{display:"flex",justifyContent:"center"},children:ce(h,{sx:{textAlign:"center"},children:[de(h,{sx:{minWidth:"max(var(--Button-Height), var(--Min-Button-Width))",minHeight:"var(--Button-Height)",backgroundColor:e.cssVar,borderRadius:"var(--Style-Border-Radius)",border:"2px solid var(--Border)",mb:1}}),de(T,{variant:"body2",sx:{fontWeight:600,fontSize:"12px",color:"var(--Text)",wordBreak:"break-word"},children:e.name})]})},e.name))})]}),ce(h,{children:[de(T,{variant:"h5",sx:{mb:3,fontWeight:700},children:"Dynamic Colors (Update with Mode, Background & Surface)"}),de(A,{severity:"info",sx:{backgroundColor:"var(--Container-Low)",mb:3,border:"1px solid var(--Border)"},children:ce(T,{variant:"body2",children:["Most colors update automatically based on the current"," ",de("strong",{children:"Mode"})," (Light/Dark), ",de("strong",{children:"Background"})," ","variant, and ",de("strong",{children:"Surface"})," theme. Only Primary, Secondary, and Tertiary colors are fixed brand colors."]})}),de(T,{variant:"body2",sx:{mb:3,color:"var(--Text-Secondary)"},children:"These colors automatically adapt based on:"}),ce(B,{spacing:1,sx:{mb:4},children:[ce(h,{sx:{display:"flex",gap:2},children:[de(T,{variant:"body2",sx:{fontWeight:600,minWidth:80},children:"Mode:"}),de(T,{variant:"body2",children:"Light or Dark theme"})]}),ce(h,{sx:{display:"flex",gap:2},children:[de(T,{variant:"body2",sx:{fontWeight:600,minWidth:80},children:"Background:"}),de(T,{variant:"body2",children:"Default, Primary, Secondary, Tertiary, Neutral, or Neutral-Variant"})]}),ce(h,{sx:{display:"flex",gap:2},children:[de(T,{variant:"body2",sx:{fontWeight:600,minWidth:80},children:"Surface:"}),de(T,{variant:"body2",children:"Theme surface layer selection"})]})]}),de(B,{spacing:4,children:[{name:"Layout & Surfaces",colors:[{name:"Background",var:"--Background"},{name:"Border",var:"--Border"},{name:"Border-Variant",var:"--Border-Variant"}]},{name:"Text & Links",colors:[{name:"Header",var:"--Header"},{name:"Text",var:"--Text"},{name:"Text-Quiet",var:"--Text-Quiet"},{name:"Hotlink",var:"--Hotlink"},{name:"Hotlink-Visited",var:"--Hotlink-Visited"}]},{name:"Buttons - Primary",colors:[{name:"Button BG",var:"--Button-Primary-Button"},{name:"Button Text",var:"--Button-Primary-Text"},{name:"Button Hover",var:"--Button-Primary-Hover"},{name:"Button Active",var:"--Button-Primary-Pressed"},{name:"Focus-Visible",var:"--Focus-Visible"}]},{name:"Buttons - Secondary",colors:[{name:"Button BG",var:"--Button-Secondary-Button"},{name:"Button Text",var:"--Button-Secondary-Text"},{name:"Button Hover",var:"--Button-Secondary-Hover"},{name:"Button Active",var:"--Button-Secondary-Pressed"},{name:"Focus-Visible",var:"--Focus-Visible"}]},{name:"Buttons - State",colors:[{name:"Info Button",var:"--Button-Info-Button"},{name:"Success Button",var:"--Button-Success-Button"},{name:"Warning Button",var:"--Button-Warning-Button"},{name:"Error Button",var:"--Button-Error-Button"}]},{name:"Icons",colors:[{name:"Default",var:"--Icons-Default"},{name:"Primary",var:"--Icons-Primary"},{name:"Secondary",var:"--Icons-Secondary"},{name:"Tertiary",var:"--Icons-Tertiary"},{name:"Neutral",var:"--Icons-Neutral"},{name:"Info",var:"--Icons-Info"},{name:"Success",var:"--Icons-Success"},{name:"Warning",var:"--Icons-Warning"},{name:"Error",var:"--Icons-Error"}]},{name:"Chips & Badges",colors:[{name:"Primary BG",var:"--Tags-Primary-BG"},{name:"Primary Text",var:"--Tags-Primary-Text"},{name:"Secondary BG",var:"--Tags-Secondary-BG"},{name:"Secondary Text",var:"--Tags-Secondary-Text"},{name:"Tertiary BG",var:"--Tags-Tertiary-BG"},{name:"Tertiary Text",var:"--Tags-Tertiary-Text"},{name:"Neutral BG",var:"--Tags-Neutral-BG"},{name:"Neutral Text",var:"--Tags-Neutral-Text"},{name:"Info BG",var:"--Tags-Info-BG"},{name:"Info Text",var:"--Tags-Info-Text"},{name:"Success BG",var:"--Tags-Success-BG"},{name:"Success Text",var:"--Tags-Success-Text"},{name:"Warning BG",var:"--Tags-Warning-BG"},{name:"Warning Text",var:"--Tags-Warning-Text"},{name:"Error BG",var:"--Tags-Error-BG"},{name:"Error Text",var:"--Tags-Error-Text"}]}].map(t=>ce(h,{children:[de(T,{variant:"h6",sx:{mb:2,fontWeight:600},children:t.name}),de(I,{container:!0,spacing:2,sx:{justifyContent:"center"},children:t.colors.map(t=>de(I,{item:!0,sx:{display:"flex",justifyContent:"center"},children:de(e,{color:t})},t.var))})]},t.name))})]}),ce(h,{sx:{pt:4,borderTop:"1px solid var(--Border)"},children:[de(T,{variant:"h5",sx:{mb:2,fontWeight:700},children:"How to Use"}),ce(B,{spacing:2,children:[ce(h,{children:[de(T,{variant:"h6",sx:{fontWeight:600,mb:1},children:"Static Colors"}),ce(T,{variant:"body2",sx:{color:"var(--Text-Secondary)"},children:["Use brand colors (",de("code",{style:{backgroundColor:"var(--Container)",padding:"2px 4px",borderRadius:"4px"},children:"--Primary-Color-11"}),","," ",de("code",{style:{backgroundColor:"var(--Container)",padding:"2px 4px",borderRadius:"4px"},children:"--Secondary-Color-11"}),","," ",de("code",{style:{backgroundColor:"var(--Container)",padding:"2px 4px",borderRadius:"4px"},children:"--Tertiary-Color-11"}),") for brand elements that should never change."]})]}),ce(h,{children:[de(T,{variant:"h6",sx:{fontWeight:600,mb:1},children:"Dynamic Colors"}),de(T,{variant:"body2",sx:{color:"var(--Text-Secondary)"},children:"Use dynamic color variables for all UI elements. They will automatically update when users change Mode, Background, or Surface settings."})]}),ce(h,{children:[de(T,{variant:"h6",sx:{fontWeight:600,mb:1},children:"Example Usage"}),de(h,{component:"pre",sx:{backgroundColor:"var(--Container)",p:2,borderRadius:"8px",overflow:"auto",fontSize:"12px",border:"1px solid var(--Border)",color:"var(--Text)"},children:"/* Dynamic - updates with theme changes */\ncolor: var(--Text);\nbackgroundColor: var(--Background);\nborderColor: var(--Border);\n\n/* Static - brand colors stay the same */\naccentColor: var(--Primary-Color-11);"})]})]})]})]})}function Ji(){const e=({name:e,varName:t,baseValue:r})=>de(h,{sx:{mb:2},children:ce(h,{sx:{display:"flex",alignItems:"center",gap:2,mb:1},children:[de(h,{"aria-hidden":"true",sx:{width:`var(${t})`,minWidth:20,height:24,backgroundColor:"var(--Buttons-Primary-Button)",borderRadius:.5,border:"1px solid var(--Border)"}}),ce(B,{spacing:.5,children:[de(T,{variant:"subtitle2",sx:{fontWeight:600},children:e}),de(T,{variant:"caption",sx:{color:"var(--Text-Secondary)"},children:t}),ce(T,{variant:"caption",sx:{color:"var(--Text-Secondary)"},children:["Base: ",r," (with cognitive multiplier)"]})]})]})}),t=({name:e,varName:t,value:r})=>ce(h,{sx:{mb:2},children:[de(h,{"aria-hidden":"true",sx:{width:100,height:r,backgroundColor:"var(--Buttons-Primary-Button)",borderRadius:1,border:"1px solid var(--Border)",mb:1}}),de(T,{variant:"subtitle2",sx:{fontWeight:600},children:e}),de(T,{variant:"caption",sx:{color:"var(--Text-Secondary)",display:"block"},children:t}),de(T,{variant:"caption",sx:{color:"var(--Text-Secondary)"},children:r})]});return ce(B,{spacing:3,sx:{p:2},children:[ce("section",{children:[de(T,{variant:"h5",component:"h2",sx:{mb:2,fontWeight:700},children:"Spacing Scale"}),de(T,{variant:"body2",sx:{mb:3,color:"var(--Text-Secondary)"},children:"Spacing values are multiplied by the cognitive multiplier for accessibility. Each spacing value includes a visual reference and text label for clarity."}),de(B,{spacing:1,children:[{name:"Quarter",var:"--Spacing-Quarter",baseValue:"2px"},{name:"Half",var:"--Spacing-Half",baseValue:"4px"},{name:"1-and-Half",var:"--Spacing-1-and-Half",baseValue:"12px"},{name:"1",var:"--Spacing-1",baseValue:"8px"},{name:"2",var:"--Spacing-2",baseValue:"16px"},{name:"3",var:"--Spacing-3",baseValue:"24px"},{name:"4",var:"--Spacing-4",baseValue:"32px"},{name:"5",var:"--Spacing-5",baseValue:"40px"},{name:"6",var:"--Spacing-6",baseValue:"48px"},{name:"7",var:"--Spacing-7",baseValue:"56px"},{name:"8",var:"--Spacing-8",baseValue:"64px"},{name:"9",var:"--Spacing-9",baseValue:"72px"},{name:"10",var:"--Spacing-10",baseValue:"80px"}].map(t=>de(e,{name:t.name,varName:t.var,baseValue:t.baseValue},t.var))})]}),ce("section",{children:[de(T,{variant:"h5",component:"h2",sx:{mb:2,fontWeight:700},children:"Sizing Scale"}),de(T,{variant:"body2",sx:{mb:3,color:"var(--Text-Secondary)"},children:"Fixed sizing values for components and layouts. Each size is labeled with its CSS variable and pixel value."}),de(I,{container:!0,spacing:3,children:[{name:"Quarter",var:"--Sizing-Quarter",value:"2px"},{name:"Half",var:"--Sizing-Half",value:"4px"},{name:"1-and-Half",var:"--Sizing-1-and-Half",value:"12px"},{name:"1",var:"--Sizing-1",value:"8px"},{name:"2",var:"--Sizing-2",value:"16px"},{name:"3",var:"--Sizing-3",value:"24px"},{name:"4",var:"--Sizing-4",value:"32px"},{name:"5",var:"--Sizing-5",value:"40px"},{name:"6",var:"--Sizing-6",value:"48px"},{name:"7",var:"--Sizing-7",value:"56px"},{name:"8",var:"--Sizing-8",value:"64px"},{name:"9",var:"--Sizing-9",value:"72px"},{name:"10",var:"--Sizing-10",value:"80px"},{name:"11",var:"--Sizing-11",value:"88px"},{name:"12",var:"--Sizing-12",value:"96px"},{name:"13",var:"--Sizing-13",value:"104px"},{name:"14",var:"--Sizing-14",value:"112px"},{name:"15",var:"--Sizing-15",value:"160px"},{name:"16",var:"--Sizing-16",value:"240px"},{name:"17",var:"--Sizing-17",value:"320px"},{name:"18",var:"--Sizing-18",value:"480px"}].map(e=>de(I,{item:!0,xs:12,sm:6,md:4,lg:3,children:de(t,{name:e.name,varName:e.var,value:e.value})},e.var))})]}),ce("section",{children:[de(T,{variant:"h5",component:"h2",sx:{mb:2,fontWeight:700},children:"Negative Sizing"}),de(T,{variant:"body2",sx:{mb:3,color:"var(--Text-Secondary)"},children:"Negative values for margins and offsets. Use these to reduce or remove default spacing when needed."}),de(I,{container:!0,spacing:3,children:[{name:"Negative-Quarter",var:"--Sizing-Negative-Quarter",value:"-2px"},{name:"Negative-Half",var:"--Sizing-Negative-Half",value:"-4px"},{name:"Negative-1-and-Half",var:"--Sizing-Negative-1-and-Half",value:"-12px"},{name:"Negative-1",var:"--Sizing-Negative-1",value:"-8px"}].map(e=>de(I,{item:!0,xs:12,sm:6,md:4,lg:3,children:ce(h,{children:[de(T,{variant:"subtitle2",sx:{fontWeight:600},children:e.name}),de(T,{variant:"caption",sx:{color:"var(--Text-Secondary)",display:"block"},children:e.var}),de(T,{variant:"caption",sx:{color:"var(--Text-Secondary)"},children:e.value})]})},e.var))})]}),ce("section",{style:{paddingTop:24,borderTop:"1px solid var(--Border)"},children:[de(T,{variant:"h5",component:"h2",sx:{mb:2,fontWeight:700},children:"Container Padding"}),ce(h,{sx:{p:"var(--Spacing-3)",backgroundColor:"var(--Container-Low)",border:"2px dashed var(--Buttons-Primary-Button)",borderRadius:1},children:[ce(T,{variant:"body2",children:["Default container padding: ",de("strong",{children:"var(--Spacing-3)"})," = 24px"]}),de(T,{variant:"caption",sx:{color:"var(--Text-Secondary)",display:"block",mt:1},children:"Use this variable for consistent padding around main content areas."})]})]}),ce("section",{style:{paddingTop:24,borderTop:"1px solid var(--Border)"},children:[de(T,{variant:"h5",component:"h2",sx:{mb:3,fontWeight:700},children:"Practical Examples"}),ce("article",{children:[de(T,{variant:"h6",component:"h3",sx:{mb:2,fontWeight:600},children:"Padding Examples"}),de(T,{variant:"caption",sx:{color:"var(--Text-Secondary)",mb:2,display:"block"},children:"Different padding values create different visual breathing room."}),de(I,{container:!0,spacing:2,sx:{mb:4},children:["var(--Spacing-1)","var(--Spacing-2)","var(--Spacing-3)","var(--Spacing-4)"].map(e=>de(I,{item:!0,xs:12,sm:6,children:ce(h,{sx:{p:e,backgroundColor:"var(--Container)",border:"1px solid var(--Border)",borderRadius:1},children:[ce(T,{variant:"subtitle2",children:["Padding: ",e]}),de(T,{variant:"caption",sx:{display:"block",mt:1,color:"var(--Text-Secondary)"},children:"Content with spacing applied"})]})},e))})]}),ce("article",{children:[de(T,{variant:"h6",component:"h3",sx:{mb:2,fontWeight:600},children:"Gap Examples"}),de(T,{variant:"caption",sx:{color:"var(--Text-Secondary)",mb:2,display:"block"},children:"Gap controls spacing between flex/grid children without adding extra elements."}),de(B,{spacing:3,children:["var(--Spacing-1)","var(--Spacing-2)","var(--Spacing-3)"].map(e=>ce(h,{children:[de(B,{direction:"row",spacing:e,sx:{mb:1},children:[1,2,3].map(e=>de(h,{"aria-hidden":"true",sx:{width:60,height:60,backgroundColor:"var(--Buttons-Primary-Button)",borderRadius:1,flexShrink:0}},e))}),ce(T,{variant:"caption",sx:{color:"var(--Text-Secondary)"},children:["Gap: ",e]})]},e))})]})]}),ce(h,{role:"note",sx:{p:2,backgroundColor:"var(--Container-Low)",borderRadius:1,borderLeft:"4px solid var(--Buttons-Primary-Button)",mt:3},children:[de(T,{variant:"subtitle2",sx:{fontWeight:600,mb:1},children:"✓ Accessibility Best Practices Used"}),ce("ul",{style:{margin:"0.5rem 0",paddingLeft:"1.5rem"},children:[de("li",{children:ce(T,{variant:"caption",children:[de("strong",{children:'aria-hidden="true"'})," on purely decorative visual elements"]})}),de("li",{children:de(T,{variant:"caption",children:"All spacing information conveyed through text labels and values"})}),de("li",{children:ce(T,{variant:"caption",children:["No empty decorative ",de("code",{children:"<div>"})," elements in DOM"]})}),de("li",{children:ce(T,{variant:"caption",children:["Semantic HTML: ",de("code",{children:"<section>"})," and ",de("code",{children:"<article>"})," for structure"]})}),de("li",{children:de(T,{variant:"caption",children:"CSS-based spacing (padding/margin) for actual layout, not decorative divs"})}),de("li",{children:de(T,{variant:"caption",children:"Full keyboard navigation and screen reader support"})})]})]})]})}Object.entries({Display:["display-large","display-medium","display-small"],Headings:["h1","h2","h3","h4","h5","h6"],Subtitle:["subtitle-small","subtitle","subtitle-large"],Body:["body-small","body-small-semibold","body","body-semibold","body-large","body-large-semibold"],Label:["label","label-small","label-large"],Caption:["caption","caption-bold"],Legal:["legal","legal-semibold"],Eyebrow:["eyebrow-small","eyebrow","eyebrow-large"],Button:["button-extra-small","button-small","button"],Number:["number-large","number-medium","number-small"]}).map(([e,t])=>({label:e,options:t.map(e=>({value:e,label:qi[e]}))}));const Zi=["default","primary","secondary","tertiary","neutral","info","success","warning","error"],_i=e=>e.charAt(0).toUpperCase()+e.slice(1);function ea(e){const t=_i(e);return{type:"outline",color:t,trackOff:"var(--Background)",trackOffBorder:"var(--Border-Variant)",trackOn:"var(--Buttons-"+t+"-Button)",trackOnBorder:"var(--Buttons-"+t+"-Border)",dotOff:"var(--Quiet)",dotOn:"var(--Buttons-"+t+"-Text)",iconOff:"var(--Background)",iconOn:"var(--Buttons-"+t+"-Button)"}}function ta(e){const t=_i(e);return{type:"light",color:t,trackOff:"var(--Border-Variant)",trackOffBorder:"transparent",trackOn:"var(--"+t+"-Color-11)",trackOnBorder:"var(--Buttons-"+t+"-Border)",dotOff:"var(--Quiet)",dotOn:"var(--Buttons-"+t+"-Border)",iconOff:"var(--Border-Variant)",iconOn:"var(--"+t+"-Color-11)",dataTheme:t,dataSurface:"Surface-Brightest"}}const ra={small:{trackW:28,trackH:16,dotRadius:"var(--Sizing-2, 16px)",icon:8},medium:{trackW:40,trackH:24,dotRadius:"var(--Sizing-2-and-Half, 20px)",icon:16},large:{trackW:56,trackH:32,dotRadius:"var(--Sizing-2-and-Half, 20px)",icon:16}};function na({variant:e="default",size:t="medium",checked:r,defaultChecked:n,onChange:o,disabled:i=!1,label:a,labelPlacement:l="end",name:s,value:d,icon:c,iconOn:u,iconOff:p,className:h="",sx:m={},"aria-label":f,"aria-labelledby":g,...x}){const b=function(){const e={};return Zi.forEach(t=>{e[t+"-outline"]=ea(t),e[t+"-light"]=ta(t)}),e.default={type:"themed",trackOff:"var(--Background)",trackOffBorder:"var(--Quiet)",trackOn:"var(--Buttons-Default-Button)",trackOnBorder:"var(--Buttons-Default-Border)",dotOff:"var(--Quiet)",dotOn:"var(--Buttons-Default-Text)",iconOff:"var(--Background)",iconOn:"var(--Buttons-Default-Button)"},e["default-outline"]={type:"themed",trackOff:"var(--Background)",trackOffBorder:"var(--Quiet)",trackOn:"var(--Buttons-Default-Button)",trackOnBorder:"var(--Buttons-Default-Border)",dotOff:"var(--Quiet)",dotOn:"var(--Buttons-Default-Text)",iconOff:"var(--Background)",iconOn:"var(--Buttons-Default-Button)"},e.outline={type:"themed",trackOff:"var(--Background)",trackOffBorder:"var(--Quiet)",trackOn:"var(--Buttons-Default-Button)",trackOnBorder:"var(--Buttons-Default-Border)",dotOff:"var(--Quiet)",dotOn:"var(--Buttons-Default-Text)",iconOff:"var(--Background)",iconOn:"var(--Buttons-Default-Button)"},e.primary=ea("primary"),e.light=ta("primary"),e}(),y=b[e]||b.default,S=ra[t]||ra.medium,k="small"===t?ln:cn,B=S.trackH-4,w=Math.max(24,S.trackW),C=Math.max(24,S.trackH),T=(C-S.trackH)/2,I={width:B,height:B,borderRadius:S.dotRadius,boxShadow:"none",border:"none",display:"flex",alignItems:"center",justifyContent:"center",transition:"background-color var(--Motion-Duration-Fast, 150ms) var(--Motion-Easing-Standard, cubic-bezier(0.2, 0, 0, 1))","& > *":{width:S.icon,height:S.icon,display:"block"}},A={width:S.trackW,minWidth:24,height:C,minHeight:24,padding:0,overflow:"visible",opacity:i?"var(--Disabled, 0.38)":1,"& .MuiSwitch-switchBase":{position:"absolute",top:0,left:0,width:"100%",height:"100%",display:"flex",justifyContent:"flex-start",alignItems:"center",paddingTop:0,paddingBottom:0,paddingLeft:"2px",paddingRight:w-S.trackW+2+"px",color:"transparent",transition:"justify-content var(--Motion-Duration-Instant, 100ms) var(--Motion-Easing-Standard, cubic-bezier(0.2, 0, 0, 1))",transform:"none","& .MuiSwitch-input":{left:0,top:0,width:"100%",height:"100%",margin:0},"& .MuiSwitch-thumb":{...I,backgroundColor:y.dotOff,color:y.iconOff},"&.Mui-checked":{justifyContent:"flex-end",transform:"none","& .MuiSwitch-thumb":{...I,backgroundColor:y.dotOn,color:y.iconOn},"& + .MuiSwitch-track":{backgroundColor:y.trackOn,borderColor:y.trackOnBorder,opacity:1}},"&:hover, &.Mui-checked:hover":{backgroundColor:"transparent"},"&:hover + .MuiSwitch-track":{boxShadow:oo},"&:active + .MuiSwitch-track":{boxShadow:no},"&.Mui-focusVisible + .MuiSwitch-track":{outline:"1px solid var(--Focus-Visible)",outlineOffset:"2px"},"&.Mui-disabled + .MuiSwitch-track":{opacity:1}},"& .MuiSwitch-track":{width:S.trackW,height:S.trackH,borderRadius:"var(--Sizing-3, 24px)",backgroundColor:y.trackOff,border:"1px solid "+y.trackOffBorder,boxSizing:"border-box",opacity:1,position:"absolute",top:T,left:0,transition:"background-color var(--Motion-Duration-Fast, 150ms) var(--Motion-Easing-Standard, cubic-bezier(0.2, 0, 0, 1)), border-color var(--Motion-Duration-Fast, 150ms) var(--Motion-Easing-Standard, cubic-bezier(0.2, 0, 0, 1)), box-shadow var(--Motion-Duration-Fast, 150ms) var(--Motion-Easing-Standard, cubic-bezier(0.2, 0, 0, 1))"},...m},R=e.includes("-light")||"light"===e,E=void 0!==p?p:c,P=void 0!==u?u:c,L=e=>de("span",{className:"MuiSwitch-thumb",children:e}),M=de(z,{...void 0!==E||void 0!==P?{icon:L(E),checkedIcon:L(P)}:{},checked:r,defaultChecked:n,onChange:o,disabled:i,name:s,value:d,slotProps:{input:{...f?{"aria-label":f}:{},...g?{"aria-labelledby":g}:{}}},className:"switch-"+e+" "+h,sx:A,disableRipple:!0,...R&&y.dataTheme?{"data-theme":y.dataTheme,"data-surface":y.dataSurface||"Surface-Dim"}:{},...x});return a?de(v,{control:M,label:de(k,{component:"span",sx:{color:i?"var(--Text-Quiet)":"var(--Text)",fontSize:"small"===t?"13px":"15px",fontWeight:500,opacity:i?.6:1},children:a}),labelPlacement:l,sx:{gap:"8px",marginLeft:0,marginRight:0}}):M}const oa=na,ia=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",aa={default:"Default",quiet:"Quiet",primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info",success:"Success",warning:"Warning",error:"Error"},la=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}],sa=["filled","outlined","rounded","twotone","sharp"],da={filled:"Filled",outlined:"Outlined",rounded:"Rounded",twotone:"Two Tone",sharp:"Sharp"},ca={Home:{filled:Be,outlined:Le,rounded:je,twotone:tt,sharp:ht},Favorite:{filled:ke,outlined:Me,rounded:Ge,twotone:rt,sharp:mt},Delete:{filled:we,outlined:We,rounded:Ue,twotone:nt,sharp:ft},Settings:{filled:Ce,outlined:Oe,rounded:Xe,twotone:ot,sharp:gt},Search:{filled:Te,outlined:Te,rounded:$e,twotone:it,sharp:xt},Star:{filled:Ie,outlined:De,rounded:Ke,twotone:at,sharp:bt},Person:{filled:me,outlined:Fe,rounded:qe,twotone:lt,sharp:vt},Notifications:{filled:Ae,outlined:Ne,rounded:Ye,twotone:st,sharp:yt},Visibility:{filled:ze,outlined:He,rounded:Je,twotone:dt,sharp:St},ShoppingCart:{filled:Re,outlined:Ve,rounded:Ze,twotone:ct,sharp:kt},Lock:{filled:Ee,outlined:Qe,rounded:_e,twotone:ut,sharp:Bt},Info:{filled:Pe,outlined:ve,rounded:et,twotone:pt,sharp:wt}};function ua({ratio:e,threshold:t}){if(!e)return de(bn,{style:{color:"var(--Text-Quiet)"},children:"--"});const r=parseFloat(e)>=t;return ce(h,{sx:{display:"inline-flex",alignItems:"center",gap:.5},children:[ce(h,{sx:{px:1,py:.25,borderRadius:"4px",fontSize:"11px",fontWeight:700,backgroundColor:r?"var(--Tags-Success-BG)":"var(--Tags-Error-BG)",color:r?"var(--Tags-Success-Text)":"var(--Tags-Error-Text)"},children:[e,":1"]}),de(bn,{style:{color:r?"var(--Tags-Success-Text)":"var(--Tags-Error-Text)"},children:r?"Pass":"Fail"})]})}function pa({label:e,ratio:t,threshold:r,note:n}){return ce(h,{sx:{display:"flex",justifyContent:"space-between",alignItems:"flex-start",py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(h,{sx:{flex:1},children:[de(ln,{style:{color:"var(--Text)"},children:e}),n&&de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:n})]}),de(ua,{ratio:t,threshold:r})]})}function ha({label:e,selected:t,onClick:r}){return de(Io,{selected:t,variant:t?"primary":"primary-outline",size:"small",onClick:r,children:e})}function ma(){const[e,t]=r("filled"),[n,o]=r("default"),[i,l]=r("medium"),[s,d]=r("40"),[c,u]=r(!1),[p,m]=r("Home"),[f,g]=r(""),[x,b]=r({}),v=aa[n]||"Default",y="twotone"===e,S="custom"===i?(parseInt(s,10)||40)+"px":{xs:"12px",small:"16px",medium:"24px",large:"36px"}[i]||"24px",k=function(e,t){return ca[e]?.[t]||ca[e]?.filled||Be}(p,e),w=function(e){return{outlined:"Outlined",rounded:"Rounded",twotone:"TwoTone",sharp:"Sharp"}[e]||""}(e),C=p+w+"Icon",T=f.trim().length>0,A="<Icon>\n <"+C+' />\n</Icon>\n{/* aria-hidden="true" by default */}',z='<Icon aria-label="'+(T?f.trim():p+" icon")+'">\n <'+C+' />\n</Icon>\n{/* role="img" added automatically */}';return a(()=>{b({background:Ki("--Background"),iconColor:Ki("--Icons-"+v),iconVariant:Ki("--Icons-Variant-"+v)})},[n,v]),ce(h,{sx:{pb:8},children:[de(qr,{children:"Icon"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(h,{sx:{p:4,display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",minHeight:200,backgroundColor:"var(--Background)",borderBottom:"1px solid var(--Border)",gap:2},children:de(Qn,{color:n,size:i,fontSize:"custom"===i?parseInt(s,10)||40:void 0,disabled:c,twoTone:y,"aria-label":T?f.trim():void 0,children:de(k,{})})}),de(ji,{code:(()=>{const e=[];"default"!==n&&e.push('color="'+n+'"'),"custom"===i?(e.push('size="custom"'),e.push("fontSize={"+(parseInt(s,10)||40)+"}")):"medium"!==i&&e.push('size="'+i+'"'),y&&e.push("twoTone"),c&&e.push("disabled"),T&&e.push('aria-label="'+f.trim()+'"');const t=e.length?" "+e.join(" "):"";return"import "+C+" from '@mui/icons-material/"+p+(w||"")+"';\n\n<Icon"+t+">\n <"+C+" />\n</Icon>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(li,{defaultValue:0,variant:"standard",color:"primary",children:[ce(si,{children:[de(di,{children:"Playground"}),de(di,{children:"Accessibility"})]}),de(ci,{value:0,children:ce(h,{sx:{p:3},children:[ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"ICON"}),de(h,{component:"input",type:"text",value:p,onChange:e=>m(e.target.value),placeholder:"e.g. Home, Favorite, Delete",sx:{width:"100%",padding:"6px 10px",fontSize:"13px",fontFamily:"inherit",border:"1px solid var(--Border)",borderRadius:"4px",backgroundColor:"var(--Background)",color:"var(--Text)",boxSizing:"border-box","&:focus":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"1px",borderColor:"var(--Focus-Visible)"}}}),ce(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:["Enter a MUI icon name."," ",de(h,{component:"a",href:"https://mui.com/material-ui/material-icons/",target:"_blank",rel:"noopener noreferrer",sx:{color:"var(--Text-Primary)",textDecoration:"underline","&:hover":{color:"var(--Header-Primary)"}},children:"Browse MUI Icons ↗"})]})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"STYLE"}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:sa.map(r=>de(ha,{label:da[r],selected:e===r,onClick:()=>t(r)},r))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:la.map(e=>ce(h,{children:[de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:e.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:e.colors.map(e=>{const t=aa[e],r=n===e;return de(h,{component:"button",onClick:()=>o(e),"aria-label":"Select "+ia(e),"aria-pressed":r,title:ia(e),sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Icons-"+t+")",border:r?"2px solid var(--Text)":"1px solid var(--Border)",outline:r?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:r&&de(he,{sx:{fontSize:16,color:"var(--Background)",pointerEvents:"none"}})},e)})})]},e.label))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:["xs","small","medium","large","custom"].map(e=>de(ha,{label:"xs"===e?"XS":ia(e),selected:i===e,onClick:()=>l(e)},e))}),"custom"===i&&ce(h,{sx:{display:"flex",alignItems:"center",gap:1,mt:1.5},children:[de(h,{component:"input",type:"number",value:s,onChange:e=>d(e.target.value),"aria-label":"Custom font size in pixels",sx:{width:72,padding:"4px 8px",fontSize:"13px",fontFamily:"inherit",border:"1px solid var(--Border)",borderRadius:"4px",backgroundColor:"var(--Background)",color:"var(--Text)",outline:"none","&:focus":{borderColor:"var(--Focus-Visible)"}}}),de(bn,{style:{color:"var(--Text-Quiet)"},children:"px"})]})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"ARIA LABEL"}),de(h,{component:"input",type:"text",value:f,onChange:e=>g(e.target.value),placeholder:"Leave empty for decorative (aria-hidden)",sx:{width:"100%",padding:"6px 10px",fontSize:"13px",fontFamily:"inherit",border:"1px solid var(--Border)",borderRadius:"4px",backgroundColor:"var(--Background)",color:"var(--Text)",boxSizing:"border-box","&:focus":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"1px",borderColor:"var(--Focus-Visible)"}}}),de(bn,{style:{color:T?"var(--Tags-Success-Text)":"var(--Text-Quiet)",display:"block",marginTop:6},children:T?'✓ Meaningful — role="img" aria-label="'+f.trim()+'"':'Decorative — aria-hidden="true" (invisible to screen readers)'})]}),ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Disabled"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Reduces opacity to 0.38"})]}),de(na,{checked:c,onChange:e=>u(e.target.checked),size:"small","aria-label":"Toggle disabled"})]})]})}),de(ci,{value:1,children:ce(h,{sx:{p:3},children:[ce(ln,{color:"quiet",style:{marginBottom:24},children:[da[e]," / ",ia(n)," / ","custom"===i?s+"px":i,T?" / meaningful":" / decorative"]}),ce(B,{spacing:3,children:[ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"Icon Contrast (WCAG 1.4.11 — 3:1)"}),de(ln,{color:"quiet",style:{marginBottom:16},children:"Non-text elements must contrast 3:1 against the page background."}),de(pa,{label:"var(--Icons-"+v+") vs. var(--Background)",ratio:$i(x.iconColor,x.background),threshold:3,note:C+" at "+S+" in "+ia(n)+" color"}),y&&de(pa,{label:"var(--Icons-Variant-"+v+") vs. var(--Background)",ratio:$i(x.iconVariant,x.background),threshold:3,note:"Two-tone secondary fill — must also meet 3:1"})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"ARIA and Semantics"}),ce(B,{spacing:0,children:[ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)",backgroundColor:T?"var(--Tags-Success-BG, rgba(0,200,0,0.05))":"transparent",px:1,borderRadius:"4px"},children:[ce(ln,{style:{fontWeight:600},children:["Current icon — ",T?"meaningful ✓":"decorative"]}),de(h,{component:"pre",sx:{fontFamily:"monospace",fontSize:"11px",color:"var(--Text-Quiet)",mt:.5,whiteSpace:"pre-wrap",wordBreak:"break-word",margin:0},children:T?z:A})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ln,{children:"Decorative (no aria-label):"}),de(bn,{style:{color:"var(--Text-Quiet)"},children:'aria-hidden="true" is applied automatically. The icon is invisible to screen readers. Use this when the icon is purely visual — e.g. a decorative bullet or inline illustration.'}),de(h,{component:"pre",sx:{fontFamily:"monospace",fontSize:"11px",color:"var(--Text-Quiet)",mt:.5,whiteSpace:"pre-wrap",wordBreak:"break-word",margin:0},children:A})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ln,{children:"Meaningful (with aria-label):"}),de(bn,{style:{color:"var(--Text-Quiet)"},children:'role="img" is added automatically. The label is announced by screen readers. Use this when the icon conveys information that is not present in surrounding text.'}),de(h,{component:"pre",sx:{fontFamily:"monospace",fontSize:"11px",color:"var(--Text-Quiet)",mt:.5,whiteSpace:"pre-wrap",wordBreak:"break-word",margin:0},children:z})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ln,{children:["Disabled state",c?" ← current":"",":"]}),de(bn,{style:{color:"var(--Text-Quiet)"},children:"Opacity 0.38 — visual cue only. To disable an action, disable the wrapping interactive element (button, link), not the icon itself."})]}),y&&ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ln,{children:["Two-tone",y?" ← current":"",":"]}),ce(bn,{style:{color:"var(--Text-Quiet)"},children:["Secondary fill uses var(--Icons-Variant-",v,"). Both the primary and secondary fills must meet 3:1 contrast independently."]})]}),ce(h,{sx:{py:1.5},children:[ce(ln,{children:["Touch target — ",S," icon","small"===i?" ⚠":" ✓",":"]}),de(bn,{style:{color:"var(--Text-Quiet)"},children:"small"===i?"Small icons (20px) need a 24px minimum target area around them (WCAG 2.5.5). Wrap in a button with padding.":"Icon is "+S+" — meets 24px minimum. Ensure the wrapping interactive element also meets 24×24px."})]})]})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"Size Reference"}),de(B,{spacing:0,children:[{label:"Small",s:"small",px:"20px",note:"Inline text, compact UI"},{label:"Medium",s:"medium",px:"24px",note:"Standard UI — default"},{label:"Large",s:"large",px:"36px",note:"Emphasis, empty states, hero areas"},{label:"Custom",s:"custom",px:"any",note:"Ensure 24×24px minimum touch target (WCAG 2.5.5)"}].map(({label:e,s:t,px:r,note:n},o,a)=>ce(h,{sx:{py:1.5,borderBottom:o<a.length-1?"1px solid var(--Border)":"none",display:"flex",justifyContent:"space-between",alignItems:"flex-start"},children:[ce(h,{children:[ce(ln,{children:[e," — ",r]}),de(bn,{style:{color:"var(--Text-Quiet)"},children:n})]}),i===t&&de(h,{sx:{px:1,py:.25,borderRadius:"4px",fontSize:"11px",fontWeight:700,backgroundColor:"var(--Tags-Success-BG)",color:"var(--Tags-Success-Text)"},children:"current"})]},e))})]})]})]})})]})})})]})]})}const fa={default:"Default",primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info",success:"Success",warning:"Warning",error:"Error",white:"White",black:"Black"},ga={small:{size:32,iconSize:"16px",borderRadius:"8px"},medium:{size:40,iconSize:"20px",borderRadius:"10px"},large:{size:48,iconSize:"24px",borderRadius:"12px"}};function xa({children:e,color:t="primary",variant:r="solid",size:n="medium",className:o="",sx:i={},...a}){const l=ga[n]||ga.medium,s=fa[t]||fa.primary;let d,c;switch(r){case"light":d=s,c="Surface-Brightest";break;case"dark":d=s,c="Surface-Dimmest";break;default:d=s,c="Surface"}return de(h,{"data-theme":d,"data-surface":c,className:"icon-badge icon-badge-"+r+" icon-badge-"+n+" icon-badge-"+t+" "+o,sx:{width:l.size,height:l.size,borderRadius:l.borderRadius,backgroundColor:"var(--Background)",color:"var(--Text)",display:"flex",alignItems:"center",justifyContent:"center",flexShrink:0,"& svg":{width:l.iconSize,height:l.iconSize,fontSize:l.iconSize,color:"inherit",stroke:"currentColor"},...i},...a,children:e})}const ba={default:"Default-Light",primary:"Primary-Light",secondary:"Secondary-Light",tertiary:"Tertiary-Light",neutral:"Neutral-Light",info:"Info-Light",success:"Success-Light",warning:"Warning-Light",error:"Error-Light"};function va({variant:e="outlined",color:n="default",size:o="medium",disabled:i=!1,orientation:a="horizontal",spacing:l=0,fit:s,fullWidth:d=!1,equalWidth:c=!1,multiple:u=!1,value:p,defaultValue:m,onChange:f,children:g,className:x="",sx:b={},"aria-label":v,...y}){const[S,k]=r(m??(u?[]:null)),B=void 0!==p,w=B?p:S,C=u?Array.isArray(w)?w:null==w?[]:[w]:null,T="horizontal"===a,I=0===l,A="light"===e,z="ghost"===e,R=s??(d?"fill":c?"equal":"hug"),E="fill"===R,P="equal"===R&&T,L=(M=n).charAt(0).toUpperCase()+M.slice(1);var M;const W="var(--Buttons-"+L+"-Border)",O="var(--Buttons-"+L+"-Button)",D="var(--Buttons-"+L+"-Text)",F=ba[n]||"Default-Light",N=t.Children.toArray(g).filter(Boolean),H=N.length,V=(e,t)=>r=>{const n=u?C.includes(e)?C.filter(t=>t!==e):[...C,e]:e;B||k(n),f?.(n,r),t?.(r)},Q=N.map((e,r)=>{if(!t.isValidElement(e))return e;const a=0===r,l=r===H-1,s=e.props.value??r,d=(c=s,u?C.includes(c):w===c);var c;let p;if(I&&H>1){const e="var(--Style-Border-Radius)";p=T?a&&l?e:a?e+" 0 0 "+e:l?"0 "+e+" "+e+" 0":"0":a&&l?e:a?e+" "+e+" 0 0":l?"0 0 "+e+" "+e:"0"}const m={...I&&H>1?{borderRadius:p,...!a&&(T?{marginLeft:"calc(-1 * var(--Button-Border-Width))"}:{marginTop:"calc(-1 * var(--Button-Border-Width))"}),position:"relative","&:hover, &:focus-visible":{zIndex:1}}:{},transform:"none !important","&:hover, &:active, &:focus-visible":{transform:"none !important"},...d?{backgroundColor:O+" !important",color:D+" !important",borderColor:W+" !important","&:hover, &:active, &.Mui-focusVisible, &:focus-visible":{backgroundColor:O+" !important",color:D+" !important",borderColor:W+" !important"}}:{},...d?{}:{color:"var(--Quiet)",backgroundColor:"transparent","&:hover":{backgroundColor:"var(--Hover)",color:"var(--Text)",zIndex:1},"&:active":{backgroundColor:"var(--Pressed)",color:"var(--Buttons-Default-Text)"}},...z?{border:"none !important","&:hover":{border:"none !important"}}:{},"&:focus-visible":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px",zIndex:2},...e.props.sx},f=t.cloneElement(e,{variant:e.props.variant??(z?"ghost":d?n:n+"-outline"),size:e.props.size??o,disabled:e.props.disabled??i,onClick:V(s,e.props.onClick),"aria-pressed":d,sx:m});return A&&!d?de(h,{"data-theme":F,"data-surface":"Surface",sx:{display:"contents"},children:f},r):t.cloneElement(f,{key:r})});return de(h,{role:"group","aria-label":v,className:"btn-group btn-group-"+e+" btn-group-"+n+" "+x,sx:{...P?{display:E?"grid":"inline-grid",gridAutoFlow:"column",gridAutoColumns:"1fr",justifyItems:"stretch",alignItems:"stretch",width:E?"100%":"fit-content"}:{display:E?"flex":"inline-flex",flexDirection:T?"row":"column",alignItems:"stretch",width:E?"100%":"auto"},gap:I?0:l,border:"none",borderRadius:"var(--Style-Border-Radius)",...b},...y,children:Q})}const ya=["Link","Chip","Badge","Caption","Label","Tag","BodySmall","LegalSemibold","Legal","LabelSmall","LabelExtraSmall","EyebrowSmall","ButtonSmall"];function Sa(e){let r=!1;return t.Children.forEach(e,e=>{(function(e){if(!t.isValidElement(e))return!1;const r=e.props||{};if("small"===r.size)return!0;if("small"===r["data-size"])return!0;if(24===r.height||24===r.minHeight)return!0;if("24px"===r.height||"24px"===r.minHeight)return!0;if(r.sx){const e=r.sx.minHeight||r.sx.height;if(24===e||"24px"===e)return!0}const n=e.type;if(n){const e=n.displayName||n.name||"";if(ya.some(t=>e.includes(t)))return!0}return!1})(e)&&(r=!0)}),r}function ka({children:e,gap:t,spacing:r,direction:n="column",enforceMinGap:o=!0,minGapToken:i="--min-stack-gap",divider:a,flexWrap:l,useFlexGap:s=!0,alignItems:c,justifyContent:u,sx:p={},className:h="",...m}){const f=void 0!==t?t:r,g=o&&Sa(e),x=d(()=>{if(!g)return f;const e=function(e,t=8){return null==e?0:"number"==typeof e?e*t:"string"==typeof e?e.endsWith("px")?parseFloat(e):e.endsWith("rem")?parseFloat(e)*parseFloat(getComputedStyle(document.documentElement).fontSize||"16"):parseFloat(e)*t||0:0}(f),t=function(e,t=8){if("undefined"==typeof window)return t;const r=getComputedStyle(document.documentElement).getPropertyValue(e).trim();return r?r.endsWith("rem")?parseFloat(r)*parseFloat(getComputedStyle(document.documentElement).fontSize):parseFloat(r)||t:t}(i,8);return e>=t?f:"var("+i+", "+t+"px)"},[g,f,i]);return de(B,{direction:n,spacing:s?void 0:x,gap:s?x:void 0,divider:a,flexWrap:l,useFlexGap:s,alignItems:c,justifyContent:u,className:"omni-stack"+(g?" omni-stack-min-gap-enforced":"")+(h?" "+h:""),sx:{background:"var(--Background)",boxSizing:"border-box",...g?{"&::before":{display:"none"}}:{},...p},"data-min-gap-enforced":g?"true":void 0,...m,children:e})}const Ba=e=>de(ka,{direction:"row",alignItems:"center",...e}),wa=e=>de(ka,{direction:"column",...e}),Ca=e=>de(ka,{direction:"column",alignItems:"center",justifyContent:"center",...e}),Ta=e=>de(ka,{direction:"row",alignItems:"center",justifyContent:"space-between",...e}),Ia=e=>de(ka,{direction:"row",flexWrap:"wrap",...e}),Aa=({breakpoint:e="sm",...t})=>de(ka,{direction:{xs:"column",[e]:"row"},...t}),za=ka,Ra=Ia,Ea=e=>de(h,{sx:{borderBottom:"1px solid var(--Border)",width:"100%"},...e}),Pa=({sx:e,...t})=>de(ka,{sx:{px:2,...e},...t}),La=({sx:e,...t})=>de(ka,{sx:{overflowY:"auto",...e},...t}),Ma={default:"Default",primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info",success:"Success",warning:"Warning",error:"Error"},Wa={small:{gap:"8px",fontSize:"13px",padding:"var(--Card-Padding)"},medium:{gap:"12px",fontSize:"14px",padding:"var(--Card-Padding)"},large:{gap:"16px",fontSize:"16px",padding:"var(--Card-Padding)"}},Oa=s({variant:"default",color:"primary",size:"medium",orientation:"vertical"});function Da({children:e,variant:t="solid",color:r="default",surface:n,size:o="medium",orientation:i="vertical",clickable:a=!1,selected:l=!1,elevated:s=!1,draggable:d=!1,onClick:c,href:u,className:p="",sx:m={},...f}){const g="default"===r,x=g?"":Ma[r],b=n||(g?"Container":"dark"===t?"Surface-Dimmest":"light"===t?"Surface-Brightest":"Surface"),v=Wa[o]||Wa.medium,y="horizontal"===i,S=!!d,k=a||!!c||!!u||l||S,B=u?"a":"div",w=l?`var(--Buttons-${(e=>e.charAt(0).toUpperCase()+e.slice(1))("default"===r?"Default":r)}-Border)`:"var(--Buttons-Default-Border)",C=k?l?`2px solid ${w}`:"1px solid var(--Buttons-Default-Border)":"1px solid var(--Border-Variant)",T=s?io:oo,I=s?ao:io,A=s?oo:no;return de(Oa.Provider,{value:{variant:t,color:r,size:o,orientation:i},children:de(h,{component:B,href:u||void 0,onClick:k?c:void 0,role:k?"button":void 0,tabIndex:k?0:void 0,"aria-pressed":!!l||void 0,draggable:S||void 0,className:"card card-"+t+" card-"+o+" card-"+i+(k?" card-clickable":"")+(l?" card-selected":"")+(s?" card-elevated":"")+(S?" card-draggable":"")+" "+p,sx:{display:"flex",border:C,borderRadius:"var(--Card-Radius)",boxShadow:T,overflow:"hidden",textDecoration:"none",transition:"box-shadow 0.2s ease, border-color 0.2s ease, transform 0.1s ease",...k&&!S&&{cursor:"pointer","&:hover":{borderColor:"var(--Buttons-Default-Border)",boxShadow:I,transform:"translateY(-1px)"},"&:active":{transform:"translateY(0) scale(0.995)",boxShadow:A},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"3px",borderRadius:"calc(var(--Card-Radius) + 3px)"}},...S&&{cursor:"grab","&:hover":{borderColor:"var(--Buttons-Default-Border)",boxShadow:I},"&:active":{cursor:"grabbing",zIndex:10,boxShadow:ao,transform:"scale(1.02)",borderWidth:"2px",borderColor:"var(--Buttons-Primary-Border)"},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"3px"}},...m},onKeyDown:k?e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),c?.())}:void 0,...f,children:de(h,{"data-theme":x||void 0,"data-surface":b,sx:{display:"flex",flexDirection:y?"row":"column",gap:v.gap,padding:v.padding,backgroundColor:"var(--Background)",color:"var(--Text)",fontSize:v.fontSize,fontFamily:"inherit",borderRadius:"inherit",position:"relative",flex:1,minWidth:0,overflow:"hidden"},children:e})})})}function Fa({children:e,className:t="",sx:r={},...n}){const{size:o}=l(Oa);return de(h,{className:"card-content "+t,sx:{display:"flex",flexDirection:"column",gap:(Wa[o]||Wa.medium).gap,flex:1,minWidth:0,...r},...n,children:e})}const Na=e=>de(Da,{clickable:!0,selected:e.selected,...e}),Ha=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",Va=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary"]},{label:"Core",colors:["white","black"]},{label:"State",colors:["info","success","warning","error"]}],Qa=[Be,Ct,ge,Ie,Tt,It];function ja(){const[e,t]=r("primary"),[n,o]=r("solid"),[i,a]=r("medium"),l=Qa[0];return ce(wa,{spacing:4,style:{paddingBottom:64},children:[de(qr,{children:"Icon Badge"}),ce("div",{style:{display:"grid",gridTemplateColumns:"1fr 1fr",gap:24},children:[de(Da,{padding:"medium",children:ce(wa,{spacing:4,alignItems:"center",children:[de("div",{style:{padding:40},children:de(xa,{color:e,variant:n,size:i,children:de(l,{})})}),de(Ba,{spacing:4,alignItems:"flex-end",children:["small","medium","large"].map(t=>ce(wa,{spacing:1,alignItems:"center",children:[de(xa,{color:e,variant:n,size:t,children:de(l,{})}),de(ln,{style:{color:"var(--Quiet)"},children:Ha(t)})]},t))}),ce(wa,{spacing:1,alignItems:"center",children:[de(ln,{style:{color:"var(--Quiet)",fontWeight:600,fontSize:"0.7rem"},children:"Variants"}),de(Ba,{spacing:3,children:["solid","light","dark"].map(t=>ce(wa,{spacing:1,alignItems:"center",children:[de(xa,{color:e,variant:t,size:"medium",children:de(l,{})}),de(ln,{style:{color:"var(--Quiet)",fontSize:"0.65rem"},children:Ha(t)})]},t))})]}),ce(wa,{spacing:1,alignItems:"center",children:[de(ln,{style:{color:"var(--Quiet)",fontWeight:600,fontSize:"0.7rem"},children:"All Colors"}),de(Ba,{spacing:2,style:{flexWrap:"wrap",justifyContent:"center"},children:Va.flatMap(e=>e.colors).map(e=>ce(wa,{spacing:0,alignItems:"center",children:[de(xa,{color:e,variant:n,size:"small",children:de(l,{})}),de(ln,{style:{color:"var(--Quiet)",fontSize:"0.55rem"},children:Ha(e)})]},e))})]})]})}),de(Da,{padding:"medium",children:ce(wa,{spacing:4,children:[de(qr,{style:{fontSize:"1rem"},children:"Playground"}),ce(wa,{spacing:2,children:[de(kn,{children:"Color"}),Va.map(r=>ce(wa,{spacing:1,children:[de(ln,{style:{color:"var(--Quiet)",fontWeight:600,fontSize:"0.7rem"},children:r.label}),de(Ba,{spacing:1,children:r.colors.map(r=>de(Io,{variant:e===r?"default":"outline",size:"small",onClick:()=>t(r),children:Ha(r)},r))})]},r.label))]}),ce(wa,{spacing:1,children:[de(kn,{children:"Variant"}),de(va,{size:"small",children:["solid","light","dark"].map(e=>de(Io,{variant:n===e?"default":"outline",size:"small",onClick:()=>o(e),children:Ha(e)},e))})]}),ce(wa,{spacing:1,children:[de(kn,{children:"Size"}),de(va,{size:"small",children:["small","medium","large"].map(e=>de(Io,{variant:i===e?"default":"outline",size:"small",onClick:()=>a(e),children:Ha(e)},e))})]}),ce(wa,{spacing:0,children:[ce(ln,{style:{color:"var(--Quiet)"},children:["data-theme: ",Ha(e),"light"===n?"-Light":""]}),ce(ln,{style:{color:"var(--Quiet)"},children:["data-surface: ","dark"===n?"Surface-Dimmest":"Surface"]}),de(ln,{style:{color:"var(--Quiet)"},children:"bg: var(--Background)"}),de(ln,{style:{color:"var(--Quiet)"},children:"icon: var(--Text)"})]})]})})]})]})}const Ga={primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info",success:"Success",warning:"Warning",error:"Error"},Ua={small:{size:32,iconSize:16,fontSize:"13px",px:12,gap:6},medium:{size:48,iconSize:24,fontSize:"14px",px:16,gap:8},large:{size:56,iconSize:36,fontSize:"15px",px:20,gap:10}};function Xa({children:e,icon:t,label:r,variant:n="solid",color:o="primary",size:i="medium",extended:a=!1,animate:l=!1,disabled:s=!1,onClick:d,ariaLabel:c,className:u="",sx:p={},...m}){const f=function(e,t){const r=Ga[t]||"Primary";return"light"===e?{bg:"var(--Buttons-"+r+"-Light-Button)",text:"var(--Buttons-"+r+"-Light-Text)",border:"var(--Buttons-"+r+"-Light-Border)",hover:"var(--Buttons-"+r+"-Light-Hover)",active:"var(--Buttons-"+r+"-Light-Pressed)"}:{bg:"var(--Buttons-"+r+"-Button)",text:"var(--Buttons-"+r+"-Text)",border:"var(--Buttons-"+r+"-Border)",hover:"var(--Buttons-"+r+"-Hover)",active:"var(--Buttons-"+r+"-Pressed)"}}(n,o),g=Ua[i]||Ua.medium,x=t||e||de(At,{sx:{fontSize:g.iconSize}}),b=c||r||"Action";return ce(ue,{children:[l&&de("style",{children:"\n@keyframes fab-pulse {\n 0% { box-shadow: 0 0 0 0 rgba(var(--pulse-rgb, 0,0,0), 0.4); }\n 70% { box-shadow: 0 0 0 12px rgba(var(--pulse-rgb, 0,0,0), 0); }\n 100% { box-shadow: 0 0 0 0 rgba(var(--pulse-rgb, 0,0,0), 0); }\n}\n"}),ce(h,{component:"button",type:"button",role:"button","aria-label":b,onClick:d,disabled:s,className:"fab fab-"+n+" fab-"+o+" fab-"+i+(a?" fab-extended":"")+(l?" fab-animate":"")+(s?" fab-disabled":"")+(u?" "+u:""),sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",gap:a?g.gap+"px":0,...a?{height:g.size+"px",borderRadius:g.size/2+"px",px:g.px+"px"}:{width:g.size+"px",height:g.size+"px",borderRadius:"50%"},backgroundColor:f.bg,color:f.text,border:"var(--Button-Border-Width) solid "+f.border,"--_height":g.size+"px","--_bevel":"min(calc(var(--Button-Bevel) * var(--_height) / 100), calc(var(--_height) / 5))",boxShadow:`${ho(o)}, ${io}`,fontSize:g.fontSize,fontFamily:"inherit",fontWeight:600,cursor:s?"not-allowed":"pointer",opacity:s?.5:1,outline:"none",flexShrink:0,transition:"background-color 0.15s ease, box-shadow 0.2s ease, transform 0.1s ease","&:hover":s?{}:{backgroundColor:f.hover,boxShadow:`${ho(o)}, ${ao}`},"&:active":s?{}:{backgroundColor:f.active,transform:"scale(0.96)",boxShadow:ho(o)},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"2px"},...l&&!s&&{animation:"fab-pulse 2s infinite"},...p},...m,children:[de(h,{sx:{display:"flex",alignItems:"center",justifyContent:"center",fontSize:g.iconSize+"px",color:"inherit","& .MuiSvgIcon-root":{fontSize:"inherit",color:"inherit"}},children:x}),a&&r&&de(h,{component:"span",sx:{whiteSpace:"nowrap",lineHeight:1},children:r})]})]})}const $a=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",Ka=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}],qa={default:"Tertiary",primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info",success:"Success",warning:"Warning",error:"Error"};function Ya({label:e,selected:t,onClick:r}){return de(Io,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function Ja({color:e,selected:t,onClick:r}){const n=qa[e]||"Primary";return de(h,{component:"button",onClick:()=>r(e),"aria-label":"Select "+$a(e),"aria-pressed":t,title:$a(e),sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+n+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Buttons-"+n+"-Text)",pointerEvents:"none"}})})}function Za({value:e,onChange:t,placeholder:r,label:n}){return ce(h,{children:[n&&de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4},children:n}),de(h,{component:"input",type:"text",value:e,onChange:e=>t(e.target.value),placeholder:r,sx:{width:"100%",padding:"6px 10px",fontSize:"13px",fontFamily:"inherit",border:"1px solid var(--Border)",borderRadius:"4px",backgroundColor:"var(--Background)",color:"var(--Text)",outline:"none","&:focus":{borderColor:"var(--Focus-Visible)"}}})]})}function _a(){const[e,t]=r("default"),[n,o]=r("medium"),[i,a]=r("Add"),[l,s]=r(!1),[d,c]=r("Create"),[u,p]=r(!1),[m,f]=r(!1),[g,x]=r(null),[b,v]=r("Surface"),y="default"===e?"tertiary":e;return ce(h,{sx:{pb:8},children:[de(qr,{children:"Floating Action Button"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ui,{theme:g,children:de(Xa,{color:y,size:n,icon:(()=>{const e=zt[i]||zt.Add;return de(Qn,{size:"medium",children:de(e,{})})})(),extended:l,label:d,animate:u,disabled:m,ariaLabel:l?d:i})}),de(ji,{code:(()=>{const t=[];return"default"!==e&&t.push('color="'+e+'"'),"medium"!==n&&t.push('size="'+n+'"'),t.push("icon={<"+i+"Icon />}"),l&&(t.push("extended"),t.push('label="'+d+'"')),u&&t.push("animate"),m&&t.push("disabled"),t.push('ariaLabel="'+(l?d:i)+'"'),"<Fab\n "+t.join("\n ")+"\n/>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(li,{defaultValue:0,variant:"standard",color:"primary",children:[ce(si,{children:[de(di,{children:"Playground"}),de(di,{children:"Accessibility"})]}),de(ci,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(fi,{theme:g,onThemeChange:x,surface:b,onSurfaceChange:v})}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:Ka.map(r=>ce(h,{children:[de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:r.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:r.colors.map(r=>de(Ja,{color:r,selected:e===r,onClick:t},r))})]},r.label))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",spacing:1,children:["small","medium","large"].map(e=>de(Ya,{label:$a(e),selected:n===e,onClick:()=>o(e)},e))})]}),ce(h,{sx:{mt:3},children:[de(Za,{label:"Icon Name",value:i,onChange:a,placeholder:"Add"}),ce(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:4},children:[de("a",{href:"https://mui.com/material-ui/material-icons/",target:"_blank",rel:"noopener noreferrer",style:{color:"var(--Hotlink)"},children:"Material icon"})," name (e.g. Add, Edit, Favorite, Share)"]})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"OPTIONS"}),ce(h,{sx:{display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Extended"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Pill shape with icon + text label"})]}),de(na,{checked:l,onChange:e=>s(e.target.checked),size:"small","aria-label":"Extended"})]}),l&&de(h,{sx:{mt:1.5},children:de(Za,{label:"Label Text",value:d,onChange:c,placeholder:"Create"})}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Animation"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Pulse ring effect to draw attention"})]}),de(na,{checked:u,onChange:e=>p(e.target.checked),size:"small","aria-label":"Animation"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Disabled"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Non-interactive state"})]}),de(na,{checked:m,onChange:e=>f(e.target.checked),size:"small","aria-label":"Disabled"})]})]})]})}),de(ci,{value:1,children:de(h,{sx:{p:3},children:ce(B,{spacing:3,children:[ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"ARIA and Semantics"}),ce(B,{spacing:0,children:[ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ln,{children:"Role:"}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:'<button role="button" aria-label="...">'})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ln,{children:"Label:"}),de(bn,{style:{color:"var(--Text-Quiet)"},children:l?"Extended: visible label provides accessible name.":"Icon-only: aria-label is required."})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ln,{children:"Focus:"}),de(bn,{style:{color:"var(--Text-Quiet)"},children:"3px solid var(--Focus-Visible) with 2px offset."})]}),ce(h,{sx:{py:1.5},children:[de(ln,{children:"Disabled:"}),de(bn,{style:{color:"var(--Text-Quiet)"},children:"HTML disabled attribute. 50% opacity, removed from tab order."})]})]})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"Best Practices"}),ce(B,{spacing:0,children:[ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ln,{children:"One per screen:"}),de(bn,{style:{color:"var(--Text-Quiet)"},children:"FABs represent the primary action. Use at most one per view."})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ln,{children:"Extended for clarity:"}),de(bn,{style:{color:"var(--Text-Quiet)"},children:"Use extended variant when the icon alone may be ambiguous."})]}),ce(h,{sx:{py:1.5},children:[de(ln,{children:"Animation:"}),de(bn,{style:{color:"var(--Text-Quiet)"},children:"Use sparingly. Respect prefers-reduced-motion."})]})]})]})]})})})]})})})]})]})}const el={small:"var(--Sm-Rail-Width, 72px)",medium:"var(--Rail-Width, 80px)",large:"var(--Lg-Rail-Width, 96px)"},tl="var(--Icon-Size, 24px)",rl="var(--Sizing-Half, 4px)",nl="var(--Button-Height, 32px)";function ol({items:e=[],sections:t,value:n,defaultValue:o=0,onChange:a,expandable:l=!1,expandedWidth:s="partial",defaultExpanded:d=!1,fabAction:c,labelStyle:u="contained",size:p="medium",className:m="",sx:f={},...g}){const[x,b]=r(o),[v,y]=r(d),S=void 0!==n,k=S?n:x,B=i(e=>{S||b(e),a?.(e)},[S,a]),w=l&&v;return ce(h,{component:"nav",role:"navigation","aria-label":"Navigation rail","data-theme":"Default","data-surface":"Surface-Dim",className:"rail"+(l?" rail-expandable":" rail-fixed")+(w?" rail-expanded":" rail-collapsed")+" rail-label-"+("outside"===u?"outside":"contained")+" rail-"+(el[p]?p:"medium")+" "+m,sx:{display:"flex",flexDirection:"column",width:w?("full"===s?320:240)+"px":el[p]||el.medium,minHeight:"100%",gap:w?0:"var(--Sizing-1, 8px)",backgroundColor:"var(--Background)",borderRight:"1px solid var(--Border)",fontFamily:"inherit",transition:"width 0.25s ease",overflow:"hidden",flexShrink:0,...f},...g,children:[l&&de(h,{sx:{display:"flex",justifyContent:w?"flex-start":"center",px:w?1.5:0,height:56,alignItems:"center"},children:de(Io,{iconOnly:!0,variant:"ghost",size:"small",onClick:()=>y(e=>!e),"aria-label":w?"Collapse menu":"Expand menu",children:de(Qn,{size:"small",sx:{color:"inherit"},children:de(w?Lt:Pt,{})})})}),c&&de(h,{sx:{px:w?2:1,py:1,flexShrink:0},children:de(Io,{variant:"primary-light",size:"medium",onClick:c.onClick,"aria-label":c.label||"Action",startIcon:c.icon?de(Qn,{size:"small",sx:{color:"inherit"},children:c.icon}):void 0,sx:{width:w?"100%":56,borderRadius:w?"28px":"var(--Style-Border-Radius)",justifyContent:w?"flex-start":"center",transition:"all 0.2s ease"},children:w?c.label:null})}),de(h,{role:"tablist","aria-orientation":"vertical",sx:{flex:1,overflowY:"auto",overflowX:"hidden",display:"flex",flexDirection:"column",alignItems:"center",gap:w?0:"var(--Sizing-1-and-Half, 12px)",px:w?0:"var(--Sizing-1, 8px)",width:"100%"},children:(()=>{if(t&&t.length>0){const e=[];let r=0;return t.forEach((t,n)=>{n>0&&e.push(de(h,{"aria-hidden":"true",sx:{height:"1px",width:"100%",backgroundColor:"var(--Border-Variant)"}},"divider-"+n)),t.items.forEach(t=>{const n=r;e.push(de(il,{item:t,selected:k===n,expanded:w,labelStyle:u,onClick:()=>B(n)},"item-"+n)),r++})}),e}return e.map((e,t)=>de(il,{item:e,selected:k===t,expanded:w,labelStyle:u,onClick:()=>B(t)},t))})()})]})}function il({item:e,selected:t,expanded:r,labelStyle:n,onClick:o}){const{icon:i,avatar:a,label:l,badge:s,disabled:d}=e,c=t?"var(--Button)":"transparent",u=t||r?"var(--Text)":"var(--Quiet)",p="outside"!==n,m=p&&!r,f=d?{}:{"&:hover":{backgroundColor:"var(--Hover)","& .rail-item-label":{color:"var(--Text)"}},"&:active":{backgroundColor:"var(--Pressed)","& .rail-item-label":{color:"var(--Text)"}},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"-3px","& .rail-item-label":{color:"var(--Text)"}}};return ce(h,{component:"button",type:"button",role:"tab","aria-selected":t,"aria-label":l,"aria-disabled":d||void 0,disabled:d||void 0,onClick:d?void 0:o,className:"rail-item"+(t?" rail-item-selected":""),sx:{display:"flex",flexDirection:r?"row":"column",alignItems:"center",justifyContent:r?"flex-start":"center",gap:r?"var(--Sizing-1-and-Half, 12px)":"2px",width:r?"100%":44,minWidth:r?void 0:tl,minHeight:tl,px:r?2.5:0,py:m?rl:0,border:t&&m?"1px solid var(--Border)":"1px solid transparent",borderRadius:r?0:"8px",backgroundColor:m||r?c:"transparent",boxShadow:t&&m?"var(--Shadow-1, none)":"none",color:"inherit",cursor:d?"not-allowed":"pointer",opacity:d?"calc(var(--Disabled, 38) / 100)":1,fontFamily:"inherit",textAlign:r?"left":"center",transition:"background-color 0.15s ease, color 0.15s ease",outline:"none",...m||r?f:{}},children:[ce(h,{sx:{position:"relative",display:"flex",alignItems:"center",justifyContent:"center",...r?{flexShrink:0}:{width:p?"100%":nl,height:p?"auto":nl,py:p?rl:0,borderRadius:p?"8px":nl,backgroundColor:p?"transparent":c,border:!p&&t?"1px solid var(--Border)":void 0,transition:"background-color 0.2s ease",...p?{}:f}},children:[a?de(h,{sx:{display:"flex",width:tl,height:tl},children:a}):de(Qn,{size:"small",sx:{color:"inherit"},children:i}),s&&de(al,{value:s})]}),l&&de(h,{sx:{display:"flex",alignItems:"flex-start",justifyContent:"center",width:"100%"},children:de(yn,{className:"rail-item-label",style:{color:u,textAlign:"center",whiteSpace:r?"nowrap":"normal",overflow:"hidden",textOverflow:"ellipsis",...r?{flex:1}:{maxWidth:"100%"}},children:l})})]})}function al({value:e}){return de(h,{sx:{position:"absolute",top:-4,right:-6,minWidth:16,height:16,borderRadius:"8px",backgroundColor:"var(--Tags-Error-BG)",color:"var(--Tags-Error-Text)",fontSize:"10px",fontWeight:700,px:.5,display:"flex",alignItems:"center",justifyContent:"center",lineHeight:1},children:e})}const ll=[{icon:de(Be,{}),label:"Home"},{icon:de(Te,{}),label:"Search"},{icon:de(ke,{}),label:"Favorites",badge:3},{icon:de(me,{}),label:"Profile"},{icon:de(Ce,{}),label:"Settings"}];function sl({label:e,selected:t,onClick:r}){return de(Io,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function dl(){const[e,t]=r(!0),[n,o]=r("partial"),[i,a]=r(!1),[l,s]=r(null),[d,c]=r("Surface");return ce(h,{sx:{pb:8},children:[de(qr,{children:"Rail"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[ce(ui,{theme:l,surface:d,sx:{minHeight:400,alignItems:"stretch",p:0},children:[de(ol,{items:ll,expandable:e,expandedWidth:n,fabAction:i?{icon:de(At,{}),label:"Create",onClick:()=>{}}:void 0}),de(h,{sx:{flex:1,p:3},children:de(ln,{style:{color:"var(--Quiet)"},children:"Main content area"})})]}),de(ji,{code:(()=>{const t=["items={items}"];return e&&(t.push("expandable"),"partial"!==n&&t.push('expandedWidth="full"')),i&&t.push('fabAction={{ icon: <AddIcon />, label: "Create", onClick: handleCreate }}'),t.push("value={activeIndex}"),t.push("onChange={setActiveIndex}"),"<Rail\n "+t.join("\n ")+"\n/>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(li,{defaultValue:0,variant:"standard",color:"primary",children:[ce(si,{children:[de(di,{children:"Playground"}),de(di,{children:"Accessibility"})]}),de(ci,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(fi,{theme:l,onThemeChange:s,surface:d,onSurfaceChange:c})}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"EXPANDED WIDTH"}),de(B,{direction:"row",spacing:1,children:["partial","full"].map(e=>{return de(sl,{label:(t=e,t?t.charAt(0).toUpperCase()+t.slice(1):""),selected:n===e,onClick:()=>o(e)},e);var t})})]}),ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Expandable"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Toggle between collapsed and expanded"})]}),de(na,{variant:"default-outline",checked:e,onChange:e=>t(e.target.checked),size:"small","aria-label":"Expandable"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"FAB Action"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Show create button at top"})]}),de(na,{variant:"default-outline",checked:i,onChange:e=>a(e.target.checked),size:"small","aria-label":"FAB action"})]})]})}),de(ci,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Nav",value:'<nav role="navigation" aria-label="Navigation rail">'},{label:"Items",value:'role="tab" aria-selected on each item'},{label:"TabList",value:'role="tablist" aria-orientation="vertical"'},{label:"Toggle",value:'aria-label="Expand/Collapse menu"'},{label:"Focus",value:"outline: 3px solid var(--Focus-Visible); outline-offset: -3px"},{label:"Badge",value:"Visual only — announced via aria-label on parent item"}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ln,{children:[e,":"]}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}const cl={default:{theme:"Default"},primary:{theme:"Primary"},"primary-light":{theme:"Primary",surface:"Surface-Brightest"},white:{theme:"Neutral",surface:"Surface-Brightest"},black:{theme:"Neutral",surface:"Surface-Dimmest"}};function ul({items:e=[],value:t,defaultValue:n,onChange:o,type:a="floating",orientation:l="horizontal",color:s="default",fab:d,className:c="",sx:u={},...p}){const[m,f]=r(n??null),g=void 0!==t,x=g?t:m,b=i(e=>{const t=x===e?null:e;g||f(t),o?.(t)},[g,x,o]),v=cl[s]||cl.default,y=v.theme,S=v.surface,k="vertical"===l,B="floating"===a,w=de(h,{role:"toolbar","aria-orientation":l,"aria-label":"Toolbar","data-theme":y,"data-surface":S||"Surface",className:"toolbar toolbar-"+a+" toolbar-"+l+" toolbar-"+s+" "+c,sx:{display:"inline-flex",flexDirection:k?"column":"row",alignItems:"center",gap:"4px",backgroundColor:"var(--Background)",border:"1px solid var(--Border-Variant)",borderRadius:B?"56px":"var(--Style-Border-Radius)",padding:B?"8px 16px":"8px",fontFamily:"inherit",flexShrink:0,...B&&{boxShadow:oo},...u},...p,children:e.map((e,t)=>{const r=x===t;return de(Io,{iconOnly:!0,variant:r?"default":"ghost",size:"small",onClick:()=>b(t),"aria-label":e.label,"aria-checked":r,role:"radio",children:de(Qn,{size:"small",sx:{color:"inherit"},children:e.icon})},e.key||t)})});return d&&B?ce(h,{sx:{display:"inline-flex",flexDirection:k?"column":"row",alignItems:"center",gap:1},children:[w,de(Io,{iconOnly:!0,variant:"default",size:"large",onClick:d.onClick,"aria-label":d.label||"Action",sx:{borderRadius:"50%",width:56,height:56,minWidth:"unset",minHeight:"unset"},children:de(Qn,{size:"medium",sx:{color:"inherit"},children:d.icon})})]}):w}const pl=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",hl=[{icon:de(Mt,{}),label:"Bold"},{icon:de(Wt,{}),label:"Italic"},{icon:de(Ot,{}),label:"Underline"},{icon:de(Dt,{}),label:"Align left"},{icon:de(Ft,{}),label:"Align center"}];function ml({label:e,selected:t,onClick:r}){return de(Io,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function fl(){const[e,t]=r("floating"),[n,o]=r("default"),[i,a]=r("horizontal"),[l,s]=r(!1),[d,c]=r(null),[u,p]=r("Surface");return ce(h,{sx:{pb:8},children:[de(qr,{children:"Toolbar"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ui,{theme:d,surface:u,sx:{minHeight:200},children:de(ul,{items:hl,type:e,color:n,orientation:i,fab:l&&"floating"===e?{icon:de(At,{}),label:"Create",onClick:()=>{}}:void 0})}),de(ji,{code:(()=>{const t=["items={items}"];return"floating"!==e&&t.push('type="contextual"'),"default"!==n&&t.push('color="'+n+'"'),"horizontal"!==i&&t.push('orientation="vertical"'),l&&t.push('fab={{ icon: <AddIcon />, label: "Create", onClick: handleCreate }}'),t.push("value={selected}"),t.push("onChange={setSelected}"),"<Toolbar\n "+t.join("\n ")+"\n/>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(li,{defaultValue:0,variant:"standard",color:"primary",children:[ce(si,{children:[de(di,{children:"Playground"}),de(di,{children:"Accessibility"})]}),de(ci,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(fi,{theme:d,onThemeChange:c,surface:u,onSurfaceChange:p})}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"TYPE"}),de(B,{direction:"row",spacing:1,children:["floating","contextual"].map(r=>de(ml,{label:pl(r),selected:e===r,onClick:()=>t(r)},r))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:["default","primary","primary-light","white","black"].map(e=>de(ml,{label:pl(e),selected:n===e,onClick:()=>o(e)},e))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"ORIENTATION"}),de(B,{direction:"row",spacing:1,children:["horizontal","vertical"].map(e=>de(ml,{label:pl(e),selected:i===e,onClick:()=>a(e)},e))})]}),"floating"===e&&ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"FAB Button"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Add FAB to the right of toolbar"})]}),de(na,{variant:"default-outline",checked:l,onChange:e=>s(e.target.checked),size:"small","aria-label":"FAB button"})]})]})}),de(ci,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Role",value:'role="toolbar" aria-orientation aria-label'},{label:"Items",value:'role="radio" aria-checked on each icon button'},{label:"Selection",value:"Toggle — click selected again to deselect"},{label:"Focus",value:"Uses Button component focus styles"},{label:"Floating",value:"borderRadius 56px, padding 16px, Effect-Level-2 shadow"},{label:"Contextual",value:"Standard border-radius, padding 8px, no shadow"}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ln,{children:[e,":"]}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}const gl={small:{height:"var(--Small-Button-Height)",fontSize:"13px",padding:"4px 8px",iconSize:16,btnSize:28},medium:{height:"var(--Button-Height)",fontSize:"14px",padding:"6px 12px",iconSize:18,btnSize:36},large:{height:"var(--Large-Button-Height)",fontSize:"16px",padding:"8px 16px",iconSize:20,btnSize:44}};function xl({value:e,defaultValue:t=0,onChange:n,min:l,max:s,step:d=1,variant:c="outlined",style:u="outline",color:p="default",size:m="medium",label:f,labelPosition:g="top",placeholder:x,helperText:b,disabled:v=!1,fullWidth:y=!1,className:S="",sx:k={},...B}){const[w,C]=r(t),[T,I]=r(!1),A=o(null),z=void 0!==e,R=z?e:w,E=""!==R&&null!=R,P=(L="default"===p?"primary":p).charAt(0).toUpperCase()+L.slice(1);var L;const M="default"===p?"var(--Border)":"var(--Buttons-"+P+"-Border)",W="default"===p?"var(--Background)":"var(--Buttons-"+P+"-Light-Button, var(--Background))",O="default"===p?"var(--Text)":"var(--Text-"+P+")",D="outlined"===c,F="floating"===g,N="top"===g,H=gl[m]||gl.medium,V="small"===m?ln:cn,Q=i(e=>{let t="number"==typeof e?e:parseFloat(e);isNaN(t)&&(t=0),void 0!==l&&t<l&&(t=l),void 0!==s&&t>s&&(t=s),z||C(t),n?.(t)},[z,n,l,s]),j=o(R);j.current=R;const G=i(e=>{if(v)return;const t="number"==typeof j.current?j.current:parseFloat(j.current)||0;void 0!==l&&e<0&&t<=l||void 0!==s&&e>0&&t>=s||Q(t+e*d)},[v,d,l,s,Q]),U=void 0!==l&&R<=l,X=void 0!==s&&R>=s,$=o(null),K=o(null),q=i(()=>{$.current&&(clearTimeout($.current),$.current=null),K.current&&(clearInterval(K.current),K.current=null)},[]),Y=i(e=>{v||(q(),G(e),$.current=setTimeout(()=>{let t=120,r=0;const n=()=>{G(e),r+=1,10===r&&t>60?(clearInterval(K.current),t=60,K.current=setInterval(n,t)):30===r&&t>30&&(clearInterval(K.current),t=30,K.current=setInterval(n,t))};K.current=setInterval(n,t)},400))},[v,G,q]);a(()=>q,[q]);const J=o(!1),Z=e=>({onPointerDown:t=>{if(void 0===t.button||0===t.button){t.preventDefault();try{t.currentTarget.setPointerCapture?.(t.pointerId)}catch(e){}J.current=!0,Y(e)}},onClick:()=>{J.current?J.current=!1:G(e)},onPointerUp:e=>{try{e.currentTarget.releasePointerCapture?.(e.pointerId)}catch(e){}q()},onPointerCancel:q,onPointerLeave:q,onKeyDown:t=>{"Enter"!==t.key&&" "!==t.key||t.repeat||(t.preventDefault(),Y(e))},onKeyUp:e=>{"Enter"!==e.key&&" "!==e.key||q()},onBlur:q}),_=e=>{const t=e.target.value;if(""===t||"-"===t)return void(z||C(t));const r=parseFloat(t);isNaN(r)||Q(r)},ee=e=>{"ArrowUp"===e.key&&(e.preventDefault(),G(1)),"ArrowDown"===e.key&&(e.preventDefault(),G(-1))},te={display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:"transparent",color:"default"===p?"var(--Text)":"var(--Text-"+P+")",cursor:"pointer",outline:"none",flexShrink:0,border:"none",padding:0,borderRadius:"var(--Button-Icon-Radius, 0)",transition:"background-color 0.15s ease","&:hover:not(:disabled)":{backgroundColor:"var(--Hover)"},"&:active:not(:disabled)":{backgroundColor:"var(--Pressed)"},"&:focus-visible":{outline:"none",boxShadow:"inset 0 0 0 1px var(--Focus-Visible)"},"&:disabled":{opacity:"var(--Disabled, 0.38)",cursor:"not-allowed"}},re={},ne=()=>N&&f?de(V,{component:"label",style:{display:"block",marginBottom:"6px",color:v?"var(--Quiet)":"var(--Text)",fontWeight:500,opacity:v?.6:1},children:f}):null;return ce(h,D?{className:"numberfield numberfield-outlined"+(v?" numberfield-disabled":"")+(S?" "+S:""),sx:{width:y?"100%":"auto",fontFamily:"inherit",...k},...B,children:[ne(),de(h,{sx:{border:"1px solid "+M,borderRadius:"small"===m?"var(--Sm-Input-Radius, var(--Input-Radius, var(--Style-Border-Radius)))":"large"===m?"var(--Lg-Input-Radius, var(--Input-Radius, var(--Style-Border-Radius)))":"var(--Input-Radius, var(--Style-Border-Radius))",overflow:"hidden",transition:"border-color 0.15s ease",boxShadow:"none",opacity:v?.5:1,"&:focus-within":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"}},children:de(h,{...re,children:ce(h,{sx:{position:"relative",display:"flex",alignItems:"stretch",minHeight:"max("+H.height+", calc(var(--Sizing-3, 24px) * 2 + 1px))",backgroundColor:W},children:[F&&f&&de(h,{sx:{position:"absolute",top:E||T?"6px":"50%",left:H.padding.split(" ")[1]||"14px",transform:E||T?"none":"translateY(-50%)",transformOrigin:"top left",color:T?O:"var(--Quiet)",fontFamily:"var(--Font-Families-Body, var(--Body-Font-Family))",...E||T?{fontSize:"var(--"+(Xo[m]||Xo.medium).shrunk+"-Font-Size)",fontWeight:"var(--"+(Xo[m]||Xo.medium).shrunk+"-Font-Weight)",letterSpacing:"var(--"+(Xo[m]||Xo.medium).shrunk+"-Letter-Spacing)"}:{fontSize:"var(--"+(Xo[m]||Xo.medium).resting+"-Font-Size)",fontWeight:"var(--"+(Xo[m]||Xo.medium).resting+"-Font-Weight)",letterSpacing:"var(--"+(Xo[m]||Xo.medium).resting+"-Letter-Spacing)"},pointerEvents:"none",transition:"top 0.15s ease, font-size 0.15s ease, color 0.15s ease",zIndex:1},children:f}),de(h,{component:"input",ref:A,type:"text",inputMode:"numeric",role:"spinbutton","aria-valuenow":"number"==typeof R?R:void 0,"aria-valuemin":l,"aria-valuemax":s,"aria-label":f||"Number",value:R,onChange:_,onKeyDown:ee,onFocus:()=>I(!0),onBlur:()=>I(!1),disabled:v,placeholder:F?void 0:x||"",sx:{flex:1,border:"none",outline:"none",backgroundColor:"transparent",color:E||T?O:"var(--Quiet)",fontSize:H.fontSize,fontFamily:"var(--Body-Font-Family)",fontWeight:"var(--Body-Font-Weight)",padding:F?"22px 14px 6px":H.padding,minWidth:0,"&::placeholder":{color:"var(--Quiet)",opacity:1},"&:disabled":{cursor:"not-allowed"}}}),ce(h,{sx:{display:"flex",flexDirection:"column",justifyContent:"center",alignItems:"stretch",borderLeft:"1px solid "+M,flexShrink:0},children:[de(h,{component:"button",type:"button","aria-label":"Increase",...Z(1),disabled:v||X,sx:{...te,width:"var(--Sizing-4, 32px)",height:"var(--Sizing-3, 24px)"},children:de(Qn,{size:"medium",children:de(Nt,{})})}),de(h,{"aria-hidden":"true",sx:{height:"1px",backgroundColor:M,flexShrink:0}}),de(h,{component:"button",type:"button","aria-label":"Decrease",...Z(-1),disabled:v||U,sx:{...te,width:"var(--Sizing-4, 32px)",height:"var(--Sizing-3, 24px)"},children:de(Qn,{size:"medium",children:de(Ht,{})})})]})]})})}),b&&de(ln,{style:{color:"var(--Quiet)",marginTop:"4px",marginLeft:"2px"},children:b})]}:{className:"numberfield numberfield-spinner"+(v?" numberfield-disabled":"")+(S?" "+S:""),sx:{fontFamily:"inherit",...k},...B,children:[ne(),ce(h,{sx:{display:"inline-flex",alignItems:"center",gap:"small"===m?.5:1,opacity:v?.5:1},children:[de(h,{component:"button",type:"button","aria-label":"Decrease",...Z(-1),disabled:v||U,sx:{...te,width:H.btnSize,height:H.btnSize,borderRadius:"small"===m?"var(--Sm-Button-Icon-Radius, var(--Button-Icon-Radius, var(--Style-Border-Radius)))":"large"===m?"var(--Lg-Button-Icon-Radius, var(--Button-Icon-Radius, var(--Style-Border-Radius)))":"var(--Button-Icon-Radius, var(--Style-Border-Radius))",border:"1px solid "+M},children:de(Qn,{size:"small",children:de(fe,{})})}),de(h,{sx:{border:"1px solid "+M,borderRadius:"small"===m?"var(--Sm-Input-Radius, var(--Input-Radius, var(--Style-Border-Radius)))":"large"===m?"var(--Lg-Input-Radius, var(--Input-Radius, var(--Style-Border-Radius)))":"var(--Input-Radius, var(--Style-Border-Radius))",overflow:"hidden","&:focus-within":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"}},children:de(h,{...re,children:de(h,{component:"input",ref:A,type:"text",inputMode:"numeric",role:"spinbutton","aria-valuenow":"number"==typeof R?R:void 0,"aria-valuemin":l,"aria-valuemax":s,"aria-label":f||"Number",value:R,onChange:_,onKeyDown:ee,onFocus:()=>I(!0),onBlur:()=>I(!1),disabled:v,sx:{width:"small"===m?40:56,minHeight:H.height,textAlign:"center",border:"none",outline:"none",backgroundColor:"var(--Hover)",color:"var(--Text)",fontSize:H.fontSize,fontFamily:"var(--Body-Font-Family)",fontWeight:600,"&:disabled":{cursor:"not-allowed"}}})})}),de(h,{component:"button",type:"button","aria-label":"Increase",...Z(1),disabled:v||X,sx:{...te,width:H.btnSize,height:H.btnSize,borderRadius:"small"===m?"var(--Sm-Button-Icon-Radius, var(--Button-Icon-Radius, var(--Style-Border-Radius)))":"large"===m?"var(--Lg-Button-Icon-Radius, var(--Button-Icon-Radius, var(--Style-Border-Radius)))":"var(--Button-Icon-Radius, var(--Style-Border-Radius))",border:"1px solid "+M},children:de(Qn,{size:"small",children:de(At,{})})})]}),b&&de(ln,{style:{color:"var(--Quiet)",marginTop:"4px",marginLeft:"2px"},children:b})]})}const bl=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",vl=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}];function yl({label:e,selected:t,onClick:r}){return de(Io,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function Sl({color:e,selected:t,onClick:r}){const n=bl(e);return de(h,{component:"button",onClick:()=>r(e),"aria-label":"Select "+n,"aria-pressed":t,title:n,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+n+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Buttons-"+n+"-Text)",pointerEvents:"none"}})})}function kl(){const[e,t]=r("outlined"),[n,o]=r("outline"),[i,a]=r("default"),[l,s]=r("medium"),[d,c]=r("top"),[u,p]=r(!0),[m,f]=r(!1),[g,x]=r(!1),[b,v]=r(null),[y,S]=r("Surface");return ce(h,{sx:{pb:8},children:[de(qr,{children:"Number Field"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ui,{theme:b,surface:y,children:de(h,{sx:{width:"100%",maxWidth:"outlined"===e?300:"auto"},children:de(xl,{variant:e,style:n,color:i,size:l,label:u?"Quantity":void 0,labelPosition:d,min:0,max:100,disabled:m,fullWidth:g&&"outlined"===e})})}),de(ji,{code:(()=>{const t=['variant="'+e+'"'];return"outline"!==n&&t.push('style="'+n+'"'),"default"!==i&&t.push('color="'+i+'"'),"medium"!==l&&t.push('size="'+l+'"'),u&&t.push('label="Quantity"'),"top"!==d&&t.push('labelPosition="'+d+'"'),t.push("min={0}"),t.push("max={100}"),m&&t.push("disabled"),g&&"outlined"===e&&t.push("fullWidth"),t.push("value={value}"),t.push("onChange={setValue}"),"<NumberField\n "+t.join("\n ")+"\n/>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(li,{defaultValue:0,variant:"standard",color:"primary",children:[ce(si,{children:[de(di,{children:"Playground"}),de(di,{children:"Accessibility"})]}),de(ci,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(fi,{theme:b,onThemeChange:v,surface:y,onSurfaceChange:S})}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"VARIANT"}),de(B,{direction:"row",spacing:1,children:["outlined","spinner"].map(r=>de(yl,{label:bl(r),selected:e===r,onClick:()=>t(r)},r))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"STYLE"}),de(B,{direction:"row",spacing:1,children:["outline","light"].map(e=>de(yl,{label:bl(e),selected:n===e,onClick:()=>o(e)},e))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:vl.map(e=>ce(h,{children:[de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:e.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:e.colors.map(e=>de(Sl,{color:e,selected:i===e,onClick:a},e))})]},e.label))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",spacing:1,children:["small","medium","large"].map(e=>de(yl,{label:bl(e),selected:l===e,onClick:()=>s(e)},e))})]}),"outlined"===e&&ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"LABEL"}),de(B,{direction:"row",spacing:1,children:["top","floating","none"].map(e=>de(yl,{label:"none"===e?"None":bl(e),selected:d===e,onClick:()=>c(e)},e))})]}),ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Show Label"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Text label above field"})]}),de(na,{variant:"default-outline",checked:u,onChange:e=>p(e.target.checked),size:"small","aria-label":"Show label"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Disabled"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Non-interactive state"})]}),de(na,{variant:"default-outline",checked:m,onChange:e=>f(e.target.checked),size:"small","aria-label":"Disabled"})]}),"outlined"===e&&ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Full Width"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Stretch to container"})]}),de(na,{variant:"default-outline",checked:g,onChange:e=>x(e.target.checked),size:"small","aria-label":"Full width"})]})]})}),de(ci,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Role",value:'role="spinbutton" with aria-valuenow, aria-valuemin, aria-valuemax'},{label:"Label",value:"aria-label from label prop. Always provide a label."},{label:"Keyboard",value:"ArrowUp/Down increment/decrement. Direct text entry supported."},{label:"Steppers",value:'aria-label="Increase" / "Decrease" on stepper buttons'},{label:"Focus",value:"outline: 2px solid var(--Focus-Visible); outline-offset: 2px"},{label:"Disabled",value:"HTML disabled. Steppers also disabled at min/max bounds."}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ln,{children:[e,":"]}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}function Bl({children:e,selected:t=!1,onChange:r,value:n,sx:o={},...i}){return de(R,{value:n,selected:t,onChange:r,sx:{border:"1px solid var(--Border)",color:"var(--Text)",backgroundColor:t?"var(--Buttons-Primary-Button)":"transparent","&:hover":{backgroundColor:t?"var(--Buttons-Primary-Button)":"var(--Container-High)"},"&.Mui-selected":{backgroundColor:"var(--Buttons-Primary-Button)",color:"#fff","&:hover":{backgroundColor:"var(--Buttons-Primary-Button)"}},textTransform:"none",fontWeight:500,...o},...i,children:e})}const wl=["default","primary","secondary","tertiary","neutral","black-white","info","success","warning","error"],Cl=["fill","outline","ghost"];function Tl(){const e={};return wl.forEach(t=>{Cl.forEach(r=>{e["fill"===r?t:t+"-"+r]=function(e,t){const r=uo(e),n={color:e,style:t,bg:"transparent",text:"var(--Quiet)",hover:"var(--Buttons-"+r+"-Hover)",hoverText:"var(--Buttons-"+r+"-Text)"};return"ghost"===t?{...n,border:"transparent",selectedBg:"transparent",selectedText:"var(--Buttons-"+r+"-Border)",selectedRing:"inset 0 0 0 2px var(--Buttons-"+r+"-Border)",bevel:!1}:"outline"===t?{...n,border:"var(--Buttons-"+r+"-Border)",selectedBg:"transparent",selectedText:"var(--Buttons-"+r+"-Border)",selectedRing:"inset 0 0 0 2px var(--Buttons-"+r+"-Border)",bevel:!1}:{...n,border:"var(--Buttons-"+r+"-Border)",selectedBg:"var(--Buttons-"+r+"-Button)",selectedText:"var(--Buttons-"+r+"-Text)",selectedRing:null,bevel:!0}}(t,r)})}),e}const Il={small:{height:"var(--Small-Button-Height)",fontSize:"13px",padding:"4px 10px",iconSize:16,gap:4,swatchRadius:"var(--Sm-Input-Swatch-Radius, 18px)"},medium:{height:"var(--Button-Height)",fontSize:"15px",padding:"6px 14px",iconSize:18,gap:6,swatchRadius:"var(--Input-Swatch-Radius, 26px)"},large:{height:"var(--Large-Button-Height)",fontSize:"17px",padding:"8px 18px",iconSize:20,gap:8,swatchRadius:"var(--Lg-Input-Swatch-Radius, 50px)"}};function Al({variant:e="primary",size:t="medium",value:r,defaultValue:n,onChange:o,exclusive:i=!0,orientation:a="horizontal",disabled:l=!1,fullWidth:s=!1,children:d,className:c="",sx:u={},"aria-label":p,...h}){const m=Tl(),f=m[e]||m.default,g=Il[t]||Il.medium,x="vertical"===a,b={gap:0,border:"ghost"===f.style?"none":"1px solid "+f.border,borderRadius:"var(--Style-Border-Radius)",overflow:"hidden",...s&&{width:"100%"},display:"grid",gridAutoFlow:x?"row":"column",...x?{gridAutoRows:"1fr"}:{gridAutoColumns:"1fr"},"& .MuiToggleButtonGroup-grouped":{margin:0,borderLeft:0,borderTop:0,"&.Mui-selected + &.Mui-selected":{marginLeft:0,marginTop:0,borderLeft:0,borderTop:0}},"& .MuiToggleButton-root":{height:g.height,fontSize:g.fontSize,padding:g.padding,fontFamily:"inherit",fontWeight:500,textTransform:"none",letterSpacing:"0",lineHeight:1.4,backgroundColor:f.bg,color:f.text,border:"none",borderRadius:0,transition:"background-color 0.15s ease, color 0.15s ease","& .tbtn-start, & .tbtn-end":{display:"inline-flex",alignItems:"center",flexShrink:0,"& > *":{width:g.iconSize,height:g.iconSize,display:"block"}},"& .tbtn-start":{marginRight:"2px"},"& .tbtn-end":{marginLeft:"2px"},"& .tbtn-swatch":{display:"block",flexShrink:0,width:g.iconSize,height:g.iconSize,borderRadius:g.swatchRadius,border:"1px solid var(--Border-Variant)"},"& .tbtn-swatch:not(:only-child)":{marginRight:"2px"},"--_height":g.height,"--_bevel":"var(--Button-Bevel-Px, min(calc(var(--Button-Bevel, 0) * var(--_height) / 100), calc(var(--_height) / 5)))",...s&&{flex:1},..."ghost"===f.style?{}:x?{"&:not(:last-of-type)":{borderBottom:"1px solid "+f.border}}:{"&:not(:last-of-type)":{borderRight:"1px solid "+f.border}},"&:hover":{backgroundColor:f.hover,color:f.hoverText},"&.Mui-selected":{backgroundColor:f.selectedBg,color:f.selectedText,...f.bevel?{boxShadow:ho(f.color)}:{},...f.selectedRing?{boxShadow:f.selectedRing}:{}},"&.Mui-selected:hover":{backgroundColor:f.selectedBg,color:f.selectedText,...f.bevel?{boxShadow:ho(f.color)}:{},...f.selectedRing?{boxShadow:f.selectedRing}:{}},"&.Mui-focusVisible":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"-2px",zIndex:1},"&.Mui-disabled":{opacity:.6,color:f.text,backgroundColor:f.bg},"&.Mui-disabled.Mui-selected":{opacity:.6,backgroundColor:f.selectedBg,color:f.selectedText},"& .MuiSvgIcon-root":{fontSize:g.iconSize},"& > *:not(:only-child)":{marginRight:g.gap/2,marginLeft:g.gap/2}},...u};return de(E,{value:r,defaultValue:n,onChange:o,exclusive:i,orientation:a,disabled:l,className:"toggle-group-"+e+" "+c,sx:b,"aria-label":p,...h,children:d})}const zl=e=>de(Al,{variant:"default",...e}),Rl=e=>de(Al,{variant:"primary",...e}),El=e=>de(Al,{variant:"secondary",...e}),Pl=e=>de(Al,{variant:"tertiary",...e}),Ll=e=>de(Al,{variant:"neutral",...e}),Ml=e=>de(Al,{variant:"black-white",...e}),Wl=e=>de(Al,{variant:"info",...e}),Ol=e=>de(Al,{variant:"success",...e}),Dl=e=>de(Al,{variant:"warning",...e}),Fl=e=>de(Al,{variant:"error",...e});function Nl({label:e,value:t="",onChange:n,placeholder:o,error:i=!1,errorMessage:a="",disabled:l=!1,helperText:s="",variant:d="outlined",size:c="medium",type:u="text",required:p=!1,fullWidth:m=!0,startAdornment:f,endAdornment:g,sx:x={},"aria-label":b,"aria-labelledby":v,onFocus:B,onBlur:w,...C}){const[T,I]=r(!1),A=i?"var(--Buttons-Error-Border)":T?"var(--Buttons-Primary-Border)":"var(--Border)",z=i||T?"var(--Text)":"var(--Text-Quiet)",R="var(--Text)";return ce(h,{sx:{width:m?"100%":"auto"},children:[de(y,{label:e,value:t,onChange:n,placeholder:o,disabled:l,variant:d,size:c,type:u,required:p,onFocus:e=>{I(!0),B?.(e)},onBlur:e=>{I(!1),w?.(e)},error:i,fullWidth:m,slotProps:{htmlInput:{...b?{"aria-label":b}:{},...v?{"aria-labelledby":v}:{}},input:{"data-surface":l?"Container-Low":"Container",style:{color:R},startAdornment:f?de(S,{position:"start",children:f}):void 0,endAdornment:g?de(S,{position:"end",children:g}):void 0}},sx:{width:m?"100%":"auto","& .MuiOutlinedInput-root":{backgroundColor:"var(--Background)",transition:"all 0.2s ease-in-out",color:R,"& fieldset":{borderColor:A,transition:"border-color 0.2s ease-in-out"},"&:hover fieldset":{borderColor:i?"var(--Buttons-Error-Border)":"var(--Buttons-Primary-Border)"},"&.Mui-focused fieldset":{borderColor:i?"var(--Buttons-Error-Border)":"var(--Buttons-Primary-Border)",borderWidth:"2px"},"&.Mui-disabled":{backgroundColor:"var(--Background)",opacity:.6}},"& .MuiInputLabel-root":{color:z,transition:"all 0.2s ease-in-out",fontSize:"14px",fontWeight:500,"&.Mui-focused":{color:"var(--Text)",fontWeight:600},"&.Mui-error":{color:"var(--Text)"},"&.Mui-disabled":{color:"var(--Text-Secondary)",opacity:.6}},"& .MuiFormHelperText-root":{color:i?"var(--Buttons-Error-Border)":"var(--Text-Secondary)",marginTop:"4px",fontSize:"12px"},...x},...C}),i&&a&&de(k,{error:!0,sx:{color:"var(--Buttons-Error-Border)",marginTop:"4px",fontSize:"12px",fontWeight:500},children:a})]})}function Hl({label:e="Email",...t}){return de(Nl,{label:e,type:"email",placeholder:"user@example.com",...t})}function Vl({label:e="Password",...t}){return de(Nl,{label:e,type:"password",...t})}function Ql({label:e="Search",placeholder:t="Type to search...",...r}){return de(Nl,{label:e,type:"search",placeholder:t,...r})}function jl({label:e="Number",...t}){return de(Nl,{label:e,type:"number",...t})}function Gl({label:e="Phone",placeholder:t="(555) 123-4567",...r}){return de(Nl,{label:e,type:"tel",placeholder:t,...r})}function Ul({label:e="Website",placeholder:t="https://example.com",...r}){return de(Nl,{label:e,type:"url",placeholder:t,...r})}function Xl({error:e=!1,errorMessage:t="",rows:r=4,fullWidth:n=!0,...o}){return de(Yo,{multiline:!0,rows:r,fullWidth:n,...e&&{validation:"error",validationMessage:t},...o})}function $l({fields:e=[],spacing:t=2,sx:r={},...n}){return de(h,{sx:{display:"flex",flexDirection:"column",gap:`var(--Spacing-${t})`,width:"100%",...r},...n,children:e.map(e=>de(Nl,{...e},e.id))})}const Kl=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",ql=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}],Yl=[{value:"apple",label:"Apple"},{value:"banana",label:"Banana"},{value:"cherry",label:"Cherry"},{value:"date",label:"Date"},{value:"elderberry",label:"Elderberry"}],Jl=[{value:"primary",label:"Primary",color:"var(--Buttons-Primary-Button)"},{value:"secondary",label:"Secondary",color:"var(--Buttons-Secondary-Button)"},{value:"tertiary",label:"Tertiary",color:"var(--Buttons-Tertiary-Button)"},{value:"neutral",label:"Neutral",color:"var(--Buttons-Neutral-Button)"},{value:"info",label:"Info",color:"var(--Buttons-Info-Button)"},{value:"success",label:"Success",color:"var(--Buttons-Success-Button)"},{value:"warning",label:"Warning",color:"var(--Buttons-Warning-Button)"},{value:"error",label:"Error",color:"var(--Buttons-Error-Button)"}];function Zl({label:e,selected:t,onClick:r}){return de(Io,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function _l({color:e,selected:t,onClick:r}){const n=Kl(e);return de(h,{component:"button",onClick:()=>r(e),"aria-label":"Select "+n,"aria-pressed":t,title:n,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+n+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Buttons-"+n+"-Text)",pointerEvents:"none"}})})}function es(){const[e,t]=r("outline"),[n,o]=r("default"),[i,a]=r("medium"),[l,s]=r("top"),[d,c]=r("Fruit"),[u,p]=r(!1),[m,f]=r(!1),[g,x]=r(!0),[b,v]=r(!1),[y,S]=r("Search"),[k,w]=r(""),[C,T]=r(null),[A,z]=r("Surface"),[R,E]=r(!1),[P,L]=r(!0);return ce(h,{sx:{pb:8},children:[de(qr,{children:"Select"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ui,{theme:C,surface:A,children:de(h,{sx:{width:"100%",maxWidth:360},children:de(ei,{variant:e,color:n,size:i,label:d,labelPosition:l,mode:R?"color":void 0,showColorLabels:R?P:void 0,options:R?Jl:Yl,value:k,onChange:w,showDividers:u,disabled:m,fullWidth:g,startDecoration:b?(()=>{const e=zt[y]||zt.Search;return de(Qn,{size:"small",children:de(e,{})})})():void 0})})}),de(ji,{code:(()=>{const t=[];return"outline"!==e&&t.push('variant="'+e+'"'),"default"!==n&&t.push('color="'+n+'"'),"medium"!==i&&t.push('size="'+i+'"'),d&&t.push('label="'+d+'"'),"top"!==l&&t.push('labelPosition="'+l+'"'),R&&t.push('mode="color"'),R&&!P&&t.push("showColorLabels={false}"),u&&t.push("showDividers"),m&&t.push("disabled"),g&&t.push("fullWidth"),b&&t.push("startDecoration={<Icon><"+y+"Icon /></Icon>}"),t.push("options={options}"),t.push("value={value}"),t.push("onChange={setValue}"),"<Select\n "+t.join("\n ")+"\n/>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(li,{defaultValue:0,variant:"standard",color:"primary",children:[ce(si,{children:[de(di,{children:"Playground"}),de(di,{children:"Accessibility"})]}),de(ci,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(fi,{theme:C,onThemeChange:T,surface:A,onSurfaceChange:z})}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"STYLE"}),de(B,{direction:"row",spacing:1,children:["outline","light"].map(r=>de(Zl,{label:Kl(r),selected:e===r,onClick:()=>t(r)},r))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:ql.map(e=>ce(h,{children:[de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:e.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:e.colors.map(e=>de(_l,{color:e,selected:n===e,onClick:o},e))})]},e.label))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",spacing:1,children:["small","medium","large"].map(e=>de(Zl,{label:Kl(e),selected:i===e,onClick:()=>a(e)},e))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"LABEL"}),de(B,{direction:"row",spacing:1,children:["top","floating","none"].map(e=>de(Zl,{label:"none"===e?"None":Kl(e),selected:l===e,onClick:()=>s(e)},e))})]}),ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Start Icon"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Icon rendered before the value"})]}),de(na,{checked:b,onChange:e=>v(e.target.checked),size:"small","aria-label":"Start icon"})]}),b&&ce(h,{sx:{mt:2},children:[de(Yo,{label:"Icon Name",value:y,onChange:e=>S(e.target.value),placeholder:"Search",variant:"primary-outline",size:"small",fullWidth:!0}),ce(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:4},children:[de("a",{href:"https://mui.com/material-ui/material-icons/",target:"_blank",rel:"noopener noreferrer",style:{color:"var(--Hotlink)"},children:"Material icon"})," name (e.g. Search, Add, Edit, Filter, Sort, Star)"]})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Dividers"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Lines between options"})]}),de(na,{checked:u,onChange:e=>p(e.target.checked),size:"small","aria-label":"Show dividers"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Disabled"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Non-interactive state"})]}),de(na,{checked:m,onChange:e=>f(e.target.checked),size:"small","aria-label":"Disabled"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Color Mode"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Render swatches alongside each option. Swatch size scales to Select height, radius follows the brand's button radius."})]}),de(na,{checked:R,onChange:e=>E(e.target.checked),size:"small","aria-label":"Color mode"})]}),R&&ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Show Color Labels"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Hide to render a swatch-only trigger (no text). Useful for compact color pickers."})]}),de(na,{checked:P,onChange:e=>L(e.target.checked),size:"small","aria-label":"Show color labels"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Full Width"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Stretch to container width"})]}),de(na,{checked:g,onChange:e=>x(e.target.checked),size:"small","aria-label":"Full width"})]})]})}),de(ci,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Trigger",value:'role="combobox" aria-expanded="true|false" aria-haspopup="listbox"'},{label:"Dropdown",value:'role="listbox" aria-label="..."'},{label:"Options",value:'role="option" aria-selected="true|false"'},{label:"Label",value:"aria-label from label prop. Always provide a label."},{label:"Keyboard",value:"Enter/Space opens. Escape closes. Arrow keys when open."},{label:"Focus",value:"outline: 2px solid var(--Focus-Visible); outline-offset: 2px (on outer shell)"}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ln,{children:[e,":"]}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}const ts={small:{height:"var(--Small-Button-Height)",fontSize:"13px",padding:"4px 8px",iconSize:16},medium:{height:"var(--Button-Height)",fontSize:"14px",padding:"6px 12px",iconSize:18},large:{height:"var(--Large-Button-Height)",fontSize:"16px",padding:"8px 16px",iconSize:20}},rs={small:{height:"48px",fontSize:"13px",padding:"20px 12px 4px",leftPad:12},medium:{height:"56px",fontSize:"14px",padding:"22px 14px 6px",leftPad:14},large:{height:"64px",fontSize:"16px",padding:"24px 16px 6px",leftPad:16}};function ns({options:e=[],value:t,defaultValue:n=null,onChange:l,inputValue:s,onInputChange:d,label:c,labelPosition:u="top",placeholder:p="Type to search",helperText:m,size:f="medium",variant:g="outline",color:x="primary",loading:b=!1,loadingText:v="Loading…",noOptionsText:y="No options",freeSolo:S=!1,clearable:k=!0,disabled:B=!1,fullWidth:w=!1,className:C="",sx:T={},...I}){const A=(z="default"===x?"primary":x).charAt(0).toUpperCase()+z.slice(1);var z;const R="var(--Buttons-"+A+"-Border)",E="default"===x?"var(--Text)":"var(--Text-"+A+")",[P,L]=r(n),[M,W]=r(n?"string"==typeof n?n:n.label||"":""),[O,D]=r(!1),[F,N]=r(!1),[H,V]=r(-1),Q=o(null),j=o(null),G=void 0!==t,U=void 0!==s,X=G?t:P,$=U?s:M,K="floating"===u,q="top"===u,Y=""!==$,J=K?rs[f]||rs.medium:ts[f]||ts.medium,Z=$?e.filter(e=>("string"==typeof e?e:e.label).toLowerCase().includes($.toLowerCase())):e,_=i(e=>{U||W(e),d?.(e)},[U,d]),ee=i(e=>{const t="string"==typeof e?e:e.label;G||L(e),_(t),l?.(e),D(!1),V(-1),j.current?.focus()},[G,l,_]);a(()=>{if(!O)return;const e=e=>{Q.current&&!Q.current.contains(e.target)&&D(!1)};return document.addEventListener("mousedown",e),()=>document.removeEventListener("mousedown",e)},[O]);return ce(h,{ref:Q,className:"autocomplete autocomplete-"+f+" autocomplete-variant-"+g+(O?" autocomplete-open":"")+(B?" autocomplete-disabled":"")+(C?" "+C:""),sx:{position:"relative",width:w?"100%":"auto",display:"inline-block",fontFamily:"inherit",...T},...I,children:[q&&c&&de("small"===f?ln:cn,{component:"label",style:{display:"block",marginBottom:"6px",color:B?"var(--Quiet)":"var(--Text)",fontWeight:500,opacity:B?.6:1},children:c}),de(h,{sx:{border:"1px solid "+R,borderRadius:"small"===f?"var(--Sm-Input-Radius, var(--Input-Radius, var(--Style-Border-Radius)))":"large"===f?"var(--Lg-Input-Radius, var(--Input-Radius, var(--Style-Border-Radius)))":"var(--Input-Radius, var(--Style-Border-Radius))",overflow:"hidden",transition:"border-color 0.15s ease",boxShadow:"none",opacity:B?.5:1,"&:focus-within":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"}},children:de(h,{children:ce(h,{sx:{position:"relative",display:"flex",alignItems:"center",minHeight:J.height,backgroundColor:"var(--Hover)"},children:[K&&c&&de(h,{sx:{position:"absolute",top:Y||F?"6px":"50%",left:(J.leftPad||14)+"px",transform:Y||F?"scale(0.75)":"translateY(-50%)",transformOrigin:"top left",color:F?E:"var(--Quiet)",fontSize:J.fontSize,fontWeight:400,pointerEvents:"none",zIndex:1,transition:"top 0.15s ease, transform 0.15s ease, color 0.15s ease"},children:c}),de(h,{component:"input",ref:j,type:"text",role:"combobox","aria-expanded":O,"aria-haspopup":"listbox","aria-autocomplete":"list","aria-label":c||p,autoComplete:"off",value:$,onChange:e=>{_(e.target.value),O||D(!0),V(-1)},onKeyDown:e=>{if("Escape"!==e.key){if("ArrowDown"===e.key){if(e.preventDefault(),!O)return void D(!0);V(e=>Math.min(e+1,Z.length-1))}"ArrowUp"===e.key&&(e.preventDefault(),V(e=>Math.max(e-1,0))),"Enter"===e.key&&O&&H>=0&&Z[H]&&(e.preventDefault(),ee(Z[H]))}else D(!1)},onFocus:()=>{N(!0),D(!0)},onBlur:()=>N(!1),disabled:B,placeholder:K?void 0:p,sx:{flex:1,border:"none",outline:"none",backgroundColor:"transparent",color:Y||F?E:"var(--Quiet)",fontSize:J.fontSize,fontFamily:"var(--Body-Font-Family)",fontWeight:"var(--Body-Font-Weight)",padding:J.padding,minWidth:0,"&::placeholder":{color:"var(--Quiet)",opacity:1,fontFamily:"var(--Body-Font-Family)",fontWeight:"var(--Body-Font-Weight)"},"&:disabled":{cursor:"not-allowed"}}}),b&&O&&de(Vt,{size:16,sx:{mr:1,color:"var(--Quiet)"}}),k&&$&&!B&&de(h,{component:"button",type:"button","aria-label":"Clear",onClick:()=>{G||L(null),_(""),l?.(null),j.current?.focus()},sx:{display:"flex",alignItems:"center",justifyContent:"center",width:20,height:20,borderRadius:"50%",mr:.5,border:"none",backgroundColor:"transparent",color:"var(--Quiet)",cursor:"pointer","&:hover":{color:"var(--Text)",backgroundColor:"var(--Hover)"},"&:focus-visible":{outline:"2px solid var(--Focus-Visible)"}},children:de(Lt,{sx:{fontSize:14}})}),de(h,{component:"button",type:"button","aria-label":O?"Close":"Open",tabIndex:-1,onClick:()=>{B||D(!O)},sx:{display:"flex",alignItems:"center",justifyContent:"center",width:28,height:"100%",border:"none",backgroundColor:"transparent",color:"var(--Quiet)",cursor:B?"not-allowed":"pointer"},children:de(Se,{sx:{fontSize:(J.iconSize||18)+"px",transform:O?"rotate(180deg)":"rotate(0deg)",transition:"transform 0.2s ease"}})})]})})}),m&&de(h,{sx:{fontSize:"12px",color:"var(--Quiet)",mt:"4px",ml:"2px"},children:m}),O&&de(h,{role:"listbox","aria-label":c||"Options",sx:{position:"absolute",top:"100%",left:0,right:0,mt:.5,backgroundColor:"var(--Hover)",border:"1px solid var(--Buttons-Default-Border)",borderRadius:"var(--Style-Border-Radius)",boxShadow:"none",zIndex:9999,maxHeight:240,overflowY:"auto",py:.5},children:b?de(h,{sx:{px:1.5,py:2,textAlign:"center",fontSize:J.fontSize,color:"var(--Quiet)"},children:v}):0===Z.length?de(h,{sx:{px:1.5,py:2,textAlign:"center",fontSize:J.fontSize,color:"var(--Quiet)"},children:y}):Z.map((e,t)=>{const r="string"==typeof e?e:e.label,n="string"==typeof e?e:e.value,o=r===(X?"string"==typeof X?X:X.label:null),i=function(e,t){return t?{backgroundColor:"transparent",color:"var(--Text)",fontWeight:600}:e?{backgroundColor:"var(--Hover)",color:"var(--Text)"}:{backgroundColor:"transparent",color:"var(--Text-Quiet)"}}(t===H,o);return ce(h,{role:"option","aria-selected":o,onClick:()=>ee(e),onMouseEnter:()=>V(t),sx:{display:"flex",alignItems:"center",gap:1,px:1.5,py:0,mx:.5,minHeight:J.height,borderRadius:"4px",cursor:"pointer",fontSize:J.fontSize,fontFamily:"inherit",...i,transition:"background-color 0.1s ease","&:active":{backgroundColor:"var(--Pressed)"}},children:[de(ln,{style:{flex:1,color:"inherit",fontWeight:"inherit"},children:r}),o&&de(Qn,{size:"small",sx:{opacity:.6,flexShrink:0},children:de(he,{})})]},n||r)})})]})}const os=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",is=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}],as=[{value:"apple",label:"Apple"},{value:"banana",label:"Banana"},{value:"cherry",label:"Cherry"},{value:"date",label:"Date"},{value:"elderberry",label:"Elderberry"},{value:"fig",label:"Fig"},{value:"grape",label:"Grape"}];function ls({label:e,selected:t,onClick:r}){return de(Io,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function ss({color:e,selected:t,onClick:r}){const n=os(e);return de(h,{component:"button",onClick:()=>r(e),"aria-label":"Select "+n,"aria-pressed":t,title:n,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+n+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Buttons-"+n+"-Text)",pointerEvents:"none"}})})}function ds(){const[e,t]=r("outline"),[n,o]=r("default"),[i,a]=r("medium"),[l,s]=r("top"),[d,c]=r("Fruit"),[u,p]=r(!0),[m,f]=r(!1),[g,x]=r(!0),[b,v]=r(null),[y,S]=r("Surface");return ce(h,{sx:{pb:8},children:[de(qr,{children:"Autocomplete"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ui,{theme:b,surface:y,children:de(h,{sx:{width:"100%",maxWidth:360},children:de(ns,{variant:e,color:n,size:i,label:d,labelPosition:l,options:as,clearable:u,disabled:m,fullWidth:g})})}),de(ji,{code:(()=>{const t=[];return"outline"!==e&&t.push('variant="'+e+'"'),"default"!==n&&t.push('color="'+n+'"'),"medium"!==i&&t.push('size="'+i+'"'),d&&t.push('label="'+d+'"'),"top"!==l&&t.push('labelPosition="'+l+'"'),u||t.push("clearable={false}"),m&&t.push("disabled"),g&&t.push("fullWidth"),t.push("options={options}"),t.push("onChange={handleChange}"),"<Autocomplete\n "+t.join("\n ")+"\n/>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(li,{defaultValue:0,variant:"standard",color:"primary",children:[ce(si,{children:[de(di,{children:"Playground"}),de(di,{children:"Accessibility"})]}),de(ci,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(fi,{theme:b,onThemeChange:v,surface:y,onSurfaceChange:S})}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"STYLE"}),de(B,{direction:"row",spacing:1,children:["outline","light"].map(r=>de(ls,{label:os(r),selected:e===r,onClick:()=>t(r)},r))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:is.map(e=>ce(h,{children:[de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:e.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:e.colors.map(e=>de(ss,{color:e,selected:n===e,onClick:o},e))})]},e.label))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",spacing:1,children:["small","medium","large"].map(e=>de(ls,{label:os(e),selected:i===e,onClick:()=>a(e)},e))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"LABEL"}),de(B,{direction:"row",spacing:1,children:["top","floating","none"].map(e=>de(ls,{label:"none"===e?"None":os(e),selected:l===e,onClick:()=>s(e)},e))})]}),ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Clearable"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Show clear button when has value"})]}),de(na,{checked:u,onChange:e=>p(e.target.checked),size:"small","aria-label":"Clearable"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Disabled"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Non-interactive state"})]}),de(na,{checked:m,onChange:e=>f(e.target.checked),size:"small","aria-label":"Disabled"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Full Width"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Stretch to container width"})]}),de(na,{checked:g,onChange:e=>x(e.target.checked),size:"small","aria-label":"Full width"})]})]})}),de(ci,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Input",value:'role="combobox" aria-expanded aria-haspopup="listbox" aria-autocomplete="list"'},{label:"Dropdown",value:'role="listbox" aria-label="..."'},{label:"Options",value:'role="option" aria-selected="true|false"'},{label:"Label",value:"aria-label from label prop. Always provide a label."},{label:"Keyboard",value:"Arrow keys navigate, Enter selects, Escape closes."},{label:"Focus",value:"outline: 2px solid var(--Focus-Visible); outline-offset: 2px (on outer shell)"}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ln,{children:[e,":"]}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}const cs=["default","primary","secondary","tertiary","neutral","info","success","warning","error","black-white"],us=uo,ps={small:{touchTarget:24,box:16,dot:8,gap:4,LabelComp:ln},medium:{touchTarget:24,box:20,dot:9.5,gap:8,LabelComp:cn},large:{touchTarget:24,box:24,dot:9.5,gap:12,LabelComp:fn}};function hs({size:e,color:t,checked:r}){const n=us(t),o="Default"===n?"var(--Quiet)":"var(--Buttons-"+n+"-Border)",i="var(--Buttons-"+n+"-Border)",a=ps[e]||ps.medium;return de(h,{className:"radio-circle-icon",sx:{width:a.box,height:a.box,boxSizing:"border-box",borderRadius:"50%",border:"2px solid "+o,overflow:"hidden",flexShrink:0,backgroundColor:"var(--Background)",display:"flex",alignItems:"center",justifyContent:"center",transition:"border-color 0.15s ease-in-out"},children:r&&de(h,{sx:{width:a.dot,height:a.dot,borderRadius:"50%",backgroundColor:i,transition:"transform 0.15s ease-in-out"}})})}function ms({color:e="primary",size:t="medium",label:r,labelPlacement:n="end",checked:o,disabled:i=!1,onChange:a,name:l,value:s,className:d="",sx:c={},"aria-label":u,"aria-labelledby":p,"aria-describedby":h,inputProps:m={},...f}){const g=cs.includes(e)?e:"primary",x=ps[t]||ps.medium,b=x.LabelComp,y=(x.touchTarget-x.box)/2,S={...m,...u&&{"aria-label":u},...p&&{"aria-labelledby":p},...h&&{"aria-describedby":h}},k=de(P,{checked:o,disabled:i,onChange:a,name:l,value:s,icon:de(hs,{size:t,color:g,checked:!1}),checkedIcon:de(hs,{size:t,color:g,checked:!0}),className:"radio-"+g+" "+d,inputProps:S,disableRipple:!0,sx:{padding:y+"px",width:x.touchTarget,height:x.touchTarget,minWidth:x.touchTarget,minHeight:x.touchTarget,boxSizing:"border-box",borderRadius:"50%",color:"inherit",transition:"background-color 0.15s ease-in-out","&.Mui-checked":{color:"inherit"},"&:hover":{backgroundColor:"transparent"},"&.Mui-focusVisible .radio-circle-icon":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"},"&.Mui-disabled":{opacity:.6,cursor:"not-allowed",pointerEvents:"none"},...c},...f});return r?de(v,{control:k,label:de(b,{component:"span",sx:{color:i?"var(--Text-Quiet)":"var(--Text)",lineHeight:1.4,userSelect:"none"},children:r}),labelPlacement:n,disabled:i,sx:{marginLeft:0,marginRight:0,gap:x.gap+"px",alignItems:"center","&.Mui-disabled .MuiTypography-root":{color:"var(--Text-Quiet)",opacity:.6}}}):k}function fs({color:e="primary",size:t="medium",label:r,options:n=[],value:o,onChange:i,orientation:a="vertical",labelPlacement:l="end",disabled:s=!1,spacing:d=1,name:c,className:u="",sx:p={},"aria-label":h,"aria-labelledby":m,...f}){return ce(L,{component:"fieldset",disabled:s,className:"radio-group-"+e+" "+u,sx:p,children:[r&&de(M,{component:"legend",sx:{color:s?"var(--Text-Quiet)":"var(--Text)",fontSize:"small"===t?"13px":"15px",fontWeight:500,mb:1,"&.Mui-focused":{color:"var(--Text)"},"&.Mui-disabled":{color:"var(--Text-Quiet)",opacity:.6}},children:r}),de(W,{value:o,onChange:i,name:c,"aria-label":h,"aria-labelledby":m,row:"horizontal"===a,sx:{display:"flex",flexDirection:"horizontal"===a?"row":"column",flexWrap:"horizontal"===a?"wrap":"nowrap",alignItems:"horizontal"===a?"center":"flex-start",gap:d},...f,children:n.map(r=>de(ms,{color:e,size:t,label:r.label,labelPlacement:l,value:r.value,disabled:r.disabled||s},r.value))})]})}const gs=ms,xs=["default","primary","secondary","tertiary","neutral","info","success","warning","error"];const bs={small:{visual:12,track:2,labelSize:11},medium:{visual:16,track:4,labelSize:12},large:{visual:20,track:6,labelSize:13}};function vs({variant:e="primary",size:t="medium",value:r,defaultValue:n,onChange:o,onChangeCommitted:i,min:a=0,max:l=100,step:s=1,marks:d=!1,valueLabelDisplay:c="off",orientation:u="horizontal",track:p="normal",disabled:m=!1,label:f,name:g,className:x="",sx:b={},"aria-label":v,"aria-labelledby":y,...S}){const k=function(){const e={};return xs.forEach(t=>{e[t]=function(e){const t=(r=e).charAt(0).toUpperCase()+r.slice(1);var r;return{thumb:"var(--Border)",thumbBorder:"1px solid var(--Background)",track:"default"===e?"var(--Button)":"var(--Buttons-"+t+"-Button)",trackBorder:"1px solid var(--Border)",rail:"var(--Background)",railBorder:"1px solid var(--Border)",valueLabel:"var(--Text)",valueLabelText:"var(--Background)"}}(t)}),e}(),B=k[e]||k.primary,w=bs[t]||bs.medium,C="vertical"===u,T=Array.isArray(r)||Array.isArray(n),I="inverted"===p,A="small"===t?ln:cn,z=w.track+2,R=I?B.track:B.rail,E=B.railBorder,P=I?B.rail:B.track,L=B.trackBorder,M={color:"transparent"===B.track?B.thumb:B.track,height:C?void 0:z,width:C?z:void 0,"& .MuiSlider-rail":{backgroundColor:R,border:E||"none",boxSizing:E?"content-box":"border-box",opacity:1,height:C?void 0:E?w.track:z,width:C?E?w.track:z:void 0,borderRadius:z/2},"& .MuiSlider-track":{boxSizing:L?"content-box":"border-box",backgroundColor:P,border:L||"none",height:C?void 0:L?w.track:z,width:C?L?w.track:z:void 0,borderRadius:z/2},"& .MuiSlider-thumb":{width:24,height:24,backgroundColor:"transparent",border:"none",boxShadow:"none",transition:"none","--_height":w.visual+"px","--_bevel":"min(calc(var(--Button-Bevel) * var(--_height) / 100), calc(var(--_height) / 5))","&::after":{display:"none"},"&::before":{content:'""',position:"absolute",width:w.visual,height:w.visual,borderRadius:"50%",backgroundColor:B.thumb,border:B.thumbBorder||"none",boxShadow:`${ho(e)}, ${no}`,transition:"box-shadow 0.15s ease-in-out",top:"50%",left:"50%",transform:"translate(-50%, -50%)"},"&:hover::before":{boxShadow:`${ho(e)}, ${oo}`},"&.Mui-focusVisible::before, &:focus-visible::before":{boxShadow:`${ho(e)}, ${oo}, 0 0 0 1px var(--Focus-Visible)`},"&.Mui-active::before":{boxShadow:ho(e)},"&.Mui-focusVisible":{outline:"none",borderRadius:"50%"},"&.Mui-focusVisible::before":{boxShadow:`${ho(e)}, ${oo}`}},...T?C?{'& .MuiSlider-thumb[data-index="0"]::before':{top:0,left:"50%",transform:"translateX(-50%)"},'& .MuiSlider-thumb[data-index="1"]::before':{top:"auto",bottom:0,left:"50%",transform:"translateX(-50%)"}}:{'& .MuiSlider-thumb[data-index="0"]::before':{left:"auto",right:0,top:"50%",transform:"translateY(-50%)"},'& .MuiSlider-thumb[data-index="1"]::before':{left:0,right:"auto",top:"50%",transform:"translateY(-50%)"}}:{},"& .MuiSlider-valueLabel":{backgroundColor:B.valueLabel,color:B.valueLabelText,fontFamily:"var(--Font-Families-Body, var(--Body-Font-Family))",fontSize:"var(--Label-ExtraSmall-Font-Size)",fontWeight:"var(--Label-ExtraSmall-Font-Weight)",letterSpacing:"var(--Label-ExtraSmall-Letter-Spacing)",lineHeight:"var(--Label-ExtraSmall-Line-Height)",borderRadius:"var(--Sizing-1, 8px)",padding:"var(--Sizing-Half, 4px) var(--Sizing-1, 8px)","&::before":{backgroundColor:B.valueLabel}},"& .MuiSlider-mark":{backgroundColor:B.rail,width:C?z:2,height:C?2:z,borderRadius:1},"& .MuiSlider-markActive":{backgroundColor:B.thumb,opacity:.6},"& .MuiSlider-markLabel":{color:"var(--Text-Quiet)",fontSize:w.labelSize},"&.Mui-disabled":{opacity:.6,cursor:"not-allowed",pointerEvents:"none","& .MuiSlider-thumb::before":{boxShadow:"none"}},...b},W=de(O,{value:r,defaultValue:n,onChange:o,onChangeCommitted:i,min:a,max:l,step:s,marks:d,valueLabelDisplay:c,orientation:u,track:"inverted"===p?"inverted":!1!==p&&"normal",disabled:m,name:g,"aria-label":v,"aria-labelledby":y,slotProps:m?{input:{"aria-disabled":"true"}}:void 0,className:"slider-"+e+" "+x,sx:M,...S});return f?ce(h,{sx:{width:C?"auto":"100%",height:C?"100%":"auto",display:"flex",flexDirection:"column",gap:"4px"},children:[de(A,{component:"label",sx:{color:m?"var(--Text-Quiet)":"var(--Text)",fontSize:"small"===t?"13px":"15px",fontWeight:500,opacity:m?.6:1},children:f}),W]}):W}const ys=vs,Ss=vs,ks={default:"Default",primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info",success:"Success",warning:"Warning",error:"Error"},Bs={small:{iconSize:16,minHit:24,gap:0,focusInset:-3,focusWidth:3},medium:{iconSize:24,minHit:24,gap:0,focusInset:-3,focusWidth:3},large:{iconSize:36,minHit:void 0,gap:2,focusInset:2,focusWidth:2}};function ws({value:e,defaultValue:t,onChange:n,max:o=5,precision:i=1,color:a="default",size:l="medium",readOnly:s=!1,disabled:d=!1,emptyLabel:c="No rating",className:u="",sx:p={},...m}){const[f,g]=r(t??null),[x,b]=r(null),v=void 0!==e,y=v?e:f,S=null!==x?x:y,k=.5===i,B=!s&&!d,w=ks[a]||ks.default,C=Bs[l]||Bs.medium,T="var(--Buttons-"+w+"-Button)",I="var(--Buttons-"+w+"-Border)",A=e=>{if(!B)return;const t=e===y?null:e;v||g(t),n?.(t)},z=(e,t)=>{if(!B||!k)return;b(t?e+.5:e+1)},R=B?{"&:hover":{filter:"drop-shadow(0 2px 4px rgba(var(--Dropshadow-Color), 0.22)) drop-shadow(0 1px 2px rgba(var(--Dropshadow-Color), 0.28))","& .MuiSvgIcon-root":{stroke:"var(--Buttons-"+w+"-Border)",strokeWidth:1}}}:{},E=e=>{const t=e+1,r=e+.5,n=null!==S&&t<=S,a=null!==S&&!n&&k&&r<=S,l=a?Qt:Ie,s=((e,t)=>e||t?{color:T,filter:"drop-shadow(0 1px 2px rgba(var(--Dropshadow-Color), 0.28))",transition:"filter 0.15s ease","& .MuiSvgIcon-root":{stroke:I,strokeWidth:.5}}:{color:"transparent","& .MuiSvgIcon-root":{stroke:"var(--Quiet)",strokeWidth:1}})(n,a);return k&&B?ce(h,{sx:{position:"relative",display:"inline-flex",cursor:"pointer",...s,...R},onMouseLeave:()=>b(null),children:[de(h,{sx:{position:"absolute",left:0,top:0,width:"50%",height:"100%",zIndex:1,cursor:"pointer"},onMouseEnter:()=>z(e,!0),onClick:()=>A(r)}),de(h,{sx:{position:"absolute",right:0,top:0,width:"50%",height:"100%",zIndex:1,cursor:"pointer"},onMouseEnter:()=>z(e,!1),onClick:()=>A(t)}),de(l,{sx:{fontSize:C.iconSize,transition:"color 0.1s ease, filter 0.1s ease"}})]},e):de(h,{component:B?"button":"span",type:B?"button":void 0,role:B?"radio":void 0,"aria-checked":n,"aria-label":t+" star"+(1!==t?"s":""),tabIndex:B?0:-1,onClick:()=>A(t),onMouseEnter:()=>B&&b(t),onMouseLeave:()=>B&&b(null),onKeyDown:e=>{if(B&&("ArrowRight"!==e.key&&"ArrowUp"!==e.key||(e.preventDefault(),A(Math.min((y||0)+i,o))),"ArrowLeft"===e.key||"ArrowDown"===e.key)){e.preventDefault();const t=Math.max((y||0)-i,0);A(t||null)}},sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",border:"none",backgroundColor:"transparent",padding:0,...C.minHit&&{minWidth:C.minHit+"px",minHeight:C.minHit+"px"},cursor:d?"not-allowed":B?"pointer":"default",outline:"none",transition:"transform 0.1s ease",...s,...R,"&:active":B?{transform:"scale(0.95)"}:{},"&:focus-visible":B?{outline:C.focusWidth+"px solid var(--Focus-Visible)",outlineOffset:C.focusInset+"px",borderRadius:"2px"}:{},"&:disabled":{cursor:"not-allowed",opacity:.5}},children:de(l,{sx:{fontSize:C.iconSize,transition:"color 0.1s ease, filter 0.1s ease"}})},e)};return ce(h,{role:B?"radiogroup":"img","aria-label":"Rating"+(null!==y?": "+y+" of "+o+" stars":": "+c),className:"rating rating-"+a+" rating-"+l+(s?" rating-readonly":"")+(d?" rating-disabled":"")+(null===y?" rating-empty":"")+(u?" "+u:""),sx:{display:"inline-flex",alignItems:"center",gap:C.gap+"px",opacity:d?.5:1,fontFamily:"inherit",...p},...m,children:[Array.from({length:o},(e,t)=>E(t)),null===y&&!x&&de(bn,{style:{color:"var(--Quiet)",marginLeft:4},children:c})]})}const Cs={small:{height:"var(--Small-Button-Height)",fontSize:"13px",iconSize:18,px:12},medium:{height:"var(--Button-Height)",fontSize:"14px",iconSize:20,px:16},large:{height:"var(--Large-Button-Height)",fontSize:"15px",iconSize:22,px:16}};function Ts({value:e,defaultValue:t="",onChange:n,onFocus:i,onBlur:a,onClear:l,onSubmit:s,placeholder:d="Search…",size:c="medium",color:u="default",showClearButton:p=!0,disabled:m=!1,ariaLabel:f="Search",className:g="",sx:x={},...b}){const[v,y]=r(t),[S,k]=r(!1),B=o(null),w=void 0!==e,C=w?e:v,T=C.length>0,I=S||T,A=(e=>e.charAt(0).toUpperCase()+e.slice(1))("default"===u?"primary":u),z="default"===u?"var(--Text)":"var(--Text-"+A+")",R=Cs[c]||Cs.medium,E=()=>{w||y(""),n?.(""),l?.(),B.current?.focus()};return de(h,{className:"search-field search-field-"+c+(S?" search-field-focused":"")+(T?" search-field-filled":"")+(m?" search-field-disabled":"")+(g?" "+g:""),sx:{display:"flex",boxSizing:"border-box",...x},...b,children:de(h,{sx:{border:"1px solid "+("var(--Buttons-"+A+"-Border)"),borderRadius:"small"===c?"var(--Sm-Input-Radius, var(--Input-Radius, var(--Style-Border-Radius)))":"large"===c?"var(--Lg-Input-Radius, var(--Input-Radius, var(--Style-Border-Radius)))":"var(--Input-Radius, var(--Style-Border-Radius))",overflow:"hidden",opacity:m?.5:1,transition:"border-color 0.15s ease, box-shadow 0.15s ease",boxShadow:"none",width:"100%","&:focus-within":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"}},children:ce(h,{sx:{display:"flex",alignItems:"center",gap:1,width:"100%",boxSizing:"border-box",minHeight:R.height,px:R.px+"px",backgroundColor:"var(--Hover)"},children:[de(Qn,{size:"small",sx:{color:I?z:"var(--Quiet)",flexShrink:0,transition:"color 0.15s ease"},children:de(Te,{})}),de(h,{component:"input",ref:B,type:"text",role:"searchbox","aria-label":f,value:C,onChange:e=>{const t=e.target.value;w||y(t),n?.(t,e)},onFocus:e=>{k(!0),i?.(e)},onBlur:e=>{k(!1),a?.(e)},onKeyDown:e=>{"Enter"===e.key&&s?.(C,e),"Escape"===e.key&&T&&E()},placeholder:d,disabled:m,sx:{flex:1,border:"none",outline:"none",backgroundColor:"transparent",color:I?z:"var(--Quiet)",fontSize:R.fontSize,fontFamily:"var(--Body-Font-Family)",fontWeight:"var(--Body-Font-Weight)",minWidth:0,"&::placeholder":{color:"var(--Quiet)",opacity:1,fontFamily:"var(--Body-Font-Family)",fontWeight:"var(--Body-Font-Weight)"},"&:disabled":{cursor:"not-allowed"}}}),p&&T&&!m&&de(h,{component:"button",type:"button","aria-label":"Clear search",onClick:E,sx:{display:"flex",alignItems:"center",justifyContent:"center",width:R.iconSize+4,height:R.iconSize+4,borderRadius:"50%",border:"none",backgroundColor:"transparent",color:"var(--Quiet)",cursor:"pointer",flexShrink:0,padding:0,transition:"color 0.15s ease, background-color 0.15s ease","&:hover":{backgroundColor:"var(--Hover)",color:z},"&:focus-visible":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"1px"}},children:de(Qn,{size:"small",children:de(Lt,{})})})]})})})}const Is=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",As=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}];function zs({label:e,selected:t,onClick:r}){return de(Io,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function Rs({color:e,selected:t,onClick:r}){const n=Is(e);return de(h,{component:"button",onClick:()=>r(e),"aria-label":"Select "+n,"aria-pressed":t,title:n,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+n+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Buttons-"+n+"-Text)",pointerEvents:"none"}})})}function Es(){const[e,t]=r("default"),[n,o]=r("medium"),[i,a]=r(!1),[l,s]=r(!0),[d,c]=r(null),[u,p]=r("Surface");return ce(h,{sx:{pb:8},children:[de(qr,{children:"Search Field"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ui,{theme:d,surface:u,children:de(h,{sx:{width:"100%",maxWidth:400},children:de(Ts,{color:e,size:n,disabled:i,showClearButton:l,placeholder:"Search..."})})}),de(ji,{code:(()=>{const t=[];return"default"!==e&&t.push('color="'+e+'"'),"medium"!==n&&t.push('size="'+n+'"'),l||t.push("showClearButton={false}"),i&&t.push("disabled"),t.push('placeholder="Search..."'),t.push("onChange={handleSearch}"),"<SearchField\n "+t.join("\n ")+"\n/>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(li,{defaultValue:0,variant:"standard",color:"primary",children:[ce(si,{children:[de(di,{children:"Playground"}),de(di,{children:"Accessibility"})]}),de(ci,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(fi,{theme:d,onThemeChange:c,surface:u,onSurfaceChange:p})}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:As.map(r=>ce(h,{children:[de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:r.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:r.colors.map(r=>de(Rs,{color:r,selected:e===r,onClick:t},r))})]},r.label))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",spacing:1,children:["small","medium","large"].map(e=>de(zs,{label:Is(e),selected:n===e,onClick:()=>o(e)},e))})]}),ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Clear Button"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Show clear when has value"})]}),de(na,{variant:"default-outline",checked:l,onChange:e=>s(e.target.checked),size:"small","aria-label":"Clear button"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Disabled"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Non-interactive state"})]}),de(na,{variant:"default-outline",checked:i,onChange:e=>a(e.target.checked),size:"small","aria-label":"Disabled"})]})]})}),de(ci,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Role",value:'role="searchbox" on the input element'},{label:"Label",value:'aria-label="Search" (configurable via ariaLabel prop)'},{label:"Clear",value:'aria-label="Clear search" on clear button'},{label:"Keyboard",value:"Enter submits, Escape clears"},{label:"Focus",value:"outline: 2px solid var(--Focus-Visible); outline-offset: 2px"}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ln,{children:[e,":"]}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}const Ps=["primary","secondary","tertiary","neutral","info","success","warning","error"],Ls=e=>e.charAt(0).toUpperCase()+e.slice(1);function Ms(){const e={};return Ps.forEach(t=>{e[t]=function(e){const t=Ls(e);return{bg:"var(--Buttons-"+t+"-Button)",text:"var(--Buttons-"+t+"-Text)",border:"none",hoverBg:"var(--Buttons-"+t+"-Hover)",activeBg:"var(--Buttons-"+t+"-Pressed)"}}(t),e[t+"-outline"]=function(e){return{bg:"var(--Background)",text:"var(--Text)",border:"1px solid var(--Buttons-"+Ls(e)+"-Border)",hoverBg:"var(--Hover)",activeBg:"var(--Hover)"}}(t),e[t+"-light"]=function(e){const t=Ls(e);return{bg:"var(--Buttons-"+t+"-Button)",text:"var(--Buttons-"+t+"-Text)",border:"1px solid var(--Buttons-"+t+"-Border)",hoverBg:"var(--Buttons-"+t+"-Hover)",activeBg:"var(--Buttons-"+t+"-Pressed)"}}(t)}),e}const Ws={small:{height:24,fontSize:"12px",iconSize:16,padding:"0 8px",deleteSize:16,gap:4},medium:{height:32,fontSize:"13px",iconSize:18,padding:"0 12px",deleteSize:18,gap:6},large:{height:40,fontSize:"14px",iconSize:20,padding:"0 16px",deleteSize:24,gap:8}},Os=c(function({size:e,onClick:t,...r},n){const o="large"===e?24:"medium"===e?18:16;return de(h,{ref:n,component:"button",onClick:e=>{e.stopPropagation(),t&&t(e)},onKeyDown:e=>{"Enter"!==e.key&&"Backspace"!==e.key&&"Delete"!==e.key||(e.stopPropagation(),t&&t(e))},"aria-label":"Remove",role:"button",tabIndex:0,sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",minWidth:24,minHeight:24,width:o,height:o,padding:0,margin:0,marginLeft:"2px",marginRight:"-4px",border:"none",borderRadius:"50%",backgroundColor:"transparent",color:"inherit",opacity:.7,cursor:"pointer",position:"relative",flexShrink:0,transition:"opacity 0.15s ease, background-color 0.15s ease","&:hover":{opacity:1,backgroundColor:"rgba(0,0,0,0.08)"},"&:focus-visible":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"1px"},...o<24&&{"&::after":{content:'""',position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)",minWidth:24,minHeight:24}}},...r,children:de(jt,{sx:{fontSize:o,pointerEvents:"none"}})})});function Ds({variant:e="primary",size:t="medium",label:r,clickable:n=!1,disabled:o=!1,selected:i=!1,selectionMode:a,onDelete:l,onClick:s,startDecorator:d,endDecorator:c,children:u,className:p="",sx:m={},...f}){const g=Ms(),x=g[e]||g.primary,b=l?"large":t,v=Ws[b]||Ws.medium,y=n||!!s||!!a,S={};"radio"===a?(S.role="radio",S["aria-checked"]=i):"checkbox"===a&&(S.role="checkbox",S["aria-checked"]=i);const k=i?{outline:"2px solid var(--Buttons-Primary-Button)",outlineOffset:"1px"}:{},B=r||u,w={height:v.height,fontSize:v.fontSize,fontWeight:500,fontFamily:"inherit",borderRadius:v.height/2+"px",padding:v.padding,boxSizing:"border-box",position:"relative",backgroundColor:x.bg,color:x.text,border:x.border,...k,..."small"===b&&{"&::after":{content:'""',position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)",minWidth:24,minHeight:24,width:"100%",height:"100%"}},...y&&!o?{cursor:"pointer",transition:"background-color 0.15s ease, outline 0.15s ease","&:hover":{backgroundColor:x.hoverBg},"&:active":{backgroundColor:x.activeBg}}:{},"&:focus-visible, &.Mui-focusVisible":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"},...o?{opacity:.5,cursor:"not-allowed",pointerEvents:"none"}:{},boxShadow:"none","& .MuiChip-label":{padding:0,fontSize:"inherit",fontWeight:"inherit",fontFamily:"inherit",lineHeight:1.2,display:"flex",alignItems:"center",gap:v.gap+"px"},"& .MuiChip-icon":{margin:0,marginLeft:"-2px",color:"inherit",fontSize:v.iconSize},"& .MuiChip-deleteIcon":{display:"none"},...m},C=ce(h,{component:"span",sx:{display:"inline-flex",alignItems:"center",gap:v.gap+"px",lineHeight:1},children:[d&&de(h,{component:"span",sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",flexShrink:0,"& .MuiSvgIcon-root":{fontSize:v.iconSize},"& .MuiAvatar-root":{width:v.iconSize+4,height:v.iconSize+4,fontSize:Math.round(.65*v.iconSize)+"px"}},children:d}),B,c&&de(h,{component:"span",sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",flexShrink:0,"& .MuiSvgIcon-root":{fontSize:v.iconSize},"& .MuiAvatar-root":{width:v.iconSize+4,height:v.iconSize+4,fontSize:Math.round(.65*v.iconSize)+"px"}},children:c}),l&&de(Os,{size:b,onClick:l})]});return de(D,{label:C,clickable:y&&!o,disabled:o,onClick:y?s:void 0,className:"chip-"+e+" "+p,sx:w,...S,...f})}const Fs={body:{fontFamily:"var(--Body-Font-Family)",lineHeight:"calc(var(--Body-Line-Height) * var(--Cognitive-Multiplier, 1))",fontSize:"var(--Body-Font-Size)",fontWeight:"var(--Body-Font-Weight)",letterSpacing:"var(--Body-Letter-Spacing)"},"body-small":{fontFamily:"var(--Body-Font-Family)",lineHeight:"calc(var(--Body-Small-Line-Height) * var(--Cognitive-Multiplier, 1))",fontSize:"var(--Body-Small-Font-Size)",fontWeight:"var(--Body-Font-Weight)",letterSpacing:"var(--Body-Small-Letter-Spacing)"},"body-large":{fontFamily:"var(--Body-Font-Family)",lineHeight:"calc(var(--Body-Large-Line-Height) * var(--Cognitive-Multiplier, 1))",fontSize:"var(--Body-Large-Font-Size)",fontWeight:"var(--Body-Font-Weight)",letterSpacing:"var(--Body-Large-Letter-Spacing)"},"body-semibold":{fontFamily:"var(--Body-Font-Family)",lineHeight:"calc(var(--Body-Line-Height) * var(--Cognitive-Multiplier, 1))",fontSize:"var(--Body-Font-Size)",fontWeight:"var(--Body-Semibold-Font-Weight)",letterSpacing:"var(--Body-Letter-Spacing)"},"body-bold":{fontFamily:"var(--Body-Font-Family)",lineHeight:"calc(var(--Body-Line-Height) * var(--Cognitive-Multiplier, 1))",fontSize:"var(--Body-Font-Size)",fontWeight:"var(--Body-Bold-Font-Weight)",letterSpacing:"var(--Body-Letter-Spacing)"},button:{fontFamily:"var(--Body-Font-Family)",lineHeight:"var(--Button-Line-Height)",fontSize:"var(--Button-Font-Size)",fontWeight:"var(--Button-Font-Weight)",letterSpacing:"var(--Button-Letter-Spacing)"},label:{fontFamily:"var(--Body-Font-Family)",lineHeight:"var(--Label-Line-Height)",fontSize:"var(--Label-Font-Size)",fontWeight:"var(--Label-Font-Weight)",letterSpacing:"var(--Label-Letter-Spacing)"},caption:{fontFamily:"var(--Body-Font-Family)",lineHeight:"calc(var(--Body-Small-Line-Height) * var(--Cognitive-Multiplier, 1))",fontSize:"var(--Body-Small-Font-Size)",fontWeight:"var(--Body-Font-Weight)",letterSpacing:"var(--Body-Small-Letter-Spacing)"}},Ns="var(--Link-Visited, var(--Hotlink-Visited))",Hs={primary:{base:"var(--Link, var(--Hotlink))",visited:Ns},standard:{base:"var(--Text)",visited:Ns},quiet:{base:"var(--Text-Quiet)",visited:Ns}};function Vs({children:e,href:t,target:r,rel:n,textStyle:o="body",color:i="primary",disabled:a=!1,onClick:l,className:s="",sx:d={},...c}){const u=Fs[o]||Fs.body,p=Hs[i]||Hs.primary;return de(h,{component:"a",href:a?void 0:t,target:r,rel:"_blank"===r?n||"noopener noreferrer":n,onClick:a?e=>e.preventDefault():l,"aria-disabled":a||void 0,tabIndex:a?-1:void 0,className:"link link-"+o+" link-color-"+i+(a?" link-disabled":"")+" "+s,sx:{fontFamily:u.fontFamily,lineHeight:u.lineHeight,fontSize:u.fontSize,fontWeight:u.fontWeight,letterSpacing:u.letterSpacing,textDecoration:"underline",textUnderlineOffset:"3px",textDecorationThickness:"1px",color:p.base,cursor:a?"not-allowed":"pointer",opacity:a?.5:1,pointerEvents:a?"none":"auto",display:"inline-flex",alignItems:"center",minHeight:"24px",minWidth:"24px",transition:"color 0.15s ease, text-decoration-color 0.15s ease",...!a&&{"&:hover":{textDecorationThickness:"2px"},"&:visited":{color:p.visited},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"2px",borderRadius:"2px"},"&:active":{textDecorationThickness:"2px"}},...d},...c,children:e})}function Qs({label:e,selected:t,onClick:r}){return de(Io,{selected:t,variant:t?"primary":"primary-outline",size:"small",onClick:r,children:e})}function js({code:e}){return de(ji,{code:e,language:"JSX",wrap:!0,sx:{mt:1}})}function Gs({passes:e}){return ce(h,{sx:{display:"inline-flex",alignItems:"center",gap:.5,px:1.5,py:.5,borderRadius:"20px",backgroundColor:e?"var(--Tags-Success-BG)":"var(--Tags-Error-BG)",color:e?"var(--Tags-Success-Text)":"var(--Tags-Error-Text)",fontSize:"12px",fontWeight:600},children:[de(e?ge:xe,{sx:{fontSize:14}}),e?"WCAG Pass":"WCAG Fail"]})}function Us({leftLabel:e,rightLabel:t,leftContent:r,rightContent:n,leftCode:o,rightCode:i,leftPasses:a,rightPasses:l}){return ce(I,{container:!0,spacing:3,children:[de(I,{item:!0,xs:12,md:6,children:ce(h,{sx:{p:2,border:"1px solid var(--Border)",borderRadius:"var(--Style-Border-Radius)",backgroundColor:"var(--Background)",height:"100%"},children:[ce(h,{sx:{display:"flex",alignItems:"center",justifyContent:"space-between",mb:2},children:[de(ln,{style:{fontWeight:600},children:e}),de(Gs,{passes:a})]}),de(h,{sx:{p:2,backgroundColor:"var(--Surface-Dim, var(--Surface))",borderRadius:"var(--Style-Border-Radius)",minHeight:80},children:r}),de(js,{code:o})]})}),de(I,{item:!0,xs:12,md:6,children:ce(h,{sx:{p:2,border:"1px solid var(--Border)",borderRadius:"var(--Style-Border-Radius)",backgroundColor:"var(--Background)",height:"100%"},children:[ce(h,{sx:{display:"flex",alignItems:"center",justifyContent:"space-between",mb:2},children:[de(ln,{style:{fontWeight:600},children:t}),de(Gs,{passes:l})]}),de(h,{sx:{p:2,backgroundColor:"var(--Surface-Dim, var(--Surface))",borderRadius:"var(--Style-Border-Radius)",minHeight:80},children:n}),de(js,{code:i})]})})]})}function Xs(){const[e,t]=r("column"),[n,o]=r(.5),[i,a]=r("small"),[l,s]=r(!0),[d,c]=r(!1),[u,p]=r(null),[m,f]=r("Surface"),g={small:{label:"Small links ⚡",content:ce(ue,{children:[de(Vs,{href:"#",size:"small",children:"Terms of Service"}),de(Vs,{href:"#",size:"small",children:"Privacy Policy"}),de(Vs,{href:"#",size:"small",children:"Cookie Settings"})]})},chips:{label:"Chips ⚡",content:ce(ue,{children:[de(Ds,{label:"React",size:"small"}),de(Ds,{label:"TypeScript",size:"small"}),de(Ds,{label:"Design System",size:"small"})]})},normal:{label:"Normal buttons",content:ce(ue,{children:[de(Io,{variant:"primary",size:"medium",children:"Primary"}),de(Io,{variant:"secondary",size:"medium",children:"Secondary"})]})},mixed:{label:"Mixed ⚡",content:ce(ue,{children:[de(Io,{variant:"primary",size:"medium",children:"Save changes"}),de(Vs,{href:"#",size:"small",children:"Or discard"})]})}},x=["small","chips","mixed"].includes(i),b=l&&x;return ce(I,{container:!0,spacing:3,sx:{mt:1},children:[ce(I,{item:!0,xs:12,md:7,children:[de(ui,{theme:u,children:ce(h,{sx:{width:"100%"},children:[b&&ce(h,{sx:{mb:2,px:2,py:1,borderRadius:"var(--Style-Border-Radius)",backgroundColor:"var(--Tags-Warning-BG)",color:"var(--Tags-Warning-Text)",fontSize:"12px",fontWeight:600,display:"flex",alignItems:"center",gap:1},children:[de(xe,{sx:{fontSize:16}}),"Small child detected — gap raised to var(--min-stack-gap)"]}),de(ka,{direction:e,gap:n,enforceMinGap:l,flexWrap:d?"wrap":void 0,children:g[i].content})]})}),de(js,{code:(()=>{const t=["<OmniStack"];return"column"!==e&&t.push(' direction="'+e+'"'),t.push(" gap={"+n+"}"),l||t.push(" enforceMinGap={false}"),d&&t.push(' flexWrap="wrap"'),t.push(">"),t.push(" {children}"),t.push("</OmniStack>"),t.join("\n")})()})]}),de(I,{item:!0,xs:12,md:5,children:ce(h,{sx:{display:"flex",flexDirection:"column",gap:3},children:[de(fi,{theme:u,onThemeChange:p,surface:m,onSurfaceChange:f}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"CHILDREN"}),de(h,{sx:{display:"flex",flexWrap:"wrap",gap:1},children:Object.entries(g).map(([e,{label:t}])=>de(Qs,{label:t,selected:i===e,onClick:()=>a(e)},e))})]}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"DIRECTION"}),de(h,{sx:{display:"flex",gap:1},children:["row","column"].map(r=>{return de(Qs,{label:(n=r,n?n.charAt(0).toUpperCase()+n.slice(1):""),selected:e===r,onClick:()=>t(r)},r);var n})})]}),ce(h,{children:[ce(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:["GAP — ",n," unit",b?" → raised to var(--min-stack-gap)":""]}),ce(h,{sx:{display:"flex",alignItems:"center",gap:2},children:[de(h,{component:"input",type:"range",min:0,max:6,step:.5,value:n,onChange:e=>o(Number(e.target.value)),sx:{flex:1,accentColor:"var(--Primary-Color-10)"}}),de(bn,{style:{color:"var(--Text)",minWidth:24,textAlign:"right"},children:n})]})]}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"OPTIONS"}),ce(h,{sx:{display:"flex",flexDirection:"column",gap:1.5},children:[ce(h,{sx:{display:"flex",alignItems:"flex-start",justifyContent:"space-between"},children:[ce(h,{children:[de(ln,{children:"Enforce min gap"}),de(bn,{style:{color:b?"var(--Tags-Warning-Text)":"var(--Text-Quiet)",display:"block"},children:b?"⚡ Active — small child detected":x?"Off — WCAG 2.5.8 risk":"No small children detected"})]}),de(na,{checked:l,onChange:e=>s(e.target.checked),size:"small"})]}),ce(h,{sx:{display:"flex",alignItems:"center",justifyContent:"space-between"},children:[de(ln,{children:"Flex wrap"}),de(na,{checked:d,onChange:e=>c(e.target.checked),size:"small"})]})]})]})]})})]})}function $s(){return ce(h,{sx:{pb:8},children:[de(qr,{children:"Stack"}),de(cn,{style:{color:"var(--Text-Quiet)",marginTop:8,marginBottom:32,maxWidth:640},children:"OmniStack is a layout primitive built on MUI Stack with one intelligent addition: it automatically enforces a minimum gap between children when it detects small (24px) interactive components — protecting WCAG 2.5.8 compliance without any extra developer effort."}),ce(li,{defaultValue:0,variant:"standard",color:"primary",children:[ce(si,{children:[de(di,{children:"Why it matters"}),de(di,{children:"Playground"}),de(di,{children:"API"})]}),de(ci,{value:0,children:ce(h,{sx:{pt:3,display:"flex",flexDirection:"column",gap:4},children:[ce(h,{sx:{p:3,backgroundColor:"var(--Background)",border:"1px solid var(--Border)",borderRadius:"var(--Style-Border-Radius)"},children:[de(qr,{children:"The problem"}),de(cn,{style:{color:"var(--Text-Quiet)",marginTop:8,marginBottom:16},children:"WCAG 2.5.8 requires that small interactive targets (24px) have enough surrounding space that they don’t overlap adjacent targets. Every layout library leaves this entirely to the developer — meaning it’s silently violated constantly."}),de(Us,{leftLabel:"Plain MUI Stack — gap too small",rightLabel:"OmniStack — gap auto-enforced",leftPasses:!1,rightPasses:!0,leftContent:ce(h,{sx:{display:"flex",flexDirection:"column",gap:"4px"},children:[de(Vs,{href:"#",size:"small",children:"Terms of Service"}),de(Vs,{href:"#",size:"small",children:"Privacy Policy"}),de(Vs,{href:"#",size:"small",children:"Cookie Settings"})]}),rightContent:ce(ka,{gap:.5,children:[de(Vs,{href:"#",size:"small",children:"Terms of Service"}),de(Vs,{href:"#",size:"small",children:"Privacy Policy"}),de(Vs,{href:"#",size:"small",children:"Cookie Settings"})]}),leftCode:'<Stack gap={0.5}>\n <Link size="small">Terms of Service</Link>\n <Link size="small">Privacy Policy</Link>\n <Link size="small">Cookie Settings</Link>\n</Stack>\n// ⚠ gap=4px — targets overlap',rightCode:'<OmniStack gap={0.5}>\n <Link size="small">Terms of Service</Link>\n <Link size="small">Privacy Policy</Link>\n <Link size="small">Cookie Settings</Link>\n</OmniStack>\n// ✓ small child detected → gap enforced'})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Background)",border:"1px solid var(--Border)",borderRadius:"var(--Style-Border-Radius)"},children:[de(qr,{children:"Mixed component sizes"}),de(cn,{style:{color:"var(--Text-Quiet)",marginTop:8,marginBottom:16},children:"One small child is enough to trigger enforcement for the whole stack — the most common case is a normal button paired with a small cancel link."}),de(Us,{leftLabel:"Without enforcement",rightLabel:"With enforcement",leftPasses:!1,rightPasses:!0,leftContent:ce(h,{sx:{display:"flex",flexDirection:"column",gap:"2px"},children:[de(Io,{variant:"primary",size:"medium",children:"Save changes"}),de(Vs,{href:"#",size:"small",children:"Or discard"})]}),rightContent:ce(ka,{gap:.25,children:[de(Io,{variant:"primary",size:"medium",children:"Save changes"}),de(Vs,{href:"#",size:"small",children:"Or discard"})]}),leftCode:'<Stack gap={0.25}>\n <Button size="medium">Save changes</Button>\n <Link size="small">Or discard</Link>\n</Stack>\n// ⚠ Link is 24px — gap too tight',rightCode:'<OmniStack gap={0.25}>\n <Button size="medium">Save changes</Button>\n <Link size="small">Or discard</Link>\n</OmniStack>\n// ✓ Link detected → gap enforced'})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Background)",border:"1px solid var(--Border)",borderRadius:"var(--Style-Border-Radius)"},children:[de(qr,{children:"How detection works"}),de(cn,{style:{color:"var(--Text-Quiet)",marginTop:8,marginBottom:16},children:"OmniStack inspects children at render time using a priority-ordered signal chain. Any one signal is enough to trigger enforcement."}),de(h,{sx:{display:"flex",flexDirection:"column"},children:[{signal:'size="small" prop',example:'<Link size="small" />'},{signal:'data-size="small"',example:'<div data-size="small" />'},{signal:"height={24}",example:"<Box height={24} />"},{signal:"minHeight={24}",example:"<Box minHeight={24} />"},{signal:"sx.minHeight: 24",example:"<Box sx={{ minHeight: 24 }} />"},{signal:"Known component name",example:"Link, Chip, Badge, Caption…"}].map(({signal:e,example:t},r,n)=>ce(h,{sx:{display:"flex",alignItems:"center",gap:2,py:1.5,borderBottom:r<n.length-1?"1px solid var(--Border)":"none"},children:[de(h,{sx:{width:8,height:8,borderRadius:"50%",backgroundColor:"var(--Primary-Color-10)",flexShrink:0}}),de(ln,{style:{flex:"0 0 200px"},children:e}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Background)",border:"1px solid var(--Border)",borderRadius:"var(--Style-Border-Radius)"},children:[de(qr,{children:"Token-driven minimum"}),de(cn,{style:{color:"var(--Text-Quiet)",marginTop:8,marginBottom:16},children:"The minimum gap is a CSS custom property, not a hardcoded value — so it respects your brand spacing scale and responds to theme changes without re-rendering."}),de(js,{code:":root {\n --min-stack-gap: 8px; /* Set in your theme.css */\n}\n\n/* OmniStack substitutes the variable, not the value: */\ngap: var(--min-stack-gap, 8px);\n\n/* Dark mode, brand overrides, and media queries\n all work automatically — no re-render needed. */"})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Background)",border:"1px solid var(--Border)",borderRadius:"var(--Style-Border-Radius)"},children:[de(qr,{children:"Auditable opt-out"}),ce(cn,{style:{color:"var(--Text-Quiet)",marginTop:8,marginBottom:16},children:["Use ",de("code",{children:"enforceMinGap={false}"})," to opt out. This creates a searchable pattern accessibility audits can grep for — a conscious waiver, not a silent violation."]}),de(js,{code:'<OmniStack gap={0.5} enforceMinGap={false}>\n {/* Explicitly waived — auditors can grep:\n enforceMinGap={false}\n to find all waivers in the codebase. */}\n <Link size="small">Terms</Link>\n <Link size="small">Privacy</Link>\n</OmniStack>'})]})]})}),de(ci,{value:1,children:de(Xs,{})}),de(ci,{value:2,children:ce(h,{sx:{pt:3},children:[de(qr,{children:"OmniStack props"}),de(cn,{style:{color:"var(--Text-Quiet)",marginTop:4,marginBottom:16},children:"All standard MUI Stack props are supported. These are OmniStack additions:"}),de(h,{sx:{border:"1px solid var(--Border)",borderRadius:"var(--Style-Border-Radius)",overflow:"hidden",mb:4},children:[{prop:"enforceMinGap",type:"boolean",default:"true",desc:"Enable/disable smart gap enforcement."},{prop:"minGapToken",type:"string",default:'"--min-stack-gap"',desc:"CSS variable name for the minimum gap value."},{prop:"gap",type:"number|string",default:"undefined",desc:"Desired gap. Enforced against minGapToken when small children detected."},{prop:"direction",type:"string|object",default:'"column"',desc:"Stack direction. Supports responsive breakpoint objects."},{prop:"flexWrap",type:"string",default:"undefined",desc:'"wrap" | "nowrap" | "wrap-reverse"'},{prop:"divider",type:"ReactNode",default:"undefined",desc:"Element rendered between each child."}].map(({prop:e,type:t,default:r,desc:n},o,i)=>ce(h,{sx:{display:"grid",gridTemplateColumns:"160px 160px 1fr",gap:2,px:2,py:1.5,alignItems:"start",borderBottom:o<i.length-1?"1px solid var(--Border)":"none",backgroundColor:o%2==0?"transparent":"var(--Surface-Dim, var(--Surface))"},children:[de(bn,{style:{fontFamily:"monospace",color:"var(--Primary-Color-10)",fontWeight:600},children:e}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t}),ce(h,{children:[de(bn,{style:{color:"var(--Text)"},children:n}),ce(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:2},children:["Default: ",r]})]})]},e))}),de(qr,{children:"Convenience exports"}),de(h,{sx:{border:"1px solid var(--Border)",borderRadius:"var(--Style-Border-Radius)",overflow:"hidden",mb:4},children:[{name:"Stack",desc:"Alias for OmniStack — drop-in MUI Stack replacement"},{name:"HStack",desc:'direction="row" alignItems="center"'},{name:"VStack",desc:'direction="column"'},{name:"CenteredStack",desc:'direction="column" alignItems="center" justifyContent="center"'},{name:"SpaceBetweenStack",desc:'direction="row" justifyContent="space-between"'},{name:"WrapStack",desc:'direction="row" flexWrap="wrap"'},{name:"ResponsiveStack",desc:"column on xs, row on sm+ (breakpoint configurable)"},{name:"GridStack",desc:"Alias for WrapStack"},{name:"InsetStack",desc:"OmniStack with px: 2 horizontal padding"},{name:"ScrollStack",desc:"OmniStack with overflowY: auto"}].map(({name:e,desc:t},r,n)=>ce(h,{sx:{display:"grid",gridTemplateColumns:"200px 1fr",gap:2,px:2,py:1.5,borderBottom:r<n.length-1?"1px solid var(--Border)":"none",backgroundColor:r%2==0?"transparent":"var(--Surface-Dim, var(--Surface))"},children:[de(bn,{style:{fontFamily:"monospace",color:"var(--Primary-Color-10)",fontWeight:600},children:e}),de(bn,{style:{color:"var(--Text-Quiet)"},children:t})]},e))}),de(qr,{children:"Debug attributes"}),de(js,{code:'/* When enforcement is active, OmniStack adds: */\nclassName="omni-stack omni-stack-min-gap-enforced"\ndata-min-gap-enforced="true"\n\n/* Target in CSS: */\n.omni-stack-min-gap-enforced { outline: 2px dashed orange; }\n\n/* Query in tests: */\ncontainer.querySelector(\'[data-min-gap-enforced="true"]\')'})]})})]})]})}const Ks={none:void 0,small:"var(--Sm-Card-Radius, var(--Card-Radius))",medium:"var(--Card-Radius)",large:"var(--Lg-Card-Radius, var(--Card-Radius))"};function qs({children:e,theme:t,surface:r,radius:n="none",elevation:o=0,component:i="div",className:a="",sx:l={},style:s,...d}){const c=Math.max(0,Math.min(5,0|o)),u=Ks[n];if(!c)return de(h,{component:i,"data-theme":t||void 0,"data-surface":r||void 0,className:"omni-box"+(a?" "+a:""),sx:{background:"var(--Background)",boxSizing:"border-box",...u?{borderRadius:u}:{},...l},style:s,...d,children:e});const p=s||{},{width:m,height:f,minWidth:g,minHeight:x,maxWidth:b,maxHeight:v,borderRadius:y,margin:S,marginTop:k,marginRight:B,marginBottom:w,marginLeft:C,...T}=p,I={width:m,height:f,minWidth:g,minHeight:x,maxWidth:b,maxHeight:v,borderRadius:y,margin:S,marginTop:k,marginRight:B,marginBottom:w,marginLeft:C},{width:A,height:z,borderRadius:R,...E}=l;return de(h,{component:i,className:"omni-box-elevation"+(a?" "+a:""),"data-elevation":c,sx:{boxShadow:so[c],boxSizing:"border-box",width:A,height:z,borderRadius:void 0!==R?R:u},style:I,...d,children:de(h,{"data-theme":t||void 0,"data-surface":r||void 0,className:"omni-box",sx:{width:"100%",height:"100%",background:"var(--Background)",borderRadius:"inherit",boxSizing:"border-box",...E},style:T,children:e})})}const Ys=["Surface","Surface-Dim","Surface-Bright","Container","Container-Low","Container-Lowest","Container-High"],Js=["Default","Primary","Primary-Light","Secondary","Secondary-Light","Tertiary","Tertiary-Light","Neutral","Neutral-Light","Info-Light","Success-Light","Warning-Light","Error-Light"];function Zs({label:e,selected:t,onClick:r}){return de(Io,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function _s(){const[e,t]=r(""),[n,o]=r(""),[i,a]=r(null),[l,s]=r("Surface");return ce(qs,{sx:{pb:8},children:[de(qr,{children:"Box"}),ce(cn,{color:"quiet",style:{marginTop:8,marginBottom:24,maxWidth:720},children:["Bare layout primitive — a slot that participates in the design-system cascade (",de("code",{children:"data-theme"})," / ",de("code",{children:"data-surface"}),") without carrying any chrome. Reach for ",de("code",{children:"<Ratio>"})," or",de("code",{children:" <Card>"})," when you need padding, borders, or shadow."]}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ui,{theme:i,surface:l,children:de(qs,{sx:{width:"100%",maxWidth:400},children:de(qs,{theme:e||void 0,surface:n||void 0,children:ce(qs,{sx:{padding:3,backgroundColor:"var(--Background)",color:"var(--Text)",borderRadius:"var(--Style-Border-Radius)",border:"1px dashed var(--Border-Variant)"},children:[de(Jr,{children:"Box content"}),de(cn,{style:{color:"var(--Text-Quiet)",marginTop:6},children:"Anything dropped inside resolves tokens against the Box's theme / surface, if you set them."})]})})})}),de(ji,{code:(()=>{const t=[];e&&t.push('theme="'+e+'"'),n&&t.push('surface="'+n+'"');return"<Box"+(t.length?" "+t.join(" "):"")+">\n {/* anything */}\n</Box>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(qs,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(li,{defaultValue:0,variant:"standard",color:"primary",children:[ce(si,{children:[de(di,{children:"Playground"}),de(di,{children:"When to use"})]}),de(ci,{value:0,children:ce(qs,{sx:{p:3},children:[de(qs,{sx:{mb:3},children:de(fi,{theme:i,onThemeChange:a,surface:l,onSurfaceChange:s})}),ce(qs,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"THEME (optional)"}),ce(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:[de(Zs,{label:"None",selected:!e,onClick:()=>t("")}),Js.map(r=>de(Zs,{label:r,selected:e===r,onClick:()=>t(r)},r))]})]}),ce(qs,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SURFACE (optional)"}),ce(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:[de(Zs,{label:"None",selected:!n,onClick:()=>o("")}),Ys.map(e=>de(Zs,{label:e,selected:n===e,onClick:()=>o(e)},e))]}),ce(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:["Both props are pass-throughs to ",de("code",{children:"data-theme"})," ","and ",de("code",{children:"data-surface"}),". Leave empty to inherit from the parent zone."]})]})]})}),de(ci,{value:1,children:de(qs,{sx:{p:3},children:ce(B,{spacing:2,children:[ce(qs,{children:[de(ln,{style:{fontWeight:700},children:"Reach for Box when…"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:4},children:"you need a wrapper to scope a theme / surface zone, or you want a typed JSX root without painting any visual styling."})]}),ce(qs,{children:[de(ln,{style:{fontWeight:700},children:"Use Ratio when…"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:4},children:"the container needs a fixed proportion (image, video, embed, hero tile) — it carries the same theme / color shell Box used to."})]}),ce(qs,{children:[de(ln,{style:{fontWeight:700},children:"Use Card when…"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:4},children:"the container has a title, body, and actions — Card handles the standard 2-layer chrome plus header / footer slots."})]})]})})})]})})})]})]})}function ed({children:e,maxWidth:t="lg",disableGutters:r=!1,sx:n={},...o}){return de(F,{maxWidth:t,disableGutters:r,"data-surface":"Surface",sx:{backgroundColor:"var(--Background)",color:"var(--Text)",transition:"all 0.2s ease-in-out",...n},...o,children:e})}function td({children:e,container:t=!1,item:r=!1,spacing:n=2,sx:o={},...i}){return de(I,{container:t,item:r,spacing:n,sx:{transition:"all 0.2s ease-in-out",...o},...i,children:e})}function rd({theme:e,surface:t="Surface",as:r="section",padding:n,className:o,style:i,children:a,...l}){return de(r,{...e?{"data-theme":e}:{},"data-surface":t,className:o,style:{background:"var(--Background)",color:"var(--Text)",...void 0!==n?{padding:n}:{},...i},...l,children:a})}function nd(){return ce("div",{children:[de(qr,{style:{marginBottom:12},children:"Section"}),ce(cn,{color:"quiet",style:{marginBottom:32,maxWidth:720},children:[de("code",{children:"<Section>"})," bundles ",de("code",{children:"data-theme"})," +"," ",de("code",{children:"data-surface"})," + background paint into one component. Use anywhere you'd otherwise reach for"," ",de("code",{children:"<section data-theme data-surface style={{ background: var(--Background) }}>"}),". For wrapping without painting (e.g. AppBar's themed zone), use"," ",de("code",{children:"<ThemedZone>"}),"."]}),de(qr,{style:{marginTop:24,marginBottom:12},children:"Theme + surface"}),de(ln,{color:"quiet",style:{marginBottom:16,display:"block"},children:'Sets data-theme="Primary-Light" + data-surface="Surface", paints --Background.'}),ce(rd,{theme:"Primary-Light",surface:"Surface",padding:"32px",style:{borderRadius:8},children:[de(qr,{children:"Primary-Light surface"}),de(cn,{children:"Body text picks up --Text automatically."}),de(ln,{color:"quiet",children:"Quiet text picks up --Text-Quiet."}),de("div",{style:{marginTop:12},children:de(Io,{variant:"primary",children:"Primary button"})})]}),de(qr,{style:{marginTop:32,marginBottom:12},children:"Container surface"}),ce(rd,{surface:"Container",padding:"32px",style:{borderRadius:8},children:[de(qr,{children:"Container surface (inherits theme)"}),de(cn,{children:"Useful for card-like regions."})]}),de(qr,{style:{marginTop:32,marginBottom:12},children:"Different element"}),ce(ln,{color:"quiet",style:{marginBottom:16,display:"block"},children:["Pass ",de("code",{children:'as="article"'}),", ",de("code",{children:'as="footer"'}),", etc."]}),ce(rd,{as:"article",theme:"Neutral-Dark",surface:"Surface",padding:"32px",style:{borderRadius:8},children:[de(qr,{children:"Neutral-Dark article"}),de(cn,{children:"Renders as an <article> element."})]})]})}const od=["1:1","3:4","4:3","16:9","9:16","2:3","3:2","1:2","2:1","9:21","21:9","5:7","7:5","4:5","5:4","5:3","3:5","16:10","10:16","Golden-Horizontal","Golden-Vertical"],id="1.618034",ad={"1:1":"1 / 1","3:4":"3 / 4","4:3":"4 / 3","16:9":"16 / 9","9:16":"9 / 16","2:3":"2 / 3","3:2":"3 / 2","1:2":"1 / 2","2:1":"2 / 1","9:21":"9 / 21","21:9":"21 / 9","5:7":"5 / 7","7:5":"7 / 5","4:5":"4 / 5","5:4":"5 / 4","5:3":"5 / 3","3:5":"3 / 5","16:10":"16 / 10","10:16":"10 / 16","Golden-Horizontal":id+" / 1","Golden-Vertical":"1 / "+id},ld={none:0,xs:1,sm:2,md:3,lg:4,xl:6};function sd({ratio:e="1:1",children:r,variant:n="default",color:o="default",padding:i="none",fit:a="width",placeholder:l=!0,elevated:s=!1,clickable:d=!1,onClick:c,maxWidth:u,maxHeight:p,component:m="div",className:f="",sx:g={},...x}){const b=ad[e]||ad["1:1"],v=(y="default"===o?"Default":o).charAt(0).toUpperCase()+y.slice(1);var y;const S=l&&0===t.Children.count(r),k="default"===o?void 0:v,B="dark"===n?"Surface-Dimmest":"light"===n?"Surface-Brightest":void 0,w=void 0!==ld[i]?ld[i]:ld.none,C=d||!!c,T="default"===n,I=s?io:oo,A=s?ao:io;return de(h,{component:m,onClick:C?c:void 0,role:C?"button":void 0,tabIndex:C?0:void 0,className:"ratio ratio-"+e.toLowerCase()+" ratio-"+n+(C?" ratio-clickable":"")+(s?" ratio-elevated":"")+(f?" "+f:""),sx:{aspectRatio:b,flex:"0 0 auto",..."height"===a?{height:"100%",width:"auto",minHeight:24}:{width:"100%",height:"auto",minWidth:24},...void 0!==u&&{maxWidth:u},...void 0!==p&&{maxHeight:p},border:T?"none":"1px solid var(--Border-Variant)",borderRadius:T?0:"var(--Style-Border-Radius)",boxShadow:T?"none":I,overflow:"hidden",transition:"box-shadow 0.2s ease, border-color 0.2s ease",...C&&{cursor:"pointer","&:hover":{borderColor:"var(--Buttons-Default-Border)",boxShadow:A},"&:active":{transform:"scale(0.995)"},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"3px"}},...!C&&!T&&{"&:hover":{boxShadow:A}},...g},...x,children:de(h,{"data-theme":k||void 0,"data-surface":B,sx:{width:"100%",height:"100%",padding:w,backgroundColor:S?"var(--Border)":"var(--Background)",color:"var(--Text)",fontFamily:"inherit",borderRadius:T?0:"calc(var(--Style-Border-Radius) - 1px)",...S?{display:"flex",alignItems:"center",justifyContent:"center"}:{"& > *":{width:"100%",height:"100%"}}},children:S?de(Qn,{size:"large",sx:{color:"var(--Background)"},children:de(Ut,{})}):r})})}const dd=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",cd=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}],ud=["default","solid","light","dark"],pd=["none","xs","sm","md","lg","xl"];function hd({label:e,selected:t,onClick:r}){return de(Io,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function md({color:e,selected:t,onClick:r,variant:n}){const o=dd(e);return de(qs,{component:"button","data-theme":{solid:o,light:o+"-Light",dark:o,default:void 0}[n],"data-surface":{solid:"Surface",light:"Surface",dark:"Surface-Dimmest",default:"Surface"}[n],onClick:()=>r(e),"aria-label":"Select "+o,"aria-pressed":t,title:o,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Background)",border:t?"2px solid var(--Text)":"2px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Text)",pointerEvents:"none"}})})}function fd(){const[e,t]=r("1:1"),[n,o]=r("solid"),[i,a]=r("primary"),[l,s]=r("none"),[d,c]=r(!1),[u,p]=r(!1),[h,m]=r(null),[f,g]=r("Surface");return ce(qs,{sx:{pb:8},children:[de(qr,{children:"Ratio"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ui,{theme:h,surface:f,children:de(qs,{sx:{width:"100%",maxWidth:480},children:de(sd,{ratio:e,variant:n,color:i,padding:l,elevated:d,clickable:u})})}),de(ji,{code:(()=>{const t=['ratio="'+e+'"'];return"default"!==n&&t.push('variant="'+n+'"'),"default"!==i&&t.push('color="'+i+'"'),"none"!==l&&t.push('padding="'+l+'"'),d&&t.push("elevated"),u&&t.push("clickable onClick={handleClick}"),"<Ratio "+t.join(" ")+">\n {/* your content */}\n</Ratio>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(qs,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(li,{defaultValue:0,variant:"standard",color:"primary",children:[ce(si,{children:[de(di,{children:"Playground"}),de(di,{children:"Reference"})]}),de(ci,{value:0,children:ce(qs,{sx:{p:3},children:[de(qs,{sx:{mb:3},children:de(fi,{theme:h,onThemeChange:m,surface:f,onSurfaceChange:g})}),ce(qs,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"VARIANT"}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:ud.map(e=>de(hd,{label:dd(e),selected:n===e,onClick:()=>o(e)},e))})]}),ce(qs,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:cd.map(e=>ce(qs,{children:[de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:e.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:e.colors.map(e=>de(md,{color:e,selected:i===e,onClick:a,variant:"default"===n?"solid":n},e))})]},e.label))})]}),ce(qs,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"PADDING"}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:pd.map(e=>de(hd,{label:"none"===e?"None":e.toUpperCase(),selected:l===e,onClick:()=>s(e)},e))})]}),ce(qs,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"RATIO"}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:od.map(r=>de(hd,{label:r,selected:e===r,onClick:()=>t(r)},r))})]}),ce(qs,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(qs,{children:[de(kn,{children:"Elevated"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Bumps the shadow up one level"})]}),de(na,{checked:d,onChange:e=>c(e.target.checked),size:"small","aria-label":"Elevated"})]}),ce(qs,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(qs,{children:[de(kn,{children:"Clickable"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Adds hover, press, and focus-visible"})]}),de(na,{checked:u,onChange:e=>p(e.target.checked),size:"small","aria-label":"Clickable"})]})]})}),de(ci,{value:1,children:de(qs,{sx:{p:3},children:ce(B,{spacing:3,children:[ce(qs,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"Common use cases"}),de(B,{spacing:0,children:[{label:"1:1",value:"Square thumbnails, avatars, product tiles"},{label:"16:9",value:"Video, hero images, modern displays"},{label:"4:3",value:"Classic photo, presentation slides"},{label:"3:2",value:"DSLR photography, print frames"},{label:"21:9",value:"Cinematic ultrawide"},{label:"9:16 / 4:5 / 5:7",value:"Portrait social media (Stories, Reels, prints)"},{label:"16:10",value:"Laptop / monitor displays"},{label:"Golden-Horizontal",value:"φ : 1 — design framing for cards, hero blocks"},{label:"Golden-Vertical",value:"1 : φ — vertical posters, sidebars"}].map(({label:e,value:t})=>ce(qs,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ln,{children:e}),de(bn,{style:{color:"var(--Text-Quiet)"},children:t})]},e))})]}),ce(cn,{color:"quiet",children:["Built on native CSS ",de("code",{children:"aspect-ratio"}),". The themed shell mirrors Box — pick a variant + color to paint the frame, or keep ",de("code",{children:'variant="default"'}),"for a borderless ratio container."]})]})})})]})})})]})]})}const gd=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",xd=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}],bd=[{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}];function vd({label:e,selected:t,onClick:r}){return de(Io,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function yd({color:e,selected:t,onClick:r}){const n=gd(e);return de(h,{component:"button",onClick:()=>r(e),"aria-label":"Select "+n,"aria-pressed":t,title:n,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+n+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Buttons-"+n+"-Text)",pointerEvents:"none"}})})}function Sd(){const[e,t]=r("standard"),[n,o]=r("default"),[i,a]=r("medium"),[l,s]=r("horizontal"),[d,c]=r(null),[u,p]=r("Surface"),[m,f]=r(!1),g="standard"===e?xd:bd;return ce(h,{sx:{pb:8},children:[de(qr,{children:"Tabs"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ui,{theme:d,surface:u,children:de(h,{sx:{width:"100%",maxWidth:"vertical"===l?500:"100%",display:"flex",flexDirection:"vertical"===l?"row":"column"},children:ce(li,{defaultValue:0,variant:e,color:n,size:i,orientation:l,children:[ce(si,{rounded:m,children:[de(di,{children:"Overview"}),de(di,{children:"Features"}),de(di,{children:"Pricing"})]}),de(ci,{value:0,children:de(h,{sx:{p:2},children:de(cn,{style:{color:"var(--Quiet)"},children:"Overview content goes here."})})}),de(ci,{value:1,children:de(h,{sx:{p:2},children:de(cn,{style:{color:"var(--Quiet)"},children:"Features content goes here."})})}),de(ci,{value:2,children:de(h,{sx:{p:2},children:de(cn,{style:{color:"var(--Quiet)"},children:"Pricing content goes here."})})})]})})}),de(ji,{code:(()=>{const t=[];return"standard"!==e&&t.push('variant="'+e+'"'),"default"!==n&&t.push('color="'+n+'"'),"medium"!==i&&t.push('size="'+i+'"'),"horizontal"!==l&&t.push('orientation="vertical"'),"<Tabs defaultValue={0}"+(t.length?" "+t.join(" "):"")+">\n <TabList"+(m?" rounded":"")+">\n <Tab>Overview</Tab>\n <Tab>Features</Tab>\n <Tab>Pricing</Tab>\n </TabList>\n <TabPanel value={0}>Overview content</TabPanel>\n <TabPanel value={1}>Features content</TabPanel>\n <TabPanel value={2}>Pricing content</TabPanel>\n</Tabs>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(li,{defaultValue:0,variant:"standard",color:"primary",children:[ce(si,{children:[de(di,{children:"Playground"}),de(di,{children:"Accessibility"})]}),de(ci,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(fi,{theme:d,onThemeChange:c,surface:u,onSurfaceChange:p})}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"STYLE"}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:["standard","solid","light","dark"].map(r=>de(vd,{label:gd("standard"===r?"default":r),selected:e===r,onClick:()=>(e=>{t(e),"standard"!==e&&"default"===n&&o("primary")})(r)},r))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:g.map(e=>ce(h,{children:[de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:e.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:e.colors.map(e=>de(yd,{color:e,selected:n===e,onClick:o},e))})]},e.label))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",spacing:1,children:["small","medium","large"].map(e=>de(vd,{label:gd(e),selected:i===e,onClick:()=>a(e)},e))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"ORIENTATION"}),de(B,{direction:"row",spacing:1,children:["horizontal","vertical"].map(e=>de(vd,{label:gd(e),selected:l===e,onClick:()=>s(e)},e))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SHAPE"}),de(na,{label:"Rounded corners",checked:m,onChange:e=>f(e.target.checked)}),ce(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:["Off by default. When on, the TabList applies"," ",de("code",{children:"var(--Style-Border-Radius)"})," and clips the active tab's background to fit the rounded shell (",de("code",{children:"overflow: hidden"})," is always on)."]})]})]})}),de(ci,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"TabList",value:'role="tablist" aria-orientation'},{label:"Tab",value:'role="tab" aria-selected aria-controls={panelId}'},{label:"TabPanel",value:'role="tabpanel" aria-labelledby={tabId}'},{label:"Keyboard",value:"Arrow keys navigate tabs. Home/End jump to first/last."},{label:"Focus",value:"outline: 3px solid var(--Focus-Visible); outline-offset: -3px"},{label:"Indicator",value:"Standard: var(--Buttons-{C}-Border). Themed: var(--Text)."}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ln,{children:[e,":"]}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}const kd={small:{fontSize:"var(--Body-Small-Font-Size)",gap:"6px",py:"4px"},medium:{fontSize:"var(--Body-Font-Size)",gap:"8px",py:"6px"},large:{fontSize:"var(--Body-Large-Font-Size)",gap:"10px",py:"8px"}};function Bd({children:e,separator:r="/",size:n="medium",condense:o=!1,maxItems:i=4,itemsBeforeCollapse:a=1,itemsAfterCollapse:l=1,backOnlyMobile:s=!1,onExpand:d,className:c="",sx:m={},...f}){const g=kd[n]||kd.medium,x=u.toArray(e).filter(p),b=x.length,v=o&&b>i;let y=x;const[S,k]=t.useState(!1);if(v&&!S){const e=x.slice(0,a),t=x.slice(b-l);y=[...e,de(h,{component:"button",onClick:()=>{k(!0),d?.()},"aria-label":"Show full breadcrumb trail",className:"breadcrumb-ellipsis",sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",background:"none",border:"none",padding:"2px 4px",cursor:"pointer",fontFamily:"inherit",fontSize:"inherit",color:"var(--Quiet)",borderRadius:"4px","&:hover":{backgroundColor:"var(--Hover)",color:"var(--Text)"},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"1px"}},children:"…"},"__breadcrumb-ellipsis"),...t]}const B=[];y.forEach((e,t)=>{const n=v&&!S?t===y.length-1:t===b-1;B.push(de(h,{component:"li",className:"breadcrumb-item"+(n?" breadcrumb-current":""),sx:{display:"inline-flex",alignItems:"center",...n&&{color:"var(--Text)",fontWeight:600},...!n&&{color:"var(--Quiet)"},maxWidth:"200px","& > *":{overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"}},...n?{"aria-current":"page"}:{},children:e},"crumb-"+t)),t<y.length-1&&B.push(de(h,{component:"li",role:"presentation","aria-hidden":"true",className:"breadcrumb-separator",sx:{display:"inline-flex",alignItems:"center",color:"var(--Quiet)",userSelect:"none",fontSize:"inherit",lineHeight:1,flexShrink:0},children:r},"sep-"+t))});const w=b>=2?x[b-2]:null;return ce(h,{component:"nav","aria-label":"Breadcrumb",className:"breadcrumbs breadcrumbs-"+n+" "+c,sx:{fontSize:g.fontSize,fontFamily:"var(--Body-Font-Family)",lineHeight:1.5,...m},...f,children:[de(h,{component:"ol",className:"breadcrumbs-list",sx:{display:"flex",flexWrap:"wrap",alignItems:"center",gap:g.gap,listStyle:"none",margin:0,padding:0,...s&&{"@media (max-width: 600px)":{display:"none"}}},children:B}),s&&w&&ce(h,{className:"breadcrumbs-back-mobile",sx:{display:"none","@media (max-width: 600px)":{display:"flex",alignItems:"center",gap:"4px",fontSize:g.fontSize,color:"var(--Link)"}},children:[de(h,{component:"span","aria-hidden":"true",sx:{fontSize:"1.1em",lineHeight:1},children:"←"}),t.cloneElement(w,{style:{...w.props?.style||{},textDecoration:"underline",textUnderlineOffset:"3px"}})]})]})}function wd({children:e,href:t,className:r="",sx:n={},...o}){const i=!!t;return de(h,{component:i?"a":"span",href:t||void 0,className:"breadcrumb-link "+r,sx:{color:"inherit",textDecoration:i?"underline":"none",textUnderlineOffset:"3px",textDecorationThickness:"1px",cursor:i?"pointer":"default",transition:"color 0.15s ease",...i&&{"&:hover":{color:"var(--Link-Hover)",textDecorationThickness:"2px"},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"2px",borderRadius:"2px"}},...n},...o,children:e})}const Cd=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"";function Td({label:e,selected:t,onClick:r}){return de(Io,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function Id(){const[e,t]=r("medium"),[n,o]=r("/"),[i,a]=r(!1),[l,s]=r(null),[d,c]=r("Surface");return ce(h,{sx:{pb:8},children:[de(qr,{children:"Breadcrumbs"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ui,{theme:l,surface:d,children:ce(Bd,{size:e,separator:n,condense:i,maxItems:3,children:[de(wd,{href:"#",children:"Home"}),de(wd,{href:"#",children:"Products"}),de(wd,{href:"#",children:"Shoes"}),de(wd,{children:"Running Shoes"})]})}),de(ji,{code:(()=>{const t=[];return"medium"!==e&&t.push('size="'+e+'"'),"/"!==n&&t.push('separator="'+n+'"'),i&&t.push("condense maxItems={3}"),"<Breadcrumbs"+(t.length?" "+t.join(" "):"")+'>\n <BreadcrumbItem href="/">Home</BreadcrumbItem>\n <BreadcrumbItem href="/products">Products</BreadcrumbItem>\n <BreadcrumbItem href="/products/shoes">Shoes</BreadcrumbItem>\n <BreadcrumbItem>Running Shoes</BreadcrumbItem>\n</Breadcrumbs>'})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(li,{defaultValue:0,variant:"standard",color:"primary",children:[ce(si,{children:[de(di,{children:"Playground"}),de(di,{children:"Accessibility"})]}),de(ci,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(fi,{theme:l,onThemeChange:s,surface:d,onSurfaceChange:c})}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",spacing:1,children:["small","medium","large"].map(r=>de(Td,{label:Cd(r),selected:e===r,onClick:()=>t(r)},r))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SEPARATOR"}),de(B,{direction:"row",spacing:1,children:["/","›","→","·","|"].map(e=>de(Td,{label:e,selected:n===e,onClick:()=>o(e)},e))})]}),ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Condense"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Collapse middle items into ellipsis"})]}),de(na,{variant:"default-outline",checked:i,onChange:e=>a(e.target.checked),size:"small","aria-label":"Condense"})]})]})}),de(ci,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Nav",value:'<nav aria-label="Breadcrumb">'},{label:"List",value:"<ol> with <li> for each crumb"},{label:"Current",value:'aria-current="page" on the last item'},{label:"Links",value:"BreadcrumbItem renders <a> when href is provided"},{label:"Ellipsis",value:'Expandable button with aria-label="Show full breadcrumb trail"'},{label:"Separator",value:'aria-hidden="true" — decorative only'}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ln,{children:[e,":"]}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}const Ad={small:{btnSize:"small",fontSize:"13px",gap:"2px"},medium:{btnSize:"medium",fontSize:"14px",gap:"4px"},large:{btnSize:"large",fontSize:"16px",gap:"4px"}};function zd({count:e=10,page:t,defaultPage:n=1,onChange:o,color:a="default",size:l="medium",siblingCount:s=1,boundaryCount:d=1,disabled:c=!1,showFirstButton:u=!1,showLastButton:p=!1,className:m="",sx:f={},...g}){const[x,b]=r(n),v=void 0!==t,y=v?t:x;(e=>{e.charAt(0).toUpperCase(),e.slice(1)})("default"===a?"Default":a);const S=Ad[l]||Ad.medium,k=i(t=>{const r=Math.max(1,Math.min(e,t));v||b(r),o?.(r)},[e,v,o]),B=function({count:e,page:t,siblingCount:r=1,boundaryCount:n=1}){const o=(e,t)=>Array.from({length:t-e+1},(t,r)=>e+r);if(2*r+3+2*n>=e)return o(1,e);const i=Math.max(t-r,n+1),a=Math.min(t+r,e-n),l=i>n+2,s=a<e-n-1;if(!l&&s)return[...o(1,Math.min(3+2*r+n,e)),"ellipsis-right",...o(e-n+1,e)];if(l&&!s){const t=o(Math.max(e-(3+2*r+n)+1,1),e);return[...o(1,n),"ellipsis-left",...t]}return l&&s?[...o(1,n),"ellipsis-left",...o(i,a),"ellipsis-right",...o(e-n+1,e)]:o(1,e)}({count:e,page:y,siblingCount:s,boundaryCount:d}),w="default"===a?"default":a;return de(h,{component:"nav","aria-label":"Pagination",className:"pagination pagination-"+a+" pagination-"+l+" "+m,sx:{display:"inline-flex",...f},...g,children:ce(h,{component:"ul",sx:{display:"flex",alignItems:"center",gap:S.gap,listStyle:"none",m:0,p:0,flexWrap:"wrap"},children:[u&&de(h,{component:"li",children:de(Io,{iconOnly:!0,variant:w+"-outline",size:S.btnSize,disabled:c||1===y,onClick:()=>k(1),"aria-label":"Go to first page",children:de(Qn,{size:"small",children:de(Kt,{})})})}),de(h,{component:"li",children:de(Io,{iconOnly:!0,variant:w+"-outline",size:S.btnSize,disabled:c||1===y,onClick:()=>k(y-1),"aria-label":"Go to previous page",children:de(Qn,{size:"small",children:de(Xt,{})})})}),B.map((e,t)=>{if("string"==typeof e)return de(h,{component:"li",children:de(bn,{style:{color:"var(--Quiet)",padding:"0 4px"},"aria-hidden":"true",children:"…"})},e+"-"+t);const r=e===y;return de(h,{component:"li",children:de(Io,{variant:r?w:w+"-outline",size:S.btnSize,disabled:c,onClick:()=>k(e),"aria-label":"Page "+e,"aria-current":r?"page":void 0,letterNumber:!0,children:e})},e)}),de(h,{component:"li",children:de(Io,{iconOnly:!0,variant:w+"-outline",size:S.btnSize,disabled:c||y===e,onClick:()=>k(y+1),"aria-label":"Go to next page",children:de(Qn,{size:"small",children:de($t,{})})})}),p&&de(h,{component:"li",children:de(Io,{iconOnly:!0,variant:w+"-outline",size:S.btnSize,disabled:c||y===e,onClick:()=>k(e),"aria-label":"Go to last page",children:de(Qn,{size:"small",children:de(qt,{})})})})]})})}const Rd=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",Ed=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}];function Pd({label:e,selected:t,onClick:r}){return de(Io,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function Ld({color:e,selected:t,onClick:r}){const n=Rd(e);return de(h,{component:"button",onClick:()=>r(e),"aria-label":"Select "+n,"aria-pressed":t,title:n,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+n+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Buttons-"+n+"-Text)",pointerEvents:"none"}})})}function Md(){const[e,t]=r("default"),[n,o]=r("medium"),[i,a]=r(10),[l,s]=r(!1),[d,c]=r(!1),[u,p]=r(!1),[m,f]=r(null),[g,x]=r("Surface");return ce(h,{sx:{pb:8},children:[de(qr,{children:"Pagination"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ui,{theme:m,surface:g,children:de(zd,{color:e,size:n,count:i,showFirstButton:l,showLastButton:d,disabled:u})}),de(ji,{code:(()=>{const t=[];return"default"!==e&&t.push('color="'+e+'"'),"medium"!==n&&t.push('size="'+n+'"'),10!==i&&t.push("count={"+i+"}"),l&&t.push("showFirstButton"),d&&t.push("showLastButton"),u&&t.push("disabled"),t.push("onChange={handlePageChange}"),1===t.length?"<Pagination onChange={handlePageChange} />":"<Pagination\n "+t.join("\n ")+"\n/>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(li,{defaultValue:0,variant:"standard",color:"primary",children:[ce(si,{children:[de(di,{children:"Playground"}),de(di,{children:"Accessibility"})]}),de(ci,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(fi,{theme:m,onThemeChange:f,surface:g,onSurfaceChange:x})}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:Ed.map(r=>ce(h,{children:[de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:r.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:r.colors.map(r=>de(Ld,{color:r,selected:e===r,onClick:t},r))})]},r.label))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",spacing:1,children:["small","medium","large"].map(e=>de(Pd,{label:Rd(e),selected:n===e,onClick:()=>o(e)},e))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"PAGES"}),de(B,{direction:"row",spacing:1,children:[5,10,20,50].map(e=>de(Pd,{label:String(e),selected:i===e,onClick:()=>a(e)},e))})]}),ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"First/Last Buttons"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Show jump to first/last page"})]}),de(na,{variant:"default-outline",checked:l,onChange:e=>{s(e.target.checked),c(e.target.checked)},size:"small","aria-label":"First/last buttons"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Disabled"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Non-interactive state"})]}),de(na,{variant:"default-outline",checked:u,onChange:e=>p(e.target.checked),size:"small","aria-label":"Disabled"})]})]})}),de(ci,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Nav",value:'<nav aria-label="Pagination">'},{label:"List",value:"<ol> with <li> for each button"},{label:"Current",value:'aria-current="page" on selected page'},{label:"Labels",value:'aria-label="Page N", "Go to previous/next/first/last page"'},{label:"Keyboard",value:"Tab navigates between buttons"},{label:"Focus",value:"Uses Button component focus styles"}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ln,{children:[e,":"]}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}const Wd=e=>e.charAt(0).toUpperCase()+e.slice(1),Od={small:{py:"var(--Sizing-Half)",itemPx:"var(--Sizing-1)",itemPy:"var(--Sizing-Half)",fontSize:"var(--Sm-Button-Text)",minWidth:"140px"},medium:{py:"6px",itemPx:"var(--Sizing-1-and-Half)",itemPy:"6px",fontSize:"var(--Button-Text)",minWidth:"160px"},large:{py:"var(--Sizing-1)",itemPx:"var(--Sizing-2)",itemPy:"var(--Sizing-1)",fontSize:"var(--Lg-Button-Text)",minWidth:"180px"}},Dd=s({open:!1,setOpen:()=>{},anchorRef:{current:null},menuId:"",buttonId:"",variant:"outline",color:"default",size:"medium"}),Fd=()=>l(Dd);function Nd({children:e,variant:t="outline",color:a="default",size:l="medium",open:s,onOpenChange:d,...c}){const[u,p]=r(!1),m=void 0!==s,f=m?s:u,g=o(null),x=n(),b="menu-"+x,v="menubtn-"+x,y=i(e=>{const t="function"==typeof e?e(f):e;m?d?.(t):p(t)},[m,f,d]);return de(Dd.Provider,{value:{open:f,setOpen:y,anchorRef:g,menuId:b,buttonId:v,variant:t,color:a,size:l},children:de(h,{sx:{display:"inline-flex",position:"relative"},...c,children:e})})}function Hd({children:e,className:t="",sx:r={},...n}){const{open:o,setOpen:i,anchorRef:a,menuId:l,buttonId:s,size:d,color:c}=Fd(),u=Od[d]||Od.medium,p=Wd("default"===c?"Default":c);return ce(h,{component:"button",ref:a,id:s,"aria-haspopup":"true","aria-expanded":o,"aria-controls":o?l:void 0,onClick:()=>i(e=>!e),className:"menu-button "+t,sx:{display:"inline-flex",alignItems:"center",gap:"6px",padding:u.itemPy+" "+u.itemPx,fontSize:u.fontSize,fontFamily:"inherit",fontWeight:600,color:"var(--Text)",backgroundColor:"var(--Background)",border:"1px solid var(--Buttons-"+p+"-Border)",borderRadius:"var(--Style-Border-Radius)",cursor:"pointer",boxShadow:"none",transition:"box-shadow 0.15s ease","&:focus-visible":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"},...r},onKeyDown:e=>{"ArrowDown"!==e.key&&"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),i(!0))},...n,children:["string"==typeof e?de("small"===d?ln:cn,{style:{color:"inherit",fontWeight:600},children:e}):e,de(Qn,{size:"small",sx:{color:"var(--Quiet)",transition:"transform 0.2s ease",transform:o?"rotate(180deg)":"rotate(0deg)"},children:de(Se,{})})]})}function Vd({children:e,className:t="",placement:r="bottom-start",sx:n={},...i}){const{open:l,setOpen:s,anchorRef:d,menuId:c,buttonId:u,variant:p,color:m,size:f}=Fd(),g=o(null),x=Od[f]||Od.medium,b=Wd("default"===m?"Default":m),v="var(--Buttons-"+b+"-Border)",y="light"===p?"default"===m?"Default":b:"solid"===p?b:void 0,S="light"===p?"Surface-Brightest":"solid"===p?"Surface":void 0;return a(()=>{if(l&&g.current){const e=g.current.querySelector('[role="menuitem"]:not([aria-disabled="true"])');e&&e.focus()}},[l]),a(()=>{if(!l)return;const e=e=>{g.current&&!g.current.contains(e.target)&&d.current&&!d.current.contains(e.target)&&s(!1)};return document.addEventListener("mousedown",e),()=>document.removeEventListener("mousedown",e)},[l,s,d]),a(()=>{if(!l)return;const e=e=>{"Escape"===e.key&&(s(!1),d.current?.focus())};return document.addEventListener("keydown",e),()=>document.removeEventListener("keydown",e)},[l,s,d]),l?de(h,{className:"menu menu-"+p+" "+t,sx:{position:"absolute",top:"100%",left:"bottom-end"===r?"auto":0,right:"bottom-end"===r?0:"auto",zIndex:99999,marginTop:"4px",border:"1px solid "+v,borderRadius:"var(--Dropdown-Frame-Radius, var(--Input-Radius, var(--Style-Border-Radius, 4px)))",boxShadow:"none",overflow:"hidden",...n},children:de(h,{ref:g,id:c,role:"menu","aria-labelledby":u,"data-theme":y,"data-surface":S,sx:{minWidth:x.minWidth,backgroundColor:"var(--Background)",color:"var(--Text)",fontSize:x.fontSize,fontFamily:"inherit",padding:x.py+" 0",outline:"none",borderRadius:"calc(var(--Dropdown-Frame-Radius, var(--Input-Radius, var(--Style-Border-Radius, 4px))) - 1px)"},onKeyDown:e=>{const t=g.current?.querySelectorAll('[role="menuitem"]:not([aria-disabled="true"])');if(!t?.length)return;const r=Array.from(t).indexOf(document.activeElement);"ArrowDown"===e.key?(e.preventDefault(),t[(r+1)%t.length].focus()):"ArrowUp"===e.key?(e.preventDefault(),t[(r-1+t.length)%t.length].focus()):"Home"===e.key?(e.preventDefault(),t[0].focus()):"End"===e.key?(e.preventDefault(),t[t.length-1].focus()):"Tab"===e.key&&s(!1)},...i,children:e})}):null}function Qd({children:e,onClick:t,selected:r=!1,disabled:n=!1,className:o="",sx:i={},...a}){const{setOpen:l,size:s}=Fd(),d=Od[s]||Od.medium,c=r?"small"===s?rn:tn:"small"===s?ln:cn,u=()=>{n||(t?.(),l(!1))};return de(h,{role:"menuitem",tabIndex:n?-1:0,"aria-disabled":n||void 0,"aria-selected":r||void 0,onClick:u,onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),u())},className:"menu-item"+(r?" menu-item-selected":"")+" "+o,sx:{display:"flex",alignItems:"center",gap:"var(--Sizing-1)",padding:d.itemPy+" "+d.itemPx,fontSize:d.fontSize,color:n?"var(--Quiet)":r?"var(--Text)":"var(--Quiet)",backgroundColor:r?"var(--Hover)":"transparent",cursor:n?"not-allowed":"pointer",opacity:n?.5:1,outline:"none",transition:"background-color 0.1s ease, color 0.1s ease",userSelect:"none",...!n&&{"&:hover":{backgroundColor:"var(--Hover)",color:"var(--Text)"},"&:focus-visible":{backgroundColor:"var(--Hover)",color:"var(--Text)",outline:"3px solid var(--Focus-Visible)",outlineOffset:"-3px"}},...i},...a,children:de(c,{color:"standard",style:{color:"inherit"},children:e})})}function jd({className:e="",sx:t={},...r}){return de(h,{component:"hr",role:"separator",className:"menu-divider "+e,sx:{border:"none",borderTop:"1px solid var(--Border)",margin:"4px 0",...t},...r})}const Gd=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",Ud=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}];function Xd({label:e,selected:t,onClick:r}){return de(Io,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function $d({color:e,selected:t,onClick:r}){const n=Gd(e);return de(h,{component:"button",onClick:()=>r(e),"aria-label":"Select "+n,"aria-pressed":t,title:n,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+n+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Buttons-"+n+"-Text)",pointerEvents:"none"}})})}function Kd(){const[e,t]=r("outline"),[n,o]=r("default"),[i,a]=r("medium"),[l,s]=r(null),[d,c]=r("Surface");return ce(h,{sx:{pb:8},children:[de(qr,{children:"Menu"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ui,{theme:l,surface:d,sx:{minHeight:250,alignItems:"flex-start",pt:6},children:ce(Nd,{variant:e,color:n,size:i,children:[de(Hd,{children:"Actions"}),ce(Vd,{children:[de(Qd,{children:"Edit"}),de(Qd,{children:"Duplicate"}),de(Qd,{selected:!0,children:"Archive"}),de(jd,{}),de(Qd,{disabled:!0,children:"Delete"})]})]})}),de(ji,{code:(()=>{const t=[];return"outline"!==e&&t.push('variant="'+e+'"'),"default"!==n&&t.push('color="'+n+'"'),"medium"!==i&&t.push('size="'+i+'"'),"<Dropdown "+t.join(" ")+">\n <MenuButton>Actions</MenuButton>\n <Menu>\n <MenuItem>Edit</MenuItem>\n <MenuItem>Duplicate</MenuItem>\n <MenuDivider />\n <MenuItem>Delete</MenuItem>\n </Menu>\n</Dropdown>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(li,{defaultValue:0,variant:"standard",color:"primary",children:[ce(si,{children:[de(di,{children:"Playground"}),de(di,{children:"Accessibility"})]}),de(ci,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(fi,{theme:l,onThemeChange:s,surface:d,onSurfaceChange:c})}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"STYLE"}),de(B,{direction:"row",spacing:1,children:["outline","solid","light"].map(r=>de(Xd,{label:Gd(r),selected:e===r,onClick:()=>t(r)},r))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:Ud.map(e=>ce(h,{children:[de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:e.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:e.colors.map(e=>de($d,{color:e,selected:n===e,onClick:o},e))})]},e.label))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",spacing:1,children:["small","medium","large"].map(e=>de(Xd,{label:Gd(e),selected:i===e,onClick:()=>a(e)},e))})]})]})}),de(ci,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Button",value:'aria-haspopup="true" aria-expanded aria-controls'},{label:"Menu",value:'role="menu" aria-labelledby={buttonId}'},{label:"Items",value:'role="menuitem" with tabIndex'},{label:"Selected",value:'aria-selected="true" on active item'},{label:"Disabled",value:'aria-disabled="true", not focusable'},{label:"Keyboard",value:"Arrow keys navigate. Enter/Space selects. Escape closes."},{label:"Focus",value:"First item focused on open. Focus returns to button on close."}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ln,{children:[e,":"]}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}const qd={default:"Nav-Bar",primary:"Primary","primary-light":"Primary-Light","primary-medium":"Primary-Medium","primary-dark":"Primary-Dark",white:"White",black:"Black"};function Yd({items:e=[],value:t,defaultValue:n=0,onChange:o,showLabels:a=!0,labelOrientation:l="vertical",backfill:s=!0,barColor:d="default",fixed:c=!0,className:u="",sx:p={},...m}){const[f,g]=r(n),x=void 0!==t,b=x?t:f,v=i(e=>{x||g(e),o?.(e)},[x,o]),y="horizontal"===(e.length>4?"vertical":l);return de(h,{component:"nav",role:"navigation","aria-label":"Bottom navigation","data-theme":qd[d]||qd.default,"data-surface":"Surface-Dim",className:"bottom-nav bottom-nav-"+d+(a?" bottom-nav-labels":"")+(y&&a?" bottom-nav-horizontal":"")+(s?" bottom-nav-backfill":"")+(c?" bottom-nav-fixed":"")+(u?" "+u:""),sx:{display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:"var(--Background)",borderTop:"1px solid var(--Border)",fontFamily:"inherit",width:"100%",...c&&{position:"fixed",bottom:0,left:0,right:0,zIndex:1100},...p},...m,children:de(h,{role:"tablist",sx:{display:"flex",alignItems:"center",justifyContent:"space-around",width:"100%",maxWidth:600,height:a&&!y?72:64,px:1},children:e.map((e,t)=>{const r=t===b;return de(Jd,{icon:e.icon,label:e.label,selected:r,showLabel:a,horizontal:y,backfill:s,onClick:()=>v(t),ariaLabel:e.label||"Tab "+(t+1)},e.key||t)})})})}function Jd({icon:e,label:t,selected:r,showLabel:n,horizontal:o,backfill:i,onClick:a,ariaLabel:l}){const s="var(--Text-Quiet)",d="var(--Text)",c="var(--Buttons-Primary-Text)",u=r?i&&o?c:d:s,p=!o,m=ce(h,{sx:{display:"flex",flexDirection:o?"row":"column",alignItems:"center",justifyContent:"center",gap:o?.75:0,...r&&i&&{backgroundColor:"var(--Buttons-Primary-Button)",border:"1px solid var(--Buttons-Primary-Border)",borderRadius:"16px",px:o?2:2.5,py:.5},...r&&i?{}:{px:o?1:0,border:"1px solid transparent"},transition:"background-color 0.2s ease, border-color 0.2s ease"},children:[de(h,{sx:{display:"flex",alignItems:"center",justifyContent:"center",fontSize:"24px",color:r?i?c:d:s,transition:"color 0.15s ease","& .MuiSvgIcon-root":{fontSize:"inherit",color:"inherit"}},children:e}),n&&o&&t&&de(h,{sx:{fontSize:"13px",fontWeight:r?600:500,color:r&&i?c:r?d:s,whiteSpace:"nowrap",lineHeight:1,transition:"color 0.15s ease"},children:t})]});return ce(h,{component:"button",type:"button",role:"tab","aria-selected":r,"aria-label":l,onClick:a,sx:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",flex:1,gap:p&&n?.25:0,border:"none",backgroundColor:"transparent",cursor:"pointer",outline:"none",fontFamily:"inherit",py:1,minWidth:0,transition:"transform 0.1s ease","&:hover":{transform:"scale(1.04)"},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"-2px",borderRadius:"8px"}},children:[m,n&&p&&t&&de(h,{sx:{fontSize:"11px",fontWeight:r?600:400,color:u,whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis",maxWidth:"100%",lineHeight:1.2,mt:.25,transition:"color 0.15s ease"},children:t})]})}const Zd={Home:de(Be,{sx:{fontSize:"inherit"}}),Explore:de(Yt,{sx:{fontSize:"inherit"}}),Radio:de(Jt,{sx:{fontSize:"inherit"}}),Library:de(Zt,{sx:{fontSize:"inherit"}}),Favorite:de(ke,{sx:{fontSize:"inherit"}}),Person:de(me,{sx:{fontSize:"inherit"}}),Search:de(Te,{sx:{fontSize:"inherit"}}),Settings:de(Ce,{sx:{fontSize:"inherit"}}),Notifications:de(Ae,{sx:{fontSize:"inherit"}}),Cart:de(Re,{sx:{fontSize:"inherit"}}),Star:de(Ie,{sx:{fontSize:"inherit"}}),Bookmark:de(_t,{sx:{fontSize:"inherit"}})},_d=Object.keys(Zd),ec=[{icon:"Home",label:"Home"},{icon:"Explore",label:"Browse"},{icon:"Radio",label:"Radio"},{icon:"Library",label:"Library"}],tc=[{value:"default",label:"Default",desc:'data-theme="Nav-Bar"'},{value:"primary",label:"Primary",desc:'data-theme="Primary"'},{value:"primary-light",label:"Primary Light",desc:'data-theme="Primary-Light"'},{value:"primary-medium",label:"Primary Medium",desc:'data-theme="Primary-Medium"'},{value:"primary-dark",label:"Primary Dark",desc:'data-theme="Primary-Dark"'},{value:"white",label:"White",desc:'data-theme="White"'},{value:"black",label:"Black",desc:'data-theme="Black"'}];function rc({label:e,selected:t,onClick:r,disabled:n}){return de(h,{component:"button",onClick:r,disabled:n,sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",cursor:n?"not-allowed":"pointer",border:"2px solid var(--Buttons-Primary-Button)",borderRadius:"var(--Style-Border-Radius)",backgroundColor:t?"var(--Buttons-Primary-Button)":"transparent",color:t?"var(--Buttons-Primary-Text)":"var(--Text)",padding:"4px 12px",fontSize:"14px",fontFamily:"inherit",fontWeight:500,whiteSpace:"nowrap",flexShrink:0,opacity:n?.4:1,transition:"background-color 0.15s ease, color 0.15s ease","&:hover":{backgroundColor:n?"transparent":t?"var(--Buttons-Primary-Hover)":"var(--Surface-Dim)"},"&:focus-visible":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"}},children:e})}function nc({value:e,onChange:t,placeholder:r,sx:n}){return de(h,{component:"input",type:"text",value:e,onChange:e=>t(e.target.value),placeholder:r,sx:{flex:1,padding:"4px 8px",fontSize:"13px",fontFamily:"inherit",border:"1px solid var(--Border)",borderRadius:"4px",backgroundColor:"var(--Background)",color:"var(--Text)",outline:"none",minWidth:0,"&:focus":{borderColor:"var(--Focus-Visible)"},...n}})}function oc({value:e,onChange:t,options:r,label:n}){return de(h,{component:"select",value:e,onChange:e=>t(e.target.value),"aria-label":n,sx:{padding:"4px 6px",fontSize:"13px",fontFamily:"inherit",border:"1px solid var(--Border)",borderRadius:"4px",backgroundColor:"var(--Background)",color:"var(--Text)",outline:"none",cursor:"pointer","&:focus":{borderColor:"var(--Focus-Visible)"}},children:r.map(e=>de("option",{value:"string"==typeof e?e:e.value,children:"string"==typeof e?e:e.label},"string"==typeof e?e:e.value))})}function ic({value:e,onChange:t,min:r,max:n,label:o}){return ce(h,{sx:{display:"flex",alignItems:"center",gap:1},children:[de(bn,{style:{color:"var(--Text-Quiet)",flexShrink:0,width:90},children:o}),de("button",{type:"button",onClick:()=>{e>r&&t(e-1)},disabled:e<=r,style:{width:28,height:28,display:"flex",alignItems:"center",justifyContent:"center",border:"1px solid var(--Border)",borderRadius:"4px",backgroundColor:"var(--Background)",color:"var(--Text)",cursor:e<=r?"not-allowed":"pointer",fontSize:"14px",opacity:e<=r?.4:1,fontFamily:"inherit"},children:"−"}),de(h,{sx:{fontWeight:700,fontSize:"14px",minWidth:24,textAlign:"center"},children:e}),de("button",{type:"button",onClick:()=>{e<n&&t(e+1)},disabled:e>=n,style:{width:28,height:28,display:"flex",alignItems:"center",justifyContent:"center",border:"1px solid var(--Border)",borderRadius:"4px",backgroundColor:"var(--Background)",color:"var(--Text)",cursor:e>=n?"not-allowed":"pointer",fontSize:"14px",opacity:e>=n?.4:1,fontFamily:"inherit"},children:"+"})]})}function ac({label:e,checked:t,onChange:r,caption:n,disabled:o}){return ce(h,{sx:{py:.5,opacity:o?.4:1},children:[de(v,{control:de(b,{checked:t,onChange:e=>r(e.target.checked),size:"small",disabled:o,sx:{color:"var(--Text-Quiet)","&.Mui-checked":{color:"var(--Buttons-Primary-Button)"}}}),label:de(kn,{children:e}),sx:{m:0}}),n&&de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginLeft:32},children:n})]})}function lc(){const[e,t]=r(0),[n,o]=r(0),[i,l]=r(!0),[s,d]=r(!0),[c,u]=r("vertical"),[p,m]=r(!0),[f,g]=r("default"),[x,b]=r(4),[v,y]=r(ec.map(e=>({icon:e.icon,label:e.label}))),S=x<=4;a(()=>{x>4&&"horizontal"===c&&u("vertical")},[x,c]),a(()=>{y(e=>{const t=[],r=[{icon:"Favorite",label:"Favorites"},{icon:"Person",label:"Profile"}];for(let n=0;n<x;n++)if(e[n])t.push(e[n]);else{const e=r[n-ec.length]||{icon:_d[n%_d.length],label:_d[n%_d.length]};t.push(e)}return t}),o(e=>Math.min(e,x-1))},[x]);const k=(e,t,r)=>{y(n=>{const o=[...n];return o[e]={...o[e],[t]:r},o})},w=v.slice(0,x).map(e=>({icon:Zd[e.icon]||Zd.Home,label:e.label}));return ce(h,{sx:{pb:8},children:[de(qr,{children:"Bottom Navigation"}),ce(N,{value:e,onChange:(e,r)=>t(r),sx:{mt:3,mb:0,borderBottom:"1px solid var(--Border)","& .MuiTabs-indicator":{backgroundColor:"var(--Buttons-Primary-Button)",height:3},"& .MuiTab-root":{color:"var(--Text-Quiet)",textTransform:"none",fontWeight:500,"&.Mui-selected":{color:"var(--Text)"}}},children:[de(H,{label:"Playground"}),de(H,{label:"Accessibility"})]}),0===e&&ce(I,{container:!0,sx:{minHeight:400},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"calc((100vw - 432px) / 2)"},flexShrink:0},children:[ce(h,{sx:{p:4,display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",minHeight:300,backgroundColor:"var(--Background)",borderBottom:"1px solid var(--Border)",gap:4},children:[de(h,{sx:{width:"100%",maxWidth:500,overflow:"hidden",boxShadow:"0 2px 12px rgba(0,0,0,0.08)"},children:de(Yd,{items:w,value:n,onChange:o,showLabels:s,labelOrientation:c,backfill:p,barColor:f,fixed:!1},"bn-"+x+"-"+c+"-"+p+"-"+s+"-"+f)}),ce(bn,{style:{color:"var(--Text-Quiet)",textAlign:"center"},children:[x," items · ",s?"horizontal"===c&&S?"Horizontal labels":"Vertical labels":"Icons only",p?" · Backfill":""," · ",(tc.find(e=>e.value===f)||tc[0]).label]})]}),de(ji,{code:(()=>{const e=[];e.push("const items = ["),w.forEach((t,r)=>{const n=v[r];e.push(" { icon: <"+n.icon+"Icon />, label: '"+n.label+"' },")}),e.push("];"),e.push("");const t=[];return t.push("items={items}"),"default"!==f&&t.push('barColor="'+f+'"'),s||t.push("showLabels={false}"),s&&"horizontal"===c&&S&&t.push('labelOrientation="horizontal"'),p||t.push("backfill={false}"),i||t.push("fixed={false}"),e.push("<BottomNavigation"),t.forEach(t=>e.push(" "+t)),e.push("/>"),e.join("\n")})(),language:"JSX",sx:{borderRadius:0,borderBottom:"1px solid var(--Border)"}})]}),ce(I,{item:!0,sx:{width:{xs:"calc(100vw - 432px)",md:"calc((100vw - 432px) / 2)"},flexShrink:0,p:3,backgroundColor:"var(--Container)",overflowY:"auto"},children:[de(Yr,{children:"Playground"}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"BAR COLOR"}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:tc.map(e=>de(rc,{label:e.label,selected:f===e.value,onClick:()=>g(e.value)},e.value))}),ce(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:[(tc.find(e=>e.value===f)||tc[0]).desc,' · data-surface="Surface-Dim" · bg: var(--Background)']})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"OPTIONS"}),ce(B,{spacing:0,children:[de(ac,{label:"Fixed",checked:i,onChange:l,caption:"Position fixed to bottom of viewport."}),de(ac,{label:"Labels",checked:s,onChange:d,caption:"Show text labels with icons."}),de(ac,{label:"Selected Backfill",checked:p,onChange:m,caption:"Pill on selected: bg var(--Buttons-Primary-Button), border var(--Buttons-Primary-Border), icon var(--Buttons-Primary-Text)."})]})]}),s&&ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"LABEL ORIENTATION"}),ce(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:[de(rc,{label:"Vertical",selected:"vertical"===c,onClick:()=>u("vertical")}),de(rc,{label:"Horizontal",selected:"horizontal"===c&&S,onClick:()=>{S&&u("horizontal")},disabled:!S})]}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:S?"vertical"===c?"Icon above label (default). Label below pill.":"Icon beside label. Label inside pill when backfill is on.":"Horizontal is only available with 4 or fewer items. Reduce item count to enable."})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"NAVIGATION ITEMS"}),de(ic,{label:"Count",value:x,onChange:b,min:3,max:6}),de(B,{spacing:1.5,sx:{mt:2},children:v.slice(0,x).map((e,t)=>ce(h,{sx:{display:"flex",alignItems:"center",gap:1,flexWrap:"nowrap"},children:[de(bn,{style:{color:"var(--Text-Quiet)",flexShrink:0,width:16,textAlign:"right"},children:t+1}),de(oc,{value:e.icon,onChange:e=>k(t,"icon",e),options:_d,label:"Item "+(t+1)+" icon"}),s&&de(nc,{value:e.label,onChange:e=>k(t,"label",e),placeholder:"Label"})]},t))})]})]})]}),1===e&&ce(h,{sx:{p:4},children:[de(Yr,{children:"Accessibility Requirements"}),ce(ln,{color:"quiet",style:{marginBottom:32},children:[x," items · ",s?"Labels "+c:"Icons only",p?" · Backfill":""," · ",(tc.find(e=>e.value===f)||tc[0]).label]}),ce(B,{spacing:4,children:[ce(h,{sx:{p:3,backgroundColor:"var(--Container)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"ARIA and Semantics"}),ce(B,{spacing:0,children:[ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ln,{children:"Landmark:"}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:'<nav role="navigation" aria-label="Bottom navigation">'})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ln,{children:"Tab list:"}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:'role="tablist"'})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ln,{children:"Tab items:"}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:'role="tab", aria-selected, aria-label'})]}),ce(h,{sx:{py:1.5},children:[de(ln,{children:"Focus:"}),de(bn,{style:{color:"var(--Text-Quiet)"},children:"3px solid var(--Focus-Visible) on :focus-visible."})]})]})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Container)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"Token Reference"}),ce(B,{spacing:0,children:[ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ln,{children:"Bar:"}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:'Always: data-surface="Surface-Dim" · bg: var(--Background). Theme set by data-theme (Nav-Bar, Primary, Primary-Light, etc.).'})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ln,{children:"Unselected icon/label:"}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:"var(--Text-Quiet)"})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ln,{children:"Selected (no backfill):"}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:"var(--Text)"})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ln,{children:"Selected backfill pill:"}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:"bg: var(--Buttons-Primary-Button) · border: 1px solid var(--Buttons-Primary-Border) · icon/text: var(--Buttons-Primary-Text)"})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ln,{children:"Backfill + horizontal label:"}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:"Label inside pill: var(--Buttons-Primary-Text)"})]}),ce(h,{sx:{py:1.5},children:[de(ln,{children:"Backfill + vertical label:"}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:"Label below pill: var(--Text)"})]})]})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Container)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"Best Practices"}),ce(B,{spacing:0,children:[ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ln,{children:"Item count:"}),de(bn,{style:{color:"var(--Text-Quiet)"},children:"3–5 recommended. 6 maximum."})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ln,{children:"Horizontal layout:"}),de(bn,{style:{color:"var(--Text-Quiet)"},children:"Only available with 4 or fewer items."})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ln,{children:"Labels:"}),de(bn,{style:{color:"var(--Text-Quiet)"},children:"Always recommended for clarity."})]}),ce(h,{sx:{py:1.5},children:[de(ln,{children:"Fixed:"}),de(bn,{style:{color:"var(--Text-Quiet)"},children:"Add bottom padding to main content to avoid overlap."})]})]})]})]})]})]})}const sc={default:"Default",primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info",success:"Success",warning:"Warning",error:"Error"},dc={small:{indicator:24,fontSize:"11px",labelFontSize:"13px",connectorThickness:2,gap:0},medium:{indicator:32,fontSize:"13px",labelFontSize:"14px",connectorThickness:2,gap:0},large:{indicator:40,fontSize:"16px",labelFontSize:"16px",connectorThickness:2,gap:0}},cc=s({orientation:"horizontal",size:"medium",color:"primary",activeStep:0,clickable:!1,onStepClick:null,dashedIncomplete:!1,totalSteps:0}),uc=()=>l(cc);function pc({children:e,orientation:r="horizontal",size:n="medium",color:o="primary",activeStep:i=0,clickable:a=!1,onStepClick:l,dashedIncomplete:s=!1,className:d="",sx:c={},...u}){const p=t.Children.toArray(e).filter(t.isValidElement),m=p.length,f="horizontal"===r;return de(cc.Provider,{value:{orientation:r,size:n,color:o,activeStep:i,clickable:a,onStepClick:l,dashedIncomplete:s,totalSteps:m},children:de(h,{component:"ol",role:"list","aria-label":"Progress",className:"stepper stepper-"+r+" stepper-"+n+" stepper-"+o+" "+d,sx:{display:"flex",flexDirection:f?"row":"column",alignItems:f?"flex-start":"stretch",listStyle:"none",margin:0,padding:0,width:"100%",gap:0,...c},...u,children:p.map((e,r)=>t.cloneElement(e,{_index:r,key:e.key||r}))})})}function hc({children:e,icon:t,label:r,_index:n=0,className:o="",sx:i={},...a}){const{orientation:l,size:s,color:d,activeStep:c,clickable:u,onStepClick:p,dashedIncomplete:m,totalSteps:f}=uc(),g=dc[s]||dc.medium,x=sc[d]||"Primary",b="horizontal"===l,v=n===c,y=n<c,S=n>c,k=n===f-1,B=t||n+1,w=r||e,C="var(--Buttons-"+x+"-Border)",T=v||y?"var(--Buttons-"+x+"-Button)":"transparent",I=v||y?"var(--Buttons-"+x+"-Text)":"var(--Text)",A=v||y?"var(--Buttons-"+x+"-Hover)":"var(--Hover)",z=v||y?"var(--Buttons-"+x+"-Pressed)":"var(--Pressed)",R=de(h,{component:u?"button":"div",onClick:u?()=>p?.(n):void 0,onKeyDown:u?e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),p?.(n))}:void 0,tabIndex:u?0:void 0,role:u?"button":void 0,"aria-label":u?"Go to step "+(n+1):void 0,"aria-current":v?"step":void 0,className:"step-indicator step-indicator-"+s+(v?" step-indicator-active":"")+(y?" step-indicator-completed":"")+(S?" step-indicator-incomplete":"")+(u?" step-indicator-clickable":""),sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",width:g.indicator+"px",height:g.indicator+"px",minWidth:g.indicator+"px",minHeight:g.indicator+"px",borderRadius:"50%",border:(v?"2px":"1px")+" solid "+C,backgroundColor:T,color:I,fontSize:g.fontSize,fontFamily:"inherit",fontWeight:700,lineHeight:1,flexShrink:0,position:"relative",transition:"background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease",cursor:u?"pointer":"default",outline:"none",padding:0,..."small"===s&&{"&::after":{content:'""',position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)",width:"24px",height:"24px",borderRadius:"50%"}},...u&&{"&:hover":{backgroundColor:A},"&:active":{backgroundColor:z},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"2px"}}},children:B}),E=k?null:de(h,{className:"step-connector"+(y?" step-connector-completed":"")+(S?" step-connector-incomplete":"")+(m&&S?" step-connector-dashed":""),"aria-hidden":"true",sx:{flex:1,...b?{height:g.connectorThickness+"px",minWidth:"20px",alignSelf:"flex-start",marginTop:g.indicator/2-g.connectorThickness/2+"px",marginLeft:"8px",marginRight:"8px"}:{width:g.connectorThickness+"px",minHeight:"24px",marginLeft:g.indicator/2-g.connectorThickness/2+"px",marginTop:"4px",marginBottom:"4px"},backgroundColor:y?"var(--Buttons-"+x+"-Button)":"var(--Border)",...m&&S&&{backgroundColor:"transparent",backgroundImage:b?"repeating-linear-gradient(90deg, var(--Border) 0px, var(--Border) 6px, transparent 6px, transparent 12px)":"repeating-linear-gradient(180deg, var(--Border) 0px, var(--Border) 6px, transparent 6px, transparent 12px)",backgroundSize:b?"12px 100%":"100% 12px"},transition:"background-color 0.15s ease"}}),P=w?de("small"===s?bn:ln,{style:{fontWeight:v?600:400,color:v||y?"var(--Text)":"var(--Quiet)",textAlign:b?"center":"left",whiteSpace:"nowrap",lineHeight:1.3},children:w}):null;return ce(h,b?{component:"li",className:"step step-"+s+" step-horizontal"+(v?" step-active":"")+(y?" step-completed":"")+(S?" step-incomplete":"")+" "+o,sx:{display:"flex",alignItems:"center",flex:k?"none":1,...i},...a,children:[ce(h,{sx:{display:"flex",flexDirection:"column",alignItems:"center",flexShrink:0},children:[R,P&&de(h,{sx:{mt:"4px"},children:P})]}),E]}:{component:"li",className:"step step-"+s+" step-vertical"+(v?" step-active":"")+(y?" step-completed":"")+(S?" step-incomplete":"")+" "+o,sx:{display:"flex",flexDirection:"column",alignItems:"flex-start",...i},...a,children:[ce(h,{sx:{display:"flex",alignItems:"center",gap:"8px"},children:[R,P]}),E]})}const mc=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",fc=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}],gc=["Account","Details","Review","Confirm","Complete","Done"];function xc({label:e,selected:t,onClick:r}){return de(Io,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function bc({color:e,selected:t,onClick:r}){const n=mc(e);return de(h,{component:"button",onClick:()=>r(e),"aria-label":"Select "+n,"aria-pressed":t,title:n,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+n+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Buttons-"+n+"-Text)",pointerEvents:"none"}})})}function vc(){const[e,t]=r("default"),[n,o]=r("medium"),[i,a]=r("horizontal"),[l,s]=r(4),[d,c]=r(1),[u,p]=r(!1),[m,f]=r(!1),[g,x]=r(null),[b,v]=r("Surface");return ce(h,{sx:{pb:8},children:[de(qr,{children:"Stepper"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ui,{theme:g,surface:b,children:de(h,{sx:{width:"100%",maxWidth:"vertical"===i?300:"100%"},children:de(pc,{color:e,size:n,orientation:i,activeStep:d,clickable:u,onStepClick:u?c:void 0,dashedIncomplete:m,children:gc.slice(0,l).map(e=>de(hc,{label:e},e))})})}),de(ji,{code:(()=>{const t=[];return"default"!==e&&t.push('color="'+e+'"'),"medium"!==n&&t.push('size="'+n+'"'),"horizontal"!==i&&t.push('orientation="vertical"'),t.push("activeStep={"+d+"}"),u&&t.push("clickable onStepClick={setActiveStep}"),m&&t.push("dashedIncomplete"),"<Stepper "+t.join(" ")+">\n"+gc.slice(0,l).map(e=>' <Step label="'+e+'" />').join("\n")+"\n</Stepper>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(li,{defaultValue:0,variant:"standard",color:"primary",children:[ce(si,{children:[de(di,{children:"Playground"}),de(di,{children:"Accessibility"})]}),de(ci,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(fi,{theme:g,onThemeChange:x,surface:b,onSurfaceChange:v})}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"STEPS"}),de(B,{direction:"row",spacing:1,children:[2,3,4,5,6].map(e=>de(xc,{label:String(e),selected:l===e,onClick:()=>{s(e),d>=e&&c(e-1)}},e))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"ACTIVE STEP"}),de(B,{direction:"row",spacing:1,children:gc.slice(0,l).map((e,t)=>de(xc,{label:String(t+1),selected:d===t,onClick:()=>c(t)},t))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:fc.map(r=>ce(h,{children:[de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:r.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:r.colors.map(r=>de(bc,{color:r,selected:e===r,onClick:t},r))})]},r.label))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",spacing:1,children:["small","medium","large"].map(e=>de(xc,{label:mc(e),selected:n===e,onClick:()=>o(e)},e))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"ORIENTATION"}),de(B,{direction:"row",spacing:1,children:["horizontal","vertical"].map(e=>de(xc,{label:mc(e),selected:i===e,onClick:()=>a(e)},e))})]}),ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Clickable"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Steps are interactive buttons"})]}),de(na,{variant:"default-outline",checked:u,onChange:e=>p(e.target.checked),size:"small","aria-label":"Clickable"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Dashed Incomplete"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Dashed connector for future steps"})]}),de(na,{variant:"default-outline",checked:m,onChange:e=>f(e.target.checked),size:"small","aria-label":"Dashed incomplete"})]})]})}),de(ci,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Container",value:'<ol role="list" aria-label="Progress">'},{label:"Steps",value:"<li> elements with step state classes"},{label:"Active",value:'aria-current="step" on the active indicator'},{label:"Clickable",value:'role="button" aria-label="Go to step N" with tabIndex'},{label:"Focus",value:"outline: 3px solid var(--Focus-Visible); outline-offset: 2px"},{label:"Connectors",value:'aria-hidden="true" — decorative only'}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ln,{children:[e,":"]}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}function yc({actions:e=[],variant:t="solid",color:n="default",direction:l="up",speed:s=50,showTooltips:d=!0,open:c,onOpen:u,onClose:p,icon:m,ariaLabel:f="Speed Dial",className:g="",sx:x={},...b}){const[v,y]=r(!1),S=void 0!==c,k=S?c:v,B=o(null),C=t,T=i(()=>{k?(S||y(!1),p?.()):(S||y(!0),u?.())},[k,S,u,p]),I=i((e,t)=>{e.onClick?.(t),S||y(!1),p?.()},[S,p]);a(()=>{if(!k)return;const e=e=>{B.current&&!B.current.contains(e.target)&&(S||y(!1),p?.())};return document.addEventListener("mousedown",e),()=>document.removeEventListener("mousedown",e)},[k,S,p]),a(()=>{if(!k)return;const e=e=>{"Escape"===e.key&&(S||y(!1),p?.())};return document.addEventListener("keydown",e),()=>document.removeEventListener("keydown",e)},[k,S,p]);const A="up"===l||"down"===l,z="up"===l||"down"===l?"left":"top";return ce(h,{ref:B,className:"speed-dial speed-dial-"+t+" speed-dial-"+n+" speed-dial-"+l+" "+g,sx:{position:"relative",display:"inline-flex",overflow:"visible",width:A?"56px":"auto",height:A?"auto":"56px",...x},...b,children:[de(Xa,{size:"large",variant:C,color:n,onClick:T,"aria-label":f,"aria-expanded":k,"aria-haspopup":"menu",sx:{position:"relative",zIndex:2},children:de(h,{sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",transition:"transform 0.3s ease",transform:k?"rotate(45deg)":"rotate(0deg)"},children:m||de(At,{})})}),de(h,{role:"menu",sx:{position:"absolute",inset:0,pointerEvents:"none",overflow:"visible"},children:e.map((e,t)=>{const r=(e=>{const t=56+44*e;switch(l){case"up":default:return{bottom:t+"px",left:"12px"};case"down":return{top:t+"px",left:"12px"};case"left":return{right:t+"px",top:"12px"};case"right":return{left:t+"px",top:"12px"}}})(t),o=t*s,i=de(Xa,{size:"small",variant:C,color:n,role:"menuitem","aria-label":e.name||"Action "+(t+1),onClick:()=>I(e,t),sx:{position:"absolute",...r,opacity:k?1:0,transform:k?"scale(1)":"scale(0.3)",transition:"opacity 0.2s ease, transform 0.2s ease",transitionDelay:k?o+"ms":"0ms",pointerEvents:k?"auto":"none"},children:e.icon||de(At,{})},e.key||t);return d&&e.name?de(w,{title:e.name,placement:z,arrow:!0,open:!!k&&void 0,slotProps:{tooltip:{sx:{backgroundColor:"var(--Container)",color:"var(--Text)",fontSize:"12px",fontWeight:500,border:"1px solid var(--Border)",boxShadow:"0 2px 8px rgba(0,0,0,0.12)"}},arrow:{sx:{color:"var(--Container)"}}},children:i},e.key||t):i})})]})}const Sc=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",kc=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}],Bc=[{name:"Edit",icon:de(Qn,{size:"small",sx:{color:"inherit"},children:de(er,{})})},{name:"Share",icon:de(Qn,{size:"small",sx:{color:"inherit"},children:de(tr,{})})},{name:"Delete",icon:de(Qn,{size:"small",sx:{color:"inherit"},children:de(we,{})})},{name:"Favorite",icon:de(Qn,{size:"small",sx:{color:"inherit"},children:de(ke,{})})}];function wc({label:e,selected:t,onClick:r}){return de(Io,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function Cc({color:e,selected:t,onClick:r}){const n=Sc(e);return de(h,{component:"button",onClick:()=>r(e),"aria-label":"Select "+n,"aria-pressed":t,title:n,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+n+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Buttons-"+n+"-Text)",pointerEvents:"none"}})})}function Tc(){const[e,t]=r("solid"),[n,o]=r("default"),[i,a]=r("up"),[l,s]=r(!0),[d,c]=r(null),[u,p]=r("Surface");return ce(h,{sx:{pb:8},children:[de(qr,{children:"Speed Dial"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ui,{theme:d,surface:u,sx:{minHeight:300,alignItems:"flex-end",justifyContent:"center"},children:de(yc,{variant:e,color:n,direction:i,showTooltips:l,actions:Bc,ariaLabel:"Quick actions"})}),de(ji,{code:(()=>{const t=[];return"solid"!==e&&t.push('variant="'+e+'"'),"default"!==n&&t.push('color="'+n+'"'),"up"!==i&&t.push('direction="'+i+'"'),l||t.push("showTooltips={false}"),t.push("actions={actions}"),t.push('ariaLabel="Quick actions"'),"<SpeedDial\n "+t.join("\n ")+"\n/>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(li,{defaultValue:0,variant:"standard",color:"primary",children:[ce(si,{children:[de(di,{children:"Playground"}),de(di,{children:"Accessibility"})]}),de(ci,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(fi,{theme:d,onThemeChange:c,surface:u,onSurfaceChange:p})}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"STYLE"}),de(B,{direction:"row",spacing:1,children:["solid","outline"].map(r=>de(wc,{label:Sc(r),selected:e===r,onClick:()=>t(r)},r))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:kc.map(e=>ce(h,{children:[de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:e.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:e.colors.map(e=>de(Cc,{color:e,selected:n===e,onClick:o},e))})]},e.label))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"DIRECTION"}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:["up","down","left","right"].map(e=>de(wc,{label:Sc(e),selected:i===e,onClick:()=>a(e)},e))})]}),ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Tooltips"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Show labels beside actions"})]}),de(na,{variant:"default-outline",checked:l,onChange:e=>s(e.target.checked),size:"small","aria-label":"Show tooltips"})]})]})}),de(ci,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"FAB",value:'aria-expanded, aria-haspopup="menu", aria-label'},{label:"Actions",value:'role="menu" container, role="menuitem" on each action'},{label:"Labels",value:"aria-label on each action from name prop"},{label:"Keyboard",value:"Escape closes. Click outside closes."},{label:"Focus",value:"outline: 3px solid var(--Focus-Visible); outline-offset: 2px"}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ln,{children:[e,":"]}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}const Ic={primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",black:"BW",white:"BW"};function Ac(e,t){return"var(--"+(Ic[e]||"Primary")+"-Color-"+t+")"}const zc={primary:{linear:[{family:"primary",tone:8,position:0},{family:"primary",tone:11,position:100}],radial:[{family:"primary",tone:8,position:0},{family:"primary",tone:11,position:100}],mesh:[{family:"primary",tone:8,x:20,y:20,spread:60},{family:"primary",tone:9,x:80,y:30,spread:50},{family:"primary",tone:10,x:50,y:80,spread:55}],meshCard:[{family:"primary",tone:3,x:10,y:10,spread:60},{family:"primary",tone:6,x:80,y:20,spread:50},{family:"primary",tone:9,x:40,y:80,spread:55}]},secondary:{linear:[{family:"secondary",tone:7,position:0},{family:"secondary",tone:10,position:100}],radial:[{family:"secondary",tone:7,position:0},{family:"secondary",tone:10,position:100}],mesh:[{family:"secondary",tone:7,x:15,y:25,spread:55},{family:"secondary",tone:9,x:75,y:35,spread:50},{family:"secondary",tone:11,x:45,y:75,spread:60}],meshCard:[{family:"secondary",tone:2,x:15,y:15,spread:55},{family:"secondary",tone:5,x:85,y:25,spread:50},{family:"secondary",tone:8,x:50,y:75,spread:60}]},tertiary:{linear:[{family:"tertiary",tone:8,position:0},{family:"tertiary",tone:11,position:100}],radial:[{family:"tertiary",tone:8,position:0},{family:"tertiary",tone:11,position:100}],mesh:[{family:"tertiary",tone:8,x:25,y:15,spread:55},{family:"tertiary",tone:10,x:70,y:40,spread:50},{family:"tertiary",tone:11,x:40,y:85,spread:55}],meshCard:[{family:"tertiary",tone:3,x:20,y:10,spread:60},{family:"tertiary",tone:7,x:75,y:30,spread:50},{family:"tertiary",tone:10,x:45,y:80,spread:55}]},black:{linear:[{family:"black",tone:10,position:0},{family:"neutral",tone:3,position:100}],radial:[{family:"black",tone:10,position:0},{family:"neutral",tone:3,position:100}],mesh:[{family:"black",tone:10,x:0,y:0,spread:100},{family:"primary",tone:3,x:25,y:25,spread:50},{family:"secondary",tone:4,x:75,y:35,spread:45},{family:"tertiary",tone:3,x:50,y:80,spread:50}],meshCard:[{family:"black",tone:11,x:0,y:0,spread:100},{family:"primary",tone:5,x:20,y:20,spread:55},{family:"secondary",tone:8,x:80,y:30,spread:45},{family:"tertiary",tone:10,x:45,y:80,spread:50}]},white:{linear:[{family:"white",tone:2,position:0},{family:"neutral",tone:9,position:100}],radial:[{family:"white",tone:2,position:0},{family:"neutral",tone:9,position:100}],mesh:[{family:"white",tone:2,x:0,y:0,spread:100},{family:"primary",tone:9,x:25,y:25,spread:50},{family:"secondary",tone:8,x:75,y:35,spread:45},{family:"tertiary",tone:9,x:50,y:80,spread:50}],meshCard:[{family:"white",tone:1,x:0,y:0,spread:100},{family:"primary",tone:4,x:20,y:20,spread:55},{family:"secondary",tone:7,x:80,y:30,spread:45},{family:"tertiary",tone:10,x:45,y:80,spread:50}]}};function Rc(e,t){const r=zc[e]||zc.primary;return(r[t]||r.linear).map(e=>({...e}))}function Ec({variant:e="linear",color:t="primary",angle:r=135,stops:n=null,position:o=null,blobs:i=null,cardProps:a={},minHeight:l=300,children:s,className:d="",sx:c={},...u}){const p="meshCard"===e,m="mesh"===e||p,f="radial"===e,g="linear"===e||f,x=n||Rc(t,f?"radial":"linear"),b=i||Rc(t,p?"meshCard":"mesh"),v=m?function(e){if(!e||0===e.length)return"none";const t=e.map(e=>{const t=Ac(e.family,e.tone),r=e.spread||40;return"radial-gradient(circle at "+e.x+"% "+e.y+"%, "+t+" 0%, transparent "+r+"%)"}),r=Ac(e[0].family,e[0].tone);return t.push(r),t.join(", ")}(b):f?function(e,t){if(!e||0===e.length)return"none";const r=[...e].sort((e,t)=>e.position-t.position).map(e=>Ac(e.family,e.tone)+" "+e.position+"%"),n=t||{x:50,y:50};return"radial-gradient(circle at "+n.x+"% "+n.y+"%, "+r.join(", ")+")"}(x,o||{x:50,y:50}):function(e,t){return e&&0!==e.length?"linear-gradient("+t+"deg, "+[...e].sort((e,t)=>e.position-t.position).map(e=>Ac(e.family,e.tone)+" "+e.position+"%").join(", ")+")":"none"}(x,r),y=g?x[0]:b[0];var S,k;const B=function(e){return"dark"===e?"var(--BW-Color-1)":"var(--BW-Color-6)"}((S=y?.tone||8,"black"===(k=y?.family||"primary")||"white"===k?S<=5?"light":"dark":S<=5?"dark":"light"));return de(h,p?{className:"gradient gradient-mesh-card "+d,sx:{background:v,minHeight:l,borderRadius:"var(--Card-Radius)",display:"flex",alignItems:"center",justifyContent:"center",padding:"var(--Card-Padding)",position:"relative",overflow:"hidden",...c},...u,children:de(Da,{variant:"solid",...a,children:de(Fa,{children:s})})}:{className:"gradient gradient-"+e+" "+d,sx:{background:v,minHeight:l,borderRadius:"var(--Card-Radius)",color:B,display:"flex",alignItems:"center",justifyContent:"center",position:"relative",overflow:"hidden",...c},...u,children:s})}const Pc=e=>de(Ec,{variant:"linear",...e}),Lc=e=>de(Ec,{variant:"radial",...e}),Mc=e=>de(Ec,{variant:"mesh",...e}),Wc=e=>de(Ec,{variant:"meshCard",...e});function Oc({children:e,surface:t="Container",outlined:r=!1,variant:n=(r?"outlined":"elevation"),sx:o={},...i}){const{dataSurface:a,elevation:l}=function(e="Container"){const t={"Container-Lowest":{elevation:0,zIndex:0},"Container-Low":{elevation:1,zIndex:100},Container:{elevation:4,zIndex:200},"Container-High":{elevation:8,zIndex:300},"Container-Highest":{elevation:12,zIndex:400}},r=t[e]||t.Container;return{dataSurface:e,elevation:r.elevation,zIndex:r.zIndex}}(t);return de(V,{variant:n,elevation:r?0:l,"data-surface":a,sx:{padding:2,borderRadius:"8px",transition:"all 0.2s ease-in-out",...o},...i,children:e})}function Dc({open:e=!1,onClose:t,anchorRef:n,placement:i="bottom-end",theme:l="Default",surface:s="Surface-Bright",width:d=320,maxHeight:c=400,children:u,sx:p={}}){const m=o(null),[f,g]=r({top:0,left:0,right:"auto"});return a(()=>{if(!e||!n?.current)return;const t=n.current.getBoundingClientRect();g("bottom-end"===i?{top:t.bottom+6,right:window.innerWidth-t.right,left:"auto"}:{top:t.bottom+6,left:t.left,right:"auto"})},[e,n,i]),a(()=>{if(!e)return;const r=e=>{m.current?.contains(e.target)||n?.current?.contains(e.target)||t?.()};return document.addEventListener("pointerdown",r),()=>document.removeEventListener("pointerdown",r)},[e,t,n]),a(()=>{if(!e)return;const r=e=>{"Escape"===e.key&&t?.()};return document.addEventListener("keydown",r),()=>document.removeEventListener("keydown",r)},[e,t]),e?ye.createPortal(de(h,{ref:m,"data-theme":l,"data-surface":s,sx:{position:"fixed",top:f.top,left:f.left,right:f.right,zIndex:2e9,width:d,maxHeight:c,overflowY:"auto",backgroundColor:"var(--Background)",border:"1px solid var(--Border)",borderRadius:"var(--Style-Border-Radius)",boxShadow:ao,...p},children:u}),document.body):null}["default","primary","secondary","tertiary","neutral"].map(e=>{return{value:e,label:(t=e,t?t.charAt(0).toUpperCase()+t.slice(1):"")};var t});const Fc=s(null),Nc=["Default","Primary-Light","Primary","Secondary-Light","Secondary","Tertiary-Light","Tertiary","Neutral-Light","Neutral","Error-Light","Success-Light","Warning-Light","Info-Light","Primary-Dark","Secondary-Dark","Tertiary-Dark","Neutral-Dark","Error-Dark","Success-Dark","Warning-Dark","Info-Dark","App-Bar","Nav-Bar","Status"],Hc=["Professional","Modern","Bold","Playful"],Vc=["Surface-Dimmest","Surface-Dim","Surface","Surface-Bright","Surface-Brightest","Container","Container-Low","Container-Lowest","Container-High","Container-Highest"],Qc={"light-tonal":{theme:"Primary",rootSurface:"Surface-Brightest"},"grey-professional":{theme:"Neutral",rootSurface:"Surface"},"dark-professional":{theme:"Neutral-Dark",rootSurface:"Surface"}},jc="omni-foundation",Gc="omni-core",Uc="omni-typography",Xc="omni-mode",$c="omni-base",Kc="omni-styles";function qc(e){document.getElementById(e)?.remove()}function Yc(e,t,r){return t?function(e){return!(!e||"string"!=typeof e)&&(e.startsWith("http")||e.startsWith("/")||e.endsWith(".css"))}(t)?function(e,t,r){const n=document.getElementById(e);return n?"LINK"===n.tagName&&n.getAttribute("href")!==t?new Promise((e,r)=>{n.onload=()=>e(n),n.onerror=()=>r(new Error(`OmniDesignProvider: failed to load ${t}`)),n.setAttribute("href",t)}):Promise.resolve(n):new Promise((n,o)=>{const i=document.createElement("link");i.id=e,i.rel="stylesheet",i.setAttribute("data-omni","true"),i.onload=()=>n(i),i.onerror=()=>o(new Error(`OmniDesignProvider: failed to load ${t}`)),i.href=t;const a=r?document.getElementById(r):null;a?document.head.insertBefore(i,a):document.head.appendChild(i)})}(e,t,r):function(e,t,r){if(!t)return Promise.resolve(null);const n=document.getElementById(e);if(n)return n.textContent=t,Promise.resolve(n);const o=document.createElement("style");o.id=e,o.setAttribute("data-omni","true"),o.textContent=t;const i=r?document.getElementById(r):null;return i?document.head.insertBefore(o,i):document.head.appendChild(o),Promise.resolve(o)}(e,t,r):Promise.resolve(null)}function Jc({themeURL:e,foundationCSS:t,coreCSS:n,typographyCSS:l,lightModeCSS:s,darkModeCSS:c,baseCSS:u,stylesCSS:p,defaultTheme:h="Default",defaultStyle:m="Modern",defaultSurface:f="Surface",surfaceStyle:g,defaultDarkMode:x=!1,darkTheme:b="Neutral-Dark",darkMode:v,onDarkModeChange:y,className:S,style:k,fullHeight:B=!0,children:w}){const[C,T]=r(x),I=void 0!==v,A=I?v:C,[z,R]=r({foundation:t??null,core:n??null,typography:l??null,lightMode:s??null,darkMode:c??null,base:u??null,styles:p??null}),[E,P]=r({}),L=o(!0);a(()=>(L.current=!0,()=>{L.current=!1}),[]),a(()=>{e&&(X("loading"),async function(e){const t=/\.json(\?|$)/.test(e)?e:`${e.replace(/\/$/,"")}/theme.json`,r=e.replace(/\/$/,"").replace(/\/theme\.json(\?.*)?$/,""),n=await fetch(t);if(!n.ok)throw new Error(`OmniDesignProvider: could not load theme manifest from ${t} (${n.status})`);const o=await n.json(),i=e=>e?/^https?:\/\//i.test(e)?e:`${r}/${e}`:null;return{foundationURL:i(o.foundation),coreURL:i(o.core),typographyURL:i(o.typography),lightModeURL:i(o.lightMode),darkModeURL:i(o.darkMode),baseURL:i(o.base),stylesURL:i(o.styles),defaultTheme:o.defaultTheme??null,defaultStyle:o.defaultStyle??null,defaultSurface:o.defaultSurface??null,darkTheme:o.darkTheme??null,name:o.name??null}}(e).then(e=>{L.current&&(R({foundation:t??e.foundationURL,core:n??e.coreURL,typography:l??e.typographyURL,lightMode:s??e.lightModeURL,darkMode:c??e.darkModeURL,base:u??e.baseURL,styles:p??e.stylesURL}),P({defaultTheme:e.defaultTheme,defaultStyle:e.defaultStyle,defaultSurface:e.defaultSurface,darkTheme:e.darkTheme,name:e.name}))}).catch(e=>{L.current&&(console.error("OmniDesignProvider: manifest error:",e),K(e.message),X("error"))}))},[e]);const M=g?Qc[g]?.theme??h:"Default"!==h?h:E.defaultTheme??h,W=g?Qc[g]?.rootSurface??f:E.defaultSurface??f,O=E.defaultStyle??m,D="Neutral-Dark"!==b?b:E.darkTheme??b,[F,N]=r(M),[H,V]=r(O),[Q,j]=r(W),G=!!(e||t||n||l||s||c||u||p),[U,X]=r(G?"loading":"ready"),[$,K]=r(null);a(()=>{const{foundation:e,core:t,typography:r,base:n,styles:o}=z;if(e||t||r||n||o)return X("loading"),K(null),Promise.all([Yc(jc,e),Yc(Gc,t),Yc(Uc,r).catch(e=>{console.warn("OmniDesignProvider: typography CSS did not load —",e.message)}),Yc($c,n),Yc(Kc,o)]).then(()=>{L.current&&X("ready")}).catch(e=>{L.current&&(console.error("OmniDesignProvider CSS error:",e),K(e.message),X("error"))}),()=>{qc(jc),qc(Gc),qc(Uc),qc($c),qc(Kc)};X("ready")},[z.foundation,z.core,z.typography,z.base,z.styles]),a(()=>{const e=A?z.darkMode:z.lightMode;e&&Yc(Xc,e,$c).catch(e=>console.error("OmniDesignProvider mode CSS error:",e))},[A,z.lightMode,z.darkMode]),a(()=>()=>qc(Xc),[]);const q=A?D:F,Y=i(()=>{I?y?.(!A):T(e=>!e)},[I,A,y]),J=i(e=>{Nc.includes(e)||console.warn(`OmniDesignProvider: unknown theme "${e}"`),N(e)},[]),Z=i(e=>{Hc.includes(e)||console.warn(`OmniDesignProvider: unknown style "${e}"`),V(e)},[]),_=i(e=>{Vc.includes(e)||console.warn(`OmniDesignProvider: unknown surface "${e}"`),j(e)},[]),ee=d(()=>({theme:q,style:H,surface:Q,isDark:A,cssStatus:U,cssError:$,setTheme:J,setStyle:Z,setSurface:_,toggleDarkMode:Y,themes:Nc,styles:Hc,surfaces:Vc,name:E.name??null}),[q,H,Q,A,U,$,J,Z,_,Y,E.name]);return ce(Fc.Provider,{value:ee,children:[de("style",{"data-omni":"hide-during-load",children:'[data-omni-css="loading"]{visibility:hidden}'}),de("div",{"data-theme":q,"data-style":H,"data-surface":Q,"data-omni-css":U,className:S,style:{...B?{minHeight:"100vh"}:{},...k},children:w})]})}function Zc(){const e=l(Fc);if(!e)throw new Error("useOmniDesign must be used inside a <OmniDesignProvider>");return e}function _c({theme:e,surface:t,as:r="div",children:n,className:o,style:i,...a}){return de(r,{"data-theme":e,"data-surface":t,className:o,style:i,...a,children:n})}function eu({surface:e,as:t="div",children:r,className:n,style:o,...i}){return de(t,{"data-surface":e,className:n,style:o,...i,children:r})}const tu=e=>c(function(t,r){return de(Y,{direction:e,ref:r,...t})}),ru={fade:c(function(e,t){return de(q,{ref:t,...e})}),grow:c(function(e,t){return de(K,{ref:t,...e})}),zoom:c(function(e,t){return de($,{ref:t,...e})}),"slide-up":tu("up"),"slide-down":tu("down"),"slide-left":tu("left"),"slide-right":tu("right")},nu={backgroundColor:"var(--Background)",color:"var(--Text)",border:"1px solid var(--Border)",borderRadius:"var(--Style-Border-Radius)",boxShadow:"0 8px 32px rgba(0,0,0,0.18)"},ou={color:"var(--Text)",fontWeight:600,fontSize:"18px",fontFamily:"inherit",borderBottom:"1px solid var(--Border)",display:"flex",justifyContent:"space-between",alignItems:"center",py:1.5,px:3},iu={color:"var(--Text)",fontFamily:"inherit",fontSize:"14px",lineHeight:1.6,py:3,px:3},au={borderTop:"1px solid var(--Border)",px:3,py:1.5,gap:1},lu={fontFamily:"inherit",fontWeight:500,fontSize:"14px",borderRadius:"var(--Style-Border-Radius)",padding:"6px 16px",cursor:"pointer",border:"none",transition:"background-color 0.15s, color 0.15s","&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"1px"}},su={primary:{...lu,backgroundColor:"var(--Buttons-Primary-Button)",color:"var(--Buttons-Primary-Text)",border:"1px solid var(--Buttons-Primary-Border)","&:hover":{backgroundColor:"var(--Buttons-Primary-Hover)"}},outline:{...lu,backgroundColor:"transparent",color:"var(--Text)",border:"1px solid var(--Border)","&:hover":{backgroundColor:"var(--Hover)"}}};function du({open:e=!1,onClose:t,title:r,children:n,actions:o,maxWidth:i="sm",fullScreen:a=!1,scroll:l="body",alert:s=!1,nonModal:d=!1,transition:c,transitionDuration:u=300,titleId:p="dialog-title",contentId:m="dialog-description",className:f="",sx:g={},PaperProps:x={},...b}){const v=c?ru[c]:void 0;let y;try{y=Zc()}catch{y=null}const S=y?.theme||"Default",k=y?.style||"Modern",B=y?.surface||"Surface";return ce(Q,{open:e,onClose:(e,r)=>{s&&"backdropClick"===r||s&&"escapeKeyDown"===r||t?.(e,r)},maxWidth:!a&&i,fullScreen:a,fullWidth:!a,scroll:l,hideBackdrop:d,disableEnforceFocus:d,disableEscapeKeyDown:s,TransitionComponent:v,transitionDuration:u,"aria-labelledby":p,"aria-describedby":m,className:"dialog dialog-"+i+(a?" dialog-fullscreen":"")+(s?" dialog-alert":"")+(f?" "+f:""),style:{zIndex:1e7},slotProps:{backdrop:{sx:{backgroundColor:d?"transparent":"rgba(0,0,0,0.5)"}}},PaperProps:{...x,"data-theme":S,"data-style":k,"data-surface":B,sx:{...nu,...a&&{borderRadius:0,border:"none"},...x.sx},role:s?"alertdialog":"dialog"},...b,children:[r&&ce(j,{id:p,sx:ou,children:[r,!s&&t&&de(C,{"aria-label":"Close dialog",onClick:e=>t(e,"closeButton"),size:"small",sx:{color:"var(--Text-Quiet)","&:hover":{backgroundColor:"var(--Hover)"}},children:de(Lt,{fontSize:"small"})})]}),de(G,{dividers:"paper"===l,sx:{...iu,..."paper"===l&&{maxHeight:a?"none":"400px",overflowY:"auto",borderColor:"var(--Border)"}},children:s?de(U,{id:m,sx:{color:"var(--Text)",fontFamily:"inherit",fontSize:"14px",lineHeight:1.6},children:n}):de(h,{id:m,children:n})}),o&&de(X,{sx:au,children:o})]})}function cu({open:e,onClose:t,title:r,children:n,confirmText:o="Confirm",cancelText:i="Cancel",onConfirm:a,onCancel:l,...s}){return de(du,{open:e,onClose:t,title:r,alert:!0,...s,actions:ce(ue,{children:[de(h,{component:"button",type:"button",onClick:l||t,sx:su.outline,children:i}),de(h,{component:"button",type:"button",onClick:a||t,sx:su.primary,children:o})]}),children:n})}function uu({open:e,onClose:t,title:r,children:n,submitText:o="Submit",cancelText:i="Cancel",onSubmit:a,...l}){return de(du,{open:e,onClose:t,title:r,...l,actions:ce(ue,{children:[de(h,{component:"button",type:"button",onClick:t,sx:su.outline,children:i}),de(h,{component:"button",type:"button",onClick:a,sx:su.primary,children:o})]}),children:n})}function pu({label:e,selected:t,onClick:r}){return de(Io,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function hu(){const[e,t]=r(!1),[n,o]=r("sm"),[i,a]=r(!1),[l,s]=r("none"),[d,c]=r(!1),[u,p]=r(!1),[m,f]=r(null),[g,x]=r("Surface");return ce(h,{sx:{pb:8},children:[de(qr,{children:"Dialog"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ui,{theme:m,surface:g,children:de(Io,{variant:"default",onClick:()=>t(!0),children:"Open Dialog"})}),de(ji,{code:(()=>{const e=["open={open}","onClose={handleClose}"];return"sm"!==n&&e.push('maxWidth="'+n+'"'),i&&e.push("fullScreen"),d&&e.push("alert"),u&&e.push("nonModal"),"none"!==l&&e.push('transition="'+l+'"'),e.push('title="Dialog Title"'),e.push('actions={<><Button variant="default-outline" onClick={handleClose}>Cancel</Button><Button variant="default" onClick={handleClose}>Confirm</Button></>}'),"<Dialog\n "+e.join("\n ")+"\n>\n Dialog content goes here.\n</Dialog>"})(),language:"JSX",wrap:!0,sx:{mt:2}}),de(du,{open:e,onClose:(e,r)=>{d&&"backdropClick"===r||t(!1)},maxWidth:n,fullScreen:i,alert:d,nonModal:u,transition:"none"!==l?l:void 0,title:"Dialog Title",actions:ce(ue,{children:[de(Io,{variant:"default-outline",size:"small",onClick:()=>t(!1),children:"Cancel"}),de(Io,{variant:"default",size:"small",onClick:()=>t(!1),children:"Confirm"})]}),children:de(cn,{children:"This is the dialog content. You can put any information here that requires user attention or action."})})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(li,{defaultValue:0,variant:"standard",color:"primary",children:[ce(si,{children:[de(di,{children:"Playground"}),de(di,{children:"Accessibility"})]}),de(ci,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(fi,{theme:m,onThemeChange:f,surface:g,onSurfaceChange:x})}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),ce(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:[["xs","sm","md","lg","xl"].map(e=>de(pu,{label:e.toUpperCase(),selected:n===e,onClick:()=>{o(e),a(!1)}},e)),de(pu,{label:"Full Screen",selected:i,onClick:()=>a(!i)})]})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"TRANSITION"}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:["none","slide-up","slide-down","grow","fade","zoom"].map(e=>{return de(pu,{label:(t=e,t?t.charAt(0).toUpperCase()+t.slice(1):""),selected:l===e,onClick:()=>s(e)},e);var t})})]}),ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Alert"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"No backdrop dismiss, no Escape"})]}),de(na,{variant:"default-outline",checked:d,onChange:e=>c(e.target.checked),size:"small","aria-label":"Alert mode"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Non-Modal"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"No backdrop, interact with content behind"})]}),de(na,{variant:"default-outline",checked:u,onChange:e=>p(e.target.checked),size:"small","aria-label":"Non-modal"})]})]})}),de(ci,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Role",value:'role="dialog" (standard) or role="alertdialog" (alert mode)'},{label:"Label",value:"aria-labelledby links to title, aria-describedby links to content"},{label:"Focus",value:"Focus trapped inside dialog. Returns to trigger on close."},{label:"Keyboard",value:"Escape closes (unless alert). Tab cycles through focusable elements."},{label:"Backdrop",value:"Click closes (unless alert or non-modal)"},{label:"Close",value:'Close button with aria-label="Close dialog"'}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ln,{children:[e,":"]}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}const mu={primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info-Medium",success:"Success-Medium",warning:"Warning-Medium",error:"Error-Medium"},fu={primary:"Primary-Light",secondary:"Secondary-Light",tertiary:"Tertiary-Light",neutral:"Neutral-Light",info:"Info-Light",success:"Success-Light",warning:"Warning-Light",error:"Error-Light"},gu={small:{maxWidth:400,padding:"24px"},medium:{maxWidth:560,padding:"32px"},large:{maxWidth:720,padding:"40px"}},xu={fade:{enter:{from:{opacity:0},to:{opacity:1}},name:"modal-fade"},"slide-up":{enter:{from:{opacity:0,transform:"translateY(40px)"},to:{opacity:1,transform:"translateY(0)"}},name:"modal-slide-up"},"slide-down":{enter:{from:{opacity:0,transform:"translateY(-40px)"},to:{opacity:1,transform:"translateY(0)"}},name:"modal-slide-down"},zoom:{enter:{from:{opacity:0,transform:"scale(0.85)"},to:{opacity:1,transform:"scale(1)"}},name:"modal-zoom"}};function bu(e){const t=xu[e];if(!t)return"";const{from:r,to:n}=t.enter,o=Object.entries(r).map(([e,t])=>e+":"+t).join(";"),i=Object.entries(n).map(([e,t])=>e+":"+t).join(";");return"@keyframes "+t.name+" { from {"+o+"} to {"+i+"} }@keyframes "+t.name+"-backdrop { from { opacity: 0 } to { opacity: 1 } }"}function vu({open:e,onClose:t,children:n,title:i,variant:l="default",color:s="primary",size:d="medium",layout:c="center",transition:u="fade",transitionSpeed:p=250,closeOnBackdrop:m=!0,showCloseButton:f=!0,className:g="",sx:x={},...b}){const v=o(null),y=o(null),[S,k]=r(!1);let B;try{B=Zc()}catch{B=null}const w=B?.theme||"Default",C=B?.style||"Modern",T="soft"===l,I="solid"===l,A="fullscreen"===c,z=I?mu[s]:T?fu[s]:null,R=gu[d]||gu.medium,E=xu[u],P=E?E.name:void 0,L=p+"ms";return a(()=>(e?(y.current=document.activeElement,k(!0),requestAnimationFrame(()=>{v.current?.focus()}),document.body.style.overflow="hidden"):(k(!1),document.body.style.overflow="",y.current?.focus()),()=>{document.body.style.overflow=""}),[e]),a(()=>{if(!e)return;const r=e=>{"Escape"===e.key&&t?.()};return document.addEventListener("keydown",r),()=>document.removeEventListener("keydown",r)},[e,t]),e||S?ce(ue,{children:["none"!==u&&de("style",{children:bu(u)}),de(h,{"aria-hidden":"true",onClick:m?t:void 0,sx:{position:"fixed",inset:0,zIndex:1e7,backgroundColor:"rgba(0,0,0,0.5)",...P&&{animation:P+"-backdrop "+L+" ease-out forwards"}}}),ce(h,{role:"dialog","aria-modal":"true","aria-label":i||"Modal",ref:v,tabIndex:-1,"data-surface":"Container-High","data-theme":z||w,"data-style":C,className:"modal modal-"+l+" modal-"+d+" modal-"+c+(T||I?" modal-"+s:"")+(g?" "+g:""),sx:{position:"fixed",zIndex:10000001,outline:"none",fontFamily:"inherit",...A?{inset:0,borderRadius:0}:{top:"50%",left:"50%",transform:"translate(-50%, -50%)",maxWidth:R.maxWidth+"px",width:"calc(100% - 32px)",maxHeight:"calc(100vh - 64px)",borderRadius:"var(--Modal-Radius, var(--Style-Border-Radius))"},backgroundColor:"var(--Background)",color:"var(--Text)",boxShadow:"0 8px 32px rgba(0,0,0,0.24)",display:"flex",flexDirection:"column",overflow:"hidden",...P&&{animation:P+" "+L+" ease-out forwards"},...x},...b,children:[(i||f)&&ce(h,{sx:{display:"flex",alignItems:"center",justifyContent:"space-between",px:A?4:R.padding,pt:A?3:R.padding,pb:0,flexShrink:0},children:[i&&de(h,{sx:{fontSize:"small"===d?"18px":"large"===d?"24px":"20px",fontWeight:700,color:"var(--Text)",flex:1},children:i}),f&&de(h,{component:"button",type:"button","aria-label":"Close modal",onClick:t,sx:{display:"flex",alignItems:"center",justifyContent:"center",width:32,height:32,borderRadius:"50%",border:"none",backgroundColor:"transparent",color:"var(--Text-Quiet)",cursor:"pointer",flexShrink:0,ml:1,transition:"background-color 0.15s ease, color 0.15s ease","&:hover":{backgroundColor:"var(--Hover)",color:"var(--Text)"},"&:focus-visible":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"}},children:de(Lt,{sx:{fontSize:20}})})]}),de(h,{sx:{flex:1,overflowY:"auto",px:A?4:R.padding,pt:A?3:"16px",pb:A?3:R.padding,color:"var(--Text)",fontSize:"small"===d?"13px":"14px",lineHeight:1.6},children:n})]})]}):null}const yu={small:{width:"240px",height:"200px"},medium:{width:"320px",height:"280px"},large:{width:"420px",height:"380px"}},Su={left:{borderRight:"1px solid var(--Border)"},right:{borderLeft:"1px solid var(--Border)"},top:{borderBottom:"1px solid var(--Border)"},bottom:{borderTop:"1px solid var(--Border)"}},ku={left:{top:0,left:0,bottom:0},right:{top:0,right:0,bottom:0},top:{top:0,left:0,right:0},bottom:{bottom:0,left:0,right:0}},Bu={left:"translateX(-100%)",right:"translateX(100%)",top:"translateY(-100%)",bottom:"translateY(100%)"};function wu({children:e,open:t=!1,onClose:r,size:n="medium",anchor:l="left",hideBackdrop:s=!1,className:d="",sx:c={},...u}){const p=o(null),m=o(null),f="left"===l||"right"===l;let g;try{g=Zc()}catch{g=null}const x=g?.theme||"Default",b=g?.style||"Modern",v=yu[n]||yu.medium;a(()=>{if(!t)return;const e=e=>{"Escape"===e.key&&r?.()};return document.addEventListener("keydown",e),()=>document.removeEventListener("keydown",e)},[t,r]),a(()=>{t?(m.current=document.activeElement,requestAnimationFrame(()=>{const e=p.current?.querySelector('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');e?e.focus():p.current?.focus()})):m.current&&(m.current.focus(),m.current=null)},[t]),a(()=>{if(t){const e=document.body.style.overflow;return document.body.style.overflow="hidden",()=>{document.body.style.overflow=e}}},[t]);const y=i(e=>{if("Tab"!==e.key||!p.current)return;const t=p.current.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');if(!t.length)return;const r=t[0],n=t[t.length-1];e.shiftKey?document.activeElement===r&&(e.preventDefault(),n.focus()):document.activeElement===n&&(e.preventDefault(),r.focus())},[]);return t?ce(ue,{children:[!s&&de(h,{onClick:()=>r?.(),"aria-hidden":"true",sx:{position:"fixed",inset:0,zIndex:1e7,backgroundColor:"rgba(0, 0, 0, 0.5)",transition:"opacity 0.3s ease"}}),de(h,{ref:p,role:"dialog","aria-modal":"true",tabIndex:-1,"data-theme":x,"data-style":b,"data-surface":"Surface-Dim",onKeyDown:y,className:"drawer drawer-"+n+" drawer-"+l+" "+d,sx:{position:"fixed",zIndex:10000001,...ku[l],...f?{width:v.width,height:"100%"}:{height:v.height,width:"100%"},backgroundColor:"var(--Background)",color:"var(--Text)",...Su[l],boxShadow:io,display:"flex",flexDirection:"column",outline:"none",overflow:"hidden",animation:"drawer-slide-in 0.3s ease forwards","@keyframes drawer-slide-in":{from:{transform:Bu[l]},to:{transform:"translate(0, 0)"}},...c},...u,children:e})]}):null}function Cu({onClick:e,className:t="",sx:r={},...n}){return de(h,{sx:{position:"absolute",top:"12px",right:"12px",zIndex:1,...r},className:t,...n,children:de(Io,{iconOnly:!0,variant:"ghost",size:"small",onClick:e,"aria-label":"Close drawer",children:de(Qn,{size:"small",children:de(Lt,{})})})})}function Tu({children:e,className:t="",sx:r={},...n}){return de(h,{className:"drawer-header "+t,sx:{display:"flex",alignItems:"center",justifyContent:"space-between",padding:"16px",borderBottom:"1px solid var(--Border)",flexShrink:0,...r},...n,children:e})}function Iu({children:e,className:t="",sx:r={},...n}){return de(h,{className:"drawer-content "+t,sx:{flex:1,overflowY:"auto",padding:"16px",...r},...n,children:e})}function Au(){return Au=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)({}).hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},Au.apply(null,arguments)}const zu={};function Ru(t,r){const n=e.useRef(zu);return n.current===zu&&(n.current=t(r)),n}function Eu(e,t,r,n){const o=Ru(Pu).current;return function(e,t,r,n,o){return e.refs[0]!==t||e.refs[1]!==r||e.refs[2]!==n||e.refs[3]!==o}(o,e,t,r,n)&&function(e,t){if(e.refs=t,t.every(e=>null==e))return void(e.callback=null);e.callback=r=>{if(e.cleanup&&(e.cleanup(),e.cleanup=null),null!=r){const n=Array(t.length).fill(null);for(let e=0;e<t.length;e+=1){const o=t[e];if(null!=o)switch(typeof o){case"function":{const t=o(r);"function"==typeof t&&(n[e]=t);break}case"object":o.current=r}}e.cleanup=()=>{for(let e=0;e<t.length;e+=1){const r=t[e];if(null!=r)switch(typeof r){case"function":{const t=n[e];"function"==typeof t?t():r(null);break}case"object":r.current=null}}}}}}(o,[e,t,r,n]),o.callback}function Pu(){return{callback:null,cleanup:null,refs:[]}}function Lu(e,t,r=void 0){const n={};for(const o in e){const i=e[o];let a="",l=!0;for(let e=0;e<i.length;e+=1){const n=i[e];n&&(a+=(!0===l?"":" ")+t(n),l=!1,r&&r[n]&&(a+=" "+r[n]))}n[o]=a}return n}function Mu(e){var t,r,n="";if("string"==typeof e||"number"==typeof e)n+=e;else if("object"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(r=Mu(e[t]))&&(n&&(n+=" "),n+=r)}else for(r in e)e[r]&&(n&&(n+=" "),n+=r);return n}function Wu(){for(var e,t,r=0,n="",o=arguments.length;r<o;r++)(e=arguments[r])&&(t=Mu(e))&&(n&&(n+=" "),n+=t);return n}function Ou(e,t=[]){if(void 0===e)return{};const r={};return Object.keys(e).filter(r=>r.match(/^on[A-Z]/)&&"function"==typeof e[r]&&!t.includes(r)).forEach(t=>{r[t]=e[t]}),r}function Du(e){if(void 0===e)return{};const t={};return Object.keys(e).filter(t=>!(t.match(/^on[A-Z]/)&&"function"==typeof e[t])).forEach(r=>{t[r]=e[r]}),t}function Fu(e,t,r){return"function"==typeof e?e(t,r):e}function Nu(t){const{elementType:r,externalSlotProps:n,ownerState:o,skipResolvingSlotProps:i=!1,...a}=t,l=i?{}:Fu(n,o),{props:s,internalRef:d}=function(e){const{getSlotProps:t,additionalProps:r,externalSlotProps:n,externalForwardedProps:o,className:i}=e;if(!t){const e=Wu(r?.className,i,o?.className,n?.className),t={...r?.style,...o?.style,...n?.style},a={...r,...o,...n};return e.length>0&&(a.className=e),Object.keys(t).length>0&&(a.style=t),{props:a,internalRef:void 0}}const a=Ou({...o,...n}),l=Du(n),s=Du(o),d=t(a),c=Wu(d?.className,r?.className,i,o?.className,n?.className),u={...d?.style,...r?.style,...o?.style,...n?.style},p={...d,...r,...s,...l};return c.length>0&&(p.className=c),Object.keys(u).length>0&&(p.style=u),{props:p,internalRef:d.ref}}({...a,externalSlotProps:l}),c=function(e,t,r){return void 0===e||"string"==typeof e?t:{...t,ownerState:{...t.ownerState,...r}}}(r,{...s,ref:function(...t){const r=e.useRef(void 0),n=e.useCallback(e=>{const r=t.map(t=>{if(null==t)return null;if("function"==typeof t){const r=t,n=r(e);return"function"==typeof n?n:()=>{r(null)}}return t.current=e,()=>{t.current=null}});return()=>{r.forEach(e=>e?.())}},t);return e.useMemo(()=>t.every(e=>null==e)?null:e=>{r.current&&(r.current(),r.current=void 0),null!=e&&(r.current=n(e))},t)}(d,l?.ref,t.additionalProps?.ref)},o);return c}const Hu=new Set;function Vu(e,t="warning"){if("production"===process.env.NODE_ENV)return;const r=Array.isArray(e)?e.join("\n"):e;Hu.has(r)||(Hu.add(r),"error"===t?console.error(r):console.warn(r))}function Qu(e){return rr}const ju=e=>e,Gu=(()=>{let e=ju;return{configure(t){e=t},generate:t=>e(t),reset(){e=ju}}})(),Uu={active:"active",checked:"checked",completed:"completed",disabled:"disabled",error:"error",expanded:"expanded",focused:"focused",focusVisible:"focusVisible",open:"open",readOnly:"readOnly",required:"required",selected:"selected"};function Xu(e,t,r="Mui"){const n=Uu[t];return n?`${r}-${n}`:`${Gu.generate(e)}-${t}`}function $u(e,t,r="Mui"){const n={};return t.forEach(t=>{n[t]=Xu(e,t,r)}),n}function Ku(e){return Xu("MuiSimpleTreeView",e)}$u("MuiSimpleTreeView",["root","item","itemContent","itemGroupTransition","itemIconContainer","itemLabel","itemCheckbox"]);const qu=Object.freeze([]),Yu=Object.freeze({}),Ju=e.createContext(null);"production"!==process.env.NODE_ENV&&(Ju.displayName="TreeViewContext");const Zu=()=>{const t=e.useContext(Ju);if(null==t)throw new Error(["MUI X: Could not find the Tree View context.","It looks like you rendered your component outside of a SimpleTreeView or RichTreeView parent component.","This can also happen if you are bundling multiple versions of the Tree View."].join("\n"));return t},_u=e.createContext({classes:{},slots:{},slotProps:{}});"production"!==process.env.NODE_ENV&&(_u.displayName="TreeViewStyleContext");const ep=()=>e.useContext(_u);function tp(t){const{store:r,apiRef:n,rootRef:o,classes:i=Yu,slots:a=Yu,slotProps:l=Yu,children:s}=t,d=(t=>{const{store:r,apiRef:n,rootRef:o}=t,i=Ru(()=>r.buildPublicAPI()).current;!function(e,t){null!=t&&null==t.current&&(t.current=e)}(i,n);const a=e.useCallback(e=>{let t=null,n=null;const o=[],i={};r.itemPluginManager.listPlugins().forEach(r=>{const a=r({props:e,rootRef:t,contentRef:n});a?.rootRef&&(t=a.rootRef),a?.contentRef&&(n=a.contentRef),a?.propsEnhancers&&(o.push(a.propsEnhancers),Object.keys(a.propsEnhancers).forEach(e=>{i[e]=!0}))});const a=Object.fromEntries(Object.keys(i).map(e=>{return[e,(t=e,e=>{const r={};return o.forEach(n=>{const o=n[t];null!=o&&Object.assign(r,o(e))}),r})];var t}));return{contentRef:n,rootRef:t,propsEnhancers:a}},[r]),l=e.useCallback(({itemId:e,children:t,idAttribute:n})=>{let o=t;const i=r.itemPluginManager.listWrappers();for(let t=i.length-1;t>=0;t-=1)o=(0,i[t])({store:r,itemId:e,children:o,idAttribute:n});return o},[r]);return e.useMemo(()=>({runItemPlugins:a,wrapItem:l,publicAPI:i,store:r,rootRef:o}),[a,l,i,r,o])})({store:r,apiRef:n,rootRef:o}),c=e.useMemo(()=>({classes:i,slots:{collapseIcon:a.collapseIcon,expandIcon:a.expandIcon,endIcon:a.endIcon},slotProps:{collapseIcon:l.collapseIcon,expandIcon:l.expandIcon,endIcon:l.endIcon}}),[i,a.collapseIcon,a.expandIcon,a.endIcon,l.collapseIcon,l.expandIcon,l.endIcon]);return de(Ju.Provider,{value:d,children:de(_u.Provider,{value:c,children:s})})}function rp(e,t){if(null==e)return{};var r={};for(var n in e)if({}.hasOwnProperty.call(e,n)){if(-1!==t.indexOf(n))continue;r[n]=e[n]}return r}const np=["apiRef","slots","slotProps","disabledItemsFocusable","onItemClick","itemChildrenIndentation","id","expandedItems","defaultExpandedItems","onExpandedItemsChange","onItemExpansionToggle","expansionTrigger","disableSelection","selectedItems","defaultSelectedItems","multiSelect","checkboxSelection","selectionPropagation","onSelectedItemsChange","onItemSelectionToggle","onItemFocus"];var op=(e,t,r)=>{if(1===t.length&&t[0]===r){let t=!1;try{const r={};e(r)===r&&(t=!0)}catch{}if(t){let e;try{throw new Error}catch(t){({stack:e}=t)}console.warn("The result function returned its own inputs without modification. e.g\n`createSelector([state => state.todos], todos => todos)`\nThis could lead to inefficient memoization and unnecessary re-renders.\nEnsure transformation logic is in the result function, and extraction logic is in the input selectors.",{stack:e})}}},ip=(e,t,r)=>{const{memoize:n,memoizeOptions:o}=t,{inputSelectorResults:i,inputSelectorResultsCopy:a}=e,l=n(()=>({}),...o);if(!(l.apply(null,i)===l.apply(null,a))){let e;try{throw new Error}catch(t){({stack:e}=t)}console.warn("An input selector returned a different result when passed same arguments.\nThis means your output selector will likely run more frequently than intended.\nAvoid returning a new reference inside your input selector, e.g.\n`createSelector([state => state.todos.map(todo => todo.id)], todoIds => todoIds.length)`",{arguments:r,firstInputs:i,secondInputs:a,stack:e})}},ap={inputStabilityCheck:"once",identityFunctionCheck:"once"},lp=Symbol("NOT_FOUND");var sp=e=>Array.isArray(e)?e:[e];function dp(e){const t=Array.isArray(e[0])?e[0]:e;return function(e,t="expected all items to be functions, instead received the following types: "){if(!e.every(e=>"function"==typeof e)){const r=e.map(e=>"function"==typeof e?`function ${e.name||"unnamed"}()`:typeof e).join(", ");throw new TypeError(`${t}[${r}]`)}}(t,"createSelector expects all input-selectors to be functions, but received the following types: "),t}function cp(e,t){const r=[],{length:n}=e;for(let o=0;o<n;o++)r.push(e[o].apply(null,t));return r}var up=(e,t)=>e===t;var pp="undefined"!=typeof WeakRef?WeakRef:class{constructor(e){this.value=e}deref(){return this.value}};function hp(){return{s:0,v:void 0,o:null,p:null}}function mp(e,t={}){let r={s:0,v:void 0,o:null,p:null};const{resultEqualityCheck:n}=t;let o,i=0;function a(){let t=r;const{length:a}=arguments;for(let e=0,r=a;e<r;e++){const r=arguments[e];if("function"==typeof r||"object"==typeof r&&null!==r){let e=t.o;null===e&&(t.o=e=new WeakMap);const n=e.get(r);void 0===n?(t=hp(),e.set(r,t)):t=n}else{let e=t.p;null===e&&(t.p=e=new Map);const n=e.get(r);void 0===n?(t=hp(),e.set(r,t)):t=n}}const l=t;let s;if(1===t.s)s=t.v;else if(s=e.apply(null,arguments),i++,n){const e=o?.deref?.()??o;null!=e&&n(e,s)&&(s=e,0!==i&&i--);o="object"==typeof s&&null!==s||"function"==typeof s?new pp(s):s}return l.s=1,l.v=s,s}return a.clearCache=()=>{r={s:0,v:void 0,o:null,p:null},a.resetResultsCount()},a.resultsCount=()=>i,a.resetResultsCount=()=>{i=0},a}function fp(e,...t){const r="function"==typeof e?{memoize:e,memoizeOptions:t}:e,n=(...e)=>{let t,n=0,o=0,i={},a=e.pop();"object"==typeof a&&(i=a,a=e.pop()),function(e,t="expected a function, instead received "+typeof e){if("function"!=typeof e)throw new TypeError(t)}(a,`createSelector expects an output function after the inputs, but received: [${typeof a}]`);const l={...r,...i},{memoize:s,memoizeOptions:d=[],argsMemoize:c=mp,argsMemoizeOptions:u=[],devModeChecks:p={}}=l,h=sp(d),m=sp(u),f=dp(e),g=s(function(){return n++,a.apply(null,arguments)},...h);let x=!0;const b=c(function(){o++;const e=cp(f,arguments);if(t=g.apply(null,e),"production"!==process.env.NODE_ENV){const{identityFunctionCheck:r,inputStabilityCheck:n}=((e,t)=>{const{identityFunctionCheck:r,inputStabilityCheck:n}={...ap,...t};return{identityFunctionCheck:{shouldRun:"always"===r||"once"===r&&e,run:op},inputStabilityCheck:{shouldRun:"always"===n||"once"===n&&e,run:ip}}})(x,p);if(r.shouldRun&&r.run(a,e,t),n.shouldRun){const t=cp(f,arguments);n.run({inputSelectorResults:e,inputSelectorResultsCopy:t},{memoize:s,memoizeOptions:h},arguments)}x&&(x=!1)}return t},...m);return Object.assign(b,{resultFunc:a,memoizedResultFunc:g,dependencies:f,dependencyRecomputations:()=>o,resetDependencyRecomputations:()=>{o=0},lastResult:()=>t,recomputations:()=>n,resetRecomputations:()=>{n=0},memoize:s,argsMemoize:c})};return Object.assign(n,{withTypes:()=>n}),n}var gp=fp(mp),xp=Object.assign((e,t=gp)=>{!function(e,t="expected an object, instead received "+typeof e){if("object"!=typeof e)throw new TypeError(t)}(e,"createStructuredSelector expects first argument to be an object where each property is a selector, instead received a "+typeof e);const r=Object.keys(e),n=t(r.map(t=>e[t]),(...e)=>e.reduce((e,t,n)=>(e[r[n]]=t,e),{}));return n},{withTypes:()=>xp});const bp=fp({memoize:function(e,t){const r="object"==typeof t?t:{equalityCheck:t},{equalityCheck:n=up,maxSize:o=1,resultEqualityCheck:i}=r,a=function(e){return function(t,r){if(null===t||null===r||t.length!==r.length)return!1;const{length:n}=t;for(let o=0;o<n;o++)if(!e(t[o],r[o]))return!1;return!0}}(n);let l=0;const s=o<=1?function(e){let t;return{get:r=>t&&e(t.key,r)?t.value:lp,put(e,r){t={key:e,value:r}},getEntries:()=>t?[t]:[],clear(){t=void 0}}}(a):function(e,t){let r=[];function n(e){const n=r.findIndex(r=>t(e,r.key));if(n>-1){const e=r[n];return n>0&&(r.splice(n,1),r.unshift(e)),e.value}return lp}return{get:n,put:function(t,o){n(t)===lp&&(r.unshift({key:t,value:o}),r.length>e&&r.pop())},getEntries:function(){return r},clear:function(){r=[]}}}(o,a);function d(){let t=s.get(arguments);if(t===lp){if(t=e.apply(null,arguments),l++,i){const e=s.getEntries().find(e=>i(e.value,t));e&&(t=e.value,0!==l&&l--)}s.put(arguments,t)}return t}return d.clearCache=()=>{s.clear(),d.resetResultsCount()},d.resultsCount=()=>l,d.resetResultsCount=()=>{l=0},d},memoizeOptions:{maxSize:1,equalityCheck:Object.is}}),vp=(e,t,r,n,o,i,a,l,...s)=>{if(s.length>0)throw new Error("Unsupported number of selectors");let d;if(e&&t&&r&&n&&o&&i&&a&&l)d=(s,d,c,u)=>{const p=e(s,d,c,u),h=t(s,d,c,u),m=r(s,d,c,u),f=n(s,d,c,u),g=o(s,d,c,u),x=i(s,d,c,u),b=a(s,d,c,u);return l(p,h,m,f,g,x,b,d,c,u)};else if(e&&t&&r&&n&&o&&i&&a)d=(l,s,d,c)=>{const u=e(l,s,d,c),p=t(l,s,d,c),h=r(l,s,d,c),m=n(l,s,d,c),f=o(l,s,d,c),g=i(l,s,d,c);return a(u,p,h,m,f,g,s,d,c)};else if(e&&t&&r&&n&&o&&i)d=(a,l,s,d)=>{const c=e(a,l,s,d),u=t(a,l,s,d),p=r(a,l,s,d),h=n(a,l,s,d),m=o(a,l,s,d);return i(c,u,p,h,m,l,s,d)};else if(e&&t&&r&&n&&o)d=(i,a,l,s)=>{const d=e(i,a,l,s),c=t(i,a,l,s),u=r(i,a,l,s),p=n(i,a,l,s);return o(d,c,u,p,a,l,s)};else if(e&&t&&r&&n)d=(o,i,a,l)=>{const s=e(o,i,a,l),d=t(o,i,a,l),c=r(o,i,a,l);return n(s,d,c,i,a,l)};else if(e&&t&&r)d=(n,o,i,a)=>{const l=e(n,o,i,a),s=t(n,o,i,a);return r(l,s,o,i,a)};else if(e&&t)d=(r,n,o,i)=>{const a=e(r,n,o,i);return t(a,n,o,i)};else{if(!e)throw new Error("Missing arguments");d=e}return d},yp=(...e)=>{const t=new WeakMap;let r=1;const n=e[e.length-1],o=e.length-1||1,i=Math.max(n.length-o,0);if(i>3)throw new Error("Unsupported number of arguments");return(o,a,l,s)=>{let d=o.__cacheKey__;d||(d={id:r},o.__cacheKey__=d,r+=1);let c=t.get(d);if(!c){const r=1===e.length?[e=>e,n]:e;let o=e;const a=[void 0,void 0,void 0];switch(i){case 0:break;case 1:o=[...r.slice(0,-1),()=>a[0],n];break;case 2:o=[...r.slice(0,-1),()=>a[0],()=>a[1],n];break;case 3:o=[...r.slice(0,-1),()=>a[0],()=>a[1],()=>a[2],n];break;default:throw new Error("Unsupported number of arguments")}c=bp(...o),c.selectorArgs=a,t.set(d,c)}switch(i){case 3:c.selectorArgs[2]=s;case 2:c.selectorArgs[1]=l;case 1:c.selectorArgs[0]=a}switch(i){case 0:return c(o);case 1:return c(o,a);case 2:return c(o,a,l);case 3:return c(o,a,l,s);default:throw new Error("unreachable")}}};var Sp,kp={exports:{}},Bp={};var wp,Cp={};
15
15
  /**
16
16
  * @license React
17
17
  * use-sync-external-store-shim.development.js
@@ -20,7 +20,7 @@ object-assign
20
20
  *
21
21
  * This source code is licensed under the MIT license found in the
22
22
  * LICENSE file in the root directory of this source tree.
23
- */"production"===process.env.NODE_ENV?gp.exports=function(){if(fp)return xp;fp=1;var e=t,r="function"==typeof Object.is?Object.is:function(e,t){return e===t&&(0!==e||1/e==1/t)||e!=e&&t!=t},o=e.useState,n=e.useEffect,i=e.useLayoutEffect,a=e.useDebugValue;function l(e){var t=e.getSnapshot;e=e.value;try{var o=t();return!r(e,o)}catch(e){return!0}}var s="undefined"==typeof window||void 0===window.document||void 0===window.document.createElement?function(e,t){return t()}:function(e,t){var r=t(),s=o({inst:{value:r,getSnapshot:t}}),d=s[0].inst,c=s[1];return i(function(){d.value=r,d.getSnapshot=t,l(d)&&c({inst:d})},[e,r,t]),n(function(){return l(d)&&c({inst:d}),e(function(){l(d)&&c({inst:d})})},[e]),a(r),r};return xp.useSyncExternalStore=void 0!==e.useSyncExternalStore?e.useSyncExternalStore:s,xp}():gp.exports=(bp||(bp=1,"production"!==process.env.NODE_ENV&&function(){function e(e){var t=e.getSnapshot;e=e.value;try{var r=t();return!o(e,r)}catch(e){return!0}}"undefined"!=typeof __REACT_DEVTOOLS_GLOBAL_HOOK__&&"function"==typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart&&__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error());var r=t,o="function"==typeof Object.is?Object.is:function(e,t){return e===t&&(0!==e||1/e==1/t)||e!=e&&t!=t},n=r.useState,i=r.useEffect,a=r.useLayoutEffect,l=r.useDebugValue,s=!1,d=!1,c="undefined"==typeof window||void 0===window.document||void 0===window.document.createElement?function(e,t){return t()}:function(t,c){s||void 0===r.startTransition||(s=!0,console.error("You are using an outdated, pre-release alpha of React 18 that does not support useSyncExternalStore. The use-sync-external-store shim will not work correctly. Upgrade to a newer pre-release."));var u=c();if(!d){var p=c();o(u,p)||(console.error("The result of getSnapshot should be cached to avoid an infinite loop"),d=!0)}var h=(p=n({inst:{value:u,getSnapshot:c}}))[0].inst,m=p[1];return a(function(){h.value=u,h.getSnapshot=c,e(h)&&m({inst:h})},[t,u,c]),i(function(){return e(h)&&m({inst:h}),t(function(){e(h)&&m({inst:h})})},[t]),l(u),u};vp.useSyncExternalStore=void 0!==r.useSyncExternalStore?r.useSyncExternalStore:c,"undefined"!=typeof __REACT_DEVTOOLS_GLOBAL_HOOK__&&"function"==typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop&&__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error())}()),vp);var yp,Sp=gp.exports,kp={exports:{}},Bp={};var wp,Cp={};
23
+ */"production"===process.env.NODE_ENV?kp.exports=function(){if(Sp)return Bp;Sp=1;var e=t,r="function"==typeof Object.is?Object.is:function(e,t){return e===t&&(0!==e||1/e==1/t)||e!=e&&t!=t},n=e.useState,o=e.useEffect,i=e.useLayoutEffect,a=e.useDebugValue;function l(e){var t=e.getSnapshot;e=e.value;try{var n=t();return!r(e,n)}catch(e){return!0}}var s="undefined"==typeof window||void 0===window.document||void 0===window.document.createElement?function(e,t){return t()}:function(e,t){var r=t(),s=n({inst:{value:r,getSnapshot:t}}),d=s[0].inst,c=s[1];return i(function(){d.value=r,d.getSnapshot=t,l(d)&&c({inst:d})},[e,r,t]),o(function(){return l(d)&&c({inst:d}),e(function(){l(d)&&c({inst:d})})},[e]),a(r),r};return Bp.useSyncExternalStore=void 0!==e.useSyncExternalStore?e.useSyncExternalStore:s,Bp}():kp.exports=(wp||(wp=1,"production"!==process.env.NODE_ENV&&function(){function e(e){var t=e.getSnapshot;e=e.value;try{var r=t();return!n(e,r)}catch(e){return!0}}"undefined"!=typeof __REACT_DEVTOOLS_GLOBAL_HOOK__&&"function"==typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart&&__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error());var r=t,n="function"==typeof Object.is?Object.is:function(e,t){return e===t&&(0!==e||1/e==1/t)||e!=e&&t!=t},o=r.useState,i=r.useEffect,a=r.useLayoutEffect,l=r.useDebugValue,s=!1,d=!1,c="undefined"==typeof window||void 0===window.document||void 0===window.document.createElement?function(e,t){return t()}:function(t,c){s||void 0===r.startTransition||(s=!0,console.error("You are using an outdated, pre-release alpha of React 18 that does not support useSyncExternalStore. The use-sync-external-store shim will not work correctly. Upgrade to a newer pre-release."));var u=c();if(!d){var p=c();n(u,p)||(console.error("The result of getSnapshot should be cached to avoid an infinite loop"),d=!0)}var h=(p=o({inst:{value:u,getSnapshot:c}}))[0].inst,m=p[1];return a(function(){h.value=u,h.getSnapshot=c,e(h)&&m({inst:h})},[t,u,c]),i(function(){return e(h)&&m({inst:h}),t(function(){e(h)&&m({inst:h})})},[t]),l(u),u};Cp.useSyncExternalStore=void 0!==r.useSyncExternalStore?r.useSyncExternalStore:c,"undefined"!=typeof __REACT_DEVTOOLS_GLOBAL_HOOK__&&"function"==typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop&&__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error())}()),Cp);var Tp,Ip=kp.exports,Ap={exports:{}},zp={};var Rp,Ep={};
24
24
  /**
25
25
  * @license React
26
26
  * use-sync-external-store-shim/with-selector.development.js
@@ -29,7 +29,7 @@ object-assign
29
29
  *
30
30
  * This source code is licensed under the MIT license found in the
31
31
  * LICENSE file in the root directory of this source tree.
32
- */"production"===process.env.NODE_ENV?kp.exports=function(){if(yp)return Bp;yp=1;var e=t,r=Sp,o="function"==typeof Object.is?Object.is:function(e,t){return e===t&&(0!==e||1/e==1/t)||e!=e&&t!=t},n=r.useSyncExternalStore,i=e.useRef,a=e.useEffect,l=e.useMemo,s=e.useDebugValue;return Bp.useSyncExternalStoreWithSelector=function(e,t,r,d,c){var u=i(null);if(null===u.current){var p={hasValue:!1,value:null};u.current=p}else p=u.current;u=l(function(){function e(e){if(!a){if(a=!0,n=e,e=d(e),void 0!==c&&p.hasValue){var t=p.value;if(c(t,e))return i=t}return i=e}if(t=i,o(n,e))return t;var r=d(e);return void 0!==c&&c(t,r)?(n=e,t):(n=e,i=r)}var n,i,a=!1,l=void 0===r?null:r;return[function(){return e(t())},null===l?void 0:function(){return e(l())}]},[t,r,d,c]);var h=n(e,u[0],u[1]);return a(function(){p.hasValue=!0,p.value=h},[h]),s(h),h},Bp}():kp.exports=(wp||(wp=1,"production"!==process.env.NODE_ENV&&function(){"undefined"!=typeof __REACT_DEVTOOLS_GLOBAL_HOOK__&&"function"==typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart&&__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error());var e=t,r=Sp,o="function"==typeof Object.is?Object.is:function(e,t){return e===t&&(0!==e||1/e==1/t)||e!=e&&t!=t},n=r.useSyncExternalStore,i=e.useRef,a=e.useEffect,l=e.useMemo,s=e.useDebugValue;Cp.useSyncExternalStoreWithSelector=function(e,t,r,d,c){var u=i(null);if(null===u.current){var p={hasValue:!1,value:null};u.current=p}else p=u.current;u=l(function(){function e(e){if(!a){if(a=!0,n=e,e=d(e),void 0!==c&&p.hasValue){var t=p.value;if(c(t,e))return i=t}return i=e}if(t=i,o(n,e))return t;var r=d(e);return void 0!==c&&c(t,r)?(n=e,t):(n=e,i=r)}var n,i,a=!1,l=void 0===r?null:r;return[function(){return e(t())},null===l?void 0:function(){return e(l())}]},[t,r,d,c]);var h=n(e,u[0],u[1]);return a(function(){p.hasValue=!0,p.value=h},[h]),s(h),h},"undefined"!=typeof __REACT_DEVTOOLS_GLOBAL_HOOK__&&"function"==typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop&&__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error())}()),Cp);var Tp=kp.exports;const Ip=parseInt(e.version,10)>=19?function(t,r,o,n,i){const a=e.useCallback(()=>r(t.getSnapshot(),o,n,i),[t,r,o,n,i]);return Sp.useSyncExternalStore(t.subscribe,a,a)}:function(e,t,r,o,n){return Tp.useSyncExternalStoreWithSelector(e.subscribe,e.getSnapshot,e.getSnapshot,e=>t(e,r,o,n))};function Ap(e,t,r,o,n){return Ip(e,t,r,o,n)}class zp{static create(e){return new zp(e)}constructor(e){this.state=e,this.listeners=new Set,this.updateTick=0}subscribe=e=>(this.listeners.add(e),()=>{this.listeners.delete(e)});getSnapshot=()=>this.state;setState(e){this.state=e,this.updateTick+=1;const t=this.updateTick,r=this.listeners.values();let o;for(;o=r.next(),!o.done;){if(t!==this.updateTick)return;(0,o.value)(e)}}update(e){for(const t in e)if(!Object.is(this.state[t],e[t]))return void this.setState(ku({},this.state,e))}set(e,t){Object.is(this.state[e],t)||this.setState(ku({},this.state,{[e]:t}))}use=(()=>(e,t,r,o)=>Ap(this,e,t,r,o))()}const Rp=hp(e=>e.providedTreeId??e.treeId),Ep={treeId:Rp,treeItemIdAttribute:hp(Rp,(e,t,r)=>null!=r?r:`${e??""}-${t}`)},Pp="__TREE_VIEW_ROOT_PARENT_ID__",Op=e=>{const t={};return e.forEach((e,r)=>{t[e]=r}),t},Lp=(e,t)=>{if(null==t)return!1;let r=e[t];if(!r)return!1;if(r.disabled)return!0;for(;null!=r.parentId;){if(r=e[r.parentId],!r)return!1;if(r.disabled)return!0}return!1};function Mp(e){const{storeParameters:t,items:r,parentId:o,depth:n,isItemExpandable:i,otherItemsMetaLookup:a}=e,l={},s={},d=[],c=[],u=e=>{const r=t.getItemId?t.getItemId(e):e.id;!function({id:e,parentId:t,item:r,itemMetaLookup:o,siblingsMetaLookup:n}){if(null==e)throw new Error(["MUI X: The Tree View component requires all items to have a unique `id` property.","Alternatively, you can use the `getItemId` prop to specify a custom id for each item.","An item was provided without id in the `items` prop:",JSON.stringify(r)].join("\n"));if(null!=n[e]||null!=o[e]&&o[e].parentId!==t)throw new Error(["MUI X: The Tree View component requires all items to have a unique `id` property.","Alternatively, you can use the `getItemId` prop to specify a custom id for each item.",`Two items were provided with the same id in the \`items\` prop: "${e}"`].join("\n"))}({id:r,parentId:o,item:e,itemMetaLookup:a,siblingsMetaLookup:l});const u=t.getItemLabel?t.getItemLabel(e):e.label;if(null==u)throw new Error(["MUI X: The Tree View component requires all items to have a `label` property.","Alternatively, you can use the `getItemLabel` prop to specify a custom label for each item.","An item was provided without label in the `items` prop:",JSON.stringify(e)].join("\n"));const p=(t.getItemChildren?t.getItemChildren(e):e.children)||[];c.push({id:r,children:p}),s[r]=e,l[r]={id:r,label:u,parentId:o,idAttribute:void 0,expandable:i(e,p),disabled:!!t.isItemDisabled&&t.isItemDisabled(e),selectable:!t.isItemSelectionDisabled||!t.isItemSelectionDisabled(e),depth:n},d.push(r)};for(const e of r)u(e);return{metaLookup:l,modelLookup:s,orderedChildrenIds:d,childrenIndexes:Op(d),itemsChildren:c}}const Wp=[],Dp={domStructure:hp(e=>e.domStructure),disabledItemFocusable:hp(e=>e.disabledItemsFocusable),itemMetaLookup:hp(e=>e.itemMetaLookup),itemOrderedChildrenIdsLookup:hp(e=>e.itemOrderedChildrenIdsLookup),itemMeta:hp((e,t)=>e.itemMetaLookup[t??Pp]??null),itemOrderedChildrenIds:hp((e,t)=>e.itemOrderedChildrenIdsLookup[t??Pp]??Wp),itemModel:hp((e,t)=>e.itemModelLookup[t]),isItemDisabled:hp((e,t)=>Lp(e.itemMetaLookup,t)),itemIndex:hp((e,t)=>{const r=e.itemMetaLookup[t];if(null==r)return-1;return e.itemChildrenIndexesLookup[r.parentId??Pp][r.id]}),itemParentId:hp((e,t)=>e.itemMetaLookup[t]?.parentId??null),itemDepth:hp((e,t)=>e.itemMetaLookup[t]?.depth??0),canItemBeFocused:hp((e,t)=>e.disabledItemsFocusable||null!=e.itemModelLookup[t]&&!Lp(e.itemMetaLookup,t)),itemChildrenIndentation:hp(e=>e.itemChildrenIndentation)};class Fp{constructor(e){this.store=e}static shouldRebuildItemsState=(e,t)=>["items","isItemDisabled","isItemSelectionDisabled","getItemId","getItemLabel","getItemChildren"].some(r=>{const o=r;return e[o]!==t[o]});static buildItemsStateIfNeeded=e=>{const t={},r={},o={},n={};return function i(a,l,s){const d=l??Pp,{metaLookup:c,modelLookup:u,orderedChildrenIds:p,childrenIndexes:h,itemsChildren:m}=Mp({storeParameters:e,items:a,parentId:l,depth:s,isItemExpandable:(e,t)=>!!t&&t.length>0,otherItemsMetaLookup:t});Object.assign(t,c),Object.assign(r,u),o[d]=p,n[d]=h;for(const e of m)i(e.children||[],e.id,s+1)}(e.items,null,0),{itemMetaLookup:t,itemModelLookup:r,itemOrderedChildrenIdsLookup:o,itemChildrenIndexesLookup:n}};getItem=e=>Dp.itemModel(this.store.state,e);getItemTree=()=>{const e=t=>{const r=ku({},Dp.itemModel(this.store.state,t)),o=Dp.itemOrderedChildrenIds(this.store.state,t);return o.length>0?r.children=o.map(e):delete r.children,r};return Dp.itemOrderedChildrenIds(this.store.state,null).map(e)};getItemOrderedChildrenIds=e=>Dp.itemOrderedChildrenIds(this.store.state,e);getParentId=e=>{const t=Dp.itemMeta(this.store.state,e);return t?.parentId||null};setIsItemDisabled=({itemId:e,shouldBeDisabled:t})=>{if(!this.store.state.itemMetaLookup[e])return;const r=ku({},this.store.state.itemMetaLookup);r[e]=ku({},r[e],{disabled:t??!r[e].disabled}),this.store.set("itemMetaLookup",r)};buildPublicAPI=()=>({getItem:this.getItem,getItemDOMElement:this.getItemDOMElement,getItemOrderedChildrenIds:this.getItemOrderedChildrenIds,getItemTree:this.getItemTree,getParentId:this.getParentId,setIsItemDisabled:this.setIsItemDisabled});getItemDOMElement=e=>{const t=Dp.itemMeta(this.store.state,e);if(null==t)return null;const r=Ep.treeItemIdAttribute(this.store.state,e,t.idAttribute);return document.getElementById(r)};setItemChildren=({items:e,parentId:t,getChildrenCount:r})=>{const o=t??Pp,n=null==t?-1:Dp.itemDepth(this.store.state,t),{metaLookup:i,modelLookup:a,orderedChildrenIds:l,childrenIndexes:s}=Mp({storeParameters:this.store.parameters,items:e,parentId:t,depth:n+1,isItemExpandable:r?e=>0!==r(e):()=>!1,otherItemsMetaLookup:Dp.itemMetaLookup(this.store.state)});this.store.update({itemModelLookup:ku({},this.store.state.itemModelLookup,a),itemMetaLookup:ku({},this.store.state.itemMetaLookup,i),itemOrderedChildrenIdsLookup:ku({},this.store.state.itemOrderedChildrenIdsLookup,{[o]:l}),itemChildrenIndexesLookup:ku({},this.store.state.itemChildrenIndexesLookup,{[o]:s})})};removeChildren=e=>{const t=this.store.state.itemMetaLookup,r=Object.keys(t).reduce((r,o)=>{const n=t[o];return n.parentId===e?r:ku({},r,{[n.id]:n})},{}),o=ku({},this.store.state.itemOrderedChildrenIdsLookup),n=ku({},this.store.state.itemChildrenIndexesLookup),i=e??Pp;delete n[i],delete o[i],this.store.update({itemMetaLookup:r,itemOrderedChildrenIdsLookup:o,itemChildrenIndexesLookup:n})};handleItemClick=(e,t)=>{this.store.parameters.onItemClick?.(e,t)}}const Np=mp(e=>e.selectedItems,e=>Array.isArray(e)?e:null!=e?[e]:[]),Hp=mp(Np,e=>{const t=new Map;return e.forEach(e=>{t.set(e,!0)}),t}),Vp=hp((e,t)=>e.itemMetaLookup[t]?.selectable??!0),Qp={selectedItemsRaw:hp(e=>e.selectedItems),selectedItems:Np,selectedItemsMap:Hp,enabled:hp(e=>!e.disableSelection),isMultiSelectEnabled:hp(e=>e.multiSelect),isCheckboxSelectionEnabled:hp(e=>e.checkboxSelection),propagationRules:hp(e=>e.selectionPropagation),isItemSelected:hp(Hp,(e,t)=>e.has(t)),isFeatureEnabledForItem:hp(Vp,e=>!e.disableSelection,(e,t,r)=>t&&e),canItemBeSelected:hp(Dp.isItemDisabled,Vp,e=>!e.disableSelection,(e,t,r,o)=>r&&!e&&t),isItemSelectable:Vp},jp=hp((e,t)=>{if(Qp.isItemSelected(e,t))return"checked";let r=!1,o=!1;const n=i=>{i!==t&&(Qp.isItemSelected(e,i)?r=!0:o=!0),Dp.itemOrderedChildrenIds(e,i).forEach(n)};n(t);return Qp.propagationRules(e).parents?r&&o?"indeterminate":r&&!o?"checked":"empty":r?"indeterminate":"empty"}),Gp=({props:e})=>{const{itemId:t}=e,{store:r}=Xu(),o=Ap(r,Qp.isCheckboxSelectionEnabled),n=Ap(r,Qp.isFeatureEnabledForItem,t),i=Ap(r,Qp.canItemBeSelected,t),a=Ap(r,jp,t);return{propsEnhancers:{root:()=>{let e;return e="checked"===a||("indeterminate"===a?"mixed":!i&&void 0),{"aria-checked":e}},checkbox:({externalEventHandlers:e,interactions:l})=>({tabIndex:-1,onChange:o=>{e.onChange?.(o),o.defaultMuiPrevented||Qp.canItemBeSelected(r.state,t)&&l.handleCheckboxSelection(o)},visible:o&&n,disabled:!i,checked:"checked"===a,indeterminate:"indeterminate"===a})}}},Up=mp(e=>e.expandedItems,e=>{const t=new Map;return e.forEach(e=>{t.set(e,!0)}),t}),Xp={expandedItemsRaw:hp(e=>e.expandedItems),expandedItemsMap:Up,flatList:mp(Dp.itemOrderedChildrenIdsLookup,Up,(e,t)=>(e[Pp]??[]).flatMap(function r(o){if(!t.has(o))return[o];const n=[o],i=e[o]||[];for(const e of i)n.push(...r(e));return n})),triggerSlot:hp(e=>e.expansionTrigger),isItemExpanded:hp(Up,(e,t)=>e.has(t)),isItemExpandable:hp(Dp.itemMeta,(e,t)=>e?.expandable??!1)},Kp=(e,t)=>{let r=t.length-1;for(;r>=0&&!Dp.canItemBeFocused(e,t[r]);)r-=1;if(-1!==r)return t[r]},qp=(e,t)=>{const r=Dp.itemMeta(e,t);if(!r)return null;const o=Dp.itemOrderedChildrenIds(e,r.parentId),n=Dp.itemIndex(e,t);if(0===n)return r.parentId;let i=n-1;for(;!Dp.canItemBeFocused(e,o[i])&&i>=0;)i-=1;if(-1===i)return null==r.parentId?null:qp(e,r.parentId);let a=o[i],l=Kp(e,Dp.itemOrderedChildrenIds(e,a));for(;Xp.isItemExpanded(e,a)&&null!=l;)a=l,l=Kp(e,Dp.itemOrderedChildrenIds(e,a));return a},Jp=(e,t)=>{if(Xp.isItemExpanded(e,t)){const r=Dp.itemOrderedChildrenIds(e,t).find(t=>Dp.canItemBeFocused(e,t));if(null!=r)return r}let r=Dp.itemMeta(e,t);for(;null!=r;){const t=Dp.itemOrderedChildrenIds(e,r.parentId),o=Dp.itemIndex(e,r.id);if(o<t.length-1){let r=o+1;for(;!Dp.canItemBeFocused(e,t[r])&&r<t.length-1;)r+=1;if(Dp.canItemBeFocused(e,t[r]))return t[r]}r=Dp.itemMeta(e,r.parentId)}return null},Yp=e=>{let t=null;for(;null==t||Xp.isItemExpanded(e,t);){const r=Dp.itemOrderedChildrenIds(e,t),o=Kp(e,r);if(null==o)return t;t=o}return t},Zp=e=>Dp.itemOrderedChildrenIds(e,null).find(t=>Dp.canItemBeFocused(e,t)),$p=(e,t,r)=>{if(t===r)return[t,r];const o=Dp.itemMeta(e,t),n=Dp.itemMeta(e,r);if(!o||!n)return[t,r];if(o.parentId===n.id||n.parentId===o.id)return n.parentId===o.id?[o.id,n.id]:[n.id,o.id];const i=[o.id],a=[n.id];let l=o.parentId,s=n.parentId,d=-1!==a.indexOf(l),c=-1!==i.indexOf(s),u=!0,p=!0;for(;!c&&!d;)u&&(i.push(l),d=-1!==a.indexOf(l),u=null!==l,!d&&u&&(l=Dp.itemParentId(e,l))),p&&!d&&(a.push(s),c=-1!==i.indexOf(s),p=null!==s,!c&&p&&(s=Dp.itemParentId(e,s)));const h=d?l:s,m=Dp.itemOrderedChildrenIds(e,h),f=i[i.indexOf(h)-1],g=a[a.indexOf(h)-1];return m.indexOf(f)<m.indexOf(g)?[t,r]:[r,t]},_p=(e,t)=>t!==e.closest('*[role="treeitem"]');class eh{lastSelectedItem=null;lastSelectedRange={};constructor(e){this.store=e,e.itemPluginManager.register(Gp,null)}setSelectedItems=(e,t,r)=>{const{selectionPropagation:o=Gu,selectedItems:n,onItemSelectionToggle:i,onSelectedItemsChange:a}=this.store.parameters,l=Qp.selectedItemsRaw(this.store.state);let s;const d=Qp.isMultiSelectEnabled(this.store.state);if(s=d&&(o.descendants||o.parents)?function({store:e,selectionPropagation:t,newModel:r,oldModel:o,additionalItemsToPropagate:n}){if(!t.descendants&&!t.parents)return r;let i=!1;const a=rh(r),l=th({store:e,newModel:r,oldModel:o});return n?.forEach(e=>{a[e]?l.added.includes(e)||l.added.push(e):l.removed.includes(e)||l.removed.push(e)}),l.added.forEach(r=>{if(t.descendants){const t=o=>{o!==r&&(i=!0,a[o]=!0),Dp.itemOrderedChildrenIds(e.state,o).forEach(t)};t(r)}if(t.parents){const t=r=>{if(!a[r])return!1;return Dp.itemOrderedChildrenIds(e.state,r).every(t)},o=r=>{const n=Dp.itemParentId(e.state,r);if(null==n)return;Dp.itemOrderedChildrenIds(e.state,n).every(t)&&(i=!0,a[n]=!0,o(n))};o(r)}}),l.removed.forEach(r=>{if(t.parents){let t=Dp.itemParentId(e.state,r);for(;null!=t;)a[t]&&(i=!0,delete a[t]),t=Dp.itemParentId(e.state,t)}if(t.descendants){const t=o=>{o!==r&&(i=!0,delete a[o]),Dp.itemOrderedChildrenIds(e.state,o).forEach(t)};t(r)}}),i?Object.keys(a):r}({store:this.store,selectionPropagation:o,newModel:t,oldModel:l,additionalItemsToPropagate:r}):t,i)if(d){const t=th({store:this.store,newModel:s,oldModel:l});i&&(t.added.forEach(t=>{i(e,t,!0)}),t.removed.forEach(t=>{i(e,t,!1)}))}else s!==l&&(null!=l&&i(e,l,!1),null!=s&&i(e,s,!0));void 0===n&&this.store.set("selectedItems",s),a?.(e,s)};selectRange=(e,[t,r])=>{if(!Qp.isMultiSelectEnabled(this.store.state))return;let o=Qp.selectedItems(this.store.state).slice();Object.keys(this.lastSelectedRange).length>0&&(o=o.filter(e=>!this.lastSelectedRange[e]));const n=rh(o),i=((e,t,r)=>{const o=t=>{if(Xp.isItemExpandable(e,t)&&Xp.isItemExpanded(e,t))return Dp.itemOrderedChildrenIds(e,t)[0];let r=Dp.itemMeta(e,t);for(;null!=r;){const t=Dp.itemOrderedChildrenIds(e,r.parentId),o=Dp.itemIndex(e,r.id);if(o<t.length-1)return t[o+1];r=r.parentId?Dp.itemMeta(e,r.parentId):null}throw new Error("Invalid range")},[n,i]=$p(e,t,r),a=[n];let l=n;for(;l!==i;)l=o(l),Dp.isItemDisabled(e,l)||a.push(l);return a})(this.store.state,t,r).filter(e=>Qp.isItemSelectable(this.store.state,e)),a=i.filter(e=>!n[e]);o=o.concat(a),this.setSelectedItems(e,o),this.lastSelectedRange=rh(i)};buildPublicAPI=()=>({setItemSelection:this.setItemSelection});setItemSelection=({itemId:e,event:t=null,keepExistingSelection:r=!1,shouldBeSelected:o})=>{if(!Qp.enabled(this.store.state))return;let n;const i=Qp.isMultiSelectEnabled(this.store.state);if(r){const t=Qp.selectedItems(this.store.state),r=Qp.isItemSelected(this.store.state,e);n=!r||!1!==o&&null!=o?r||!0!==o&&null!=o?t:[e].concat(t):t.filter(t=>t!==e)}else n=!1===o||null==o&&Qp.isItemSelected(this.store.state,e)?i?[]:null:i?[e]:e;this.setSelectedItems(t,n,[e]),this.lastSelectedItem=e,this.lastSelectedRange={}};selectAllNavigableItems=e=>{if(!Qp.isMultiSelectEnabled(this.store.state))return;const t=(e=>{let t=Zp(e);const r=[];for(;null!=t;)r.push(t),t=Jp(e,t);return r})(this.store.state);this.setSelectedItems(e,t),this.lastSelectedRange=rh(t)};expandSelectionRange=(e,t)=>{if(null!=this.lastSelectedItem){const[r,o]=$p(this.store.state,t,this.lastSelectedItem);this.selectRange(e,[r,o])}};selectRangeFromStartToItem=(e,t)=>{this.selectRange(e,[Zp(this.store.state),t])};selectRangeFromItemToEnd=(e,t)=>{this.selectRange(e,[t,Yp(this.store.state)])};selectItemFromArrowNavigation=(e,t,r)=>{if(!Qp.isMultiSelectEnabled(this.store.state))return;let o=Qp.selectedItems(this.store.state).slice();0===Object.keys(this.lastSelectedRange).length?(o.push(r),this.lastSelectedRange={[t]:!0,[r]:!0}):(this.lastSelectedRange[t]||(this.lastSelectedRange={}),this.lastSelectedRange[r]?(o=o.filter(e=>e!==t),delete this.lastSelectedRange[t]):(o.push(r),this.lastSelectedRange[r]=!0)),this.setSelectedItems(e,o)}}function th({store:e,oldModel:t,newModel:r}){const o=new Map;return r.forEach(e=>{o.set(e,!0)}),{added:r.filter(t=>!Qp.isItemSelected(e.state,t)),removed:t.filter(e=>!o.has(e))}}function rh(e){const t={};return e.forEach(e=>{t[e]=!0}),t}const oh=e.createContext(null);function nh(t){const{children:r,itemId:o=null,idAttribute:n}=t,{store:i,rootRef:a}=Xu(),l=e.useRef(new Map);e.useEffect(()=>{if(!a.current)return;const e=Dp.itemOrderedChildrenIds(i.state,o??null)??[],t=(n??a.current.id).replace(/["\\]/g,"\\$&");if(null!=o){const e=a.current.querySelector(`*[id="${t}"][role="treeitem"]`);if(e&&"false"===e.getAttribute("aria-expanded"))return}const r=a.current.querySelectorAll(`${null==o?"":`*[id="${t}"] `}[role="treeitem"]:not(*[id="${t}"] [role="treeitem"] [role="treeitem"])`),s=Array.from(r).map(e=>l.current.get(e.id)),d=s.length!==e.length||s.some((t,r)=>t!==e[r]);d&&i.jsxItems.setJSXItemsOrderedChildrenIds(o??null,s)});const s=e.useMemo(()=>({registerChild:(e,t)=>l.current.set(e,t),unregisterChild:e=>l.current.delete(e),parentId:o}),[o]);return de(oh.Provider,{value:s,children:r})}"production"!==process.env.NODE_ENV&&(oh.displayName="TreeViewChildrenItemContext"),"production"!==process.env.NODE_ENV&&(nh.propTypes={children:Hi.node,id:Hi.string});const ih=e.createContext(()=>-1);"production"!==process.env.NODE_ENV&&(ih.displayName="TreeViewItemDepthContext");const ah="undefined"!=typeof document?e.useLayoutEffect:()=>{},lh=[];const sh=e.createContext();"production"!==process.env.NODE_ENV&&(Hi.node,Hi.bool);function dh(t,r){const o=e.useContext(sh)??!1,n=wu(()=>new t(ku({},r,{isRtl:o}))).current;var i;return ah(()=>n.updateStateFromParameters(ku({},r,{isRtl:o})),[n,o,r]),i=n.disposeEffect,e.useEffect(i,lh),n}class ch{maxListeners=20;warnOnce=!1;events={};on(e,t,r={}){let o=this.events[e];if(o||(o={highPriority:new Map,regular:new Map},this.events[e]=o),r.isFirst?o.highPriority.set(t,!0):o.regular.set(t,!0),"production"!==process.env.NODE_ENV){const t=o.highPriority.size+o.regular.size;t>this.maxListeners&&!this.warnOnce&&(this.warnOnce=!0,console.warn([`Possible EventEmitter memory leak detected. ${t} ${e} listeners added.`].join("\n")))}}removeListener(e,t){this.events[e]&&(this.events[e].regular.delete(t),this.events[e].highPriority.delete(t))}removeAllListeners(){this.events={}}emit(e,...t){const r=this.events[e];if(!r)return;const o=Array.from(r.highPriority.keys()),n=Array.from(r.regular.keys());for(let e=o.length-1;e>=0;e-=1){const n=o[e];r.highPriority.has(n)&&n.apply(this,t)}for(let e=0;e<n.length;e+=1){const o=n[e];r.regular.has(o)&&o.apply(this,t)}}once(e,t){const r=this;this.on(e,function o(...n){r.removeListener(e,o),t.apply(r,n)})}}const uh=({isItemEditable:e,expansionTrigger:t})=>t||(e?"iconContainer":"content");function ph(e){return{disabledItemsFocusable:e.disabledItemsFocusable??!1,domStructure:"nested",itemChildrenIndentation:e.itemChildrenIndentation??"12px",providedTreeId:e.id,expansionTrigger:uh({isItemEditable:e.isItemEditable,expansionTrigger:e.expansionTrigger}),disableSelection:e.disableSelection??!1,multiSelect:e.multiSelect??!1,checkboxSelection:e.checkboxSelection??!1,selectionPropagation:e.selectionPropagation??Gu}}function hh(e,t,r){return void 0!==e?e:void 0!==t?t:r}let mh=0;class fh{timeoutIds=(()=>new Map)();intervalIds=(()=>new Map)();startTimeout=(e,t,r)=>{this.clearTimeout(e);const o=setTimeout(()=>{this.timeoutIds.delete(e),r()},t);this.timeoutIds.set(e,o)};startInterval=(e,t,r)=>{this.clearTimeout(e);const o=setInterval(r,t);this.intervalIds.set(e,o)};clearTimeout=e=>{const t=this.timeoutIds.get(e);null!=t&&(clearTimeout(t),this.timeoutIds.delete(e))};clearInterval=e=>{const t=this.intervalIds.get(e);null!=t&&(clearInterval(t),this.intervalIds.delete(e))};clearAll=()=>{this.timeoutIds.forEach(clearTimeout),this.timeoutIds.clear(),this.intervalIds.forEach(clearInterval),this.intervalIds.clear()}}class gh{constructor(e){this.store=e}setExpandedItems=(e,t)=>{void 0===this.store.parameters.expandedItems&&this.store.set("expandedItems",t),this.store.parameters.onExpandedItemsChange?.(e,t)};isItemExpanded=e=>Xp.isItemExpanded(this.store.state,e);buildPublicAPI=()=>({isItemExpanded:this.isItemExpanded,setItemExpansion:this.setItemExpansion});setItemExpansion=({itemId:e,event:t=null,shouldBeExpanded:r})=>{const o=Xp.isItemExpanded(this.store.state,e),n=r??!o;if(o===n)return;const i={isExpansionPrevented:!1,shouldBeExpanded:n,itemId:e};this.store.publishEvent("beforeItemToggleExpansion",i,t),i.isExpansionPrevented||this.applyItemExpansion({itemId:e,event:t,shouldBeExpanded:n})};applyItemExpansion=({itemId:e,event:t,shouldBeExpanded:r})=>{const o=Xp.expandedItemsRaw(this.store.state);let n;n=r?[e].concat(o):o.filter(t=>t!==e),this.store.parameters.onItemExpansionToggle?.(t,e,r),this.setExpandedItems(t,n)};expandAllSiblings=(e,t)=>{const r=Dp.itemMeta(this.store.state,t);if(null==r)return;const o=Dp.itemOrderedChildrenIds(this.store.state,r.parentId).filter(e=>Xp.isItemExpandable(this.store.state,e)&&!Xp.isItemExpanded(this.store.state,e)),n=Xp.expandedItemsRaw(this.store.state).concat(o);o.length>0&&(this.store.parameters.onItemExpansionToggle&&o.forEach(t=>{this.store.parameters.onItemExpansionToggle(e,t,!0)}),this.setExpandedItems(e,n))};addExpandableItems=e=>{const t=ku({},this.store.state.itemMetaLookup);for(const r of e)t[r]=ku({},t[r],{expandable:!0});this.store.set("itemMetaLookup",t)}}const xh={isItemEditable:hp(e=>e.isItemEditable,Dp.itemModel,(e,t,r)=>!(!t||null==e)&&("boolean"==typeof e?e:e(t))),isItemBeingEdited:hp((e,t)=>null!=t&&e.editedItemId===t),isAnyItemBeingEdited:hp(e=>!!e.editedItemId)};class bh{typeaheadQuery="";constructor(e){this.store=e,this.labelMap=vh(Dp.itemMetaLookup(this.store.state)),this.store.registerStoreEffect(Dp.itemMetaLookup,(e,t)=>{this.store.shouldIgnoreItemsStateUpdate()||(this.labelMap=vh(t))})}canToggleItemSelection=e=>Qp.canItemBeSelected(this.store.state,e);canToggleItemExpansion=e=>!Dp.isItemDisabled(this.store.state,e)&&Xp.isItemExpandable(this.store.state,e);getFirstItemMatchingTypeaheadQuery=(e,t)=>{const r=e=>{const t=Jp(this.store.state,e);return null===t?Zp(this.store.state):t},o=t=>{let o=null;const n={};let i=t.length>1?e:r(e);for(;null==o&&!n[i];){const e=this.labelMap[i];e?.startsWith(t)?o=i:(n[i]=!0,i=r(i))}return o},n=t.toLowerCase(),i=`${this.typeaheadQuery}${n}`,a=o(i);if(null!=a)return this.typeaheadQuery=i,a;const l=o(n);return null!=l?(this.typeaheadQuery=n,l):(this.typeaheadQuery="",null)};updateLabelMap=e=>{this.labelMap=e(this.labelMap)};handleItemKeyDown=async(e,t)=>{if(e.defaultMuiPrevented)return;if(e.altKey||_p(e.target,e.currentTarget))return;const r=e.ctrlKey||e.metaKey,o=e.key,n=Qp.isMultiSelectEnabled(this.store.state);switch(!0){case" "===o&&this.canToggleItemSelection(t):e.preventDefault(),n&&e.shiftKey?this.store.selection.expandSelectionRange(e,t):this.store.selection.setItemSelection({event:e,itemId:t,keepExistingSelection:n,shouldBeSelected:void 0});break;case"Enter"===o:this.store.labelEditing?.setEditedItem&&xh.isItemEditable(this.store.state,t)&&!xh.isItemBeingEdited(this.store.state,t)?this.store.labelEditing.setEditedItem(t):this.canToggleItemExpansion(t)?(this.store.expansion.setItemExpansion({event:e,itemId:t}),e.preventDefault()):this.canToggleItemSelection(t)&&(n?(e.preventDefault(),this.store.selection.setItemSelection({event:e,itemId:t,keepExistingSelection:!0})):Qp.isItemSelected(this.store.state,t)||(this.store.selection.setItemSelection({event:e,itemId:t}),e.preventDefault()));break;case"ArrowDown"===o:{const r=Jp(this.store.state,t);r&&(e.preventDefault(),this.store.focus.focusItem(e,r),n&&e.shiftKey&&this.canToggleItemSelection(r)&&this.store.selection.selectItemFromArrowNavigation(e,t,r));break}case"ArrowUp"===o:{const r=qp(this.store.state,t);r&&(e.preventDefault(),this.store.focus.focusItem(e,r),n&&e.shiftKey&&this.canToggleItemSelection(r)&&this.store.selection.selectItemFromArrowNavigation(e,t,r));break}case"ArrowRight"===o&&!this.store.parameters.isRtl||"ArrowLeft"===o&&this.store.parameters.isRtl:if(r)return;if(Xp.isItemExpanded(this.store.state,t)){const r=Jp(this.store.state,t);r&&(this.store.focus.focusItem(e,r),e.preventDefault())}else this.canToggleItemExpansion(t)&&(this.store.expansion.setItemExpansion({event:e,itemId:t}),e.preventDefault());break;case"ArrowLeft"===o&&!this.store.parameters.isRtl||"ArrowRight"===o&&this.store.parameters.isRtl:if(r)return;if(this.canToggleItemExpansion(t)&&Xp.isItemExpanded(this.store.state,t))this.store.expansion.setItemExpansion({event:e,itemId:t}),e.preventDefault();else{const r=Dp.itemParentId(this.store.state,t);r&&(this.store.focus.focusItem(e,r),e.preventDefault())}break;case"Home"===o:this.canToggleItemSelection(t)&&n&&r&&e.shiftKey?this.store.selection.selectRangeFromStartToItem(e,t):this.store.focus.focusItem(e,Zp(this.store.state)),e.preventDefault();break;case"End"===o:this.canToggleItemSelection(t)&&n&&r&&e.shiftKey?this.store.selection.selectRangeFromItemToEnd(e,t):this.store.focus.focusItem(e,Yp(this.store.state)),e.preventDefault();break;case"*"===o:this.store.expansion.expandAllSiblings(e,t),e.preventDefault();break;case"A"===String.fromCharCode(e.keyCode)&&r&&n&&Qp.enabled(this.store.state):this.store.selection.selectAllNavigableItems(e),e.preventDefault();break;case!(r||e.shiftKey||(i=o,!i||1!==i.length||!i.match(/\S/))):{this.store.timeoutManager.clearTimeout("typeahead");const r=this.getFirstItemMatchingTypeaheadQuery(t,o);null!=r?(this.store.focus.focusItem(e,r),e.preventDefault()):this.typeaheadQuery="",this.store.timeoutManager.startTimeout("typeahead",500,()=>{this.typeaheadQuery=""});break}}var i}}function vh(e){const t={};return Object.values(e).forEach(e=>{t[e.id]=e.label.toLowerCase()}),t}const yh=mp(Qp.selectedItems,Xp.expandedItemsMap,Dp.itemMetaLookup,Dp.disabledItemFocusable,e=>Dp.itemOrderedChildrenIds(e,null),(e,t,r,o,n)=>{const i=e.find(e=>{if(!o&&Lp(r,e))return!1;const n=r[e];return n&&(null==n.parentId||t.has(n.parentId))});if(null!=i)return i;const a=n.find(e=>o||!Lp(r,e));return null!=a?a:null}),Sh={defaultFocusableItemId:yh,isItemTheDefaultFocusableItem:hp(yh,(e,t)=>e===t),focusedItemId:hp(e=>e.focusedItemId),isItemFocused:hp((e,t)=>e.focusedItemId===t)};class kh{constructor(e){this.store=e;let t=e.state;this.store.subscribe(e=>{if(e.itemMetaLookup===t.itemMetaLookup)return void(t=e);const r=Sh.focusedItemId(e);if(null==r||Dp.itemMeta(e,r))return void(t=e);const o=t=>null!=t&&Dp.itemMeta(e,t)?t:null,n=o(Jp(t,r))??o(qp(t,r))??Zp(e);null==n?this.setFocusedItemId(null):this.applyItemFocus(null,n),t=e})}setFocusedItemId=e=>{Sh.focusedItemId(this.store.state)!==e&&this.store.set("focusedItemId",e)};applyItemFocus=(e,t)=>{this.store.items.getItemDOMElement(t)?.focus(),this.setFocusedItemId(t),this.store.parameters.onItemFocus?.(e,t)};buildPublicAPI=()=>({focusItem:this.focusItem});focusItem=(e,t)=>{const r=Dp.itemMeta(this.store.state,t);r&&(null==r.parentId||Xp.isItemExpanded(this.store.state,r.parentId))&&this.applyItemFocus(e,t)};removeFocusedItem=()=>{const e=Sh.focusedItemId(this.store.state);if(null==e)return;if(Dp.itemMeta(this.store.state,e)){const t=this.store.items.getItemDOMElement(e);t&&t.blur()}this.setFocusedItemId(null)};handleRootFocus=e=>{if(e.defaultMuiPrevented)return;const t=Sh.defaultFocusableItemId(this.store.state);e.target===e.currentTarget&&null!=t&&this.applyItemFocus(e,t)};handleRootBlur=e=>{e.defaultMuiPrevented||this.setFocusedItemId(null)}}class Bh{itemPlugins=[];itemWrappers=[];register=(e,t)=>{this.itemPlugins.push(e),t&&this.itemWrappers.push(t)};listPlugins=()=>this.itemPlugins;listWrappers=()=>this.itemWrappers}class wh extends zp{initialParameters=null;eventManager=(()=>new ch)();timeoutManager=(()=>new fh)();itemPluginManager=(()=>new Bh)();constructor(e,t,r){const o=function(e){return ku({treeId:void 0,focusedItemId:null},ph(e),Fp.buildItemsStateIfNeeded(e),{expandedItems:hh(e.expandedItems,e.defaultExpandedItems,[]),selectedItems:hh(e.selectedItems,e.defaultSelectedItems,e.multiSelect?ju:null)})}(e);super(r.getInitialState(o,e)),this.parameters=e,this.instanceName=t,this.mapper=r,this.items=new Fp(this),this.focus=new kh(this),this.expansion=new gh(this),this.selection=new eh(this),this.keyboardNavigation=new bh(this),"production"!==process.env.NODE_ENV&&(this.initialParameters=e)}buildPublicAPI(){return ku({},this.items.buildPublicAPI(),this.focus.buildPublicAPI(),this.expansion.buildPublicAPI(),this.selection.buildPublicAPI())}updateStateFromParameters(e){const t=(t,r,o)=>{if(void 0!==e[r]&&(t[r]=e[r]),"production"!==process.env.NODE_ENV){const t=e[o],n=void 0!==e[r],i=this.initialParameters?.[o],a=void 0!==this.initialParameters?.[r];a!==n?Mu([`MUI X Tree View: A component is changing the ${a?"":"un"}controlled ${r} state of ${this.instanceName} to be ${a?"un":""}controlled.`,"Elements should not switch from uncontrolled to controlled (or vice versa).",`Decide between using a controlled or uncontrolled ${r} element for the lifetime of the component.`,"The nature of the state is determined during the first render. It's considered controlled if the value is not `undefined`.","More info: https://fb.me/react-controlled-components"],"error"):JSON.stringify(i)!==JSON.stringify(t)&&Mu([`MUI X Tree View: A component is changing the default ${r} state of an uncontrolled ${this.instanceName} after being initialized. `,`To suppress this warning opt to use a controlled ${this.instanceName}.`],"error")}},r=ph(e);t(r,"expandedItems","defaultExpandedItems"),t(r,"selectedItems","defaultSelectedItems"),this.state.providedTreeId===e.id&&void 0!==this.state.treeId||(r.treeId=(mh+=1,`mui-tree-view-${mh}`)),!this.mapper.shouldIgnoreItemsStateUpdate(e)&&Fp.shouldRebuildItemsState(e,this.parameters)&&Object.assign(r,Fp.buildItemsStateIfNeeded(e));const o=this.mapper.updateStateFromParameters(r,e,t);this.update(o),this.parameters=e}disposeEffect=()=>this.timeoutManager.clearAll;shouldIgnoreItemsStateUpdate=()=>this.mapper.shouldIgnoreItemsStateUpdate(this.parameters);registerStoreEffect=(e,t)=>{let r=e(this.state);this.subscribe(o=>{const n=e(o);n!==r&&(t(r,n),r=n)})};publishEvent=(e,t,r)=>{(function(e){return void 0!==e?.isPropagationStopped})(r)&&r.isPropagationStopped()||this.eventManager.emit(e,t,r)};subscribeEvent=(e,t)=>{this.eventManager.on(e,t)}}const Ch={isEmpty:hp(e=>null==e.lazyLoadedItems||0===Object.keys(e.lazyLoadedItems.loading).length&&0===Object.keys(e.lazyLoadedItems.errors).length),isItemLoading:hp((e,t)=>e.lazyLoadedItems?.loading[t??Pp]??!1),itemHasError:hp((e,t)=>!!e.lazyLoadedItems?.errors[t??Pp]),itemError:hp((e,t)=>e.lazyLoadedItems?.errors[t??Pp])},Th=e=>Array.isArray(e)?e.length>0&&e.some(Th):Boolean(e),Ih=({props:t,rootRef:r,contentRef:o})=>{const{store:n}=Xu(),{children:i,disabled:a=!1,disableSelection:l=!1,label:s,itemId:d,id:c}=t,u=e.useContext(oh);if(null==u)throw new Error(["MUI X: Could not find the Tree View Children Item context.","It looks like you rendered your component outside of a SimpleTreeView parent component.","This can also happen if you are bundling multiple versions of the Tree View."].join("\n"));const{registerChild:p,unregisterChild:h,parentId:m}=u,f=Th(i),g=e.useRef(null),x=Cu(g,o),b=Ap(n,Ep.treeItemIdAttribute,d,c),v=e.useRef(!0),y=wu(Symbol);return ah(()=>(p(b,d),()=>{h(b),h(b)}),[n,p,h,b,d]),ah(()=>(v.current=!0,()=>{v.current=!1}),[]),ah(()=>{const e=n.jsxItems.upsertJSXItem({id:d,idAttribute:c,parentId:m,expandable:f,disabled:a,selectable:!l},y.current);return()=>{v.current||e()}},[n,m,d,f,a,l,c,y]),e.useEffect(()=>{if(s)return n.jsxItems.mapLabelFromJSX(d,(g.current?.textContent??"").toLowerCase())},[n,d,s]),{contentRef:x,rootRef:r}},Ah=({children:t,itemId:r,idAttribute:o})=>{const n=e.useContext(ih);return de(nh,{itemId:r,idAttribute:o,children:de(ih.Provider,{value:n+1,children:t})})};"production"!==process.env.NODE_ENV&&(Ah.displayName="jsxItemsitemWrapper");class zh{itemOwners=(()=>new Map)();constructor(e){this.store=e,e.itemPluginManager.register(Ih,Ah)}upsertJSXItem=(e,t)=>{const r=this.itemOwners.get(e.id);if(null!=r&&r!==t)throw new Error(["MUI X: The Tree View component requires all items to have a unique `id` property.","Alternatively, you can use the `getItemId` prop to specify a custom id for each item.",`Two items were provided with the same id in the \`items\` prop: "${e.id}"`].join("\n"));this.itemOwners.set(e.id,t);const o=Dp.itemMeta(this.store.state,e.id);if(null!=o){let t=!1;for(const r of Object.keys(e))if(o[r]!==e[r]){t=!0;break}t&&this.store.update({itemMetaLookup:ku({},this.store.state.itemMetaLookup,{[e.id]:ku({},o,e)})})}else this.store.update({itemMetaLookup:ku({},this.store.state.itemMetaLookup,{[e.id]:e}),itemModelLookup:ku({},this.store.state.itemModelLookup,{[e.id]:{id:e.id,label:e.label??""}})});return()=>{this.itemOwners.delete(e.id);const t=ku({},this.store.state.itemMetaLookup),r=ku({},this.store.state.itemModelLookup);delete t[e.id],delete r[e.id],this.store.update({itemMetaLookup:t,itemModelLookup:r})}};mapLabelFromJSX=(e,t)=>(this.store.keyboardNavigation.updateLabelMap(r=>(r[e]=t,r)),()=>{this.store.keyboardNavigation.updateLabelMap(t=>{const r=ku({},t);return delete r[e],r})});setJSXItemsOrderedChildrenIds=(e,t)=>{const r=e??Pp;this.store.update({itemOrderedChildrenIdsLookup:ku({},this.store.state.itemOrderedChildrenIdsLookup,{[r]:t}),itemChildrenIndexesLookup:ku({},this.store.state.itemChildrenIndexesLookup,{[r]:Op(t)})})}}const Rh={getInitialState:e=>e,updateStateFromParameters:e=>e,shouldIgnoreItemsStateUpdate:()=>!0};class Eh extends wh{jsxItems=(()=>new zh(this))();constructor(e){super(ku({},e,{items:ju}),"SimpleTreeView",Rh)}updateStateFromParameters(e){super.updateStateFromParameters(ku({},e,{items:ju}))}}const Ph=Wu(),Oh=or("ul",{name:"MuiSimpleTreeView",slot:"Root"})({padding:0,margin:0,listStyle:"none",outline:0,position:"relative"}),Lh=e.forwardRef(function(t,r){const o=Ph({props:t,name:"MuiSimpleTreeView"});"production"!==process.env.NODE_ENV&&null!=o.items&&Mu(["MUI X: The Simple Tree View component does not support the `items` prop.","If you want to add items, you need to pass them as JSX children.","Check the documentation for more details: https://mui.com/x/react-tree-view/simple-tree-view/items/."]);const{slots:n,slotProps:i,apiRef:a,parameters:l,forwardedProps:s}=function(t){const{apiRef:r,slots:o,slotProps:n,disabledItemsFocusable:i,onItemClick:a,itemChildrenIndentation:l,id:s,expandedItems:d,defaultExpandedItems:c,onExpandedItemsChange:u,onItemExpansionToggle:p,expansionTrigger:h,disableSelection:m,selectedItems:f,defaultSelectedItems:g,multiSelect:x,checkboxSelection:b,selectionPropagation:v,onSelectedItemsChange:y,onItemSelectionToggle:S,onItemFocus:k}=t,B=Yu(t,Zu);return{apiRef:r,slots:o,slotProps:n,parameters:e.useMemo(()=>({disabledItemsFocusable:i,onItemClick:a,itemChildrenIndentation:l,id:s,expandedItems:d,defaultExpandedItems:c,onExpandedItemsChange:u,onItemExpansionToggle:p,expansionTrigger:h,disableSelection:m,selectedItems:f,defaultSelectedItems:g,multiSelect:x,checkboxSelection:b,selectionPropagation:v,onSelectedItemsChange:y,onItemSelectionToggle:S,onItemFocus:k}),[i,a,l,s,d,c,u,p,h,m,f,g,x,b,v,y,S,k]),forwardedProps:B}}(o),d=dh(Eh,l),c=e.useRef(null),u=function(e,t,r){const o=Ap(e,Ep.treeId),n=Ap(e,Dp.itemChildrenIndentation),i=Ap(e,Qp.isMultiSelectEnabled);return a=>ku({ref:r,role:"tree",id:o,"aria-multiselectable":i},t,a,{style:ku({},t.style,{"--TreeView-itemChildrenIndentation":"number"==typeof n?`${n}px`:n}),onFocus:t=>{a.onFocus?.(t),e.focus.handleRootFocus(t)},onBlur:t=>{a.onBlur?.(t),e.focus.handleRootBlur(t)}})}(d,s,Cu(r,c)),p=(t=>{const{classes:r}=t;return e.useMemo(()=>Iu({root:["root"],item:["item"],itemContent:["itemContent"],itemGroupTransition:["itemGroupTransition"],itemIconContainer:["itemIconContainer"],itemLabel:["itemLabel"],itemCheckbox:["itemCheckbox"]},Qu,r),[r])})(o),h=n?.root??Oh,m=Ou({elementType:h,externalSlotProps:i?.root,className:p.root,getSlotProps:u,ownerState:o});return de(Ju,{store:d,classes:p,slots:n,slotProps:i,apiRef:a,rootRef:c,children:de(nh,{itemId:null,idAttribute:null,children:de(ih.Provider,{value:0,children:de(h,ku({},m))})})})});"production"!==process.env.NODE_ENV&&(Lh.displayName="SimpleTreeView"),"production"!==process.env.NODE_ENV&&(Lh.propTypes={apiRef:Hi.shape({current:Hi.shape({focusItem:Hi.func,getItem:Hi.func,getItemDOMElement:Hi.func,getItemOrderedChildrenIds:Hi.func,getItemTree:Hi.func,getParentId:Hi.func,isItemExpanded:Hi.func,setIsItemDisabled:Hi.func,setItemExpansion:Hi.func,setItemSelection:Hi.func})}),checkboxSelection:Hi.bool,children:Hi.node,classes:Hi.object,className:Hi.string,defaultExpandedItems:Hi.arrayOf(Hi.string),defaultSelectedItems:Hi.any,disabledItemsFocusable:Hi.bool,disableSelection:Hi.bool,expandedItems:Hi.arrayOf(Hi.string),expansionTrigger:Hi.oneOf(["content","iconContainer"]),id:Hi.string,itemChildrenIndentation:Hi.oneOfType([Hi.number,Hi.string]),multiSelect:Hi.bool,onExpandedItemsChange:Hi.func,onItemClick:Hi.func,onItemExpansionToggle:Hi.func,onItemFocus:Hi.func,onItemSelectionToggle:Hi.func,onSelectedItemsChange:Hi.func,selectedItems:Hi.any,selectionPropagation:Hi.shape({descendants:Hi.bool,parents:Hi.bool}),slotProps:Hi.object,slots:Hi.object,sx:Hi.oneOfType([Hi.arrayOf(Hi.oneOfType([Hi.func,Hi.object,Hi.bool])),Hi.func,Hi.object])});var Mh,Wh={exports:{}},Dh={};var Fh,Nh={};
32
+ */"production"===process.env.NODE_ENV?Ap.exports=function(){if(Tp)return zp;Tp=1;var e=t,r=Ip,n="function"==typeof Object.is?Object.is:function(e,t){return e===t&&(0!==e||1/e==1/t)||e!=e&&t!=t},o=r.useSyncExternalStore,i=e.useRef,a=e.useEffect,l=e.useMemo,s=e.useDebugValue;return zp.useSyncExternalStoreWithSelector=function(e,t,r,d,c){var u=i(null);if(null===u.current){var p={hasValue:!1,value:null};u.current=p}else p=u.current;u=l(function(){function e(e){if(!a){if(a=!0,o=e,e=d(e),void 0!==c&&p.hasValue){var t=p.value;if(c(t,e))return i=t}return i=e}if(t=i,n(o,e))return t;var r=d(e);return void 0!==c&&c(t,r)?(o=e,t):(o=e,i=r)}var o,i,a=!1,l=void 0===r?null:r;return[function(){return e(t())},null===l?void 0:function(){return e(l())}]},[t,r,d,c]);var h=o(e,u[0],u[1]);return a(function(){p.hasValue=!0,p.value=h},[h]),s(h),h},zp}():Ap.exports=(Rp||(Rp=1,"production"!==process.env.NODE_ENV&&function(){"undefined"!=typeof __REACT_DEVTOOLS_GLOBAL_HOOK__&&"function"==typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart&&__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error());var e=t,r=Ip,n="function"==typeof Object.is?Object.is:function(e,t){return e===t&&(0!==e||1/e==1/t)||e!=e&&t!=t},o=r.useSyncExternalStore,i=e.useRef,a=e.useEffect,l=e.useMemo,s=e.useDebugValue;Ep.useSyncExternalStoreWithSelector=function(e,t,r,d,c){var u=i(null);if(null===u.current){var p={hasValue:!1,value:null};u.current=p}else p=u.current;u=l(function(){function e(e){if(!a){if(a=!0,o=e,e=d(e),void 0!==c&&p.hasValue){var t=p.value;if(c(t,e))return i=t}return i=e}if(t=i,n(o,e))return t;var r=d(e);return void 0!==c&&c(t,r)?(o=e,t):(o=e,i=r)}var o,i,a=!1,l=void 0===r?null:r;return[function(){return e(t())},null===l?void 0:function(){return e(l())}]},[t,r,d,c]);var h=o(e,u[0],u[1]);return a(function(){p.hasValue=!0,p.value=h},[h]),s(h),h},"undefined"!=typeof __REACT_DEVTOOLS_GLOBAL_HOOK__&&"function"==typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop&&__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error())}()),Ep);var Pp=Ap.exports;const Lp=parseInt(e.version,10)>=19?function(t,r,n,o,i){const a=e.useCallback(()=>r(t.getSnapshot(),n,o,i),[t,r,n,o,i]);return Ip.useSyncExternalStore(t.subscribe,a,a)}:function(e,t,r,n,o){return Pp.useSyncExternalStoreWithSelector(e.subscribe,e.getSnapshot,e.getSnapshot,e=>t(e,r,n,o))};function Mp(e,t,r,n,o){return Lp(e,t,r,n,o)}class Wp{static create(e){return new Wp(e)}constructor(e){this.state=e,this.listeners=new Set,this.updateTick=0}subscribe=e=>(this.listeners.add(e),()=>{this.listeners.delete(e)});getSnapshot=()=>this.state;setState(e){this.state=e,this.updateTick+=1;const t=this.updateTick,r=this.listeners.values();let n;for(;n=r.next(),!n.done;){if(t!==this.updateTick)return;(0,n.value)(e)}}update(e){for(const t in e)if(!Object.is(this.state[t],e[t]))return void this.setState(Au({},this.state,e))}set(e,t){Object.is(this.state[e],t)||this.setState(Au({},this.state,{[e]:t}))}use=(()=>(e,t,r,n)=>Mp(this,e,t,r,n))()}const Op=vp(e=>e.providedTreeId??e.treeId),Dp={treeId:Op,treeItemIdAttribute:vp(Op,(e,t,r)=>null!=r?r:`${e??""}-${t}`)},Fp="__TREE_VIEW_ROOT_PARENT_ID__",Np=e=>{const t={};return e.forEach((e,r)=>{t[e]=r}),t},Hp=(e,t)=>{if(null==t)return!1;let r=e[t];if(!r)return!1;if(r.disabled)return!0;for(;null!=r.parentId;){if(r=e[r.parentId],!r)return!1;if(r.disabled)return!0}return!1};function Vp(e){const{storeParameters:t,items:r,parentId:n,depth:o,isItemExpandable:i,otherItemsMetaLookup:a}=e,l={},s={},d=[],c=[],u=e=>{const r=t.getItemId?t.getItemId(e):e.id;!function({id:e,parentId:t,item:r,itemMetaLookup:n,siblingsMetaLookup:o}){if(null==e)throw new Error(["MUI X: The Tree View component requires all items to have a unique `id` property.","Alternatively, you can use the `getItemId` prop to specify a custom id for each item.","An item was provided without id in the `items` prop:",JSON.stringify(r)].join("\n"));if(null!=o[e]||null!=n[e]&&n[e].parentId!==t)throw new Error(["MUI X: The Tree View component requires all items to have a unique `id` property.","Alternatively, you can use the `getItemId` prop to specify a custom id for each item.",`Two items were provided with the same id in the \`items\` prop: "${e}"`].join("\n"))}({id:r,parentId:n,item:e,itemMetaLookup:a,siblingsMetaLookup:l});const u=t.getItemLabel?t.getItemLabel(e):e.label;if(null==u)throw new Error(["MUI X: The Tree View component requires all items to have a `label` property.","Alternatively, you can use the `getItemLabel` prop to specify a custom label for each item.","An item was provided without label in the `items` prop:",JSON.stringify(e)].join("\n"));const p=(t.getItemChildren?t.getItemChildren(e):e.children)||[];c.push({id:r,children:p}),s[r]=e,l[r]={id:r,label:u,parentId:n,idAttribute:void 0,expandable:i(e,p),disabled:!!t.isItemDisabled&&t.isItemDisabled(e),selectable:!t.isItemSelectionDisabled||!t.isItemSelectionDisabled(e),depth:o},d.push(r)};for(const e of r)u(e);return{metaLookup:l,modelLookup:s,orderedChildrenIds:d,childrenIndexes:Np(d),itemsChildren:c}}const Qp=[],jp={domStructure:vp(e=>e.domStructure),disabledItemFocusable:vp(e=>e.disabledItemsFocusable),itemMetaLookup:vp(e=>e.itemMetaLookup),itemOrderedChildrenIdsLookup:vp(e=>e.itemOrderedChildrenIdsLookup),itemMeta:vp((e,t)=>e.itemMetaLookup[t??Fp]??null),itemOrderedChildrenIds:vp((e,t)=>e.itemOrderedChildrenIdsLookup[t??Fp]??Qp),itemModel:vp((e,t)=>e.itemModelLookup[t]),isItemDisabled:vp((e,t)=>Hp(e.itemMetaLookup,t)),itemIndex:vp((e,t)=>{const r=e.itemMetaLookup[t];if(null==r)return-1;return e.itemChildrenIndexesLookup[r.parentId??Fp][r.id]}),itemParentId:vp((e,t)=>e.itemMetaLookup[t]?.parentId??null),itemDepth:vp((e,t)=>e.itemMetaLookup[t]?.depth??0),canItemBeFocused:vp((e,t)=>e.disabledItemsFocusable||null!=e.itemModelLookup[t]&&!Hp(e.itemMetaLookup,t)),itemChildrenIndentation:vp(e=>e.itemChildrenIndentation)};class Gp{constructor(e){this.store=e}static shouldRebuildItemsState=(e,t)=>["items","isItemDisabled","isItemSelectionDisabled","getItemId","getItemLabel","getItemChildren"].some(r=>{const n=r;return e[n]!==t[n]});static buildItemsStateIfNeeded=e=>{const t={},r={},n={},o={};return function i(a,l,s){const d=l??Fp,{metaLookup:c,modelLookup:u,orderedChildrenIds:p,childrenIndexes:h,itemsChildren:m}=Vp({storeParameters:e,items:a,parentId:l,depth:s,isItemExpandable:(e,t)=>!!t&&t.length>0,otherItemsMetaLookup:t});Object.assign(t,c),Object.assign(r,u),n[d]=p,o[d]=h;for(const e of m)i(e.children||[],e.id,s+1)}(e.items,null,0),{itemMetaLookup:t,itemModelLookup:r,itemOrderedChildrenIdsLookup:n,itemChildrenIndexesLookup:o}};getItem=e=>jp.itemModel(this.store.state,e);getItemTree=()=>{const e=t=>{const r=Au({},jp.itemModel(this.store.state,t)),n=jp.itemOrderedChildrenIds(this.store.state,t);return n.length>0?r.children=n.map(e):delete r.children,r};return jp.itemOrderedChildrenIds(this.store.state,null).map(e)};getItemOrderedChildrenIds=e=>jp.itemOrderedChildrenIds(this.store.state,e);getParentId=e=>{const t=jp.itemMeta(this.store.state,e);return t?.parentId||null};setIsItemDisabled=({itemId:e,shouldBeDisabled:t})=>{if(!this.store.state.itemMetaLookup[e])return;const r=Au({},this.store.state.itemMetaLookup);r[e]=Au({},r[e],{disabled:t??!r[e].disabled}),this.store.set("itemMetaLookup",r)};buildPublicAPI=()=>({getItem:this.getItem,getItemDOMElement:this.getItemDOMElement,getItemOrderedChildrenIds:this.getItemOrderedChildrenIds,getItemTree:this.getItemTree,getParentId:this.getParentId,setIsItemDisabled:this.setIsItemDisabled});getItemDOMElement=e=>{const t=jp.itemMeta(this.store.state,e);if(null==t)return null;const r=Dp.treeItemIdAttribute(this.store.state,e,t.idAttribute);return document.getElementById(r)};setItemChildren=({items:e,parentId:t,getChildrenCount:r})=>{const n=t??Fp,o=null==t?-1:jp.itemDepth(this.store.state,t),{metaLookup:i,modelLookup:a,orderedChildrenIds:l,childrenIndexes:s}=Vp({storeParameters:this.store.parameters,items:e,parentId:t,depth:o+1,isItemExpandable:r?e=>0!==r(e):()=>!1,otherItemsMetaLookup:jp.itemMetaLookup(this.store.state)});this.store.update({itemModelLookup:Au({},this.store.state.itemModelLookup,a),itemMetaLookup:Au({},this.store.state.itemMetaLookup,i),itemOrderedChildrenIdsLookup:Au({},this.store.state.itemOrderedChildrenIdsLookup,{[n]:l}),itemChildrenIndexesLookup:Au({},this.store.state.itemChildrenIndexesLookup,{[n]:s})})};removeChildren=e=>{const t=this.store.state.itemMetaLookup,r=Object.keys(t).reduce((r,n)=>{const o=t[n];return o.parentId===e?r:Au({},r,{[o.id]:o})},{}),n=Au({},this.store.state.itemOrderedChildrenIdsLookup),o=Au({},this.store.state.itemChildrenIndexesLookup),i=e??Fp;delete o[i],delete n[i],this.store.update({itemMetaLookup:r,itemOrderedChildrenIdsLookup:n,itemChildrenIndexesLookup:o})};handleItemClick=(e,t)=>{this.store.parameters.onItemClick?.(e,t)}}const Up=yp(e=>e.selectedItems,e=>Array.isArray(e)?e:null!=e?[e]:[]),Xp=yp(Up,e=>{const t=new Map;return e.forEach(e=>{t.set(e,!0)}),t}),$p=vp((e,t)=>e.itemMetaLookup[t]?.selectable??!0),Kp={selectedItemsRaw:vp(e=>e.selectedItems),selectedItems:Up,selectedItemsMap:Xp,enabled:vp(e=>!e.disableSelection),isMultiSelectEnabled:vp(e=>e.multiSelect),isCheckboxSelectionEnabled:vp(e=>e.checkboxSelection),propagationRules:vp(e=>e.selectionPropagation),isItemSelected:vp(Xp,(e,t)=>e.has(t)),isFeatureEnabledForItem:vp($p,e=>!e.disableSelection,(e,t,r)=>t&&e),canItemBeSelected:vp(jp.isItemDisabled,$p,e=>!e.disableSelection,(e,t,r,n)=>r&&!e&&t),isItemSelectable:$p},qp=vp((e,t)=>{if(Kp.isItemSelected(e,t))return"checked";let r=!1,n=!1;const o=i=>{i!==t&&(Kp.isItemSelected(e,i)?r=!0:n=!0),jp.itemOrderedChildrenIds(e,i).forEach(o)};o(t);return Kp.propagationRules(e).parents?r&&n?"indeterminate":r&&!n?"checked":"empty":r?"indeterminate":"empty"}),Yp=({props:e})=>{const{itemId:t}=e,{store:r}=Zu(),n=Mp(r,Kp.isCheckboxSelectionEnabled),o=Mp(r,Kp.isFeatureEnabledForItem,t),i=Mp(r,Kp.canItemBeSelected,t),a=Mp(r,qp,t);return{propsEnhancers:{root:()=>{let e;return e="checked"===a||("indeterminate"===a?"mixed":!i&&void 0),{"aria-checked":e}},checkbox:({externalEventHandlers:e,interactions:l})=>({tabIndex:-1,onChange:n=>{e.onChange?.(n),n.defaultMuiPrevented||Kp.canItemBeSelected(r.state,t)&&l.handleCheckboxSelection(n)},visible:n&&o,disabled:!i,checked:"checked"===a,indeterminate:"indeterminate"===a})}}},Jp=yp(e=>e.expandedItems,e=>{const t=new Map;return e.forEach(e=>{t.set(e,!0)}),t}),Zp={expandedItemsRaw:vp(e=>e.expandedItems),expandedItemsMap:Jp,flatList:yp(jp.itemOrderedChildrenIdsLookup,Jp,(e,t)=>(e[Fp]??[]).flatMap(function r(n){if(!t.has(n))return[n];const o=[n],i=e[n]||[];for(const e of i)o.push(...r(e));return o})),triggerSlot:vp(e=>e.expansionTrigger),isItemExpanded:vp(Jp,(e,t)=>e.has(t)),isItemExpandable:vp(jp.itemMeta,(e,t)=>e?.expandable??!1)},_p=(e,t)=>{let r=t.length-1;for(;r>=0&&!jp.canItemBeFocused(e,t[r]);)r-=1;if(-1!==r)return t[r]},eh=(e,t)=>{const r=jp.itemMeta(e,t);if(!r)return null;const n=jp.itemOrderedChildrenIds(e,r.parentId),o=jp.itemIndex(e,t);if(0===o)return r.parentId;let i=o-1;for(;!jp.canItemBeFocused(e,n[i])&&i>=0;)i-=1;if(-1===i)return null==r.parentId?null:eh(e,r.parentId);let a=n[i],l=_p(e,jp.itemOrderedChildrenIds(e,a));for(;Zp.isItemExpanded(e,a)&&null!=l;)a=l,l=_p(e,jp.itemOrderedChildrenIds(e,a));return a},th=(e,t)=>{if(Zp.isItemExpanded(e,t)){const r=jp.itemOrderedChildrenIds(e,t).find(t=>jp.canItemBeFocused(e,t));if(null!=r)return r}let r=jp.itemMeta(e,t);for(;null!=r;){const t=jp.itemOrderedChildrenIds(e,r.parentId),n=jp.itemIndex(e,r.id);if(n<t.length-1){let r=n+1;for(;!jp.canItemBeFocused(e,t[r])&&r<t.length-1;)r+=1;if(jp.canItemBeFocused(e,t[r]))return t[r]}r=jp.itemMeta(e,r.parentId)}return null},rh=e=>{let t=null;for(;null==t||Zp.isItemExpanded(e,t);){const r=jp.itemOrderedChildrenIds(e,t),n=_p(e,r);if(null==n)return t;t=n}return t},nh=e=>jp.itemOrderedChildrenIds(e,null).find(t=>jp.canItemBeFocused(e,t)),oh=(e,t,r)=>{if(t===r)return[t,r];const n=jp.itemMeta(e,t),o=jp.itemMeta(e,r);if(!n||!o)return[t,r];if(n.parentId===o.id||o.parentId===n.id)return o.parentId===n.id?[n.id,o.id]:[o.id,n.id];const i=[n.id],a=[o.id];let l=n.parentId,s=o.parentId,d=-1!==a.indexOf(l),c=-1!==i.indexOf(s),u=!0,p=!0;for(;!c&&!d;)u&&(i.push(l),d=-1!==a.indexOf(l),u=null!==l,!d&&u&&(l=jp.itemParentId(e,l))),p&&!d&&(a.push(s),c=-1!==i.indexOf(s),p=null!==s,!c&&p&&(s=jp.itemParentId(e,s)));const h=d?l:s,m=jp.itemOrderedChildrenIds(e,h),f=i[i.indexOf(h)-1],g=a[a.indexOf(h)-1];return m.indexOf(f)<m.indexOf(g)?[t,r]:[r,t]},ih=(e,t)=>t!==e.closest('*[role="treeitem"]');class ah{lastSelectedItem=null;lastSelectedRange={};constructor(e){this.store=e,e.itemPluginManager.register(Yp,null)}setSelectedItems=(e,t,r)=>{const{selectionPropagation:n=Yu,selectedItems:o,onItemSelectionToggle:i,onSelectedItemsChange:a}=this.store.parameters,l=Kp.selectedItemsRaw(this.store.state);let s;const d=Kp.isMultiSelectEnabled(this.store.state);if(s=d&&(n.descendants||n.parents)?function({store:e,selectionPropagation:t,newModel:r,oldModel:n,additionalItemsToPropagate:o}){if(!t.descendants&&!t.parents)return r;let i=!1;const a=sh(r),l=lh({store:e,newModel:r,oldModel:n});return o?.forEach(e=>{a[e]?l.added.includes(e)||l.added.push(e):l.removed.includes(e)||l.removed.push(e)}),l.added.forEach(r=>{if(t.descendants){const t=n=>{n!==r&&(i=!0,a[n]=!0),jp.itemOrderedChildrenIds(e.state,n).forEach(t)};t(r)}if(t.parents){const t=r=>{if(!a[r])return!1;return jp.itemOrderedChildrenIds(e.state,r).every(t)},n=r=>{const o=jp.itemParentId(e.state,r);if(null==o)return;jp.itemOrderedChildrenIds(e.state,o).every(t)&&(i=!0,a[o]=!0,n(o))};n(r)}}),l.removed.forEach(r=>{if(t.parents){let t=jp.itemParentId(e.state,r);for(;null!=t;)a[t]&&(i=!0,delete a[t]),t=jp.itemParentId(e.state,t)}if(t.descendants){const t=n=>{n!==r&&(i=!0,delete a[n]),jp.itemOrderedChildrenIds(e.state,n).forEach(t)};t(r)}}),i?Object.keys(a):r}({store:this.store,selectionPropagation:n,newModel:t,oldModel:l,additionalItemsToPropagate:r}):t,i)if(d){const t=lh({store:this.store,newModel:s,oldModel:l});i&&(t.added.forEach(t=>{i(e,t,!0)}),t.removed.forEach(t=>{i(e,t,!1)}))}else s!==l&&(null!=l&&i(e,l,!1),null!=s&&i(e,s,!0));void 0===o&&this.store.set("selectedItems",s),a?.(e,s)};selectRange=(e,[t,r])=>{if(!Kp.isMultiSelectEnabled(this.store.state))return;let n=Kp.selectedItems(this.store.state).slice();Object.keys(this.lastSelectedRange).length>0&&(n=n.filter(e=>!this.lastSelectedRange[e]));const o=sh(n),i=((e,t,r)=>{const n=t=>{if(Zp.isItemExpandable(e,t)&&Zp.isItemExpanded(e,t))return jp.itemOrderedChildrenIds(e,t)[0];let r=jp.itemMeta(e,t);for(;null!=r;){const t=jp.itemOrderedChildrenIds(e,r.parentId),n=jp.itemIndex(e,r.id);if(n<t.length-1)return t[n+1];r=r.parentId?jp.itemMeta(e,r.parentId):null}throw new Error("Invalid range")},[o,i]=oh(e,t,r),a=[o];let l=o;for(;l!==i;)l=n(l),jp.isItemDisabled(e,l)||a.push(l);return a})(this.store.state,t,r).filter(e=>Kp.isItemSelectable(this.store.state,e)),a=i.filter(e=>!o[e]);n=n.concat(a),this.setSelectedItems(e,n),this.lastSelectedRange=sh(i)};buildPublicAPI=()=>({setItemSelection:this.setItemSelection});setItemSelection=({itemId:e,event:t=null,keepExistingSelection:r=!1,shouldBeSelected:n})=>{if(!Kp.enabled(this.store.state))return;let o;const i=Kp.isMultiSelectEnabled(this.store.state);if(r){const t=Kp.selectedItems(this.store.state),r=Kp.isItemSelected(this.store.state,e);o=!r||!1!==n&&null!=n?r||!0!==n&&null!=n?t:[e].concat(t):t.filter(t=>t!==e)}else o=!1===n||null==n&&Kp.isItemSelected(this.store.state,e)?i?[]:null:i?[e]:e;this.setSelectedItems(t,o,[e]),this.lastSelectedItem=e,this.lastSelectedRange={}};selectAllNavigableItems=e=>{if(!Kp.isMultiSelectEnabled(this.store.state))return;const t=(e=>{let t=nh(e);const r=[];for(;null!=t;)r.push(t),t=th(e,t);return r})(this.store.state);this.setSelectedItems(e,t),this.lastSelectedRange=sh(t)};expandSelectionRange=(e,t)=>{if(null!=this.lastSelectedItem){const[r,n]=oh(this.store.state,t,this.lastSelectedItem);this.selectRange(e,[r,n])}};selectRangeFromStartToItem=(e,t)=>{this.selectRange(e,[nh(this.store.state),t])};selectRangeFromItemToEnd=(e,t)=>{this.selectRange(e,[t,rh(this.store.state)])};selectItemFromArrowNavigation=(e,t,r)=>{if(!Kp.isMultiSelectEnabled(this.store.state))return;let n=Kp.selectedItems(this.store.state).slice();0===Object.keys(this.lastSelectedRange).length?(n.push(r),this.lastSelectedRange={[t]:!0,[r]:!0}):(this.lastSelectedRange[t]||(this.lastSelectedRange={}),this.lastSelectedRange[r]?(n=n.filter(e=>e!==t),delete this.lastSelectedRange[t]):(n.push(r),this.lastSelectedRange[r]=!0)),this.setSelectedItems(e,n)}}function lh({store:e,oldModel:t,newModel:r}){const n=new Map;return r.forEach(e=>{n.set(e,!0)}),{added:r.filter(t=>!Kp.isItemSelected(e.state,t)),removed:t.filter(e=>!n.has(e))}}function sh(e){const t={};return e.forEach(e=>{t[e]=!0}),t}const dh=e.createContext(null);function ch(t){const{children:r,itemId:n=null,idAttribute:o}=t,{store:i,rootRef:a}=Zu(),l=e.useRef(new Map);e.useEffect(()=>{if(!a.current)return;const e=jp.itemOrderedChildrenIds(i.state,n??null)??[],t=(o??a.current.id).replace(/["\\]/g,"\\$&");if(null!=n){const e=a.current.querySelector(`*[id="${t}"][role="treeitem"]`);if(e&&"false"===e.getAttribute("aria-expanded"))return}const r=a.current.querySelectorAll(`${null==n?"":`*[id="${t}"] `}[role="treeitem"]:not(*[id="${t}"] [role="treeitem"] [role="treeitem"])`),s=Array.from(r).map(e=>l.current.get(e.id)),d=s.length!==e.length||s.some((t,r)=>t!==e[r]);d&&i.jsxItems.setJSXItemsOrderedChildrenIds(n??null,s)});const s=e.useMemo(()=>({registerChild:(e,t)=>l.current.set(e,t),unregisterChild:e=>l.current.delete(e),parentId:n}),[n]);return de(dh.Provider,{value:s,children:r})}"production"!==process.env.NODE_ENV&&(dh.displayName="TreeViewChildrenItemContext"),"production"!==process.env.NODE_ENV&&(ch.propTypes={children:Vi.node,id:Vi.string});const uh=e.createContext(()=>-1);"production"!==process.env.NODE_ENV&&(uh.displayName="TreeViewItemDepthContext");const ph="undefined"!=typeof document?e.useLayoutEffect:()=>{},hh=[];const mh=e.createContext();"production"!==process.env.NODE_ENV&&(Vi.node,Vi.bool);function fh(t,r){const n=e.useContext(mh)??!1,o=Ru(()=>new t(Au({},r,{isRtl:n}))).current;var i;return ph(()=>o.updateStateFromParameters(Au({},r,{isRtl:n})),[o,n,r]),i=o.disposeEffect,e.useEffect(i,hh),o}class gh{maxListeners=20;warnOnce=!1;events={};on(e,t,r={}){let n=this.events[e];if(n||(n={highPriority:new Map,regular:new Map},this.events[e]=n),r.isFirst?n.highPriority.set(t,!0):n.regular.set(t,!0),"production"!==process.env.NODE_ENV){const t=n.highPriority.size+n.regular.size;t>this.maxListeners&&!this.warnOnce&&(this.warnOnce=!0,console.warn([`Possible EventEmitter memory leak detected. ${t} ${e} listeners added.`].join("\n")))}}removeListener(e,t){this.events[e]&&(this.events[e].regular.delete(t),this.events[e].highPriority.delete(t))}removeAllListeners(){this.events={}}emit(e,...t){const r=this.events[e];if(!r)return;const n=Array.from(r.highPriority.keys()),o=Array.from(r.regular.keys());for(let e=n.length-1;e>=0;e-=1){const o=n[e];r.highPriority.has(o)&&o.apply(this,t)}for(let e=0;e<o.length;e+=1){const n=o[e];r.regular.has(n)&&n.apply(this,t)}}once(e,t){const r=this;this.on(e,function n(...o){r.removeListener(e,n),t.apply(r,o)})}}const xh=({isItemEditable:e,expansionTrigger:t})=>t||(e?"iconContainer":"content");function bh(e){return{disabledItemsFocusable:e.disabledItemsFocusable??!1,domStructure:"nested",itemChildrenIndentation:e.itemChildrenIndentation??"12px",providedTreeId:e.id,expansionTrigger:xh({isItemEditable:e.isItemEditable,expansionTrigger:e.expansionTrigger}),disableSelection:e.disableSelection??!1,multiSelect:e.multiSelect??!1,checkboxSelection:e.checkboxSelection??!1,selectionPropagation:e.selectionPropagation??Yu}}function vh(e,t,r){return void 0!==e?e:void 0!==t?t:r}let yh=0;class Sh{timeoutIds=(()=>new Map)();intervalIds=(()=>new Map)();startTimeout=(e,t,r)=>{this.clearTimeout(e);const n=setTimeout(()=>{this.timeoutIds.delete(e),r()},t);this.timeoutIds.set(e,n)};startInterval=(e,t,r)=>{this.clearTimeout(e);const n=setInterval(r,t);this.intervalIds.set(e,n)};clearTimeout=e=>{const t=this.timeoutIds.get(e);null!=t&&(clearTimeout(t),this.timeoutIds.delete(e))};clearInterval=e=>{const t=this.intervalIds.get(e);null!=t&&(clearInterval(t),this.intervalIds.delete(e))};clearAll=()=>{this.timeoutIds.forEach(clearTimeout),this.timeoutIds.clear(),this.intervalIds.forEach(clearInterval),this.intervalIds.clear()}}class kh{constructor(e){this.store=e}setExpandedItems=(e,t)=>{void 0===this.store.parameters.expandedItems&&this.store.set("expandedItems",t),this.store.parameters.onExpandedItemsChange?.(e,t)};isItemExpanded=e=>Zp.isItemExpanded(this.store.state,e);buildPublicAPI=()=>({isItemExpanded:this.isItemExpanded,setItemExpansion:this.setItemExpansion});setItemExpansion=({itemId:e,event:t=null,shouldBeExpanded:r})=>{const n=Zp.isItemExpanded(this.store.state,e),o=r??!n;if(n===o)return;const i={isExpansionPrevented:!1,shouldBeExpanded:o,itemId:e};this.store.publishEvent("beforeItemToggleExpansion",i,t),i.isExpansionPrevented||this.applyItemExpansion({itemId:e,event:t,shouldBeExpanded:o})};applyItemExpansion=({itemId:e,event:t,shouldBeExpanded:r})=>{const n=Zp.expandedItemsRaw(this.store.state);let o;o=r?[e].concat(n):n.filter(t=>t!==e),this.store.parameters.onItemExpansionToggle?.(t,e,r),this.setExpandedItems(t,o)};expandAllSiblings=(e,t)=>{const r=jp.itemMeta(this.store.state,t);if(null==r)return;const n=jp.itemOrderedChildrenIds(this.store.state,r.parentId).filter(e=>Zp.isItemExpandable(this.store.state,e)&&!Zp.isItemExpanded(this.store.state,e)),o=Zp.expandedItemsRaw(this.store.state).concat(n);n.length>0&&(this.store.parameters.onItemExpansionToggle&&n.forEach(t=>{this.store.parameters.onItemExpansionToggle(e,t,!0)}),this.setExpandedItems(e,o))};addExpandableItems=e=>{const t=Au({},this.store.state.itemMetaLookup);for(const r of e)t[r]=Au({},t[r],{expandable:!0});this.store.set("itemMetaLookup",t)}}const Bh={isItemEditable:vp(e=>e.isItemEditable,jp.itemModel,(e,t,r)=>!(!t||null==e)&&("boolean"==typeof e?e:e(t))),isItemBeingEdited:vp((e,t)=>null!=t&&e.editedItemId===t),isAnyItemBeingEdited:vp(e=>!!e.editedItemId)};class wh{typeaheadQuery="";constructor(e){this.store=e,this.labelMap=Ch(jp.itemMetaLookup(this.store.state)),this.store.registerStoreEffect(jp.itemMetaLookup,(e,t)=>{this.store.shouldIgnoreItemsStateUpdate()||(this.labelMap=Ch(t))})}canToggleItemSelection=e=>Kp.canItemBeSelected(this.store.state,e);canToggleItemExpansion=e=>!jp.isItemDisabled(this.store.state,e)&&Zp.isItemExpandable(this.store.state,e);getFirstItemMatchingTypeaheadQuery=(e,t)=>{const r=e=>{const t=th(this.store.state,e);return null===t?nh(this.store.state):t},n=t=>{let n=null;const o={};let i=t.length>1?e:r(e);for(;null==n&&!o[i];){const e=this.labelMap[i];e?.startsWith(t)?n=i:(o[i]=!0,i=r(i))}return n},o=t.toLowerCase(),i=`${this.typeaheadQuery}${o}`,a=n(i);if(null!=a)return this.typeaheadQuery=i,a;const l=n(o);return null!=l?(this.typeaheadQuery=o,l):(this.typeaheadQuery="",null)};updateLabelMap=e=>{this.labelMap=e(this.labelMap)};handleItemKeyDown=async(e,t)=>{if(e.defaultMuiPrevented)return;if(e.altKey||ih(e.target,e.currentTarget))return;const r=e.ctrlKey||e.metaKey,n=e.key,o=Kp.isMultiSelectEnabled(this.store.state);switch(!0){case" "===n&&this.canToggleItemSelection(t):e.preventDefault(),o&&e.shiftKey?this.store.selection.expandSelectionRange(e,t):this.store.selection.setItemSelection({event:e,itemId:t,keepExistingSelection:o,shouldBeSelected:void 0});break;case"Enter"===n:this.store.labelEditing?.setEditedItem&&Bh.isItemEditable(this.store.state,t)&&!Bh.isItemBeingEdited(this.store.state,t)?this.store.labelEditing.setEditedItem(t):this.canToggleItemExpansion(t)?(this.store.expansion.setItemExpansion({event:e,itemId:t}),e.preventDefault()):this.canToggleItemSelection(t)&&(o?(e.preventDefault(),this.store.selection.setItemSelection({event:e,itemId:t,keepExistingSelection:!0})):Kp.isItemSelected(this.store.state,t)||(this.store.selection.setItemSelection({event:e,itemId:t}),e.preventDefault()));break;case"ArrowDown"===n:{const r=th(this.store.state,t);r&&(e.preventDefault(),this.store.focus.focusItem(e,r),o&&e.shiftKey&&this.canToggleItemSelection(r)&&this.store.selection.selectItemFromArrowNavigation(e,t,r));break}case"ArrowUp"===n:{const r=eh(this.store.state,t);r&&(e.preventDefault(),this.store.focus.focusItem(e,r),o&&e.shiftKey&&this.canToggleItemSelection(r)&&this.store.selection.selectItemFromArrowNavigation(e,t,r));break}case"ArrowRight"===n&&!this.store.parameters.isRtl||"ArrowLeft"===n&&this.store.parameters.isRtl:if(r)return;if(Zp.isItemExpanded(this.store.state,t)){const r=th(this.store.state,t);r&&(this.store.focus.focusItem(e,r),e.preventDefault())}else this.canToggleItemExpansion(t)&&(this.store.expansion.setItemExpansion({event:e,itemId:t}),e.preventDefault());break;case"ArrowLeft"===n&&!this.store.parameters.isRtl||"ArrowRight"===n&&this.store.parameters.isRtl:if(r)return;if(this.canToggleItemExpansion(t)&&Zp.isItemExpanded(this.store.state,t))this.store.expansion.setItemExpansion({event:e,itemId:t}),e.preventDefault();else{const r=jp.itemParentId(this.store.state,t);r&&(this.store.focus.focusItem(e,r),e.preventDefault())}break;case"Home"===n:this.canToggleItemSelection(t)&&o&&r&&e.shiftKey?this.store.selection.selectRangeFromStartToItem(e,t):this.store.focus.focusItem(e,nh(this.store.state)),e.preventDefault();break;case"End"===n:this.canToggleItemSelection(t)&&o&&r&&e.shiftKey?this.store.selection.selectRangeFromItemToEnd(e,t):this.store.focus.focusItem(e,rh(this.store.state)),e.preventDefault();break;case"*"===n:this.store.expansion.expandAllSiblings(e,t),e.preventDefault();break;case"A"===String.fromCharCode(e.keyCode)&&r&&o&&Kp.enabled(this.store.state):this.store.selection.selectAllNavigableItems(e),e.preventDefault();break;case!(r||e.shiftKey||(i=n,!i||1!==i.length||!i.match(/\S/))):{this.store.timeoutManager.clearTimeout("typeahead");const r=this.getFirstItemMatchingTypeaheadQuery(t,n);null!=r?(this.store.focus.focusItem(e,r),e.preventDefault()):this.typeaheadQuery="",this.store.timeoutManager.startTimeout("typeahead",500,()=>{this.typeaheadQuery=""});break}}var i}}function Ch(e){const t={};return Object.values(e).forEach(e=>{t[e.id]=e.label.toLowerCase()}),t}const Th=yp(Kp.selectedItems,Zp.expandedItemsMap,jp.itemMetaLookup,jp.disabledItemFocusable,e=>jp.itemOrderedChildrenIds(e,null),(e,t,r,n,o)=>{const i=e.find(e=>{if(!n&&Hp(r,e))return!1;const o=r[e];return o&&(null==o.parentId||t.has(o.parentId))});if(null!=i)return i;const a=o.find(e=>n||!Hp(r,e));return null!=a?a:null}),Ih={defaultFocusableItemId:Th,isItemTheDefaultFocusableItem:vp(Th,(e,t)=>e===t),focusedItemId:vp(e=>e.focusedItemId),isItemFocused:vp((e,t)=>e.focusedItemId===t)};class Ah{constructor(e){this.store=e;let t=e.state;this.store.subscribe(e=>{if(e.itemMetaLookup===t.itemMetaLookup)return void(t=e);const r=Ih.focusedItemId(e);if(null==r||jp.itemMeta(e,r))return void(t=e);const n=t=>null!=t&&jp.itemMeta(e,t)?t:null,o=n(th(t,r))??n(eh(t,r))??nh(e);null==o?this.setFocusedItemId(null):this.applyItemFocus(null,o),t=e})}setFocusedItemId=e=>{Ih.focusedItemId(this.store.state)!==e&&this.store.set("focusedItemId",e)};applyItemFocus=(e,t)=>{this.store.items.getItemDOMElement(t)?.focus(),this.setFocusedItemId(t),this.store.parameters.onItemFocus?.(e,t)};buildPublicAPI=()=>({focusItem:this.focusItem});focusItem=(e,t)=>{const r=jp.itemMeta(this.store.state,t);r&&(null==r.parentId||Zp.isItemExpanded(this.store.state,r.parentId))&&this.applyItemFocus(e,t)};removeFocusedItem=()=>{const e=Ih.focusedItemId(this.store.state);if(null==e)return;if(jp.itemMeta(this.store.state,e)){const t=this.store.items.getItemDOMElement(e);t&&t.blur()}this.setFocusedItemId(null)};handleRootFocus=e=>{if(e.defaultMuiPrevented)return;const t=Ih.defaultFocusableItemId(this.store.state);e.target===e.currentTarget&&null!=t&&this.applyItemFocus(e,t)};handleRootBlur=e=>{e.defaultMuiPrevented||this.setFocusedItemId(null)}}class zh{itemPlugins=[];itemWrappers=[];register=(e,t)=>{this.itemPlugins.push(e),t&&this.itemWrappers.push(t)};listPlugins=()=>this.itemPlugins;listWrappers=()=>this.itemWrappers}class Rh extends Wp{initialParameters=null;eventManager=(()=>new gh)();timeoutManager=(()=>new Sh)();itemPluginManager=(()=>new zh)();constructor(e,t,r){const n=function(e){return Au({treeId:void 0,focusedItemId:null},bh(e),Gp.buildItemsStateIfNeeded(e),{expandedItems:vh(e.expandedItems,e.defaultExpandedItems,[]),selectedItems:vh(e.selectedItems,e.defaultSelectedItems,e.multiSelect?qu:null)})}(e);super(r.getInitialState(n,e)),this.parameters=e,this.instanceName=t,this.mapper=r,this.items=new Gp(this),this.focus=new Ah(this),this.expansion=new kh(this),this.selection=new ah(this),this.keyboardNavigation=new wh(this),"production"!==process.env.NODE_ENV&&(this.initialParameters=e)}buildPublicAPI(){return Au({},this.items.buildPublicAPI(),this.focus.buildPublicAPI(),this.expansion.buildPublicAPI(),this.selection.buildPublicAPI())}updateStateFromParameters(e){const t=(t,r,n)=>{if(void 0!==e[r]&&(t[r]=e[r]),"production"!==process.env.NODE_ENV){const t=e[n],o=void 0!==e[r],i=this.initialParameters?.[n],a=void 0!==this.initialParameters?.[r];a!==o?Vu([`MUI X Tree View: A component is changing the ${a?"":"un"}controlled ${r} state of ${this.instanceName} to be ${a?"un":""}controlled.`,"Elements should not switch from uncontrolled to controlled (or vice versa).",`Decide between using a controlled or uncontrolled ${r} element for the lifetime of the component.`,"The nature of the state is determined during the first render. It's considered controlled if the value is not `undefined`.","More info: https://fb.me/react-controlled-components"],"error"):JSON.stringify(i)!==JSON.stringify(t)&&Vu([`MUI X Tree View: A component is changing the default ${r} state of an uncontrolled ${this.instanceName} after being initialized. `,`To suppress this warning opt to use a controlled ${this.instanceName}.`],"error")}},r=bh(e);t(r,"expandedItems","defaultExpandedItems"),t(r,"selectedItems","defaultSelectedItems"),this.state.providedTreeId===e.id&&void 0!==this.state.treeId||(r.treeId=(yh+=1,`mui-tree-view-${yh}`)),!this.mapper.shouldIgnoreItemsStateUpdate(e)&&Gp.shouldRebuildItemsState(e,this.parameters)&&Object.assign(r,Gp.buildItemsStateIfNeeded(e));const n=this.mapper.updateStateFromParameters(r,e,t);this.update(n),this.parameters=e}disposeEffect=()=>this.timeoutManager.clearAll;shouldIgnoreItemsStateUpdate=()=>this.mapper.shouldIgnoreItemsStateUpdate(this.parameters);registerStoreEffect=(e,t)=>{let r=e(this.state);this.subscribe(n=>{const o=e(n);o!==r&&(t(r,o),r=o)})};publishEvent=(e,t,r)=>{(function(e){return void 0!==e?.isPropagationStopped})(r)&&r.isPropagationStopped()||this.eventManager.emit(e,t,r)};subscribeEvent=(e,t)=>{this.eventManager.on(e,t)}}const Eh={isEmpty:vp(e=>null==e.lazyLoadedItems||0===Object.keys(e.lazyLoadedItems.loading).length&&0===Object.keys(e.lazyLoadedItems.errors).length),isItemLoading:vp((e,t)=>e.lazyLoadedItems?.loading[t??Fp]??!1),itemHasError:vp((e,t)=>!!e.lazyLoadedItems?.errors[t??Fp]),itemError:vp((e,t)=>e.lazyLoadedItems?.errors[t??Fp])},Ph=e=>Array.isArray(e)?e.length>0&&e.some(Ph):Boolean(e),Lh=({props:t,rootRef:r,contentRef:n})=>{const{store:o}=Zu(),{children:i,disabled:a=!1,disableSelection:l=!1,label:s,itemId:d,id:c}=t,u=e.useContext(dh);if(null==u)throw new Error(["MUI X: Could not find the Tree View Children Item context.","It looks like you rendered your component outside of a SimpleTreeView parent component.","This can also happen if you are bundling multiple versions of the Tree View."].join("\n"));const{registerChild:p,unregisterChild:h,parentId:m}=u,f=Ph(i),g=e.useRef(null),x=Eu(g,n),b=Mp(o,Dp.treeItemIdAttribute,d,c),v=e.useRef(!0),y=Ru(Symbol);return ph(()=>(p(b,d),()=>{h(b),h(b)}),[o,p,h,b,d]),ph(()=>(v.current=!0,()=>{v.current=!1}),[]),ph(()=>{const e=o.jsxItems.upsertJSXItem({id:d,idAttribute:c,parentId:m,expandable:f,disabled:a,selectable:!l},y.current);return()=>{v.current||e()}},[o,m,d,f,a,l,c,y]),e.useEffect(()=>{if(s)return o.jsxItems.mapLabelFromJSX(d,(g.current?.textContent??"").toLowerCase())},[o,d,s]),{contentRef:x,rootRef:r}},Mh=({children:t,itemId:r,idAttribute:n})=>{const o=e.useContext(uh);return de(ch,{itemId:r,idAttribute:n,children:de(uh.Provider,{value:o+1,children:t})})};"production"!==process.env.NODE_ENV&&(Mh.displayName="jsxItemsitemWrapper");class Wh{itemOwners=(()=>new Map)();constructor(e){this.store=e,e.itemPluginManager.register(Lh,Mh)}upsertJSXItem=(e,t)=>{const r=this.itemOwners.get(e.id);if(null!=r&&r!==t)throw new Error(["MUI X: The Tree View component requires all items to have a unique `id` property.","Alternatively, you can use the `getItemId` prop to specify a custom id for each item.",`Two items were provided with the same id in the \`items\` prop: "${e.id}"`].join("\n"));this.itemOwners.set(e.id,t);const n=jp.itemMeta(this.store.state,e.id);if(null!=n){let t=!1;for(const r of Object.keys(e))if(n[r]!==e[r]){t=!0;break}t&&this.store.update({itemMetaLookup:Au({},this.store.state.itemMetaLookup,{[e.id]:Au({},n,e)})})}else this.store.update({itemMetaLookup:Au({},this.store.state.itemMetaLookup,{[e.id]:e}),itemModelLookup:Au({},this.store.state.itemModelLookup,{[e.id]:{id:e.id,label:e.label??""}})});return()=>{this.itemOwners.delete(e.id);const t=Au({},this.store.state.itemMetaLookup),r=Au({},this.store.state.itemModelLookup);delete t[e.id],delete r[e.id],this.store.update({itemMetaLookup:t,itemModelLookup:r})}};mapLabelFromJSX=(e,t)=>(this.store.keyboardNavigation.updateLabelMap(r=>(r[e]=t,r)),()=>{this.store.keyboardNavigation.updateLabelMap(t=>{const r=Au({},t);return delete r[e],r})});setJSXItemsOrderedChildrenIds=(e,t)=>{const r=e??Fp;this.store.update({itemOrderedChildrenIdsLookup:Au({},this.store.state.itemOrderedChildrenIdsLookup,{[r]:t}),itemChildrenIndexesLookup:Au({},this.store.state.itemChildrenIndexesLookup,{[r]:Np(t)})})}}const Oh={getInitialState:e=>e,updateStateFromParameters:e=>e,shouldIgnoreItemsStateUpdate:()=>!0};class Dh extends Rh{jsxItems=(()=>new Wh(this))();constructor(e){super(Au({},e,{items:qu}),"SimpleTreeView",Oh)}updateStateFromParameters(e){super.updateStateFromParameters(Au({},e,{items:qu}))}}const Fh=Qu(),Nh=nr("ul",{name:"MuiSimpleTreeView",slot:"Root"})({padding:0,margin:0,listStyle:"none",outline:0,position:"relative"}),Hh=e.forwardRef(function(t,r){const n=Fh({props:t,name:"MuiSimpleTreeView"});"production"!==process.env.NODE_ENV&&null!=n.items&&Vu(["MUI X: The Simple Tree View component does not support the `items` prop.","If you want to add items, you need to pass them as JSX children.","Check the documentation for more details: https://mui.com/x/react-tree-view/simple-tree-view/items/."]);const{slots:o,slotProps:i,apiRef:a,parameters:l,forwardedProps:s}=function(t){const{apiRef:r,slots:n,slotProps:o,disabledItemsFocusable:i,onItemClick:a,itemChildrenIndentation:l,id:s,expandedItems:d,defaultExpandedItems:c,onExpandedItemsChange:u,onItemExpansionToggle:p,expansionTrigger:h,disableSelection:m,selectedItems:f,defaultSelectedItems:g,multiSelect:x,checkboxSelection:b,selectionPropagation:v,onSelectedItemsChange:y,onItemSelectionToggle:S,onItemFocus:k}=t,B=rp(t,np);return{apiRef:r,slots:n,slotProps:o,parameters:e.useMemo(()=>({disabledItemsFocusable:i,onItemClick:a,itemChildrenIndentation:l,id:s,expandedItems:d,defaultExpandedItems:c,onExpandedItemsChange:u,onItemExpansionToggle:p,expansionTrigger:h,disableSelection:m,selectedItems:f,defaultSelectedItems:g,multiSelect:x,checkboxSelection:b,selectionPropagation:v,onSelectedItemsChange:y,onItemSelectionToggle:S,onItemFocus:k}),[i,a,l,s,d,c,u,p,h,m,f,g,x,b,v,y,S,k]),forwardedProps:B}}(n),d=fh(Dh,l),c=e.useRef(null),u=function(e,t,r){const n=Mp(e,Dp.treeId),o=Mp(e,jp.itemChildrenIndentation),i=Mp(e,Kp.isMultiSelectEnabled);return a=>Au({ref:r,role:"tree",id:n,"aria-multiselectable":i},t,a,{style:Au({},t.style,{"--TreeView-itemChildrenIndentation":"number"==typeof o?`${o}px`:o}),onFocus:t=>{a.onFocus?.(t),e.focus.handleRootFocus(t)},onBlur:t=>{a.onBlur?.(t),e.focus.handleRootBlur(t)}})}(d,s,Eu(r,c)),p=(t=>{const{classes:r}=t;return e.useMemo(()=>Lu({root:["root"],item:["item"],itemContent:["itemContent"],itemGroupTransition:["itemGroupTransition"],itemIconContainer:["itemIconContainer"],itemLabel:["itemLabel"],itemCheckbox:["itemCheckbox"]},Ku,r),[r])})(n),h=o?.root??Nh,m=Nu({elementType:h,externalSlotProps:i?.root,className:p.root,getSlotProps:u,ownerState:n});return de(tp,{store:d,classes:p,slots:o,slotProps:i,apiRef:a,rootRef:c,children:de(ch,{itemId:null,idAttribute:null,children:de(uh.Provider,{value:0,children:de(h,Au({},m))})})})});"production"!==process.env.NODE_ENV&&(Hh.displayName="SimpleTreeView"),"production"!==process.env.NODE_ENV&&(Hh.propTypes={apiRef:Vi.shape({current:Vi.shape({focusItem:Vi.func,getItem:Vi.func,getItemDOMElement:Vi.func,getItemOrderedChildrenIds:Vi.func,getItemTree:Vi.func,getParentId:Vi.func,isItemExpanded:Vi.func,setIsItemDisabled:Vi.func,setItemExpansion:Vi.func,setItemSelection:Vi.func})}),checkboxSelection:Vi.bool,children:Vi.node,classes:Vi.object,className:Vi.string,defaultExpandedItems:Vi.arrayOf(Vi.string),defaultSelectedItems:Vi.any,disabledItemsFocusable:Vi.bool,disableSelection:Vi.bool,expandedItems:Vi.arrayOf(Vi.string),expansionTrigger:Vi.oneOf(["content","iconContainer"]),id:Vi.string,itemChildrenIndentation:Vi.oneOfType([Vi.number,Vi.string]),multiSelect:Vi.bool,onExpandedItemsChange:Vi.func,onItemClick:Vi.func,onItemExpansionToggle:Vi.func,onItemFocus:Vi.func,onItemSelectionToggle:Vi.func,onSelectedItemsChange:Vi.func,selectedItems:Vi.any,selectionPropagation:Vi.shape({descendants:Vi.bool,parents:Vi.bool}),slotProps:Vi.object,slots:Vi.object,sx:Vi.oneOfType([Vi.arrayOf(Vi.oneOfType([Vi.func,Vi.object,Vi.bool])),Vi.func,Vi.object])});var Vh,Qh={exports:{}},jh={};var Gh,Uh={};
33
33
  /**
34
34
  * @license React
35
35
  * react-is.development.js
@@ -38,5 +38,5 @@ object-assign
38
38
  *
39
39
  * This source code is licensed under the MIT license found in the
40
40
  * LICENSE file in the root directory of this source tree.
41
- */"production"===process.env.NODE_ENV?Wh.exports=function(){if(Mh)return Dh;Mh=1;var e=Symbol.for("react.transitional.element"),t=Symbol.for("react.portal"),r=Symbol.for("react.fragment"),o=Symbol.for("react.strict_mode"),n=Symbol.for("react.profiler"),i=Symbol.for("react.consumer"),a=Symbol.for("react.context"),l=Symbol.for("react.forward_ref"),s=Symbol.for("react.suspense"),d=Symbol.for("react.suspense_list"),c=Symbol.for("react.memo"),u=Symbol.for("react.lazy"),p=Symbol.for("react.view_transition"),h=Symbol.for("react.client.reference");function m(h){if("object"==typeof h&&null!==h){var m=h.$$typeof;switch(m){case e:switch(h=h.type){case r:case n:case o:case s:case d:case p:return h;default:switch(h=h&&h.$$typeof){case a:case l:case u:case c:case i:return h;default:return m}}case t:return m}}}return Dh.ContextConsumer=i,Dh.ContextProvider=a,Dh.Element=e,Dh.ForwardRef=l,Dh.Fragment=r,Dh.Lazy=u,Dh.Memo=c,Dh.Portal=t,Dh.Profiler=n,Dh.StrictMode=o,Dh.Suspense=s,Dh.SuspenseList=d,Dh.isContextConsumer=function(e){return m(e)===i},Dh.isContextProvider=function(e){return m(e)===a},Dh.isElement=function(t){return"object"==typeof t&&null!==t&&t.$$typeof===e},Dh.isForwardRef=function(e){return m(e)===l},Dh.isFragment=function(e){return m(e)===r},Dh.isLazy=function(e){return m(e)===u},Dh.isMemo=function(e){return m(e)===c},Dh.isPortal=function(e){return m(e)===t},Dh.isProfiler=function(e){return m(e)===n},Dh.isStrictMode=function(e){return m(e)===o},Dh.isSuspense=function(e){return m(e)===s},Dh.isSuspenseList=function(e){return m(e)===d},Dh.isValidElementType=function(e){return"string"==typeof e||"function"==typeof e||e===r||e===n||e===o||e===s||e===d||"object"==typeof e&&null!==e&&(e.$$typeof===u||e.$$typeof===c||e.$$typeof===a||e.$$typeof===i||e.$$typeof===l||e.$$typeof===h||void 0!==e.getModuleId)},Dh.typeOf=m,Dh}():Wh.exports=(Fh||(Fh=1,"production"!==process.env.NODE_ENV&&function(){function e(e){if("object"==typeof e&&null!==e){var m=e.$$typeof;switch(m){case t:switch(e=e.type){case o:case i:case n:case d:case c:case h:return e;default:switch(e=e&&e.$$typeof){case l:case s:case p:case u:case a:return e;default:return m}}case r:return m}}}var t=Symbol.for("react.transitional.element"),r=Symbol.for("react.portal"),o=Symbol.for("react.fragment"),n=Symbol.for("react.strict_mode"),i=Symbol.for("react.profiler"),a=Symbol.for("react.consumer"),l=Symbol.for("react.context"),s=Symbol.for("react.forward_ref"),d=Symbol.for("react.suspense"),c=Symbol.for("react.suspense_list"),u=Symbol.for("react.memo"),p=Symbol.for("react.lazy"),h=Symbol.for("react.view_transition"),m=Symbol.for("react.client.reference");Nh.ContextConsumer=a,Nh.ContextProvider=l,Nh.Element=t,Nh.ForwardRef=s,Nh.Fragment=o,Nh.Lazy=p,Nh.Memo=u,Nh.Portal=r,Nh.Profiler=i,Nh.StrictMode=n,Nh.Suspense=d,Nh.SuspenseList=c,Nh.isContextConsumer=function(t){return e(t)===a},Nh.isContextProvider=function(t){return e(t)===l},Nh.isElement=function(e){return"object"==typeof e&&null!==e&&e.$$typeof===t},Nh.isForwardRef=function(t){return e(t)===s},Nh.isFragment=function(t){return e(t)===o},Nh.isLazy=function(t){return e(t)===p},Nh.isMemo=function(t){return e(t)===u},Nh.isPortal=function(t){return e(t)===r},Nh.isProfiler=function(t){return e(t)===i},Nh.isStrictMode=function(t){return e(t)===n},Nh.isSuspense=function(t){return e(t)===d},Nh.isSuspenseList=function(t){return e(t)===c},Nh.isValidElementType=function(e){return"string"==typeof e||"function"==typeof e||e===o||e===i||e===n||e===d||e===c||"object"==typeof e&&null!==e&&(e.$$typeof===p||e.$$typeof===u||e.$$typeof===l||e.$$typeof===a||e.$$typeof===s||e.$$typeof===m||void 0!==e.getModuleId)},Nh.typeOf=e}()),Nh);var Hh=Wh.exports;function Vh(e){if("object"!=typeof e||null===e)return!1;const t=Object.getPrototypeOf(e);return!(null!==t&&t!==Object.prototype&&null!==Object.getPrototypeOf(t)||Symbol.toStringTag in e||Symbol.iterator in e)}function Qh(t){if(e.isValidElement(t)||Hh.isValidElementType(t)||!Vh(t))return t;const r={};return Object.keys(t).forEach(e=>{r[e]=Qh(t[e])}),r}function jh(t,r,o={clone:!0}){const n=o.clone?{...t}:t;return Vh(t)&&Vh(r)&&Object.keys(r).forEach(i=>{e.isValidElement(r[i])||Hh.isValidElementType(r[i])?n[i]=r[i]:Vh(r[i])&&Object.prototype.hasOwnProperty.call(t,i)&&Vh(t[i])?n[i]=jh(t[i],r[i],o):o.clone?n[i]=Vh(r[i])?Qh(r[i]):r[i]:n[i]=r[i]}),n}function Gh(e){if("string"!=typeof e)throw new Error("production"!==process.env.NODE_ENV?"MUI: `capitalize(string)` expects a string argument.":function(e,...t){const r=new URL(`https://mui.com/production-error/?code=${e}`);return t.forEach(e=>r.searchParams.append("args[]",e)),`Minified MUI error #${e}; visit ${r} for the full message.`}(7));return e.charAt(0).toUpperCase()+e.slice(1)}function Uh(e){const{values:t={xs:0,sm:600,md:900,lg:1200,xl:1536},unit:r="px",step:o=5,...n}=e,i=(e=>{const t=Object.keys(e).map(t=>({key:t,val:e[t]}))||[];return t.sort((e,t)=>e.val-t.val),t.reduce((e,t)=>({...e,[t.key]:t.val}),{})})(t),a=Object.keys(i);function l(e){return`@media (min-width:${"number"==typeof t[e]?t[e]:e}${r})`}function s(e){return`@media (max-width:${("number"==typeof t[e]?t[e]:e)-o/100}${r})`}function d(e,n){const i=a.indexOf(n);return`@media (min-width:${"number"==typeof t[e]?t[e]:e}${r}) and (max-width:${(-1!==i&&"number"==typeof t[a[i]]?t[a[i]]:n)-o/100}${r})`}return{keys:a,values:i,up:l,down:s,between:d,only:function(e){return a.indexOf(e)+1<a.length?d(e,a[a.indexOf(e)+1]):l(e)},not:function(e){const t=a.indexOf(e);return 0===t?l(a[1]):t===a.length-1?s(a[t]):d(e,a[a.indexOf(e)+1]).replace("@media","@media not all and")},unit:r,...n}}function Xh(e,t){if(!e.containerQueries)return t;const r=Object.keys(t).filter(e=>e.startsWith("@container")).sort((e,t)=>{const r=/min-width:\s*([0-9.]+)/;return+(e.match(r)?.[1]||0)-+(t.match(r)?.[1]||0)});return r.length?r.reduce((e,r)=>{const o=t[r];return delete e[r],e[r]=o,e},{...t}):t}const Kh={borderRadius:4},qh="production"!==process.env.NODE_ENV?Hi.oneOfType([Hi.number,Hi.string,Hi.object,Hi.array]):{};function Jh(e,t){return t?jh(e,t,{clone:!1}):e}const Yh={xs:0,sm:600,md:900,lg:1200,xl:1536},Zh={keys:["xs","sm","md","lg","xl"],up:e=>`@media (min-width:${Yh[e]}px)`},$h={containerQueries:e=>({up:t=>{let r="number"==typeof t?t:Yh[t]||t;return"number"==typeof r&&(r=`${r}px`),e?`@container ${e} (min-width:${r})`:`@container (min-width:${r})`}})};function _h(e,t,r){const o=e.theme||{};if(Array.isArray(t)){const e=o.breakpoints||Zh;return t.reduce((o,n,i)=>(o[e.up(e.keys[i])]=r(t[i]),o),{})}if("object"==typeof t){const e=o.breakpoints||Zh;return Object.keys(t).reduce((n,i)=>{if(a=e.keys,"@"===(l=i)||l.startsWith("@")&&(a.some(e=>l.startsWith(`@${e}`))||l.match(/^@\d/))){const e=function(e,t){const r=t.match(/^@([^/]+)?\/?(.+)?$/);if(!r){if("production"!==process.env.NODE_ENV)throw new Error(`MUI: The provided shorthand (${t}) is invalid. The format should be \`@<breakpoint | number>\` or \`@<breakpoint | number>/<container>\`.\nFor example, \`@sm\` or \`@600\` or \`@40rem/sidebar\`.`);return null}const[,o,n]=r,i=Number.isNaN(+o)?o||0:+o;return e.containerQueries(n).up(i)}(o.containerQueries?o:$h,i);e&&(n[e]=r(t[i],i))}else if(Object.keys(e.values||Yh).includes(i)){n[e.up(i)]=r(t[i],i)}else{const e=i;n[e]=t[e]}var a,l;return n},{})}return r(t)}function em(e,t){return e.reduce((e,t)=>{const r=e[t];return(!r||0===Object.keys(r).length)&&delete e[t],e},t)}function tm(e,t,r=!0){if(!t||"string"!=typeof t)return null;if(e&&e.vars&&r){const r=`vars.${t}`.split(".").reduce((e,t)=>e&&e[t]?e[t]:null,e);if(null!=r)return r}return t.split(".").reduce((e,t)=>e&&null!=e[t]?e[t]:null,e)}function rm(e,t,r,o=r){let n;return n="function"==typeof e?e(r):Array.isArray(e)?e[r]||o:tm(e,r)||o,t&&(n=t(n,o,e)),n}function om(e){const{prop:t,cssProperty:r=e.prop,themeKey:o,transform:n}=e,i=e=>{if(null==e[t])return null;const i=e[t],a=tm(e.theme,o)||{};return _h(e,i,e=>{let o=rm(a,n,e);return e===o&&"string"==typeof e&&(o=rm(a,n,`${t}${"default"===e?"":Gh(e)}`,e)),!1===r?o:{[r]:o}})};return i.propTypes="production"!==process.env.NODE_ENV?{[t]:qh}:{},i.filterProps=[t],i}const nm={m:"margin",p:"padding"},im={t:"Top",r:"Right",b:"Bottom",l:"Left",x:["Left","Right"],y:["Top","Bottom"]},am={marginX:"mx",marginY:"my",paddingX:"px",paddingY:"py"},lm=function(e){const t={};return r=>(void 0===t[r]&&(t[r]=e(r)),t[r])}(e=>{if(e.length>2){if(!am[e])return[e];e=am[e]}const[t,r]=e.split(""),o=nm[t],n=im[r]||"";return Array.isArray(n)?n.map(e=>o+e):[o+n]}),sm=["m","mt","mr","mb","ml","mx","my","margin","marginTop","marginRight","marginBottom","marginLeft","marginX","marginY","marginInline","marginInlineStart","marginInlineEnd","marginBlock","marginBlockStart","marginBlockEnd"],dm=["p","pt","pr","pb","pl","px","py","padding","paddingTop","paddingRight","paddingBottom","paddingLeft","paddingX","paddingY","paddingInline","paddingInlineStart","paddingInlineEnd","paddingBlock","paddingBlockStart","paddingBlockEnd"],cm=[...sm,...dm];function um(e,t,r,o){const n=tm(e,t,!0)??r;return"number"==typeof n||"string"==typeof n?e=>"string"==typeof e?e:("production"!==process.env.NODE_ENV&&"number"!=typeof e&&console.error(`MUI: Expected ${o} argument to be a number or a string, got ${e}.`),"string"==typeof n?n.startsWith("var(")&&0===e?0:n.startsWith("var(")&&1===e?n:`calc(${e} * ${n})`:n*e):Array.isArray(n)?e=>{if("string"==typeof e)return e;const r=Math.abs(e);"production"!==process.env.NODE_ENV&&(Number.isInteger(r)?r>n.length-1&&console.error([`MUI: The value provided (${r}) overflows.`,`The supported values are: ${JSON.stringify(n)}.`,`${r} > ${n.length-1}, you need to add the missing values.`].join("\n")):console.error([`MUI: The \`theme.${t}\` array type cannot be combined with non integer values.You should either use an integer value that can be used as index, or define the \`theme.${t}\` as a number.`].join("\n")));const o=n[r];return e>=0?o:"number"==typeof o?-o:"string"==typeof o&&o.startsWith("var(")?`calc(-1 * ${o})`:`-${o}`}:"function"==typeof n?n:("production"!==process.env.NODE_ENV&&console.error([`MUI: The \`theme.${t}\` value (${n}) is invalid.`,"It should be a number, an array or a function."].join("\n")),()=>{})}function pm(e){return um(e,"spacing",8,"spacing")}function hm(e,t){return"string"==typeof t||null==t?t:e(t)}function mm(e,t,r,o){if(!t.includes(r))return null;const n=function(e,t){return r=>e.reduce((e,o)=>(e[o]=hm(t,r),e),{})}(lm(r),o);return _h(e,e[r],n)}function fm(e,t){const r=pm(e.theme);return Object.keys(e).map(o=>mm(e,t,o,r)).reduce(Jh,{})}function gm(e){return fm(e,sm)}function xm(e){return fm(e,dm)}function bm(...e){const t=e.reduce((e,t)=>(t.filterProps.forEach(r=>{e[r]=t}),e),{}),r=e=>Object.keys(e).reduce((r,o)=>t[o]?Jh(r,t[o](e)):r,{});return r.propTypes="production"!==process.env.NODE_ENV?e.reduce((e,t)=>Object.assign(e,t.propTypes),{}):{},r.filterProps=e.reduce((e,t)=>e.concat(t.filterProps),[]),r}function vm(e){return"number"!=typeof e?e:`${e}px solid`}function ym(e,t){return om({prop:e,themeKey:"borders",transform:t})}gm.propTypes="production"!==process.env.NODE_ENV?sm.reduce((e,t)=>(e[t]=qh,e),{}):{},gm.filterProps=sm,xm.propTypes="production"!==process.env.NODE_ENV?dm.reduce((e,t)=>(e[t]=qh,e),{}):{},xm.filterProps=dm,"production"===process.env.NODE_ENV||cm.reduce((e,t)=>(e[t]=qh,e),{});const Sm=ym("border",vm),km=ym("borderTop",vm),Bm=ym("borderRight",vm),wm=ym("borderBottom",vm),Cm=ym("borderLeft",vm),Tm=ym("borderColor"),Im=ym("borderTopColor"),Am=ym("borderRightColor"),zm=ym("borderBottomColor"),Rm=ym("borderLeftColor"),Em=ym("outline",vm),Pm=ym("outlineColor"),Om=e=>{if(void 0!==e.borderRadius&&null!==e.borderRadius){const t=um(e.theme,"shape.borderRadius",4,"borderRadius"),r=e=>({borderRadius:hm(t,e)});return _h(e,e.borderRadius,r)}return null};Om.propTypes="production"!==process.env.NODE_ENV?{borderRadius:qh}:{},Om.filterProps=["borderRadius"],bm(Sm,km,Bm,wm,Cm,Tm,Im,Am,zm,Rm,Om,Em,Pm);const Lm=e=>{if(void 0!==e.gap&&null!==e.gap){const t=um(e.theme,"spacing",8,"gap"),r=e=>({gap:hm(t,e)});return _h(e,e.gap,r)}return null};Lm.propTypes="production"!==process.env.NODE_ENV?{gap:qh}:{},Lm.filterProps=["gap"];const Mm=e=>{if(void 0!==e.columnGap&&null!==e.columnGap){const t=um(e.theme,"spacing",8,"columnGap"),r=e=>({columnGap:hm(t,e)});return _h(e,e.columnGap,r)}return null};Mm.propTypes="production"!==process.env.NODE_ENV?{columnGap:qh}:{},Mm.filterProps=["columnGap"];const Wm=e=>{if(void 0!==e.rowGap&&null!==e.rowGap){const t=um(e.theme,"spacing",8,"rowGap"),r=e=>({rowGap:hm(t,e)});return _h(e,e.rowGap,r)}return null};Wm.propTypes="production"!==process.env.NODE_ENV?{rowGap:qh}:{},Wm.filterProps=["rowGap"];function Dm(e,t){return"grey"===t?t:e}bm(Lm,Mm,Wm,om({prop:"gridColumn"}),om({prop:"gridRow"}),om({prop:"gridAutoFlow"}),om({prop:"gridAutoColumns"}),om({prop:"gridAutoRows"}),om({prop:"gridTemplateColumns"}),om({prop:"gridTemplateRows"}),om({prop:"gridTemplateAreas"}),om({prop:"gridArea"}));function Fm(e){return e<=1&&0!==e?100*e+"%":e}bm(om({prop:"color",themeKey:"palette",transform:Dm}),om({prop:"bgcolor",cssProperty:"backgroundColor",themeKey:"palette",transform:Dm}),om({prop:"backgroundColor",themeKey:"palette",transform:Dm}));const Nm=om({prop:"width",transform:Fm}),Hm=e=>{if(void 0!==e.maxWidth&&null!==e.maxWidth){const t=t=>{const r=e.theme?.breakpoints?.values?.[t]||Yh[t];return r?"px"!==e.theme?.breakpoints?.unit?{maxWidth:`${r}${e.theme.breakpoints.unit}`}:{maxWidth:r}:{maxWidth:Fm(t)}};return _h(e,e.maxWidth,t)}return null};Hm.filterProps=["maxWidth"];const Vm=om({prop:"minWidth",transform:Fm}),Qm=om({prop:"height",transform:Fm}),jm=om({prop:"maxHeight",transform:Fm}),Gm=om({prop:"minHeight",transform:Fm});om({prop:"size",cssProperty:"width",transform:Fm}),om({prop:"size",cssProperty:"height",transform:Fm});bm(Nm,Hm,Vm,Qm,jm,Gm,om({prop:"boxSizing"}));const Um={border:{themeKey:"borders",transform:vm},borderTop:{themeKey:"borders",transform:vm},borderRight:{themeKey:"borders",transform:vm},borderBottom:{themeKey:"borders",transform:vm},borderLeft:{themeKey:"borders",transform:vm},borderColor:{themeKey:"palette"},borderTopColor:{themeKey:"palette"},borderRightColor:{themeKey:"palette"},borderBottomColor:{themeKey:"palette"},borderLeftColor:{themeKey:"palette"},outline:{themeKey:"borders",transform:vm},outlineColor:{themeKey:"palette"},borderRadius:{themeKey:"shape.borderRadius",style:Om},color:{themeKey:"palette",transform:Dm},bgcolor:{themeKey:"palette",cssProperty:"backgroundColor",transform:Dm},backgroundColor:{themeKey:"palette",transform:Dm},p:{style:xm},pt:{style:xm},pr:{style:xm},pb:{style:xm},pl:{style:xm},px:{style:xm},py:{style:xm},padding:{style:xm},paddingTop:{style:xm},paddingRight:{style:xm},paddingBottom:{style:xm},paddingLeft:{style:xm},paddingX:{style:xm},paddingY:{style:xm},paddingInline:{style:xm},paddingInlineStart:{style:xm},paddingInlineEnd:{style:xm},paddingBlock:{style:xm},paddingBlockStart:{style:xm},paddingBlockEnd:{style:xm},m:{style:gm},mt:{style:gm},mr:{style:gm},mb:{style:gm},ml:{style:gm},mx:{style:gm},my:{style:gm},margin:{style:gm},marginTop:{style:gm},marginRight:{style:gm},marginBottom:{style:gm},marginLeft:{style:gm},marginX:{style:gm},marginY:{style:gm},marginInline:{style:gm},marginInlineStart:{style:gm},marginInlineEnd:{style:gm},marginBlock:{style:gm},marginBlockStart:{style:gm},marginBlockEnd:{style:gm},displayPrint:{cssProperty:!1,transform:e=>({"@media print":{display:e}})},display:{},overflow:{},textOverflow:{},visibility:{},whiteSpace:{},flexBasis:{},flexDirection:{},flexWrap:{},justifyContent:{},alignItems:{},alignContent:{},order:{},flex:{},flexGrow:{},flexShrink:{},alignSelf:{},justifyItems:{},justifySelf:{},gap:{style:Lm},rowGap:{style:Wm},columnGap:{style:Mm},gridColumn:{},gridRow:{},gridAutoFlow:{},gridAutoColumns:{},gridAutoRows:{},gridTemplateColumns:{},gridTemplateRows:{},gridTemplateAreas:{},gridArea:{},position:{},zIndex:{themeKey:"zIndex"},top:{},right:{},bottom:{},left:{},boxShadow:{themeKey:"shadows"},width:{transform:Fm},maxWidth:{style:Hm},minWidth:{transform:Fm},height:{transform:Fm},maxHeight:{transform:Fm},minHeight:{transform:Fm},boxSizing:{},font:{themeKey:"font"},fontFamily:{themeKey:"typography"},fontSize:{themeKey:"typography"},fontStyle:{themeKey:"typography"},fontWeight:{themeKey:"typography"},letterSpacing:{},textTransform:{},lineHeight:{},textAlign:{},typography:{cssProperty:!1,themeKey:"typography"}};const Xm=function(){function e(e,t,r,o){const n={[e]:t,theme:r},i=o[e];if(!i)return{[e]:t};const{cssProperty:a=e,themeKey:l,transform:s,style:d}=i;if(null==t)return null;if("typography"===l&&"inherit"===t)return{[e]:t};const c=tm(r,l)||{};if(d)return d(n);return _h(n,t,t=>{let r=rm(c,s,t);return t===r&&"string"==typeof t&&(r=rm(c,s,`${e}${"default"===t?"":Gh(t)}`,t)),!1===a?r:{[a]:r}})}return function t(r){const{sx:o,theme:n={},nested:i}=r||{};if(!o)return null;const a=n.unstable_sxConfig??Um;function l(r){let o=r;if("function"==typeof r)o=r(n);else if("object"!=typeof r)return r;if(!o)return null;const l=function(e={}){const t=e.keys?.reduce((t,r)=>(t[e.up(r)]={},t),{});return t||{}}(n.breakpoints),s=Object.keys(l);let d=l;return Object.keys(o).forEach(r=>{const i=(l=o[r],s=n,"function"==typeof l?l(s):l);var l,s;if(null!=i)if("object"==typeof i)if(a[r])d=Jh(d,e(r,i,n,a));else{const e=_h({theme:n},i,e=>({[r]:e}));!function(...e){const t=e.reduce((e,t)=>e.concat(Object.keys(t)),[]),r=new Set(t);return e.every(e=>r.size===Object.keys(e).length)}(e,i)?d=Jh(d,e):d[r]=t({sx:i,theme:n,nested:!0})}else d=Jh(d,e(r,i,n,a))}),!i&&n.modularCssLayers?{"@layer sx":Xh(n,em(s,d))}:Xh(n,em(s,d))}return Array.isArray(o)?o.map(l):l(o)}}();function Km(e,t){const r=this;if(r.vars){if(!r.colorSchemes?.[e]||"function"!=typeof r.getColorSchemeSelector)return{};let o=r.getColorSchemeSelector(e);return"&"===o?t:((o.includes("data-")||o.includes("."))&&(o=`*:where(${o.replace(/\s*&$/,"")}) &`),{[o]:t})}return r.palette.mode===e?t:{}}function qm(e){return"ownerState"!==e&&"theme"!==e&&"sx"!==e&&"as"!==e}Xm.filterProps=["sx"],function(e={},...t){const{breakpoints:r={},palette:o={},spacing:n,shape:i={},...a}=e,l=Uh(r),s=function(e=8,t=pm({spacing:e})){if(e.mui)return e;const r=(...e)=>("production"!==process.env.NODE_ENV&&(e.length<=4||console.error(`MUI: Too many arguments provided, expected between 0 and 4, got ${e.length}`)),(0===e.length?[1]:e).map(e=>{const r=t(e);return"number"==typeof r?`${r}px`:r}).join(" "));return r.mui=!0,r}(n);let d=jh({breakpoints:l,direction:"ltr",components:{},palette:{mode:"light",...o},spacing:s,shape:{...Kh,...i}},a);d=function(e){const t=(e,t)=>e.replace("@media",t?`@container ${t}`:"@container");function r(r,o){r.up=(...r)=>t(e.breakpoints.up(...r),o),r.down=(...r)=>t(e.breakpoints.down(...r),o),r.between=(...r)=>t(e.breakpoints.between(...r),o),r.only=(...r)=>t(e.breakpoints.only(...r),o),r.not=(...r)=>{const n=t(e.breakpoints.not(...r),o);return n.includes("not all and")?n.replace("not all and ","").replace("min-width:","width<").replace("max-width:","width>").replace("and","or"):n}}const o={},n=e=>(r(o,e),o);return r(n),{...e,containerQueries:n}}(d),d.applyStyles=Km,d=t.reduce((e,t)=>jh(e,t),d),d.unstable_sxConfig={...Um,...a?.unstable_sxConfig},d.unstable_sx=function(e){return Xm({sx:e,theme:this})}}();const Jm=(e,t,r)=>"function"==typeof r?r(e,t):r,Ym=t=>{const{runItemPlugins:r,publicAPI:o,store:n}=Xu(),i=e.useContext(ih),a=Ap(n,Jm,t.itemId,i),{id:l,itemId:s,label:d,children:c,rootRef:u}=t,{rootRef:p,contentRef:h,propsEnhancers:m}=r(t),{interactions:f,status:g}=(({itemId:e,children:t})=>{const{store:r,publicAPI:o}=Xu(),n=Ap(r,Xp.isItemExpandable,e),i=Ap(r,Ch.isItemLoading,e),a=Ap(r,Ch.itemHasError,e),l=Th(t)||n,s=Ap(r,Xp.isItemExpanded,e),d=Ap(r,Sh.isItemFocused,e),c=Ap(r,Qp.isItemSelected,e),u=Ap(r,Dp.isItemDisabled,e),p=Ap(r,xh.isItemBeingEdited,e),h=Ap(r,xh.isItemEditable,e),m={expandable:l,expanded:s,focused:d,selected:c,disabled:u,editing:p,editable:h,loading:i,error:a},f=()=>{r.labelEditing&&(p?r.labelEditing.setEditedItem(null):r.labelEditing.setEditedItem(e))};return{interactions:{handleExpansion:t=>{if(m.disabled)return;m.focused||r.focus.focusItem(t,e);const o=Qp.isMultiSelectEnabled(r.state)&&(t.shiftKey||t.ctrlKey||t.metaKey);!m.expandable||o&&Xp.isItemExpanded(r.state,e)||r.expansion.setItemExpansion({event:t,itemId:e})},handleSelection:t=>{Qp.canItemBeSelected(r.state,e)&&(m.focused||m.editing||r.focus.focusItem(t,e),Qp.isMultiSelectEnabled(r.state)&&(t.shiftKey||t.ctrlKey||t.metaKey)?t.shiftKey?r.selection.expandSelectionRange(t,e):r.selection.setItemSelection({event:t,itemId:e,keepExistingSelection:!0}):r.selection.setItemSelection({event:t,itemId:e,shouldBeSelected:!0}))},handleCheckboxSelection:t=>{const o=t.nativeEvent.shiftKey,n=Qp.isMultiSelectEnabled(r.state);n&&o?r.selection.expandSelectionRange(t,e):r.selection.setItemSelection({event:t,itemId:e,keepExistingSelection:n,shouldBeSelected:t.target.checked})},toggleItemEditing:f,handleSaveItemLabel:(t,o)=>{r.labelEditing&&xh.isItemBeingEdited(r.state,e)&&(r.labelEditing.updateItemLabel(e,o),f(),r.focus.focusItem(t,e))},handleCancelItemLabelEditing:t=>{r.labelEditing&&xh.isItemBeingEdited(r.state,e)&&(f(),r.focus.focusItem(t,e))}},status:m,publicAPI:o}})({itemId:s,children:c}),x=e.useRef(null),b=e.useRef(null),v=Cu(u,p,x),y=Cu(h,b),S=e.useRef(null),k=Ap(n,Qp.isCheckboxSelectionEnabled),B=Ap(n,Ep.treeItemIdAttribute,s,l),w=Ap(n,Sh.isItemTheDefaultFocusableItem,s),C={rootRefObject:x,contentRefObject:b,interactions:f},T=e=>t=>{if(e.onBlur?.(t),t.defaultMuiPrevented)return;const r=n.items.getItemDOMElement(s);g.editing||t.relatedTarget&&_p(t.relatedTarget,r)&&(t.target&&"labelInput"===t.target?.dataset?.element&&_p(t.target,r)||"labelInput"===t.relatedTarget?.dataset?.element)||n.focus.removeFocusedItem()},I=e=>t=>{e.onKeyDown?.(t),t.defaultMuiPrevented||"labelInput"===t.target?.dataset?.element||n.keyboardNavigation.handleItemKeyDown(t,s)},A=e=>t=>{e.onMouseDown?.(t),t.defaultMuiPrevented||(t.shiftKey||t.ctrlKey||t.metaKey||g.disabled)&&t.preventDefault()};return{getContextProviderProps:()=>({itemId:s,id:l}),getRootProps:(e={})=>{const r=ku({},Ru(t),Ru(e)),o=ku({},r,{ref:v,role:"treeitem",tabIndex:w?0:-1,id:B,"aria-expanded":g.expandable?g.expanded:void 0,"aria-disabled":g.disabled||void 0},e,{style:ku({},e.style??{},{"--TreeView-itemDepth":a}),onFocus:(i=r,e=>{i.onFocus?.(e),e.defaultMuiPrevented||!g.focused&&Dp.canItemBeFocused(n.state,s)&&e.currentTarget===e.target&&n.focus.focusItem(e,s)}),onBlur:T(r),onKeyDown:I(r)});var i;const l=m.root?.(ku({},C,{externalEventHandlers:r}))??{};return ku({},o,l)},getContentProps:(e={})=>{const t=Ru(e),r=ku({},t,e,{ref:y,onClick:(o=t,e=>{o.onClick?.(e),n.items.handleItemClick(e,s),e.defaultMuiPrevented||S.current?.contains(e.target)||("content"===Xp.triggerSlot(n.state)&&f.handleExpansion(e),k||f.handleSelection(e))}),onMouseDown:A(t),status:g});var o;["expanded","selected","focused","disabled","editing","editable"].forEach(e=>{g[e]&&(r[`data-${e}`]="")});const i=m.content?.(ku({},C,{externalEventHandlers:t}))??{};return ku({},r,i)},getGroupTransitionProps:(e={})=>ku({},Ru(e),{unmountOnExit:!0,component:"ul",role:"group",in:g.expanded,children:c},e),getIconContainerProps:(e={})=>{const t=Ru(e);return ku({},t,e,{onClick:(r=t,e=>{r.onClick?.(e),e.defaultMuiPrevented||"iconContainer"===Xp.triggerSlot(n.state)&&f.handleExpansion(e)})});var r},getCheckboxProps:(e={})=>{const t=Ru(e),r=ku({},t,{ref:S,"aria-hidden":!0},e),o=m.checkbox?.(ku({},C,{externalEventHandlers:t}))??{};return ku({},r,o)},getLabelProps:(e={})=>{const t=ku({},Ru(e)),r=ku({},t,{children:d},e,{onDoubleClick:(o=t,e=>{o.onDoubleClick?.(e),e.defaultMuiPrevented||f.toggleItemEditing()})});var o;const n=m.label?.(ku({},C,{externalEventHandlers:t}))??{};return ku({},n,r)},getLabelInputProps:(e={})=>{const t=Ru(e),r=m.labelInput?.(ku({},C,{externalEventHandlers:t}))??{};return ku({},e,r)},getDragAndDropOverlayProps:(e={})=>{const t=Ru(e),r=m.dragAndDropOverlay?.(ku({},C,{externalEventHandlers:t}))??{};return ku({},e,r)},getErrorContainerProps:(e={})=>ku({},Ru(e),e),getLoadingContainerProps:(e={})=>ku({size:"12px",thickness:6},Ru(e),e),rootRef:v,status:g,publicAPI:o}};function Zm(e){return Hu("MuiTreeItem",e)}Vu("MuiTreeItem",["root","content","groupTransition","iconContainer","label","checkbox","labelInput","dragAndDropOverlay","errorIcon","loadingIcon","expanded","selected","focused","disabled","editable","editing"]);const $m=lr(de("path",{d:"M10 6 8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"}),"TreeViewExpandIcon"),_m=lr(de("path",{d:"M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z"}),"TreeViewCollapseIcon"),ef=["ownerState"];function tf(e,t,r){return void 0!==e?e:void 0!==t?t:r}function rf(e){const{slots:t,slotProps:r,status:o}=e,{slots:n,slotProps:i}=qu(),a={collapseIcon:tf(t?.collapseIcon,n.collapseIcon,_m),expandIcon:tf(t?.expandIcon,n.expandIcon,$m),endIcon:tf(t?.endIcon,n.endIcon),icon:t?.icon};let l;l=a?.icon?"icon":o.expandable?o.expanded?"collapseIcon":"expandIcon":"endIcon";const s=a[l],d=Yu(Ou({elementType:s,externalSlotProps:e=>ku({},Pu(i[l],e),Pu(r?.[l],e)),ownerState:{}}),ef);return s?de(s,ku({},d)):null}"production"!==process.env.NODE_ENV&&(rf.propTypes={slotProps:Hi.object,slots:Hi.object,status:Hi.shape({disabled:Hi.bool.isRequired,editable:Hi.bool.isRequired,editing:Hi.bool.isRequired,error:Hi.bool.isRequired,expandable:Hi.bool.isRequired,expanded:Hi.bool.isRequired,focused:Hi.bool.isRequired,loading:Hi.bool.isRequired,selected:Hi.bool.isRequired}).isRequired});const of=or("div",{name:"MuiTreeItemDragAndDropOverlay",slot:"Root",shouldForwardProp:e=>qm(e)&&"action"!==e})(({theme:e})=>({position:"absolute",left:0,display:"flex",top:0,bottom:0,right:0,pointerEvents:"none",variants:[{props:{action:"make-child"},style:{marginLeft:"calc(var(--TreeView-indentMultiplier) * var(--TreeView-itemDepth))",borderRadius:e.shape.borderRadius,backgroundColor:e.vars?`rgba(${e.vars.palette.primary.darkChannel} / ${e.vars.palette.action.focusOpacity})`:nr(e.palette.primary.dark,e.palette.action.focusOpacity)}},{props:{action:"reorder-above"},style:{marginLeft:"calc(var(--TreeView-indentMultiplier) * var(--TreeView-itemDepth))",borderTop:`1px solid ${(e.vars||e).palette.action.active}`}},{props:{action:"reorder-below"},style:{marginLeft:"calc(var(--TreeView-indentMultiplier) * var(--TreeView-itemDepth))",borderBottom:`1px solid ${(e.vars||e).palette.action.active}`}},{props:{action:"move-to-parent"},style:{marginLeft:"calc(var(--TreeView-indentMultiplier) * calc(var(--TreeView-itemDepth) - 1))",borderBottom:`1px solid ${(e.vars||e).palette.action.active}`}}]}));function nf(e){return null==e.action?null:de(of,ku({},e))}function af(t){const{children:r,itemId:o,id:n}=t,{wrapItem:i,store:a}=Xu(),l=Ap(a,Ep.treeItemIdAttribute,o,n);return de(e.Fragment,{children:i({children:r,itemId:o,store:a,idAttribute:l})})}"production"!==process.env.NODE_ENV&&(nf.propTypes={action:Hi.oneOf(["make-child","move-to-parent","reorder-above","reorder-below"]),style:Hi.object}),"production"!==process.env.NODE_ENV&&(af.propTypes={children:Hi.node,id:Hi.string,itemId:Hi.string.isRequired});const lf=or("input",{name:"MuiTreeItem",slot:"LabelInput"})(({theme:e})=>ku({},e.typography.body1,{width:"100%",backgroundColor:(e.vars||e).palette.background.paper,borderRadius:e.shape.borderRadius,border:"none",padding:"0 2px",boxSizing:"border-box","&:focus":{outline:`1px solid ${(e.vars||e).palette.primary.main}`}})),sf=["visible"],df=["id","itemId","label","disabled","disableSelection","children","slots","slotProps","classes"],cf=Wu(),uf=or("li",{name:"MuiTreeItem",slot:"Root"})({listStyle:"none",margin:0,padding:0,outline:0}),pf=or("div",{name:"MuiTreeItem",slot:"Content",shouldForwardProp:e=>qm(e)&&"status"!==e})(({theme:e})=>({padding:e.spacing(.5,1),paddingLeft:`calc(${e.spacing(1)} + var(--TreeView-itemChildrenIndentation) * var(--TreeView-itemDepth))`,borderRadius:e.shape.borderRadius,width:"100%",boxSizing:"border-box",position:"relative",display:"flex",alignItems:"center",gap:e.spacing(1),cursor:"pointer",WebkitTapHighlightColor:"transparent","&:hover":{backgroundColor:(e.vars||e).palette.action.hover,"@media (hover: none)":{backgroundColor:"transparent"}},"&[data-disabled]":{opacity:(e.vars||e).palette.action.disabledOpacity,backgroundColor:"transparent",cursor:"auto"},"&[data-focused]":{backgroundColor:(e.vars||e).palette.action.focus},"&[data-selected]":{backgroundColor:e.vars?`rgba(${e.vars.palette.primary.mainChannel} / ${e.vars.palette.action.selectedOpacity})`:nr(e.palette.primary.main,e.palette.action.selectedOpacity),"&:hover":{backgroundColor:e.vars?`rgba(${e.vars.palette.primary.mainChannel} / calc(${e.vars.palette.action.selectedOpacity} + ${e.vars.palette.action.hoverOpacity}))`:nr(e.palette.primary.main,e.palette.action.selectedOpacity+e.palette.action.hoverOpacity),"@media (hover: none)":{backgroundColor:e.vars?`rgba(${e.vars.palette.primary.mainChannel} / ${e.vars.palette.action.selectedOpacity})`:nr(e.palette.primary.main,e.palette.action.selectedOpacity)}}},"&[data-selected][data-focused]":{backgroundColor:e.vars?`rgba(${e.vars.palette.primary.mainChannel} / calc(${e.vars.palette.action.selectedOpacity} + ${e.vars.palette.action.focusOpacity}))`:nr(e.palette.primary.main,e.palette.action.selectedOpacity+e.palette.action.focusOpacity)}})),hf=or("div",{name:"MuiTreeItem",slot:"Label",shouldForwardProp:e=>qm(e)&&"editable"!==e})(({theme:e})=>ku({width:"100%",boxSizing:"border-box",minWidth:0,position:"relative",overflow:"hidden"},e.typography.body1,{variants:[{props:({editable:e})=>e,style:{paddingLeft:"2px"}}]})),mf=or("div",{name:"MuiTreeItem",slot:"IconContainer"})({width:16,display:"flex",flexShrink:0,justifyContent:"center",position:"relative",cursor:"inherit","& svg":{fontSize:18}}),ff=or(ir,{name:"MuiTreeItem",slot:"GroupTransition",overridesResolver:(e,t)=>t.groupTransition})({margin:0,padding:0}),gf=or("div",{name:"MuiTreeItem",slot:"ErrorIcon"})({position:"absolute",right:-3,width:7,height:7,borderRadius:"50%",backgroundColor:"red"}),xf=or(Vt,{name:"MuiTreeItem",slot:"LoadingIcon"})({color:"text.primary"}),bf=or(e.forwardRef((e,t)=>{const{visible:r}=e,o=Yu(e,sf);return r?de(ar,ku({},o,{ref:t})):null}),{name:"MuiTreeItem",slot:"Checkbox"})({padding:0});"production"!==process.env.NODE_ENV&&(bf.displayName="TreeItemCheckbox");const vf=e.forwardRef(function(e,t){const r=cf({props:e,name:"MuiTreeItem"}),{id:o,itemId:n,label:i,disabled:a,disableSelection:l,children:s,slots:d={},slotProps:c={},classes:u}=r,p=Yu(r,df),{getContextProviderProps:h,getRootProps:m,getContentProps:f,getIconContainerProps:g,getCheckboxProps:x,getLabelProps:b,getGroupTransitionProps:v,getLabelInputProps:y,getDragAndDropOverlayProps:S,getErrorContainerProps:k,getLoadingContainerProps:B,status:w}=Ym({id:o,itemId:n,children:s,label:i,disabled:a,disableSelection:l}),C=(e=>{const{classes:t}=qu();return Iu({root:["root"],content:["content"],iconContainer:["iconContainer"],checkbox:["checkbox"],label:["label"],groupTransition:["groupTransition"],labelInput:["labelInput"],dragAndDropOverlay:["dragAndDropOverlay"],errorIcon:["errorIcon"],loadingIcon:["loadingIcon"],expanded:["expanded"],editing:["editing"],editable:["editable"],selected:["selected"],focused:["focused"],disabled:["disabled"]},Zm,ku({},e,{root:zu(e?.root,t.root),content:zu(e?.content,t.itemContent),iconContainer:zu(e?.iconContainer,t.itemIconContainer),checkbox:zu(e?.checkbox,t.itemCheckbox),label:zu(e?.label,t.itemLabel),groupTransition:zu(e?.groupTransition,t.itemGroupTransition),labelInput:zu(e?.labelInput,t.itemLabelInput),dragAndDropOverlay:zu(e?.dragAndDropOverlay,t.itemDragAndDropOverlay),errorIcon:zu(e?.errorIcon,t.itemErrorIcon),loadingIcon:zu(e?.loadingIcon,t.itemLoadingIcon)}))})(u),T=d.root??uf,I=Ou({elementType:T,getSlotProps:m,externalForwardedProps:p,externalSlotProps:c.root,additionalProps:{ref:t},ownerState:{},className:C.root}),A=d.content??pf,z=Ou({elementType:A,getSlotProps:f,externalSlotProps:c.content,ownerState:{},className:zu(C.content,w.expanded&&C.expanded,w.selected&&C.selected,w.focused&&C.focused,w.disabled&&C.disabled,w.editing&&C.editing,w.editable&&C.editable)}),R=d.iconContainer??mf,E=Ou({elementType:R,getSlotProps:g,externalSlotProps:c.iconContainer,ownerState:{},className:C.iconContainer}),P=d.label??hf,O=Ou({elementType:P,getSlotProps:b,externalSlotProps:c.label,ownerState:{},className:C.label}),L=d.checkbox??bf,M=Ou({elementType:L,getSlotProps:x,externalSlotProps:c.checkbox,ownerState:{},className:C.checkbox}),W=d.groupTransition??void 0,D=Ou({elementType:W,getSlotProps:v,externalSlotProps:c.groupTransition,ownerState:{},className:C.groupTransition}),F=d.labelInput??lf,N=Ou({elementType:F,getSlotProps:y,externalSlotProps:c.labelInput,ownerState:{},className:C.labelInput}),H=d.dragAndDropOverlay??nf,V=Ou({elementType:H,getSlotProps:S,externalSlotProps:c.dragAndDropOverlay,ownerState:{},className:C.dragAndDropOverlay}),Q=d.errorIcon??gf,j=Ou({elementType:Q,getSlotProps:k,externalSlotProps:c.errorIcon,ownerState:{},className:C.errorIcon}),G=d.loadingIcon??xf,U=Ou({elementType:G,getSlotProps:B,externalSlotProps:c.loadingIcon,ownerState:{},className:C.loadingIcon});return de(af,ku({},h(),{children:ce(T,ku({},I,{children:[ce(A,ku({},z,{children:[ce(R,ku({},E,{children:[w.error&&de(Q,ku({},j)),w.loading?de(G,ku({},U)):de(rf,{status:w,slots:d,slotProps:c})]})),de(L,ku({},M)),w.editing?de(F,ku({},N)):de(P,ku({},O)),de(H,ku({},V))]})),s&&de(ff,ku({as:W},D))]}))}))});"production"!==process.env.NODE_ENV&&(vf.displayName="TreeItem"),"production"!==process.env.NODE_ENV&&(vf.propTypes={children:Hi.any,classes:Hi.object,className:Hi.string,disabled:Hi.bool,disableSelection:Hi.bool,id:Hi.string,itemId:Hi.string.isRequired,label:Hi.node,onBlur:Hi.func,onFocus:function(e,t,r,o,n){if("production"===process.env.NODE_ENV)return null;const i=n||t;return void 0!==e[t]?new Error(`The prop \`${i}\` is not supported. Please remove it.`):null},onKeyDown:Hi.func,slotProps:Hi.object,slots:Hi.object,sx:Hi.oneOfType([Hi.arrayOf(Hi.oneOfType([Hi.func,Hi.object,Hi.bool])),Hi.func,Hi.object])});const yf=e=>e.charAt(0).toUpperCase()+e.slice(1),Sf={compact:{minHeight:"24px",fontSize:"13px",py:"2px",px:"10px",iconSize:16,gap:"6px"},default:{minHeight:"32px",fontSize:"14px",py:"4px",px:"12px",iconSize:18,gap:"8px"}},kf={none:{},slide:{"& .MuiCollapse-root":{transition:"all 0.25s ease"}},spring:{"& .MuiCollapse-root":{transition:"all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1)"}}};function Bf(e){return{outline:"none","&.Mui-focused > .MuiTreeItem-content":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"-3px"},"&:focus-visible > .MuiTreeItem-content":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"-3px"},"& > .MuiTreeItem-content":{minHeight:e.minHeight,fontSize:e.fontSize,fontFamily:"inherit",color:"var(--Quiet)",padding:"0 8px",borderRadius:"var(--Style-Border-Radius)",border:"1px solid transparent",transition:"color 0.15s ease, border-color 0.15s ease, background-color 0.15s ease",backgroundColor:"transparent",outline:"none","&:hover":{color:"var(--Text)",backgroundColor:"var(--Hover)"},"&:active":{color:"var(--Text)",backgroundColor:"var(--Pressed)"},"&.Mui-selected":{color:"var(--Text)",fontWeight:600,backgroundColor:"var(--Pressed)",padding:"0 8px","&:hover":{backgroundColor:"var(--Hover)"}},"&.Mui-disabled":{opacity:.45}},"& > .MuiTreeItem-content .MuiTreeItem-label":{fontSize:e.fontSize,fontFamily:"inherit",lineHeight:e.minHeight,padding:0,width:"100%"},"& > .MuiTreeItem-content .MuiTreeItem-iconContainer":{width:e.iconSize+"px",color:"inherit",zIndex:1},"& > .MuiTreeItem-group":{marginLeft:"12px",borderLeft:"1px solid var(--Border)",paddingLeft:"8px"}}}function wf({item:e,d:t,isCompact:r}){const o=r?bo:ao;return ce(h,{sx:{display:"flex",alignItems:"center",gap:t.gap,width:"100%"},children:[e.icon&&de(jo,{size:"small",sx:{color:"inherit",flexShrink:0},children:e.icon}),de(o,{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",color:"inherit",fontWeight:"inherit"},children:e.label}),e.badge&&de(h,{sx:{flexShrink:0},children:e.badge})]})}function Cf(e=[],t="default",r="primary",o="default",n=[]){const i=Sf[t]||Sf.default,a="compact"===t;return yf(r),e.map(e=>de(vf,{itemId:e.id,disabled:e.disabled,label:de(wf,{item:e,d:i,isCompact:a}),sx:{...Bf(i),...e.sx||{}},children:e.children&&e.children.length>0?Cf(e.children,t,r,o,n):null},e.id))}function Tf({color:e="default",variant:t="solid",density:o="default",animation:i="slide",selectionStyle:a,items:l=If,selectionMode:s="single",checkboxSelection:d=!1,disableSelection:c=!1,disabledItemsFocusable:u=!1,defaultExpandedItems:p,expandedItems:m,onExpandedItemsChange:f,selectedItems:g,onSelectedItemsChange:x,onItemExpansionToggle:b,onItemSelectionToggle:v,slots:y,"aria-label":S="Tree view",className:k="",sx:B={},...w}){const C=a||t,T=yf(e),I="light"===C?"Surface-Brightest":"Surface-Dim",[A,z]=r(g||("multi"===s?[]:null)),R=void 0!==g?g:A,E=Array.isArray(R)?R:R?[R]:[],P=n((e,t)=>{void 0===g&&z(t),x?.(e,t)},[g,x]),O={};return void 0!==m&&(O.expandedItems=m),void 0!==f&&(O.onExpandedItemsChange=f),void 0!==p&&(O.defaultExpandedItems=p),de(h,{"data-theme":T,"data-surface":I,className:"omni-treeview omni-treeview-"+C+" omni-treeview-"+e+" omni-treeview-"+o+(k?" "+k:""),sx:{backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",overflow:"hidden",...kf[i]||{},...B},children:de(Lh,{"aria-label":S,multiSelect:"multi"===s,checkboxSelection:d,disableSelection:c,disabledItemsFocusable:u,selectedItems:R,onSelectedItemsChange:P,onItemExpansionToggle:b,onItemSelectionToggle:v,slots:{expandIcon:()=>de(jo,{size:"small",sx:{color:"inherit"},children:de(Kt,{})}),collapseIcon:()=>de(jo,{size:"small",sx:{color:"inherit"},children:de(Se,{})}),...y},sx:{p:"8px","& .MuiTreeItem-root":{fontFamily:"inherit"},"& .MuiTreeItem-content.Mui-focused":{outline:"none"},"& .MuiTreeItem-content:focus-visible":{outline:"none"}},...O,...w,children:Cf(l,o,e,C,E)})})}const If=[{id:"1",label:"Design System",children:[{id:"1-1",label:"Foundations",children:[{id:"1-1-1",label:"Colors"},{id:"1-1-2",label:"Typography"},{id:"1-1-3",label:"Spacing"}]},{id:"1-2",label:"Components",children:[{id:"1-2-1",label:"Buttons"},{id:"1-2-2",label:"Inputs"},{id:"1-2-3",label:"Navigation",disabled:!0}]}]},{id:"2",label:"Tokens",children:[{id:"2-1",label:"Light Mode"},{id:"2-2",label:"Dark Mode"}]},{id:"3",label:"Changelog"}],Af=e=>de(Tf,{variant:"solid",...e}),zf=e=>de(Tf,{variant:"light",...e}),Rf=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",Ef=[{id:"home",label:"Home"},{id:"products",label:"Products",children:[{id:"featured",label:"Featured"},{id:"new",label:"New Arrivals"},{id:"sale",label:"On Sale"}]},{id:"about",label:"About"},{id:"contact",label:"Contact"}];function Pf({label:e,selected:t,onClick:r}){return de(An,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function Of(){const[e,t]=r(!1),[o,n]=r("medium"),[i,a]=r("left"),[l,s]=r(null),[d,c]=r("Surface");return ce(h,{sx:{pb:8},children:[de(Jr,{children:"Drawer"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ci,{theme:l,surface:d,children:de(An,{variant:"default",onClick:()=>t(!0),children:"Open Drawer"})}),de(Qi,{code:(()=>{const e=["open={open}","onClose={handleClose}"];return"medium"!==o&&e.push('size="'+o+'"'),"left"!==i&&e.push('anchor="'+i+'"'),"<Drawer "+e.join(" ")+">\n <DrawerHeader>\n <H5>Navigation</H5>\n <DrawerClose onClick={handleClose} />\n </DrawerHeader>\n <DrawerContent>\n <OmniTreeView items={navItems} />\n </DrawerContent>\n</Drawer>"})(),language:"JSX",wrap:!0,sx:{mt:2}}),ce(bu,{open:e,onClose:()=>t(!1),size:o,anchor:i,children:[ce(yu,{children:[de(Zr,{children:"Navigation"}),de(vu,{onClick:()=>t(!1)})]}),de(Su,{children:de(Tf,{items:Ef,variant:"solid",color:"default",defaultExpandedItems:["products"],sx:{border:"none",borderRadius:0}})})]})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(ai,{defaultValue:0,variant:"standard",color:"primary",children:[ce(li,{children:[de(si,{children:"Playground"}),de(si,{children:"Accessibility"})]}),de(di,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(mi,{theme:l,onThemeChange:s,surface:d,onSurfaceChange:c})}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",spacing:1,children:["small","medium","large"].map(e=>de(Pf,{label:Rf(e),selected:o===e,onClick:()=>n(e)},e))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"ANCHOR"}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:["left","right","top","bottom"].map(e=>de(Pf,{label:Rf(e),selected:i===e,onClick:()=>a(e)},e))})]})]})}),de(di,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Role",value:'role="dialog" aria-modal="true"'},{label:"Focus",value:"Focus trapped inside drawer. Returns to trigger on close."},{label:"Keyboard",value:"Escape closes. Tab cycles focusable elements."},{label:"Backdrop",value:"Click closes. Body scroll locked while open."},{label:"Close",value:'Button with aria-label="Close drawer"'}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ao,{children:[e,":"]}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}const Lf={small:{minHeight:"120px",padding:"16px",iconSize:"20px",gap:1},medium:{minHeight:"200px",padding:"32px 24px",iconSize:"32px",gap:2},large:{minHeight:"300px",padding:"48px 24px",iconSize:"48px",gap:3}};function Mf({onFiles:e,accept:t,multiple:i=!1,size:a="medium",disabled:l=!1,icon:s,label:d,sublabel:c,children:u,className:p="",sx:m={},...f}){const[g,x]=r(!1),b=o(null),v=o(0),y=Lf[a]||Lf.medium,S=n(t=>{!l&&t?.length&&e?.(Array.from(t))},[l,e]),k=n(e=>{e.preventDefault(),e.stopPropagation(),v.current=0,x(!1),l||S(e.dataTransfer.files)},[l,S]),B=n(e=>{e.preventDefault(),e.stopPropagation()},[]),w=n(e=>{e.preventDefault(),e.stopPropagation(),v.current++,l||x(!0)},[l]),C=n(e=>{e.preventDefault(),e.stopPropagation(),v.current--,0===v.current&&x(!1)},[]),T=n(()=>{l||b.current?.click()},[l]),I=n(e=>{l||"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),b.current?.click())},[l]),A=n(e=>{S(e.target.files),e.target.value=""},[S]),z=s||sr,R=i?"Drag and drop files here":"Drag and drop file here";return ce(h,{role:"button",tabIndex:l?-1:0,"aria-label":d||R,"aria-disabled":l||void 0,onClick:T,onKeyDown:I,onDrop:k,onDragOver:B,onDragEnter:w,onDragLeave:C,className:"drop-zone drop-zone-"+a+(g?" drop-zone-dragging":"")+(l?" drop-zone-disabled":"")+" "+p,sx:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",gap:y.gap,minHeight:y.minHeight,padding:y.padding,border:"2px dashed",borderColor:g?"var(--Buttons-Primary-Border)":"var(--Buttons-Default-Border)",borderRadius:"32px",backgroundColor:g?"var(--Hover)":"transparent",color:"var(--Text)",cursor:l?"not-allowed":"pointer",opacity:l?.5:1,outline:"none",transition:"background-color 0.2s ease, border-color 0.2s ease",textAlign:"center",...!l&&{"&:hover":{backgroundColor:"var(--Hover)",borderColor:"var(--Buttons-Primary-Border)"},"&:active":{backgroundColor:"var(--Pressed)",borderColor:"var(--Buttons-Primary-Border)"},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"2px",borderColor:"var(--Buttons-Primary-Border)"}},...m},...f,children:[de("input",{ref:b,type:"file",accept:t,multiple:i,onChange:A,style:{display:"none"},"aria-hidden":"true",tabIndex:-1}),u||ce(ue,{children:[de(z,{sx:{fontSize:y.iconSize,color:"var(--Text-Quiet)"}}),de(ao,{style:{color:"var(--Text)"},children:d||R}),de(bo,{style:{color:"var(--Text-Quiet)"},children:c||"or click to browse"})]})]})}const Wf={small:{px:"12px",py:"8px",fontSize:"13px",iconSize:"18px",gap:"8px"},medium:{px:"16px",py:"12px",fontSize:"14px",iconSize:"20px",gap:"10px"},large:{px:"20px",py:"14px",fontSize:"16px",iconSize:"22px",gap:"12px"}};function Df({children:e,variant:t="light",color:r="info",size:o="medium",startDecorator:n,endDecorator:i,className:a="",sx:l={},...s}){const d=(e=>e.charAt(0).toUpperCase()+e.slice(1))("default"===r?"Default":r),c=Wf[o]||Wf.medium,u="default"===r?"Default":d,p="light"===t?"Surface-Brightest":"Surface",m="var(--Buttons-"+d+"-Border)",f=ce(ue,{children:[n&&de(h,{className:"alert-start-decorator",sx:{display:"inline-flex",alignItems:"center",fontSize:c.iconSize,lineHeight:1,flexShrink:0,mt:"2px"},children:n}),de(h,{className:"alert-message",sx:{flex:1,minWidth:0},children:"string"==typeof e?de("small"===o?ao:co,{children:e}):e}),i&&de(h,{className:"alert-end-decorator",sx:{display:"inline-flex",alignItems:"flex-start",flexShrink:0,gap:c.gap,paddingTop:"2px"},children:i})]});return de(h,{role:"alert",className:"alert alert-"+t+" alert-"+o+" alert-"+r+" "+a,sx:{border:"1px solid "+m,borderRadius:"var(--Style-Border-Radius)",overflow:"hidden",boxShadow:ln,...l},...s,children:de(h,{"data-theme":u,"data-surface":p,className:"alert-inner",sx:{display:"flex",alignItems:"flex-start",gap:c.gap,padding:c.py+" "+c.px,fontSize:c.fontSize,fontFamily:"inherit",lineHeight:1.5,color:"var(--Text)",backgroundColor:"var(--Background)",borderRadius:"calc(var(--Style-Border-Radius) - 1px)"},children:f})})}const Ff=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",Nf=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}],Hf={info:de(ve,{}),success:de(ge,{}),warning:de(xe,{}),error:de(be,{})};function Vf({label:e,selected:t,onClick:r}){return de(An,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function Qf({color:e,selected:t,onClick:r}){const o=Ff(e);return de(h,{component:"button",onClick:()=>r(e),"aria-label":"Select "+o,"aria-pressed":t,title:o,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+o+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Buttons-"+o+"-Text)",pointerEvents:"none"}})})}function jf(){const[e,t]=r("light"),[o,n]=r("info"),[i,a]=r("medium"),[l,s]=r(!0),[d,c]=r(null),[u,p]=r("Surface"),m=l&&Hf[o]?de(jo,{size:"small",sx:{color:"inherit"},children:Hf[o]}):void 0;return ce(h,{sx:{pb:8},children:[de(Jr,{children:"Alert"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ci,{theme:d,surface:u,children:de(h,{sx:{width:"100%",maxWidth:480},children:de(Df,{variant:e,color:o,size:i,startDecorator:m,children:"This is an alert message. Check the details for more information."})})}),de(Qi,{code:(()=>{const t=['variant="'+e+'"'];return"info"!==o&&t.push('color="'+o+'"'),"medium"!==i&&t.push('size="'+i+'"'),l&&Hf[o]&&t.push("startDecorator={<Icon><"+Ff(o)+"Icon /></Icon>}"),"<Alert "+t.join(" ")+">\n This is an alert message.\n</Alert>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(ai,{defaultValue:0,variant:"standard",color:"primary",children:[ce(li,{children:[de(si,{children:"Playground"}),de(si,{children:"Accessibility"})]}),de(di,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(mi,{theme:d,onThemeChange:c,surface:u,onSurfaceChange:p})}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"STYLE"}),de(B,{direction:"row",spacing:1,children:["solid","light"].map(r=>de(Vf,{label:Ff(r),selected:e===r,onClick:()=>t(r)},r))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:Nf.map(e=>ce(h,{children:[de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:e.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:e.colors.map(e=>de(Qf,{color:e,selected:o===e,onClick:n},e))})]},e.label))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",spacing:1,children:["small","medium","large"].map(e=>de(Vf,{label:Ff(e),selected:i===e,onClick:()=>a(e)},e))})]}),ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Show Icon"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Start decorator icon"})]}),de(ra,{variant:"default-outline",checked:l,onChange:e=>s(e.target.checked),size:"small","aria-label":"Show icon"})]})]})}),de(di,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Role",value:'role="alert" — live region, announced immediately'},{label:"Border",value:"var(--Buttons-{Color}-Border) on outer shell"},{label:"Shadow",value:"var(--Effect-Level-3)"},{label:"Icons",value:"Decorative — aria-hidden by default via Icon component"}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ao,{children:[e,":"]}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}const Gf={small:{px:"12px",py:"8px",fontSize:"13px",gap:"8px",minWidth:"240px"},medium:{px:"16px",py:"10px",fontSize:"14px",gap:"12px",minWidth:"300px"},large:{px:"20px",py:"14px",fontSize:"16px",gap:"16px",minWidth:"360px"}};function Uf({children:e,open:t=!1,onClose:r,variant:a="light",color:l="info",size:s="medium",anchor:d="bottom",autoHideDuration:c,startDecorator:u,endDecorator:p,action:m,className:f="",sx:g={},...x}){const b=o(null),v=(e=>e.charAt(0).toUpperCase()+e.slice(1))("default"===l?"Default":l),y=Gf[s]||Gf.medium,S="small"===s?ao:co,k="default"===l?"Default":v,B="light"===a?"Surface-Brightest":"Surface",w="var(--Buttons-"+v+"-Border)";i(()=>{if(t&&c&&c>0)return b.current=setTimeout(()=>{r?.({},"timeout")},c),()=>clearTimeout(b.current)},[t,c,r]),i(()=>{if(!t)return;const e=e=>{"Escape"===e.key&&r?.(e,"escapeKeyDown")};return document.addEventListener("keydown",e),()=>document.removeEventListener("keydown",e)},[t,r]);const C=n(()=>{b.current&&clearTimeout(b.current)},[]),T=n(()=>{t&&c&&c>0&&(b.current=setTimeout(()=>{r?.({},"timeout")},c))},[t,c,r]),I="top"===d?{from:{transform:"translateX(-50%) translateY(-120%)"},to:{transform:"translateX(-50%) translateY(0)"}}:{from:{transform:"translateX(-50%) translateY(120%)"},to:{transform:"translateX(-50%) translateY(0)"}};return t?de(h,{role:"alert","aria-live":"polite","aria-atomic":"true",onMouseEnter:C,onMouseLeave:T,className:"snackbar snackbar-"+a+" snackbar-"+s+" snackbar-"+d+" snackbar-"+l+" "+f,sx:{position:"fixed",left:"50%",transform:"translateX(-50%)",..."top"===d?{top:"16px"}:{bottom:"16px"},zIndex:1400,minWidth:y.minWidth,maxWidth:"min(560px, calc(100vw - 32px))",border:"1px solid "+w,borderRadius:"var(--Style-Border-Radius)",boxShadow:ln,overflow:"hidden",animation:"snackbar-slide-in 0.3s ease forwards","@keyframes snackbar-slide-in":I,...g},...x,children:ce(h,{"data-theme":k,"data-surface":B,sx:{display:"flex",alignItems:"center",gap:y.gap,padding:y.py+" "+y.px,fontSize:y.fontSize,fontFamily:"inherit",lineHeight:1.4,color:"var(--Text)",backgroundColor:"var(--Background)",borderRadius:"calc(var(--Style-Border-Radius) - 1px)"},children:[u&&de(h,{sx:{display:"inline-flex",flexShrink:0,lineHeight:1},children:u}),de(h,{sx:{flex:1,minWidth:0},children:"string"==typeof e?de(S,{children:e}):e}),m&&de(h,{sx:{display:"inline-flex",flexShrink:0},children:m}),p&&de(h,{sx:{display:"inline-flex",flexShrink:0,lineHeight:1},children:p}),r&&de(An,{iconOnly:!0,variant:"ghost",size:"small",onClick:e=>r(e,"closeClick"),"aria-label":"Close notification",sx:{flexShrink:0,ml:"4px"},children:de(jo,{size:"small",children:de(Ot,{})})})]})}):null}const Xf=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",Kf=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}],qf={info:de(ve,{}),success:de(ge,{}),warning:de(xe,{}),error:de(be,{})};function Jf({label:e,selected:t,onClick:r}){return de(An,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function Yf({color:e,selected:t,onClick:r}){const o=Xf(e);return de(h,{component:"button",onClick:()=>r(e),"aria-label":"Select "+o,"aria-pressed":t,title:o,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+o+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Buttons-"+o+"-Text)",pointerEvents:"none"}})})}function Zf(){const[e,t]=r("light"),[o,n]=r("info"),[i,a]=r("medium"),[l,s]=r("bottom"),[d,c]=r(!0),[u,p]=r(!0),[m,f]=r(!1),[g,x]=r(null),[b,v]=r("Surface"),y=d&&qf[o]?de(jo,{size:"small",sx:{color:"inherit"},children:qf[o]}):void 0;return ce(h,{sx:{pb:8},children:[de(Jr,{children:"Snackbar"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ci,{theme:g,surface:b,children:de(An,{variant:"default",onClick:()=>f(!0),children:"Show Snackbar"})}),de(Qi,{code:(()=>{const t=["open={open}"];return t.push('variant="'+e+'"'),"info"!==o&&t.push('color="'+o+'"'),"medium"!==i&&t.push('size="'+i+'"'),"bottom"!==l&&t.push('anchor="top"'),u&&t.push("onClose={handleClose}"),d&&qf[o]&&t.push("startDecorator={<Icon><"+Xf(o)+"Icon /></Icon>}"),"<Snackbar\n "+t.join("\n ")+"\n>\n Operation completed successfully.\n</Snackbar>"})(),language:"JSX",wrap:!0,sx:{mt:2}}),de(Uf,{open:m,onClose:u?()=>f(!1):void 0,variant:e,color:o,size:i,anchor:l,autoHideDuration:4e3,startDecorator:y,children:"Operation completed successfully."})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(ai,{defaultValue:0,variant:"standard",color:"primary",children:[ce(li,{children:[de(si,{children:"Playground"}),de(si,{children:"Accessibility"})]}),de(di,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(mi,{theme:g,onThemeChange:x,surface:b,onSurfaceChange:v})}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"STYLE"}),de(B,{direction:"row",spacing:1,children:["solid","light"].map(r=>de(Jf,{label:Xf(r),selected:e===r,onClick:()=>t(r)},r))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:Kf.map(e=>ce(h,{children:[de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:e.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:e.colors.map(e=>de(Yf,{color:e,selected:o===e,onClick:n},e))})]},e.label))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",spacing:1,children:["small","medium","large"].map(e=>de(Jf,{label:Xf(e),selected:i===e,onClick:()=>a(e)},e))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"ANCHOR"}),de(B,{direction:"row",spacing:1,children:["top","bottom"].map(e=>de(Jf,{label:Xf(e),selected:l===e,onClick:()=>s(e)},e))})]}),ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Show Icon"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Start decorator icon"})]}),de(ra,{variant:"default-outline",checked:d,onChange:e=>c(e.target.checked),size:"small","aria-label":"Show icon"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Close Button"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Show dismiss button"})]}),de(ra,{variant:"default-outline",checked:u,onChange:e=>p(e.target.checked),size:"small","aria-label":"Close button"})]})]})}),de(di,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Role",value:'role="alert" aria-live="polite" aria-atomic="true"'},{label:"Close",value:'Button with aria-label="Close notification"'},{label:"Keyboard",value:"Escape closes. Auto-hides after duration."},{label:"Hover",value:"Pauses auto-hide timer on mouse enter"},{label:"Border",value:"var(--Buttons-{Color}-Border) on outer shell"},{label:"Shadow",value:"var(--Effect-Level-3)"}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ao,{children:[e,":"]}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}const $f={default:"Default",primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",white:"Neutral",black:"Neutral",info:"Info",success:"Success",warning:"Warning",error:"Error"},_f={small:{diameter:24,thickness:3,fontSize:"9px",labelSize:"0px"},medium:{diameter:40,thickness:4,fontSize:"12px",labelSize:"12px"},large:{diameter:56,thickness:5,fontSize:"14px",labelSize:"14px"}};function eg({value:e,color:t="primary",size:r="medium",thickness:o,showValue:n=!1,children:i,className:l="",sx:s={},...d}){const c=$f[t]||"Primary",u=_f[r]||_f.medium,p=o||u.thickness,m=null!=e,f=m?Math.min(100,Math.max(0,e)):0,g=(u.diameter-p)/2,x=2*Math.PI*g,b=m?x-f/100*x:.75*x,v="var(--Buttons-"+c+"-Border)",y="cp-grad-"+a().replace(/:/g,"");return ce(h,{role:"progressbar","aria-valuenow":m?Math.round(f):void 0,"aria-valuemin":m?0:void 0,"aria-valuemax":m?100:void 0,"aria-label":m?Math.round(f)+"% progress":"Loading",className:"circular-progress circular-progress-"+r+" circular-progress-"+t+(m?" circular-progress-value":" circular-progress-indeterminate")+" "+l,sx:{position:"relative",display:"inline-flex",alignItems:"center",justifyContent:"center",width:u.diameter+"px",height:u.diameter+"px",flexShrink:0,...!m&&{animation:"circular-progress-spin 1.2s linear infinite","@keyframes circular-progress-spin":{"0%":{transform:"rotate(0deg)"},"100%":{transform:"rotate(360deg)"}}},...s},...d,children:[ce("svg",{viewBox:"0 0 "+u.diameter+" "+u.diameter,width:u.diameter,height:u.diameter,style:{position:"absolute",top:0,left:0,transform:"rotate(-90deg)"},children:[de("defs",{children:ce("linearGradient",{id:y,x1:"0%",y1:"0%",x2:"100%",y2:"0%",children:[de("stop",{offset:"0%",stopColor:v,stopOpacity:"0"}),de("stop",{offset:"100%",stopColor:v,stopOpacity:"1"})]})}),de("circle",{cx:u.diameter/2,cy:u.diameter/2,r:g,fill:"none",stroke:"var(--Border-Variant)",strokeWidth:p,className:"circular-progress-track"}),de("circle",{cx:u.diameter/2,cy:u.diameter/2,r:g,fill:"none",stroke:"url(#"+y+")",strokeWidth:p,strokeDasharray:x,strokeDashoffset:b,strokeLinecap:"round",className:"circular-progress-indicator",style:{transition:m?"stroke-dashoffset 0.4s ease":"none"}})]}),(n||i)&&m&&de(h,{className:"circular-progress-label","aria-hidden":"true",sx:{position:"relative",zIndex:1,fontSize:u.fontSize,fontWeight:700,fontFamily:"inherit",lineHeight:1,color:"var(--Text)",userSelect:"none"},children:i||Math.round(f)+"%"})]})}const tg=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",rg=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}];function og({label:e,selected:t,onClick:r}){return de(An,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function ng({color:e,selected:t,onClick:r}){const o=tg(e);return de(h,{component:"button",onClick:()=>r(e),"aria-label":"Select "+o,"aria-pressed":t,title:o,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+o+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Buttons-"+o+"-Text)",pointerEvents:"none"}})})}function ig(){const[e,t]=r("default"),[o,n]=r("medium"),[i,a]=r(!1),[l,s]=r(65),[d,c]=r(!1),[u,p]=r(null),[m,f]=r("Surface");return ce(h,{sx:{pb:8},children:[de(Jr,{children:"Circular Progress"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ci,{theme:u,children:de(eg,{color:e,size:o,value:i?l:void 0,showValue:i&&d})}),de(Qi,{code:(()=>{const t=[];return"default"!==e&&t.push('color="'+e+'"'),"medium"!==o&&t.push('size="'+o+'"'),i&&(t.push("value={"+l+"}"),d&&t.push("showValue")),0===t.length?"<CircularProgress />":"<CircularProgress\n "+t.join("\n ")+"\n/>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(ai,{defaultValue:0,variant:"standard",color:"primary",children:[ce(li,{children:[de(si,{children:"Playground"}),de(si,{children:"Accessibility"})]}),de(di,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(mi,{theme:u,onThemeChange:p,surface:m,onSurfaceChange:f})}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:rg.map(r=>ce(h,{children:[de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:r.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:r.colors.map(r=>de(ng,{color:r,selected:e===r,onClick:t},r))})]},r.label))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",spacing:1,children:["small","medium","large"].map(e=>de(og,{label:tg(e),selected:o===e,onClick:()=>n(e)},e))})]}),ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Determinate"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Show a static arc at a specific value"})]}),de(ra,{checked:i,onChange:e=>a(e.target.checked),size:"small","aria-label":"Determinate"})]}),i&&ce(ue,{children:[de(h,{sx:{mt:2},children:de(ms,{label:"Value",min:0,max:100,value:l,onChange:(e,t)=>s(t),size:"small",valueLabelDisplay:"auto"})}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Show Label"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Center percentage text"})]}),de(ra,{checked:d,onChange:e=>c(e.target.checked),size:"small","aria-label":"Show label"})]})]})]})}),de(di,{value:1,children:de(h,{sx:{p:3},children:ce(B,{spacing:3,children:[ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"ARIA and Semantics"}),ce(B,{spacing:0,children:[ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ao,{children:"Role:"}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:'role="progressbar"'})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ao,{children:"Determinate:"}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:'aria-valuenow, aria-valuemin="0", aria-valuemax="100"'})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ao,{children:"Indeterminate:"}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:'aria-label="Loading" (no value attributes)'})]}),ce(h,{sx:{py:1.5},children:[de(ao,{children:"Label:"}),de(bo,{style:{color:"var(--Text-Quiet)"},children:"Center percentage label is aria-hidden — screen readers use aria-valuenow."})]})]})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"Token Reference"}),ce(B,{spacing:0,children:[ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ao,{children:"Track (back circle):"}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:"var(--Border-Variant)"})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ao,{children:"Fill (progress arc):"}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:"var(--Buttons-{Color}-Border)"})]}),ce(h,{sx:{py:1.5},children:[de(ao,{children:"Center label:"}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:"var(--Text)"})]})]})]})]})})})]})})})]})]})}const ag={default:"Default",primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info",success:"Success",warning:"Warning",error:"Error"},lg={small:{height:"4px",borderRadius:"2px"},medium:{height:"6px",borderRadius:"3px"},large:{height:"8px",borderRadius:"4px"}};function sg({value:e,color:t="primary",size:r="medium",className:o="",sx:n={},...i}){const a=ag[t]||"Primary",l=lg[r]||lg.medium,s=null!=e,d=s?Math.min(100,Math.max(0,e)):0,c="var(--Buttons-"+a+"-Border)";return de(h,{role:"progressbar","aria-valuenow":s?Math.round(d):void 0,"aria-valuemin":s?0:void 0,"aria-valuemax":s?100:void 0,"aria-label":s?Math.round(d)+"% progress":"Loading",className:"linear-progress linear-progress-"+r+" linear-progress-"+t+(s?" linear-progress-determinate":" linear-progress-indeterminate")+" "+o,sx:{position:"relative",width:"100%",height:l.height,borderRadius:l.borderRadius,backgroundColor:"var(--Border-Variant)",overflow:"hidden",flexShrink:0,...n},...i,children:de(h,{className:"linear-progress-bar",sx:{position:"absolute",top:0,left:0,height:"100%",borderRadius:"inherit",backgroundColor:c,...s?{width:d+"%",transition:"width 0.4s ease"}:{width:"40%",animation:"linear-progress-slide 1.5s ease-in-out infinite","@keyframes linear-progress-slide":{"0%":{left:"-40%",width:"40%"},"50%":{left:"30%",width:"50%"},"100%":{left:"100%",width:"40%"}}}}})})}const dg=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",cg=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}];function ug({label:e,selected:t,onClick:r}){return de(An,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function pg({color:e,selected:t,onClick:r}){const o=dg(e);return de(h,{component:"button",onClick:()=>r(e),"aria-label":"Select "+o,"aria-pressed":t,title:o,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+o+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Buttons-"+o+"-Text)",pointerEvents:"none"}})})}function hg(){const[e,t]=r("default"),[o,n]=r("medium"),[i,a]=r(!1),[l,s]=r(65),[d,c]=r(null),[u,p]=r("Surface");return ce(h,{sx:{pb:8},children:[de(Jr,{children:"Linear Progress"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ci,{theme:d,surface:u,children:de(h,{sx:{width:"100%",maxWidth:400},children:de(sg,{color:e,size:o,value:i?l:void 0})})}),de(Qi,{code:(()=>{const t=[];return"default"!==e&&t.push('color="'+e+'"'),"medium"!==o&&t.push('size="'+o+'"'),i&&t.push("value={"+l+"}"),0===t.length?"<LinearProgress />":"<LinearProgress\n "+t.join("\n ")+"\n/>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(ai,{defaultValue:0,variant:"standard",color:"primary",children:[ce(li,{children:[de(si,{children:"Playground"}),de(si,{children:"Accessibility"})]}),de(di,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(mi,{theme:d,onThemeChange:c,surface:u,onSurfaceChange:p})}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:cg.map(r=>ce(h,{children:[de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:r.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:r.colors.map(r=>de(pg,{color:r,selected:e===r,onClick:t},r))})]},r.label))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",spacing:1,children:["small","medium","large"].map(e=>de(ug,{label:dg(e),selected:o===e,onClick:()=>n(e)},e))})]}),ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Determinate"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Show a static bar at a specific value"})]}),de(ra,{variant:"default-outline",checked:i,onChange:e=>a(e.target.checked),size:"small","aria-label":"Determinate"})]}),i&&de(h,{sx:{mt:2},children:de(ms,{label:"Value",min:0,max:100,value:l,onChange:(e,t)=>s(t),size:"small",valueLabelDisplay:"auto"})})]})}),de(di,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Role",value:'role="progressbar"'},{label:"Determinate",value:'aria-valuenow, aria-valuemin="0", aria-valuemax="100"'},{label:"Indeterminate",value:'aria-label="Loading" (no value attributes)'},{label:"Track",value:"var(--Border-Variant)"},{label:"Fill",value:"var(--Buttons-{Color}-Border)"}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ao,{children:[e,":"]}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}const mg=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]}],fg=["photo","icon","initials"],gg={photo:"Photo",icon:"Icon",initials:"Initials"},xg=["xxx-small","xx-small","x-small","small","medium","large","x-large","xx-large"],bg={"xxx-small":"XXXS","xx-small":"XXS","x-small":"XS",small:"Small",medium:"Medium",large:"Large","x-large":"XL","xx-large":"XXL"};function vg({label:e,selected:t,onClick:r}){return de(An,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function yg({color:e,selected:t,onClick:r}){const o=(n=e)?n.charAt(0).toUpperCase()+n.slice(1):"";var n;return de(h,{component:"button",onClick:()=>r(e),"aria-label":"Select "+o,"aria-pressed":t,title:o,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+o+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Buttons-"+o+"-Text)",pointerEvents:"none"}})})}function Sg(){const[e,t]=r("default"),[o,n]=r("medium"),[i,a]=r("initials"),[l,s]=r(!1),[d,c]=r(!1),[u,p]=r(!1),[m,f]=r(null),[g,x]=r("Surface"),b="photo"===i,v=()=>{const t={size:o,clickable:l,insideButton:d};return b||(t.color=e),"initials"===i&&(t.initials="LN"),"photo"===i&&(t.src="https://i.pravatar.cc/150?img=3",t.alt="User avatar"),t};return ce(h,{sx:{pb:8},children:[de(Jr,{children:"Avatar"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ci,{theme:m,surface:g,children:u?ce(Jo,{max:3,size:o,children:[de(qo,{...v()}),de(qo,{color:e,size:o,initials:"AB"}),de(qo,{color:e,size:o,initials:"CD"}),de(qo,{color:e,size:o,initials:"EF"})]}):de(qo,{...v()})}),de(Qi,{code:(()=>{const t=[];return b||"default"===e||t.push('color="'+e+'"'),"medium"!==o&&t.push('size="'+o+'"'),"initials"===i&&t.push('initials="LN"'),"photo"===i&&t.push('src="..." alt="User avatar"'),l&&t.push("clickable onClick={handleClick}"),d&&t.push("insideButton"),u?"<AvatarGroup max={3}>\n <Avatar "+t.join(" ")+' />\n <Avatar initials="AB" />\n <Avatar initials="CD" />\n <Avatar initials="EF" />\n</AvatarGroup>':"<Avatar "+t.join(" ")+" />"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(ai,{defaultValue:0,variant:"standard",color:"primary",children:[ce(li,{children:[de(si,{children:"Playground"}),de(si,{children:"Accessibility"})]}),de(di,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(mi,{theme:m,onThemeChange:f,surface:g,onSurfaceChange:x})}),ce(h,{sx:{opacity:b?.4:1,pointerEvents:b?"none":"auto"},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:mg.map(r=>ce(h,{children:[de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:r.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:r.colors.map(r=>de(yg,{color:r,selected:e===r,onClick:t},r))})]},r.label))}),b&&de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:8},children:"Color is ignored when the avatar shows a photo — the image carries the visual."})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:xg.map(e=>de(vg,{label:bg[e],selected:o===e,onClick:()=>n(e)},e))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"CONTENT"}),de(B,{direction:"row",spacing:1,children:fg.map(e=>de(vg,{label:gg[e],selected:i===e,onClick:()=>a(e)},e))})]}),ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Clickable"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Interactive with hover/focus states"})]}),de(ra,{variant:"default-outline",checked:l,onChange:e=>s(e.target.checked),size:"small","aria-label":"Clickable"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Inside Button"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Adds 2px horizontal margin so the avatar sits cleanly in a Button"})]}),de(ra,{variant:"default-outline",checked:d,onChange:e=>c(e.target.checked),size:"small","aria-label":"Inside Button"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Group"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Show as AvatarGroup with overflow"})]}),de(ra,{variant:"default-outline",checked:u,onChange:e=>p(e.target.checked),size:"small","aria-label":"Show group"})]})]})}),de(di,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Role",value:'role="img" (static) or role="button" (clickable)'},{label:"Label",value:'aria-label from alt, initials, or "Avatar"'},{label:"Image",value:"alt text on <img>. Falls back to initials or icon on error."},{label:"Clickable",value:"Rendered as <button>. Focus ring: 3px solid var(--Focus-Visible)."},{label:"Group",value:'role="group" aria-label="Avatar group, N avatars"'}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ao,{children:[e,":"]}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}const kg=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",Bg=["primary","secondary","tertiary","neutral","info","success","warning","error"];function wg({ratio:e,threshold:t}){if(!e)return de(bo,{style:{color:"var(--Text-Quiet)"},children:"--"});const r=parseFloat(e)>=t;return ce(h,{sx:{display:"inline-flex",alignItems:"center",gap:.5},children:[ce(h,{sx:{px:1,py:.25,borderRadius:"4px",backgroundColor:r?"var(--Tags-Success-BG)":"var(--Tags-Error-BG)",color:r?"var(--Tags-Success-Text)":"var(--Tags-Error-Text)",fontSize:"11px",fontWeight:700},children:[e,":1"]}),de(bo,{style:{color:r?"var(--Tags-Success-Text)":"var(--Tags-Error-Text)"},children:r?"Pass":"Fail"})]})}function Cg({label:e,ratio:t,threshold:r,note:o}){return ce(h,{sx:{display:"flex",justifyContent:"space-between",alignItems:"flex-start",py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(h,{sx:{flex:1},children:[de(ao,{style:{color:"var(--Text)"},children:e}),o&&de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:o})]}),de(wg,{ratio:t,threshold:r})]})}function Tg({color:e,selected:t,onClick:r}){const o=kg(e);return de(w,{title:o,arrow:!0,children:de(h,{onClick:()=>r(e),role:"button","aria-label":"Select "+o+" color","aria-pressed":t,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+o+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:24,color:"var(--Buttons-"+o+"-Text)",pointerEvents:"none"}})})})}function Ig({label:e,selected:t,onClick:r}){return de(h,{component:"button",onClick:r,sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",cursor:"pointer",border:"2px solid var(--Buttons-Primary-Button)",borderRadius:"var(--Style-Border-Radius)",backgroundColor:t?"var(--Buttons-Primary-Button)":"transparent",color:t?"var(--Buttons-Primary-Text)":"var(--Text)",padding:"4px 12px",fontSize:"14px",fontFamily:"inherit",fontWeight:500,whiteSpace:"nowrap",flexShrink:0,transition:"background-color 0.15s ease, color 0.15s ease","&:hover":{backgroundColor:t?"var(--Buttons-Primary-Hover)":"var(--Surface-Dim)"},"&:focus-visible":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"}},children:e})}function Ag(){const[e,t]=r(0),[o,n]=r("solid"),[a,l]=r("primary"),[s,d]=r("medium"),[c,u]=r("5"),[p,m]=r(!1),[f,g]=r(!1),[x,S]=r({}),k=()=>"solid"===o?a:a+"-"+o,w=()=>{if(p)return;const e=parseInt(c,10);return isNaN(e)||String(e)!==c.trim()?c||void 0:e};i(()=>{const e=kg(a),t={};"solid"===o?(t.badgeBg=Ki("--Buttons-"+e+"-Button"),t.badgeText=Ki("--Buttons-"+e+"-Text"),t.badgeBorder=null):"outline"===o?(t.badgeBg=Ki("--Background"),t.badgeText=Ki("--Text"),t.badgeBorder=Ki("--Buttons-"+e+"-Border")):"light"===o&&(t.badgeBg=Ki("--Buttons-"+e+"-Button"),t.badgeText=Ki("--Buttons-"+e+"-Text"),t.badgeBorder=Ki("--Buttons-"+e+"-Border")),t.background=Ki("--Background"),t.focusVisible=Ki("--Focus-Visible"),S(t)},[o,a]);const C={small:{badge:"16px",dot:"8px",font:"10px"},medium:{badge:"20px",dot:"10px",font:"12px"},large:{badge:"24px",dot:"12px",font:"14px"}};return ce(h,{sx:{width:"100%"},children:[de(Jr,{style:{marginBottom:8},children:"Badge"}),de(co,{color:"quiet",style:{marginBottom:24},children:"Small label attached to an element showing status or count. Solid, outline, and light variants across all 8 colors."}),ce(N,{value:e,onChange:(e,r)=>t(r),sx:{borderBottom:"1px solid var(--Border)",mb:0},children:[de(H,{label:"Playground"}),de(H,{label:"Accessibility"})]}),0===e&&ce(I,{container:!0,sx:{minHeight:400},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"calc((100vw - 432px) / 2)"},flexShrink:0},children:[de(h,{sx:{p:4,display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",minHeight:200,backgroundColor:"var(--Background)",borderBottom:"1px solid var(--Border)"},children:ce(B,{direction:"row",spacing:6,alignItems:"center",children:[de(en,{variant:k(),size:s,badgeContent:w(),dot:p,showZero:f,children:de(dr,{sx:{fontSize:32,color:"var(--Text-Quiet)"}})}),de(en,{variant:k(),size:s,badgeContent:w(),dot:p,showZero:f,children:de(Ae,{sx:{fontSize:32,color:"var(--Text-Quiet)"}})}),de(en,{variant:k(),size:s,badgeContent:w(),dot:p,showZero:f,children:de(Re,{sx:{fontSize:32,color:"var(--Text-Quiet)"}})})]})}),de(Qi,{code:(()=>{const e=['variant="'+k()+'"','size="'+s+'"'];if(p)e.push("dot");else{const t=w();"number"==typeof t?e.push("badgeContent={"+t+"}"):t&&e.push('badgeContent="'+t+'"')}return f&&e.push("showZero"),"<Badge "+e.join(" ")+">\n <MailIcon />\n</Badge>"})(),language:"JSX",sx:{borderRadius:0,borderBottom:"1px solid var(--Border)"}})]}),ce(I,{item:!0,sx:{width:{xs:"calc(100vw - 432px)",md:"calc((100vw - 432px) / 2)"},flexShrink:0,p:3,backgroundColor:"var(--Container)",overflowY:"auto"},children:[de(Yr,{children:"Playground"}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"STYLE"}),de(B,{direction:"row",spacing:1,flexWrap:"wrap",sx:{gap:1},children:["solid","outline","light"].map(e=>de(Ig,{label:kg(e),selected:o===e,onClick:()=>n(e)},e))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:Bg.map(e=>de(Tg,{color:e,selected:a===e,onClick:l},e))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",spacing:1,children:["small","medium","large"].map(e=>de(Ig,{label:kg(e),selected:s===e,onClick:()=>d(e)},e))}),ce(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:["Badge ",C[s]?.badge," · Dot ",C[s]?.dot," · Font ",C[s]?.font]})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"BADGE CONTENT"}),de(y,{size:"small",value:c,onChange:e=>u(e.target.value),placeholder:"Number or text",disabled:p,sx:{width:"160px","& .MuiOutlinedInput-root":{fontFamily:"inherit",fontSize:"14px",backgroundColor:"var(--Background)","& fieldset":{borderColor:"var(--Border)"},"&:hover fieldset":{borderColor:"var(--Border)"},"&.Mui-focused fieldset":{borderColor:"var(--Buttons-Primary-Border)"}},"& .MuiOutlinedInput-input":{color:"var(--Text)",padding:"6px 12px"}}})]}),ce(h,{sx:{mt:3},children:[de(v,{control:de(b,{checked:p,onChange:e=>m(e.target.checked),size:"small"}),label:de(ao,{children:"Dot (no content)"})}),de(v,{control:de(b,{checked:f,onChange:e=>g(e.target.checked),size:"small"}),label:de(ao,{children:"Show zero"})})]})]})]}),1===e&&ce(h,{sx:{p:4},children:[de(Yr,{children:"Accessibility Requirements"}),ce(ao,{color:"quiet",style:{marginBottom:32},children:["Based on current Playground settings: ",o," · ",a," · ",s]}),ce(B,{spacing:4,children:[ce(h,{sx:{p:3,backgroundColor:"var(--Container)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"Badge Text Contrast"}),de(ao,{color:"quiet",style:{marginBottom:16},children:"Badge text must have ≥ 4.5:1 contrast against badge background (WCAG 1.4.3 AA)"}),de(Cg,{label:"Badge Text vs. Badge Background",ratio:Xi(x.badgeText,x.badgeBg),threshold:4.5,note:"solid"===o?"var(--Buttons-{C}-Text) vs var(--Buttons-{C}-Button)":"outline"===o?"var(--Text) vs var(--Background)":"var(--Buttons-{C}-Text) vs var(--Buttons-{C}-Button)"})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Container)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"Badge Visibility"}),de(ao,{color:"quiet",style:{marginBottom:16},children:"Badge background (or border) must have ≥ 3:1 contrast against page background (WCAG 1.4.11)"}),(()=>{const e=Xi(x.badgeBg,x.background),t=x.badgeBorder?Xi(x.badgeBorder,x.background):null;return de(Cg,{label:"Badge vs. Page Background",ratio:(r=e,n=t,r||n?r?n?parseFloat(r)>=parseFloat(n)?r:n:r:n:null),threshold:3.1,note:"outline"===o?"Border "+(t||"--")+":1 — outline relies on border contrast":"BG "+(e||"--")+":1"});var r,n})()]}),ce(h,{sx:{p:3,backgroundColor:"var(--Container)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"Badge Sizing"}),de(ao,{color:"quiet",style:{marginBottom:16},children:"Badge dimensions per size setting"}),de(h,{sx:{display:"flex",justifyContent:"space-between",py:1.5,borderBottom:"1px solid var(--Border)"},children:ce(h,{children:[ce(ao,{children:["Badge height (",s,")"]}),ce(bo,{style:{color:"var(--Text-Quiet)"},children:[C[s]?.badge," height · ",C[s]?.font," font · pill shape"]})]})}),de(h,{sx:{display:"flex",justifyContent:"space-between",py:1.5,borderBottom:"1px solid var(--Border)"},children:ce(h,{children:[ce(ao,{children:["Dot size (",s,")"]}),ce(bo,{style:{color:"var(--Text-Quiet)"},children:[C[s]?.dot," diameter circle"]})]})})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Container)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"ARIA & Semantics"}),ce(B,{spacing:0,children:[ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ao,{style:{display:"block",marginBottom:2},children:"Screenreader support:"}),de(bo,{style:{color:"var(--Text-Quiet)"},children:'MUI Badge renders badge content in a visually-hidden span for assistive technology. Numeric content is announced (e.g. "5 notifications").'})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ao,{style:{display:"block",marginBottom:2},children:"Dot variant:"}),de(bo,{style:{color:"var(--Text-Quiet)"},children:"Dot badges are purely decorative. Ensure the parent element conveys status to assistive tech via aria-label or similar."})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ao,{style:{display:"block",marginBottom:2},children:"Max overflow:"}),de(bo,{style:{color:"var(--Text-Quiet)"},children:'When content exceeds max (default 99), displays "99+" visually but announces the actual number to screenreaders.'})]})]})]})]})]})]})}const zg=e=>e.charAt(0).toUpperCase()+e.slice(1);function Rg(e){return e&&"default"!==e&&"border-variant"!==e?"border"===e?"var(--Border)":"var(--Icons-"+zg(e)+")":"var(--Border-Variant)"}function Eg(e,t){const r=e&&!["default","border","border-variant"].includes(e)?zg(e):"Default",o=Rg(e);return"light"===t?{bg:"var(--Tag-"+r+"-BG)",text:"var(--Tag-"+r+"-Text)",border:"1px solid "+o}:{bg:"var(--Background)",text:"var(--Text)",border:"1px solid "+o}}const Pg={small:1,medium:2,large:4};function Og({color:e="default",orientation:t="horizontal",size:r="small",children:o,indicatorText:n,indicatorStyle:i="outline",textAlign:a="center",className:l="",sx:s={},...d}){const c=Rg(e),u=Pg[r]||Pg.small,p=!(!o&&!n),m=o||n,f="vertical"===t;if(f&&!p)return de(h,{role:"separator","aria-orientation":"vertical",className:"divider-vertical divider-"+e+" "+l,sx:{display:"inline-block",width:u+"px",alignSelf:"stretch",minHeight:24,backgroundColor:c,flexShrink:0,...s},...d});if(f&&p){const t=Eg(e,i),r="top"===a?"0 0 10%":"1 1 auto",o="top"===a?"1 1 auto":"bottom"===a?"0 0 10%":"1 1 auto";return ce(h,{role:"separator","aria-orientation":"vertical",className:"divider-vertical divider-"+e+" divider-indicator "+l,sx:{display:"inline-flex",flexDirection:"column",alignItems:"center",alignSelf:"stretch",minHeight:24,flexShrink:0,...s},...d,children:[de(h,{sx:{flex:r,width:u+"px",backgroundColor:c}}),de(h,{sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",flexShrink:0,my:1,px:.75,py:.5,borderRadius:"12px",fontSize:"11px",fontWeight:500,fontFamily:"inherit",lineHeight:1.2,whiteSpace:"nowrap",backgroundColor:t.bg,color:t.text,border:t.border,boxSizing:"border-box"},children:m}),de(h,{sx:{flex:o,width:u+"px",backgroundColor:c}})]})}if(!p)return de(h,{role:"separator","aria-orientation":"horizontal",className:"divider-horizontal divider-"+e+" "+l,sx:{width:"100%",height:u+"px",backgroundColor:c,flexShrink:0,...s},...d});const g=Eg(e,i),x="left"===a?"0 0 10%":"1 1 auto",b="left"===a?"1 1 auto":"right"===a?"0 0 10%":"1 1 auto";return ce(h,{role:"separator","aria-orientation":"horizontal",className:"divider-horizontal divider-"+e+" divider-indicator "+l,sx:{display:"flex",alignItems:"center",width:"100%",...s},...d,children:[de(h,{sx:{flex:x,height:u+"px",backgroundColor:c}}),de(h,{sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",flexShrink:0,mx:2,px:1.5,py:.5,borderRadius:"12px",fontSize:"12px",fontWeight:500,fontFamily:"inherit",lineHeight:1.2,whiteSpace:"nowrap",backgroundColor:g.bg,color:g.text,border:g.border,boxSizing:"border-box"},children:m}),de(h,{sx:{flex:b,height:u+"px",backgroundColor:c}})]})}const Lg={eyebrow:To,title:co,secondary:lo},Mg={primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info-Medium",success:"Success-Medium",warning:"Warning-Medium",error:"Error-Medium"},Wg={primary:"Primary-Light",secondary:"Secondary-Light",tertiary:"Tertiary-Light",neutral:"Neutral-Light",info:"Info-Light",success:"Success-Light",warning:"Warning-Light",error:"Error-Light"},Dg={small:{py:.5,px:1.5,fontSize:"13px",iconSize:16,decoratorSize:28,gap:1,checkSize:"small"},medium:{py:1,px:1,fontSize:"14px",iconSize:20,decoratorSize:36,gap:1.5,checkSize:"small"},large:{py:1.5,px:2.5,fontSize:"16px",iconSize:24,decoratorSize:40,gap:2,checkSize:"medium"}};function Fg({children:e,size:t="medium",isButton:r=!1,onAction:o,ariaLabel:n}){return de(h,r?{component:"button",role:"button",tabIndex:0,"aria-label":n||"Action",onClick:e=>{e.stopPropagation(),o?.(e)},onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),e.stopPropagation(),o?.(e))},className:"list-item-decorator-button",sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",flexShrink:0,padding:0,border:"none",backgroundColor:"transparent",borderRadius:"50%",cursor:"pointer",color:"inherit",transition:"background-color 0.15s ease","&:hover":{backgroundColor:"rgba(128,128,128,0.15)"},"&:active":{backgroundColor:"rgba(128,128,128,0.25)"},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"-3px"}},children:e}:{className:"list-item-decorator",sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",flexShrink:0},children:e})}function Ng({children:e,startDecorator:t,endDecorator:r,startDecoratorIsButton:o=!1,endDecoratorIsButton:n=!1,onStartDecoratorAction:i,onEndDecoratorAction:a,startDecoratorAriaLabel:l,endDecoratorAriaLabel:s,size:d="medium",variant:c="default",color:u,eyebrow:p,overline:m,secondary:f,clickable:g=!1,disabled:x=!1,selected:v=!1,selectionMode:y="none",onSelect:S,onClick:k,bottomBorder:B=!1,rightBorder:w=!1,sx:C={},...T}){const I=Dg[d]||Dg.medium,A=g||!!k,z="checkbox"===y||"radio"===y,R=(A||z)&&!x,E=e=>{x||(z&&S?.(e),k?.(e))};return ce(h,{component:"li",role:z?"option":A?"button":"listitem",tabIndex:R?0:void 0,"aria-disabled":x||void 0,"aria-selected":z?v:v||void 0,"aria-checked":"checkbox"===y?v:void 0,onClick:E,onKeyDown:R?e=>{x||"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),E(e))}:void 0,className:"list-item"+(v?" list-item-selected":"")+(x?" list-item-disabled":"")+(A?" list-item-clickable":"")+(z?" list-item-selectable":""),sx:{display:"flex",flexDirection:"row",alignItems:"flex-start",justifyContent:"flex-start",width:"100%",boxSizing:"border-box",gap:"var(--Sizing-1-and-Half)",py:I.py,px:I.px,minHeight:"32px",fontSize:I.fontSize,fontFamily:"inherit",color:"var(--Text)",listStyle:"none",cursor:R?"pointer":"default",opacity:x?.5:1,position:"relative",transition:"background-color 0.15s ease, box-shadow 0.15s ease",...A?{border:"1px solid var(--Border)",boxShadow:"var(--Effect-Level-1)",padding:"var(--Sizing-1)",borderRadius:"var(--Input-Radius)"}:{},...!A&&B?{borderBottom:"1px solid var(--Border-Variant)"}:{},...!A&&w?{borderRight:"1px solid var(--Border-Variant)"}:{},backgroundColor:v?"var(--Hover)":"transparent","&:hover":R?{backgroundColor:"var(--Hover)",boxShadow:"var(--Effect-Level-2)"}:{},"&:active":R?{backgroundColor:"var(--Pressed)",boxShadow:"var(--Effect-Level-1)"}:{},"&:focus-visible":{outline:"none"},"&:focus-visible::after":{content:'""',position:"absolute",inset:"1px",border:"3px solid var(--Focus-Visible)",borderRadius:"var(--Input-Inner-Focus-Visible)",pointerEvents:"none"},...C},...T,children:["checkbox"===y&&de(b,{checked:v,disabled:x,size:I.checkSize,tabIndex:-1,onClick:e=>e.stopPropagation(),onChange:()=>S?.(),sx:{p:0,mr:0,color:"inherit","&.Mui-checked":{color:"inherit"}},inputProps:{"aria-label":"Select "+("string"==typeof e?e:"item")}}),"radio"===y&&de(P,{checked:v,disabled:x,size:I.checkSize,tabIndex:-1,onClick:e=>e.stopPropagation(),onChange:()=>S?.(),sx:{p:0,mr:0,color:"inherit","&.Mui-checked":{color:"inherit"}},inputProps:{"aria-label":"Select "+("string"==typeof e?e:"item")}}),t&&de(Fg,{size:d,isButton:o,onAction:i,ariaLabel:l,children:t}),(()=>{const t=Lg,r=p??m,o={display:"block",width:"100%",wordBreak:"break-word",overflowWrap:"anywhere"};return ce(h,{sx:{flex:"1 1 auto",width:"100%",minWidth:0,display:"flex",flexDirection:"column",gap:0},children:[r&&de(t.eyebrow,{style:{...o,color:"var(--Quiet)"},children:r}),null!=e&&de(t.title,{style:{...o,color:"var(--Text)"},children:e}),f&&de(t.secondary,{style:{...o,color:"var(--Quiet)"},children:f})]})})(),r&&de(Fg,{size:d,isButton:n,onAction:a,ariaLabel:s,children:r})]})}function Hg({children:e,items:r,variant:o="default",color:n="primary",size:i="medium",orientation:a="vertical",dividers:l=!1,selectionMode:s="none",selectedIndices:d=[],onSelectionChange:c,clickable:u=!1,component:p="ul",className:m="",sx:f={},...g}){const x="horizontal"===a,b="checkbox"===s||"radio"===s,v="light"===o,y="default"===o,S={};"solid"===o&&Mg[n]?S["data-theme"]=Mg[n]:v&&Wg[n]&&(S["data-theme"]=Wg[n]);return de(h,{component:p,role:b?"listbox":"list","aria-multiselectable":"checkbox"===s||void 0,...S,className:"list-container list-"+o+" list-"+n+" "+m,sx:{display:"flex",flexDirection:x?"row":"column",boxSizing:"border-box",alignItems:"stretch",gap:u?"var(--Sizing-1)":0,m:0,p:y?0:1,backgroundColor:y?"transparent":"var(--Background)",color:"var(--Text)",borderRadius:y?0:"var(--Style-Border-Radius)",width:"100%",listStyle:"none",...x?{"& > .list-item":{flex:"1 1 0",width:"auto"}}:{},...f},...g,children:(()=>{if(r&&r.length>0){const e=[];return r.forEach((t,a)=>{e.push(de(Ng,{size:i,variant:o,color:n,startDecorator:t.startDecorator,endDecorator:t.endDecorator,startDecoratorIsButton:t.startDecoratorIsButton,endDecoratorIsButton:t.endDecoratorIsButton,onStartDecoratorAction:t.onStartDecoratorAction,onEndDecoratorAction:t.onEndDecoratorAction,startDecoratorAriaLabel:t.startDecoratorAriaLabel,endDecoratorAriaLabel:t.endDecoratorAriaLabel,eyebrow:t.eyebrow??t.overline,secondary:t.secondary,clickable:u||t.clickable,disabled:t.disabled,bottomBorder:t.bottomBorder,rightBorder:t.rightBorder,selected:b?d.includes(a):t.selected,selectionMode:s,onSelect:()=>(e=>{if(c)if("radio"===s)c([e]);else{const t=d.includes(e)?d.filter(t=>t!==e):[...d,e];c(t)}})(a),onClick:t.onClick,children:t.label||t.children},"item-"+a)),l&&a<r.length-1&&e.push(de(h,{component:"li",role:"separator","aria-hidden":"true",sx:x?{width:"1px",alignSelf:"stretch",backgroundColor:"var(--Border)",flexShrink:0}:{height:"1px",backgroundColor:"var(--Border)"}},"div-"+a))}),e}if(e){const r=t.Children.toArray(e);if(!l)return r;const o=[];return r.forEach((e,t)=>{o.push(e),t<r.length-1&&o.push(de(h,{component:"li",role:"separator","aria-hidden":"true",sx:x?{width:"1px",alignSelf:"stretch",backgroundColor:"var(--Border)",flexShrink:0}:{height:"1px",backgroundColor:"var(--Border)"}},"div-"+t))}),o}return null})()})}const Vg={small:{py:"4px",px:"8px",fontSize:"13px",headerFontSize:"12px"},medium:{py:"8px",px:"12px",fontSize:"14px",headerFontSize:"13px"},large:{py:"12px",px:"16px",fontSize:"16px",headerFontSize:"14px"}};function Qg({children:e,columns:t,rows:r,footerRows:o,variant:n="default",color:i="primary",size:a="medium",stripe:l="none",stickyHeader:s=!1,stickyFooter:d=!1,className:c="",sx:u={},...p}){const m=Vg[a]||Vg.medium,f="solid"===n,g="outlined"===n,x="light"===n,b=(e=>e.charAt(0).toUpperCase()+e.slice(1))(i),v=g?"1px solid var(--Buttons-"+b+"-Border)":"none",y={};f&&(y["data-theme"]=b+"-Medium");const S=()=>{const e={fontWeight:600,fontSize:m.headerFontSize,textAlign:"left",padding:m.py+" "+m.px,borderBottom:"2px solid var(--Border)",color:"var(--Text)",whiteSpace:"nowrap"};return x?(e.backgroundColor="var(--Buttons-"+b+"-Button)",e.color="var(--Buttons-"+b+"-Text)"):e.backgroundColor=f?"var(--Hover)":"var(--Background)",s&&(e.position="sticky",e.top=0,e.zIndex=2),e},k=()=>{const e={fontWeight:600,fontSize:m.headerFontSize,textAlign:"left",padding:m.py+" "+m.px,borderTop:"2px solid var(--Border)",color:"var(--Text)",whiteSpace:"nowrap"};return x?(e.backgroundColor="var(--Buttons-"+b+"-Button)",e.color="var(--Buttons-"+b+"-Text)"):e.backgroundColor=f?"var(--Hover)":"var(--Background)",d&&(e.position="sticky",e.bottom=0,e.zIndex=2),e},B=e=>"none"===l?"Surface":"odd"===l?e%2==0?"Surface":"Surface-Dim":"even"===l&&e%2==0?"Surface-Dim":"Surface",w=()=>({padding:m.py+" "+m.px,fontSize:m.fontSize,color:"var(--Text)",borderBottom:"1px solid var(--Border)",textAlign:"left"});return de(h,{className:"table-wrapper table-"+n+(f||x||g?" table-"+i:"")+" "+c,...y,sx:{width:"100%",overflow:"auto",border:v,borderRadius:g||x?"var(--Style-Border-Radius)":0,...u},children:de(h,{component:"table",sx:{width:"100%",borderCollapse:"collapse",tableLayout:"fixed",fontFamily:"inherit","& thead th":S(),"& tbody td":w(),"& tfoot td, & tfoot th":k(),...s?{"& thead th":{...S(),position:"sticky",top:0,zIndex:2}}:{},...d?{"& tfoot td, & tfoot th":{...k(),position:"sticky",bottom:0,zIndex:2}}:{}},...p,children:t&&r?t&&r?ce(ue,{children:[de(h,{component:"thead",children:de(h,{component:"tr",children:t.map((e,t)=>de(h,{component:"th",sx:{...S(),...e.width?{width:e.width}:{},...e.align?{textAlign:e.align}:{}},children:e.label||e.header||e},"h-"+t))})}),de(h,{component:"tbody",children:r.map((e,r)=>de(h,{component:"tr","data-surface":B(r),sx:{backgroundColor:"var(--"+B(r)+")"},children:(Array.isArray(e)?e:t.map(t=>e[t.field||t.key])).map((e,o)=>de(h,{component:"td",sx:{...w(),...t[o]&&t[o].align?{textAlign:t[o].align}:{}},children:e},"c-"+r+"-"+o))},"r-"+r))}),o&&o.length>0&&de(h,{component:"tfoot",children:o.map((e,r)=>de(h,{component:"tr",children:(Array.isArray(e)?e:t.map(t=>e[t.field||t.key])).map((e,o)=>de(h,{component:"td",sx:{...k(),...t[o]&&t[o].align?{textAlign:t[o].align}:{}},children:e},"fc-"+r+"-"+o))},"f-"+r))})]}):null:e})})}const jg={primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info-Medium",success:"Success-Medium",warning:"Warning-Medium",error:"Error-Medium"},Gg={primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info",success:"Success",warning:"Warning",error:"Error"},Ug={small:{fontSize:"12px",py:"4px",px:"8px",maxWidth:200,arrowSize:6},medium:{fontSize:"13px",py:"6px",px:"12px",maxWidth:280,arrowSize:8},large:{fontSize:"14px",py:"8px",px:"16px",maxWidth:360,arrowSize:10}};function Xg({children:e,title:t,variant:r="solid",color:o="primary",size:n="medium",placement:i="bottom",arrow:a=!1,open:l,enterDelay:s=100,leaveDelay:d=0,describeChild:c=!1,className:u="",sx:p={},...m}){const f=Ug[n]||Ug.medium,g="solid"===r,x="light"===r,b="outline"===r,v=(e=>e.charAt(0).toUpperCase()+e.slice(1))(o),y="var(--Background)",S=void 0===l?{}:{open:l};return de(w,{title:t?de(h,{"data-theme":(g?jg[o]:x?Gg[o]:null)||void 0,"data-surface":x?"Surface-Brightest":g?"Surface":void 0,className:"tooltip-content tooltip-"+r+" tooltip-"+o+" tooltip-"+n+" "+u,sx:{backgroundColor:"var(--Background)",color:"var(--Text)",border:b?"1px solid var(--Buttons-"+v+"-Border)":"none",borderRadius:"var(--Style-Border-Radius)",fontSize:f.fontSize,lineHeight:1.5,fontFamily:"inherit",padding:f.py+" "+f.px,maxWidth:f.maxWidth+"px",boxShadow:"0 2px 8px rgba(0,0,0,0.15)",...p},children:t}):"",placement:i,arrow:a,enterDelay:s,leaveDelay:d,describeChild:c,...S,componentsProps:{tooltip:{sx:{backgroundColor:"transparent",padding:0,maxWidth:"none",boxShadow:"none"}},arrow:{sx:{color:y,"&::before":{border:b?"1px solid var(--Buttons-"+v+"-Border)":"none",backgroundColor:y,boxSizing:"border-box"},fontSize:f.arrowSize+"px"}}},...m,children:e})}const Kg={default:{theme:"App-Bar"},primary:{theme:"Primary"},"primary-light":{theme:"Primary",surface:"Surface-Brightest"},white:{theme:"Neutral",surface:"Surface-Brightest"},black:{theme:"Neutral",surface:"Surface-Dimmest"}};function qg({children:e,onClick:t,ariaLabel:r}){return de(An,{iconOnly:!0,variant:"ghost",size:"medium",onClick:t,"aria-label":r,children:e})}function Jg({barColor:e="default",surface:o="Surface",loginType:n="login",menuType:i="hamburger",brandType:a="name",searchPosition:l="right",companyName:s="Company",navLinks:d=["Home","Products","About"],rightButtons:c=[],showRightButtons:u=!1,onMenuClick:p,user:m,onLogin:f,onSignOut:g,brand:x,onBrandClick:b,centerSlot:v,endSlot:y,searchValue:S,onSearchChange:k,searchPlaceholder:B="Search...",children:w,className:C="",sx:T={}}){const[I,A]=r(!1),z=Kg[e]||Kg.default,R=z.theme,E=z.surface||o,P="expanded"===i&&d.length>3?"hamburger":i,O=de(Ss,{placeholder:B,size:"medium",value:S,onChange:k,sx:{flex:"left"===l?"0 1 400px":"0 1 280px",minWidth:0}});return ce(ue,{children:[de(h,{component:"header",role:"banner","data-theme":R,"data-surface":E,className:"appbar appbar-desktop appbar-"+e+(C?" "+C:""),sx:{display:"flex",alignItems:"center",height:64,px:2,gap:2,backgroundColor:"var(--Background)",color:"var(--Text)",boxShadow:nn,fontFamily:"inherit",...T},children:w||ce(ue,{children:["hamburger"===P&&de(qg,{ariaLabel:"Open navigation menu",onClick:p||(()=>A(!0)),children:de(Pt,{sx:{fontSize:"inherit"}})}),de(h,void 0!==x?b?{component:"button",type:"button",onClick:b,sx:{background:"transparent",border:"none",padding:0,cursor:"pointer",color:"inherit",font:"inherit",fontWeight:700,fontSize:"18px",whiteSpace:"nowrap",flexShrink:0},children:x}:{sx:{fontWeight:700,fontSize:"18px",whiteSpace:"nowrap",flexShrink:0},children:x}:"logo"===a?{sx:{width:32,height:32,borderRadius:"6px",backgroundColor:"var(--Text)",opacity:.8,flexShrink:0},"aria-label":"Company logo"}:{sx:{fontWeight:700,fontSize:"18px",whiteSpace:"nowrap",flexShrink:0},children:s}),ce(ue,void 0!==v?{children:[de(h,{sx:{flex:1}}),de(h,{sx:{display:"flex",alignItems:"center",flexShrink:0},children:v}),de(h,{sx:{flex:1}})]}:{children:["left"===l&&O,"expanded"===P&&de(ai,{defaultValue:0,variant:"standard",color:"default",sx:{ml:2,minHeight:0},children:de(li,{"aria-label":"Main navigation",children:d.map(e=>de(si,{children:e},e))})}),de(h,{sx:{flex:1}}),"right"===l&&O]}),void 0!==y?de(h,{sx:{display:"flex",alignItems:"center",gap:1},children:y}):ce(ue,{children:[u&&c.length>0&&de(h,{sx:{display:"flex",alignItems:"center",gap:.5},children:c.map((e,r)=>e.raw?de(t.Fragment,{children:e.icon},r):de(qg,{ariaLabel:e.label||"Action "+(r+1),children:e.icon},r))}),m?de(An,{variant:"ghost",size:"small",onClick:g,"aria-label":"Sign out",startIcon:m.photoURL?de(h,{component:"img",src:m.photoURL,alt:"",sx:{width:24,height:24,borderRadius:"50%"}}):de(pr,{sx:{fontSize:24}}),children:m.displayName?.split(" ")[0]||"Account"}):f?de(An,{variant:"default-outline",size:"small",onClick:f,children:"Login"}):"avatar"===n?de(An,{iconOnly:!0,variant:"ghost",size:"medium","aria-label":"Account",children:de(pr,{sx:{fontSize:28}})}):null]})]})}),de(bu,{open:I,onClose:()=>A(!1),anchor:"left",size:"small",children:de(h,{component:"nav","aria-label":"Main navigation",sx:{display:"flex",flexDirection:"column",gap:.5,py:1},children:d.map(e=>de(An,{variant:"ghost",size:"medium",onClick:()=>A(!1),sx:{justifyContent:"flex-start",width:"100%"},children:e},e))})})]})}function Yg({mobileVariant:e="search",barColor:t="default",surface:o="Surface",title:n="Page Title",subtitle:i="Subtitle text",actionIcon:a,companyName:l="Company",navLinks:s=["Home","Products","About"],className:d="",sx:c={}}){const[u,p]=r(!1),m=Kg[t]||Kg.default,f=m.theme,g=m.surface||o,x={backgroundColor:"var(--Background)",color:"var(--Text)",boxShadow:nn,fontFamily:"inherit",width:"100%",maxWidth:420,...c},b={"data-theme":f,"data-surface":g},v=de(bu,{open:u,onClose:()=>p(!1),anchor:"left",size:"small",children:de(h,{component:"nav","aria-label":"Main navigation",sx:{display:"flex",flexDirection:"column",gap:.5,py:1},children:s.map(e=>de(An,{variant:"ghost",size:"medium",onClick:()=>p(!1),sx:{justifyContent:"flex-start",width:"100%"},children:e},e))})});return"search"===e?ce(ue,{children:[ce(h,{component:"header",role:"banner",className:"appbar appbar-mobile appbar-mobile-search appbar-"+t+" "+d,...b,sx:{...x,display:"flex",alignItems:"center",height:64,px:1.5,gap:1.5},children:[de(qg,{ariaLabel:"Open navigation menu",onClick:()=>p(!0),children:de(Pt,{sx:{fontSize:"inherit"}})}),de(Ss,{placeholder:"Search "+l,size:"small",sx:{flex:1,minWidth:0}}),de(An,{iconOnly:!0,variant:"ghost",size:"medium","aria-label":"Account",children:de(pr,{sx:{fontSize:28}})})]}),v]}):ce(h,"small"===e?{component:"header",role:"banner",className:"appbar appbar-mobile appbar-mobile-small appbar-"+t+" "+d,...b,sx:{...x,display:"flex",alignItems:"center",height:64,px:1.5,gap:1},children:[de(qg,{ariaLabel:"Back",children:de(ur,{sx:{fontSize:"inherit"}})}),ce(h,{sx:{flex:1,minWidth:0},children:[de(h,{sx:{fontWeight:600,fontSize:"16px",lineHeight:1.3,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:n}),i&&de(h,{sx:{fontSize:"12px",opacity:.7,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:i})]}),a&&de(qg,{ariaLabel:"Action",children:a})]}:"medium"===e?{component:"header",role:"banner",className:"appbar appbar-mobile appbar-mobile-medium appbar-"+t+" "+d,...b,sx:{...x,px:1.5,pb:2},children:[ce(h,{sx:{display:"flex",alignItems:"center",height:56,gap:1},children:[de(qg,{ariaLabel:"Back",children:de(ur,{sx:{fontSize:"inherit"}})}),de(h,{sx:{flex:1}}),a&&de(qg,{ariaLabel:"Action",children:a})]}),ce(h,{sx:{px:1.5},children:[de(h,{sx:{fontWeight:600,fontSize:"24px",lineHeight:1.2},children:n}),i&&de(h,{sx:{fontSize:"14px",opacity:.7,mt:.5},children:i})]})]}:{component:"header",role:"banner",className:"appbar appbar-mobile appbar-mobile-large appbar-"+t+" "+d,...b,sx:{...x,px:1.5,pb:3},children:[ce(h,{sx:{display:"flex",alignItems:"center",height:56,gap:1},children:[de(qg,{ariaLabel:"Back",children:de(ur,{sx:{fontSize:"inherit"}})}),de(h,{sx:{flex:1}}),a&&de(qg,{ariaLabel:"Action",children:a})]}),ce(h,{sx:{px:1.5,mt:1},children:[de(h,{sx:{fontWeight:600,fontSize:"36px",lineHeight:1.1},children:n}),i&&de(h,{sx:{fontSize:"14px",opacity:.7,mt:.5},children:i})]})]})}function Zg({mode:e="desktop",...t}){return de("mobile"===e?Yg:Jg,{...t})}const $g=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",_g=["default","primary","primary-light","white","black"],ex=["Surface","Surface-Bright","Surface-Dim","Surface-Dimmest"],tx={default:{theme:"App-Bar"},primary:{theme:"Primary"},"primary-light":{theme:"Primary",surface:"Surface-Brightest"},white:{theme:"Neutral",surface:"Surface-Brightest"},black:{theme:"Neutral",surface:"Surface-Dimmest"}};function rx({ratio:e,threshold:t}){if(!e)return de(bo,{style:{color:"var(--Text-Quiet)"},children:"--"});const r=parseFloat(e)>=t;return ce(h,{sx:{display:"inline-flex",alignItems:"center",gap:.5},children:[ce(h,{sx:{px:1,py:.25,borderRadius:"4px",fontSize:"11px",fontWeight:700,backgroundColor:r?"var(--Tags-Success-BG)":"var(--Tags-Error-BG)",color:r?"var(--Tags-Success-Text)":"var(--Tags-Error-Text)"},children:[e,":1"]}),de(bo,{style:{color:r?"var(--Tags-Success-Text)":"var(--Tags-Error-Text)"},children:r?"Pass":"Fail"})]})}function ox({label:e,ratio:t,threshold:r,note:o}){return ce(h,{sx:{display:"flex",justifyContent:"space-between",alignItems:"flex-start",py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(h,{sx:{flex:1},children:[de(ao,{style:{color:"var(--Text)"},children:e}),o&&de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:o})]}),de(rx,{ratio:t,threshold:r})]})}function nx({label:e,selected:t,onClick:r}){return de(An,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function ix({color:e,selected:t,onClick:r}){const o=tx[e]||tx.default;return de(h,{component:"button","data-theme":o.theme,"data-surface":o.surface||"Surface",onClick:()=>r(e),"aria-label":"Select "+e,"aria-pressed":t,title:e,sx:{width:"var(--Button-Height, 36px)",height:"var(--Button-Height, 36px)",borderRadius:"4px",backgroundColor:"var(--Background)",border:t?"2px solid var(--Text)":"2px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Text)",pointerEvents:"none"}})})}function ax(){const[e,t]=r("desktop"),[o,n]=r("default"),[a,l]=r("Surface"),[s,d]=r("login"),[c,u]=r("hamburger"),[p,m]=r("name"),[f,g]=r("right"),[x,b]=r("search"),[v,y]=r(null),[S,k]=r("Surface"),[w,C]=r({}),T="desktop"===e,A=tx[o]||tx.default,z=A.theme,R=A.surface||a;return i(()=>{const e={};e.text=Ki("--Text"),e.textQuiet=Ki("--Text-Quiet"),e.background=Ki("--Background"),e.border=Ki("--Border"),e.focusVisible=Ki("--Focus-Visible"),e.hover=Ki("--Hover"),e.active=Ki("--Pressed"),C(e)},[o,a,e]),ce(h,{sx:{pb:8},children:[de(Jr,{children:"App Bar"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ci,{theme:v,children:de(h,{sx:{width:"100%",maxWidth:T?"100%":420,overflow:"hidden"},children:T?de(Jg,{barColor:o,surface:a,loginType:s,menuType:c,brandType:p,searchPosition:f,companyName:"My App",navLinks:["Home","Products","About"]}):de(Yg,{barColor:o,surface:a,mobileVariant:x,companyName:"My App",title:"Page Title",subtitle:"Subtitle text"})})}),de(Qi,{code:(()=>{if(T){const e=[];"default"!==o&&e.push('barColor="'+o+'"'),"Surface"!==a&&e.push('surface="'+a+'"'),"login"!==s&&e.push('loginType="'+s+'"'),"hamburger"!==c&&e.push('menuType="'+c+'"'),"name"!==p&&e.push('brandType="'+p+'"'),"right"!==f&&e.push('searchPosition="'+f+'"');const t=e.length?"\n "+e.join("\n ")+"\n":"";return'<AppBar mode="desktop"'+(t||" ")+'companyName="My App" />'}{const e=['mode="mobile"','mobileVariant="'+x+'"'];return"default"!==o&&e.push('barColor="'+o+'"'),"Surface"!==a&&e.push('surface="'+a+'"'),"<AppBar\n "+e.join("\n ")+'\n title="Page Title"\n/>'}})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(ai,{defaultValue:0,variant:"standard",color:"primary",children:[ce(li,{children:[de(si,{children:"Playground"}),de(si,{children:"Accessibility"})]}),de(di,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(mi,{theme:v,onThemeChange:y,surface:S,onSurfaceChange:k})}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"MODE"}),de(B,{direction:"row",spacing:1,children:["desktop","mobile"].map(r=>de(nx,{label:$g(r),selected:e===r,onClick:()=>t(r)},r))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"BAR COLOR"}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:_g.map(e=>de(ix,{color:e,selected:o===e,onClick:n},e))}),ce(bo,{style:{color:"var(--Text-Quiet)",marginTop:6,display:"block"},children:['data-theme="',z,'"']})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SURFACE"}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:ex.map(e=>de(nx,{label:e.replace("Surface-","").replace("Surface","Default"),selected:a===e,onClick:()=>l(e)},e))}),ce(bo,{style:{color:"var(--Text-Quiet)",marginTop:6,display:"block"},children:['data-surface="',a,'"']})]}),T&&ce(ue,{children:[ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"MENU TYPE"}),de(B,{direction:"row",spacing:1,children:["hamburger","expanded"].map(e=>de(nx,{label:$g(e),selected:c===e,onClick:()=>u(e)},e))}),de(bo,{style:{color:"var(--Text-Quiet)",marginTop:4,display:"block"},children:"Expanded auto-falls back to hamburger when nav > 3 links"})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"BRAND"}),de(B,{direction:"row",spacing:1,children:["name","logo"].map(e=>de(nx,{label:$g(e),selected:p===e,onClick:()=>m(e)},e))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SEARCH POSITION"}),de(B,{direction:"row",spacing:1,children:["left","right"].map(e=>de(nx,{label:$g(e),selected:f===e,onClick:()=>g(e)},e))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"LOGIN TYPE"}),de(B,{direction:"row",spacing:1,children:["login","avatar"].map(e=>de(nx,{label:$g(e),selected:s===e,onClick:()=>d(e)},e))})]})]}),!T&&ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"MOBILE VARIANT"}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:["search","small","medium","large"].map(e=>de(nx,{label:$g(e),selected:x===e,onClick:()=>b(e)},e))})]})]})}),de(di,{value:1,children:ce(h,{sx:{p:3},children:[ce(ao,{color:"quiet",style:{marginBottom:24},children:[e," / ",o," / ",a,T?"":" / "+x,' — data-theme="',z,'" data-surface="',R,'"']}),ce(B,{spacing:3,children:[ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"Text Contrast (WCAG 1.4.3 — 4.5:1)"}),de(ao,{color:"quiet",style:{marginBottom:16},children:"All text and icons must have 4.5:1 contrast against the AppBar background."}),de(ox,{label:"Resting: var(--Text) vs. var(--Background)",ratio:Xi(w.text,w.background),threshold:4.5,note:'data-theme="'+z+'" data-surface="'+R+'"'}),de(ox,{label:"On hover: var(--Text) vs. var(--Hover)",ratio:Xi(w.text,w.hover),threshold:4.5,note:"Icon buttons use var(--Hover) on hover"}),de(ox,{label:"On active: var(--Text) vs. var(--Pressed)",ratio:Xi(w.text,w.active),threshold:4.5,note:"Icon buttons use var(--Pressed) on press"})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"Focus Indicator (WCAG 2.4.11 — 3:1)"}),de(ox,{label:"var(--Focus-Visible) vs. var(--Background)",ratio:Xi(w.focusVisible,w.background),threshold:3,note:"outline: 3px solid var(--Focus-Visible); outline-offset: 1px"})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"Touch Target Area (WCAG 2.5.5)"}),[{label:"Icon button",size:40,note:"width: 40px, height: 40px"},{label:"AppBar (desktop)",size:64,note:"height: 64px"},{label:"AppBar (mobile)",size:64,note:"height: 64px"}].map(({label:e,size:t,note:r})=>{const o=t>=24,n=t>=44,i=t>=48;return ce(h,{sx:{display:"flex",justifyContent:"space-between",alignItems:"flex-start",py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(h,{sx:{flex:1},children:[ce(ao,{style:{color:"var(--Text)"},children:[e," — ",t,"px"]}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:r})]}),ce(h,{sx:{display:"flex",gap:.5,flexWrap:"wrap",justifyContent:"flex-end"},children:[ce(h,{sx:{px:1,py:.25,borderRadius:"4px",fontSize:"11px",fontWeight:700,backgroundColor:o?"var(--Tags-Success-BG)":"var(--Tags-Error-BG)",color:o?"var(--Tags-Success-Text)":"var(--Tags-Error-Text)"},children:["Desktop ",o?"Y":"N"]}),ce(h,{sx:{px:1,py:.25,borderRadius:"4px",fontSize:"11px",fontWeight:700,backgroundColor:n?"var(--Tags-Success-BG)":"var(--Tags-Warning-BG)",color:n?"var(--Tags-Success-Text)":"var(--Tags-Warning-Text)"},children:["iOS ",n?"Y":"~"]}),ce(h,{sx:{px:1,py:.25,borderRadius:"4px",fontSize:"11px",fontWeight:700,backgroundColor:i?"var(--Tags-Success-BG)":"var(--Tags-Warning-BG)",color:i?"var(--Tags-Success-Text)":"var(--Tags-Warning-Text)"},children:["Android ",i?"Y":"~"]})]})]},e)})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"ARIA and Semantics"}),ce(B,{spacing:0,children:[ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ao,{children:"Landmark:"}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:'<header role="banner">'})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ao,{children:"Navigation (expanded menu):"}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:'<nav aria-label="Main navigation">'})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ao,{children:"Theme + Surface:"}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:'data-theme="'+z+'" data-surface="'+R+'"'})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ao,{children:"Shadow:"}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:"box-shadow: var(--Effect-Level-1)"})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ao,{children:"Icon buttons:"}),de(bo,{style:{color:"var(--Text-Quiet)"},children:"All icon buttons have aria-label. Focus visible on keyboard navigation."})]}),ce(h,{sx:{py:1.5},children:[de(ao,{children:"Keyboard:"}),de(bo,{style:{color:"var(--Text-Quiet)"},children:"Tab navigates all interactive elements. Enter/Space activates buttons."})]})]})]})]})]})})]})})})]})]})}function lx({title:e="My App",mode:t="light",navItems:r=[{label:"HOME",href:"#"},{label:"ABOUT",href:"#"},{label:"SERVICES",href:"#"},{label:"CONTACT",href:"#"}],rightContent:o,sx:n={},...i}){return de(Z,{position:"fixed",sx:{background:"var(--Background)",color:"var(--Text)",boxShadow:"0 1px 3px rgba(0,0,0,0.1)",borderBottom:"1px solid var(--Border-Variant)",transition:"all 0.2s ease-in-out",zIndex:1201,...n},...i,children:de(F,{maxWidth:"lg",children:ce($,{sx:{display:"flex",justifyContent:"space-between",alignItems:"center",px:0},children:[de(T,{variant:"h6",sx:{fontWeight:700,color:"var(--Text)",mr:"auto",transition:"color 0.2s ease-in-out"},children:e}),de(h,{sx:{display:{xs:"none",md:"flex"},gap:3,flex:1,justifyContent:"center"},children:r.map((e,t)=>de(T,{component:"a",href:e.href,variant:"body2",sx:{textDecoration:"none",color:"var(--Text)",transition:"color 0.2s ease-in-out","&:hover":{color:"var(--Primary-Color-11)"}},children:e.label},t))}),de(B,{direction:"row",spacing:1,alignItems:"center",children:o})]})})})}const sx={default:{bg:"var(--Primary-Color-1)",fg:"var(--Primary-Color-12)"},primary:{theme:"Primary",surface:"Surface-Dim"},"primary-dark":{bg:"var(--Primary-Color-1)",fg:"var(--Primary-Color-12)"},white:{bg:"var(--Neutral-Color-11)",fg:"var(--Neutral-Color-3)"},black:{bg:"var(--Neutral-Color-1)",fg:"var(--Neutral-Color-12)"}};function dx({color:e="default",companyName:t="",year:r=(new Date).getFullYear(),rights:o="All rights reserved",children:n,className:i,style:a,...l}){const s=n??`© ${r}${t?" "+t:""}.${o?" "+o+".":""}`,d=sx[e]||sx.default,c=d.theme?{"data-theme":d.theme,"data-surface":d.surface||"Surface-Dim"}:{},u=d.theme?{background:"var(--Background)",color:"var(--Text)"}:{background:d.bg,color:d.fg};return de("div",{...c,className:["dino-copyright",i].filter(Boolean).join(" "),style:{padding:"14px 24px",textAlign:"center",...u,...a},...l,children:de(ao,{style:{color:"inherit",opacity:.85},children:s})})}const cx={default:{bg:"var(--Primary-Color-2)",fg:"var(--Primary-Color-12)"},primary:{theme:"Primary",surface:"Surface"},"primary-dark":{theme:"Primary",surface:"Surface-Dimmest"},white:{bg:"var(--Neutral-Color-12)",fg:"var(--Neutral-Color-2)"},black:{bg:"var(--Neutral-Color-1)",fg:"var(--Neutral-Color-12)"}};function ux({color:e="default",brand:t,address:r,columns:o=[],socialLinks:n=[],subscribe:i,copyrightName:a,copyrightYear:l,className:s,style:d,...c}){const u=o.slice(0,3),p=cx[e]||cx.default,h=p.theme?{"data-theme":p.theme,"data-surface":p.surface||"Surface"}:{},m=p.theme?{background:"var(--Background)",color:"var(--Text)"}:{background:p.bg,color:p.fg};return ce("footer",{...h,className:["dino-footer",s].filter(Boolean).join(" "),style:{...m,...d},...c,children:[ce("div",{style:{maxWidth:1200,margin:"0 auto",padding:"40px 24px 56px"},children:[t&&de("div",{style:{marginBottom:36},children:t}),ce("div",{style:{display:"grid",gridTemplateColumns:"repeat(auto-fit, minmax(280px, 1fr))",gap:40},children:[de(px,{address:r}),u.map((e,t)=>de(hx,{...e},t))]}),(n.length>0||i)&&ce("div",{style:{marginTop:48,paddingTop:32,borderTop:"1px solid rgba(255, 255, 255, 0.10)",display:"flex",flexWrap:"wrap",gap:32,alignItems:"flex-start",justifyContent:"space-between"},children:[n.length>0&&de(mx,{links:n}),i&&de(fx,{...i})]})]}),de(dx,{color:e,companyName:a,year:l})]})}function px({address:e}){if(!e)return de("div",{});const{company:t,lines:r=[],email:o,phone:n}=e,i=[...t?[t]:[],...r,...n?[n]:[]];return ce("div",{children:[i.map((e,t)=>de(ao,{style:{color:"inherit",opacity:.85,display:"block"},children:e},t)),o&&de("div",{style:{marginTop:12},children:de(ao,{style:{color:"inherit",opacity:.85,display:"block"},children:de(Ws,{href:"mailto:"+o,color:"standard",style:{color:"inherit"},children:o})})})]})}function hx({title:e,links:t=[]}){return ce("div",{children:[e&&de(Yr,{style:{color:"inherit",marginBottom:12},children:e}),de("ul",{style:{listStyle:"none",margin:0,padding:0},children:t.map((e,t)=>de("li",{style:{marginBottom:8},children:de(Ws,{href:e.href,onClick:e.onClick,color:"standard",style:{color:"inherit",opacity:.85},children:e.label})},t))})]})}function mx({links:e}){return de("div",{style:{display:"flex",gap:16,alignItems:"center"},children:e.map((e,t)=>de("a",{href:e.url,target:"_blank",rel:"noopener noreferrer","aria-label":e.label||"Social link",style:{color:"inherit",opacity:.85,display:"inline-flex",alignItems:"center",justifyContent:"center",width:36,height:36,borderRadius:"50%",border:"1px solid rgba(255, 255, 255, 0.18)",textDecoration:"none",transition:"opacity 150ms ease, border-color 150ms ease"},onMouseEnter:e=>{e.currentTarget.style.opacity="1"},onMouseLeave:e=>{e.currentTarget.style.opacity="0.85"},children:e.icon},t))})}function fx({title:e="Stay in the loop",description:t,placeholder:o="your@email.com",buttonLabel:n="Subscribe",onSubscribe:i}){const[a,l]=r(""),[s,d]=r(!1);return ce("form",{onSubmit:async e=>{if(e&&e.preventDefault(),a&&!s){d(!0);try{await(i?.(a)),l("")}finally{d(!1)}}},style:{minWidth:260,maxWidth:360,flex:"1 1 260px"},children:[de(Yr,{style:{color:"inherit",marginBottom:6},children:e}),t&&de(ao,{style:{color:"inherit",opacity:.85,marginBottom:12,display:"block"},children:t}),ce("div",{style:{display:"flex",gap:8},children:[de(Ll,{type:"email",value:a,onChange:e=>l(e.target.value),placeholder:o,size:"small",fullWidth:!0,"aria-label":"Email address"}),de(An,{type:"submit",variant:"primary",size:"small",disabled:s||!a,children:n})]})]})}function gx(e){const t=e.match(/rgba?\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)/);return t?[Number(t[1]),Number(t[2]),Number(t[3])]:null}function xx(e){return e?"#"+e.map(e=>e.toString(16).padStart(2,"0")).join(""):"—"}function bx([e,t,r]){const o=[e,t,r].map(e=>(e/=255)<=.03928?e/12.92:Math.pow((e+.055)/1.055,2.4));return.2126*o[0]+.7152*o[1]+.0722*o[2]}function vx({targetRef:e,label:t,deps:o=[]}){const[n,a]=r(null),[l,s]=r(null);i(()=>{if(!e.current)return;const t=requestAnimationFrame(()=>{if(!e.current)return;const t=getComputedStyle(e.current);a(gx(t.backgroundColor)),s(gx(t.color))});return()=>cancelAnimationFrame(t)},o);const d=function(e,t){if(!e||!t)return null;const r=bx(e),o=bx(t);return(Math.max(r,o)+.05)/(Math.min(r,o)+.05)}(n,l),c=null!==d&&d>=4.5,u=null===d?"—":null!==d&&d>=7?"AAA":c?"AA":"Fail",p=null===d?"var(--Text-Quiet)":c?"var(--Text-Success)":"var(--Text-Error)";return ce("div",{style:{display:"flex",alignItems:"center",gap:16,padding:"12px 16px",borderRadius:8,background:"var(--Container)",border:"1px solid var(--Border)"},children:[ce("div",{style:{flex:1,minWidth:0},children:[de(ao,{style:{fontWeight:600},children:t}),ce(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:["Background ",xx(n)," · Text ",xx(l)]})]}),ce("div",{style:{display:"flex",alignItems:"center",gap:6,borderRadius:999,padding:"4px 10px",background:"var(--Background)",border:"1px solid var(--Border)"},children:[de("span",{style:{fontWeight:700,fontSize:12,color:p},children:u}),de(bo,{style:{color:"var(--Text-Quiet)"},children:null!==d?d.toFixed(2)+":1":"—"})]})]})}const yx={company:"DinoDesign",lines:["123 Market Street","San Francisco, CA 94103"],email:"hello@dinodesign.dev",phone:"+1 (555) 010-0000"},Sx=[{title:"Product",links:[{label:"Features",href:"#"},{label:"Pricing",href:"#"},{label:"Add-ons",href:"#"}]},{title:"Company",links:[{label:"About",href:"#"},{label:"Careers",href:"#"},{label:"Contact",href:"#"}]},{title:"Resources",links:[{label:"Docs",href:"#"},{label:"Changelog",href:"#"},{label:"Status",href:"#"}]}],kx=[{icon:de(hr,{fontSize:"small"}),url:"https://twitter.com",label:"Twitter"},{icon:de(mr,{fontSize:"small"}),url:"https://github.com",label:"GitHub"},{icon:de(fr,{fontSize:"small"}),url:"https://linkedin.com",label:"LinkedIn"}],Bx=[{value:"default",label:"Default"},{value:"primary",label:"Primary"},{value:"primary-dark",label:"Primary Dark"},{value:"white",label:"White"},{value:"black",label:"Black"}];function wx({label:e,selected:t,onClick:r}){return de(An,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function Cx(){const[e,t]=r(4),[n,a]=r(!0),[l,s]=r(!0),[d,c]=r("default"),u=o(null),[p,m]=r(null),[f,g]=r(null);i(()=>{u.current&&(m({current:u.current.querySelector(".dino-footer")}),g({current:u.current.querySelector(".dino-copyright")}))},[d,e,n,l]);const x=Sx.slice(0,Math.max(0,e-1)),b=n?kx:[],v=l?{title:"Stay in the loop",description:"Monthly updates on new components and tips.",onSubscribe:async e=>console.log("subscribed:",e)}:void 0;return ce(h,{children:[de(Jr,{style:{marginBottom:12},children:"Footer"}),ce(co,{color:"quiet",style:{marginBottom:24,maxWidth:720},children:["Configurable 1–4 column footer. The first column is always the company address / contact. Optional ",de("code",{children:"socialLinks"})," and"," ",de("code",{children:"subscribe"})," sit above the auto-generated copyright strip."]}),de(h,{ref:u,sx:{borderRadius:1,overflow:"hidden",mb:4},children:de(ux,{color:d,address:yx,columns:x,socialLinks:b,subscribe:v,copyrightName:"DinoDesign"})}),ce(ai,{defaultValue:0,variant:"standard",color:"primary",children:[ce(li,{children:[de(si,{children:"Playground"}),de(si,{children:"Accessibility"})]}),de(di,{value:0,children:ce(B,{spacing:3,sx:{p:3,maxWidth:560},children:[ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLUMNS"}),de(B,{direction:"row",spacing:1,children:[1,2,3,4].map(r=>de(wx,{label:String(r),selected:e===r,onClick:()=>t(r)},r))}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:"First column is always the address / contact. Up to 3 more link columns."})]}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{direction:"row",spacing:1,sx:{flexWrap:"wrap",rowGap:1},children:Bx.map(e=>de(wx,{label:e.label,selected:d===e.value,onClick:()=>c(e.value)},e.value))}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:'"Default" hardcodes Primary tone 2 (auto-derived in a future iteration).'})]}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SOCIAL LINKS"}),de(oa,{label:"Show social media row",checked:n,onChange:e=>a(e.target.checked)}),ce(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:["When on, the Footer renders the ",de("code",{children:"socialLinks"})," row (icons linking out). In your app, supply the icon + url pairs from your data store."]})]}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SUBSCRIBE"}),de(oa,{label:"Show email subscribe form",checked:l,onChange:e=>s(e.target.checked)}),ce(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:["When on, the Footer renders an email subscribe form. Hook it up via"," ",de("code",{children:"subscribe.onSubscribe(email)"}),"."]})]})]})}),de(di,{value:1,children:ce(B,{spacing:2,sx:{p:3,maxWidth:560},children:[de(bo,{style:{color:"var(--Text-Quiet)"},children:"Live WCAG 2.1 contrast against the painted background. AA needs 4.5:1 for normal text; AAA needs 7:1."}),p&&de(vx,{targetRef:p,label:"Footer body",deps:[d,e,n,l]}),f&&de(vx,{targetRef:f,label:"Copyright strip",deps:[d,e,n,l]})]})})]})]})}const Tx=[{value:"default",label:"Default"},{value:"primary",label:"Primary"},{value:"primary-dark",label:"Primary Dark"},{value:"white",label:"White"},{value:"black",label:"Black"}];function Ix({label:e,selected:t,onClick:r}){return de(An,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function Ax(){const[e,t]=r("DinoDesign"),[n,a]=r((new Date).getFullYear()),[l,s]=r("All rights reserved"),[d,c]=r(""),[u,p]=r(!1),[m,f]=r("default"),g=o(null),[x,b]=r(null);return i(()=>{g.current&&b({current:g.current.querySelector(".dino-copyright")})},[m,u,e,n,l,d]),ce(h,{children:[de(Jr,{style:{marginBottom:12},children:"Copyright"}),ce(co,{color:"quiet",style:{marginBottom:24,maxWidth:720},children:["Standalone copyright strip used at the bottom of pages. Defaults to"," ",ce("code",{children:["© ","{year}"," ","{companyName}",". ","{rights}","."]})," Pass"," ",de("code",{children:"children"})," to override the entire text."]}),de(h,{ref:g,sx:{borderRadius:1,overflow:"hidden",mb:4},children:de(dx,u?{color:m,children:d||"Type a custom message →"}:{color:m,companyName:e,year:Number(n)||(new Date).getFullYear(),rights:l})}),ce(ai,{defaultValue:0,variant:"standard",color:"primary",children:[ce(li,{children:[de(si,{children:"Playground"}),de(si,{children:"Accessibility"})]}),de(di,{value:0,children:ce(B,{spacing:3,sx:{p:3,maxWidth:560},children:[ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"TEXT MODE"}),ce(B,{direction:"row",spacing:1,children:[de(Ix,{label:"Auto-generated",selected:!u,onClick:()=>p(!1)}),de(Ix,{label:"Custom",selected:u,onClick:()=>p(!0)})]})]}),!u&&ce(ue,{children:[de(Jn,{label:"Company name",value:e,onChange:e=>t(e.target.value),placeholder:"DinoDesign",size:"medium"}),de(pl,{label:"Year",value:Number(n),onChange:e=>a(e),min:1900,max:2100}),de(Jn,{label:"Rights text",value:l,onChange:e=>s(e.target.value),placeholder:"All rights reserved",size:"medium"}),de(bo,{style:{color:"var(--Text-Quiet)"},children:'Leave Rights blank to omit "All rights reserved." entirely.'})]}),u&&ce(ue,{children:[de(Jn,{label:"Custom text",value:d,onChange:e=>c(e.target.value),placeholder:"© 2026 DinoDesign · MIT License · Built with love",size:"medium",multiline:!0}),de(bo,{style:{color:"var(--Text-Quiet)"},children:"Pass any string (or React node) as children to fully override the auto text."})]}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{direction:"row",spacing:1,sx:{flexWrap:"wrap",rowGap:1},children:Tx.map(e=>de(Ix,{label:e.label,selected:m===e.value,onClick:()=>f(e.value)},e.value))}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:"Matches the Footer color presets so the two stack cleanly."})]})]})}),de(di,{value:1,children:ce(B,{spacing:2,sx:{p:3,maxWidth:560},children:[de(bo,{style:{color:"var(--Text-Quiet)"},children:"Live WCAG 2.1 contrast against the painted background. AA needs 4.5:1 for normal text; AAA needs 7:1."}),x&&de(vx,{targetRef:x,label:"Copyright strip",deps:[m,u,e,n,l,d]})]})})]})]})}const zx=["Default","Primary","Secondary","Tertiary","Neutral"],Rx={Classic:{name:"Classic",description:"Raised + soft shadow",angle:135,bevel:!0,depth:5,softness:1,shadow:!0,shadowDistance:6,shadowBlur:8,shadowOpacity:.6},Carved:{name:"Carved",description:"Deep inset, no shadow",angle:135,bevel:!0,depth:10,softness:2,shadow:!1,shadowDistance:4,shadowBlur:4,shadowOpacity:.4},Embossed:{name:"Embossed",description:"Inset + heavy shadow",angle:135,bevel:!0,depth:7,softness:1.5,shadow:!0,shadowDistance:10,shadowBlur:14,shadowOpacity:.7},Stamp:{name:"Stamp",description:"Reversed light + shadow",angle:315,bevel:!0,depth:6,softness:1,shadow:!0,shadowDistance:5,shadowBlur:6,shadowOpacity:.8},"Night Cut":{name:"Night Cut",description:"Inset on dark background",angle:135,bevel:!0,depth:8,softness:2,shadow:!1,shadowDistance:6,shadowBlur:8,shadowOpacity:.6},"Shadow Only":{name:"Shadow Only",description:"Flat fill + drop shadow",angle:135,bevel:!1,depth:4,softness:1,shadow:!0,shadowDistance:8,shadowBlur:12,shadowOpacity:.5}},Ex=Object.keys(Rx);function Px(e,t){if("custom"===e)return{...Rx.Classic,name:"Custom",description:"Custom",...t||{}};const r=Rx[e];return r?{...r}:{...Rx.Classic}}function Ox(e,t){const r=e||"Primary";return"base"===t?"var(--Buttons-"+r+"-Button)":"highlight"===t?"rgb(var(--Buttons-"+r+"-Highlight))":"lowlight"===t?"rgb(var(--Buttons-"+r+"-Lowlight))":void 0}function Lx(e){const t=e||"Primary";return"Default"===t?"var(--Text)":"var(--Text-"+t+")"}function Mx(e,t){const r=(e-90)*Math.PI/180;return{dx:Math.cos(r)*t,dy:Math.sin(r)*t}}const Wx={"display-large":{fontFamily:"var(--Header-Font-Family)",fontSize:"var(--Display-Large-Font-Size)",fontWeight:"var(--Display-Large-Font-Weight)",letterSpacing:"var(--Display-Large-Letter-Spacing)",pxHint:64},"display-small":{fontFamily:"var(--Header-Font-Family)",fontSize:"var(--Display-Small-Font-Size)",fontWeight:"var(--Display-Small-Font-Weight)",letterSpacing:"var(--Display-Small-Letter-Spacing)",pxHint:48}};function Dx({text:e="Your Brand. Perfected.",curves:r,arc:o=160,radius:n=300,direction:i="up",rotation:a=0,autoCrop:l=!0,textStyle:s="display-large",fontSize:d,fontFamily:c,fontWeight:u,letterSpacing:p,color:h="var(--Text, #1a1a1a)",bevel:m=!1,bevelTheme:f="Primary",bevelPreset:g,bevelCustom:x,className:b,style:v,...y}){const S=g?Px(g,x):null,k=S?!!S.bevel:!!m,B=Wx[s]||Wx["display-large"],w=c??B.fontFamily,C=d??B.fontSize,T=u??B.fontWeight,I=p??B.letterSpacing,A="number"==typeof d?d:B.pxHint,z=r&&r.length>0?r:[{arc:o,radius:n,direction:i}],{d:R,width:E,upMax:P,downMax:O,pathId:L}=function(e){return t.useMemo(()=>{const t="dino-curved-text-"+Math.random().toString(36).slice(2,9);let r=0;const o=0;let n="M "+r+" "+o,i=0,a=0;for(const{arc:t,radius:l,direction:s}of e){const e=Fx(t,1,359),d=Math.max(10,l),c=e*Math.PI/180,u=2*d*Math.sin(c/2),p=d*(1-Math.cos(c/2));r+=u,n+=" A "+d+" "+d+" 0 "+(e>180?1:0)+" "+("up"===s?1:0)+" "+r+" "+o,"up"===s?i=Math.max(i,p):a=Math.max(a,p)}return{d:n,width:r,upMax:i,downMax:a,pathId:t}},[JSON.stringify(e)])}(z),M=Math.ceil(P+A),W=Math.ceil(O+A),D=Math.ceil(A),F=Math.ceil(E+2*D),N=M+W,H=D,V=M,Q=a?"rotate("+a+" "+F/2+" "+N/2+")":void 0,j=t.useRef(null),[G,U]=t.useState(null),[X,K]=t.useState(A);t.useEffect(()=>{if(!j.current||"undefined"==typeof ResizeObserver)return;const e=j.current,t=()=>{const t=e.getBoundingClientRect(),r=G?G.width:F;if(!r||!t.width)return;const o=t.width/r;K(A*o)};t();const r=new ResizeObserver(t);return r.observe(e),()=>r.disconnect()},[F,A,G]);const q=k&&X>=19;t.useLayoutEffect(()=>{if(!l)return void U(null);const e=j.current;if(!e)return;const t=e.querySelector("text");if(!t)return;let r;try{r=t.getBBox()}catch(e){return}if(!r||!r.width||!r.height)return;const o=F/2,n=N/2,i=a*Math.PI/180,s=Math.cos(i),d=Math.sin(i),c=(e,t)=>{const r=e-o,i=t-n;return{x:o+r*s-i*d,y:n+r*d+i*s}},u=[c(r.x,r.y),c(r.x+r.width,r.y),c(r.x,r.y+r.height),c(r.x+r.width,r.y+r.height)],p=Math.min(...u.map(e=>e.x)),h=Math.max(...u.map(e=>e.x)),m=Math.min(...u.map(e=>e.y)),f=Math.max(...u.map(e=>e.y)),g=.12*A,x={x:p-g,y:m-g,width:h-p+2*g,height:f-m+2*g};U(e=>e&&Math.abs(e.x-x.x)<.5&&Math.abs(e.y-x.y)<.5&&Math.abs(e.width-x.width)<.5&&Math.abs(e.height-x.height)<.5?e:x)},[l,e,JSON.stringify(z),a,A,I,w,T,k,f,g,JSON.stringify(x)]);const J=G?G.x+" "+G.y+" "+G.width+" "+G.height:"0 0 "+F+" "+N,Y=G?G.width:F,Z=G?G.height:N;return ce("svg",{ref:j,viewBox:J,width:Y,height:Z,preserveAspectRatio:"xMidYMid meet",xmlns:"http://www.w3.org/2000/svg",style:{display:"block",maxWidth:"100%",height:"auto",overflow:"visible",...v},"aria-label":e,role:"img",className:["dino-curved-text",b].filter(Boolean).join(" "),...y,children:[de("defs",{children:de("path",{id:L,d:R,transform:"translate("+H+" "+V+")"})}),ce("g",{transform:Q,children:[q&&(()=>{const t=S?S.depth/96:.045,r=Math.max(2,Math.round(A*t)),o=Math.max(1,Math.round(A*t*.67)),n={fontFamily:w,fontSize:"number"==typeof C?C+"px":C,fontWeight:T,letterSpacing:"number"==typeof I?I+"px":I};return ce(ue,{children:[de("text",{className:"dino-bevel-layer dino-bevel-layer--lowlight",fill:"rgb(var(--Buttons-"+f+"-Lowlight))",transform:"translate(0 "+r+")",style:n,children:de("textPath",{href:"#"+L,startOffset:"50%",textAnchor:"middle",children:e})}),de("text",{className:"dino-bevel-layer dino-bevel-layer--highlight",fill:"rgb(var(--Buttons-"+f+"-Highlight))",transform:"translate(0 -"+o+")",style:n,children:de("textPath",{href:"#"+L,startOffset:"50%",textAnchor:"middle",children:e})})]})})(),de("text",{className:"dino-curved-text__base",fill:q?"var(--Buttons-"+f+"-Button)":k?Lx(f):h,style:{fontFamily:w,fontSize:"number"==typeof C?C+"px":C,fontWeight:T,letterSpacing:"number"==typeof I?I+"px":I},children:de("textPath",{href:"#"+L,startOffset:"50%",textAnchor:"middle",children:e})})]})]})}function Fx(e,t,r){return Math.max(t,Math.min(r,e))}const Nx=[{value:"display-large",label:"Display Large"},{value:"display-small",label:"Display Small"}],Hx=[{value:"text",label:"Text",css:"var(--Text)"},{value:"primary",label:"Primary",css:"var(--Text-Primary)"},{value:"secondary",label:"Secondary",css:"var(--Text-Secondary)"},{value:"tertiary",label:"Tertiary",css:"var(--Text-Tertiary)"}],Vx=zx.map(e=>({value:e,label:e}));function Qx({label:e,selected:t,onClick:r}){return de(An,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function jx(){const[e,t]=r("Your Brand. Perfected."),[n,a]=r("display-large"),[l,s]=r("primary"),[d,c]=r([(u="up",{arc:140,radius:340,direction:u})]);var u;const[p,m]=r(0),[f,g]=r(8),[x,b]=r(700),[v,y]=r(!1),[S,k]=r("Primary"),[w,C]=r("Classic"),T=o(null),[I,A]=r(null);i(()=>{T.current&&A({current:T.current.querySelector("text")})},[l,n,d,p,f,x,v,S,w]);const z=Hx.find(e=>e.value===l)?.css||Hx[0].css;function R(e,t){c(r=>r.map((r,o)=>o===e?{...r,...t}:r))}return ce(h,{children:[de(Jr,{style:{marginBottom:12},children:"Curved Display Text"}),de(co,{color:"quiet",style:{marginBottom:24,maxWidth:720},children:"Decorative text laid along an SVG arc. Chain multiple arcs to build a wave — each curve gets its own radius, arc sweep, and direction. Uses your design system's decorative font + text tokens."}),ce(h,{sx:{display:"grid",gridTemplateColumns:"repeat(auto-fit, minmax(360px, 1fr))",gap:3,alignItems:"start"},children:[de(h,{sx:{minWidth:0},children:de(h,{ref:T,"data-surface":"Container",sx:{background:"var(--Background)",borderRadius:2,p:3,display:"flex",alignItems:"center",justifyContent:"center",overflow:"auto",position:"sticky",top:16},children:de(Dx,{text:e,curves:d,textStyle:n,rotation:p,letterSpacing:f,fontWeight:x,bevel:v,bevelTheme:S,bevelPreset:v?w:void 0,color:z})})}),de(h,{sx:{minWidth:0,alignSelf:"flex-start"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(ai,{defaultValue:0,variant:"standard",color:"primary",children:[ce(li,{children:[de(si,{children:"Playground"}),de(si,{children:"Accessibility"})]}),de(di,{value:0,children:ce(B,{spacing:3,sx:{p:3,maxWidth:720},children:[de(Jn,{label:"Text",value:e,onChange:e=>t(e.target.value),placeholder:"Your headline…",size:"medium"}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"CURVES"}),de(B,{direction:"row",spacing:1,children:[1,2].map(e=>de(Qx,{label:String(e),selected:d.length===e,onClick:()=>function(e){c(t=>{if(e===t.length)return t;if(e>t.length){const r=[...t];for(;r.length<e;){const e=r[r.length-1];r.push({arc:e.arc,radius:e.radius,direction:"up"===e.direction?"down":"up"})}return r}return t.slice(0,e)})}(e)},e))}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:"One curve is an arch. Two curves chain end-to-end for a wave."})]}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:12},children:"PER-CURVE SETTINGS"}),de(B,{spacing:2,children:d.map((e,t)=>ce(h,{"data-surface":"Container",style:{background:"var(--Background)",border:"1px solid var(--Border)",borderRadius:8,padding:12},children:[ce(B,{direction:"row",alignItems:"center",spacing:2,sx:{mb:1},children:[ce(bo,{style:{fontWeight:700},children:["Curve ",t+1]}),de("div",{style:{flex:1}}),ce(B,{direction:"row",spacing:1,children:[de(Qx,{label:"⌢ Up",selected:"up"===e.direction,onClick:()=>R(t,{direction:"up"})}),de(Qx,{label:"⌣ Down",selected:"down"===e.direction,onClick:()=>R(t,{direction:"down"})})]})]}),ce(B,{spacing:1,children:[ce("div",{children:[ce(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:["Radius",ce("span",{style:{float:"right"},children:[e.radius,"px"]})]}),de(ms,{min:100,max:600,step:10,value:e.radius,onChange:(e,r)=>R(t,{radius:r})})]}),ce("div",{children:[ce(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:["Arc sweep",ce("span",{style:{float:"right"},children:[e.arc,"°"]})]}),de(ms,{min:40,max:280,step:5,value:e.arc,onChange:(e,r)=>R(t,{arc:r})})]})]})]},t))})]}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"TYPOGRAPHY"}),de(B,{direction:"row",spacing:1,sx:{flexWrap:"wrap",rowGap:1},children:Nx.map(e=>de(Qx,{label:e.label,selected:n===e.value,onClick:()=>a(e.value)},e.value))}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:"Uses the lib's DisplayLarge / DisplaySmall tokens (font-family, size, weight, letter-spacing)."})]}),ce(h,{children:[ce(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:["LETTER SPACING",ce("span",{style:{float:"right"},children:[f,"px"]})]}),de(ms,{min:-4,max:40,step:1,value:f,onChange:(e,t)=>g(t)}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:"Adjusts the gap between characters along the wave."})]}),ce(h,{children:[ce(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:["FONT WEIGHT",de("span",{style:{float:"right"},children:x})]}),de(ms,{min:100,max:900,step:100,value:x,onChange:(e,t)=>b(t)}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:"Heavier weights read better at decorative sizes. Available weights depend on the loaded display font."})]}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"BEVEL"}),de(oa,{label:"3D bevel effect",checked:v,onChange:e=>y(e.target.checked)}),v&&ce(h,{sx:{mt:1.5},children:[de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:6},children:"Preset"}),de(B,{direction:"row",spacing:1,sx:{flexWrap:"wrap",rowGap:1,mb:1.5},children:Ex.map(e=>de(Qx,{label:e,selected:w===e,onClick:()=>C(e)},e))}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:6},children:"Bevel theme"}),de(B,{direction:"row",spacing:1,sx:{flexWrap:"wrap",rowGap:1},children:Vx.map(e=>de(Qx,{label:e.label,selected:S===e.value,onClick:()=>k(e.value)},e.value))})]}),ce(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:["Bevel layers use ",ce("code",{children:["--Buttons-","{Theme}","-Button"]})," for the fill, with ",de("code",{children:"Highlight"})," + ",de("code",{children:"Lowlight"}),"tokens for the bright/shadow stripes. CurvedText honors a preset's ",de("em",{children:"depth"})," only — angle, softness, and drop-shadow fields are stacked-rendering limitations and are ignored here (the full filter pipeline lives in ",de("code",{children:"<BevelText>"}),"). Shadow-only presets render no effect. Auto-hides below 19px so the 3:1 bevel contrast doesn't compromise small-text legibility."]})]}),ce(h,{children:[ce(B,{direction:"row",alignItems:"center",sx:{mb:1},children:[ce(To,{style:{color:"var(--Text-Quiet)",flex:1},children:["ROTATION",ce("span",{style:{float:"right",marginRight:12},children:[p,"°"]})]}),de(An,{variant:"default-outline",size:"small",onClick:function(){const t=T.current?.querySelector("svg");if(!t)return;const r=t.querySelector("path"),o=t.querySelector("text");if(!r||!o)return;const n=r.getTotalLength();if(!n)return;let i=0;try{i=o.getComputedTextLength?.()||0}catch(e){}i||(i=Math.min(n,18*e.length));const a=Math.max(0,(n-i)/2),l=Math.min(n,a+i),s=r.getPointAtLength(a),d=r.getPointAtLength(l),c=180*Math.atan2(d.y-s.y,d.x-s.x)/Math.PI,u=Math.max(-45,Math.min(45,Math.round(-c)));m(u)},children:"Auto-level"})]}),de(ms,{min:-45,max:45,step:1,value:p,onChange:(e,t)=>m(t)}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:'Tilts the whole text block around its center. "Auto-level" rotates so the text\'s start and end sit on the same horizontal line — useful when a multi-curve wave makes the reading line slant.'})]}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{direction:"row",spacing:1,sx:{flexWrap:"wrap",rowGap:1},children:Hx.map(e=>de(Qx,{label:e.label,selected:l===e.value,onClick:()=>s(e.value)},e.value))})]})]})}),de(di,{value:1,children:ce(B,{spacing:2,sx:{p:3,maxWidth:560},children:[de(bo,{style:{color:"var(--Text-Quiet)"},children:"Live WCAG 2.1 contrast against the painted background. Decorative display text counts as large text — AA needs 3:1, AAA needs 4.5:1 — but DinoDesign defaults to 4.5:1 across the board."}),I&&de(vx,{targetRef:I,label:"Curved text",deps:[l,n,JSON.stringify(d),p,f]}),ce(ao,{color:"quiet",children:["The SVG sets ",de("code",{children:'role="img"'})," and"," ",de("code",{children:"aria-label"})," to the rendered text so screen readers announce it as a labeled image, not a stream of individual glyphs."]})]})})]})})})]})]})}const Gx={"display-large":{fontFamily:"var(--Header-Font-Family)",fontSize:"var(--Display-Large-Font-Size)",fontWeight:"var(--Display-Large-Font-Weight)",letterSpacing:"var(--Display-Large-Letter-Spacing)",pxHint:96},"display-small":{fontFamily:"var(--Header-Font-Family)",fontSize:"var(--Display-Small-Font-Size)",fontWeight:"var(--Display-Small-Font-Weight)",letterSpacing:"var(--Display-Small-Letter-Spacing)",pxHint:64}};function Ux({text:e="DinoDesign",theme:r="Primary",preset:o="Classic",custom:n,textStyle:i="display-large",fontSize:a,fontFamily:l,fontWeight:s,letterSpacing:d,className:c,style:u,...p}){const h=Gx[i]||Gx["display-large"],m=l??h.fontFamily,f=a??h.fontSize,g=s??h.fontWeight,x=d??h.letterSpacing,b="number"==typeof a?a:h.pxHint,v=Px(o,n),y="dino-bevel-"+t.useId().replace(/:/g,""),S=y+"-s",k=t.useRef(null),[B,w]=t.useState(b),C=.6*b,T=Math.max(400,e.length*C+80),I=1.9*b,A=T/2,z=.7*I;t.useEffect(()=>{if(!k.current||"undefined"==typeof ResizeObserver)return;const e=k.current,t=()=>{const t=e.getBoundingClientRect();T&&t.width&&w(b*(t.width/T))};t();const r=new ResizeObserver(t);return r.observe(e),()=>r.disconnect()},[T,b]);const R=B>=19,E=v.bevel?Mx(v.angle+180,v.depth):{dx:0,dy:0},P=v.bevel?Mx(v.angle,v.depth):{dx:0,dy:0},O=v.shadow?Mx(v.angle,v.shadowDistance??6):{dx:0,dy:0},L=R?Ox(r,"base"):Lx(r),M=Ox(r,"highlight"),W=Ox(r,"lowlight"),D={fontFamily:m,fontSize:"number"==typeof f?f+"px":f,fontWeight:g,letterSpacing:"number"==typeof x?x+"px":x},F=v.bevel&&R?"url(#"+y+")":void 0,N=v.shadow&&R?"url(#"+S+")":void 0;return ce("svg",{ref:k,viewBox:"0 0 "+T+" "+I,width:T,height:I,preserveAspectRatio:"xMidYMid meet",xmlns:"http://www.w3.org/2000/svg",style:{display:"block",maxWidth:"100%",height:"auto",overflow:"visible",...u},"aria-label":e,role:"img",className:["dino-bevel-text",c].filter(Boolean).join(" "),...p,children:[ce("defs",{children:[v.shadow&&de("filter",{id:S,x:"-30%",y:"-30%",width:"160%",height:"160%",children:de("feDropShadow",{dx:O.dx.toFixed(2),dy:O.dy.toFixed(2),stdDeviation:v.shadowBlur??8,style:{floodColor:W,floodOpacity:v.shadowOpacity??.6}})}),v.bevel&&ce("filter",{id:y,x:"-5%",y:"-5%",width:"110%",height:"110%",colorInterpolationFilters:"sRGB",children:[de("feGaussianBlur",{in:"SourceAlpha",stdDeviation:(v.softness??1)+.5,result:"blur-alpha"}),de("feOffset",{in:"blur-alpha",dx:P.dx.toFixed(2),dy:P.dy.toFixed(2),result:"shadow-offset"}),de("feFlood",{style:{floodColor:W,floodOpacity:.95},result:"shadow-flood"}),de("feComposite",{in:"shadow-flood",in2:"shadow-offset",operator:"in",result:"shadow-shaped"}),de("feComposite",{in:"shadow-shaped",in2:"SourceAlpha",operator:"in",result:"shadow-clipped"}),de("feOffset",{in:"blur-alpha",dx:E.dx.toFixed(2),dy:E.dy.toFixed(2),result:"hi-offset"}),de("feFlood",{style:{floodColor:M,floodOpacity:.95},result:"hi-flood"}),de("feComposite",{in:"hi-flood",in2:"hi-offset",operator:"in",result:"hi-shaped"}),de("feComposite",{in:"hi-shaped",in2:"SourceAlpha",operator:"in",result:"hi-clipped"}),ce("feMerge",{children:[de("feMergeNode",{in:"SourceGraphic"}),de("feMergeNode",{in:"shadow-clipped"}),de("feMergeNode",{in:"hi-clipped"})]})]})]}),v.shadow&&R&&de("text",{className:"dino-bevel-layer dino-bevel-layer--shadow",x:A,y:z,textAnchor:"middle",fill:L,filter:N,style:D,"aria-hidden":"true",children:e}),de("text",{className:v.bevel?"dino-bevel-text__base dino-bevel-layer":"dino-bevel-text__base",x:A,y:z,textAnchor:"middle",fill:L,filter:F,style:D,children:e})]})}const Xx=[...Ex.map(e=>({value:e,label:e,description:Rx[e].description})),{value:"custom",label:"Custom",description:"Tune every knob"}],Kx=[{value:"light",label:"Light",css:"var(--Surface)"},{value:"warm",label:"Warm",css:"var(--Surface-Dim)"},{value:"dark",label:"Dark",css:"var(--Container-High)"}];function qx({label:e,selected:t,onClick:r}){return de(An,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function Jx({option:e,active:t,onClick:r}){return ce(h,{onClick:r,role:"button",tabIndex:0,onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),r())},sx:{flex:"1 1 140px",minWidth:130,cursor:"pointer",border:"1.5px solid",borderColor:t?"var(--Buttons-Primary-Border)":"var(--Border)",background:t?"rgb(var(--Buttons-Primary-Highlight) / 0.18)":"var(--Background)",borderRadius:"var(--Style-Border-Radius)",p:1.5,transition:"border-color 0.15s, background 0.15s",textAlign:"center","&:hover":{borderColor:"var(--Buttons-Primary-Border)"},"&:focus-visible":{outline:"2px solid var(--Focus-Visible)",outlineOffset:2}},children:[de(bo,{style:{fontWeight:600,color:"var(--Text)"},children:e.label}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:2},children:e.description})]})}function Yx(){const[e,t]=r("DinoDesign"),[o,n]=r("Primary"),[i,a]=r("Classic"),[l,s]=r("light"),[d,c]=r(135),[u,p]=r(5),[m,f]=r(1),[g,x]=r(!0),[b,v]=r(!0),[y,S]=r(6),[k,w]=r(8),[C,T]=r(60),[I,A]=r(96),[z,R]=r(900),[E,P]=r(0),O="custom"===i,L=O?{angle:d,depth:u,softness:m,bevel:g,shadow:b,shadowDistance:y,shadowBlur:k,shadowOpacity:C/100}:void 0;const M=Kx.find(e=>e.value===l)?.css||Kx[0].css;return ce(h,{children:[de(Jr,{style:{marginBottom:12},children:"Bevel Display Text"}),de(co,{color:"quiet",style:{marginBottom:24,maxWidth:720},children:"Straight-line display text with an SVG inset-bevel and optional drop shadow. Colors are locked to the active button-palette tokens (Button / Highlight / Lowlight) so the same preset reads correctly under any theme."}),ce(h,{sx:{display:"grid",gridTemplateColumns:"repeat(auto-fit, minmax(360px, 1fr))",gap:3,alignItems:"start"},children:[de(h,{sx:{minWidth:0},children:de(h,{"data-surface":"Container",sx:{background:M,borderRadius:2,p:4,display:"flex",alignItems:"center",justifyContent:"center",minHeight:240,overflow:"auto",position:"sticky",top:16,transition:"background 0.2s"},children:de(Ux,{text:e,theme:o,preset:i,custom:L,fontSize:I,fontWeight:z,letterSpacing:E})})}),de(h,{sx:{minWidth:0,alignSelf:"flex-start"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(ai,{defaultValue:0,variant:"standard",color:"primary",children:[ce(li,{children:[de(si,{children:"Playground"}),de(si,{children:"Accessibility"})]}),de(di,{value:0,children:ce(B,{spacing:3,sx:{p:3,maxWidth:720},children:[de(Jn,{label:"Text",value:e,onChange:e=>t(e.target.value),placeholder:"Your headline…",size:"medium"}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"THEME"}),de(B,{direction:"row",spacing:1,sx:{flexWrap:"wrap",rowGap:1},children:zx.map(e=>de(qx,{label:e,selected:o===e,onClick:()=>n(e)},e))}),ce(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:["Resolves to ",ce("code",{children:["--Buttons-","{Theme}","-Button"]})," ","(fill), ",de("code",{children:"-Highlight"})," (light edge), and"," ",de("code",{children:"-Lowlight"})," (shadow edge)."]})]}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"PRESETS"}),de(h,{sx:{display:"flex",flexWrap:"wrap",gap:1},children:Xx.map(e=>de(Jx,{option:e,active:i===e.value,onClick:()=>function(e){if(a(e),"custom"!==e){const t=Px(e);c(t.angle),p(t.depth??5),f(t.softness??1),x(t.bevel),v(t.shadow),S(t.shadowDistance??6),w(t.shadowBlur??8),T(Math.round(100*(t.shadowOpacity??.6)))}}(e.value)},e.value))})]}),O&&ce(h,{sx:{border:"1px solid var(--Border)",borderRadius:"var(--Style-Border-Radius)",p:2},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:12},children:"CUSTOM"}),ce(B,{spacing:2,children:[ce("div",{children:[ce(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:["Light angle",ce("span",{style:{float:"right"},children:[d,"°"]})]}),de(ms,{min:0,max:360,step:5,value:d,onChange:(e,t)=>c(t)})]}),ce(h,{sx:{border:"1px solid var(--Border-Variant)",borderRadius:1,p:1.5},children:[de(oa,{label:"Inset bevel",checked:g,onChange:e=>x(e.target.checked)}),g&&ce(B,{spacing:1.5,sx:{mt:1.5},children:[ce("div",{children:[ce(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:["Depth",ce("span",{style:{float:"right"},children:[u,"px"]})]}),de(ms,{min:1,max:16,step:1,value:u,onChange:(e,t)=>p(t)})]}),ce("div",{children:[ce(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:["Softness",ce("span",{style:{float:"right"},children:[m,"px"]})]}),de(ms,{min:0,max:6,step:.5,value:m,onChange:(e,t)=>f(t)})]})]})]}),ce(h,{sx:{border:"1px solid var(--Border-Variant)",borderRadius:1,p:1.5},children:[de(oa,{label:"Drop shadow",checked:b,onChange:e=>v(e.target.checked)}),b&&ce(B,{spacing:1.5,sx:{mt:1.5},children:[ce("div",{children:[ce(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:["Distance",ce("span",{style:{float:"right"},children:[y,"px"]})]}),de(ms,{min:1,max:24,step:1,value:y,onChange:(e,t)=>S(t)})]}),ce("div",{children:[ce(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:["Blur",ce("span",{style:{float:"right"},children:[k,"px"]})]}),de(ms,{min:0,max:24,step:1,value:k,onChange:(e,t)=>w(t)})]}),ce("div",{children:[ce(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:["Opacity",ce("span",{style:{float:"right"},children:[C,"%"]})]}),de(ms,{min:10,max:100,step:5,value:C,onChange:(e,t)=>T(t)})]})]})]})]})]}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"TYPOGRAPHY"}),ce(B,{spacing:2,children:[ce("div",{children:[ce(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:["Font size",ce("span",{style:{float:"right"},children:[I,"px"]})]}),de(ms,{min:32,max:160,step:4,value:I,onChange:(e,t)=>A(t)})]}),ce("div",{children:[ce(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:["Font weight",de("span",{style:{float:"right"},children:z})]}),de(ms,{min:400,max:900,step:100,value:z,onChange:(e,t)=>R(t)})]}),ce("div",{children:[ce(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:["Letter spacing",ce("span",{style:{float:"right"},children:[E,"px"]})]}),de(ms,{min:-2,max:20,step:1,value:E,onChange:(e,t)=>P(t)})]})]})]}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"PREVIEW BACKGROUND"}),de(B,{direction:"row",spacing:1,children:Kx.map(e=>de(qx,{label:e.label,selected:l===e.value,onClick:()=>s(e.value)},e.value))}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:"Showcase-only — doesn't affect the emitted code."})]})]})}),de(di,{value:1,children:ce(B,{spacing:2,sx:{p:3,maxWidth:560},children:[ce(bo,{style:{color:"var(--Text-Quiet)"},children:["BevelText uses the same Highlight / Lowlight token pair as button bevels, which target the WCAG 2.1 large-text minimum (3:1). Bevel text is decorative display — the SVG sets"," ",de("code",{children:'role="img"'})," and ",de("code",{children:"aria-label"})," to the rendered string so screen readers announce it as a labeled image, not a stream of glyphs."]}),de(ao,{color:"quiet",children:"Keep the rendered glyph height above ~24px when the bevel is on — at smaller sizes the highlight / lowlight stripes optically reduce the legible stroke width and the 3:1 contrast no longer feels comfortable."})]})})]})})})]})]})}function Zx({open:e,onClose:t,items:o=[],onItemClick:n,width:i=280,variant:a="temporary",header:l,footer:s,sx:d={},...c}){const[u,p]=r(null),[f,g]=r({}),x=(e,r)=>{p(r),n?.(e),"temporary"===a&&t?.()},b="permanent"===a?"permanent":"standard"===a?"standard":"temporary",v=ce(h,{sx:{display:"flex",flexDirection:"column",height:"100%",backgroundColor:"var(--Container)",color:"var(--Text)"},children:[l&&de(h,{sx:{p:2,borderBottom:"1px solid var(--Border-Variant)"},children:"string"==typeof l?de(T,{variant:"h6",sx:{fontWeight:700},children:l}):l}),de(_,{sx:{flex:1,overflow:"auto",py:1},children:o.map((e,t)=>{const r=u===t,o=e.submenu&&e.submenu.length>0,n=f[t];return ce(h,{children:[de(w,{title:e.tooltip||"",placement:"right",children:de(ee,{disablePadding:!0,children:ce(te,{onClick:()=>{o?(e=>{g(t=>({...t,[e]:!t[e]}))})(t):x(e,t)},selected:r&&!o,sx:{backgroundColor:r&&!o?"var(--Buttons-Primary-Button)":"transparent",color:r&&!o?"var(--Buttons-Primary-Text)":"var(--Text)","&:hover":{backgroundColor:r&&!o?"var(--Buttons-Primary-Button)":"var(--Container-High)"},"&.Mui-selected":{backgroundColor:"var(--Buttons-Primary-Button)",color:"var(--Buttons-Primary-Text)","&:hover":{backgroundColor:"var(--Buttons-Primary-Button)"}},transition:"all 0.2s ease-in-out"},children:[e.icon&&de(re,{sx:{color:r&&!o?"var(--Buttons-Primary-Text)":"var(--Icons-Primary)",minWidth:40},children:e.badge?de(m,{badgeContent:e.badge,color:"error",children:e.icon}):e.icon}),de(oe,{primary:e.label,primaryTypographyProps:{variant:"body2",fontWeight:r&&!o?600:500}}),o&&de(h,{sx:{ml:1},children:de(n?Gt:Se,{})})]})})}),o&&de(ne,{in:n,timeout:"auto",unmountOnExit:!0,children:de(_,{component:"div",disablePadding:!0,children:e.submenu.map((e,t)=>de(ee,{disablePadding:!0,children:ce(te,{onClick:()=>x(e,t),sx:{pl:4,backgroundColor:"transparent",color:"var(--Text)","&:hover":{backgroundColor:"var(--Container-High)"},"&.Mui-selected":{backgroundColor:"var(--Buttons-Primary-Button)",color:"var(--Buttons-Primary-Text)"}},children:[e.icon&&de(re,{sx:{color:"var(--Icons-Primary)",minWidth:40},children:e.icon}),de(oe,{primary:e.label})]})},t))})}),e.divider&&de(ie,{sx:{my:1,borderColor:"var(--Border-Variant)"}})]},t)})}),s&&de(h,{sx:{borderTop:"1px solid var(--Border-Variant)",p:2},children:"string"==typeof s?de(T,{variant:"caption",sx:{color:"var(--Text-Quiet)"},children:s}):s})]});return"permanent"===a?de(h,{sx:{width:i,flexShrink:0,...d},children:v}):de(ae,{variant:b,open:e,onClose:t,PaperProps:{sx:{width:i,backgroundColor:"var(--Container)",color:"var(--Text)",...d}},...c,children:v})}function $x({layout:e="side",navItems:t=[{label:"Home",icon:de(Be,{}),path:"/"},{label:"About",icon:de(Pe,{}),path:"/about"},{label:"Settings",icon:de(Ce,{}),path:"/settings"},{label:"Help",icon:de(gr,{}),path:"/help"}],title:o="My App",children:n,onLayoutChange:i,onNavigate:a,sx:l={},...s}){const d=le(),c=se(d.breakpoints.down("md"));se(d.breakpoints.down("lg"));const[u,p]=r(!1),[m,f]=r(!1),g=c?"top":e,x=({compact:e=!1})=>de(_,{sx:{py:1},children:t.map((t,r)=>de(w,{title:e?t.label:"",placement:"right",children:ce(te,{onClick:()=>{a?.(t),p(!1)},sx:{color:"var(--Text)","&:hover":{backgroundColor:"var(--Container-High)"},transition:"all 0.2s ease-in-out",justifyContent:e?"center":"flex-start",px:e?1:2},children:[de(re,{sx:{color:"var(--Icons-Primary)",minWidth:e?"auto":40,mr:e?0:1},children:t.icon}),!e&&de(oe,{primary:t.label})]})},r))});return ce(h,{sx:{minHeight:"100vh",backgroundColor:"var(--Background)",color:"var(--Text)",display:"flex",flexDirection:"column",...l},...s,children:[de(Z,{position:"static",sx:{backgroundColor:"var(--Header)",color:"var(--Text)",boxShadow:"0 1px 3px rgba(0,0,0,0.12)",borderBottom:"1px solid var(--Border-Variant)"},children:ce($,{children:[c&&"rail"!==g&&de(C,{edge:"start",color:"inherit",onClick:()=>p(!u),sx:{mr:2},children:de(u?Ot:Pt,{})}),de(T,{variant:"h6",sx:{flex:1,fontWeight:700},children:o}),!c&&i&&ce(E,{value:e,exclusive:!0,onChange:(e,t)=>{t&&i(t)},size:"small",sx:{"& .MuiToggleButton-root":{color:"var(--Text)",border:"1px solid var(--Border)","&.Mui-selected":{backgroundColor:"var(--Button-Primary-Button)",color:"#fff",borderColor:"var(--Button-Primary-Button)"}}},children:[de(R,{value:"side","aria-label":"side nav",children:"☰ Side"}),de(R,{value:"rail","aria-label":"rail nav",children:"⫷ Rail"}),de(R,{value:"side-rail","aria-label":"side-rail nav",children:"☰⫷ Both"})]})]})}),ce(h,{sx:{display:"flex",flex:1},children:[("rail"===g||"side-rail"===g)&&!c&&de(h,{sx:{width:80,backgroundColor:"var(--Container)",borderRight:"1px solid var(--Border-Variant)",display:"flex",flexDirection:"column",py:2},children:de(x,{compact:!0})}),("side"===g||"side-rail"===g)&&!c&&ce(h,{sx:{width:m?80:280,backgroundColor:"var(--Container)",borderRight:"1px solid var(--Border-Variant)",transition:"width 0.3s ease-in-out",display:"flex",flexDirection:"column"},children:[ce(h,{sx:{p:2,display:"flex",alignItems:"center",justifyContent:"space-between",borderBottom:"1px solid var(--Border-Variant)",minHeight:64},children:[!m&&de(T,{variant:"h6",sx:{fontWeight:700,color:"var(--Text)"},children:"Menu"}),de(C,{size:"small",onClick:()=>f(!m),sx:{color:"var(--Icons-Primary)"},children:m?"›":"‹"})]}),de(x,{compact:m})]}),c&&ce(ae,{anchor:"left",open:u,onClose:()=>p(!1),sx:{"& .MuiDrawer-paper":{backgroundColor:"var(--Container)",width:280}},children:[de(h,{sx:{p:2,borderBottom:"1px solid var(--Border-Variant)"},children:de(T,{variant:"h6",sx:{fontWeight:700},children:"Menu"})}),de(x,{compact:!1})]}),de(h,{sx:{flex:1,overflow:"auto",backgroundColor:"var(--Background)"},children:de(F,{maxWidth:"lg",sx:{py:4},children:n})})]})]})}const _x={small:{summaryPadding:"8px 12px",detailsPy:"8px",detailsPx:"12px",fontSize:"13px",iconSize:"small"},medium:{summaryPadding:"12px 8px 12px 16px",detailsPy:"12px",detailsPx:"16px",fontSize:"14px",iconSize:"medium"},large:{summaryPadding:"16px 20px",detailsPy:"16px",detailsPx:"20px",fontSize:"16px",iconSize:"large"}},eb=s({variant:"solid",color:"default",size:"medium",spacing:0}),tb=s({expanded:!1,toggle:()=>{},disabled:!1,accordionId:""});function rb({children:e,variant:t="solid",color:r="default",size:o="medium",spacing:n=0,className:i="",sx:a={},...l}){const s="default"===r?"Default":(d=r).charAt(0).toUpperCase()+d.slice(1);var d;const c=0===n,u="default"===r?"Default":s,p="dark"===t?"Surface-Dimmest":"light"===t?"Surface-Brightest":"Surface";return de(eb.Provider,c?{value:{variant:t,color:r,size:o,spacing:n},children:de(h,{role:"presentation",className:"accordion-group accordion-group-"+t+" "+i,sx:{border:"1px solid var(--Border-Variant)",borderRadius:"var(--Button-Radius)",overflow:"hidden",boxShadow:an,...a},...l,children:de(h,{"data-theme":u,"data-surface":p,sx:{backgroundColor:"var(--Background)",borderRadius:"calc(var(--Button-Radius) - 1px)"},children:e})})}:{value:{variant:t,color:r,size:o,spacing:n,dataTheme:u,dataSurface:p},children:de(h,{role:"presentation",className:"accordion-group accordion-group-"+t+" accordion-group-spaced "+i,sx:{display:"flex",flexDirection:"column",gap:.5===n?"var(--Sizing-Half)":1===n?"var(--Sizing-1)":1.5===n?"var(--Sizing-1-and-Half)":2===n?"var(--Sizing-2)":8*n+"px",...a},...l,children:e})})}function ob({children:e,expanded:t,defaultExpanded:o=!1,onChange:n,disabled:i=!1,className:a="",sx:s={},...d}){const[c,u]=r(o),p=void 0!==t,m=p?t:c,{spacing:f,dataTheme:g,dataSurface:x}=l(eb),b=0===f,[v]=r(()=>"accordion-"+Math.random().toString(36).substring(2,9)),y=de(tb.Provider,{value:{expanded:m,toggle:()=>{if(i)return;const e=!m;p||u(e),n?.(e)},disabled:i,accordionId:v},children:de(h,{className:"accordion"+(m?" accordion-expanded":"")+(i?" accordion-disabled":"")+" "+a,sx:{...b&&{borderBottom:"1px solid var(--Border-Variant)","&:last-child":{borderBottom:"none"}},opacity:i?.5:1,...s},...d,children:e})});return b?y:de(h,{sx:{border:"1px solid var(--Border-Variant)",borderRadius:"var(--Button-Radius)",overflow:"hidden",boxShadow:an},children:de(h,{"data-theme":g,"data-surface":x,sx:{backgroundColor:"var(--Background)",borderRadius:"calc(var(--Button-Radius) - 1px)"},children:y})})}const nb={small:ao,medium:co,large:fo};function ib({children:e,startDecorator:t,endDecorator:r,eyebrow:o,overline:n,secondary:i,expandIcon:a,className:s="",sx:d={},...c}){const{expanded:u,toggle:p,disabled:m,accordionId:f}=l(tb),{size:g}=l(eb),x=_x[g]||_x.medium,b=nb[g]||nb.medium,v=a||de(jo,{size:x.iconSize,sx:{color:u?"var(--Text)":"var(--Quiet)",transition:"color 0.15s ease"},children:de(Se,{})}),y={overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",display:"block"};return ce(h,{component:"button",role:"button","aria-expanded":u,"aria-controls":f+"-content",id:f+"-header",tabIndex:m?-1:0,onClick:p,onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),p())},className:"accordion-summary"+(u?" accordion-summary-expanded":"")+" "+s,sx:{display:"flex",flexDirection:"row",alignItems:"flex-start",justifyContent:"flex-start",width:"100%",gap:"var(--Sizing-1-and-Half)",padding:x.summaryPadding,border:"none",backgroundColor:"transparent",color:u?"var(--Text)":"var(--Quiet)",fontSize:x.fontSize,fontFamily:"inherit",cursor:m?"not-allowed":"pointer",textAlign:"left",transition:"color 0.2s ease, background-color 0.15s ease",borderRadius:0,"&:hover":m?{}:{color:"var(--Text)","& .omni-icon":{color:"var(--Text)"}},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"-3px"},...d},...c,children:[t&&de(h,{className:"accordion-summary-start",sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",flexShrink:0},children:t}),ce(h,{sx:{flex:1,minWidth:0,display:"flex",flexDirection:"column",gap:"var(--Sizing-Half)"},children:[(o??n)&&de(To,{style:{...y,color:"var(--Text-Quiet)"},children:o??n}),null!=e&&de(b,{style:{...y,color:"inherit",fontWeight:600},children:e}),i&&de(ao,{style:{...y,color:"var(--Text-Quiet)"},children:i})]}),r&&de(h,{className:"accordion-summary-end",sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",flexShrink:0},children:r}),de(h,{sx:{display:"flex",alignItems:"center",justifyContent:"center",transform:u?"rotate(180deg)":"rotate(0deg)",transition:"transform 0.25s ease",flexShrink:0},children:v})]})}function ab({children:e,className:t="",sx:r={},...o}){const{expanded:n,accordionId:i}=l(tb),{size:a}=l(eb),s=_x[a]||_x.medium;return n?de(h,{role:"region",id:i+"-content","aria-labelledby":i+"-header",className:"accordion-details "+t,sx:{padding:"0 "+s.detailsPx+" "+s.detailsPy+" "+s.detailsPx,color:"var(--Text)",fontSize:s.fontSize,fontFamily:"inherit",lineHeight:1.6,...r},...o,children:e}):null}const lb={1:{padLeft:0,togglePadLeft:0},2:{padLeft:24,togglePadLeft:4},3:{padLeft:48,togglePadLeft:0},4:{padLeft:72,togglePadLeft:0},5:{padLeft:88,togglePadLeft:4}},sb={0:{padLeft:8},1:{padLeft:48},2:{padLeft:56,slotPadLeft:4},3:{padLeft:64,slotPadLeft:4},4:{padLeft:88,slotPadLeft:4},5:{padLeft:112},6:{padLeft:128}};function db({label:e,icon:t,level:r=0,toggle:o="none",onToggle:n,disabled:i=!1,size:a="small",className:l="",sx:s={},children:d,...c}){const u=6===r&&"none"!==o?"none":o,p="on"===u,m="none"!==u,f=m?lb[r]||{padLeft:0,togglePadLeft:0}:sb[r]||sb[0],g={paddingTop:"8px",paddingRight:"8px",paddingBottom:"8px",paddingLeft:(f.padLeft??8)+"px"};return ce(h,{className:"tree-branch tree-branch-"+a+" tree-branch-level-"+r+" tree-branch-toggle-"+u+(i?" tree-branch-disabled":"")+(l?" "+l:""),sx:{width:"100%",...s},...c,children:[ce(h,{component:"button",type:"button",role:"treeitem","aria-expanded":m?p:void 0,"aria-disabled":i||void 0,tabIndex:i?-1:0,onClick:e=>{i||m&&(e.stopPropagation(),n?.(p?"off":"on"))},disabled:i,sx:{display:"flex",flexDirection:"row",alignItems:"center",gap:"4px",width:"100%",minHeight:"24px",...g,border:"none",backgroundColor:"transparent",fontFamily:"inherit",color:"inherit",textAlign:"left",cursor:i?"not-allowed":"pointer",opacity:i?.5:1,outline:"none",transition:"background-color 0.15s ease, color 0.15s ease","&:hover":i?{}:{backgroundColor:"var(--Hover)"},"&:active":i?{}:{backgroundColor:"var(--Pressed)"},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"-2px"}},children:[m&&de(h,{className:"tree-branch-toggle",sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",flexShrink:0,paddingLeft:(f.togglePadLeft??0)+"px"},children:de(h,{sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",transition:"transform 0.2s ease",transform:p?"rotate(-90deg)":"rotate(0deg)"},children:de(jo,{size:"small",children:de(Kt,{})})})}),ce(h,{className:"tree-branch-slot",sx:{display:"flex",flexDirection:"row",alignItems:"center",gap:"4px",flex:1,minWidth:0,...void 0!==f.slotPadLeft&&{paddingLeft:f.slotPadLeft+"px"}},children:[t&&de(h,{sx:{display:"inline-flex",alignItems:"center",flexShrink:0},children:de(jo,{size:"small",children:t})}),null!=e&&de(lo,{style:{color:"inherit",overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",display:"block",flex:1,minWidth:0},children:e})]})]}),p&&d&&de(h,{role:"group",sx:{display:"flex",flexDirection:"column"},children:d})]})}const cb=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",ub=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}],pb=e=>de(h,{sx:{width:8,height:8,borderRadius:"50%",backgroundColor:e,flexShrink:0}}),hb=[{id:"1",label:"Documents",icon:de(cr,{}),badge:pb("var(--Warning-Text, orange)"),children:[{id:"1-1",label:"Company",icon:de(xr,{}),badge:pb("var(--Warning-Text, orange)"),children:[{id:"1-1-1",label:"Invoice",icon:de(vr,{})},{id:"1-1-2",label:"Meeting notes",icon:de(br,{})},{id:"1-1-3",label:"Tasks list",icon:de(br,{})},{id:"1-1-4",label:"Equipment",icon:de(vr,{})},{id:"1-1-5",label:"Video conference",icon:de(yr,{})}]},{id:"1-2",label:"Personal",icon:de(cr,{})},{id:"1-3",label:"Group photo",icon:de(Ut,{})}]},{id:"2",label:"Bookmarked",icon:de(_t,{}),children:[{id:"2-1",label:"Favourites",icon:de(br,{})}]},{id:"3",label:"History",icon:de(cr,{})},{id:"4",label:"Trash",icon:de(we,{}),disabled:!0}],mb=JSON.stringify(If,null,2);function fb({ratio:e,threshold:t}){if(!e)return de(bo,{style:{color:"var(--Text-Quiet)"},children:"--"});const r=parseFloat(e)>=t;return ce(h,{sx:{display:"inline-flex",alignItems:"center",gap:.5},children:[ce(h,{sx:{px:1,py:.25,borderRadius:"4px",fontSize:"11px",fontWeight:700,backgroundColor:r?"var(--Tags-Success-BG)":"var(--Tags-Error-BG)",color:r?"var(--Tags-Success-Text)":"var(--Tags-Error-Text)"},children:[e,":1"]}),de(bo,{style:{color:r?"var(--Tags-Success-Text)":"var(--Tags-Error-Text)"},children:r?"Pass":"Fail"})]})}function gb({label:e,ratio:t,threshold:r,note:o}){return ce(h,{sx:{display:"flex",justifyContent:"space-between",alignItems:"flex-start",py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(h,{sx:{flex:1},children:[de(ao,{style:{color:"var(--Text)"},children:e}),o&&de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:o})]}),de(fb,{ratio:t,threshold:r})]})}function xb({label:e,selected:t,onClick:r}){return de(An,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function bb({color:e,selected:t,onClick:r}){const o=cb(e);return de(h,{component:"button",onClick:()=>r(e),"aria-label":"Select "+o,"aria-pressed":t,title:o,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+o+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Buttons-"+o+"-Text)",pointerEvents:"none"}})})}function vb({value:e,onChange:t}){const[o,n]=r(e),[i,a]=r(null);return ce(h,{children:[ce(h,{sx:{display:"flex",justifyContent:"space-between",alignItems:"center",mb:1},children:[de(To,{style:{color:"var(--Text-Quiet)"},children:"TREE DATA (JSON)"}),de(An,{variant:"ghost",size:"small",onClick:()=>{n(mb),a(null),t(If)},children:"Reset"})]}),de(h,{component:"textarea",value:o,onChange:e=>{n(e.target.value);try{const r=JSON.parse(e.target.value);a(null),t(r)}catch(e){a(e.message)}},spellCheck:!1,rows:10,sx:{width:"100%",fontFamily:"monospace",fontSize:"11px",backgroundColor:"#1e1e1e",color:i?"#f87171":"#e5e7eb",border:"1px solid "+(i?"#f87171":"#333"),borderRadius:"6px",padding:"10px",resize:"vertical",outline:"none",boxSizing:"border-box",lineHeight:1.5,"&:focus":{borderColor:"var(--Focus-Visible)"}}}),i&&ce(bo,{style:{color:"#f87171",display:"block",marginTop:4},children:["JSON error: ",i]})]})}function yb(){const[e,t]=r("solid"),[a,l]=r("primary"),[s,d]=r("default"),[c,u]=r("slide"),[p,m]=r("single"),[f,g]=r(!1),[x,b]=r(!1),[v,y]=r(!1),[S,k]=r(If),[w,C]=r(null),[T,A]=r("Surface"),[z,R]=r({}),E=o(null),P=cb(a),O=v?hb:S,L=n((e,t)=>e&&getComputedStyle(e).getPropertyValue(t).trim()||null,[]);i(()=>{const e=setTimeout(()=>{const e=E.current;R({text:L(e,"--Text"),textQuiet:L(e,"--Text-Quiet"),background:L(e,"--Background"),border:L(e,"--Border"),focusVisible:L(e,"--Focus-Visible"),activeBtn:L(e,"--Buttons-"+P+"-Button"),activeBorder:L(e,"--Buttons-"+P+"-Border")})},50);return()=>clearTimeout(e)},[a,w,L,P]);return ce(h,{sx:{pb:8},children:[de(Jr,{children:"Tree View"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ci,{ref:E,theme:w,children:de(h,{sx:{width:"100%",maxWidth:360},children:de(Tf,{color:a,variant:e,density:s,animation:c,selectionMode:p,checkboxSelection:f,disableSelection:x,items:O,defaultExpandedItems:["1","1-1","2"]})})}),de(Qi,{code:(()=>{const t=["<OmniTreeView"];return"default"!==a&&t.push(' color="'+a+'"'),"default"!==e&&t.push(' variant="'+e+'"'),"default"!==s&&t.push(' density="'+s+'"'),"slide"!==c&&t.push(' animation="'+c+'"'),"single"!==p&&t.push(' selectionMode="'+p+'"'),f&&t.push(" checkboxSelection"),x&&t.push(" disableSelection"),t.push(" items={treeData}"),t.push("/>"),t.join("\n")})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(ai,{defaultValue:0,variant:"standard",color:"primary",children:[ce(li,{children:[de(si,{children:"Playground"}),de(si,{children:"Accessibility"})]}),de(di,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(mi,{theme:w,onThemeChange:C,surface:T,onSurfaceChange:A})}),ce(h,{children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"STYLE"}),ce(B,{direction:"row",spacing:1,children:[de(xb,{label:"Solid",selected:"solid"===e,onClick:()=>t("solid")}),de(xb,{label:"Light",selected:"light"===e,onClick:()=>t("light")})]})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:ub.map(e=>ce(h,{children:[de(bo,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:e.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:e.colors.map(e=>de(bb,{color:e,selected:a===e,onClick:l},e))})]},e.label))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"DENSITY"}),ce(B,{direction:"row",spacing:1,children:[de(xb,{label:"Compact",selected:"compact"===s,onClick:()=>d("compact")}),de(xb,{label:"Default",selected:"default"===s,onClick:()=>d("default")})]})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"ANIMATION"}),de(B,{direction:"row",spacing:1,children:["none","slide","spring"].map(e=>de(xb,{label:cb(e),selected:c===e,onClick:()=>u(e)},e))})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SELECTION MODE"}),ce(B,{direction:"row",spacing:1,children:[de(xb,{label:"Single",selected:"single"===p,onClick:()=>m("single")}),de(xb,{label:"Multi",selected:"multi"===p,onClick:()=>m("multi")})]})]}),ce(h,{sx:{mt:3},children:[de(To,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"OPTIONS"}),ce(h,{sx:{display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Show Icons"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Load sample data with icons and badges"})]}),de(ra,{checked:v,onChange:e=>y(e.target.checked),size:"small","aria-label":"Show icons"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Checkbox Selection"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Show checkboxes for each item"})]}),de(ra,{checked:f,onChange:e=>g(e.target.checked),size:"small","aria-label":"Checkbox selection"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(ko,{children:"Disable Selection"}),de(bo,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Items are not selectable"})]}),de(ra,{checked:x,onChange:e=>b(e.target.checked),size:"small","aria-label":"Disable selection"})]})]}),!v&&de(h,{sx:{mt:3},children:de(vb,{value:mb,onChange:k})})]})}),de(di,{value:1,children:de(h,{sx:{p:3},children:ce(B,{spacing:3,children:[ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"Text Contrast (WCAG 1.4.3 — 4.5:1)"}),de(gb,{label:"Resting: var(--Text-Quiet) vs. background",ratio:Xi(z.textQuiet,z.background),threshold:4.5,note:"Unselected items use Text-Quiet"}),de(gb,{label:"Hover: var(--Text) vs. background",ratio:Xi(z.text,z.background),threshold:4.5,note:"Hovered items use var(--Text)"}),de(gb,{label:"Active (solid): var(--Text) vs. var(--Buttons-"+P+"-Button)",ratio:Xi(z.text,z.activeBtn),threshold:4.5,note:"Selected item with solid fill"})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"Focus Indicator (WCAG 2.4.11 — 3:1)"}),de(gb,{label:"var(--Focus-Visible) vs. background",ratio:Xi(z.focusVisible,z.background),threshold:3,note:"outline: 2px solid var(--Focus-Visible); outline-offset: -2px"})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Zr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Role",value:'role="tree" on root, role="treeitem" on each node'},{label:"Expansion",value:'aria-expanded="true/false" on parent items'},{label:"Selection",value:"aria-selected on selected items"},{label:"Disabled",value:'aria-disabled="true" on disabled items'},{label:"Icons",value:"Icon elements are aria-hidden — label carries the accessible name"},{label:"Keyboard",value:"Arrow keys navigate, Enter/Space selects, * expands all siblings"}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ao,{children:[e,":"]}),de(bo,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})]})})})]})})})]})]})}function Sb(e,t){if(document.getElementById(t))return;const r=document.createElement("link");r.rel="stylesheet",r.href=e,r.id=t,document.head.appendChild(r)}const kb=[{value:"desktop",label:"Desktop",note:"32px touch targets (WCAG)"},{value:"ios-mobile",label:"iOS Mobile",note:"44px touch targets (HIG)"},{value:"ios-tablet",label:"iOS Tablet",note:"44px touch targets (HIG)"},{value:"android",label:"Android",note:"48px touch targets (M3)"}],Bb={desktop:"32px","ios-mobile":"44px","ios-tablet":"44px",android:"48px"};function wb(){const{mode:e,switchMode:t}=function(e="light"){const[t,o]=r(e);return i(()=>{Sb("/styles/foundation.css","css-foundation"),Sb("/styles/core.css","css-core"),Sb("/styles/Light-Mode.css","css-mode"),Sb("/styles/base.css","css-base"),Sb("/styles/typography-tokens.css","css-typography-tokens")},[]),{mode:t,switchMode:e=>{const t=document.getElementById("css-mode");t&&(t.href="dark"===e?"/styles/Dark-Mode.css":"/styles/Light-Mode.css"),o(e),localStorage.setItem("themeMode",e)}}}("light"),[o,n]=r(!1),[a,l]=r("desktop");i(()=>{const e=localStorage.getItem("dino-platform")||"desktop",r=localStorage.getItem("themeMode")||"light";l(e),document.documentElement.style.setProperty("--Button-Height",Bb[e]||"32px"),"dark"===r&&t("dark")},[]);const s=e=>{l(e),localStorage.setItem("dino-platform",e),document.documentElement.style.setProperty("--Button-Height",Bb[e]||"32px")};return ce(ue,{children:[de(h,{onClick:()=>n(!0),role:"button","aria-label":"Open settings",sx:{position:"fixed",bottom:24,right:24,width:52,height:52,borderRadius:"50%",backgroundColor:"var(--Buttons-Tertiary-Button)",color:"var(--Buttons-Tertiary-Text)",display:"flex",alignItems:"center",justifyContent:"center",cursor:"pointer",boxShadow:"0 4px 12px rgba(0,0,0,0.15)",zIndex:999,transition:"transform 0.15s ease, box-shadow 0.15s ease","&:hover":{transform:"scale(1.08)",boxShadow:"0 6px 16px rgba(0,0,0,0.2)"}},children:de(Rt,{sx:{fontSize:24}})}),de(bu,{anchor:"right",open:o,onClose:()=>n(!1),hideBackdrop:!0,size:"small",sx:{width:320,zIndex:99999999},children:ce(h,{sx:{p:3,height:"100%",display:"flex",flexDirection:"column"},children:[ce(h,{sx:{display:"flex",justifyContent:"space-between",alignItems:"center",mb:2},children:[de(Zr,{children:"Settings"}),de(An,{iconOnly:!0,variant:"ghost",size:"small",onClick:()=>n(!1),"aria-label":"Close settings",children:de(Et,{fontSize:"small"})})]}),de(ie,{sx:{mb:3,borderColor:"var(--Border)"}}),de(h,{sx:{flex:1,overflowY:"auto"},children:ce(B,{spacing:4,children:[ce(h,{children:[de(To,{style:{color:"var(--Text)",opacity:.85,display:"block",marginBottom:12,fontWeight:600},children:"MODE"}),ce(B,{direction:"row",spacing:1,children:[de(An,{variant:"light"===e?"primary":"primary-outline",size:"small",onClick:()=>t("light"),sx:{flex:1},children:"Light"}),de(An,{variant:"dark"===e?"primary":"primary-outline",size:"small",onClick:()=>t("dark"),sx:{flex:1},children:"Dark"})]})]}),ce(h,{children:[de(To,{style:{color:"var(--Text)",opacity:.85,display:"block",marginBottom:12,fontWeight:600},children:"PLATFORM"}),de(B,{spacing:1,children:kb.map(({value:e,label:t,note:r})=>{const o=a===e;return ce(h,{onClick:()=>s(e),sx:{p:1.5,borderRadius:"var(--Style-Border-Radius)",cursor:"pointer",border:o?"2px solid var(--Buttons-Primary-Button)":"1px solid var(--Border)",backgroundColor:o?"var(--Background)":"transparent",display:"flex",justifyContent:"space-between",alignItems:"center",transition:"all 0.15s ease","&:hover":{backgroundColor:"var(--Hover)"}},children:[ce(h,{children:[de(ao,{style:{color:o?"var(--Buttons-Primary-Button)":"var(--Text)",fontWeight:o?600:400},children:t}),de(bo,{style:{color:"var(--Text)",opacity:.7},children:r})]}),o&&de(h,{sx:{width:8,height:8,borderRadius:"50%",backgroundColor:"var(--Buttons-Primary-Button)",flexShrink:0}})]},e)})})]})]})}),de(ie,{sx:{my:3,borderColor:"var(--Border)"}}),de(An,{variant:"primary-outline",size:"small",onClick:()=>{s("desktop"),t("light")},sx:{width:"100%"},children:"Reset to Defaults"})]})})]})}var Cb={};export{ob as Accordion,ab as AccordionDetails,rb as AccordionGroup,ib as AccordionSummary,Df as Alert,nu as AlertDialog,jf as AlertShowcase,Zg as AppBar,ax as AppBarShowcase,$l as Autocomplete,ns as AutocompleteShowcase,qo as Avatar,Jo as AvatarGroup,Sg as AvatarShowcase,en as Badge,Ag as BadgeShowcase,Ux as BevelText,Yx as BevelTextShowcase,zl as BlackWhiteToggleButtonGroup,co as Body,ho as Body1,mo as Body2,po as BodyBold,fo as BodyLarge,xo as BodyLargeBold,go as BodyLargeSemibold,uo as BodySemibold,ao as BodySmall,so as BodySmallBold,lo as BodySmallSemibold,Gd as BottomNavigation,tc as BottomNavigationShowcase,js as Box,Ks as BoxShowcase,bd as BreadcrumbItem,xd as Breadcrumbs,Sd as BreadcrumbsShowcase,An as Button,ba as ButtonGroup,Fo as ButtonSmall,No as ButtonText,jr as CAP_HEIGHT_TRIM,bo as Caption,vo as CaptionBold,Wa as Card,wa as CenteredStack,Hn as Checkbox,Ps as Chip,eg as CircularProgress,ig as CircularProgressShowcase,Qi as CodeBlock,Ji as Colors,qs as Container,Vi as CopyButton,dx as Copyright,Ax as CopyrightShowcase,Dx as CurvedText,jx as CurvedTextShowcase,Go as DEFAULT_AVATAR_SRC,If as DEFAULT_ITEMS,wl as DefaultToggleButtonGroup,Jg as DesktopAppBar,ou as Dialog,lu as DialogShowcase,Gr as DisplayLarge,Ur as DisplayMedium,Xr as DisplaySmall,Og as Divider,bu as Drawer,vu as DrawerClose,Su as DrawerContent,yu as DrawerHeader,Of as DrawerShowcase,Mf as DropZone,Od as Dropdown,Sa as DynoStack,Tf as DynoTreeView,Ml as EmailTextField,Ol as ErrorToggleButtonGroup,Io as Eyebrow,zo as EyebrowLarge,Ao as EyebrowMedium,To as EyebrowSmall,Ua as Fab,$a as FabShowcase,ux as Footer,Cx as FooterShowcase,iu as FormDialog,Cc as Gradient,Js as Grid,za as GridStack,Kr as H1,qr as H2,Jr as H3,Yr as H4,Zr as H5,$r as H6,ka as HStack,lx as Header,_r as Heading,jo as Icon,ga as IconBadge,Qa as IconBadgeShowcase,ha as IconShowcase,Rl as InfoToggleButtonGroup,Ea as InsetStack,ko as Label,yo as LabelExtraSmall,Bo as LabelLarge,So as LabelSmall,wo as Legal,Co as LegalSemibold,zf as LightTreeView,Tc as LinearGradient,sg as LinearProgress,hg as LinearProgressShowcase,Ws as Link,Hg as List,Ng as ListItem,Fg as ListItemDecorator,$x as MainLayout,Md as Menu,Ld as MenuButton,Dd as MenuDivider,Wd as MenuItem,Qd as MenuShowcase,zc as MeshCardGradient,Ac as MeshGradient,Yg as MobileAppBar,hu as Modal,Al as NeutralToggleButtonGroup,pl as NumberField,xl as NumberFieldShowcase,Wo as NumberLarge,Mo as NumberMedium,Lo as NumberSmall,Fl as NumberTextField,Uc as OmniDesignProvider,Sa as OmniStack,Tf as OmniTreeView,Eo as Overline,Oo as OverlineLarge,Po as OverlineMedium,Ro as OverlineSmall,Bd as Pagination,Ad as PaginationShowcase,Rc as Paper,Wl as PasswordTextField,Nl as PhoneTextField,Ec as Popover,Cl as PrimaryToggleButtonGroup,$s as RATIO_NAMES,Ic as RadialGradient,ds as Radio,cs as RadioGroup,us as RadioInput,_a as Rail,nl as RailShowcase,gs as RangeSlider,vs as Rating,vs as RatingInput,rd as Ratio,dd as RatioShowcase,Ia as ResponsiveStack,Pa as ScrollStack,Ss as SearchField,Ts as SearchFieldShowcase,Dl as SearchTextField,Tl as SecondaryToggleButtonGroup,Ys as Section,Zs as SectionShowcase,_n as Select,Jl as SelectShowcase,Fa as SelectableCard,wb as SettingsPanel,Zx as Sidebar,fs as Slider,fs as SliderInput,Uf as Snackbar,Zf as SnackbarShowcase,Af as SolidTreeView,Ca as SpaceBetweenStack,Yi as Spacing,mc as SpeedDial,yc as SpeedDialShowcase,Aa as Stack,Ra as StackDivider,Qs as StackShowcase,lc as Step,ac as Stepper,hc as StepperShowcase,to as Subtitle,no as Subtitle1,io as Subtitle2,eo as SubtitleLarge,oo as SubtitleMedium,ro as SubtitleSmall,El as SuccessToggleButtonGroup,qc as Surfaced,oa as Switch,oa as SwitchInput,si as Tab,li as TabList,di as TabPanel,Qg as Table,ai as Tabs,fd as TabsShowcase,Il as TertiaryToggleButtonGroup,Vl as TextArea,Ll as TextField,Ql as TextFieldGroup,Jn as TextInput,Kc as ThemedZone,bl as ToggleButton,Bl as ToggleButtonGroup,al as Toolbar,cl as ToolbarShowcase,Xg as Tooltip,db as TreeBranch,yb as TreeViewShowcase,Qr as Typography,Hl as URLTextField,Ba as VStack,Pl as WarningToggleButtonGroup,Ta as WrapStack,Cb as default,Xc as useOmniDesign,ic as useStepperContext,ii as useTabsContext};
41
+ */"production"===process.env.NODE_ENV?Qh.exports=function(){if(Vh)return jh;Vh=1;var e=Symbol.for("react.transitional.element"),t=Symbol.for("react.portal"),r=Symbol.for("react.fragment"),n=Symbol.for("react.strict_mode"),o=Symbol.for("react.profiler"),i=Symbol.for("react.consumer"),a=Symbol.for("react.context"),l=Symbol.for("react.forward_ref"),s=Symbol.for("react.suspense"),d=Symbol.for("react.suspense_list"),c=Symbol.for("react.memo"),u=Symbol.for("react.lazy"),p=Symbol.for("react.view_transition"),h=Symbol.for("react.client.reference");function m(h){if("object"==typeof h&&null!==h){var m=h.$$typeof;switch(m){case e:switch(h=h.type){case r:case o:case n:case s:case d:case p:return h;default:switch(h=h&&h.$$typeof){case a:case l:case u:case c:case i:return h;default:return m}}case t:return m}}}return jh.ContextConsumer=i,jh.ContextProvider=a,jh.Element=e,jh.ForwardRef=l,jh.Fragment=r,jh.Lazy=u,jh.Memo=c,jh.Portal=t,jh.Profiler=o,jh.StrictMode=n,jh.Suspense=s,jh.SuspenseList=d,jh.isContextConsumer=function(e){return m(e)===i},jh.isContextProvider=function(e){return m(e)===a},jh.isElement=function(t){return"object"==typeof t&&null!==t&&t.$$typeof===e},jh.isForwardRef=function(e){return m(e)===l},jh.isFragment=function(e){return m(e)===r},jh.isLazy=function(e){return m(e)===u},jh.isMemo=function(e){return m(e)===c},jh.isPortal=function(e){return m(e)===t},jh.isProfiler=function(e){return m(e)===o},jh.isStrictMode=function(e){return m(e)===n},jh.isSuspense=function(e){return m(e)===s},jh.isSuspenseList=function(e){return m(e)===d},jh.isValidElementType=function(e){return"string"==typeof e||"function"==typeof e||e===r||e===o||e===n||e===s||e===d||"object"==typeof e&&null!==e&&(e.$$typeof===u||e.$$typeof===c||e.$$typeof===a||e.$$typeof===i||e.$$typeof===l||e.$$typeof===h||void 0!==e.getModuleId)},jh.typeOf=m,jh}():Qh.exports=(Gh||(Gh=1,"production"!==process.env.NODE_ENV&&function(){function e(e){if("object"==typeof e&&null!==e){var m=e.$$typeof;switch(m){case t:switch(e=e.type){case n:case i:case o:case d:case c:case h:return e;default:switch(e=e&&e.$$typeof){case l:case s:case p:case u:case a:return e;default:return m}}case r:return m}}}var t=Symbol.for("react.transitional.element"),r=Symbol.for("react.portal"),n=Symbol.for("react.fragment"),o=Symbol.for("react.strict_mode"),i=Symbol.for("react.profiler"),a=Symbol.for("react.consumer"),l=Symbol.for("react.context"),s=Symbol.for("react.forward_ref"),d=Symbol.for("react.suspense"),c=Symbol.for("react.suspense_list"),u=Symbol.for("react.memo"),p=Symbol.for("react.lazy"),h=Symbol.for("react.view_transition"),m=Symbol.for("react.client.reference");Uh.ContextConsumer=a,Uh.ContextProvider=l,Uh.Element=t,Uh.ForwardRef=s,Uh.Fragment=n,Uh.Lazy=p,Uh.Memo=u,Uh.Portal=r,Uh.Profiler=i,Uh.StrictMode=o,Uh.Suspense=d,Uh.SuspenseList=c,Uh.isContextConsumer=function(t){return e(t)===a},Uh.isContextProvider=function(t){return e(t)===l},Uh.isElement=function(e){return"object"==typeof e&&null!==e&&e.$$typeof===t},Uh.isForwardRef=function(t){return e(t)===s},Uh.isFragment=function(t){return e(t)===n},Uh.isLazy=function(t){return e(t)===p},Uh.isMemo=function(t){return e(t)===u},Uh.isPortal=function(t){return e(t)===r},Uh.isProfiler=function(t){return e(t)===i},Uh.isStrictMode=function(t){return e(t)===o},Uh.isSuspense=function(t){return e(t)===d},Uh.isSuspenseList=function(t){return e(t)===c},Uh.isValidElementType=function(e){return"string"==typeof e||"function"==typeof e||e===n||e===i||e===o||e===d||e===c||"object"==typeof e&&null!==e&&(e.$$typeof===p||e.$$typeof===u||e.$$typeof===l||e.$$typeof===a||e.$$typeof===s||e.$$typeof===m||void 0!==e.getModuleId)},Uh.typeOf=e}()),Uh);var Xh=Qh.exports;function $h(e){if("object"!=typeof e||null===e)return!1;const t=Object.getPrototypeOf(e);return!(null!==t&&t!==Object.prototype&&null!==Object.getPrototypeOf(t)||Symbol.toStringTag in e||Symbol.iterator in e)}function Kh(t){if(e.isValidElement(t)||Xh.isValidElementType(t)||!$h(t))return t;const r={};return Object.keys(t).forEach(e=>{r[e]=Kh(t[e])}),r}function qh(t,r,n={clone:!0}){const o=n.clone?{...t}:t;return $h(t)&&$h(r)&&Object.keys(r).forEach(i=>{e.isValidElement(r[i])||Xh.isValidElementType(r[i])?o[i]=r[i]:$h(r[i])&&Object.prototype.hasOwnProperty.call(t,i)&&$h(t[i])?o[i]=qh(t[i],r[i],n):n.clone?o[i]=$h(r[i])?Kh(r[i]):r[i]:o[i]=r[i]}),o}function Yh(e){if("string"!=typeof e)throw new Error("production"!==process.env.NODE_ENV?"MUI: `capitalize(string)` expects a string argument.":function(e,...t){const r=new URL(`https://mui.com/production-error/?code=${e}`);return t.forEach(e=>r.searchParams.append("args[]",e)),`Minified MUI error #${e}; visit ${r} for the full message.`}(7));return e.charAt(0).toUpperCase()+e.slice(1)}function Jh(e){const{values:t={xs:0,sm:600,md:900,lg:1200,xl:1536},unit:r="px",step:n=5,...o}=e,i=(e=>{const t=Object.keys(e).map(t=>({key:t,val:e[t]}))||[];return t.sort((e,t)=>e.val-t.val),t.reduce((e,t)=>({...e,[t.key]:t.val}),{})})(t),a=Object.keys(i);function l(e){return`@media (min-width:${"number"==typeof t[e]?t[e]:e}${r})`}function s(e){return`@media (max-width:${("number"==typeof t[e]?t[e]:e)-n/100}${r})`}function d(e,o){const i=a.indexOf(o);return`@media (min-width:${"number"==typeof t[e]?t[e]:e}${r}) and (max-width:${(-1!==i&&"number"==typeof t[a[i]]?t[a[i]]:o)-n/100}${r})`}return{keys:a,values:i,up:l,down:s,between:d,only:function(e){return a.indexOf(e)+1<a.length?d(e,a[a.indexOf(e)+1]):l(e)},not:function(e){const t=a.indexOf(e);return 0===t?l(a[1]):t===a.length-1?s(a[t]):d(e,a[a.indexOf(e)+1]).replace("@media","@media not all and")},unit:r,...o}}function Zh(e,t){if(!e.containerQueries)return t;const r=Object.keys(t).filter(e=>e.startsWith("@container")).sort((e,t)=>{const r=/min-width:\s*([0-9.]+)/;return+(e.match(r)?.[1]||0)-+(t.match(r)?.[1]||0)});return r.length?r.reduce((e,r)=>{const n=t[r];return delete e[r],e[r]=n,e},{...t}):t}const _h={borderRadius:4},em="production"!==process.env.NODE_ENV?Vi.oneOfType([Vi.number,Vi.string,Vi.object,Vi.array]):{};function tm(e,t){return t?qh(e,t,{clone:!1}):e}const rm={xs:0,sm:600,md:900,lg:1200,xl:1536},nm={keys:["xs","sm","md","lg","xl"],up:e=>`@media (min-width:${rm[e]}px)`},om={containerQueries:e=>({up:t=>{let r="number"==typeof t?t:rm[t]||t;return"number"==typeof r&&(r=`${r}px`),e?`@container ${e} (min-width:${r})`:`@container (min-width:${r})`}})};function im(e,t,r){const n=e.theme||{};if(Array.isArray(t)){const e=n.breakpoints||nm;return t.reduce((n,o,i)=>(n[e.up(e.keys[i])]=r(t[i]),n),{})}if("object"==typeof t){const e=n.breakpoints||nm;return Object.keys(t).reduce((o,i)=>{if(a=e.keys,"@"===(l=i)||l.startsWith("@")&&(a.some(e=>l.startsWith(`@${e}`))||l.match(/^@\d/))){const e=function(e,t){const r=t.match(/^@([^/]+)?\/?(.+)?$/);if(!r){if("production"!==process.env.NODE_ENV)throw new Error(`MUI: The provided shorthand (${t}) is invalid. The format should be \`@<breakpoint | number>\` or \`@<breakpoint | number>/<container>\`.\nFor example, \`@sm\` or \`@600\` or \`@40rem/sidebar\`.`);return null}const[,n,o]=r,i=Number.isNaN(+n)?n||0:+n;return e.containerQueries(o).up(i)}(n.containerQueries?n:om,i);e&&(o[e]=r(t[i],i))}else if(Object.keys(e.values||rm).includes(i)){o[e.up(i)]=r(t[i],i)}else{const e=i;o[e]=t[e]}var a,l;return o},{})}return r(t)}function am(e,t){return e.reduce((e,t)=>{const r=e[t];return(!r||0===Object.keys(r).length)&&delete e[t],e},t)}function lm(e,t,r=!0){if(!t||"string"!=typeof t)return null;if(e&&e.vars&&r){const r=`vars.${t}`.split(".").reduce((e,t)=>e&&e[t]?e[t]:null,e);if(null!=r)return r}return t.split(".").reduce((e,t)=>e&&null!=e[t]?e[t]:null,e)}function sm(e,t,r,n=r){let o;return o="function"==typeof e?e(r):Array.isArray(e)?e[r]||n:lm(e,r)||n,t&&(o=t(o,n,e)),o}function dm(e){const{prop:t,cssProperty:r=e.prop,themeKey:n,transform:o}=e,i=e=>{if(null==e[t])return null;const i=e[t],a=lm(e.theme,n)||{};return im(e,i,e=>{let n=sm(a,o,e);return e===n&&"string"==typeof e&&(n=sm(a,o,`${t}${"default"===e?"":Yh(e)}`,e)),!1===r?n:{[r]:n}})};return i.propTypes="production"!==process.env.NODE_ENV?{[t]:em}:{},i.filterProps=[t],i}const cm={m:"margin",p:"padding"},um={t:"Top",r:"Right",b:"Bottom",l:"Left",x:["Left","Right"],y:["Top","Bottom"]},pm={marginX:"mx",marginY:"my",paddingX:"px",paddingY:"py"},hm=function(e){const t={};return r=>(void 0===t[r]&&(t[r]=e(r)),t[r])}(e=>{if(e.length>2){if(!pm[e])return[e];e=pm[e]}const[t,r]=e.split(""),n=cm[t],o=um[r]||"";return Array.isArray(o)?o.map(e=>n+e):[n+o]}),mm=["m","mt","mr","mb","ml","mx","my","margin","marginTop","marginRight","marginBottom","marginLeft","marginX","marginY","marginInline","marginInlineStart","marginInlineEnd","marginBlock","marginBlockStart","marginBlockEnd"],fm=["p","pt","pr","pb","pl","px","py","padding","paddingTop","paddingRight","paddingBottom","paddingLeft","paddingX","paddingY","paddingInline","paddingInlineStart","paddingInlineEnd","paddingBlock","paddingBlockStart","paddingBlockEnd"],gm=[...mm,...fm];function xm(e,t,r,n){const o=lm(e,t,!0)??r;return"number"==typeof o||"string"==typeof o?e=>"string"==typeof e?e:("production"!==process.env.NODE_ENV&&"number"!=typeof e&&console.error(`MUI: Expected ${n} argument to be a number or a string, got ${e}.`),"string"==typeof o?o.startsWith("var(")&&0===e?0:o.startsWith("var(")&&1===e?o:`calc(${e} * ${o})`:o*e):Array.isArray(o)?e=>{if("string"==typeof e)return e;const r=Math.abs(e);"production"!==process.env.NODE_ENV&&(Number.isInteger(r)?r>o.length-1&&console.error([`MUI: The value provided (${r}) overflows.`,`The supported values are: ${JSON.stringify(o)}.`,`${r} > ${o.length-1}, you need to add the missing values.`].join("\n")):console.error([`MUI: The \`theme.${t}\` array type cannot be combined with non integer values.You should either use an integer value that can be used as index, or define the \`theme.${t}\` as a number.`].join("\n")));const n=o[r];return e>=0?n:"number"==typeof n?-n:"string"==typeof n&&n.startsWith("var(")?`calc(-1 * ${n})`:`-${n}`}:"function"==typeof o?o:("production"!==process.env.NODE_ENV&&console.error([`MUI: The \`theme.${t}\` value (${o}) is invalid.`,"It should be a number, an array or a function."].join("\n")),()=>{})}function bm(e){return xm(e,"spacing",8,"spacing")}function vm(e,t){return"string"==typeof t||null==t?t:e(t)}function ym(e,t,r,n){if(!t.includes(r))return null;const o=function(e,t){return r=>e.reduce((e,n)=>(e[n]=vm(t,r),e),{})}(hm(r),n);return im(e,e[r],o)}function Sm(e,t){const r=bm(e.theme);return Object.keys(e).map(n=>ym(e,t,n,r)).reduce(tm,{})}function km(e){return Sm(e,mm)}function Bm(e){return Sm(e,fm)}function wm(...e){const t=e.reduce((e,t)=>(t.filterProps.forEach(r=>{e[r]=t}),e),{}),r=e=>Object.keys(e).reduce((r,n)=>t[n]?tm(r,t[n](e)):r,{});return r.propTypes="production"!==process.env.NODE_ENV?e.reduce((e,t)=>Object.assign(e,t.propTypes),{}):{},r.filterProps=e.reduce((e,t)=>e.concat(t.filterProps),[]),r}function Cm(e){return"number"!=typeof e?e:`${e}px solid`}function Tm(e,t){return dm({prop:e,themeKey:"borders",transform:t})}km.propTypes="production"!==process.env.NODE_ENV?mm.reduce((e,t)=>(e[t]=em,e),{}):{},km.filterProps=mm,Bm.propTypes="production"!==process.env.NODE_ENV?fm.reduce((e,t)=>(e[t]=em,e),{}):{},Bm.filterProps=fm,"production"===process.env.NODE_ENV||gm.reduce((e,t)=>(e[t]=em,e),{});const Im=Tm("border",Cm),Am=Tm("borderTop",Cm),zm=Tm("borderRight",Cm),Rm=Tm("borderBottom",Cm),Em=Tm("borderLeft",Cm),Pm=Tm("borderColor"),Lm=Tm("borderTopColor"),Mm=Tm("borderRightColor"),Wm=Tm("borderBottomColor"),Om=Tm("borderLeftColor"),Dm=Tm("outline",Cm),Fm=Tm("outlineColor"),Nm=e=>{if(void 0!==e.borderRadius&&null!==e.borderRadius){const t=xm(e.theme,"shape.borderRadius",4,"borderRadius"),r=e=>({borderRadius:vm(t,e)});return im(e,e.borderRadius,r)}return null};Nm.propTypes="production"!==process.env.NODE_ENV?{borderRadius:em}:{},Nm.filterProps=["borderRadius"],wm(Im,Am,zm,Rm,Em,Pm,Lm,Mm,Wm,Om,Nm,Dm,Fm);const Hm=e=>{if(void 0!==e.gap&&null!==e.gap){const t=xm(e.theme,"spacing",8,"gap"),r=e=>({gap:vm(t,e)});return im(e,e.gap,r)}return null};Hm.propTypes="production"!==process.env.NODE_ENV?{gap:em}:{},Hm.filterProps=["gap"];const Vm=e=>{if(void 0!==e.columnGap&&null!==e.columnGap){const t=xm(e.theme,"spacing",8,"columnGap"),r=e=>({columnGap:vm(t,e)});return im(e,e.columnGap,r)}return null};Vm.propTypes="production"!==process.env.NODE_ENV?{columnGap:em}:{},Vm.filterProps=["columnGap"];const Qm=e=>{if(void 0!==e.rowGap&&null!==e.rowGap){const t=xm(e.theme,"spacing",8,"rowGap"),r=e=>({rowGap:vm(t,e)});return im(e,e.rowGap,r)}return null};Qm.propTypes="production"!==process.env.NODE_ENV?{rowGap:em}:{},Qm.filterProps=["rowGap"];function jm(e,t){return"grey"===t?t:e}wm(Hm,Vm,Qm,dm({prop:"gridColumn"}),dm({prop:"gridRow"}),dm({prop:"gridAutoFlow"}),dm({prop:"gridAutoColumns"}),dm({prop:"gridAutoRows"}),dm({prop:"gridTemplateColumns"}),dm({prop:"gridTemplateRows"}),dm({prop:"gridTemplateAreas"}),dm({prop:"gridArea"}));function Gm(e){return e<=1&&0!==e?100*e+"%":e}wm(dm({prop:"color",themeKey:"palette",transform:jm}),dm({prop:"bgcolor",cssProperty:"backgroundColor",themeKey:"palette",transform:jm}),dm({prop:"backgroundColor",themeKey:"palette",transform:jm}));const Um=dm({prop:"width",transform:Gm}),Xm=e=>{if(void 0!==e.maxWidth&&null!==e.maxWidth){const t=t=>{const r=e.theme?.breakpoints?.values?.[t]||rm[t];return r?"px"!==e.theme?.breakpoints?.unit?{maxWidth:`${r}${e.theme.breakpoints.unit}`}:{maxWidth:r}:{maxWidth:Gm(t)}};return im(e,e.maxWidth,t)}return null};Xm.filterProps=["maxWidth"];const $m=dm({prop:"minWidth",transform:Gm}),Km=dm({prop:"height",transform:Gm}),qm=dm({prop:"maxHeight",transform:Gm}),Ym=dm({prop:"minHeight",transform:Gm});dm({prop:"size",cssProperty:"width",transform:Gm}),dm({prop:"size",cssProperty:"height",transform:Gm});wm(Um,Xm,$m,Km,qm,Ym,dm({prop:"boxSizing"}));const Jm={border:{themeKey:"borders",transform:Cm},borderTop:{themeKey:"borders",transform:Cm},borderRight:{themeKey:"borders",transform:Cm},borderBottom:{themeKey:"borders",transform:Cm},borderLeft:{themeKey:"borders",transform:Cm},borderColor:{themeKey:"palette"},borderTopColor:{themeKey:"palette"},borderRightColor:{themeKey:"palette"},borderBottomColor:{themeKey:"palette"},borderLeftColor:{themeKey:"palette"},outline:{themeKey:"borders",transform:Cm},outlineColor:{themeKey:"palette"},borderRadius:{themeKey:"shape.borderRadius",style:Nm},color:{themeKey:"palette",transform:jm},bgcolor:{themeKey:"palette",cssProperty:"backgroundColor",transform:jm},backgroundColor:{themeKey:"palette",transform:jm},p:{style:Bm},pt:{style:Bm},pr:{style:Bm},pb:{style:Bm},pl:{style:Bm},px:{style:Bm},py:{style:Bm},padding:{style:Bm},paddingTop:{style:Bm},paddingRight:{style:Bm},paddingBottom:{style:Bm},paddingLeft:{style:Bm},paddingX:{style:Bm},paddingY:{style:Bm},paddingInline:{style:Bm},paddingInlineStart:{style:Bm},paddingInlineEnd:{style:Bm},paddingBlock:{style:Bm},paddingBlockStart:{style:Bm},paddingBlockEnd:{style:Bm},m:{style:km},mt:{style:km},mr:{style:km},mb:{style:km},ml:{style:km},mx:{style:km},my:{style:km},margin:{style:km},marginTop:{style:km},marginRight:{style:km},marginBottom:{style:km},marginLeft:{style:km},marginX:{style:km},marginY:{style:km},marginInline:{style:km},marginInlineStart:{style:km},marginInlineEnd:{style:km},marginBlock:{style:km},marginBlockStart:{style:km},marginBlockEnd:{style:km},displayPrint:{cssProperty:!1,transform:e=>({"@media print":{display:e}})},display:{},overflow:{},textOverflow:{},visibility:{},whiteSpace:{},flexBasis:{},flexDirection:{},flexWrap:{},justifyContent:{},alignItems:{},alignContent:{},order:{},flex:{},flexGrow:{},flexShrink:{},alignSelf:{},justifyItems:{},justifySelf:{},gap:{style:Hm},rowGap:{style:Qm},columnGap:{style:Vm},gridColumn:{},gridRow:{},gridAutoFlow:{},gridAutoColumns:{},gridAutoRows:{},gridTemplateColumns:{},gridTemplateRows:{},gridTemplateAreas:{},gridArea:{},position:{},zIndex:{themeKey:"zIndex"},top:{},right:{},bottom:{},left:{},boxShadow:{themeKey:"shadows"},width:{transform:Gm},maxWidth:{style:Xm},minWidth:{transform:Gm},height:{transform:Gm},maxHeight:{transform:Gm},minHeight:{transform:Gm},boxSizing:{},font:{themeKey:"font"},fontFamily:{themeKey:"typography"},fontSize:{themeKey:"typography"},fontStyle:{themeKey:"typography"},fontWeight:{themeKey:"typography"},letterSpacing:{},textTransform:{},lineHeight:{},textAlign:{},typography:{cssProperty:!1,themeKey:"typography"}};const Zm=function(){function e(e,t,r,n){const o={[e]:t,theme:r},i=n[e];if(!i)return{[e]:t};const{cssProperty:a=e,themeKey:l,transform:s,style:d}=i;if(null==t)return null;if("typography"===l&&"inherit"===t)return{[e]:t};const c=lm(r,l)||{};if(d)return d(o);return im(o,t,t=>{let r=sm(c,s,t);return t===r&&"string"==typeof t&&(r=sm(c,s,`${e}${"default"===t?"":Yh(t)}`,t)),!1===a?r:{[a]:r}})}return function t(r){const{sx:n,theme:o={},nested:i}=r||{};if(!n)return null;const a=o.unstable_sxConfig??Jm;function l(r){let n=r;if("function"==typeof r)n=r(o);else if("object"!=typeof r)return r;if(!n)return null;const l=function(e={}){const t=e.keys?.reduce((t,r)=>(t[e.up(r)]={},t),{});return t||{}}(o.breakpoints),s=Object.keys(l);let d=l;return Object.keys(n).forEach(r=>{const i=(l=n[r],s=o,"function"==typeof l?l(s):l);var l,s;if(null!=i)if("object"==typeof i)if(a[r])d=tm(d,e(r,i,o,a));else{const e=im({theme:o},i,e=>({[r]:e}));!function(...e){const t=e.reduce((e,t)=>e.concat(Object.keys(t)),[]),r=new Set(t);return e.every(e=>r.size===Object.keys(e).length)}(e,i)?d=tm(d,e):d[r]=t({sx:i,theme:o,nested:!0})}else d=tm(d,e(r,i,o,a))}),!i&&o.modularCssLayers?{"@layer sx":Zh(o,am(s,d))}:Zh(o,am(s,d))}return Array.isArray(n)?n.map(l):l(n)}}();function _m(e,t){const r=this;if(r.vars){if(!r.colorSchemes?.[e]||"function"!=typeof r.getColorSchemeSelector)return{};let n=r.getColorSchemeSelector(e);return"&"===n?t:((n.includes("data-")||n.includes("."))&&(n=`*:where(${n.replace(/\s*&$/,"")}) &`),{[n]:t})}return r.palette.mode===e?t:{}}function ef(e){return"ownerState"!==e&&"theme"!==e&&"sx"!==e&&"as"!==e}Zm.filterProps=["sx"],function(e={},...t){const{breakpoints:r={},palette:n={},spacing:o,shape:i={},...a}=e,l=Jh(r),s=function(e=8,t=bm({spacing:e})){if(e.mui)return e;const r=(...e)=>("production"!==process.env.NODE_ENV&&(e.length<=4||console.error(`MUI: Too many arguments provided, expected between 0 and 4, got ${e.length}`)),(0===e.length?[1]:e).map(e=>{const r=t(e);return"number"==typeof r?`${r}px`:r}).join(" "));return r.mui=!0,r}(o);let d=qh({breakpoints:l,direction:"ltr",components:{},palette:{mode:"light",...n},spacing:s,shape:{..._h,...i}},a);d=function(e){const t=(e,t)=>e.replace("@media",t?`@container ${t}`:"@container");function r(r,n){r.up=(...r)=>t(e.breakpoints.up(...r),n),r.down=(...r)=>t(e.breakpoints.down(...r),n),r.between=(...r)=>t(e.breakpoints.between(...r),n),r.only=(...r)=>t(e.breakpoints.only(...r),n),r.not=(...r)=>{const o=t(e.breakpoints.not(...r),n);return o.includes("not all and")?o.replace("not all and ","").replace("min-width:","width<").replace("max-width:","width>").replace("and","or"):o}}const n={},o=e=>(r(n,e),n);return r(o),{...e,containerQueries:o}}(d),d.applyStyles=_m,d=t.reduce((e,t)=>qh(e,t),d),d.unstable_sxConfig={...Jm,...a?.unstable_sxConfig},d.unstable_sx=function(e){return Zm({sx:e,theme:this})}}();const tf=(e,t,r)=>"function"==typeof r?r(e,t):r,rf=t=>{const{runItemPlugins:r,publicAPI:n,store:o}=Zu(),i=e.useContext(uh),a=Mp(o,tf,t.itemId,i),{id:l,itemId:s,label:d,children:c,rootRef:u}=t,{rootRef:p,contentRef:h,propsEnhancers:m}=r(t),{interactions:f,status:g}=(({itemId:e,children:t})=>{const{store:r,publicAPI:n}=Zu(),o=Mp(r,Zp.isItemExpandable,e),i=Mp(r,Eh.isItemLoading,e),a=Mp(r,Eh.itemHasError,e),l=Ph(t)||o,s=Mp(r,Zp.isItemExpanded,e),d=Mp(r,Ih.isItemFocused,e),c=Mp(r,Kp.isItemSelected,e),u=Mp(r,jp.isItemDisabled,e),p=Mp(r,Bh.isItemBeingEdited,e),h=Mp(r,Bh.isItemEditable,e),m={expandable:l,expanded:s,focused:d,selected:c,disabled:u,editing:p,editable:h,loading:i,error:a},f=()=>{r.labelEditing&&(p?r.labelEditing.setEditedItem(null):r.labelEditing.setEditedItem(e))};return{interactions:{handleExpansion:t=>{if(m.disabled)return;m.focused||r.focus.focusItem(t,e);const n=Kp.isMultiSelectEnabled(r.state)&&(t.shiftKey||t.ctrlKey||t.metaKey);!m.expandable||n&&Zp.isItemExpanded(r.state,e)||r.expansion.setItemExpansion({event:t,itemId:e})},handleSelection:t=>{Kp.canItemBeSelected(r.state,e)&&(m.focused||m.editing||r.focus.focusItem(t,e),Kp.isMultiSelectEnabled(r.state)&&(t.shiftKey||t.ctrlKey||t.metaKey)?t.shiftKey?r.selection.expandSelectionRange(t,e):r.selection.setItemSelection({event:t,itemId:e,keepExistingSelection:!0}):r.selection.setItemSelection({event:t,itemId:e,shouldBeSelected:!0}))},handleCheckboxSelection:t=>{const n=t.nativeEvent.shiftKey,o=Kp.isMultiSelectEnabled(r.state);o&&n?r.selection.expandSelectionRange(t,e):r.selection.setItemSelection({event:t,itemId:e,keepExistingSelection:o,shouldBeSelected:t.target.checked})},toggleItemEditing:f,handleSaveItemLabel:(t,n)=>{r.labelEditing&&Bh.isItemBeingEdited(r.state,e)&&(r.labelEditing.updateItemLabel(e,n),f(),r.focus.focusItem(t,e))},handleCancelItemLabelEditing:t=>{r.labelEditing&&Bh.isItemBeingEdited(r.state,e)&&(f(),r.focus.focusItem(t,e))}},status:m,publicAPI:n}})({itemId:s,children:c}),x=e.useRef(null),b=e.useRef(null),v=Eu(u,p,x),y=Eu(h,b),S=e.useRef(null),k=Mp(o,Kp.isCheckboxSelectionEnabled),B=Mp(o,Dp.treeItemIdAttribute,s,l),w=Mp(o,Ih.isItemTheDefaultFocusableItem,s),C={rootRefObject:x,contentRefObject:b,interactions:f},T=e=>t=>{if(e.onBlur?.(t),t.defaultMuiPrevented)return;const r=o.items.getItemDOMElement(s);g.editing||t.relatedTarget&&ih(t.relatedTarget,r)&&(t.target&&"labelInput"===t.target?.dataset?.element&&ih(t.target,r)||"labelInput"===t.relatedTarget?.dataset?.element)||o.focus.removeFocusedItem()},I=e=>t=>{e.onKeyDown?.(t),t.defaultMuiPrevented||"labelInput"===t.target?.dataset?.element||o.keyboardNavigation.handleItemKeyDown(t,s)},A=e=>t=>{e.onMouseDown?.(t),t.defaultMuiPrevented||(t.shiftKey||t.ctrlKey||t.metaKey||g.disabled)&&t.preventDefault()};return{getContextProviderProps:()=>({itemId:s,id:l}),getRootProps:(e={})=>{const r=Au({},Ou(t),Ou(e)),n=Au({},r,{ref:v,role:"treeitem",tabIndex:w?0:-1,id:B,"aria-expanded":g.expandable?g.expanded:void 0,"aria-disabled":g.disabled||void 0},e,{style:Au({},e.style??{},{"--TreeView-itemDepth":a}),onFocus:(i=r,e=>{i.onFocus?.(e),e.defaultMuiPrevented||!g.focused&&jp.canItemBeFocused(o.state,s)&&e.currentTarget===e.target&&o.focus.focusItem(e,s)}),onBlur:T(r),onKeyDown:I(r)});var i;const l=m.root?.(Au({},C,{externalEventHandlers:r}))??{};return Au({},n,l)},getContentProps:(e={})=>{const t=Ou(e),r=Au({},t,e,{ref:y,onClick:(n=t,e=>{n.onClick?.(e),o.items.handleItemClick(e,s),e.defaultMuiPrevented||S.current?.contains(e.target)||("content"===Zp.triggerSlot(o.state)&&f.handleExpansion(e),k||f.handleSelection(e))}),onMouseDown:A(t),status:g});var n;["expanded","selected","focused","disabled","editing","editable"].forEach(e=>{g[e]&&(r[`data-${e}`]="")});const i=m.content?.(Au({},C,{externalEventHandlers:t}))??{};return Au({},r,i)},getGroupTransitionProps:(e={})=>Au({},Ou(e),{unmountOnExit:!0,component:"ul",role:"group",in:g.expanded,children:c},e),getIconContainerProps:(e={})=>{const t=Ou(e);return Au({},t,e,{onClick:(r=t,e=>{r.onClick?.(e),e.defaultMuiPrevented||"iconContainer"===Zp.triggerSlot(o.state)&&f.handleExpansion(e)})});var r},getCheckboxProps:(e={})=>{const t=Ou(e),r=Au({},t,{ref:S,"aria-hidden":!0},e),n=m.checkbox?.(Au({},C,{externalEventHandlers:t}))??{};return Au({},r,n)},getLabelProps:(e={})=>{const t=Au({},Ou(e)),r=Au({},t,{children:d},e,{onDoubleClick:(n=t,e=>{n.onDoubleClick?.(e),e.defaultMuiPrevented||f.toggleItemEditing()})});var n;const o=m.label?.(Au({},C,{externalEventHandlers:t}))??{};return Au({},o,r)},getLabelInputProps:(e={})=>{const t=Ou(e),r=m.labelInput?.(Au({},C,{externalEventHandlers:t}))??{};return Au({},e,r)},getDragAndDropOverlayProps:(e={})=>{const t=Ou(e),r=m.dragAndDropOverlay?.(Au({},C,{externalEventHandlers:t}))??{};return Au({},e,r)},getErrorContainerProps:(e={})=>Au({},Ou(e),e),getLoadingContainerProps:(e={})=>Au({size:"12px",thickness:6},Ou(e),e),rootRef:v,status:g,publicAPI:n}};function nf(e){return Xu("MuiTreeItem",e)}$u("MuiTreeItem",["root","content","groupTransition","iconContainer","label","checkbox","labelInput","dragAndDropOverlay","errorIcon","loadingIcon","expanded","selected","focused","disabled","editable","editing"]);const of=lr(de("path",{d:"M10 6 8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"}),"TreeViewExpandIcon"),af=lr(de("path",{d:"M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z"}),"TreeViewCollapseIcon"),lf=["ownerState"];function sf(e,t,r){return void 0!==e?e:void 0!==t?t:r}function df(e){const{slots:t,slotProps:r,status:n}=e,{slots:o,slotProps:i}=ep(),a={collapseIcon:sf(t?.collapseIcon,o.collapseIcon,af),expandIcon:sf(t?.expandIcon,o.expandIcon,of),endIcon:sf(t?.endIcon,o.endIcon),icon:t?.icon};let l;l=a?.icon?"icon":n.expandable?n.expanded?"collapseIcon":"expandIcon":"endIcon";const s=a[l],d=rp(Nu({elementType:s,externalSlotProps:e=>Au({},Fu(i[l],e),Fu(r?.[l],e)),ownerState:{}}),lf);return s?de(s,Au({},d)):null}"production"!==process.env.NODE_ENV&&(df.propTypes={slotProps:Vi.object,slots:Vi.object,status:Vi.shape({disabled:Vi.bool.isRequired,editable:Vi.bool.isRequired,editing:Vi.bool.isRequired,error:Vi.bool.isRequired,expandable:Vi.bool.isRequired,expanded:Vi.bool.isRequired,focused:Vi.bool.isRequired,loading:Vi.bool.isRequired,selected:Vi.bool.isRequired}).isRequired});const cf=nr("div",{name:"MuiTreeItemDragAndDropOverlay",slot:"Root",shouldForwardProp:e=>ef(e)&&"action"!==e})(({theme:e})=>({position:"absolute",left:0,display:"flex",top:0,bottom:0,right:0,pointerEvents:"none",variants:[{props:{action:"make-child"},style:{marginLeft:"calc(var(--TreeView-indentMultiplier) * var(--TreeView-itemDepth))",borderRadius:e.shape.borderRadius,backgroundColor:e.vars?`rgba(${e.vars.palette.primary.darkChannel} / ${e.vars.palette.action.focusOpacity})`:or(e.palette.primary.dark,e.palette.action.focusOpacity)}},{props:{action:"reorder-above"},style:{marginLeft:"calc(var(--TreeView-indentMultiplier) * var(--TreeView-itemDepth))",borderTop:`1px solid ${(e.vars||e).palette.action.active}`}},{props:{action:"reorder-below"},style:{marginLeft:"calc(var(--TreeView-indentMultiplier) * var(--TreeView-itemDepth))",borderBottom:`1px solid ${(e.vars||e).palette.action.active}`}},{props:{action:"move-to-parent"},style:{marginLeft:"calc(var(--TreeView-indentMultiplier) * calc(var(--TreeView-itemDepth) - 1))",borderBottom:`1px solid ${(e.vars||e).palette.action.active}`}}]}));function uf(e){return null==e.action?null:de(cf,Au({},e))}function pf(t){const{children:r,itemId:n,id:o}=t,{wrapItem:i,store:a}=Zu(),l=Mp(a,Dp.treeItemIdAttribute,n,o);return de(e.Fragment,{children:i({children:r,itemId:n,store:a,idAttribute:l})})}"production"!==process.env.NODE_ENV&&(uf.propTypes={action:Vi.oneOf(["make-child","move-to-parent","reorder-above","reorder-below"]),style:Vi.object}),"production"!==process.env.NODE_ENV&&(pf.propTypes={children:Vi.node,id:Vi.string,itemId:Vi.string.isRequired});const hf=nr("input",{name:"MuiTreeItem",slot:"LabelInput"})(({theme:e})=>Au({},e.typography.body1,{width:"100%",backgroundColor:(e.vars||e).palette.background.paper,borderRadius:e.shape.borderRadius,border:"none",padding:"0 2px",boxSizing:"border-box","&:focus":{outline:`1px solid ${(e.vars||e).palette.primary.main}`}})),mf=["visible"],ff=["id","itemId","label","disabled","disableSelection","children","slots","slotProps","classes"],gf=Qu(),xf=nr("li",{name:"MuiTreeItem",slot:"Root"})({listStyle:"none",margin:0,padding:0,outline:0}),bf=nr("div",{name:"MuiTreeItem",slot:"Content",shouldForwardProp:e=>ef(e)&&"status"!==e})(({theme:e})=>({padding:e.spacing(.5,1),paddingLeft:`calc(${e.spacing(1)} + var(--TreeView-itemChildrenIndentation) * var(--TreeView-itemDepth))`,borderRadius:e.shape.borderRadius,width:"100%",boxSizing:"border-box",position:"relative",display:"flex",alignItems:"center",gap:e.spacing(1),cursor:"pointer",WebkitTapHighlightColor:"transparent","&:hover":{backgroundColor:(e.vars||e).palette.action.hover,"@media (hover: none)":{backgroundColor:"transparent"}},"&[data-disabled]":{opacity:(e.vars||e).palette.action.disabledOpacity,backgroundColor:"transparent",cursor:"auto"},"&[data-focused]":{backgroundColor:(e.vars||e).palette.action.focus},"&[data-selected]":{backgroundColor:e.vars?`rgba(${e.vars.palette.primary.mainChannel} / ${e.vars.palette.action.selectedOpacity})`:or(e.palette.primary.main,e.palette.action.selectedOpacity),"&:hover":{backgroundColor:e.vars?`rgba(${e.vars.palette.primary.mainChannel} / calc(${e.vars.palette.action.selectedOpacity} + ${e.vars.palette.action.hoverOpacity}))`:or(e.palette.primary.main,e.palette.action.selectedOpacity+e.palette.action.hoverOpacity),"@media (hover: none)":{backgroundColor:e.vars?`rgba(${e.vars.palette.primary.mainChannel} / ${e.vars.palette.action.selectedOpacity})`:or(e.palette.primary.main,e.palette.action.selectedOpacity)}}},"&[data-selected][data-focused]":{backgroundColor:e.vars?`rgba(${e.vars.palette.primary.mainChannel} / calc(${e.vars.palette.action.selectedOpacity} + ${e.vars.palette.action.focusOpacity}))`:or(e.palette.primary.main,e.palette.action.selectedOpacity+e.palette.action.focusOpacity)}})),vf=nr("div",{name:"MuiTreeItem",slot:"Label",shouldForwardProp:e=>ef(e)&&"editable"!==e})(({theme:e})=>Au({width:"100%",boxSizing:"border-box",minWidth:0,position:"relative",overflow:"hidden"},e.typography.body1,{variants:[{props:({editable:e})=>e,style:{paddingLeft:"2px"}}]})),yf=nr("div",{name:"MuiTreeItem",slot:"IconContainer"})({width:16,display:"flex",flexShrink:0,justifyContent:"center",position:"relative",cursor:"inherit","& svg":{fontSize:18}}),Sf=nr(ir,{name:"MuiTreeItem",slot:"GroupTransition",overridesResolver:(e,t)=>t.groupTransition})({margin:0,padding:0}),kf=nr("div",{name:"MuiTreeItem",slot:"ErrorIcon"})({position:"absolute",right:-3,width:7,height:7,borderRadius:"50%",backgroundColor:"red"}),Bf=nr(Vt,{name:"MuiTreeItem",slot:"LoadingIcon"})({color:"text.primary"}),wf=nr(e.forwardRef((e,t)=>{const{visible:r}=e,n=rp(e,mf);return r?de(ar,Au({},n,{ref:t})):null}),{name:"MuiTreeItem",slot:"Checkbox"})({padding:0});"production"!==process.env.NODE_ENV&&(wf.displayName="TreeItemCheckbox");const Cf=e.forwardRef(function(e,t){const r=gf({props:e,name:"MuiTreeItem"}),{id:n,itemId:o,label:i,disabled:a,disableSelection:l,children:s,slots:d={},slotProps:c={},classes:u}=r,p=rp(r,ff),{getContextProviderProps:h,getRootProps:m,getContentProps:f,getIconContainerProps:g,getCheckboxProps:x,getLabelProps:b,getGroupTransitionProps:v,getLabelInputProps:y,getDragAndDropOverlayProps:S,getErrorContainerProps:k,getLoadingContainerProps:B,status:w}=rf({id:n,itemId:o,children:s,label:i,disabled:a,disableSelection:l}),C=(e=>{const{classes:t}=ep();return Lu({root:["root"],content:["content"],iconContainer:["iconContainer"],checkbox:["checkbox"],label:["label"],groupTransition:["groupTransition"],labelInput:["labelInput"],dragAndDropOverlay:["dragAndDropOverlay"],errorIcon:["errorIcon"],loadingIcon:["loadingIcon"],expanded:["expanded"],editing:["editing"],editable:["editable"],selected:["selected"],focused:["focused"],disabled:["disabled"]},nf,Au({},e,{root:Wu(e?.root,t.root),content:Wu(e?.content,t.itemContent),iconContainer:Wu(e?.iconContainer,t.itemIconContainer),checkbox:Wu(e?.checkbox,t.itemCheckbox),label:Wu(e?.label,t.itemLabel),groupTransition:Wu(e?.groupTransition,t.itemGroupTransition),labelInput:Wu(e?.labelInput,t.itemLabelInput),dragAndDropOverlay:Wu(e?.dragAndDropOverlay,t.itemDragAndDropOverlay),errorIcon:Wu(e?.errorIcon,t.itemErrorIcon),loadingIcon:Wu(e?.loadingIcon,t.itemLoadingIcon)}))})(u),T=d.root??xf,I=Nu({elementType:T,getSlotProps:m,externalForwardedProps:p,externalSlotProps:c.root,additionalProps:{ref:t},ownerState:{},className:C.root}),A=d.content??bf,z=Nu({elementType:A,getSlotProps:f,externalSlotProps:c.content,ownerState:{},className:Wu(C.content,w.expanded&&C.expanded,w.selected&&C.selected,w.focused&&C.focused,w.disabled&&C.disabled,w.editing&&C.editing,w.editable&&C.editable)}),R=d.iconContainer??yf,E=Nu({elementType:R,getSlotProps:g,externalSlotProps:c.iconContainer,ownerState:{},className:C.iconContainer}),P=d.label??vf,L=Nu({elementType:P,getSlotProps:b,externalSlotProps:c.label,ownerState:{},className:C.label}),M=d.checkbox??wf,W=Nu({elementType:M,getSlotProps:x,externalSlotProps:c.checkbox,ownerState:{},className:C.checkbox}),O=d.groupTransition??void 0,D=Nu({elementType:O,getSlotProps:v,externalSlotProps:c.groupTransition,ownerState:{},className:C.groupTransition}),F=d.labelInput??hf,N=Nu({elementType:F,getSlotProps:y,externalSlotProps:c.labelInput,ownerState:{},className:C.labelInput}),H=d.dragAndDropOverlay??uf,V=Nu({elementType:H,getSlotProps:S,externalSlotProps:c.dragAndDropOverlay,ownerState:{},className:C.dragAndDropOverlay}),Q=d.errorIcon??kf,j=Nu({elementType:Q,getSlotProps:k,externalSlotProps:c.errorIcon,ownerState:{},className:C.errorIcon}),G=d.loadingIcon??Bf,U=Nu({elementType:G,getSlotProps:B,externalSlotProps:c.loadingIcon,ownerState:{},className:C.loadingIcon});return de(pf,Au({},h(),{children:ce(T,Au({},I,{children:[ce(A,Au({},z,{children:[ce(R,Au({},E,{children:[w.error&&de(Q,Au({},j)),w.loading?de(G,Au({},U)):de(df,{status:w,slots:d,slotProps:c})]})),de(M,Au({},W)),w.editing?de(F,Au({},N)):de(P,Au({},L)),de(H,Au({},V))]})),s&&de(Sf,Au({as:O},D))]}))}))});"production"!==process.env.NODE_ENV&&(Cf.displayName="TreeItem"),"production"!==process.env.NODE_ENV&&(Cf.propTypes={children:Vi.any,classes:Vi.object,className:Vi.string,disabled:Vi.bool,disableSelection:Vi.bool,id:Vi.string,itemId:Vi.string.isRequired,label:Vi.node,onBlur:Vi.func,onFocus:function(e,t,r,n,o){if("production"===process.env.NODE_ENV)return null;const i=o||t;return void 0!==e[t]?new Error(`The prop \`${i}\` is not supported. Please remove it.`):null},onKeyDown:Vi.func,slotProps:Vi.object,slots:Vi.object,sx:Vi.oneOfType([Vi.arrayOf(Vi.oneOfType([Vi.func,Vi.object,Vi.bool])),Vi.func,Vi.object])});const Tf=e=>e.charAt(0).toUpperCase()+e.slice(1),If={compact:{minHeight:"24px",fontSize:"13px",py:"2px",px:"10px",iconSize:16,gap:"6px"},default:{minHeight:"32px",fontSize:"14px",py:"4px",px:"12px",iconSize:18,gap:"8px"}},Af={none:{},slide:{"& .MuiCollapse-root":{transition:"all 0.25s ease"}},spring:{"& .MuiCollapse-root":{transition:"all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1)"}}};function zf(e){return{outline:"none","&.Mui-focused > .MuiTreeItem-content":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"-3px"},"&:focus-visible > .MuiTreeItem-content":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"-3px"},"& > .MuiTreeItem-content":{minHeight:e.minHeight,fontSize:e.fontSize,fontFamily:"inherit",color:"var(--Quiet)",padding:"0 8px",borderRadius:"var(--Style-Border-Radius)",border:"1px solid transparent",transition:"color 0.15s ease, border-color 0.15s ease, background-color 0.15s ease",backgroundColor:"transparent",outline:"none","&:hover":{color:"var(--Text)",backgroundColor:"var(--Hover)"},"&:active":{color:"var(--Text)",backgroundColor:"var(--Pressed)"},"&.Mui-selected":{color:"var(--Text)",fontWeight:600,backgroundColor:"var(--Pressed)",padding:"0 8px","&:hover":{backgroundColor:"var(--Hover)"}},"&.Mui-disabled":{opacity:.45}},"& > .MuiTreeItem-content .MuiTreeItem-label":{fontSize:e.fontSize,fontFamily:"inherit",lineHeight:e.minHeight,padding:0,width:"100%"},"& > .MuiTreeItem-content .MuiTreeItem-iconContainer":{width:e.iconSize+"px",color:"inherit",zIndex:1},"& > .MuiTreeItem-group":{marginLeft:"12px",borderLeft:"1px solid var(--Border)",paddingLeft:"8px"}}}function Rf({item:e,d:t,isCompact:r}){const n=r?bn:ln;return ce(h,{sx:{display:"flex",alignItems:"center",gap:t.gap,width:"100%"},children:[e.icon&&de(Qn,{size:"small",sx:{color:"inherit",flexShrink:0},children:e.icon}),de(n,{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",color:"inherit",fontWeight:"inherit"},children:e.label}),e.badge&&de(h,{sx:{flexShrink:0},children:e.badge})]})}function Ef(e=[],t="default",r="primary",n="default",o=[]){const i=If[t]||If.default,a="compact"===t;return Tf(r),e.map(e=>de(Cf,{itemId:e.id,disabled:e.disabled,label:de(Rf,{item:e,d:i,isCompact:a}),sx:{...zf(i),...e.sx||{}},children:e.children&&e.children.length>0?Ef(e.children,t,r,n,o):null},e.id))}function Pf({color:e="default",variant:t="solid",surface:n,density:o="default",animation:a="slide",selectionStyle:l,items:s=Lf,selectionMode:d="single",checkboxSelection:c=!1,disableSelection:u=!1,disabledItemsFocusable:p=!1,defaultExpandedItems:m,expandedItems:f,onExpandedItemsChange:g,selectedItems:x,onSelectedItemsChange:b,onItemExpansionToggle:v,onItemSelectionToggle:y,slots:S,"aria-label":k="Tree view",className:B="",sx:w={},...C}){const T=l||t,I=Tf(e),A=n||("light"===T?"Surface-Brightest":"Surface-Dim"),[z,R]=r(x||("multi"===d?[]:null)),E=void 0!==x?x:z,P=Array.isArray(E)?E:E?[E]:[],L=i((e,t)=>{void 0===x&&R(t),b?.(e,t)},[x,b]),M={};return void 0!==f&&(M.expandedItems=f),void 0!==g&&(M.onExpandedItemsChange=g),void 0!==m&&(M.defaultExpandedItems=m),de(h,{"data-theme":I,"data-surface":A,className:"omni-treeview omni-treeview-"+T+" omni-treeview-"+e+" omni-treeview-"+o+(B?" "+B:""),sx:{backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",overflow:"hidden",...Af[a]||{},...w},children:de(Hh,{"aria-label":k,multiSelect:"multi"===d,checkboxSelection:c,disableSelection:u,disabledItemsFocusable:p,selectedItems:E,onSelectedItemsChange:L,onItemExpansionToggle:v,onItemSelectionToggle:y,slots:{expandIcon:()=>de(Qn,{size:"small",sx:{color:"inherit"},children:de($t,{})}),collapseIcon:()=>de(Qn,{size:"small",sx:{color:"inherit"},children:de(Se,{})}),...S},sx:{p:"8px","& .MuiTreeItem-root":{fontFamily:"inherit"},"& .MuiTreeItem-content.Mui-focused":{outline:"none"},"& .MuiTreeItem-content:focus-visible":{outline:"none"}},...M,...C,children:Ef(s,o,e,T,P)})})}const Lf=[{id:"1",label:"Design System",children:[{id:"1-1",label:"Foundations",children:[{id:"1-1-1",label:"Colors"},{id:"1-1-2",label:"Typography"},{id:"1-1-3",label:"Spacing"}]},{id:"1-2",label:"Components",children:[{id:"1-2-1",label:"Buttons"},{id:"1-2-2",label:"Inputs"},{id:"1-2-3",label:"Navigation",disabled:!0}]}]},{id:"2",label:"Tokens",children:[{id:"2-1",label:"Light Mode"},{id:"2-2",label:"Dark Mode"}]},{id:"3",label:"Changelog"}],Mf=e=>de(Pf,{variant:"solid",...e}),Wf=e=>de(Pf,{variant:"light",...e}),Of=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",Df=[{id:"home",label:"Home"},{id:"products",label:"Products",children:[{id:"featured",label:"Featured"},{id:"new",label:"New Arrivals"},{id:"sale",label:"On Sale"}]},{id:"about",label:"About"},{id:"contact",label:"Contact"}];function Ff({label:e,selected:t,onClick:r}){return de(Io,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function Nf(){const[e,t]=r(!1),[n,o]=r("medium"),[i,a]=r("left"),[l,s]=r(null),[d,c]=r("Surface");return ce(h,{sx:{pb:8},children:[de(qr,{children:"Drawer"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ui,{theme:l,surface:d,children:de(Io,{variant:"default",onClick:()=>t(!0),children:"Open Drawer"})}),de(ji,{code:(()=>{const e=["open={open}","onClose={handleClose}"];return"medium"!==n&&e.push('size="'+n+'"'),"left"!==i&&e.push('anchor="'+i+'"'),"<Drawer "+e.join(" ")+">\n <DrawerHeader>\n <H5>Navigation</H5>\n <DrawerClose onClick={handleClose} />\n </DrawerHeader>\n <DrawerContent>\n <OmniTreeView items={navItems} />\n </DrawerContent>\n</Drawer>"})(),language:"JSX",wrap:!0,sx:{mt:2}}),ce(wu,{open:e,onClose:()=>t(!1),size:n,anchor:i,children:[ce(Tu,{children:[de(Jr,{children:"Navigation"}),de(Cu,{onClick:()=>t(!1)})]}),de(Iu,{children:de(Pf,{items:Df,variant:"solid",color:"default",defaultExpandedItems:["products"],sx:{border:"none",borderRadius:0}})})]})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(li,{defaultValue:0,variant:"standard",color:"primary",children:[ce(si,{children:[de(di,{children:"Playground"}),de(di,{children:"Accessibility"})]}),de(ci,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(fi,{theme:l,onThemeChange:s,surface:d,onSurfaceChange:c})}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",spacing:1,children:["small","medium","large"].map(e=>de(Ff,{label:Of(e),selected:n===e,onClick:()=>o(e)},e))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"ANCHOR"}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:["left","right","top","bottom"].map(e=>de(Ff,{label:Of(e),selected:i===e,onClick:()=>a(e)},e))})]})]})}),de(ci,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Role",value:'role="dialog" aria-modal="true"'},{label:"Focus",value:"Focus trapped inside drawer. Returns to trigger on close."},{label:"Keyboard",value:"Escape closes. Tab cycles focusable elements."},{label:"Backdrop",value:"Click closes. Body scroll locked while open."},{label:"Close",value:'Button with aria-label="Close drawer"'}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ln,{children:[e,":"]}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}const Hf={small:{minHeight:"120px",padding:"16px",iconSize:"20px",gap:1},medium:{minHeight:"200px",padding:"32px 24px",iconSize:"32px",gap:2},large:{minHeight:"300px",padding:"48px 24px",iconSize:"48px",gap:3}};function Vf({onFiles:e,accept:t,multiple:n=!1,size:a="medium",disabled:l=!1,icon:s,label:d,sublabel:c,children:u,className:p="",sx:m={},...f}){const[g,x]=r(!1),b=o(null),v=o(0),y=Hf[a]||Hf.medium,S=i(t=>{!l&&t?.length&&e?.(Array.from(t))},[l,e]),k=i(e=>{e.preventDefault(),e.stopPropagation(),v.current=0,x(!1),l||S(e.dataTransfer.files)},[l,S]),B=i(e=>{e.preventDefault(),e.stopPropagation()},[]),w=i(e=>{e.preventDefault(),e.stopPropagation(),v.current++,l||x(!0)},[l]),C=i(e=>{e.preventDefault(),e.stopPropagation(),v.current--,0===v.current&&x(!1)},[]),T=i(()=>{l||b.current?.click()},[l]),I=i(e=>{l||"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),b.current?.click())},[l]),A=i(e=>{S(e.target.files),e.target.value=""},[S]),z=s||sr,R=n?"Drag and drop files here":"Drag and drop file here";return ce(h,{role:"button",tabIndex:l?-1:0,"aria-label":d||R,"aria-disabled":l||void 0,onClick:T,onKeyDown:I,onDrop:k,onDragOver:B,onDragEnter:w,onDragLeave:C,className:"drop-zone drop-zone-"+a+(g?" drop-zone-dragging":"")+(l?" drop-zone-disabled":"")+" "+p,sx:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",gap:y.gap,minHeight:y.minHeight,padding:y.padding,border:"2px dashed",borderColor:g?"var(--Buttons-Primary-Border)":"var(--Buttons-Default-Border)",borderRadius:"32px",backgroundColor:g?"var(--Hover)":"transparent",color:"var(--Text)",cursor:l?"not-allowed":"pointer",opacity:l?.5:1,outline:"none",transition:"background-color 0.2s ease, border-color 0.2s ease",textAlign:"center",...!l&&{"&:hover":{backgroundColor:"var(--Hover)",borderColor:"var(--Buttons-Primary-Border)"},"&:active":{backgroundColor:"var(--Pressed)",borderColor:"var(--Buttons-Primary-Border)"},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"2px",borderColor:"var(--Buttons-Primary-Border)"}},...m},...f,children:[de("input",{ref:b,type:"file",accept:t,multiple:n,onChange:A,style:{display:"none"},"aria-hidden":"true",tabIndex:-1}),u||ce(ue,{children:[de(z,{sx:{fontSize:y.iconSize,color:"var(--Text-Quiet)"}}),de(ln,{style:{color:"var(--Text)"},children:d||R}),de(bn,{style:{color:"var(--Text-Quiet)"},children:c||"or click to browse"})]})]})}const Qf={small:{px:"12px",py:"8px",fontSize:"13px",iconSize:"18px",gap:"8px"},medium:{px:"16px",py:"12px",fontSize:"14px",iconSize:"20px",gap:"10px"},large:{px:"20px",py:"14px",fontSize:"16px",iconSize:"22px",gap:"12px"}};function jf({children:e,variant:t="light",surface:r,color:n="info",size:o="medium",startDecorator:i,endDecorator:a,className:l="",sx:s={},...d}){const c=(e=>e.charAt(0).toUpperCase()+e.slice(1))("default"===n?"Default":n),u=Qf[o]||Qf.medium,p="default"===n?"Default":c,m=r||("light"===t?"Surface-Brightest":"Surface"),f="var(--Buttons-"+c+"-Border)",g=ce(ue,{children:[i&&de(h,{className:"alert-start-decorator",sx:{display:"inline-flex",alignItems:"center",fontSize:u.iconSize,lineHeight:1,flexShrink:0,mt:"2px"},children:i}),de(h,{className:"alert-message",sx:{flex:1,minWidth:0},children:"string"==typeof e?de("small"===o?ln:cn,{children:e}):e}),a&&de(h,{className:"alert-end-decorator",sx:{display:"inline-flex",alignItems:"flex-start",flexShrink:0,gap:u.gap,paddingTop:"2px"},children:a})]});return de(h,{role:"alert",className:"alert alert-"+t+" alert-"+o+" alert-"+n+" "+l,sx:{border:"1px solid "+f,borderRadius:"var(--Style-Border-Radius)",overflow:"hidden",boxShadow:io,...s},...d,children:de(h,{"data-theme":p,"data-surface":m,className:"alert-inner",sx:{display:"flex",alignItems:"flex-start",gap:u.gap,padding:u.py+" "+u.px,fontSize:u.fontSize,fontFamily:"inherit",lineHeight:1.5,color:"var(--Text)",backgroundColor:"var(--Background)",borderRadius:"calc(var(--Style-Border-Radius) - 1px)"},children:g})})}const Gf=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",Uf=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}],Xf={info:de(ve,{}),success:de(ge,{}),warning:de(xe,{}),error:de(be,{})};function $f({label:e,selected:t,onClick:r}){return de(Io,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function Kf({color:e,selected:t,onClick:r}){const n=Gf(e);return de(h,{component:"button",onClick:()=>r(e),"aria-label":"Select "+n,"aria-pressed":t,title:n,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+n+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Buttons-"+n+"-Text)",pointerEvents:"none"}})})}function qf(){const[e,t]=r("light"),[n,o]=r("info"),[i,a]=r("medium"),[l,s]=r(!0),[d,c]=r(null),[u,p]=r("Surface"),m=l&&Xf[n]?de(Qn,{size:"small",sx:{color:"inherit"},children:Xf[n]}):void 0;return ce(h,{sx:{pb:8},children:[de(qr,{children:"Alert"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ui,{theme:d,surface:u,children:de(h,{sx:{width:"100%",maxWidth:480},children:de(jf,{variant:e,color:n,size:i,startDecorator:m,children:"This is an alert message. Check the details for more information."})})}),de(ji,{code:(()=>{const t=['variant="'+e+'"'];return"info"!==n&&t.push('color="'+n+'"'),"medium"!==i&&t.push('size="'+i+'"'),l&&Xf[n]&&t.push("startDecorator={<Icon><"+Gf(n)+"Icon /></Icon>}"),"<Alert "+t.join(" ")+">\n This is an alert message.\n</Alert>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(li,{defaultValue:0,variant:"standard",color:"primary",children:[ce(si,{children:[de(di,{children:"Playground"}),de(di,{children:"Accessibility"})]}),de(ci,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(fi,{theme:d,onThemeChange:c,surface:u,onSurfaceChange:p})}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"STYLE"}),de(B,{direction:"row",spacing:1,children:["solid","light"].map(r=>de($f,{label:Gf(r),selected:e===r,onClick:()=>t(r)},r))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:Uf.map(e=>ce(h,{children:[de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:e.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:e.colors.map(e=>de(Kf,{color:e,selected:n===e,onClick:o},e))})]},e.label))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",spacing:1,children:["small","medium","large"].map(e=>de($f,{label:Gf(e),selected:i===e,onClick:()=>a(e)},e))})]}),ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Show Icon"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Start decorator icon"})]}),de(na,{variant:"default-outline",checked:l,onChange:e=>s(e.target.checked),size:"small","aria-label":"Show icon"})]})]})}),de(ci,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Role",value:'role="alert" — live region, announced immediately'},{label:"Border",value:"var(--Buttons-{Color}-Border) on outer shell"},{label:"Shadow",value:"var(--Effect-Level-3)"},{label:"Icons",value:"Decorative — aria-hidden by default via Icon component"}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ln,{children:[e,":"]}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}const Yf={small:{px:"12px",py:"8px",fontSize:"13px",gap:"8px",minWidth:"240px"},medium:{px:"16px",py:"10px",fontSize:"14px",gap:"12px",minWidth:"300px"},large:{px:"20px",py:"14px",fontSize:"16px",gap:"16px",minWidth:"360px"}};function Jf({children:e,open:t=!1,onClose:r,variant:n="light",surface:l,color:s="info",size:d="medium",anchor:c="bottom",autoHideDuration:u,startDecorator:p,endDecorator:m,action:f,className:g="",sx:x={},...b}){const v=o(null),y=(e=>e.charAt(0).toUpperCase()+e.slice(1))("default"===s?"Default":s),S=Yf[d]||Yf.medium,k="small"===d?ln:cn,B="default"===s?"Default":y,w=l||("light"===n?"Surface-Brightest":"Surface"),C="var(--Buttons-"+y+"-Border)";a(()=>{if(t&&u&&u>0)return v.current=setTimeout(()=>{r?.({},"timeout")},u),()=>clearTimeout(v.current)},[t,u,r]),a(()=>{if(!t)return;const e=e=>{"Escape"===e.key&&r?.(e,"escapeKeyDown")};return document.addEventListener("keydown",e),()=>document.removeEventListener("keydown",e)},[t,r]);const T=i(()=>{v.current&&clearTimeout(v.current)},[]),I=i(()=>{t&&u&&u>0&&(v.current=setTimeout(()=>{r?.({},"timeout")},u))},[t,u,r]),A="top"===c?{from:{transform:"translateX(-50%) translateY(-120%)"},to:{transform:"translateX(-50%) translateY(0)"}}:{from:{transform:"translateX(-50%) translateY(120%)"},to:{transform:"translateX(-50%) translateY(0)"}};return t?de(h,{role:"alert","aria-live":"polite","aria-atomic":"true",onMouseEnter:T,onMouseLeave:I,className:"snackbar snackbar-"+n+" snackbar-"+d+" snackbar-"+c+" snackbar-"+s+" "+g,sx:{position:"fixed",left:"50%",transform:"translateX(-50%)",..."top"===c?{top:"16px"}:{bottom:"16px"},zIndex:1400,minWidth:S.minWidth,maxWidth:"min(560px, calc(100vw - 32px))",border:"1px solid "+C,borderRadius:"var(--Style-Border-Radius)",boxShadow:io,overflow:"hidden",animation:"snackbar-slide-in 0.3s ease forwards","@keyframes snackbar-slide-in":A,...x},...b,children:ce(h,{"data-theme":B,"data-surface":w,sx:{display:"flex",alignItems:"center",gap:S.gap,padding:S.py+" "+S.px,fontSize:S.fontSize,fontFamily:"inherit",lineHeight:1.4,color:"var(--Text)",backgroundColor:"var(--Background)",borderRadius:"calc(var(--Style-Border-Radius) - 1px)"},children:[p&&de(h,{sx:{display:"inline-flex",flexShrink:0,lineHeight:1},children:p}),de(h,{sx:{flex:1,minWidth:0},children:"string"==typeof e?de(k,{children:e}):e}),f&&de(h,{sx:{display:"inline-flex",flexShrink:0},children:f}),m&&de(h,{sx:{display:"inline-flex",flexShrink:0,lineHeight:1},children:m}),r&&de(Io,{iconOnly:!0,variant:"ghost",size:"small",onClick:e=>r(e,"closeClick"),"aria-label":"Close notification",sx:{flexShrink:0,ml:"4px"},children:de(Qn,{size:"small",children:de(Lt,{})})})]})}):null}const Zf=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",_f=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}],eg={info:de(ve,{}),success:de(ge,{}),warning:de(xe,{}),error:de(be,{})};function tg({label:e,selected:t,onClick:r}){return de(Io,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function rg({color:e,selected:t,onClick:r}){const n=Zf(e);return de(h,{component:"button",onClick:()=>r(e),"aria-label":"Select "+n,"aria-pressed":t,title:n,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+n+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Buttons-"+n+"-Text)",pointerEvents:"none"}})})}function ng(){const[e,t]=r("light"),[n,o]=r("info"),[i,a]=r("medium"),[l,s]=r("bottom"),[d,c]=r(!0),[u,p]=r(!0),[m,f]=r(!1),[g,x]=r(null),[b,v]=r("Surface"),y=d&&eg[n]?de(Qn,{size:"small",sx:{color:"inherit"},children:eg[n]}):void 0;return ce(h,{sx:{pb:8},children:[de(qr,{children:"Snackbar"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ui,{theme:g,surface:b,children:de(Io,{variant:"default",onClick:()=>f(!0),children:"Show Snackbar"})}),de(ji,{code:(()=>{const t=["open={open}"];return t.push('variant="'+e+'"'),"info"!==n&&t.push('color="'+n+'"'),"medium"!==i&&t.push('size="'+i+'"'),"bottom"!==l&&t.push('anchor="top"'),u&&t.push("onClose={handleClose}"),d&&eg[n]&&t.push("startDecorator={<Icon><"+Zf(n)+"Icon /></Icon>}"),"<Snackbar\n "+t.join("\n ")+"\n>\n Operation completed successfully.\n</Snackbar>"})(),language:"JSX",wrap:!0,sx:{mt:2}}),de(Jf,{open:m,onClose:u?()=>f(!1):void 0,variant:e,color:n,size:i,anchor:l,autoHideDuration:4e3,startDecorator:y,children:"Operation completed successfully."})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(li,{defaultValue:0,variant:"standard",color:"primary",children:[ce(si,{children:[de(di,{children:"Playground"}),de(di,{children:"Accessibility"})]}),de(ci,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(fi,{theme:g,onThemeChange:x,surface:b,onSurfaceChange:v})}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"STYLE"}),de(B,{direction:"row",spacing:1,children:["solid","light"].map(r=>de(tg,{label:Zf(r),selected:e===r,onClick:()=>t(r)},r))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:_f.map(e=>ce(h,{children:[de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:e.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:e.colors.map(e=>de(rg,{color:e,selected:n===e,onClick:o},e))})]},e.label))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",spacing:1,children:["small","medium","large"].map(e=>de(tg,{label:Zf(e),selected:i===e,onClick:()=>a(e)},e))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"ANCHOR"}),de(B,{direction:"row",spacing:1,children:["top","bottom"].map(e=>de(tg,{label:Zf(e),selected:l===e,onClick:()=>s(e)},e))})]}),ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Show Icon"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Start decorator icon"})]}),de(na,{variant:"default-outline",checked:d,onChange:e=>c(e.target.checked),size:"small","aria-label":"Show icon"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Close Button"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Show dismiss button"})]}),de(na,{variant:"default-outline",checked:u,onChange:e=>p(e.target.checked),size:"small","aria-label":"Close button"})]})]})}),de(ci,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Role",value:'role="alert" aria-live="polite" aria-atomic="true"'},{label:"Close",value:'Button with aria-label="Close notification"'},{label:"Keyboard",value:"Escape closes. Auto-hides after duration."},{label:"Hover",value:"Pauses auto-hide timer on mouse enter"},{label:"Border",value:"var(--Buttons-{Color}-Border) on outer shell"},{label:"Shadow",value:"var(--Effect-Level-3)"}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ln,{children:[e,":"]}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}const og={default:"Default",primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",white:"Neutral",black:"Neutral",info:"Info",success:"Success",warning:"Warning",error:"Error"},ig={small:{diameter:24,thickness:3,fontSize:"9px",labelSize:"0px"},medium:{diameter:40,thickness:4,fontSize:"12px",labelSize:"12px"},large:{diameter:56,thickness:5,fontSize:"14px",labelSize:"14px"}};function ag({value:e,color:t="primary",size:r="medium",thickness:o,showValue:i=!1,children:a,className:l="",sx:s={},...d}){const c=og[t]||"Primary",u="number"==typeof r?{diameter:r,thickness:Math.max(2,Math.round(r/11)),fontSize:Math.max(8,Math.round(r/3.3))+"px"}:ig[r]||ig.medium,p=o||u.thickness,m=null!=e,f=m?Math.min(100,Math.max(0,e)):0,g=(u.diameter-p)/2,x=2*Math.PI*g,b=m?x-f/100*x:.75*x,v="var(--Buttons-"+c+"-Border)",y="cp-grad-"+n().replace(/:/g,"");return ce(h,{role:"progressbar","aria-valuenow":m?Math.round(f):void 0,"aria-valuemin":m?0:void 0,"aria-valuemax":m?100:void 0,"aria-label":m?Math.round(f)+"% progress":"Loading",className:"circular-progress circular-progress-"+r+" circular-progress-"+t+(m?" circular-progress-value":" circular-progress-indeterminate")+" "+l,sx:{position:"relative",display:"inline-flex",alignItems:"center",justifyContent:"center",width:u.diameter+"px",height:u.diameter+"px",flexShrink:0,...!m&&{animation:"circular-progress-spin 1.2s linear infinite","@keyframes circular-progress-spin":{"0%":{transform:"rotate(0deg)"},"100%":{transform:"rotate(360deg)"}}},...s},...d,children:[ce("svg",{viewBox:"0 0 "+u.diameter+" "+u.diameter,width:u.diameter,height:u.diameter,style:{position:"absolute",top:0,left:0,transform:"rotate(-90deg)"},children:[de("defs",{children:ce("linearGradient",{id:y,x1:"0%",y1:"0%",x2:"100%",y2:"0%",children:[de("stop",{offset:"0%",stopColor:v,stopOpacity:"0"}),de("stop",{offset:"100%",stopColor:v,stopOpacity:"1"})]})}),de("circle",{cx:u.diameter/2,cy:u.diameter/2,r:g,fill:"none",stroke:"var(--Border-Variant)",strokeWidth:p,className:"circular-progress-track"}),de("circle",{cx:u.diameter/2,cy:u.diameter/2,r:g,fill:"none",stroke:"url(#"+y+")",strokeWidth:p,strokeDasharray:x,strokeDashoffset:b,strokeLinecap:"round",className:"circular-progress-indicator",style:{transition:m?"stroke-dashoffset 0.4s ease":"none"}})]}),(i||a)&&m&&de(h,{className:"circular-progress-label","aria-hidden":"true",sx:{position:"relative",zIndex:1,fontSize:u.fontSize,fontWeight:700,fontFamily:"inherit",lineHeight:1,color:"var(--Text)",userSelect:"none"},children:a||Math.round(f)+"%"})]})}const lg=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",sg=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}];function dg({label:e,selected:t,onClick:r}){return de(Io,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function cg({color:e,selected:t,onClick:r}){const n=lg(e);return de(h,{component:"button",onClick:()=>r(e),"aria-label":"Select "+n,"aria-pressed":t,title:n,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+n+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Buttons-"+n+"-Text)",pointerEvents:"none"}})})}function ug(){const[e,t]=r("default"),[n,o]=r("medium"),[i,a]=r(!1),[l,s]=r(65),[d,c]=r(!1),[u,p]=r(null),[m,f]=r("Surface");return ce(h,{sx:{pb:8},children:[de(qr,{children:"Circular Progress"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ui,{theme:u,children:de(ag,{color:e,size:n,value:i?l:void 0,showValue:i&&d})}),de(ji,{code:(()=>{const t=[];return"default"!==e&&t.push('color="'+e+'"'),"medium"!==n&&t.push('size="'+n+'"'),i&&(t.push("value={"+l+"}"),d&&t.push("showValue")),0===t.length?"<CircularProgress />":"<CircularProgress\n "+t.join("\n ")+"\n/>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(li,{defaultValue:0,variant:"standard",color:"primary",children:[ce(si,{children:[de(di,{children:"Playground"}),de(di,{children:"Accessibility"})]}),de(ci,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(fi,{theme:u,onThemeChange:p,surface:m,onSurfaceChange:f})}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:sg.map(r=>ce(h,{children:[de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:r.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:r.colors.map(r=>de(cg,{color:r,selected:e===r,onClick:t},r))})]},r.label))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",spacing:1,children:["small","medium","large"].map(e=>de(dg,{label:lg(e),selected:n===e,onClick:()=>o(e)},e))})]}),ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Determinate"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Show a static arc at a specific value"})]}),de(na,{checked:i,onChange:e=>a(e.target.checked),size:"small","aria-label":"Determinate"})]}),i&&ce(ue,{children:[de(h,{sx:{mt:2},children:de(vs,{label:"Value",min:0,max:100,value:l,onChange:(e,t)=>s(t),size:"small",valueLabelDisplay:"auto"})}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Show Label"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Center percentage text"})]}),de(na,{checked:d,onChange:e=>c(e.target.checked),size:"small","aria-label":"Show label"})]})]})]})}),de(ci,{value:1,children:de(h,{sx:{p:3},children:ce(B,{spacing:3,children:[ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"ARIA and Semantics"}),ce(B,{spacing:0,children:[ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ln,{children:"Role:"}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:'role="progressbar"'})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ln,{children:"Determinate:"}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:'aria-valuenow, aria-valuemin="0", aria-valuemax="100"'})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ln,{children:"Indeterminate:"}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:'aria-label="Loading" (no value attributes)'})]}),ce(h,{sx:{py:1.5},children:[de(ln,{children:"Label:"}),de(bn,{style:{color:"var(--Text-Quiet)"},children:"Center percentage label is aria-hidden — screen readers use aria-valuenow."})]})]})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"Token Reference"}),ce(B,{spacing:0,children:[ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ln,{children:"Track (back circle):"}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:"var(--Border-Variant)"})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ln,{children:"Fill (progress arc):"}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:"var(--Buttons-{Color}-Border)"})]}),ce(h,{sx:{py:1.5},children:[de(ln,{children:"Center label:"}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:"var(--Text)"})]})]})]})]})})})]})})})]})]})}const pg={default:"Default",primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info",success:"Success",warning:"Warning",error:"Error"},hg={small:{height:"4px",borderRadius:"2px"},medium:{height:"6px",borderRadius:"3px"},large:{height:"8px",borderRadius:"4px"}};function mg({value:e,color:t="primary",size:r="medium",className:n="",sx:o={},...i}){const a=pg[t]||"Primary",l=hg[r]||hg.medium,s=null!=e,d=s?Math.min(100,Math.max(0,e)):0,c="var(--Buttons-"+a+"-Border)";return de(h,{role:"progressbar","aria-valuenow":s?Math.round(d):void 0,"aria-valuemin":s?0:void 0,"aria-valuemax":s?100:void 0,"aria-label":s?Math.round(d)+"% progress":"Loading",className:"linear-progress linear-progress-"+r+" linear-progress-"+t+(s?" linear-progress-determinate":" linear-progress-indeterminate")+" "+n,sx:{position:"relative",width:"100%",height:l.height,borderRadius:l.borderRadius,backgroundColor:"var(--Border-Variant)",overflow:"hidden",flexShrink:0,...o},...i,children:de(h,{className:"linear-progress-bar",sx:{position:"absolute",top:0,left:0,height:"100%",borderRadius:"inherit",backgroundColor:c,...s?{width:d+"%",transition:"width 0.4s ease"}:{width:"40%",animation:"linear-progress-slide 1.5s ease-in-out infinite","@keyframes linear-progress-slide":{"0%":{left:"-40%",width:"40%"},"50%":{left:"30%",width:"50%"},"100%":{left:"100%",width:"40%"}}}}})})}const fg=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",gg=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}];function xg({label:e,selected:t,onClick:r}){return de(Io,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function bg({color:e,selected:t,onClick:r}){const n=fg(e);return de(h,{component:"button",onClick:()=>r(e),"aria-label":"Select "+n,"aria-pressed":t,title:n,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+n+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Buttons-"+n+"-Text)",pointerEvents:"none"}})})}function vg(){const[e,t]=r("default"),[n,o]=r("medium"),[i,a]=r(!1),[l,s]=r(65),[d,c]=r(null),[u,p]=r("Surface");return ce(h,{sx:{pb:8},children:[de(qr,{children:"Linear Progress"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ui,{theme:d,surface:u,children:de(h,{sx:{width:"100%",maxWidth:400},children:de(mg,{color:e,size:n,value:i?l:void 0})})}),de(ji,{code:(()=>{const t=[];return"default"!==e&&t.push('color="'+e+'"'),"medium"!==n&&t.push('size="'+n+'"'),i&&t.push("value={"+l+"}"),0===t.length?"<LinearProgress />":"<LinearProgress\n "+t.join("\n ")+"\n/>"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(li,{defaultValue:0,variant:"standard",color:"primary",children:[ce(si,{children:[de(di,{children:"Playground"}),de(di,{children:"Accessibility"})]}),de(ci,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(fi,{theme:d,onThemeChange:c,surface:u,onSurfaceChange:p})}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:gg.map(r=>ce(h,{children:[de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:r.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:r.colors.map(r=>de(bg,{color:r,selected:e===r,onClick:t},r))})]},r.label))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",spacing:1,children:["small","medium","large"].map(e=>de(xg,{label:fg(e),selected:n===e,onClick:()=>o(e)},e))})]}),ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Determinate"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Show a static bar at a specific value"})]}),de(na,{variant:"default-outline",checked:i,onChange:e=>a(e.target.checked),size:"small","aria-label":"Determinate"})]}),i&&de(h,{sx:{mt:2},children:de(vs,{label:"Value",min:0,max:100,value:l,onChange:(e,t)=>s(t),size:"small",valueLabelDisplay:"auto"})})]})}),de(ci,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Role",value:'role="progressbar"'},{label:"Determinate",value:'aria-valuenow, aria-valuemin="0", aria-valuemax="100"'},{label:"Indeterminate",value:'aria-label="Loading" (no value attributes)'},{label:"Track",value:"var(--Border-Variant)"},{label:"Fill",value:"var(--Buttons-{Color}-Border)"}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ln,{children:[e,":"]}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}const yg=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]}],Sg=["photo","icon","initials"],kg={photo:"Photo",icon:"Icon",initials:"Initials"},Bg=["xxx-small","xx-small","x-small","small","medium","large","x-large","xx-large"],wg={"xxx-small":"XXXS","xx-small":"XXS","x-small":"XS",small:"Small",medium:"Medium",large:"Large","x-large":"XL","xx-large":"XXL"};function Cg({label:e,selected:t,onClick:r}){return de(Io,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function Tg({color:e,selected:t,onClick:r}){const n=(o=e)?o.charAt(0).toUpperCase()+o.slice(1):"";var o;return de(h,{component:"button",onClick:()=>r(e),"aria-label":"Select "+n,"aria-pressed":t,title:n,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+n+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Buttons-"+n+"-Text)",pointerEvents:"none"}})})}function Ig(){const[e,t]=r("default"),[n,o]=r("medium"),[i,a]=r("initials"),[l,s]=r(!1),[d,c]=r(!1),[u,p]=r(!1),[m,f]=r(null),[g,x]=r("Surface"),b="photo"===i,v=()=>{const t={size:n,clickable:l,insideButton:d};return b||(t.color=e),"initials"===i&&(t.initials="LN"),"photo"===i&&(t.src="https://i.pravatar.cc/150?img=3",t.alt="User avatar"),t};return ce(h,{sx:{pb:8},children:[de(qr,{children:"Avatar"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ui,{theme:m,surface:g,children:u?ce(Kn,{max:3,size:n,children:[de($n,{...v()}),de($n,{color:e,size:n,initials:"AB"}),de($n,{color:e,size:n,initials:"CD"}),de($n,{color:e,size:n,initials:"EF"})]}):de($n,{...v()})}),de(ji,{code:(()=>{const t=[];return b||"default"===e||t.push('color="'+e+'"'),"medium"!==n&&t.push('size="'+n+'"'),"initials"===i&&t.push('initials="LN"'),"photo"===i&&t.push('src="..." alt="User avatar"'),l&&t.push("clickable onClick={handleClick}"),d&&t.push("insideButton"),u?"<AvatarGroup max={3}>\n <Avatar "+t.join(" ")+' />\n <Avatar initials="AB" />\n <Avatar initials="CD" />\n <Avatar initials="EF" />\n</AvatarGroup>':"<Avatar "+t.join(" ")+" />"})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(li,{defaultValue:0,variant:"standard",color:"primary",children:[ce(si,{children:[de(di,{children:"Playground"}),de(di,{children:"Accessibility"})]}),de(ci,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(fi,{theme:m,onThemeChange:f,surface:g,onSurfaceChange:x})}),ce(h,{sx:{opacity:b?.4:1,pointerEvents:b?"none":"auto"},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:yg.map(r=>ce(h,{children:[de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:r.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:r.colors.map(r=>de(Tg,{color:r,selected:e===r,onClick:t},r))})]},r.label))}),b&&de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:8},children:"Color is ignored when the avatar shows a photo — the image carries the visual."})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:Bg.map(e=>de(Cg,{label:wg[e],selected:n===e,onClick:()=>o(e)},e))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"CONTENT"}),de(B,{direction:"row",spacing:1,children:Sg.map(e=>de(Cg,{label:kg[e],selected:i===e,onClick:()=>a(e)},e))})]}),ce(h,{sx:{mt:3,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Clickable"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Interactive with hover/focus states"})]}),de(na,{variant:"default-outline",checked:l,onChange:e=>s(e.target.checked),size:"small","aria-label":"Clickable"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Inside Button"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Adds 2px horizontal margin so the avatar sits cleanly in a Button"})]}),de(na,{variant:"default-outline",checked:d,onChange:e=>c(e.target.checked),size:"small","aria-label":"Inside Button"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Group"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Show as AvatarGroup with overflow"})]}),de(na,{variant:"default-outline",checked:u,onChange:e=>p(e.target.checked),size:"small","aria-label":"Show group"})]})]})}),de(ci,{value:1,children:de(h,{sx:{p:3},children:de(B,{spacing:3,children:ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Role",value:'role="img" (static) or role="button" (clickable)'},{label:"Label",value:'aria-label from alt, initials, or "Avatar"'},{label:"Image",value:"alt text on <img>. Falls back to initials or icon on error."},{label:"Clickable",value:"Rendered as <button>. Focus ring: 3px solid var(--Focus-Visible)."},{label:"Group",value:'role="group" aria-label="Avatar group, N avatars"'}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ln,{children:[e,":"]}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})})})})]})})})]})]})}const Ag=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",zg=["primary","secondary","tertiary","neutral","info","success","warning","error"];function Rg({ratio:e,threshold:t}){if(!e)return de(bn,{style:{color:"var(--Text-Quiet)"},children:"--"});const r=parseFloat(e)>=t;return ce(h,{sx:{display:"inline-flex",alignItems:"center",gap:.5},children:[ce(h,{sx:{px:1,py:.25,borderRadius:"4px",backgroundColor:r?"var(--Tags-Success-BG)":"var(--Tags-Error-BG)",color:r?"var(--Tags-Success-Text)":"var(--Tags-Error-Text)",fontSize:"11px",fontWeight:700},children:[e,":1"]}),de(bn,{style:{color:r?"var(--Tags-Success-Text)":"var(--Tags-Error-Text)"},children:r?"Pass":"Fail"})]})}function Eg({label:e,ratio:t,threshold:r,note:n}){return ce(h,{sx:{display:"flex",justifyContent:"space-between",alignItems:"flex-start",py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(h,{sx:{flex:1},children:[de(ln,{style:{color:"var(--Text)"},children:e}),n&&de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:n})]}),de(Rg,{ratio:t,threshold:r})]})}function Pg({color:e,selected:t,onClick:r}){const n=Ag(e);return de(w,{title:n,arrow:!0,children:de(h,{onClick:()=>r(e),role:"button","aria-label":"Select "+n+" color","aria-pressed":t,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+n+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:24,color:"var(--Buttons-"+n+"-Text)",pointerEvents:"none"}})})})}function Lg({label:e,selected:t,onClick:r}){return de(h,{component:"button",onClick:r,sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",cursor:"pointer",border:"2px solid var(--Buttons-Primary-Button)",borderRadius:"var(--Style-Border-Radius)",backgroundColor:t?"var(--Buttons-Primary-Button)":"transparent",color:t?"var(--Buttons-Primary-Text)":"var(--Text)",padding:"4px 12px",fontSize:"14px",fontFamily:"inherit",fontWeight:500,whiteSpace:"nowrap",flexShrink:0,transition:"background-color 0.15s ease, color 0.15s ease","&:hover":{backgroundColor:t?"var(--Buttons-Primary-Hover)":"var(--Surface-Dim)"},"&:focus-visible":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"2px"}},children:e})}function Mg(){const[e,t]=r(0),[n,o]=r("solid"),[i,l]=r("primary"),[s,d]=r("medium"),[c,u]=r("5"),[p,m]=r(!1),[f,g]=r(!1),[x,S]=r({}),k=()=>"solid"===n?i:i+"-"+n,w=()=>{if(p)return;const e=parseInt(c,10);return isNaN(e)||String(e)!==c.trim()?c||void 0:e};a(()=>{const e=Ag(i),t={};"solid"===n?(t.badgeBg=Ki("--Buttons-"+e+"-Button"),t.badgeText=Ki("--Buttons-"+e+"-Text"),t.badgeBorder=null):"outline"===n?(t.badgeBg=Ki("--Background"),t.badgeText=Ki("--Text"),t.badgeBorder=Ki("--Buttons-"+e+"-Border")):"light"===n&&(t.badgeBg=Ki("--Buttons-"+e+"-Button"),t.badgeText=Ki("--Buttons-"+e+"-Text"),t.badgeBorder=Ki("--Buttons-"+e+"-Border")),t.background=Ki("--Background"),t.focusVisible=Ki("--Focus-Visible"),S(t)},[n,i]);const C={small:{badge:"16px",dot:"8px",font:"10px"},medium:{badge:"20px",dot:"10px",font:"12px"},large:{badge:"24px",dot:"12px",font:"14px"}};return ce(h,{sx:{width:"100%"},children:[de(qr,{style:{marginBottom:8},children:"Badge"}),de(cn,{color:"quiet",style:{marginBottom:24},children:"Small label attached to an element showing status or count. Solid, outline, and light variants across all 8 colors."}),ce(N,{value:e,onChange:(e,r)=>t(r),sx:{borderBottom:"1px solid var(--Border)",mb:0},children:[de(H,{label:"Playground"}),de(H,{label:"Accessibility"})]}),0===e&&ce(I,{container:!0,sx:{minHeight:400},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"calc((100vw - 432px) / 2)"},flexShrink:0},children:[de(h,{sx:{p:4,display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",minHeight:200,backgroundColor:"var(--Background)",borderBottom:"1px solid var(--Border)"},children:ce(B,{direction:"row",spacing:6,alignItems:"center",children:[de(_n,{variant:k(),size:s,badgeContent:w(),dot:p,showZero:f,children:de(dr,{sx:{fontSize:32,color:"var(--Text-Quiet)"}})}),de(_n,{variant:k(),size:s,badgeContent:w(),dot:p,showZero:f,children:de(Ae,{sx:{fontSize:32,color:"var(--Text-Quiet)"}})}),de(_n,{variant:k(),size:s,badgeContent:w(),dot:p,showZero:f,children:de(Re,{sx:{fontSize:32,color:"var(--Text-Quiet)"}})})]})}),de(ji,{code:(()=>{const e=['variant="'+k()+'"','size="'+s+'"'];if(p)e.push("dot");else{const t=w();"number"==typeof t?e.push("badgeContent={"+t+"}"):t&&e.push('badgeContent="'+t+'"')}return f&&e.push("showZero"),"<Badge "+e.join(" ")+">\n <MailIcon />\n</Badge>"})(),language:"JSX",sx:{borderRadius:0,borderBottom:"1px solid var(--Border)"}})]}),ce(I,{item:!0,sx:{width:{xs:"calc(100vw - 432px)",md:"calc((100vw - 432px) / 2)"},flexShrink:0,p:3,backgroundColor:"var(--Container)",overflowY:"auto"},children:[de(Yr,{children:"Playground"}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"STYLE"}),de(B,{direction:"row",spacing:1,flexWrap:"wrap",sx:{gap:1},children:["solid","outline","light"].map(e=>de(Lg,{label:Ag(e),selected:n===e,onClick:()=>o(e)},e))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:zg.map(e=>de(Pg,{color:e,selected:i===e,onClick:l},e))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SIZE"}),de(B,{direction:"row",spacing:1,children:["small","medium","large"].map(e=>de(Lg,{label:Ag(e),selected:s===e,onClick:()=>d(e)},e))}),ce(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:["Badge ",C[s]?.badge," · Dot ",C[s]?.dot," · Font ",C[s]?.font]})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"BADGE CONTENT"}),de(y,{size:"small",value:c,onChange:e=>u(e.target.value),placeholder:"Number or text",disabled:p,sx:{width:"160px","& .MuiOutlinedInput-root":{fontFamily:"inherit",fontSize:"14px",backgroundColor:"var(--Background)","& fieldset":{borderColor:"var(--Border)"},"&:hover fieldset":{borderColor:"var(--Border)"},"&.Mui-focused fieldset":{borderColor:"var(--Buttons-Primary-Border)"}},"& .MuiOutlinedInput-input":{color:"var(--Text)",padding:"6px 12px"}}})]}),ce(h,{sx:{mt:3},children:[de(v,{control:de(b,{checked:p,onChange:e=>m(e.target.checked),size:"small"}),label:de(ln,{children:"Dot (no content)"})}),de(v,{control:de(b,{checked:f,onChange:e=>g(e.target.checked),size:"small"}),label:de(ln,{children:"Show zero"})})]})]})]}),1===e&&ce(h,{sx:{p:4},children:[de(Yr,{children:"Accessibility Requirements"}),ce(ln,{color:"quiet",style:{marginBottom:32},children:["Based on current Playground settings: ",n," · ",i," · ",s]}),ce(B,{spacing:4,children:[ce(h,{sx:{p:3,backgroundColor:"var(--Container)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"Badge Text Contrast"}),de(ln,{color:"quiet",style:{marginBottom:16},children:"Badge text must have ≥ 4.5:1 contrast against badge background (WCAG 1.4.3 AA)"}),de(Eg,{label:"Badge Text vs. Badge Background",ratio:$i(x.badgeText,x.badgeBg),threshold:4.5,note:"solid"===n?"var(--Buttons-{C}-Text) vs var(--Buttons-{C}-Button)":"outline"===n?"var(--Text) vs var(--Background)":"var(--Buttons-{C}-Text) vs var(--Buttons-{C}-Button)"})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Container)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"Badge Visibility"}),de(ln,{color:"quiet",style:{marginBottom:16},children:"Badge background (or border) must have ≥ 3:1 contrast against page background (WCAG 1.4.11)"}),(()=>{const e=$i(x.badgeBg,x.background),t=x.badgeBorder?$i(x.badgeBorder,x.background):null;return de(Eg,{label:"Badge vs. Page Background",ratio:(r=e,o=t,r||o?r?o?parseFloat(r)>=parseFloat(o)?r:o:r:o:null),threshold:3.1,note:"outline"===n?"Border "+(t||"--")+":1 — outline relies on border contrast":"BG "+(e||"--")+":1"});var r,o})()]}),ce(h,{sx:{p:3,backgroundColor:"var(--Container)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"Badge Sizing"}),de(ln,{color:"quiet",style:{marginBottom:16},children:"Badge dimensions per size setting"}),de(h,{sx:{display:"flex",justifyContent:"space-between",py:1.5,borderBottom:"1px solid var(--Border)"},children:ce(h,{children:[ce(ln,{children:["Badge height (",s,")"]}),ce(bn,{style:{color:"var(--Text-Quiet)"},children:[C[s]?.badge," height · ",C[s]?.font," font · pill shape"]})]})}),de(h,{sx:{display:"flex",justifyContent:"space-between",py:1.5,borderBottom:"1px solid var(--Border)"},children:ce(h,{children:[ce(ln,{children:["Dot size (",s,")"]}),ce(bn,{style:{color:"var(--Text-Quiet)"},children:[C[s]?.dot," diameter circle"]})]})})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Container)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"ARIA & Semantics"}),ce(B,{spacing:0,children:[ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ln,{style:{display:"block",marginBottom:2},children:"Screenreader support:"}),de(bn,{style:{color:"var(--Text-Quiet)"},children:'MUI Badge renders badge content in a visually-hidden span for assistive technology. Numeric content is announced (e.g. "5 notifications").'})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ln,{style:{display:"block",marginBottom:2},children:"Dot variant:"}),de(bn,{style:{color:"var(--Text-Quiet)"},children:"Dot badges are purely decorative. Ensure the parent element conveys status to assistive tech via aria-label or similar."})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ln,{style:{display:"block",marginBottom:2},children:"Max overflow:"}),de(bn,{style:{color:"var(--Text-Quiet)"},children:'When content exceeds max (default 99), displays "99+" visually but announces the actual number to screenreaders.'})]})]})]})]})]})]})}const Wg=e=>e.charAt(0).toUpperCase()+e.slice(1);function Og(e){return e&&"default"!==e&&"border-variant"!==e?"border"===e?"var(--Border)":"var(--Icons-"+Wg(e)+")":"var(--Border-Variant)"}function Dg(e,t){const r=e&&!["default","border","border-variant"].includes(e)?Wg(e):"Default",n=Og(e);return"light"===t?{bg:"var(--Tag-"+r+"-BG)",text:"var(--Tag-"+r+"-Text)",border:"1px solid "+n}:{bg:"var(--Background)",text:"var(--Text)",border:"1px solid "+n}}const Fg={small:1,medium:2,large:4};function Ng({color:e="default",orientation:t="horizontal",size:r="small",children:n,indicatorText:o,indicatorStyle:i="outline",textAlign:a="center",className:l="",sx:s={},...d}){const c=Og(e),u=Fg[r]||Fg.small,p=!(!n&&!o),m=n||o,f="vertical"===t;if(f&&!p)return de(h,{role:"separator","aria-orientation":"vertical",className:"divider-vertical divider-"+e+" "+l,sx:{display:"inline-block",width:u+"px",alignSelf:"stretch",minHeight:24,backgroundColor:c,flexShrink:0,...s},...d});if(f&&p){const t=Dg(e,i),r="top"===a?"0 0 10%":"1 1 auto",n="top"===a?"1 1 auto":"bottom"===a?"0 0 10%":"1 1 auto";return ce(h,{role:"separator","aria-orientation":"vertical",className:"divider-vertical divider-"+e+" divider-indicator "+l,sx:{display:"inline-flex",flexDirection:"column",alignItems:"center",alignSelf:"stretch",minHeight:24,flexShrink:0,...s},...d,children:[de(h,{sx:{flex:r,width:u+"px",backgroundColor:c}}),de(h,{sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",flexShrink:0,my:1,px:.75,py:.5,borderRadius:"12px",fontSize:"11px",fontWeight:500,fontFamily:"inherit",lineHeight:1.2,whiteSpace:"nowrap",backgroundColor:t.bg,color:t.text,border:t.border,boxSizing:"border-box"},children:m}),de(h,{sx:{flex:n,width:u+"px",backgroundColor:c}})]})}if(!p)return de(h,{role:"separator","aria-orientation":"horizontal",className:"divider-horizontal divider-"+e+" "+l,sx:{width:"100%",height:u+"px",backgroundColor:c,flexShrink:0,...s},...d});const g=Dg(e,i),x="left"===a?"0 0 10%":"1 1 auto",b="left"===a?"1 1 auto":"right"===a?"0 0 10%":"1 1 auto";return ce(h,{role:"separator","aria-orientation":"horizontal",className:"divider-horizontal divider-"+e+" divider-indicator "+l,sx:{display:"flex",alignItems:"center",width:"100%",...s},...d,children:[de(h,{sx:{flex:x,height:u+"px",backgroundColor:c}}),de(h,{sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",flexShrink:0,mx:2,px:1.5,py:.5,borderRadius:"12px",fontSize:"12px",fontWeight:500,fontFamily:"inherit",lineHeight:1.2,whiteSpace:"nowrap",backgroundColor:g.bg,color:g.text,border:g.border,boxSizing:"border-box"},children:m}),de(h,{sx:{flex:b,height:u+"px",backgroundColor:c}})]})}const Hg={eyebrow:Tn,title:cn,secondary:sn},Vg={primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info-Medium",success:"Success-Medium",warning:"Warning-Medium",error:"Error-Medium"},Qg={primary:"Primary-Light",secondary:"Secondary-Light",tertiary:"Tertiary-Light",neutral:"Neutral-Light",info:"Info-Light",success:"Success-Light",warning:"Warning-Light",error:"Error-Light"},jg={small:{py:.5,px:1.5,fontSize:"13px",iconSize:16,decoratorSize:28,gap:1,checkSize:"small"},medium:{py:1,px:1,fontSize:"14px",iconSize:20,decoratorSize:36,gap:1.5,checkSize:"small"},large:{py:1.5,px:2.5,fontSize:"16px",iconSize:24,decoratorSize:40,gap:2,checkSize:"medium"}};function Gg({children:e,size:t="medium",isButton:r=!1,onAction:n,ariaLabel:o}){return de(h,r?{component:"button",role:"button",tabIndex:0,"aria-label":o||"Action",onClick:e=>{e.stopPropagation(),n?.(e)},onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),e.stopPropagation(),n?.(e))},className:"list-item-decorator-button",sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",flexShrink:0,padding:0,border:"none",backgroundColor:"transparent",borderRadius:"50%",cursor:"pointer",color:"inherit",transition:"background-color 0.15s ease","&:hover":{backgroundColor:"rgba(128,128,128,0.15)"},"&:active":{backgroundColor:"rgba(128,128,128,0.25)"},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"-3px"}},children:e}:{className:"list-item-decorator",sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",flexShrink:0},children:e})}function Ug({children:e,startDecorator:t,endDecorator:r,startDecoratorIsButton:n=!1,endDecoratorIsButton:o=!1,onStartDecoratorAction:i,onEndDecoratorAction:a,startDecoratorAriaLabel:l,endDecoratorAriaLabel:s,size:d="medium",variant:c="default",color:u,eyebrow:p,overline:m,secondary:f,clickable:g=!1,disabled:x=!1,selected:v=!1,selectionMode:y="none",onSelect:S,onClick:k,bottomBorder:B=!1,rightBorder:w=!1,sx:C={},...T}){const I=jg[d]||jg.medium,A=g||!!k,z="checkbox"===y||"radio"===y,R=(A||z)&&!x,E=e=>{x||(z&&S?.(e),k?.(e))};return ce(h,{component:"li",role:z?"option":A?"button":"listitem",tabIndex:R?0:void 0,"aria-disabled":x||void 0,"aria-selected":z?v:v||void 0,"aria-checked":"checkbox"===y?v:void 0,onClick:E,onKeyDown:R?e=>{x||"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),E(e))}:void 0,className:"list-item"+(v?" list-item-selected":"")+(x?" list-item-disabled":"")+(A?" list-item-clickable":"")+(z?" list-item-selectable":""),sx:{display:"flex",flexDirection:"row",alignItems:"flex-start",justifyContent:"flex-start",width:"100%",boxSizing:"border-box",gap:"var(--Sizing-1-and-Half)",py:I.py,px:I.px,minHeight:"32px",fontSize:I.fontSize,fontFamily:"inherit",color:"var(--Text)",listStyle:"none",cursor:R?"pointer":"default",opacity:x?.5:1,position:"relative",transition:"background-color 0.15s ease, box-shadow 0.15s ease",...A?{border:"1px solid var(--Border)",boxShadow:"var(--Effect-Level-1)",padding:"var(--Sizing-1)",borderRadius:"var(--Input-Radius)"}:{},...!A&&B?{borderBottom:"1px solid var(--Border-Variant)"}:{},...!A&&w?{borderRight:"1px solid var(--Border-Variant)"}:{},backgroundColor:v?"var(--Hover)":"transparent","&:hover":R?{backgroundColor:"var(--Hover)",boxShadow:"var(--Effect-Level-2)"}:{},"&:active":R?{backgroundColor:"var(--Pressed)",boxShadow:"var(--Effect-Level-1)"}:{},"&:focus-visible":{outline:"none"},"&:focus-visible::after":{content:'""',position:"absolute",inset:"1px",border:"3px solid var(--Focus-Visible)",borderRadius:"var(--Input-Inner-Focus-Visible)",pointerEvents:"none"},...C},...T,children:["checkbox"===y&&de(b,{checked:v,disabled:x,size:I.checkSize,tabIndex:-1,onClick:e=>e.stopPropagation(),onChange:()=>S?.(),sx:{p:0,mr:0,color:"inherit","&.Mui-checked":{color:"inherit"}},inputProps:{"aria-label":"Select "+("string"==typeof e?e:"item")}}),"radio"===y&&de(P,{checked:v,disabled:x,size:I.checkSize,tabIndex:-1,onClick:e=>e.stopPropagation(),onChange:()=>S?.(),sx:{p:0,mr:0,color:"inherit","&.Mui-checked":{color:"inherit"}},inputProps:{"aria-label":"Select "+("string"==typeof e?e:"item")}}),t&&de(Gg,{size:d,isButton:n,onAction:i,ariaLabel:l,children:t}),(()=>{const t=Hg,r=p??m,n={display:"block",width:"100%",wordBreak:"break-word",overflowWrap:"anywhere"};return ce(h,{sx:{flex:"1 1 auto",width:"100%",minWidth:0,display:"flex",flexDirection:"column",gap:0},children:[r&&de(t.eyebrow,{style:{...n,color:"var(--Quiet)"},children:r}),null!=e&&de(t.title,{style:{...n,color:"var(--Text)"},children:e}),f&&de(t.secondary,{style:{...n,color:"var(--Quiet)"},children:f})]})})(),r&&de(Gg,{size:d,isButton:o,onAction:a,ariaLabel:s,children:r})]})}function Xg({children:e,items:r,variant:n="default",color:o="primary",size:i="medium",orientation:a="vertical",dividers:l=!1,selectionMode:s="none",selectedIndices:d=[],onSelectionChange:c,clickable:u=!1,component:p="ul",className:m="",sx:f={},...g}){const x="horizontal"===a,b="checkbox"===s||"radio"===s,v="light"===n,y="default"===n,S={};"solid"===n&&Vg[o]?S["data-theme"]=Vg[o]:v&&Qg[o]&&(S["data-theme"]=Qg[o]);return de(h,{component:p,role:b?"listbox":"list","aria-multiselectable":"checkbox"===s||void 0,...S,className:"list-container list-"+n+" list-"+o+" "+m,sx:{display:"flex",flexDirection:x?"row":"column",boxSizing:"border-box",alignItems:"stretch",gap:u?"var(--Sizing-1)":0,m:0,p:y?0:1,backgroundColor:y?"transparent":"var(--Background)",color:"var(--Text)",borderRadius:y?0:"var(--Style-Border-Radius)",width:"100%",listStyle:"none",...x?{"& > .list-item":{flex:"1 1 0",width:"auto"}}:{},...f},...g,children:(()=>{if(r&&r.length>0){const e=[];return r.forEach((t,a)=>{e.push(de(Ug,{size:i,variant:n,color:o,startDecorator:t.startDecorator,endDecorator:t.endDecorator,startDecoratorIsButton:t.startDecoratorIsButton,endDecoratorIsButton:t.endDecoratorIsButton,onStartDecoratorAction:t.onStartDecoratorAction,onEndDecoratorAction:t.onEndDecoratorAction,startDecoratorAriaLabel:t.startDecoratorAriaLabel,endDecoratorAriaLabel:t.endDecoratorAriaLabel,eyebrow:t.eyebrow??t.overline,secondary:t.secondary,clickable:u||t.clickable,disabled:t.disabled,bottomBorder:t.bottomBorder,rightBorder:t.rightBorder,selected:b?d.includes(a):t.selected,selectionMode:s,onSelect:()=>(e=>{if(c)if("radio"===s)c([e]);else{const t=d.includes(e)?d.filter(t=>t!==e):[...d,e];c(t)}})(a),onClick:t.onClick,children:t.label||t.children},"item-"+a)),l&&a<r.length-1&&e.push(de(h,{component:"li",role:"separator","aria-hidden":"true",sx:x?{width:"1px",alignSelf:"stretch",backgroundColor:"var(--Border)",flexShrink:0}:{height:"1px",backgroundColor:"var(--Border)"}},"div-"+a))}),e}if(e){const r=t.Children.toArray(e);if(!l)return r;const n=[];return r.forEach((e,t)=>{n.push(e),t<r.length-1&&n.push(de(h,{component:"li",role:"separator","aria-hidden":"true",sx:x?{width:"1px",alignSelf:"stretch",backgroundColor:"var(--Border)",flexShrink:0}:{height:"1px",backgroundColor:"var(--Border)"}},"div-"+t))}),n}return null})()})}const $g={small:{py:"4px",px:"8px",fontSize:"13px",headerFontSize:"12px"},medium:{py:"8px",px:"12px",fontSize:"14px",headerFontSize:"13px"},large:{py:"12px",px:"16px",fontSize:"16px",headerFontSize:"14px"}};function Kg({children:e,columns:t,rows:r,footerRows:n,variant:o="default",color:i="primary",size:a="medium",stripe:l="none",stickyHeader:s=!1,stickyFooter:d=!1,className:c="",sx:u={},...p}){const m=$g[a]||$g.medium,f="solid"===o,g="outlined"===o,x="light"===o,b=(e=>e.charAt(0).toUpperCase()+e.slice(1))(i),v=g?"1px solid var(--Buttons-"+b+"-Border)":"none",y={};f&&(y["data-theme"]=b+"-Medium");const S=()=>{const e={fontWeight:600,fontSize:m.headerFontSize,textAlign:"left",padding:m.py+" "+m.px,borderBottom:"2px solid var(--Border)",color:"var(--Text)",whiteSpace:"nowrap"};return x?(e.backgroundColor="var(--Buttons-"+b+"-Button)",e.color="var(--Buttons-"+b+"-Text)"):e.backgroundColor=f?"var(--Hover)":"var(--Background)",s&&(e.position="sticky",e.top=0,e.zIndex=2),e},k=()=>{const e={fontWeight:600,fontSize:m.headerFontSize,textAlign:"left",padding:m.py+" "+m.px,borderTop:"2px solid var(--Border)",color:"var(--Text)",whiteSpace:"nowrap"};return x?(e.backgroundColor="var(--Buttons-"+b+"-Button)",e.color="var(--Buttons-"+b+"-Text)"):e.backgroundColor=f?"var(--Hover)":"var(--Background)",d&&(e.position="sticky",e.bottom=0,e.zIndex=2),e},B=e=>"none"===l?"Surface":"odd"===l?e%2==0?"Surface":"Surface-Dim":"even"===l&&e%2==0?"Surface-Dim":"Surface",w=()=>({padding:m.py+" "+m.px,fontSize:m.fontSize,color:"var(--Text)",borderBottom:"1px solid var(--Border)",textAlign:"left"});return de(h,{className:"table-wrapper table-"+o+(f||x||g?" table-"+i:"")+" "+c,...y,sx:{width:"100%",overflow:"auto",border:v,borderRadius:g||x?"var(--Style-Border-Radius)":0,...u},children:de(h,{component:"table",sx:{width:"100%",borderCollapse:"collapse",tableLayout:"fixed",fontFamily:"inherit","& thead th":S(),"& tbody td":w(),"& tfoot td, & tfoot th":k(),...s?{"& thead th":{...S(),position:"sticky",top:0,zIndex:2}}:{},...d?{"& tfoot td, & tfoot th":{...k(),position:"sticky",bottom:0,zIndex:2}}:{}},...p,children:t&&r?t&&r?ce(ue,{children:[de(h,{component:"thead",children:de(h,{component:"tr",children:t.map((e,t)=>de(h,{component:"th",sx:{...S(),...e.width?{width:e.width}:{},...e.align?{textAlign:e.align}:{}},children:e.label||e.header||e},"h-"+t))})}),de(h,{component:"tbody",children:r.map((e,r)=>de(h,{component:"tr","data-surface":B(r),sx:{backgroundColor:"var(--"+B(r)+")"},children:(Array.isArray(e)?e:t.map(t=>e[t.field||t.key])).map((e,n)=>de(h,{component:"td",sx:{...w(),...t[n]&&t[n].align?{textAlign:t[n].align}:{}},children:e},"c-"+r+"-"+n))},"r-"+r))}),n&&n.length>0&&de(h,{component:"tfoot",children:n.map((e,r)=>de(h,{component:"tr",children:(Array.isArray(e)?e:t.map(t=>e[t.field||t.key])).map((e,n)=>de(h,{component:"td",sx:{...k(),...t[n]&&t[n].align?{textAlign:t[n].align}:{}},children:e},"fc-"+r+"-"+n))},"f-"+r))})]}):null:e})})}const qg={primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info-Medium",success:"Success-Medium",warning:"Warning-Medium",error:"Error-Medium"},Yg={primary:"Primary",secondary:"Secondary",tertiary:"Tertiary",neutral:"Neutral",info:"Info",success:"Success",warning:"Warning",error:"Error"},Jg={small:{fontSize:"12px",py:"4px",px:"8px",maxWidth:200,arrowSize:6},medium:{fontSize:"13px",py:"6px",px:"12px",maxWidth:280,arrowSize:8},large:{fontSize:"14px",py:"8px",px:"16px",maxWidth:360,arrowSize:10}};function Zg({children:e,title:t,variant:r="solid",color:n="primary",size:o="medium",placement:i="bottom",arrow:a=!1,open:l,enterDelay:s=100,leaveDelay:d=0,describeChild:c=!1,className:u="",sx:p={},...m}){const f=Jg[o]||Jg.medium,g="solid"===r,x="light"===r,b="outline"===r,v=(e=>e.charAt(0).toUpperCase()+e.slice(1))(n),y="var(--Background)",S=void 0===l?{}:{open:l};return de(w,{title:t?de(h,{"data-theme":(g?qg[n]:x?Yg[n]:null)||void 0,"data-surface":x?"Surface-Brightest":g?"Surface":void 0,className:"tooltip-content tooltip-"+r+" tooltip-"+n+" tooltip-"+o+" "+u,sx:{backgroundColor:"var(--Background)",color:"var(--Text)",border:b?"1px solid var(--Buttons-"+v+"-Border)":"none",borderRadius:"var(--Style-Border-Radius)",fontSize:f.fontSize,lineHeight:1.5,fontFamily:"inherit",padding:f.py+" "+f.px,maxWidth:f.maxWidth+"px",boxShadow:"0 2px 8px rgba(0,0,0,0.15)",...p},children:t}):"",placement:i,arrow:a,enterDelay:s,leaveDelay:d,describeChild:c,...S,componentsProps:{tooltip:{sx:{backgroundColor:"transparent",padding:0,maxWidth:"none",boxShadow:"none"}},arrow:{sx:{color:y,"&::before":{border:b?"1px solid var(--Buttons-"+v+"-Border)":"none",backgroundColor:y,boxSizing:"border-box"},fontSize:f.arrowSize+"px"}}},...m,children:e})}const _g={default:{theme:"App-Bar"},primary:{theme:"Primary"},"primary-light":{theme:"Primary",surface:"Surface-Brightest"},white:{theme:"Neutral",surface:"Surface-Brightest"},black:{theme:"Neutral",surface:"Surface-Dimmest"}};function ex({children:e,onClick:t,ariaLabel:r}){return de(Io,{iconOnly:!0,variant:"ghost",size:"medium",onClick:t,"aria-label":r,children:e})}function tx({barColor:e="default",surface:n="Surface",loginType:o="login",menuType:i="hamburger",brandType:a="name",searchPosition:l="right",companyName:s="Company",navLinks:d=["Home","Products","About"],rightButtons:c=[],showRightButtons:u=!1,onMenuClick:p,user:m,onLogin:f,onSignOut:g,brand:x,onBrandClick:b,centerSlot:v,endSlot:y,searchValue:S,onSearchChange:k,searchPlaceholder:B="Search...",children:w,className:C="",sx:T={}}){const[I,A]=r(!1),z=_g[e]||_g.default,R=z.theme,E=z.surface||n,P="expanded"===i&&d.length>3?"hamburger":i,L=de(Ts,{placeholder:B,size:"medium",value:S,onChange:k,sx:{flex:"left"===l?"0 1 400px":"0 1 280px",minWidth:0}});return ce(ue,{children:[de(h,{component:"header",role:"banner","data-theme":R,"data-surface":E,className:"appbar appbar-desktop appbar-"+e+(C?" "+C:""),sx:{display:"flex",alignItems:"center",height:64,px:2,gap:2,backgroundColor:"var(--Background)",color:"var(--Text)",boxShadow:no,fontFamily:"inherit",...T},children:w||ce(ue,{children:["hamburger"===P&&de(ex,{ariaLabel:"Open navigation menu",onClick:p||(()=>A(!0)),children:de(Pt,{sx:{fontSize:"inherit"}})}),de(h,void 0!==x?b?{component:"button",type:"button",onClick:b,sx:{background:"transparent",border:"none",padding:0,cursor:"pointer",color:"inherit",font:"inherit",fontWeight:700,fontSize:"18px",whiteSpace:"nowrap",flexShrink:0},children:x}:{sx:{fontWeight:700,fontSize:"18px",whiteSpace:"nowrap",flexShrink:0},children:x}:"logo"===a?{sx:{width:32,height:32,borderRadius:"6px",backgroundColor:"var(--Text)",opacity:.8,flexShrink:0},"aria-label":"Company logo"}:{sx:{fontWeight:700,fontSize:"18px",whiteSpace:"nowrap",flexShrink:0},children:s}),ce(ue,void 0!==v?{children:[de(h,{sx:{flex:1}}),de(h,{sx:{display:"flex",alignItems:"center",flexShrink:0},children:v}),de(h,{sx:{flex:1}})]}:{children:["left"===l&&L,"expanded"===P&&de(li,{defaultValue:0,variant:"standard",color:"default",sx:{ml:2,minHeight:0},children:de(si,{"aria-label":"Main navigation",children:d.map(e=>de(di,{children:e},e))})}),de(h,{sx:{flex:1}}),"right"===l&&L]}),void 0!==y?de(h,{sx:{display:"flex",alignItems:"center",gap:1},children:y}):ce(ue,{children:[u&&c.length>0&&de(h,{sx:{display:"flex",alignItems:"center",gap:.5},children:c.map((e,r)=>e.raw?de(t.Fragment,{children:e.icon},r):de(ex,{ariaLabel:e.label||"Action "+(r+1),children:e.icon},r))}),m?de(Io,{variant:"ghost",size:"small",onClick:g,"aria-label":"Sign out",startIcon:m.photoURL?de(h,{component:"img",src:m.photoURL,alt:"",sx:{width:24,height:24,borderRadius:"50%"}}):de(pr,{sx:{fontSize:24}}),children:m.displayName?.split(" ")[0]||"Account"}):f?de(Io,{variant:"default-outline",size:"small",onClick:f,children:"Login"}):"avatar"===o?de(Io,{iconOnly:!0,variant:"ghost",size:"medium","aria-label":"Account",children:de(pr,{sx:{fontSize:28}})}):null]})]})}),de(wu,{open:I,onClose:()=>A(!1),anchor:"left",size:"small",children:de(h,{component:"nav","aria-label":"Main navigation",sx:{display:"flex",flexDirection:"column",gap:.5,py:1},children:d.map(e=>de(Io,{variant:"ghost",size:"medium",onClick:()=>A(!1),sx:{justifyContent:"flex-start",width:"100%"},children:e},e))})})]})}function rx({mobileVariant:e="search",barColor:t="default",surface:n="Surface",title:o="Page Title",subtitle:i="Subtitle text",actionIcon:a,companyName:l="Company",navLinks:s=["Home","Products","About"],className:d="",sx:c={}}){const[u,p]=r(!1),m=_g[t]||_g.default,f=m.theme,g=m.surface||n,x={backgroundColor:"var(--Background)",color:"var(--Text)",boxShadow:no,fontFamily:"inherit",width:"100%",maxWidth:420,...c},b={"data-theme":f,"data-surface":g},v=de(wu,{open:u,onClose:()=>p(!1),anchor:"left",size:"small",children:de(h,{component:"nav","aria-label":"Main navigation",sx:{display:"flex",flexDirection:"column",gap:.5,py:1},children:s.map(e=>de(Io,{variant:"ghost",size:"medium",onClick:()=>p(!1),sx:{justifyContent:"flex-start",width:"100%"},children:e},e))})});return"search"===e?ce(ue,{children:[ce(h,{component:"header",role:"banner",className:"appbar appbar-mobile appbar-mobile-search appbar-"+t+" "+d,...b,sx:{...x,display:"flex",alignItems:"center",height:64,px:1.5,gap:1.5},children:[de(ex,{ariaLabel:"Open navigation menu",onClick:()=>p(!0),children:de(Pt,{sx:{fontSize:"inherit"}})}),de(Ts,{placeholder:"Search "+l,size:"small",sx:{flex:1,minWidth:0}}),de(Io,{iconOnly:!0,variant:"ghost",size:"medium","aria-label":"Account",children:de(pr,{sx:{fontSize:28}})})]}),v]}):ce(h,"small"===e?{component:"header",role:"banner",className:"appbar appbar-mobile appbar-mobile-small appbar-"+t+" "+d,...b,sx:{...x,display:"flex",alignItems:"center",height:64,px:1.5,gap:1},children:[de(ex,{ariaLabel:"Back",children:de(ur,{sx:{fontSize:"inherit"}})}),ce(h,{sx:{flex:1,minWidth:0},children:[de(h,{sx:{fontWeight:600,fontSize:"16px",lineHeight:1.3,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:o}),i&&de(h,{sx:{fontSize:"12px",opacity:.7,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:i})]}),a&&de(ex,{ariaLabel:"Action",children:a})]}:"medium"===e?{component:"header",role:"banner",className:"appbar appbar-mobile appbar-mobile-medium appbar-"+t+" "+d,...b,sx:{...x,px:1.5,pb:2},children:[ce(h,{sx:{display:"flex",alignItems:"center",height:56,gap:1},children:[de(ex,{ariaLabel:"Back",children:de(ur,{sx:{fontSize:"inherit"}})}),de(h,{sx:{flex:1}}),a&&de(ex,{ariaLabel:"Action",children:a})]}),ce(h,{sx:{px:1.5},children:[de(h,{sx:{fontWeight:600,fontSize:"24px",lineHeight:1.2},children:o}),i&&de(h,{sx:{fontSize:"14px",opacity:.7,mt:.5},children:i})]})]}:{component:"header",role:"banner",className:"appbar appbar-mobile appbar-mobile-large appbar-"+t+" "+d,...b,sx:{...x,px:1.5,pb:3},children:[ce(h,{sx:{display:"flex",alignItems:"center",height:56,gap:1},children:[de(ex,{ariaLabel:"Back",children:de(ur,{sx:{fontSize:"inherit"}})}),de(h,{sx:{flex:1}}),a&&de(ex,{ariaLabel:"Action",children:a})]}),ce(h,{sx:{px:1.5,mt:1},children:[de(h,{sx:{fontWeight:600,fontSize:"36px",lineHeight:1.1},children:o}),i&&de(h,{sx:{fontSize:"14px",opacity:.7,mt:.5},children:i})]})]})}function nx({mode:e="desktop",...t}){return de("mobile"===e?rx:tx,{...t})}const ox=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",ix=["default","primary","primary-light","white","black"],ax=["Surface","Surface-Bright","Surface-Dim","Surface-Dimmest"],lx={default:{theme:"App-Bar"},primary:{theme:"Primary"},"primary-light":{theme:"Primary",surface:"Surface-Brightest"},white:{theme:"Neutral",surface:"Surface-Brightest"},black:{theme:"Neutral",surface:"Surface-Dimmest"}};function sx({ratio:e,threshold:t}){if(!e)return de(bn,{style:{color:"var(--Text-Quiet)"},children:"--"});const r=parseFloat(e)>=t;return ce(h,{sx:{display:"inline-flex",alignItems:"center",gap:.5},children:[ce(h,{sx:{px:1,py:.25,borderRadius:"4px",fontSize:"11px",fontWeight:700,backgroundColor:r?"var(--Tags-Success-BG)":"var(--Tags-Error-BG)",color:r?"var(--Tags-Success-Text)":"var(--Tags-Error-Text)"},children:[e,":1"]}),de(bn,{style:{color:r?"var(--Tags-Success-Text)":"var(--Tags-Error-Text)"},children:r?"Pass":"Fail"})]})}function dx({label:e,ratio:t,threshold:r,note:n}){return ce(h,{sx:{display:"flex",justifyContent:"space-between",alignItems:"flex-start",py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(h,{sx:{flex:1},children:[de(ln,{style:{color:"var(--Text)"},children:e}),n&&de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:n})]}),de(sx,{ratio:t,threshold:r})]})}function cx({label:e,selected:t,onClick:r}){return de(Io,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function ux({color:e,selected:t,onClick:r}){const n=lx[e]||lx.default;return de(h,{component:"button","data-theme":n.theme,"data-surface":n.surface||"Surface",onClick:()=>r(e),"aria-label":"Select "+e,"aria-pressed":t,title:e,sx:{width:"var(--Button-Height, 36px)",height:"var(--Button-Height, 36px)",borderRadius:"4px",backgroundColor:"var(--Background)",border:t?"2px solid var(--Text)":"2px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Text)",pointerEvents:"none"}})})}function px(){const[e,t]=r("desktop"),[n,o]=r("default"),[i,l]=r("Surface"),[s,d]=r("login"),[c,u]=r("hamburger"),[p,m]=r("name"),[f,g]=r("right"),[x,b]=r("search"),[v,y]=r(null),[S,k]=r("Surface"),[w,C]=r({}),T="desktop"===e,A=lx[n]||lx.default,z=A.theme,R=A.surface||i;return a(()=>{const e={};e.text=Ki("--Text"),e.textQuiet=Ki("--Text-Quiet"),e.background=Ki("--Background"),e.border=Ki("--Border"),e.focusVisible=Ki("--Focus-Visible"),e.hover=Ki("--Hover"),e.active=Ki("--Pressed"),C(e)},[n,i,e]),ce(h,{sx:{pb:8},children:[de(qr,{children:"App Bar"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ui,{theme:v,children:de(h,{sx:{width:"100%",maxWidth:T?"100%":420,overflow:"hidden"},children:T?de(tx,{barColor:n,surface:i,loginType:s,menuType:c,brandType:p,searchPosition:f,companyName:"My App",navLinks:["Home","Products","About"]}):de(rx,{barColor:n,surface:i,mobileVariant:x,companyName:"My App",title:"Page Title",subtitle:"Subtitle text"})})}),de(ji,{code:(()=>{if(T){const e=[];"default"!==n&&e.push('barColor="'+n+'"'),"Surface"!==i&&e.push('surface="'+i+'"'),"login"!==s&&e.push('loginType="'+s+'"'),"hamburger"!==c&&e.push('menuType="'+c+'"'),"name"!==p&&e.push('brandType="'+p+'"'),"right"!==f&&e.push('searchPosition="'+f+'"');const t=e.length?"\n "+e.join("\n ")+"\n":"";return'<AppBar mode="desktop"'+(t||" ")+'companyName="My App" />'}{const e=['mode="mobile"','mobileVariant="'+x+'"'];return"default"!==n&&e.push('barColor="'+n+'"'),"Surface"!==i&&e.push('surface="'+i+'"'),"<AppBar\n "+e.join("\n ")+'\n title="Page Title"\n/>'}})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(li,{defaultValue:0,variant:"standard",color:"primary",children:[ce(si,{children:[de(di,{children:"Playground"}),de(di,{children:"Accessibility"})]}),de(ci,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(fi,{theme:v,onThemeChange:y,surface:S,onSurfaceChange:k})}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"MODE"}),de(B,{direction:"row",spacing:1,children:["desktop","mobile"].map(r=>de(cx,{label:ox(r),selected:e===r,onClick:()=>t(r)},r))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"BAR COLOR"}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:ix.map(e=>de(ux,{color:e,selected:n===e,onClick:o},e))}),ce(bn,{style:{color:"var(--Text-Quiet)",marginTop:6,display:"block"},children:['data-theme="',z,'"']})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SURFACE"}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:ax.map(e=>de(cx,{label:e.replace("Surface-","").replace("Surface","Default"),selected:i===e,onClick:()=>l(e)},e))}),ce(bn,{style:{color:"var(--Text-Quiet)",marginTop:6,display:"block"},children:['data-surface="',i,'"']})]}),T&&ce(ue,{children:[ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"MENU TYPE"}),de(B,{direction:"row",spacing:1,children:["hamburger","expanded"].map(e=>de(cx,{label:ox(e),selected:c===e,onClick:()=>u(e)},e))}),de(bn,{style:{color:"var(--Text-Quiet)",marginTop:4,display:"block"},children:"Expanded auto-falls back to hamburger when nav > 3 links"})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"BRAND"}),de(B,{direction:"row",spacing:1,children:["name","logo"].map(e=>de(cx,{label:ox(e),selected:p===e,onClick:()=>m(e)},e))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SEARCH POSITION"}),de(B,{direction:"row",spacing:1,children:["left","right"].map(e=>de(cx,{label:ox(e),selected:f===e,onClick:()=>g(e)},e))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"LOGIN TYPE"}),de(B,{direction:"row",spacing:1,children:["login","avatar"].map(e=>de(cx,{label:ox(e),selected:s===e,onClick:()=>d(e)},e))})]})]}),!T&&ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"MOBILE VARIANT"}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:["search","small","medium","large"].map(e=>de(cx,{label:ox(e),selected:x===e,onClick:()=>b(e)},e))})]})]})}),de(ci,{value:1,children:ce(h,{sx:{p:3},children:[ce(ln,{color:"quiet",style:{marginBottom:24},children:[e," / ",n," / ",i,T?"":" / "+x,' — data-theme="',z,'" data-surface="',R,'"']}),ce(B,{spacing:3,children:[ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"Text Contrast (WCAG 1.4.3 — 4.5:1)"}),de(ln,{color:"quiet",style:{marginBottom:16},children:"All text and icons must have 4.5:1 contrast against the AppBar background."}),de(dx,{label:"Resting: var(--Text) vs. var(--Background)",ratio:$i(w.text,w.background),threshold:4.5,note:'data-theme="'+z+'" data-surface="'+R+'"'}),de(dx,{label:"On hover: var(--Text) vs. var(--Hover)",ratio:$i(w.text,w.hover),threshold:4.5,note:"Icon buttons use var(--Hover) on hover"}),de(dx,{label:"On active: var(--Text) vs. var(--Pressed)",ratio:$i(w.text,w.active),threshold:4.5,note:"Icon buttons use var(--Pressed) on press"})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"Focus Indicator (WCAG 2.4.11 — 3:1)"}),de(dx,{label:"var(--Focus-Visible) vs. var(--Background)",ratio:$i(w.focusVisible,w.background),threshold:3,note:"outline: 3px solid var(--Focus-Visible); outline-offset: 1px"})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"Touch Target Area (WCAG 2.5.5)"}),[{label:"Icon button",size:40,note:"width: 40px, height: 40px"},{label:"AppBar (desktop)",size:64,note:"height: 64px"},{label:"AppBar (mobile)",size:64,note:"height: 64px"}].map(({label:e,size:t,note:r})=>{const n=t>=24,o=t>=44,i=t>=48;return ce(h,{sx:{display:"flex",justifyContent:"space-between",alignItems:"flex-start",py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(h,{sx:{flex:1},children:[ce(ln,{style:{color:"var(--Text)"},children:[e," — ",t,"px"]}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:r})]}),ce(h,{sx:{display:"flex",gap:.5,flexWrap:"wrap",justifyContent:"flex-end"},children:[ce(h,{sx:{px:1,py:.25,borderRadius:"4px",fontSize:"11px",fontWeight:700,backgroundColor:n?"var(--Tags-Success-BG)":"var(--Tags-Error-BG)",color:n?"var(--Tags-Success-Text)":"var(--Tags-Error-Text)"},children:["Desktop ",n?"Y":"N"]}),ce(h,{sx:{px:1,py:.25,borderRadius:"4px",fontSize:"11px",fontWeight:700,backgroundColor:o?"var(--Tags-Success-BG)":"var(--Tags-Warning-BG)",color:o?"var(--Tags-Success-Text)":"var(--Tags-Warning-Text)"},children:["iOS ",o?"Y":"~"]}),ce(h,{sx:{px:1,py:.25,borderRadius:"4px",fontSize:"11px",fontWeight:700,backgroundColor:i?"var(--Tags-Success-BG)":"var(--Tags-Warning-BG)",color:i?"var(--Tags-Success-Text)":"var(--Tags-Warning-Text)"},children:["Android ",i?"Y":"~"]})]})]},e)})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"ARIA and Semantics"}),ce(B,{spacing:0,children:[ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ln,{children:"Landmark:"}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:'<header role="banner">'})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ln,{children:"Navigation (expanded menu):"}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:'<nav aria-label="Main navigation">'})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ln,{children:"Theme + Surface:"}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:'data-theme="'+z+'" data-surface="'+R+'"'})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ln,{children:"Shadow:"}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:"box-shadow: var(--Effect-Level-1)"})]}),ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[de(ln,{children:"Icon buttons:"}),de(bn,{style:{color:"var(--Text-Quiet)"},children:"All icon buttons have aria-label. Focus visible on keyboard navigation."})]}),ce(h,{sx:{py:1.5},children:[de(ln,{children:"Keyboard:"}),de(bn,{style:{color:"var(--Text-Quiet)"},children:"Tab navigates all interactive elements. Enter/Space activates buttons."})]})]})]})]})]})})]})})})]})]})}function hx({title:e="My App",mode:t="light",navItems:r=[{label:"HOME",href:"#"},{label:"ABOUT",href:"#"},{label:"SERVICES",href:"#"},{label:"CONTACT",href:"#"}],rightContent:n,sx:o={},...i}){return de(J,{position:"fixed",sx:{background:"var(--Background)",color:"var(--Text)",boxShadow:"0 1px 3px rgba(0,0,0,0.1)",borderBottom:"1px solid var(--Border-Variant)",transition:"all 0.2s ease-in-out",zIndex:1201,...o},...i,children:de(F,{maxWidth:"lg",children:ce(Z,{sx:{display:"flex",justifyContent:"space-between",alignItems:"center",px:0},children:[de(T,{variant:"h6",sx:{fontWeight:700,color:"var(--Text)",mr:"auto",transition:"color 0.2s ease-in-out"},children:e}),de(h,{sx:{display:{xs:"none",md:"flex"},gap:3,flex:1,justifyContent:"center"},children:r.map((e,t)=>de(T,{component:"a",href:e.href,variant:"body2",sx:{textDecoration:"none",color:"var(--Text)",transition:"color 0.2s ease-in-out","&:hover":{color:"var(--Primary-Color-11)"}},children:e.label},t))}),de(B,{direction:"row",spacing:1,alignItems:"center",children:n})]})})})}const mx={default:{bg:"var(--Primary-Color-1)",fg:"var(--Primary-Color-12)"},primary:{theme:"Primary",surface:"Surface-Dim"},"primary-dark":{bg:"var(--Primary-Color-1)",fg:"var(--Primary-Color-12)"},white:{bg:"var(--Neutral-Color-11)",fg:"var(--Neutral-Color-3)"},black:{bg:"var(--Neutral-Color-1)",fg:"var(--Neutral-Color-12)"}};function fx({color:e="default",companyName:t="",year:r=(new Date).getFullYear(),rights:n="All rights reserved",children:o,className:i,style:a,...l}){const s=o??`© ${r}${t?" "+t:""}.${n?" "+n+".":""}`,d=mx[e]||mx.default,c=d.theme?{"data-theme":d.theme,"data-surface":d.surface||"Surface-Dim"}:{},u=d.theme?{background:"var(--Background)",color:"var(--Text)"}:{background:d.bg,color:d.fg};return de("div",{...c,className:["dino-copyright",i].filter(Boolean).join(" "),style:{padding:"14px 24px",textAlign:"center",...u,...a},...l,children:de(ln,{style:{color:"inherit",opacity:.85},children:s})})}const gx={default:{bg:"var(--Primary-Color-2)",fg:"var(--Primary-Color-12)"},primary:{theme:"Primary",surface:"Surface"},"primary-dark":{theme:"Primary",surface:"Surface-Dimmest"},white:{bg:"var(--Neutral-Color-12)",fg:"var(--Neutral-Color-2)"},black:{bg:"var(--Neutral-Color-1)",fg:"var(--Neutral-Color-12)"}};function xx({color:e="default",brand:t,address:r,columns:n=[],socialLinks:o=[],subscribe:i,copyrightName:a,copyrightYear:l,className:s,style:d,...c}){const u=n.slice(0,3),p=gx[e]||gx.default,h=p.theme?{"data-theme":p.theme,"data-surface":p.surface||"Surface"}:{},m=p.theme?{background:"var(--Background)",color:"var(--Text)"}:{background:p.bg,color:p.fg};return ce("footer",{...h,className:["dino-footer",s].filter(Boolean).join(" "),style:{...m,...d},...c,children:[ce("div",{style:{maxWidth:1200,margin:"0 auto",padding:"40px 24px 56px"},children:[t&&de("div",{style:{marginBottom:36},children:t}),ce("div",{style:{display:"grid",gridTemplateColumns:"repeat(auto-fit, minmax(280px, 1fr))",gap:40},children:[de(bx,{address:r}),u.map((e,t)=>de(vx,{...e},t))]}),(o.length>0||i)&&ce("div",{style:{marginTop:48,paddingTop:32,borderTop:"1px solid rgba(255, 255, 255, 0.10)",display:"flex",flexWrap:"wrap",gap:32,alignItems:"flex-start",justifyContent:"space-between"},children:[o.length>0&&de(yx,{links:o}),i&&de(Sx,{...i})]})]}),de(fx,{color:e,companyName:a,year:l})]})}function bx({address:e}){if(!e)return de("div",{});const{company:t,lines:r=[],email:n,phone:o}=e,i=[...t?[t]:[],...r,...o?[o]:[]];return ce("div",{children:[i.map((e,t)=>de(ln,{style:{color:"inherit",opacity:.85,display:"block"},children:e},t)),n&&de("div",{style:{marginTop:12},children:de(ln,{style:{color:"inherit",opacity:.85,display:"block"},children:de(Vs,{href:"mailto:"+n,color:"standard",style:{color:"inherit"},children:n})})})]})}function vx({title:e,links:t=[]}){return ce("div",{children:[e&&de(Yr,{style:{color:"inherit",marginBottom:12},children:e}),de("ul",{style:{listStyle:"none",margin:0,padding:0},children:t.map((e,t)=>de("li",{style:{marginBottom:8},children:de(Vs,{href:e.href,onClick:e.onClick,color:"standard",style:{color:"inherit",opacity:.85},children:e.label})},t))})]})}function yx({links:e}){return de("div",{style:{display:"flex",gap:16,alignItems:"center"},children:e.map((e,t)=>de("a",{href:e.url,target:"_blank",rel:"noopener noreferrer","aria-label":e.label||"Social link",style:{color:"inherit",opacity:.85,display:"inline-flex",alignItems:"center",justifyContent:"center",width:36,height:36,borderRadius:"50%",border:"1px solid rgba(255, 255, 255, 0.18)",textDecoration:"none",transition:"opacity 150ms ease, border-color 150ms ease"},onMouseEnter:e=>{e.currentTarget.style.opacity="1"},onMouseLeave:e=>{e.currentTarget.style.opacity="0.85"},children:e.icon},t))})}function Sx({title:e="Stay in the loop",description:t,placeholder:n="your@email.com",buttonLabel:o="Subscribe",onSubscribe:i}){const[a,l]=r(""),[s,d]=r(!1);return ce("form",{onSubmit:async e=>{if(e&&e.preventDefault(),a&&!s){d(!0);try{await(i?.(a)),l("")}finally{d(!1)}}},style:{minWidth:260,maxWidth:360,flex:"1 1 260px"},children:[de(Yr,{style:{color:"inherit",marginBottom:6},children:e}),t&&de(ln,{style:{color:"inherit",opacity:.85,marginBottom:12,display:"block"},children:t}),ce("div",{style:{display:"flex",gap:8},children:[de(Nl,{type:"email",value:a,onChange:e=>l(e.target.value),placeholder:n,size:"small",fullWidth:!0,"aria-label":"Email address"}),de(Io,{type:"submit",variant:"primary",size:"small",disabled:s||!a,children:o})]})]})}function kx(e){const t=e.match(/rgba?\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)/);return t?[Number(t[1]),Number(t[2]),Number(t[3])]:null}function Bx(e){return e?"#"+e.map(e=>e.toString(16).padStart(2,"0")).join(""):"—"}function wx([e,t,r]){const n=[e,t,r].map(e=>(e/=255)<=.03928?e/12.92:Math.pow((e+.055)/1.055,2.4));return.2126*n[0]+.7152*n[1]+.0722*n[2]}function Cx({targetRef:e,label:t,deps:n=[]}){const[o,i]=r(null),[l,s]=r(null);a(()=>{if(!e.current)return;const t=requestAnimationFrame(()=>{if(!e.current)return;const t=getComputedStyle(e.current);i(kx(t.backgroundColor)),s(kx(t.color))});return()=>cancelAnimationFrame(t)},n);const d=function(e,t){if(!e||!t)return null;const r=wx(e),n=wx(t);return(Math.max(r,n)+.05)/(Math.min(r,n)+.05)}(o,l),c=null!==d&&d>=4.5,u=null===d?"—":null!==d&&d>=7?"AAA":c?"AA":"Fail",p=null===d?"var(--Text-Quiet)":c?"var(--Text-Success)":"var(--Text-Error)";return ce("div",{style:{display:"flex",alignItems:"center",gap:16,padding:"12px 16px",borderRadius:8,background:"var(--Container)",border:"1px solid var(--Border)"},children:[ce("div",{style:{flex:1,minWidth:0},children:[de(ln,{style:{fontWeight:600},children:t}),ce(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:["Background ",Bx(o)," · Text ",Bx(l)]})]}),ce("div",{style:{display:"flex",alignItems:"center",gap:6,borderRadius:999,padding:"4px 10px",background:"var(--Background)",border:"1px solid var(--Border)"},children:[de("span",{style:{fontWeight:700,fontSize:12,color:p},children:u}),de(bn,{style:{color:"var(--Text-Quiet)"},children:null!==d?d.toFixed(2)+":1":"—"})]})]})}const Tx={company:"DinoDesign",lines:["123 Market Street","San Francisco, CA 94103"],email:"hello@dinodesign.dev",phone:"+1 (555) 010-0000"},Ix=[{title:"Product",links:[{label:"Features",href:"#"},{label:"Pricing",href:"#"},{label:"Add-ons",href:"#"}]},{title:"Company",links:[{label:"About",href:"#"},{label:"Careers",href:"#"},{label:"Contact",href:"#"}]},{title:"Resources",links:[{label:"Docs",href:"#"},{label:"Changelog",href:"#"},{label:"Status",href:"#"}]}],Ax=[{icon:de(hr,{fontSize:"small"}),url:"https://twitter.com",label:"Twitter"},{icon:de(mr,{fontSize:"small"}),url:"https://github.com",label:"GitHub"},{icon:de(fr,{fontSize:"small"}),url:"https://linkedin.com",label:"LinkedIn"}],zx=[{value:"default",label:"Default"},{value:"primary",label:"Primary"},{value:"primary-dark",label:"Primary Dark"},{value:"white",label:"White"},{value:"black",label:"Black"}];function Rx({label:e,selected:t,onClick:r}){return de(Io,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function Ex(){const[e,t]=r(4),[n,i]=r(!0),[l,s]=r(!0),[d,c]=r("default"),u=o(null),[p,m]=r(null),[f,g]=r(null);a(()=>{u.current&&(m({current:u.current.querySelector(".dino-footer")}),g({current:u.current.querySelector(".dino-copyright")}))},[d,e,n,l]);const x=Ix.slice(0,Math.max(0,e-1)),b=n?Ax:[],v=l?{title:"Stay in the loop",description:"Monthly updates on new components and tips.",onSubscribe:async e=>console.log("subscribed:",e)}:void 0;return ce(h,{children:[de(qr,{style:{marginBottom:12},children:"Footer"}),ce(cn,{color:"quiet",style:{marginBottom:24,maxWidth:720},children:["Configurable 1–4 column footer. The first column is always the company address / contact. Optional ",de("code",{children:"socialLinks"})," and"," ",de("code",{children:"subscribe"})," sit above the auto-generated copyright strip."]}),de(h,{ref:u,sx:{borderRadius:1,overflow:"hidden",mb:4},children:de(xx,{color:d,address:Tx,columns:x,socialLinks:b,subscribe:v,copyrightName:"DinoDesign"})}),ce(li,{defaultValue:0,variant:"standard",color:"primary",children:[ce(si,{children:[de(di,{children:"Playground"}),de(di,{children:"Accessibility"})]}),de(ci,{value:0,children:ce(B,{spacing:3,sx:{p:3,maxWidth:560},children:[ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLUMNS"}),de(B,{direction:"row",spacing:1,children:[1,2,3,4].map(r=>de(Rx,{label:String(r),selected:e===r,onClick:()=>t(r)},r))}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:"First column is always the address / contact. Up to 3 more link columns."})]}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{direction:"row",spacing:1,sx:{flexWrap:"wrap",rowGap:1},children:zx.map(e=>de(Rx,{label:e.label,selected:d===e.value,onClick:()=>c(e.value)},e.value))}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:'"Default" hardcodes Primary tone 2 (auto-derived in a future iteration).'})]}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SOCIAL LINKS"}),de(oa,{label:"Show social media row",checked:n,onChange:e=>i(e.target.checked)}),ce(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:["When on, the Footer renders the ",de("code",{children:"socialLinks"})," row (icons linking out). In your app, supply the icon + url pairs from your data store."]})]}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SUBSCRIBE"}),de(oa,{label:"Show email subscribe form",checked:l,onChange:e=>s(e.target.checked)}),ce(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:["When on, the Footer renders an email subscribe form. Hook it up via"," ",de("code",{children:"subscribe.onSubscribe(email)"}),"."]})]})]})}),de(ci,{value:1,children:ce(B,{spacing:2,sx:{p:3,maxWidth:560},children:[de(bn,{style:{color:"var(--Text-Quiet)"},children:"Live WCAG 2.1 contrast against the painted background. AA needs 4.5:1 for normal text; AAA needs 7:1."}),p&&de(Cx,{targetRef:p,label:"Footer body",deps:[d,e,n,l]}),f&&de(Cx,{targetRef:f,label:"Copyright strip",deps:[d,e,n,l]})]})})]})]})}const Px=[{value:"default",label:"Default"},{value:"primary",label:"Primary"},{value:"primary-dark",label:"Primary Dark"},{value:"white",label:"White"},{value:"black",label:"Black"}];function Lx({label:e,selected:t,onClick:r}){return de(Io,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function Mx(){const[e,t]=r("DinoDesign"),[n,i]=r((new Date).getFullYear()),[l,s]=r("All rights reserved"),[d,c]=r(""),[u,p]=r(!1),[m,f]=r("default"),g=o(null),[x,b]=r(null);return a(()=>{g.current&&b({current:g.current.querySelector(".dino-copyright")})},[m,u,e,n,l,d]),ce(h,{children:[de(qr,{style:{marginBottom:12},children:"Copyright"}),ce(cn,{color:"quiet",style:{marginBottom:24,maxWidth:720},children:["Standalone copyright strip used at the bottom of pages. Defaults to"," ",ce("code",{children:["© ","{year}"," ","{companyName}",". ","{rights}","."]})," Pass"," ",de("code",{children:"children"})," to override the entire text."]}),de(h,{ref:g,sx:{borderRadius:1,overflow:"hidden",mb:4},children:de(fx,u?{color:m,children:d||"Type a custom message →"}:{color:m,companyName:e,year:Number(n)||(new Date).getFullYear(),rights:l})}),ce(li,{defaultValue:0,variant:"standard",color:"primary",children:[ce(si,{children:[de(di,{children:"Playground"}),de(di,{children:"Accessibility"})]}),de(ci,{value:0,children:ce(B,{spacing:3,sx:{p:3,maxWidth:560},children:[ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"TEXT MODE"}),ce(B,{direction:"row",spacing:1,children:[de(Lx,{label:"Auto-generated",selected:!u,onClick:()=>p(!1)}),de(Lx,{label:"Custom",selected:u,onClick:()=>p(!0)})]})]}),!u&&ce(ue,{children:[de(Yo,{label:"Company name",value:e,onChange:e=>t(e.target.value),placeholder:"DinoDesign",size:"medium"}),de(xl,{label:"Year",value:Number(n),onChange:e=>i(e),min:1900,max:2100}),de(Yo,{label:"Rights text",value:l,onChange:e=>s(e.target.value),placeholder:"All rights reserved",size:"medium"}),de(bn,{style:{color:"var(--Text-Quiet)"},children:'Leave Rights blank to omit "All rights reserved." entirely.'})]}),u&&ce(ue,{children:[de(Yo,{label:"Custom text",value:d,onChange:e=>c(e.target.value),placeholder:"© 2026 DinoDesign · MIT License · Built with love",size:"medium",multiline:!0}),de(bn,{style:{color:"var(--Text-Quiet)"},children:"Pass any string (or React node) as children to fully override the auto text."})]}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{direction:"row",spacing:1,sx:{flexWrap:"wrap",rowGap:1},children:Px.map(e=>de(Lx,{label:e.label,selected:m===e.value,onClick:()=>f(e.value)},e.value))}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:"Matches the Footer color presets so the two stack cleanly."})]})]})}),de(ci,{value:1,children:ce(B,{spacing:2,sx:{p:3,maxWidth:560},children:[de(bn,{style:{color:"var(--Text-Quiet)"},children:"Live WCAG 2.1 contrast against the painted background. AA needs 4.5:1 for normal text; AAA needs 7:1."}),x&&de(Cx,{targetRef:x,label:"Copyright strip",deps:[m,u,e,n,l,d]})]})})]})]})}const Wx=["Default","Primary","Secondary","Tertiary","Neutral"],Ox={Classic:{name:"Classic",description:"Raised + soft shadow",angle:135,bevel:!0,depth:5,softness:1,shadow:!0,shadowDistance:6,shadowBlur:8,shadowOpacity:.6},Carved:{name:"Carved",description:"Deep inset, no shadow",angle:135,bevel:!0,depth:10,softness:2,shadow:!1,shadowDistance:4,shadowBlur:4,shadowOpacity:.4},Embossed:{name:"Embossed",description:"Inset + heavy shadow",angle:135,bevel:!0,depth:7,softness:1.5,shadow:!0,shadowDistance:10,shadowBlur:14,shadowOpacity:.7},Stamp:{name:"Stamp",description:"Reversed light + shadow",angle:315,bevel:!0,depth:6,softness:1,shadow:!0,shadowDistance:5,shadowBlur:6,shadowOpacity:.8},"Night Cut":{name:"Night Cut",description:"Inset on dark background",angle:135,bevel:!0,depth:8,softness:2,shadow:!1,shadowDistance:6,shadowBlur:8,shadowOpacity:.6},"Shadow Only":{name:"Shadow Only",description:"Flat fill + drop shadow",angle:135,bevel:!1,depth:4,softness:1,shadow:!0,shadowDistance:8,shadowBlur:12,shadowOpacity:.5}},Dx=Object.keys(Ox);function Fx(e,t){if("custom"===e)return{...Ox.Classic,name:"Custom",description:"Custom",...t||{}};const r=Ox[e];return r?{...r}:{...Ox.Classic}}function Nx(e,t){const r=e||"Primary";return"base"===t?"var(--Buttons-"+r+"-Button)":"highlight"===t?"rgb(var(--Buttons-"+r+"-Highlight))":"lowlight"===t?"rgb(var(--Buttons-"+r+"-Lowlight))":void 0}function Hx(e){const t=e||"Primary";return"Default"===t?"var(--Text)":"var(--Text-"+t+")"}function Vx(e,t){const r=(e-90)*Math.PI/180;return{dx:Math.cos(r)*t,dy:Math.sin(r)*t}}const Qx={"display-large":{fontFamily:"var(--Header-Font-Family)",fontSize:"var(--Display-Large-Font-Size)",fontWeight:"var(--Display-Large-Font-Weight)",letterSpacing:"var(--Display-Large-Letter-Spacing)",pxHint:64},"display-small":{fontFamily:"var(--Header-Font-Family)",fontSize:"var(--Display-Small-Font-Size)",fontWeight:"var(--Display-Small-Font-Weight)",letterSpacing:"var(--Display-Small-Letter-Spacing)",pxHint:48}};function jx({text:e="Your Brand. Perfected.",curves:r,arc:n=160,radius:o=300,direction:i="up",rotation:a=0,autoCrop:l=!0,textStyle:s="display-large",fontSize:d,fontFamily:c,fontWeight:u,letterSpacing:p,color:h="var(--Text, #1a1a1a)",bevel:m=!1,bevelTheme:f="Primary",bevelPreset:g,bevelCustom:x,className:b,style:v,...y}){const S=g?Fx(g,x):null,k=S?!!S.bevel:!!m,B=Qx[s]||Qx["display-large"],w=c??B.fontFamily,C=d??B.fontSize,T=u??B.fontWeight,I=p??B.letterSpacing,A="number"==typeof d?d:B.pxHint,z=r&&r.length>0?r:[{arc:n,radius:o,direction:i}],{d:R,width:E,upMax:P,downMax:L,pathId:M}=function(e){return t.useMemo(()=>{const t="dino-curved-text-"+Math.random().toString(36).slice(2,9);let r=0;const n=0;let o="M "+r+" "+n,i=0,a=0;for(const{arc:t,radius:l,direction:s}of e){const e=Gx(t,1,359),d=Math.max(10,l),c=e*Math.PI/180,u=2*d*Math.sin(c/2),p=d*(1-Math.cos(c/2));r+=u,o+=" A "+d+" "+d+" 0 "+(e>180?1:0)+" "+("up"===s?1:0)+" "+r+" "+n,"up"===s?i=Math.max(i,p):a=Math.max(a,p)}return{d:o,width:r,upMax:i,downMax:a,pathId:t}},[JSON.stringify(e)])}(z),W=Math.ceil(P+A),O=Math.ceil(L+A),D=Math.ceil(A),F=Math.ceil(E+2*D),N=W+O,H=D,V=W,Q=a?"rotate("+a+" "+F/2+" "+N/2+")":void 0,j=t.useRef(null),[G,U]=t.useState(null),[X,$]=t.useState(A);t.useEffect(()=>{if(!j.current||"undefined"==typeof ResizeObserver)return;const e=j.current,t=()=>{const t=e.getBoundingClientRect(),r=G?G.width:F;if(!r||!t.width)return;const n=t.width/r;$(A*n)};t();const r=new ResizeObserver(t);return r.observe(e),()=>r.disconnect()},[F,A,G]);const K=k&&X>=19;t.useLayoutEffect(()=>{if(!l)return void U(null);const e=j.current;if(!e)return;const t=e.querySelector("text");if(!t)return;let r;try{r=t.getBBox()}catch(e){return}if(!r||!r.width||!r.height)return;const n=F/2,o=N/2,i=a*Math.PI/180,s=Math.cos(i),d=Math.sin(i),c=(e,t)=>{const r=e-n,i=t-o;return{x:n+r*s-i*d,y:o+r*d+i*s}},u=[c(r.x,r.y),c(r.x+r.width,r.y),c(r.x,r.y+r.height),c(r.x+r.width,r.y+r.height)],p=Math.min(...u.map(e=>e.x)),h=Math.max(...u.map(e=>e.x)),m=Math.min(...u.map(e=>e.y)),f=Math.max(...u.map(e=>e.y)),g=.12*A,x={x:p-g,y:m-g,width:h-p+2*g,height:f-m+2*g};U(e=>e&&Math.abs(e.x-x.x)<.5&&Math.abs(e.y-x.y)<.5&&Math.abs(e.width-x.width)<.5&&Math.abs(e.height-x.height)<.5?e:x)},[l,e,JSON.stringify(z),a,A,I,w,T,k,f,g,JSON.stringify(x)]);const q=G?G.x+" "+G.y+" "+G.width+" "+G.height:"0 0 "+F+" "+N,Y=G?G.width:F,J=G?G.height:N;return ce("svg",{ref:j,viewBox:q,width:Y,height:J,preserveAspectRatio:"xMidYMid meet",xmlns:"http://www.w3.org/2000/svg",style:{display:"block",maxWidth:"100%",height:"auto",overflow:"visible",...v},"aria-label":e,role:"img",className:["dino-curved-text",b].filter(Boolean).join(" "),...y,children:[de("defs",{children:de("path",{id:M,d:R,transform:"translate("+H+" "+V+")"})}),ce("g",{transform:Q,children:[K&&(()=>{const t=S?S.depth/96:.045,r=Math.max(2,Math.round(A*t)),n=Math.max(1,Math.round(A*t*.67)),o={fontFamily:w,fontSize:"number"==typeof C?C+"px":C,fontWeight:T,letterSpacing:"number"==typeof I?I+"px":I};return ce(ue,{children:[de("text",{className:"dino-bevel-layer dino-bevel-layer--lowlight",fill:"rgb(var(--Buttons-"+f+"-Lowlight))",transform:"translate(0 "+r+")",style:o,children:de("textPath",{href:"#"+M,startOffset:"50%",textAnchor:"middle",children:e})}),de("text",{className:"dino-bevel-layer dino-bevel-layer--highlight",fill:"rgb(var(--Buttons-"+f+"-Highlight))",transform:"translate(0 -"+n+")",style:o,children:de("textPath",{href:"#"+M,startOffset:"50%",textAnchor:"middle",children:e})})]})})(),de("text",{className:"dino-curved-text__base",fill:K?"var(--Buttons-"+f+"-Button)":k?Hx(f):h,style:{fontFamily:w,fontSize:"number"==typeof C?C+"px":C,fontWeight:T,letterSpacing:"number"==typeof I?I+"px":I},children:de("textPath",{href:"#"+M,startOffset:"50%",textAnchor:"middle",children:e})})]})]})}function Gx(e,t,r){return Math.max(t,Math.min(r,e))}const Ux=[{value:"display-large",label:"Display Large"},{value:"display-small",label:"Display Small"}],Xx=[{value:"text",label:"Text",css:"var(--Text)"},{value:"primary",label:"Primary",css:"var(--Text-Primary)"},{value:"secondary",label:"Secondary",css:"var(--Text-Secondary)"},{value:"tertiary",label:"Tertiary",css:"var(--Text-Tertiary)"}],$x=Wx.map(e=>({value:e,label:e}));function Kx({label:e,selected:t,onClick:r}){return de(Io,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function qx(){const[e,t]=r("Your Brand. Perfected."),[n,i]=r("display-large"),[l,s]=r("primary"),[d,c]=r([(u="up",{arc:140,radius:340,direction:u})]);var u;const[p,m]=r(0),[f,g]=r(8),[x,b]=r(700),[v,y]=r(!1),[S,k]=r("Primary"),[w,C]=r("Classic"),T=o(null),[I,A]=r(null);a(()=>{T.current&&A({current:T.current.querySelector("text")})},[l,n,d,p,f,x,v,S,w]);const z=Xx.find(e=>e.value===l)?.css||Xx[0].css;function R(e,t){c(r=>r.map((r,n)=>n===e?{...r,...t}:r))}return ce(h,{children:[de(qr,{style:{marginBottom:12},children:"Curved Display Text"}),de(cn,{color:"quiet",style:{marginBottom:24,maxWidth:720},children:"Decorative text laid along an SVG arc. Chain multiple arcs to build a wave — each curve gets its own radius, arc sweep, and direction. Uses your design system's decorative font + text tokens."}),ce(h,{sx:{display:"grid",gridTemplateColumns:"repeat(auto-fit, minmax(360px, 1fr))",gap:3,alignItems:"start"},children:[de(h,{sx:{minWidth:0},children:de(h,{ref:T,"data-surface":"Container",sx:{background:"var(--Background)",borderRadius:2,p:3,display:"flex",alignItems:"center",justifyContent:"center",overflow:"auto",position:"sticky",top:16},children:de(jx,{text:e,curves:d,textStyle:n,rotation:p,letterSpacing:f,fontWeight:x,bevel:v,bevelTheme:S,bevelPreset:v?w:void 0,color:z})})}),de(h,{sx:{minWidth:0,alignSelf:"flex-start"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(li,{defaultValue:0,variant:"standard",color:"primary",children:[ce(si,{children:[de(di,{children:"Playground"}),de(di,{children:"Accessibility"})]}),de(ci,{value:0,children:ce(B,{spacing:3,sx:{p:3,maxWidth:720},children:[de(Yo,{label:"Text",value:e,onChange:e=>t(e.target.value),placeholder:"Your headline…",size:"medium"}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"CURVES"}),de(B,{direction:"row",spacing:1,children:[1,2].map(e=>de(Kx,{label:String(e),selected:d.length===e,onClick:()=>function(e){c(t=>{if(e===t.length)return t;if(e>t.length){const r=[...t];for(;r.length<e;){const e=r[r.length-1];r.push({arc:e.arc,radius:e.radius,direction:"up"===e.direction?"down":"up"})}return r}return t.slice(0,e)})}(e)},e))}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:"One curve is an arch. Two curves chain end-to-end for a wave."})]}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:12},children:"PER-CURVE SETTINGS"}),de(B,{spacing:2,children:d.map((e,t)=>ce(h,{"data-surface":"Container",style:{background:"var(--Background)",border:"1px solid var(--Border)",borderRadius:8,padding:12},children:[ce(B,{direction:"row",alignItems:"center",spacing:2,sx:{mb:1},children:[ce(bn,{style:{fontWeight:700},children:["Curve ",t+1]}),de("div",{style:{flex:1}}),ce(B,{direction:"row",spacing:1,children:[de(Kx,{label:"⌢ Up",selected:"up"===e.direction,onClick:()=>R(t,{direction:"up"})}),de(Kx,{label:"⌣ Down",selected:"down"===e.direction,onClick:()=>R(t,{direction:"down"})})]})]}),ce(B,{spacing:1,children:[ce("div",{children:[ce(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:["Radius",ce("span",{style:{float:"right"},children:[e.radius,"px"]})]}),de(vs,{min:100,max:600,step:10,value:e.radius,onChange:(e,r)=>R(t,{radius:r})})]}),ce("div",{children:[ce(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:["Arc sweep",ce("span",{style:{float:"right"},children:[e.arc,"°"]})]}),de(vs,{min:40,max:280,step:5,value:e.arc,onChange:(e,r)=>R(t,{arc:r})})]})]})]},t))})]}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"TYPOGRAPHY"}),de(B,{direction:"row",spacing:1,sx:{flexWrap:"wrap",rowGap:1},children:Ux.map(e=>de(Kx,{label:e.label,selected:n===e.value,onClick:()=>i(e.value)},e.value))}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:"Uses the lib's DisplayLarge / DisplaySmall tokens (font-family, size, weight, letter-spacing)."})]}),ce(h,{children:[ce(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:["LETTER SPACING",ce("span",{style:{float:"right"},children:[f,"px"]})]}),de(vs,{min:-4,max:40,step:1,value:f,onChange:(e,t)=>g(t)}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:"Adjusts the gap between characters along the wave."})]}),ce(h,{children:[ce(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:["FONT WEIGHT",de("span",{style:{float:"right"},children:x})]}),de(vs,{min:100,max:900,step:100,value:x,onChange:(e,t)=>b(t)}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:"Heavier weights read better at decorative sizes. Available weights depend on the loaded display font."})]}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"BEVEL"}),de(oa,{label:"3D bevel effect",checked:v,onChange:e=>y(e.target.checked)}),v&&ce(h,{sx:{mt:1.5},children:[de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:6},children:"Preset"}),de(B,{direction:"row",spacing:1,sx:{flexWrap:"wrap",rowGap:1,mb:1.5},children:Dx.map(e=>de(Kx,{label:e,selected:w===e,onClick:()=>C(e)},e))}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:6},children:"Bevel theme"}),de(B,{direction:"row",spacing:1,sx:{flexWrap:"wrap",rowGap:1},children:$x.map(e=>de(Kx,{label:e.label,selected:S===e.value,onClick:()=>k(e.value)},e.value))})]}),ce(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:["Bevel layers use ",ce("code",{children:["--Buttons-","{Theme}","-Button"]})," for the fill, with ",de("code",{children:"Highlight"})," + ",de("code",{children:"Lowlight"}),"tokens for the bright/shadow stripes. CurvedText honors a preset's ",de("em",{children:"depth"})," only — angle, softness, and drop-shadow fields are stacked-rendering limitations and are ignored here (the full filter pipeline lives in ",de("code",{children:"<BevelText>"}),"). Shadow-only presets render no effect. Auto-hides below 19px so the 3:1 bevel contrast doesn't compromise small-text legibility."]})]}),ce(h,{children:[ce(B,{direction:"row",alignItems:"center",sx:{mb:1},children:[ce(Tn,{style:{color:"var(--Text-Quiet)",flex:1},children:["ROTATION",ce("span",{style:{float:"right",marginRight:12},children:[p,"°"]})]}),de(Io,{variant:"default-outline",size:"small",onClick:function(){const t=T.current?.querySelector("svg");if(!t)return;const r=t.querySelector("path"),n=t.querySelector("text");if(!r||!n)return;const o=r.getTotalLength();if(!o)return;let i=0;try{i=n.getComputedTextLength?.()||0}catch(e){}i||(i=Math.min(o,18*e.length));const a=Math.max(0,(o-i)/2),l=Math.min(o,a+i),s=r.getPointAtLength(a),d=r.getPointAtLength(l),c=180*Math.atan2(d.y-s.y,d.x-s.x)/Math.PI,u=Math.max(-45,Math.min(45,Math.round(-c)));m(u)},children:"Auto-level"})]}),de(vs,{min:-45,max:45,step:1,value:p,onChange:(e,t)=>m(t)}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:'Tilts the whole text block around its center. "Auto-level" rotates so the text\'s start and end sit on the same horizontal line — useful when a multi-curve wave makes the reading line slant.'})]}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{direction:"row",spacing:1,sx:{flexWrap:"wrap",rowGap:1},children:Xx.map(e=>de(Kx,{label:e.label,selected:l===e.value,onClick:()=>s(e.value)},e.value))})]})]})}),de(ci,{value:1,children:ce(B,{spacing:2,sx:{p:3,maxWidth:560},children:[de(bn,{style:{color:"var(--Text-Quiet)"},children:"Live WCAG 2.1 contrast against the painted background. Decorative display text counts as large text — AA needs 3:1, AAA needs 4.5:1 — but DinoDesign defaults to 4.5:1 across the board."}),I&&de(Cx,{targetRef:I,label:"Curved text",deps:[l,n,JSON.stringify(d),p,f]}),ce(ln,{color:"quiet",children:["The SVG sets ",de("code",{children:'role="img"'})," and"," ",de("code",{children:"aria-label"})," to the rendered text so screen readers announce it as a labeled image, not a stream of individual glyphs."]})]})})]})})})]})]})}const Yx={"display-large":{fontFamily:"var(--Header-Font-Family)",fontSize:"var(--Display-Large-Font-Size)",fontWeight:"var(--Display-Large-Font-Weight)",letterSpacing:"var(--Display-Large-Letter-Spacing)",pxHint:96},"display-small":{fontFamily:"var(--Header-Font-Family)",fontSize:"var(--Display-Small-Font-Size)",fontWeight:"var(--Display-Small-Font-Weight)",letterSpacing:"var(--Display-Small-Letter-Spacing)",pxHint:64}};function Jx({text:e="DinoDesign",theme:r="Primary",preset:n="Classic",custom:o,textStyle:i="display-large",fontSize:a,fontFamily:l,fontWeight:s,letterSpacing:d,className:c,style:u,...p}){const h=Yx[i]||Yx["display-large"],m=l??h.fontFamily,f=a??h.fontSize,g=s??h.fontWeight,x=d??h.letterSpacing,b="number"==typeof a?a:h.pxHint,v=Fx(n,o),y="dino-bevel-"+t.useId().replace(/:/g,""),S=y+"-s",k=t.useRef(null),[B,w]=t.useState(b),C=.6*b,T=Math.max(400,e.length*C+80),I=1.9*b,A=T/2,z=.7*I;t.useEffect(()=>{if(!k.current||"undefined"==typeof ResizeObserver)return;const e=k.current,t=()=>{const t=e.getBoundingClientRect();T&&t.width&&w(b*(t.width/T))};t();const r=new ResizeObserver(t);return r.observe(e),()=>r.disconnect()},[T,b]);const R=B>=19,E=v.bevel?Vx(v.angle+180,v.depth):{dx:0,dy:0},P=v.bevel?Vx(v.angle,v.depth):{dx:0,dy:0},L=v.shadow?Vx(v.angle,v.shadowDistance??6):{dx:0,dy:0},M=R?Nx(r,"base"):Hx(r),W=Nx(r,"highlight"),O=Nx(r,"lowlight"),D={fontFamily:m,fontSize:"number"==typeof f?f+"px":f,fontWeight:g,letterSpacing:"number"==typeof x?x+"px":x},F=v.bevel&&R?"url(#"+y+")":void 0,N=v.shadow&&R?"url(#"+S+")":void 0;return ce("svg",{ref:k,viewBox:"0 0 "+T+" "+I,width:T,height:I,preserveAspectRatio:"xMidYMid meet",xmlns:"http://www.w3.org/2000/svg",style:{display:"block",maxWidth:"100%",height:"auto",overflow:"visible",...u},"aria-label":e,role:"img",className:["dino-bevel-text",c].filter(Boolean).join(" "),...p,children:[ce("defs",{children:[v.shadow&&de("filter",{id:S,x:"-30%",y:"-30%",width:"160%",height:"160%",children:de("feDropShadow",{dx:L.dx.toFixed(2),dy:L.dy.toFixed(2),stdDeviation:v.shadowBlur??8,style:{floodColor:O,floodOpacity:v.shadowOpacity??.6}})}),v.bevel&&ce("filter",{id:y,x:"-5%",y:"-5%",width:"110%",height:"110%",colorInterpolationFilters:"sRGB",children:[de("feGaussianBlur",{in:"SourceAlpha",stdDeviation:(v.softness??1)+.5,result:"blur-alpha"}),de("feOffset",{in:"blur-alpha",dx:P.dx.toFixed(2),dy:P.dy.toFixed(2),result:"shadow-offset"}),de("feFlood",{style:{floodColor:O,floodOpacity:.95},result:"shadow-flood"}),de("feComposite",{in:"shadow-flood",in2:"shadow-offset",operator:"in",result:"shadow-shaped"}),de("feComposite",{in:"shadow-shaped",in2:"SourceAlpha",operator:"in",result:"shadow-clipped"}),de("feOffset",{in:"blur-alpha",dx:E.dx.toFixed(2),dy:E.dy.toFixed(2),result:"hi-offset"}),de("feFlood",{style:{floodColor:W,floodOpacity:.95},result:"hi-flood"}),de("feComposite",{in:"hi-flood",in2:"hi-offset",operator:"in",result:"hi-shaped"}),de("feComposite",{in:"hi-shaped",in2:"SourceAlpha",operator:"in",result:"hi-clipped"}),ce("feMerge",{children:[de("feMergeNode",{in:"SourceGraphic"}),de("feMergeNode",{in:"shadow-clipped"}),de("feMergeNode",{in:"hi-clipped"})]})]})]}),v.shadow&&R&&de("text",{className:"dino-bevel-layer dino-bevel-layer--shadow",x:A,y:z,textAnchor:"middle",fill:M,filter:N,style:D,"aria-hidden":"true",children:e}),de("text",{className:v.bevel?"dino-bevel-text__base dino-bevel-layer":"dino-bevel-text__base",x:A,y:z,textAnchor:"middle",fill:M,filter:F,style:D,children:e})]})}const Zx=[...Dx.map(e=>({value:e,label:e,description:Ox[e].description})),{value:"custom",label:"Custom",description:"Tune every knob"}],_x=[{value:"light",label:"Light",css:"var(--Surface)"},{value:"warm",label:"Warm",css:"var(--Surface-Dim)"},{value:"dark",label:"Dark",css:"var(--Container-High)"}];function eb({label:e,selected:t,onClick:r}){return de(Io,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function tb({option:e,active:t,onClick:r}){return ce(h,{onClick:r,role:"button",tabIndex:0,onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),r())},sx:{flex:"1 1 140px",minWidth:130,cursor:"pointer",border:"1.5px solid",borderColor:t?"var(--Buttons-Primary-Border)":"var(--Border)",background:t?"rgb(var(--Buttons-Primary-Highlight) / 0.18)":"var(--Background)",borderRadius:"var(--Style-Border-Radius)",p:1.5,transition:"border-color 0.15s, background 0.15s",textAlign:"center","&:hover":{borderColor:"var(--Buttons-Primary-Border)"},"&:focus-visible":{outline:"2px solid var(--Focus-Visible)",outlineOffset:2}},children:[de(bn,{style:{fontWeight:600,color:"var(--Text)"},children:e.label}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:2},children:e.description})]})}function rb(){const[e,t]=r("DinoDesign"),[n,o]=r("Primary"),[i,a]=r("Classic"),[l,s]=r("light"),[d,c]=r(135),[u,p]=r(5),[m,f]=r(1),[g,x]=r(!0),[b,v]=r(!0),[y,S]=r(6),[k,w]=r(8),[C,T]=r(60),[I,A]=r(96),[z,R]=r(900),[E,P]=r(0),L="custom"===i,M=L?{angle:d,depth:u,softness:m,bevel:g,shadow:b,shadowDistance:y,shadowBlur:k,shadowOpacity:C/100}:void 0;const W=_x.find(e=>e.value===l)?.css||_x[0].css;return ce(h,{children:[de(qr,{style:{marginBottom:12},children:"Bevel Display Text"}),de(cn,{color:"quiet",style:{marginBottom:24,maxWidth:720},children:"Straight-line display text with an SVG inset-bevel and optional drop shadow. Colors are locked to the active button-palette tokens (Button / Highlight / Lowlight) so the same preset reads correctly under any theme."}),ce(h,{sx:{display:"grid",gridTemplateColumns:"repeat(auto-fit, minmax(360px, 1fr))",gap:3,alignItems:"start"},children:[de(h,{sx:{minWidth:0},children:de(h,{"data-surface":"Container",sx:{background:W,borderRadius:2,p:4,display:"flex",alignItems:"center",justifyContent:"center",minHeight:240,overflow:"auto",position:"sticky",top:16,transition:"background 0.2s"},children:de(Jx,{text:e,theme:n,preset:i,custom:M,fontSize:I,fontWeight:z,letterSpacing:E})})}),de(h,{sx:{minWidth:0,alignSelf:"flex-start"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(li,{defaultValue:0,variant:"standard",color:"primary",children:[ce(si,{children:[de(di,{children:"Playground"}),de(di,{children:"Accessibility"})]}),de(ci,{value:0,children:ce(B,{spacing:3,sx:{p:3,maxWidth:720},children:[de(Yo,{label:"Text",value:e,onChange:e=>t(e.target.value),placeholder:"Your headline…",size:"medium"}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"THEME"}),de(B,{direction:"row",spacing:1,sx:{flexWrap:"wrap",rowGap:1},children:Wx.map(e=>de(eb,{label:e,selected:n===e,onClick:()=>o(e)},e))}),ce(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:["Resolves to ",ce("code",{children:["--Buttons-","{Theme}","-Button"]})," ","(fill), ",de("code",{children:"-Highlight"})," (light edge), and"," ",de("code",{children:"-Lowlight"})," (shadow edge)."]})]}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"PRESETS"}),de(h,{sx:{display:"flex",flexWrap:"wrap",gap:1},children:Zx.map(e=>de(tb,{option:e,active:i===e.value,onClick:()=>function(e){if(a(e),"custom"!==e){const t=Fx(e);c(t.angle),p(t.depth??5),f(t.softness??1),x(t.bevel),v(t.shadow),S(t.shadowDistance??6),w(t.shadowBlur??8),T(Math.round(100*(t.shadowOpacity??.6)))}}(e.value)},e.value))})]}),L&&ce(h,{sx:{border:"1px solid var(--Border)",borderRadius:"var(--Style-Border-Radius)",p:2},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:12},children:"CUSTOM"}),ce(B,{spacing:2,children:[ce("div",{children:[ce(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:["Light angle",ce("span",{style:{float:"right"},children:[d,"°"]})]}),de(vs,{min:0,max:360,step:5,value:d,onChange:(e,t)=>c(t)})]}),ce(h,{sx:{border:"1px solid var(--Border-Variant)",borderRadius:1,p:1.5},children:[de(oa,{label:"Inset bevel",checked:g,onChange:e=>x(e.target.checked)}),g&&ce(B,{spacing:1.5,sx:{mt:1.5},children:[ce("div",{children:[ce(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:["Depth",ce("span",{style:{float:"right"},children:[u,"px"]})]}),de(vs,{min:1,max:16,step:1,value:u,onChange:(e,t)=>p(t)})]}),ce("div",{children:[ce(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:["Softness",ce("span",{style:{float:"right"},children:[m,"px"]})]}),de(vs,{min:0,max:6,step:.5,value:m,onChange:(e,t)=>f(t)})]})]})]}),ce(h,{sx:{border:"1px solid var(--Border-Variant)",borderRadius:1,p:1.5},children:[de(oa,{label:"Drop shadow",checked:b,onChange:e=>v(e.target.checked)}),b&&ce(B,{spacing:1.5,sx:{mt:1.5},children:[ce("div",{children:[ce(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:["Distance",ce("span",{style:{float:"right"},children:[y,"px"]})]}),de(vs,{min:1,max:24,step:1,value:y,onChange:(e,t)=>S(t)})]}),ce("div",{children:[ce(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:["Blur",ce("span",{style:{float:"right"},children:[k,"px"]})]}),de(vs,{min:0,max:24,step:1,value:k,onChange:(e,t)=>w(t)})]}),ce("div",{children:[ce(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:["Opacity",ce("span",{style:{float:"right"},children:[C,"%"]})]}),de(vs,{min:10,max:100,step:5,value:C,onChange:(e,t)=>T(t)})]})]})]})]})]}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"TYPOGRAPHY"}),ce(B,{spacing:2,children:[ce("div",{children:[ce(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:["Font size",ce("span",{style:{float:"right"},children:[I,"px"]})]}),de(vs,{min:32,max:160,step:4,value:I,onChange:(e,t)=>A(t)})]}),ce("div",{children:[ce(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:["Font weight",de("span",{style:{float:"right"},children:z})]}),de(vs,{min:400,max:900,step:100,value:z,onChange:(e,t)=>R(t)})]}),ce("div",{children:[ce(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:["Letter spacing",ce("span",{style:{float:"right"},children:[E,"px"]})]}),de(vs,{min:-2,max:20,step:1,value:E,onChange:(e,t)=>P(t)})]})]})]}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"PREVIEW BACKGROUND"}),de(B,{direction:"row",spacing:1,children:_x.map(e=>de(eb,{label:e.label,selected:l===e.value,onClick:()=>s(e.value)},e.value))}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginTop:6},children:"Showcase-only — doesn't affect the emitted code."})]})]})}),de(ci,{value:1,children:ce(B,{spacing:2,sx:{p:3,maxWidth:560},children:[ce(bn,{style:{color:"var(--Text-Quiet)"},children:["BevelText uses the same Highlight / Lowlight token pair as button bevels, which target the WCAG 2.1 large-text minimum (3:1). Bevel text is decorative display — the SVG sets"," ",de("code",{children:'role="img"'})," and ",de("code",{children:"aria-label"})," to the rendered string so screen readers announce it as a labeled image, not a stream of glyphs."]}),de(ln,{color:"quiet",children:"Keep the rendered glyph height above ~24px when the bevel is on — at smaller sizes the highlight / lowlight stripes optically reduce the legible stroke width and the 3:1 contrast no longer feels comfortable."})]})})]})})})]})]})}function nb({open:e,onClose:t,items:n=[],onItemClick:o,width:i=280,variant:a="temporary",header:l,footer:s,sx:d={},...c}){const[u,p]=r(null),[f,g]=r({}),x=(e,r)=>{p(r),o?.(e),"temporary"===a&&t?.()},b="permanent"===a?"permanent":"standard"===a?"standard":"temporary",v=ce(h,{sx:{display:"flex",flexDirection:"column",height:"100%",backgroundColor:"var(--Container)",color:"var(--Text)"},children:[l&&de(h,{sx:{p:2,borderBottom:"1px solid var(--Border-Variant)"},children:"string"==typeof l?de(T,{variant:"h6",sx:{fontWeight:700},children:l}):l}),de(_,{sx:{flex:1,overflow:"auto",py:1},children:n.map((e,t)=>{const r=u===t,n=e.submenu&&e.submenu.length>0,o=f[t];return ce(h,{children:[de(w,{title:e.tooltip||"",placement:"right",children:de(ee,{disablePadding:!0,children:ce(te,{onClick:()=>{n?(e=>{g(t=>({...t,[e]:!t[e]}))})(t):x(e,t)},selected:r&&!n,sx:{backgroundColor:r&&!n?"var(--Buttons-Primary-Button)":"transparent",color:r&&!n?"var(--Buttons-Primary-Text)":"var(--Text)","&:hover":{backgroundColor:r&&!n?"var(--Buttons-Primary-Button)":"var(--Container-High)"},"&.Mui-selected":{backgroundColor:"var(--Buttons-Primary-Button)",color:"var(--Buttons-Primary-Text)","&:hover":{backgroundColor:"var(--Buttons-Primary-Button)"}},transition:"all 0.2s ease-in-out"},children:[e.icon&&de(re,{sx:{color:r&&!n?"var(--Buttons-Primary-Text)":"var(--Icons-Primary)",minWidth:40},children:e.badge?de(m,{badgeContent:e.badge,color:"error",children:e.icon}):e.icon}),de(ne,{primary:e.label,primaryTypographyProps:{variant:"body2",fontWeight:r&&!n?600:500}}),n&&de(h,{sx:{ml:1},children:de(o?Gt:Se,{})})]})})}),n&&de(oe,{in:o,timeout:"auto",unmountOnExit:!0,children:de(_,{component:"div",disablePadding:!0,children:e.submenu.map((e,t)=>de(ee,{disablePadding:!0,children:ce(te,{onClick:()=>x(e,t),sx:{pl:4,backgroundColor:"transparent",color:"var(--Text)","&:hover":{backgroundColor:"var(--Container-High)"},"&.Mui-selected":{backgroundColor:"var(--Buttons-Primary-Button)",color:"var(--Buttons-Primary-Text)"}},children:[e.icon&&de(re,{sx:{color:"var(--Icons-Primary)",minWidth:40},children:e.icon}),de(ne,{primary:e.label})]})},t))})}),e.divider&&de(ie,{sx:{my:1,borderColor:"var(--Border-Variant)"}})]},t)})}),s&&de(h,{sx:{borderTop:"1px solid var(--Border-Variant)",p:2},children:"string"==typeof s?de(T,{variant:"caption",sx:{color:"var(--Text-Quiet)"},children:s}):s})]});return"permanent"===a?de(h,{sx:{width:i,flexShrink:0,...d},children:v}):de(ae,{variant:b,open:e,onClose:t,PaperProps:{sx:{width:i,backgroundColor:"var(--Container)",color:"var(--Text)",...d}},...c,children:v})}function ob({layout:e="side",navItems:t=[{label:"Home",icon:de(Be,{}),path:"/"},{label:"About",icon:de(Pe,{}),path:"/about"},{label:"Settings",icon:de(Ce,{}),path:"/settings"},{label:"Help",icon:de(gr,{}),path:"/help"}],title:n="My App",children:o,onLayoutChange:i,onNavigate:a,sx:l={},...s}){const d=le(),c=se(d.breakpoints.down("md"));se(d.breakpoints.down("lg"));const[u,p]=r(!1),[m,f]=r(!1),g=c?"top":e,x=({compact:e=!1})=>de(_,{sx:{py:1},children:t.map((t,r)=>de(w,{title:e?t.label:"",placement:"right",children:ce(te,{onClick:()=>{a?.(t),p(!1)},sx:{color:"var(--Text)","&:hover":{backgroundColor:"var(--Container-High)"},transition:"all 0.2s ease-in-out",justifyContent:e?"center":"flex-start",px:e?1:2},children:[de(re,{sx:{color:"var(--Icons-Primary)",minWidth:e?"auto":40,mr:e?0:1},children:t.icon}),!e&&de(ne,{primary:t.label})]})},r))});return ce(h,{sx:{minHeight:"100vh",backgroundColor:"var(--Background)",color:"var(--Text)",display:"flex",flexDirection:"column",...l},...s,children:[de(J,{position:"static",sx:{backgroundColor:"var(--Header)",color:"var(--Text)",boxShadow:"0 1px 3px rgba(0,0,0,0.12)",borderBottom:"1px solid var(--Border-Variant)"},children:ce(Z,{children:[c&&"rail"!==g&&de(C,{edge:"start",color:"inherit",onClick:()=>p(!u),sx:{mr:2},children:de(u?Lt:Pt,{})}),de(T,{variant:"h6",sx:{flex:1,fontWeight:700},children:n}),!c&&i&&ce(E,{value:e,exclusive:!0,onChange:(e,t)=>{t&&i(t)},size:"small",sx:{"& .MuiToggleButton-root":{color:"var(--Text)",border:"1px solid var(--Border)","&.Mui-selected":{backgroundColor:"var(--Button-Primary-Button)",color:"#fff",borderColor:"var(--Button-Primary-Button)"}}},children:[de(R,{value:"side","aria-label":"side nav",children:"☰ Side"}),de(R,{value:"rail","aria-label":"rail nav",children:"⫷ Rail"}),de(R,{value:"side-rail","aria-label":"side-rail nav",children:"☰⫷ Both"})]})]})}),ce(h,{sx:{display:"flex",flex:1},children:[("rail"===g||"side-rail"===g)&&!c&&de(h,{sx:{width:80,backgroundColor:"var(--Container)",borderRight:"1px solid var(--Border-Variant)",display:"flex",flexDirection:"column",py:2},children:de(x,{compact:!0})}),("side"===g||"side-rail"===g)&&!c&&ce(h,{sx:{width:m?80:280,backgroundColor:"var(--Container)",borderRight:"1px solid var(--Border-Variant)",transition:"width 0.3s ease-in-out",display:"flex",flexDirection:"column"},children:[ce(h,{sx:{p:2,display:"flex",alignItems:"center",justifyContent:"space-between",borderBottom:"1px solid var(--Border-Variant)",minHeight:64},children:[!m&&de(T,{variant:"h6",sx:{fontWeight:700,color:"var(--Text)"},children:"Menu"}),de(C,{size:"small",onClick:()=>f(!m),sx:{color:"var(--Icons-Primary)"},children:m?"›":"‹"})]}),de(x,{compact:m})]}),c&&ce(ae,{anchor:"left",open:u,onClose:()=>p(!1),sx:{"& .MuiDrawer-paper":{backgroundColor:"var(--Container)",width:280}},children:[de(h,{sx:{p:2,borderBottom:"1px solid var(--Border-Variant)"},children:de(T,{variant:"h6",sx:{fontWeight:700},children:"Menu"})}),de(x,{compact:!1})]}),de(h,{sx:{flex:1,overflow:"auto",backgroundColor:"var(--Background)"},children:de(F,{maxWidth:"lg",sx:{py:4},children:o})})]})]})}const ib={small:{summaryPadding:"var(--Sizing-Half) var(--Sizing-Half) var(--Sizing-Half) var(--Sizing-1-and-Half)",gap:"var(--Sizing-Half)",detailsPy:"var(--Sizing-1-and-Half)",detailsPx:"var(--Sizing-1-and-Half)",iconSize:"small"},medium:{summaryPadding:"var(--Sizing-1) var(--Sizing-1) var(--Sizing-1) var(--Sizing-2)",gap:"var(--Sizing-1)",detailsPy:"var(--Sizing-2)",detailsPx:"var(--Sizing-2)",iconSize:"medium"},large:{summaryPadding:"var(--Sizing-1-and-Half) var(--Sizing-1-and-Half) var(--Sizing-1-and-Half) var(--Sizing-2-and-Half)",gap:"var(--Sizing-1-and-Half)",detailsPy:"var(--Sizing-2-and-Half)",detailsPx:"var(--Sizing-2-and-Half)",iconSize:"large"}},ab=s({variant:"solid",color:"default",size:"medium",spacing:0}),lb=s({expanded:!1,toggle:()=>{},disabled:!1,accordionId:""}),sb="var(--Accordion-Radius, var(--Button-Radius))";function db({children:e,variant:t="solid",surface:r,color:n="default",size:o="medium",spacing:i=0,className:a="",sx:l={},...s}){const d="default"===n?"Default":(c=n).charAt(0).toUpperCase()+c.slice(1);var c;const u=0===i,p="default"===n?"Default":d,m=r||("dark"===t?"Surface-Dimmest":"light"===t?"Surface-Brightest":"Surface");return de(ab.Provider,u?{value:{variant:t,color:n,size:o,spacing:i,dataTheme:p,dataSurface:m},children:de(h,{role:"presentation",className:"accordion-group accordion-group-connected accordion-group-"+t+" "+a,sx:{display:"flex",flexDirection:"column","& > .accordion-segment":{borderRadius:0,marginBottom:"-1px",boxShadow:"none"},"& > .accordion-segment:first-of-type":{borderTopLeftRadius:sb,borderTopRightRadius:sb},"& > .accordion-segment:last-of-type":{borderBottomLeftRadius:sb,borderBottomRightRadius:sb,marginBottom:0},...l},...s,children:e})}:{value:{variant:t,color:n,size:o,spacing:i,dataTheme:p,dataSurface:m},children:de(h,{role:"presentation",className:"accordion-group accordion-group-"+t+" accordion-group-spaced "+a,sx:{display:"flex",flexDirection:"column",gap:.5===i?"var(--Sizing-Half)":1===i?"var(--Sizing-1)":1.5===i?"var(--Sizing-1-and-Half)":2===i?"var(--Sizing-2)":8*i+"px",...l},...s,children:e})})}function cb({children:e,expanded:t,defaultExpanded:n=!1,onChange:o,disabled:i=!1,className:a="",sx:s={},...d}){const[c,u]=r(n),p=void 0!==t,m=p?t:c,{dataTheme:f,dataSurface:g}=l(ab),[x]=r(()=>"accordion-"+Math.random().toString(36).substring(2,9));return de(lb.Provider,{value:{expanded:m,toggle:()=>{if(i)return;const e=!m;p||u(e),o?.(e)},disabled:i,accordionId:x},children:de(h,{className:"accordion-segment accordion"+(m?" accordion-expanded":"")+(i?" accordion-disabled":"")+" "+a,"data-theme":f,"data-surface":g,sx:{border:"1px solid var(--Border-Variant)",borderRadius:sb,backgroundColor:"var(--Background)",overflow:"hidden",boxShadow:oo,opacity:i?.5:1,...s},...d,children:e})})}const ub={small:ln,medium:cn,large:fn},pb={small:ln,medium:cn,large:fn};function hb({children:e,startDecorator:t,endDecorator:r,eyebrow:n,overline:o,secondary:i,expandIcon:a,className:s="",sx:d={},...c}){const{expanded:u,toggle:p,disabled:m,accordionId:f}=l(lb),{size:g}=l(ab),x=ib[g]||ib.medium,b=ub[g]||ub.medium,v=a||de(Qn,{size:x.iconSize,sx:{color:u?"var(--Text)":"var(--Quiet)",transition:"color 0.15s ease"},children:de(Se,{})}),y={overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",display:"block"};return ce(h,{component:"button",role:"button","aria-expanded":u,"aria-controls":f+"-content",id:f+"-header",tabIndex:m?-1:0,onClick:p,onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),p())},className:"accordion-summary"+(u?" accordion-summary-expanded":"")+" "+s,sx:{display:"flex",flexDirection:"row",alignItems:"flex-start",justifyContent:"flex-start",width:"100%",gap:x.gap,padding:x.summaryPadding,border:"none",backgroundColor:"transparent",color:u?"var(--Text)":"var(--Quiet)",fontFamily:"inherit",cursor:m?"not-allowed":"pointer",textAlign:"left",transition:"color 0.2s ease, background-color 0.15s ease",borderRadius:0,"&:hover":m?{}:{color:"var(--Text)","& .omni-icon":{color:"var(--Text)"}},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"-3px"},...d},...c,children:[t&&de(h,{className:"accordion-summary-start",sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",flexShrink:0},children:t}),ce(h,{sx:{flex:1,minWidth:0,display:"flex",flexDirection:"column",gap:"var(--Sizing-Half)"},children:[(n??o)&&de(Tn,{style:{...y,color:"var(--Text-Quiet)"},children:n??o}),null!=e&&de(b,{style:{...y,color:"inherit",fontWeight:600},children:e}),i&&de(ln,{style:{...y,color:"var(--Text-Quiet)"},children:i})]}),r&&de(h,{className:"accordion-summary-end",sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",flexShrink:0},children:r}),de(h,{sx:{display:"flex",alignItems:"center",justifyContent:"center",transform:u?"rotate(180deg)":"rotate(0deg)",transition:"transform 0.25s ease",flexShrink:0},children:v})]})}function mb({children:e,className:t="",sx:r={},...n}){const{expanded:o,accordionId:i}=l(lb),{size:a}=l(ab),s=ib[a]||ib.medium,d=pb[a]||pb.medium;return o?de(h,{role:"region",id:i+"-content","aria-labelledby":i+"-header",className:"accordion-details "+t,sx:{padding:"0 "+s.detailsPx+" "+s.detailsPy+" "+s.detailsPx,color:"var(--Text)",fontFamily:"inherit",lineHeight:1.6,...r},...n,children:"string"==typeof e||"number"==typeof e?de(d,{children:e}):e}):null}const fb={1:{padLeft:0,togglePadLeft:0},2:{padLeft:24,togglePadLeft:4},3:{padLeft:48,togglePadLeft:0},4:{padLeft:72,togglePadLeft:0},5:{padLeft:88,togglePadLeft:4}},gb={0:{padLeft:8},1:{padLeft:48},2:{padLeft:56,slotPadLeft:4},3:{padLeft:64,slotPadLeft:4},4:{padLeft:88,slotPadLeft:4},5:{padLeft:112},6:{padLeft:128}};function xb({label:e,icon:t,level:r=0,toggle:n="none",onToggle:o,disabled:i=!1,size:a="small",className:l="",sx:s={},children:d,...c}){const u=6===r&&"none"!==n?"none":n,p="on"===u,m="none"!==u,f=m?fb[r]||{padLeft:0,togglePadLeft:0}:gb[r]||gb[0],g={paddingTop:"8px",paddingRight:"8px",paddingBottom:"8px",paddingLeft:(f.padLeft??8)+"px"};return ce(h,{className:"tree-branch tree-branch-"+a+" tree-branch-level-"+r+" tree-branch-toggle-"+u+(i?" tree-branch-disabled":"")+(l?" "+l:""),sx:{width:"100%",...s},...c,children:[ce(h,{component:"button",type:"button",role:"treeitem","aria-expanded":m?p:void 0,"aria-disabled":i||void 0,tabIndex:i?-1:0,onClick:e=>{i||m&&(e.stopPropagation(),o?.(p?"off":"on"))},disabled:i,sx:{display:"flex",flexDirection:"row",alignItems:"center",gap:"4px",width:"100%",minHeight:"24px",...g,border:"none",backgroundColor:"transparent",fontFamily:"inherit",color:"inherit",textAlign:"left",cursor:i?"not-allowed":"pointer",opacity:i?.5:1,outline:"none",transition:"background-color 0.15s ease, color 0.15s ease","&:hover":i?{}:{backgroundColor:"var(--Hover)"},"&:active":i?{}:{backgroundColor:"var(--Pressed)"},"&:focus-visible":{outline:"3px solid var(--Focus-Visible)",outlineOffset:"-2px"}},children:[m&&de(h,{className:"tree-branch-toggle",sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",flexShrink:0,paddingLeft:(f.togglePadLeft??0)+"px"},children:de(h,{sx:{display:"inline-flex",alignItems:"center",justifyContent:"center",transition:"transform 0.2s ease",transform:p?"rotate(-90deg)":"rotate(0deg)"},children:de(Qn,{size:"small",children:de($t,{})})})}),ce(h,{className:"tree-branch-slot",sx:{display:"flex",flexDirection:"row",alignItems:"center",gap:"4px",flex:1,minWidth:0,...void 0!==f.slotPadLeft&&{paddingLeft:f.slotPadLeft+"px"}},children:[t&&de(h,{sx:{display:"inline-flex",alignItems:"center",flexShrink:0},children:de(Qn,{size:"small",children:t})}),null!=e&&de(sn,{style:{color:"inherit",overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",display:"block",flex:1,minWidth:0},children:e})]})]}),p&&d&&de(h,{role:"group",sx:{display:"flex",flexDirection:"column"},children:d})]})}const bb=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"",vb=[{label:"Default",colors:["default"]},{label:"Theme",colors:["primary","secondary","tertiary","neutral"]},{label:"State",colors:["info","success","warning","error"]}],yb=e=>de(h,{sx:{width:8,height:8,borderRadius:"50%",backgroundColor:e,flexShrink:0}}),Sb=[{id:"1",label:"Documents",icon:de(cr,{}),badge:yb("var(--Warning-Text, orange)"),children:[{id:"1-1",label:"Company",icon:de(xr,{}),badge:yb("var(--Warning-Text, orange)"),children:[{id:"1-1-1",label:"Invoice",icon:de(vr,{})},{id:"1-1-2",label:"Meeting notes",icon:de(br,{})},{id:"1-1-3",label:"Tasks list",icon:de(br,{})},{id:"1-1-4",label:"Equipment",icon:de(vr,{})},{id:"1-1-5",label:"Video conference",icon:de(yr,{})}]},{id:"1-2",label:"Personal",icon:de(cr,{})},{id:"1-3",label:"Group photo",icon:de(Ut,{})}]},{id:"2",label:"Bookmarked",icon:de(_t,{}),children:[{id:"2-1",label:"Favourites",icon:de(br,{})}]},{id:"3",label:"History",icon:de(cr,{})},{id:"4",label:"Trash",icon:de(we,{}),disabled:!0}],kb=JSON.stringify(Lf,null,2);function Bb({ratio:e,threshold:t}){if(!e)return de(bn,{style:{color:"var(--Text-Quiet)"},children:"--"});const r=parseFloat(e)>=t;return ce(h,{sx:{display:"inline-flex",alignItems:"center",gap:.5},children:[ce(h,{sx:{px:1,py:.25,borderRadius:"4px",fontSize:"11px",fontWeight:700,backgroundColor:r?"var(--Tags-Success-BG)":"var(--Tags-Error-BG)",color:r?"var(--Tags-Success-Text)":"var(--Tags-Error-Text)"},children:[e,":1"]}),de(bn,{style:{color:r?"var(--Tags-Success-Text)":"var(--Tags-Error-Text)"},children:r?"Pass":"Fail"})]})}function wb({label:e,ratio:t,threshold:r,note:n}){return ce(h,{sx:{display:"flex",justifyContent:"space-between",alignItems:"flex-start",py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(h,{sx:{flex:1},children:[de(ln,{style:{color:"var(--Text)"},children:e}),n&&de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:n})]}),de(Bb,{ratio:t,threshold:r})]})}function Cb({label:e,selected:t,onClick:r}){return de(Io,{selected:t,variant:t?"default":"default-outline",size:"small",onClick:r,children:e})}function Tb({color:e,selected:t,onClick:r}){const n=bb(e);return de(h,{component:"button",onClick:()=>r(e),"aria-label":"Select "+n,"aria-pressed":t,title:n,sx:{width:"var(--Button-Height)",height:"var(--Button-Height)",borderRadius:"4px",backgroundColor:"var(--Buttons-"+n+"-Button)",border:t?"2px solid var(--Text)":"1px solid var(--Border)",outline:t?"2px solid var(--Focus-Visible)":"2px solid transparent",outlineOffset:"1px",cursor:"pointer",flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.1s ease","&:hover":{transform:"scale(1.1)"}},children:t&&de(he,{sx:{fontSize:16,color:"var(--Buttons-"+n+"-Text)",pointerEvents:"none"}})})}function Ib({value:e,onChange:t}){const[n,o]=r(e),[i,a]=r(null);return ce(h,{children:[ce(h,{sx:{display:"flex",justifyContent:"space-between",alignItems:"center",mb:1},children:[de(Tn,{style:{color:"var(--Text-Quiet)"},children:"TREE DATA (JSON)"}),de(Io,{variant:"ghost",size:"small",onClick:()=>{o(kb),a(null),t(Lf)},children:"Reset"})]}),de(h,{component:"textarea",value:n,onChange:e=>{o(e.target.value);try{const r=JSON.parse(e.target.value);a(null),t(r)}catch(e){a(e.message)}},spellCheck:!1,rows:10,sx:{width:"100%",fontFamily:"monospace",fontSize:"11px",backgroundColor:"#1e1e1e",color:i?"#f87171":"#e5e7eb",border:"1px solid "+(i?"#f87171":"#333"),borderRadius:"6px",padding:"10px",resize:"vertical",outline:"none",boxSizing:"border-box",lineHeight:1.5,"&:focus":{borderColor:"var(--Focus-Visible)"}}}),i&&ce(bn,{style:{color:"#f87171",display:"block",marginTop:4},children:["JSON error: ",i]})]})}function Ab(){const[e,t]=r("solid"),[n,l]=r("primary"),[s,d]=r("default"),[c,u]=r("slide"),[p,m]=r("single"),[f,g]=r(!1),[x,b]=r(!1),[v,y]=r(!1),[S,k]=r(Lf),[w,C]=r(null),[T,A]=r("Surface"),[z,R]=r({}),E=o(null),P=bb(n),L=v?Sb:S,M=i((e,t)=>e&&getComputedStyle(e).getPropertyValue(t).trim()||null,[]);a(()=>{const e=setTimeout(()=>{const e=E.current;R({text:M(e,"--Text"),textQuiet:M(e,"--Text-Quiet"),background:M(e,"--Background"),border:M(e,"--Border"),focusVisible:M(e,"--Focus-Visible"),activeBtn:M(e,"--Buttons-"+P+"-Button"),activeBorder:M(e,"--Buttons-"+P+"-Border")})},50);return()=>clearTimeout(e)},[n,w,M,P]);return ce(h,{sx:{pb:8},children:[de(qr,{children:"Tree View"}),ce(I,{container:!0,sx:{mt:2,alignItems:"flex-start",flexWrap:"wrap"},children:[ce(I,{item:!0,sx:{width:{xs:"100%",md:"55%"},flexShrink:0,pr:{md:3}},children:[de(ui,{ref:E,theme:w,children:de(h,{sx:{width:"100%",maxWidth:360},children:de(Pf,{color:n,variant:e,density:s,animation:c,selectionMode:p,checkboxSelection:f,disableSelection:x,items:L,defaultExpandedItems:["1","1-1","2"]})})}),de(ji,{code:(()=>{const t=["<OmniTreeView"];return"default"!==n&&t.push(' color="'+n+'"'),"default"!==e&&t.push(' variant="'+e+'"'),"default"!==s&&t.push(' density="'+s+'"'),"slide"!==c&&t.push(' animation="'+c+'"'),"single"!==p&&t.push(' selectionMode="'+p+'"'),f&&t.push(" checkboxSelection"),x&&t.push(" disableSelection"),t.push(" items={treeData}"),t.push("/>"),t.join("\n")})(),language:"JSX",wrap:!0,sx:{mt:2}})]}),de(I,{item:!0,sx:{width:{xs:"100%",md:"45%"},flexShrink:0,alignSelf:"flex-start",minWidth:0,overflow:"hidden"},children:de(h,{sx:{backgroundColor:"var(--Background)",overflow:"hidden"},children:ce(li,{defaultValue:0,variant:"standard",color:"primary",children:[ce(si,{children:[de(di,{children:"Playground"}),de(di,{children:"Accessibility"})]}),de(ci,{value:0,children:ce(h,{sx:{p:3},children:[de(h,{sx:{mb:3},children:de(fi,{theme:w,onThemeChange:C,surface:T,onSurfaceChange:A})}),ce(h,{children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"STYLE"}),ce(B,{direction:"row",spacing:1,children:[de(Cb,{label:"Solid",selected:"solid"===e,onClick:()=>t("solid")}),de(Cb,{label:"Light",selected:"light"===e,onClick:()=>t("light")})]})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"COLOR"}),de(B,{spacing:1.5,children:vb.map(e=>ce(h,{children:[de(bn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:4,fontWeight:600},children:e.label}),de(B,{direction:"row",flexWrap:"wrap",sx:{gap:1},children:e.colors.map(e=>de(Tb,{color:e,selected:n===e,onClick:l},e))})]},e.label))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"DENSITY"}),ce(B,{direction:"row",spacing:1,children:[de(Cb,{label:"Compact",selected:"compact"===s,onClick:()=>d("compact")}),de(Cb,{label:"Default",selected:"default"===s,onClick:()=>d("default")})]})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"ANIMATION"}),de(B,{direction:"row",spacing:1,children:["none","slide","spring"].map(e=>de(Cb,{label:bb(e),selected:c===e,onClick:()=>u(e)},e))})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"SELECTION MODE"}),ce(B,{direction:"row",spacing:1,children:[de(Cb,{label:"Single",selected:"single"===p,onClick:()=>m("single")}),de(Cb,{label:"Multi",selected:"multi"===p,onClick:()=>m("multi")})]})]}),ce(h,{sx:{mt:3},children:[de(Tn,{style:{color:"var(--Text-Quiet)",display:"block",marginBottom:8},children:"OPTIONS"}),ce(h,{sx:{display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Show Icons"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Load sample data with icons and badges"})]}),de(na,{checked:v,onChange:e=>y(e.target.checked),size:"small","aria-label":"Show icons"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Checkbox Selection"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Show checkboxes for each item"})]}),de(na,{checked:f,onChange:e=>g(e.target.checked),size:"small","aria-label":"Checkbox selection"})]}),ce(h,{sx:{mt:2,display:"flex",justifyContent:"space-between",alignItems:"center"},children:[ce(h,{children:[de(kn,{children:"Disable Selection"}),de(bn,{style:{color:"var(--Text-Quiet)",display:"block"},children:"Items are not selectable"})]}),de(na,{checked:x,onChange:e=>b(e.target.checked),size:"small","aria-label":"Disable selection"})]})]}),!v&&de(h,{sx:{mt:3},children:de(Ib,{value:kb,onChange:k})})]})}),de(ci,{value:1,children:de(h,{sx:{p:3},children:ce(B,{spacing:3,children:[ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"Text Contrast (WCAG 1.4.3 — 4.5:1)"}),de(wb,{label:"Resting: var(--Text-Quiet) vs. background",ratio:$i(z.textQuiet,z.background),threshold:4.5,note:"Unselected items use Text-Quiet"}),de(wb,{label:"Hover: var(--Text) vs. background",ratio:$i(z.text,z.background),threshold:4.5,note:"Hovered items use var(--Text)"}),de(wb,{label:"Active (solid): var(--Text) vs. var(--Buttons-"+P+"-Button)",ratio:$i(z.text,z.activeBtn),threshold:4.5,note:"Selected item with solid fill"})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"Focus Indicator (WCAG 2.4.11 — 3:1)"}),de(wb,{label:"var(--Focus-Visible) vs. background",ratio:$i(z.focusVisible,z.background),threshold:3,note:"outline: 2px solid var(--Focus-Visible); outline-offset: -2px"})]}),ce(h,{sx:{p:3,backgroundColor:"var(--Background)",borderRadius:"var(--Style-Border-Radius)",border:"1px solid var(--Border)"},children:[de(Jr,{children:"ARIA and Semantics"}),de(B,{spacing:0,children:[{label:"Role",value:'role="tree" on root, role="treeitem" on each node'},{label:"Expansion",value:'aria-expanded="true/false" on parent items'},{label:"Selection",value:"aria-selected on selected items"},{label:"Disabled",value:'aria-disabled="true" on disabled items'},{label:"Icons",value:"Icon elements are aria-hidden — label carries the accessible name"},{label:"Keyboard",value:"Arrow keys navigate, Enter/Space selects, * expands all siblings"}].map(({label:e,value:t})=>ce(h,{sx:{py:1.5,borderBottom:"1px solid var(--Border)"},children:[ce(ln,{children:[e,":"]}),de(bn,{style:{color:"var(--Text-Quiet)",fontFamily:"monospace"},children:t})]},e))})]})]})})})]})})})]})]})}function zb(e,t){if(document.getElementById(t))return;const r=document.createElement("link");r.rel="stylesheet",r.href=e,r.id=t,document.head.appendChild(r)}const Rb=[{value:"desktop",label:"Desktop",note:"32px touch targets (WCAG)"},{value:"ios-mobile",label:"iOS Mobile",note:"44px touch targets (HIG)"},{value:"ios-tablet",label:"iOS Tablet",note:"44px touch targets (HIG)"},{value:"android",label:"Android",note:"48px touch targets (M3)"}],Eb={desktop:"32px","ios-mobile":"44px","ios-tablet":"44px",android:"48px"};function Pb(){const{mode:e,switchMode:t}=function(e="light"){const[t,n]=r(e);return a(()=>{zb("/styles/foundation.css","css-foundation"),zb("/styles/core.css","css-core"),zb("/styles/Light-Mode.css","css-mode"),zb("/styles/base.css","css-base"),zb("/styles/typography-tokens.css","css-typography-tokens")},[]),{mode:t,switchMode:e=>{const t=document.getElementById("css-mode");t&&(t.href="dark"===e?"/styles/Dark-Mode.css":"/styles/Light-Mode.css"),n(e),localStorage.setItem("themeMode",e)}}}("light"),[n,o]=r(!1),[i,l]=r("desktop");a(()=>{const e=localStorage.getItem("dino-platform")||"desktop",r=localStorage.getItem("themeMode")||"light";l(e),document.documentElement.style.setProperty("--Button-Height",Eb[e]||"32px"),"dark"===r&&t("dark")},[]);const s=e=>{l(e),localStorage.setItem("dino-platform",e),document.documentElement.style.setProperty("--Button-Height",Eb[e]||"32px")};return ce(ue,{children:[de(h,{onClick:()=>o(!0),role:"button","aria-label":"Open settings",sx:{position:"fixed",bottom:24,right:24,width:52,height:52,borderRadius:"50%",backgroundColor:"var(--Buttons-Tertiary-Button)",color:"var(--Buttons-Tertiary-Text)",display:"flex",alignItems:"center",justifyContent:"center",cursor:"pointer",boxShadow:"0 4px 12px rgba(0,0,0,0.15)",zIndex:999,transition:"transform 0.15s ease, box-shadow 0.15s ease","&:hover":{transform:"scale(1.08)",boxShadow:"0 6px 16px rgba(0,0,0,0.2)"}},children:de(Rt,{sx:{fontSize:24}})}),de(wu,{anchor:"right",open:n,onClose:()=>o(!1),hideBackdrop:!0,size:"small",sx:{width:320,zIndex:99999999},children:ce(h,{sx:{p:3,height:"100%",display:"flex",flexDirection:"column"},children:[ce(h,{sx:{display:"flex",justifyContent:"space-between",alignItems:"center",mb:2},children:[de(Jr,{children:"Settings"}),de(Io,{iconOnly:!0,variant:"ghost",size:"small",onClick:()=>o(!1),"aria-label":"Close settings",children:de(Et,{fontSize:"small"})})]}),de(ie,{sx:{mb:3,borderColor:"var(--Border)"}}),de(h,{sx:{flex:1,overflowY:"auto"},children:ce(B,{spacing:4,children:[ce(h,{children:[de(Tn,{style:{color:"var(--Text)",opacity:.85,display:"block",marginBottom:12,fontWeight:600},children:"MODE"}),ce(B,{direction:"row",spacing:1,children:[de(Io,{variant:"light"===e?"primary":"primary-outline",size:"small",onClick:()=>t("light"),sx:{flex:1},children:"Light"}),de(Io,{variant:"dark"===e?"primary":"primary-outline",size:"small",onClick:()=>t("dark"),sx:{flex:1},children:"Dark"})]})]}),ce(h,{children:[de(Tn,{style:{color:"var(--Text)",opacity:.85,display:"block",marginBottom:12,fontWeight:600},children:"PLATFORM"}),de(B,{spacing:1,children:Rb.map(({value:e,label:t,note:r})=>{const n=i===e;return ce(h,{onClick:()=>s(e),sx:{p:1.5,borderRadius:"var(--Style-Border-Radius)",cursor:"pointer",border:n?"2px solid var(--Buttons-Primary-Button)":"1px solid var(--Border)",backgroundColor:n?"var(--Background)":"transparent",display:"flex",justifyContent:"space-between",alignItems:"center",transition:"all 0.15s ease","&:hover":{backgroundColor:"var(--Hover)"}},children:[ce(h,{children:[de(ln,{style:{color:n?"var(--Buttons-Primary-Button)":"var(--Text)",fontWeight:n?600:400},children:t}),de(bn,{style:{color:"var(--Text)",opacity:.7},children:r})]}),n&&de(h,{sx:{width:8,height:8,borderRadius:"50%",backgroundColor:"var(--Buttons-Primary-Button)",flexShrink:0}})]},e)})})]})]})}),de(ie,{sx:{my:3,borderColor:"var(--Border)"}}),de(Io,{variant:"primary-outline",size:"small",onClick:()=>{s("desktop"),t("light")},sx:{width:"100%"},children:"Reset to Defaults"})]})})]})}const Lb=e=>(e||[]).map(e=>{const t="number"==typeof e?e:Number(e?.value);return Number.isFinite(t)?t:0}),Mb=e=>(e||[]).map((e,t)=>"number"==typeof e?String(t+1):e?.label??String(t+1));function Wb(e,{fromZero:t=!0}={}){if(!e.length)return{min:0,max:1};let r=Math.min(...e),n=Math.max(...e);return t&&(r=Math.min(0,r)),n===r&&(n=r+1),{min:r,max:n}}const Ob=(e,{min:t,max:r},n,o)=>n+o-(e-t)/(r-t)*o;function Db(e,t,r,{inset:n=0}={}){if(e<=0)return[];if(1===e)return[t+r/2];const o=(r-2*n)/(e-1);return Array.from({length:e},(e,r)=>t+n+r*o)}function Fb(e,t,r,{gapRatio:n=.4}={}){if(e<=0)return{centres:[],bandWidth:0};const o=r/e,i=o*(1-n);return{centres:Array.from({length:e},(e,r)=>t+o*r+o/2),bandWidth:i}}const Nb=e=>e.length?e.map((e,t)=>`${t?"L":"M"}${e.x} ${e.y}`).join(" "):"";function Hb(e,{tension:t=0}={}){if(e.length<2)return Nb(e);const r=(1-t)/6;let n=`M${e[0].x} ${e[0].y}`;for(let t=0;t<e.length-1;t++){const o=e[t-1]||e[t],i=e[t],a=e[t+1],l=e[t+2]||a,s={x:i.x+(a.x-o.x)*r,y:i.y+(a.y-o.y)*r},d={x:a.x-(l.x-i.x)*r,y:a.y-(l.y-i.y)*r};n+=` C${s.x} ${s.y} ${d.x} ${d.y} ${a.x} ${a.y}`}return n}const Vb=(e,t,r)=>e&&t.length?`${e} L${t[t.length-1].x} ${r} L${t[0].x} ${r} Z`:"";function Qb(e,t,r,n,o,i){const a=i-o;if(a>=2*Math.PI-1e-9){const i=o+Math.PI;return Qb(e,t,r,n,o,i)+" "+Qb(e,t,r,n,i,o+2*Math.PI)}const l=(r,n)=>({x:e+r*Math.sin(n),y:t-r*Math.cos(n)}),s=a>Math.PI?1:0,d=l(n,o),c=l(n,i);if(r<=0)return`M${e} ${t} L${d.x} ${d.y} A${n} ${n} 0 ${s} 1 ${c.x} ${c.y} Z`;const u=l(r,i),p=l(r,o);return`M${d.x} ${d.y} A${n} ${n} 0 ${s} 1 ${c.x} ${c.y} L${u.x} ${u.y} A${r} ${r} 0 ${s} 0 ${p.x} ${p.y} Z`}function jb(e,{startAngle:t=0}={}){const r=e.map(e=>e>0?e:0),n=r.reduce((e,t)=>e+t,0),o=e.filter(e=>e<=0).length;if(n<=0)return{slices:[],total:0,dropped:o};let i=t;return{slices:r.map(e=>{const t=e/n*Math.PI*2,r={start:i,end:i+t,value:e,fraction:e/n};return i+=t,r}),total:n,dropped:o}}function Gb({min:e,max:t},r=4){if(r<1)return[];const n=(t-e)/r,o=Math.pow(10,Math.floor(Math.log10(Math.abs(n)||1))),i=[1,2,2.5,5,10].map(e=>e*o).find(e=>e>=n)??10*o,a=[];for(let r=Math.ceil(e/i)*i;r<=t+1e-9;r+=i)a.push(Number(r.toFixed(10)));return a}var Ub=Object.freeze({__proto__:null,arcPath:Qb,areaPath:Vb,bands:Db,extent:Wb,linePath:Nb,scaleY:Ob,sliceAngles:jb,slots:Fb,smoothPath:Hb,ticks:Gb,toLabels:Mb,toNumbers:Lb});const Xb={fill:"var(--Icons-Primary)",track:"var(--Border-Variant)",line:"var(--Border-Variant)",quietLabel:"var(--Quiet)",label:"var(--Text)",gradient:"var(--Icons-Primary-Variant)"},$b=["Primary","Secondary","Tertiary","Neutral","Info","Success","Warning","Error"],Kb={fontFamily:"var(--Label-Small-Font-Family)",fontSize:"var(--Label-Small-Font-Size)",fontWeight:"var(--Label-Small-Font-Weight)",letterSpacing:"var(--Label-Small-Letter-Spacing)"},qb={position:"absolute",width:"1px",height:"1px",padding:0,margin:"-1px",overflow:"hidden",clip:"rect(0 0 0 0)",clipPath:"inset(50%)",whiteSpace:"nowrap",border:0};function Yb({caption:e,labels:t,values:r,valueHeader:n="Value"}){return ce(h,{component:"table",sx:qb,children:[de("caption",{children:e}),de("thead",{children:ce("tr",{children:[de("th",{scope:"col",children:"Category"}),de("th",{scope:"col",children:n})]})}),de("tbody",{children:r.map((e,r)=>ce("tr",{children:[de("th",{scope:"row",children:t[r]}),de("td",{children:e})]},r))})]})}const Jb="var(--Motion-Duration-Slow, 300ms) var(--Motion-Easing-Enter, cubic-bezier(0, 0, 0, 1))",Zb="var(--Motion-Duration-Fast, 150ms) var(--Motion-Easing-Standard, cubic-bezier(0.2, 0, 0, 1))";function _b(e){const[r,n]=t.useState(-1),o=t.useCallback(e=>({onMouseEnter:()=>n(e),onMouseLeave:()=>n(t=>t===e?-1:t),onFocus:()=>n(e),onBlur:()=>n(t=>t===e?-1:t)}),[]);return t.useEffect(()=>{n(t=>t>=e?-1:t)},[e]),{active:r,setActive:n,handlers:o}}function ev({count:e,width:t,centres:r,bandWidth:n,labels:o,values:i,handlers:a}){return e?de(h,{sx:{position:"absolute",inset:0,display:"block",pointerEvents:"none"},children:Array.from({length:e},(e,l)=>de(h,{component:"button",type:"button","aria-label":`${o[l]}: ${i[l]}`,...a(l),sx:{position:"absolute",top:0,height:"100%",left:(r[l]-n/2)/t*100+"%",width:n/t*100+"%",padding:0,margin:0,border:0,background:"transparent",cursor:"pointer",pointerEvents:"auto","&:focus-visible":{outline:"2px solid var(--Focus-Visible)",outlineOffset:"-2px",borderRadius:"4px"}}},l))}):null}function tv({x:e,y:t,text:r,width:n,tokens:o}){if(null==r)return null;const i=Math.max(28,8*String(r).length+14),a=Math.min(Math.max(e,i/2+2),n-i/2-2),l=t-26>=2?t-26:t+6;return ce("g",{pointerEvents:"none",children:[de("rect",{x:a-i/2,y:l,width:i,height:20,rx:6,fill:o.fill}),de("text",{x:a,y:l+14,textAnchor:"middle",fill:"var(--Icons-On-Primary)",style:{fontFamily:"var(--Label-Small-Font-Family)",fontSize:"var(--Label-Small-Font-Size)",fontWeight:"var(--Label-Small-Font-Weight)"},children:r})]})}function rv({data:e=[],showTrack:t=!0,rounded:n=!0,showValues:o=!1,showLabels:i=!0,animate:l=!0,interactive:s=!0,height:d=200,gapRatio:c=.4,label:u,className:p="",sx:m={},...f}){const g=Lb(e),x=Mb(e),{active:b,handlers:v}=_b(g.length),[y,S]=r(!l);a(()=>{if(!l)return;const e=requestAnimationFrame(()=>S(!0));return()=>cancelAnimationFrame(e)},[l]);const k=320,B=o?20:8,w=i?22:8,C=Math.max(0,d-B-w),T=Wb(g,{fromZero:!0}),{centres:I,bandWidth:A}=Fb(g.length,0,k,{gapRatio:c}),z=B+C,R=n?A/2:0,E=g.length?k/g.length:0;return ce(h,{component:"figure",className:"bar-chart "+p,sx:{display:"block",width:"100%",m:0,position:"relative",...m},...f,children:[ce("svg",{viewBox:`0 0 320 ${d}`,width:"100%",height:d,preserveAspectRatio:"none",focusable:"false","aria-hidden":"true",children:[s&&b>=0&&de("rect",{x:I[b]-E/2,y:0,width:E,height:d,fill:"var(--Hover)",rx:6}),g.map((e,r)=>{const n=I[r]-A/2,o=Ob(e,T,B,C),i=Math.max(0,z-o);return ce("g",{children:[t&&de("rect",{x:n,y:B,width:A,height:C,rx:R,ry:R,fill:Xb.track}),i>0&&de("rect",{x:n,y:o,width:A,height:i,rx:Math.min(R,i/2),ry:Math.min(R,i/2),fill:Xb.fill,style:{transformBox:"fill-box",transformOrigin:"bottom",transform:y?"scaleY(1)":"scaleY(0)",transition:`transform ${Jb}`}})]},r)}),o&&g.map((e,t)=>de("text",{x:I[t],y:Ob(e,T,B,C)-6,textAnchor:"middle",fill:Xb.label,...Kb,children:e},"v"+t)),i&&x.map((e,t)=>de("text",{x:I[t],y:d-6,textAnchor:"middle",fill:Xb.quietLabel,...Kb,children:e},"l"+t)),s&&b>=0&&!o&&de(tv,{x:I[b],y:Ob(g[b],T,B,C),text:g[b],width:k,tokens:Xb})]}),s&&de(ev,{count:g.length,width:k,centres:I,bandWidth:E,labels:x,values:g,handlers:v}),de(Yb,{caption:u||`Bar chart, ${g.length} values`,labels:x,values:g})]})}function nv({data:e=[],curve:t="smooth",gradient:o=!0,fromZero:i=!1,showGrid:l=!1,showLabels:s=!1,animate:d=!0,interactive:c=!0,height:u=200,strokeWidth:p=3,tension:m=0,label:f,className:g="",sx:x={},...b}){const v="lc-"+n().replace(/:/g,""),y=Lb(e),S=Mb(e),{active:k,handlers:B}=_b(y.length),[w,C]=r(!d);a(()=>{if(!d)return;const e=requestAnimationFrame(()=>C(!0));return()=>cancelAnimationFrame(e)},[d]);const T=320,I=s?22:8,A=Math.max(0,u-8-I),z=Wb(y,{fromZero:i}),R=Db(y.length,0,T,{inset:p}),E=y.map((e,t)=>({x:R[t],y:Ob(e,z,8,A)})),P="straight"===t?Nb(E):Hb(E,{tension:m}),L=8+A;return ce(h,{component:"figure",className:"line-chart "+g,sx:{display:"block",width:"100%",m:0,position:"relative",...x},...b,children:[ce("svg",{viewBox:`0 0 320 ${u}`,width:"100%",height:u,preserveAspectRatio:"none",focusable:"false","aria-hidden":"true",children:[o&&de("defs",{children:ce("linearGradient",{id:v,x1:"0",y1:"0",x2:"0",y2:"1",children:[de("stop",{offset:"0%",stopColor:Xb.gradient,stopOpacity:"1"}),de("stop",{offset:"100%",stopColor:Xb.gradient,stopOpacity:"0"})]})}),l&&Gb(z,4).map(e=>de("line",{x1:0,x2:T,y1:Ob(e,z,8,A),y2:Ob(e,z,8,A),stroke:Xb.line,strokeWidth:"1"},e)),o&&E.length>1&&de("path",{d:Vb(P,E,L),fill:`url(#${v})`,style:{opacity:w?1:0,transition:`opacity ${Jb}`}}),E.length>1&&de("path",{d:P,fill:"none",stroke:Xb.fill,strokeWidth:p,strokeLinecap:"round",strokeLinejoin:"round",pathLength:"1",style:{strokeDasharray:1,strokeDashoffset:w?0:1,transition:`stroke-dashoffset ${Jb}`}}),1===E.length&&de("circle",{cx:E[0].x,cy:E[0].y,r:p,fill:Xb.fill}),c&&k>=0&&ce(ue,{children:[de("line",{x1:R[k],x2:R[k],y1:8,y2:L,stroke:Xb.line,strokeWidth:"1"}),de("circle",{cx:E[k].x,cy:E[k].y,r:p+1,fill:Xb.fill,stroke:"var(--Background)",strokeWidth:"2"}),de(tv,{x:E[k].x,y:E[k].y,text:y[k],width:T,tokens:Xb})]}),s&&S.map((e,t)=>de("text",{x:R[t],y:u-6,textAnchor:"middle",fill:Xb.quietLabel,...Kb,children:e},t))]}),c&&de(ev,{count:y.length,width:T,centres:R,bandWidth:y.length?T/y.length:0,labels:S,values:y,handlers:B}),de(Yb,{caption:f||`Line chart, ${y.length} points`,labels:S,values:y})]})}function ov({data:e=[],donut:t=!1,donutRatio:n=.6,colors:o=$b,separatorWidth:i=2,size:l=200,showLabels:s=!1,animate:d=!0,interactive:c=!0,label:u,className:p="",sx:m={},...f}){const g=Lb(e),x=Mb(e),{slices:b,total:v,dropped:y}=jb(g),{active:S,handlers:k}=_b(g.length),[B,w]=r(!d);a(()=>{if(!d)return;const e=requestAnimationFrame(()=>w(!0));return()=>cancelAnimationFrame(e)},[d]);const C=l/2,T=l/2,I=l/2-1,A=t?I*n:0,z=e=>{return{fill:`var(--Icons-${t=o[e%o.length]})`,onFill:`var(--Icons-On-${t})`};var t};return ce(h,{component:"figure",className:"pie-chart "+p,sx:{display:"block",m:0,position:"relative",...m},...f,children:[ce("svg",{viewBox:`0 0 ${l} ${l}`,width:l,height:l,focusable:"false","aria-hidden":"true",children:[b.map((e,t)=>{const r=(e.start+e.end)/2,n=c&&S===t?4:0;return de("path",{d:Qb(C,T,A,I,e.start,e.end),fill:z(t).fill,stroke:"var(--Background)",strokeWidth:i,strokeLinejoin:"round",...c?k(t):{},style:{transform:`translate(${n*Math.sin(r)}px, ${-n*Math.cos(r)}px) scale(${B?1:0})`,transformOrigin:`${C}px ${T}px`,transformBox:"view-box",transition:`transform ${B?Zb:Jb}`}},t)}),s&&b.map((e,t)=>{const r=(e.start+e.end)/2,n=A+.62*(I-A);return e.fraction<.07?null:de("text",{x:C+n*Math.sin(r),y:T-n*Math.cos(r),textAnchor:"middle",dominantBaseline:"middle",fill:z(t).onFill,...Kb,children:x[t]},t)})]}),de(Yb,{caption:(u||`${t?"Donut":"Pie"} chart, ${b.length} segments`)+(y?`, ${y} non-positive values omitted`:""),labels:x,values:g})]})}var iv={};export{cb as Accordion,mb as AccordionDetails,db as AccordionGroup,hb as AccordionSummary,jf as Alert,cu as AlertDialog,qf as AlertShowcase,nx as AppBar,px as AppBarShowcase,ns as Autocomplete,ds as AutocompleteShowcase,$n as Avatar,Kn as AvatarGroup,Ig as AvatarShowcase,_n as Badge,Mg as BadgeShowcase,rv as BarChart,Jx as BevelText,rb as BevelTextShowcase,Ml as BlackWhiteToggleButtonGroup,cn as Body,hn as Body1,mn as Body2,pn as BodyBold,fn as BodyLarge,xn as BodyLargeBold,gn as BodyLargeSemibold,un as BodySemibold,ln as BodySmall,dn as BodySmallBold,sn as BodySmallSemibold,Yd as BottomNavigation,lc as BottomNavigationShowcase,qs as Box,_s as BoxShowcase,wd as BreadcrumbItem,Bd as Breadcrumbs,Id as BreadcrumbsShowcase,Io as Button,va as ButtonGroup,Fn as ButtonSmall,Nn as ButtonText,jr as CAP_HEIGHT_TRIM,Kb as CHART_LABEL_TYPE,Xb as CHART_TOKENS,bn as Caption,vn as CaptionBold,Da as Card,Ca as CenteredStack,No as Checkbox,Ds as Chip,ag as CircularProgress,ug as CircularProgressShowcase,ji as CodeBlock,Yi as Colors,ed as Container,Qi as CopyButton,fx as Copyright,Mx as CopyrightShowcase,jx as CurvedText,qx as CurvedTextShowcase,jn as DEFAULT_AVATAR_SRC,Lf as DEFAULT_ITEMS,zl as DefaultToggleButtonGroup,tx as DesktopAppBar,du as Dialog,hu as DialogShowcase,Gr as DisplayLarge,Ur as DisplayMedium,Xr as DisplaySmall,Ng as Divider,wu as Drawer,Cu as DrawerClose,Iu as DrawerContent,Tu as DrawerHeader,Nf as DrawerShowcase,Vf as DropZone,Nd as Dropdown,ka as DynoStack,Pf as DynoTreeView,Hl as EmailTextField,Fl as ErrorToggleButtonGroup,In as Eyebrow,zn as EyebrowLarge,An as EyebrowMedium,Tn as EyebrowSmall,Xa as Fab,_a as FabShowcase,xx as Footer,Ex as FooterShowcase,uu as FormDialog,Ec as Gradient,td as Grid,Ra as GridStack,$r as H1,Kr as H2,qr as H3,Yr as H4,Jr as H5,Zr as H6,Ba as HStack,hx as Header,_r as Heading,Qn as Icon,xa as IconBadge,ja as IconBadgeShowcase,ma as IconShowcase,Wl as InfoToggleButtonGroup,Pa as InsetStack,kn as Label,yn as LabelExtraSmall,Bn as LabelLarge,Sn as LabelSmall,wn as Legal,Cn as LegalSemibold,Wf as LightTreeView,nv as LineChart,Pc as LinearGradient,mg as LinearProgress,vg as LinearProgressShowcase,Vs as Link,Xg as List,Ug as ListItem,Gg as ListItemDecorator,ob as MainLayout,Vd as Menu,Hd as MenuButton,jd as MenuDivider,Qd as MenuItem,Kd as MenuShowcase,Wc as MeshCardGradient,Mc as MeshGradient,rx as MobileAppBar,vu as Modal,Ll as NeutralToggleButtonGroup,xl as NumberField,kl as NumberFieldShowcase,On as NumberLarge,Wn as NumberMedium,Mn as NumberSmall,jl as NumberTextField,Jc as OmniDesignProvider,ka as OmniStack,Pf as OmniTreeView,En as Overline,Ln as OverlineLarge,Pn as OverlineMedium,Rn as OverlineSmall,zd as Pagination,Md as PaginationShowcase,Oc as Paper,Vl as PasswordTextField,Gl as PhoneTextField,ov as PieChart,Dc as Popover,Rl as PrimaryToggleButtonGroup,od as RATIO_NAMES,Lc as RadialGradient,ms as Radio,fs as RadioGroup,gs as RadioInput,ol as Rail,dl as RailShowcase,Ss as RangeSlider,ws as Rating,ws as RatingInput,sd as Ratio,fd as RatioShowcase,Aa as ResponsiveStack,La as ScrollStack,Ts as SearchField,Es as SearchFieldShowcase,Ql as SearchTextField,El as SecondaryToggleButtonGroup,rd as Section,nd as SectionShowcase,ei as Select,es as SelectShowcase,Na as SelectableCard,Pb as SettingsPanel,nb as Sidebar,ys as Slider,ys as SliderInput,Jf as Snackbar,ng as SnackbarShowcase,Mf as SolidTreeView,Ta as SpaceBetweenStack,Ji as Spacing,yc as SpeedDial,Tc as SpeedDialShowcase,za as Stack,Ea as StackDivider,$s as StackShowcase,hc as Step,pc as Stepper,vc as StepperShowcase,tn as Subtitle,on as Subtitle1,an as Subtitle2,en as SubtitleLarge,nn as SubtitleMedium,rn as SubtitleSmall,Ol as SuccessToggleButtonGroup,eu as Surfaced,oa as Switch,oa as SwitchInput,di as Tab,si as TabList,ci as TabPanel,Kg as Table,li as Tabs,Sd as TabsShowcase,Pl as TertiaryToggleButtonGroup,Xl as TextArea,Nl as TextField,$l as TextFieldGroup,Yo as TextInput,_c as ThemedZone,Bl as ToggleButton,Al as ToggleButtonGroup,ul as Toolbar,fl as ToolbarShowcase,Zg as Tooltip,xb as TreeBranch,Ab as TreeViewShowcase,Qr as Typography,Ul as URLTextField,wa as VStack,Dl as WarningToggleButtonGroup,Ia as WrapStack,Ub as chartGeometry,iv as default,Zc as useOmniDesign,uc as useStepperContext,ai as useTabsContext};
42
42
  //# sourceMappingURL=index.esm.js.map