npm - @lolmath/ui - Versions diffs - 9.2.0 → 9.4.0 - Mend

@lolmath/ui 9.2.0 → 9.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (5) hide show

package/dist/index.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.mjs","names":["AriaBreadcrumbs","classes","AriaBreadcrumb","divider","classes","AriaButton","AriaButton","classes","AriaText","AriaLabel","classes","AriaButton","AriaPopover","AriaListBox","AriaListBoxItem","AriaVirtualizer","ListLayout","classes","AriaCalendarHeaderCell","AriaCalendarGridHeader","AriaCalendarCell","AriaCalendarGrid","AriaCalendarGridBody","AriaCalendar","AriaRangeCalendar","classes","AriaDateSegment","AriaDateInput","AriaDateField","classes","AriaDateInput","AriaButton","AriaPopover","AriaDatePicker","AriaGroup","AriaDateRangePicker","AriaGroup","classes","AriaTimeField","imageIndeterminateHover","imageCheckedHover","imageUncheckedHover","imageIndeterminate","imageChecked","imageUnchecked","AriaCheckboxButton","classes","AriaCheckboxField","AriaDisclosureGroup","Button","classes","AriaDisclosure","AriaDisclosurePanel","classes","classes","AriaMenuTrigger","AriaSubmenuTrigger","AriaMenu","classes","AriaMenuItem","AriaPopover","AriaMenuSection","AriaHeader","AriaSeparator","AriaVirtualizer","ListLayout","classes","AriaModal","Dialog","AriaHeading","classes","AriaNumberField","Button","AriaInput","classes","AriaPopover","Dialog","AriaProgressBar","classes","Label","AriaRadioGroup","classes","AriaRadioButton","AriaRadioField","classes","AriaSearchField","AriaInput","AriaButton","classes","AriaTag","AriaButton","AriaTagGroup","AriaTagList","useFilter","Select","classes","SelectValue","AriaPopover","Autocomplete","classes","AriaSlider","AriaSliderTrack","AriaSliderFill","AriaSliderThumb","AriaSliderOutput","textClasses","spinnerImage","classes","sonnerToast","classes","sonnerSuccess","sonnerError","sonnerWarning","sonnerInfo","AriaSwitchButton","classes","textClasses","AriaSwitchField","classes","AriaTable","AriaColumn","AriaColumnResizer","AriaTableBody","AriaRow","AriaCell","AriaTableFooter","AriaTabs","AriaTabList","classes","AriaTab","AriaTabPanel","classes","AriaTextField","AriaInput","AriaTextField","AriaTextArea","button","classes","AriaToggleButton","AriaToggleButtonGroup","classes","AriaToolbar","classes","AriaSeparator","classes","AriaTree","AriaTreeItem","AriaTreeItemContent","AriaButton","AriaTreeLoadMoreItem"],"sources":["../src/components/breadcrumbs/breadcrumbs.module.css","../src/components/breadcrumbs/breadcrumbs-divider.png","../src/components/breadcrumbs/breadcrumbs.tsx","../src/components/button.module.css","../src/components/button.tsx","../src/components/button-link.tsx","../src/components/typography/text.module.css","../src/components/typography/text.tsx","../src/components/select/select.module.css","../src/components/select/select.tsx","../src/components/calendar/calendar.module.css","../src/components/calendar/calendar.tsx","../src/components/calendar/date-field.module.css","../src/components/calendar/date-field.tsx","../src/components/calendar/date-picker.module.css","../src/components/calendar/date-picker.tsx","../src/components/calendar/date-range-picker.tsx","../src/components/calendar/time-field.tsx","../src/components/checkbox/checkbox.module.css","../src/components/checkbox/checkbox-checked.png","../src/components/checkbox/checkbox-checked-hover.png","../src/components/checkbox/checkbox-indeterminate.png","../src/components/checkbox/checkbox-indeterminate-hover.png","../src/components/checkbox/checkbox-unchecked.png","../src/components/checkbox/checkbox-unchecked-hover.png","../src/components/checkbox/checkbox.tsx","../src/components/disclosure.module.css","../src/components/disclosure.tsx","../src/components/divider.module.css","../src/components/divider.tsx","../src/components/typography/heading.module.css","../src/components/typography/heading.tsx","../src/components/menu/menu.module.css","../src/components/menu/menu.tsx","../src/components/modal.module.css","../src/components/modal.tsx","../src/components/number-field.module.css","../src/components/number-field.tsx","../src/components/popover.module.css","../src/components/popover.tsx","../src/components/progress-bar.module.css","../src/components/progress-bar.tsx","../src/components/radio-group/radio-group.module.css","../src/components/radio-group/radio-group.tsx","../src/components/search-field/search-field.module.css","../src/components/search-field/search-field.tsx","../src/components/tag-group/tag-group.module.css","../src/components/tag-group/tag-group.tsx","../src/components/select/multiple-select.module.css","../src/components/select/multiple-select.tsx","../src/components/slider/slider.module.css","../src/components/slider/slider.tsx","../src/components/spinner/spinner.module.css","../src/components/spinner/spinner-spinner.png","../src/components/spinner/spinner.tsx","../src/components/sonner/sonner.module.css","../src/components/sonner/sonner-error.svg","../src/components/sonner/sonner-info.svg","../src/components/sonner/sonner-success.svg","../src/components/sonner/sonner-warning.svg","../src/components/sonner/sonner.tsx","../src/components/switch.module.css","../src/components/switch.tsx","../src/components/table.module.css","../src/components/table.tsx","../src/components/tabs.module.css","../src/components/tabs.tsx","../src/components/text-field.module.css","../src/components/text-field.tsx","../src/components/text-area.tsx","../src/components/toggle-button.tsx","../src/components/toggle-button-group.tsx","../src/components/toolbar.module.css","../src/components/toolbar.tsx","../src/components/tree/tree.module.css","../src/components/tree/tree.tsx"],"sourcesContent":["@layer lol {\n\t.breadcrumbs {\n\t\tdisplay: flex;\n\t\tgap: 0.25rem;\n\t\t/* An <ol>: the UA gives it block margins and a 40px marker gutter. /\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t\tlist-style: none;\n\t}\n\n\t.item {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t}\n\n\t.link {\n\t\ttext-decoration: none;\n\t\tfont-family: var(--lol-font-family-beaufort);\n\t\tcolor: var(--lol-color-gold-300);\n\t\tposition: relative;\n\t\tfont-size: var(--lol-font-size-sm);\n\t\tfont-weight: 500;\n\t\ttext-transform: uppercase;\n\t\tletter-spacing: 0.1em;\n\t\tpadding: 0 1rem;\n\n\t\t&[data-hovered] {\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t}\n\t}\n\n\t.divider {\n\t\t/ Off the text baseline, so the row's height is the glyph's, and never\n\t\t wider than the row. /\n\t\tdisplay: block;\n\t\tmax-width: 100%;\n\t\theight: 11px;\n\t}\n}\n","\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAALCAYAAACtWacbAAAA+0lEQVQYV12QsUoDURBF74xbxHLB9NqHbWwSwUJIutSbQCqb5BPMJ8RPcBttlMR8ggYLkRVxm8XGyk9IFQgx+668zb7N4sDAvJnDu3NHUIk0nrWDVu+52rO1uEb6Ph0KcSNE1Djrj6pgDjnADQRy3Wj1xuX7+/PhaPOrdQBvAHwAS4p2QPpOWkhK+jE/NiajR1lQNVRjhhTYHAXNflTu9PNyWzu5uFx/xbMJwSsnRSIsIbcboInQPBXSCbdZJ4fsL6vDWpeUuXVnVCOhmXCbhcH5YLlzF08HAtwB8HZ3+ecuh17vffEOrMSpcxc0w2R/kqIqwEeKjquAHf8Bd1xn7M0vJ+QAAAAASUVORK5CYII=\"","import { cx } from \"cva\";\nimport {\n\tBreadcrumb as AriaBreadcrumb,\n\tBreadcrumbs as AriaBreadcrumbs,\n\ttype BreadcrumbProps,\n\ttype BreadcrumbsProps,\n\tcomposeRenderProps,\n\tLink,\n} from \"react-aria-components\";\nimport classes from \"../breadcrumbs/breadcrumbs.module.css\";\nimport divider from \"./breadcrumbs-divider.png\";\n\nexport function Breadcrumbs<T extends object>({\n\tclassName,\n\t...props\n}: BreadcrumbsProps<T>) {\n\treturn (\n\t\t<AriaBreadcrumbs\n\t\t\t{...props}\n\t\t\tclassName={cx(classes.breadcrumbs, className)}\n\t\t/>\n\t);\n}\n\nexport function Breadcrumb({\n\tclassName,\n\tchildren,\n\thref,\n\t...props\n}: BreadcrumbProps & {\n\thref?: string;\n}) {\n\treturn (\n\t\t<AriaBreadcrumb\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.item, className),\n\t\t\t)}\n\t\t>\n\t\t\t<Link className={classes.link} href={href}>\n\t\t\t\t{children}\n\t\t\t</Link>\n\t\t\t{href && <img src={divider} alt=\"\" className={classes.divider} />}\n\t\t</AriaBreadcrumb>\n\t);\n}\n","@layer lol {\n\t.button {\n\t\tappearance: none;\n\t\tmargin: 0;\n\t\t/ Presets that want horizontal padding add it back further down. Without a\n\t\t zero here, `text` (which wants none) picks up the UA's `1px 6px`. /\n\t\tpadding: 0;\n\t\t/ Also rendered on the <a> of ButtonLink, which the UA underlines. /\n\t\ttext-decoration: none;\n\n\t\tborder-radius: 0px;\n\t\tborder: 2px solid transparent;\n\n\t\t&.thin {\n\t\t\tborder-width: 1px;\n\t\t}\n\n\t\ttransition: all;\n\t\ttransition-duration: 0.3s;\n\n\t\tfont-family: var(--lol-font-family-beaufort);\n\t\tcolor: var(--lol-color-gold-300);\n\t\tfont-weight: 700;\n\t\ttext-transform: uppercase;\n\t\tletter-spacing: 0.05em;\n\t\tline-height: 1;\n\t\twhite-space: nowrap;\n\n\t\tdisplay: inline-flex;\n\n\t\tjustify-content: center;\n\t\talign-items: center;\n\n\t\tbackground:\n\t\t\tvar(--lol-button-background-gradient) padding-box,\n\t\t\tvar(--lol-button-border-gradient) border-box;\n\n\t\toutline-style: solid;\n\t\toutline-offset: 2px;\n\n\t\t&:not(:focus-visible) {\n\t\t\toutline: none;\n\t\t}\n\n\t\t&.small {\n\t\t\tfont-size: var(--lol-font-size-sm);\n\t\t\tmin-height: var(--lol-form-height-small);\n\t\t}\n\n\t\t&.medium {\n\t\t\tfont-size: var(--lol-font-size-base);\n\t\t\tmin-height: var(--lol-form-height-medium);\n\t\t}\n\n\t\t&.large {\n\t\t\tfont-size: var(--lol-font-size-base);\n\t\t\tmin-height: var(--lol-form-height-large);\n\t\t}\n\n\t\t/\n\t\t * Nested so the shape wins on specificity: as a bare `.round` it ties with\n\t\t * `.button` and loses the border-radius and font-weight to whichever rule\n\t\t * is written last.\n\t\t /\n\t\t&.round,\n\t\t&.square {\n\t\t\taspect-ratio: 1 / 1;\n\t\t\tpadding: 0px;\n\t\t\tfont-weight: 900;\n\t\t}\n\n\t\t&.round {\n\t\t\tborder-radius: 9999px;\n\t\t}\n\n\t\t&:hover {\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t}\n\n\t\t/ order is important /\n\t\t&:active {\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t}\n\n\t\t&:disabled {\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t\tcursor: default;\n\t\t}\n\n\t\t&[data-selected] {\n\t\t\t--lol-button-background-gradient: var(--lol-gradient-hextech);\n\t\t\tbox-shadow: inset 0 2px 4px 0 var(--lol-color-grey-300);\n\t\t\tcolor: var(--lol-color-blue-100);\n\t\t}\n\t}\n\n\t/\n\t * ToggleButtonGroup. Lives here rather than in its own module because it has\n\t * to reach into the button's border model: adjacent buttons are pulled\n\t * together by exactly one border width so their two gradient borders read as\n\t * a single seam instead of a double-thick one.\n\t /\n\t.toggleButtonGroup {\n\t\tdisplay: inline-flex;\n\n\t\t& > .button + .button {\n\t\t\tmargin-left: -2px;\n\t\t}\n\n\t\t/ Must follow the rule above: thin buttons only need a 1px overlap. /\n\t\t& > .thin + .thin {\n\t\t\tmargin-left: -1px;\n\t\t}\n\n\t\t/ Whichever button is highlighted owns the seams next to it. /\n\t\t& > .button:hover,\n\t\t& > .button:focus-visible,\n\t\t& > .button[data-selected] {\n\t\t\tposition: relative;\n\t\t\tz-index: 1;\n\t\t}\n\n\t\t&[data-orientation=\"vertical\"] {\n\t\t\tflex-direction: column;\n\t\t\t/ Equal widths keep the collapsed seams lined up. /\n\t\t\talign-items: stretch;\n\n\t\t\t& > .button + .button {\n\t\t\t\tmargin-left: 0;\n\t\t\t\tmargin-top: -2px;\n\t\t\t}\n\n\t\t\t& > .thin + .thin {\n\t\t\t\tmargin-top: -1px;\n\t\t\t}\n\t\t}\n\t}\n\n\t.primary,\n\t.secondary,\n\t.hextech,\n\t.dimmed {\n\t\t&:not(.square, .round) {\n\t\t\t&.small {\n\t\t\t\tpadding: 0 0.5rem;\n\t\t\t}\n\n\t\t\t&.medium {\n\t\t\t\tpadding: 0 1rem;\n\t\t\t}\n\n\t\t\t&.large {\n\t\t\t\tpadding: 0 1rem;\n\t\t\t}\n\t\t}\n\t}\n\n\t.text {\n\t\t&.round,\n\t\t&.square {\n\t\t\t&:hover {\n\t\t\t\t--lol-button-background-gradient: var(--lol-gradient-grey-300);\n\t\t\t\t--lol-button-border-gradient: var(--lol-gradient-transparent);\n\t\t\t}\n\t\t}\n\n\t\t&.round,\n\t\t&.square,\n\t\t&.normal {\n\t\t\tposition: relative;\n\n\t\t\t&::after {\n\t\t\t\tposition: absolute;\n\t\t\t\ttop: -0.5rem;\n\t\t\t\tleft: -0.5rem;\n\t\t\t\tbottom: -0.5rem;\n\t\t\t\tright: -0.5rem;\n\t\t\t\tcontent: \"\";\n\t\t\t}\n\t\t}\n\n\t\t&:focus-visible {\n\t\t\toutline-color: var(--lol-color-gold-400);\n\t\t}\n\t}\n\n\t.hextech {\n\t\tcolor: var(--lol-color-blue-100);\n\t\t--lol-button-border-gradient: var(--lol-gradient-hextech);\n\t\t--lol-button-background-gradient: var(--lol-gradient-grey-300);\n\n\t\t&:hover {\n\t\t\tcolor: var(--lol-color-blue-100);\n\t\t\t--lol-button-border-gradient: var(--lol-gradient-hextech-hover);\n\t\t}\n\n\t\t&:active {\n\t\t\tcolor: var(--lol-color-blue-400);\n\t\t\t--lol-button-border-gradient: var(--lol-gradient-hextech-press);\n\t\t}\n\n\t\t&:disabled {\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t\t--lol-button-border-gradient: var(--lol-gradient-disabled);\n\t\t}\n\n\t\t&:focus-visible {\n\t\t\toutline-color: var(--lol-color-blue-400);\n\t\t}\n\t}\n\n\t.dimmed {\n\t\t--lol-button-background-gradient: var(--lol-gradient-hextech-black);\n\t\t--lol-button-border-gradient: var(--lol-gradient-grey-300);\n\n\t\t&:focus-visible {\n\t\t\t--lol-button-border-gradient: var(--lol-gradient-gold);\n\t\t}\n\t}\n\n\t.primary {\n\t\t--lol-button-border-gradient: var(--lol-gradient-gold);\n\t\t--lol-button-background-gradient: linear-gradient(\n\t\t\tto top,\n\t\t\tvar(--lol-color-gold-600),\n\t\t\tvar(--lol-color-gold-600),\n\t\t\tvar(--lol-color-gold-700)\n\t\t);\n\n\t\t&:hover {\n\t\t\t--lol-button-background-gradient: linear-gradient(\n\t\t\t\tto top,\n\t\t\t\tvar(--lol-color-gold-600),\n\t\t\t\tvar(--lol-color-gold-600),\n\t\t\t\tvar(--lol-color-gold-500)\n\t\t\t);\n\t\t}\n\n\t\t&:active {\n\t\t\t--lol-button-background-gradient: linear-gradient(\n\t\t\t\tto top,\n\t\t\t\tvar(--lol-color-gold-600),\n\t\t\t\tvar(--lol-color-gold-700),\n\t\t\t\tvar(--lol-color-gold-700)\n\t\t\t);\n\t\t}\n\t}\n\n\t.secondary {\n\t\t--lol-button-border-gradient: var(--lol-gradient-gold);\n\t\t--lol-button-background-gradient: var(--lol-gradient-grey-300);\n\t}\n\n\t.primary:hover,\n\t.secondary:hover,\n\t.dimmed:hover {\n\t\t--lol-button-border-gradient: var(--lol-gradient-gold-hover);\n\t}\n\n\t.primary:active,\n\t.secondary:active,\n\t.dimmed:active {\n\t\t--lol-button-border-gradient: var(--lol-gradient-gold-press);\n\t}\n\n\t/\n\t * A selected toggle takes the hextech background from `.button`, so the\n\t * dimmed border follows it there: a hextech body inside the resting grey\n\t * frame reads as an unfinished button. Must stay after the gold `:hover`\n\t * and `:active` rules above so the resting selected border wins, and\n\t * before `:disabled` below so a disabled toggle still greys out.\n\t /\n\t.dimmed[data-selected] {\n\t\t--lol-button-border-gradient: var(--lol-gradient-hextech);\n\n\t\t&:hover {\n\t\t\t--lol-button-border-gradient: var(--lol-gradient-hextech-hover);\n\t\t}\n\n\t\t&:active {\n\t\t\t--lol-button-border-gradient: var(--lol-gradient-hextech-press);\n\t\t}\n\t}\n\n\t.primary:disabled,\n\t.secondary:disabled,\n\t.dimmed:disabled {\n\t\t--lol-button-border-gradient: var(--lol-gradient-disabled);\n\t}\n\n\t.primary:focus-visible,\n\t.secondary:focus-visible {\n\t\toutline-color: var(--lol-color-gold-400);\n\t}\n}\n","import { cva } from \"cva\";\nimport type { Ref } from \"react\";\nimport {\n\tButton as AriaButton,\n\ttype ButtonProps as AriaButtonProps,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport classes from \"./button.module.css\";\n\nexport type ButtonShape = \"round\" \| \"square\" \| \"normal\";\nexport type ButtonPreset =\n\t\| \"primary\"\n\t\| \"secondary\"\n\t\| \"text\"\n\t\| \"hextech\"\n\t\| \"dimmed\";\nexport type ButtonSize = \"small\" \| \"medium\" \| \"large\";\n\ninterface ButtonProps extends AriaButtonProps {\n\tpreset?: ButtonPreset;\n\tthin?: boolean;\n\tshape?: ButtonShape;\n\tsize?: ButtonSize;\n}\n\nexport const button = cva({\n\tbase: classes.button,\n\tvariants: {\n\t\tpreset: {\n\t\t\tprimary: classes.primary,\n\t\t\tsecondary: classes.secondary,\n\t\t\ttext: classes.text,\n\t\t\thextech: classes.hextech,\n\t\t\tdimmed: classes.dimmed,\n\t\t},\n\t\tshape: {\n\t\t\tround: classes.round,\n\t\t\tsquare: classes.square,\n\t\t\tnormal: classes.normal,\n\t\t},\n\t\tthin: {\n\t\t\ttrue: classes.thin,\n\t\t},\n\t\tsize: {\n\t\t\tsmall: classes.small,\n\t\t\tmedium: classes.medium,\n\t\t\tlarge: classes.large,\n\t\t},\n\t},\n});\n\nexport function Button({\n\tchildren,\n\tclassName,\n\tpreset = \"secondary\",\n\tshape = \"normal\",\n\tsize = \"medium\",\n\tthin = preset === \"dimmed\",\n\tref,\n\t...props\n}: ButtonProps & { ref?: Ref<HTMLButtonElement> }) {\n\treturn (\n\t\t<AriaButton\n\t\t\tref={ref}\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className, values) =>\n\t\t\t\tbutton({\n\t\t\t\t\tclassName,\n\t\t\t\t\tpreset,\n\t\t\t\t\tshape,\n\t\t\t\t\tthin,\n\t\t\t\t\tsize,\n\t\t\t\t\t...values,\n\t\t\t\t}),\n\t\t\t)}\n\t\t>\n\t\t\t{children}\n\t\t</AriaButton>\n\t);\n}\n","import type { Ref } from \"react\";\nimport {\n\tLink as AriaButton,\n\tcomposeRenderProps,\n\ttype LinkProps,\n} from \"react-aria-components\";\nimport {\n\ttype ButtonPreset,\n\ttype ButtonShape,\n\ttype ButtonSize,\n\tbutton,\n} from \"./button\";\n\ninterface ButtonLinkProps extends LinkProps {\n\tpreset?: ButtonPreset;\n\tthin?: boolean;\n\tshape?: ButtonShape;\n\tsize?: ButtonSize;\n}\n\nexport function ButtonLink({\n\tchildren,\n\tclassName,\n\tpreset = \"secondary\",\n\tshape = \"normal\",\n\tsize = \"medium\",\n\tref,\n\tthin = preset === \"dimmed\",\n\t...props\n}: ButtonLinkProps & { ref?: Ref<HTMLAnchorElement> }) {\n\treturn (\n\t\t<AriaButton\n\t\t\tref={ref}\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className, values) =>\n\t\t\t\tbutton({\n\t\t\t\t\tclassName,\n\t\t\t\t\tpreset,\n\t\t\t\t\tshape,\n\t\t\t\t\tsize,\n\t\t\t\t\tthin,\n\t\t\t\t\t...values,\n\t\t\t\t}),\n\t\t\t)}\n\t\t>\n\t\t\t{children}\n\t\t</AriaButton>\n\t);\n}\n","@layer lol {\n\t.text {\n\t\tfont-family: var(--lol-font-family-spiegel);\n\t}\n\n\t.label {\n\t\tfont-size: var(--lol-font-size-label);\n\t\tline-height: var(--lol-line-height-label);\n\t\tletter-spacing: var(--lol-letter-spacing-label);\n\t\tfont-weight: var(--lol-font-weight-label);\n\t}\n\n\t.stat {\n\t\tfont-size: var(--lol-font-size-stat);\n\t\tline-height: var(--lol-line-height-stat);\n\t\tletter-spacing: var(--lol-letter-spacing-stat);\n\t\tfont-weight: var(--lol-font-weight-stat);\n\t}\n\n\t.largeNumber {\n\t\tfont-size: var(--lol-font-size-large-number);\n\t\tline-height: var(--lol-line-height-large-number);\n\t\tletter-spacing: var(--lol-letter-spacing-large-number);\n\t\tfont-weight: var(--lol-font-weight-large-number);\n\t}\n\n\t.sm {\n\t\tfont-size: var(--lol-font-size-sm);\n\t\tline-height: var(--lol-line-height-sm);\n\t\tletter-spacing: var(--lol-letter-spacing-sm);\n\t\tfont-weight: var(--lol-font-weight-sm);\n\t}\n\n\t.base {\n\t\tfont-size: var(--lol-font-size-base);\n\t\tline-height: var(--lol-line-height-base);\n\t\tletter-spacing: var(--lol-letter-spacing-base);\n\t\tfont-weight: var(--lol-font-weight-base);\n\t}\n\n\t.md {\n\t\tfont-size: var(--lol-font-size-md);\n\t\tline-height: var(--lol-line-height-md);\n\t\tletter-spacing: var(--lol-letter-spacing-md);\n\t\tfont-weight: var(--lol-font-weight-md);\n\t}\n\n\t.lg {\n\t\tfont-size: var(--lol-font-size-lg);\n\t\tline-height: var(--lol-line-height-lg);\n\t\tletter-spacing: var(--lol-letter-spacing-lg);\n\t\tfont-weight: var(--lol-font-weight-lg);\n\t}\n\n\t.grey100 {\n\t\tcolor: var(--lol-color-grey-100);\n\t}\n\n\t.grey150 {\n\t\tcolor: var(--lol-color-grey-150);\n\t}\n\n\t.gold100 {\n\t\tcolor: var(--lol-color-gold-100);\n\t}\n}\n","import { cva } from \"cva\";\nimport type { JSX } from \"react\";\nimport {\n\tLabel as AriaLabel,\n\ttype LabelProps as AriaLabelProps,\n\tText as AriaText,\n\ttype TextProps as AriaTextProps,\n} from \"react-aria-components\";\nimport classes from \"./text.module.css\";\n\nexport type TextColor = \"grey100\" \| \"grey150\" \| \"gold100\";\nexport type TextElement = \"p\" \| \"span\" \| \"div\";\nexport type TextPreset = \"sm\" \| \"base\" \| \"md\" \| \"lg\" \| \"largeNumber\" \| \"stat\";\n\nexport const text = cva({\n\tbase: classes.text,\n\tvariants: {\n\t\tcolor: {\n\t\t\tgrey100: classes.grey100,\n\t\t\tgrey150: classes.grey150,\n\t\t\tgold100: classes.gold100,\n\t\t},\n\t\tpreset: {\n\t\t\tsm: classes.sm,\n\t\t\tbase: classes.base,\n\t\t\tmd: classes.md,\n\t\t\tlg: classes.lg,\n\t\t\tlabel: classes.label,\n\t\t\tlargeNumber: classes.largeNumber,\n\t\t\tstat: classes.stat,\n\t\t},\n\t},\n});\n\ninterface TextProps extends AriaTextProps {\n\tpreset?: TextPreset;\n\tcolor?: TextColor;\n}\nexport function Text({\n\tpreset = \"base\",\n\tcolor = \"grey100\",\n\tclassName,\n\t...rest\n}: TextProps): JSX.Element {\n\treturn <AriaText className={text({ preset, color, className })} {...rest} />;\n}\n\ninterface LabelProps extends AriaLabelProps {\n\tpreset?: TextPreset \| \"label\";\n\tcolor?: TextColor;\n}\nexport function Label({\n\tpreset = \"sm\",\n\tcolor = \"grey100\",\n\tclassName,\n\t...rest\n}: LabelProps): JSX.Element {\n\treturn <AriaLabel className={text({ preset, color, className })} {...rest} />;\n}\n","@layer lol {\n\t.button {\n\t\t/ A <button>; the trigger's whole look is drawn below. /\n\t\tappearance: none;\n\t\tmargin: 0;\n\t\tfont-family: var(--lol-font-family-spiegel);\n\t\tdisplay: inline-block;\n\t\tmin-width: 200px;\n\t\toutline: none;\n\n\t\tborder: 1px solid transparent;\n\n\t\tcolor: var(--lol-color-grey-100);\n\t\tpadding: 0 1.5rem 0 0.5rem;\n\n\t\tfont-size: 0.75rem;\n\t\tfont-weight: 500;\n\t\tline-height: 1rem;\n\t\tletter-spacing: 0.025em;\n\t\ttext-align: left;\n\n\t\t--lol-select-image: url(\"./select-closed.png\");\n\t\t--lol-select-border-gradient: var(--lol-gradient-gold);\n\t\t--lol-select-background-gradient: var(--lol-gradient-hextech-black);\n\n\t\t&[data-open] {\n\t\t\t--lol-select-image: url(\"./select-open.png\");\n\t\t\tcolor: var(--lol-color-gold-600);\n\t\t\t--lol-select-background-gradient: var(--lol-gradient-grey-300);\n\t\t\t--lol-select-border-gradient: var(--lol-gradient-gold-press);\n\t\t}\n\n\t\t&[data-pressed] {\n\t\t\t--lol-select-border-gradient: var(--lol-gradient-gold-press);\n\t\t}\n\n\t\t&[data-hovered] {\n\t\t\t--lol-select-border-gradient: var(--lol-gradient-gold-hover);\n\t\t}\n\n\t\t&[data-disabled] {\n\t\t\t--lol-select-border-gradient: var(--lol-gradient-disabled);\n\t\t\t/ make the image gray /\n\t\t\tfilter: grayscale(100%);\n\t\t}\n\n\t\t&.small {\n\t\t\tmin-height: var(--lol-form-height-small);\n\t\t}\n\n\t\t&.medium {\n\t\t\tmin-height: var(--lol-form-height-medium);\n\t\t}\n\n\t\t&.large {\n\t\t\tmin-height: var(--lol-form-height-large);\n\t\t}\n\t}\n\n\t.singleSelect {\n\t\tbackground:\n\t\t\tvar(--lol-select-image) no-repeat right 0.5rem center,\n\t\t\tvar(--lol-select-background-gradient) padding-box,\n\t\t\tvar(--lol-select-border-gradient) border-box;\n\t}\n\n\t.multiSelect {\n\t\tbackground:\n\t\t\tvar(--lol-select-background-gradient) padding-box,\n\t\t\tvar(--lol-select-border-gradient) border-box;\n\t}\n\n\t.listBox {\n\t\tbackground-color: var(--lol-color-hextech-black);\n\t\tborder: 1px solid var(--lol-color-gold-600);\n\t\toutline: none;\n\t\toverflow-y: auto;\n\t}\n\n\t.item {\n\t\tborder-bottom: 1px solid var(--lol-color-grey-300);\n\t\tcolor: var(--lol-color-gold-300);\n\t\tfont-size: var(--lol-font-size-sm);\n\t\tfont-weight: var(--lol-font-weight-sm);\n\t\tline-height: var(--lol-line-height-sm);\n\t\tletter-spacing: var(--lol-letter-spacing-sm);\n\t\tpadding: 0.375rem 0.5rem;\n\t\toutline: none;\n\t\tcursor: pointer;\n\n\t\t&[data-hovered] {\n\t\t\tbackground-color: var(--lol-color-grey-300);\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t}\n\n\t\t&[data-pressed],\n\t\t&.focus {\n\t\t\tbackground-color: color-mix(\n\t\t\t\tin srgb,\n\t\t\t\tvar(--lol-color-grey-300),\n\t\t\t\ttransparent 50%\n\t\t\t);\n\t\t\tcolor: var(--lol-color-gold-600);\n\t\t}\n\n\t\t&.selected {\n\t\t\tbackground-image: url(./select-dropdown-check.png);\n\t\t\tbackground-position: right 0.5rem center;\n\t\t\tbackground-repeat: no-repeat;\n\t\t}\n\t}\n\n\t.popover {\n\t\twidth: var(--trigger-width);\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t}\n\n\t.emptyList {\n\t\tpadding: 0.5rem 0.25rem;\n\t\ttext-align: left;\n\t}\n}\n","import { cva, cx } from \"cva\";\nimport {\n\tButton as AriaButton,\n\tListBox as AriaListBox,\n\tListBoxItem as AriaListBoxItem,\n\tPopover as AriaPopover,\n\tVirtualizer as AriaVirtualizer,\n\ttype ButtonProps,\n\tcomposeRenderProps,\n\ttype ListBoxItemProps,\n\ttype ListBoxProps,\n\tListLayout,\n\ttype PopoverProps,\n\ttype VirtualizerProps,\n} from \"react-aria-components\";\nimport { text } from \"../typography/text\";\nimport classes from \"./select.module.css\";\n\nexport { Select, SelectValue } from \"react-aria-components\";\n\nexport const select = cva({\n\tbase: classes.button,\n\tvariants: {\n\t\tsize: {\n\t\t\tsmall: classes.small,\n\t\t\tmedium: classes.medium,\n\t\t\tlarge: classes.large,\n\t\t},\n\t\tselectionMode: {\n\t\t\tsingle: classes.singleSelect,\n\t\t\tmultiple: classes.multiSelect,\n\t\t},\n\t},\n});\n\nexport function SelectButton({\n\tclassName,\n\tsize = \"medium\",\n\t...props\n}: ButtonProps & { size?: \"small\" \| \"medium\" \| \"large\" }) {\n\treturn (\n\t\t<AriaButton\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className, buttonValues) =>\n\t\t\t\tselect({ ...buttonValues, size, className, selectionMode: \"single\" }),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport function SelectPopover({ className, ...props }: PopoverProps) {\n\treturn (\n\t\t<AriaPopover\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(className, classes.popover),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport function SelectListBox<T extends object>({\n\tclassName,\n\temptyList = \"No results found\",\n\t...props\n}: ListBoxProps<T> & {\n\temptyList?: React.ReactNode;\n}) {\n\treturn (\n\t\t<AriaListBox<T>\n\t\t\t{...props}\n\t\t\trenderEmptyState={() => (\n\t\t\t\t<div\n\t\t\t\t\tclassName={text({\n\t\t\t\t\t\tcolor: \"grey150\",\n\t\t\t\t\t\tpreset: \"base\",\n\t\t\t\t\t\tclassName: classes.emptyList,\n\t\t\t\t\t})}\n\t\t\t\t>\n\t\t\t\t\t{emptyList}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(className, classes.listBox),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nconst item = cva({\n\tbase: classes.item,\n\tvariants: {\n\t\tisSelected: { true: classes.selected },\n\t\tisFocused: { true: classes.focus },\n\t},\n});\n\nexport function SelectListBoxItem({ className, ...props }: ListBoxItemProps) {\n\treturn (\n\t\t<AriaListBoxItem\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className, values) =>\n\t\t\t\titem({ ...values, className }),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport function SelectVirtualizer<T>(\n\tprops: Omit<VirtualizerProps<T>, \"layout\" \| \"layoutOptions\">,\n) {\n\treturn (\n\t\t<AriaVirtualizer\n\t\t\tlayout={ListLayout}\n\t\t\tlayoutOptions={{\n\t\t\t\tpadding: 0,\n\t\t\t\tgap: 0,\n\t\t\t\trowHeight: 31,\n\t\t\t\theadingHeight: 35,\n\t\t\t}}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n","@layer lol {\n\t.calendar,\n\t.rangeCalendar {\n\t\t--lol-calendar-cell-size: 2.5rem;\n\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\t/\n\t\t * A flex column is still a normal block box for its own sizing: with\n\t\t * no explicit width it fills its parent (a popover, a wide form)\n\t\t * rather than shrinking to its content. `fit-content` makes the\n\t\t * calendar itself only as wide as its widest child (the grid), and\n\t\t * `align-items: stretch` (the default, kept intentionally) then\n\t\t * stretches every other child — including the `header=\"picker\"` nav\n\t\t * row, which sits directly in this container rather than inside\n\t\t * `.month` — to match that same width, instead of each shrinking\n\t\t * independently to its own content.\n\t\t /\n\t\twidth: fit-content;\n\t\tgap: 0.75rem;\n\t\toutline: none;\n\n\t\t&[data-disabled] {\n\t\t\topacity: 0.6;\n\t\t}\n\t}\n\n\t.months {\n\t\tdisplay: flex;\n\t\tgap: 1.5rem;\n\t}\n\n\t.month {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\tgap: 0.5rem;\n\t}\n\n\t.nav {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: space-between;\n\t\tgap: 0.5rem;\n\t}\n\n\t.pickerGroup {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\tgap: 0.375rem;\n\t\tflex: 1;\n\t}\n\n\t.chevronFlipped {\n\t\ttransform: rotate(180deg);\n\t}\n\n\t.heading {\n\t\tflex: 1;\n\t\tmargin: 0;\n\t\ttext-align: center;\n\t\tcolor: var(--lol-color-gold-100);\n\t\tfont-family: var(--lol-font-family-beaufort);\n\t\ttext-transform: uppercase;\n\t\tfont-size: var(--lol-font-size-sm);\n\t\tfont-weight: var(--lol-font-weight-h5);\n\t\tletter-spacing: var(--lol-letter-spacing-h5);\n\t}\n\n\t.grid {\n\t\t/\n\t\t * `separate` (not `collapse`) is what makes the continuous-selection\n\t\t * border below work at all: `collapse` merges each pair of adjacent\n\t\t * cells' touching borders into one, picking a winner between a\n\t\t * selected row's colored edge and its unselected neighbor's\n\t\t * transparent one — which silently erases every other segment of the\n\t\t * \"continuous\" line. `separate` keeps each cell's border independent.\n\t\t \n\t\t The table is sized to exactly 7 cells wide rather than `100%`: with\n\t\t * no intrinsic width, it stretches to fill whatever it's placed in\n\t\t * (a popover, a wide form), dragging the popover along with it and\n\t\t * spacing the 7 columns far enough apart that `.cell`'s fixed size\n\t\t * reads as small islands with visible gaps instead of a tight grid.\n\t\t \n\t\t `border-spacing` is 0 horizontally (columns within a week must\n\t\t * touch, or the continuous selection border above breaks into\n\t\t * islands again) but 3px vertically: with no gap between rows, two\n\t\t * consecutive fully-selected weeks touch top-border-to-bottom-border\n\t\t * and read as one tall block instead of two separate rounded bars.\n\t\t /\n\t\tborder-collapse: separate;\n\t\tborder-spacing: 0 3px;\n\t\ttable-layout: fixed;\n\t\twidth: calc(var(--lol-calendar-cell-size) 7);\n\t}\n\n\t.gridHeader {\n\t\t/* thead: no visual treatment of its own beyond the cells within it. /\n\t}\n\n\t.headerCell {\n\t\tpadding: 0 0 0.5rem 0;\n\t\tfont-family: var(--lol-font-family-spiegel);\n\t\tfont-size: var(--lol-font-size-xs);\n\t\tfont-weight: 700;\n\t\tletter-spacing: 0.05em;\n\t\ttext-transform: uppercase;\n\t\ttext-align: center;\n\t\tcolor: var(--lol-color-grey-100);\n\t}\n\n\t.cell {\n\t\tposition: relative;\n\t\tz-index: 0;\n\t\twidth: 100%;\n\t\theight: var(--lol-calendar-cell-size);\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\n\t\tfont-family: var(--lol-font-family-spiegel);\n\t\tfont-size: var(--lol-font-size-sm);\n\t\tfont-weight: 500;\n\t\tcolor: var(--lol-color-gold-100);\n\n\t\tborder-radius: 9999px;\n\t\toutline: none;\n\t\tcursor: default;\n\t\t-webkit-tap-highlight-color: transparent;\n\n\t\t&[data-outside-month] {\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t}\n\n\t\t&[data-outside-visible-range] {\n\t\t\tvisibility: hidden;\n\t\t}\n\n\t\t&[data-unavailable] {\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t\ttext-decoration: line-through;\n\t\t}\n\n\t\t&[data-disabled] {\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t}\n\n\t\t&[data-hovered]:not([data-disabled], [data-selected]) {\n\t\t\tbackground-color: var(--lol-color-grey-300);\n\t\t}\n\n\t\t&[data-pressed]:not([data-disabled]) {\n\t\t\tbackground-color: var(--lol-color-grey-200);\n\t\t}\n\n\t\t&[data-focus-visible] {\n\t\t\tz-index: 2;\n\t\t\toutline: 2px solid var(--lol-color-gold-400);\n\t\t\toutline-offset: 2px;\n\t\t}\n\n\t\t&[data-invalid] {\n\t\t\tcolor: var(--lol-color-gold-400);\n\t\t}\n\n\t\t&[data-today]:not([data-selected]) {\n\t\t\tcolor: var(--lol-color-gold-400);\n\t\t\tfont-weight: 700;\n\n\t\t\t&::after {\n\t\t\t\tcontent: \"\";\n\t\t\t\tposition: absolute;\n\t\t\t\tbottom: 0.25rem;\n\t\t\t\twidth: 3px;\n\t\t\t\theight: 3px;\n\t\t\t\tborder-radius: 9999px;\n\t\t\t\tbackground-color: var(--lol-color-gold-400);\n\t\t\t}\n\t\t}\n\t}\n\n\t/\n\t * `border-color` can't be a gradient, and `border-image` (which can) turns\n\t * out not to clip to `border-radius` — it paints a sharp rectangular frame\n\t * regardless, which is exactly wrong for a rounded pill. So the ring is\n\t * drawn the other way around: the cell's own `background` is the gold\n\t * gradient, filling its full (possibly rounded) shape, and a `::before`\n\t * sits on top with the hextech fill, inset by the ring's 2px thickness —\n\t * the same `--lol-gradient-hextech` a selected `ToggleButton` fills itself\n\t * with, so a selected date reads as the same \"active\" surface as\n\t * everywhere else in the library. `border-radius: inherit` copies\n\t * whatever radius the cell itself ends up with, so the hextech layer's\n\t * corners always match the gold shape's. Where its inset is 0 on a given\n\t * side, it covers that side's gold completely — which is how a\n\t * RangeCalendar's row-interior cells (below) suppress the ring on their\n\t * left/right and stay open into their neighbors, so the hextech fill\n\t * (identical in every selected cell) reads as one continuous surface\n\t * running the length of the range, across as many rows as it spans.\n\t * `z-index: -1` keeps it behind the day number: an absolutely-positioned\n\t * box otherwise paints above plain in-flow text regardless of source\n\t * order, which would bury the digit under it. No inset `box-shadow` here\n\t * (unlike the selected `ToggleButton` it borrows the fill from): a\n\t * per-cell shadow is a per-cell seam, visible at every date within a\n\t * selected run instead of once around the whole shape.\n\t /\n\t.calendar .cell[data-selected],\n\t.rangeCalendar .cell[data-selected] {\n\t\tposition: relative;\n\t\tbackground: var(--lol-gradient-gold);\n\t\tcolor: var(--lol-color-blue-100);\n\n\t\t&::before {\n\t\t\tcontent: \"\";\n\t\t\tposition: absolute;\n\t\t\tz-index: -1;\n\t\t\ttop: 2px;\n\t\t\tbottom: 2px;\n\t\t\tleft: 0;\n\t\t\tright: 0;\n\t\t\tbackground: var(--lol-gradient-hextech);\n\t\t\tborder-radius: inherit;\n\t\t}\n\t}\n\n\t/\n\t * Single-selection Calendar: exactly one date can be selected, so it's\n\t * always drawn as a standalone rounded pill — there's no row to stay\n\t * continuous with.\n\t /\n\t.calendar .cell[data-selected] {\n\t\tborder-radius: 9999px;\n\n\t\t&::before {\n\t\t\tleft: 2px;\n\t\t\tright: 2px;\n\t\t}\n\t}\n\n\t/\n\t * RangeCalendar: the selection is a run of adjacent cells, and the ring\n\t * needs to read as one continuous gold outline around that whole shape\n\t * rather than a stack of separate pills. By default a selected cell is\n\t * square and open on both sides (the black layer covers left/right\n\t * completely), so the gold shows only along the top/bottom and one cell's\n\t * fill runs straight into the next. Only the actual start/end of the\n\t * range, or a cell sitting at the edge of its own week row (the range\n\t * wraps there), opens up a side and rounds that corner — capping the bar\n\t * at the true ends and at every row break. The two rules below only ever\n\t * touch their own side, so a single-day range (both start and end) still\n\t * gets both sides capped.\n\t \n\t A multi-month display (`visibleDuration: {months: 2+}`) adds a second\n\t * way a row can \"break\": when one calendar week straddles two displayed\n\t * months, each month's own grid still renders all 7 columns for that\n\t * week, padding out with the days that belong to the other grid. Those\n\t * padding days are dimmed (`data-outside-month`) but very much still in\n\t * the DOM and, crucially, never carry `data-selected` themselves — even\n\t * when the date they show is selected in its own home grid — to avoid\n\t * two different interactive elements both claiming to be the selected\n\t * Sept 1st. So `td:last-child`/`td:first-child` land on those always-\n\t * unselected padding cells, not on the last/first cell that's actually\n\t * part of the run, and the real edge (e.g. the 31st, sitting right next\n\t * to a dimmed, unselected \"1\") never matches either selector — left\n\t * square instead of capped. The two extra rules below cap a selected\n\t * cell whenever its neighbor plainly isn't selected, for whatever\n\t * reason: this padding, an unavailable date, or anything else that\n\t * breaks the run — which is the same condition `td:first-child`/\n\t * `td:last-child` are really standing in for at a genuine row edge.\n\t /\n\t.rangeCalendar .cell[data-selected] {\n\t\tborder-radius: 0;\n\t}\n\n\t.rangeCalendar .cell[data-selected][data-selection-start],\n\t.rangeCalendar td:first-child > .cell[data-selected],\n\t.rangeCalendar\n\t\ttd:has(.cell:not([data-selected]))\n\t\t+ td\n\t\t> .cell[data-selected] {\n\t\tborder-top-left-radius: 9999px;\n\t\tborder-bottom-left-radius: 9999px;\n\n\t\t&::before {\n\t\t\tleft: 2px;\n\t\t}\n\t}\n\n\t.rangeCalendar .cell[data-selected][data-selection-end],\n\t.rangeCalendar td:last-child > .cell[data-selected],\n\t.rangeCalendar\n\t\ttd:has(+ td .cell:not([data-selected]))\n\t\t> .cell[data-selected] {\n\t\tborder-top-right-radius: 9999px;\n\t\tborder-bottom-right-radius: 9999px;\n\n\t\t&::before {\n\t\t\tright: 2px;\n\t\t}\n\t}\n}\n","import { cx } from \"cva\";\nimport type {\n\tCalendarCellProps as AriaCalendarCellProps,\n\tCalendarGridHeaderProps as AriaCalendarGridHeaderProps,\n\tCalendarGridProps as AriaCalendarGridProps,\n\tCalendarHeaderCellProps as AriaCalendarHeaderCellProps,\n\tCalendarProps as AriaCalendarProps,\n\tRangeCalendarProps as AriaRangeCalendarProps,\n\tDateValue,\n} from \"react-aria-components\";\nimport {\n\tCalendar as AriaCalendar,\n\tCalendarCell as AriaCalendarCell,\n\tCalendarGrid as AriaCalendarGrid,\n\tCalendarGridBody as AriaCalendarGridBody,\n\tCalendarGridHeader as AriaCalendarGridHeader,\n\tCalendarHeaderCell as AriaCalendarHeaderCell,\n\tRangeCalendar as AriaRangeCalendar,\n\tCalendarHeading,\n\tCalendarMonthPicker,\n\tCalendarYearPicker,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport { Button } from \"../button\";\nimport {\n\tSelect,\n\tSelectButton,\n\tSelectListBox,\n\tSelectListBoxItem,\n\tSelectPopover,\n\tSelectValue,\n} from \"../select/select\";\nimport classes from \"./calendar.module.css\";\n\nfunction CalendarChevron({ flip }: { flip?: boolean }) {\n\treturn (\n\t\t<svg\n\t\t\twidth=\"10\"\n\t\t\theight=\"10\"\n\t\t\tviewBox=\"0 0 10 10\"\n\t\t\tfill=\"none\"\n\t\t\taria-hidden=\"true\"\n\t\t\tclassName={flip ? classes.chevronFlipped : undefined}\n\t\t>\n\t\t\t<path\n\t\t\t\td=\"M7 1L3 5L7 9\"\n\t\t\t\tstroke=\"currentColor\"\n\t\t\t\tstrokeWidth=\"1.5\"\n\t\t\t\tstrokeLinecap=\"round\"\n\t\t\t\tstrokeLinejoin=\"round\"\n\t\t\t/>\n\t\t</svg>\n\t);\n}\n\nfunction CalendarNavButton({ slot }: { slot: \"previous\" \| \"next\" }) {\n\treturn (\n\t\t<Button\n\t\t\tpreset=\"text\"\n\t\t\tshape=\"round\"\n\t\t\tsize=\"small\"\n\t\t\tslot={slot}\n\t\t\taria-label={slot === \"previous\" ? \"Previous\" : \"Next\"}\n\t\t>\n\t\t\t<CalendarChevron flip={slot === \"next\"} />\n\t\t</Button>\n\t);\n}\n\n/\n Lets the user jump straight to a month, via a hextech-styled `Select`\n * fed by the calendar's own `CalendarMonthPicker`/`CalendarYearPicker`\n * render props (`aria-label`, `value`, `onChange`, `items`).\n /\nfunction CalendarMonthYearNav() {\n\treturn (\n\t\t<>\n\t\t\t<CalendarMonthPicker>\n\t\t\t\t{({ \"aria-label\": ariaLabel, value, onChange, items }) => (\n\t\t\t\t\t<Select\n\t\t\t\t\t\taria-label={ariaLabel}\n\t\t\t\t\t\tselectedKey={value}\n\t\t\t\t\t\tonSelectionChange={onChange}\n\t\t\t\t\t>\n\t\t\t\t\t\t<SelectButton size=\"small\" style={{ minWidth: \"6.5rem\" }}>\n\t\t\t\t\t\t\t<SelectValue />\n\t\t\t\t\t\t</SelectButton>\n\t\t\t\t\t\t<SelectPopover>\n\t\t\t\t\t\t\t<SelectListBox items={items}>\n\t\t\t\t\t\t\t\t{(item) => (\n\t\t\t\t\t\t\t\t\t<SelectListBoxItem id={item.id}>\n\t\t\t\t\t\t\t\t\t\t{item.formatted}\n\t\t\t\t\t\t\t\t\t</SelectListBoxItem>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</SelectListBox>\n\t\t\t\t\t\t</SelectPopover>\n\t\t\t\t\t</Select>\n\t\t\t\t)}\n\t\t\t</CalendarMonthPicker>\n\t\t\t<CalendarYearPicker>\n\t\t\t\t{({ \"aria-label\": ariaLabel, value, onChange, items }) => (\n\t\t\t\t\t<Select\n\t\t\t\t\t\taria-label={ariaLabel}\n\t\t\t\t\t\tselectedKey={value}\n\t\t\t\t\t\tonSelectionChange={onChange}\n\t\t\t\t\t>\n\t\t\t\t\t\t<SelectButton size=\"small\" style={{ minWidth: \"5rem\" }}>\n\t\t\t\t\t\t\t<SelectValue />\n\t\t\t\t\t\t</SelectButton>\n\t\t\t\t\t\t<SelectPopover>\n\t\t\t\t\t\t\t<SelectListBox items={items}>\n\t\t\t\t\t\t\t\t{(item) => (\n\t\t\t\t\t\t\t\t\t<SelectListBoxItem id={item.id}>\n\t\t\t\t\t\t\t\t\t\t{item.formatted}\n\t\t\t\t\t\t\t\t\t</SelectListBoxItem>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</SelectListBox>\n\t\t\t\t\t\t</SelectPopover>\n\t\t\t\t\t</Select>\n\t\t\t\t)}\n\t\t\t</CalendarYearPicker>\n\t\t</>\n\t);\n}\n\nexport function CalendarHeaderCell({\n\tclassName,\n\t...props\n}: AriaCalendarHeaderCellProps) {\n\treturn (\n\t\t<AriaCalendarHeaderCell\n\t\t\t{...props}\n\t\t\tclassName={cx(classes.headerCell, className)}\n\t\t/>\n\t);\n}\n\nexport function CalendarGridHeader({\n\tclassName,\n\t...props\n}: AriaCalendarGridHeaderProps) {\n\treturn (\n\t\t<AriaCalendarGridHeader\n\t\t\t{...props}\n\t\t\tclassName={cx(classes.gridHeader, className)}\n\t\t/>\n\t);\n}\n\nexport function CalendarCell({ className, ...props }: AriaCalendarCellProps) {\n\treturn (\n\t\t<AriaCalendarCell\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.cell, className),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport function CalendarGrid({\n\tclassName,\n\tweekdayStyle = \"narrow\",\n\t...props\n}: Omit<AriaCalendarGridProps, \"children\">) {\n\treturn (\n\t\t<AriaCalendarGrid\n\t\t\t{...props}\n\t\t\tweekdayStyle={weekdayStyle}\n\t\t\tclassName={cx(classes.grid, className)}\n\t\t>\n\t\t\t<CalendarGridHeader>\n\t\t\t\t{(day) => <CalendarHeaderCell>{day}</CalendarHeaderCell>}\n\t\t\t</CalendarGridHeader>\n\t\t\t<AriaCalendarGridBody>\n\t\t\t\t{(date) => <CalendarCell date={date} />}\n\t\t\t</AriaCalendarGridBody>\n\t\t</AriaCalendarGrid>\n\t);\n}\n\nexport interface CalendarProps<T extends DateValue>\n\textends AriaCalendarProps<T> {\n\t/\n\t `\"heading\"` shows a static \"Month Year\" heading with prev/next buttons.\n\t * `\"picker\"` replaces it with Select-driven month and year dropdowns that\n\t * jump straight to a month, always shown once regardless of\n\t * `visibleDuration`.\n\t \n\t @default \"heading\"\n\t /\n\theader?: \"heading\" \| \"picker\";\n}\n\nexport function Calendar<T extends DateValue>({\n\theader = \"heading\",\n\tclassName,\n\t...props\n}: CalendarProps<T>) {\n\tconst months = props.visibleDuration?.months ?? 1;\n\n\treturn (\n\t\t<AriaCalendar\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.calendar, className),\n\t\t\t)}\n\t\t>\n\t\t\t{header === \"picker\" && (\n\t\t\t\t<div className={classes.nav}>\n\t\t\t\t\t<CalendarNavButton slot=\"previous\" />\n\t\t\t\t\t<div className={classes.pickerGroup}>\n\t\t\t\t\t\t<CalendarMonthYearNav />\n\t\t\t\t\t</div>\n\t\t\t\t\t<CalendarNavButton slot=\"next\" />\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t<div className={classes.months}>\n\t\t\t\t{Array.from({ length: months }, (_, i) => (\n\t\t\t\t\t<div className={classes.month} key={i}>\n\t\t\t\t\t\t{header === \"heading\" && (\n\t\t\t\t\t\t\t<div className={classes.nav}>\n\t\t\t\t\t\t\t\t{i === 0 && <CalendarNavButton slot=\"previous\" />}\n\t\t\t\t\t\t\t\t<CalendarHeading\n\t\t\t\t\t\t\t\t\toffset={{ months: i }}\n\t\t\t\t\t\t\t\t\tclassName={classes.heading}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t{i === months - 1 && <CalendarNavButton slot=\"next\" />}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<CalendarGrid offset={{ months: i }} />\n\t\t\t\t\t</div>\n\t\t\t\t))}\n\t\t\t</div>\n\t\t</AriaCalendar>\n\t);\n}\n\nexport interface RangeCalendarProps<T extends DateValue>\n\textends AriaRangeCalendarProps<T> {\n\t/\n\t `\"heading\"` shows a static \"Month Year\" heading with prev/next buttons.\n\t * `\"picker\"` replaces it with Select-driven month and year dropdowns that\n\t * jump straight to a month, always shown once regardless of\n\t * `visibleDuration`.\n\t \n\t @default \"heading\"\n\t /\n\theader?: \"heading\" \| \"picker\";\n}\n\nexport function RangeCalendar<T extends DateValue>({\n\theader = \"heading\",\n\tclassName,\n\t...props\n}: RangeCalendarProps<T>) {\n\tconst months = props.visibleDuration?.months ?? 1;\n\n\treturn (\n\t\t<AriaRangeCalendar\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.rangeCalendar, className),\n\t\t\t)}\n\t\t>\n\t\t\t{header === \"picker\" && (\n\t\t\t\t<div className={classes.nav}>\n\t\t\t\t\t<CalendarNavButton slot=\"previous\" />\n\t\t\t\t\t<div className={classes.pickerGroup}>\n\t\t\t\t\t\t<CalendarMonthYearNav />\n\t\t\t\t\t</div>\n\t\t\t\t\t<CalendarNavButton slot=\"next\" />\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t<div className={classes.months}>\n\t\t\t\t{Array.from({ length: months }, (_, i) => (\n\t\t\t\t\t<div className={classes.month} key={i}>\n\t\t\t\t\t\t{header === \"heading\" && (\n\t\t\t\t\t\t\t<div className={classes.nav}>\n\t\t\t\t\t\t\t\t{i === 0 && <CalendarNavButton slot=\"previous\" />}\n\t\t\t\t\t\t\t\t<CalendarHeading\n\t\t\t\t\t\t\t\t\toffset={{ months: i }}\n\t\t\t\t\t\t\t\t\tclassName={classes.heading}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t{i === months - 1 && <CalendarNavButton slot=\"next\" />}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<CalendarGrid offset={{ months: i }} />\n\t\t\t\t\t</div>\n\t\t\t\t))}\n\t\t\t</div>\n\t\t</AriaRangeCalendar>\n\t);\n}\n","@layer lol {\n\t.dateInput {\n\t\tbackground:\n\t\t\tvar(--lol-input-background-gradient) padding-box,\n\t\t\tvar(--lol-input-border-gradient) border-box;\n\n\t\t--lol-input-border-gradient: var(--lol-gradient-gold);\n\t\t--lol-input-background-gradient: var(--lol-gradient-hextech-black);\n\n\t\tborder: 1px solid transparent;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\twidth: 100%;\n\t\tmargin: 0;\n\t\tpadding: 0 0.75rem;\n\t\toutline: none;\n\n\t\tfont-family: var(--lol-font-family-spiegel);\n\n\t\t&[data-disabled] {\n\t\t\t--lol-input-border-gradient: var(--lol-gradient-disabled);\n\t\t}\n\n\t\t&[data-focus-within] {\n\t\t\t--lol-input-border-gradient: var(--lol-gradient-gold-hover);\n\t\t\t--lol-input-background-gradient: var(--lol-gradient-grey-focus);\n\t\t}\n\n\t\t&.small {\n\t\t\tmin-height: var(--lol-form-height-small);\n\t\t}\n\n\t\t&.medium {\n\t\t\tmin-height: var(--lol-form-height-medium);\n\t\t}\n\n\t\t&.large {\n\t\t\tmin-height: var(--lol-form-height-large);\n\t\t}\n\t}\n\n\t.segment {\n\t\tpadding: 0 0.125rem;\n\t\tborder-radius: 2px;\n\t\tfont-size: 0.75rem;\n\t\tline-height: 1rem;\n\t\tfont-weight: 500;\n\t\tletter-spacing: 0.025em;\n\t\tcolor: var(--lol-color-gold-100);\n\t\tfont-variant-numeric: tabular-nums;\n\t\toutline: none;\n\t\tcaret-color: transparent;\n\n\t\t/ Literal separators (\"/\", \":\", \",\") sit between segments; they are not\n\t\t editable so they shouldn't pick up hover/focus affordances. /\n\t\t&[data-type=\"literal\"] {\n\t\t\tpadding: 0 0.125rem;\n\t\t\tcolor: var(--lol-color-grey-100);\n\t\t}\n\n\t\t&[data-placeholder] {\n\t\t\tcolor: var(--lol-color-grey-100);\n\t\t}\n\n\t\t&[data-hovered]:not([data-type=\"literal\"]) {\n\t\t\tbackground-color: var(--lol-color-grey-300);\n\t\t}\n\n\t\t&[data-focused]:not([data-type=\"literal\"]) {\n\t\t\tbackground-color: var(--lol-color-gold-600);\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t}\n\n\t\t&[data-disabled] {\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t}\n\n\t\t&[data-readonly] {\n\t\t\tcolor: var(--lol-color-grey-100);\n\t\t}\n\t}\n}\n","import { cva, cx } from \"cva\";\nimport type { ComponentProps } from \"react\";\nimport type {\n\tDateFieldProps as AriaDateFieldProps,\n\tDateInputProps as AriaDateInputProps,\n\tDateSegmentProps as AriaDateSegmentProps,\n\tDateValue,\n} from \"react-aria-components\";\nimport {\n\tDateField as AriaDateField,\n\tDateInput as AriaDateInput,\n\tDateSegment as AriaDateSegment,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport classes from \"./date-field.module.css\";\n\nexport const dateInput = cva({\n\tbase: classes.dateInput,\n\tvariants: {\n\t\tsize: {\n\t\t\tsmall: classes.small,\n\t\t\tmedium: classes.medium,\n\t\t\tlarge: classes.large,\n\t\t},\n\t},\n});\n\nexport function DateSegment({ className, ...props }: AriaDateSegmentProps) {\n\treturn (\n\t\t<AriaDateSegment\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.segment, className),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport function DateInput({\n\tclassName,\n\tsize = \"medium\",\n\tchildren,\n\t...props\n}: Omit<AriaDateInputProps, \"children\"> & {\n\tsize?: \"small\" \| \"medium\" \| \"large\";\n\tchildren?: AriaDateInputProps[\"children\"];\n}) {\n\treturn (\n\t\t<AriaDateInput\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className, values) =>\n\t\t\t\tdateInput({ className, size, ...values }),\n\t\t\t)}\n\t\t>\n\t\t\t{children ?? ((segment) => <DateSegment segment={segment} />)}\n\t\t</AriaDateInput>\n\t);\n}\n\nexport function DateField<T extends DateValue>({\n\tinputProps = {},\n\tchildren,\n\tsize = \"medium\",\n\t...props\n}: AriaDateFieldProps<T> & {\n\tinputProps?: Omit<ComponentProps<typeof DateInput>, \"size\">;\n\tsize?: \"small\" \| \"medium\" \| \"large\";\n}) {\n\treturn (\n\t\t<AriaDateField {...props}>\n\t\t\t{(values) => (\n\t\t\t\t<>\n\t\t\t\t\t{typeof children === \"function\" ? children(values) : children}\n\t\t\t\t\t<DateInput {...inputProps} size={size} />\n\t\t\t\t</>\n\t\t\t)}\n\t\t</AriaDateField>\n\t);\n}\n","@layer lol {\n\t.group {\n\t\tdisplay: flex;\n\t\talign-items: stretch;\n\t\tgap: 1px;\n\t\tpadding: 1px;\n\t\toutline: none;\n\n\t\tbackground-image: var(--lol-gradient-gold);\n\n\t\t&[data-disabled] {\n\t\t\tbackground-image: var(--lol-gradient-disabled);\n\t\t}\n\n\t\t&[data-focus-within] {\n\t\t\tbackground-image: var(--lol-gradient-gold-hover);\n\t\t}\n\n\t\t&.small {\n\t\t\tmin-height: var(--lol-form-height-small);\n\t\t}\n\n\t\t&.medium {\n\t\t\tmin-height: var(--lol-form-height-medium);\n\t\t}\n\n\t\t&.large {\n\t\t\tmin-height: var(--lol-form-height-large);\n\t\t}\n\t}\n\n\t.input {\n\t\tflex: 1;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tmin-width: 0;\n\t\tbackground-color: var(--lol-color-hextech-black);\n\t\tpadding: 0 0.75rem;\n\t\toutline: none;\n\t\tfont-family: var(--lol-font-family-spiegel);\n\n\t\t&[data-disabled] {\n\t\t\tbackground-color: var(--lol-color-grey-300);\n\t\t}\n\t}\n\n\t.separator {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tbackground-color: var(--lol-color-hextech-black);\n\t\tcolor: var(--lol-color-grey-100);\n\t\tpadding: 0 0.125rem;\n\t\tfont-family: var(--lol-font-family-spiegel);\n\t\t/\n\t\t * `.group`'s `gap` is what shows its gold background between every\n\t\t * pair of children — including the two 1px slivers flanking this\n\t\t * dash, which reads as the dash sitting in its own gold-bordered box\n\t\t * rather than as a plain separator between the two dates. Negative\n\t\t * margin pulls it 1px into each neighboring gap, so its own opaque\n\t\t * fill covers those two slivers instead.\n\t\t /\n\t\tmargin: 0 -1px;\n\n\t\t&[data-disabled] {\n\t\t\tbackground-color: var(--lol-color-grey-300);\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t}\n\t}\n\n\t.button {\n\t\t/ A <button> we never paint: without this it falls back to the UA's\n\t\t `buttonface` slab, which is grey under `color-scheme: dark`. /\n\t\tappearance: none;\n\t\tborder: 0;\n\t\tmargin: 0;\n\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\tpadding: 0 0.625rem;\n\n\t\tcolor: var(--lol-color-gold-300);\n\t\tbackground-color: var(--lol-color-hextech-black);\n\n\t\t&[data-hovered] {\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t}\n\n\t\t&[data-pressed] {\n\t\t\tcolor: var(--lol-color-gold-600);\n\t\t}\n\n\t\t&[data-disabled] {\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t\tbackground-color: var(--lol-color-grey-300);\n\t\t}\n\t}\n\n\t/\n\t * The gold border + hextech-black fill are drawn once, on the popover\n\t * itself, and cover it edge to edge — the header and grid inside stay\n\t * transparent so it reads as one continuous surface rather than a stack\n\t * of separately-filled sections. The visible \"hextech\" gradient lives on\n\t * selected dates themselves (see calendar.module.css), not the popover.\n\t /\n\t.popover {\n\t\tpadding: 0.75rem;\n\t\tborder: 2px solid transparent;\n\t\tbox-shadow: 0 2px 4px 0 var(--lol-color-grey-300);\n\t\tbackground:\n\t\t\tvar(--lol-gradient-hextech-black) padding-box,\n\t\t\tvar(--lol-gradient-gold) border-box;\n\t}\n}\n","import { cva, cx } from \"cva\";\nimport type { ComponentProps } from \"react\";\nimport type {\n\tButtonProps as AriaButtonProps,\n\tDatePickerProps as AriaDatePickerProps,\n\tPopoverProps as AriaPopoverProps,\n\tDateValue,\n} from \"react-aria-components\";\nimport {\n\tButton as AriaButton,\n\tDateInput as AriaDateInput,\n\tDatePicker as AriaDatePicker,\n\tGroup as AriaGroup,\n\tPopover as AriaPopover,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport { Calendar, type CalendarProps } from \"./calendar\";\nimport { DateSegment } from \"./date-field\";\nimport classes from \"./date-picker.module.css\";\n\n/* A small calendar glyph for the trigger button. /\nexport function CalendarIcon() {\n\treturn (\n\t\t<svg\n\t\t\twidth=\"16\"\n\t\t\theight=\"17\"\n\t\t\tviewBox=\"0 0 32 34\"\n\t\t\tfill=\"none\"\n\t\t\taria-hidden=\"true\"\n\t\t>\n\t\t\t<path\n\t\t\t\tfillRule=\"evenodd\"\n\t\t\t\tclipRule=\"evenodd\"\n\t\t\t\td=\"M8.23077 30L2 24.8077V7.61692C2 6.51235 2.89543 5.61692 4 5.61692H4.61692L4.61692 5C4.61692 3.89543 5.51235 3 6.61692 3H7.80923C8.9138 3 9.80923 3.89543 9.80923 5V5.61692H21.0964L21.1212 4.9279C21.16 3.85209 22.0434 3 23.1199 3H24.3831C25.4876 3 26.3831 3.89543 26.3831 5V5.61692H27C28.1046 5.61692 29 6.51236 29 7.61692V9.48H2V11.64H29V30H8.23077ZM17.369 17.8088L15.5001 13.827L13.6311 17.8088L9.45215 18.4472L12.4762 21.5467L11.7623 25.923L15.5001 23.8568L19.238 25.923L18.5242 21.5467L21.5481 18.4472L17.369 17.8088Z\"\n\t\t\t\tfill=\"currentColor\"\n\t\t\t/>\n\t\t</svg>\n\t);\n}\n\nexport const dateGroup = cva({\n\tbase: classes.group,\n\tvariants: {\n\t\tsize: {\n\t\t\tsmall: classes.small,\n\t\t\tmedium: classes.medium,\n\t\t\tlarge: classes.large,\n\t\t},\n\t},\n});\n\n/\n The borderless `DateInput` used inside a `DatePicker`/`DateRangePicker`'s\n * `Group`, which draws the border itself. `DateField`/`TimeField` use the\n * standalone, self-bordered `DateInput` from \"./date-field\" instead.\n /\nexport function PickerDateInput({\n\tclassName,\n\tchildren,\n\t...props\n}: Omit<ComponentProps<typeof AriaDateInput>, \"children\"> & {\n\tchildren?: ComponentProps<typeof AriaDateInput>[\"children\"];\n}) {\n\treturn (\n\t\t<AriaDateInput\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.input, className),\n\t\t\t)}\n\t\t>\n\t\t\t{children ?? ((segment) => <DateSegment segment={segment} />)}\n\t\t</AriaDateInput>\n\t);\n}\n\nexport function DatePickerButton({\n\tclassName,\n\tchildren,\n\t...props\n}: AriaButtonProps) {\n\treturn (\n\t\t<AriaButton {...props} className={cx(classes.button, className)}>\n\t\t\t{children ?? <CalendarIcon />}\n\t\t</AriaButton>\n\t);\n}\n\nexport function DatePickerPopover({ className, ...props }: AriaPopoverProps) {\n\treturn (\n\t\t<AriaPopover\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.popover, className),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport function DatePicker<T extends DateValue>({\n\tchildren,\n\tgroupProps = {},\n\tinputProps = {},\n\tbuttonProps = {},\n\tpopoverProps = {},\n\tcalendarProps = {},\n\tsize = \"medium\",\n\t...props\n}: AriaDatePickerProps<T> & {\n\tgroupProps?: ComponentProps<typeof AriaGroup>;\n\tinputProps?: ComponentProps<typeof PickerDateInput>;\n\tbuttonProps?: AriaButtonProps;\n\tpopoverProps?: AriaPopoverProps;\n\tcalendarProps?: Omit<CalendarProps<T>, \"value\" \| \"defaultValue\" \| \"onChange\">;\n\tsize?: \"small\" \| \"medium\" \| \"large\";\n}) {\n\treturn (\n\t\t<AriaDatePicker {...props}>\n\t\t\t{(values) => (\n\t\t\t\t<>\n\t\t\t\t\t{typeof children === \"function\" ? children(values) : children}\n\t\t\t\t\t<AriaGroup\n\t\t\t\t\t\t{...groupProps}\n\t\t\t\t\t\tclassName={composeRenderProps(\n\t\t\t\t\t\t\tgroupProps.className,\n\t\t\t\t\t\t\t(className, v) => dateGroup({ className, size, ...v }),\n\t\t\t\t\t\t)}\n\t\t\t\t\t>\n\t\t\t\t\t\t<PickerDateInput {...inputProps} />\n\t\t\t\t\t\t<DatePickerButton {...buttonProps} />\n\t\t\t\t\t</AriaGroup>\n\t\t\t\t\t<DatePickerPopover {...popoverProps}>\n\t\t\t\t\t\t<Calendar {...calendarProps} />\n\t\t\t\t\t</DatePickerPopover>\n\t\t\t\t</>\n\t\t\t)}\n\t\t</AriaDatePicker>\n\t);\n}\n","import type { ComponentProps } from \"react\";\nimport type {\n\tButtonProps as AriaButtonProps,\n\tDateRangePickerProps as AriaDateRangePickerProps,\n\tPopoverProps as AriaPopoverProps,\n\tDateValue,\n} from \"react-aria-components\";\nimport {\n\tDateRangePicker as AriaDateRangePicker,\n\tGroup as AriaGroup,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport { RangeCalendar, type RangeCalendarProps } from \"./calendar\";\nimport {\n\tDatePickerButton,\n\tDatePickerPopover,\n\tdateGroup,\n\tPickerDateInput,\n} from \"./date-picker\";\nimport classes from \"./date-picker.module.css\";\n\nexport function DateRangePicker<T extends DateValue>({\n\tchildren,\n\tgroupProps = {},\n\tstartInputProps = {},\n\tendInputProps = {},\n\tbuttonProps = {},\n\tpopoverProps = {},\n\tcalendarProps = {},\n\tsize = \"medium\",\n\t// Picking a range takes two clicks (start, then end); closing after the\n\t// first would make it look like the second one never registered.\n\tshouldCloseOnSelect = false,\n\t...props\n}: AriaDateRangePickerProps<T> & {\n\tgroupProps?: ComponentProps<typeof AriaGroup>;\n\tstartInputProps?: ComponentProps<typeof PickerDateInput>;\n\tendInputProps?: ComponentProps<typeof PickerDateInput>;\n\tbuttonProps?: AriaButtonProps;\n\tpopoverProps?: AriaPopoverProps;\n\tcalendarProps?: Omit<\n\t\tRangeCalendarProps<T>,\n\t\t\"value\" \| \"defaultValue\" \| \"onChange\"\n\t>;\n\tsize?: \"small\" \| \"medium\" \| \"large\";\n}) {\n\treturn (\n\t\t<AriaDateRangePicker {...props} shouldCloseOnSelect={shouldCloseOnSelect}>\n\t\t\t{(values) => (\n\t\t\t\t<>\n\t\t\t\t\t{typeof children === \"function\" ? children(values) : children}\n\t\t\t\t\t<AriaGroup\n\t\t\t\t\t\t{...groupProps}\n\t\t\t\t\t\tclassName={composeRenderProps(\n\t\t\t\t\t\t\tgroupProps.className,\n\t\t\t\t\t\t\t(className, v) => dateGroup({ className, size, ...v }),\n\t\t\t\t\t\t)}\n\t\t\t\t\t>\n\t\t\t\t\t\t<PickerDateInput {...startInputProps} slot=\"start\" />\n\t\t\t\t\t\t<span\n\t\t\t\t\t\t\tclassName={classes.separator}\n\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\tdata-disabled={values.isDisabled \|\| undefined}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t–\n\t\t\t\t\t\t</span>\n\t\t\t\t\t\t<PickerDateInput {...endInputProps} slot=\"end\" />\n\t\t\t\t\t\t<DatePickerButton {...buttonProps} />\n\t\t\t\t\t</AriaGroup>\n\t\t\t\t\t<DatePickerPopover {...popoverProps}>\n\t\t\t\t\t\t<RangeCalendar {...calendarProps} />\n\t\t\t\t\t</DatePickerPopover>\n\t\t\t\t</>\n\t\t\t)}\n\t\t</AriaDateRangePicker>\n\t);\n}\n","import type { ComponentProps } from \"react\";\nimport type {\n\tTimeFieldProps as AriaTimeFieldProps,\n\tTimeValue,\n} from \"react-aria-components\";\nimport { TimeField as AriaTimeField } from \"react-aria-components\";\nimport { DateInput } from \"./date-field\";\n\nexport function TimeField<T extends TimeValue>({\n\tinputProps = {},\n\tchildren,\n\tsize = \"medium\",\n\t...props\n}: AriaTimeFieldProps<T> & {\n\tinputProps?: Omit<ComponentProps<typeof DateInput>, \"size\">;\n\tsize?: \"small\" \| \"medium\" \| \"large\";\n}) {\n\treturn (\n\t\t<AriaTimeField {...props}>\n\t\t\t{(values) => (\n\t\t\t\t<>\n\t\t\t\t\t{typeof children === \"function\" ? children(values) : children}\n\t\t\t\t\t<DateInput {...inputProps} size={size} />\n\t\t\t\t</>\n\t\t\t)}\n\t\t</AriaTimeField>\n\t);\n}\n","@layer lol {\n\t.checkbox {\n\t\tfont-family: var(--lol-font-family-spiegel);\n\t\tcolor: var(--lol-color-grey-100);\n\t\tdisplay: flex;\n\t\tcursor: pointer;\n\t\talign-items: center;\n\t\tgap: 0.25rem;\n\t\tfont-size: 0.75rem;\n\t\tletter-spacing: 0.1em;\n\n\t\t&[data-hovered] {\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t}\n\n\t\t&[data-disabled] {\n\t\t\tfilter: brightness(0.5);\n\t\t\tcursor: default;\n\t\t}\n\t}\n\n\t.icon {\n\t\t/ Off the text baseline, so the box is the glyph. /\n\t\tdisplay: block;\n\t\tflex-shrink: 0;\n\t\twidth: 0.875rem;\n\t\theight: 0.875rem;\n\t}\n}\n","\"data:image/png;base64,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\"","\"data:image/png;base64,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\"","\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAMAAAAolt3jAAAAIGNIUk0AAHomAACAhAAA+gAAAIDoAAB1MAAA6mAAADqYAAAXcJy6UTwAAAA2UExURQEKEwEKE0E5IGhVKGhVKEI5IGlWKGpWKWpXKWtXKWtXKWxYKUM6IG1YKUU8IXhaKMibPP///+VfctgAAAAPdFJOUyZAyNXUx9PS0M/OzcXMvkYA5F8AAAABYktHRBHitT26AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH5wkXDDshfoqKzwAAAzx6VFh0UmF3IHByb2ZpbGUgdHlwZSB4bXAAAEiJxVbLttsgDNzzFf0ELIFkPseJza7ndNnP74xIbhLb9zZtF41PCAE0Gj1x+vn9R/qGzyRzTnrV7rNnm0ztYtWLZBOr5tZs01Vk65fLpYtgvVnhSnWtZdVcVs9FcXa2lsrsi0Owqi9lq8XwC0BVCIlo102yXn3WxWeDoK1UZpNk/rerba7cS9QANsU6eegyNj6OB5MHDNYulCgfEpLrXNaak5Bc91hSk02zrOCT8QBCXRvWJjUtqlqxdsWqaHyl4xfKsAOgFcfABN+MUXWWvHvkZp6AhelSpZRiO9MkxSbNm73gARjM6R4f2RynZAvGDs2TNj7BRDAKxnUoACNXR3zoEZ9hFjRw/5UFKCBUCIRYC081eAgn7vs2JTisOxxLVsOxz7Ggg498Q9n2CBHmmjBdYcoMPnTeFO7ue0iI6IkDMiiIXWl8GtbzIMYKwcrQ01RoHcDTERj5NMMSMILBnOX0HvEb74P4w4Z07peyogT+RMWcXn0DwPXEEPVSqtsIyTl4OkN/BWeFOoKOM71KpEEPJ6NcCT88mpgzQz91FGZKBRD9IJVKul0P1XX0FZwtt8hkmWu0DgogrVXaJypqKeOXCu51x1pj4XH0WmIxKi6qr8qFu5ijiF9gV2PKNDNvAza94gZgiUJugB3lLABeUP0lYOUUtibWmA2q0xnld6HTwI4SWMyizlfCRaAb52i6NZJxQw2Qx8HV9CBr7Urxm9WDjX4q0EBDK6u+Q21jSVHCNaFNod+jT7YC5ugU7DlIERgjEc0PX0S2A4opGA7ZIpPgbEKlcQjp2OKOWNBcAYdAY0CnqehQE2JYogVP0A/WmKEPUSHVsTGbMGrN6DwI4rgdGDANkRn3nnBn8EGgDALpbxnsCaQDA8atjesRQNf/weh+lz6xwhUckQE7b7vLCJHy6XUNSdBwQT51m4VvAPc7IlLyqVR5he9OP6VCes6Ff0mF9JXdewbuyPA6uL7UIrpHerN9PMOxk2IG2ImGl6jGxJC+0wF/0wB7Gv6XfhaV6N9fxvIhl85v9QN8vIE84PevXbolbp28/FVSj0jKeG9LvwCmH1eI6Lix8QAAAD9JREFUCNeNzzkOACAMA8GE+4b/vxYUQMId201nE/ETEfcnXlTa7KzQjJNDemQQusuITMj8weJDynXVhDASL0wdRwfQJZFBnAAAACV0RVh0ZGF0ZTpjcmVhdGUAMjAyMy0wOS0yM1QxMjo1OToxNiswMDowMMk4lEsAAAAldEVYdGRhdGU6bW9kaWZ5ADIwMjMtMDktMjNUMTI6NTk6MTYrMDA6MDC4ZSz3AAAAKHRFWHRkYXRlOnRpbWVzdGFtcAAyMDIzLTA5LTIzVDEyOjU5OjMzKzAwOjAw/20l8gAAAABJRU5ErkJggg==\"","\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAMAAAAolt3jAAAAIGNIUk0AAHomAACAhAAA+gAAAIDoAAB1MAAA6mAAADqYAAAXcJy6UTwAAAB+UExURQEKEwEKE05RUX18dn18dk9SUX59d359d4B/eX9+d4KBen9+eIOCe4B/eYaEfYGAeYeFfoKAeoiGfoKBeoiHf1ZYVoOCe4aEfYeGfoiGf4mHf11eXHhaKHlcKXtdK/Dm0n5gLIBiLoNlMYZoM4lrNYxuOJFzPJl7QqCCSP///0lElLIAAAAcdFJOUyZAyNXUx9PU0tTQ1NDUz9TP1M/Uz8jU0tDQz8FE4StQAAAAAWJLR0QpyreFJAAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAd0SU1FB+cJFww7IX6Kis8AAAM8elRYdFJhdyBwcm9maWxlIHR5cGUgeG1wAABIicVWy7bbIAzc8xX9BCyBZD7Hic2u53TZz++MSG4S2/c2bReNTwgBNBo9cfr5/Uf6hs8kc0561e6zZ5tM7WLVi2QTq+bWbNNVZOuXy6WLYL1Z4Up1rWXVXFbPRXF2tpbK7ItDsKovZavF8AtAVQiJaNdNsl591sVng6CtVGaTZP63q22u3EvUADbFOnnoMjY+jgeTBwzWLpQoHxKS61zWmpOQXPdYUpNNs6zgk/EAQl0b1iY1LapasXbFqmh8peMXyrADoBXHwATfjFF1lrx75GaegIXpUqWUYjvTJMUmzZu94AEYzOkeH9kcp2QLxg7NkzY+wUQwCsZ1KAAjV0d86BGfYRY0cP+VBSggVAiEWAtPNXgIJ+77NiU4rDscS1bDsc+xoIOPfEPZ9ggR5powXWHKDD503hTu7ntIiOiJAzIoiF1pfBrW8yDGCsHK0NNUaB3A0xEY+TTDEjCCwZzl9B7xG++D+MOGdO6XsqIE/kTFnF59A8D1xBD1UqrbCMk5eDpDfwVnhTqCjjO9SqRBDyejXAk/PJqYM0M/dRRmSgUQ/SCVSrpdD9V19BWcLbfIZJlrtA4KIK1V2icqainjlwrudcdaY+Fx9FpiMSouqq/KhbuYo4hfYFdjyjQzbwM2veIGYIlCboAd5SwAXlD9JWDlFLYm1pgNqtMZ5Xeh08COEljMos5XwkWgG+doujWScUMNkMfB1fQga+1K8ZvVg41+KtBAQyurvkNtY0lRwjWhTaHfo0+2AuboFOw5SBEYIxHND19EtgOKKRgO2SKT4GxCpXEI6djijljQXAGHQGNAp6noUBNiWKIFT9AP1pihD1Eh1bExmzBqzeg8COK4HRgwDZEZ955wZ/BBoAwC6W8Z7AmkAwPGrY3rEUDX/8Hofpc+scIVHJEBO2+7ywiR8ul1DUnQcEE+dZuFbwD3OyJS8qlUeYXvTj+lQnrOhX9JhfSV3XsG7sjwOri+1CK6R3qzfTzDsZNiBtiJhpeoxsSQvtMBf9MAexr+l34WlejfX8byIZfOb/UDfLyBPOD3r126JW6dvPxVUo9IynhvS78Aph9XiOi4sfEAAABhSURBVAjXTc9HDoAwEEPRCb33XkPn/ifECEbK372dTSSUiMSgJEiMmm58mSM46fOfNYHSZjoSXFymt4CrzwxWcAuZ0QbuMTPZwSNlZgd45sziBK+yqpu2Q/0F3krvaPXCA/W/D7FK8tWfAAAAJXRFWHRkYXRlOmNyZWF0ZQAyMDIzLTA5LTIzVDEyOjU5OjE2KzAwOjAwyTiUSwAAACV0RVh0ZGF0ZTptb2RpZnkAMjAyMy0wOS0yM1QxMjo1OToxNiswMDowMLhlLPcAAAAodEVYdGRhdGU6dGltZXN0YW1wADIwMjMtMDktMjNUMTI6NTk6MzMrMDA6MDD/bSXyAAAAAElFTkSuQmCC\"","\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAMAAAAolt3jAAAAIGNIUk0AAHomAACAhAAA+gAAAIDoAAB1MAAA6mAAADqYAAAXcJy6UTwAAAByUExURQEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKE3haKP///2Sxk/UAAAAkdFJOUyZAtbSzmpmYl7KWlZSTsJGQj62OjKqLiomoiIensYavrKmmpcCVLPgAAAABYktHRCXDAckPAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH5wkXDDshfoqKzwAAAzx6VFh0UmF3IHByb2ZpbGUgdHlwZSB4bXAAAEiJxVbLttsgDNzzFf0ELIFkPseJza7ndNnP74xIbhLb9zZtF41PCAE0Gj1x+vn9R/qGzyRzTnrV7rNnm0ztYtWLZBOr5tZs01Vk65fLpYtgvVnhSnWtZdVcVs9FcXa2lsrsi0Owqi9lq8XwC0BVCIlo102yXn3WxWeDoK1UZpNk/rerba7cS9QANsU6eegyNj6OB5MHDNYulCgfEpLrXNaak5Bc91hSk02zrOCT8QBCXRvWJjUtqlqxdsWqaHyl4xfKsAOgFcfABN+MUXWWvHvkZp6AhelSpZRiO9MkxSbNm73gARjM6R4f2RynZAvGDs2TNj7BRDAKxnUoACNXR3zoEZ9hFjRw/5UFKCBUCIRYC081eAgn7vs2JTisOxxLVsOxz7Ggg498Q9n2CBHmmjBdYcoMPnTeFO7ue0iI6IkDMiiIXWl8GtbzIMYKwcrQ01RoHcDTERj5NMMSMILBnOX0HvEb74P4w4Z07peyogT+RMWcXn0DwPXEEPVSqtsIyTl4OkN/BWeFOoKOM71KpEEPJ6NcCT88mpgzQz91FGZKBRD9IJVKul0P1XX0FZwtt8hkmWu0DgogrVXaJypqKeOXCu51x1pj4XH0WmIxKi6qr8qFu5ijiF9gV2PKNDNvAza94gZgiUJugB3lLABeUP0lYOUUtibWmA2q0xnld6HTwI4SWMyizlfCRaAb52i6NZJxQw2Qx8HV9CBr7Urxm9WDjX4q0EBDK6u+Q21jSVHCNaFNod+jT7YC5ugU7DlIERgjEc0PX0S2A4opGA7ZIpPgbEKlcQjp2OKOWNBcAYdAY0CnqehQE2JYogVP0A/WmKEPUSHVsTGbMGrN6DwI4rgdGDANkRn3nnBn8EGgDALpbxnsCaQDA8atjesRQNf/weh+lz6xwhUckQE7b7vLCJHy6XUNSdBwQT51m4VvAPc7IlLyqVR5he9OP6VCes6Ff0mF9JXdewbuyPA6uL7UIrpHerN9PMOxk2IG2ImGl6jGxJC+0wF/0wB7Gv6XfhaV6N9fxvIhl85v9QN8vIE84PevXbolbp28/FVSj0jKeG9LvwCmH1eI6Lix8QAAAG1JREFUCNdtz8sWQCAUheFyq9ShiCJ33v8ZWZ0Ja/ln32xvQugrQuj1ij5MkjTDItO8YIxxzkRkVvBSKgBVIbmEWhujm0hRgm7tU4eUdds7792AVNq6MYRxipzBWB+WJfxSrNs+Hed5ID8jvxduz6sNC/KE5/MAAAAldEVYdGRhdGU6Y3JlYXRlADIwMjMtMDktMjNUMTI6NTk6MTYrMDA6MDDJOJRLAAAAJXRFWHRkYXRlOm1vZGlmeQAyMDIzLTA5LTIzVDEyOjU5OjE2KzAwOjAwuGUs9wAAACh0RVh0ZGF0ZTp0aW1lc3RhbXAAMjAyMy0wOS0yM1QxMjo1OTozMyswMDowMP9tJfIAAAAASUVORK5CYII=\"","\"data:image/png;base64,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\"","import { cx } from \"cva\";\nimport type {\n\tCheckboxButtonProps,\n\tCheckboxFieldProps,\n} from \"react-aria-components\";\nimport {\n\tCheckboxButton as AriaCheckboxButton,\n\tCheckboxField as AriaCheckboxField,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport classes from \"./checkbox.module.css\";\nimport imageChecked from \"./checkbox-checked.png\";\nimport imageCheckedHover from \"./checkbox-checked-hover.png\";\nimport imageIndeterminate from \"./checkbox-indeterminate.png\";\nimport imageIndeterminateHover from \"./checkbox-indeterminate-hover.png\";\nimport imageUnchecked from \"./checkbox-unchecked.png\";\nimport imageUncheckedHover from \"./checkbox-unchecked-hover.png\";\n\nfunction checkboxIcon(values: {\n\tisHovered: boolean;\n\tisIndeterminate: boolean;\n\tisSelected: boolean;\n}) {\n\treturn values.isHovered\n\t\t? values.isIndeterminate\n\t\t\t? imageIndeterminateHover\n\t\t\t: values.isSelected\n\t\t\t\t? imageCheckedHover\n\t\t\t\t: imageUncheckedHover\n\t\t: values.isIndeterminate\n\t\t\t? imageIndeterminate\n\t\t\t: values.isSelected\n\t\t\t\t? imageChecked\n\t\t\t\t: imageUnchecked;\n}\n\nexport function CheckboxButton({\n\tchildren,\n\tclassName,\n\t...props\n}: CheckboxButtonProps) {\n\treturn (\n\t\t<AriaCheckboxButton\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.checkbox, className),\n\t\t\t)}\n\t\t>\n\t\t\t{composeRenderProps(children, (children, values) => (\n\t\t\t\t<>\n\t\t\t\t\t<img\n\t\t\t\t\t\tclassName={classes.icon}\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\talt=\"\"\n\t\t\t\t\t\tsrc={checkboxIcon(values)}\n\t\t\t\t\t/>\n\t\t\t\t\t{children}\n\t\t\t\t</>\n\t\t\t))}\n\t\t</AriaCheckboxButton>\n\t);\n}\n\nexport function CheckboxField({ className, ...props }: CheckboxFieldProps) {\n\treturn <AriaCheckboxField {...props} className={className} />;\n}\n\nexport function Checkbox({\n\tchildren,\n\tclassName,\n\t...props\n}: Omit<CheckboxFieldProps, \"children\" \| \"className\"> &\n\tPick<CheckboxButtonProps, \"children\" \| \"className\">) {\n\treturn (\n\t\t<CheckboxField {...props}>\n\t\t\t<CheckboxButton className={className}>{children}</CheckboxButton>\n\t\t</CheckboxField>\n\t);\n}\n","@layer lol {\n\t.disclosureButton {\n\t\t/ A <button> we never paint: without this it falls back to the UA's\n\t\t `buttonface` slab, which is grey under `color-scheme: dark`. /\n\t\tappearance: none;\n\t\tbackground: none;\n\t\tborder: 0;\n\t\tmargin: 0;\n\t\tfont: inherit;\n\t\tletter-spacing: inherit;\n\n\t\tcolor: var(--lol-color-grey-100);\n\t\tfont-family: var(--lol-font-family-beaufort);\n\n\t\t&:active,\n\t\t&:hover {\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t}\n\n\t\tdisplay: flex;\n\t\twidth: 100%;\n\t\talign-items: center;\n\t\tpadding: 0.5rem 0;\n\t\tfont-weight: bold;\n\t\ttext-transform: uppercase;\n\t\ttext-align: left;\n\t}\n\n\t.icon {\n\t\tmargin-left: 0.125rem;\n\t\tmargin-right: 0.5rem;\n\t\tdisplay: inline-block;\n\t\trotate: 90deg;\n\t\tfont-size: var(--lol-font-size-sm);\n\t}\n\n\t.disclosure {\n\t\tborder-bottom: 1px solid var(--lol-color-gold-600);\n\n\t\t&:last-of-type {\n\t\t\tborder-bottom: none;\n\t\t}\n\t}\n\n\t.disclosurePanel {\n\t\tcolor: var(--lol-color-grey-100);\n\t\tfont-family: var(--lol-font-family-spiegel);\n\n\t\t@media (prefers-reduced-motion: no-preference) {\n\t\t\ttransition-behavior: allow-discrete;\n\t\t\tinterpolate-size: allow-keywords;\n\n\t\t\toverflow-y: clip;\n\n\t\t\ttransition-property: content-visibility, height;\n\t\t\ttransition-timing-function: ease;\n\t\t\ttransition-duration: 150ms;\n\n\t\t\theight: auto;\n\t\t\t&[aria-hidden=\"true\"] {\n\t\t\t\theight: 0;\n\t\t\t}\n\t\t}\n\t}\n}\n","\"use client\";\n\nimport { cx } from \"cva\";\nimport {\n\tDisclosure as AriaDisclosure,\n\tDisclosureGroup as AriaDisclosureGroup,\n\tDisclosurePanel as AriaDisclosurePanel,\n\tButton,\n\ttype ButtonProps,\n\tcomposeRenderProps,\n\ttype DisclosurePanelProps,\n\ttype DisclosureProps,\n} from \"react-aria-components\";\n\nimport classes from \"./disclosure.module.css\";\n\nexport const DisclosureGroup = AriaDisclosureGroup;\n\nexport function DisclosureButton({\n\tchildren,\n\tclassName,\n\t...props\n}: ButtonProps) {\n\treturn (\n\t\t<Button\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.disclosureButton, className),\n\t\t\t)}\n\t\t\tslot=\"trigger\"\n\t\t>\n\t\t\t{composeRenderProps(children, (children) => (\n\t\t\t\t<>\n\t\t\t\t\t<span className={classes.icon}>❯</span>\n\t\t\t\t\t{children}\n\t\t\t\t</>\n\t\t\t))}\n\t\t</Button>\n\t);\n}\n\nexport function Disclosure({ className, ...props }: DisclosureProps) {\n\treturn (\n\t\t<AriaDisclosure\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(className, classes.disclosure),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport function DisclosurePanel({ className, ...props }: DisclosurePanelProps) {\n\treturn (\n\t\t<AriaDisclosurePanel\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(className, classes.disclosurePanel),\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n","@layer lol {\n\t.divider {\n\t\theight: 1px;\n\t\tflex-grow: 1;\n\t\tborder: none;\n\t\t/ An <hr>: the UA gives it 0.5em block margins and a grey `color`. /\n\t\tmargin: 0;\n\t\tcolor: inherit;\n\t\tdisplay: flex;\n\t}\n\n\t.left {\n\t\tbackground-image: linear-gradient(\n\t\t\tto right,\n\t\t\trgba(0, 0, 0, 0),\n\t\t\tvar(--lol-color-gold-600)\n\t\t);\n\t}\n\n\t.center {\n\t\tbackground-image: linear-gradient(\n\t\t\tto right,\n\t\t\trgba(0, 0, 0, 0),\n\t\t\tvar(--lol-color-gold-600),\n\t\t\trgba(0, 0, 0, 0)\n\t\t);\n\t}\n\n\t.right {\n\t\tbackground-image: linear-gradient(\n\t\t\tto right,\n\t\t\tvar(--lol-color-gold-600),\n\t\t\trgba(0, 0, 0, 0)\n\t\t);\n\t}\n\n\t.block {\n\t\twidth: 5px;\n\t\theight: 5px;\n\t\tborder: 1px solid var(--lol-color-gold-600);\n\t\trotate: 45deg;\n\t}\n\n\t.wrapper {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tflex-grow: 1;\n\t}\n\n\t.childrenWrapper {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tgap: 2rem;\n\t\tflex-grow: 1;\n\t}\n}\n","import { cva, cx } from \"cva\";\nimport classes from \"./divider.module.css\";\n\nconst divider = cva({\n\tbase: classes.divider,\n\tvariants: {\n\t\tpreset: {\n\t\t\tleft: classes.left,\n\t\t\tcenter: classes.center,\n\t\t\tright: classes.right,\n\t\t},\n\t},\n});\n\ninterface DividerProps extends React.HTMLAttributes<HTMLDivElement> {\n\tpreset?: \"left\" \| \"center\" \| \"right\";\n\thrProps?: React.HTMLAttributes<HTMLHRElement>;\n\tchildrenWrapperProps?: React.HTMLAttributes<HTMLDivElement>;\n}\nexport function Divider({\n\tpreset = \"center\",\n\thrProps: { className: hrClassName, ...hrProps } = {},\n\tchildrenWrapperProps: {\n\t\tclassName: childrenWrapperClassName,\n\t\t...childrenWrapperProps\n\t} = {},\n\tclassName,\n\tchildren,\n\t...rest\n}: DividerProps) {\n\tif (children) {\n\t\treturn (\n\t\t\t<div\n\t\t\t\t{...childrenWrapperProps}\n\t\t\t\tclassName={cx(classes.childrenWrapper, childrenWrapperClassName)}\n\t\t\t>\n\t\t\t\t{(preset === \"center\" \|\| preset === \"left\") && (\n\t\t\t\t\t<Divider preset=\"left\" />\n\t\t\t\t)}\n\t\t\t\t{children}\n\t\t\t\t{(preset === \"center\" \|\| preset === \"right\") && (\n\t\t\t\t\t<Divider preset=\"right\" />\n\t\t\t\t)}\n\t\t\t</div>\n\t\t);\n\t}\n\treturn (\n\t\t<div className={cx(classes.wrapper, className)} {...rest}>\n\t\t\t{preset === \"right\" && <div className={classes.block} />}\n\t\t\t<hr\n\t\t\t\t{...hrProps}\n\t\t\t\tclassName={divider({ preset, className: hrClassName })}\n\t\t\t/>\n\t\t\t{preset === \"left\" && <div className={classes.block} />}\n\t\t</div>\n\t);\n}\n","@layer lol {\n\t.heading {\n\t\t/ Rendered as h1-h5, which the UA gives block margins scaled to the font. /\n\t\tmargin: 0;\n\t\tfont-family: var(--lol-font-family-beaufort);\n\t\tscroll-margin-top: 5rem;\n\t\ttext-transform: uppercase;\n\t}\n\n\t.h1 {\n\t\tfont-size: var(--lol-font-size-h1);\n\t\tline-height: var(--lol-line-height-h1);\n\t\tletter-spacing: var(--lol-letter-spacing-h1);\n\t\tfont-weight: var(--lol-font-weight-h1);\n\t}\n\n\t.h2 {\n\t\tfont-size: var(--lol-font-size-h2);\n\t\tline-height: var(--lol-line-height-h2);\n\t\tletter-spacing: var(--lol-letter-spacing-h2);\n\t\tfont-weight: var(--lol-font-weight-h2);\n\t}\n\n\t.h3 {\n\t\tfont-size: var(--lol-font-size-h3);\n\t\tline-height: var(--lol-line-height-h3);\n\t\tletter-spacing: var(--lol-letter-spacing-h3);\n\t\tfont-weight: var(--lol-font-weight-h3);\n\t}\n\n\t.h4 {\n\t\tfont-size: var(--lol-font-size-h4);\n\t\tline-height: var(--lol-line-height-h4);\n\t\tletter-spacing: var(--lol-letter-spacing-h4);\n\t\tfont-weight: var(--lol-font-weight-h4);\n\t}\n\n\t.h5 {\n\t\tfont-size: var(--lol-font-size-h5);\n\t\tline-height: var(--lol-line-height-h5);\n\t\tletter-spacing: var(--lol-letter-spacing-h5);\n\t\tfont-weight: var(--lol-font-weight-h5);\n\t}\n\n\t.grey100 {\n\t\tcolor: var(--lol-color-grey-100);\n\t}\n\n\t.gold100 {\n\t\tcolor: var(--lol-color-gold-100);\n\t}\n\n\t.gold200 {\n\t\tcolor: var(--lol-color-gold-200);\n\t}\n\n\t.gold400 {\n\t\tcolor: var(--lol-color-gold-400);\n\t}\n}\n","import { cva } from \"cva\";\nimport { createElement, type JSX } from \"react\";\nimport classes from \"./heading.module.css\";\n\nexport type HeadingColor = \"gold100\" \| \"gold200\" \| \"gold400\" \| \"grey100\";\nexport type HeadingElement = \"h1\" \| \"h2\" \| \"h3\" \| \"h4\" \| \"h5\";\n\ninterface HeadingProps\n\textends React.DetailedHTMLProps<\n\t\tReact.HTMLAttributes<HTMLHeadingElement>,\n\t\tHTMLHeadingElement\n\t> {\n\tpreset?: HeadingElement;\n\tcolor?: HeadingColor;\n\tas?: HeadingElement \| \"span\";\n}\n\nexport const heading = cva({\n\tbase: classes.heading,\n\tvariants: {\n\t\tcolor: {\n\t\t\tgold100: classes.gold100,\n\t\t\tgold200: classes.gold200,\n\t\t\tgold400: classes.gold400,\n\t\t\tgrey100: classes.grey100,\n\t\t},\n\t\tpreset: {\n\t\t\th1: classes.h1,\n\t\t\th2: classes.h2,\n\t\t\th3: classes.h3,\n\t\t\th4: classes.h4,\n\t\t\th5: classes.h5,\n\t\t},\n\t},\n});\n\nexport function Heading({\n\tas,\n\tpreset = \"h1\",\n\tcolor = \"gold100\",\n\tclassName,\n\t...rest\n}: HeadingProps): JSX.Element {\n\tconst resultAs = as ?? preset;\n\n\treturn createElement(resultAs, {\n\t\t...rest,\n\t\tclassName: heading({ preset, color, className }),\n\t});\n}\n","@layer lol {\n\t.menu {\n\t\tbox-sizing: border-box;\n\t\toverflow: auto;\n\t\tmin-width: 150px;\n\t\toutline: none;\n\n\t\tbackground:\n\t\t\tvar(--lol-button-background-gradient) padding-box,\n\t\t\tvar(--lol-button-border-gradient) border-box;\n\n\t\t--lol-button-border-gradient: linear-gradient(\n\t\t\tto bottom,\n\t\t\tvar(--lol-color-gold-600),\n\t\t\tvar(--lol-color-gold-600),\n\t\t\tvar(--lol-color-gold-500)\n\t\t);\n\t\t--lol-button-background-gradient: var(--lol-gradient-hextech-black);\n\n\t\tborder: 2px solid transparent;\n\n\t\tfont-family: var(--lol-font-family-spiegel);\n\t}\n\n\t.item {\n\t\tpadding: 0.375rem 0.5rem;\n\t\toutline: none;\n\t\tfont-size: var(--lol-font-size-sm);\n\t\tline-height: var(--lol-line-height-sm);\n\t\tfont-weight: var(--lol-font-weight-sm);\n\t\tletter-spacing: var(--lol-letter-spacing-sm);\n\t\tcolor: var(--lol-color-gold-300);\n\n\t\t&[data-disabled] {\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t}\n\n\t\t&[data-hovered],\n\t\t&[data-focus-visible] {\n\t\t\tbackground: var(--lol-color-grey-300);\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t}\n\n\t\t&[data-pressed] {\n\t\t\tcolor: var(--lol-color-gold-300);\n\t\t}\n\n\t\t&[data-selection-mode] {\n\t\t\tpadding-right: 2rem;\n\t\t}\n\n\t\t&[data-selected] {\n\t\t\tbackground-image: url(../select/select-dropdown-check.png);\n\t\t\tbackground-position: right 0.5rem center;\n\t\t\tbackground-repeat: no-repeat;\n\t\t}\n\t\t&[aria-haspopup] {\n\t\t\tbackground-image: url(./menu-arrow.png);\n\t\t\tbackground-size: 12px;\n\t\t\tbackground-position: right 0.5rem center;\n\t\t\tbackground-repeat: no-repeat;\n\t\t}\n\t}\n\n\t.popover {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t}\n\n\t.section:not(:first-child) {\n\t\tmargin-top: 0.1rem;\n\t}\n\n\t.header {\n\t\tpadding: 0.5rem 0.5rem 0.2rem 0.5rem;\n\t\tfont-size: var(--lol-font-size-sm);\n\t}\n\n\t.separator {\n\t\theight: 1px;\n\t\tbackground: rgb(from var(--lol-color-gold-100) r g b / 0.25);\n\t\tmargin: 0.4rem 0.5rem;\n\t}\n}\n","import { cx } from \"cva\";\nimport type { ComponentProps } from \"react\";\nimport {\n\tHeader as AriaHeader,\n\tMenu as AriaMenu,\n\tMenuItem as AriaMenuItem,\n\tMenuSection as AriaMenuSection,\n\tMenuTrigger as AriaMenuTrigger,\n\tPopover as AriaPopover,\n\tSeparator as AriaSeparator,\n\tSubmenuTrigger as AriaSubmenuTrigger,\n\tVirtualizer as AriaVirtualizer,\n\tcomposeRenderProps,\n\tListLayout,\n\ttype MenuItemProps,\n\ttype MenuProps,\n\ttype MenuSectionProps,\n\ttype PopoverProps,\n\ttype SeparatorProps,\n\ttype VirtualizerProps,\n} from \"react-aria-components\";\nimport { heading } from \"../typography/heading\";\nimport classes from \"./menu.module.css\";\n\nexport type { MenuItemProps, MenuProps } from \"react-aria-components\";\n\nexport const MenuTrigger = AriaMenuTrigger;\nexport const SubmenuTrigger = AriaSubmenuTrigger;\n\nexport function Menu<T extends object>({ className, ...props }: MenuProps<T>) {\n\treturn <AriaMenu<T> {...props} className={cx(classes.menu, className)} />;\n}\n\nexport function MenuItem<T extends object>({\n\tclassName,\n\t...props\n}: MenuItemProps<T>) {\n\treturn (\n\t\t<AriaMenuItem<T>\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.item, className),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport function MenuPopover({ className, ...props }: PopoverProps) {\n\treturn (\n\t\t<AriaPopover\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(className, classes.popover),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport function MenuSection<T extends object>({\n\tclassName,\n\t...props\n}: MenuSectionProps<T>) {\n\treturn (\n\t\t<AriaMenuSection<T> {...props} className={cx(className, classes.section)} />\n\t);\n}\n\nexport function MenuHeader({\n\tclassName,\n\t...props\n}: ComponentProps<typeof AriaHeader>) {\n\treturn (\n\t\t<AriaHeader\n\t\t\t{...props}\n\t\t\tclassName={heading({\n\t\t\t\tclassName: cx(className, classes.header),\n\t\t\t\tcolor: \"gold100\",\n\t\t\t\tpreset: \"h5\",\n\t\t\t})}\n\t\t/>\n\t);\n}\n\nexport function MenuSeparator({ className, ...props }: SeparatorProps) {\n\treturn (\n\t\t<AriaSeparator {...props} className={cx(className, classes.separator)} />\n\t);\n}\n\nexport function MenuVirtualizer<T>(\n\tprops: Omit<VirtualizerProps<T>, \"layout\" \| \"layoutOptions\">,\n) {\n\treturn (\n\t\t<AriaVirtualizer\n\t\t\tlayout={ListLayout}\n\t\t\tlayoutOptions={{\n\t\t\t\tpadding: 0,\n\t\t\t\tgap: 0,\n\t\t\t\trowHeight: 30,\n\t\t\t\theadingHeight: 35,\n\t\t\t\t// estimatedRowHeight: 30,\n\t\t\t\t// estimatedHeadingHeight: 35,\n\t\t\t}}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n","@layer lol {\n\t.overlay {\n\t\tbackground-color: color-mix(\n\t\t\tin srgb,\n\t\t\tvar(--lol-color-hextech-black),\n\t\t\ttransparent 75%\n\t\t);\n\t\tposition: fixed;\n\t\ttop: 0;\n\t\tright: 0;\n\t\tbottom: 0;\n\t\tleft: 0;\n\t\tz-index: var(--lol-z-index-overlay);\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\tmin-height: 100%;\n\t\talign-items: center;\n\t\tjustify-content: safe center;\n\t\toverflow-y: auto;\n\t\tpadding: 1rem 0;\n\t\ttext-align: center;\n\t\tbackdrop-filter: blur(8px);\n\t}\n\n\t.dialog {\n\t\tbackground:\n\t\t\tvar(--lol-button-background-gradient) padding-box,\n\t\t\tvar(--lol-button-border-gradient) border-box;\n\t\tborder: 2px solid transparent;\n\n\t\t--lol-button-background-gradient: var(--lol-gradient-hextech-black);\n\t\t--lol-button-border-gradient: linear-gradient(\n\t\t\tto bottom,\n\t\t\tvar(--lol-color-gold-600),\n\t\t\tvar(--lol-color-gold-600),\n\t\t\tvar(--lol-color-gold-500)\n\t\t);\n\n\t\tposition: relative;\n\t\toutline: none;\n\n\t\t&::before,\n\t\t&::after {\n\t\t\tposition: absolute;\n\t\t\tleft: 1.25rem;\n\t\t\tright: 1.25rem;\n\t\t\tcontent: \"\";\n\t\t\tdisplay: block;\n\t\t\theight: 0.25rem;\n\t\t\tbackground-color: var(--lol-color-hextech-black);\n\t\t\tborder-radius: 9999px;\n\t\t}\n\n\t\t&::before {\n\t\t\tbottom: calc(100% + 2px);\n\t\t\tborder: 1px solid var(--lol-color-gold-600);\n\t\t\tborder-bottom: 0;\n\t\t}\n\n\t\t&::after {\n\t\t\ttop: calc(100% + 2px);\n\t\t\tborder: 1px solid var(--lol-color-gold-500);\n\t\t\tborder-top: 0;\n\t\t}\n\t}\n\n\t.modal {\n\t\twidth: 100%;\n\t\tmax-width: 28rem;\n\t}\n\n\t.dialogHeading {\n\t\t/ React aria renders an <h3>, which the UA gives block margins. /\n\t\tmargin: 0;\n\t\tcolor: var(--lol-color-gold-100);\n\t\tfont-family: var(--lol-font-family-beaufort);\n\t\ttext-transform: uppercase;\n\t\tfont-size: var(--lol-font-size-h5);\n\t\tfont-weight: var(--lol-font-weight-h5);\n\t\tletter-spacing: var(--lol-letter-spacing-h5);\n\t\tline-height: var(--lol-line-height-h5);\n\t}\n\n\t.dialogButtons {\n\t\tjustify-content: center;\n\t\ttransform: translateY(2px);\n\t\tpadding: 0 0.25rem;\n\t\tgap: 0.25rem;\n\t\tbackground-color: var(--lol-color-hextech-black);\n\t\tdisplay: inline-flex;\n\t}\n}\n","import { cva } from \"cva\";\nimport {\n\tHeading as AriaHeading,\n\ttype HeadingProps as AriaHeadingProps,\n\tModal as AriaModal,\n\tcomposeRenderProps,\n\tDialog,\n\ttype DialogProps,\n\tModalOverlay,\n\ttype ModalOverlayProps,\n} from \"react-aria-components\";\nimport classes from \"./modal.module.css\";\n\nconst overlay = cva({\n\tbase: classes.overlay,\n});\n\nconst modal = cva({\n\tbase: classes.modal,\n});\n\nconst dialog = cva({\n\tbase: classes.dialog,\n});\n\ninterface ModalProps extends Omit<ModalOverlayProps, \"children\"> {\n\tmodalOverlayClassName?: ModalOverlayProps[\"className\"];\n\tdialogProps?: Omit<DialogProps, \"children\">;\n\tchildren?: DialogProps[\"children\"];\n}\n\nexport function Modal({\n\tmodalOverlayClassName,\n\tdialogProps = {},\n\tchildren,\n\tclassName,\n\t...modalProps\n}: ModalProps) {\n\treturn (\n\t\t<ModalOverlay\n\t\t\t{...modalProps}\n\t\t\tclassName={composeRenderProps(modalOverlayClassName, (className) =>\n\t\t\t\toverlay({\n\t\t\t\t\tclassName,\n\t\t\t\t}),\n\t\t\t)}\n\t\t>\n\t\t\t<AriaModal\n\t\t\t\t{...modalProps}\n\t\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\t\tmodal({\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t}),\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t<Dialog\n\t\t\t\t\t{...dialogProps}\n\t\t\t\t\tclassName={dialog({\n\t\t\t\t\t\tclassName: dialogProps.className,\n\t\t\t\t\t})}\n\t\t\t\t>\n\t\t\t\t\t{children}\n\t\t\t\t</Dialog>\n\t\t\t</AriaModal>\n\t\t</ModalOverlay>\n\t);\n}\n\nconst dialogHeading = cva({\n\tbase: classes.dialogHeading,\n});\n\nexport function DialogHeading({ className, ...props }: AriaHeadingProps) {\n\treturn (\n\t\t<AriaHeading\n\t\t\t{...props}\n\t\t\tclassName={dialogHeading({\n\t\t\t\tclassName,\n\t\t\t})}\n\t\t/>\n\t);\n}\n\nexport function DialogButtons({ children }: { children: React.ReactNode }) {\n\treturn <div className={classes.dialogButtons}>{children}</div>;\n}\n","@layer lol {\n\t.group {\n\t\tdisplay: grid;\n\t\tgrid-template-columns: auto 1fr auto;\n\t\tgap: 1px;\n\t\tpadding: 1px;\n\t\toutline: none;\n\n\t\t&.normal {\n\t\t\tbackground-image: var(--lol-gradient-gold);\n\t\t}\n\n\t\t&.dimmed {\n\t\t\tbackground-image: var(--lol-gradient-grey-300);\n\t\t}\n\n\t\t&[data-disabled] {\n\t\t\tbackground-image: var(--lol-gradient-disabled);\n\t\t}\n\n\t\t&[data-focus-within] {\n\t\t\tbackground-image: var(--lol-gradient-gold-hover);\n\t\t}\n\n\t\t&.small {\n\t\t\tmin-height: var(--lol-form-height-small);\n\t\t}\n\n\t\t&.medium {\n\t\t\tmin-height: var(--lol-form-height-medium);\n\t\t}\n\n\t\t&.large {\n\t\t\tmin-height: var(--lol-form-height-large);\n\t\t}\n\t}\n\n\t.input {\n\t\t/ The group draws the border as its own 1px gradient padding. /\n\t\tborder: 0;\n\t\tmargin: 0;\n\t\tbackground-color: var(--lol-color-hextech-black);\n\t\tcolor: var(--lol-color-gold-100);\n\t\tfont-family: var(--lol-font-family-spiegel);\n\t\tfont-size: 0.75rem;\n\t\tpadding: 0 0.75rem;\n\t\tline-height: 1rem;\n\t\twidth: 100%;\n\t\toutline: none;\n\n\t\t&[data-disabled] {\n\t\t\tbackground-color: var(--lol-color-grey-300);\n\t\t\tcolor: var(--lol-color-grey-100);\n\t\t}\n\n\t\t&.focus {\n\t\t\tbackground-image: var(--lol-gradient-grey-focus);\n\t\t}\n\t}\n\n\t.button {\n\t\t/ A <button> we never paint: without this it falls back to the UA's\n\t\t `buttonface` slab, which is grey under `color-scheme: dark`. /\n\t\tappearance: none;\n\t\tborder: 0;\n\t\tmargin: 0;\n\t\tfont: inherit;\n\t\tletter-spacing: inherit;\n\n\t\tcolor: var(--lol-color-gold-100);\n\t\tbackground-color: var(--lol-color-hextech-black);\n\t\tpadding: 0 0.625rem;\n\n\t\t&[data-disabled] {\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t\tbackground-color: var(--lol-color-grey-300);\n\t\t}\n\t}\n}\n","import { cva } from \"cva\";\nimport type { ComponentProps } from \"react\";\nimport type { NumberFieldProps as AriaNumberFieldProps } from \"react-aria-components\";\nimport {\n\tInput as AriaInput,\n\tNumberField as AriaNumberField,\n\tButton,\n\tcomposeRenderProps,\n\tGroup,\n} from \"react-aria-components\";\nimport classes from \"./number-field.module.css\";\n\ntype NumberFieldPreset = \"normal\" \| \"dimmed\";\n\nconst numberFieldGroup = cva({\n\tbase: classes.group,\n\tvariants: {\n\t\tpreset: {\n\t\t\tnormal: classes.normal,\n\t\t\tdimmed: classes.dimmed,\n\t\t},\n\t\tsize: {\n\t\t\tsmall: classes.small,\n\t\t\tmedium: classes.medium,\n\t\t\tlarge: classes.large,\n\t\t},\n\t},\n});\n\nconst numberFieldInput = cva({\n\tbase: classes.input,\n\tvariants: {\n\t\tisDisabled: {\n\t\t\ttrue: classes.disabled,\n\t\t},\n\t\tisFocused: {\n\t\t\ttrue: classes.focus,\n\t\t},\n\t},\n});\n\nexport function NumberField({\n\tinputProps = {},\n\tgroupProps = {},\n\tchildren,\n\tpreset = \"normal\",\n\tsize = \"medium\",\n\t...props\n}: AriaNumberFieldProps & {\n\tinputProps?: ComponentProps<typeof AriaInput>;\n\tgroupProps?: ComponentProps<typeof Group>;\n\tpreset?: NumberFieldPreset;\n\tsize?: \"small\" \| \"medium\" \| \"large\";\n}) {\n\treturn (\n\t\t<AriaNumberField {...props}>\n\t\t\t{(values) => (\n\t\t\t\t<>\n\t\t\t\t\t{typeof children === \"function\" ? children(values) : children}\n\t\t\t\t\t<Group\n\t\t\t\t\t\t{...groupProps}\n\t\t\t\t\t\tclassName={composeRenderProps(\n\t\t\t\t\t\t\tgroupProps.className,\n\t\t\t\t\t\t\t(className, values) =>\n\t\t\t\t\t\t\t\tnumberFieldGroup({\n\t\t\t\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t\t\t\tpreset,\n\t\t\t\t\t\t\t\t\tsize,\n\t\t\t\t\t\t\t\t\t...values,\n\t\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t)}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Button className={classes.button} slot=\"decrement\">\n\t\t\t\t\t\t\t-\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t<AriaInput\n\t\t\t\t\t\t\t{...inputProps}\n\t\t\t\t\t\t\tclassName={composeRenderProps(\n\t\t\t\t\t\t\t\tinputProps.className,\n\t\t\t\t\t\t\t\t(className, values) =>\n\t\t\t\t\t\t\t\t\tnumberFieldInput({\n\t\t\t\t\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t\t\t\t\t...values,\n\t\t\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<Button className={classes.button} slot=\"increment\">\n\t\t\t\t\t\t\t+\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</Group>\n\t\t\t\t</>\n\t\t\t)}\n\t\t</AriaNumberField>\n\t);\n}\n","@layer lol {\n\t.popover {\n\t\tpadding: 2px;\n\t\tbox-shadow: 0 2px 4px 0 var(--lol-color-grey-300);\n\t\tborder: 2px solid transparent;\n\t\tbackground:\n\t\t\tvar(--lol-button-background-gradient) padding-box,\n\t\t\tvar(--lol-button-border-gradient) border-box;\n\t\t--lol-button-border-gradient: var(--lol-gradient-gold-press);\n\t\t--lol-button-background-gradient: var(--lol-gradient-grey-300);\n\n\t\t&.top {\n\t\t\tmargin-bottom: 0.5rem;\n\t\t}\n\n\t\t&.bottom {\n\t\t\tmargin-top: 0.5rem;\n\t\t}\n\n\t\t&.left {\n\t\t\tmargin-right: 0.5rem;\n\t\t}\n\n\t\t&.right {\n\t\t\tmargin-left: 0.5rem;\n\t\t}\n\t}\n\n\t.body {\n\t\tpadding: 1rem;\n\t}\n\n\t.arrow {\n\t\t/\n\t\t * React aria anchors the arrow's wrapper with `bottom: 100%`, so the\n\t\t * wrapper's box has to be the glyph. Left inline the svg sits on a text\n\t\t * baseline: the wrapper grows to a line-height and the arrow floats off the\n\t\t * popover by the difference.\n\t\t /\n\t\tdisplay: block;\n\n\t\t.outer {\n\t\t\tfill: var(--lol-color-gold-600);\n\t\t}\n\n\t\t.inner {\n\t\t\tfill: var(--lol-color-grey-300);\n\t\t}\n\n\t\t&.top {\n\t\t\ttransform: translateX(-1.5px);\n\t\t}\n\n\t\t&.bottom {\n\t\t\ttransform: translateX(-1.5px) rotate(180deg);\n\n\t\t\t.outer {\n\t\t\t\tfill: var(--lol-color-gold-500);\n\t\t\t}\n\t\t}\n\n\t\t&.left {\n\t\t\ttransform: translateY(-2px) translateX(-5px) rotate(-90deg);\n\t\t}\n\n\t\t&.right {\n\t\t\ttransform: translateY(-2px) translateX(5px) rotate(90deg);\n\t\t}\n\t}\n}\n","import { cva, cx } from \"cva\";\nimport type { PopoverProps } from \"react-aria-components\";\nimport {\n\tPopover as AriaPopover,\n\tcomposeRenderProps,\n\tDialog,\n\tOverlayArrow,\n} from \"react-aria-components\";\nimport classes from \"./popover.module.css\";\n\n// Note: there is no tooltip component. Tooltips do not work on mobile devices.\n// Use a text on the page instead, or use a toggle tip (which is a popover that\n// is used only for informational purposes).\n\nconst popover = cva({\n\tbase: classes.popover,\n\tvariants: {\n\t\tplacement: {\n\t\t\tbottom: classes.bottom,\n\t\t\ttop: classes.top,\n\t\t\tleft: classes.left,\n\t\t\tright: classes.right,\n\t\t\tcenter: \"\",\n\t\t},\n\t},\n});\n\nconst arrow = cva({\n\tbase: classes.arrow,\n\tvariants: {\n\t\tplacement: {\n\t\t\ttop: classes.top,\n\t\t\tbottom: classes.bottom,\n\t\t\tleft: classes.left,\n\t\t\tright: classes.right,\n\t\t\tcenter: \"\",\n\t\t},\n\t},\n});\n\nexport function Popover({ children, className, ...props }: PopoverProps) {\n\treturn (\n\t\t<AriaPopover\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className, values) =>\n\t\t\t\tpopover({\n\t\t\t\t\t...values,\n\t\t\t\t\tclassName,\n\t\t\t\t\tplacement: values.placement ?? undefined,\n\t\t\t\t}),\n\t\t\t)}\n\t\t>\n\t\t\t{(values) => (\n\t\t\t\t<>\n\t\t\t\t\t<OverlayArrow>\n\t\t\t\t\t\t{(values) => (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t<svg\n\t\t\t\t\t\t\t\t\tviewBox=\"0 0 12 6\"\n\t\t\t\t\t\t\t\t\tclassName={arrow({\n\t\t\t\t\t\t\t\t\t\t...values,\n\t\t\t\t\t\t\t\t\t\tplacement: values.placement ?? undefined,\n\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t\twidth={20}\n\t\t\t\t\t\t\t\t\theight={10}\n\t\t\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<path d=\"M0 0,L6 6,L12 0\" className={classes.outer} />\n\t\t\t\t\t\t\t\t\t<path d=\"M2 0 6 4 10 0\" className={classes.inner} />\n\t\t\t\t\t\t\t\t</svg>\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</OverlayArrow>\n\t\t\t\t\t<Dialog>\n\t\t\t\t\t\t{typeof children === \"function\" ? children(values) : children}\n\t\t\t\t\t</Dialog>\n\t\t\t\t</>\n\t\t\t)}\n\t\t</AriaPopover>\n\t);\n}\n\n// The popover itself carries no content padding, since text needs breathing\n// room from the popover's edge while other content (a divider, an image)\n// should run edge to edge already. Wrap text content in this instead of\n// reaching for a one-off inline style.\n\nexport function PopoverBody({\n\tclassName,\n\t...props\n}: React.HTMLAttributes<HTMLDivElement>) {\n\treturn <div {...props} className={cx(classes.body, className)} />;\n}\n","@layer lol {\n\t.wrapper {\n\t\tdisplay: flex;\n\t\twidth: 14rem;\n\t\tflex-direction: column;\n\t\tgap: 0.25rem;\n\t\tfont-size: 0.875rem;\n\t}\n\n\t.progressBar {\n\t\tmargin-left: -0.125rem;\n\t\tmargin-right: -0.25rem;\n\t\theight: 0.75rem;\n\t\tborder-radius: 9999px;\n\t\tpadding: 1px;\n\t\tbackground:\n\t\t\tvar(--lol-gradient-grey-300) padding-box,\n\t\t\tvar(--lol-gradient-gold) border-box;\n\t\tborder: 1px solid transparent;\n\t}\n\n\t.fill {\n\t\tbackground-image: linear-gradient(\n\t\t\tto right,\n\t\t\tvar(--lol-color-blue-400),\n\t\t\tvar(--lol-color-blue-200)\n\t\t);\n\t\tborder-radius: 9999px;\n\t\theight: 100%;\n\t}\n\n\t.labelWrapper {\n\t\tdisplay: flex;\n\t\tjustify-content: space-between;\n\t\tfont-weight: 700;\n\t\ttext-transform: uppercase;\n\t\tfont-family: var(--lol-font-family-beaufort);\n\t\tcolor: var(--lol-color-gold-100);\n\t}\n}\n","import { cx } from \"cva\";\nimport type { JSX } from \"react\";\nimport {\n\tProgressBar as AriaProgressBar,\n\ttype ProgressBarProps as AriaProgressBarProps,\n\tLabel,\n} from \"react-aria-components\";\nimport classes from \"./progress-bar.module.css\";\n\ninterface ProgressBarProps extends Omit<AriaProgressBarProps, \"children\"> {\n\tlabel?: string;\n}\n\nexport function ProgressBar({\n\tclassName,\n\tlabel,\n\t...props\n}: ProgressBarProps): JSX.Element {\n\treturn (\n\t\t<AriaProgressBar className={cx(classes.wrapper, className)} {...props}>\n\t\t\t{({ percentage, valueText }) => (\n\t\t\t\t<>\n\t\t\t\t\t<div className={classes.labelWrapper}>\n\t\t\t\t\t\t<Label>{label ?? \"Loading\"}</Label>\n\t\t\t\t\t\t<span>{valueText}</span>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div className={classes.progressBar}>\n\t\t\t\t\t\t<div className={classes.fill} style={{ width: `${percentage}%` }} />\n\t\t\t\t\t</div>\n\t\t\t\t</>\n\t\t\t)}\n\t\t</AriaProgressBar>\n\t);\n}\n","@layer lol {\n\t.radioGroup {\n\t\tdisplay: flex;\n\t\talign-items: flex-start;\n\t\tflex-direction: column;\n\t}\n\n\t.radio {\n\t\tfont-family: var(--lol-font-family-spiegel);\n\t\tbackground-size: 18px;\n\t\tbackground-position: left;\n\t\tbackground-repeat: no-repeat;\n\t\tpadding-top: 0.5rem;\n\t\tpadding-bottom: 0.5rem;\n\t\tpadding-left: 1.5rem;\n\t\tpadding-right: 1rem;\n\t\tfont-size: 0.75rem;\n\t\tline-height: 1rem;\n\t\tfont-weight: 400;\n\t\tbackground-image: url(\"./radio-unchecked.png\");\n\t\tcolor: var(--lol-color-grey-100);\n\n\t\t&[data-selected] {\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t\tbackground-image: url(\"./radio-checked.png\");\n\t\t}\n\n\t\t&[data-disabled] {\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t\tbackground-image: url(\"./radio-unchecked-disabled.png\");\n\n\t\t\t&[data-selected] {\n\t\t\t\tbackground-image: url(\"./radio-checked-disabled.png\");\n\t\t\t}\n\t\t}\n\n\t\t&[data-hovered] {\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t\tbackground-image: url(\"./radio-unchecked-hovered.png\");\n\n\t\t\t&[data-selected] {\n\t\t\t\tbackground-image: url(\"./radio-checked-hovered.png\");\n\t\t\t}\n\t\t}\n\n\t\t&[data-pressed] {\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t\tbackground-image: url(\"./radio-unchecked-pressed.png\");\n\n\t\t\t&[data-selected] {\n\t\t\t\tbackground-image: url(\"./radio-checked-pressed.png\");\n\t\t\t}\n\t\t}\n\t}\n}\n","import { cx } from \"cva\";\nimport type {\n\tRadioGroupProps as AriaRadiogroupProps,\n\tRadioButtonProps,\n\tRadioFieldProps,\n} from \"react-aria-components\";\nimport {\n\tRadioButton as AriaRadioButton,\n\tRadioField as AriaRadioField,\n\tRadioGroup as AriaRadioGroup,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport classes from \"./radio-group.module.css\";\n\nexport function RadioGroup({ className, ...props }: AriaRadiogroupProps) {\n\treturn (\n\t\t<AriaRadioGroup\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.radioGroup, className),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport function RadioButton({ className, ...props }: RadioButtonProps) {\n\treturn (\n\t\t<AriaRadioButton\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.radio, className),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport function RadioField({ className, ...props }: RadioFieldProps) {\n\treturn <AriaRadioField {...props} className={className} />;\n}\n\nexport function Radio({\n\tchildren,\n\tclassName,\n\t...props\n}: Omit<RadioFieldProps, \"children\" \| \"className\"> &\n\tPick<RadioButtonProps, \"children\" \| \"className\">) {\n\treturn (\n\t\t<AriaRadioField {...props}>\n\t\t\t<AriaRadioButton\n\t\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\t\tcx(classes.radio, className),\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</AriaRadioButton>\n\t\t</AriaRadioField>\n\t);\n}\n","@layer lol {\n\t.searchField {\n\t\tdisplay: grid;\n\t\tgrid-template-areas:\n\t\t\t\"label label\"\n\t\t\t\"input button\"\n\t\t\t\"help help\";\n\t\tgrid-template-columns: 1fr auto;\n\t\talign-items: center;\n\n\t\tcolor: var(--lol-color-gold-100);\n\t}\n\n\t.input {\n\t\tbackground:\n\t\t\turl(\"./search.png\") no-repeat 5px center,\n\t\t\tvar(--lol-search-field-background-gradient) padding-box,\n\t\t\tvar(--lol-search-field-border-gradient) border-box;\n\n\t\t--lol-search-field-border-gradient: var(--lol-gradient-gold);\n\t\t--lol-search-field-background-gradient: var(--lol-gradient-hextech-black);\n\n\t\tbackground-size: 16px, auto, auto;\n\t\tborder: 1px solid transparent;\n\t\tgrid-area: input;\n\t\tpadding: 0 2.5rem 0 1.5rem;\n\t\tmargin: 0;\n\t\tfont-size: 0.75rem;\n\t\tline-height: 1rem;\n\t\tcolor: var(--lol-color-gold-100);\n\t\toutline: none;\n\t\tfont-family: var(--lol-font-family-spiegel);\n\t\tfont-weight: 500;\n\t\tletter-spacing: 0.025em;\n\n\t\t&::-webkit-search-cancel-button,\n\t\t&::-webkit-search-decoration {\n\t\t\t-webkit-appearance: none;\n\t\t}\n\n\t\t&[data-disabled] {\n\t\t\t--lol-search-field-border-gradient: var(--lol-gradient-disabled);\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t}\n\n\t\t&[data-focused] {\n\t\t\t--lol-search-field-border-gradient: var(--lol-gradient-gold-hover);\n\t\t\t--lol-search-field-background-gradient: var(--lol-gradient-grey-focus);\n\t\t}\n\n\t\t&.small {\n\t\t\tmin-height: var(--lol-form-height-small);\n\t\t}\n\n\t\t&.medium {\n\t\t\tmin-height: var(--lol-form-height-medium);\n\t\t}\n\n\t\t&.large {\n\t\t\tmin-height: var(--lol-form-height-large);\n\t\t}\n\t}\n\n\t.button {\n\t\t/ A <button> we never paint: without this it falls back to the UA's\n\t\t `buttonface` slab, which is grey under `color-scheme: dark`. /\n\t\tappearance: none;\n\t\tbackground: none;\n\t\tborder: 0;\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t\tfont: inherit;\n\t\tletter-spacing: inherit;\n\n\t\tgrid-area: button;\n\n\t\tfont-size: 0.75rem;\n\t\tline-height: 1rem;\n\t\tfont-weight: 900;\n\n\t\tmargin-left: -2.5rem;\n\t\twidth: 2.5rem;\n\t\talign-self: stretch;\n\t\ttext-align: center;\n\n\t\tcolor: var(--lol-color-gold-300);\n\n\t\t&[data-hovered] {\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t}\n\n\t\t&[data-pressed] {\n\t\t\tcolor: var(--lol-color-gold-600);\n\t\t}\n\n\t\t&[data-empty],\n\t\t&[data-disabled] {\n\t\t\tdisplay: none;\n\t\t}\n\t}\n}\n","import { cva, cx } from \"cva\";\nimport type { ComponentProps } from \"react\";\nimport {\n\tButton as AriaButton,\n\tInput as AriaInput,\n\tSearchField as AriaSearchField,\n\ttype SearchFieldProps as AriaSearchFieldProps,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport classes from \"./search-field.module.css\";\n\nconst searchFieldInput = cva({\n\tbase: classes.input,\n\tvariants: {\n\t\tsize: {\n\t\t\tsmall: classes.small,\n\t\t\tmedium: classes.medium,\n\t\t\tlarge: classes.large,\n\t\t},\n\t},\n});\n\nexport function SearchField({\n\tinputProps = {},\n\tborderProps = {},\n\tchildren,\n\tclassName,\n\tsize = \"medium\",\n\t...props\n}: AriaSearchFieldProps & {\n\tinputProps?: ComponentProps<typeof AriaInput>;\n\tborderProps?: ComponentProps<\"div\">;\n\tsize?: \"small\" \| \"medium\" \| \"large\";\n}) {\n\treturn (\n\t\t<AriaSearchField {...props} className={cx(classes.searchField, className)}>\n\t\t\t{(values) => (\n\t\t\t\t<>\n\t\t\t\t\t{typeof children === \"function\" ? children(values) : children}\n\t\t\t\t\t<AriaInput\n\t\t\t\t\t\t{...inputProps}\n\t\t\t\t\t\tclassName={composeRenderProps(\n\t\t\t\t\t\t\tinputProps.className,\n\t\t\t\t\t\t\t(className, values) =>\n\t\t\t\t\t\t\t\tsearchFieldInput({\n\t\t\t\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t\t\t\tsize,\n\t\t\t\t\t\t\t\t\t...values,\n\t\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t)}\n\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t/>\n\t\t\t\t\t<AriaButton className={classes.button}>✕</AriaButton>\n\t\t\t\t</>\n\t\t\t)}\n\t\t</AriaSearchField>\n\t);\n}\n","@layer lol {\n\t/ Base tag sets up CSS variables; variants (gold/hextech) define actual gradients /\n\t.tag {\n\t\tbackground:\n\t\t\tvar(--lol-multiple-select-background-gradient) padding-box,\n\t\t\tvar(--lol-multiple-select-border-gradient) border-box;\n\n\t\tborder: 2px solid transparent;\n\t\tborder-radius: 9999px;\n\n\t\talign-items: center;\n\t\tdisplay: grid;\n\t\tgrid-template-columns: 1fr auto;\n\n\t\tfont-family: var(--lol-font-family-spiegel);\n\t\tletter-spacing: var(--lol-letter-spacing-sm);\n\t\tfont-weight: var(--lol-font-weight-sm);\n\t\tfont-size: 0.75rem;\n\t\tline-height: 1;\n\t\tcolor: var(--lol-color-gold-300);\n\t\tpadding: 0 0.3rem 0 0.5rem;\n\t}\n\n\t.gold {\n\t\tborder-width: 1px;\n\t\t--lol-multiple-select-border-gradient: var(--lol-gradient-gold);\n\t\t--lol-multiple-select-background-gradient: var(--lol-gradient-grey-300);\n\t\tcolor: var(--lol-color-gold-300);\n\t}\n\n\t.hextech {\n\t\tborder-width: 1px;\n\t\t--lol-multiple-select-border-gradient: var(--lol-gradient-hextech);\n\t\t--lol-multiple-select-background-gradient: var(--lol-gradient-grey-300);\n\t\tcolor: var(--lol-color-blue-100);\n\t}\n\n\t.grey {\n\t\tborder-width: 1px;\n\t\t--lol-multiple-select-border-gradient: var(--lol-color-grey-100);\n\t\t--lol-multiple-select-background-gradient: var(--lol-gradient-grey-300);\n\t\tcolor: var(--lol-color-gold-100);\n\t}\n\n\t.text {\n\t\tpadding: 0.25rem 0;\n\t}\n\n\t.remove {\n\t\t/ A <button> we never paint: without this it falls back to the UA's\n\t\t `buttonface` slab, which is grey under `color-scheme: dark`. The mask is\n\t\t filled with `currentColor`, so the inherited colour matters too. /\n\t\tappearance: none;\n\t\tborder: 0;\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t\tfont: inherit;\n\t\tletter-spacing: inherit;\n\t\tcolor: inherit;\n\n\t\tmask: url(./control-close.png);\n\t\theight: 1rem;\n\t\taspect-ratio: 1;\n\t\tbackground-color: currentColor;\n\t\tmask-size: contain;\n\n\t\t&[data-hovered] {\n\t\t\tbackground-color: var(--lol-color-gold-100);\n\t\t}\n\n\t\t&[data-pressed] {\n\t\t\tbackground-color: var(--lol-color-grey-150);\n\t\t}\n\t}\n\n\t.tagGroup {\n\t\tpadding: 0.25rem;\n\t\tdisplay: flex;\n\t\tjustify-content: flex-start;\n\t}\n\n\t.tagList {\n\t\tdisplay: flex;\n\t\tflex-wrap: wrap;\n\t\tgap: 0.25rem;\n\t\trow-gap: 0.25rem;\n\t}\n}\n","\"use client\";\n\nimport { cva, cx } from \"cva\";\nimport {\n\tButton as AriaButton,\n\tTag as AriaTag,\n\tTagGroup as AriaTagGroup,\n\ttype TagGroupProps as AriaTagGroupProps,\n\tTagList as AriaTagList,\n\ttype TagListProps as AriaTagListProps,\n\ttype TagProps as AriaTagProps,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport classes from \"./tag-group.module.css\";\n\nexport interface TagProps extends AriaTagProps {\n\tvariant?: \"gold\" \| \"hextech\" \| \"grey\";\n}\n\nconst tag = cva({\n\tbase: classes.tag,\n\tvariants: {\n\t\tvariant: {\n\t\t\tgold: classes.gold,\n\t\t\thextech: classes.hextech,\n\t\t\tgrey: classes.grey,\n\t\t},\n\t},\n\tdefaultVariants: { variant: \"gold\" },\n});\n\nexport function Tag({\n\tchildren,\n\tclassName,\n\tvariant = \"gold\",\n\t...props\n}: TagProps) {\n\treturn (\n\t\t<AriaTag\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className, values) =>\n\t\t\t\tcx(tag({ variant, className, ...values })),\n\t\t\t)}\n\t\t>\n\t\t\t{composeRenderProps(children, (children) => (\n\t\t\t\t<>\n\t\t\t\t\t<span className={classes.text}>{children}</span>\n\t\t\t\t\t<AriaButton slot=\"remove\" className={classes.remove} />\n\t\t\t\t</>\n\t\t\t))}\n\t\t</AriaTag>\n\t);\n}\n\nexport const tagGroup = cva({\n\tbase: classes.tagGroup,\n});\n\nexport interface TagGroupProps extends AriaTagGroupProps {}\n\nexport function TagGroup({ children, className, ...props }: TagGroupProps) {\n\treturn (\n\t\t<AriaTagGroup {...props} className={tagGroup({ className })}>\n\t\t\t{children}\n\t\t</AriaTagGroup>\n\t);\n}\n\nexport const tagList = cva({\n\tbase: classes.tagList,\n});\n\nexport interface TagListProps<T extends object = {}>\n\textends AriaTagListProps<T> {\n\tchildren?: React.ReactNode;\n\tclassName?: string;\n\tselectLabel: (item: T) => string;\n\tvariant?: TagProps[\"variant\"];\n}\n\nexport function TagList<T extends object>({\n\tchildren,\n\tclassName,\n\tselectLabel,\n\tvariant = \"hextech\",\n\t...props\n}: TagListProps<T> & {\n\tselectLabel: (item: T) => string;\n\tvariant?: TagProps[\"variant\"];\n}) {\n\treturn (\n\t\t<AriaTagList {...props} className={tagList({ className })}>\n\t\t\t{(item) => <Tag variant={variant}>{selectLabel(item)}</Tag>}\n\t\t</AriaTagList>\n\t);\n}\n","@layer lol {\n\t.popover {\n\t\twidth: 250px;\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t}\n\n\t.triggerContainer {\n\t\tdisplay: inline-flex;\n\t}\n\n\t/ Descendant selector, not just `.select`: needs higher specificity than\n\t `.button`'s `display: inline-block` (select.module.css), since equal-\n\t specificity rules would otherwise resolve by CSS source order — which\n\t depends on unrelated bundling details, not intent. Losing that race\n\t blockifies to `display: block` (this is a flex item) and silently\n\t drops `align-items`, so tags/empty text stick to the top instead of\n\t centering. /\n\t.triggerContainer .select {\n\t\tborder-right: none;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t}\n}\n","\"use client\";\n\nimport { cx } from \"cva\";\nimport React from \"react\";\nimport {\n\tPopover as AriaPopover,\n\tAutocomplete,\n\ttype Key,\n\tSelect,\n\ttype SelectProps,\n\tSelectValue,\n\tuseFilter,\n} from \"react-aria-components\";\nimport { Button } from \"../button\";\nimport { SearchField } from \"../search-field/search-field\";\nimport { TagGroup, TagList } from \"../tag-group/tag-group\";\nimport classes from \"./multiple-select.module.css\";\nimport {\n\tSelectListBox,\n\tSelectListBoxItem,\n\tSelectVirtualizer,\n\tselect,\n} from \"./select\";\n\nexport interface MultipleSelectProps<T extends object = {}>\n\textends Omit<\n\t\tSelectProps<T, \"multiple\">,\n\t\t\"children\" \| \"className\" \| \"validationBehavior\" \| \"selectionMode\"\n\t> {\n\titems: Array<T>;\n\tclassName?: string;\n\tsize?: \"small\" \| \"medium\" \| \"large\";\n\temptyTags?: React.ReactNode;\n\temptyList?: React.ReactNode;\n\ttagGroupLabel?: string;\n\tselectId: (item: T) => Key;\n\tselectLabel: (item: T) => string;\n}\n\nexport function MultipleSelect<T extends object = {}>({\n\titems,\n\tclassName,\n\tsize = \"medium\",\n\temptyList,\n\temptyTags = \"No items selected\",\n\ttagGroupLabel = \"Selected items\",\n\tselectId,\n\tselectLabel,\n\t...selectProps\n}: MultipleSelectProps<T>) {\n\tconst triggerContainerRef = React.useRef<HTMLDivElement \| null>(null);\n\tconst { contains } = useFilter({ sensitivity: \"base\" });\n\n\treturn (\n\t\t<Select<T, \"multiple\"> selectionMode=\"multiple\" {...selectProps}>\n\t\t\t<div ref={triggerContainerRef} className={classes.triggerContainer}>\n\t\t\t\t<SelectValue<T>\n\t\t\t\t\tclassName={select({\n\t\t\t\t\t\tsize,\n\t\t\t\t\t\tselectionMode: \"multiple\",\n\t\t\t\t\t\tclassName: cx(classes.select, className),\n\t\t\t\t\t})}\n\t\t\t\t>\n\t\t\t\t\t{({ selectedItems, state }) => (\n\t\t\t\t\t\t<TagGroup\n\t\t\t\t\t\t\taria-label={tagGroupLabel}\n\t\t\t\t\t\t\tonRemove={(keys) => {\n\t\t\t\t\t\t\t\tif (Array.isArray(state.value)) {\n\t\t\t\t\t\t\t\t\tstate.setValue(state.value.filter((k) => !keys.has(k)));\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<TagList\n\t\t\t\t\t\t\t\tselectLabel={selectLabel}\n\t\t\t\t\t\t\t\titems={selectedItems.filter((item) => item != null)}\n\t\t\t\t\t\t\t\trenderEmptyState={() => emptyTags}\n\t\t\t\t\t\t\t\tvariant=\"hextech\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</TagGroup>\n\t\t\t\t\t)}\n\t\t\t\t</SelectValue>\n\n\t\t\t\t<Button shape=\"square\" thin size={size}>\n\t\t\t\t\t+\n\t\t\t\t</Button>\n\t\t\t</div>\n\n\t\t\t<AriaPopover className={classes.popover} triggerRef={triggerContainerRef}>\n\t\t\t\t<Autocomplete filter={contains}>\n\t\t\t\t\t<SearchField inputProps={{ autoFocus: true }} />\n\t\t\t\t\t<SelectVirtualizer>\n\t\t\t\t\t\t<SelectListBox\n\t\t\t\t\t\t\titems={items}\n\t\t\t\t\t\t\tselectionMode=\"multiple\"\n\t\t\t\t\t\t\temptyList={emptyList}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{(item) => (\n\t\t\t\t\t\t\t\t<SelectListBoxItem key={selectId(item)} id={selectId(item)}>\n\t\t\t\t\t\t\t\t\t{selectLabel(item)}\n\t\t\t\t\t\t\t\t</SelectListBoxItem>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</SelectListBox>\n\t\t\t\t\t</SelectVirtualizer>\n\t\t\t\t</Autocomplete>\n\t\t\t</AriaPopover>\n\t\t</Select>\n\t);\n}\n","@layer lol {\n\t.track {\n\t\tposition: relative;\n\t\theight: 1.75rem;\n\t\twidth: 100%;\n\t}\n\n\t.background {\n\t\tbackground-color: var(--lol-color-grey-300);\n\t\tposition: absolute;\n\t\ttop: 50%;\n\t\ttransform: translateY(-50%);\n\t\theight: 2px;\n\t\twidth: 100%;\n\t\tborder-radius: 9999px;\n\t}\n\n\t.foreground {\n\t\tbackground-image: linear-gradient(\n\t\t\tto right,\n\t\t\tvar(--lol-color-gold-600),\n\t\t\tvar(--lol-color-gold-500)\n\t\t);\n\t\tbackground-size: 100% 2px;\n\t\tbackground-position: center;\n\t\tbackground-repeat: no-repeat;\n\t\tposition: absolute;\n\t\ttop: 50%;\n\t\ttransform: translateY(-50%);\n\t\theight: 100%;\n\t\tborder-radius: 9999px;\n\n\t\t&.disabled {\n\t\t\tbackground-image: linear-gradient(to right, #5c5b57, #5c5b57);\n\t\t}\n\t}\n\n\t.track:hover .foreground:not(.disabled) {\n\t\tbackground-image: linear-gradient(\n\t\t\tto right,\n\t\t\tvar(--lol-color-gold-500),\n\t\t\tvar(--lol-color-gold-400),\n\t\t\tvar(--lol-color-gold-200)\n\t\t);\n\t}\n\n\t.track:active .foreground:not(.disabled) {\n\t\tbackground-image: linear-gradient(\n\t\t\tto right,\n\t\t\tvar(--lol-color-gold-500),\n\t\t\tvar(--lol-color-gold-600),\n\t\t\tvar(--lol-color-gold-600)\n\t\t);\n\t}\n\n\t.thumb {\n\t\tbackground-image: url(./slider-normal.png);\n\t\tposition: absolute;\n\t\ttop: 50%;\n\t\ttransform: translateY(-50%);\n\t\theight: 1.75rem;\n\t\twidth: 1.75rem;\n\t\tbackground-size: cover;\n\t\toutline: none;\n\n\t\t&.disabled {\n\t\t\tbackground-image: url(./slider-disabled.png);\n\t\t}\n\n\t\t&.thumbDragging {\n\t\t\tbackground-image: url(./slider-active.png);\n\t\t}\n\t}\n\n\t.track:hover\n\t\t.thumb:not(.thumbDragging):not(.otherThumbDragging):not(.disabled) {\n\t\tbackground-image: url(./slider-hover.png);\n\t}\n}\n","import { cva, cx } from \"cva\";\nimport type {\n\tSliderProps as AriaSliderProps,\n\tSliderFillRenderProps,\n\tSliderOutputProps,\n\tSliderThumbProps,\n\tSliderTrackProps,\n\tSliderTrackRenderProps,\n} from \"react-aria-components\";\nimport {\n\tSlider as AriaSlider,\n\tSliderFill as AriaSliderFill,\n\tSliderOutput as AriaSliderOutput,\n\tSliderThumb as AriaSliderThumb,\n\tSliderTrack as AriaSliderTrack,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport textClasses from \"../typography/text.module.css\";\nimport classes from \"./slider.module.css\";\n\nconst sliderFill = cva({\n\tbase: classes.foreground,\n\tvariants: {\n\t\tisDisabled: {\n\t\t\ttrue: classes.disabled,\n\t\t},\n\t},\n});\n\nconst sliderThumb = cva({\n\tbase: classes.thumb,\n\tvariants: {\n\t\tisThumbDragging: {\n\t\t\ttrue: classes.thumbDragging,\n\t\t},\n\t\tisOtherThumbDragging: {\n\t\t\ttrue: classes.otherThumbDragging,\n\t\t},\n\t\tisDisabled: {\n\t\t\ttrue: classes.disabled,\n\t\t},\n\t\tisHovered: {\n\t\t\ttrue: classes.hovered,\n\t\t},\n\t},\n});\n\nexport function Slider<T extends number \| number[]>({\n\tchildren,\n\tclassName,\n\tsliderThumbProps = {},\n\tsliderTrackProps = {},\n\tsliderTrackBackgroundClassName,\n\tsliderTrackForegroundClassName,\n\t...props\n}: AriaSliderProps<T> & {\n\tsliderTrackProps?: SliderTrackProps;\n\tsliderThumbProps?: SliderThumbProps;\n\tsliderTrackBackgroundClassName?:\n\t\t\| string\n\t\t\| ((values: SliderTrackRenderProps) => string);\n\tsliderTrackForegroundClassName?:\n\t\t\| string\n\t\t\| ((values: SliderFillRenderProps) => string);\n}) {\n\treturn (\n\t\t<AriaSlider<T> {...props} className={className}>\n\t\t\t{(values) => (\n\t\t\t\t<>\n\t\t\t\t\t{typeof children === \"function\" ? children(values) : children}\n\t\t\t\t\t<AriaSliderTrack\n\t\t\t\t\t\t{...sliderTrackProps}\n\t\t\t\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\t\t\t\tcx(classes.track, className),\n\t\t\t\t\t\t)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{(values) => (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\tclassName={composeRenderProps(\n\t\t\t\t\t\t\t\t\t\tsliderTrackBackgroundClassName,\n\t\t\t\t\t\t\t\t\t\t(className) => cx(className, classes.background),\n\t\t\t\t\t\t\t\t\t)(values)}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t<AriaSliderFill\n\t\t\t\t\t\t\t\t\tclassName={composeRenderProps(\n\t\t\t\t\t\t\t\t\t\tsliderTrackForegroundClassName,\n\t\t\t\t\t\t\t\t\t\t(className, fillValues) =>\n\t\t\t\t\t\t\t\t\t\t\tsliderFill({\n\t\t\t\t\t\t\t\t\t\t\t\tisDisabled: fillValues.isDisabled,\n\t\t\t\t\t\t\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t{values.state.values.map((_, i) => {\n\t\t\t\t\t\t\t\t\tconst zIndex =\n\t\t\t\t\t\t\t\t\t\tvalues.state.getThumbPercent(i === 1 ? 0 : 1) ===\n\t\t\t\t\t\t\t\t\t\t(i === 1 ? 0 : 1)\n\t\t\t\t\t\t\t\t\t\t\t? 2\n\t\t\t\t\t\t\t\t\t\t\t: undefined;\n\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t<AriaSliderThumb\n\t\t\t\t\t\t\t\t\t\t\tkey={i}\n\t\t\t\t\t\t\t\t\t\t\tindex={i}\n\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\tzIndex,\n\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t{...sliderThumbProps}\n\t\t\t\t\t\t\t\t\t\t\tclassName={composeRenderProps(\n\t\t\t\t\t\t\t\t\t\t\t\tsliderThumbProps.className,\n\t\t\t\t\t\t\t\t\t\t\t\t(className, sliderThumbRenderProps) =>\n\t\t\t\t\t\t\t\t\t\t\t\t\tsliderThumb({\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tisDisabled: sliderThumbRenderProps.isDisabled,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tisThumbDragging:\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsliderThumbRenderProps.state.isThumbDragging(i),\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tisOtherThumbDragging:\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsliderThumbRenderProps.state.isThumbDragging(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ti === 1 ? 0 : 1,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</AriaSliderTrack>\n\t\t\t\t</>\n\t\t\t)}\n\t\t</AriaSlider>\n\t);\n}\n\nexport function SliderOutput({\n\tchildren,\n\tclassName,\n\t...props\n}: SliderOutputProps) {\n\treturn (\n\t\t<AriaSliderOutput\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(textClasses.text, textClasses.sm, textClasses.grey100, className),\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{(sliderRenderProps) =>\n\t\t\t\tsliderRenderProps.state.values\n\t\t\t\t\t.map((_, i) => sliderRenderProps.state.getThumbValueLabel(i))\n\t\t\t\t\t.join(\" – \")\n\t\t\t}\n\t\t</AriaSliderOutput>\n\t);\n}\n","@layer lol {\n\t.spinner {\n\t\t/ Off the text baseline, so the box is the glyph. /\n\t\tdisplay: block;\n\t\tmax-width: 100%;\n\t\taspect-ratio: 1 / 1;\n\t\twidth: 3rem;\n\t\tanimation: spin 1s linear infinite;\n\t}\n\n\t@keyframes spin {\n\t\tfrom {\n\t\t\ttransform: rotate(0deg);\n\t\t}\n\n\t\tto {\n\t\t\ttransform: rotate(360deg);\n\t\t}\n\t}\n}\n","\"data:image/png;base64,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\"","import { cx } from \"cva\";\nimport classes from \"./spinner.module.css\";\nimport spinnerImage from \"./spinner-spinner.png\";\n\ninterface SpinnerProps {\n\tclassName?: string;\n}\nexport function Spinner({ className }: SpinnerProps) {\n\treturn (\n\t\t<img\n\t\t\trole=\"status\"\n\t\t\taria-live=\"polite\"\n\t\t\taria-label=\"loading\"\n\t\t\tsrc={spinnerImage}\n\t\t\tclassName={cx(classes.spinner, className)}\n\t\t/>\n\t);\n}\n","@layer lol {\n\t.toast {\n\t\tpadding: 1rem;\n\t\tborder: 2px solid transparent;\n\t\tbackground:\n\t\t\tvar(--lol-toast-background-gradient) padding-box,\n\t\t\tvar(--lol-toast-border-gradient) border-box;\n\n\t\twidth: var(--width);\n\t\tfont-size: 13px;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tgap: 6px;\n\t}\n\n\t.default {\n\t\t--lol-toast-background-gradient: var(--lol-gradient-hextech-black);\n\t\t--lol-toast-border-gradient: var(--lol-gradient-grey-300);\n\t\t--lol-toast-icon-color: var(--lol-color-gold-300);\n\t}\n\n\t.title {\n\t\tfont-size: var(--lol-font-size-sm);\n\t}\n\n\t.content {\n\t\tdisplay: flex;\n\t\talign-items: flex-start;\n\t\tgap: 0.75rem;\n\t}\n\n\t.icon {\n\t\tdisplay: flex;\n\t\theight: 20px;\n\t\twidth: 20px;\n\t\tposition: relative;\n\t\tjustify-content: flex-start;\n\t\talign-items: center;\n\t\tflex-shrink: 0;\n\t\tmargin-left: var(--toast-icon-margin-start);\n\t\tmargin-right: var(--toast-icon-margin-end);\n\t\t& > {\n\t\t\tflex-shrink: 0;\n\t\t}\n\t\t/* Off the text baseline, so the box is the glyph. /\n\t\t& > img {\n\t\t\tdisplay: block;\n\t\t\tmax-width: 100%;\n\t\t}\n\t\t& svg {\n\t\t\tmargin-left: var(--toast-svg-margin-start);\n\t\t\tmargin-right: var(--toast-svg-margin-end);\n\t\t}\n\t}\n\n\t.content {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\tgap: 2px;\n\t}\n\n\t.actions {\n\t\tdisplay: flex;\n\t\tjustify-content: flex-end;\n\t\tmargin-top: 0.25rem;\n\t}\n\n\t.button {\n\t\tpadding-left: 8px;\n\t\tpadding-right: 8px;\n\t\tmargin-left: var(--toast-button-margin-start);\n\t\tmargin-right: var(--toast-button-margin-end);\n\t\tflex-shrink: 0;\n\t}\n\n\t.closeButton {\n\t\tposition: absolute;\n\t\tmin-height: 1.33rem !important;\n\t\tleft: var(--toast-close-button-start);\n\t\tright: var(--toast-close-button-end);\n\t\ttop: 0;\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\tpadding: 0;\n\t\ttransform: var(--toast-close-button-transform);\n\t\tborder-radius: 50%;\n\t\tcursor: pointer;\n\t\tz-index: 1;\n\t}\n\n\t.loader {\n\t\twidth: 20px;\n\t\theight: 20px;\n\t}\n}\n","\"data:image/svg+xml,<svg width=\\\"20\\\" height=\\\"20\\\" viewBox=\\\"0 0 20 20\\\" fill=\\\"none\\\" xmlns=\\\"http://www.w3.org/2000/svg\\\">%0D%0A<path fill-rule=\\\"evenodd\\\" clip-rule=\\\"evenodd\\\" d=\\\"M10.8889 3L18 15.25L17.1111 17H2.88889L2 15.25L9.11111 3H10.8889ZM9.11111 11.75L8.22222 7.375L10 6.5L11.7778 7.375L10.8889 11.75H9.11111ZM11.7778 14.375L10 16.125L8.22222 14.375L10 12.625L11.7778 14.375Z\\\" fill=\\\"%23BE1E37\\\"/>%0D%0A</svg>%0D%0A\"","\"data:image/svg+xml,<svg width=\\\"20\\\" height=\\\"20\\\" viewBox=\\\"0 0 20 20\\\" fill=\\\"none\\\" xmlns=\\\"http://www.w3.org/2000/svg\\\">%0D%0A<path fill-rule=\\\"evenodd\\\" clip-rule=\\\"evenodd\\\" d=\\\"M11.4144 2.41452C10.6334 1.63347 9.36702 1.63347 8.58598 2.41452L2.4144 8.5861C1.63335 9.36714 1.63335 10.6335 2.4144 11.4145L8.58597 17.5861C9.36702 18.3671 10.6334 18.3671 11.4144 17.5861L17.586 11.4145C18.367 10.6335 18.367 9.36715 17.586 8.5861L11.4144 2.41452ZM11.0002 6.00024C11.0002 6.55253 10.5525 7.00024 10.0002 7.00024C9.4479 7.00024 9.00018 6.55253 9.00018 6.00024C9.00018 5.44796 9.4479 5.00024 10.0002 5.00024C10.5525 5.00024 11.0002 5.44796 11.0002 6.00024ZM9.00018 9.00024C9.00018 8.44796 9.4479 8.00024 10.0002 8.00024C10.5525 8.00024 11.0002 8.44796 11.0002 9.00024V14.0002C11.0002 14.5525 10.5525 15.0002 10.0002 15.0002C9.4479 15.0002 9.00018 14.5525 9.00018 14.0002V9.00024Z\\\" fill=\\\"%23CDBE91\\\"/>%0D%0A</svg>%0D%0A\"","\"data:image/svg+xml,<svg width=\\\"20\\\" height=\\\"20\\\" viewBox=\\\"0 0 20 20\\\" fill=\\\"none\\\" xmlns=\\\"http://www.w3.org/2000/svg\\\">%0D%0A<path fill-rule=\\\"evenodd\\\" clip-rule=\\\"evenodd\\\" d=\\\"M18 4.91543L8.72622 14.0231L8.34844 14.3912L6.70933 16L6.70311 15.9939L6.69689 16L5.30133 14.6295L4.82756 14.1677L2 11.3816L4.03022 9.44369L6.82222 12.1648L15.952 3L18 4.91543Z\\\" fill=\\\"%23A09B8C\\\"/>%0D%0A</svg>%0D%0A\"","\"data:image/svg+xml,<svg width=\\\"20\\\" height=\\\"20\\\" viewBox=\\\"0 0 20 20\\\" fill=\\\"none\\\" xmlns=\\\"http://www.w3.org/2000/svg\\\">%0D%0A<path fill-rule=\\\"evenodd\\\" clip-rule=\\\"evenodd\\\" d=\\\"M10.8889 3L18 15.25L17.1111 17H2.88889L2 15.25L9.11111 3H10.8889ZM9.11111 11.75L8.22222 7.375L10 6.5L11.7778 7.375L10.8889 11.75H9.11111ZM11.7778 14.375L10 16.125L8.22222 14.375L10 12.625L11.7778 14.375Z\\\" fill=\\\"%23C89B3C\\\"/>%0D%0A</svg>%0D%0A\"","import { useMemo } from \"react\";\nimport {\n\ttype ExternalToast,\n\ttoast as sonnerToast,\n\tToaster,\n\ttype ToasterProps,\n} from \"sonner\";\nimport { button } from \"../button\";\nimport { Spinner } from \"../spinner/spinner\";\nimport { heading } from \"../typography/heading\";\nimport { text } from \"../typography/text\";\nimport classes from \"./sonner.module.css\";\nimport sonnerError from \"./sonner-error.svg\";\nimport sonnerInfo from \"./sonner-info.svg\";\nimport sonnerSuccess from \"./sonner-success.svg\";\nimport type { Toast } from \"./sonner-types\";\nimport sonnerWarning from \"./sonner-warning.svg\";\n\nexport type ToastVariant = \"default\" \| \"hextech\";\n\nexport const sonner: Toast = sonnerToast;\n\nexport type SonnerProps = ExternalToast;\n\nexport function Sonner(props: ToasterProps) {\n\treturn (\n\t\t<Toaster\n\t\t\t{...props}\n\t\t\ttoastOptions={useMemo(\n\t\t\t\t() => ({\n\t\t\t\t\t...props.toastOptions,\n\t\t\t\t\tunstyled: true,\n\t\t\t\t\tclassNames: {\n\t\t\t\t\t\tactionButton: button({\n\t\t\t\t\t\t\tpreset: \"dimmed\",\n\t\t\t\t\t\t\tsize: \"small\",\n\t\t\t\t\t\t\tthin: true,\n\t\t\t\t\t\t\tclassName: classes.button,\n\t\t\t\t\t\t}),\n\t\t\t\t\t\tcancelButton: button({\n\t\t\t\t\t\t\tpreset: \"dimmed\",\n\t\t\t\t\t\t\tsize: \"small\",\n\t\t\t\t\t\t\tthin: true,\n\t\t\t\t\t\t\tclassName: classes.button,\n\t\t\t\t\t\t}),\n\t\t\t\t\t\tcloseButton: button({\n\t\t\t\t\t\t\tpreset: \"dimmed\",\n\t\t\t\t\t\t\tsize: \"small\",\n\t\t\t\t\t\t\tshape: \"round\",\n\t\t\t\t\t\t\tthin: true,\n\t\t\t\t\t\t\tclassName: classes.closeButton,\n\t\t\t\t\t\t}),\n\t\t\t\t\t\t// content: classes.content,\n\t\t\t\t\t\ttoast: classes.toast,\n\t\t\t\t\t\ttitle: heading({ preset: \"h5\", className: classes.title }),\n\t\t\t\t\t\tdescription: text({\n\t\t\t\t\t\t\tpreset: \"sm\",\n\t\t\t\t\t\t\tcolor: \"grey100\",\n\t\t\t\t\t\t}),\n\t\t\t\t\t\ticon: classes.icon,\n\t\t\t\t\t\tdefault: classes.default,\n\t\t\t\t\t\tloader: classes.loader,\n\t\t\t\t\t\tcontent: classes.content,\n\t\t\t\t\t},\n\t\t\t\t}),\n\t\t\t\t[props.toastOptions],\n\t\t\t)}\n\t\t\ticons={{\n\t\t\t\tloading: <Spinner />,\n\t\t\t\tsuccess: <img src={sonnerSuccess} alt=\"\" />,\n\t\t\t\terror: <img src={sonnerError} alt=\"\" />,\n\t\t\t\twarning: <img src={sonnerWarning} alt=\"\" />,\n\t\t\t\tinfo: <img src={sonnerInfo} alt=\"\" />,\n\t\t\t}}\n\t\t/>\n\t);\n}\n","@layer lol {\n\t.track {\n\t\tbackground:\n\t\t\tvar(--lol-switch-background-gradient) padding-box,\n\t\t\tvar(--lol-switch-border-gradient) border-box;\n\n\t\t--lol-switch-border-gradient: var(--lol-gradient-gold);\n\t\t--lol-switch-background-gradient: var(--lol-gradient-grey-300);\n\n\t\tborder: 2px solid transparent;\n\t\theight: 1.5rem;\n\t\twidth: 3.5rem;\n\n\t\tborder-radius: 9999px;\n\n\t\tposition: relative;\n\t}\n\n\t.knob {\n\t\tposition: absolute;\n\t\tleft: -0.5rem;\n\t\ttop: -0.375rem;\n\t\theight: 2rem;\n\t\twidth: 2rem;\n\t\tborder-radius: 9999px;\n\t\tbackground:\n\t\t\tvar(--lol-switch-background-gradient) padding-box,\n\t\t\tvar(--lol-switch-border-gradient) border-box;\n\n\t\ttransition: left 200ms ease-in-out;\n\n\t\t--lol-switch-border-gradient: var(--lol-gradient-gold);\n\t\t--lol-switch-background-gradient: var(--lol-gradient-grey-300);\n\n\t\tborder: 2px solid transparent;\n\t}\n\n\t.switch {\n\t\tdisplay: inline-flex;\n\t\talign-items: center;\n\t\tgap: 1rem;\n\t\tpadding: 0.25rem 0.375rem;\n\n\t\t&[data-hovered] {\n\t\t\t.track {\n\t\t\t\t--lol-switch-border-gradient: var(--lol-gradient-gold-hover);\n\t\t\t}\n\t\t\t.knob {\n\t\t\t\t--lol-switch-border-gradient: var(--lol-gradient-gold-hover);\n\t\t\t}\n\t\t}\n\n\t\t&[data-pressed] {\n\t\t\t.track {\n\t\t\t\t--lol-switch-border-gradient: var(--lol-gradient-gold-press);\n\t\t\t}\n\t\t\t.knob {\n\t\t\t\t--lol-switch-border-gradient: var(--lol-gradient-gold-press);\n\t\t\t}\n\t\t}\n\n\t\t&[data-disabled] {\n\t\t\t.track {\n\t\t\t\t--lol-switch-border-gradient: var(--lol-gradient-disabled);\n\t\t\t}\n\t\t\t.knob {\n\t\t\t\t--lol-switch-border-gradient: var(--lol-gradient-disabled);\n\t\t\t}\n\t\t}\n\n\t\t&[data-selected] {\n\t\t\t.track {\n\t\t\t\t--lol-switch-background-gradient: var(--lol-gradient-hextech);\n\t\t\t}\n\t\t\t.knob {\n\t\t\t\tleft: calc(100% - 1.5rem);\n\t\t\t}\n\t\t}\n\t}\n}\n","import { cx } from \"cva\";\nimport type {\n\tSwitchButtonProps,\n\tSwitchFieldProps,\n} from \"react-aria-components\";\nimport {\n\tSwitchButton as AriaSwitchButton,\n\tSwitchField as AriaSwitchField,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport classes from \"./switch.module.css\";\nimport textClasses from \"./typography/text.module.css\";\n\nexport function SwitchButton({\n\tclassName,\n\tchildren,\n\t...props\n}: SwitchButtonProps) {\n\treturn (\n\t\t<AriaSwitchButton\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(\n\t\t\t\t\tclasses.switch,\n\t\t\t\t\ttextClasses.label,\n\t\t\t\t\ttextClasses.text,\n\t\t\t\t\ttextClasses.grey100,\n\t\t\t\t\tclassName,\n\t\t\t\t),\n\t\t\t)}\n\t\t>\n\t\t\t{(values) => (\n\t\t\t\t<>\n\t\t\t\t\t<div className={classes.track}>\n\t\t\t\t\t\t<span className={classes.knob} />\n\t\t\t\t\t</div>\n\t\t\t\t\t{typeof children === \"function\" ? children(values) : children}\n\t\t\t\t</>\n\t\t\t)}\n\t\t</AriaSwitchButton>\n\t);\n}\n\nexport function SwitchField({ className, ...props }: SwitchFieldProps) {\n\treturn <AriaSwitchField {...props} className={className} />;\n}\n\nexport function Switch({\n\tchildren,\n\tclassName,\n\t...props\n}: Omit<SwitchFieldProps, \"children\" \| \"className\"> &\n\tPick<SwitchButtonProps, \"children\" \| \"className\">) {\n\treturn (\n\t\t<SwitchField {...props}>\n\t\t\t<SwitchButton className={className}>{children}</SwitchButton>\n\t\t</SwitchField>\n\t);\n}\n","@layer lol {\n\t.resizableContainer {\n\t\toverflow: auto;\n\t\tposition: relative;\n\t}\n\n\t.table {\n\t\tborder-collapse: collapse;\n\t\tborder-spacing: 0;\n\t\twidth: 100%;\n\t\toutline: none;\n\n\t\tfont-family: var(--lol-font-family-spiegel);\n\t\tfont-size: var(--lol-font-size-sm);\n\t\tline-height: var(--lol-line-height-sm);\n\t\tletter-spacing: var(--lol-letter-spacing-sm);\n\t\tfont-weight: var(--lol-font-weight-sm);\n\n\t\t&[data-focus-visible] {\n\t\t\toutline: 1px solid var(--lol-color-gold-400);\n\t\t\toutline-offset: 0.25rem;\n\t\t}\n\t}\n\n\t.row {\n\t\tcolor: var(--lol-color-grey-100);\n\t\toutline: none;\n\t\ttransition: color 0.3s ease;\n\n\t\t/ Every decoration is a background layer: a pseudo element on a table row\n\t\t is laid out as an anonymous cell and would shift the columns. /\n\t\t--lol-table-row-spine: none;\n\t\t--lol-table-row-hover: none;\n\t\t--lol-table-row-highlight: none;\n\n\t\tbackground-image:\n\t\t\tvar(--lol-table-row-spine), var(--lol-table-row-hover),\n\t\t\tvar(--lol-table-row-highlight);\n\t\tbackground-repeat: no-repeat;\n\n\t\t@media (prefers-reduced-motion: reduce) {\n\t\t\ttransition: none;\n\t\t}\n\n\t\t&[data-href] {\n\t\t\tcursor: pointer;\n\t\t}\n\n\t\t&[data-hovered] {\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t\t--lol-table-row-hover: linear-gradient(\n\t\t\t\t90deg,\n\t\t\t\trgb(from var(--lol-color-gold-100) r g b / 0.08),\n\t\t\t\ttransparent\n\t\t\t);\n\t\t}\n\n\t\t&[data-selected] {\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t\t/ Gold spine on the selected row, matching the client's \"current\" row. /\n\t\t\t--lol-table-row-spine: linear-gradient(\n\t\t\t\t90deg,\n\t\t\t\tvar(--lol-color-gold-500) 0 0.25rem,\n\t\t\t\ttransparent 0.25rem\n\t\t\t);\n\t\t\t--lol-table-row-highlight: linear-gradient(\n\t\t\t\t90deg,\n\t\t\t\trgb(from var(--lol-color-blue-400) r g b / 0.55),\n\t\t\t\trgb(from var(--lol-color-blue-300) r g b / 0.1)\n\t\t\t);\n\t\t}\n\n\t\t&[data-disabled] {\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t\tcursor: default;\n\t\t}\n\n\t\t&[data-focus-visible] {\n\t\t\toutline: 1px solid var(--lol-color-gold-400);\n\t\t\toutline-offset: -1px;\n\t\t}\n\t}\n\n\t.cell {\n\t\t/\n\t\t * Collapsed borders are resolved between neighbours, and Chrome paints the\n\t\t * winning hairline once per edge when the losing side is styled `none`. The\n\t\t * header's 25%-opacity line then blends twice and comes out twice as\n\t\t * bright; a zero-width `solid` border on the cell below keeps it single.\n\t\t /\n\t\tborder: 0 solid;\n\t\tpadding: 0.375rem 0.75rem;\n\t\tvertical-align: middle;\n\t\toutline: none;\n\n\t\t&[data-focus-visible] {\n\t\t\toutline: 1px solid var(--lol-color-gold-400);\n\t\t\toutline-offset: -1px;\n\t\t}\n\t}\n\n\t.resizer {\n\t\tposition: absolute;\n\t\tinset-block: 0;\n\t\tinset-inline-end: 0;\n\t\twidth: 0.75rem;\n\t\tbox-sizing: border-box;\n\t\tborder-inline: 0.3125rem solid transparent;\n\t\tbackground-color: rgb(from var(--lol-color-gold-500) r g b / 0.6);\n\t\tbackground-clip: content-box;\n\t\ttouch-action: none;\n\t\toutline: none;\n\t\tcursor: col-resize;\n\n\t\t&[data-resizable-direction=\"left\"] {\n\t\t\tcursor: e-resize;\n\t\t}\n\n\t\t&[data-resizable-direction=\"right\"] {\n\t\t\tcursor: w-resize;\n\t\t}\n\n\t\t&[data-hovered],\n\t\t&[data-resizing] {\n\t\t\tbackground-color: var(--lol-color-gold-400);\n\t\t}\n\n\t\t&[data-focus-visible] {\n\t\t\tbackground-color: var(--lol-color-gold-200);\n\t\t}\n\t}\n\n\t/ Fixed footprint so toggling the sort direction never shifts the header. /\n\t.sortIndicator {\n\t\tdisplay: inline-block;\n\t\tvertical-align: middle;\n\t\twidth: 0.5rem;\n\t\tmargin-left: 0.375rem;\n\t\topacity: 0;\n\t\ttransition: opacity 0.3s ease;\n\n\t\t@media (prefers-reduced-motion: reduce) {\n\t\t\ttransition: none;\n\t\t}\n\n\t\t&::after {\n\t\t\tcontent: \"\";\n\t\t\tdisplay: block;\n\t\t\twidth: 0;\n\t\t\theight: 0;\n\t\t\tborder-style: solid;\n\t\t\tborder-color: transparent;\n\t\t\tborder-width: 0 0.25rem 0.375rem;\n\t\t\tborder-bottom-color: currentColor;\n\t\t}\n\t}\n\n\t.column {\n\t\tposition: relative;\n\t\tfont-family: var(--lol-font-family-beaufort);\n\t\tcolor: var(--lol-color-gold-100);\n\t\tfont-size: 0.75rem;\n\t\tfont-weight: 700;\n\t\tletter-spacing: 0.075em;\n\t\tline-height: 1rem;\n\t\ttext-transform: uppercase;\n\t\twhite-space: nowrap;\n\t\tpadding: 0.375rem 0.75rem;\n\t\t/ The client separates the header from the rows with a faint hairline\n\t\t rather than a full border. /\n\t\tborder-bottom: 1px solid rgb(from var(--lol-color-grey-100) r g b / 0.25);\n\t\toutline: none;\n\n\t\t/ Only sortable columns are interactive, so they are the only ones react\n\t\t aria marks as hovered or pressed. /\n\t\t&[data-allows-sorting] {\n\t\t\tcursor: pointer;\n\t\t\tuser-select: none;\n\t\t\ttransition: color 0.3s ease;\n\n\t\t\t@media (prefers-reduced-motion: reduce) {\n\t\t\t\ttransition: none;\n\t\t\t}\n\t\t}\n\n\t\t&[data-hovered] {\n\t\t\tcolor: var(--lol-color-gold-200);\n\t\t}\n\n\t\t&[data-pressed] {\n\t\t\tcolor: var(--lol-color-gold-500);\n\t\t}\n\n\t\t&[data-hovered] .sortIndicator {\n\t\t\topacity: 0.5;\n\t\t}\n\n\t\t&[data-sort-direction] .sortIndicator {\n\t\t\topacity: 1;\n\t\t}\n\n\t\t&[data-sort-direction=\"descending\"] .sortIndicator::after {\n\t\t\tborder-width: 0.375rem 0.25rem 0;\n\t\t\tborder-top-color: currentColor;\n\t\t\tborder-bottom-color: transparent;\n\t\t}\n\n\t\t&[data-focus-visible] {\n\t\t\toutline: 1px solid var(--lol-color-gold-400);\n\t\t\toutline-offset: -1px;\n\t\t}\n\t}\n\n\t.footer {\n\t\tcolor: var(--lol-color-gold-300);\n\n\t\t& .cell {\n\t\t\tborder-top: 1px solid rgb(from var(--lol-color-grey-100) r g b / 0.25);\n\t\t}\n\t}\n\n\t.empty {\n\t\tpadding: 1rem 0.75rem;\n\t\ttext-align: center;\n\t}\n\n\t/ React aria renders the empty state in a row it builds itself, so that cell\n\t never gets `.cell` and keeps the UA's 1px padding. /\n\t.table [data-empty] > tr > td {\n\t\tpadding: 0;\n\t}\n\n\t.start {\n\t\ttext-align: start;\n\t}\n\n\t.center {\n\t\ttext-align: center;\n\t}\n\n\t.end {\n\t\ttext-align: end;\n\t}\n}\n","import { cva, cx } from \"cva\";\nimport {\n\tCell as AriaCell,\n\ttype CellProps as AriaCellProps,\n\tColumn as AriaColumn,\n\ttype ColumnProps as AriaColumnProps,\n\tColumnResizer as AriaColumnResizer,\n\ttype ColumnResizerProps as AriaColumnResizerProps,\n\tRow as AriaRow,\n\ttype RowProps as AriaRowProps,\n\tTable as AriaTable,\n\tTableBody as AriaTableBody,\n\ttype TableBodyProps as AriaTableBodyProps,\n\tTableFooter as AriaTableFooter,\n\ttype TableFooterProps as AriaTableFooterProps,\n\ttype TableProps as AriaTableProps,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport classes from \"./table.module.css\";\nimport { text } from \"./typography/text\";\n\nexport { ResizableTableContainer, TableHeader } from \"react-aria-components\";\n\n/* Horizontal alignment shared by `TableColumn` and `TableCell`. /\nexport type TableAlign = \"start\" \| \"center\" \| \"end\";\n\nconst alignVariants = {\n\tstart: classes.start,\n\tcenter: classes.center,\n\tend: classes.end,\n};\n\nexport const table = cva({\n\tbase: classes.table,\n});\n\nexport interface TableProps extends AriaTableProps {}\n\nexport function Table({ className, ...props }: TableProps) {\n\treturn (\n\t\t<AriaTable\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\ttable({ className }),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport const tableColumn = cva({\n\tbase: classes.column,\n\tvariants: { align: alignVariants },\n\tdefaultVariants: { align: \"start\" },\n});\n\nexport interface TableColumnProps extends AriaColumnProps {\n\talign?: TableAlign;\n}\n\nexport function TableColumn({\n\talign = \"start\",\n\tchildren,\n\tclassName,\n\t...props\n}: TableColumnProps) {\n\treturn (\n\t\t<AriaColumn\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\ttableColumn({ align, className }),\n\t\t\t)}\n\t\t>\n\t\t\t{composeRenderProps(children, (children, { allowsSorting }) => (\n\t\t\t\t<>\n\t\t\t\t\t{children}\n\t\t\t\t\t{allowsSorting && (\n\t\t\t\t\t\t<span aria-hidden=\"true\" className={classes.sortIndicator} />\n\t\t\t\t\t)}\n\t\t\t\t</>\n\t\t\t))}\n\t\t</AriaColumn>\n\t);\n}\n\nexport interface TableColumnResizerProps extends AriaColumnResizerProps {}\n\nexport function TableColumnResizer({\n\tclassName,\n\t...props\n}: TableColumnResizerProps) {\n\treturn (\n\t\t<AriaColumnResizer\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.resizer, className),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport interface TableBodyProps<T extends object>\n\textends AriaTableBodyProps<T> {\n\t/* Rendered when the table has no rows. /\n\temptyState?: React.ReactNode;\n}\n\nexport function TableBody<T extends object>({\n\temptyState = \"No results found\",\n\trenderEmptyState,\n\t...props\n}: TableBodyProps<T>) {\n\treturn (\n\t\t<AriaTableBody<T>\n\t\t\t{...props}\n\t\t\trenderEmptyState={\n\t\t\t\trenderEmptyState ??\n\t\t\t\t(() => (\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={text({\n\t\t\t\t\t\t\tcolor: \"grey150\",\n\t\t\t\t\t\t\tpreset: \"base\",\n\t\t\t\t\t\t\tclassName: classes.empty,\n\t\t\t\t\t\t})}\n\t\t\t\t\t>\n\t\t\t\t\t\t{emptyState}\n\t\t\t\t\t</div>\n\t\t\t\t))\n\t\t\t}\n\t\t/>\n\t);\n}\n\nexport const tableRow = cva({\n\tbase: classes.row,\n});\n\nexport interface TableRowProps<T extends object> extends AriaRowProps<T> {}\n\nexport function TableRow<T extends object>({\n\tclassName,\n\t...props\n}: TableRowProps<T>) {\n\treturn (\n\t\t<AriaRow<T>\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\ttableRow({ className }),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport const tableCell = cva({\n\tbase: classes.cell,\n\tvariants: { align: alignVariants },\n\tdefaultVariants: { align: \"start\" },\n});\n\nexport interface TableCellProps extends AriaCellProps {\n\talign?: TableAlign;\n}\n\nexport function TableCell({\n\talign = \"start\",\n\tclassName,\n\t...props\n}: TableCellProps) {\n\treturn (\n\t\t<AriaCell\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\ttableCell({ align, className }),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport interface TableFooterProps<T extends object>\n\textends AriaTableFooterProps<T> {}\n\nexport function TableFooter<T extends object>({\n\tclassName,\n\t...props\n}: TableFooterProps<T>) {\n\treturn (\n\t\t<AriaTableFooter<T> {...props} className={cx(classes.footer, className)} />\n\t);\n}\n","@layer lol {\n\t.list {\n\t\tmargin-left: -1rem;\n\t\tdisplay: flex;\n\t}\n\n\t.tab {\n\t\tfont-family: var(--lol-font-family-beaufort);\n\t\tcolor: var(--lol-color-gold-300);\n\t\tposition: relative;\n\t\tcursor: pointer;\n\t\tuser-select: none;\n\t\tpadding: 0.25rem 1rem;\n\t\tfont-size: 0.75rem;\n\t\tfont-weight: 500;\n\t\ttext-transform: uppercase;\n\t\tletter-spacing: 0.1em;\n\t\tline-height: 1rem;\n\t\toutline: none;\n\n\t\t&[data-selected] {\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t}\n\n\t\t&[data-hovered] {\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t}\n\n\t\t&[data-pressed] {\n\t\t\tcolor: var(--lol-color-gold-500);\n\t\t}\n\n\t\t&[data-disabled] {\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t\tcursor: default;\n\t\t}\n\n\t\t&[data-focus-visible] {\n\t\t\toutline: 1px solid var(--lol-color-gold-400);\n\t\t\toutline-offset: 0.25rem;\n\t\t}\n\t}\n\n\t.indicator {\n\t\tposition: absolute;\n\t\tbottom: 0;\n\t\tleft: 0;\n\t\theight: 1px;\n\t\twidth: 100%;\n\t\tbackground: linear-gradient(\n\t\t\tto right,\n\t\t\ttransparent,\n\t\t\tvar(--lol-color-gold-200),\n\t\t\ttransparent\n\t\t);\n\n\t\ttransition-property: translate, width;\n\t\ttransition-duration: 200ms;\n\t\t@media (prefers-reduced-motion: reduce) {\n\t\t\ttransition: none;\n\t\t}\n\t}\n}\n","\"use client\";\n\nimport { cx } from \"cva\";\nimport {\n\tTab as AriaTab,\n\tTabList as AriaTabList,\n\tTabPanel as AriaTabPanel,\n\tTabs as AriaTabs,\n\tcomposeRenderProps,\n\tSelectionIndicator,\n\ttype TabListProps,\n\ttype TabPanelProps,\n\ttype TabProps,\n} from \"react-aria-components\";\nimport classes from \"./tabs.module.css\";\n\nexport const Tabs = AriaTabs;\n\nexport function TabList<T extends object>({\n\tclassName,\n\t...rest\n}: TabListProps<T>) {\n\treturn (\n\t\t<AriaTabList<T>\n\t\t\t{...rest}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.list, className),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport function Tab({ children, className, ...rest }: TabProps) {\n\treturn (\n\t\t<AriaTab\n\t\t\t{...rest}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.tab, className),\n\t\t\t)}\n\t\t>\n\t\t\t{(values) => (\n\t\t\t\t<>\n\t\t\t\t\t{typeof children === \"function\" ? children(values) : children}\n\t\t\t\t\t{values.isSelected && (\n\t\t\t\t\t\t<SelectionIndicator className={classes.indicator} />\n\t\t\t\t\t)}\n\t\t\t\t</>\n\t\t\t)}\n\t\t</AriaTab>\n\t);\n}\n\nexport function TabPanel({ ...rest }: TabPanelProps) {\n\treturn <AriaTabPanel {...rest} />;\n}\n","@layer lol {\n\t.textField {\n\t\tbackground:\n\t\t\tvar(--lol-input-background-gradient) padding-box,\n\t\t\tvar(--lol-input-border-gradient) border-box;\n\n\t\t--lol-input-border-gradient: var(--lol-gradient-gold);\n\t\t--lol-input-background-gradient: var(--lol-gradient-hextech-black);\n\n\t\tborder: 1px solid transparent;\n\t\tgrid-area: input;\n\t\tpadding: 0 0.75rem;\n\t\tmargin: 0;\n\t\tfont-size: 0.75rem;\n\t\tline-height: 1rem;\n\t\toutline: none;\n\t\tfont-family: var(--lol-font-family-spiegel);\n\t\tfont-weight: 500;\n\t\tletter-spacing: 0.025em;\n\n\t\tmin-height: var(--lol-form-input-min-height);\n\n\t\tcolor: var(--lol-color-gold-100);\n\n\t\tdisplay: flex;\n\t\twidth: 100%;\n\n\t\t&[data-disabled] {\n\t\t\t--lol-input-border-gradient: var(--lol-gradient-disabled);\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t}\n\n\t\t&[data-focused] {\n\t\t\t--lol-input-border-gradient: var(--lol-gradient-gold-hover);\n\t\t\t--lol-input-background-gradient: var(--lol-gradient-grey-focus);\n\t\t}\n\n\t\t&.small {\n\t\t\tmin-height: var(--lol-form-height-small);\n\t\t}\n\n\t\t&.medium {\n\t\t\tmin-height: var(--lol-form-height-medium);\n\t\t}\n\n\t\t&.large {\n\t\t\tmin-height: var(--lol-form-height-large);\n\t\t}\n\n\t\t&.textArea {\n\t\t\tpadding-top: 0.5rem;\n\t\t\tpadding-bottom: 0.5rem;\n\t\t\t/ The UA lets a textarea be resized in both axes, which breaks the\n\t\t\t field's layout; only the height is safe to drag. /\n\t\t\tresize: vertical;\n\t\t}\n\t}\n}\n","import { cva } from \"cva\";\nimport type { ComponentProps } from \"react\";\nimport type {\n\tTextFieldProps as AriaTextFieldProps,\n\tInputProps,\n} from \"react-aria-components\";\nimport {\n\tInput as AriaInput,\n\tTextField as AriaTextField,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport classes from \"./text-field.module.css\";\n\nexport const textField = cva({\n\tbase: classes.textField,\n\tvariants: {\n\t\tsize: {\n\t\t\tsmall: classes.small,\n\t\t\tmedium: classes.medium,\n\t\t\tlarge: classes.large,\n\t\t},\n\t\tisTextArea: { true: classes.textArea },\n\t},\n});\n\nexport function TextField({\n\tinputProps = {},\n\tborderProps = {},\n\tchildren,\n\tsize = \"medium\",\n\t...props\n}: AriaTextFieldProps & {\n\tinputProps?: InputProps;\n\tborderProps?: ComponentProps<\"div\">;\n\tsize?: \"small\" \| \"medium\" \| \"large\";\n}) {\n\treturn (\n\t\t<AriaTextField {...props}>\n\t\t\t{(values) => (\n\t\t\t\t<>\n\t\t\t\t\t{typeof children === \"function\" ? children(values) : children}\n\n\t\t\t\t\t<AriaInput\n\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\t{...inputProps}\n\t\t\t\t\t\tclassName={composeRenderProps(\n\t\t\t\t\t\t\tinputProps.className,\n\t\t\t\t\t\t\t(className, values) =>\n\t\t\t\t\t\t\t\ttextField({\n\t\t\t\t\t\t\t\t\t...values,\n\t\t\t\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t\t\t\tsize,\n\t\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t)}\n\t\t\t\t\t/>\n\t\t\t\t</>\n\t\t\t)}\n\t\t</AriaTextField>\n\t);\n}\n","import type {\n\tTextFieldProps as AriaTextFieldProps,\n\tTextAreaProps,\n} from \"react-aria-components\";\nimport {\n\tTextArea as AriaTextArea,\n\tTextField as AriaTextField,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport { textField } from \"./text-field\";\n\nexport function TextArea({\n\ttextAreaProps = {},\n\tchildren,\n\t...props\n}: AriaTextFieldProps & {\n\ttextAreaProps?: TextAreaProps;\n}) {\n\treturn (\n\t\t<AriaTextField {...props}>\n\t\t\t{(values) => (\n\t\t\t\t<>\n\t\t\t\t\t{typeof children === \"function\" ? children(values) : children}\n\t\t\t\t\t<AriaTextArea\n\t\t\t\t\t\t{...textAreaProps}\n\t\t\t\t\t\tclassName={composeRenderProps(\n\t\t\t\t\t\t\ttextAreaProps.className,\n\t\t\t\t\t\t\t(className, values) =>\n\t\t\t\t\t\t\t\ttextField({\n\t\t\t\t\t\t\t\t\t...values,\n\t\t\t\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t\t\t\tisTextArea: true,\n\t\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t)}\n\t\t\t\t\t/>\n\t\t\t\t</>\n\t\t\t)}\n\t\t</AriaTextField>\n\t);\n}\n","import { cva } from \"cva\";\nimport {\n\tToggleButton as AriaToggleButton,\n\ttype ToggleButtonProps as AriaToggleButtonProps,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport type { ButtonShape, ButtonSize } from \"./button\";\nimport classes from \"./button.module.css\";\n\nexport type ToggleButtonPreset = \"secondary\" \| \"hextech\" \| \"dimmed\";\n\nconst button = cva({\n\tbase: classes.button,\n\tvariants: {\n\t\tpreset: {\n\t\t\tsecondary: classes.secondary,\n\t\t\thextech: classes.hextech,\n\t\t\tdimmed: classes.dimmed,\n\t\t},\n\t\tshape: {\n\t\t\tround: classes.round,\n\t\t\tsquare: classes.square,\n\t\t\tnormal: classes.normal,\n\t\t},\n\t\tthin: {\n\t\t\ttrue: classes.thin,\n\t\t},\n\t\tsize: {\n\t\t\tsmall: classes.small,\n\t\t\tmedium: classes.medium,\n\t\t\tlarge: classes.large,\n\t\t},\n\t},\n});\ninterface ToggleButtonProps extends AriaToggleButtonProps {\n\tpreset?: ToggleButtonPreset;\n\tthin?: boolean;\n\tshape?: ButtonShape;\n\tsize?: ButtonSize;\n}\n\nexport function ToggleButton({\n\tchildren,\n\tclassName,\n\tpreset = \"secondary\",\n\tshape = \"normal\",\n\tsize = \"medium\",\n\tthin = preset === \"dimmed\",\n\t...props\n}: ToggleButtonProps) {\n\treturn (\n\t\t<AriaToggleButton\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className, values) =>\n\t\t\t\tbutton({\n\t\t\t\t\t...values,\n\t\t\t\t\tpreset,\n\t\t\t\t\tshape,\n\t\t\t\t\tthin,\n\t\t\t\t\tsize,\n\t\t\t\t\tclassName,\n\t\t\t\t}),\n\t\t\t)}\n\t\t>\n\t\t\t{children}\n\t\t</AriaToggleButton>\n\t);\n}\n","\"use client\";\n\nimport { cx } from \"cva\";\nimport {\n\tToggleButtonGroup as AriaToggleButtonGroup,\n\ttype ToggleButtonGroupProps as AriaToggleButtonGroupProps,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport classes from \"./button.module.css\";\n\nexport interface ToggleButtonGroupProps extends AriaToggleButtonGroupProps {}\n\nexport function ToggleButtonGroup({\n\tclassName,\n\t...props\n}: ToggleButtonGroupProps) {\n\treturn (\n\t\t<AriaToggleButtonGroup\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.toggleButtonGroup, className),\n\t\t\t)}\n\t\t/>\n\t);\n}\n","@layer lol {\n\t.toolbar {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tgap: 0.5rem;\n\n\t\t/\n\t\t * Controls keep their own width in a vertical toolbar; stretching them\n\t\t * blows up anything sized by aspect ratio, like square/round buttons.\n\t\t /\n\t\t&[data-orientation=\"vertical\"] {\n\t\t\tflex-direction: column;\n\t\t\talign-items: flex-start;\n\t\t}\n\t}\n\n\t.separator {\n\t\tborder: none;\n\t\t/ An <hr> when horizontal: the UA gives it block margins and a grey\n\t\t `color`. /\n\t\tmargin: 0;\n\t\tcolor: inherit;\n\t\tflex: none;\n\t\talign-self: stretch;\n\t\theight: 1px;\n\t\tbackground-image: linear-gradient(\n\t\t\tto right,\n\t\t\trgba(0, 0, 0, 0),\n\t\t\tvar(--lol-color-gold-600),\n\t\t\trgba(0, 0, 0, 0)\n\t\t);\n\n\t\t/ A vertical separator renders as a <div>, so it has no implicit size. /\n\t\t&[aria-orientation=\"vertical\"] {\n\t\t\theight: auto;\n\t\t\twidth: 1px;\n\t\t\tbackground-image: linear-gradient(\n\t\t\t\tto bottom,\n\t\t\t\trgba(0, 0, 0, 0),\n\t\t\t\tvar(--lol-color-gold-600),\n\t\t\t\trgba(0, 0, 0, 0)\n\t\t\t);\n\t\t}\n\t}\n}\n","\"use client\";\n\nimport { cx } from \"cva\";\nimport {\n\tSeparator as AriaSeparator,\n\ttype SeparatorProps as AriaSeparatorProps,\n\tToolbar as AriaToolbar,\n\ttype ToolbarProps as AriaToolbarProps,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport classes from \"./toolbar.module.css\";\n\nexport interface ToolbarProps extends AriaToolbarProps {}\n\nexport function Toolbar({ className, ...props }: ToolbarProps) {\n\treturn (\n\t\t<AriaToolbar\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.toolbar, className),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport interface ToolbarSeparatorProps extends AriaSeparatorProps {}\n\n/\n Separates groups of controls inside a `Toolbar`. Defaults to the orientation\n * that crosses a horizontal toolbar; pass `orientation=\"horizontal\"` when the\n * toolbar itself is vertical.\n /\nexport function ToolbarSeparator({\n\tclassName,\n\torientation = \"vertical\",\n\t...props\n}: ToolbarSeparatorProps) {\n\treturn (\n\t\t<AriaSeparator\n\t\t\t{...props}\n\t\t\torientation={orientation}\n\t\t\tclassName={cx(classes.separator, className)}\n\t\t/>\n\t);\n}\n","@layer lol {\n\t.tree {\n\t\t--lol-tree-indent: 1.125rem;\n\n\t\tbox-sizing: border-box;\n\t\toverflow: auto;\n\t\toutline: none;\n\n\t\tfont-family: var(--lol-font-family-spiegel);\n\t\tfont-size: var(--lol-font-size-sm);\n\t\tline-height: var(--lol-line-height-sm);\n\t\tletter-spacing: var(--lol-letter-spacing-sm);\n\t\tfont-weight: var(--lol-font-weight-sm);\n\n\t\t&[data-focus-visible] {\n\t\t\toutline: 1px solid var(--lol-color-gold-400);\n\t\t\toutline-offset: 0.25rem;\n\t\t}\n\t}\n\n\t.item {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tgap: 0.375rem;\n\t\t/ Rows are flattened siblings, so the nesting comes from the level react\n\t\t aria exposes on each row rather than from the DOM. /\n\t\tpadding: 0.375rem 0.75rem 0.375rem\n\t\t\tcalc(0.5rem + (var(--tree-item-level) - 1) var(--lol-tree-indent));\n\t\tcolor: var(--lol-color-grey-100);\n\t\toutline: none;\n\t\tcursor: default;\n\t\ttransition: color 0.3s ease;\n\n\t\t/* Every decoration is a background layer so the row keeps a single box:\n\t\t the chevron and the checkbox already own the inline start. /\n\t\t--lol-tree-item-spine: none;\n\t\t--lol-tree-item-hover: none;\n\t\t--lol-tree-item-highlight: none;\n\n\t\tbackground-image:\n\t\t\tvar(--lol-tree-item-spine), var(--lol-tree-item-hover),\n\t\t\tvar(--lol-tree-item-highlight);\n\t\tbackground-repeat: no-repeat;\n\n\t\t@media (prefers-reduced-motion: reduce) {\n\t\t\ttransition: none;\n\t\t}\n\n\t\t/ Branches read as the client's collapsible section headers, leaves as\n\t\t list content. /\n\t\t&[data-has-child-items] {\n\t\t\tfont-family: var(--lol-font-family-beaufort);\n\t\t\tfont-size: 0.75rem;\n\t\t\tfont-weight: 700;\n\t\t\tletter-spacing: 0.075em;\n\t\t\tline-height: 1rem;\n\t\t\ttext-transform: uppercase;\n\t\t\tcolor: var(--lol-color-gold-300);\n\t\t}\n\n\t\t&[data-selection-mode]:not([data-disabled]),\n\t\t&[data-href] {\n\t\t\tcursor: pointer;\n\t\t}\n\n\t\t&[data-hovered] {\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t\t--lol-tree-item-hover: linear-gradient(\n\t\t\t\t90deg,\n\t\t\t\trgb(from var(--lol-color-gold-100) r g b / 0.08),\n\t\t\t\ttransparent\n\t\t\t);\n\t\t}\n\n\t\t&[data-selected] {\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t\t/ Gold spine plus hextech wash on the selected row, matching the\n\t\t\t client's \"current\" row. /\n\t\t\t--lol-tree-item-spine: linear-gradient(\n\t\t\t\t90deg,\n\t\t\t\tvar(--lol-color-gold-500) 0 0.25rem,\n\t\t\t\ttransparent 0.25rem\n\t\t\t);\n\t\t\t--lol-tree-item-highlight: linear-gradient(\n\t\t\t\t90deg,\n\t\t\t\trgb(from var(--lol-color-blue-400) r g b / 0.55),\n\t\t\t\trgb(from var(--lol-color-blue-300) r g b / 0.1)\n\t\t\t);\n\t\t}\n\n\t\t&[data-disabled] {\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t\tcursor: default;\n\t\t}\n\n\t\t&[data-focus-visible] {\n\t\t\toutline: 1px solid var(--lol-color-gold-400);\n\t\t\toutline-offset: -1px;\n\t\t}\n\t}\n\n\t/ Top-level items are separated by the client's faint gold hairline. The\n\t sibling combinator keeps it off the first row, whichever level follows. /\n\t.item + .item[data-level=\"1\"] {\n\t\tborder-top: 1px solid var(--lol-color-gold-600);\n\t}\n\n\t.chevron {\n\t\t/ A <button> we never paint: without this it falls back to the UA's\n\t\t `buttonface` slab, which is grey under `color-scheme: dark`. /\n\t\tappearance: none;\n\t\tborder: 0;\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t\tfont: inherit;\n\t\tletter-spacing: inherit;\n\t\tcolor: inherit;\n\n\t\tflex: none;\n\t\twidth: 0.5rem;\n\t\theight: 0.75rem;\n\t\toutline: none;\n\t\tcursor: pointer;\n\n\t\t--lol-tree-chevron: url(\"./tree-chevron.png\");\n\t\tbackground: var(--lol-tree-chevron) no-repeat center / contain;\n\t\ttransition: rotate 0.15s ease;\n\n\t\t@media (prefers-reduced-motion: reduce) {\n\t\t\ttransition: none;\n\t\t}\n\n\t\t&[data-focus-visible] {\n\t\t\toutline: 1px solid var(--lol-color-gold-400);\n\t\t\toutline-offset: 0.125rem;\n\t\t}\n\t}\n\n\t.chevronSpacer {\n\t\tflex: none;\n\t\twidth: 0.5rem;\n\t}\n\n\t.item[data-expanded] .chevron {\n\t\trotate: 90deg;\n\t}\n\n\t.item[data-hovered] .chevron,\n\t.chevron[data-hovered],\n\t.chevron[data-focus-visible] {\n\t\t--lol-tree-chevron: url(\"./tree-chevron-hover.png\");\n\t}\n\n\t.item[data-disabled] .chevron {\n\t\tcursor: default;\n\t\tfilter: grayscale(100%);\n\t}\n\n\t.label {\n\t\tflex: 1;\n\t\tmin-width: 0;\n\t\toverflow: hidden;\n\t\twhite-space: nowrap;\n\t\ttext-overflow: ellipsis;\n\t}\n\n\t.empty {\n\t\tpadding: 1rem 0.75rem;\n\t\ttext-align: center;\n\t}\n\n\t.loadMore {\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\tpadding: 0.5rem;\n\t}\n\n\t.spinner {\n\t\twidth: 1.5rem;\n\t}\n}\n","import { cva, cx } from \"cva\";\nimport {\n\tButton as AriaButton,\n\tTree as AriaTree,\n\tTreeItem as AriaTreeItem,\n\tTreeItemContent as AriaTreeItemContent,\n\ttype TreeItemContentProps as AriaTreeItemContentProps,\n\ttype TreeItemProps as AriaTreeItemProps,\n\tTreeLoadMoreItem as AriaTreeLoadMoreItem,\n\ttype TreeLoadMoreItemProps as AriaTreeLoadMoreItemProps,\n\ttype TreeProps as AriaTreeProps,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport { Checkbox } from \"../checkbox/checkbox\";\nimport { Spinner } from \"../spinner/spinner\";\nimport { text } from \"../typography/text\";\nimport classes from \"./tree.module.css\";\n\nexport const tree = cva({\n\tbase: classes.tree,\n});\n\nexport interface TreeProps<T> extends AriaTreeProps<T> {\n\t/* Rendered when the tree has no items. /\n\temptyState?: React.ReactNode;\n}\n\nexport function Tree<T extends object>({\n\tclassName,\n\temptyState = \"No results found\",\n\trenderEmptyState,\n\t...props\n}: TreeProps<T>) {\n\treturn (\n\t\t<AriaTree<T>\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\ttree({ className }),\n\t\t\t)}\n\t\t\trenderEmptyState={\n\t\t\t\trenderEmptyState ??\n\t\t\t\t(() => (\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={text({\n\t\t\t\t\t\t\tcolor: \"grey150\",\n\t\t\t\t\t\t\tpreset: \"base\",\n\t\t\t\t\t\t\tclassName: classes.empty,\n\t\t\t\t\t\t})}\n\t\t\t\t\t>\n\t\t\t\t\t\t{emptyState}\n\t\t\t\t\t</div>\n\t\t\t\t))\n\t\t\t}\n\t\t/>\n\t);\n}\n\nexport const treeItem = cva({\n\tbase: classes.item,\n});\n\nexport interface TreeItemProps<T = object> extends AriaTreeItemProps<T> {}\n\nexport function TreeItem<T = object>({\n\tclassName,\n\t...props\n}: TreeItemProps<T>) {\n\treturn (\n\t\t<AriaTreeItem<T>\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\ttreeItem({ className }),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport interface TreeItemContentProps extends AriaTreeItemContentProps {}\n\n/\n The row of a `TreeItem`, holding everything but its nested items.\n \n The expand chevron is added for items that have children, and a selection\n * checkbox for trees with `selectionMode=\"multiple\"`. Setting\n * `selectionBehavior=\"replace\"` drops the checkbox in favour of highlighting\n * the row, like the ladder in the League client.\n /\nexport function TreeItemContent({ children }: TreeItemContentProps) {\n\treturn (\n\t\t<AriaTreeItemContent>\n\t\t\t{composeRenderProps(\n\t\t\t\tchildren,\n\t\t\t\t(children, { hasChildItems, selectionBehavior, selectionMode }) => (\n\t\t\t\t\t<>\n\t\t\t\t\t\t{hasChildItems ? (\n\t\t\t\t\t\t\t<AriaButton className={classes.chevron} slot=\"chevron\" />\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t/ Leaves keep the chevron's footprint so labels stay aligned. */\n\t\t\t\t\t\t\t<span aria-hidden=\"true\" className={classes.chevronSpacer} />\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{selectionMode === \"multiple\" && selectionBehavior === \"toggle\" && (\n\t\t\t\t\t\t\t<Checkbox slot=\"selection\" />\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<span className={classes.label}>{children}</span>\n\t\t\t\t\t</>\n\t\t\t\t),\n\t\t\t)}\n\t\t</AriaTreeItemContent>\n\t);\n}\n\nexport interface TreeLoadMoreItemProps extends AriaTreeLoadMoreItemProps {}\n\nexport function TreeLoadMoreItem({\n\tchildren,\n\tclassName,\n\t...props\n}: TreeLoadMoreItemProps) {\n\treturn (\n\t\t<AriaTreeLoadMoreItem\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.loadMore, className),\n\t\t\t)}\n\t\t>\n\t\t\t{children ?? <Spinner className={classes.spinner} />}\n\t\t</AriaTreeLoadMoreItem>\n\t);\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"index.mjs","names":["AriaBreadcrumbs","classes","AriaBreadcrumb","divider","classes","AriaButton","AriaButton","classes","AriaText","AriaLabel","classes","AriaButton","AriaPopover","AriaListBox","AriaListBoxItem","AriaVirtualizer","ListLayout","classes","AriaCalendarHeaderCell","AriaCalendarGridHeader","AriaCalendarCell","AriaCalendarGrid","AriaCalendarGridBody","AriaCalendar","AriaRangeCalendar","classes","AriaDateSegment","AriaDateInput","AriaDateField","classes","AriaDateInput","AriaButton","AriaPopover","AriaDatePicker","AriaGroup","AriaDateRangePicker","AriaGroup","classes","AriaTimeField","imageIndeterminateHover","imageCheckedHover","imageUncheckedHover","imageIndeterminate","imageChecked","imageUnchecked","AriaCheckboxButton","classes","AriaCheckboxField","AriaDisclosureGroup","Button","classes","AriaDisclosure","AriaDisclosurePanel","classes","classes","AriaGroup","AriaInput","classes","AriaMenuTrigger","AriaSubmenuTrigger","AriaMenu","classes","AriaMenuItem","AriaPopover","AriaMenuSection","AriaHeader","AriaSeparator","AriaVirtualizer","ListLayout","classes","AriaModal","Dialog","AriaHeading","classes","AriaNumberField","Group","Button","AriaInput","classes","AriaPopover","Dialog","AriaProgressBar","classes","Label","AriaRadioGroup","classes","AriaRadioButton","AriaRadioField","classes","AriaSearchField","AriaInput","AriaButton","classes","AriaTag","AriaButton","AriaTagGroup","AriaTagList","useFilter","Select","classes","SelectValue","AriaPopover","Autocomplete","classes","AriaSlider","AriaSliderTrack","AriaSliderFill","AriaSliderThumb","AriaSliderOutput","textClasses","spinnerImage","classes","sonnerToast","classes","sonnerSuccess","sonnerError","sonnerWarning","sonnerInfo","AriaSwitchButton","classes","textClasses","AriaSwitchField","classes","AriaTable","AriaColumn","AriaColumnResizer","AriaTableBody","AriaRow","AriaCell","AriaTableFooter","AriaTabs","AriaTabList","classes","AriaTab","AriaTabPanel","classes","AriaTextField","AriaInput","AriaTextField","AriaTextArea","button","classes","AriaToggleButton","AriaToggleButtonGroup","classes","AriaTokenField","classes","AriaTokenInput","AriaToken","AriaToolbar","classes","AriaSeparator","classes","AriaTree","AriaTreeItem","AriaTreeItemContent","AriaButton","AriaTreeLoadMoreItem"],"sources":["../src/components/breadcrumbs/breadcrumbs.module.css","../src/components/breadcrumbs/breadcrumbs-divider.png","../src/components/breadcrumbs/breadcrumbs.tsx","../src/components/button.module.css","../src/components/button.tsx","../src/components/button-link.tsx","../src/components/typography/text.module.css","../src/components/typography/text.tsx","../src/components/select/select.module.css","../src/components/select/select.tsx","../src/components/calendar/calendar.module.css","../src/components/calendar/calendar.tsx","../src/components/calendar/date-field.module.css","../src/components/calendar/date-field.tsx","../src/components/calendar/date-picker.module.css","../src/components/calendar/date-picker.tsx","../src/components/calendar/date-range-picker.tsx","../src/components/calendar/time-field.tsx","../src/components/checkbox/checkbox.module.css","../src/components/checkbox/checkbox-checked.png","../src/components/checkbox/checkbox-checked-hover.png","../src/components/checkbox/checkbox-indeterminate.png","../src/components/checkbox/checkbox-indeterminate-hover.png","../src/components/checkbox/checkbox-unchecked.png","../src/components/checkbox/checkbox-unchecked-hover.png","../src/components/checkbox/checkbox.tsx","../src/components/disclosure.module.css","../src/components/disclosure.tsx","../src/components/divider.module.css","../src/components/divider.tsx","../src/components/group.module.css","../src/components/group.tsx","../src/components/typography/heading.module.css","../src/components/typography/heading.tsx","../src/components/menu/menu.module.css","../src/components/menu/menu.tsx","../src/components/modal.module.css","../src/components/modal.tsx","../src/components/number-field.module.css","../src/components/number-field.tsx","../src/components/popover.module.css","../src/components/popover.tsx","../src/components/progress-bar.module.css","../src/components/progress-bar.tsx","../src/components/radio-group/radio-group.module.css","../src/components/radio-group/radio-group.tsx","../src/components/search-field/search-field.module.css","../src/components/search-field/search-field.tsx","../src/components/tag-group/tag-group.module.css","../src/components/tag-group/tag-group.tsx","../src/components/select/multiple-select.module.css","../src/components/select/multiple-select.tsx","../src/components/slider/slider.module.css","../src/components/slider/slider.tsx","../src/components/spinner/spinner.module.css","../src/components/spinner/spinner-spinner.png","../src/components/spinner/spinner.tsx","../src/components/sonner/sonner.module.css","../src/components/sonner/sonner-error.svg","../src/components/sonner/sonner-info.svg","../src/components/sonner/sonner-success.svg","../src/components/sonner/sonner-warning.svg","../src/components/sonner/sonner.tsx","../src/components/switch.module.css","../src/components/switch.tsx","../src/components/table.module.css","../src/components/table.tsx","../src/components/tabs.module.css","../src/components/tabs.tsx","../src/components/text-field.module.css","../src/components/text-field.tsx","../src/components/text-area.tsx","../src/components/toggle-button.tsx","../src/components/toggle-button-group.tsx","../src/components/token-field/token-field.module.css","../src/components/token-field/token-field.tsx","../src/components/toolbar.module.css","../src/components/toolbar.tsx","../src/components/tree/tree.module.css","../src/components/tree/tree.tsx"],"sourcesContent":["@layer lol {\n\t.breadcrumbs {\n\t\tdisplay: flex;\n\t\tgap: 0.25rem;\n\t\t/* An <ol>: the UA gives it block margins and a 40px marker gutter. /\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t\tlist-style: none;\n\t}\n\n\t.item {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t}\n\n\t.link {\n\t\ttext-decoration: none;\n\t\tfont-family: var(--lol-font-family-beaufort);\n\t\tcolor: var(--lol-color-gold-300);\n\t\tposition: relative;\n\t\tfont-size: var(--lol-font-size-sm);\n\t\tfont-weight: 500;\n\t\ttext-transform: uppercase;\n\t\tletter-spacing: 0.1em;\n\t\tpadding: 0 1rem;\n\n\t\t&[data-hovered] {\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t}\n\t}\n\n\t.divider {\n\t\t/ Off the text baseline, so the row's height is the glyph's, and never\n\t\t wider than the row. /\n\t\tdisplay: block;\n\t\tmax-width: 100%;\n\t\theight: 11px;\n\t}\n}\n","\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAALCAYAAACtWacbAAAA+0lEQVQYV12QsUoDURBF74xbxHLB9NqHbWwSwUJIutSbQCqb5BPMJ8RPcBttlMR8ggYLkRVxm8XGyk9IFQgx+668zb7N4sDAvJnDu3NHUIk0nrWDVu+52rO1uEb6Ph0KcSNE1Djrj6pgDjnADQRy3Wj1xuX7+/PhaPOrdQBvAHwAS4p2QPpOWkhK+jE/NiajR1lQNVRjhhTYHAXNflTu9PNyWzu5uFx/xbMJwSsnRSIsIbcboInQPBXSCbdZJ4fsL6vDWpeUuXVnVCOhmXCbhcH5YLlzF08HAtwB8HZ3+ecuh17vffEOrMSpcxc0w2R/kqIqwEeKjquAHf8Bd1xn7M0vJ+QAAAAASUVORK5CYII=\"","import { cx } from \"cva\";\nimport {\n\tBreadcrumb as AriaBreadcrumb,\n\tBreadcrumbs as AriaBreadcrumbs,\n\ttype BreadcrumbProps,\n\ttype BreadcrumbsProps,\n\tcomposeRenderProps,\n\tLink,\n} from \"react-aria-components\";\nimport classes from \"../breadcrumbs/breadcrumbs.module.css\";\nimport divider from \"./breadcrumbs-divider.png\";\n\nexport function Breadcrumbs<T extends object>({\n\tclassName,\n\t...props\n}: BreadcrumbsProps<T>) {\n\treturn (\n\t\t<AriaBreadcrumbs\n\t\t\t{...props}\n\t\t\tclassName={cx(classes.breadcrumbs, className)}\n\t\t/>\n\t);\n}\n\nexport function Breadcrumb({\n\tclassName,\n\tchildren,\n\thref,\n\t...props\n}: BreadcrumbProps & {\n\thref?: string;\n}) {\n\treturn (\n\t\t<AriaBreadcrumb\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.item, className),\n\t\t\t)}\n\t\t>\n\t\t\t<Link className={classes.link} href={href}>\n\t\t\t\t{children}\n\t\t\t</Link>\n\t\t\t{href && <img src={divider} alt=\"\" className={classes.divider} />}\n\t\t</AriaBreadcrumb>\n\t);\n}\n","@layer lol {\n\t.button {\n\t\tappearance: none;\n\t\tmargin: 0;\n\t\t/ Presets that want horizontal padding add it back further down. Without a\n\t\t zero here, `text` (which wants none) picks up the UA's `1px 6px`. /\n\t\tpadding: 0;\n\t\t/ Also rendered on the <a> of ButtonLink, which the UA underlines. /\n\t\ttext-decoration: none;\n\n\t\tborder-radius: 0px;\n\t\tborder: 2px solid transparent;\n\n\t\t&.thin {\n\t\t\tborder-width: 1px;\n\t\t}\n\n\t\ttransition: all;\n\t\ttransition-duration: 0.3s;\n\n\t\tfont-family: var(--lol-font-family-beaufort);\n\t\tcolor: var(--lol-color-gold-300);\n\t\tfont-weight: 700;\n\t\ttext-transform: uppercase;\n\t\tletter-spacing: 0.05em;\n\t\tline-height: 1;\n\t\twhite-space: nowrap;\n\n\t\tdisplay: inline-flex;\n\n\t\tjustify-content: center;\n\t\talign-items: center;\n\n\t\tbackground:\n\t\t\tvar(--lol-button-background-gradient) padding-box,\n\t\t\tvar(--lol-button-border-gradient) border-box;\n\n\t\toutline-style: solid;\n\t\toutline-offset: 2px;\n\n\t\t&:not(:focus-visible) {\n\t\t\toutline: none;\n\t\t}\n\n\t\t&.small {\n\t\t\tfont-size: var(--lol-font-size-sm);\n\t\t\tmin-height: var(--lol-form-height-small);\n\t\t}\n\n\t\t&.medium {\n\t\t\tfont-size: var(--lol-font-size-base);\n\t\t\tmin-height: var(--lol-form-height-medium);\n\t\t}\n\n\t\t&.large {\n\t\t\tfont-size: var(--lol-font-size-base);\n\t\t\tmin-height: var(--lol-form-height-large);\n\t\t}\n\n\t\t/\n\t\t * Nested so the shape wins on specificity: as a bare `.round` it ties with\n\t\t * `.button` and loses the border-radius and font-weight to whichever rule\n\t\t * is written last.\n\t\t /\n\t\t&.round,\n\t\t&.square {\n\t\t\taspect-ratio: 1 / 1;\n\t\t\tpadding: 0px;\n\t\t\tfont-weight: 900;\n\t\t}\n\n\t\t&.round {\n\t\t\tborder-radius: 9999px;\n\t\t}\n\n\t\t&:hover {\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t}\n\n\t\t/ order is important /\n\t\t&:active {\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t}\n\n\t\t&:disabled {\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t\tcursor: default;\n\t\t}\n\n\t\t&[data-selected] {\n\t\t\t--lol-button-background-gradient: var(--lol-gradient-hextech);\n\t\t\tbox-shadow: inset 0 2px 4px 0 var(--lol-color-grey-300);\n\t\t\tcolor: var(--lol-color-blue-100);\n\t\t}\n\t}\n\n\t/\n\t * ToggleButtonGroup. Lives here rather than in its own module because it has\n\t * to reach into the button's border model: adjacent buttons are pulled\n\t * together by exactly one border width so their two gradient borders read as\n\t * a single seam instead of a double-thick one.\n\t /\n\t.toggleButtonGroup {\n\t\tdisplay: inline-flex;\n\n\t\t& > .button + .button {\n\t\t\tmargin-left: -2px;\n\t\t}\n\n\t\t/ Must follow the rule above: thin buttons only need a 1px overlap. /\n\t\t& > .thin + .thin {\n\t\t\tmargin-left: -1px;\n\t\t}\n\n\t\t/ Whichever button is highlighted owns the seams next to it. /\n\t\t& > .button:hover,\n\t\t& > .button:focus-visible,\n\t\t& > .button[data-selected] {\n\t\t\tposition: relative;\n\t\t\tz-index: 1;\n\t\t}\n\n\t\t&[data-orientation=\"vertical\"] {\n\t\t\tflex-direction: column;\n\t\t\t/ Equal widths keep the collapsed seams lined up. /\n\t\t\talign-items: stretch;\n\n\t\t\t& > .button + .button {\n\t\t\t\tmargin-left: 0;\n\t\t\t\tmargin-top: -2px;\n\t\t\t}\n\n\t\t\t& > .thin + .thin {\n\t\t\t\tmargin-top: -1px;\n\t\t\t}\n\t\t}\n\t}\n\n\t.primary,\n\t.secondary,\n\t.hextech,\n\t.dimmed {\n\t\t&:not(.square, .round) {\n\t\t\t&.small {\n\t\t\t\tpadding: 0 0.5rem;\n\t\t\t}\n\n\t\t\t&.medium {\n\t\t\t\tpadding: 0 1rem;\n\t\t\t}\n\n\t\t\t&.large {\n\t\t\t\tpadding: 0 1rem;\n\t\t\t}\n\t\t}\n\t}\n\n\t.text {\n\t\t&.round,\n\t\t&.square {\n\t\t\t&:hover {\n\t\t\t\t--lol-button-background-gradient: var(--lol-gradient-grey-300);\n\t\t\t\t--lol-button-border-gradient: var(--lol-gradient-transparent);\n\t\t\t}\n\t\t}\n\n\t\t&.round,\n\t\t&.square,\n\t\t&.normal {\n\t\t\tposition: relative;\n\n\t\t\t&::after {\n\t\t\t\tposition: absolute;\n\t\t\t\ttop: -0.5rem;\n\t\t\t\tleft: -0.5rem;\n\t\t\t\tbottom: -0.5rem;\n\t\t\t\tright: -0.5rem;\n\t\t\t\tcontent: \"\";\n\t\t\t}\n\t\t}\n\n\t\t&:focus-visible {\n\t\t\toutline-color: var(--lol-color-gold-400);\n\t\t}\n\t}\n\n\t.hextech {\n\t\tcolor: var(--lol-color-blue-100);\n\t\t--lol-button-border-gradient: var(--lol-gradient-hextech);\n\t\t--lol-button-background-gradient: var(--lol-gradient-grey-300);\n\n\t\t&:hover {\n\t\t\tcolor: var(--lol-color-blue-100);\n\t\t\t--lol-button-border-gradient: var(--lol-gradient-hextech-hover);\n\t\t}\n\n\t\t&:active {\n\t\t\tcolor: var(--lol-color-blue-400);\n\t\t\t--lol-button-border-gradient: var(--lol-gradient-hextech-press);\n\t\t}\n\n\t\t&:disabled {\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t\t--lol-button-border-gradient: var(--lol-gradient-disabled);\n\t\t}\n\n\t\t&:focus-visible {\n\t\t\toutline-color: var(--lol-color-blue-400);\n\t\t}\n\t}\n\n\t.dimmed {\n\t\t--lol-button-background-gradient: var(--lol-gradient-hextech-black);\n\t\t--lol-button-border-gradient: var(--lol-gradient-grey-300);\n\n\t\t&:focus-visible {\n\t\t\t--lol-button-border-gradient: var(--lol-gradient-gold);\n\t\t}\n\t}\n\n\t.primary {\n\t\t--lol-button-border-gradient: var(--lol-gradient-gold);\n\t\t--lol-button-background-gradient: linear-gradient(\n\t\t\tto top,\n\t\t\tvar(--lol-color-gold-600),\n\t\t\tvar(--lol-color-gold-600),\n\t\t\tvar(--lol-color-gold-700)\n\t\t);\n\n\t\t&:hover {\n\t\t\t--lol-button-background-gradient: linear-gradient(\n\t\t\t\tto top,\n\t\t\t\tvar(--lol-color-gold-600),\n\t\t\t\tvar(--lol-color-gold-600),\n\t\t\t\tvar(--lol-color-gold-500)\n\t\t\t);\n\t\t}\n\n\t\t&:active {\n\t\t\t--lol-button-background-gradient: linear-gradient(\n\t\t\t\tto top,\n\t\t\t\tvar(--lol-color-gold-600),\n\t\t\t\tvar(--lol-color-gold-700),\n\t\t\t\tvar(--lol-color-gold-700)\n\t\t\t);\n\t\t}\n\t}\n\n\t.secondary {\n\t\t--lol-button-border-gradient: var(--lol-gradient-gold);\n\t\t--lol-button-background-gradient: var(--lol-gradient-grey-300);\n\t}\n\n\t.primary:hover,\n\t.secondary:hover,\n\t.dimmed:hover {\n\t\t--lol-button-border-gradient: var(--lol-gradient-gold-hover);\n\t}\n\n\t.primary:active,\n\t.secondary:active,\n\t.dimmed:active {\n\t\t--lol-button-border-gradient: var(--lol-gradient-gold-press);\n\t}\n\n\t/\n\t * A selected toggle takes the hextech background from `.button`, so the\n\t * dimmed border follows it there: a hextech body inside the resting grey\n\t * frame reads as an unfinished button. Must stay after the gold `:hover`\n\t * and `:active` rules above so the resting selected border wins, and\n\t * before `:disabled` below so a disabled toggle still greys out.\n\t /\n\t.dimmed[data-selected] {\n\t\t--lol-button-border-gradient: var(--lol-gradient-hextech);\n\n\t\t&:hover {\n\t\t\t--lol-button-border-gradient: var(--lol-gradient-hextech-hover);\n\t\t}\n\n\t\t&:active {\n\t\t\t--lol-button-border-gradient: var(--lol-gradient-hextech-press);\n\t\t}\n\t}\n\n\t.primary:disabled,\n\t.secondary:disabled,\n\t.dimmed:disabled {\n\t\t--lol-button-border-gradient: var(--lol-gradient-disabled);\n\t}\n\n\t.primary:focus-visible,\n\t.secondary:focus-visible {\n\t\toutline-color: var(--lol-color-gold-400);\n\t}\n}\n","import { cva } from \"cva\";\nimport type { Ref } from \"react\";\nimport {\n\tButton as AriaButton,\n\ttype ButtonProps as AriaButtonProps,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport classes from \"./button.module.css\";\n\nexport type ButtonShape = \"round\" \| \"square\" \| \"normal\";\nexport type ButtonPreset =\n\t\| \"primary\"\n\t\| \"secondary\"\n\t\| \"text\"\n\t\| \"hextech\"\n\t\| \"dimmed\";\nexport type ButtonSize = \"small\" \| \"medium\" \| \"large\";\n\ninterface ButtonProps extends AriaButtonProps {\n\tpreset?: ButtonPreset;\n\tthin?: boolean;\n\tshape?: ButtonShape;\n\tsize?: ButtonSize;\n}\n\nexport const button = cva({\n\tbase: classes.button,\n\tvariants: {\n\t\tpreset: {\n\t\t\tprimary: classes.primary,\n\t\t\tsecondary: classes.secondary,\n\t\t\ttext: classes.text,\n\t\t\thextech: classes.hextech,\n\t\t\tdimmed: classes.dimmed,\n\t\t},\n\t\tshape: {\n\t\t\tround: classes.round,\n\t\t\tsquare: classes.square,\n\t\t\tnormal: classes.normal,\n\t\t},\n\t\tthin: {\n\t\t\ttrue: classes.thin,\n\t\t},\n\t\tsize: {\n\t\t\tsmall: classes.small,\n\t\t\tmedium: classes.medium,\n\t\t\tlarge: classes.large,\n\t\t},\n\t},\n});\n\nexport function Button({\n\tchildren,\n\tclassName,\n\tpreset = \"secondary\",\n\tshape = \"normal\",\n\tsize = \"medium\",\n\tthin = preset === \"dimmed\",\n\tref,\n\t...props\n}: ButtonProps & { ref?: Ref<HTMLButtonElement> }) {\n\treturn (\n\t\t<AriaButton\n\t\t\tref={ref}\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className, values) =>\n\t\t\t\tbutton({\n\t\t\t\t\tclassName,\n\t\t\t\t\tpreset,\n\t\t\t\t\tshape,\n\t\t\t\t\tthin,\n\t\t\t\t\tsize,\n\t\t\t\t\t...values,\n\t\t\t\t}),\n\t\t\t)}\n\t\t>\n\t\t\t{children}\n\t\t</AriaButton>\n\t);\n}\n","import type { Ref } from \"react\";\nimport {\n\tLink as AriaButton,\n\tcomposeRenderProps,\n\ttype LinkProps,\n} from \"react-aria-components\";\nimport {\n\ttype ButtonPreset,\n\ttype ButtonShape,\n\ttype ButtonSize,\n\tbutton,\n} from \"./button\";\n\ninterface ButtonLinkProps extends LinkProps {\n\tpreset?: ButtonPreset;\n\tthin?: boolean;\n\tshape?: ButtonShape;\n\tsize?: ButtonSize;\n}\n\nexport function ButtonLink({\n\tchildren,\n\tclassName,\n\tpreset = \"secondary\",\n\tshape = \"normal\",\n\tsize = \"medium\",\n\tref,\n\tthin = preset === \"dimmed\",\n\t...props\n}: ButtonLinkProps & { ref?: Ref<HTMLAnchorElement> }) {\n\treturn (\n\t\t<AriaButton\n\t\t\tref={ref}\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className, values) =>\n\t\t\t\tbutton({\n\t\t\t\t\tclassName,\n\t\t\t\t\tpreset,\n\t\t\t\t\tshape,\n\t\t\t\t\tsize,\n\t\t\t\t\tthin,\n\t\t\t\t\t...values,\n\t\t\t\t}),\n\t\t\t)}\n\t\t>\n\t\t\t{children}\n\t\t</AriaButton>\n\t);\n}\n","@layer lol {\n\t.text {\n\t\tfont-family: var(--lol-font-family-spiegel);\n\t}\n\n\t.label {\n\t\tfont-size: var(--lol-font-size-label);\n\t\tline-height: var(--lol-line-height-label);\n\t\tletter-spacing: var(--lol-letter-spacing-label);\n\t\tfont-weight: var(--lol-font-weight-label);\n\t}\n\n\t.stat {\n\t\tfont-size: var(--lol-font-size-stat);\n\t\tline-height: var(--lol-line-height-stat);\n\t\tletter-spacing: var(--lol-letter-spacing-stat);\n\t\tfont-weight: var(--lol-font-weight-stat);\n\t}\n\n\t.largeNumber {\n\t\tfont-size: var(--lol-font-size-large-number);\n\t\tline-height: var(--lol-line-height-large-number);\n\t\tletter-spacing: var(--lol-letter-spacing-large-number);\n\t\tfont-weight: var(--lol-font-weight-large-number);\n\t}\n\n\t.sm {\n\t\tfont-size: var(--lol-font-size-sm);\n\t\tline-height: var(--lol-line-height-sm);\n\t\tletter-spacing: var(--lol-letter-spacing-sm);\n\t\tfont-weight: var(--lol-font-weight-sm);\n\t}\n\n\t.base {\n\t\tfont-size: var(--lol-font-size-base);\n\t\tline-height: var(--lol-line-height-base);\n\t\tletter-spacing: var(--lol-letter-spacing-base);\n\t\tfont-weight: var(--lol-font-weight-base);\n\t}\n\n\t.md {\n\t\tfont-size: var(--lol-font-size-md);\n\t\tline-height: var(--lol-line-height-md);\n\t\tletter-spacing: var(--lol-letter-spacing-md);\n\t\tfont-weight: var(--lol-font-weight-md);\n\t}\n\n\t.lg {\n\t\tfont-size: var(--lol-font-size-lg);\n\t\tline-height: var(--lol-line-height-lg);\n\t\tletter-spacing: var(--lol-letter-spacing-lg);\n\t\tfont-weight: var(--lol-font-weight-lg);\n\t}\n\n\t.grey100 {\n\t\tcolor: var(--lol-color-grey-100);\n\t}\n\n\t.grey150 {\n\t\tcolor: var(--lol-color-grey-150);\n\t}\n\n\t.gold100 {\n\t\tcolor: var(--lol-color-gold-100);\n\t}\n}\n","import { cva } from \"cva\";\nimport type { JSX } from \"react\";\nimport {\n\tLabel as AriaLabel,\n\ttype LabelProps as AriaLabelProps,\n\tText as AriaText,\n\ttype TextProps as AriaTextProps,\n} from \"react-aria-components\";\nimport classes from \"./text.module.css\";\n\nexport type TextColor = \"grey100\" \| \"grey150\" \| \"gold100\";\nexport type TextElement = \"p\" \| \"span\" \| \"div\";\nexport type TextPreset = \"sm\" \| \"base\" \| \"md\" \| \"lg\" \| \"largeNumber\" \| \"stat\";\n\nexport const text = cva({\n\tbase: classes.text,\n\tvariants: {\n\t\tcolor: {\n\t\t\tgrey100: classes.grey100,\n\t\t\tgrey150: classes.grey150,\n\t\t\tgold100: classes.gold100,\n\t\t},\n\t\tpreset: {\n\t\t\tsm: classes.sm,\n\t\t\tbase: classes.base,\n\t\t\tmd: classes.md,\n\t\t\tlg: classes.lg,\n\t\t\tlabel: classes.label,\n\t\t\tlargeNumber: classes.largeNumber,\n\t\t\tstat: classes.stat,\n\t\t},\n\t},\n});\n\ninterface TextProps extends AriaTextProps {\n\tpreset?: TextPreset;\n\tcolor?: TextColor;\n}\nexport function Text({\n\tpreset = \"base\",\n\tcolor = \"grey100\",\n\tclassName,\n\t...rest\n}: TextProps): JSX.Element {\n\treturn <AriaText className={text({ preset, color, className })} {...rest} />;\n}\n\ninterface LabelProps extends AriaLabelProps {\n\tpreset?: TextPreset \| \"label\";\n\tcolor?: TextColor;\n}\nexport function Label({\n\tpreset = \"sm\",\n\tcolor = \"grey100\",\n\tclassName,\n\t...rest\n}: LabelProps): JSX.Element {\n\treturn <AriaLabel className={text({ preset, color, className })} {...rest} />;\n}\n","@layer lol {\n\t.button {\n\t\t/ A <button>; the trigger's whole look is drawn below. /\n\t\tappearance: none;\n\t\tmargin: 0;\n\t\tfont-family: var(--lol-font-family-spiegel);\n\t\tdisplay: inline-block;\n\t\tmin-width: 200px;\n\t\toutline: none;\n\n\t\tborder: 1px solid transparent;\n\n\t\tcolor: var(--lol-color-grey-100);\n\t\tpadding: 0 1.5rem 0 0.5rem;\n\n\t\tfont-size: 0.75rem;\n\t\tfont-weight: 500;\n\t\tline-height: 1rem;\n\t\tletter-spacing: 0.025em;\n\t\ttext-align: left;\n\n\t\t--lol-select-image: url(\"./select-closed.png\");\n\t\t--lol-select-border-gradient: var(--lol-gradient-gold);\n\t\t--lol-select-background-gradient: var(--lol-gradient-hextech-black);\n\n\t\t&[data-open] {\n\t\t\t--lol-select-image: url(\"./select-open.png\");\n\t\t\tcolor: var(--lol-color-gold-600);\n\t\t\t--lol-select-background-gradient: var(--lol-gradient-grey-300);\n\t\t\t--lol-select-border-gradient: var(--lol-gradient-gold-press);\n\t\t}\n\n\t\t&[data-pressed] {\n\t\t\t--lol-select-border-gradient: var(--lol-gradient-gold-press);\n\t\t}\n\n\t\t&[data-hovered] {\n\t\t\t--lol-select-border-gradient: var(--lol-gradient-gold-hover);\n\t\t}\n\n\t\t&[data-disabled] {\n\t\t\t--lol-select-border-gradient: var(--lol-gradient-disabled);\n\t\t\t/ make the image gray /\n\t\t\tfilter: grayscale(100%);\n\t\t}\n\n\t\t&.small {\n\t\t\tmin-height: var(--lol-form-height-small);\n\t\t}\n\n\t\t&.medium {\n\t\t\tmin-height: var(--lol-form-height-medium);\n\t\t}\n\n\t\t&.large {\n\t\t\tmin-height: var(--lol-form-height-large);\n\t\t}\n\t}\n\n\t.singleSelect {\n\t\tbackground:\n\t\t\tvar(--lol-select-image) no-repeat right 0.5rem center,\n\t\t\tvar(--lol-select-background-gradient) padding-box,\n\t\t\tvar(--lol-select-border-gradient) border-box;\n\t}\n\n\t.multiSelect {\n\t\tbackground:\n\t\t\tvar(--lol-select-background-gradient) padding-box,\n\t\t\tvar(--lol-select-border-gradient) border-box;\n\t}\n\n\t.listBox {\n\t\tbackground-color: var(--lol-color-hextech-black);\n\t\tborder: 1px solid var(--lol-color-gold-600);\n\t\toutline: none;\n\t\toverflow-y: auto;\n\t}\n\n\t.item {\n\t\tborder-bottom: 1px solid var(--lol-color-grey-300);\n\t\tcolor: var(--lol-color-gold-300);\n\t\tfont-size: var(--lol-font-size-sm);\n\t\tfont-weight: var(--lol-font-weight-sm);\n\t\tline-height: var(--lol-line-height-sm);\n\t\tletter-spacing: var(--lol-letter-spacing-sm);\n\t\tpadding: 0.375rem 0.5rem;\n\t\toutline: none;\n\t\tcursor: pointer;\n\n\t\t&[data-hovered] {\n\t\t\tbackground-color: var(--lol-color-grey-300);\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t}\n\n\t\t&[data-pressed],\n\t\t&.focus {\n\t\t\tbackground-color: color-mix(\n\t\t\t\tin srgb,\n\t\t\t\tvar(--lol-color-grey-300),\n\t\t\t\ttransparent 50%\n\t\t\t);\n\t\t\tcolor: var(--lol-color-gold-600);\n\t\t}\n\n\t\t&.selected {\n\t\t\tbackground-image: url(./select-dropdown-check.png);\n\t\t\tbackground-position: right 0.5rem center;\n\t\t\tbackground-repeat: no-repeat;\n\t\t}\n\t}\n\n\t.popover {\n\t\twidth: var(--trigger-width);\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t}\n\n\t.emptyList {\n\t\tpadding: 0.5rem 0.25rem;\n\t\ttext-align: left;\n\t}\n}\n","import { cva, cx } from \"cva\";\nimport {\n\tButton as AriaButton,\n\tListBox as AriaListBox,\n\tListBoxItem as AriaListBoxItem,\n\tPopover as AriaPopover,\n\tVirtualizer as AriaVirtualizer,\n\ttype ButtonProps,\n\tcomposeRenderProps,\n\ttype ListBoxItemProps,\n\ttype ListBoxProps,\n\tListLayout,\n\ttype PopoverProps,\n\ttype VirtualizerProps,\n} from \"react-aria-components\";\nimport { text } from \"../typography/text\";\nimport classes from \"./select.module.css\";\n\nexport { Select, SelectValue } from \"react-aria-components\";\n\nexport const select = cva({\n\tbase: classes.button,\n\tvariants: {\n\t\tsize: {\n\t\t\tsmall: classes.small,\n\t\t\tmedium: classes.medium,\n\t\t\tlarge: classes.large,\n\t\t},\n\t\tselectionMode: {\n\t\t\tsingle: classes.singleSelect,\n\t\t\tmultiple: classes.multiSelect,\n\t\t},\n\t},\n});\n\nexport function SelectButton({\n\tclassName,\n\tsize = \"medium\",\n\t...props\n}: ButtonProps & { size?: \"small\" \| \"medium\" \| \"large\" }) {\n\treturn (\n\t\t<AriaButton\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className, buttonValues) =>\n\t\t\t\tselect({ ...buttonValues, size, className, selectionMode: \"single\" }),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport function SelectPopover({ className, ...props }: PopoverProps) {\n\treturn (\n\t\t<AriaPopover\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(className, classes.popover),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport function SelectListBox<T extends object>({\n\tclassName,\n\temptyList = \"No results found\",\n\t...props\n}: ListBoxProps<T> & {\n\temptyList?: React.ReactNode;\n}) {\n\treturn (\n\t\t<AriaListBox<T>\n\t\t\t{...props}\n\t\t\trenderEmptyState={() => (\n\t\t\t\t<div\n\t\t\t\t\tclassName={text({\n\t\t\t\t\t\tcolor: \"grey150\",\n\t\t\t\t\t\tpreset: \"base\",\n\t\t\t\t\t\tclassName: classes.emptyList,\n\t\t\t\t\t})}\n\t\t\t\t>\n\t\t\t\t\t{emptyList}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(className, classes.listBox),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nconst item = cva({\n\tbase: classes.item,\n\tvariants: {\n\t\tisSelected: { true: classes.selected },\n\t\tisFocused: { true: classes.focus },\n\t},\n});\n\nexport function SelectListBoxItem({ className, ...props }: ListBoxItemProps) {\n\treturn (\n\t\t<AriaListBoxItem\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className, values) =>\n\t\t\t\titem({ ...values, className }),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport function SelectVirtualizer<T>(\n\tprops: Omit<VirtualizerProps<T>, \"layout\" \| \"layoutOptions\">,\n) {\n\treturn (\n\t\t<AriaVirtualizer\n\t\t\tlayout={ListLayout}\n\t\t\tlayoutOptions={{\n\t\t\t\tpadding: 0,\n\t\t\t\tgap: 0,\n\t\t\t\trowHeight: 31,\n\t\t\t\theadingHeight: 35,\n\t\t\t}}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n","@layer lol {\n\t.calendar,\n\t.rangeCalendar {\n\t\t--lol-calendar-cell-size: 2.5rem;\n\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\t/\n\t\t * A flex column is still a normal block box for its own sizing: with\n\t\t * no explicit width it fills its parent (a popover, a wide form)\n\t\t * rather than shrinking to its content. `fit-content` makes the\n\t\t * calendar itself only as wide as its widest child (the grid), and\n\t\t * `align-items: stretch` (the default, kept intentionally) then\n\t\t * stretches every other child — including the `header=\"picker\"` nav\n\t\t * row, which sits directly in this container rather than inside\n\t\t * `.month` — to match that same width, instead of each shrinking\n\t\t * independently to its own content.\n\t\t /\n\t\twidth: fit-content;\n\t\tgap: 0.75rem;\n\t\toutline: none;\n\n\t\t&[data-disabled] {\n\t\t\topacity: 0.6;\n\t\t}\n\t}\n\n\t.months {\n\t\tdisplay: flex;\n\t\tgap: 1.5rem;\n\t}\n\n\t.month {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\tgap: 0.5rem;\n\t}\n\n\t.nav {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: space-between;\n\t\tgap: 0.5rem;\n\t}\n\n\t.pickerGroup {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\tgap: 0.375rem;\n\t\tflex: 1;\n\t}\n\n\t.chevronFlipped {\n\t\ttransform: rotate(180deg);\n\t}\n\n\t.heading {\n\t\tflex: 1;\n\t\tmargin: 0;\n\t\ttext-align: center;\n\t\tcolor: var(--lol-color-gold-100);\n\t\tfont-family: var(--lol-font-family-beaufort);\n\t\ttext-transform: uppercase;\n\t\tfont-size: var(--lol-font-size-sm);\n\t\tfont-weight: var(--lol-font-weight-h5);\n\t\tletter-spacing: var(--lol-letter-spacing-h5);\n\t}\n\n\t.grid {\n\t\t/\n\t\t * `separate` (not `collapse`) is what makes the continuous-selection\n\t\t * border below work at all: `collapse` merges each pair of adjacent\n\t\t * cells' touching borders into one, picking a winner between a\n\t\t * selected row's colored edge and its unselected neighbor's\n\t\t * transparent one — which silently erases every other segment of the\n\t\t * \"continuous\" line. `separate` keeps each cell's border independent.\n\t\t \n\t\t The table is sized to exactly 7 cells wide rather than `100%`: with\n\t\t * no intrinsic width, it stretches to fill whatever it's placed in\n\t\t * (a popover, a wide form), dragging the popover along with it and\n\t\t * spacing the 7 columns far enough apart that `.cell`'s fixed size\n\t\t * reads as small islands with visible gaps instead of a tight grid.\n\t\t \n\t\t `border-spacing` is 0 horizontally (columns within a week must\n\t\t * touch, or the continuous selection border above breaks into\n\t\t * islands again) but 3px vertically: with no gap between rows, two\n\t\t * consecutive fully-selected weeks touch top-border-to-bottom-border\n\t\t * and read as one tall block instead of two separate rounded bars.\n\t\t /\n\t\tborder-collapse: separate;\n\t\tborder-spacing: 0 3px;\n\t\ttable-layout: fixed;\n\t\twidth: calc(var(--lol-calendar-cell-size) 7);\n\t}\n\n\t.gridHeader {\n\t\t/* thead: no visual treatment of its own beyond the cells within it. /\n\t}\n\n\t.headerCell {\n\t\tpadding: 0 0 0.5rem 0;\n\t\tfont-family: var(--lol-font-family-spiegel);\n\t\tfont-size: var(--lol-font-size-xs);\n\t\tfont-weight: 700;\n\t\tletter-spacing: 0.05em;\n\t\ttext-transform: uppercase;\n\t\ttext-align: center;\n\t\tcolor: var(--lol-color-grey-100);\n\t}\n\n\t.cell {\n\t\tposition: relative;\n\t\tz-index: 0;\n\t\twidth: 100%;\n\t\theight: var(--lol-calendar-cell-size);\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\n\t\tfont-family: var(--lol-font-family-spiegel);\n\t\tfont-size: var(--lol-font-size-sm);\n\t\tfont-weight: 500;\n\t\tcolor: var(--lol-color-gold-100);\n\n\t\tborder-radius: 9999px;\n\t\toutline: none;\n\t\tcursor: default;\n\t\t-webkit-tap-highlight-color: transparent;\n\n\t\t&[data-outside-month] {\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t}\n\n\t\t&[data-outside-visible-range] {\n\t\t\tvisibility: hidden;\n\t\t}\n\n\t\t&[data-unavailable] {\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t\ttext-decoration: line-through;\n\t\t}\n\n\t\t&[data-disabled] {\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t}\n\n\t\t&[data-hovered]:not([data-disabled], [data-selected]) {\n\t\t\tbackground-color: var(--lol-color-grey-300);\n\t\t}\n\n\t\t&[data-pressed]:not([data-disabled]) {\n\t\t\tbackground-color: var(--lol-color-grey-200);\n\t\t}\n\n\t\t&[data-focus-visible] {\n\t\t\tz-index: 2;\n\t\t\toutline: 2px solid var(--lol-color-gold-400);\n\t\t\toutline-offset: 2px;\n\t\t}\n\n\t\t&[data-invalid] {\n\t\t\tcolor: var(--lol-color-gold-400);\n\t\t}\n\n\t\t&[data-today]:not([data-selected]) {\n\t\t\tcolor: var(--lol-color-gold-400);\n\t\t\tfont-weight: 700;\n\n\t\t\t&::after {\n\t\t\t\tcontent: \"\";\n\t\t\t\tposition: absolute;\n\t\t\t\tbottom: 0.25rem;\n\t\t\t\twidth: 3px;\n\t\t\t\theight: 3px;\n\t\t\t\tborder-radius: 9999px;\n\t\t\t\tbackground-color: var(--lol-color-gold-400);\n\t\t\t}\n\t\t}\n\t}\n\n\t/\n\t * `border-color` can't be a gradient, and `border-image` (which can) turns\n\t * out not to clip to `border-radius` — it paints a sharp rectangular frame\n\t * regardless, which is exactly wrong for a rounded pill. So the ring is\n\t * drawn the other way around: the cell's own `background` is the gold\n\t * gradient, filling its full (possibly rounded) shape, and a `::before`\n\t * sits on top with the hextech fill, inset by the ring's 2px thickness —\n\t * the same `--lol-gradient-hextech` a selected `ToggleButton` fills itself\n\t * with, so a selected date reads as the same \"active\" surface as\n\t * everywhere else in the library. `border-radius: inherit` copies\n\t * whatever radius the cell itself ends up with, so the hextech layer's\n\t * corners always match the gold shape's. Where its inset is 0 on a given\n\t * side, it covers that side's gold completely — which is how a\n\t * RangeCalendar's row-interior cells (below) suppress the ring on their\n\t * left/right and stay open into their neighbors, so the hextech fill\n\t * (identical in every selected cell) reads as one continuous surface\n\t * running the length of the range, across as many rows as it spans.\n\t * `z-index: -1` keeps it behind the day number: an absolutely-positioned\n\t * box otherwise paints above plain in-flow text regardless of source\n\t * order, which would bury the digit under it. No inset `box-shadow` here\n\t * (unlike the selected `ToggleButton` it borrows the fill from): a\n\t * per-cell shadow is a per-cell seam, visible at every date within a\n\t * selected run instead of once around the whole shape.\n\t /\n\t.calendar .cell[data-selected],\n\t.rangeCalendar .cell[data-selected] {\n\t\tposition: relative;\n\t\tbackground: var(--lol-gradient-gold);\n\t\tcolor: var(--lol-color-blue-100);\n\n\t\t&::before {\n\t\t\tcontent: \"\";\n\t\t\tposition: absolute;\n\t\t\tz-index: -1;\n\t\t\ttop: 2px;\n\t\t\tbottom: 2px;\n\t\t\tleft: 0;\n\t\t\tright: 0;\n\t\t\tbackground: var(--lol-gradient-hextech);\n\t\t\tborder-radius: inherit;\n\t\t}\n\t}\n\n\t/\n\t * Single-selection Calendar: exactly one date can be selected, so it's\n\t * always drawn as a standalone rounded pill — there's no row to stay\n\t * continuous with.\n\t /\n\t.calendar .cell[data-selected] {\n\t\tborder-radius: 9999px;\n\n\t\t&::before {\n\t\t\tleft: 2px;\n\t\t\tright: 2px;\n\t\t}\n\t}\n\n\t/\n\t * RangeCalendar: the selection is a run of adjacent cells, and the ring\n\t * needs to read as one continuous gold outline around that whole shape\n\t * rather than a stack of separate pills. By default a selected cell is\n\t * square and open on both sides (the black layer covers left/right\n\t * completely), so the gold shows only along the top/bottom and one cell's\n\t * fill runs straight into the next. Only the actual start/end of the\n\t * range, or a cell sitting at the edge of its own week row (the range\n\t * wraps there), opens up a side and rounds that corner — capping the bar\n\t * at the true ends and at every row break. The two rules below only ever\n\t * touch their own side, so a single-day range (both start and end) still\n\t * gets both sides capped.\n\t \n\t A multi-month display (`visibleDuration: {months: 2+}`) adds a second\n\t * way a row can \"break\": when one calendar week straddles two displayed\n\t * months, each month's own grid still renders all 7 columns for that\n\t * week, padding out with the days that belong to the other grid. Those\n\t * padding days are dimmed (`data-outside-month`) but very much still in\n\t * the DOM and, crucially, never carry `data-selected` themselves — even\n\t * when the date they show is selected in its own home grid — to avoid\n\t * two different interactive elements both claiming to be the selected\n\t * Sept 1st. So `td:last-child`/`td:first-child` land on those always-\n\t * unselected padding cells, not on the last/first cell that's actually\n\t * part of the run, and the real edge (e.g. the 31st, sitting right next\n\t * to a dimmed, unselected \"1\") never matches either selector — left\n\t * square instead of capped. The two extra rules below cap a selected\n\t * cell whenever its neighbor plainly isn't selected, for whatever\n\t * reason: this padding, an unavailable date, or anything else that\n\t * breaks the run — which is the same condition `td:first-child`/\n\t * `td:last-child` are really standing in for at a genuine row edge.\n\t /\n\t.rangeCalendar .cell[data-selected] {\n\t\tborder-radius: 0;\n\t}\n\n\t.rangeCalendar .cell[data-selected][data-selection-start],\n\t.rangeCalendar td:first-child > .cell[data-selected],\n\t.rangeCalendar\n\t\ttd:has(.cell:not([data-selected]))\n\t\t+ td\n\t\t> .cell[data-selected] {\n\t\tborder-top-left-radius: 9999px;\n\t\tborder-bottom-left-radius: 9999px;\n\n\t\t&::before {\n\t\t\tleft: 2px;\n\t\t}\n\t}\n\n\t.rangeCalendar .cell[data-selected][data-selection-end],\n\t.rangeCalendar td:last-child > .cell[data-selected],\n\t.rangeCalendar\n\t\ttd:has(+ td .cell:not([data-selected]))\n\t\t> .cell[data-selected] {\n\t\tborder-top-right-radius: 9999px;\n\t\tborder-bottom-right-radius: 9999px;\n\n\t\t&::before {\n\t\t\tright: 2px;\n\t\t}\n\t}\n}\n","import { cx } from \"cva\";\nimport type {\n\tCalendarCellProps as AriaCalendarCellProps,\n\tCalendarGridHeaderProps as AriaCalendarGridHeaderProps,\n\tCalendarGridProps as AriaCalendarGridProps,\n\tCalendarHeaderCellProps as AriaCalendarHeaderCellProps,\n\tCalendarProps as AriaCalendarProps,\n\tRangeCalendarProps as AriaRangeCalendarProps,\n\tDateValue,\n} from \"react-aria-components\";\nimport {\n\tCalendar as AriaCalendar,\n\tCalendarCell as AriaCalendarCell,\n\tCalendarGrid as AriaCalendarGrid,\n\tCalendarGridBody as AriaCalendarGridBody,\n\tCalendarGridHeader as AriaCalendarGridHeader,\n\tCalendarHeaderCell as AriaCalendarHeaderCell,\n\tRangeCalendar as AriaRangeCalendar,\n\tCalendarHeading,\n\tCalendarMonthPicker,\n\tCalendarYearPicker,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport { Button } from \"../button\";\nimport {\n\tSelect,\n\tSelectButton,\n\tSelectListBox,\n\tSelectListBoxItem,\n\tSelectPopover,\n\tSelectValue,\n} from \"../select/select\";\nimport classes from \"./calendar.module.css\";\n\nfunction CalendarChevron({ flip }: { flip?: boolean }) {\n\treturn (\n\t\t<svg\n\t\t\twidth=\"10\"\n\t\t\theight=\"10\"\n\t\t\tviewBox=\"0 0 10 10\"\n\t\t\tfill=\"none\"\n\t\t\taria-hidden=\"true\"\n\t\t\tclassName={flip ? classes.chevronFlipped : undefined}\n\t\t>\n\t\t\t<path\n\t\t\t\td=\"M7 1L3 5L7 9\"\n\t\t\t\tstroke=\"currentColor\"\n\t\t\t\tstrokeWidth=\"1.5\"\n\t\t\t\tstrokeLinecap=\"round\"\n\t\t\t\tstrokeLinejoin=\"round\"\n\t\t\t/>\n\t\t</svg>\n\t);\n}\n\nfunction CalendarNavButton({ slot }: { slot: \"previous\" \| \"next\" }) {\n\treturn (\n\t\t<Button\n\t\t\tpreset=\"text\"\n\t\t\tshape=\"round\"\n\t\t\tsize=\"small\"\n\t\t\tslot={slot}\n\t\t\taria-label={slot === \"previous\" ? \"Previous\" : \"Next\"}\n\t\t>\n\t\t\t<CalendarChevron flip={slot === \"next\"} />\n\t\t</Button>\n\t);\n}\n\n/\n Lets the user jump straight to a month, via a hextech-styled `Select`\n * fed by the calendar's own `CalendarMonthPicker`/`CalendarYearPicker`\n * render props (`aria-label`, `value`, `onChange`, `items`).\n /\nfunction CalendarMonthYearNav() {\n\treturn (\n\t\t<>\n\t\t\t<CalendarMonthPicker>\n\t\t\t\t{({ \"aria-label\": ariaLabel, value, onChange, items }) => (\n\t\t\t\t\t<Select\n\t\t\t\t\t\taria-label={ariaLabel}\n\t\t\t\t\t\tselectedKey={value}\n\t\t\t\t\t\tonSelectionChange={onChange}\n\t\t\t\t\t>\n\t\t\t\t\t\t<SelectButton size=\"small\" style={{ minWidth: \"6.5rem\" }}>\n\t\t\t\t\t\t\t<SelectValue />\n\t\t\t\t\t\t</SelectButton>\n\t\t\t\t\t\t<SelectPopover>\n\t\t\t\t\t\t\t<SelectListBox items={items}>\n\t\t\t\t\t\t\t\t{(item) => (\n\t\t\t\t\t\t\t\t\t<SelectListBoxItem id={item.id}>\n\t\t\t\t\t\t\t\t\t\t{item.formatted}\n\t\t\t\t\t\t\t\t\t</SelectListBoxItem>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</SelectListBox>\n\t\t\t\t\t\t</SelectPopover>\n\t\t\t\t\t</Select>\n\t\t\t\t)}\n\t\t\t</CalendarMonthPicker>\n\t\t\t<CalendarYearPicker>\n\t\t\t\t{({ \"aria-label\": ariaLabel, value, onChange, items }) => (\n\t\t\t\t\t<Select\n\t\t\t\t\t\taria-label={ariaLabel}\n\t\t\t\t\t\tselectedKey={value}\n\t\t\t\t\t\tonSelectionChange={onChange}\n\t\t\t\t\t>\n\t\t\t\t\t\t<SelectButton size=\"small\" style={{ minWidth: \"5rem\" }}>\n\t\t\t\t\t\t\t<SelectValue />\n\t\t\t\t\t\t</SelectButton>\n\t\t\t\t\t\t<SelectPopover>\n\t\t\t\t\t\t\t<SelectListBox items={items}>\n\t\t\t\t\t\t\t\t{(item) => (\n\t\t\t\t\t\t\t\t\t<SelectListBoxItem id={item.id}>\n\t\t\t\t\t\t\t\t\t\t{item.formatted}\n\t\t\t\t\t\t\t\t\t</SelectListBoxItem>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</SelectListBox>\n\t\t\t\t\t\t</SelectPopover>\n\t\t\t\t\t</Select>\n\t\t\t\t)}\n\t\t\t</CalendarYearPicker>\n\t\t</>\n\t);\n}\n\nexport function CalendarHeaderCell({\n\tclassName,\n\t...props\n}: AriaCalendarHeaderCellProps) {\n\treturn (\n\t\t<AriaCalendarHeaderCell\n\t\t\t{...props}\n\t\t\tclassName={cx(classes.headerCell, className)}\n\t\t/>\n\t);\n}\n\nexport function CalendarGridHeader({\n\tclassName,\n\t...props\n}: AriaCalendarGridHeaderProps) {\n\treturn (\n\t\t<AriaCalendarGridHeader\n\t\t\t{...props}\n\t\t\tclassName={cx(classes.gridHeader, className)}\n\t\t/>\n\t);\n}\n\nexport function CalendarCell({ className, ...props }: AriaCalendarCellProps) {\n\treturn (\n\t\t<AriaCalendarCell\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.cell, className),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport function CalendarGrid({\n\tclassName,\n\tweekdayStyle = \"narrow\",\n\t...props\n}: Omit<AriaCalendarGridProps, \"children\">) {\n\treturn (\n\t\t<AriaCalendarGrid\n\t\t\t{...props}\n\t\t\tweekdayStyle={weekdayStyle}\n\t\t\tclassName={cx(classes.grid, className)}\n\t\t>\n\t\t\t<CalendarGridHeader>\n\t\t\t\t{(day) => <CalendarHeaderCell>{day}</CalendarHeaderCell>}\n\t\t\t</CalendarGridHeader>\n\t\t\t<AriaCalendarGridBody>\n\t\t\t\t{(date) => <CalendarCell date={date} />}\n\t\t\t</AriaCalendarGridBody>\n\t\t</AriaCalendarGrid>\n\t);\n}\n\nexport interface CalendarProps<T extends DateValue>\n\textends AriaCalendarProps<T> {\n\t/\n\t `\"heading\"` shows a static \"Month Year\" heading with prev/next buttons.\n\t * `\"picker\"` replaces it with Select-driven month and year dropdowns that\n\t * jump straight to a month, always shown once regardless of\n\t * `visibleDuration`.\n\t \n\t @default \"heading\"\n\t /\n\theader?: \"heading\" \| \"picker\";\n}\n\nexport function Calendar<T extends DateValue>({\n\theader = \"heading\",\n\tclassName,\n\t...props\n}: CalendarProps<T>) {\n\tconst months = props.visibleDuration?.months ?? 1;\n\n\treturn (\n\t\t<AriaCalendar\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.calendar, className),\n\t\t\t)}\n\t\t>\n\t\t\t{header === \"picker\" && (\n\t\t\t\t<div className={classes.nav}>\n\t\t\t\t\t<CalendarNavButton slot=\"previous\" />\n\t\t\t\t\t<div className={classes.pickerGroup}>\n\t\t\t\t\t\t<CalendarMonthYearNav />\n\t\t\t\t\t</div>\n\t\t\t\t\t<CalendarNavButton slot=\"next\" />\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t<div className={classes.months}>\n\t\t\t\t{Array.from({ length: months }, (_, i) => (\n\t\t\t\t\t<div className={classes.month} key={i}>\n\t\t\t\t\t\t{header === \"heading\" && (\n\t\t\t\t\t\t\t<div className={classes.nav}>\n\t\t\t\t\t\t\t\t{i === 0 && <CalendarNavButton slot=\"previous\" />}\n\t\t\t\t\t\t\t\t<CalendarHeading\n\t\t\t\t\t\t\t\t\toffset={{ months: i }}\n\t\t\t\t\t\t\t\t\tclassName={classes.heading}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t{i === months - 1 && <CalendarNavButton slot=\"next\" />}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<CalendarGrid offset={{ months: i }} />\n\t\t\t\t\t</div>\n\t\t\t\t))}\n\t\t\t</div>\n\t\t</AriaCalendar>\n\t);\n}\n\nexport interface RangeCalendarProps<T extends DateValue>\n\textends AriaRangeCalendarProps<T> {\n\t/\n\t `\"heading\"` shows a static \"Month Year\" heading with prev/next buttons.\n\t * `\"picker\"` replaces it with Select-driven month and year dropdowns that\n\t * jump straight to a month, always shown once regardless of\n\t * `visibleDuration`.\n\t \n\t @default \"heading\"\n\t /\n\theader?: \"heading\" \| \"picker\";\n}\n\nexport function RangeCalendar<T extends DateValue>({\n\theader = \"heading\",\n\tclassName,\n\t...props\n}: RangeCalendarProps<T>) {\n\tconst months = props.visibleDuration?.months ?? 1;\n\n\treturn (\n\t\t<AriaRangeCalendar\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.rangeCalendar, className),\n\t\t\t)}\n\t\t>\n\t\t\t{header === \"picker\" && (\n\t\t\t\t<div className={classes.nav}>\n\t\t\t\t\t<CalendarNavButton slot=\"previous\" />\n\t\t\t\t\t<div className={classes.pickerGroup}>\n\t\t\t\t\t\t<CalendarMonthYearNav />\n\t\t\t\t\t</div>\n\t\t\t\t\t<CalendarNavButton slot=\"next\" />\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t<div className={classes.months}>\n\t\t\t\t{Array.from({ length: months }, (_, i) => (\n\t\t\t\t\t<div className={classes.month} key={i}>\n\t\t\t\t\t\t{header === \"heading\" && (\n\t\t\t\t\t\t\t<div className={classes.nav}>\n\t\t\t\t\t\t\t\t{i === 0 && <CalendarNavButton slot=\"previous\" />}\n\t\t\t\t\t\t\t\t<CalendarHeading\n\t\t\t\t\t\t\t\t\toffset={{ months: i }}\n\t\t\t\t\t\t\t\t\tclassName={classes.heading}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t{i === months - 1 && <CalendarNavButton slot=\"next\" />}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<CalendarGrid offset={{ months: i }} />\n\t\t\t\t\t</div>\n\t\t\t\t))}\n\t\t\t</div>\n\t\t</AriaRangeCalendar>\n\t);\n}\n","@layer lol {\n\t.dateInput {\n\t\tbackground:\n\t\t\tvar(--lol-input-background-gradient) padding-box,\n\t\t\tvar(--lol-input-border-gradient) border-box;\n\n\t\t--lol-input-border-gradient: var(--lol-gradient-gold);\n\t\t--lol-input-background-gradient: var(--lol-gradient-hextech-black);\n\n\t\tborder: 1px solid transparent;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\twidth: 100%;\n\t\tmargin: 0;\n\t\tpadding: 0 0.75rem;\n\t\toutline: none;\n\n\t\tfont-family: var(--lol-font-family-spiegel);\n\n\t\t/ Matches the fill DatePicker/DateRangePicker's own date input takes when\n\t\t disabled, so a standalone DateField/TimeField greys out the same way as\n\t\t the pickers it sits next to in a form. /\n\t\t&[data-disabled] {\n\t\t\t--lol-input-border-gradient: var(--lol-gradient-disabled);\n\t\t\t--lol-input-background-gradient: var(--lol-gradient-grey-300);\n\t\t}\n\n\t\t&[data-focus-within] {\n\t\t\t--lol-input-border-gradient: var(--lol-gradient-gold-hover);\n\t\t\t--lol-input-background-gradient: var(--lol-gradient-grey-focus);\n\t\t}\n\n\t\t&.small {\n\t\t\tmin-height: var(--lol-form-height-small);\n\t\t}\n\n\t\t&.medium {\n\t\t\tmin-height: var(--lol-form-height-medium);\n\t\t}\n\n\t\t&.large {\n\t\t\tmin-height: var(--lol-form-height-large);\n\t\t}\n\t}\n\n\t.segment {\n\t\tpadding: 0 0.125rem;\n\t\tborder-radius: 2px;\n\t\tfont-size: 0.75rem;\n\t\tline-height: 1rem;\n\t\tfont-weight: 500;\n\t\tletter-spacing: 0.025em;\n\t\tcolor: var(--lol-color-gold-100);\n\t\tfont-variant-numeric: tabular-nums;\n\t\toutline: none;\n\t\tcaret-color: transparent;\n\n\t\t/ Literal separators (\"/\", \":\", \",\") sit between segments; they are not\n\t\t editable so they shouldn't pick up hover/focus affordances. /\n\t\t&[data-type=\"literal\"] {\n\t\t\tpadding: 0 0.125rem;\n\t\t\tcolor: var(--lol-color-grey-100);\n\t\t}\n\n\t\t&[data-placeholder] {\n\t\t\tcolor: var(--lol-color-grey-100);\n\t\t}\n\n\t\t&[data-hovered]:not([data-type=\"literal\"]) {\n\t\t\tbackground-color: var(--lol-color-grey-300);\n\t\t}\n\n\t\t&[data-focused]:not([data-type=\"literal\"]) {\n\t\t\tbackground-color: var(--lol-color-gold-600);\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t}\n\n\t\t&[data-disabled] {\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t}\n\n\t\t&[data-readonly] {\n\t\t\tcolor: var(--lol-color-grey-100);\n\t\t}\n\t}\n}\n","import { cva, cx } from \"cva\";\nimport type { ComponentProps } from \"react\";\nimport type {\n\tDateFieldProps as AriaDateFieldProps,\n\tDateInputProps as AriaDateInputProps,\n\tDateSegmentProps as AriaDateSegmentProps,\n\tDateValue,\n} from \"react-aria-components\";\nimport {\n\tDateField as AriaDateField,\n\tDateInput as AriaDateInput,\n\tDateSegment as AriaDateSegment,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport classes from \"./date-field.module.css\";\n\nexport const dateInput = cva({\n\tbase: classes.dateInput,\n\tvariants: {\n\t\tsize: {\n\t\t\tsmall: classes.small,\n\t\t\tmedium: classes.medium,\n\t\t\tlarge: classes.large,\n\t\t},\n\t},\n});\n\nexport function DateSegment({ className, ...props }: AriaDateSegmentProps) {\n\treturn (\n\t\t<AriaDateSegment\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.segment, className),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport function DateInput({\n\tclassName,\n\tsize = \"medium\",\n\tchildren,\n\t...props\n}: Omit<AriaDateInputProps, \"children\"> & {\n\tsize?: \"small\" \| \"medium\" \| \"large\";\n\tchildren?: AriaDateInputProps[\"children\"];\n}) {\n\treturn (\n\t\t<AriaDateInput\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className, values) =>\n\t\t\t\tdateInput({ className, size, ...values }),\n\t\t\t)}\n\t\t>\n\t\t\t{children ?? ((segment) => <DateSegment segment={segment} />)}\n\t\t</AriaDateInput>\n\t);\n}\n\nexport function DateField<T extends DateValue>({\n\tinputProps = {},\n\tchildren,\n\tsize = \"medium\",\n\t...props\n}: AriaDateFieldProps<T> & {\n\tinputProps?: Omit<ComponentProps<typeof DateInput>, \"size\">;\n\tsize?: \"small\" \| \"medium\" \| \"large\";\n}) {\n\treturn (\n\t\t<AriaDateField {...props}>\n\t\t\t{(values) => (\n\t\t\t\t<>\n\t\t\t\t\t{typeof children === \"function\" ? children(values) : children}\n\t\t\t\t\t<DateInput {...inputProps} size={size} />\n\t\t\t\t</>\n\t\t\t)}\n\t\t</AriaDateField>\n\t);\n}\n","@layer lol {\n\t.group {\n\t\tdisplay: flex;\n\t\talign-items: stretch;\n\t\tgap: 1px;\n\t\tpadding: 1px;\n\t\toutline: none;\n\n\t\tbackground-image: var(--lol-gradient-gold);\n\n\t\t&[data-disabled] {\n\t\t\tbackground-image: var(--lol-gradient-disabled);\n\t\t}\n\n\t\t&[data-focus-within] {\n\t\t\tbackground-image: var(--lol-gradient-gold-hover);\n\t\t}\n\n\t\t&.small {\n\t\t\tmin-height: var(--lol-form-height-small);\n\t\t}\n\n\t\t&.medium {\n\t\t\tmin-height: var(--lol-form-height-medium);\n\t\t}\n\n\t\t&.large {\n\t\t\tmin-height: var(--lol-form-height-large);\n\t\t}\n\t}\n\n\t.input {\n\t\tflex: 1;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tmin-width: 0;\n\t\tbackground-color: var(--lol-color-hextech-black);\n\t\tpadding: 0 0.75rem;\n\t\toutline: none;\n\t\tfont-family: var(--lol-font-family-spiegel);\n\n\t\t&[data-disabled] {\n\t\t\tbackground-color: var(--lol-color-grey-300);\n\t\t}\n\t}\n\n\t.separator {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tbackground-color: var(--lol-color-hextech-black);\n\t\tcolor: var(--lol-color-grey-100);\n\t\tpadding: 0 0.125rem;\n\t\tfont-family: var(--lol-font-family-spiegel);\n\t\t/ Match the date segments' line-height so flex-centering the dash\n\t\t against the same line-box height keeps it optically level. /\n\t\tfont-size: 0.75rem;\n\t\tline-height: 1rem;\n\t\t/\n\t\t * `.group`'s `gap` is what shows its gold background between every\n\t\t * pair of children — including the two 1px slivers flanking this\n\t\t * dash, which reads as the dash sitting in its own gold-bordered box\n\t\t * rather than as a plain separator between the two dates. Negative\n\t\t * margin pulls it 1px into each neighboring gap, so its own opaque\n\t\t * fill covers those two slivers instead.\n\t\t /\n\t\tmargin: 0 -1px;\n\n\t\t&[data-disabled] {\n\t\t\tbackground-color: var(--lol-color-grey-300);\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t}\n\t}\n\n\t.button {\n\t\t/ A <button> we never paint: without this it falls back to the UA's\n\t\t `buttonface` slab, which is grey under `color-scheme: dark`. /\n\t\tappearance: none;\n\t\tborder: 0;\n\t\tmargin: 0;\n\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\tpadding: 0 0.625rem;\n\n\t\tcolor: var(--lol-color-gold-300);\n\t\tbackground-color: var(--lol-color-hextech-black);\n\n\t\t&[data-hovered] {\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t}\n\n\t\t&[data-pressed] {\n\t\t\tcolor: var(--lol-color-gold-600);\n\t\t}\n\n\t\t&[data-disabled] {\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t\tbackground-color: var(--lol-color-grey-300);\n\t\t}\n\t}\n\n\t/\n\t * The gold border + hextech-black fill are drawn once, on the popover\n\t * itself, and cover it edge to edge — the header and grid inside stay\n\t * transparent so it reads as one continuous surface rather than a stack\n\t * of separately-filled sections. The visible \"hextech\" gradient lives on\n\t * selected dates themselves (see calendar.module.css), not the popover.\n\t /\n\t.popover {\n\t\tpadding: 0.75rem;\n\t\tborder: 2px solid transparent;\n\t\tbox-shadow: 0 2px 4px 0 var(--lol-color-grey-300);\n\t\tbackground:\n\t\t\tvar(--lol-gradient-hextech-black) padding-box,\n\t\t\tvar(--lol-gradient-gold) border-box;\n\t}\n}\n","import { cva, cx } from \"cva\";\nimport type { ComponentProps } from \"react\";\nimport type {\n\tButtonProps as AriaButtonProps,\n\tDatePickerProps as AriaDatePickerProps,\n\tPopoverProps as AriaPopoverProps,\n\tDateValue,\n} from \"react-aria-components\";\nimport {\n\tButton as AriaButton,\n\tDateInput as AriaDateInput,\n\tDatePicker as AriaDatePicker,\n\tGroup as AriaGroup,\n\tPopover as AriaPopover,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport { Calendar, type CalendarProps } from \"./calendar\";\nimport { DateSegment } from \"./date-field\";\nimport classes from \"./date-picker.module.css\";\n\n/* A small calendar glyph for the trigger button. /\nexport function CalendarIcon() {\n\treturn (\n\t\t<svg\n\t\t\twidth=\"16\"\n\t\t\theight=\"17\"\n\t\t\tviewBox=\"0 0 32 34\"\n\t\t\tfill=\"none\"\n\t\t\taria-hidden=\"true\"\n\t\t>\n\t\t\t<path\n\t\t\t\tfillRule=\"evenodd\"\n\t\t\t\tclipRule=\"evenodd\"\n\t\t\t\td=\"M8.23077 30L2 24.8077V7.61692C2 6.51235 2.89543 5.61692 4 5.61692H4.61692L4.61692 5C4.61692 3.89543 5.51235 3 6.61692 3H7.80923C8.9138 3 9.80923 3.89543 9.80923 5V5.61692H21.0964L21.1212 4.9279C21.16 3.85209 22.0434 3 23.1199 3H24.3831C25.4876 3 26.3831 3.89543 26.3831 5V5.61692H27C28.1046 5.61692 29 6.51236 29 7.61692V9.48H2V11.64H29V30H8.23077ZM17.369 17.8088L15.5001 13.827L13.6311 17.8088L9.45215 18.4472L12.4762 21.5467L11.7623 25.923L15.5001 23.8568L19.238 25.923L18.5242 21.5467L21.5481 18.4472L17.369 17.8088Z\"\n\t\t\t\tfill=\"currentColor\"\n\t\t\t/>\n\t\t</svg>\n\t);\n}\n\nexport const dateGroup = cva({\n\tbase: classes.group,\n\tvariants: {\n\t\tsize: {\n\t\t\tsmall: classes.small,\n\t\t\tmedium: classes.medium,\n\t\t\tlarge: classes.large,\n\t\t},\n\t},\n});\n\n/\n The borderless `DateInput` used inside a `DatePicker`/`DateRangePicker`'s\n * `Group`, which draws the border itself. `DateField`/`TimeField` use the\n * standalone, self-bordered `DateInput` from \"./date-field\" instead.\n /\nexport function PickerDateInput({\n\tclassName,\n\tchildren,\n\t...props\n}: Omit<ComponentProps<typeof AriaDateInput>, \"children\"> & {\n\tchildren?: ComponentProps<typeof AriaDateInput>[\"children\"];\n}) {\n\treturn (\n\t\t<AriaDateInput\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.input, className),\n\t\t\t)}\n\t\t>\n\t\t\t{children ?? ((segment) => <DateSegment segment={segment} />)}\n\t\t</AriaDateInput>\n\t);\n}\n\nexport function DatePickerButton({\n\tclassName,\n\tchildren,\n\t...props\n}: AriaButtonProps) {\n\treturn (\n\t\t<AriaButton {...props} className={cx(classes.button, className)}>\n\t\t\t{children ?? <CalendarIcon />}\n\t\t</AriaButton>\n\t);\n}\n\nexport function DatePickerPopover({ className, ...props }: AriaPopoverProps) {\n\treturn (\n\t\t<AriaPopover\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.popover, className),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport function DatePicker<T extends DateValue>({\n\tchildren,\n\tgroupProps = {},\n\tinputProps = {},\n\tbuttonProps = {},\n\tpopoverProps = {},\n\tcalendarProps = {},\n\tsize = \"medium\",\n\t...props\n}: AriaDatePickerProps<T> & {\n\tgroupProps?: ComponentProps<typeof AriaGroup>;\n\tinputProps?: ComponentProps<typeof PickerDateInput>;\n\tbuttonProps?: AriaButtonProps;\n\tpopoverProps?: AriaPopoverProps;\n\tcalendarProps?: Omit<CalendarProps<T>, \"value\" \| \"defaultValue\" \| \"onChange\">;\n\tsize?: \"small\" \| \"medium\" \| \"large\";\n}) {\n\treturn (\n\t\t<AriaDatePicker {...props}>\n\t\t\t{(values) => (\n\t\t\t\t<>\n\t\t\t\t\t{typeof children === \"function\" ? children(values) : children}\n\t\t\t\t\t<AriaGroup\n\t\t\t\t\t\t{...groupProps}\n\t\t\t\t\t\tclassName={composeRenderProps(\n\t\t\t\t\t\t\tgroupProps.className,\n\t\t\t\t\t\t\t(className, v) => dateGroup({ className, size, ...v }),\n\t\t\t\t\t\t)}\n\t\t\t\t\t>\n\t\t\t\t\t\t<PickerDateInput {...inputProps} />\n\t\t\t\t\t\t<DatePickerButton {...buttonProps} />\n\t\t\t\t\t</AriaGroup>\n\t\t\t\t\t<DatePickerPopover {...popoverProps}>\n\t\t\t\t\t\t<Calendar {...calendarProps} />\n\t\t\t\t\t</DatePickerPopover>\n\t\t\t\t</>\n\t\t\t)}\n\t\t</AriaDatePicker>\n\t);\n}\n","import type { ComponentProps } from \"react\";\nimport type {\n\tButtonProps as AriaButtonProps,\n\tDateRangePickerProps as AriaDateRangePickerProps,\n\tPopoverProps as AriaPopoverProps,\n\tDateValue,\n} from \"react-aria-components\";\nimport {\n\tDateRangePicker as AriaDateRangePicker,\n\tGroup as AriaGroup,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport { RangeCalendar, type RangeCalendarProps } from \"./calendar\";\nimport {\n\tDatePickerButton,\n\tDatePickerPopover,\n\tdateGroup,\n\tPickerDateInput,\n} from \"./date-picker\";\nimport classes from \"./date-picker.module.css\";\n\nexport function DateRangePicker<T extends DateValue>({\n\tchildren,\n\tgroupProps = {},\n\tstartInputProps = {},\n\tendInputProps = {},\n\tbuttonProps = {},\n\tpopoverProps = {},\n\tcalendarProps = {},\n\tsize = \"medium\",\n\t// Picking a range takes two clicks (start, then end); closing after the\n\t// first would make it look like the second one never registered.\n\tshouldCloseOnSelect = false,\n\t...props\n}: AriaDateRangePickerProps<T> & {\n\tgroupProps?: ComponentProps<typeof AriaGroup>;\n\tstartInputProps?: ComponentProps<typeof PickerDateInput>;\n\tendInputProps?: ComponentProps<typeof PickerDateInput>;\n\tbuttonProps?: AriaButtonProps;\n\tpopoverProps?: AriaPopoverProps;\n\tcalendarProps?: Omit<\n\t\tRangeCalendarProps<T>,\n\t\t\"value\" \| \"defaultValue\" \| \"onChange\"\n\t>;\n\tsize?: \"small\" \| \"medium\" \| \"large\";\n}) {\n\treturn (\n\t\t<AriaDateRangePicker {...props} shouldCloseOnSelect={shouldCloseOnSelect}>\n\t\t\t{(values) => (\n\t\t\t\t<>\n\t\t\t\t\t{typeof children === \"function\" ? children(values) : children}\n\t\t\t\t\t<AriaGroup\n\t\t\t\t\t\t{...groupProps}\n\t\t\t\t\t\tclassName={composeRenderProps(\n\t\t\t\t\t\t\tgroupProps.className,\n\t\t\t\t\t\t\t(className, v) => dateGroup({ className, size, ...v }),\n\t\t\t\t\t\t)}\n\t\t\t\t\t>\n\t\t\t\t\t\t<PickerDateInput {...startInputProps} slot=\"start\" />\n\t\t\t\t\t\t<span\n\t\t\t\t\t\t\tclassName={classes.separator}\n\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\tdata-disabled={values.isDisabled \|\| undefined}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t–\n\t\t\t\t\t\t</span>\n\t\t\t\t\t\t<PickerDateInput {...endInputProps} slot=\"end\" />\n\t\t\t\t\t\t<DatePickerButton {...buttonProps} />\n\t\t\t\t\t</AriaGroup>\n\t\t\t\t\t<DatePickerPopover {...popoverProps}>\n\t\t\t\t\t\t<RangeCalendar {...calendarProps} />\n\t\t\t\t\t</DatePickerPopover>\n\t\t\t\t</>\n\t\t\t)}\n\t\t</AriaDateRangePicker>\n\t);\n}\n","import type { ComponentProps } from \"react\";\nimport type {\n\tTimeFieldProps as AriaTimeFieldProps,\n\tTimeValue,\n} from \"react-aria-components\";\nimport { TimeField as AriaTimeField } from \"react-aria-components\";\nimport { DateInput } from \"./date-field\";\n\nexport function TimeField<T extends TimeValue>({\n\tinputProps = {},\n\tchildren,\n\tsize = \"medium\",\n\t...props\n}: AriaTimeFieldProps<T> & {\n\tinputProps?: Omit<ComponentProps<typeof DateInput>, \"size\">;\n\tsize?: \"small\" \| \"medium\" \| \"large\";\n}) {\n\treturn (\n\t\t<AriaTimeField {...props}>\n\t\t\t{(values) => (\n\t\t\t\t<>\n\t\t\t\t\t{typeof children === \"function\" ? children(values) : children}\n\t\t\t\t\t<DateInput {...inputProps} size={size} />\n\t\t\t\t</>\n\t\t\t)}\n\t\t</AriaTimeField>\n\t);\n}\n","@layer lol {\n\t.checkbox {\n\t\tfont-family: var(--lol-font-family-spiegel);\n\t\tcolor: var(--lol-color-grey-100);\n\t\tdisplay: flex;\n\t\tcursor: pointer;\n\t\talign-items: center;\n\t\tgap: 0.25rem;\n\t\tfont-size: 0.75rem;\n\t\tletter-spacing: 0.1em;\n\n\t\t&[data-hovered] {\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t}\n\n\t\t&[data-disabled] {\n\t\t\tfilter: brightness(0.5);\n\t\t\tcursor: default;\n\t\t}\n\t}\n\n\t.icon {\n\t\t/ Off the text baseline, so the box is the glyph. /\n\t\tdisplay: block;\n\t\tflex-shrink: 0;\n\t\twidth: 0.875rem;\n\t\theight: 0.875rem;\n\t}\n}\n","\"data:image/png;base64,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\"","\"data:image/png;base64,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\"","\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAMAAAAolt3jAAAAIGNIUk0AAHomAACAhAAA+gAAAIDoAAB1MAAA6mAAADqYAAAXcJy6UTwAAAA2UExURQEKEwEKE0E5IGhVKGhVKEI5IGlWKGpWKWpXKWtXKWtXKWxYKUM6IG1YKUU8IXhaKMibPP///+VfctgAAAAPdFJOUyZAyNXUx9PS0M/OzcXMvkYA5F8AAAABYktHRBHitT26AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH5wkXDDshfoqKzwAAAzx6VFh0UmF3IHByb2ZpbGUgdHlwZSB4bXAAAEiJxVbLttsgDNzzFf0ELIFkPseJza7ndNnP74xIbhLb9zZtF41PCAE0Gj1x+vn9R/qGzyRzTnrV7rNnm0ztYtWLZBOr5tZs01Vk65fLpYtgvVnhSnWtZdVcVs9FcXa2lsrsi0Owqi9lq8XwC0BVCIlo102yXn3WxWeDoK1UZpNk/rerba7cS9QANsU6eegyNj6OB5MHDNYulCgfEpLrXNaak5Bc91hSk02zrOCT8QBCXRvWJjUtqlqxdsWqaHyl4xfKsAOgFcfABN+MUXWWvHvkZp6AhelSpZRiO9MkxSbNm73gARjM6R4f2RynZAvGDs2TNj7BRDAKxnUoACNXR3zoEZ9hFjRw/5UFKCBUCIRYC081eAgn7vs2JTisOxxLVsOxz7Ggg498Q9n2CBHmmjBdYcoMPnTeFO7ue0iI6IkDMiiIXWl8GtbzIMYKwcrQ01RoHcDTERj5NMMSMILBnOX0HvEb74P4w4Z07peyogT+RMWcXn0DwPXEEPVSqtsIyTl4OkN/BWeFOoKOM71KpEEPJ6NcCT88mpgzQz91FGZKBRD9IJVKul0P1XX0FZwtt8hkmWu0DgogrVXaJypqKeOXCu51x1pj4XH0WmIxKi6qr8qFu5ijiF9gV2PKNDNvAza94gZgiUJugB3lLABeUP0lYOUUtibWmA2q0xnld6HTwI4SWMyizlfCRaAb52i6NZJxQw2Qx8HV9CBr7Urxm9WDjX4q0EBDK6u+Q21jSVHCNaFNod+jT7YC5ugU7DlIERgjEc0PX0S2A4opGA7ZIpPgbEKlcQjp2OKOWNBcAYdAY0CnqehQE2JYogVP0A/WmKEPUSHVsTGbMGrN6DwI4rgdGDANkRn3nnBn8EGgDALpbxnsCaQDA8atjesRQNf/weh+lz6xwhUckQE7b7vLCJHy6XUNSdBwQT51m4VvAPc7IlLyqVR5he9OP6VCes6Ff0mF9JXdewbuyPA6uL7UIrpHerN9PMOxk2IG2ImGl6jGxJC+0wF/0wB7Gv6XfhaV6N9fxvIhl85v9QN8vIE84PevXbolbp28/FVSj0jKeG9LvwCmH1eI6Lix8QAAAD9JREFUCNeNzzkOACAMA8GE+4b/vxYUQMId201nE/ETEfcnXlTa7KzQjJNDemQQusuITMj8weJDynXVhDASL0wdRwfQJZFBnAAAACV0RVh0ZGF0ZTpjcmVhdGUAMjAyMy0wOS0yM1QxMjo1OToxNiswMDowMMk4lEsAAAAldEVYdGRhdGU6bW9kaWZ5ADIwMjMtMDktMjNUMTI6NTk6MTYrMDA6MDC4ZSz3AAAAKHRFWHRkYXRlOnRpbWVzdGFtcAAyMDIzLTA5LTIzVDEyOjU5OjMzKzAwOjAw/20l8gAAAABJRU5ErkJggg==\"","\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAMAAAAolt3jAAAAIGNIUk0AAHomAACAhAAA+gAAAIDoAAB1MAAA6mAAADqYAAAXcJy6UTwAAAB+UExURQEKEwEKE05RUX18dn18dk9SUX59d359d4B/eX9+d4KBen9+eIOCe4B/eYaEfYGAeYeFfoKAeoiGfoKBeoiHf1ZYVoOCe4aEfYeGfoiGf4mHf11eXHhaKHlcKXtdK/Dm0n5gLIBiLoNlMYZoM4lrNYxuOJFzPJl7QqCCSP///0lElLIAAAAcdFJOUyZAyNXUx9PU0tTQ1NDUz9TP1M/Uz8jU0tDQz8FE4StQAAAAAWJLR0QpyreFJAAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAd0SU1FB+cJFww7IX6Kis8AAAM8elRYdFJhdyBwcm9maWxlIHR5cGUgeG1wAABIicVWy7bbIAzc8xX9BCyBZD7Hic2u53TZz++MSG4S2/c2bReNTwgBNBo9cfr5/Uf6hs8kc0561e6zZ5tM7WLVi2QTq+bWbNNVZOuXy6WLYL1Z4Up1rWXVXFbPRXF2tpbK7ItDsKovZavF8AtAVQiJaNdNsl591sVng6CtVGaTZP63q22u3EvUADbFOnnoMjY+jgeTBwzWLpQoHxKS61zWmpOQXPdYUpNNs6zgk/EAQl0b1iY1LapasXbFqmh8peMXyrADoBXHwATfjFF1lrx75GaegIXpUqWUYjvTJMUmzZu94AEYzOkeH9kcp2QLxg7NkzY+wUQwCsZ1KAAjV0d86BGfYRY0cP+VBSggVAiEWAtPNXgIJ+77NiU4rDscS1bDsc+xoIOPfEPZ9ggR5powXWHKDD503hTu7ntIiOiJAzIoiF1pfBrW8yDGCsHK0NNUaB3A0xEY+TTDEjCCwZzl9B7xG++D+MOGdO6XsqIE/kTFnF59A8D1xBD1UqrbCMk5eDpDfwVnhTqCjjO9SqRBDyejXAk/PJqYM0M/dRRmSgUQ/SCVSrpdD9V19BWcLbfIZJlrtA4KIK1V2icqainjlwrudcdaY+Fx9FpiMSouqq/KhbuYo4hfYFdjyjQzbwM2veIGYIlCboAd5SwAXlD9JWDlFLYm1pgNqtMZ5Xeh08COEljMos5XwkWgG+doujWScUMNkMfB1fQga+1K8ZvVg41+KtBAQyurvkNtY0lRwjWhTaHfo0+2AuboFOw5SBEYIxHND19EtgOKKRgO2SKT4GxCpXEI6djijljQXAGHQGNAp6noUBNiWKIFT9AP1pihD1Eh1bExmzBqzeg8COK4HRgwDZEZ955wZ/BBoAwC6W8Z7AmkAwPGrY3rEUDX/8Hofpc+scIVHJEBO2+7ywiR8ul1DUnQcEE+dZuFbwD3OyJS8qlUeYXvTj+lQnrOhX9JhfSV3XsG7sjwOri+1CK6R3qzfTzDsZNiBtiJhpeoxsSQvtMBf9MAexr+l34WlejfX8byIZfOb/UDfLyBPOD3r126JW6dvPxVUo9IynhvS78Aph9XiOi4sfEAAABhSURBVAjXTc9HDoAwEEPRCb33XkPn/ifECEbK372dTSSUiMSgJEiMmm58mSM46fOfNYHSZjoSXFymt4CrzwxWcAuZ0QbuMTPZwSNlZgd45sziBK+yqpu2Q/0F3krvaPXCA/W/D7FK8tWfAAAAJXRFWHRkYXRlOmNyZWF0ZQAyMDIzLTA5LTIzVDEyOjU5OjE2KzAwOjAwyTiUSwAAACV0RVh0ZGF0ZTptb2RpZnkAMjAyMy0wOS0yM1QxMjo1OToxNiswMDowMLhlLPcAAAAodEVYdGRhdGU6dGltZXN0YW1wADIwMjMtMDktMjNUMTI6NTk6MzMrMDA6MDD/bSXyAAAAAElFTkSuQmCC\"","\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAMAAAAolt3jAAAAIGNIUk0AAHomAACAhAAA+gAAAIDoAAB1MAAA6mAAADqYAAAXcJy6UTwAAAByUExURQEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKEwEKE3haKP///2Sxk/UAAAAkdFJOUyZAtbSzmpmYl7KWlZSTsJGQj62OjKqLiomoiIensYavrKmmpcCVLPgAAAABYktHRCXDAckPAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH5wkXDDshfoqKzwAAAzx6VFh0UmF3IHByb2ZpbGUgdHlwZSB4bXAAAEiJxVbLttsgDNzzFf0ELIFkPseJza7ndNnP74xIbhLb9zZtF41PCAE0Gj1x+vn9R/qGzyRzTnrV7rNnm0ztYtWLZBOr5tZs01Vk65fLpYtgvVnhSnWtZdVcVs9FcXa2lsrsi0Owqi9lq8XwC0BVCIlo102yXn3WxWeDoK1UZpNk/rerba7cS9QANsU6eegyNj6OB5MHDNYulCgfEpLrXNaak5Bc91hSk02zrOCT8QBCXRvWJjUtqlqxdsWqaHyl4xfKsAOgFcfABN+MUXWWvHvkZp6AhelSpZRiO9MkxSbNm73gARjM6R4f2RynZAvGDs2TNj7BRDAKxnUoACNXR3zoEZ9hFjRw/5UFKCBUCIRYC081eAgn7vs2JTisOxxLVsOxz7Ggg498Q9n2CBHmmjBdYcoMPnTeFO7ue0iI6IkDMiiIXWl8GtbzIMYKwcrQ01RoHcDTERj5NMMSMILBnOX0HvEb74P4w4Z07peyogT+RMWcXn0DwPXEEPVSqtsIyTl4OkN/BWeFOoKOM71KpEEPJ6NcCT88mpgzQz91FGZKBRD9IJVKul0P1XX0FZwtt8hkmWu0DgogrVXaJypqKeOXCu51x1pj4XH0WmIxKi6qr8qFu5ijiF9gV2PKNDNvAza94gZgiUJugB3lLABeUP0lYOUUtibWmA2q0xnld6HTwI4SWMyizlfCRaAb52i6NZJxQw2Qx8HV9CBr7Urxm9WDjX4q0EBDK6u+Q21jSVHCNaFNod+jT7YC5ugU7DlIERgjEc0PX0S2A4opGA7ZIpPgbEKlcQjp2OKOWNBcAYdAY0CnqehQE2JYogVP0A/WmKEPUSHVsTGbMGrN6DwI4rgdGDANkRn3nnBn8EGgDALpbxnsCaQDA8atjesRQNf/weh+lz6xwhUckQE7b7vLCJHy6XUNSdBwQT51m4VvAPc7IlLyqVR5he9OP6VCes6Ff0mF9JXdewbuyPA6uL7UIrpHerN9PMOxk2IG2ImGl6jGxJC+0wF/0wB7Gv6XfhaV6N9fxvIhl85v9QN8vIE84PevXbolbp28/FVSj0jKeG9LvwCmH1eI6Lix8QAAAG1JREFUCNdtz8sWQCAUheFyq9ShiCJ33v8ZWZ0Ja/ln32xvQugrQuj1ij5MkjTDItO8YIxxzkRkVvBSKgBVIbmEWhujm0hRgm7tU4eUdds7792AVNq6MYRxipzBWB+WJfxSrNs+Hed5ID8jvxduz6sNC/KE5/MAAAAldEVYdGRhdGU6Y3JlYXRlADIwMjMtMDktMjNUMTI6NTk6MTYrMDA6MDDJOJRLAAAAJXRFWHRkYXRlOm1vZGlmeQAyMDIzLTA5LTIzVDEyOjU5OjE2KzAwOjAwuGUs9wAAACh0RVh0ZGF0ZTp0aW1lc3RhbXAAMjAyMy0wOS0yM1QxMjo1OTozMyswMDowMP9tJfIAAAAASUVORK5CYII=\"","\"data:image/png;base64,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\"","import { cx } from \"cva\";\nimport type {\n\tCheckboxButtonProps,\n\tCheckboxFieldProps,\n} from \"react-aria-components\";\nimport {\n\tCheckboxButton as AriaCheckboxButton,\n\tCheckboxField as AriaCheckboxField,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport classes from \"./checkbox.module.css\";\nimport imageChecked from \"./checkbox-checked.png\";\nimport imageCheckedHover from \"./checkbox-checked-hover.png\";\nimport imageIndeterminate from \"./checkbox-indeterminate.png\";\nimport imageIndeterminateHover from \"./checkbox-indeterminate-hover.png\";\nimport imageUnchecked from \"./checkbox-unchecked.png\";\nimport imageUncheckedHover from \"./checkbox-unchecked-hover.png\";\n\nfunction checkboxIcon(values: {\n\tisHovered: boolean;\n\tisIndeterminate: boolean;\n\tisSelected: boolean;\n}) {\n\treturn values.isHovered\n\t\t? values.isIndeterminate\n\t\t\t? imageIndeterminateHover\n\t\t\t: values.isSelected\n\t\t\t\t? imageCheckedHover\n\t\t\t\t: imageUncheckedHover\n\t\t: values.isIndeterminate\n\t\t\t? imageIndeterminate\n\t\t\t: values.isSelected\n\t\t\t\t? imageChecked\n\t\t\t\t: imageUnchecked;\n}\n\nexport function CheckboxButton({\n\tchildren,\n\tclassName,\n\t...props\n}: CheckboxButtonProps) {\n\treturn (\n\t\t<AriaCheckboxButton\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.checkbox, className),\n\t\t\t)}\n\t\t>\n\t\t\t{composeRenderProps(children, (children, values) => (\n\t\t\t\t<>\n\t\t\t\t\t<img\n\t\t\t\t\t\tclassName={classes.icon}\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\talt=\"\"\n\t\t\t\t\t\tsrc={checkboxIcon(values)}\n\t\t\t\t\t/>\n\t\t\t\t\t{children}\n\t\t\t\t</>\n\t\t\t))}\n\t\t</AriaCheckboxButton>\n\t);\n}\n\nexport function CheckboxField({ className, ...props }: CheckboxFieldProps) {\n\treturn <AriaCheckboxField {...props} className={className} />;\n}\n\nexport function Checkbox({\n\tchildren,\n\tclassName,\n\t...props\n}: Omit<CheckboxFieldProps, \"children\" \| \"className\"> &\n\tPick<CheckboxButtonProps, \"children\" \| \"className\">) {\n\treturn (\n\t\t<CheckboxField {...props}>\n\t\t\t<CheckboxButton className={className}>{children}</CheckboxButton>\n\t\t</CheckboxField>\n\t);\n}\n","@layer lol {\n\t.disclosureButton {\n\t\t/ A <button> we never paint: without this it falls back to the UA's\n\t\t `buttonface` slab, which is grey under `color-scheme: dark`. /\n\t\tappearance: none;\n\t\tbackground: none;\n\t\tborder: 0;\n\t\tmargin: 0;\n\t\tfont: inherit;\n\t\tletter-spacing: inherit;\n\n\t\tcolor: var(--lol-color-grey-100);\n\t\tfont-family: var(--lol-font-family-beaufort);\n\n\t\t&:active,\n\t\t&:hover {\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t}\n\n\t\tdisplay: flex;\n\t\twidth: 100%;\n\t\talign-items: center;\n\t\tpadding: 0.5rem 0;\n\t\tfont-weight: bold;\n\t\ttext-transform: uppercase;\n\t\ttext-align: left;\n\t}\n\n\t.icon {\n\t\tmargin-left: 0.125rem;\n\t\tmargin-right: 0.5rem;\n\t\tdisplay: inline-block;\n\t\trotate: 90deg;\n\t\tfont-size: var(--lol-font-size-sm);\n\t}\n\n\t.disclosure {\n\t\tborder-bottom: 1px solid var(--lol-color-gold-600);\n\n\t\t&:last-of-type {\n\t\t\tborder-bottom: none;\n\t\t}\n\t}\n\n\t.disclosurePanel {\n\t\tcolor: var(--lol-color-grey-100);\n\t\tfont-family: var(--lol-font-family-spiegel);\n\n\t\t@media (prefers-reduced-motion: no-preference) {\n\t\t\ttransition-behavior: allow-discrete;\n\t\t\tinterpolate-size: allow-keywords;\n\n\t\t\toverflow-y: clip;\n\n\t\t\ttransition-property: content-visibility, height;\n\t\t\ttransition-timing-function: ease;\n\t\t\ttransition-duration: 150ms;\n\n\t\t\theight: auto;\n\t\t\t&[aria-hidden=\"true\"] {\n\t\t\t\theight: 0;\n\t\t\t}\n\t\t}\n\t}\n}\n","\"use client\";\n\nimport { cx } from \"cva\";\nimport {\n\tDisclosure as AriaDisclosure,\n\tDisclosureGroup as AriaDisclosureGroup,\n\tDisclosurePanel as AriaDisclosurePanel,\n\tButton,\n\ttype ButtonProps,\n\tcomposeRenderProps,\n\ttype DisclosurePanelProps,\n\ttype DisclosureProps,\n} from \"react-aria-components\";\n\nimport classes from \"./disclosure.module.css\";\n\nexport const DisclosureGroup = AriaDisclosureGroup;\n\nexport function DisclosureButton({\n\tchildren,\n\tclassName,\n\t...props\n}: ButtonProps) {\n\treturn (\n\t\t<Button\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.disclosureButton, className),\n\t\t\t)}\n\t\t\tslot=\"trigger\"\n\t\t>\n\t\t\t{composeRenderProps(children, (children) => (\n\t\t\t\t<>\n\t\t\t\t\t<span className={classes.icon}>❯</span>\n\t\t\t\t\t{children}\n\t\t\t\t</>\n\t\t\t))}\n\t\t</Button>\n\t);\n}\n\nexport function Disclosure({ className, ...props }: DisclosureProps) {\n\treturn (\n\t\t<AriaDisclosure\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(className, classes.disclosure),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport function DisclosurePanel({ className, ...props }: DisclosurePanelProps) {\n\treturn (\n\t\t<AriaDisclosurePanel\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(className, classes.disclosurePanel),\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n","@layer lol {\n\t.divider {\n\t\theight: 1px;\n\t\tflex-grow: 1;\n\t\tborder: none;\n\t\t/ An <hr>: the UA gives it 0.5em block margins and a grey `color`. /\n\t\tmargin: 0;\n\t\tcolor: inherit;\n\t\tdisplay: flex;\n\t}\n\n\t.left {\n\t\tbackground-image: linear-gradient(\n\t\t\tto right,\n\t\t\trgba(0, 0, 0, 0),\n\t\t\tvar(--lol-color-gold-600)\n\t\t);\n\t}\n\n\t.center {\n\t\tbackground-image: linear-gradient(\n\t\t\tto right,\n\t\t\trgba(0, 0, 0, 0),\n\t\t\tvar(--lol-color-gold-600),\n\t\t\trgba(0, 0, 0, 0)\n\t\t);\n\t}\n\n\t.right {\n\t\tbackground-image: linear-gradient(\n\t\t\tto right,\n\t\t\tvar(--lol-color-gold-600),\n\t\t\trgba(0, 0, 0, 0)\n\t\t);\n\t}\n\n\t.block {\n\t\twidth: 5px;\n\t\theight: 5px;\n\t\tborder: 1px solid var(--lol-color-gold-600);\n\t\trotate: 45deg;\n\t}\n\n\t.wrapper {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tflex-grow: 1;\n\t}\n\n\t.childrenWrapper {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tgap: 2rem;\n\t\tflex-grow: 1;\n\t}\n}\n","import { cva, cx } from \"cva\";\nimport classes from \"./divider.module.css\";\n\nconst divider = cva({\n\tbase: classes.divider,\n\tvariants: {\n\t\tpreset: {\n\t\t\tleft: classes.left,\n\t\t\tcenter: classes.center,\n\t\t\tright: classes.right,\n\t\t},\n\t},\n});\n\ninterface DividerProps extends React.HTMLAttributes<HTMLDivElement> {\n\tpreset?: \"left\" \| \"center\" \| \"right\";\n\thrProps?: React.HTMLAttributes<HTMLHRElement>;\n\tchildrenWrapperProps?: React.HTMLAttributes<HTMLDivElement>;\n}\nexport function Divider({\n\tpreset = \"center\",\n\thrProps: { className: hrClassName, ...hrProps } = {},\n\tchildrenWrapperProps: {\n\t\tclassName: childrenWrapperClassName,\n\t\t...childrenWrapperProps\n\t} = {},\n\tclassName,\n\tchildren,\n\t...rest\n}: DividerProps) {\n\tif (children) {\n\t\treturn (\n\t\t\t<div\n\t\t\t\t{...childrenWrapperProps}\n\t\t\t\tclassName={cx(classes.childrenWrapper, childrenWrapperClassName)}\n\t\t\t>\n\t\t\t\t{(preset === \"center\" \|\| preset === \"left\") && (\n\t\t\t\t\t<Divider preset=\"left\" />\n\t\t\t\t)}\n\t\t\t\t{children}\n\t\t\t\t{(preset === \"center\" \|\| preset === \"right\") && (\n\t\t\t\t\t<Divider preset=\"right\" />\n\t\t\t\t)}\n\t\t\t</div>\n\t\t);\n\t}\n\treturn (\n\t\t<div className={cx(classes.wrapper, className)} {...rest}>\n\t\t\t{preset === \"right\" && <div className={classes.block} />}\n\t\t\t<hr\n\t\t\t\t{...hrProps}\n\t\t\t\tclassName={divider({ preset, className: hrClassName })}\n\t\t\t/>\n\t\t\t{preset === \"left\" && <div className={classes.block} />}\n\t\t</div>\n\t);\n}\n","@layer lol {\n\t.group {\n\t\tdisplay: flex;\n\t\talign-items: stretch;\n\t\toutline: none;\n\n\t\t/\n\t\t * Unlike NumberField's Group, the pieces here (name + tag, start date +\n\t\t * end date, ...) read as one field, not separately-boxed controls — so\n\t\t * the border and fill are drawn once, on the group itself, instead of\n\t\t * per-child with gaps between them.\n\t\t /\n\t\tbackground:\n\t\t\tvar(--lol-input-background-gradient) padding-box,\n\t\t\tvar(--lol-input-border-gradient) border-box;\n\n\t\t--lol-input-border-gradient: var(--lol-gradient-gold);\n\t\t--lol-input-background-gradient: var(--lol-gradient-hextech-black);\n\n\t\tborder: 1px solid transparent;\n\n\t\t&[data-disabled] {\n\t\t\t--lol-input-border-gradient: var(--lol-gradient-disabled);\n\t\t}\n\n\t\t&[data-focus-within] {\n\t\t\t--lol-input-border-gradient: var(--lol-gradient-gold-hover);\n\t\t}\n\n\t\t&.small {\n\t\t\tmin-height: var(--lol-form-height-small);\n\t\t}\n\n\t\t&.medium {\n\t\t\tmin-height: var(--lol-form-height-medium);\n\t\t}\n\n\t\t&.large {\n\t\t\tmin-height: var(--lol-form-height-large);\n\t\t}\n\t}\n\n\t.input {\n\t\t/ Transparent so the group's own fill shows through with no seam. /\n\t\tborder: 0;\n\t\tmargin: 0;\n\t\tflex: 1;\n\t\tmin-width: 0;\n\t\tbackground-color: transparent;\n\t\tcolor: var(--lol-color-gold-100);\n\t\tfont-family: var(--lol-font-family-spiegel);\n\t\tfont-weight: 500;\n\t\tfont-size: 0.75rem;\n\t\tline-height: 1rem;\n\t\tletter-spacing: 0.025em;\n\t\tpadding: 0 0.75rem;\n\t\toutline: none;\n\n\t\t&[data-disabled] {\n\t\t\tbackground-color: var(--lol-color-grey-300);\n\t\t\tcolor: var(--lol-color-grey-100);\n\t\t}\n\n\t\t&[data-focused] {\n\t\t\tbackground-image: var(--lol-gradient-grey-focus);\n\t\t}\n\t}\n\n\t.separator {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tflex: none;\n\t\tcolor: var(--lol-color-gold-300);\n\t\tfont-family: var(--lol-font-family-spiegel);\n\t\tfont-weight: 700;\n\t\tfont-size: 0.75rem;\n\t\t/ Match `.input`'s line-height so flex-centering both glyphs against\n\t\t the same line-box height keeps them optically level. /\n\t\tline-height: 1rem;\n\t\tpadding: 0 0.5rem;\n\n\t\t&[data-disabled] {\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t}\n\t}\n}\n","import { cva, cx } from \"cva\";\nimport type { ComponentProps } from \"react\";\nimport type { GroupProps as AriaGroupProps } from \"react-aria-components\";\nimport {\n\tGroup as AriaGroup,\n\tInput as AriaInput,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport classes from \"./group.module.css\";\n\nexport const group = cva({\n\tbase: classes.group,\n\tvariants: {\n\t\tsize: {\n\t\t\tsmall: classes.small,\n\t\t\tmedium: classes.medium,\n\t\t\tlarge: classes.large,\n\t\t},\n\t},\n});\n\nexport interface GroupProps extends AriaGroupProps {\n\tsize?: \"small\" \| \"medium\" \| \"large\";\n}\n\n/\n Visually merges several focusable controls (inputs, buttons, static\n * segments) into what reads as a single bordered field, e.g. a summoner name\n * plus its `#`-prefixed tag. `Group` draws the border itself, so children\n * meant to sit inside it should stay borderless — see `GroupInput` and\n * `GroupSeparator`.\n /\nexport function Group({ size = \"medium\", className, ...props }: GroupProps) {\n\treturn (\n\t\t<AriaGroup\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className, values) =>\n\t\t\t\tgroup({ className, size, ...values }),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\n/* A borderless text input for use as a segment inside a `Group`. /\nexport function GroupInput({\n\tclassName,\n\t...props\n}: ComponentProps<typeof AriaInput>) {\n\treturn (\n\t\t<AriaInput\n\t\t\ttype=\"text\"\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.input, className),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\n/* A static, non-interactive segment for use inside a `Group`, e.g. a `#` between a name and its tag. /\nexport function GroupSeparator({\n\tclassName,\n\t...props\n}: ComponentProps<\"span\">) {\n\treturn (\n\t\t<span aria-hidden {...props} className={cx(classes.separator, className)} />\n\t);\n}\n","@layer lol {\n\t.heading {\n\t\t/ Rendered as h1-h5, which the UA gives block margins scaled to the font. /\n\t\tmargin: 0;\n\t\tfont-family: var(--lol-font-family-beaufort);\n\t\tscroll-margin-top: 5rem;\n\t\ttext-transform: uppercase;\n\t}\n\n\t.h1 {\n\t\tfont-size: var(--lol-font-size-h1);\n\t\tline-height: var(--lol-line-height-h1);\n\t\tletter-spacing: var(--lol-letter-spacing-h1);\n\t\tfont-weight: var(--lol-font-weight-h1);\n\t}\n\n\t.h2 {\n\t\tfont-size: var(--lol-font-size-h2);\n\t\tline-height: var(--lol-line-height-h2);\n\t\tletter-spacing: var(--lol-letter-spacing-h2);\n\t\tfont-weight: var(--lol-font-weight-h2);\n\t}\n\n\t.h3 {\n\t\tfont-size: var(--lol-font-size-h3);\n\t\tline-height: var(--lol-line-height-h3);\n\t\tletter-spacing: var(--lol-letter-spacing-h3);\n\t\tfont-weight: var(--lol-font-weight-h3);\n\t}\n\n\t.h4 {\n\t\tfont-size: var(--lol-font-size-h4);\n\t\tline-height: var(--lol-line-height-h4);\n\t\tletter-spacing: var(--lol-letter-spacing-h4);\n\t\tfont-weight: var(--lol-font-weight-h4);\n\t}\n\n\t.h5 {\n\t\tfont-size: var(--lol-font-size-h5);\n\t\tline-height: var(--lol-line-height-h5);\n\t\tletter-spacing: var(--lol-letter-spacing-h5);\n\t\tfont-weight: var(--lol-font-weight-h5);\n\t}\n\n\t.grey100 {\n\t\tcolor: var(--lol-color-grey-100);\n\t}\n\n\t.gold100 {\n\t\tcolor: var(--lol-color-gold-100);\n\t}\n\n\t.gold200 {\n\t\tcolor: var(--lol-color-gold-200);\n\t}\n\n\t.gold400 {\n\t\tcolor: var(--lol-color-gold-400);\n\t}\n}\n","import { cva } from \"cva\";\nimport { createElement, type JSX } from \"react\";\nimport classes from \"./heading.module.css\";\n\nexport type HeadingColor = \"gold100\" \| \"gold200\" \| \"gold400\" \| \"grey100\";\nexport type HeadingElement = \"h1\" \| \"h2\" \| \"h3\" \| \"h4\" \| \"h5\";\n\ninterface HeadingProps\n\textends React.DetailedHTMLProps<\n\t\tReact.HTMLAttributes<HTMLHeadingElement>,\n\t\tHTMLHeadingElement\n\t> {\n\tpreset?: HeadingElement;\n\tcolor?: HeadingColor;\n\tas?: HeadingElement \| \"span\";\n}\n\nexport const heading = cva({\n\tbase: classes.heading,\n\tvariants: {\n\t\tcolor: {\n\t\t\tgold100: classes.gold100,\n\t\t\tgold200: classes.gold200,\n\t\t\tgold400: classes.gold400,\n\t\t\tgrey100: classes.grey100,\n\t\t},\n\t\tpreset: {\n\t\t\th1: classes.h1,\n\t\t\th2: classes.h2,\n\t\t\th3: classes.h3,\n\t\t\th4: classes.h4,\n\t\t\th5: classes.h5,\n\t\t},\n\t},\n});\n\nexport function Heading({\n\tas,\n\tpreset = \"h1\",\n\tcolor = \"gold100\",\n\tclassName,\n\t...rest\n}: HeadingProps): JSX.Element {\n\tconst resultAs = as ?? preset;\n\n\treturn createElement(resultAs, {\n\t\t...rest,\n\t\tclassName: heading({ preset, color, className }),\n\t});\n}\n","@layer lol {\n\t.menu {\n\t\tbox-sizing: border-box;\n\t\toverflow: auto;\n\t\tmin-width: 150px;\n\t\toutline: none;\n\n\t\tbackground:\n\t\t\tvar(--lol-button-background-gradient) padding-box,\n\t\t\tvar(--lol-button-border-gradient) border-box;\n\n\t\t--lol-button-border-gradient: linear-gradient(\n\t\t\tto bottom,\n\t\t\tvar(--lol-color-gold-600),\n\t\t\tvar(--lol-color-gold-600),\n\t\t\tvar(--lol-color-gold-500)\n\t\t);\n\t\t--lol-button-background-gradient: var(--lol-gradient-hextech-black);\n\n\t\tborder: 2px solid transparent;\n\n\t\tfont-family: var(--lol-font-family-spiegel);\n\t}\n\n\t.item {\n\t\tpadding: 0.375rem 0.5rem;\n\t\toutline: none;\n\t\tfont-size: var(--lol-font-size-sm);\n\t\tline-height: var(--lol-line-height-sm);\n\t\tfont-weight: var(--lol-font-weight-sm);\n\t\tletter-spacing: var(--lol-letter-spacing-sm);\n\t\tcolor: var(--lol-color-gold-300);\n\n\t\t&[data-disabled] {\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t}\n\n\t\t&[data-hovered],\n\t\t&[data-focus-visible] {\n\t\t\tbackground: var(--lol-color-grey-300);\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t}\n\n\t\t&[data-pressed] {\n\t\t\tcolor: var(--lol-color-gold-300);\n\t\t}\n\n\t\t&[data-selection-mode] {\n\t\t\tpadding-right: 2rem;\n\t\t}\n\n\t\t&[data-selected] {\n\t\t\tbackground-image: url(../select/select-dropdown-check.png);\n\t\t\tbackground-position: right 0.5rem center;\n\t\t\tbackground-repeat: no-repeat;\n\t\t}\n\t\t&[aria-haspopup] {\n\t\t\tbackground-image: url(./menu-arrow.png);\n\t\t\tbackground-size: 12px;\n\t\t\tbackground-position: right 0.5rem center;\n\t\t\tbackground-repeat: no-repeat;\n\t\t}\n\t}\n\n\t.popover {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t}\n\n\t.section:not(:first-child) {\n\t\tmargin-top: 0.1rem;\n\t}\n\n\t.header {\n\t\tpadding: 0.5rem 0.5rem 0.2rem 0.5rem;\n\t\tfont-size: var(--lol-font-size-sm);\n\t}\n\n\t.separator {\n\t\theight: 1px;\n\t\tbackground: rgb(from var(--lol-color-gold-100) r g b / 0.25);\n\t\tmargin: 0.4rem 0.5rem;\n\t}\n}\n","import { cx } from \"cva\";\nimport type { ComponentProps } from \"react\";\nimport {\n\tHeader as AriaHeader,\n\tMenu as AriaMenu,\n\tMenuItem as AriaMenuItem,\n\tMenuSection as AriaMenuSection,\n\tMenuTrigger as AriaMenuTrigger,\n\tPopover as AriaPopover,\n\tSeparator as AriaSeparator,\n\tSubmenuTrigger as AriaSubmenuTrigger,\n\tVirtualizer as AriaVirtualizer,\n\tcomposeRenderProps,\n\tListLayout,\n\ttype MenuItemProps,\n\ttype MenuProps,\n\ttype MenuSectionProps,\n\ttype PopoverProps,\n\ttype SeparatorProps,\n\ttype VirtualizerProps,\n} from \"react-aria-components\";\nimport { heading } from \"../typography/heading\";\nimport classes from \"./menu.module.css\";\n\nexport type { MenuItemProps, MenuProps } from \"react-aria-components\";\n\n// `trigger` decides what opens the menu: the default `\"press\"`, `\"longPress\"`,\n// or `\"contextMenu\"` for a right click (long press on touch, and the platform's\n// context-menu key or screen reader gesture on a keyboard). A context menu is\n// never the only way to reach an action — the same items belong somewhere a\n// pointer can find them too.\n//\n// Whatever opens it, the trigger child must be a `Button` or wrapped in\n// `Pressable` so that it is announced as interactive.\nexport const MenuTrigger = AriaMenuTrigger;\nexport const SubmenuTrigger = AriaSubmenuTrigger;\n\nexport function Menu<T extends object>({ className, ...props }: MenuProps<T>) {\n\treturn <AriaMenu<T> {...props} className={cx(classes.menu, className)} />;\n}\n\nexport function MenuItem<T extends object>({\n\tclassName,\n\t...props\n}: MenuItemProps<T>) {\n\treturn (\n\t\t<AriaMenuItem<T>\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.item, className),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport function MenuPopover({ className, ...props }: PopoverProps) {\n\treturn (\n\t\t<AriaPopover\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(className, classes.popover),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport function MenuSection<T extends object>({\n\tclassName,\n\t...props\n}: MenuSectionProps<T>) {\n\treturn (\n\t\t<AriaMenuSection<T> {...props} className={cx(className, classes.section)} />\n\t);\n}\n\nexport function MenuHeader({\n\tclassName,\n\t...props\n}: ComponentProps<typeof AriaHeader>) {\n\treturn (\n\t\t<AriaHeader\n\t\t\t{...props}\n\t\t\tclassName={heading({\n\t\t\t\tclassName: cx(className, classes.header),\n\t\t\t\tcolor: \"gold100\",\n\t\t\t\tpreset: \"h5\",\n\t\t\t})}\n\t\t/>\n\t);\n}\n\nexport function MenuSeparator({ className, ...props }: SeparatorProps) {\n\treturn (\n\t\t<AriaSeparator {...props} className={cx(className, classes.separator)} />\n\t);\n}\n\nexport function MenuVirtualizer<T>(\n\tprops: Omit<VirtualizerProps<T>, \"layout\" \| \"layoutOptions\">,\n) {\n\treturn (\n\t\t<AriaVirtualizer\n\t\t\tlayout={ListLayout}\n\t\t\tlayoutOptions={{\n\t\t\t\tpadding: 0,\n\t\t\t\tgap: 0,\n\t\t\t\trowHeight: 30,\n\t\t\t\theadingHeight: 35,\n\t\t\t\t// estimatedRowHeight: 30,\n\t\t\t\t// estimatedHeadingHeight: 35,\n\t\t\t}}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n","@layer lol {\n\t.overlay {\n\t\tbackground-color: color-mix(\n\t\t\tin srgb,\n\t\t\tvar(--lol-color-hextech-black),\n\t\t\ttransparent 75%\n\t\t);\n\t\tposition: fixed;\n\t\ttop: 0;\n\t\tright: 0;\n\t\tbottom: 0;\n\t\tleft: 0;\n\t\tz-index: var(--lol-z-index-overlay);\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\tmin-height: 100%;\n\t\talign-items: center;\n\t\tjustify-content: safe center;\n\t\toverflow-y: auto;\n\t\tpadding: 1rem 0;\n\t\ttext-align: center;\n\t\tbackdrop-filter: blur(8px);\n\t}\n\n\t.dialog {\n\t\tbackground:\n\t\t\tvar(--lol-button-background-gradient) padding-box,\n\t\t\tvar(--lol-button-border-gradient) border-box;\n\t\tborder: 2px solid transparent;\n\n\t\t--lol-button-background-gradient: var(--lol-gradient-hextech-black);\n\t\t--lol-button-border-gradient: linear-gradient(\n\t\t\tto bottom,\n\t\t\tvar(--lol-color-gold-600),\n\t\t\tvar(--lol-color-gold-600),\n\t\t\tvar(--lol-color-gold-500)\n\t\t);\n\n\t\tposition: relative;\n\t\toutline: none;\n\n\t\t&::before,\n\t\t&::after {\n\t\t\tposition: absolute;\n\t\t\tleft: 1.25rem;\n\t\t\tright: 1.25rem;\n\t\t\tcontent: \"\";\n\t\t\tdisplay: block;\n\t\t\theight: 0.25rem;\n\t\t\tbackground-color: var(--lol-color-hextech-black);\n\t\t\tborder-radius: 9999px;\n\t\t}\n\n\t\t&::before {\n\t\t\tbottom: calc(100% + 2px);\n\t\t\tborder: 1px solid var(--lol-color-gold-600);\n\t\t\tborder-bottom: 0;\n\t\t}\n\n\t\t&::after {\n\t\t\ttop: calc(100% + 2px);\n\t\t\tborder: 1px solid var(--lol-color-gold-500);\n\t\t\tborder-top: 0;\n\t\t}\n\t}\n\n\t.modal {\n\t\twidth: 100%;\n\t\tmax-width: 28rem;\n\t}\n\n\t.dialogHeading {\n\t\t/ React aria renders an <h3>, which the UA gives block margins. /\n\t\tmargin: 0;\n\t\tcolor: var(--lol-color-gold-100);\n\t\tfont-family: var(--lol-font-family-beaufort);\n\t\ttext-transform: uppercase;\n\t\tfont-size: var(--lol-font-size-h5);\n\t\tfont-weight: var(--lol-font-weight-h5);\n\t\tletter-spacing: var(--lol-letter-spacing-h5);\n\t\tline-height: var(--lol-line-height-h5);\n\t}\n\n\t.dialogButtons {\n\t\tjustify-content: center;\n\t\ttransform: translateY(2px);\n\t\tpadding: 0 0.25rem;\n\t\tgap: 0.25rem;\n\t\tbackground-color: var(--lol-color-hextech-black);\n\t\tdisplay: inline-flex;\n\t}\n}\n","import { cva } from \"cva\";\nimport {\n\tHeading as AriaHeading,\n\ttype HeadingProps as AriaHeadingProps,\n\tModal as AriaModal,\n\tcomposeRenderProps,\n\tDialog,\n\ttype DialogProps,\n\tModalOverlay,\n\ttype ModalOverlayProps,\n} from \"react-aria-components\";\nimport classes from \"./modal.module.css\";\n\nconst overlay = cva({\n\tbase: classes.overlay,\n});\n\nconst modal = cva({\n\tbase: classes.modal,\n});\n\nconst dialog = cva({\n\tbase: classes.dialog,\n});\n\ninterface ModalProps extends Omit<ModalOverlayProps, \"children\"> {\n\tmodalOverlayClassName?: ModalOverlayProps[\"className\"];\n\tdialogProps?: Omit<DialogProps, \"children\">;\n\tchildren?: DialogProps[\"children\"];\n}\n\nexport function Modal({\n\tmodalOverlayClassName,\n\tdialogProps = {},\n\tchildren,\n\tclassName,\n\t...modalProps\n}: ModalProps) {\n\treturn (\n\t\t<ModalOverlay\n\t\t\t{...modalProps}\n\t\t\tclassName={composeRenderProps(modalOverlayClassName, (className) =>\n\t\t\t\toverlay({\n\t\t\t\t\tclassName,\n\t\t\t\t}),\n\t\t\t)}\n\t\t>\n\t\t\t<AriaModal\n\t\t\t\t{...modalProps}\n\t\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\t\tmodal({\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t}),\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t<Dialog\n\t\t\t\t\t{...dialogProps}\n\t\t\t\t\tclassName={dialog({\n\t\t\t\t\t\tclassName: dialogProps.className,\n\t\t\t\t\t})}\n\t\t\t\t>\n\t\t\t\t\t{children}\n\t\t\t\t</Dialog>\n\t\t\t</AriaModal>\n\t\t</ModalOverlay>\n\t);\n}\n\nconst dialogHeading = cva({\n\tbase: classes.dialogHeading,\n});\n\nexport function DialogHeading({ className, ...props }: AriaHeadingProps) {\n\treturn (\n\t\t<AriaHeading\n\t\t\t{...props}\n\t\t\tclassName={dialogHeading({\n\t\t\t\tclassName,\n\t\t\t})}\n\t\t/>\n\t);\n}\n\nexport function DialogButtons({ children }: { children: React.ReactNode }) {\n\treturn <div className={classes.dialogButtons}>{children}</div>;\n}\n","@layer lol {\n\t.group {\n\t\tdisplay: grid;\n\t\tgrid-template-columns: auto 1fr auto;\n\t\tgap: 1px;\n\t\tpadding: 1px;\n\t\toutline: none;\n\n\t\t&.normal {\n\t\t\tbackground-image: var(--lol-gradient-gold);\n\t\t}\n\n\t\t&.dimmed {\n\t\t\tbackground-image: var(--lol-gradient-grey-300);\n\t\t}\n\n\t\t&[data-disabled] {\n\t\t\tbackground-image: var(--lol-gradient-disabled);\n\t\t}\n\n\t\t&[data-focus-within] {\n\t\t\tbackground-image: var(--lol-gradient-gold-hover);\n\t\t}\n\n\t\t&.small {\n\t\t\tmin-height: var(--lol-form-height-small);\n\t\t}\n\n\t\t&.medium {\n\t\t\tmin-height: var(--lol-form-height-medium);\n\t\t}\n\n\t\t&.large {\n\t\t\tmin-height: var(--lol-form-height-large);\n\t\t}\n\t}\n\n\t.input {\n\t\t/ The group draws the border as its own 1px gradient padding. /\n\t\tborder: 0;\n\t\tmargin: 0;\n\t\tbackground-color: var(--lol-color-hextech-black);\n\t\tcolor: var(--lol-color-gold-100);\n\t\tfont-family: var(--lol-font-family-spiegel);\n\t\tfont-size: 0.75rem;\n\t\tpadding: 0 0.75rem;\n\t\tline-height: 1rem;\n\t\twidth: 100%;\n\t\toutline: none;\n\n\t\t&[data-disabled] {\n\t\t\tbackground-color: var(--lol-color-grey-300);\n\t\t\tcolor: var(--lol-color-grey-100);\n\t\t}\n\n\t\t&.focus {\n\t\t\tbackground-image: var(--lol-gradient-grey-focus);\n\t\t}\n\t}\n\n\t.button {\n\t\t/ A <button> we never paint: without this it falls back to the UA's\n\t\t `buttonface` slab, which is grey under `color-scheme: dark`. /\n\t\tappearance: none;\n\t\tborder: 0;\n\t\tmargin: 0;\n\t\tfont: inherit;\n\t\tletter-spacing: inherit;\n\n\t\tcolor: var(--lol-color-gold-100);\n\t\tbackground-color: var(--lol-color-hextech-black);\n\t\tpadding: 0 0.625rem;\n\n\t\t&[data-disabled] {\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t\tbackground-color: var(--lol-color-grey-300);\n\t\t}\n\t}\n}\n","import { cva } from \"cva\";\nimport type { ComponentProps } from \"react\";\nimport type { NumberFieldProps as AriaNumberFieldProps } from \"react-aria-components\";\nimport {\n\tInput as AriaInput,\n\tNumberField as AriaNumberField,\n\tButton,\n\tcomposeRenderProps,\n\tGroup,\n} from \"react-aria-components\";\nimport classes from \"./number-field.module.css\";\n\ntype NumberFieldPreset = \"normal\" \| \"dimmed\";\n\nconst numberFieldGroup = cva({\n\tbase: classes.group,\n\tvariants: {\n\t\tpreset: {\n\t\t\tnormal: classes.normal,\n\t\t\tdimmed: classes.dimmed,\n\t\t},\n\t\tsize: {\n\t\t\tsmall: classes.small,\n\t\t\tmedium: classes.medium,\n\t\t\tlarge: classes.large,\n\t\t},\n\t},\n});\n\nconst numberFieldInput = cva({\n\tbase: classes.input,\n\tvariants: {\n\t\tisDisabled: {\n\t\t\ttrue: classes.disabled,\n\t\t},\n\t\tisFocused: {\n\t\t\ttrue: classes.focus,\n\t\t},\n\t},\n});\n\nexport function NumberField({\n\tinputProps = {},\n\tgroupProps = {},\n\tchildren,\n\tpreset = \"normal\",\n\tsize = \"medium\",\n\t...props\n}: AriaNumberFieldProps & {\n\tinputProps?: ComponentProps<typeof AriaInput>;\n\tgroupProps?: ComponentProps<typeof Group>;\n\tpreset?: NumberFieldPreset;\n\tsize?: \"small\" \| \"medium\" \| \"large\";\n}) {\n\treturn (\n\t\t<AriaNumberField {...props}>\n\t\t\t{(values) => (\n\t\t\t\t<>\n\t\t\t\t\t{typeof children === \"function\" ? children(values) : children}\n\t\t\t\t\t<Group\n\t\t\t\t\t\t{...groupProps}\n\t\t\t\t\t\tclassName={composeRenderProps(\n\t\t\t\t\t\t\tgroupProps.className,\n\t\t\t\t\t\t\t(className, values) =>\n\t\t\t\t\t\t\t\tnumberFieldGroup({\n\t\t\t\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t\t\t\tpreset,\n\t\t\t\t\t\t\t\t\tsize,\n\t\t\t\t\t\t\t\t\t...values,\n\t\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t)}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Button className={classes.button} slot=\"decrement\">\n\t\t\t\t\t\t\t-\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t<AriaInput\n\t\t\t\t\t\t\t{...inputProps}\n\t\t\t\t\t\t\tclassName={composeRenderProps(\n\t\t\t\t\t\t\t\tinputProps.className,\n\t\t\t\t\t\t\t\t(className, values) =>\n\t\t\t\t\t\t\t\t\tnumberFieldInput({\n\t\t\t\t\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t\t\t\t\t...values,\n\t\t\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<Button className={classes.button} slot=\"increment\">\n\t\t\t\t\t\t\t+\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</Group>\n\t\t\t\t</>\n\t\t\t)}\n\t\t</AriaNumberField>\n\t);\n}\n","@layer lol {\n\t.popover {\n\t\tpadding: 2px;\n\t\tbox-shadow: 0 2px 4px 0 var(--lol-color-grey-300);\n\t\tborder: 2px solid transparent;\n\t\tbackground:\n\t\t\tvar(--lol-button-background-gradient) padding-box,\n\t\t\tvar(--lol-button-border-gradient) border-box;\n\t\t--lol-button-border-gradient: var(--lol-gradient-gold-press);\n\t\t--lol-button-background-gradient: var(--lol-gradient-grey-300);\n\n\t\t&.top {\n\t\t\tmargin-bottom: 0.5rem;\n\t\t}\n\n\t\t&.bottom {\n\t\t\tmargin-top: 0.5rem;\n\t\t}\n\n\t\t&.left {\n\t\t\tmargin-right: 0.5rem;\n\t\t}\n\n\t\t&.right {\n\t\t\tmargin-left: 0.5rem;\n\t\t}\n\t}\n\n\t.body {\n\t\tpadding: 1rem;\n\t}\n\n\t.arrow {\n\t\t/\n\t\t * React aria anchors the arrow's wrapper with `bottom: 100%`, so the\n\t\t * wrapper's box has to be the glyph. Left inline the svg sits on a text\n\t\t * baseline: the wrapper grows to a line-height and the arrow floats off the\n\t\t * popover by the difference.\n\t\t /\n\t\tdisplay: block;\n\n\t\t.outer {\n\t\t\tfill: var(--lol-color-gold-600);\n\t\t}\n\n\t\t.inner {\n\t\t\tfill: var(--lol-color-grey-300);\n\t\t}\n\n\t\t&.top {\n\t\t\ttransform: translateX(-1.5px);\n\t\t}\n\n\t\t&.bottom {\n\t\t\ttransform: translateX(-1.5px) rotate(180deg);\n\n\t\t\t.outer {\n\t\t\t\tfill: var(--lol-color-gold-500);\n\t\t\t}\n\t\t}\n\n\t\t&.left {\n\t\t\ttransform: translateY(-2px) translateX(-5px) rotate(-90deg);\n\t\t}\n\n\t\t&.right {\n\t\t\ttransform: translateY(-2px) translateX(5px) rotate(90deg);\n\t\t}\n\t}\n}\n","import { cva, cx } from \"cva\";\nimport type { PopoverProps } from \"react-aria-components\";\nimport {\n\tPopover as AriaPopover,\n\tcomposeRenderProps,\n\tDialog,\n\tOverlayArrow,\n} from \"react-aria-components\";\nimport classes from \"./popover.module.css\";\n\n// Note: there is no tooltip component. Tooltips do not work on mobile devices.\n// Use a text on the page instead, or use a toggle tip (which is a popover that\n// is used only for informational purposes). For hover-revealed content that a\n// touch user can still reach, wrap this popover in a `PreviewTrigger`: it opens\n// on long press as well as on hover and focus.\n\nconst popover = cva({\n\tbase: classes.popover,\n\tvariants: {\n\t\tplacement: {\n\t\t\tbottom: classes.bottom,\n\t\t\ttop: classes.top,\n\t\t\tleft: classes.left,\n\t\t\tright: classes.right,\n\t\t\tcenter: \"\",\n\t\t},\n\t},\n});\n\nconst arrow = cva({\n\tbase: classes.arrow,\n\tvariants: {\n\t\tplacement: {\n\t\t\ttop: classes.top,\n\t\t\tbottom: classes.bottom,\n\t\t\tleft: classes.left,\n\t\t\tright: classes.right,\n\t\t\tcenter: \"\",\n\t\t},\n\t},\n});\n\nexport function Popover({ children, className, ...props }: PopoverProps) {\n\treturn (\n\t\t<AriaPopover\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className, values) =>\n\t\t\t\tpopover({\n\t\t\t\t\t...values,\n\t\t\t\t\tclassName,\n\t\t\t\t\tplacement: values.placement ?? undefined,\n\t\t\t\t}),\n\t\t\t)}\n\t\t>\n\t\t\t{(values) => (\n\t\t\t\t<>\n\t\t\t\t\t<OverlayArrow>\n\t\t\t\t\t\t{(values) => (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t<svg\n\t\t\t\t\t\t\t\t\tviewBox=\"0 0 12 6\"\n\t\t\t\t\t\t\t\t\tclassName={arrow({\n\t\t\t\t\t\t\t\t\t\t...values,\n\t\t\t\t\t\t\t\t\t\tplacement: values.placement ?? undefined,\n\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t\twidth={20}\n\t\t\t\t\t\t\t\t\theight={10}\n\t\t\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<path d=\"M0 0,L6 6,L12 0\" className={classes.outer} />\n\t\t\t\t\t\t\t\t\t<path d=\"M2 0 6 4 10 0\" className={classes.inner} />\n\t\t\t\t\t\t\t\t</svg>\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</OverlayArrow>\n\t\t\t\t\t<Dialog>\n\t\t\t\t\t\t{typeof children === \"function\" ? children(values) : children}\n\t\t\t\t\t</Dialog>\n\t\t\t\t</>\n\t\t\t)}\n\t\t</AriaPopover>\n\t);\n}\n\n// The popover itself carries no content padding, since text needs breathing\n// room from the popover's edge while other content (a divider, an image)\n// should run edge to edge already. Wrap text content in this instead of\n// reaching for a one-off inline style.\n\nexport function PopoverBody({\n\tclassName,\n\t...props\n}: React.HTMLAttributes<HTMLDivElement>) {\n\treturn <div {...props} className={cx(classes.body, className)} />;\n}\n","@layer lol {\n\t.wrapper {\n\t\tdisplay: flex;\n\t\twidth: 14rem;\n\t\tflex-direction: column;\n\t\tgap: 0.25rem;\n\t\tfont-size: 0.875rem;\n\t}\n\n\t.progressBar {\n\t\tmargin-left: -0.125rem;\n\t\tmargin-right: -0.25rem;\n\t\theight: 0.75rem;\n\t\tborder-radius: 9999px;\n\t\tpadding: 1px;\n\t\tbackground:\n\t\t\tvar(--lol-gradient-grey-300) padding-box,\n\t\t\tvar(--lol-gradient-gold) border-box;\n\t\tborder: 1px solid transparent;\n\t}\n\n\t.fill {\n\t\tbackground-image: linear-gradient(\n\t\t\tto right,\n\t\t\tvar(--lol-color-blue-400),\n\t\t\tvar(--lol-color-blue-200)\n\t\t);\n\t\tborder-radius: 9999px;\n\t\theight: 100%;\n\t}\n\n\t.labelWrapper {\n\t\tdisplay: flex;\n\t\tjustify-content: space-between;\n\t\tfont-weight: 700;\n\t\ttext-transform: uppercase;\n\t\tfont-family: var(--lol-font-family-beaufort);\n\t\tcolor: var(--lol-color-gold-100);\n\t}\n}\n","import { cx } from \"cva\";\nimport type { JSX } from \"react\";\nimport {\n\tProgressBar as AriaProgressBar,\n\ttype ProgressBarProps as AriaProgressBarProps,\n\tLabel,\n} from \"react-aria-components\";\nimport classes from \"./progress-bar.module.css\";\n\ninterface ProgressBarProps extends Omit<AriaProgressBarProps, \"children\"> {\n\tlabel?: string;\n}\n\nexport function ProgressBar({\n\tclassName,\n\tlabel,\n\t...props\n}: ProgressBarProps): JSX.Element {\n\treturn (\n\t\t<AriaProgressBar className={cx(classes.wrapper, className)} {...props}>\n\t\t\t{({ percentage, valueText }) => (\n\t\t\t\t<>\n\t\t\t\t\t<div className={classes.labelWrapper}>\n\t\t\t\t\t\t<Label>{label ?? \"Loading\"}</Label>\n\t\t\t\t\t\t<span>{valueText}</span>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div className={classes.progressBar}>\n\t\t\t\t\t\t<div className={classes.fill} style={{ width: `${percentage}%` }} />\n\t\t\t\t\t</div>\n\t\t\t\t</>\n\t\t\t)}\n\t\t</AriaProgressBar>\n\t);\n}\n","@layer lol {\n\t.radioGroup {\n\t\tdisplay: flex;\n\t\talign-items: flex-start;\n\t\tflex-direction: column;\n\t}\n\n\t.radio {\n\t\tfont-family: var(--lol-font-family-spiegel);\n\t\tbackground-size: 18px;\n\t\tbackground-position: left;\n\t\tbackground-repeat: no-repeat;\n\t\tpadding-top: 0.5rem;\n\t\tpadding-bottom: 0.5rem;\n\t\tpadding-left: 1.5rem;\n\t\tpadding-right: 1rem;\n\t\tfont-size: 0.75rem;\n\t\tline-height: 1rem;\n\t\tfont-weight: 400;\n\t\tbackground-image: url(\"./radio-unchecked.png\");\n\t\tcolor: var(--lol-color-grey-100);\n\n\t\t&[data-selected] {\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t\tbackground-image: url(\"./radio-checked.png\");\n\t\t}\n\n\t\t&[data-disabled] {\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t\tbackground-image: url(\"./radio-unchecked-disabled.png\");\n\n\t\t\t&[data-selected] {\n\t\t\t\tbackground-image: url(\"./radio-checked-disabled.png\");\n\t\t\t}\n\t\t}\n\n\t\t&[data-hovered] {\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t\tbackground-image: url(\"./radio-unchecked-hovered.png\");\n\n\t\t\t&[data-selected] {\n\t\t\t\tbackground-image: url(\"./radio-checked-hovered.png\");\n\t\t\t}\n\t\t}\n\n\t\t&[data-pressed] {\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t\tbackground-image: url(\"./radio-unchecked-pressed.png\");\n\n\t\t\t&[data-selected] {\n\t\t\t\tbackground-image: url(\"./radio-checked-pressed.png\");\n\t\t\t}\n\t\t}\n\t}\n}\n","import { cx } from \"cva\";\nimport type {\n\tRadioGroupProps as AriaRadiogroupProps,\n\tRadioButtonProps,\n\tRadioFieldProps,\n} from \"react-aria-components\";\nimport {\n\tRadioButton as AriaRadioButton,\n\tRadioField as AriaRadioField,\n\tRadioGroup as AriaRadioGroup,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport classes from \"./radio-group.module.css\";\n\nexport function RadioGroup({ className, ...props }: AriaRadiogroupProps) {\n\treturn (\n\t\t<AriaRadioGroup\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.radioGroup, className),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport function RadioButton({ className, ...props }: RadioButtonProps) {\n\treturn (\n\t\t<AriaRadioButton\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.radio, className),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport function RadioField({ className, ...props }: RadioFieldProps) {\n\treturn <AriaRadioField {...props} className={className} />;\n}\n\nexport function Radio({\n\tchildren,\n\tclassName,\n\t...props\n}: Omit<RadioFieldProps, \"children\" \| \"className\"> &\n\tPick<RadioButtonProps, \"children\" \| \"className\">) {\n\treturn (\n\t\t<AriaRadioField {...props}>\n\t\t\t<AriaRadioButton\n\t\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\t\tcx(classes.radio, className),\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</AriaRadioButton>\n\t\t</AriaRadioField>\n\t);\n}\n","@layer lol {\n\t.searchField {\n\t\tdisplay: grid;\n\t\tgrid-template-areas:\n\t\t\t\"label label\"\n\t\t\t\"input button\"\n\t\t\t\"help help\";\n\t\tgrid-template-columns: 1fr auto;\n\t\talign-items: center;\n\n\t\tcolor: var(--lol-color-gold-100);\n\t}\n\n\t.input {\n\t\tbackground:\n\t\t\turl(\"./search.png\") no-repeat 5px center,\n\t\t\tvar(--lol-search-field-background-gradient) padding-box,\n\t\t\tvar(--lol-search-field-border-gradient) border-box;\n\n\t\t--lol-search-field-border-gradient: var(--lol-gradient-gold);\n\t\t--lol-search-field-background-gradient: var(--lol-gradient-hextech-black);\n\n\t\tbackground-size: 16px, auto, auto;\n\t\tborder: 1px solid transparent;\n\t\tgrid-area: input;\n\t\tpadding: 0 2.5rem 0 1.5rem;\n\t\tmargin: 0;\n\t\tfont-size: 0.75rem;\n\t\tline-height: 1rem;\n\t\tcolor: var(--lol-color-gold-100);\n\t\toutline: none;\n\t\tfont-family: var(--lol-font-family-spiegel);\n\t\tfont-weight: 500;\n\t\tletter-spacing: 0.025em;\n\n\t\t&::-webkit-search-cancel-button,\n\t\t&::-webkit-search-decoration {\n\t\t\t-webkit-appearance: none;\n\t\t}\n\n\t\t&[data-disabled] {\n\t\t\t--lol-search-field-border-gradient: var(--lol-gradient-disabled);\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t}\n\n\t\t&[data-focused] {\n\t\t\t--lol-search-field-border-gradient: var(--lol-gradient-gold-hover);\n\t\t\t--lol-search-field-background-gradient: var(--lol-gradient-grey-focus);\n\t\t}\n\n\t\t&.small {\n\t\t\tmin-height: var(--lol-form-height-small);\n\t\t}\n\n\t\t&.medium {\n\t\t\tmin-height: var(--lol-form-height-medium);\n\t\t}\n\n\t\t&.large {\n\t\t\tmin-height: var(--lol-form-height-large);\n\t\t}\n\t}\n\n\t.button {\n\t\t/ A <button> we never paint: without this it falls back to the UA's\n\t\t `buttonface` slab, which is grey under `color-scheme: dark`. /\n\t\tappearance: none;\n\t\tbackground: none;\n\t\tborder: 0;\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t\tfont: inherit;\n\t\tletter-spacing: inherit;\n\n\t\tgrid-area: button;\n\n\t\tfont-size: 0.75rem;\n\t\tline-height: 1rem;\n\t\tfont-weight: 900;\n\n\t\tmargin-left: -2.5rem;\n\t\twidth: 2.5rem;\n\t\talign-self: stretch;\n\t\ttext-align: center;\n\n\t\tcolor: var(--lol-color-gold-300);\n\n\t\t&[data-hovered] {\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t}\n\n\t\t&[data-pressed] {\n\t\t\tcolor: var(--lol-color-gold-600);\n\t\t}\n\n\t\t&[data-empty],\n\t\t&[data-disabled] {\n\t\t\tdisplay: none;\n\t\t}\n\t}\n}\n","import { cva, cx } from \"cva\";\nimport type { ComponentProps } from \"react\";\nimport {\n\tButton as AriaButton,\n\tInput as AriaInput,\n\tSearchField as AriaSearchField,\n\ttype SearchFieldProps as AriaSearchFieldProps,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport classes from \"./search-field.module.css\";\n\nconst searchFieldInput = cva({\n\tbase: classes.input,\n\tvariants: {\n\t\tsize: {\n\t\t\tsmall: classes.small,\n\t\t\tmedium: classes.medium,\n\t\t\tlarge: classes.large,\n\t\t},\n\t},\n});\n\nexport function SearchField({\n\tinputProps = {},\n\tborderProps = {},\n\tchildren,\n\tclassName,\n\tsize = \"medium\",\n\t...props\n}: AriaSearchFieldProps & {\n\tinputProps?: ComponentProps<typeof AriaInput>;\n\tborderProps?: ComponentProps<\"div\">;\n\tsize?: \"small\" \| \"medium\" \| \"large\";\n}) {\n\treturn (\n\t\t<AriaSearchField {...props} className={cx(classes.searchField, className)}>\n\t\t\t{(values) => (\n\t\t\t\t<>\n\t\t\t\t\t{typeof children === \"function\" ? children(values) : children}\n\t\t\t\t\t<AriaInput\n\t\t\t\t\t\t{...inputProps}\n\t\t\t\t\t\tclassName={composeRenderProps(\n\t\t\t\t\t\t\tinputProps.className,\n\t\t\t\t\t\t\t(className, values) =>\n\t\t\t\t\t\t\t\tsearchFieldInput({\n\t\t\t\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t\t\t\tsize,\n\t\t\t\t\t\t\t\t\t...values,\n\t\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t)}\n\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t/>\n\t\t\t\t\t<AriaButton className={classes.button}>✕</AriaButton>\n\t\t\t\t</>\n\t\t\t)}\n\t\t</AriaSearchField>\n\t);\n}\n","@layer lol {\n\t/ Base tag sets up CSS variables; variants (gold/hextech) define actual gradients /\n\t.tag {\n\t\tbackground:\n\t\t\tvar(--lol-multiple-select-background-gradient) padding-box,\n\t\t\tvar(--lol-multiple-select-border-gradient) border-box;\n\n\t\tborder: 2px solid transparent;\n\t\tborder-radius: 9999px;\n\n\t\talign-items: center;\n\t\tdisplay: grid;\n\t\tgrid-template-columns: 1fr auto;\n\n\t\tfont-family: var(--lol-font-family-spiegel);\n\t\tletter-spacing: var(--lol-letter-spacing-sm);\n\t\tfont-weight: var(--lol-font-weight-sm);\n\t\tfont-size: 0.75rem;\n\t\tline-height: 1;\n\t\tcolor: var(--lol-color-gold-300);\n\t\tpadding: 0 0.3rem 0 0.5rem;\n\t}\n\n\t.gold {\n\t\tborder-width: 1px;\n\t\t--lol-multiple-select-border-gradient: var(--lol-gradient-gold);\n\t\t--lol-multiple-select-background-gradient: var(--lol-gradient-grey-300);\n\t\tcolor: var(--lol-color-gold-300);\n\t}\n\n\t.hextech {\n\t\tborder-width: 1px;\n\t\t--lol-multiple-select-border-gradient: var(--lol-gradient-hextech);\n\t\t--lol-multiple-select-background-gradient: var(--lol-gradient-grey-300);\n\t\tcolor: var(--lol-color-blue-100);\n\t}\n\n\t.grey {\n\t\tborder-width: 1px;\n\t\t--lol-multiple-select-border-gradient: var(--lol-color-grey-100);\n\t\t--lol-multiple-select-background-gradient: var(--lol-gradient-grey-300);\n\t\tcolor: var(--lol-color-gold-100);\n\t}\n\n\t.text {\n\t\tpadding: 0.25rem 0;\n\t}\n\n\t.remove {\n\t\t/ A <button> we never paint: without this it falls back to the UA's\n\t\t `buttonface` slab, which is grey under `color-scheme: dark`. The mask is\n\t\t filled with `currentColor`, so the inherited colour matters too. /\n\t\tappearance: none;\n\t\tborder: 0;\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t\tfont: inherit;\n\t\tletter-spacing: inherit;\n\t\tcolor: inherit;\n\n\t\tmask: url(./control-close.png);\n\t\theight: 1rem;\n\t\taspect-ratio: 1;\n\t\tbackground-color: currentColor;\n\t\tmask-size: contain;\n\n\t\t&[data-hovered] {\n\t\t\tbackground-color: var(--lol-color-gold-100);\n\t\t}\n\n\t\t&[data-pressed] {\n\t\t\tbackground-color: var(--lol-color-grey-150);\n\t\t}\n\t}\n\n\t.tagGroup {\n\t\tpadding: 0.25rem;\n\t\tdisplay: flex;\n\t\tjustify-content: flex-start;\n\t}\n\n\t.tagList {\n\t\tdisplay: flex;\n\t\tflex-wrap: wrap;\n\t\tgap: 0.25rem;\n\t\trow-gap: 0.25rem;\n\t}\n}\n","\"use client\";\n\nimport { cva, cx } from \"cva\";\nimport {\n\tButton as AriaButton,\n\tTag as AriaTag,\n\tTagGroup as AriaTagGroup,\n\ttype TagGroupProps as AriaTagGroupProps,\n\tTagList as AriaTagList,\n\ttype TagListProps as AriaTagListProps,\n\ttype TagProps as AriaTagProps,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport classes from \"./tag-group.module.css\";\n\nexport interface TagProps extends AriaTagProps {\n\tvariant?: \"gold\" \| \"hextech\" \| \"grey\";\n}\n\nconst tag = cva({\n\tbase: classes.tag,\n\tvariants: {\n\t\tvariant: {\n\t\t\tgold: classes.gold,\n\t\t\thextech: classes.hextech,\n\t\t\tgrey: classes.grey,\n\t\t},\n\t},\n\tdefaultVariants: { variant: \"gold\" },\n});\n\nexport function Tag({\n\tchildren,\n\tclassName,\n\tvariant = \"gold\",\n\t...props\n}: TagProps) {\n\treturn (\n\t\t<AriaTag\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className, values) =>\n\t\t\t\tcx(tag({ variant, className, ...values })),\n\t\t\t)}\n\t\t>\n\t\t\t{composeRenderProps(children, (children) => (\n\t\t\t\t<>\n\t\t\t\t\t<span className={classes.text}>{children}</span>\n\t\t\t\t\t<AriaButton slot=\"remove\" className={classes.remove} />\n\t\t\t\t</>\n\t\t\t))}\n\t\t</AriaTag>\n\t);\n}\n\nexport const tagGroup = cva({\n\tbase: classes.tagGroup,\n});\n\nexport interface TagGroupProps extends AriaTagGroupProps {}\n\nexport function TagGroup({ children, className, ...props }: TagGroupProps) {\n\treturn (\n\t\t<AriaTagGroup {...props} className={tagGroup({ className })}>\n\t\t\t{children}\n\t\t</AriaTagGroup>\n\t);\n}\n\nexport const tagList = cva({\n\tbase: classes.tagList,\n});\n\nexport interface TagListProps<T extends object = {}>\n\textends AriaTagListProps<T> {\n\tchildren?: React.ReactNode;\n\tclassName?: string;\n\tselectLabel: (item: T) => string;\n\tvariant?: TagProps[\"variant\"];\n}\n\nexport function TagList<T extends object>({\n\tchildren,\n\tclassName,\n\tselectLabel,\n\tvariant = \"hextech\",\n\t...props\n}: TagListProps<T> & {\n\tselectLabel: (item: T) => string;\n\tvariant?: TagProps[\"variant\"];\n}) {\n\treturn (\n\t\t<AriaTagList {...props} className={tagList({ className })}>\n\t\t\t{(item) => <Tag variant={variant}>{selectLabel(item)}</Tag>}\n\t\t</AriaTagList>\n\t);\n}\n","@layer lol {\n\t.popover {\n\t\twidth: 250px;\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t}\n\n\t.triggerContainer {\n\t\tdisplay: inline-flex;\n\t}\n\n\t/ Descendant selector, not just `.select`: needs higher specificity than\n\t `.button`'s `display: inline-block` (select.module.css), since equal-\n\t specificity rules would otherwise resolve by CSS source order — which\n\t depends on unrelated bundling details, not intent. Losing that race\n\t blockifies to `display: block` (this is a flex item) and silently\n\t drops `align-items`, so tags/empty text stick to the top instead of\n\t centering. /\n\t.triggerContainer .select {\n\t\tborder-right: none;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t}\n}\n","\"use client\";\n\nimport { cx } from \"cva\";\nimport React from \"react\";\nimport {\n\tPopover as AriaPopover,\n\tAutocomplete,\n\ttype Key,\n\tSelect,\n\ttype SelectProps,\n\tSelectValue,\n\tuseFilter,\n} from \"react-aria-components\";\nimport { Button } from \"../button\";\nimport { SearchField } from \"../search-field/search-field\";\nimport { TagGroup, TagList } from \"../tag-group/tag-group\";\nimport classes from \"./multiple-select.module.css\";\nimport {\n\tSelectListBox,\n\tSelectListBoxItem,\n\tSelectVirtualizer,\n\tselect,\n} from \"./select\";\n\nexport interface MultipleSelectProps<T extends object = {}>\n\textends Omit<\n\t\tSelectProps<T, \"multiple\">,\n\t\t\"children\" \| \"className\" \| \"validationBehavior\" \| \"selectionMode\"\n\t> {\n\titems: Array<T>;\n\tclassName?: string;\n\tsize?: \"small\" \| \"medium\" \| \"large\";\n\temptyTags?: React.ReactNode;\n\temptyList?: React.ReactNode;\n\ttagGroupLabel?: string;\n\tselectId: (item: T) => Key;\n\tselectLabel: (item: T) => string;\n}\n\nexport function MultipleSelect<T extends object = {}>({\n\titems,\n\tclassName,\n\tsize = \"medium\",\n\temptyList,\n\temptyTags = \"No items selected\",\n\ttagGroupLabel = \"Selected items\",\n\tselectId,\n\tselectLabel,\n\t...selectProps\n}: MultipleSelectProps<T>) {\n\tconst triggerContainerRef = React.useRef<HTMLDivElement \| null>(null);\n\tconst { contains } = useFilter({ sensitivity: \"base\" });\n\n\treturn (\n\t\t<Select<T, \"multiple\"> selectionMode=\"multiple\" {...selectProps}>\n\t\t\t<div ref={triggerContainerRef} className={classes.triggerContainer}>\n\t\t\t\t<SelectValue<T>\n\t\t\t\t\tclassName={select({\n\t\t\t\t\t\tsize,\n\t\t\t\t\t\tselectionMode: \"multiple\",\n\t\t\t\t\t\tclassName: cx(classes.select, className),\n\t\t\t\t\t})}\n\t\t\t\t>\n\t\t\t\t\t{({ selectedItems, state }) => (\n\t\t\t\t\t\t<TagGroup\n\t\t\t\t\t\t\taria-label={tagGroupLabel}\n\t\t\t\t\t\t\tonRemove={(keys) => {\n\t\t\t\t\t\t\t\tif (Array.isArray(state.value)) {\n\t\t\t\t\t\t\t\t\tstate.setValue(state.value.filter((k) => !keys.has(k)));\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<TagList\n\t\t\t\t\t\t\t\tselectLabel={selectLabel}\n\t\t\t\t\t\t\t\titems={selectedItems.filter((item) => item != null)}\n\t\t\t\t\t\t\t\trenderEmptyState={() => emptyTags}\n\t\t\t\t\t\t\t\tvariant=\"hextech\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</TagGroup>\n\t\t\t\t\t)}\n\t\t\t\t</SelectValue>\n\n\t\t\t\t<Button shape=\"square\" thin size={size}>\n\t\t\t\t\t+\n\t\t\t\t</Button>\n\t\t\t</div>\n\n\t\t\t<AriaPopover className={classes.popover} triggerRef={triggerContainerRef}>\n\t\t\t\t<Autocomplete filter={contains}>\n\t\t\t\t\t<SearchField inputProps={{ autoFocus: true }} />\n\t\t\t\t\t<SelectVirtualizer>\n\t\t\t\t\t\t<SelectListBox\n\t\t\t\t\t\t\titems={items}\n\t\t\t\t\t\t\tselectionMode=\"multiple\"\n\t\t\t\t\t\t\temptyList={emptyList}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{(item) => (\n\t\t\t\t\t\t\t\t<SelectListBoxItem key={selectId(item)} id={selectId(item)}>\n\t\t\t\t\t\t\t\t\t{selectLabel(item)}\n\t\t\t\t\t\t\t\t</SelectListBoxItem>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</SelectListBox>\n\t\t\t\t\t</SelectVirtualizer>\n\t\t\t\t</Autocomplete>\n\t\t\t</AriaPopover>\n\t\t</Select>\n\t);\n}\n","@layer lol {\n\t.track {\n\t\tposition: relative;\n\t\theight: 1.75rem;\n\t\twidth: 100%;\n\t}\n\n\t.background {\n\t\tbackground-color: var(--lol-color-grey-300);\n\t\tposition: absolute;\n\t\ttop: 50%;\n\t\ttransform: translateY(-50%);\n\t\theight: 2px;\n\t\twidth: 100%;\n\t\tborder-radius: 9999px;\n\t}\n\n\t.foreground {\n\t\tbackground-image: linear-gradient(\n\t\t\tto right,\n\t\t\tvar(--lol-color-gold-600),\n\t\t\tvar(--lol-color-gold-500)\n\t\t);\n\t\tbackground-size: 100% 2px;\n\t\tbackground-position: center;\n\t\tbackground-repeat: no-repeat;\n\t\tposition: absolute;\n\t\ttop: 50%;\n\t\ttransform: translateY(-50%);\n\t\theight: 100%;\n\t\tborder-radius: 9999px;\n\n\t\t&.disabled {\n\t\t\tbackground-image: linear-gradient(to right, #5c5b57, #5c5b57);\n\t\t}\n\t}\n\n\t.track:hover .foreground:not(.disabled) {\n\t\tbackground-image: linear-gradient(\n\t\t\tto right,\n\t\t\tvar(--lol-color-gold-500),\n\t\t\tvar(--lol-color-gold-400),\n\t\t\tvar(--lol-color-gold-200)\n\t\t);\n\t}\n\n\t.track:active .foreground:not(.disabled) {\n\t\tbackground-image: linear-gradient(\n\t\t\tto right,\n\t\t\tvar(--lol-color-gold-500),\n\t\t\tvar(--lol-color-gold-600),\n\t\t\tvar(--lol-color-gold-600)\n\t\t);\n\t}\n\n\t.thumb {\n\t\tbackground-image: url(./slider-normal.png);\n\t\tposition: absolute;\n\t\ttop: 50%;\n\t\ttransform: translateY(-50%);\n\t\theight: 1.75rem;\n\t\twidth: 1.75rem;\n\t\tbackground-size: cover;\n\t\toutline: none;\n\n\t\t&.disabled {\n\t\t\tbackground-image: url(./slider-disabled.png);\n\t\t}\n\n\t\t&.thumbDragging {\n\t\t\tbackground-image: url(./slider-active.png);\n\t\t}\n\t}\n\n\t.track:hover\n\t\t.thumb:not(.thumbDragging):not(.otherThumbDragging):not(.disabled) {\n\t\tbackground-image: url(./slider-hover.png);\n\t}\n}\n","import { cva, cx } from \"cva\";\nimport type {\n\tSliderProps as AriaSliderProps,\n\tSliderFillRenderProps,\n\tSliderOutputProps,\n\tSliderThumbProps,\n\tSliderTrackProps,\n\tSliderTrackRenderProps,\n} from \"react-aria-components\";\nimport {\n\tSlider as AriaSlider,\n\tSliderFill as AriaSliderFill,\n\tSliderOutput as AriaSliderOutput,\n\tSliderThumb as AriaSliderThumb,\n\tSliderTrack as AriaSliderTrack,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport textClasses from \"../typography/text.module.css\";\nimport classes from \"./slider.module.css\";\n\nconst sliderFill = cva({\n\tbase: classes.foreground,\n\tvariants: {\n\t\tisDisabled: {\n\t\t\ttrue: classes.disabled,\n\t\t},\n\t},\n});\n\nconst sliderThumb = cva({\n\tbase: classes.thumb,\n\tvariants: {\n\t\tisThumbDragging: {\n\t\t\ttrue: classes.thumbDragging,\n\t\t},\n\t\tisOtherThumbDragging: {\n\t\t\ttrue: classes.otherThumbDragging,\n\t\t},\n\t\tisDisabled: {\n\t\t\ttrue: classes.disabled,\n\t\t},\n\t\tisHovered: {\n\t\t\ttrue: classes.hovered,\n\t\t},\n\t},\n});\n\nexport function Slider<T extends number \| number[]>({\n\tchildren,\n\tclassName,\n\tsliderThumbProps = {},\n\tsliderTrackProps = {},\n\tsliderTrackBackgroundClassName,\n\tsliderTrackForegroundClassName,\n\t...props\n}: AriaSliderProps<T> & {\n\tsliderTrackProps?: SliderTrackProps;\n\tsliderThumbProps?: SliderThumbProps;\n\tsliderTrackBackgroundClassName?:\n\t\t\| string\n\t\t\| ((values: SliderTrackRenderProps) => string);\n\tsliderTrackForegroundClassName?:\n\t\t\| string\n\t\t\| ((values: SliderFillRenderProps) => string);\n}) {\n\treturn (\n\t\t<AriaSlider<T> {...props} className={className}>\n\t\t\t{(values) => (\n\t\t\t\t<>\n\t\t\t\t\t{typeof children === \"function\" ? children(values) : children}\n\t\t\t\t\t<AriaSliderTrack\n\t\t\t\t\t\t{...sliderTrackProps}\n\t\t\t\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\t\t\t\tcx(classes.track, className),\n\t\t\t\t\t\t)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{(values) => (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\tclassName={composeRenderProps(\n\t\t\t\t\t\t\t\t\t\tsliderTrackBackgroundClassName,\n\t\t\t\t\t\t\t\t\t\t(className) => cx(className, classes.background),\n\t\t\t\t\t\t\t\t\t)(values)}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t<AriaSliderFill\n\t\t\t\t\t\t\t\t\tclassName={composeRenderProps(\n\t\t\t\t\t\t\t\t\t\tsliderTrackForegroundClassName,\n\t\t\t\t\t\t\t\t\t\t(className, fillValues) =>\n\t\t\t\t\t\t\t\t\t\t\tsliderFill({\n\t\t\t\t\t\t\t\t\t\t\t\tisDisabled: fillValues.isDisabled,\n\t\t\t\t\t\t\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t{values.state.values.map((_, i) => {\n\t\t\t\t\t\t\t\t\tconst zIndex =\n\t\t\t\t\t\t\t\t\t\tvalues.state.getThumbPercent(i === 1 ? 0 : 1) ===\n\t\t\t\t\t\t\t\t\t\t(i === 1 ? 0 : 1)\n\t\t\t\t\t\t\t\t\t\t\t? 2\n\t\t\t\t\t\t\t\t\t\t\t: undefined;\n\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t<AriaSliderThumb\n\t\t\t\t\t\t\t\t\t\t\tkey={i}\n\t\t\t\t\t\t\t\t\t\t\tindex={i}\n\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\tzIndex,\n\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t{...sliderThumbProps}\n\t\t\t\t\t\t\t\t\t\t\tclassName={composeRenderProps(\n\t\t\t\t\t\t\t\t\t\t\t\tsliderThumbProps.className,\n\t\t\t\t\t\t\t\t\t\t\t\t(className, sliderThumbRenderProps) =>\n\t\t\t\t\t\t\t\t\t\t\t\t\tsliderThumb({\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tisDisabled: sliderThumbRenderProps.isDisabled,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tisThumbDragging:\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsliderThumbRenderProps.state.isThumbDragging(i),\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tisOtherThumbDragging:\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsliderThumbRenderProps.state.isThumbDragging(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ti === 1 ? 0 : 1,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</AriaSliderTrack>\n\t\t\t\t</>\n\t\t\t)}\n\t\t</AriaSlider>\n\t);\n}\n\nexport function SliderOutput({\n\tchildren,\n\tclassName,\n\t...props\n}: SliderOutputProps) {\n\treturn (\n\t\t<AriaSliderOutput\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(textClasses.text, textClasses.sm, textClasses.grey100, className),\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{(sliderRenderProps) =>\n\t\t\t\tsliderRenderProps.state.values\n\t\t\t\t\t.map((_, i) => sliderRenderProps.state.getThumbValueLabel(i))\n\t\t\t\t\t.join(\" – \")\n\t\t\t}\n\t\t</AriaSliderOutput>\n\t);\n}\n","@layer lol {\n\t.spinner {\n\t\t/ Off the text baseline, so the box is the glyph. /\n\t\tdisplay: block;\n\t\tmax-width: 100%;\n\t\taspect-ratio: 1 / 1;\n\t\twidth: 3rem;\n\t\tanimation: spin 1s linear infinite;\n\t}\n\n\t@keyframes spin {\n\t\tfrom {\n\t\t\ttransform: rotate(0deg);\n\t\t}\n\n\t\tto {\n\t\t\ttransform: rotate(360deg);\n\t\t}\n\t}\n}\n","\"data:image/png;base64,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\"","import { cx } from \"cva\";\nimport classes from \"./spinner.module.css\";\nimport spinnerImage from \"./spinner-spinner.png\";\n\ninterface SpinnerProps {\n\tclassName?: string;\n}\nexport function Spinner({ className }: SpinnerProps) {\n\treturn (\n\t\t<img\n\t\t\trole=\"status\"\n\t\t\taria-live=\"polite\"\n\t\t\taria-label=\"loading\"\n\t\t\tsrc={spinnerImage}\n\t\t\tclassName={cx(classes.spinner, className)}\n\t\t/>\n\t);\n}\n","@layer lol {\n\t.toast {\n\t\tpadding: 1rem;\n\t\tborder: 2px solid transparent;\n\t\tbackground:\n\t\t\tvar(--lol-toast-background-gradient) padding-box,\n\t\t\tvar(--lol-toast-border-gradient) border-box;\n\n\t\twidth: var(--width);\n\t\tfont-size: 13px;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tgap: 6px;\n\t}\n\n\t.default {\n\t\t--lol-toast-background-gradient: var(--lol-gradient-hextech-black);\n\t\t--lol-toast-border-gradient: var(--lol-gradient-grey-300);\n\t\t--lol-toast-icon-color: var(--lol-color-gold-300);\n\t}\n\n\t.title {\n\t\tfont-size: var(--lol-font-size-sm);\n\t}\n\n\t.content {\n\t\tdisplay: flex;\n\t\talign-items: flex-start;\n\t\tgap: 0.75rem;\n\t}\n\n\t.icon {\n\t\tdisplay: flex;\n\t\theight: 20px;\n\t\twidth: 20px;\n\t\tposition: relative;\n\t\tjustify-content: flex-start;\n\t\talign-items: center;\n\t\tflex-shrink: 0;\n\t\tmargin-left: var(--toast-icon-margin-start);\n\t\tmargin-right: var(--toast-icon-margin-end);\n\t\t& > {\n\t\t\tflex-shrink: 0;\n\t\t}\n\t\t/* Off the text baseline, so the box is the glyph. /\n\t\t& > img {\n\t\t\tdisplay: block;\n\t\t\tmax-width: 100%;\n\t\t}\n\t\t& svg {\n\t\t\tmargin-left: var(--toast-svg-margin-start);\n\t\t\tmargin-right: var(--toast-svg-margin-end);\n\t\t}\n\t}\n\n\t.content {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\tgap: 2px;\n\t}\n\n\t.actions {\n\t\tdisplay: flex;\n\t\tjustify-content: flex-end;\n\t\tmargin-top: 0.25rem;\n\t}\n\n\t.button {\n\t\tpadding-left: 8px;\n\t\tpadding-right: 8px;\n\t\tmargin-left: var(--toast-button-margin-start);\n\t\tmargin-right: var(--toast-button-margin-end);\n\t\tflex-shrink: 0;\n\t}\n\n\t.closeButton {\n\t\tposition: absolute;\n\t\tmin-height: 1.33rem !important;\n\t\tleft: var(--toast-close-button-start);\n\t\tright: var(--toast-close-button-end);\n\t\ttop: 0;\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\tpadding: 0;\n\t\ttransform: var(--toast-close-button-transform);\n\t\tborder-radius: 50%;\n\t\tcursor: pointer;\n\t\tz-index: 1;\n\t}\n\n\t.loader {\n\t\twidth: 20px;\n\t\theight: 20px;\n\t}\n}\n","\"data:image/svg+xml,<svg width=\\\"20\\\" height=\\\"20\\\" viewBox=\\\"0 0 20 20\\\" fill=\\\"none\\\" xmlns=\\\"http://www.w3.org/2000/svg\\\">%0D%0A<path fill-rule=\\\"evenodd\\\" clip-rule=\\\"evenodd\\\" d=\\\"M10.8889 3L18 15.25L17.1111 17H2.88889L2 15.25L9.11111 3H10.8889ZM9.11111 11.75L8.22222 7.375L10 6.5L11.7778 7.375L10.8889 11.75H9.11111ZM11.7778 14.375L10 16.125L8.22222 14.375L10 12.625L11.7778 14.375Z\\\" fill=\\\"%23BE1E37\\\"/>%0D%0A</svg>%0D%0A\"","\"data:image/svg+xml,<svg width=\\\"20\\\" height=\\\"20\\\" viewBox=\\\"0 0 20 20\\\" fill=\\\"none\\\" xmlns=\\\"http://www.w3.org/2000/svg\\\">%0D%0A<path fill-rule=\\\"evenodd\\\" clip-rule=\\\"evenodd\\\" d=\\\"M11.4144 2.41452C10.6334 1.63347 9.36702 1.63347 8.58598 2.41452L2.4144 8.5861C1.63335 9.36714 1.63335 10.6335 2.4144 11.4145L8.58597 17.5861C9.36702 18.3671 10.6334 18.3671 11.4144 17.5861L17.586 11.4145C18.367 10.6335 18.367 9.36715 17.586 8.5861L11.4144 2.41452ZM11.0002 6.00024C11.0002 6.55253 10.5525 7.00024 10.0002 7.00024C9.4479 7.00024 9.00018 6.55253 9.00018 6.00024C9.00018 5.44796 9.4479 5.00024 10.0002 5.00024C10.5525 5.00024 11.0002 5.44796 11.0002 6.00024ZM9.00018 9.00024C9.00018 8.44796 9.4479 8.00024 10.0002 8.00024C10.5525 8.00024 11.0002 8.44796 11.0002 9.00024V14.0002C11.0002 14.5525 10.5525 15.0002 10.0002 15.0002C9.4479 15.0002 9.00018 14.5525 9.00018 14.0002V9.00024Z\\\" fill=\\\"%23CDBE91\\\"/>%0D%0A</svg>%0D%0A\"","\"data:image/svg+xml,<svg width=\\\"20\\\" height=\\\"20\\\" viewBox=\\\"0 0 20 20\\\" fill=\\\"none\\\" xmlns=\\\"http://www.w3.org/2000/svg\\\">%0D%0A<path fill-rule=\\\"evenodd\\\" clip-rule=\\\"evenodd\\\" d=\\\"M18 4.91543L8.72622 14.0231L8.34844 14.3912L6.70933 16L6.70311 15.9939L6.69689 16L5.30133 14.6295L4.82756 14.1677L2 11.3816L4.03022 9.44369L6.82222 12.1648L15.952 3L18 4.91543Z\\\" fill=\\\"%23A09B8C\\\"/>%0D%0A</svg>%0D%0A\"","\"data:image/svg+xml,<svg width=\\\"20\\\" height=\\\"20\\\" viewBox=\\\"0 0 20 20\\\" fill=\\\"none\\\" xmlns=\\\"http://www.w3.org/2000/svg\\\">%0D%0A<path fill-rule=\\\"evenodd\\\" clip-rule=\\\"evenodd\\\" d=\\\"M10.8889 3L18 15.25L17.1111 17H2.88889L2 15.25L9.11111 3H10.8889ZM9.11111 11.75L8.22222 7.375L10 6.5L11.7778 7.375L10.8889 11.75H9.11111ZM11.7778 14.375L10 16.125L8.22222 14.375L10 12.625L11.7778 14.375Z\\\" fill=\\\"%23C89B3C\\\"/>%0D%0A</svg>%0D%0A\"","import { useMemo } from \"react\";\nimport {\n\ttype ExternalToast,\n\ttoast as sonnerToast,\n\tToaster,\n\ttype ToasterProps,\n} from \"sonner\";\nimport { button } from \"../button\";\nimport { Spinner } from \"../spinner/spinner\";\nimport { heading } from \"../typography/heading\";\nimport { text } from \"../typography/text\";\nimport classes from \"./sonner.module.css\";\nimport sonnerError from \"./sonner-error.svg\";\nimport sonnerInfo from \"./sonner-info.svg\";\nimport sonnerSuccess from \"./sonner-success.svg\";\nimport type { Toast } from \"./sonner-types\";\nimport sonnerWarning from \"./sonner-warning.svg\";\n\nexport type ToastVariant = \"default\" \| \"hextech\";\n\nexport const sonner: Toast = sonnerToast;\n\nexport type SonnerProps = ExternalToast;\n\nexport function Sonner(props: ToasterProps) {\n\treturn (\n\t\t<Toaster\n\t\t\t{...props}\n\t\t\ttoastOptions={useMemo(\n\t\t\t\t() => ({\n\t\t\t\t\t...props.toastOptions,\n\t\t\t\t\tunstyled: true,\n\t\t\t\t\tclassNames: {\n\t\t\t\t\t\tactionButton: button({\n\t\t\t\t\t\t\tpreset: \"dimmed\",\n\t\t\t\t\t\t\tsize: \"small\",\n\t\t\t\t\t\t\tthin: true,\n\t\t\t\t\t\t\tclassName: classes.button,\n\t\t\t\t\t\t}),\n\t\t\t\t\t\tcancelButton: button({\n\t\t\t\t\t\t\tpreset: \"dimmed\",\n\t\t\t\t\t\t\tsize: \"small\",\n\t\t\t\t\t\t\tthin: true,\n\t\t\t\t\t\t\tclassName: classes.button,\n\t\t\t\t\t\t}),\n\t\t\t\t\t\tcloseButton: button({\n\t\t\t\t\t\t\tpreset: \"dimmed\",\n\t\t\t\t\t\t\tsize: \"small\",\n\t\t\t\t\t\t\tshape: \"round\",\n\t\t\t\t\t\t\tthin: true,\n\t\t\t\t\t\t\tclassName: classes.closeButton,\n\t\t\t\t\t\t}),\n\t\t\t\t\t\t// content: classes.content,\n\t\t\t\t\t\ttoast: classes.toast,\n\t\t\t\t\t\ttitle: heading({ preset: \"h5\", className: classes.title }),\n\t\t\t\t\t\tdescription: text({\n\t\t\t\t\t\t\tpreset: \"sm\",\n\t\t\t\t\t\t\tcolor: \"grey100\",\n\t\t\t\t\t\t}),\n\t\t\t\t\t\ticon: classes.icon,\n\t\t\t\t\t\tdefault: classes.default,\n\t\t\t\t\t\tloader: classes.loader,\n\t\t\t\t\t\tcontent: classes.content,\n\t\t\t\t\t},\n\t\t\t\t}),\n\t\t\t\t[props.toastOptions],\n\t\t\t)}\n\t\t\ticons={{\n\t\t\t\tloading: <Spinner />,\n\t\t\t\tsuccess: <img src={sonnerSuccess} alt=\"\" />,\n\t\t\t\terror: <img src={sonnerError} alt=\"\" />,\n\t\t\t\twarning: <img src={sonnerWarning} alt=\"\" />,\n\t\t\t\tinfo: <img src={sonnerInfo} alt=\"\" />,\n\t\t\t}}\n\t\t/>\n\t);\n}\n","@layer lol {\n\t.track {\n\t\tbackground:\n\t\t\tvar(--lol-switch-background-gradient) padding-box,\n\t\t\tvar(--lol-switch-border-gradient) border-box;\n\n\t\t--lol-switch-border-gradient: var(--lol-gradient-gold);\n\t\t--lol-switch-background-gradient: var(--lol-gradient-grey-300);\n\n\t\tborder: 2px solid transparent;\n\t\theight: 1.5rem;\n\t\twidth: 3.5rem;\n\n\t\tborder-radius: 9999px;\n\n\t\tposition: relative;\n\t}\n\n\t.knob {\n\t\tposition: absolute;\n\t\tleft: -0.5rem;\n\t\ttop: -0.375rem;\n\t\theight: 2rem;\n\t\twidth: 2rem;\n\t\tborder-radius: 9999px;\n\t\tbackground:\n\t\t\tvar(--lol-switch-background-gradient) padding-box,\n\t\t\tvar(--lol-switch-border-gradient) border-box;\n\n\t\ttransition: left 200ms ease-in-out;\n\n\t\t--lol-switch-border-gradient: var(--lol-gradient-gold);\n\t\t--lol-switch-background-gradient: var(--lol-gradient-grey-300);\n\n\t\tborder: 2px solid transparent;\n\t}\n\n\t.switch {\n\t\tdisplay: inline-flex;\n\t\talign-items: center;\n\t\tgap: 1rem;\n\t\tpadding: 0.25rem 0.375rem;\n\n\t\t&[data-hovered] {\n\t\t\t.track {\n\t\t\t\t--lol-switch-border-gradient: var(--lol-gradient-gold-hover);\n\t\t\t}\n\t\t\t.knob {\n\t\t\t\t--lol-switch-border-gradient: var(--lol-gradient-gold-hover);\n\t\t\t}\n\t\t}\n\n\t\t&[data-pressed] {\n\t\t\t.track {\n\t\t\t\t--lol-switch-border-gradient: var(--lol-gradient-gold-press);\n\t\t\t}\n\t\t\t.knob {\n\t\t\t\t--lol-switch-border-gradient: var(--lol-gradient-gold-press);\n\t\t\t}\n\t\t}\n\n\t\t&[data-disabled] {\n\t\t\t.track {\n\t\t\t\t--lol-switch-border-gradient: var(--lol-gradient-disabled);\n\t\t\t}\n\t\t\t.knob {\n\t\t\t\t--lol-switch-border-gradient: var(--lol-gradient-disabled);\n\t\t\t}\n\t\t}\n\n\t\t&[data-selected] {\n\t\t\t.track {\n\t\t\t\t--lol-switch-background-gradient: var(--lol-gradient-hextech);\n\t\t\t}\n\t\t\t.knob {\n\t\t\t\tleft: calc(100% - 1.5rem);\n\t\t\t}\n\t\t}\n\t}\n}\n","import { cx } from \"cva\";\nimport type {\n\tSwitchButtonProps,\n\tSwitchFieldProps,\n} from \"react-aria-components\";\nimport {\n\tSwitchButton as AriaSwitchButton,\n\tSwitchField as AriaSwitchField,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport classes from \"./switch.module.css\";\nimport textClasses from \"./typography/text.module.css\";\n\nexport function SwitchButton({\n\tclassName,\n\tchildren,\n\t...props\n}: SwitchButtonProps) {\n\treturn (\n\t\t<AriaSwitchButton\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(\n\t\t\t\t\tclasses.switch,\n\t\t\t\t\ttextClasses.label,\n\t\t\t\t\ttextClasses.text,\n\t\t\t\t\ttextClasses.grey100,\n\t\t\t\t\tclassName,\n\t\t\t\t),\n\t\t\t)}\n\t\t>\n\t\t\t{(values) => (\n\t\t\t\t<>\n\t\t\t\t\t<div className={classes.track}>\n\t\t\t\t\t\t<span className={classes.knob} />\n\t\t\t\t\t</div>\n\t\t\t\t\t{typeof children === \"function\" ? children(values) : children}\n\t\t\t\t</>\n\t\t\t)}\n\t\t</AriaSwitchButton>\n\t);\n}\n\nexport function SwitchField({ className, ...props }: SwitchFieldProps) {\n\treturn <AriaSwitchField {...props} className={className} />;\n}\n\nexport function Switch({\n\tchildren,\n\tclassName,\n\t...props\n}: Omit<SwitchFieldProps, \"children\" \| \"className\"> &\n\tPick<SwitchButtonProps, \"children\" \| \"className\">) {\n\treturn (\n\t\t<SwitchField {...props}>\n\t\t\t<SwitchButton className={className}>{children}</SwitchButton>\n\t\t</SwitchField>\n\t);\n}\n","@layer lol {\n\t.resizableContainer {\n\t\toverflow: auto;\n\t\tposition: relative;\n\t}\n\n\t.table {\n\t\tborder-collapse: collapse;\n\t\tborder-spacing: 0;\n\t\twidth: 100%;\n\t\toutline: none;\n\n\t\tfont-family: var(--lol-font-family-spiegel);\n\t\tfont-size: var(--lol-font-size-sm);\n\t\tline-height: var(--lol-line-height-sm);\n\t\tletter-spacing: var(--lol-letter-spacing-sm);\n\t\tfont-weight: var(--lol-font-weight-sm);\n\n\t\t&[data-focus-visible] {\n\t\t\toutline: 1px solid var(--lol-color-gold-400);\n\t\t\toutline-offset: 0.25rem;\n\t\t}\n\t}\n\n\t.row {\n\t\tcolor: var(--lol-color-grey-100);\n\t\toutline: none;\n\t\ttransition: color 0.3s ease;\n\n\t\t/ Every decoration is a background layer: a pseudo element on a table row\n\t\t is laid out as an anonymous cell and would shift the columns. /\n\t\t--lol-table-row-spine: none;\n\t\t--lol-table-row-hover: none;\n\t\t--lol-table-row-highlight: none;\n\n\t\tbackground-image:\n\t\t\tvar(--lol-table-row-spine), var(--lol-table-row-hover),\n\t\t\tvar(--lol-table-row-highlight);\n\t\tbackground-repeat: no-repeat;\n\n\t\t@media (prefers-reduced-motion: reduce) {\n\t\t\ttransition: none;\n\t\t}\n\n\t\t&[data-href] {\n\t\t\tcursor: pointer;\n\t\t}\n\n\t\t&[data-hovered] {\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t\t--lol-table-row-hover: linear-gradient(\n\t\t\t\t90deg,\n\t\t\t\trgb(from var(--lol-color-gold-100) r g b / 0.08),\n\t\t\t\ttransparent\n\t\t\t);\n\t\t}\n\n\t\t&[data-selected] {\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t\t/ Gold spine on the selected row, matching the client's \"current\" row. /\n\t\t\t--lol-table-row-spine: linear-gradient(\n\t\t\t\t90deg,\n\t\t\t\tvar(--lol-color-gold-500) 0 0.25rem,\n\t\t\t\ttransparent 0.25rem\n\t\t\t);\n\t\t\t--lol-table-row-highlight: linear-gradient(\n\t\t\t\t90deg,\n\t\t\t\trgb(from var(--lol-color-blue-400) r g b / 0.55),\n\t\t\t\trgb(from var(--lol-color-blue-300) r g b / 0.1)\n\t\t\t);\n\t\t}\n\n\t\t&[data-disabled] {\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t\tcursor: default;\n\t\t}\n\n\t\t&[data-focus-visible] {\n\t\t\toutline: 1px solid var(--lol-color-gold-400);\n\t\t\toutline-offset: -1px;\n\t\t}\n\t}\n\n\t.cell {\n\t\t/\n\t\t * Collapsed borders are resolved between neighbours, and Chrome paints the\n\t\t * winning hairline once per edge when the losing side is styled `none`. The\n\t\t * header's 25%-opacity line then blends twice and comes out twice as\n\t\t * bright; a zero-width `solid` border on the cell below keeps it single.\n\t\t /\n\t\tborder: 0 solid;\n\t\tpadding: 0.375rem 0.75rem;\n\t\tvertical-align: middle;\n\t\toutline: none;\n\n\t\t&[data-focus-visible] {\n\t\t\toutline: 1px solid var(--lol-color-gold-400);\n\t\t\toutline-offset: -1px;\n\t\t}\n\t}\n\n\t.resizer {\n\t\tposition: absolute;\n\t\tinset-block: 0;\n\t\tinset-inline-end: 0;\n\t\twidth: 0.75rem;\n\t\tbox-sizing: border-box;\n\t\tborder-inline: 0.3125rem solid transparent;\n\t\tbackground-color: rgb(from var(--lol-color-gold-500) r g b / 0.6);\n\t\tbackground-clip: content-box;\n\t\ttouch-action: none;\n\t\toutline: none;\n\t\tcursor: col-resize;\n\n\t\t&[data-resizable-direction=\"left\"] {\n\t\t\tcursor: e-resize;\n\t\t}\n\n\t\t&[data-resizable-direction=\"right\"] {\n\t\t\tcursor: w-resize;\n\t\t}\n\n\t\t&[data-hovered],\n\t\t&[data-resizing] {\n\t\t\tbackground-color: var(--lol-color-gold-400);\n\t\t}\n\n\t\t&[data-focus-visible] {\n\t\t\tbackground-color: var(--lol-color-gold-200);\n\t\t}\n\t}\n\n\t/ Fixed footprint so toggling the sort direction never shifts the header. /\n\t.sortIndicator {\n\t\tdisplay: inline-block;\n\t\tvertical-align: middle;\n\t\twidth: 0.5rem;\n\t\tmargin-left: 0.375rem;\n\t\topacity: 0;\n\t\ttransition: opacity 0.3s ease;\n\n\t\t@media (prefers-reduced-motion: reduce) {\n\t\t\ttransition: none;\n\t\t}\n\n\t\t&::after {\n\t\t\tcontent: \"\";\n\t\t\tdisplay: block;\n\t\t\twidth: 0;\n\t\t\theight: 0;\n\t\t\tborder-style: solid;\n\t\t\tborder-color: transparent;\n\t\t\tborder-width: 0 0.25rem 0.375rem;\n\t\t\tborder-bottom-color: currentColor;\n\t\t}\n\t}\n\n\t.column {\n\t\tposition: relative;\n\t\tfont-family: var(--lol-font-family-beaufort);\n\t\tcolor: var(--lol-color-gold-100);\n\t\tfont-size: 0.75rem;\n\t\tfont-weight: 700;\n\t\tletter-spacing: 0.075em;\n\t\tline-height: 1rem;\n\t\ttext-transform: uppercase;\n\t\twhite-space: nowrap;\n\t\tpadding: 0.375rem 0.75rem;\n\t\t/ The client separates the header from the rows with a faint hairline\n\t\t rather than a full border. /\n\t\tborder-bottom: 1px solid rgb(from var(--lol-color-grey-100) r g b / 0.25);\n\t\toutline: none;\n\n\t\t/ Only sortable columns are interactive, so they are the only ones react\n\t\t aria marks as hovered or pressed. /\n\t\t&[data-allows-sorting] {\n\t\t\tcursor: pointer;\n\t\t\tuser-select: none;\n\t\t\ttransition: color 0.3s ease;\n\n\t\t\t@media (prefers-reduced-motion: reduce) {\n\t\t\t\ttransition: none;\n\t\t\t}\n\t\t}\n\n\t\t&[data-hovered] {\n\t\t\tcolor: var(--lol-color-gold-200);\n\t\t}\n\n\t\t&[data-pressed] {\n\t\t\tcolor: var(--lol-color-gold-500);\n\t\t}\n\n\t\t&[data-hovered] .sortIndicator {\n\t\t\topacity: 0.5;\n\t\t}\n\n\t\t&[data-sort-direction] .sortIndicator {\n\t\t\topacity: 1;\n\t\t}\n\n\t\t&[data-sort-direction=\"descending\"] .sortIndicator::after {\n\t\t\tborder-width: 0.375rem 0.25rem 0;\n\t\t\tborder-top-color: currentColor;\n\t\t\tborder-bottom-color: transparent;\n\t\t}\n\n\t\t&[data-focus-visible] {\n\t\t\toutline: 1px solid var(--lol-color-gold-400);\n\t\t\toutline-offset: -1px;\n\t\t}\n\t}\n\n\t.footer {\n\t\tcolor: var(--lol-color-gold-300);\n\n\t\t& .cell {\n\t\t\tborder-top: 1px solid rgb(from var(--lol-color-grey-100) r g b / 0.25);\n\t\t}\n\t}\n\n\t.empty {\n\t\tpadding: 1rem 0.75rem;\n\t\ttext-align: center;\n\t}\n\n\t/ React aria renders the empty state in a row it builds itself, so that cell\n\t never gets `.cell` and keeps the UA's 1px padding. /\n\t.table [data-empty] > tr > td {\n\t\tpadding: 0;\n\t}\n\n\t.start {\n\t\ttext-align: start;\n\t}\n\n\t.center {\n\t\ttext-align: center;\n\t}\n\n\t.end {\n\t\ttext-align: end;\n\t}\n}\n","import { cva, cx } from \"cva\";\nimport {\n\tCell as AriaCell,\n\ttype CellProps as AriaCellProps,\n\tColumn as AriaColumn,\n\ttype ColumnProps as AriaColumnProps,\n\tColumnResizer as AriaColumnResizer,\n\ttype ColumnResizerProps as AriaColumnResizerProps,\n\tRow as AriaRow,\n\ttype RowProps as AriaRowProps,\n\tTable as AriaTable,\n\tTableBody as AriaTableBody,\n\ttype TableBodyProps as AriaTableBodyProps,\n\tTableFooter as AriaTableFooter,\n\ttype TableFooterProps as AriaTableFooterProps,\n\ttype TableProps as AriaTableProps,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport classes from \"./table.module.css\";\nimport { text } from \"./typography/text\";\n\nexport { ResizableTableContainer, TableHeader } from \"react-aria-components\";\n\n/* Horizontal alignment shared by `TableColumn` and `TableCell`. /\nexport type TableAlign = \"start\" \| \"center\" \| \"end\";\n\nconst alignVariants = {\n\tstart: classes.start,\n\tcenter: classes.center,\n\tend: classes.end,\n};\n\nexport const table = cva({\n\tbase: classes.table,\n});\n\n// A table whose cells hold their own controls (a textfield, a slider) needs\n// `keyboardNavigationBehavior=\"tab\"`: the arrow keys then belong to the control\n// instead of moving between cells, and Tab walks the row's controls.\nexport interface TableProps extends AriaTableProps {}\n\nexport function Table({ className, ...props }: TableProps) {\n\treturn (\n\t\t<AriaTable\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\ttable({ className }),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport const tableColumn = cva({\n\tbase: classes.column,\n\tvariants: { align: alignVariants },\n\tdefaultVariants: { align: \"start\" },\n});\n\nexport interface TableColumnProps extends AriaColumnProps {\n\talign?: TableAlign;\n}\n\nexport function TableColumn({\n\talign = \"start\",\n\tchildren,\n\tclassName,\n\t...props\n}: TableColumnProps) {\n\treturn (\n\t\t<AriaColumn\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\ttableColumn({ align, className }),\n\t\t\t)}\n\t\t>\n\t\t\t{composeRenderProps(children, (children, { allowsSorting }) => (\n\t\t\t\t<>\n\t\t\t\t\t{children}\n\t\t\t\t\t{allowsSorting && (\n\t\t\t\t\t\t<span aria-hidden=\"true\" className={classes.sortIndicator} />\n\t\t\t\t\t)}\n\t\t\t\t</>\n\t\t\t))}\n\t\t</AriaColumn>\n\t);\n}\n\nexport interface TableColumnResizerProps extends AriaColumnResizerProps {}\n\nexport function TableColumnResizer({\n\tclassName,\n\t...props\n}: TableColumnResizerProps) {\n\treturn (\n\t\t<AriaColumnResizer\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.resizer, className),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport interface TableBodyProps<T extends object>\n\textends AriaTableBodyProps<T> {\n\t/* Rendered when the table has no rows. /\n\temptyState?: React.ReactNode;\n}\n\nexport function TableBody<T extends object>({\n\temptyState = \"No results found\",\n\trenderEmptyState,\n\t...props\n}: TableBodyProps<T>) {\n\treturn (\n\t\t<AriaTableBody<T>\n\t\t\t{...props}\n\t\t\trenderEmptyState={\n\t\t\t\trenderEmptyState ??\n\t\t\t\t(() => (\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={text({\n\t\t\t\t\t\t\tcolor: \"grey150\",\n\t\t\t\t\t\t\tpreset: \"base\",\n\t\t\t\t\t\t\tclassName: classes.empty,\n\t\t\t\t\t\t})}\n\t\t\t\t\t>\n\t\t\t\t\t\t{emptyState}\n\t\t\t\t\t</div>\n\t\t\t\t))\n\t\t\t}\n\t\t/>\n\t);\n}\n\nexport const tableRow = cva({\n\tbase: classes.row,\n});\n\nexport interface TableRowProps<T extends object> extends AriaRowProps<T> {}\n\nexport function TableRow<T extends object>({\n\tclassName,\n\t...props\n}: TableRowProps<T>) {\n\treturn (\n\t\t<AriaRow<T>\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\ttableRow({ className }),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport const tableCell = cva({\n\tbase: classes.cell,\n\tvariants: { align: alignVariants },\n\tdefaultVariants: { align: \"start\" },\n});\n\nexport interface TableCellProps extends AriaCellProps {\n\talign?: TableAlign;\n}\n\nexport function TableCell({\n\talign = \"start\",\n\tclassName,\n\t...props\n}: TableCellProps) {\n\treturn (\n\t\t<AriaCell\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\ttableCell({ align, className }),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport interface TableFooterProps<T extends object>\n\textends AriaTableFooterProps<T> {}\n\nexport function TableFooter<T extends object>({\n\tclassName,\n\t...props\n}: TableFooterProps<T>) {\n\treturn (\n\t\t<AriaTableFooter<T> {...props} className={cx(classes.footer, className)} />\n\t);\n}\n","@layer lol {\n\t.list {\n\t\tmargin-left: -1rem;\n\t\tdisplay: flex;\n\t}\n\n\t.tab {\n\t\tfont-family: var(--lol-font-family-beaufort);\n\t\tcolor: var(--lol-color-gold-300);\n\t\tposition: relative;\n\t\tcursor: pointer;\n\t\tuser-select: none;\n\t\tpadding: 0.25rem 1rem;\n\t\tfont-size: 0.75rem;\n\t\tfont-weight: 500;\n\t\ttext-transform: uppercase;\n\t\tletter-spacing: 0.1em;\n\t\tline-height: 1rem;\n\t\toutline: none;\n\n\t\t&[data-selected] {\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t}\n\n\t\t&[data-hovered] {\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t}\n\n\t\t&[data-pressed] {\n\t\t\tcolor: var(--lol-color-gold-500);\n\t\t}\n\n\t\t&[data-disabled] {\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t\tcursor: default;\n\t\t}\n\n\t\t&[data-focus-visible] {\n\t\t\toutline: 1px solid var(--lol-color-gold-400);\n\t\t\toutline-offset: 0.25rem;\n\t\t}\n\t}\n\n\t.indicator {\n\t\tposition: absolute;\n\t\tbottom: 0;\n\t\tleft: 0;\n\t\theight: 1px;\n\t\twidth: 100%;\n\t\tbackground: linear-gradient(\n\t\t\tto right,\n\t\t\ttransparent,\n\t\t\tvar(--lol-color-gold-200),\n\t\t\ttransparent\n\t\t);\n\n\t\ttransition-property: translate, width;\n\t\ttransition-duration: 200ms;\n\t\t@media (prefers-reduced-motion: reduce) {\n\t\t\ttransition: none;\n\t\t}\n\t}\n}\n","\"use client\";\n\nimport { cx } from \"cva\";\nimport {\n\tTab as AriaTab,\n\tTabList as AriaTabList,\n\tTabPanel as AriaTabPanel,\n\tTabs as AriaTabs,\n\tcomposeRenderProps,\n\tSelectionIndicator,\n\ttype TabListProps,\n\ttype TabPanelProps,\n\ttype TabProps,\n} from \"react-aria-components\";\nimport classes from \"./tabs.module.css\";\n\nexport const Tabs = AriaTabs;\n\nexport function TabList<T extends object>({\n\tclassName,\n\t...rest\n}: TabListProps<T>) {\n\treturn (\n\t\t<AriaTabList<T>\n\t\t\t{...rest}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.list, className),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport function Tab({ children, className, ...rest }: TabProps) {\n\treturn (\n\t\t<AriaTab\n\t\t\t{...rest}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.tab, className),\n\t\t\t)}\n\t\t>\n\t\t\t{(values) => (\n\t\t\t\t<>\n\t\t\t\t\t{typeof children === \"function\" ? children(values) : children}\n\t\t\t\t\t{values.isSelected && (\n\t\t\t\t\t\t<SelectionIndicator className={classes.indicator} />\n\t\t\t\t\t)}\n\t\t\t\t</>\n\t\t\t)}\n\t\t</AriaTab>\n\t);\n}\n\nexport function TabPanel({ ...rest }: TabPanelProps) {\n\treturn <AriaTabPanel {...rest} />;\n}\n","@layer lol {\n\t.textField {\n\t\tbackground:\n\t\t\tvar(--lol-input-background-gradient) padding-box,\n\t\t\tvar(--lol-input-border-gradient) border-box;\n\n\t\t--lol-input-border-gradient: var(--lol-gradient-gold);\n\t\t--lol-input-background-gradient: var(--lol-gradient-hextech-black);\n\n\t\tborder: 1px solid transparent;\n\t\tgrid-area: input;\n\t\tpadding: 0 0.75rem;\n\t\tmargin: 0;\n\t\tfont-size: 0.75rem;\n\t\tline-height: 1rem;\n\t\toutline: none;\n\t\tfont-family: var(--lol-font-family-spiegel);\n\t\tfont-weight: 500;\n\t\tletter-spacing: 0.025em;\n\n\t\tmin-height: var(--lol-form-input-min-height);\n\n\t\tcolor: var(--lol-color-gold-100);\n\n\t\tdisplay: flex;\n\t\twidth: 100%;\n\n\t\t&[data-disabled] {\n\t\t\t--lol-input-border-gradient: var(--lol-gradient-disabled);\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t}\n\n\t\t&[data-focused] {\n\t\t\t--lol-input-border-gradient: var(--lol-gradient-gold-hover);\n\t\t\t--lol-input-background-gradient: var(--lol-gradient-grey-focus);\n\t\t}\n\n\t\t&.small {\n\t\t\tmin-height: var(--lol-form-height-small);\n\t\t}\n\n\t\t&.medium {\n\t\t\tmin-height: var(--lol-form-height-medium);\n\t\t}\n\n\t\t&.large {\n\t\t\tmin-height: var(--lol-form-height-large);\n\t\t}\n\n\t\t&.textArea {\n\t\t\tpadding-top: 0.5rem;\n\t\t\tpadding-bottom: 0.5rem;\n\t\t\t/ The UA lets a textarea be resized in both axes, which breaks the\n\t\t\t field's layout; only the height is safe to drag. /\n\t\t\tresize: vertical;\n\t\t}\n\t}\n}\n","import { cva } from \"cva\";\nimport type { ComponentProps } from \"react\";\nimport type {\n\tTextFieldProps as AriaTextFieldProps,\n\tInputProps,\n} from \"react-aria-components\";\nimport {\n\tInput as AriaInput,\n\tTextField as AriaTextField,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport classes from \"./text-field.module.css\";\n\nexport const textField = cva({\n\tbase: classes.textField,\n\tvariants: {\n\t\tsize: {\n\t\t\tsmall: classes.small,\n\t\t\tmedium: classes.medium,\n\t\t\tlarge: classes.large,\n\t\t},\n\t\tisTextArea: { true: classes.textArea },\n\t},\n});\n\nexport function TextField({\n\tinputProps = {},\n\tborderProps = {},\n\tchildren,\n\tsize = \"medium\",\n\t...props\n}: AriaTextFieldProps & {\n\tinputProps?: InputProps;\n\tborderProps?: ComponentProps<\"div\">;\n\tsize?: \"small\" \| \"medium\" \| \"large\";\n}) {\n\treturn (\n\t\t<AriaTextField {...props}>\n\t\t\t{(values) => (\n\t\t\t\t<>\n\t\t\t\t\t{typeof children === \"function\" ? children(values) : children}\n\n\t\t\t\t\t<AriaInput\n\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\t{...inputProps}\n\t\t\t\t\t\tclassName={composeRenderProps(\n\t\t\t\t\t\t\tinputProps.className,\n\t\t\t\t\t\t\t(className, values) =>\n\t\t\t\t\t\t\t\ttextField({\n\t\t\t\t\t\t\t\t\t...values,\n\t\t\t\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t\t\t\tsize,\n\t\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t)}\n\t\t\t\t\t/>\n\t\t\t\t</>\n\t\t\t)}\n\t\t</AriaTextField>\n\t);\n}\n","import type {\n\tTextFieldProps as AriaTextFieldProps,\n\tTextAreaProps,\n} from \"react-aria-components\";\nimport {\n\tTextArea as AriaTextArea,\n\tTextField as AriaTextField,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport { textField } from \"./text-field\";\n\nexport function TextArea({\n\ttextAreaProps = {},\n\tchildren,\n\t...props\n}: AriaTextFieldProps & {\n\ttextAreaProps?: TextAreaProps;\n}) {\n\treturn (\n\t\t<AriaTextField {...props}>\n\t\t\t{(values) => (\n\t\t\t\t<>\n\t\t\t\t\t{typeof children === \"function\" ? children(values) : children}\n\t\t\t\t\t<AriaTextArea\n\t\t\t\t\t\t{...textAreaProps}\n\t\t\t\t\t\tclassName={composeRenderProps(\n\t\t\t\t\t\t\ttextAreaProps.className,\n\t\t\t\t\t\t\t(className, values) =>\n\t\t\t\t\t\t\t\ttextField({\n\t\t\t\t\t\t\t\t\t...values,\n\t\t\t\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t\t\t\tisTextArea: true,\n\t\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t)}\n\t\t\t\t\t/>\n\t\t\t\t</>\n\t\t\t)}\n\t\t</AriaTextField>\n\t);\n}\n","import { cva } from \"cva\";\nimport {\n\tToggleButton as AriaToggleButton,\n\ttype ToggleButtonProps as AriaToggleButtonProps,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport type { ButtonShape, ButtonSize } from \"./button\";\nimport classes from \"./button.module.css\";\n\nexport type ToggleButtonPreset = \"secondary\" \| \"hextech\" \| \"dimmed\";\n\nconst button = cva({\n\tbase: classes.button,\n\tvariants: {\n\t\tpreset: {\n\t\t\tsecondary: classes.secondary,\n\t\t\thextech: classes.hextech,\n\t\t\tdimmed: classes.dimmed,\n\t\t},\n\t\tshape: {\n\t\t\tround: classes.round,\n\t\t\tsquare: classes.square,\n\t\t\tnormal: classes.normal,\n\t\t},\n\t\tthin: {\n\t\t\ttrue: classes.thin,\n\t\t},\n\t\tsize: {\n\t\t\tsmall: classes.small,\n\t\t\tmedium: classes.medium,\n\t\t\tlarge: classes.large,\n\t\t},\n\t},\n});\ninterface ToggleButtonProps extends AriaToggleButtonProps {\n\tpreset?: ToggleButtonPreset;\n\tthin?: boolean;\n\tshape?: ButtonShape;\n\tsize?: ButtonSize;\n}\n\nexport function ToggleButton({\n\tchildren,\n\tclassName,\n\tpreset = \"secondary\",\n\tshape = \"normal\",\n\tsize = \"medium\",\n\tthin = preset === \"dimmed\",\n\t...props\n}: ToggleButtonProps) {\n\treturn (\n\t\t<AriaToggleButton\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className, values) =>\n\t\t\t\tbutton({\n\t\t\t\t\t...values,\n\t\t\t\t\tpreset,\n\t\t\t\t\tshape,\n\t\t\t\t\tthin,\n\t\t\t\t\tsize,\n\t\t\t\t\tclassName,\n\t\t\t\t}),\n\t\t\t)}\n\t\t>\n\t\t\t{children}\n\t\t</AriaToggleButton>\n\t);\n}\n","\"use client\";\n\nimport { cx } from \"cva\";\nimport {\n\tToggleButtonGroup as AriaToggleButtonGroup,\n\ttype ToggleButtonGroupProps as AriaToggleButtonGroupProps,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport classes from \"./button.module.css\";\n\nexport interface ToggleButtonGroupProps extends AriaToggleButtonGroupProps {}\n\nexport function ToggleButtonGroup({\n\tclassName,\n\t...props\n}: ToggleButtonGroupProps) {\n\treturn (\n\t\t<AriaToggleButtonGroup\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.toggleButtonGroup, className),\n\t\t\t)}\n\t\t/>\n\t);\n}\n","@layer lol {\n\t.tokenField {\n\t\tdisplay: grid;\n\t\tgrid-template-areas:\n\t\t\t\"label\"\n\t\t\t\"input\"\n\t\t\t\"help\";\n\n\t\tcolor: var(--lol-color-gold-100);\n\t}\n\n\t.input {\n\t\tbackground:\n\t\t\tvar(--lol-token-field-background-gradient) padding-box,\n\t\t\tvar(--lol-token-field-border-gradient) border-box;\n\n\t\t--lol-token-field-border-gradient: var(--lol-gradient-gold);\n\t\t--lol-token-field-background-gradient: var(--lol-gradient-hextech-black);\n\n\t\tborder: 1px solid transparent;\n\t\tgrid-area: input;\n\t\tmargin: 0;\n\t\tpadding: 0.375rem 0.75rem;\n\t\toutline: none;\n\n\t\tfont-family: var(--lol-font-family-spiegel);\n\t\tfont-size: 0.75rem;\n\t\tfont-weight: 500;\n\t\tletter-spacing: 0.025em;\n\t\tline-height: 1.25rem;\n\t\tcolor: var(--lol-color-gold-100);\n\n\t\t/ The editable area is a contenteditable box holding a mix of text nodes\n\t\t and token spans, so it has to stay a block formatting context: a flex\n\t\t container would wrap each run of text in an anonymous box and the caret\n\t\t would no longer move across the boundaries between them. /\n\t\tdisplay: block;\n\t\twhite-space: pre-wrap;\n\t\toverflow-wrap: anywhere;\n\n\t\t&[data-disabled] {\n\t\t\t--lol-token-field-border-gradient: var(--lol-gradient-disabled);\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t}\n\n\t\t&[data-focused] {\n\t\t\t--lol-token-field-border-gradient: var(--lol-gradient-gold-hover);\n\t\t\t--lol-token-field-background-gradient: var(--lol-gradient-grey-focus);\n\t\t}\n\n\t\t/ The field holds no value of its own to hang a `::placeholder` on — its\n\t\t content is the editable DOM — so an empty box paints the hint itself. /\n\t\t&:empty::before {\n\t\t\tcontent: attr(data-placeholder);\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t}\n\n\t\t&.small {\n\t\t\tmin-height: var(--lol-form-height-small);\n\t\t}\n\n\t\t&.medium {\n\t\t\tmin-height: var(--lol-form-height-medium);\n\t\t}\n\n\t\t&.large {\n\t\t\tmin-height: var(--lol-form-height-large);\n\t\t}\n\t}\n\n\t.token {\n\t\tbackground:\n\t\t\tvar(--lol-token-background-gradient) padding-box,\n\t\t\tvar(--lol-token-border-gradient) border-box;\n\n\t\t--lol-token-border-gradient: var(--lol-gradient-hextech);\n\t\t--lol-token-background-gradient: var(--lol-gradient-grey-300);\n\n\t\tborder: 1px solid transparent;\n\t\tborder-radius: 9999px;\n\t\tpadding: 0 0.4rem;\n\n\t\t/ Inline, so a token flows with the text it sits between and wraps with\n\t\t it; inline-block would still be one atom but cannot break onto the next\n\t\t line as a run of text does around it. /\n\t\tdisplay: inline;\n\t\tcolor: var(--lol-color-blue-100);\n\t\twhite-space: nowrap;\n\n\t\t&.hextech {\n\t\t\t--lol-token-border-gradient: var(--lol-gradient-hextech);\n\t\t\tcolor: var(--lol-color-blue-100);\n\t\t}\n\n\t\t&.gold {\n\t\t\t--lol-token-border-gradient: var(--lol-gradient-gold);\n\t\t\tcolor: var(--lol-color-gold-300);\n\t\t}\n\n\t\t&.grey {\n\t\t\t--lol-token-border-gradient: var(--lol-color-grey-100);\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t}\n\n\t\t/ `userSelect: all` makes a token select as one atom, so the selected\n\t\t state is all-or-nothing and can be painted as such. /\n\t\t&[data-selected] {\n\t\t\t--lol-token-background-gradient: var(--lol-gradient-gold-hover);\n\t\t\tcolor: var(--lol-color-hextech-black);\n\t\t}\n\n\t\t&[data-disabled] {\n\t\t\t--lol-token-border-gradient: var(--lol-gradient-disabled);\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t}\n\t}\n}\n","\"use client\";\n\nimport { cva, cx } from \"cva\";\nimport {\n\tToken as AriaToken,\n\tTokenField as AriaTokenField,\n\ttype TokenFieldProps as AriaTokenFieldProps,\n\tTokenInput as AriaTokenInput,\n\ttype TokenInputProps as AriaTokenInputProps,\n\ttype TokenProps as AriaTokenProps,\n\tcomposeRenderProps,\n\ttype TokenFieldValue,\n} from \"react-aria-components\";\nimport classes from \"./token-field.module.css\";\n\n// The value is a `TokenFieldValue`, not a string: a list of `text` and `token`\n// segments the field edits in place. Subclass it to tokenize as the user types\n// (see `TokenFieldValue.tokenize` in the docs), or hand it segments built\n// elsewhere — from a menu selection, say.\nexport { TokenFieldValue } from \"react-aria-components\";\n\n/\n A text field with inline, non-editable tokens: an `@summoner` mention, a\n * `#tag`, a champion picked from a menu. Text and tokens share one caret, so it\n * reads and edits as a single field rather than as an input with chips beside\n * it.\n \n ```tsx\n * <TokenField value={value} onChange={setValue}>\n * <Label>Prompt</Label>\n * <TokenInput placeholder=\"Mention a @summoner\">\n * {(segment) => <Token>{segment.text}</Token>}\n * </TokenInput>\n * </TokenField>\n * ```\n \n This is React Aria's own note, and it holds here too: `TokenField` is alpha\n * upstream, so its API may still move under us.\n /\nexport function TokenField<T extends TokenFieldValue = TokenFieldValue>({\n\tclassName,\n\t...props\n}: AriaTokenFieldProps<T>) {\n\treturn (\n\t\t<AriaTokenField<T>\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.tokenField, className),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport const tokenInput = cva({\n\tbase: classes.input,\n\tvariants: {\n\t\tsize: {\n\t\t\tsmall: classes.small,\n\t\t\tmedium: classes.medium,\n\t\t\tlarge: classes.large,\n\t\t},\n\t},\n\tdefaultVariants: { size: \"medium\" },\n});\n\nexport interface TokenInputProps<T extends TokenFieldValue = TokenFieldValue>\n\textends AriaTokenInputProps<T> {\n\tsize?: \"small\" \| \"medium\" \| \"large\";\n\t/* Shown while the field is empty; painted by the field, not by the UA. /\n\tplaceholder?: string;\n}\n\n/* The editable area of a `TokenField`, rendering a `Token` per token segment. /\nexport function TokenInput<T extends TokenFieldValue = TokenFieldValue>({\n\tclassName,\n\tplaceholder,\n\tsize = \"medium\",\n\t...props\n}: TokenInputProps<T>) {\n\treturn (\n\t\t<AriaTokenInput<T>\n\t\t\tdata-placeholder={placeholder}\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\ttokenInput({ className, size }),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport const token = cva({\n\tbase: classes.token,\n\tvariants: {\n\t\tvariant: {\n\t\t\tgold: classes.gold,\n\t\t\thextech: classes.hextech,\n\t\t\tgrey: classes.grey,\n\t\t},\n\t},\n\tdefaultVariants: { variant: \"hextech\" },\n});\n\nexport interface TokenProps extends AriaTokenProps {\n\tvariant?: \"gold\" \| \"hextech\" \| \"grey\";\n}\n\n/* One non-editable segment inside a `TokenInput`. /\nexport function Token({\n\tclassName,\n\tvariant = \"hextech\",\n\t...props\n}: TokenProps) {\n\treturn (\n\t\t<AriaToken\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\ttoken({ className, variant }),\n\t\t\t)}\n\t\t/>\n\t);\n}\n","@layer lol {\n\t.toolbar {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tgap: 0.5rem;\n\n\t\t/\n\t\t * Controls keep their own width in a vertical toolbar; stretching them\n\t\t * blows up anything sized by aspect ratio, like square/round buttons.\n\t\t /\n\t\t&[data-orientation=\"vertical\"] {\n\t\t\tflex-direction: column;\n\t\t\talign-items: flex-start;\n\t\t}\n\t}\n\n\t.separator {\n\t\tborder: none;\n\t\t/ An <hr> when horizontal: the UA gives it block margins and a grey\n\t\t `color`. /\n\t\tmargin: 0;\n\t\tcolor: inherit;\n\t\tflex: none;\n\t\talign-self: stretch;\n\t\theight: 1px;\n\t\tbackground-image: linear-gradient(\n\t\t\tto right,\n\t\t\trgba(0, 0, 0, 0),\n\t\t\tvar(--lol-color-gold-600),\n\t\t\trgba(0, 0, 0, 0)\n\t\t);\n\n\t\t/ A vertical separator renders as a <div>, so it has no implicit size. /\n\t\t&[aria-orientation=\"vertical\"] {\n\t\t\theight: auto;\n\t\t\twidth: 1px;\n\t\t\tbackground-image: linear-gradient(\n\t\t\t\tto bottom,\n\t\t\t\trgba(0, 0, 0, 0),\n\t\t\t\tvar(--lol-color-gold-600),\n\t\t\t\trgba(0, 0, 0, 0)\n\t\t\t);\n\t\t}\n\t}\n}\n","\"use client\";\n\nimport { cx } from \"cva\";\nimport {\n\tSeparator as AriaSeparator,\n\ttype SeparatorProps as AriaSeparatorProps,\n\tToolbar as AriaToolbar,\n\ttype ToolbarProps as AriaToolbarProps,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport classes from \"./toolbar.module.css\";\n\nexport interface ToolbarProps extends AriaToolbarProps {}\n\nexport function Toolbar({ className, ...props }: ToolbarProps) {\n\treturn (\n\t\t<AriaToolbar\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.toolbar, className),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport interface ToolbarSeparatorProps extends AriaSeparatorProps {}\n\n/\n Separates groups of controls inside a `Toolbar`. Defaults to the orientation\n * that crosses a horizontal toolbar; pass `orientation=\"horizontal\"` when the\n * toolbar itself is vertical.\n /\nexport function ToolbarSeparator({\n\tclassName,\n\torientation = \"vertical\",\n\t...props\n}: ToolbarSeparatorProps) {\n\treturn (\n\t\t<AriaSeparator\n\t\t\t{...props}\n\t\t\torientation={orientation}\n\t\t\tclassName={cx(classes.separator, className)}\n\t\t/>\n\t);\n}\n","@layer lol {\n\t.tree {\n\t\t--lol-tree-indent: 1.125rem;\n\n\t\tbox-sizing: border-box;\n\t\toverflow: auto;\n\t\toutline: none;\n\n\t\tfont-family: var(--lol-font-family-spiegel);\n\t\tfont-size: var(--lol-font-size-sm);\n\t\tline-height: var(--lol-line-height-sm);\n\t\tletter-spacing: var(--lol-letter-spacing-sm);\n\t\tfont-weight: var(--lol-font-weight-sm);\n\n\t\t&[data-focus-visible] {\n\t\t\toutline: 1px solid var(--lol-color-gold-400);\n\t\t\toutline-offset: 0.25rem;\n\t\t}\n\t}\n\n\t.item {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tgap: 0.375rem;\n\t\t/ Rows are flattened siblings, so the nesting comes from the level react\n\t\t aria exposes on each row rather than from the DOM. /\n\t\tpadding: 0.375rem 0.75rem 0.375rem\n\t\t\tcalc(0.5rem + (var(--tree-item-level) - 1) var(--lol-tree-indent));\n\t\tcolor: var(--lol-color-grey-100);\n\t\toutline: none;\n\t\tcursor: default;\n\t\ttransition: color 0.3s ease;\n\n\t\t/* Every decoration is a background layer so the row keeps a single box:\n\t\t the chevron and the checkbox already own the inline start. /\n\t\t--lol-tree-item-spine: none;\n\t\t--lol-tree-item-hover: none;\n\t\t--lol-tree-item-highlight: none;\n\n\t\tbackground-image:\n\t\t\tvar(--lol-tree-item-spine), var(--lol-tree-item-hover),\n\t\t\tvar(--lol-tree-item-highlight);\n\t\tbackground-repeat: no-repeat;\n\n\t\t@media (prefers-reduced-motion: reduce) {\n\t\t\ttransition: none;\n\t\t}\n\n\t\t/ Branches read as the client's collapsible section headers, leaves as\n\t\t list content. /\n\t\t&[data-has-child-items] {\n\t\t\tfont-family: var(--lol-font-family-beaufort);\n\t\t\tfont-size: 0.75rem;\n\t\t\tfont-weight: 700;\n\t\t\tletter-spacing: 0.075em;\n\t\t\tline-height: 1rem;\n\t\t\ttext-transform: uppercase;\n\t\t\tcolor: var(--lol-color-gold-300);\n\t\t}\n\n\t\t&[data-selection-mode]:not([data-disabled]),\n\t\t&[data-href] {\n\t\t\tcursor: pointer;\n\t\t}\n\n\t\t&[data-hovered] {\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t\t--lol-tree-item-hover: linear-gradient(\n\t\t\t\t90deg,\n\t\t\t\trgb(from var(--lol-color-gold-100) r g b / 0.08),\n\t\t\t\ttransparent\n\t\t\t);\n\t\t}\n\n\t\t&[data-selected] {\n\t\t\tcolor: var(--lol-color-gold-100);\n\t\t\t/ Gold spine plus hextech wash on the selected row, matching the\n\t\t\t client's \"current\" row. /\n\t\t\t--lol-tree-item-spine: linear-gradient(\n\t\t\t\t90deg,\n\t\t\t\tvar(--lol-color-gold-500) 0 0.25rem,\n\t\t\t\ttransparent 0.25rem\n\t\t\t);\n\t\t\t--lol-tree-item-highlight: linear-gradient(\n\t\t\t\t90deg,\n\t\t\t\trgb(from var(--lol-color-blue-400) r g b / 0.55),\n\t\t\t\trgb(from var(--lol-color-blue-300) r g b / 0.1)\n\t\t\t);\n\t\t}\n\n\t\t&[data-disabled] {\n\t\t\tcolor: var(--lol-color-grey-150);\n\t\t\tcursor: default;\n\t\t}\n\n\t\t&[data-focus-visible] {\n\t\t\toutline: 1px solid var(--lol-color-gold-400);\n\t\t\toutline-offset: -1px;\n\t\t}\n\t}\n\n\t/ Top-level items are separated by the client's faint gold hairline. The\n\t sibling combinator keeps it off the first row, whichever level follows. /\n\t.item + .item[data-level=\"1\"] {\n\t\tborder-top: 1px solid var(--lol-color-gold-600);\n\t}\n\n\t.chevron {\n\t\t/ A <button> we never paint: without this it falls back to the UA's\n\t\t `buttonface` slab, which is grey under `color-scheme: dark`. /\n\t\tappearance: none;\n\t\tborder: 0;\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t\tfont: inherit;\n\t\tletter-spacing: inherit;\n\t\tcolor: inherit;\n\n\t\tflex: none;\n\t\twidth: 0.5rem;\n\t\theight: 0.75rem;\n\t\toutline: none;\n\t\tcursor: pointer;\n\n\t\t--lol-tree-chevron: url(\"./tree-chevron.png\");\n\t\tbackground: var(--lol-tree-chevron) no-repeat center / contain;\n\t\ttransition: rotate 0.15s ease;\n\n\t\t@media (prefers-reduced-motion: reduce) {\n\t\t\ttransition: none;\n\t\t}\n\n\t\t&[data-focus-visible] {\n\t\t\toutline: 1px solid var(--lol-color-gold-400);\n\t\t\toutline-offset: 0.125rem;\n\t\t}\n\t}\n\n\t.chevronSpacer {\n\t\tflex: none;\n\t\twidth: 0.5rem;\n\t}\n\n\t.item[data-expanded] .chevron {\n\t\trotate: 90deg;\n\t}\n\n\t.item[data-hovered] .chevron,\n\t.chevron[data-hovered],\n\t.chevron[data-focus-visible] {\n\t\t--lol-tree-chevron: url(\"./tree-chevron-hover.png\");\n\t}\n\n\t.item[data-disabled] .chevron {\n\t\tcursor: default;\n\t\tfilter: grayscale(100%);\n\t}\n\n\t.label {\n\t\tflex: 1;\n\t\tmin-width: 0;\n\t\toverflow: hidden;\n\t\twhite-space: nowrap;\n\t\ttext-overflow: ellipsis;\n\t}\n\n\t.empty {\n\t\tpadding: 1rem 0.75rem;\n\t\ttext-align: center;\n\t}\n\n\t.loadMore {\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\tpadding: 0.5rem;\n\t}\n\n\t.spinner {\n\t\twidth: 1.5rem;\n\t}\n}\n","import { cva, cx } from \"cva\";\nimport {\n\tButton as AriaButton,\n\tTree as AriaTree,\n\tTreeItem as AriaTreeItem,\n\tTreeItemContent as AriaTreeItemContent,\n\ttype TreeItemContentProps as AriaTreeItemContentProps,\n\ttype TreeItemProps as AriaTreeItemProps,\n\tTreeLoadMoreItem as AriaTreeLoadMoreItem,\n\ttype TreeLoadMoreItemProps as AriaTreeLoadMoreItemProps,\n\ttype TreeProps as AriaTreeProps,\n\tcomposeRenderProps,\n} from \"react-aria-components\";\nimport { Checkbox } from \"../checkbox/checkbox\";\nimport { Spinner } from \"../spinner/spinner\";\nimport { text } from \"../typography/text\";\nimport classes from \"./tree.module.css\";\n\nexport const tree = cva({\n\tbase: classes.tree,\n});\n\nexport interface TreeProps<T> extends AriaTreeProps<T> {\n\t/* Rendered when the tree has no items. /\n\temptyState?: React.ReactNode;\n}\n\nexport function Tree<T extends object>({\n\tclassName,\n\temptyState = \"No results found\",\n\trenderEmptyState,\n\t...props\n}: TreeProps<T>) {\n\treturn (\n\t\t<AriaTree<T>\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\ttree({ className }),\n\t\t\t)}\n\t\t\trenderEmptyState={\n\t\t\t\trenderEmptyState ??\n\t\t\t\t(() => (\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={text({\n\t\t\t\t\t\t\tcolor: \"grey150\",\n\t\t\t\t\t\t\tpreset: \"base\",\n\t\t\t\t\t\t\tclassName: classes.empty,\n\t\t\t\t\t\t})}\n\t\t\t\t\t>\n\t\t\t\t\t\t{emptyState}\n\t\t\t\t\t</div>\n\t\t\t\t))\n\t\t\t}\n\t\t/>\n\t);\n}\n\nexport const treeItem = cva({\n\tbase: classes.item,\n});\n\nexport interface TreeItemProps<T = object> extends AriaTreeItemProps<T> {}\n\nexport function TreeItem<T = object>({\n\tclassName,\n\t...props\n}: TreeItemProps<T>) {\n\treturn (\n\t\t<AriaTreeItem<T>\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\ttreeItem({ className }),\n\t\t\t)}\n\t\t/>\n\t);\n}\n\nexport interface TreeItemContentProps extends AriaTreeItemContentProps {}\n\n/\n The row of a `TreeItem`, holding everything but its nested items.\n \n The expand chevron is added for items that have children, and a selection\n * checkbox for trees with `selectionMode=\"multiple\"`. Setting\n * `selectionBehavior=\"replace\"` drops the checkbox in favour of highlighting\n * the row, like the ladder in the League client.\n /\nexport function TreeItemContent({ children }: TreeItemContentProps) {\n\treturn (\n\t\t<AriaTreeItemContent>\n\t\t\t{composeRenderProps(\n\t\t\t\tchildren,\n\t\t\t\t(children, { hasChildItems, selectionBehavior, selectionMode }) => (\n\t\t\t\t\t<>\n\t\t\t\t\t\t{hasChildItems ? (\n\t\t\t\t\t\t\t<AriaButton className={classes.chevron} slot=\"chevron\" />\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t/ Leaves keep the chevron's footprint so labels stay aligned. */\n\t\t\t\t\t\t\t<span aria-hidden=\"true\" className={classes.chevronSpacer} />\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{selectionMode === \"multiple\" && selectionBehavior === \"toggle\" && (\n\t\t\t\t\t\t\t<Checkbox slot=\"selection\" />\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<span className={classes.label}>{children}</span>\n\t\t\t\t\t</>\n\t\t\t\t),\n\t\t\t)}\n\t\t</AriaTreeItemContent>\n\t);\n}\n\nexport interface TreeLoadMoreItemProps extends AriaTreeLoadMoreItemProps {}\n\nexport function TreeLoadMoreItem({\n\tchildren,\n\tclassName,\n\t...props\n}: TreeLoadMoreItemProps) {\n\treturn (\n\t\t<AriaTreeLoadMoreItem\n\t\t\t{...props}\n\t\t\tclassName={composeRenderProps(className, (className) =>\n\t\t\t\tcx(classes.loadMore, className),\n\t\t\t)}\n\t\t>\n\t\t\t{children ?? <Spinner className={classes.spinner} />}\n\t\t</AriaTreeLoadMoreItem>\n\t);\n}\n"],"mappings":"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"}