react-window 2.1.1 → 2.2.0-alpha.0

package/docs/assets/PropsRoute-B2tWvN5Y.js

@@ -1,2 +0,0 @@
-import{j as e,B as a}from"./index-3R9tv3eW.js";import{C as n}from"./ContinueLink-Mq4XOwMu.js";import{C as t}from"./ComponentProps-0JkeHmLq.js";import"./Header-DM8OHOd_.js";const l={tags:{},filePath:"lib/components/grid/Grid.tsx",description:"",displayName:"Grid",methods:[],props:JSON.parse('{"className":{"defaultValue":null,"description":"CSS class name.","name":"className","parent":{"fileName":"react-window/node_modules/.pnpm/@types+react@19.1.8/node_modules/@types/react/index.d.ts","name":"HTMLAttributes"},"declarations":[{"fileName":"react-window/node_modules/.pnpm/@types+react@19.1.8/node_modules/@types/react/index.d.ts","name":"HTMLAttributes"},{"fileName":"react-window/lib/components/grid/types.ts","name":"TypeLiteral"}],"required":false,"type":{"name":"enum","raw":"string | undefined","value":[{"value":"undefined"},{"value":"string"}]}},"dir":{"defaultValue":null,"description":"Corresponds to the HTML dir attribute:\\nhttps://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/dir","name":"dir","parent":{"fileName":"react-window/node_modules/.pnpm/@types+react@19.1.8/node_modules/@types/react/index.d.ts","name":"HTMLAttributes"},"declarations":[{"fileName":"react-window/node_modules/.pnpm/@types+react@19.1.8/node_modules/@types/react/index.d.ts","name":"HTMLAttributes"},{"fileName":"react-window/lib/components/grid/types.ts","name":"TypeLiteral"}],"required":false,"type":{"name":"enum","raw":"string | undefined","value":[{"value":"undefined"},{"value":"string"}]}},"style":{"defaultValue":null,"description":"Optional CSS properties.\\nThe grid of cells will fill the height and width defined by this style.","name":"style","parent":{"fileName":"react-window/node_modules/.pnpm/@types+react@19.1.8/node_modules/@types/react/index.d.ts","name":"HTMLAttributes"},"declarations":[{"fileName":"react-window/node_modules/.pnpm/@types+react@19.1.8/node_modules/@types/react/index.d.ts","name":"HTMLAttributes"},{"fileName":"react-window/lib/components/grid/types.ts","name":"TypeLiteral"}],"required":false,"type":{"name":"enum","raw":"CSSProperties | undefined","value":[{"value":"undefined"},{"value":"CSSProperties","description":"","fullComment":"","tags":{}}]}},"children":{"defaultValue":null,"description":"Additional content to be rendered within the grid (above cells).\\nThis property can be used to render things like overlays or tooltips.","name":"children","parent":{"fileName":"react-window/node_modules/.pnpm/@types+react@19.1.8/node_modules/@types/react/index.d.ts","name":"DOMAttributes"},"declarations":[{"fileName":"react-window/node_modules/.pnpm/@types+react@19.1.8/node_modules/@types/react/index.d.ts","name":"DOMAttributes"},{"fileName":"react-window/lib/components/grid/types.ts","name":"TypeLiteral"}],"required":false,"type":{"name":"enum","raw":"ReactNode","value":[{"value":"undefined"},{"value":"null"},{"value":"string"},{"value":"number"},{"value":"bigint"},{"value":"false"},{"value":"true"},{"value":"ReactElement<unknown, string | JSXElementConstructor<any>>","description":"Represents a JSX element.\\n\\nWhere {@link ReactNode} represents everything that can be rendered, `ReactElement`\\nonly represents JSX.","fullComment":"Represents a JSX element.\\n\\nWhere {@link ReactNode} represents everything that can be rendered, `ReactElement`\\nonly represents JSX.\\n@template P The type of the props object\\n@template T The type of the component or tag\\n@example ```tsx\\nconst element: ReactElement = <div />;\\n```","tags":{"template":"P The type of the props object\\nT The type of the component or tag","example":"```tsx\\nconst element: ReactElement = <div />;\\n```"}},{"value":"Iterable<ReactNode>","description":"","fullComment":"","tags":{}},{"value":"ReactPortal","description":"","fullComment":"","tags":{}},{"value":"Promise<AwaitedReactNode>","description":"Represents the completion of an asynchronous operation","fullComment":"Represents the completion of an asynchronous operation","tags":{}}]}},"cellComponent":{"defaultValue":null,"description":"React component responsible for rendering a cell.\\n\\nThis component will receive an `index` and `style` prop by default.\\nAdditionally it will receive prop values passed to `cellProps`.\\n\\n⚠️ The prop types for this component are exported as `CellComponentProps`","name":"cellComponent","declarations":[{"fileName":"react-window/lib/components/grid/types.ts","name":"TypeLiteral"}],"required":true,"type":{"name":"(props: { ariaAttributes: { \\"aria-colindex\\": number; role: \\"gridcell\\"; }; columnIndex: number; rowIndex: number; style: CSSProperties; } & CellProps) => ReactNode"}},"cellProps":{"defaultValue":null,"description":"Additional props to be passed to the cell-rendering component.\\nGrid will automatically re-render cells when values in this object change.\\n\\n⚠️ This object must not contain either an `index` or `style` prop.","name":"cellProps","declarations":[{"fileName":"react-window/lib/components/grid/types.ts","name":"TypeLiteral"}],"required":true,"type":{"name":"ExcludeForbiddenKeys<CellProps>"}},"columnCount":{"defaultValue":null,"description":"Number of columns to be rendered in the grid.","name":"columnCount","declarations":[{"fileName":"react-window/lib/components/grid/types.ts","name":"TypeLiteral"}],"required":true,"type":{"name":"number"}},"columnWidth":{"defaultValue":null,"description":"Column width; the following formats are supported:\\n- number of pixels (number)\\n- percentage of the grid\'s current width (string)\\n- function that returns the row width (in pixels) given an index and `cellProps`","name":"columnWidth","declarations":[{"fileName":"react-window/lib/components/grid/types.ts","name":"TypeLiteral"}],"required":true,"type":{"name":"enum","raw":"string | number | ((index: number, cellProps: CellProps) => number)","value":[{"value":"string"},{"value":"number"},{"value":"(index: number, cellProps: CellProps) => number","description":"","fullComment":"","tags":{}}]}},"defaultHeight":{"defaultValue":{"value":"0"},"description":"Default height of grid for initial render.\\nThis value is important for server rendering.","name":"defaultHeight","declarations":[{"fileName":"react-window/lib/components/grid/types.ts","name":"TypeLiteral"}],"required":false,"type":{"name":"enum","raw":"number | undefined","value":[{"value":"undefined"},{"value":"number"}]}},"defaultWidth":{"defaultValue":{"value":"0"},"description":"Default width of grid for initial render.\\nThis value is important for server rendering.","name":"defaultWidth","declarations":[{"fileName":"react-window/lib/components/grid/types.ts","name":"TypeLiteral"}],"required":false,"type":{"name":"enum","raw":"number | undefined","value":[{"value":"undefined"},{"value":"number"}]}},"gridRef":{"defaultValue":null,"description":"Ref used to interact with this component\'s imperative API.\\n\\nThis API has imperative methods for scrolling and a getter for the outermost DOM element.\\n\\n⚠️ The `useGridRef` and `useGridCallbackRef` hooks are exported for convenience use in TypeScript projects.","name":"gridRef","declarations":[{"fileName":"react-window/lib/components/grid/types.ts","name":"TypeLiteral"}],"required":false,"type":{"name":"enum","raw":"Ref<GridImperativeAPI> | undefined","value":[{"value":"undefined"},{"value":"null"},{"value":"(instance: GridImperativeAPI | null) => void | (() => VoidOrUndefinedOnly)","description":"","fullComment":"","tags":{}},{"value":"RefObject<GridImperativeAPI | null>","description":"Created by {@link createRef}, or {@link useRef} when passed `null`.","fullComment":"Created by {@link createRef}, or {@link useRef} when passed `null`.\\n@template T The type of the ref\'s value.\\n@example ```tsx\\nconst ref = createRef<HTMLDivElement>();\\n\\nref.current = document.createElement(\'div\'); // Error\\n```","tags":{"template":"T The type of the ref\'s value.","example":"```tsx\\nconst ref = createRef<HTMLDivElement>();\\n\\nref.current = document.createElement(\'div\'); // Error\\n```"}}]}},"onCellsRendered":{"defaultValue":null,"description":"Callback notified when the range of rendered cells changes.","name":"onCellsRendered","declarations":[{"fileName":"react-window/lib/components/grid/types.ts","name":"TypeLiteral"}],"required":false,"type":{"name":"enum","raw":"((visibleCells: { columnStartIndex: number; columnStopIndex: number; rowStartIndex: number; rowStopIndex: number; }, allCells: { columnStartIndex: number; columnStopIndex: number; rowStartIndex: number; rowStopIndex: number; }) => void) | undefined","value":[{"value":"undefined"},{"value":"(visibleCells: { columnStartIndex: number; columnStopIndex: number; rowStartIndex: number; rowStopIndex: number; }, allCells: { columnStartIndex: number; columnStopIndex: number; rowStartIndex: number; rowStopIndex: number; }) => void","description":"","fullComment":"","tags":{}}]}},"onResize":{"defaultValue":null,"description":"Callback notified when the Grid\'s outermost HTMLElement resizes.\\nThis may be used to (re)scroll a cell into view.","name":"onResize","declarations":[{"fileName":"react-window/lib/components/grid/types.ts","name":"TypeLiteral"}],"required":false,"type":{"name":"enum","raw":"((size: { height: number; width: number; }, prevSize: { height: number; width: number; }) => void) | undefined","value":[{"value":"undefined"},{"value":"(size: { height: number; width: number; }, prevSize: { height: number; width: number; }) => void","description":"","fullComment":"","tags":{}}]}},"overscanCount":{"defaultValue":{"value":"3"},"description":"How many additional rows/columns to render outside of the visible area.\\nThis can reduce visual flickering near the edges of a grid when scrolling.","name":"overscanCount","declarations":[{"fileName":"react-window/lib/components/grid/types.ts","name":"TypeLiteral"}],"required":false,"type":{"name":"enum","raw":"number | undefined","value":[{"value":"undefined"},{"value":"number"}]}},"rowCount":{"defaultValue":null,"description":"Number of rows to be rendered in the grid.","name":"rowCount","declarations":[{"fileName":"react-window/lib/components/grid/types.ts","name":"TypeLiteral"}],"required":true,"type":{"name":"number"}},"rowHeight":{"defaultValue":null,"description":"Row height; the following formats are supported:\\n- number of pixels (number)\\n- percentage of the grid\'s current height (string)\\n- function that returns the row height (in pixels) given an index and `cellProps`","name":"rowHeight","declarations":[{"fileName":"react-window/lib/components/grid/types.ts","name":"TypeLiteral"}],"required":true,"type":{"name":"enum","raw":"string | number | ((index: number, cellProps: CellProps) => number)","value":[{"value":"string"},{"value":"number"},{"value":"(index: number, cellProps: CellProps) => number","description":"","fullComment":"","tags":{}}]}},"tagName":{"defaultValue":{"value":"\\"div\\" as TagName"},"description":"Can be used to override the root HTML element rendered by the List component.\\nThe default value is \\"div\\", meaning that List renders an HTMLDivElement as its root.\\n\\n⚠️ In most use cases the default ARIA roles are sufficient and this prop is not needed.","name":"tagName","declarations":[{"fileName":"react-window/lib/components/grid/types.ts","name":"TypeLiteral"}],"required":false,"type":{"name":"enum","raw":"keyof IntrinsicElements | undefined","value":[{"value":"undefined"},{"value":"\\"symbol\\""},{"value":"\\"object\\""},{"value":"\\"slot\\""},{"value":"\\"style\\""},{"value":"\\"title\\""},{"value":"\\"search\\""},{"value":"\\"article\\""},{"value":"\\"button\\""},{"value":"\\"dialog\\""},{"value":"\\"figure\\""},{"value":"\\"form\\""},{"value":"\\"img\\""},{"value":"\\"link\\""},{"value":"\\"main\\""},{"value":"\\"menu\\""},{"value":"\\"menuitem\\""},{"value":"\\"option\\""},{"value":"\\"switch\\""},{"value":"\\"table\\""},{"value":"\\"text\\""},{"value":"\\"time\\""},{"value":"\\"a\\""},{"value":"\\"abbr\\""},{"value":"\\"address\\""},{"value":"\\"area\\""},{"value":"\\"aside\\""},{"value":"\\"audio\\""},{"value":"\\"b\\""},{"value":"\\"base\\""},{"value":"\\"bdi\\""},{"value":"\\"bdo\\""},{"value":"\\"big\\""},{"value":"\\"blockquote\\""},{"value":"\\"body\\""},{"value":"\\"br\\""},{"value":"\\"canvas\\""},{"value":"\\"caption\\""},{"value":"\\"center\\""},{"value":"\\"cite\\""},{"value":"\\"code\\""},{"value":"\\"col\\""},{"value":"\\"colgroup\\""},{"value":"\\"data\\""},{"value":"\\"datalist\\""},{"value":"\\"dd\\""},{"value":"\\"del\\""},{"value":"\\"details\\""},{"value":"\\"dfn\\""},{"value":"\\"div\\""},{"value":"\\"dl\\""},{"value":"\\"dt\\""},{"value":"\\"em\\""},{"value":"\\"embed\\""},{"value":"\\"fieldset\\""},{"value":"\\"figcaption\\""},{"value":"\\"footer\\""},{"value":"\\"h1\\""},{"value":"\\"h2\\""},{"value":"\\"h3\\""},{"value":"\\"h4\\""},{"value":"\\"h5\\""},{"value":"\\"h6\\""},{"value":"\\"head\\""},{"value":"\\"header\\""},{"value":"\\"hgroup\\""},{"value":"\\"hr\\""},{"value":"\\"html\\""},{"value":"\\"i\\""},{"value":"\\"iframe\\""},{"value":"\\"input\\""},{"value":"\\"ins\\""},{"value":"\\"kbd\\""},{"value":"\\"keygen\\""},{"value":"\\"label\\""},{"value":"\\"legend\\""},{"value":"\\"li\\""},{"value":"\\"map\\""},{"value":"\\"mark\\""},{"value":"\\"meta\\""},{"value":"\\"meter\\""},{"value":"\\"nav\\""},{"value":"\\"noindex\\""},{"value":"\\"noscript\\""},{"value":"\\"ol\\""},{"value":"\\"optgroup\\""},{"value":"\\"output\\""},{"value":"\\"p\\""},{"value":"\\"param\\""},{"value":"\\"picture\\""},{"value":"\\"pre\\""},{"value":"\\"progress\\""},{"value":"\\"q\\""},{"value":"\\"rp\\""},{"value":"\\"rt\\""},{"value":"\\"ruby\\""},{"value":"\\"s\\""},{"value":"\\"samp\\""},{"value":"\\"script\\""},{"value":"\\"section\\""},{"value":"\\"select\\""},{"value":"\\"small\\""},{"value":"\\"source\\""},{"value":"\\"span\\""},{"value":"\\"strong\\""},{"value":"\\"sub\\""},{"value":"\\"summary\\""},{"value":"\\"sup\\""},{"value":"\\"template\\""},{"value":"\\"tbody\\""},{"value":"\\"td\\""},{"value":"\\"textarea\\""},{"value":"\\"tfoot\\""},{"value":"\\"th\\""},{"value":"\\"thead\\""},{"value":"\\"tr\\""},{"value":"\\"track\\""},{"value":"\\"u\\""},{"value":"\\"ul\\""},{"value":"\\"var\\""},{"value":"\\"video\\""},{"value":"\\"wbr\\""},{"value":"\\"webview\\""},{"value":"\\"svg\\""},{"value":"\\"animate\\""},{"value":"\\"animateMotion\\""},{"value":"\\"animateTransform\\""},{"value":"\\"circle\\""},{"value":"\\"clipPath\\""},{"value":"\\"defs\\""},{"value":"\\"desc\\""},{"value":"\\"ellipse\\""},{"value":"\\"feBlend\\""},{"value":"\\"feColorMatrix\\""},{"value":"\\"feComponentTransfer\\""},{"value":"\\"feComposite\\""},{"value":"\\"feConvolveMatrix\\""},{"value":"\\"feDiffuseLighting\\""},{"value":"\\"feDisplacementMap\\""},{"value":"\\"feDistantLight\\""},{"value":"\\"feDropShadow\\""},{"value":"\\"feFlood\\""},{"value":"\\"feFuncA\\""},{"value":"\\"feFuncB\\""},{"value":"\\"feFuncG\\""},{"value":"\\"feFuncR\\""},{"value":"\\"feGaussianBlur\\""},{"value":"\\"feImage\\""},{"value":"\\"feMerge\\""},{"value":"\\"feMergeNode\\""},{"value":"\\"feMorphology\\""},{"value":"\\"feOffset\\""},{"value":"\\"fePointLight\\""},{"value":"\\"feSpecularLighting\\""},{"value":"\\"feSpotLight\\""},{"value":"\\"feTile\\""},{"value":"\\"feTurbulence\\""},{"value":"\\"filter\\""},{"value":"\\"foreignObject\\""},{"value":"\\"g\\""},{"value":"\\"image\\""},{"value":"\\"line\\""},{"value":"\\"linearGradient\\""},{"value":"\\"marker\\""},{"value":"\\"mask\\""},{"value":"\\"metadata\\""},{"value":"\\"mpath\\""},{"value":"\\"path\\""},{"value":"\\"pattern\\""},{"value":"\\"polygon\\""},{"value":"\\"polyline\\""},{"value":"\\"radialGradient\\""},{"value":"\\"rect\\""},{"value":"\\"set\\""},{"value":"\\"stop\\""},{"value":"\\"textPath\\""},{"value":"\\"tspan\\""},{"value":"\\"use\\""},{"value":"\\"view\\""}]}}}')};function r(){return e.jsxs(a,{direction:"column",gap:4,children:[e.jsx(t,{section:"Grids",json:l}),e.jsx(n,{to:"/grid/imperative-api",title:"imperative api"})]})}export{r as default};
-//# sourceMappingURL=PropsRoute-B2tWvN5Y.js.map

package/docs/assets/PropsRoute-B2tWvN5Y.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"PropsRoute-B2tWvN5Y.js","sources":["../../src/routes/grid/PropsRoute.tsx"],"sourcesContent":["import { Box } from \"../../components/Box\";\nimport { ContinueLink } from \"../../components/ContinueLink\";\nimport { ComponentProps } from \"../../components/props/ComponentProps\";\nimport json from \"../../../public/generated/js-docs/Grid.json\";\n\nexport default function GridPropsRoute() {\n  return (\n    <Box direction=\"column\" gap={4}>\n      <ComponentProps section=\"Grids\" json={json} />\n      <ContinueLink to=\"/grid/imperative-api\" title=\"imperative api\" />\n    </Box>\n  );\n}\n"],"names":["GridPropsRoute","jsxs","Box","direction","gap","children","jsx","ComponentProps","section","json","ContinueLink","to","title"],"mappings":"k9eAKA,SAAwBA,IACtB,OACEC,EAAAA,KAACC,EAAA,CAAIC,UAAU,SAASC,IAAK,EAC3BC,SAAA,GAAAC,IAACC,EAAA,CAAeC,QAAQ,QAAQC,SAChCH,EAAAA,IAACI,EAAA,CAAaC,GAAG,uBAAuBC,MAAM,qBAGpD"}

package/docs/assets/PropsRoute-E2EuXhKK.js

@@ -1,2 +0,0 @@
-import{j as e,B as a}from"./index-3R9tv3eW.js";import{C as t}from"./ContinueLink-Mq4XOwMu.js";import{C as n}from"./ComponentProps-0JkeHmLq.js";import"./Header-DM8OHOd_.js";const l={tags:{},filePath:"lib/components/list/List.tsx",description:"",displayName:"List",methods:[],props:JSON.parse('{"className":{"defaultValue":null,"description":"CSS class name.","name":"className","parent":{"fileName":"react-window/node_modules/.pnpm/@types+react@19.1.8/node_modules/@types/react/index.d.ts","name":"HTMLAttributes"},"declarations":[{"fileName":"react-window/node_modules/.pnpm/@types+react@19.1.8/node_modules/@types/react/index.d.ts","name":"HTMLAttributes"},{"fileName":"react-window/lib/components/list/types.ts","name":"TypeLiteral"}],"required":false,"type":{"name":"enum","raw":"string | undefined","value":[{"value":"undefined"},{"value":"string"}]}},"style":{"defaultValue":null,"description":"Optional CSS properties.\\nThe list of rows will fill the height defined by this style.","name":"style","parent":{"fileName":"react-window/node_modules/.pnpm/@types+react@19.1.8/node_modules/@types/react/index.d.ts","name":"HTMLAttributes"},"declarations":[{"fileName":"react-window/node_modules/.pnpm/@types+react@19.1.8/node_modules/@types/react/index.d.ts","name":"HTMLAttributes"},{"fileName":"react-window/lib/components/list/types.ts","name":"TypeLiteral"}],"required":false,"type":{"name":"enum","raw":"CSSProperties | undefined","value":[{"value":"undefined"},{"value":"CSSProperties","description":"","fullComment":"","tags":{}}]}},"children":{"defaultValue":null,"description":"Additional content to be rendered within the list (above cells).\\nThis property can be used to render things like overlays or tooltips.","name":"children","parent":{"fileName":"react-window/node_modules/.pnpm/@types+react@19.1.8/node_modules/@types/react/index.d.ts","name":"DOMAttributes"},"declarations":[{"fileName":"react-window/node_modules/.pnpm/@types+react@19.1.8/node_modules/@types/react/index.d.ts","name":"DOMAttributes"},{"fileName":"react-window/lib/components/list/types.ts","name":"TypeLiteral"}],"required":false,"type":{"name":"enum","raw":"ReactNode","value":[{"value":"undefined"},{"value":"null"},{"value":"string"},{"value":"number"},{"value":"bigint"},{"value":"false"},{"value":"true"},{"value":"ReactElement<unknown, string | JSXElementConstructor<any>>","description":"Represents a JSX element.\\n\\nWhere {@link ReactNode} represents everything that can be rendered, `ReactElement`\\nonly represents JSX.","fullComment":"Represents a JSX element.\\n\\nWhere {@link ReactNode} represents everything that can be rendered, `ReactElement`\\nonly represents JSX.\\n@template P The type of the props object\\n@template T The type of the component or tag\\n@example ```tsx\\nconst element: ReactElement = <div />;\\n```","tags":{"template":"P The type of the props object\\nT The type of the component or tag","example":"```tsx\\nconst element: ReactElement = <div />;\\n```"}},{"value":"Iterable<ReactNode>","description":"","fullComment":"","tags":{}},{"value":"ReactPortal","description":"","fullComment":"","tags":{}},{"value":"Promise<AwaitedReactNode>","description":"Represents the completion of an asynchronous operation","fullComment":"Represents the completion of an asynchronous operation","tags":{}}]}},"defaultHeight":{"defaultValue":{"value":"0"},"description":"Default height of list for initial render.\\nThis value is important for server rendering.","name":"defaultHeight","declarations":[{"fileName":"react-window/lib/components/list/types.ts","name":"TypeLiteral"}],"required":false,"type":{"name":"enum","raw":"number | undefined","value":[{"value":"undefined"},{"value":"number"}]}},"listRef":{"defaultValue":null,"description":"Ref used to interact with this component\'s imperative API.\\n\\nThis API has imperative methods for scrolling and a getter for the outermost DOM element.\\n\\n⚠️ The `useListRef` and `useListCallbackRef` hooks are exported for convenience use in TypeScript projects.","name":"listRef","declarations":[{"fileName":"react-window/lib/components/list/types.ts","name":"TypeLiteral"}],"required":false,"type":{"name":"enum","raw":"Ref<ListImperativeAPI> | undefined","value":[{"value":"undefined"},{"value":"null"},{"value":"(instance: ListImperativeAPI | null) => void | (() => VoidOrUndefinedOnly)","description":"","fullComment":"","tags":{}},{"value":"RefObject<ListImperativeAPI | null>","description":"Created by {@link createRef}, or {@link useRef} when passed `null`.","fullComment":"Created by {@link createRef}, or {@link useRef} when passed `null`.\\n@template T The type of the ref\'s value.\\n@example ```tsx\\nconst ref = createRef<HTMLDivElement>();\\n\\nref.current = document.createElement(\'div\'); // Error\\n```","tags":{"template":"T The type of the ref\'s value.","example":"```tsx\\nconst ref = createRef<HTMLDivElement>();\\n\\nref.current = document.createElement(\'div\'); // Error\\n```"}}]}},"onResize":{"defaultValue":null,"description":"Callback notified when the List\'s outermost HTMLElement resizes.\\nThis may be used to (re)scroll a row into view.","name":"onResize","declarations":[{"fileName":"react-window/lib/components/list/types.ts","name":"TypeLiteral"}],"required":false,"type":{"name":"enum","raw":"((size: { height: number; width: number; }, prevSize: { height: number; width: number; }) => void) | undefined","value":[{"value":"undefined"},{"value":"(size: { height: number; width: number; }, prevSize: { height: number; width: number; }) => void","description":"","fullComment":"","tags":{}}]}},"onRowsRendered":{"defaultValue":null,"description":"Callback notified when the range of visible rows changes.","name":"onRowsRendered","declarations":[{"fileName":"react-window/lib/components/list/types.ts","name":"TypeLiteral"}],"required":false,"type":{"name":"enum","raw":"((visibleRows: { startIndex: number; stopIndex: number; }, allRows: { startIndex: number; stopIndex: number; }) => void) | undefined","value":[{"value":"undefined"},{"value":"(visibleRows: { startIndex: number; stopIndex: number; }, allRows: { startIndex: number; stopIndex: number; }) => void","description":"","fullComment":"","tags":{}}]}},"overscanCount":{"defaultValue":{"value":"3"},"description":"How many additional rows to render outside of the visible area.\\nThis can reduce visual flickering near the edges of a list when scrolling.","name":"overscanCount","declarations":[{"fileName":"react-window/lib/components/list/types.ts","name":"TypeLiteral"}],"required":false,"type":{"name":"enum","raw":"number | undefined","value":[{"value":"undefined"},{"value":"number"}]}},"rowComponent":{"defaultValue":null,"description":"React component responsible for rendering a row.\\n\\nThis component will receive an `index` and `style` prop by default.\\nAdditionally it will receive prop values passed to `rowProps`.\\n\\n⚠️ The prop types for this component are exported as `RowComponentProps`","name":"rowComponent","declarations":[{"fileName":"react-window/lib/components/list/types.ts","name":"TypeLiteral"}],"required":true,"type":{"name":"(props: { ariaAttributes: { \\"aria-posinset\\": number; \\"aria-setsize\\": number; role: \\"listitem\\"; }; index: number; style: CSSProperties; } & RowProps) => ReactNode"}},"rowCount":{"defaultValue":null,"description":"Number of items to be rendered in the list.","name":"rowCount","declarations":[{"fileName":"react-window/lib/components/list/types.ts","name":"TypeLiteral"}],"required":true,"type":{"name":"number"}},"rowHeight":{"defaultValue":null,"description":"Row height; the following formats are supported:\\n- number of pixels (number)\\n- percentage of the grid\'s current height (string)\\n- function that returns the row height (in pixels) given an index and `cellProps`","name":"rowHeight","declarations":[{"fileName":"react-window/lib/components/list/types.ts","name":"TypeLiteral"}],"required":true,"type":{"name":"enum","raw":"string | number | ((index: number, cellProps: RowProps) => number)","value":[{"value":"string"},{"value":"number"},{"value":"(index: number, cellProps: RowProps) => number","description":"","fullComment":"","tags":{}}]}},"rowProps":{"defaultValue":null,"description":"Additional props to be passed to the row-rendering component.\\nList will automatically re-render rows when values in this object change.\\n\\n⚠️ This object must not contain either an `index` or `style` prop.","name":"rowProps","declarations":[{"fileName":"react-window/lib/components/list/types.ts","name":"TypeLiteral"}],"required":true,"type":{"name":"ExcludeForbiddenKeys<RowProps>"}},"tagName":{"defaultValue":{"value":"\\"div\\" as TagName"},"description":"Can be used to override the root HTML element rendered by the List component.\\nThe default value is \\"div\\", meaning that List renders an HTMLDivElement as its root.\\n\\n⚠️ In most use cases the default ARIA roles are sufficient and this prop is not needed.","name":"tagName","declarations":[{"fileName":"react-window/lib/components/list/types.ts","name":"TypeLiteral"}],"required":false,"type":{"name":"enum","raw":"keyof IntrinsicElements | undefined","value":[{"value":"undefined"},{"value":"\\"symbol\\""},{"value":"\\"object\\""},{"value":"\\"slot\\""},{"value":"\\"style\\""},{"value":"\\"title\\""},{"value":"\\"search\\""},{"value":"\\"article\\""},{"value":"\\"button\\""},{"value":"\\"dialog\\""},{"value":"\\"figure\\""},{"value":"\\"form\\""},{"value":"\\"img\\""},{"value":"\\"link\\""},{"value":"\\"main\\""},{"value":"\\"menu\\""},{"value":"\\"menuitem\\""},{"value":"\\"option\\""},{"value":"\\"switch\\""},{"value":"\\"table\\""},{"value":"\\"text\\""},{"value":"\\"time\\""},{"value":"\\"a\\""},{"value":"\\"abbr\\""},{"value":"\\"address\\""},{"value":"\\"area\\""},{"value":"\\"aside\\""},{"value":"\\"audio\\""},{"value":"\\"b\\""},{"value":"\\"base\\""},{"value":"\\"bdi\\""},{"value":"\\"bdo\\""},{"value":"\\"big\\""},{"value":"\\"blockquote\\""},{"value":"\\"body\\""},{"value":"\\"br\\""},{"value":"\\"canvas\\""},{"value":"\\"caption\\""},{"value":"\\"center\\""},{"value":"\\"cite\\""},{"value":"\\"code\\""},{"value":"\\"col\\""},{"value":"\\"colgroup\\""},{"value":"\\"data\\""},{"value":"\\"datalist\\""},{"value":"\\"dd\\""},{"value":"\\"del\\""},{"value":"\\"details\\""},{"value":"\\"dfn\\""},{"value":"\\"div\\""},{"value":"\\"dl\\""},{"value":"\\"dt\\""},{"value":"\\"em\\""},{"value":"\\"embed\\""},{"value":"\\"fieldset\\""},{"value":"\\"figcaption\\""},{"value":"\\"footer\\""},{"value":"\\"h1\\""},{"value":"\\"h2\\""},{"value":"\\"h3\\""},{"value":"\\"h4\\""},{"value":"\\"h5\\""},{"value":"\\"h6\\""},{"value":"\\"head\\""},{"value":"\\"header\\""},{"value":"\\"hgroup\\""},{"value":"\\"hr\\""},{"value":"\\"html\\""},{"value":"\\"i\\""},{"value":"\\"iframe\\""},{"value":"\\"input\\""},{"value":"\\"ins\\""},{"value":"\\"kbd\\""},{"value":"\\"keygen\\""},{"value":"\\"label\\""},{"value":"\\"legend\\""},{"value":"\\"li\\""},{"value":"\\"map\\""},{"value":"\\"mark\\""},{"value":"\\"meta\\""},{"value":"\\"meter\\""},{"value":"\\"nav\\""},{"value":"\\"noindex\\""},{"value":"\\"noscript\\""},{"value":"\\"ol\\""},{"value":"\\"optgroup\\""},{"value":"\\"output\\""},{"value":"\\"p\\""},{"value":"\\"param\\""},{"value":"\\"picture\\""},{"value":"\\"pre\\""},{"value":"\\"progress\\""},{"value":"\\"q\\""},{"value":"\\"rp\\""},{"value":"\\"rt\\""},{"value":"\\"ruby\\""},{"value":"\\"s\\""},{"value":"\\"samp\\""},{"value":"\\"script\\""},{"value":"\\"section\\""},{"value":"\\"select\\""},{"value":"\\"small\\""},{"value":"\\"source\\""},{"value":"\\"span\\""},{"value":"\\"strong\\""},{"value":"\\"sub\\""},{"value":"\\"summary\\""},{"value":"\\"sup\\""},{"value":"\\"template\\""},{"value":"\\"tbody\\""},{"value":"\\"td\\""},{"value":"\\"textarea\\""},{"value":"\\"tfoot\\""},{"value":"\\"th\\""},{"value":"\\"thead\\""},{"value":"\\"tr\\""},{"value":"\\"track\\""},{"value":"\\"u\\""},{"value":"\\"ul\\""},{"value":"\\"var\\""},{"value":"\\"video\\""},{"value":"\\"wbr\\""},{"value":"\\"webview\\""},{"value":"\\"svg\\""},{"value":"\\"animate\\""},{"value":"\\"animateMotion\\""},{"value":"\\"animateTransform\\""},{"value":"\\"circle\\""},{"value":"\\"clipPath\\""},{"value":"\\"defs\\""},{"value":"\\"desc\\""},{"value":"\\"ellipse\\""},{"value":"\\"feBlend\\""},{"value":"\\"feColorMatrix\\""},{"value":"\\"feComponentTransfer\\""},{"value":"\\"feComposite\\""},{"value":"\\"feConvolveMatrix\\""},{"value":"\\"feDiffuseLighting\\""},{"value":"\\"feDisplacementMap\\""},{"value":"\\"feDistantLight\\""},{"value":"\\"feDropShadow\\""},{"value":"\\"feFlood\\""},{"value":"\\"feFuncA\\""},{"value":"\\"feFuncB\\""},{"value":"\\"feFuncG\\""},{"value":"\\"feFuncR\\""},{"value":"\\"feGaussianBlur\\""},{"value":"\\"feImage\\""},{"value":"\\"feMerge\\""},{"value":"\\"feMergeNode\\""},{"value":"\\"feMorphology\\""},{"value":"\\"feOffset\\""},{"value":"\\"fePointLight\\""},{"value":"\\"feSpecularLighting\\""},{"value":"\\"feSpotLight\\""},{"value":"\\"feTile\\""},{"value":"\\"feTurbulence\\""},{"value":"\\"filter\\""},{"value":"\\"foreignObject\\""},{"value":"\\"g\\""},{"value":"\\"image\\""},{"value":"\\"line\\""},{"value":"\\"linearGradient\\""},{"value":"\\"marker\\""},{"value":"\\"mask\\""},{"value":"\\"metadata\\""},{"value":"\\"mpath\\""},{"value":"\\"path\\""},{"value":"\\"pattern\\""},{"value":"\\"polygon\\""},{"value":"\\"polyline\\""},{"value":"\\"radialGradient\\""},{"value":"\\"rect\\""},{"value":"\\"set\\""},{"value":"\\"stop\\""},{"value":"\\"textPath\\""},{"value":"\\"tspan\\""},{"value":"\\"use\\""},{"value":"\\"view\\""}]}}}')};function i(){return e.jsxs(a,{direction:"column",gap:4,children:[e.jsx(n,{section:"Lists",json:l}),e.jsx(t,{to:"/list/imperative-api",title:"imperative api"})]})}export{i as default};
-//# sourceMappingURL=PropsRoute-E2EuXhKK.js.map

package/docs/assets/PropsRoute-E2EuXhKK.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"PropsRoute-E2EuXhKK.js","sources":["../../src/routes/list/PropsRoute.tsx"],"sourcesContent":["import { Box } from \"../../components/Box\";\nimport { ContinueLink } from \"../../components/ContinueLink\";\nimport { ComponentProps } from \"../../components/props/ComponentProps\";\nimport json from \"../../../public/generated/js-docs/List.json\";\n\nexport default function ListPropsRoute() {\n  return (\n    <Box direction=\"column\" gap={4}>\n      <ComponentProps section=\"Lists\" json={json} />\n      <ContinueLink to=\"/list/imperative-api\" title=\"imperative api\" />\n    </Box>\n  );\n}\n"],"names":["ListPropsRoute","jsxs","Box","direction","gap","children","jsx","ComponentProps","section","json","ContinueLink","to","title"],"mappings":"0yaAKA,SAAwBA,IACtB,OACEC,EAAAA,KAACC,EAAA,CAAIC,UAAU,SAASC,IAAK,EAC3BC,SAAA,GAAAC,IAACC,EAAA,CAAeC,QAAQ,QAAQC,SAChCH,EAAAA,IAACI,EAAA,CAAaC,GAAG,uBAAuBC,MAAM,qBAGpD"}

package/docs/assets/RTLGridsRoute-BiJ_ARQb.js

@@ -1,2 +0,0 @@
-import{j as s,B as a,E as n}from"./index-3R9tv3eW.js";import{B as t}from"./arePropsEqual-MBk0PiJi.js";import{C as p}from"./Code-BJ6U_DpT.js";import{L as c}from"./LoadingSpinner-CcA45RYo.js";import{c as e,i as o,u as i}from"./useContacts-C-Fuwn4U.js";import{G as l}from"./Grid-Cio8auWD.js";import"./contacts-Bxrk2JS2.js";const r='<div style="min-height: 1rem; padding-left: 2ch; text-indent: -2ch;"><span class="tok-keyword">import</span><span class=""> </span><span class="tok-punctuation">{</span><span class=""> </span><span class="tok-variableName tok-definition">Grid</span><span class=""> </span><span class="tok-punctuation">}</span><span class=""> </span><span class="tok-keyword">from</span><span class=""> </span><span class="tok-string">"react-window"</span><span class="tok-punctuation">;</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 2ch; text-indent: -2ch;"><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 2ch; text-indent: -2ch;"><span class=""></span><span class="tok-keyword">function</span><span class=""> </span><span class="tok-variableName tok-definition">RtlExample</span><span class="tok-punctuation">(</span><span class="tok-punctuation">{</span><span class=""> </span><span class="tok-propertyName">contacts</span><span class=""> </span><span class="tok-punctuation">}</span><span class="tok-punctuation">:</span><span class=""> </span><span class="tok-punctuation">{</span><span class=""> </span><span class="tok-propertyName tok-definition">contacts</span><span class="tok-punctuation">:</span><span class=""> </span><span class="tok-typeName">Contact</span><span class="tok-punctuation">[</span><span class="tok-punctuation">]</span><span class=""> </span><span class="tok-punctuation">}</span><span class="tok-punctuation">)</span><span class=""> </span><span class="tok-punctuation">{</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 4ch; text-indent: -2ch;"><span class=""></span><span class="tok-keyword">return</span><span class=""> </span><span class="tok-punctuation">(</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 6ch; text-indent: -2ch;"><span class=""></span><span class="tok-punctuation">&#60;</span><span class="tok-typeName">Grid</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 8ch; text-indent: -2ch;"><span class=""></span><span class="tok-propertyName">cellComponent</span><span class="tok-operator">=</span><span class="tok-punctuation">{</span><span class="tok-variableName">CellComponent</span><span class="tok-punctuation">}</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 8ch; text-indent: -2ch;"><span class=""></span><span class="tok-propertyName">cellProps</span><span class="tok-operator">=</span><span class="tok-punctuation">{</span><span class="tok-punctuation">{</span><span class=""> </span><span class="tok-propertyName tok-definition">contacts</span><span class=""> </span><span class="tok-punctuation">}</span><span class="tok-punctuation">}</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 8ch; text-indent: -2ch;"><span class=""></span><span class="tok-propertyName">columnCount</span><span class="tok-operator">=</span><span class="tok-punctuation">{</span><span class="tok-number">10</span><span class="tok-punctuation">}</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 8ch; text-indent: -2ch;"><span class=""></span><span class="tok-propertyName">columnWidth</span><span class="tok-operator">=</span><span class="tok-punctuation">{</span><span class="tok-variableName">columnWidth</span><span class="tok-punctuation">}</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 8ch; text-indent: -2ch;"><span class=""></span><span class="tok-propertyName">dir</span><span class="tok-operator">=</span><span class="tok-string">"rtl"</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 8ch; text-indent: -2ch;"><span class=""></span><span class="tok-propertyName">rowCount</span><span class="tok-operator">=</span><span class="tok-punctuation">{</span><span class="tok-variableName">contacts</span><span class="tok-operator">.</span><span class="tok-propertyName">length</span><span class="tok-punctuation">}</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 8ch; text-indent: -2ch;"><span class=""></span><span class="tok-propertyName">rowHeight</span><span class="tok-operator">=</span><span class="tok-punctuation">{</span><span class="tok-number">35</span><span class="tok-punctuation">}</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 6ch; text-indent: -2ch;"><span class=""></span><span class="tok-punctuation">/&#62;</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 4ch; text-indent: -2ch;"><span class=""></span><span class="tok-punctuation">)</span><span class="tok-punctuation">;</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 2ch; text-indent: -2ch;"><span class=""></span><span class="tok-punctuation">}</span></div>';function d({contacts:a}){return s.jsx(l,{cellComponent:u,cellProps:{contacts:a},columnCount:10,columnWidth:e,dir:"rtl",rowCount:a.length,rowHeight:35})}function u({contacts:a,columnIndex:n,rowIndex:t,style:p}){const c=a[t][o(n)];return s.jsxs("div",{className:"truncate leading-none",style:p,children:[s.jsx("div",{children:c}),s.jsxs("small",{className:"text-slate-400",children:["row ",t,", col ",n]})]})}function h(){const e=i();return s.jsxs(a,{direction:"column",gap:4,children:[s.jsxs("div",{children:["Grids can also display right to left languages (like Arabic). The grid components check the"," ",s.jsxs(n,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/dir",children:[s.jsx("code",{children:"dir"})," attribute"]})," ","to determine content directionality."]}),s.jsx("div",{children:"Using the same data as from the previous example, here is a grid rendered right to left."}),s.jsxs(t,{className:"h-50 overflow-auto","data-focus-within":"bold",children:[!e.length&&s.jsx(c,{}),s.jsx(d,{contacts:e})]}),s.jsx(p,{html:r})]})}export{h as default};
-//# sourceMappingURL=RTLGridsRoute-BiJ_ARQb.js.map

package/docs/assets/RTLGridsRoute-BiJ_ARQb.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"RTLGridsRoute-BiJ_ARQb.js","sources":["../../src/routes/grid/examples/RtlGrid.example.tsx","../../src/routes/grid/RTLGridsRoute.tsx"],"sourcesContent":["import json from \"../../../../public/data/contacts.json\";\nimport { columnWidth } from \"./columnWidth.example\";\n\ntype Contact = (typeof json)[0];\n\n// <begin>\n\nimport { Grid } from \"react-window\";\n\nfunction RtlExample({ contacts }: { contacts: Contact[] }) {\n  return (\n    <Grid\n      cellComponent={CellComponent}\n      cellProps={{ contacts }}\n      columnCount={10}\n      columnWidth={columnWidth}\n      dir=\"rtl\"\n      rowCount={contacts.length}\n      rowHeight={35}\n    />\n  );\n}\n\n// <end>\n\nimport { type CellComponentProps } from \"react-window\";\nimport { indexToColumn } from \"./shared\";\n\nfunction CellComponent({\n  contacts,\n  columnIndex,\n  rowIndex,\n  style\n}: CellComponentProps<{\n  contacts: Contact[];\n}>) {\n  const address = contacts[rowIndex];\n  const content = address[indexToColumn(columnIndex)];\n\n  return (\n    <div className=\"truncate leading-none\" style={style}>\n      <div>{content}</div>\n      <small className=\"text-slate-400\">\n        row {rowIndex}, col {columnIndex}\n      </small>\n    </div>\n  );\n}\n\nexport { CellComponent, RtlExample };\nexport type { Contact };\n","import RtlGridMarkdown from \"../../../public/generated/code-snippets/RtlGrid.json\";\nimport { Block } from \"../../components/Block\";\nimport { Box } from \"../../components/Box\";\nimport { Code } from \"../../components/code/Code\";\nimport { ExternalLink } from \"../../components/ExternalLink\";\nimport { LoadingSpinner } from \"../../components/LoadingSpinner\";\nimport { RtlExample } from \"./examples/RtlGrid.example\";\nimport { useContacts } from \"./hooks/useContacts\";\n\nexport default function RTLGridsRoute() {\n  const contacts = useContacts();\n\n  return (\n    <Box direction=\"column\" gap={4}>\n      <div>\n        Grids can also display right to left languages (like Arabic). The grid\n        components check the{\" \"}\n        <ExternalLink href=\"https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/dir\">\n          <code>dir</code> attribute\n        </ExternalLink>{\" \"}\n        to determine content directionality.\n      </div>\n      <div>\n        Using the same data as from the previous example, here is a grid\n        rendered right to left.\n      </div>\n      <Block className=\"h-50 overflow-auto\" data-focus-within=\"bold\">\n        {!contacts.length && <LoadingSpinner />}\n        <RtlExample contacts={contacts} />\n      </Block>\n      <Code html={RtlGridMarkdown.html} />\n    </Box>\n  );\n}\n"],"names":["RtlExample","contacts","jsx","Grid","cellComponent","CellComponent","cellProps","columnCount","columnWidth","dir","rowCount","length","rowHeight","columnIndex","rowIndex","style","content","indexToColumn","jsxs","className","children","RTLGridsRoute","useContacts","Box","direction","gap","ExternalLink","href","Block","LoadingSpinner","Code","html","RtlGridMarkdown"],"mappings":"qmKASA,SAASA,GAAWC,SAAEA,IACpB,OACEC,EAAAA,IAACC,EAAA,CACCC,cAAeC,EACfC,UAAW,CAAEL,YACbM,YAAa,GACbC,cACAC,IAAI,MACJC,SAAUT,EAASU,OACnBC,UAAW,IAGjB,CAOA,SAASP,GAAcJ,SACrBA,EAAAY,YACAA,EAAAC,SACAA,EAAAC,MACAA,IAIA,MACMC,EADUf,EAASa,GACDG,EAAcJ,IAEtC,SACEK,KAAC,MAAA,CAAIC,UAAU,wBAAwBJ,QACrCK,SAAA,GAAAlB,IAAC,OAAKkB,SAAAJ,MACNE,KAAC,QAAA,CAAMC,UAAU,iBAAiBC,SAAA,CAAA,OAC3BN,EAAS,SAAOD,OAI7B,CCtCA,SAAwBQ,IACtB,MAAMpB,EAAWqB,IAEjB,OACEJ,EAAAA,KAACK,EAAA,CAAIC,UAAU,SAASC,IAAK,EAC3BL,SAAA,CAAAF,OAAC,MAAA,CAAIE,SAAA,CAAA,8FAEkB,MACrBF,KAACQ,EAAA,CAAaC,KAAK,oFACjBP,SAAA,GAAAlB,IAAC,QAAKkB,SAAA,QAAU,gBACF,IAAI,4CAGtBlB,IAAC,OAAIkB,SAAA,6FAILF,EAAAA,KAACU,EAAA,CAAMT,UAAU,qBAAqB,oBAAkB,OACrDC,SAAA,EAACnB,EAASU,cAAWkB,EAAA,CAAA,GACtB3B,MAACF,GAAWC,kBAEdC,IAAC4B,EAAA,CAAKC,KAAMC,MAGlB"}

package/docs/assets/RenderingGridRoute-BvlK0VIG.js

@@ -1,2 +0,0 @@
-import{j as s,B as a,C as n,E as p}from"./index-3R9tv3eW.js";import{B as t}from"./arePropsEqual-MBk0PiJi.js";import{C as c}from"./Code-BJ6U_DpT.js";import{C as e}from"./ContinueLink-Mq4XOwMu.js";import{H as i}from"./Header-DM8OHOd_.js";import{L as l}from"./LoadingSpinner-CcA45RYo.js";import{C as o}from"./CellComponent.example-ChzwGLAD.js";import{c as d,u as r}from"./useContacts-C-Fuwn4U.js";import{G as h}from"./Grid-Cio8auWD.js";import"./contacts-Bxrk2JS2.js";const u='<div style="min-height: 1rem; padding-left: 2ch; text-indent: -2ch;"><span class="tok-keyword">import</span><span class=""> </span><span class="tok-punctuation">{</span><span class=""> </span><span class="tok-keyword">type</span><span class=""> </span><span class="tok-variableName tok-definition">CellComponentProps</span><span class=""> </span><span class="tok-punctuation">}</span><span class=""> </span><span class="tok-keyword">from</span><span class=""> </span><span class="tok-string">"react-window"</span><span class="tok-punctuation">;</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 2ch; text-indent: -2ch;"><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 2ch; text-indent: -2ch;"><span class=""></span><span class="tok-keyword">function</span><span class=""> </span><span class="tok-variableName tok-definition">CellComponent</span><span class="tok-punctuation">(</span><span class="tok-punctuation">{</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 4ch; text-indent: -2ch;"><span class=""></span><span class="tok-propertyName">contacts</span><span class="tok-punctuation">,</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 4ch; text-indent: -2ch;"><span class=""></span><span class="tok-propertyName">columnIndex</span><span class="tok-punctuation">,</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 4ch; text-indent: -2ch;"><span class=""></span><span class="tok-propertyName">rowIndex</span><span class="tok-punctuation">,</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 4ch; text-indent: -2ch;"><span class=""></span><span class="tok-propertyName">style</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 2ch; text-indent: -2ch;"><span class=""></span><span class="tok-punctuation">}</span><span class="tok-punctuation">:</span><span class=""> </span><span class="tok-typeName">CellComponentProps</span><span class="">&#60;</span><span class="tok-punctuation">{</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 4ch; text-indent: -2ch;"><span class=""></span><span class="tok-propertyName tok-definition">contacts</span><span class="tok-punctuation">:</span><span class=""> </span><span class="tok-typeName">Contact</span><span class="tok-punctuation">[</span><span class="tok-punctuation">]</span><span class="tok-punctuation">;</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 2ch; text-indent: -2ch;"><span class=""></span><span class="tok-punctuation">}</span><span class="">&#62;</span><span class="tok-punctuation">)</span><span class=""> </span><span class="tok-punctuation">{</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 4ch; text-indent: -2ch;"><span class=""></span><span class="tok-keyword">const</span><span class=""> </span><span class="tok-variableName tok-definition">address</span><span class=""> </span><span class="tok-operator">=</span><span class=""> </span><span class="tok-variableName">contacts</span><span class="tok-punctuation">[</span><span class="tok-variableName">rowIndex</span><span class="tok-punctuation">]</span><span class="tok-punctuation">;</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 4ch; text-indent: -2ch;"><span class=""></span><span class="tok-keyword">const</span><span class=""> </span><span class="tok-variableName tok-definition">content</span><span class=""> </span><span class="tok-operator">=</span><span class=""> </span><span class="tok-variableName">address</span><span class="tok-punctuation">[</span><span class="tok-variableName">indexToColumn</span><span class="tok-punctuation">(</span><span class="tok-variableName">columnIndex</span><span class="tok-punctuation">)</span><span class="tok-punctuation">]</span><span class="tok-punctuation">;</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 2ch; text-indent: -2ch;"><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 4ch; text-indent: -2ch;"><span class=""></span><span class="tok-keyword">return</span><span class=""> </span><span class="tok-punctuation">(</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 6ch; text-indent: -2ch;"><span class=""></span><span class="tok-punctuation">&#60;</span><span class="tok-typeName">div</span><span class=""> </span><span class="tok-propertyName">className</span><span class="tok-operator">=</span><span class="tok-string">"truncate"</span><span class=""> </span><span class="tok-propertyName">style</span><span class="tok-operator">=</span><span class="tok-punctuation">{</span><span class="tok-variableName">style</span><span class="tok-punctuation">}</span><span class="tok-punctuation">&#62;</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 8ch; text-indent: -2ch;"><span class=""></span><span class="tok-punctuation">{</span><span class="tok-variableName">content</span><span class="tok-punctuation">}</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 6ch; text-indent: -2ch;"><span class=""></span><span class="tok-punctuation">&#60;/</span><span class="tok-typeName">div</span><span class="tok-punctuation">&#62;</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 4ch; text-indent: -2ch;"><span class=""></span><span class="tok-punctuation">)</span><span class="tok-punctuation">;</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 2ch; text-indent: -2ch;"><span class=""></span><span class="tok-punctuation">}</span></div>',k='<div style="min-height: 1rem; padding-left: 2ch; text-indent: -2ch;"><span class="tok-keyword">function</span><span class=""> </span><span class="tok-variableName tok-definition">columnWidth</span><span class="tok-punctuation">(</span><span class="tok-variableName tok-definition">index</span><span class="tok-punctuation">:</span><span class=""> </span><span class="tok-typeName">number</span><span class="tok-punctuation">)</span><span class=""> </span><span class="tok-punctuation">{</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 4ch; text-indent: -2ch;"><span class=""></span><span class="tok-keyword">switch</span><span class=""> </span><span class="tok-punctuation">(</span><span class="tok-variableName">indexToColumn</span><span class="tok-punctuation">(</span><span class="tok-variableName">index</span><span class="tok-punctuation">)</span><span class="tok-punctuation">)</span><span class=""> </span><span class="tok-punctuation">{</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 6ch; text-indent: -2ch;"><span class=""></span><span class="tok-keyword">case</span><span class=""> </span><span class="tok-string">"address"</span><span class="tok-punctuation">:</span><span class=""> </span><span class="tok-punctuation">{</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 8ch; text-indent: -2ch;"><span class=""></span><span class="tok-keyword">return</span><span class=""> </span><span class="tok-number">250</span><span class="tok-punctuation">;</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 6ch; text-indent: -2ch;"><span class=""></span><span class="tok-punctuation">}</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 6ch; text-indent: -2ch;"><span class=""></span><span class="tok-keyword">case</span><span class=""> </span><span class="tok-string">"email"</span><span class="tok-punctuation">:</span><span class=""> </span><span class="tok-punctuation">{</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 8ch; text-indent: -2ch;"><span class=""></span><span class="tok-keyword">return</span><span class=""> </span><span class="tok-number">300</span><span class="tok-punctuation">;</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 6ch; text-indent: -2ch;"><span class=""></span><span class="tok-punctuation">}</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 6ch; text-indent: -2ch;"><span class=""></span><span class="tok-keyword">case</span><span class=""> </span><span class="tok-string">"job_title"</span><span class="tok-punctuation">:</span><span class=""> </span><span class="tok-punctuation">{</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 8ch; text-indent: -2ch;"><span class=""></span><span class="tok-keyword">return</span><span class=""> </span><span class="tok-number">150</span><span class="tok-punctuation">;</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 6ch; text-indent: -2ch;"><span class=""></span><span class="tok-punctuation">}</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 6ch; text-indent: -2ch;"><span class=""></span><span class="tok-keyword">case</span><span class=""> </span><span class="tok-string">"timezone"</span><span class="tok-punctuation">:</span><span class=""> </span><span class="tok-punctuation">{</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 8ch; text-indent: -2ch;"><span class=""></span><span class="tok-keyword">return</span><span class=""> </span><span class="tok-number">200</span><span class="tok-punctuation">;</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 6ch; text-indent: -2ch;"><span class=""></span><span class="tok-punctuation">}</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 6ch; text-indent: -2ch;"><span class=""></span><span class="tok-keyword">case</span><span class=""> </span><span class="tok-string">"zip"</span><span class="tok-punctuation">:</span><span class=""> </span><span class="tok-punctuation">{</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 8ch; text-indent: -2ch;"><span class=""></span><span class="tok-keyword">return</span><span class=""> </span><span class="tok-number">75</span><span class="tok-punctuation">;</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 6ch; text-indent: -2ch;"><span class=""></span><span class="tok-punctuation">}</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 6ch; text-indent: -2ch;"><span class=""></span><span class="tok-keyword">default</span><span class="tok-punctuation">:</span><span class=""> </span><span class="tok-punctuation">{</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 8ch; text-indent: -2ch;"><span class=""></span><span class="tok-keyword">return</span><span class=""> </span><span class="tok-number">100</span><span class="tok-punctuation">;</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 6ch; text-indent: -2ch;"><span class=""></span><span class="tok-punctuation">}</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 4ch; text-indent: -2ch;"><span class=""></span><span class="tok-punctuation">}</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 2ch; text-indent: -2ch;"><span class=""></span><span class="tok-punctuation">}</span></div>',m='<div style="min-height: 1rem; padding-left: 2ch; text-indent: -2ch;"><span class="tok-keyword">import</span><span class=""> </span><span class="tok-punctuation">{</span><span class=""> </span><span class="tok-variableName tok-definition">Grid</span><span class=""> </span><span class="tok-punctuation">}</span><span class=""> </span><span class="tok-keyword">from</span><span class=""> </span><span class="tok-string">"react-window"</span><span class="tok-punctuation">;</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 2ch; text-indent: -2ch;"><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 2ch; text-indent: -2ch;"><span class=""></span><span class="tok-keyword">function</span><span class=""> </span><span class="tok-variableName tok-definition">Example</span><span class="tok-punctuation">(</span><span class="tok-punctuation">{</span><span class=""> </span><span class="tok-propertyName">contacts</span><span class=""> </span><span class="tok-punctuation">}</span><span class="tok-punctuation">:</span><span class=""> </span><span class="tok-punctuation">{</span><span class=""> </span><span class="tok-propertyName tok-definition">contacts</span><span class="tok-punctuation">:</span><span class=""> </span><span class="tok-typeName">Contact</span><span class="tok-punctuation">[</span><span class="tok-punctuation">]</span><span class=""> </span><span class="tok-punctuation">}</span><span class="tok-punctuation">)</span><span class=""> </span><span class="tok-punctuation">{</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 4ch; text-indent: -2ch;"><span class=""></span><span class="tok-keyword">return</span><span class=""> </span><span class="tok-punctuation">(</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 6ch; text-indent: -2ch;"><span class=""></span><span class="tok-punctuation">&#60;</span><span class="tok-typeName">Grid</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 8ch; text-indent: -2ch;"><span class=""></span><span class="tok-propertyName">cellComponent</span><span class="tok-operator">=</span><span class="tok-punctuation">{</span><span class="tok-variableName">CellComponent</span><span class="tok-punctuation">}</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 8ch; text-indent: -2ch;"><span class=""></span><span class="tok-propertyName">cellProps</span><span class="tok-operator">=</span><span class="tok-punctuation">{</span><span class="tok-punctuation">{</span><span class=""> </span><span class="tok-propertyName tok-definition">contacts</span><span class=""> </span><span class="tok-punctuation">}</span><span class="tok-punctuation">}</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 8ch; text-indent: -2ch;"><span class=""></span><span class="tok-propertyName">columnCount</span><span class="tok-operator">=</span><span class="tok-punctuation">{</span><span class="tok-number">10</span><span class="tok-punctuation">}</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 8ch; text-indent: -2ch;"><span class=""></span><span class="tok-propertyName">columnWidth</span><span class="tok-operator">=</span><span class="tok-punctuation">{</span><span class="tok-variableName">columnWidth</span><span class="tok-punctuation">}</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 8ch; text-indent: -2ch;"><span class=""></span><span class="tok-propertyName">rowCount</span><span class="tok-operator">=</span><span class="tok-punctuation">{</span><span class="tok-variableName">contacts</span><span class="tok-operator">.</span><span class="tok-propertyName">length</span><span class="tok-punctuation">}</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 8ch; text-indent: -2ch;"><span class=""></span><span class="tok-propertyName">rowHeight</span><span class="tok-operator">=</span><span class="tok-punctuation">{</span><span class="tok-number">25</span><span class="tok-punctuation">}</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 6ch; text-indent: -2ch;"><span class=""></span><span class="tok-punctuation">/&#62;</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 4ch; text-indent: -2ch;"><span class=""></span><span class="tok-punctuation">)</span><span class="tok-punctuation">;</span><span class=""></span></div>\n<div style="min-height: 1rem; padding-left: 2ch; text-indent: -2ch;"><span class=""></span><span class="tok-punctuation">}</span></div>';function v({contacts:a}){return s.jsx(h,{cellComponent:o,cellProps:{contacts:a},columnCount:10,columnWidth:d,rowCount:a.length,rowHeight:25})}function g(){const o=r();return s.jsxs(a,{direction:"column",gap:4,children:[s.jsx(i,{section:"Grids",title:"Rendering a grid"}),s.jsxs("div",{children:["Use the ",s.jsx("code",{children:"Grid"})," component to render data with many rows and columns:"]}),s.jsxs(t,{className:"h-50 overflow-auto","data-focus-within":"bold",children:[!o.length&&s.jsx(l,{}),s.jsx(v,{contacts:o})]}),s.jsx("div",{children:"Grids require you to specify the number of rows and columns as well as the width and height of each:"}),s.jsx(c,{html:m}),s.jsx("div",{children:"Column widths and row heights can be either numbers or functions. In the example above, row height is fixed and column width is function that determines the width of the column based on the column index:"}),s.jsx(c,{html:k}),s.jsxs("div",{children:["Lastly grids require a component to render cell, given a column and row index. As with lists, this component receives additional props specified as part of ",s.jsx("code",{children:"cellProps"}),":"]}),s.jsx(c,{html:u}),s.jsx(n,{intent:"warning",children:s.jsxs(a,{direction:"column",gap:4,children:[s.jsxs("div",{children:["Grids require space to render cells. Typically the"," ",s.jsx(p,{href:"https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver",children:"ResizeObserver"})," ","API is used to determine how much space there is available within the parent DOM element."]}),s.jsxs("div",{children:["If an explicit width and height are specified (in pixels) using the"," ",s.jsx("code",{children:"style"})," prop, ",s.jsx("code",{children:"ResizeObserver"})," will not be used."]})]})}),s.jsx(e,{to:"/grid/props",title:"component props"})]})}export{g as default};
-//# sourceMappingURL=RenderingGridRoute-BvlK0VIG.js.map

package/docs/assets/RenderingGridRoute-BvlK0VIG.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"RenderingGridRoute-BvlK0VIG.js","sources":["../../src/routes/grid/examples/Grid.example.tsx","../../src/routes/grid/RenderingGridRoute.tsx"],"sourcesContent":["import json from \"../../../../public/data/contacts.json\";\nimport { CellComponent } from \"./CellComponent.example\";\nimport { columnWidth } from \"./columnWidth.example\";\n\ntype Contact = (typeof json)[0];\n\n// <begin>\n\nimport { Grid } from \"react-window\";\n\nfunction Example({ contacts }: { contacts: Contact[] }) {\n  return (\n    <Grid\n      cellComponent={CellComponent}\n      cellProps={{ contacts }}\n      columnCount={10}\n      columnWidth={columnWidth}\n      rowCount={contacts.length}\n      rowHeight={25}\n    />\n  );\n}\n\n// <end>\n\nexport { CellComponent, Example };\nexport type { Contact };\n","import CellComponentMarkdown from \"../../../public/generated/code-snippets/CellComponent.json\";\nimport columnWidthMarkdown from \"../../../public/generated/code-snippets/columnWidth.json\";\nimport GridMarkdown from \"../../../public/generated/code-snippets/Grid.json\";\nimport { Block } from \"../../components/Block\";\nimport { Box } from \"../../components/Box\";\nimport { Callout } from \"../../components/Callout\";\nimport { Code } from \"../../components/code/Code\";\nimport { ContinueLink } from \"../../components/ContinueLink\";\nimport { ExternalLink } from \"../../components/ExternalLink\";\nimport { Header } from \"../../components/Header\";\nimport { LoadingSpinner } from \"../../components/LoadingSpinner\";\nimport { Example } from \"./examples/Grid.example\";\nimport { useContacts } from \"./hooks/useContacts\";\n\nexport default function RenderingGridRoute() {\n  const contacts = useContacts();\n\n  return (\n    <Box direction=\"column\" gap={4}>\n      <Header section=\"Grids\" title=\"Rendering a grid\" />\n      <div>\n        Use the <code>Grid</code> component to render data with many rows and\n        columns:\n      </div>\n      <Block className=\"h-50 overflow-auto\" data-focus-within=\"bold\">\n        {!contacts.length && <LoadingSpinner />}\n        <Example contacts={contacts} />\n      </Block>\n      <div>\n        Grids require you to specify the number of rows and columns as well as\n        the width and height of each:\n      </div>\n      <Code html={GridMarkdown.html} />\n      <div>\n        Column widths and row heights can be either numbers or functions. In the\n        example above, row height is fixed and column width is function that\n        determines the width of the column based on the column index:\n      </div>\n      <Code html={columnWidthMarkdown.html} />\n      <div>\n        Lastly grids require a component to render cell, given a column and row\n        index. As with lists, this component receives additional props specified\n        as part of <code>cellProps</code>:\n      </div>\n      <Code html={CellComponentMarkdown.html} />\n      <Callout intent=\"warning\">\n        <Box direction=\"column\" gap={4}>\n          <div>\n            Grids require space to render cells. Typically the{\" \"}\n            <ExternalLink href=\"https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver\">\n              ResizeObserver\n            </ExternalLink>{\" \"}\n            API is used to determine how much space there is available within\n            the parent DOM element.\n          </div>\n          <div>\n            If an explicit width and height are specified (in pixels) using the{\" \"}\n            <code>style</code> prop, <code>ResizeObserver</code> will not be\n            used.\n          </div>\n        </Box>\n      </Callout>\n      <ContinueLink to=\"/grid/props\" title=\"component props\" />\n    </Box>\n  );\n}\n"],"names":["Example","contacts","jsx","Grid","cellComponent","CellComponent","cellProps","columnCount","columnWidth","rowCount","length","rowHeight","RenderingGridRoute","useContacts","jsxs","Box","direction","gap","children","Header","section","title","Block","className","LoadingSpinner","Code","html","GridMarkdown","columnWidthMarkdown","CellComponentMarkdown","Callout","intent","ExternalLink","href","ContinueLink","to"],"mappings":"0pgBAUA,SAASA,GAAQC,SAAEA,IACjB,OACEC,EAAAA,IAACC,EAAA,CACCC,cAAeC,EACfC,UAAW,CAAEL,YACbM,YAAa,GACbC,cACAC,SAAUR,EAASS,OACnBC,UAAW,IAGjB,CCPA,SAAwBC,IACtB,MAAMX,EAAWY,IAEjB,OACEC,EAAAA,KAACC,EAAA,CAAIC,UAAU,SAASC,IAAK,EAC3BC,SAAA,CAAAhB,EAAAA,IAACiB,EAAA,CAAOC,QAAQ,QAAQC,MAAM,4BAC7B,MAAA,CAAIH,SAAA,CAAA,aACKhB,IAAC,QAAKgB,SAAA,SAAW,2DAG3BJ,EAAAA,KAACQ,EAAA,CAAMC,UAAU,qBAAqB,oBAAkB,OACrDL,SAAA,EAACjB,EAASS,cAAWc,EAAA,CAAA,GACtBtB,MAACF,GAAQC,kBAEXC,IAAC,OAAIgB,SAAA,2GAILhB,IAACuB,EAAA,CAAKC,KAAMC,MACZzB,IAAC,OAAIgB,SAAA,kNAKLhB,IAACuB,EAAA,CAAKC,KAAME,WACX,MAAA,CAAIV,SAAA,CAAA,iKAGQhB,IAAC,QAAKgB,SAAA,cAAgB,SAEnChB,IAACuB,EAAA,CAAKC,KAAMG,IACZ3B,EAAAA,IAAC4B,GAAQC,OAAO,UACdb,gBAACH,EAAA,CAAIC,UAAU,SAASC,IAAK,EAC3BC,SAAA,CAAAJ,OAAC,MAAA,CAAII,SAAA,CAAA,qDACgD,IACnDhB,EAAAA,IAAC8B,EAAA,CAAaC,KAAK,kEAAkEf,SAAA,mBAErE,IAAI,sGAIrB,MAAA,CAAIA,SAAA,CAAA,sEACiE,MACpEhB,IAAC,QAAKgB,SAAA,UAAY,YAAOhB,IAAC,QAAKgB,SAAA,mBAAqB,6BAK1DhB,EAAAA,IAACgC,EAAA,CAAaC,GAAG,cAAcd,MAAM,sBAG3C"}

package/docs/assets/ScratchpadRoute-wzxynGR2.js

@@ -1,2 +0,0 @@
-import{r as e,j as t,B as n,c as l}from"./index-3R9tv3eW.js";import{G as o}from"./Grid-Cio8auWD.js";import{B as s}from"./arePropsEqual-MBk0PiJi.js";import{S as a}from"./Select-BtAY4kA-.js";const r=e.useState,c=t=>e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",height:"24px",viewBox:"0 -960 960 960",width:"24px",fill:"#e3e3e3",...t},e.createElement("path",{d:"m424-424-86-86q-11-11-28-11t-28 11q-11 11-11 28t11 28l114 114q12 12 28 12t28-12l226-226q11-11 11-28t-11-28q-11-11-28-11t-28 11L424-424ZM200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h560q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H200Z"})),i=t=>e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",height:"24px",viewBox:"0 -960 960 960",width:"24px",fill:"#e3e3e3",...t},e.createElement("path",{d:"M320-440h320q17 0 28.5-11.5T680-480q0-17-11.5-28.5T640-520H320q-17 0-28.5 11.5T280-480q0 17 11.5 28.5T320-440ZM200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h560q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H200Z"})),d=t=>e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",height:"24px",viewBox:"0 -960 960 960",width:"24px",fill:"#e3e3e3",...t},e.createElement("path",{d:"M200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h560q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H200Z"}));function u({checked:e,children:n,className:l,indeterminate:o,onChange:s,...a}){let r,u;return o?(r=i,u="fill-white"):e?(r=c,u="fill-blue-600"):(r=d,u="fill-slate-600"),t.jsxs("label",{className:`cursor-pointer rounded-lg flex flex-row items-center outline-none group ${l}`,"data-focus-within":!0,...a,children:[t.jsx("input",{checked:e,className:"w-0 h-0",onChange:e=>{s(e.currentTarget.checked)},type:"checkbox"}),t.jsx(r,{className:u}),n&&t.jsxs(t.Fragment,{children:[" ",n]})]})}function m({children:e,className:n,onChange:l,value:o,...s}){return t.jsx("input",{className:`rounded-md bg-black/30 border border-2 border-transparent py-1 px-2 outline-none focus:border-emerald-300 ${n}`,"data-focus":!0,onChange:e=>{l(e.currentTarget.value)},value:o,...s,children:e})}const h=["auto","center","end","smart","start"].map(e=>({label:`align: ${e}`,value:e}));function x(){const[l,c]=e.useState(!1),[i,d]=e.useState(),[x,p]=e.useState(),[w,v]=r(null),[f,q]=e.useState(h[0]);return t.jsxs(n,{direction:"column",gap:4,children:[t.jsxs(n,{align:"center",direction:"row",gap:4,onKeyDown:e=>{if("Enter"===e.key)void 0!==i&&void 0!==x?w?.scrollToCell({columnAlign:f.value,columnIndex:i,rowAlign:f.value,rowIndex:x}):void 0!==i?w?.scrollToColumn({align:f.value,index:i}):void 0!==x&&w?.scrollToRow({align:f.value,index:x})},children:[t.jsx(a,{className:"flex-1",onChange:q,options:h,placeholder:"Align",value:f}),t.jsx(u,{checked:l,onChange:c}),t.jsx(m,{autoFocus:!0,className:"grow",min:0,max:99,onChange:e=>{const t=parseInt(e);d(isNaN(t)?void 0:t)},placeholder:"Column",step:1,type:"number",value:void 0===i?"":""+i}),t.jsx(m,{autoFocus:!0,className:"grow",min:0,max:99,onChange:e=>{const t=parseInt(e);p(isNaN(t)?void 0:t)},placeholder:"Row",step:1,type:"number",value:void 0===x?"":""+x})]}),t.jsx(s,{className:"w-full h-100","data-focus-within":"bold",children:t.jsx(o,{cellComponent:g,cellProps:{focusedColumnIndex:i,focusedRowIndex:x},columnCount:100,columnWidth:75,dir:l?"rtl":void 0,gridRef:v,rowCount:100,rowHeight:35},l?"rtl":"ltr")})]})}function g({columnIndex:e,focusedColumnIndex:n,focusedRowIndex:o,rowIndex:s,style:a}){return t.jsxs("div",{className:l("flex items-center justify-center text-xs",{"bg-slate-900":e%2==s%2,"bg-slate-800":e===n||s===o}),style:a,children:["row ",s,", col ",e]})}export{x as default};
-//# sourceMappingURL=ScratchpadRoute-wzxynGR2.js.map

package/docs/assets/ScratchpadRoute-wzxynGR2.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ScratchpadRoute-wzxynGR2.js","sources":["../../lib/components/grid/useGridCallbackRef.ts","../../public/svgs/checkbox-checked.svg?react","../../public/svgs/checkbox-indeterminate.svg?react","../../public/svgs/checkbox-unchecked.svg?react","../../src/components/Checkbox.tsx","../../src/components/Input.tsx","../../src/routes/ScratchpadRoute.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport type { GridImperativeAPI } from \"./types\";\n\n/**\n * Convenience hook to return a properly typed ref callback for the Grid component.\n *\n * Use this hook when you need to share the ref with another component or hook.\n */\nexport const useGridCallbackRef =\n  useState as typeof useState<GridImperativeAPI | null>;\n","import * as React from \"react\";\nconst SvgCheckboxChecked = (props) => /* @__PURE__ */ React.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", height: \"24px\", viewBox: \"0 -960 960 960\", width: \"24px\", fill: \"#e3e3e3\", ...props }, /* @__PURE__ */ React.createElement(\"path\", { d: \"m424-424-86-86q-11-11-28-11t-28 11q-11 11-11 28t11 28l114 114q12 12 28 12t28-12l226-226q11-11 11-28t-11-28q-11-11-28-11t-28 11L424-424ZM200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h560q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H200Z\" }));\nexport default SvgCheckboxChecked;\n","import * as React from \"react\";\nconst SvgCheckboxIndeterminate = (props) => /* @__PURE__ */ React.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", height: \"24px\", viewBox: \"0 -960 960 960\", width: \"24px\", fill: \"#e3e3e3\", ...props }, /* @__PURE__ */ React.createElement(\"path\", { d: \"M320-440h320q17 0 28.5-11.5T680-480q0-17-11.5-28.5T640-520H320q-17 0-28.5 11.5T280-480q0 17 11.5 28.5T320-440ZM200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h560q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H200Z\" }));\nexport default SvgCheckboxIndeterminate;\n","import * as React from \"react\";\nconst SvgCheckboxUnchecked = (props) => /* @__PURE__ */ React.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", height: \"24px\", viewBox: \"0 -960 960 960\", width: \"24px\", fill: \"#e3e3e3\", ...props }, /* @__PURE__ */ React.createElement(\"path\", { d: \"M200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h560q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H200Z\" }));\nexport default SvgCheckboxUnchecked;\n","import {\n  type FunctionComponent,\n  type HTMLAttributes,\n  type PropsWithChildren,\n  type SVGProps\n} from \"react\";\nimport CheckedIcon from \"../../public/svgs/checkbox-checked.svg?react\";\nimport IndeterminateIcon from \"../../public/svgs/checkbox-indeterminate.svg?react\";\nimport UncheckedIcon from \"../../public/svgs/checkbox-unchecked.svg?react\";\n\nexport function Checkbox({\n  checked,\n  children,\n  className,\n  indeterminate,\n  onChange,\n  ...rest\n}: PropsWithChildren<\n  Omit<HTMLAttributes<HTMLElement>, \"defaultChecked\" | \"onChange\"> & {\n    checked: boolean;\n    className?: string;\n    indeterminate?: boolean;\n    onChange: (value: boolean) => void;\n  }\n>) {\n  let IconElement: FunctionComponent<SVGProps<SVGSVGElement>>;\n  let iconClassName: string;\n  if (indeterminate) {\n    IconElement = IndeterminateIcon;\n    iconClassName = \"fill-white\";\n  } else if (checked) {\n    IconElement = CheckedIcon;\n    iconClassName = \"fill-blue-600\";\n  } else {\n    IconElement = UncheckedIcon;\n    iconClassName = \"fill-slate-600\";\n  }\n\n  return (\n    <label\n      className={`cursor-pointer rounded-lg flex flex-row items-center outline-none group ${className}`}\n      data-focus-within\n      {...rest}\n    >\n      <input\n        checked={checked}\n        className=\"w-0 h-0\"\n        onChange={(event) => {\n          onChange(event.currentTarget.checked);\n        }}\n        type=\"checkbox\"\n      />\n      <IconElement className={iconClassName} />\n      {children && <>&nbsp;{children}</>}\n    </label>\n  );\n}\n","import type { InputHTMLAttributes, PropsWithChildren } from \"react\";\n\nexport function Input<Type extends string>({\n  children,\n  className,\n  onChange,\n  value,\n  ...rest\n}: PropsWithChildren<\n  Omit<InputHTMLAttributes<HTMLInputElement>, \"onChange\"> & {\n    className?: string;\n    onChange: (value: Type) => void;\n    value: Type;\n  }\n>) {\n  return (\n    <input\n      className={`rounded-md bg-black/30 border border-2 border-transparent py-1 px-2 outline-none focus:border-emerald-300 ${className}`}\n      data-focus\n      onChange={(event) => {\n        onChange(event.currentTarget.value as Type);\n      }}\n      value={value}\n      {...rest}\n    >\n      {children}\n    </input>\n  );\n}\n","import { useState } from \"react\";\nimport {\n  Grid,\n  useGridCallbackRef,\n  type Align,\n  type CellComponentProps\n} from \"react-window\";\nimport { Block } from \"../components/Block\";\nimport { Box } from \"../components/Box\";\nimport { Checkbox } from \"../components/Checkbox\";\nimport { Input } from \"../components/Input\";\nimport { Select, type Option } from \"../components/Select\";\nimport { cn } from \"../utils/cn\";\n\nconst ALIGNMENTS: Option<Align>[] = (\n  [\"auto\", \"center\", \"end\", \"smart\", \"start\"] satisfies Align[]\n).map((value) => ({\n  label: `align: ${value}`,\n  value\n}));\n\nexport default function ScratchpadRoute() {\n  const [rtl, setRtl] = useState(false);\n  const [columnIndex, setColumnIndex] = useState<number | undefined>();\n  const [rowIndex, setRowIndex] = useState<number | undefined>();\n  const [gridRef, setGridRef] = useGridCallbackRef(null);\n  const [align, setAlign] = useState(ALIGNMENTS[0]);\n\n  return (\n    <Box direction=\"column\" gap={4}>\n      <Box\n        align=\"center\"\n        direction=\"row\"\n        gap={4}\n        onKeyDown={(event) => {\n          switch (event.key) {\n            case \"Enter\": {\n              if (columnIndex !== undefined && rowIndex !== undefined) {\n                gridRef?.scrollToCell({\n                  columnAlign: align.value,\n                  columnIndex,\n                  rowAlign: align.value,\n                  rowIndex\n                });\n              } else if (columnIndex !== undefined) {\n                gridRef?.scrollToColumn({\n                  align: align.value,\n                  index: columnIndex\n                });\n              } else if (rowIndex !== undefined) {\n                gridRef?.scrollToRow({\n                  align: align.value,\n                  index: rowIndex\n                });\n              }\n              break;\n            }\n          }\n        }}\n      >\n        <Select\n          className=\"flex-1\"\n          onChange={setAlign}\n          options={ALIGNMENTS}\n          placeholder=\"Align\"\n          value={align}\n        />\n        <Checkbox checked={rtl} onChange={setRtl} />\n        <Input\n          autoFocus\n          className=\"grow\"\n          min={0}\n          max={99}\n          onChange={(value) => {\n            const parsed = parseInt(value);\n            setColumnIndex(isNaN(parsed) ? undefined : parsed);\n          }}\n          placeholder=\"Column\"\n          step={1}\n          type=\"number\"\n          value={columnIndex === undefined ? \"\" : \"\" + columnIndex}\n        />\n        <Input\n          autoFocus\n          className=\"grow\"\n          min={0}\n          max={99}\n          onChange={(value) => {\n            const parsed = parseInt(value);\n            setRowIndex(isNaN(parsed) ? undefined : parsed);\n          }}\n          placeholder=\"Row\"\n          step={1}\n          type=\"number\"\n          value={rowIndex === undefined ? \"\" : \"\" + rowIndex}\n        />\n      </Box>\n      <Block className=\"w-full h-100\" data-focus-within=\"bold\">\n        <Grid\n          cellComponent={CellComponent}\n          cellProps={{\n            focusedColumnIndex: columnIndex,\n            focusedRowIndex: rowIndex\n          }}\n          columnCount={100}\n          columnWidth={75}\n          dir={rtl ? \"rtl\" : undefined}\n          key={rtl ? \"rtl\" : \"ltr\"}\n          gridRef={setGridRef}\n          rowCount={100}\n          rowHeight={35}\n        />\n      </Block>\n    </Box>\n  );\n}\n\nfunction CellComponent({\n  columnIndex,\n  focusedColumnIndex,\n  focusedRowIndex,\n  rowIndex,\n  style\n}: CellComponentProps<{\n  focusedColumnIndex: number | undefined;\n  focusedRowIndex: number | undefined;\n}>) {\n  return (\n    <div\n      className={cn(\"flex items-center justify-center text-xs\", {\n        \"bg-slate-900\": columnIndex % 2 === rowIndex % 2,\n        \"bg-slate-800\":\n          columnIndex === focusedColumnIndex || rowIndex === focusedRowIndex\n      })}\n      style={style}\n    >\n      row {rowIndex}, col {columnIndex}\n    </div>\n  );\n}\n"],"names":["useGridCallbackRef","useState","SvgCheckboxChecked","props","React.createElement","xmlns","height","viewBox","width","fill","d","SvgCheckboxIndeterminate","SvgCheckboxUnchecked","Checkbox","checked","children","className","indeterminate","onChange","rest","IconElement","iconClassName","IndeterminateIcon","CheckedIcon","UncheckedIcon","jsxs","jsx","event","currentTarget","type","Fragment","Input","value","ALIGNMENTS","map","label","ScratchpadRoute","rtl","setRtl","columnIndex","setColumnIndex","rowIndex","setRowIndex","gridRef","setGridRef","align","setAlign","Box","direction","gap","onKeyDown","key","scrollToCell","columnAlign","rowAlign","scrollToColumn","index","scrollToRow","Select","options","placeholder","autoFocus","min","max","parsed","parseInt","isNaN","step","Block","Grid","cellComponent","CellComponent","cellProps","focusedColumnIndex","focusedRowIndex","columnCount","columnWidth","dir","rowCount","rowHeight","style","cn"],"mappings":"6LAQO,MAAMA,EACXC,EAAAA,SCRIC,EAAsBC,GAA0BC,EAAAA,cAAoB,MAAO,CAAEC,MAAO,6BAA8BC,OAAQ,OAAQC,QAAS,iBAAkBC,MAAO,OAAQC,KAAM,aAAcN,GAAyBC,gBAAoB,OAAQ,CAAEM,EAAG,oQCA1PC,EAA4BR,GAA0BC,EAAAA,cAAoB,MAAO,CAAEC,MAAO,6BAA8BC,OAAQ,OAAQC,QAAS,iBAAkBC,MAAO,OAAQC,KAAM,aAAcN,GAAyBC,gBAAoB,OAAQ,CAAEM,EAAG,2OCAhQE,EAAwBT,GAA0BC,EAAAA,cAAoB,MAAO,CAAEC,MAAO,6BAA8BC,OAAQ,OAAQC,QAAS,iBAAkBC,MAAO,OAAQC,KAAM,aAAcN,GAAyBC,gBAAoB,OAAQ,CAAEM,EAAG,6HCS3P,SAASG,GAASC,QACvBA,EAAAC,SACAA,EAAAC,UACAA,EAAAC,cACAA,EAAAC,SACAA,KACGC,IASH,IAAIC,EACAC,EAYJ,OAXIJ,GACFG,EAAcE,EACdD,EAAgB,cACPP,GACTM,EAAcG,EACdF,EAAgB,kBAEhBD,EAAcI,EACdH,EAAgB,kBAIhBI,EAAAA,KAAC,QAAA,CACCT,UAAW,2EAA2EA,IACtF,qBAAiB,KACbG,EAEJJ,SAAA,CAAAW,EAAAA,IAAC,QAAA,CACCZ,UACAE,UAAU,UACVE,SAAWS,IACTT,EAASS,EAAMC,cAAcd,UAE/Be,KAAK,eAEPH,IAACN,EAAA,CAAYJ,UAAWK,IACvBN,GAAYU,EAAAA,KAAAK,WAAA,CAAEf,SAAA,CAAA,IAAOA,OAG5B,CCtDO,SAASgB,GAA2BhB,SACzCA,EAAAC,UACAA,EAAAE,SACAA,EAAAc,MACAA,KACGb,IAQH,OACEO,EAAAA,IAAC,QAAA,CACCV,UAAW,6GAA6GA,IACxH,cAAU,EACVE,SAAWS,IACTT,EAASS,EAAMC,cAAcI,QAE/BA,WACIb,EAEHJ,YAGP,CCdA,MAAMkB,EACJ,CAAC,OAAQ,SAAU,MAAO,QAAS,SACnCC,IAAKF,IAAA,CACLG,MAAO,UAAUH,IACjBA,WAGF,SAAwBI,IACtB,MAAOC,EAAKC,GAAUrC,EAAAA,UAAS,IACxBsC,EAAaC,GAAkBvC,cAC/BwC,EAAUC,GAAezC,cACzB0C,EAASC,GAAc5C,EAAmB,OAC1C6C,EAAOC,GAAY7C,EAAAA,SAASgC,EAAW,IAE9C,OACER,EAAAA,KAACsB,EAAA,CAAIC,UAAU,SAASC,IAAK,EAC3BlC,SAAA,CAAAU,EAAAA,KAACsB,EAAA,CACCF,MAAM,SACNG,UAAU,MACVC,IAAK,EACLC,UAAYvB,IACV,GACO,UADCA,EAAMwB,SAEU,IAAhBZ,QAA0C,IAAbE,EAC/BE,GAASS,aAAa,CACpBC,YAAaR,EAAMb,MACnBO,cACAe,SAAUT,EAAMb,MAChBS,kBAEuB,IAAhBF,EACTI,GAASY,eAAe,CACtBV,MAAOA,EAAMb,MACbwB,MAAOjB,SAEa,IAAbE,GACTE,GAASc,YAAY,CACnBZ,MAAOA,EAAMb,MACbwB,MAAOf,KAQjB1B,SAAA,CAAAW,EAAAA,IAACgC,EAAA,CACC1C,UAAU,SACVE,SAAU4B,EACVa,QAAS1B,EACT2B,YAAY,QACZ5B,MAAOa,IAETnB,EAAAA,IAACb,EAAA,CAASC,QAASuB,EAAKnB,SAAUoB,IAClCZ,EAAAA,IAACK,EAAA,CACC8B,WAAS,EACT7C,UAAU,OACV8C,IAAK,EACLC,IAAK,GACL7C,SAAWc,IACT,MAAMgC,EAASC,SAASjC,GACxBQ,EAAe0B,MAAMF,QAAU,EAAYA,IAE7CJ,YAAY,SACZO,KAAM,EACNtC,KAAK,SACLG,WAAuB,IAAhBO,EAA4B,GAAK,GAAKA,IAE/Cb,EAAAA,IAACK,EAAA,CACC8B,WAAS,EACT7C,UAAU,OACV8C,IAAK,EACLC,IAAK,GACL7C,SAAWc,IACT,MAAMgC,EAASC,SAASjC,GACxBU,EAAYwB,MAAMF,QAAU,EAAYA,IAE1CJ,YAAY,MACZO,KAAM,EACNtC,KAAK,SACLG,WAAoB,IAAbS,EAAyB,GAAK,GAAKA,OAG9Cf,EAAAA,IAAC0C,EAAA,CAAMpD,UAAU,eAAe,oBAAkB,OAChDD,SAAAW,EAAAA,IAAC2C,EAAA,CACCC,cAAeC,EACfC,UAAW,CACTC,mBAAoBlC,EACpBmC,gBAAiBjC,GAEnBkC,YAAa,IACbC,YAAa,GACbC,IAAKxC,EAAM,WAAQ,EAEnBM,QAASC,EACTkC,SAAU,IACVC,UAAW,IAHN1C,EAAM,MAAQ,WAQ7B,CAEA,SAASkC,GAAchC,YACrBA,EAAAkC,mBACAA,EAAAC,gBACAA,EAAAjC,SACAA,EAAAuC,MACAA,IAKA,OACEvD,EAAAA,KAAC,MAAA,CACCT,UAAWiE,EAAG,2CAA4C,CACxD,eAAgB1C,EAAc,GAAME,EAAW,EAC/C,eACEF,IAAgBkC,GAAsBhC,IAAaiC,IAEvDM,QACDjE,SAAA,CAAA,OACM0B,EAAS,SAAOF,IAG3B"}

package/docs/assets/Select-BtAY4kA-.js

@@ -1,2 +0,0 @@
-import{r as e,b as t,o as n,K as r,d as o,p as i,R as l,m as s,e as a,y as u,n as c,f as d,g as f,l as p,h,u as m,i as v,k as g,s as b,q as y,t as x,v as w,w as S,x as E,z as O,A as R,D as C,T as P,G as T,H as L,O as M,I as F,J as k,M as I,N as A,P as D,_ as N,Q as j,S as H,$ as _,U as B,V as W,W as V,j as $,c as U}from"./index-3R9tv3eW.js";function z({title:t,titleId:n,...r},o){return e.createElement("svg",Object.assign({xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 20 20",fill:"currentColor","aria-hidden":"true","data-slot":"icon",ref:o,"aria-labelledby":n},r),t?e.createElement("title",{id:n},t):null,e.createElement("path",{fillRule:"evenodd",d:"M10.53 3.47a.75.75 0 0 0-1.06 0L6.22 6.72a.75.75 0 0 0 1.06 1.06L10 5.06l2.72 2.72a.75.75 0 1 0 1.06-1.06l-3.25-3.25Zm-4.31 9.81 3.25 3.25a.75.75 0 0 0 1.06 0l3.25-3.25a.75.75 0 1 0-1.06-1.06L10 14.94l-2.72-2.72a.75.75 0 0 0-1.06 1.06Z",clipRule:"evenodd"}))}const q=e.forwardRef(z);var K=t();function Y(e={},t=null,n=[]){for(let[r,o]of Object.entries(e))Q(n,G(t,r),o);return n}function G(e,t){return e?e+"["+t+"]":t}function Q(e,t,n){if(Array.isArray(n))for(let[r,o]of n.entries())Q(e,G(t,r.toString()),o);else n instanceof Date?e.push([t,n.toISOString()]):"boolean"==typeof n?e.push([t,n?"1":"0"]):"string"==typeof n?e.push([t,n]):"number"==typeof n?e.push([t,`${n}`]):null==n?e.push([t,""]):Y(n,t,e)}var X,J=((X=J||{})[X.None=1]="None",X[X.Focusable=2]="Focusable",X[X.Hidden=4]="Hidden",X);let Z=r(function(e,t){var n;let{features:r=1,...i}=e,l={ref:t,"aria-hidden":!(2&~r)||(null!=(n=i["aria-hidden"])?n:void 0),hidden:!(4&~r)||void 0,style:{position:"fixed",top:1,left:1,width:1,height:0,padding:0,margin:-1,overflow:"hidden",clip:"rect(0, 0, 0, 0)",whiteSpace:"nowrap",borderWidth:"0",...!(4&~r)&&!!(2&~r)&&{display:"none"}}};return o()({ourProps:l,theirProps:i,slot:{},defaultTag:"span",name:"Hidden"})}),ee=e.createContext(null);function te({children:t}){let n=e.useContext(ee);if(!n)return l.createElement(l.Fragment,null,t);let{target:r}=n;return r?K.createPortal(l.createElement(l.Fragment,null,t),r):null}function ne({data:t,form:n,disabled:r,onReset:o,overrides:a}){let[u,c]=e.useState(null),d=i();return e.useEffect(()=>{if(o&&u)return d.addEventListener(u,"reset",o)},[u,n,o]),l.createElement(te,null,l.createElement(re,{setForm:c,formId:n}),Y(t).map(([e,t])=>l.createElement(Z,{features:J.Hidden,...s({key:e,as:"input",type:"hidden",hidden:!0,readOnly:!0,form:n,disabled:r,name:e,value:t,...a})})))}function re({setForm:t,formId:n}){return e.useEffect(()=>{if(n){let e=document.getElementById(n);e&&t(e)}},[t,n]),n?null:l.createElement(Z,{features:J.Hidden,as:"input",type:"hidden",hidden:!0,readOnly:!0,ref:e=>{if(!e)return;let n=e.closest("form");n&&t(n)}})}let oe=e.createContext(void 0);function ie(){return e.useContext(oe)}let le=e.createContext(null);function se(){let t=e.useContext(le);if(null===t){let e=new Error("You used a <Description /> component, but it is not inside a relevant parent.");throw Error.captureStackTrace&&Error.captureStackTrace(e,se),e}return t}le.displayName="DescriptionContext";let ae=r(function(t,n){let r=e.useId(),i=a(),{id:l=`headlessui-description-${r}`,...s}=t,d=se(),f=u(n);c(()=>d.register(l),[l,d.register]);let p=i||!1,h=e.useMemo(()=>({...d.slot,disabled:p}),[d.slot,p]),m={ref:f,...d.props,id:l};return o()({ourProps:m,theirProps:s,slot:h,defaultTag:"p",name:d.name||"Description"})});Object.assign(ae,{});let ue=e.createContext(null);function ce(){let t=e.useContext(ue);if(null===t){let e=new Error("You used a <Label /> component, but it is not inside a relevant parent.");throw Error.captureStackTrace&&Error.captureStackTrace(e,ce),e}return t}function de(t){var n,r,o;let i=null!=(r=null==(n=e.useContext(ue))?void 0:n.value)?r:void 0;return(null!=(o=null==t?void 0:t.length)?o:0)>0?[i,...t].filter(Boolean).join(" "):i}ue.displayName="LabelContext";let fe=r(function(t,r){var i;let l=e.useId(),s=ce(),h=ie(),m=a(),{id:v=`headlessui-label-${l}`,htmlFor:g=(null!=h?h:null==(i=s.props)?void 0:i.htmlFor),passive:b=!1,...y}=t,x=u(r);c(()=>s.register(v),[v,s.register]);let w=n(e=>{let t=e.currentTarget;if((e.target===e.currentTarget||!d(e.target))&&(f(t)&&e.preventDefault(),s.props&&"onClick"in s.props&&"function"==typeof s.props.onClick&&s.props.onClick(e),f(t))){let e=document.getElementById(t.htmlFor);if(e){let t=e.getAttribute("disabled");if("true"===t||""===t)return;let n=e.getAttribute("aria-disabled");if("true"===n||""===n)return;(p(e)&&("file"===e.type||"radio"===e.type||"checkbox"===e.type)||"radio"===e.role||"checkbox"===e.role||"switch"===e.role)&&e.click(),e.focus({preventScroll:!0})}}}),S=m||!1,E=e.useMemo(()=>({...s.slot,disabled:S}),[s.slot,S]),O={ref:x,...s.props,id:v,htmlFor:g,onClick:w};return b&&("onClick"in O&&(delete O.htmlFor,delete O.onClick),"onClick"in y&&delete y.onClick),o()({ourProps:O,theirProps:y,slot:E,defaultTag:g?"label":"div",name:s.name||"Label"})}),pe=Object.assign(fe,{});function he(e,t){return null!==e&&null!==t&&"object"==typeof e&&"object"==typeof t&&"id"in e&&"id"in t?e.id===t.id:e===t}function me(t,n=!1){let[r,o]=e.useReducer(()=>({}),{}),i=e.useMemo(()=>function(e){if(null===e)return{width:0,height:0};let{width:t,height:n}=e.getBoundingClientRect();return{width:t,height:n}}(t),[t,r]);return c(()=>{if(!t)return;let e=new ResizeObserver(o);return e.observe(t),()=>{e.disconnect()}},[t]),n?{width:`${i.width}px`,height:`${i.height}px`}:i}let ve=class extends Map{constructor(e){super(),this.factory=e}get(e){let t=super.get(e);return void 0===t&&(t=this.factory(e),this.set(e,t)),t}};var ge,be,ye,xe=Object.defineProperty,we=(e,t,n)=>(((e,t,n)=>{t in e?xe(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n})(e,t+"",n),n),Se=(e,t,n)=>{if(!t.has(e))throw TypeError("Cannot "+n)},Ee=(e,t,n)=>(Se(e,t,"read from private field"),n?n.call(e):t.get(e)),Oe=(e,t,n)=>{if(t.has(e))throw TypeError("Cannot add the same private member more than once");t instanceof WeakSet?t.add(e):t.set(e,n)},Re=(e,t,n,r)=>(Se(e,t,"write to private field"),t.set(e,n),n);let Ce=class{constructor(e){Oe(this,ge,{}),Oe(this,be,new ve(()=>new Set)),Oe(this,ye,new Set),we(this,"disposables",h()),Re(this,ge,e)}dispose(){this.disposables.dispose()}get state(){return Ee(this,ge)}subscribe(e,t){let n={selector:e,callback:t,current:e(Ee(this,ge))};return Ee(this,ye).add(n),this.disposables.add(()=>{Ee(this,ye).delete(n)})}on(e,t){return Ee(this,be).get(e).add(t),this.disposables.add(()=>{Ee(this,be).get(e).delete(t)})}send(e){let t=this.reduce(Ee(this,ge),e);if(t!==Ee(this,ge)){Re(this,ge,t);for(let e of Ee(this,ye)){let t=e.selector(Ee(this,ge));Pe(e.current,t)||(e.current=t,e.callback(t))}for(let t of Ee(this,be).get(e.type))t(Ee(this,ge),e)}}};function Pe(e,t){return!!Object.is(e,t)||"object"==typeof e&&null!==e&&"object"==typeof t&&null!==t&&(Array.isArray(e)&&Array.isArray(t)?e.length===t.length&&Te(e[Symbol.iterator](),t[Symbol.iterator]()):e instanceof Map&&t instanceof Map||e instanceof Set&&t instanceof Set?e.size===t.size&&Te(e.entries(),t.entries()):!(!Le(e)||!Le(t))&&Te(Object.entries(e)[Symbol.iterator](),Object.entries(t)[Symbol.iterator]()))}function Te(e,t){for(;;){let n=e.next(),r=t.next();if(n.done&&r.done)return!0;if(n.done||r.done||!Object.is(n.value,r.value))return!1}}function Le(e){if("[object Object]"!==Object.prototype.toString.call(e))return!1;let t=Object.getPrototypeOf(e);return null===t||null===Object.getPrototypeOf(t)}function Me(e){let[t,n]=e(),r=h();return(...e)=>{t(...e),r.dispose(),r.microTask(n)}}ge=new WeakMap,be=new WeakMap,ye=new WeakMap;var Fe,ke=Object.defineProperty,Ie=(e,t,n)=>(((e,t,n)=>{t in e?ke(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n})(e,"symbol"!=typeof t?t+"":t,n),n),Ae=((Fe=Ae||{})[Fe.Push=0]="Push",Fe[Fe.Pop=1]="Pop",Fe);let De={0(e,t){let n=t.id,r=e.stack,o=e.stack.indexOf(n);if(-1!==o){let t=e.stack.slice();return t.splice(o,1),t.push(n),r=t,{...e,stack:r}}return{...e,stack:[...e.stack,n]}},1(e,t){let n=t.id,r=e.stack.indexOf(n);if(-1===r)return e;let o=e.stack.slice();return o.splice(r,1),{...e,stack:o}}},Ne=class e extends Ce{constructor(){super(...arguments),Ie(this,"actions",{push:e=>this.send({type:0,id:e}),pop:e=>this.send({type:1,id:e})}),Ie(this,"selectors",{isTop:(e,t)=>e.stack[e.stack.length-1]===t,inStack:(e,t)=>e.stack.includes(t)})}static new(){return new e({stack:[]})}reduce(e,t){return m(t.type,De,e,t)}};const je=new ve(()=>Ne.new());var He,_e,Be={exports:{}},We={};var Ve=(_e||(_e=1,Be.exports=function(){if(He)return We;He=1;var e=v(),t="function"==typeof Object.is?Object.is:function(e,t){return e===t&&(0!==e||1/e==1/t)||e!=e&&t!=t},n=e.useSyncExternalStore,r=e.useRef,o=e.useEffect,i=e.useMemo,l=e.useDebugValue;return We.useSyncExternalStoreWithSelector=function(e,s,a,u,c){var d=r(null);if(null===d.current){var f={hasValue:!1,value:null};d.current=f}else f=d.current;d=i(function(){function e(e){if(!o){if(o=!0,n=e,e=u(e),void 0!==c&&f.hasValue){var i=f.value;if(c(i,e))return r=i}return r=e}if(i=r,t(n,e))return i;var l=u(e);return void 0!==c&&c(i,l)?(n=e,i):(n=e,r=l)}var n,r,o=!1,i=void 0===a?null:a;return[function(){return e(s())},null===i?void 0:function(){return e(i())}]},[s,a,u,c]);var p=n(e,d[0],d[1]);return o(function(){f.hasValue=!0,f.value=p},[p]),l(p),p},We}()),Be.exports);function $e(e,t,r=Pe){return Ve.useSyncExternalStoreWithSelector(n(t=>e.subscribe(Ue,t)),n(()=>e.state),n(()=>e.state),n(t),r)}function Ue(e){return e}function ze(t,n){let r=e.useId(),o=je.get(n),[i,l]=$e(o,e.useCallback(e=>[o.selectors.isTop(e,r),o.selectors.inStack(e,r)],[o,r]));return c(()=>{if(t)return o.actions.push(r),()=>o.actions.pop(r)},[o,t,r]),!!t&&(!l||i)}let qe=new Map,Ke=new Map;function Ye(e){var t;let n=null!=(t=Ke.get(e))?t:0;return Ke.set(e,n+1),0!==n||(qe.set(e,{"aria-hidden":e.getAttribute("aria-hidden"),inert:e.inert}),e.setAttribute("aria-hidden","true"),e.inert=!0),()=>Ge(e)}function Ge(e){var t;let n=null!=(t=Ke.get(e))?t:1;if(1===n?Ke.delete(e):Ke.set(e,n-1),1!==n)return;let r=qe.get(e);r&&(null===r["aria-hidden"]?e.removeAttribute("aria-hidden"):e.setAttribute("aria-hidden",r["aria-hidden"]),e.inert=r.inert,qe.delete(e))}let Qe=["[contentEditable=true]","[tabindex]","a[href]","area[href]","button:not([disabled])","iframe","input:not([disabled])","select:not([disabled])","textarea:not([disabled])"].map(e=>`${e}:not([tabindex='-1'])`).join(","),Xe=["[data-autofocus]"].map(e=>`${e}:not([tabindex='-1'])`).join(",");var Je,Ze,et=((Ze=et||{})[Ze.First=1]="First",Ze[Ze.Previous=2]="Previous",Ze[Ze.Next=4]="Next",Ze[Ze.Last=8]="Last",Ze[Ze.WrapAround=16]="WrapAround",Ze[Ze.NoScroll=32]="NoScroll",Ze[Ze.AutoFocus=64]="AutoFocus",Ze),tt=((Je=tt||{})[Je.Error=0]="Error",Je[Je.Overflow=1]="Overflow",Je[Je.Success=2]="Success",Je[Je.Underflow=3]="Underflow",Je),nt=(e=>(e[e.Previous=-1]="Previous",e[e.Next=1]="Next",e))(nt||{});function rt(e=document.body){return null==e?[]:Array.from(e.querySelectorAll(Qe)).sort((e,t)=>Math.sign((e.tabIndex||Number.MAX_SAFE_INTEGER)-(t.tabIndex||Number.MAX_SAFE_INTEGER)))}var ot=(e=>(e[e.Strict=0]="Strict",e[e.Loose=1]="Loose",e))(ot||{});function it(e,t=0){var n;return e!==(null==(n=g(e))?void 0:n.body)&&m(t,{0:()=>e.matches(Qe),1(){let t=e;for(;null!==t;){if(t.matches(Qe))return!0;t=t.parentElement}return!1}})}var lt=(e=>(e[e.Keyboard=0]="Keyboard",e[e.Mouse=1]="Mouse",e))(lt||{});"undefined"!=typeof window&&"undefined"!=typeof document&&(document.addEventListener("keydown",e=>{e.metaKey||e.altKey||e.ctrlKey||(document.documentElement.dataset.headlessuiFocusVisible="")},!0),document.addEventListener("click",e=>{1===e.detail?delete document.documentElement.dataset.headlessuiFocusVisible:0===e.detail&&(document.documentElement.dataset.headlessuiFocusVisible="")},!0));let st=["textarea","input"].join(",");function at(e,t=e=>e){return e.slice().sort((e,n)=>{let r=t(e),o=t(n);if(null===r||null===o)return 0;let i=r.compareDocumentPosition(o);return i&Node.DOCUMENT_POSITION_FOLLOWING?-1:i&Node.DOCUMENT_POSITION_PRECEDING?1:0})}function ut(e,t){return function(e,t,{sorted:n=!0,relativeTo:r=null,skipElements:o=[]}={}){let i=Array.isArray(e)?e.length>0?e[0].ownerDocument:document:e.ownerDocument,l=Array.isArray(e)?n?at(e):e:64&t?function(e=document.body){return null==e?[]:Array.from(e.querySelectorAll(Xe)).sort((e,t)=>Math.sign((e.tabIndex||Number.MAX_SAFE_INTEGER)-(t.tabIndex||Number.MAX_SAFE_INTEGER)))}(e):rt(e);o.length>0&&l.length>1&&(l=l.filter(e=>!o.some(t=>null!=t&&"current"in t?(null==t?void 0:t.current)===e:t===e))),r=null!=r?r:i.activeElement;let s,a=(()=>{if(5&t)return 1;if(10&t)return-1;throw new Error("Missing Focus.First, Focus.Previous, Focus.Next or Focus.Last")})(),u=(()=>{if(1&t)return 0;if(2&t)return Math.max(0,l.indexOf(r))-1;if(4&t)return Math.max(0,l.indexOf(r))+1;if(8&t)return l.length-1;throw new Error("Missing Focus.First, Focus.Previous, Focus.Next or Focus.Last")})(),c=32&t?{preventScroll:!0}:{},d=0,f=l.length;do{if(d>=f||d+f<=0)return 0;let e=u+d;if(16&t)e=(e+f)%f;else{if(e<0)return 3;if(e>=f)return 1}s=l[e],null==s||s.focus(c),d+=a}while(s!==i.activeElement);return 6&t&&function(e){var t,n;return null!=(n=null==(t=null==e?void 0:e.matches)?void 0:t.call(e,st))&&n}(s)&&s.select(),2}(rt(),t,{relativeTo:e})}function ct(){return/iPhone/gi.test(window.navigator.platform)||/Mac/gi.test(window.navigator.platform)&&window.navigator.maxTouchPoints>0}function dt(){return ct()||/Android/gi.test(window.navigator.userAgent)}function ft(t,n,r,o){let i=b(r);e.useEffect(()=>{if(t)return document.addEventListener(n,e,o),()=>document.removeEventListener(n,e,o);function e(e){i.current(e)}},[t,n,o])}function pt(t,n,r){let o=b(r),i=e.useCallback(function(e,t){if(e.defaultPrevented)return;let r=t(e);if(null===r||!r.getRootNode().contains(r)||!r.isConnected)return;let i=function e(t){return"function"==typeof t?e(t()):Array.isArray(t)||t instanceof Set?t:[t]}(n);for(let n of i)if(null!==n&&(n.contains(r)||e.composed&&e.composedPath().includes(n)))return;return!it(r,ot.Loose)&&-1!==r.tabIndex&&e.preventDefault(),o.current(e,r)},[o,n]),l=e.useRef(null);ft(t,"pointerdown",e=>{var t,n;dt()||(l.current=(null==(n=null==(t=e.composedPath)?void 0:t.call(e))?void 0:n[0])||e.target)},!0),ft(t,"pointerup",e=>{if(dt()||!l.current)return;let t=l.current;return l.current=null,i(e,()=>t)},!0);let s=e.useRef({x:0,y:0});ft(t,"touchstart",e=>{s.current.x=e.touches[0].clientX,s.current.y=e.touches[0].clientY},!0),ft(t,"touchend",e=>{let t=e.changedTouches[0].clientX,n=e.changedTouches[0].clientY;if(!(Math.abs(t-s.current.x)>=30||Math.abs(n-s.current.y)>=30))return i(e,()=>x(e.target)?e.target:null)},!0),function(t,n,r,o){let i=b(r);e.useEffect(()=>{if(t)return window.addEventListener(n,e,o),()=>window.removeEventListener(n,e,o);function e(e){i.current(e)}},[t,n,o])}(t,"blur",e=>i(e,()=>w(window.document.activeElement)?window.document.activeElement:null),!0)}function ht(...t){return e.useMemo(()=>g(...t),[...t])}var mt=(e=>(e[e.Ignore=0]="Ignore",e[e.Select=1]="Select",e[e.Close=2]="Close",e))(mt||{});const vt={Ignore:{kind:0},Select:e=>({kind:1,target:e}),Close:{kind:2}};function gt(){let e;return{before({doc:t}){var n;let r=t.documentElement,o=null!=(n=t.defaultView)?n:window;e=Math.max(0,o.innerWidth-r.clientWidth)},after({doc:t,d:n}){let r=t.documentElement,o=Math.max(0,r.clientWidth-r.offsetWidth),i=Math.max(0,e-o);n.style(r,"paddingRight",`${i}px`)}}}function bt(e){let t={};for(let n of e)Object.assign(t,n(t));return t}let yt=function(e,t){let n=e(),r=new Set;return{getSnapshot:()=>n,subscribe:e=>(r.add(e),()=>r.delete(e)),dispatch(e,...o){let i=t[e].call(n,...o);i&&(n=i,r.forEach(e=>e()))}}}(()=>new Map,{PUSH(e,t){var n;let r=null!=(n=this.get(e))?n:{doc:e,count:0,d:h(),meta:new Set};return r.count++,r.meta.add(t),this.set(e,r),this},POP(e,t){let n=this.get(e);return n&&(n.count--,n.meta.delete(t)),this},SCROLL_PREVENT({doc:e,d:t,meta:n}){let r={doc:e,d:t,meta:bt(n)},o=[ct()?{before({doc:e,d:t,meta:n}){function r(e){return n.containers.flatMap(e=>e()).some(t=>t.contains(e))}t.microTask(()=>{var n;if("auto"!==window.getComputedStyle(e.documentElement).scrollBehavior){let n=h();n.style(e.documentElement,"scrollBehavior","auto"),t.add(()=>t.microTask(()=>n.dispose()))}let o=null!=(n=window.scrollY)?n:window.pageYOffset,i=null;t.addEventListener(e,"click",t=>{if(x(t.target))try{let n=t.target.closest("a");if(!n)return;let{hash:o}=new URL(n.href),l=e.querySelector(o);x(l)&&!r(l)&&(i=l)}catch{}},!0),t.addEventListener(e,"touchstart",e=>{if(x(e.target)&&E(e.target))if(r(e.target)){let n=e.target;for(;n.parentElement&&r(n.parentElement);)n=n.parentElement;t.style(n,"overscrollBehavior","contain")}else t.style(e.target,"touchAction","none")}),t.addEventListener(e,"touchmove",e=>{if(x(e.target)){if(p(e.target))return;if(r(e.target)){let t=e.target;for(;t.parentElement&&""!==t.dataset.headlessuiPortal&&!(t.scrollHeight>t.clientHeight||t.scrollWidth>t.clientWidth);)t=t.parentElement;""===t.dataset.headlessuiPortal&&e.preventDefault()}else e.preventDefault()}},{passive:!1}),t.add(()=>{var e;let t=null!=(e=window.scrollY)?e:window.pageYOffset;o!==t&&window.scrollTo(0,o),i&&i.isConnected&&(i.scrollIntoView({block:"nearest"}),i=null)})})}}:{},gt(),{before({doc:e,d:t}){t.style(e.documentElement,"overflow","hidden")}}];o.forEach(({before:e})=>null==e?void 0:e(r)),o.forEach(({after:e})=>null==e?void 0:e(r))},SCROLL_ALLOW({d:e}){e.dispose()},TEARDOWN({doc:e}){this.delete(e)}});function xt(t,n,r=()=>({containers:[]})){let o=function(t){return e.useSyncExternalStore(t.subscribe,t.getSnapshot,t.getSnapshot)}(yt),i=n?o.get(n):void 0,l=!!i&&i.count>0;return c(()=>{if(n&&t)return yt.dispatch("PUSH",n,r),()=>yt.dispatch("POP",n,r)},[t,n]),l}function wt(e){return[e.screenX,e.screenY]}function St(){return"undefined"!=typeof window}function Et(e){return Ct(e)?(e.nodeName||"").toLowerCase():"#document"}function Ot(e){var t;return(null==e||null==(t=e.ownerDocument)?void 0:t.defaultView)||window}function Rt(e){var t;return null==(t=(Ct(e)?e.ownerDocument:e.document)||window.document)?void 0:t.documentElement}function Ct(e){return!!St()&&(e instanceof Node||e instanceof Ot(e).Node)}function Pt(e){return!!St()&&(e instanceof Element||e instanceof Ot(e).Element)}function Tt(e){return!!St()&&(e instanceof HTMLElement||e instanceof Ot(e).HTMLElement)}function Lt(e){return!(!St()||"undefined"==typeof ShadowRoot)&&(e instanceof ShadowRoot||e instanceof Ot(e).ShadowRoot)}yt.subscribe(()=>{let e=yt.getSnapshot(),t=new Map;for(let[n]of e)t.set(n,n.documentElement.style.overflow);for(let n of e.values()){let e="hidden"===t.get(n.doc),r=0!==n.count;(r&&!e||!r&&e)&&yt.dispatch(n.count>0?"SCROLL_PREVENT":"SCROLL_ALLOW",n),0===n.count&&yt.dispatch("TEARDOWN",n)}});const Mt=new Set(["inline","contents"]);function Ft(e){const{overflow:t,overflowX:n,overflowY:r,display:o}=$t(e);return/auto|scroll|overlay|hidden|clip/.test(t+r+n)&&!Mt.has(o)}const kt=new Set(["table","td","th"]);function It(e){return kt.has(Et(e))}const At=[":popover-open",":modal"];function Dt(e){return At.some(t=>{try{return e.matches(t)}catch(n){return!1}})}const Nt=["transform","translate","scale","rotate","perspective"],jt=["transform","translate","scale","rotate","perspective","filter"],Ht=["paint","layout","strict","content"];function _t(e){const t=Bt(),n=Pt(e)?$t(e):e;return Nt.some(e=>!!n[e]&&"none"!==n[e])||!!n.containerType&&"normal"!==n.containerType||!t&&!!n.backdropFilter&&"none"!==n.backdropFilter||!t&&!!n.filter&&"none"!==n.filter||jt.some(e=>(n.willChange||"").includes(e))||Ht.some(e=>(n.contain||"").includes(e))}function Bt(){return!("undefined"==typeof CSS||!CSS.supports)&&CSS.supports("-webkit-backdrop-filter","none")}const Wt=new Set(["html","body","#document"]);function Vt(e){return Wt.has(Et(e))}function $t(e){return Ot(e).getComputedStyle(e)}function Ut(e){return Pt(e)?{scrollLeft:e.scrollLeft,scrollTop:e.scrollTop}:{scrollLeft:e.scrollX,scrollTop:e.scrollY}}function zt(e){if("html"===Et(e))return e;const t=e.assignedSlot||e.parentNode||Lt(e)&&e.host||Rt(e);return Lt(t)?t.host:t}function qt(e){const t=zt(e);return Vt(t)?e.ownerDocument?e.ownerDocument.body:e.body:Tt(t)&&Ft(t)?t:qt(t)}function Kt(e,t,n){var r;void 0===t&&(t=[]),void 0===n&&(n=!0);const o=qt(e),i=o===(null==(r=e.ownerDocument)?void 0:r.body),l=Ot(o);if(i){const e=Yt(l);return t.concat(l,l.visualViewport||[],Ft(o)?o:[],e&&n?Kt(e):[])}return t.concat(o,Kt(o,[],n))}function Yt(e){return e.parent&&Object.getPrototypeOf(e.parent)?e.frameElement:null}const Gt=Math.min,Qt=Math.max,Xt=Math.round,Jt=Math.floor,Zt=e=>({x:e,y:e}),en={left:"right",right:"left",bottom:"top",top:"bottom"},tn={start:"end",end:"start"};function nn(e,t,n){return Qt(e,Gt(t,n))}function rn(e,t){return"function"==typeof e?e(t):e}function on(e){return e.split("-")[0]}function ln(e){return e.split("-")[1]}function sn(e){return"x"===e?"y":"x"}function an(e){return"y"===e?"height":"width"}const un=new Set(["top","bottom"]);function cn(e){return un.has(on(e))?"y":"x"}function dn(e){return sn(cn(e))}function fn(e){return e.replace(/start|end/g,e=>tn[e])}const pn=["left","right"],hn=["right","left"],mn=["top","bottom"],vn=["bottom","top"];function gn(e,t,n,r){const o=ln(e);let i=function(e,t,n){switch(e){case"top":case"bottom":return n?t?hn:pn:t?pn:hn;case"left":case"right":return t?mn:vn;default:return[]}}(on(e),"start"===n,r);return o&&(i=i.map(e=>e+"-"+o),t&&(i=i.concat(i.map(fn)))),i}function bn(e){return e.replace(/left|right|bottom|top/g,e=>en[e])}function yn(e){const{x:t,y:n,width:r,height:o}=e;return{width:r,height:o,top:n,left:t,right:t+r,bottom:n+o,x:t,y:n}}function xn(e,t,n){let{reference:r,floating:o}=e;const i=cn(t),l=dn(t),s=an(l),a=on(t),u="y"===i,c=r.x+r.width/2-o.width/2,d=r.y+r.height/2-o.height/2,f=r[s]/2-o[s]/2;let p;switch(a){case"top":p={x:c,y:r.y-o.height};break;case"bottom":p={x:c,y:r.y+r.height};break;case"right":p={x:r.x+r.width,y:d};break;case"left":p={x:r.x-o.width,y:d};break;default:p={x:r.x,y:r.y}}switch(ln(t)){case"start":p[l]-=f*(n&&u?-1:1);break;case"end":p[l]+=f*(n&&u?-1:1)}return p}async function wn(e,t){var n;void 0===t&&(t={});const{x:r,y:o,platform:i,rects:l,elements:s,strategy:a}=e,{boundary:u="clippingAncestors",rootBoundary:c="viewport",elementContext:d="floating",altBoundary:f=!1,padding:p=0}=rn(t,e),h=function(e){return"number"!=typeof e?function(e){return{top:0,right:0,bottom:0,left:0,...e}}(e):{top:e,right:e,bottom:e,left:e}}(p),m=s[f?"floating"===d?"reference":"floating":d],v=yn(await i.getClippingRect({element:null==(n=await(null==i.isElement?void 0:i.isElement(m)))||n?m:m.contextElement||await(null==i.getDocumentElement?void 0:i.getDocumentElement(s.floating)),boundary:u,rootBoundary:c,strategy:a})),g="floating"===d?{x:r,y:o,width:l.floating.width,height:l.floating.height}:l.reference,b=await(null==i.getOffsetParent?void 0:i.getOffsetParent(s.floating)),y=await(null==i.isElement?void 0:i.isElement(b))&&await(null==i.getScale?void 0:i.getScale(b))||{x:1,y:1},x=yn(i.convertOffsetParentRelativeRectToViewportRelativeRect?await i.convertOffsetParentRelativeRectToViewportRelativeRect({elements:s,rect:g,offsetParent:b,strategy:a}):g);return{top:(v.top-x.top+h.top)/y.y,bottom:(x.bottom-v.bottom+h.bottom)/y.y,left:(v.left-x.left+h.left)/y.x,right:(x.right-v.right+h.right)/y.x}}const Sn=new Set(["left","top"]);function En(e){const t=$t(e);let n=parseFloat(t.width)||0,r=parseFloat(t.height)||0;const o=Tt(e),i=o?e.offsetWidth:n,l=o?e.offsetHeight:r,s=Xt(n)!==i||Xt(r)!==l;return s&&(n=i,r=l),{width:n,height:r,$:s}}function On(e){return Pt(e)?e:e.contextElement}function Rn(e){const t=On(e);if(!Tt(t))return Zt(1);const n=t.getBoundingClientRect(),{width:r,height:o,$:i}=En(t);let l=(i?Xt(n.width):n.width)/r,s=(i?Xt(n.height):n.height)/o;return l&&Number.isFinite(l)||(l=1),s&&Number.isFinite(s)||(s=1),{x:l,y:s}}const Cn=Zt(0);function Pn(e){const t=Ot(e);return Bt()&&t.visualViewport?{x:t.visualViewport.offsetLeft,y:t.visualViewport.offsetTop}:Cn}function Tn(e,t,n,r){void 0===t&&(t=!1),void 0===n&&(n=!1);const o=e.getBoundingClientRect(),i=On(e);let l=Zt(1);t&&(r?Pt(r)&&(l=Rn(r)):l=Rn(e));const s=function(e,t,n){return void 0===t&&(t=!1),!(!n||t&&n!==Ot(e))&&t}(i,n,r)?Pn(i):Zt(0);let a=(o.left+s.x)/l.x,u=(o.top+s.y)/l.y,c=o.width/l.x,d=o.height/l.y;if(i){const e=Ot(i),t=r&&Pt(r)?Ot(r):r;let n=e,o=Yt(n);for(;o&&r&&t!==n;){const e=Rn(o),t=o.getBoundingClientRect(),r=$t(o),i=t.left+(o.clientLeft+parseFloat(r.paddingLeft))*e.x,l=t.top+(o.clientTop+parseFloat(r.paddingTop))*e.y;a*=e.x,u*=e.y,c*=e.x,d*=e.y,a+=i,u+=l,n=Ot(o),o=Yt(n)}}return yn({width:c,height:d,x:a,y:u})}function Ln(e,t){const n=Ut(e).scrollLeft;return t?t.left+n:Tn(Rt(e)).left+n}function Mn(e,t,n){void 0===n&&(n=!1);const r=e.getBoundingClientRect();return{x:r.left+t.scrollLeft-(n?0:Ln(e,r)),y:r.top+t.scrollTop}}const Fn=new Set(["absolute","fixed"]);function kn(e,t,n){let r;if("viewport"===t)r=function(e,t){const n=Ot(e),r=Rt(e),o=n.visualViewport;let i=r.clientWidth,l=r.clientHeight,s=0,a=0;if(o){i=o.width,l=o.height;const e=Bt();(!e||e&&"fixed"===t)&&(s=o.offsetLeft,a=o.offsetTop)}return{width:i,height:l,x:s,y:a}}(e,n);else if("document"===t)r=function(e){const t=Rt(e),n=Ut(e),r=e.ownerDocument.body,o=Qt(t.scrollWidth,t.clientWidth,r.scrollWidth,r.clientWidth),i=Qt(t.scrollHeight,t.clientHeight,r.scrollHeight,r.clientHeight);let l=-n.scrollLeft+Ln(e);const s=-n.scrollTop;return"rtl"===$t(r).direction&&(l+=Qt(t.clientWidth,r.clientWidth)-o),{width:o,height:i,x:l,y:s}}(Rt(e));else if(Pt(t))r=function(e,t){const n=Tn(e,!0,"fixed"===t),r=n.top+e.clientTop,o=n.left+e.clientLeft,i=Tt(e)?Rn(e):Zt(1);return{width:e.clientWidth*i.x,height:e.clientHeight*i.y,x:o*i.x,y:r*i.y}}(t,n);else{const n=Pn(e);r={x:t.x-n.x,y:t.y-n.y,width:t.width,height:t.height}}return yn(r)}function In(e,t){const n=zt(e);return!(n===t||!Pt(n)||Vt(n))&&("fixed"===$t(n).position||In(n,t))}function An(e,t,n){const r=Tt(t),o=Rt(t),i="fixed"===n,l=Tn(e,!0,i,t);let s={scrollLeft:0,scrollTop:0};const a=Zt(0);function u(){a.x=Ln(o)}if(r||!r&&!i)if(("body"!==Et(t)||Ft(o))&&(s=Ut(t)),r){const e=Tn(t,!0,i,t);a.x=e.x+t.clientLeft,a.y=e.y+t.clientTop}else o&&u();i&&!r&&o&&u();const c=!o||r||i?Zt(0):Mn(o,s);return{x:l.left+s.scrollLeft-a.x-c.x,y:l.top+s.scrollTop-a.y-c.y,width:l.width,height:l.height}}function Dn(e){return"static"===$t(e).position}function Nn(e,t){if(!Tt(e)||"fixed"===$t(e).position)return null;if(t)return t(e);let n=e.offsetParent;return Rt(e)===n&&(n=n.ownerDocument.body),n}function jn(e,t){const n=Ot(e);if(Dt(e))return n;if(!Tt(e)){let t=zt(e);for(;t&&!Vt(t);){if(Pt(t)&&!Dn(t))return t;t=zt(t)}return n}let r=Nn(e,t);for(;r&&It(r)&&Dn(r);)r=Nn(r,t);return r&&Vt(r)&&Dn(r)&&!_t(r)?n:r||function(e){let t=zt(e);for(;Tt(t)&&!Vt(t);){if(_t(t))return t;if(Dt(t))return null;t=zt(t)}return null}(e)||n}const Hn={convertOffsetParentRelativeRectToViewportRelativeRect:function(e){let{elements:t,rect:n,offsetParent:r,strategy:o}=e;const i="fixed"===o,l=Rt(r),s=!!t&&Dt(t.floating);if(r===l||s&&i)return n;let a={scrollLeft:0,scrollTop:0},u=Zt(1);const c=Zt(0),d=Tt(r);if((d||!d&&!i)&&(("body"!==Et(r)||Ft(l))&&(a=Ut(r)),Tt(r))){const e=Tn(r);u=Rn(r),c.x=e.x+r.clientLeft,c.y=e.y+r.clientTop}const f=!l||d||i?Zt(0):Mn(l,a,!0);return{width:n.width*u.x,height:n.height*u.y,x:n.x*u.x-a.scrollLeft*u.x+c.x+f.x,y:n.y*u.y-a.scrollTop*u.y+c.y+f.y}},getDocumentElement:Rt,getClippingRect:function(e){let{element:t,boundary:n,rootBoundary:r,strategy:o}=e;const i=[..."clippingAncestors"===n?Dt(t)?[]:function(e,t){const n=t.get(e);if(n)return n;let r=Kt(e,[],!1).filter(e=>Pt(e)&&"body"!==Et(e)),o=null;const i="fixed"===$t(e).position;let l=i?zt(e):e;for(;Pt(l)&&!Vt(l);){const t=$t(l),n=_t(l);n||"fixed"!==t.position||(o=null),(i?!n&&!o:!n&&"static"===t.position&&o&&Fn.has(o.position)||Ft(l)&&!n&&In(e,l))?r=r.filter(e=>e!==l):o=t,l=zt(l)}return t.set(e,r),r}(t,this._c):[].concat(n),r],l=i[0],s=i.reduce((e,n)=>{const r=kn(t,n,o);return e.top=Qt(r.top,e.top),e.right=Gt(r.right,e.right),e.bottom=Gt(r.bottom,e.bottom),e.left=Qt(r.left,e.left),e},kn(t,l,o));return{width:s.right-s.left,height:s.bottom-s.top,x:s.left,y:s.top}},getOffsetParent:jn,getElementRects:async function(e){const t=this.getOffsetParent||jn,n=this.getDimensions,r=await n(e.floating);return{reference:An(e.reference,await t(e.floating),e.strategy),floating:{x:0,y:0,width:r.width,height:r.height}}},getClientRects:function(e){return Array.from(e.getClientRects())},getDimensions:function(e){const{width:t,height:n}=En(e);return{width:t,height:n}},getScale:Rn,isElement:Pt,isRTL:function(e){return"rtl"===$t(e).direction}};function _n(e,t){return e.x===t.x&&e.y===t.y&&e.width===t.width&&e.height===t.height}function Bn(e,t,n,r){void 0===r&&(r={});const{ancestorScroll:o=!0,ancestorResize:i=!0,elementResize:l="function"==typeof ResizeObserver,layoutShift:s="function"==typeof IntersectionObserver,animationFrame:a=!1}=r,u=On(e),c=o||i?[...u?Kt(u):[],...Kt(t)]:[];c.forEach(e=>{o&&e.addEventListener("scroll",n,{passive:!0}),i&&e.addEventListener("resize",n)});const d=u&&s?function(e,t){let n,r=null;const o=Rt(e);function i(){var e;clearTimeout(n),null==(e=r)||e.disconnect(),r=null}return function l(s,a){void 0===s&&(s=!1),void 0===a&&(a=1),i();const u=e.getBoundingClientRect(),{left:c,top:d,width:f,height:p}=u;if(s||t(),!f||!p)return;const h={rootMargin:-Jt(d)+"px "+-Jt(o.clientWidth-(c+f))+"px "+-Jt(o.clientHeight-(d+p))+"px "+-Jt(c)+"px",threshold:Qt(0,Gt(1,a))||1};let m=!0;function v(t){const r=t[0].intersectionRatio;if(r!==a){if(!m)return l();r?l(!1,r):n=setTimeout(()=>{l(!1,1e-7)},1e3)}1!==r||_n(u,e.getBoundingClientRect())||l(),m=!1}try{r=new IntersectionObserver(v,{...h,root:o.ownerDocument})}catch(g){r=new IntersectionObserver(v,h)}r.observe(e)}(!0),i}(u,n):null;let f,p=-1,h=null;l&&(h=new ResizeObserver(e=>{let[r]=e;r&&r.target===u&&h&&(h.unobserve(t),cancelAnimationFrame(p),p=requestAnimationFrame(()=>{var e;null==(e=h)||e.observe(t)})),n()}),u&&!a&&h.observe(u),h.observe(t));let m=a?Tn(e):null;return a&&function t(){const r=Tn(e);m&&!_n(m,r)&&n();m=r,f=requestAnimationFrame(t)}(),n(),()=>{var e;c.forEach(e=>{o&&e.removeEventListener("scroll",n),i&&e.removeEventListener("resize",n)}),null==d||d(),null==(e=h)||e.disconnect(),h=null,a&&cancelAnimationFrame(f)}}const Wn=wn,Vn=function(e){return void 0===e&&(e=0),{name:"offset",options:e,async fn(t){var n,r;const{x:o,y:i,placement:l,middlewareData:s}=t,a=await async function(e,t){const{placement:n,platform:r,elements:o}=e,i=await(null==r.isRTL?void 0:r.isRTL(o.floating)),l=on(n),s=ln(n),a="y"===cn(n),u=Sn.has(l)?-1:1,c=i&&a?-1:1,d=rn(t,e);let{mainAxis:f,crossAxis:p,alignmentAxis:h}="number"==typeof d?{mainAxis:d,crossAxis:0,alignmentAxis:null}:{mainAxis:d.mainAxis||0,crossAxis:d.crossAxis||0,alignmentAxis:d.alignmentAxis};return s&&"number"==typeof h&&(p="end"===s?-1*h:h),a?{x:p*c,y:f*u}:{x:f*u,y:p*c}}(t,e);return l===(null==(n=s.offset)?void 0:n.placement)&&null!=(r=s.arrow)&&r.alignmentOffset?{}:{x:o+a.x,y:i+a.y,data:{...a,placement:l}}}}},$n=function(e){return void 0===e&&(e={}),{name:"shift",options:e,async fn(t){const{x:n,y:r,placement:o}=t,{mainAxis:i=!0,crossAxis:l=!1,limiter:s={fn:e=>{let{x:t,y:n}=e;return{x:t,y:n}}},...a}=rn(e,t),u={x:n,y:r},c=await wn(t,a),d=cn(on(o)),f=sn(d);let p=u[f],h=u[d];if(i){const e="y"===f?"bottom":"right";p=nn(p+c["y"===f?"top":"left"],p,p-c[e])}if(l){const e="y"===d?"bottom":"right";h=nn(h+c["y"===d?"top":"left"],h,h-c[e])}const m=s.fn({...t,[f]:p,[d]:h});return{...m,data:{x:m.x-n,y:m.y-r,enabled:{[f]:i,[d]:l}}}}}},Un=function(e){return void 0===e&&(e={}),{name:"flip",options:e,async fn(t){var n,r;const{placement:o,middlewareData:i,rects:l,initialPlacement:s,platform:a,elements:u}=t,{mainAxis:c=!0,crossAxis:d=!0,fallbackPlacements:f,fallbackStrategy:p="bestFit",fallbackAxisSideDirection:h="none",flipAlignment:m=!0,...v}=rn(e,t);if(null!=(n=i.arrow)&&n.alignmentOffset)return{};const g=on(o),b=cn(s),y=on(s)===s,x=await(null==a.isRTL?void 0:a.isRTL(u.floating)),w=f||(y||!m?[bn(s)]:function(e){const t=bn(e);return[fn(e),t,fn(t)]}(s)),S="none"!==h;!f&&S&&w.push(...gn(s,m,h,x));const E=[s,...w],O=await wn(t,v),R=[];let C=(null==(r=i.flip)?void 0:r.overflows)||[];if(c&&R.push(O[g]),d){const e=function(e,t,n){void 0===n&&(n=!1);const r=ln(e),o=dn(e),i=an(o);let l="x"===o?r===(n?"end":"start")?"right":"left":"start"===r?"bottom":"top";return t.reference[i]>t.floating[i]&&(l=bn(l)),[l,bn(l)]}(o,l,x);R.push(O[e[0]],O[e[1]])}if(C=[...C,{placement:o,overflows:R}],!R.every(e=>e<=0)){var P,T;const e=((null==(P=i.flip)?void 0:P.index)||0)+1,t=E[e];if(t){if(!("alignment"===d&&b!==cn(t))||C.every(e=>e.overflows[0]>0&&cn(e.placement)===b))return{data:{index:e,overflows:C},reset:{placement:t}}}let n=null==(T=C.filter(e=>e.overflows[0]<=0).sort((e,t)=>e.overflows[1]-t.overflows[1])[0])?void 0:T.placement;if(!n)switch(p){case"bestFit":{var L;const e=null==(L=C.filter(e=>{if(S){const t=cn(e.placement);return t===b||"y"===t}return!0}).map(e=>[e.placement,e.overflows.filter(e=>e>0).reduce((e,t)=>e+t,0)]).sort((e,t)=>e[1]-t[1])[0])?void 0:L[0];e&&(n=e);break}case"initialPlacement":n=s}if(o!==n)return{reset:{placement:n}}}return{}}}},zn=function(e){return void 0===e&&(e={}),{name:"size",options:e,async fn(t){var n,r;const{placement:o,rects:i,platform:l,elements:s}=t,{apply:a=()=>{},...u}=rn(e,t),c=await wn(t,u),d=on(o),f=ln(o),p="y"===cn(o),{width:h,height:m}=i.floating;let v,g;"top"===d||"bottom"===d?(v=d,g=f===(await(null==l.isRTL?void 0:l.isRTL(s.floating))?"start":"end")?"left":"right"):(g=d,v="end"===f?"top":"bottom");const b=m-c.top-c.bottom,y=h-c.left-c.right,x=Gt(m-c[v],b),w=Gt(h-c[g],y),S=!t.middlewareData.shift;let E=x,O=w;if(null!=(n=t.middlewareData.shift)&&n.enabled.x&&(O=y),null!=(r=t.middlewareData.shift)&&r.enabled.y&&(E=b),S&&!f){const e=Qt(c.left,0),t=Qt(c.right,0),n=Qt(c.top,0),r=Qt(c.bottom,0);p?O=h-2*(0!==e||0!==t?e+t:Qt(c.left,c.right)):E=m-2*(0!==n||0!==r?n+r:Qt(c.top,c.bottom))}await a({...t,availableWidth:O,availableHeight:E});const R=await l.getDimensions(s.floating);return h!==R.width||m!==R.height?{reset:{rects:!0}}:{}}}},qn=(e,t,n)=>{const r=new Map,o={platform:Hn,...n},i={...o.platform,_c:r};return(async(e,t,n)=>{const{placement:r="bottom",strategy:o="absolute",middleware:i=[],platform:l}=n,s=i.filter(Boolean),a=await(null==l.isRTL?void 0:l.isRTL(t));let u=await l.getElementRects({reference:e,floating:t,strategy:o}),{x:c,y:d}=xn(u,r,a),f=r,p={},h=0;for(let m=0;m<s.length;m++){const{name:n,fn:i}=s[m],{x:v,y:g,data:b,reset:y}=await i({x:c,y:d,initialPlacement:r,placement:f,strategy:o,middlewareData:p,rects:u,platform:l,elements:{reference:e,floating:t}});c=null!=v?v:c,d=null!=g?g:d,p={...p,[n]:{...p[n],...b}},y&&h<=50&&(h++,"object"==typeof y&&(y.placement&&(f=y.placement),y.rects&&(u=!0===y.rects?await l.getElementRects({reference:e,floating:t,strategy:o}):y.rects),({x:c,y:d}=xn(u,f,a))),m=-1)}return{x:c,y:d,placement:f,strategy:o,middlewareData:p}})(e,t,{...o,platform:i})};var Kn="undefined"!=typeof document?e.useLayoutEffect:function(){};function Yn(e,t){if(e===t)return!0;if(typeof e!=typeof t)return!1;if("function"==typeof e&&e.toString()===t.toString())return!0;let n,r,o;if(e&&t&&"object"==typeof e){if(Array.isArray(e)){if(n=e.length,n!==t.length)return!1;for(r=n;0!==r--;)if(!Yn(e[r],t[r]))return!1;return!0}if(o=Object.keys(e),n=o.length,n!==Object.keys(t).length)return!1;for(r=n;0!==r--;)if(!{}.hasOwnProperty.call(t,o[r]))return!1;for(r=n;0!==r--;){const n=o[r];if(("_owner"!==n||!e.$$typeof)&&!Yn(e[n],t[n]))return!1}return!0}return e!=e&&t!=t}function Gn(e){if("undefined"==typeof window)return 1;return(e.ownerDocument.defaultView||window).devicePixelRatio||1}function Qn(e,t){const n=Gn(e);return Math.round(t*n)/n}function Xn(t){const n=e.useRef(t);return Kn(()=>{n.current=t}),n}const Jn=(e,t)=>({...Vn(e),options:[e,t]}),Zn=(e,t)=>({...Un(e),options:[e,t]}),er=(e,t)=>({...zn(e),options:[e,t]}),tr={...O},nr=tr.useInsertionEffect||(e=>e());function rr(t){const n=e.useRef(()=>{});return nr(()=>{n.current=t}),e.useCallback(function(){for(var e=arguments.length,t=new Array(e),r=0;r<e;r++)t[r]=arguments[r];return null==n.current?void 0:n.current(...t)},[])}var or="undefined"!=typeof document?e.useLayoutEffect:e.useEffect;let ir=!1,lr=0;const sr=()=>"floating-ui-"+Math.random().toString(36).slice(2,6)+lr++;const ar=tr.useId||function(){const[t,n]=e.useState(()=>ir?sr():void 0);return or(()=>{null==t&&n(sr())},[]),e.useEffect(()=>{ir=!0},[]),t};const ur=e.createContext(null),cr=e.createContext(null),dr="data-floating-ui-focusable";function fr(t){const{open:n=!1,onOpenChange:r,elements:o}=t,i=ar(),l=e.useRef({}),[s]=e.useState(()=>function(){const e=new Map;return{emit(t,n){var r;null==(r=e.get(t))||r.forEach(e=>e(n))},on(t,n){e.set(t,[...e.get(t)||[],n])},off(t,n){var r;e.set(t,(null==(r=e.get(t))?void 0:r.filter(e=>e!==n))||[])}}}()),a=null!=((null==(u=e.useContext(ur))?void 0:u.id)||null);var u;const[c,d]=e.useState(o.reference),f=rr((e,t,n)=>{l.current.openEvent=e?t:void 0,s.emit("openchange",{open:e,event:t,reason:n,nested:a}),null==r||r(e,t,n)}),p=e.useMemo(()=>({setPositionReference:d}),[]),h=e.useMemo(()=>({reference:c||o.reference||null,floating:o.floating||null,domReference:o.reference}),[c,o.reference,o.floating]);return e.useMemo(()=>({dataRef:l,open:n,onOpenChange:f,elements:h,events:s,floatingId:i,refs:p}),[n,f,h,s,i,p])}function pr(t){void 0===t&&(t={});const{nodeId:n}=t,r=fr({...t,elements:{reference:null,floating:null,...t.elements}}),o=t.rootContext||r,i=o.elements,[l,s]=e.useState(null),[a,u]=e.useState(null),c=(null==i?void 0:i.domReference)||l,d=e.useRef(null),f=e.useContext(cr);or(()=>{c&&(d.current=c)},[c]);const p=function(t){void 0===t&&(t={});const{placement:n="bottom",strategy:r="absolute",middleware:o=[],platform:i,elements:{reference:l,floating:s}={},transform:a=!0,whileElementsMounted:u,open:c}=t,[d,f]=e.useState({x:0,y:0,strategy:r,placement:n,middlewareData:{},isPositioned:!1}),[p,h]=e.useState(o);Yn(p,o)||h(o);const[m,v]=e.useState(null),[g,b]=e.useState(null),y=e.useCallback(e=>{e!==E.current&&(E.current=e,v(e))},[]),x=e.useCallback(e=>{e!==O.current&&(O.current=e,b(e))},[]),w=l||m,S=s||g,E=e.useRef(null),O=e.useRef(null),R=e.useRef(d),C=null!=u,P=Xn(u),T=Xn(i),L=Xn(c),M=e.useCallback(()=>{if(!E.current||!O.current)return;const e={placement:n,strategy:r,middleware:p};T.current&&(e.platform=T.current),qn(E.current,O.current,e).then(e=>{const t={...e,isPositioned:!1!==L.current};F.current&&!Yn(R.current,t)&&(R.current=t,K.flushSync(()=>{f(t)}))})},[p,n,r,T,L]);Kn(()=>{!1===c&&R.current.isPositioned&&(R.current.isPositioned=!1,f(e=>({...e,isPositioned:!1})))},[c]);const F=e.useRef(!1);Kn(()=>(F.current=!0,()=>{F.current=!1}),[]),Kn(()=>{if(w&&(E.current=w),S&&(O.current=S),w&&S){if(P.current)return P.current(w,S,M);M()}},[w,S,M,P,C]);const k=e.useMemo(()=>({reference:E,floating:O,setReference:y,setFloating:x}),[y,x]),I=e.useMemo(()=>({reference:w,floating:S}),[w,S]),A=e.useMemo(()=>{const e={position:r,left:0,top:0};if(!I.floating)return e;const t=Qn(I.floating,d.x),n=Qn(I.floating,d.y);return a?{...e,transform:"translate("+t+"px, "+n+"px)",...Gn(I.floating)>=1.5&&{willChange:"transform"}}:{position:r,left:t,top:n}},[r,a,I.floating,d.x,d.y]);return e.useMemo(()=>({...d,update:M,refs:k,elements:I,floatingStyles:A}),[d,M,k,I,A])}({...t,elements:{...i,...a&&{reference:a}}}),h=e.useCallback(e=>{const t=Pt(e)?{getBoundingClientRect:()=>e.getBoundingClientRect(),contextElement:e}:e;u(t),p.refs.setReference(t)},[p.refs]),m=e.useCallback(e=>{(Pt(e)||null===e)&&(d.current=e,s(e)),(Pt(p.refs.reference.current)||null===p.refs.reference.current||null!==e&&!Pt(e))&&p.refs.setReference(e)},[p.refs]),v=e.useMemo(()=>({...p.refs,setReference:m,setPositionReference:h,domReference:d}),[p.refs,m,h]),g=e.useMemo(()=>({...p.elements,domReference:c}),[p.elements,c]),b=e.useMemo(()=>({...p,...o,refs:v,elements:g,nodeId:n}),[p,v,g,n,o]);return or(()=>{o.dataRef.current.floatingContext=b;const e=null==f?void 0:f.nodesRef.current.find(e=>e.id===n);e&&(e.context=b)}),e.useMemo(()=>({...p,context:b,refs:v,elements:g}),[p,v,g,b])}const hr="active",mr="selected";function vr(e,t,n){const r=new Map,o="item"===n;let i=e;if(o&&e){const{[hr]:t,[mr]:n,...r}=e;i=r}return{..."floating"===n&&{tabIndex:-1,[dr]:""},...i,...t.map(t=>{const r=t?t[n]:null;return"function"==typeof r?e?r(e):null:r}).concat(e).reduce((e,t)=>t?(Object.entries(t).forEach(t=>{let[n,i]=t;var l;o&&[hr,mr].includes(n)||(0===n.indexOf("on")?(r.has(n)||r.set(n,[]),"function"==typeof i&&(null==(l=r.get(n))||l.push(i),e[n]=function(){for(var e,t=arguments.length,o=new Array(t),i=0;i<t;i++)o[i]=arguments[i];return null==(e=r.get(n))?void 0:e.map(e=>e(...o)).find(e=>void 0!==e)})):e[n]=i)}),e):e,{})}}function gr(e,t){return{...e,rects:{...e.rects,floating:{...e.rects.floating,height:t}}}}function br(t,n){const{open:r,elements:o}=t,{enabled:i=!0,overflowRef:l,scrollRef:s,onChange:a}=n,u=rr(a),c=e.useRef(!1),d=e.useRef(null),f=e.useRef(null);e.useEffect(()=>{if(!i)return;function e(e){if(e.ctrlKey||!t||null==l.current)return;const n=e.deltaY,r=l.current.top>=-.5,o=l.current.bottom>=-.5,i=t.scrollHeight-t.clientHeight,s=n<0?-1:1,a=n<0?"max":"min";t.scrollHeight<=t.clientHeight||(!r&&n>0||!o&&n<0?(e.preventDefault(),K.flushSync(()=>{u(e=>e+Math[a](n,i*s))})):/firefox/i.test(function(){const e=navigator.userAgentData;return e&&Array.isArray(e.brands)?e.brands.map(e=>{let{brand:t,version:n}=e;return t+"/"+n}).join(" "):navigator.userAgent}())&&(t.scrollTop+=n))}const t=(null==s?void 0:s.current)||o.floating;return r&&t?(t.addEventListener("wheel",e),requestAnimationFrame(()=>{d.current=t.scrollTop,null!=l.current&&(f.current={...l.current})}),()=>{d.current=null,f.current=null,t.removeEventListener("wheel",e)}):void 0},[i,r,o.floating,l,s,u]);const p=e.useMemo(()=>({onKeyDown(){c.current=!0},onWheel(){c.current=!1},onPointerMove(){c.current=!1},onScroll(){const e=(null==s?void 0:s.current)||o.floating;if(l.current&&e&&c.current){if(null!==d.current){const t=e.scrollTop-d.current;(l.current.bottom<-.5&&t<-1||l.current.top<-.5&&t>1)&&K.flushSync(()=>u(e=>e+t))}requestAnimationFrame(()=>{d.current=e.scrollTop})}}}),[o.floating,u,l,s]);return e.useMemo(()=>i?{floating:p}:{},[i,p])}let yr=e.createContext({styles:void 0,setReference:()=>{},setFloating:()=>{},getReferenceProps:()=>({}),getFloatingProps:()=>({}),slot:{}});yr.displayName="FloatingContext";let xr=e.createContext(null);xr.displayName="PlacementContext";function wr({children:t,enabled:r=!0}){let[o,i]=e.useState(null),[l,s]=e.useState(0),a=e.useRef(null),[u,d]=e.useState(null);!function(e){c(()=>{if(!e)return;let t=new MutationObserver(()=>{let t=window.getComputedStyle(e).maxHeight,n=parseFloat(t);if(isNaN(n))return;let r=parseInt(t);isNaN(r)||n!==r&&(e.style.maxHeight=`${Math.ceil(n)}px`)});return t.observe(e,{attributes:!0,attributeFilter:["style"]}),()=>{t.disconnect()}},[e])}(u);let f=r&&null!==o&&null!==u,{to:p="bottom",gap:h=0,offset:m=0,padding:v=0,inner:g}=function(e,t){var n,r,o;let i=Sr(null!=(n=null==e?void 0:e.gap)?n:"var(--anchor-gap, 0)",t),l=Sr(null!=(r=null==e?void 0:e.offset)?r:"var(--anchor-offset, 0)",t),s=Sr(null!=(o=null==e?void 0:e.padding)?o:"var(--anchor-padding, 0)",t);return{...e,gap:i,offset:l,padding:s}}(o,u),[b,x="center"]=p.split(" ");c(()=>{f&&s(0)},[f]);let{refs:w,floatingStyles:S,context:E}=pr({open:f,placement:"selection"===b?"center"===x?"bottom":`bottom-${x}`:"center"===x?`${b}`:`${b}-${x}`,strategy:"absolute",transform:!1,middleware:[Jn({mainAxis:"selection"===b?0:h,crossAxis:m}),(P={padding:v},{...$n(P),options:[P,T]}),"selection"!==b&&Zn({padding:v}),"selection"===b&&g?(C={...g,padding:v,overflowRef:a,offset:l,minItemsVisible:4,referenceOverflowThreshold:v,onFallbackChange(e){var t,n;if(!e)return;let r=E.elements.floating;if(!r)return;let o=parseFloat(getComputedStyle(r).scrollPaddingBottom)||0,i=Math.min(4,r.childElementCount),l=0,a=0;for(let s of null!=(n=null==(t=E.elements.floating)?void 0:t.childNodes)?n:[])if(y(s)){let e=s.offsetTop,t=e+s.clientHeight+o,n=r.scrollTop,u=n+r.clientHeight;if(!(e>=n&&t<=u)){a=Math.max(0,Math.min(t,u)-Math.max(e,n)),l=s.clientHeight;break}i--}i>=1&&s(e=>{let t=l*i-a+o;return e>=t?e:t})}},{name:"inner",options:C,async fn(e){const{listRef:t,overflowRef:n,onFallbackChange:r,offset:o=0,index:i=0,minItemsVisible:l=4,referenceOverflowThreshold:s=0,scrollRef:a,...u}=rn(C,e),{rects:c,elements:{floating:d}}=e,f=t.current[i],p=(null==a?void 0:a.current)||d,h=d.clientTop||p.clientTop,m=0!==d.clientTop,v=0!==p.clientTop,g=d===p;if(!f)return{};const b={...e,...await Jn(-f.offsetTop-d.clientTop-c.reference.height/2-f.offsetHeight/2-o).fn(e)},y=await Wn(gr(b,p.scrollHeight+h+d.clientTop),u),x=await Wn(b,{...u,elementContext:"reference"}),w=Qt(0,y.top),S=b.y+w,E=(p.scrollHeight>p.clientHeight?e=>e:Xt)(Qt(0,p.scrollHeight+(m&&g||v?2*h:0)-w-Qt(0,y.bottom)));if(p.style.maxHeight=E+"px",p.scrollTop=w,r){const e=p.offsetHeight<f.offsetHeight*Gt(l,t.current.length)-1||x.top>=-s||x.bottom>=-s;K.flushSync(()=>r(e))}return n&&(n.current=await Wn(gr({...b,y:S},p.offsetHeight+h+d.clientTop),u)),{y:S}}}):null,er({padding:v,apply({availableWidth:e,availableHeight:t,elements:n}){Object.assign(n.floating.style,{overflow:"auto",maxWidth:`${e}px`,maxHeight:`min(var(--anchor-max-height, 100vh), ${t}px)`})}})].filter(Boolean),whileElementsMounted:Bn}),[O=b,R=x]=E.placement.split("-");var C,P,T;"selection"===b&&(O="selection");let L=e.useMemo(()=>({anchor:[O,R].filter(Boolean).join(" ")}),[O,R]),M=br(E,{overflowRef:a,onChange:s}),{getReferenceProps:F,getFloatingProps:k}=function(t){void 0===t&&(t=[]);const n=t.map(e=>null==e?void 0:e.reference),r=t.map(e=>null==e?void 0:e.floating),o=t.map(e=>null==e?void 0:e.item),i=e.useCallback(e=>vr(e,t,"reference"),n),l=e.useCallback(e=>vr(e,t,"floating"),r),s=e.useCallback(e=>vr(e,t,"item"),o);return e.useMemo(()=>({getReferenceProps:i,getFloatingProps:l,getItemProps:s}),[i,l,s])}([M]),I=n(e=>{d(e),w.setFloating(e)});return e.createElement(xr.Provider,{value:i},e.createElement(yr.Provider,{value:{setFloating:I,setReference:w.setReference,styles:S,getReferenceProps:F,getFloatingProps:k,slot:L}},t))}function Sr(t,r,o=void 0){let l=i(),s=n((e,t)=>{if(null==e)return[o,null];if("number"==typeof e)return[e,null];if("string"==typeof e){if(!t)return[o,null];let n=Or(e,t);return[n,r=>{let o=Er(e);{let i=o.map(e=>window.getComputedStyle(t).getPropertyValue(e));l.requestAnimationFrame(function s(){l.nextFrame(s);let a=!1;for(let[e,n]of o.entries()){let r=window.getComputedStyle(t).getPropertyValue(n);if(i[e]!==r){i[e]=r,a=!0;break}}if(!a)return;let u=Or(e,t);n!==u&&(r(u),n=u)})}return l.dispose}]}return[o,null]}),a=e.useMemo(()=>s(t,r)[0],[t,r]),[u=a,d]=e.useState();return c(()=>{let[e,n]=s(t,r);if(d(e),n)return n(d)},[t,r]),u}function Er(e){let t=/var\((.*)\)/.exec(e);if(t){let e=t[1].indexOf(",");if(-1===e)return[t[1]];let n=t[1].slice(0,e).trim(),r=t[1].slice(e+1).trim();return r?[n,...Er(r)]:[n]}return[]}function Or(e,t){let n=document.createElement("div");t.appendChild(n),n.style.setProperty("margin-top","0px","important"),n.style.setProperty("margin-top",e,"important");let r=parseFloat(window.getComputedStyle(n).marginTop)||0;return t.removeChild(n),r}var Rr,Cr=((Rr=Cr||{})[Rr.First=0]="First",Rr[Rr.Previous=1]="Previous",Rr[Rr.Next=2]="Next",Rr[Rr.Last=3]="Last",Rr[Rr.Specific=4]="Specific",Rr[Rr.Nothing=5]="Nothing",Rr);function Pr(e,t){let n=t.resolveItems();if(n.length<=0)return null;let r=t.resolveActiveIndex(),o=null!=r?r:-1;switch(e.focus){case 0:for(let e=0;e<n.length;++e)if(!t.resolveDisabled(n[e],e,n))return e;return r;case 1:-1===o&&(o=n.length);for(let e=o-1;e>=0;--e)if(!t.resolveDisabled(n[e],e,n))return e;return r;case 2:for(let e=o+1;e<n.length;++e)if(!t.resolveDisabled(n[e],e,n))return e;return r;case 3:for(let e=n.length-1;e>=0;--e)if(!t.resolveDisabled(n[e],e,n))return e;return r;case 4:for(let r=0;r<n.length;++r)if(t.resolveId(n[r],r,n)===e.id)return r;return r;case 5:return null;default:!function(e){throw new Error("Unexpected object: "+e)}(e)}}function Tr(t){let r=n(t),o=e.useRef(!1);e.useEffect(()=>(o.current=!1,()=>{o.current=!0,R(()=>{o.current&&r()})}),[r])}function Lr(){let t=function(){let e="undefined"==typeof document;return"useSyncExternalStore"in O&&O.useSyncExternalStore(()=>()=>{},()=>!1,()=>!e)}(),[n,r]=e.useState(C.isHandoffComplete);return n&&!1===C.isHandoffComplete&&r(!1),e.useEffect(()=>{!0!==n&&r(!0)},[n]),e.useEffect(()=>C.handoff(),[]),!t&&n}let Mr=e.createContext(!1);function Fr(t){let n=e.useContext(Mr),r=e.useContext(Dr),[o,i]=e.useState(()=>{var e;if(!n&&null!==r)return null!=(e=r.current)?e:null;if(C.isServer)return null;let o=null==t?void 0:t.getElementById("headlessui-portal-root");if(o)return o;if(null===t)return null;let i=t.createElement("div");return i.setAttribute("id","headlessui-portal-root"),t.body.appendChild(i)});return e.useEffect(()=>{null!==o&&(null!=t&&t.body.contains(o)||null==t||t.body.appendChild(o))},[o,t]),e.useEffect(()=>{n||null!==r&&i(r.current)},[r,i,n]),o}let kr=e.Fragment,Ir=r(function(t,n){let{ownerDocument:r=null,...i}=t,l=e.useRef(null),s=u(P(e=>{l.current=e}),n),a=ht(l),d=null!=r?r:a,f=Fr(d),[p]=e.useState(()=>{var e;return C.isServer?null:null!=(e=null==d?void 0:d.createElement("div"))?e:null}),h=e.useContext(Nr),m=Lr();c(()=>{!f||!p||f.contains(p)||(p.setAttribute("data-headlessui-portal",""),f.appendChild(p))},[f,p]),c(()=>{if(p&&h)return h.register(p)},[h,p]),Tr(()=>{var e;!f||!p||(S(p)&&f.contains(p)&&f.removeChild(p),f.childNodes.length<=0&&(null==(e=f.parentElement)||e.removeChild(f)))});let v=o();return m&&f&&p?K.createPortal(v({ourProps:{ref:s},theirProps:i,slot:{},defaultTag:kr,name:"Portal"}),p):null});let Ar=e.Fragment,Dr=e.createContext(null);let Nr=e.createContext(null),jr=r(function(e,t){let n=u(t),{enabled:r=!0,ownerDocument:i,...s}=e,a=o();return r?l.createElement(Ir,{...s,ownerDocument:i,ref:n}):a({ourProps:{ref:n},theirProps:s,slot:{},defaultTag:kr,name:"Portal"})}),Hr=r(function(e,t){let{target:n,...r}=e,i={ref:u(t)},s=o();return l.createElement(Dr.Provider,{value:n},s({ourProps:i,theirProps:r,defaultTag:Ar,name:"Popover.Group"}))}),_r=Object.assign(jr,{Group:Hr});function Br(t){var n;return!!(t.enter||t.enterFrom||t.enterTo||t.leave||t.leaveFrom||t.leaveTo)||(null!=(n=t.as)?n:qr)!==e.Fragment||1===l.Children.count(t.children)}let Wr=e.createContext(null);Wr.displayName="TransitionContext";var Vr=(e=>(e.Visible="visible",e.Hidden="hidden",e))(Vr||{});let $r=e.createContext(null);function Ur(e){return"children"in e?Ur(e.children):e.current.filter(({el:e})=>null!==e.current).filter(({state:e})=>"visible"===e).length>0}function zr(t,r){let o=b(t),l=e.useRef([]),s=function(){let t=e.useRef(!1);return c(()=>(t.current=!0,()=>{t.current=!1}),[]),t}(),a=i(),u=n((e,t=F.Hidden)=>{let n=l.current.findIndex(({el:t})=>t===e);-1!==n&&(m(t,{[F.Unmount](){l.current.splice(n,1)},[F.Hidden](){l.current[n].state="hidden"}}),a.microTask(()=>{var e;!Ur(l)&&s.current&&(null==(e=o.current)||e.call(o))}))}),d=n(e=>{let t=l.current.find(({el:t})=>t===e);return t?"visible"!==t.state&&(t.state="visible"):l.current.push({el:e,state:"visible"}),()=>u(e,F.Unmount)}),f=e.useRef([]),p=e.useRef(Promise.resolve()),h=e.useRef({enter:[],leave:[]}),v=n((e,t,n)=>{f.current.splice(0),r&&(r.chains.current[t]=r.chains.current[t].filter(([t])=>t!==e)),null==r||r.chains.current[t].push([e,new Promise(e=>{f.current.push(e)})]),null==r||r.chains.current[t].push([e,new Promise(e=>{Promise.all(h.current[t].map(([e,t])=>t)).then(()=>e())})]),"enter"===t?p.current=p.current.then(()=>null==r?void 0:r.wait.current).then(()=>n(t)):n(t)}),g=n((e,t,n)=>{Promise.all(h.current[t].splice(0).map(([e,t])=>t)).then(()=>{var e;null==(e=f.current.shift())||e()}).then(()=>n(t))});return e.useMemo(()=>({children:l,register:d,unregister:u,onStart:v,onStop:g,wait:p,chains:h}),[d,u,l,v,g,h,p])}$r.displayName="NestingContext";let qr=e.Fragment,Kr=M.RenderStrategy;let Yr=r(function(t,r){let{show:i,appear:s=!1,unmount:a=!0,...d}=t,f=e.useRef(null),p=Br(t),h=u(...p?[f,r]:null===r?[]:[r]);Lr();let m=T();if(void 0===i&&null!==m&&(i=(m&L.Open)===L.Open),void 0===i)throw new Error("A <Transition /> is used but it is missing a `show={true | false}` prop.");let[v,g]=e.useState(i?"visible":"hidden"),b=zr(()=>{i||g("hidden")}),[y,x]=e.useState(!0),w=e.useRef([i]);c(()=>{!1!==y&&w.current[w.current.length-1]!==i&&(w.current.push(i),x(!1))},[w,i]);let S=e.useMemo(()=>({show:i,appear:s,initial:y}),[i,s,y]);c(()=>{i?g("visible"):!Ur(b)&&null!==f.current&&g("hidden")},[i,b]);let E={unmount:a},O=n(()=>{var e;y&&x(!1),null==(e=t.beforeEnter)||e.call(t)}),R=n(()=>{var e;y&&x(!1),null==(e=t.beforeLeave)||e.call(t)}),C=o();return l.createElement($r.Provider,{value:b},l.createElement(Wr.Provider,{value:S},C({ourProps:{...E,as:e.Fragment,children:l.createElement(Gr,{ref:h,...E,...d,beforeEnter:O,beforeLeave:R})},theirProps:{},defaultTag:e.Fragment,features:Kr,visible:"visible"===v,name:"Transition"})))}),Gr=r(function(t,r){var i,a;let{transition:d=!0,beforeEnter:f,afterEnter:p,beforeLeave:h,afterLeave:v,enter:g,enterFrom:b,enterTo:y,entered:x,leave:w,leaveFrom:S,leaveTo:E,...O}=t,[R,C]=e.useState(null),P=e.useRef(null),T=Br(t),M=u(...T?[P,r,C]:null===r?[]:[r]),N=null==(i=O.unmount)||i?F.Unmount:F.Hidden,{show:j,appear:H,initial:_}=function(){let t=e.useContext(Wr);if(null===t)throw new Error("A <Transition.Child /> is used but it is missing a parent <Transition /> or <Transition.Root />.");return t}(),[B,W]=e.useState(j?"visible":"hidden"),V=function(){let t=e.useContext($r);if(null===t)throw new Error("A <Transition.Child /> is used but it is missing a parent <Transition /> or <Transition.Root />.");return t}(),{register:$,unregister:U}=V;c(()=>$(P),[$,P]),c(()=>{if(N===F.Hidden&&P.current)return j&&"visible"!==B?void W("visible"):m(B,{hidden:()=>U(P),visible:()=>$(P)})},[B,P,$,U,j,N]);let z=Lr();c(()=>{if(T&&z&&"visible"===B&&null===P.current)throw new Error("Did you forget to passthrough the `ref` to the actual DOM node?")},[P,B,z,T]);let q=_&&!H,K=H&&j&&_,Y=e.useRef(!1),G=zr(()=>{Y.current||(W("hidden"),U(P))},V),Q=n(e=>{Y.current=!0;let t=e?"enter":"leave";G.onStart(P,t,e=>{"enter"===e?null==f||f():"leave"===e&&(null==h||h())})}),X=n(e=>{let t=e?"enter":"leave";Y.current=!1,G.onStop(P,t,e=>{"enter"===e?null==p||p():"leave"===e&&(null==v||v())}),"leave"===t&&!Ur(G)&&(W("hidden"),U(P))});e.useEffect(()=>{T&&d||(Q(j),X(j))},[j,T,d]);let J=(()=>!(!d||!T||!z||q))(),[,Z]=k(J,R,j,{start:Q,end:X}),ee=s({ref:M,className:(null==(a=A(O.className,K&&g,K&&b,Z.enter&&g,Z.enter&&Z.closed&&b,Z.enter&&!Z.closed&&y,Z.leave&&w,Z.leave&&!Z.closed&&S,Z.leave&&Z.closed&&E,!Z.transition&&j&&x))?void 0:a.trim())||void 0,...I(Z)}),te=0;"visible"===B&&(te|=L.Open),"hidden"===B&&(te|=L.Closed),j&&"hidden"===B&&(te|=L.Opening),!j&&"visible"===B&&(te|=L.Closing);let ne=o();return l.createElement($r.Provider,{value:G},l.createElement(D,{value:te},ne({ourProps:ee,theirProps:O,defaultTag:qr,features:Kr,visible:"visible"===B,name:"Transition.Child"})))}),Qr=r(function(t,n){let r=null!==e.useContext(Wr),o=null!==T();return l.createElement(l.Fragment,null,!r&&o?l.createElement(Yr,{ref:n,...t}):l.createElement(Gr,{ref:n,...t}))}),Xr=Object.assign(Yr,{Child:Qr,Root:Yr});let Jr=/([\u2700-\u27BF]|[\uE000-\uF8FF]|\uD83C[\uDC00-\uDFFF]|\uD83D[\uDC00-\uDFFF]|[\u2011-\u26FF]|\uD83E[\uDD10-\uDDFF])/g;function Zr(e){var t,n;let r=null!=(t=e.innerText)?t:"",o=e.cloneNode(!0);if(!y(o))return r;let i=!1;for(let s of o.querySelectorAll('[hidden],[aria-hidden],[role="img"]'))s.remove(),i=!0;let l=i?null!=(n=o.innerText)?n:"":r;return Jr.test(l)&&(l=l.replace(Jr,"")),l}function eo(t){let r=e.useRef(""),o=e.useRef("");return n(()=>{let e=t.current;if(!e)return"";let n=e.innerText;if(r.current===n)return o.current;let i=function(e){let t=e.getAttribute("aria-label");if("string"==typeof t)return t.trim();let n=e.getAttribute("aria-labelledby");if(n){let e=n.split(" ").map(e=>{let t=document.getElementById(e);if(t){let e=t.getAttribute("aria-label");return"string"==typeof e?e.trim():Zr(t).trim()}return null}).filter(Boolean);if(e.length>0)return e.join(", ")}return Zr(e).trim()}(e).trim().toLowerCase();return r.current=n,o.current=i,i})}var to,no=Object.defineProperty,ro=(e,t,n)=>(((e,t,n)=>{t in e?no(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n})(e,"symbol"!=typeof t?t+"":t,n),n),oo=(e=>(e[e.Open=0]="Open",e[e.Closed=1]="Closed",e))(oo||{}),io=(e=>(e[e.Single=0]="Single",e[e.Multi=1]="Multi",e))(io||{}),lo=(e=>(e[e.Pointer=0]="Pointer",e[e.Other=1]="Other",e))(lo||{}),so=((to=so||{})[to.OpenListbox=0]="OpenListbox",to[to.CloseListbox=1]="CloseListbox",to[to.GoToOption=2]="GoToOption",to[to.Search=3]="Search",to[to.ClearSearch=4]="ClearSearch",to[to.RegisterOptions=5]="RegisterOptions",to[to.UnregisterOptions=6]="UnregisterOptions",to[to.SetButtonElement=7]="SetButtonElement",to[to.SetOptionsElement=8]="SetOptionsElement",to[to.SortOptions=9]="SortOptions",to);function ao(e,t=e=>e){let n=null!==e.activeOptionIndex?e.options[e.activeOptionIndex]:null,r=at(t(e.options.slice()),e=>e.dataRef.current.domRef.current),o=n?r.indexOf(n):null;return-1===o&&(o=null),{options:r,activeOptionIndex:o}}let uo={1:e=>e.dataRef.current.disabled||1===e.listboxState?e:{...e,activeOptionIndex:null,pendingFocus:{focus:Cr.Nothing},listboxState:1,__demoMode:!1},0(e,t){if(e.dataRef.current.disabled||0===e.listboxState)return e;let n=e.activeOptionIndex,{isSelected:r}=e.dataRef.current,o=e.options.findIndex(e=>r(e.dataRef.current.value));return-1!==o&&(n=o),{...e,pendingFocus:t.focus,listboxState:0,activeOptionIndex:n,__demoMode:!1}},2(e,t){var n,r,o,i,l;if(e.dataRef.current.disabled||1===e.listboxState)return e;let s={...e,searchQuery:"",activationTrigger:null!=(n=t.trigger)?n:1,__demoMode:!1};if(t.focus===Cr.Nothing)return{...s,activeOptionIndex:null};if(t.focus===Cr.Specific)return{...s,activeOptionIndex:e.options.findIndex(e=>e.id===t.id)};if(t.focus===Cr.Previous){let n=e.activeOptionIndex;if(null!==n){let i=e.options[n].dataRef.current.domRef,l=Pr(t,{resolveItems:()=>e.options,resolveActiveIndex:()=>e.activeOptionIndex,resolveId:e=>e.id,resolveDisabled:e=>e.dataRef.current.disabled});if(null!==l){let t=e.options[l].dataRef.current.domRef;if((null==(r=i.current)?void 0:r.previousElementSibling)===t.current||null===(null==(o=t.current)?void 0:o.previousElementSibling))return{...s,activeOptionIndex:l}}}}else if(t.focus===Cr.Next){let n=e.activeOptionIndex;if(null!==n){let r=e.options[n].dataRef.current.domRef,o=Pr(t,{resolveItems:()=>e.options,resolveActiveIndex:()=>e.activeOptionIndex,resolveId:e=>e.id,resolveDisabled:e=>e.dataRef.current.disabled});if(null!==o){let t=e.options[o].dataRef.current.domRef;if((null==(i=r.current)?void 0:i.nextElementSibling)===t.current||null===(null==(l=t.current)?void 0:l.nextElementSibling))return{...s,activeOptionIndex:o}}}}let a=ao(e),u=Pr(t,{resolveItems:()=>a.options,resolveActiveIndex:()=>a.activeOptionIndex,resolveId:e=>e.id,resolveDisabled:e=>e.dataRef.current.disabled});return{...s,...a,activeOptionIndex:u}},3:(e,t)=>{if(e.dataRef.current.disabled||1===e.listboxState)return e;let n=""!==e.searchQuery?0:1,r=e.searchQuery+t.value.toLowerCase(),o=(null!==e.activeOptionIndex?e.options.slice(e.activeOptionIndex+n).concat(e.options.slice(0,e.activeOptionIndex+n)):e.options).find(e=>{var t;return!e.dataRef.current.disabled&&(null==(t=e.dataRef.current.textValue)?void 0:t.startsWith(r))}),i=o?e.options.indexOf(o):-1;return-1===i||i===e.activeOptionIndex?{...e,searchQuery:r}:{...e,searchQuery:r,activeOptionIndex:i,activationTrigger:1}},4:e=>e.dataRef.current.disabled||1===e.listboxState||""===e.searchQuery?e:{...e,searchQuery:""},5:(e,t)=>{let n=e.options.concat(t.options),r=e.activeOptionIndex;if(e.pendingFocus.focus!==Cr.Nothing&&(r=Pr(e.pendingFocus,{resolveItems:()=>n,resolveActiveIndex:()=>e.activeOptionIndex,resolveId:e=>e.id,resolveDisabled:e=>e.dataRef.current.disabled})),null===e.activeOptionIndex){let{isSelected:t}=e.dataRef.current;if(t){let e=n.findIndex(e=>null==t?void 0:t(e.dataRef.current.value));-1!==e&&(r=e)}}return{...e,options:n,activeOptionIndex:r,pendingFocus:{focus:Cr.Nothing},pendingShouldSort:!0}},6:(e,t)=>{let n=e.options,r=[],o=new Set(t.options);for(let[i,l]of n.entries())if(o.has(l.id)&&(r.push(i),o.delete(l.id),0===o.size))break;if(r.length>0){n=n.slice();for(let e of r.reverse())n.splice(e,1)}return{...e,options:n,activationTrigger:1}},7:(e,t)=>e.buttonElement===t.element?e:{...e,buttonElement:t.element},8:(e,t)=>e.optionsElement===t.element?e:{...e,optionsElement:t.element},9:e=>e.pendingShouldSort?{...e,...ao(e),pendingShouldSort:!1}:e};class co extends Ce{constructor(e){super(e),ro(this,"actions",{onChange:e=>{let{onChange:t,compare:n,mode:r,value:o}=this.state.dataRef.current;return m(r,{0:()=>null==t?void 0:t(e),1:()=>{let r=o.slice(),i=r.findIndex(t=>n(t,e));return-1===i?r.push(e):r.splice(i,1),null==t?void 0:t(r)}})},registerOption:Me(()=>{let e=[],t=new Set;return[(n,r)=>{t.has(r)||(t.add(r),e.push({id:n,dataRef:r}))},()=>(t.clear(),this.send({type:5,options:e.splice(0)}))]}),unregisterOption:Me(()=>{let e=[];return[t=>e.push(t),()=>{this.send({type:6,options:e.splice(0)})}]}),goToOption:Me(()=>{let e=null;return[(t,n)=>{e={type:2,...t,trigger:n}},()=>e&&this.send(e)]}),closeListbox:()=>{this.send({type:1})},openListbox:e=>{this.send({type:0,focus:e})},selectActiveOption:()=>{if(null!==this.state.activeOptionIndex){let{dataRef:e,id:t}=this.state.options[this.state.activeOptionIndex];this.actions.onChange(e.current.value),this.send({type:2,focus:Cr.Specific,id:t})}},selectOption:e=>{let t=this.state.options.find(t=>t.id===e);t&&this.actions.onChange(t.dataRef.current.value)},search:e=>{this.send({type:3,value:e})},clearSearch:()=>{this.send({type:4})},setButtonElement:e=>{this.send({type:7,element:e})},setOptionsElement:e=>{this.send({type:8,element:e})}}),ro(this,"selectors",{activeDescendantId(e){var t;let n=e.activeOptionIndex,r=e.options;return null===n||null==(t=r[n])?void 0:t.id},isActive(e,t){var n;let r=e.activeOptionIndex,o=e.options;return null!==r&&(null==(n=o[r])?void 0:n.id)===t},shouldScrollIntoView(e,t){return!e.__demoMode&&0===e.listboxState&&0!==e.activationTrigger&&this.isActive(e,t)}}),this.on(5,()=>{requestAnimationFrame(()=>{this.send({type:9})})});{let e=this.state.id,t=je.get(null);this.disposables.add(t.on(Ae.Push,n=>{!t.selectors.isTop(n,e)&&0===this.state.listboxState&&this.actions.closeListbox()})),this.on(0,()=>t.actions.push(e)),this.on(1,()=>t.actions.pop(e))}}static new({id:e,__demoMode:t=!1}){return new co({id:e,dataRef:{current:{}},listboxState:t?0:1,options:[],searchQuery:"",activeOptionIndex:null,activationTrigger:1,buttonElement:null,optionsElement:null,pendingShouldSort:!1,pendingFocus:{focus:Cr.Nothing},__demoMode:t})}reduce(e,t){return m(t.type,uo,e,t)}}const fo=e.createContext(null);function po(t){let n=e.useContext(fo);if(null===n){let e=new Error(`<${t} /> is missing a parent <Listbox /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(e,ho),e}return n}function ho({id:t,__demoMode:n=!1}){let r=e.useMemo(()=>co.new({id:t,__demoMode:n}),[]);return Tr(()=>r.dispose()),r}let mo=e.createContext(null);function vo(t){let n=e.useContext(mo);if(null===n){let e=new Error(`<${t} /> is missing a parent <Listbox /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(e,vo),e}return n}mo.displayName="ListboxDataContext";let go=e.Fragment;let bo=e.createContext(!1),yo=M.RenderStrategy|M.Static;let xo=e.Fragment;let wo=r(function(t,r){let i=e.useId(),s=a(),{value:d,defaultValue:f,form:p,name:h,onChange:v,by:g,invalid:b=!1,disabled:y=s||!1,horizontal:x=!1,multiple:w=!1,__demoMode:S=!1,...E}=t;const O=x?"horizontal":"vertical";let R=u(r),C=function(t){let[n]=e.useState(t);return n}(f),[P=(w?[]:void 0),T]=function(t,r,o){let[i,l]=e.useState(o),s=void 0!==t,a=e.useRef(s),u=e.useRef(!1),c=e.useRef(!1);return!s||a.current||u.current?!s&&a.current&&!c.current&&(c.current=!0,a.current=s,console.error("A component is changing from controlled to uncontrolled. This may be caused by the value changing from a defined value to undefined, which should not happen.")):(u.current=!0,a.current=s,console.error("A component is changing from uncontrolled to controlled. This may be caused by the value changing from undefined to a defined value, which should not happen.")),[s?t:i,n(e=>(s||l(e),null==r?void 0:r(e)))]}(d,v,C),M=ho({id:i,__demoMode:S}),F=e.useRef({static:!1,hold:!1}),k=e.useRef(new Map),I=function(t=he){return e.useCallback((e,n)=>{if("string"==typeof t){let r=t;return(null==e?void 0:e[r])===(null==n?void 0:n[r])}return t(e,n)},[t])}(g),A=e.useCallback(e=>m(N.mode,{[io.Multi]:()=>P.some(t=>I(t,e)),[io.Single]:()=>I(P,e)}),[P]),N=e.useMemo(()=>({value:P,disabled:y,invalid:b,mode:w?io.Multi:io.Single,orientation:O,onChange:T,compare:I,isSelected:A,optionsPropsRef:F,listRef:k}),[P,y,b,w,O,T,I,A,F,k]);c(()=>{M.state.dataRef.current=N},[N]);let j=$e(M,e=>e.listboxState),H=je.get(null),_=$e(H,e.useCallback(e=>H.selectors.isTop(e,i),[H,i])),[B,W]=$e(M,e=>[e.buttonElement,e.optionsElement]);pt(_,[B,W],(e,t)=>{M.send({type:so.CloseListbox}),it(t,ot.Loose)||(e.preventDefault(),null==B||B.focus())});let V=e.useMemo(()=>({open:j===oo.Open,disabled:y,invalid:b,value:P}),[j,y,b,P]),[$,U]=function({inherit:t=!1}={}){let r=de(),[o,i]=e.useState([]),s=t?[r,...o].filter(Boolean):o;return[s.length>0?s.join(" "):void 0,e.useMemo(()=>function(t){let r=n(e=>(i(t=>[...t,e]),()=>i(t=>{let n=t.slice(),r=n.indexOf(e);return-1!==r&&n.splice(r,1),n}))),o=e.useMemo(()=>({register:r,slot:t.slot,name:t.name,props:t.props,value:t.value}),[r,t.slot,t.name,t.props,t.value]);return l.createElement(ue.Provider,{value:o},t.children)},[i])]}({inherit:!0}),z={ref:R},q=e.useCallback(()=>{if(void 0!==C)return null==T?void 0:T(C)},[T,C]),K=o();return l.createElement(U,{value:$,props:{htmlFor:null==B?void 0:B.id},slot:{open:j===oo.Open,disabled:y}},l.createElement(wr,null,l.createElement(fo.Provider,{value:M},l.createElement(mo.Provider,{value:N},l.createElement(D,{value:m(j,{[oo.Open]:L.Open,[oo.Closed]:L.Closed})},null!=h&&null!=P&&l.createElement(ne,{disabled:y,data:{[h]:P},form:p,onReset:q}),K({ourProps:z,theirProps:E,slot:V,defaultTag:go,name:"Listbox"}))))))}),So=r(function(t,r){let i=e.useId(),l=ie(),s=vo("Listbox.Button"),a=po("Listbox.Button"),{id:c=l||`headlessui-listbox-button-${i}`,disabled:d=s.disabled||!1,autoFocus:f=!1,...p}=t,h=u(r,e.useContext(yr).setReference,a.actions.setButtonElement),m=e.useContext(yr).getReferenceProps,[v,g,b]=$e(a,e=>[e.listboxState,e.buttonElement,e.optionsElement]);!function(t,{trigger:n,action:r,close:o,select:i}){let l=e.useRef(null);ft(t&&null!==n,"pointerdown",e=>{S(null==e?void 0:e.target)&&null!=n&&n.contains(e.target)&&(l.current=new Date)}),ft(t&&null!==n,"pointerup",e=>{if(null===l.current||!x(e.target))return;let t=r(e),n=(new Date).getTime()-l.current.getTime();switch(l.current=null,t.kind){case 0:return;case 1:n>200&&(i(t.target),o());break;case 2:o()}},{capture:!0})}(v===oo.Open,{trigger:g,action:e.useCallback(e=>{if(null!=g&&g.contains(e.target))return vt.Ignore;let t=e.target.closest('[role="option"]:not([data-disabled])');return y(t)?vt.Select(t):null!=b&&b.contains(e.target)?vt.Ignore:vt.Close},[g,b]),close:a.actions.closeListbox,select:a.actions.selectActiveOption});let w=n(e=>{switch(e.key){case j.Enter:!function(e){var t,n;let r=null!=(t=null==e?void 0:e.form)?t:e.closest("form");if(r){for(let t of r.elements)if(t!==e&&("INPUT"===t.tagName&&"submit"===t.type||"BUTTON"===t.tagName&&"submit"===t.type||"INPUT"===t.nodeName&&"image"===t.type))return void t.click();null==(n=r.requestSubmit)||n.call(r)}}(e.currentTarget);break;case j.Space:case j.ArrowDown:e.preventDefault(),a.actions.openListbox({focus:s.value?Cr.Nothing:Cr.First});break;case j.ArrowUp:e.preventDefault(),a.actions.openListbox({focus:s.value?Cr.Nothing:Cr.Last})}}),E=n(e=>{if(e.key===j.Space)e.preventDefault()}),O=n(e=>{var t;if(0===e.button){if(H(e.currentTarget))return e.preventDefault();a.state.listboxState===oo.Open?(K.flushSync(()=>a.actions.closeListbox()),null==(t=a.state.buttonElement)||t.focus({preventScroll:!0})):(e.preventDefault(),a.actions.openListbox({focus:Cr.Nothing}))}}),R=n(e=>e.preventDefault()),C=de([c]),P=function(){var t,n;return null!=(n=null==(t=e.useContext(le))?void 0:t.value)?n:void 0}(),{isFocusVisible:T,focusProps:L}=_({autoFocus:f}),{isHovered:M,hoverProps:F}=B({isDisabled:d}),{pressed:k,pressProps:I}=W({disabled:d}),A=e.useMemo(()=>({open:v===oo.Open,active:k||v===oo.Open,disabled:d,invalid:s.invalid,value:s.value,hover:M,focus:T,autofocus:f}),[v,s.value,d,M,T,k,s.invalid,f]),D=$e(a,e=>e.listboxState===oo.Open),$=N(m(),{ref:h,id:c,type:V(t,g),"aria-haspopup":"listbox","aria-controls":null==b?void 0:b.id,"aria-expanded":D,"aria-labelledby":C,"aria-describedby":P,disabled:d||void 0,autoFocus:f,onKeyDown:w,onKeyUp:E,onKeyPress:R,onPointerDown:O},L,F,I);return o()({ourProps:$,theirProps:p,slot:A,defaultTag:"button",name:"Listbox.Button"})}),Eo=pe,Oo=r(function(t,r){let s=e.useId(),{id:a=`headlessui-listbox-options-${s}`,anchor:d,portal:f=!1,modal:p=!0,transition:v=!1,...x}=t,w=function(t){return e.useMemo(()=>t?"string"==typeof t?{to:t}:t:null,[t])}(d),[S,E]=e.useState(null);w&&(f=!0);let O=vo("Listbox.Options"),R=po("Listbox.Options"),[C,P,M,F]=$e(R,e=>[e.listboxState,e.buttonElement,e.optionsElement,e.__demoMode]),A=ht(P),D=ht(M),H=T(),[_,B]=k(v,S,null!==H?(H&L.Open)===L.Open:C===oo.Open);!function(t,n,r){let o=b(e=>{let t=e.getBoundingClientRect();0===t.x&&0===t.y&&0===t.width&&0===t.height&&r()});e.useEffect(()=>{if(!t)return;let e=null===n?null:y(n)?n:n.current;if(!e)return;let r=h();if("undefined"!=typeof ResizeObserver){let t=new ResizeObserver(()=>o.current(e));t.observe(e),r.add(()=>t.disconnect())}if("undefined"!=typeof IntersectionObserver){let t=new IntersectionObserver(()=>o.current(e));t.observe(e),r.add(()=>t.disconnect())}return()=>r.dispose()},[n,o,t])}(_,P,R.actions.closeListbox),function(e,t,n=()=>[document.body]){xt(ze(e,"scroll-lock"),t,e=>{var t;return{containers:[...null!=(t=e.containers)?t:[],n]}})}(!F&&(p&&C===oo.Open),D),function(e,{allowed:t,disallowed:n}={}){let r=ze(e,"inert-others");c(()=>{var e,o;if(!r)return;let i=h();for(let t of null!=(e=null==n?void 0:n())?e:[])t&&i.add(Ye(t));let l=null!=(o=null==t?void 0:t())?o:[];for(let t of l){if(!t)continue;let e=g(t);if(!e)continue;let n=t.parentElement;for(;n&&n!==e.body;){for(let e of n.children)l.some(t=>e.contains(t))||i.add(Ye(e));n=n.parentElement}}return i.dispose},[r,t,n])}(!F&&(p&&C===oo.Open),{allowed:e.useCallback(()=>[P,M],[P,M])});let W=!function(t,n){let r=e.useRef({left:0,top:0});if(c(()=>{if(!n)return;let e=n.getBoundingClientRect();e&&(r.current=e)},[t,n]),null==n||!t||n===document.activeElement)return!1;let o=n.getBoundingClientRect();return o.top!==r.current.top||o.left!==r.current.left}(C!==oo.Open,P)&&_,V=function(t,n){let[r,o]=e.useState(n);return!t&&r!==n&&o(n),t?r:n}(_&&C===oo.Closed,O.value),$=n(e=>O.compare(V,e)),U=$e(R,e=>{var t;if(null==w||null==(t=null==w?void 0:w.to)||!t.includes("selection"))return null;let n=e.options.findIndex(e=>$(e.dataRef.current.value));return-1===n&&(n=0),n}),z=(()=>{if(null==w)return;if(null===U)return{...w,inner:void 0};let e=Array.from(O.listRef.current.values());return{...w,inner:{listRef:{current:e},index:U}}})(),[q,Y]=function(t=null){!1===t&&(t=null),"string"==typeof t&&(t={to:t});let n=e.useContext(xr),r=e.useMemo(()=>t,[JSON.stringify(t,(e,t)=>{var n;return null!=(n=null==t?void 0:t.outerHTML)?n:t})]);c(()=>{null==n||n(null!=r?r:null)},[n,r]);let o=e.useContext(yr);return e.useMemo(()=>[o.setFloating,t?o.styles:{}],[o.setFloating,t,o.styles])}(z),G=function(){let{getFloatingProps:t,slot:n}=e.useContext(yr);return e.useCallback((...e)=>Object.assign({},t(...e),{"data-anchor":n.anchor}),[t,n])}(),Q=u(r,w?q:null,R.actions.setOptionsElement,E),X=i();e.useEffect(()=>{var e;let t=M;t&&C===oo.Open&&t!==(null==(e=g(t))?void 0:e.activeElement)&&(null==t||t.focus({preventScroll:!0}))},[C,M]);let J=n(e=>{var t,n;switch(X.dispose(),e.key){case j.Space:if(""!==R.state.searchQuery)return e.preventDefault(),e.stopPropagation(),R.actions.search(e.key);case j.Enter:if(e.preventDefault(),e.stopPropagation(),null!==R.state.activeOptionIndex){let{dataRef:e}=R.state.options[R.state.activeOptionIndex];R.actions.onChange(e.current.value)}O.mode===io.Single&&(K.flushSync(()=>R.actions.closeListbox()),null==(t=R.state.buttonElement)||t.focus({preventScroll:!0}));break;case m(O.orientation,{vertical:j.ArrowDown,horizontal:j.ArrowRight}):return e.preventDefault(),e.stopPropagation(),R.actions.goToOption({focus:Cr.Next});case m(O.orientation,{vertical:j.ArrowUp,horizontal:j.ArrowLeft}):return e.preventDefault(),e.stopPropagation(),R.actions.goToOption({focus:Cr.Previous});case j.Home:case j.PageUp:return e.preventDefault(),e.stopPropagation(),R.actions.goToOption({focus:Cr.First});case j.End:case j.PageDown:return e.preventDefault(),e.stopPropagation(),R.actions.goToOption({focus:Cr.Last});case j.Escape:return e.preventDefault(),e.stopPropagation(),K.flushSync(()=>R.actions.closeListbox()),void(null==(n=R.state.buttonElement)||n.focus({preventScroll:!0}));case j.Tab:e.preventDefault(),e.stopPropagation(),K.flushSync(()=>R.actions.closeListbox()),ut(R.state.buttonElement,e.shiftKey?et.Previous:et.Next);break;default:1===e.key.length&&(R.actions.search(e.key),X.setTimeout(()=>R.actions.clearSearch(),350))}}),Z=$e(R,e=>{var t;return null==(t=e.buttonElement)?void 0:t.id}),ee=e.useMemo(()=>({open:C===oo.Open}),[C]),te=N(w?G():{},{id:a,ref:Q,"aria-activedescendant":$e(R,R.selectors.activeDescendantId),"aria-multiselectable":O.mode===io.Multi||void 0,"aria-labelledby":Z,"aria-orientation":O.orientation,onKeyDown:J,role:"listbox",tabIndex:C===oo.Open?0:void 0,style:{...x.style,...Y,"--button-width":me(P,!0).width},...I(B)}),ne=o(),re=e.useMemo(()=>O.mode===io.Multi?O:{...O,isSelected:$},[O,$]);return l.createElement(_r,{enabled:!!f&&(t.static||_),ownerDocument:A},l.createElement(mo.Provider,{value:re},ne({ourProps:te,theirProps:x,slot:ee,defaultTag:"div",features:yo,visible:W,name:"Listbox.Options"})))}),Ro=r(function(t,r){let i=e.useId(),{id:l=`headlessui-listbox-option-${i}`,disabled:s=!1,value:a,...d}=t,f=!0===e.useContext(bo),p=vo("Listbox.Option"),m=po("Listbox.Option"),v=$e(m,e=>m.selectors.isActive(e,l)),g=p.isSelected(a),y=e.useRef(null),x=eo(y),w=b({disabled:s,value:a,domRef:y,get textValue(){return x()}}),S=u(r,y,e=>{e?p.listRef.current.set(l,e):p.listRef.current.delete(l)}),E=$e(m,e=>m.selectors.shouldScrollIntoView(e,l));c(()=>{if(E)return h().requestAnimationFrame(()=>{var e,t;null==(t=null==(e=y.current)?void 0:e.scrollIntoView)||t.call(e,{block:"nearest"})})},[E,y]),c(()=>{if(!f)return m.actions.registerOption(l,w),()=>m.actions.unregisterOption(l)},[w,l,f]);let O=n(e=>{var t;if(s)return e.preventDefault();m.actions.onChange(a),p.mode===io.Single&&(K.flushSync(()=>m.actions.closeListbox()),null==(t=m.state.buttonElement)||t.focus({preventScroll:!0}))}),R=n(()=>{if(s)return m.actions.goToOption({focus:Cr.Nothing});m.actions.goToOption({focus:Cr.Specific,id:l})}),C=function(){let t=e.useRef([-1,-1]);return{wasMoved(e){let n=wt(e);return(t.current[0]!==n[0]||t.current[1]!==n[1])&&(t.current=n,!0)},update(e){t.current=wt(e)}}}(),P=n(e=>{C.update(e),!s&&(v||m.actions.goToOption({focus:Cr.Specific,id:l},lo.Pointer))}),T=n(e=>{C.wasMoved(e)&&(s||v||m.actions.goToOption({focus:Cr.Specific,id:l},lo.Pointer))}),L=n(e=>{C.wasMoved(e)&&(s||v&&m.actions.goToOption({focus:Cr.Nothing}))}),M=e.useMemo(()=>({active:v,focus:v,selected:g,disabled:s,selectedOption:g&&f}),[v,g,s,f]),F=f?{}:{id:l,ref:S,role:"option",tabIndex:!0===s?void 0:-1,"aria-disabled":!0===s||void 0,"aria-selected":g,disabled:void 0,onClick:O,onFocus:R,onPointerEnter:P,onMouseEnter:P,onPointerMove:T,onMouseMove:T,onPointerLeave:L,onMouseLeave:L},k=o();return!g&&f?null:k({ourProps:F,theirProps:d,slot:M,defaultTag:"div",name:"Listbox.Option"})}),Co=r(function(t,n){let{options:r,placeholder:i,...s}=t,a={ref:u(n)},c=vo("ListboxSelectedOption"),d=e.useMemo(()=>({}),[]),f=void 0===c.value||null===c.value||c.mode===io.Multi&&Array.isArray(c.value)&&0===c.value.length,p=o();return l.createElement(bo.Provider,{value:!0},p({ourProps:a,theirProps:{...s,children:l.createElement(l.Fragment,null,i&&f?i:r)},slot:d,defaultTag:xo,name:"ListboxSelectedOption"}))}),Po=Object.assign(wo,{Button:So,Label:Eo,Options:Oo,Option:Ro,SelectedOption:Co});function To({className:t,defaultValue:n,onChange:r,options:o,placeholder:i="",value:l}){return $.jsx(Po,{value:l??n,onChange:r,children:$.jsxs("div",{className:`relative ${t}`,children:[$.jsxs(So,{className:"w-full h-9 text-left rounded-md bg-black/30 border border-2 border-transparent py-1 px-2 outline-none focus:border-teal-300","data-focus":!0,children:[l?.label?$.jsx("span",{className:"block truncate",children:l.label}):$.jsx("span",{className:"block truncate text-slate-500",children:i}),$.jsx("span",{className:"pointer-events-none absolute inset-y-0 right-0 flex items-center pr-2",children:$.jsx(q,{className:"h-4 w-4 text-gray-400","aria-hidden":"true"})})]}),$.jsx(Xr,{as:e.Fragment,leave:"transition ease-in duration-100",leaveFrom:"opacity-100",leaveTo:"opacity-0",children:$.jsx(Oo,{className:"absolute z-10 mt-1 max-h-50 w-full overflow-auto rounded-md py-1 bg-black/90","data-focus":!0,children:o.map((e,t)=>$.jsx(Ro,{className:U("relative cursor-pointer select-none h-7 py-1 px-2 text-slate-300 border-none!","data-focus:text-teal-300 data-focus:bg-black","data-active:text-teal-300 data-active:bg-black","data-selected:text-teal-300 data-selected:font-bold"),value:e,children:e.label},t))})})]})})}export{To as S};
-//# sourceMappingURL=Select-BtAY4kA-.js.map