@stackone/malachite 2.42.1 → 2.43.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.
- package/COMPONENTS.md +3 -3
- package/README.md +7 -0
- package/dist/components/ActionMenu.js +70 -70
- package/dist/components/ActionMenu.js.map +1 -1
- package/dist/components/CardStrip.js +179 -172
- package/dist/components/CardStrip.js.map +1 -1
- package/dist/components/Chat/ChatModelPicker.js +74 -73
- package/dist/components/Chat/ChatModelPicker.js.map +1 -1
- package/dist/components/Dropdown.js +463 -440
- package/dist/components/Dropdown.js.map +1 -1
- package/dist/components/MultiSelect.js +218 -213
- package/dist/components/MultiSelect.js.map +1 -1
- package/dist/components/Popover.js +102 -102
- package/dist/components/Popover.js.map +1 -1
- package/dist/components/QueryInput.js +65 -65
- package/dist/components/QueryInput.js.map +1 -1
- package/dist/components/SelectableCard.js +194 -168
- package/dist/components/SelectableCard.js.map +1 -1
- package/dist/components/Tooltip.js +100 -93
- package/dist/components/Tooltip.js.map +1 -1
- package/dist/components/focusRing.js +7 -6
- package/dist/components/focusRing.js.map +1 -1
- package/dist/components/overlayBehaviour.js +145 -94
- package/dist/components/overlayBehaviour.js.map +1 -1
- package/dist/components/overlayLayers.js +34 -0
- package/dist/components/overlayLayers.js.map +1 -0
- package/dist/components/portalOverlay.js.map +1 -1
- package/dist/index.d.ts +10 -0
- package/dist/tailwind.css.js +1 -1
- package/package.json +4 -3
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CardStrip.js","sources":["../../src/components/CardStrip.tsx"],"sourcesContent":["import React, { useCallback, useLayoutEffect, useRef, useState } from 'react';\nimport ArrowLeftIcon from './CustomIcons/ArrowLeftIcon';\nimport ForwardArrowIcon from './CustomIcons/ForwardArrowIcon';\nimport PlusIcon from './CustomIcons/PlusIcon';\nimport { CONTENT_INSET } from './PageLayout/constants';\nimport {\n CARD_FLARE_PX,\n CARD_FLARE_TIP_PX,\n CARD_WIDTH_PX,\n FLARE_CLASS,\n STRIP_RULE_PX,\n} from './SelectableCard';\nimport {\n EDGE_EPSILON_PX,\n isCardInView,\n pageTargetFor,\n revealTargetFor,\n} from './cardStripGeometry';\nimport { CardStripSlotContext, PINNED_SLOT, SCROLLED_SLOT } from './cardStripSlot';\nimport { FOCUS_RING } from './focusRing';\nimport { useAdoptedStyleSheet } from './useAdoptedStyleSheet';\n\nexport type CardStripAddTileEmphasis = 'primary' | 'secondary';\n\nexport interface CardStripAddTileProps {\n /** Visible label, e.g. \"Add Profile\". Also names the button for assistive tech. */\n label: string;\n /** Defaults to a plus. */\n icon?: React.ReactNode;\n onClick: () => void;\n disabled?: boolean;\n /** Leave unset: CardStrip picks `primary` while the strip is empty and `secondary` once cards exist. */\n emphasis?: CardStripAddTileEmphasis;\n className?: string;\n}\n\n/** Palette for the strip's rule. Pass the tone of whatever card is selected. */\nexport type CardStripTone = 'profile' | 'library' | 'editing';\n\nexport interface CardStripProps {\n /** The selected card's value, matched against each radio child's `data-value`. */\n value: string;\n /** Overrides the palette the strip reads off the selected card. See `CardStripTone`. */\n tone?: CardStripTone;\n onChange: (value: string) => void;\n /** Cards. Any element with `role=\"radio\"` and a `data-value` joins the group; an\n * add tile must be a direct child or it scrolls with the cards. */\n children: React.ReactNode;\n /** Pinned, non-scrolling slot before the cards (the Library card in the profile picker). */\n leading?: React.ReactNode;\n /** Circular scroll affordances, shown only on an edge that can actually scroll. */\n arrows?: boolean;\n /** Fade the cards out at any edge they scroll past. */\n fadeEdges?: boolean;\n /** Snap cards to the leading edge as the strip scrolls. */\n snap?: boolean;\n /** Run the bottom rule the full width of the page card while the cards stay on the gutter.\n * Only has an effect inside a layout that publishes its inset (`PageLayout`). */\n bleed?: boolean;\n /** Whether a selection change scrolls the selected card into view. The strip's opening\n * selection is placed instantly; later ones slide, unless motion is reduced. Set `false`\n * when the value comes from a URL, or a deep-linked strip below the fold jumps the page\n * on load. */\n scrollSelectedIntoView?: boolean;\n 'aria-label'?: string;\n 'aria-labelledby'?: string;\n className?: string;\n style?: React.CSSProperties;\n}\n\n/** Arrow keys move AND select, per the WAI-ARIA radiogroup pattern. */\nconst NAV_KEYS = new Set(['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown', 'Home', 'End']);\n\nconst RADIO_SELECTOR = '[role=\"radio\"]';\nconst SCROLLER_ATTR = 'data-card-strip-scroller';\nconst TROUGH_ATTR = 'data-card-strip-trough';\nconst ROOT_CLASS = 'malachite-card-strip';\nconst SCROLLER_CLASS = 'malachite-card-strip-scroller';\nconst FADE_CLASS = 'malachite-card-strip-fade';\nconst ADD_TILE_CLASS = 'malachite-card-strip-add-tile';\nconst ADD_SLOT_ATTR = 'data-card-strip-add-slot';\n\nconst ACTIONS_SELECTOR = '[data-selectable-card-actions]';\nconst FOCUSABLE_SELECTOR =\n 'a[href], area[href], button, input, select, textarea, iframe, [contenteditable=\"true\"], [tabindex]';\nconst PREV_TABINDEX_ATTR = 'data-card-strip-prev-tabindex';\n\nconst FADE_WIDTH_PX = 80;\n\nconst ARROW_GLYPH_PX = 11;\nconst GUTTER_REST_PX = 12;\n\nconst LIP_SHADOW = 'var(--malachite-shadow-default)';\nconst ARROW_BACKGROUND =\n 'var(--malachite-card-strip-arrow-background, var(--malachite-card-background, #ffffff))';\nconst ARROW_BORDER = 'var(--malachite-card-strip-arrow-border, #e8e8e8)';\nconst TROUGH_BACKGROUND = 'var(--malachite-card-strip-background, #f1f1f1)';\nconst CARD_CORNER = 'var(--malachite-radius-xxl, 14px)';\nconst CARD_RADIUS = `${CARD_CORNER} ${CARD_CORNER} 0 0`;\nconst TROUGH_CORNER = 'var(--malachite-radius-xxxl, 16px)';\nconst TROUGH_RADIUS = `${TROUGH_CORNER} ${TROUGH_CORNER} 0 0`;\nconst TROUGH_SHOULDER_PX = 4;\n// Fills the gap between the edge card and its neighbour, covering neither.\nconst ARROW_OFFSET_PX = GUTTER_REST_PX + TROUGH_SHOULDER_PX;\n// Any wider and the fade paints over the neighbouring slot.\nconst FADE_OVERHANG_PX = GUTTER_REST_PX;\nconst FADE_RAMP_PX = FADE_WIDTH_PX + (FADE_OVERHANG_PX - TROUGH_SHOULDER_PX);\nconst SLOT_WIDTH_PX = CARD_WIDTH_PX;\nconst TROUGH_FLOOR_PX = 2 * (GUTTER_REST_PX + TROUGH_SHOULDER_PX) + SLOT_WIDTH_PX;\nconst DIVIDER_COLOR = 'var(--malachite-card-strip-divider, #dddddd)';\nconst FADE_COLOR = 'var(--malachite-card-strip-fade, transparent)';\nconst ADD_HOVER_BACKGROUND = 'var(--malachite-selectable-card-hover-background, #e8e8e8)';\nconst ADD_PILL_BORDER = 'var(--malachite-card-strip-arrow-border, #e8e8e8)';\nconst ADD_PILL_BORDER_ACTIVE = 'var(--malachite-selectable-card-hover-rule, #bbbbbb)';\nconst ADD_PILL_SHADOW_DEEP = '0px 1px 0px 0px rgba(0, 0, 0, 0.4)';\nconst ADD_PILL_BACKGROUND = 'var(--malachite-card-background, #ffffff)';\nconst ADD_PILL_FOREGROUND = 'var(--malachite-text-primary, #0a0a0a)';\nconst ADD_PILL_PRIMARY_BACKGROUND =\n 'var(--malachite-card-strip-add-primary-background, var(--malachite-text-primary, #0a0a0a))';\nconst ADD_PILL_PRIMARY_FOREGROUND =\n 'var(--malachite-card-strip-add-primary-foreground, var(--malachite-card-background, #ffffff))';\nconst ADD_PILL_PRIMARY_SHADOW = '0px 1px 0px 0px rgba(10, 10, 10, 0.7)';\n\nconst BOTTOM_RULE_WEIGHT_PX = STRIP_RULE_PX;\n\nconst OVERFLOW_INSET_PX = 16;\n\nconst CLIP_SLACK_PX = 9999;\nconst FOCUS_RING_REACH_PX = 4;\n\n/** A sheet, not inline styles: these rules have to reach children this component does not render. */\nconst SCROLLER_CSS = `\n.${ROOT_CLASS} {\n clip-path: inset(-${CLIP_SLACK_PX}px -${CLIP_SLACK_PX}px 0);\n}\n.${ROOT_CLASS}:has(:focus-visible) {\n clip-path: inset(-${CLIP_SLACK_PX}px -${CLIP_SLACK_PX}px -${FOCUS_RING_REACH_PX}px);\n}\n.${SCROLLER_CLASS} {\n display: flex;\n flex-wrap: nowrap;\n overflow-x: auto;\n overflow-y: hidden;\n scroll-behavior: smooth;\n scrollbar-width: none;\n -ms-overflow-style: none;\n padding-block: ${OVERFLOW_INSET_PX}px;\n margin-block: -${OVERFLOW_INSET_PX}px;\n /* overflow-x clips both axes, so the end cards would lose a flare; the negative margin trades\n the padding back out and scroll-padding keeps the rest position at zero. */\n padding-inline: ${CARD_FLARE_PX}px;\n margin-inline: -${CARD_FLARE_PX}px;\n scroll-padding-inline: ${CARD_FLARE_PX}px;\n}\n/* A card focused at a faded edge has to stay readable, so the fade lifts entirely. */\n.${ROOT_CLASS}:has(:focus-visible) .${FADE_CLASS} {\n display: none;\n}\n.${SCROLLER_CLASS}::-webkit-scrollbar {\n display: none;\n}\n/* No bottom edge: the strip's rule is the baseline for the add tile as much as for a card. */\n.${ADD_TILE_CLASS} > * {\n background: ${TROUGH_BACKGROUND};\n border-radius: ${CARD_RADIUS};\n}\n.${ADD_TILE_CLASS}:hover:not(:has(button:disabled)) > * {\n background: ${ADD_HOVER_BACKGROUND};\n}\n.${ADD_TILE_CLASS} button:active:not(:disabled) {\n opacity: 0.8;\n}\n.${ADD_TILE_CLASS}:has(button:active) > * {\n background: ${TROUGH_BACKGROUND};\n}\n.${ADD_TILE_CLASS}[data-emphasis='secondary'] button {\n border-color: ${ADD_PILL_BORDER};\n box-shadow: ${LIP_SHADOW};\n}\n.${ADD_TILE_CLASS}[data-emphasis='secondary']:hover:not(:has(button:disabled)) button {\n border-color: ${ADD_PILL_BORDER_ACTIVE};\n box-shadow: ${ADD_PILL_SHADOW_DEEP};\n}\n.${ADD_TILE_CLASS}[data-emphasis='secondary'] button:active:not(:disabled) {\n border-color: ${ADD_PILL_BORDER_ACTIVE};\n box-shadow: ${ADD_PILL_SHADOW_DEEP};\n}\n.${ADD_TILE_CLASS}[data-emphasis='primary'] button {\n border-color: transparent;\n box-shadow: ${ADD_PILL_PRIMARY_SHADOW};\n}\n.${SCROLLER_CLASS} > * {\n flex: 0 0 auto;\n min-width: 0;\n}\n.${SCROLLER_CLASS} > * + * {\n border-left: 1px solid ${DIVIDER_COLOR};\n}\n.${SCROLLER_CLASS}[data-snap='true'] {\n scroll-snap-type: x proximity;\n}\n.${SCROLLER_CLASS}[data-snap='true'] > * {\n scroll-snap-align: start;\n}\n@media (prefers-reduced-motion: reduce) {\n .${SCROLLER_CLASS} {\n scroll-behavior: auto;\n }\n .${SCROLLER_CLASS}[data-snap='true'] {\n scroll-snap-type: none;\n }\n .${SCROLLER_CLASS}[data-snap='true'] > * {\n scroll-snap-align: none;\n }\n}`;\n\nconst STYLE_ID = 'malachite-card-strip-style';\n// Its own id: an older malachite copy on the page may already own STYLE_ID without these rules.\nconst ADD_SLOT_STYLE_ID = 'malachite-card-strip-add-slot';\n// In the track the trough is already the tile's shoulder, and it is no card to rule off.\nconst ADD_SLOT_CSS = `\n.${SCROLLER_CLASS} > [${ADD_SLOT_ATTR}] {\n display: flex;\n border-left: none;\n}\n[${ADD_SLOT_ATTR}] > .${ADD_TILE_CLASS} {\n height: 100% !important;\n padding: 0 !important;\n}\n`;\n\n/** `window.matchMedia` is absent under SSR and in older test environments. */\nconst prefersReducedMotion = (): boolean => {\n if (typeof window === 'undefined' || typeof window.matchMedia !== 'function') {\n return true;\n }\n return window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n};\n\nconst radioValue = (radio: HTMLElement): string | null =>\n radio.dataset.value ?? radio.getAttribute('value');\n\nconst isRadioDisabled = (radio: HTMLElement): boolean =>\n radio.hasAttribute('disabled') || radio.getAttribute('aria-disabled') === 'true';\n\nconst actionsFor = (radio: HTMLElement): HTMLElement | null => {\n const card = radio.parentElement;\n if (!card || card.querySelectorAll(RADIO_SELECTOR).length !== 1) {\n return null;\n }\n return card.querySelector<HTMLElement>(ACTIONS_SELECTOR);\n};\n\n/** A card is wider than its radio, so `closest` misses clicks on the count row. */\nconst radioForClick = (target: Element, root: Element): HTMLElement | null => {\n const direct = target.closest<HTMLElement>(RADIO_SELECTOR);\n if (direct) {\n return direct;\n }\n if (target.closest(ACTIONS_SELECTOR)) {\n return null;\n }\n let node: Element | null = target;\n while (node && root.contains(node)) {\n const radios: NodeListOf<HTMLElement> = node.querySelectorAll(RADIO_SELECTOR);\n if (radios.length === 1 && radios[0].parentElement === node) {\n return radios[0];\n }\n node = node.parentElement;\n }\n return null;\n};\n\nconst actionControls = (radio: HTMLElement): HTMLElement[] => {\n const actions = actionsFor(radio);\n return actions ? Array.from(actions.querySelectorAll<HTMLElement>(FOCUSABLE_SELECTOR)) : [];\n};\n\nconst suppressTabStop = (element: HTMLElement): void => {\n if (!element.hasAttribute(PREV_TABINDEX_ATTR)) {\n element.setAttribute(PREV_TABINDEX_ATTR, element.getAttribute('tabindex') ?? '');\n }\n element.setAttribute('tabindex', '-1');\n};\n\nconst restoreTabStop = (element: HTMLElement): void => {\n if (!element.hasAttribute(PREV_TABINDEX_ATTR)) {\n return;\n }\n const previous = element.getAttribute(PREV_TABINDEX_ATTR);\n element.removeAttribute(PREV_TABINDEX_ATTR);\n if (previous) {\n element.setAttribute('tabindex', previous);\n } else {\n element.removeAttribute('tabindex');\n }\n};\n\nconst TONE_RULE: Record<CardStripTone, string> = {\n profile: 'var(--malachite-selectable-card-selected-border, #047b43)',\n library: 'var(--malachite-selectable-card-library-selected-border, #bbbbbb)',\n editing: 'var(--malachite-selectable-card-pending-foreground, #96580a)',\n};\nconst RULE_ROW_STYLE: React.CSSProperties = {\n backgroundRepeat: 'no-repeat',\n backgroundPosition: 'left bottom',\n backgroundSize: `100% ${BOTTOM_RULE_WEIGHT_PX}px`,\n};\n\n/** The rule runs under the flare's tip rather than butting against it, so antialiasing\n * cannot open the junction into a gap. */\nconst RULE_GAP_OVERLAP_PX = 0.5;\n\nconst FLARE_TIP_INSET_PX = CARD_FLARE_PX - CARD_FLARE_TIP_PX;\n\nconst flareTips = (card: HTMLElement): { left: number; right: number } | null => {\n const flare = card.querySelector(`:scope > .${FLARE_CLASS}`);\n if (!flare) {\n return null;\n }\n const { left, right } = flare.getBoundingClientRect();\n return { left: left + FLARE_TIP_INSET_PX, right: right - FLARE_TIP_INSET_PX };\n};\n\n/** The rule is cut where the selected card stands, never covered: the strip's clip lands on the\n * rule's own edge, so a cover takes the same partial alpha and the rule bleeds through it. */\nconst paintRule = (\n root: HTMLElement | null,\n scroller: HTMLElement | null,\n card: HTMLElement | null | undefined,\n tone: CardStripTone,\n): void => {\n if (!root) {\n return;\n }\n const colour = TONE_RULE[tone];\n const rootRect = root.getBoundingClientRect();\n const rootLeft = rootRect.left;\n const clip = card && scroller?.contains(card) ? scroller.getBoundingClientRect() : rootRect;\n const cardRect = card?.getBoundingClientRect();\n const tips = card ? flareTips(card) : null;\n const tipLeft = tips?.left ?? (cardRect ? cardRect.left - CARD_FLARE_TIP_PX : 0);\n const tipRight = tips?.right ?? (cardRect ? cardRect.right + CARD_FLARE_TIP_PX : 0);\n const from = cardRect ? Math.max(tipLeft, clip.left) + RULE_GAP_OVERLAP_PX - rootLeft : 0;\n const to = cardRect ? Math.min(tipRight, clip.right) - RULE_GAP_OVERLAP_PX - rootLeft : 0;\n\n root.style.backgroundImage =\n to > from\n ? `linear-gradient(to right, ${colour} 0 ${from}px, transparent ${from}px ${to}px, ${colour} ${to}px 100%)`\n : `linear-gradient(to right, ${colour} 0 100%)`;\n};\n\nconst BLEED_STYLE: React.CSSProperties = {\n marginInline: `calc(${CONTENT_INSET} * -1)`,\n paddingInline: CONTENT_INSET,\n};\n\n/** The rule's row is a margin, never padding: a background paints under its own padding, which\n * would hide the very line the troughs stand on. */\nconst TROUGH_SURFACE: React.CSSProperties = {\n background: TROUGH_BACKGROUND,\n borderRadius: TROUGH_RADIUS,\n paddingTop: `${TROUGH_SHOULDER_PX}px`,\n paddingInline: `${TROUGH_SHOULDER_PX}px`,\n marginBottom: `${BOTTOM_RULE_WEIGHT_PX}px`,\n};\nconst TROUGH_STYLE: React.CSSProperties = {\n ...TROUGH_SURFACE,\n marginInline: `${GUTTER_REST_PX}px`,\n};\nconst ADD_TILE_SHAPE_STYLE: React.CSSProperties = TROUGH_SURFACE;\n\nconst PINNED_SLOT_STYLE: React.CSSProperties = TROUGH_SURFACE;\n\nconst EMPTY_ADD_SLOT_STYLE: React.CSSProperties = {\n marginInlineStart: `${GUTTER_REST_PX}px`,\n};\n\nconst ADD_PILL_FILL: Record<CardStripAddTileEmphasis, React.CSSProperties> = {\n primary: {\n backgroundColor: ADD_PILL_PRIMARY_BACKGROUND,\n color: ADD_PILL_PRIMARY_FOREGROUND,\n },\n secondary: { backgroundColor: ADD_PILL_BACKGROUND, color: ADD_PILL_FOREGROUND },\n};\n\nconst AddTile: React.FC<CardStripAddTileProps> = ({\n label,\n icon,\n onClick,\n disabled = false,\n emphasis = 'secondary',\n className = '',\n}) => (\n <div\n className={ADD_TILE_CLASS}\n data-emphasis={emphasis}\n style={{\n ...ADD_TILE_SHAPE_STYLE,\n width: `${SLOT_WIDTH_PX}px`,\n height: `calc(100% - ${BOTTOM_RULE_WEIGHT_PX}px)`,\n }}\n >\n <div className=\"flex h-full items-center justify-center px-4\">\n <button\n type=\"button\"\n onClick={onClick}\n disabled={disabled}\n style={ADD_PILL_FILL[emphasis]}\n className={`${FOCUS_RING} inline-flex items-center justify-center gap-1.5 h-[var(--malachite-control-height-medium,32px)] w-[108px] px-2.5 rounded-xl border border-solid text-[length:var(--malachite-font-size-small,13px)] font-medium whitespace-nowrap ${\n disabled ? 'opacity-50 cursor-not-allowed' : 'cursor-pointer'\n } ${className}`}\n >\n <span className=\"inline-flex h-[13px] w-[13px] shrink-0 items-center justify-center\">\n {icon ?? <PlusIcon size={13} />}\n </span>\n {label}\n </button>\n </div>\n </div>\n);\n\nconst isAddTile = (node: React.ReactNode): node is React.ReactElement<CardStripAddTileProps> =>\n React.isValidElement(node) && node.type === AddTile;\n\nconst hidesAddTile = (child: React.ReactNode): boolean =>\n React.isValidElement<{ children?: React.ReactNode }>(child) &&\n child.type === React.Fragment &&\n React.Children.toArray(child.props.children).some(isAddTile);\n\ninterface ArrowButtonProps {\n side: 'left' | 'right';\n onClick: () => void;\n}\n\nconst ArrowButton: React.FC<ArrowButtonProps> = ({ side, onClick }) => (\n <button\n type=\"button\"\n tabIndex={-1}\n aria-hidden=\"true\"\n aria-label={side === 'left' ? 'Scroll left' : 'Scroll right'}\n onClick={onClick}\n className=\"absolute top-1/2 -translate-y-1/2 z-10 inline-flex items-center justify-center w-5 h-5 rounded-lg cursor-pointer text-[var(--malachite-text-secondary)]\"\n style={{\n [side]: `-${ARROW_OFFSET_PX}px`,\n background: ARROW_BACKGROUND,\n border: `1px solid ${ARROW_BORDER}`,\n boxShadow: LIP_SHADOW,\n }}\n >\n {side === 'left' ? (\n <ArrowLeftIcon size={ARROW_GLYPH_PX} />\n ) : (\n <ForwardArrowIcon size={ARROW_GLYPH_PX} />\n )}\n </button>\n);\n\n/** A horizontally scrolling radiogroup of cards — the \"pick one of these\" strip. */\nconst CardStrip: React.FC<CardStripProps> & { AddTile: React.FC<CardStripAddTileProps> } = ({\n value,\n tone,\n onChange,\n children,\n leading,\n arrows = true,\n fadeEdges = true,\n snap = true,\n bleed = false,\n scrollSelectedIntoView = true,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledBy,\n className = '',\n style,\n}) => {\n const rootRef = useRef<HTMLDivElement>(null);\n const pinnedRef = useRef<HTMLDivElement>(null);\n const scrollerRef = useRef<HTMLDivElement>(null);\n const hasPositioned = useRef(false);\n const [edges, setEdges] = useState({ canScrollLeft: false, canScrollRight: false });\n const [cramped, setCramped] = useState(false);\n const addHostRef = useRef<HTMLDivElement>(null);\n const addTileFocused = useRef(false);\n\n useAdoptedStyleSheet(rootRef, SCROLLER_CSS, STYLE_ID);\n useAdoptedStyleSheet(rootRef, ADD_SLOT_CSS, ADD_SLOT_STYLE_ID);\n\n const childList = React.Children.toArray(children);\n const cards = childList.filter((child) => !isAddTile(child));\n const wrappedAddTile = cards.some(hidesAddTile);\n const hasCards = cards.length > 0;\n\n const addTiles = childList\n .filter(isAddTile)\n .map((tile) =>\n tile.props.emphasis === undefined\n ? React.cloneElement(tile, { emphasis: hasCards ? 'secondary' : 'primary' })\n : tile,\n );\n\n const childCount = childList.length;\n const addTileCount = addTiles.length;\n const hasLeading = Boolean(leading);\n\n // With no room for a card between the pinned tiles, the add tile scrolls with the cards.\n // biome-ignore lint/correctness/useExhaustiveDependencies: a new pinned slot needs observing\n useLayoutEffect(() => {\n const root = rootRef.current;\n if (!root || !hasCards || addTileCount === 0) {\n setCramped(false);\n return;\n }\n const pinnedSlot = pinnedRef.current;\n const { paddingLeft, paddingRight } = getComputedStyle(root);\n const inset = (parseFloat(paddingLeft) || 0) + (parseFloat(paddingRight) || 0);\n let content = root.clientWidth - inset;\n let pinned = pinnedSlot?.offsetWidth ?? 0;\n const decide = (): void => {\n const needs = pinned + addTileCount * SLOT_WIDTH_PX + TROUGH_FLOOR_PX;\n setCramped(content > 0 && content < needs);\n };\n decide();\n // Sizes from the entries: reading layout here would force the layout the observer spares.\n const observer =\n typeof ResizeObserver !== 'undefined'\n ? new ResizeObserver((entries) => {\n for (const entry of entries ?? []) {\n if (entry.target === root) {\n content = entry.contentRect.width;\n } else {\n pinned =\n entry.borderBoxSize?.[0]?.inlineSize ??\n entry.contentRect.width + 2 * TROUGH_SHOULDER_PX;\n }\n }\n decide();\n })\n : null;\n observer?.observe(root);\n if (pinnedSlot) {\n observer?.observe(pinnedSlot);\n }\n return () => observer?.disconnect();\n }, [hasCards, addTileCount, hasLeading]);\n\n const addInTrack = cramped && hasCards;\n const trackAddTileFocus = useCallback((event: React.FocusEvent) => {\n const focused = event.type === 'focus' ? event.target : event.relatedTarget;\n addTileFocused.current = Boolean(\n focused instanceof Node && addHostRef.current?.contains(focused),\n );\n }, []);\n\n // The tile remounts wherever it moves, so focus has to follow it there. Removing a focused\n // element fires no blur, so the flag survives the move.\n // biome-ignore lint/correctness/useExhaustiveDependencies: the tile moving is the signal\n useLayoutEffect(() => {\n const host = addHostRef.current;\n const active = host ? (host.getRootNode() as Document | ShadowRoot).activeElement : null;\n if (addTileFocused.current && host && !(active && host.contains(active))) {\n host.querySelector('button')?.focus({ preventScroll: true });\n }\n }, [addInTrack]);\n\n const getRadios = useCallback((): HTMLElement[] => {\n const root = rootRef.current;\n if (!root) {\n return [];\n }\n return Array.from(root.querySelectorAll<HTMLElement>(RADIO_SELECTOR));\n }, []);\n\n // Read off the DOM rather than the children's keys: unkeyed cards reorder under positional\n // keys that never change. Attribute reads only, so this forces no layout.\n const radioOrder = useRef<string | null>(null);\n const [reorders, setReorders] = useState(0);\n useLayoutEffect(() => {\n const next = JSON.stringify(getRadios().map(radioValue));\n if (radioOrder.current !== null && radioOrder.current !== next) {\n setReorders((count) => count + 1);\n }\n radioOrder.current = next;\n });\n\n const getNavigableRadios = useCallback(\n (): HTMLElement[] => getRadios().filter((radio) => radioValue(radio) !== null),\n [getRadios],\n );\n\n const warned = useRef(new Set<string>());\n const warnOnce = useCallback((key: string, message: string): void => {\n if (warned.current.has(key)) {\n return;\n }\n warned.current.add(key);\n console.warn(message);\n }, []);\n\n const [derivedTone, setDerivedTone] = useState<CardStripTone>('profile');\n\n useLayoutEffect(() => {\n const selectedCard = getRadios()\n .find((radio) => radioValue(radio) === value)\n ?.parentElement?.getAttribute('data-variant');\n if (\n selectedCard === 'profile' ||\n selectedCard === 'library' ||\n selectedCard === 'editing'\n ) {\n setDerivedTone(selectedCard);\n }\n }, [getRadios, value]);\n\n useLayoutEffect(() => {\n const radios = getRadios();\n const navigable = getNavigableRadios();\n const selected = navigable.find((radio) => radioValue(radio) === value);\n const tabStop = selected ?? navigable.find((radio) => !isRadioDisabled(radio)) ?? null;\n\n radios.forEach((radio) => {\n const holdsTabStop = radio === tabStop;\n const nextTabIndex = holdsTabStop ? 0 : -1;\n if (radio.tabIndex !== nextTabIndex) {\n radio.tabIndex = nextTabIndex;\n }\n for (const control of actionControls(radio)) {\n if (holdsTabStop) {\n restoreTabStop(control);\n } else {\n suppressTabStop(control);\n }\n }\n });\n\n if (process.env.NODE_ENV === 'production') {\n return;\n }\n\n if (navigable.length !== radios.length) {\n warnOnce(\n 'missing-value',\n 'CardStrip: a child with role=\"radio\" has no `data-value`. It cannot be selected or reached by arrow keys, so it is excluded from the radio set. Give every card a `data-value`.',\n );\n }\n\n const values = new Set<string>();\n for (const radio of navigable) {\n const current = radioValue(radio);\n if (current === null) {\n continue;\n }\n if (values.has(current)) {\n warnOnce(\n `duplicate:${current}`,\n `CardStrip: two cards share the data-value \"${current}\". Both will read as checked and only the first is selectable — data-value must be unique.`,\n );\n }\n values.add(current);\n }\n\n const selectionSettled = value !== '';\n\n if (radios.length > 0 && selectionSettled && !values.has(value)) {\n warnOnce(\n `unmatched:${value}`,\n `CardStrip: value \"${value}\" matches no card's data-value, so the group reports no selection.`,\n );\n }\n\n const checked = radios.filter(\n (radio) => radio.getAttribute('aria-checked') === 'true',\n ).length;\n if (radios.length > 0 && selectionSettled && checked !== 1) {\n warnOnce(\n `checked:${checked}`,\n `CardStrip: ${checked} cards are aria-checked, but a radiogroup has exactly one. Drive each card's checked state from the strip's \\`value\\`.`,\n );\n }\n\n if (wrappedAddTile) {\n warnOnce(\n 'wrapped-add-tile',\n 'CardStrip: a CardStrip.AddTile inside a fragment is treated as a card and scrolls with them. The add tile must be a direct child of CardStrip.',\n );\n }\n });\n\n const selectedCard = useCallback((): HTMLElement | null => {\n const selected = getRadios().find((radio) => radioValue(radio) === value);\n return selected ? ((selected.closest('[role=\"radio\"]') ?? selected) as HTMLElement) : null;\n }, [getRadios, value]);\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: cards arriving is the signal\n useLayoutEffect(() => {\n if (!scrollSelectedIntoView) {\n return;\n }\n const scroller = scrollerRef.current;\n const card = selectedCard();\n // jsdom implements neither, and a strip that cannot scroll has nothing to bring into view.\n if (!scroller || !card || typeof scroller.scrollTo !== 'function') {\n return;\n }\n\n // The first placement is where the strip opens — a deep link, not a move — so it is\n // instant. Every later one is the selection travelling, and travel is legible only if\n // you can see it happen.\n const wasPositioned = hasPositioned.current;\n hasPositioned.current = true;\n\n const target = revealTargetFor(scroller, card, snap);\n if (target !== null) {\n scroller.scrollTo({\n left: target,\n behavior: wasPositioned && !prefersReducedMotion() ? 'smooth' : 'instant',\n });\n }\n }, [selectedCard, scrollSelectedIntoView, snap, childCount, reorders]);\n\n const ruleTone = tone ?? derivedTone;\n const callerPaintsBackground =\n style?.background !== undefined || style?.backgroundImage !== undefined;\n\n const measure = useCallback(() => {\n const scroller = scrollerRef.current;\n if (!callerPaintsBackground) {\n paintRule(\n rootRef.current,\n scroller,\n getRadios().find((radio) => radioValue(radio) === value)?.parentElement,\n ruleTone,\n );\n }\n if (!scroller) {\n return;\n }\n const { scrollWidth, clientWidth, scrollLeft } = scroller;\n const overflows = scrollWidth > clientWidth + EDGE_EPSILON_PX;\n const next = {\n canScrollLeft: overflows && scrollLeft > EDGE_EPSILON_PX,\n canScrollRight: overflows && scrollLeft + clientWidth < scrollWidth - EDGE_EPSILON_PX,\n };\n setEdges((previous) =>\n previous.canScrollLeft === next.canScrollLeft &&\n previous.canScrollRight === next.canScrollRight\n ? previous\n : next,\n );\n }, [callerPaintsBackground, getRadios, ruleTone, value]);\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: adding, removing or reordering cards moves the selected card, so re-measure on the order\n useLayoutEffect(() => {\n measure();\n\n const scroller = scrollerRef.current;\n if (!scroller) {\n return;\n }\n\n const selectedInView = (): boolean => {\n const card = selectedCard();\n return card !== null && isCardInView(scroller, card);\n };\n let wasInView = selectedInView();\n\n const onScroll = (): void => {\n measure();\n wasInView = selectedInView();\n };\n scroller.addEventListener('scroll', onScroll, { passive: true });\n\n // Bring back a selected card the resize cut off, unless the reader scrolled it away.\n // Next frame rather than in the callback, whose layout reads would force a layout.\n let frame = 0;\n const reveal = (): void => {\n const card = selectedCard();\n const canReveal =\n scrollSelectedIntoView && wasInView && typeof scroller.scrollTo === 'function';\n const target = canReveal && card ? revealTargetFor(scroller, card, snap) : null;\n if (target !== null) {\n scroller.scrollTo({ left: target, behavior: 'instant' });\n }\n wasInView = selectedInView();\n };\n const onResize = (): void => {\n measure();\n if (typeof requestAnimationFrame !== 'function') {\n reveal();\n return;\n }\n cancelAnimationFrame(frame);\n frame = requestAnimationFrame(reveal);\n };\n const observer =\n typeof ResizeObserver !== 'undefined' ? new ResizeObserver(onResize) : null;\n observer?.observe(scroller);\n\n return () => {\n scroller.removeEventListener('scroll', onScroll);\n observer?.disconnect();\n if (typeof cancelAnimationFrame === 'function') {\n cancelAnimationFrame(frame);\n }\n };\n }, [measure, selectedCard, scrollSelectedIntoView, snap, childCount, reorders]);\n\n const scrollByStep = useCallback(\n (direction: -1 | 1) => {\n const scroller = scrollerRef.current;\n if (!scroller || typeof scroller.scrollBy !== 'function') {\n return;\n }\n scroller.scrollBy({\n left: pageTargetFor(scroller, direction, snap) - scroller.scrollLeft,\n behavior: prefersReducedMotion() ? 'auto' : 'smooth',\n });\n },\n [snap],\n );\n\n const handleKeyDown = useCallback(\n (event: React.KeyboardEvent) => {\n if (!NAV_KEYS.has(event.key)) {\n return;\n }\n\n const target = event.target;\n if (!(target instanceof Element) || !target.closest(RADIO_SELECTOR)) {\n return;\n }\n\n const enabled = getNavigableRadios().filter((radio) => !isRadioDisabled(radio));\n if (enabled.length === 0) {\n return;\n }\n\n event.preventDefault();\n\n const currentPosition = enabled.findIndex((radio) => radioValue(radio) === value);\n let nextPosition: number;\n if (event.key === 'Home') {\n nextPosition = 0;\n } else if (event.key === 'End') {\n nextPosition = enabled.length - 1;\n } else {\n const delta = event.key === 'ArrowLeft' || event.key === 'ArrowUp' ? -1 : 1;\n const from = currentPosition === -1 ? 0 : currentPosition;\n nextPosition = (from + delta + enabled.length) % enabled.length;\n }\n\n const next = enabled[nextPosition];\n const nextValue = radioValue(next);\n if (nextValue !== null && nextValue !== value) {\n onChange(nextValue);\n }\n next.focus();\n },\n [getNavigableRadios, onChange, value],\n );\n\n const handleClick = useCallback(\n (event: React.MouseEvent) => {\n const target = event.target;\n if (!(target instanceof Element) || target.closest(`.${ADD_TILE_CLASS}`)) {\n return;\n }\n const root = rootRef.current;\n if (!root) {\n return;\n }\n const radio = radioForClick(target, root);\n if (!radio || isRadioDisabled(radio)) {\n return;\n }\n const clicked = radioValue(radio);\n if (clicked !== null && clicked !== value) {\n onChange(clicked);\n }\n },\n [onChange, value],\n );\n\n const showLeftArrow = arrows && edges.canScrollLeft;\n const showRightArrow = arrows && edges.canScrollRight;\n\n const fadeLeft = fadeEdges && edges.canScrollLeft;\n const fadeRight = fadeEdges && edges.canScrollRight;\n\n return (\n <div\n ref={rootRef}\n onKeyDown={handleKeyDown}\n onFocus={trackAddTileFocus}\n onBlur={trackAddTileFocus}\n onClick={handleClick}\n className={`${ROOT_CLASS} flex items-stretch ${className}`}\n style={{\n ...RULE_ROW_STYLE,\n ...(bleed ? BLEED_STYLE : null),\n ...style,\n }}\n >\n <div\n role=\"radiogroup\"\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n className={hasCards ? 'flex items-stretch min-w-0' : 'flex items-stretch'}\n >\n {leading ? (\n <CardStripSlotContext.Provider value={PINNED_SLOT}>\n <div ref={pinnedRef} className=\"shrink-0\" style={PINNED_SLOT_STYLE}>\n {leading}\n </div>\n </CardStripSlotContext.Provider>\n ) : null}\n {hasCards ? (\n <div\n {...{ [TROUGH_ATTR]: '' }}\n className=\"relative min-w-0 shrink basis-auto\"\n style={TROUGH_STYLE}\n >\n <div\n ref={scrollerRef}\n tabIndex={-1}\n {...{ [SCROLLER_ATTR]: '' }}\n data-snap={snap ? 'true' : 'false'}\n className={SCROLLER_CLASS}\n >\n <CardStripSlotContext.Provider value={SCROLLED_SLOT}>\n {cards}\n </CardStripSlotContext.Provider>\n {addInTrack ? (\n <div ref={addHostRef} {...{ [ADD_SLOT_ATTR]: '' }}>\n {addTiles}\n </div>\n ) : null}\n </div>\n {showLeftArrow ? (\n <ArrowButton side=\"left\" onClick={() => scrollByStep(-1)} />\n ) : null}\n {showRightArrow ? (\n <ArrowButton side=\"right\" onClick={() => scrollByStep(1)} />\n ) : null}\n {fadeLeft || fadeRight ? (\n <div\n aria-hidden\n data-card-strip-fade=\"\"\n className={`${FADE_CLASS} absolute pointer-events-none`}\n style={{\n inset: `-${TROUGH_SHOULDER_PX}px -${FADE_OVERHANG_PX}px 0`,\n background: `linear-gradient(to right, ${fadeLeft ? FADE_COLOR : 'transparent'} 0, transparent ${FADE_RAMP_PX}px, transparent calc(100% - ${FADE_RAMP_PX}px), ${fadeRight ? FADE_COLOR : 'transparent'} 100%)`,\n }}\n />\n ) : null}\n </div>\n ) : null}\n </div>\n {addTiles.length > 0 && !addInTrack ? (\n <div\n ref={addHostRef}\n className=\"shrink-0\"\n style={!hasCards && leading ? EMPTY_ADD_SLOT_STYLE : undefined}\n >\n {addTiles}\n </div>\n ) : null}\n </div>\n );\n};\n\nCardStrip.AddTile = AddTile;\n\nexport default CardStrip;\nexport { CardStrip };\n"],"names":["NAV_KEYS","RADIO_SELECTOR","SCROLLER_ATTR","TROUGH_ATTR","ROOT_CLASS","SCROLLER_CLASS","FADE_CLASS","ADD_TILE_CLASS","ADD_SLOT_ATTR","ACTIONS_SELECTOR","FOCUSABLE_SELECTOR","PREV_TABINDEX_ATTR","FADE_WIDTH_PX","ARROW_GLYPH_PX","GUTTER_REST_PX","LIP_SHADOW","ARROW_BACKGROUND","ARROW_BORDER","TROUGH_BACKGROUND","CARD_CORNER","CARD_RADIUS","TROUGH_CORNER","TROUGH_RADIUS","TROUGH_SHOULDER_PX","ARROW_OFFSET_PX","FADE_OVERHANG_PX","FADE_RAMP_PX","SLOT_WIDTH_PX","CARD_WIDTH_PX","TROUGH_FLOOR_PX","DIVIDER_COLOR","FADE_COLOR","ADD_HOVER_BACKGROUND","ADD_PILL_BORDER","ADD_PILL_BORDER_ACTIVE","ADD_PILL_SHADOW_DEEP","ADD_PILL_BACKGROUND","ADD_PILL_FOREGROUND","ADD_PILL_PRIMARY_BACKGROUND","ADD_PILL_PRIMARY_FOREGROUND","ADD_PILL_PRIMARY_SHADOW","BOTTOM_RULE_WEIGHT_PX","STRIP_RULE_PX","OVERFLOW_INSET_PX","CLIP_SLACK_PX","FOCUS_RING_REACH_PX","SCROLLER_CSS","CARD_FLARE_PX","STYLE_ID","ADD_SLOT_STYLE_ID","ADD_SLOT_CSS","prefersReducedMotion","radioValue","radio","isRadioDisabled","actionsFor","card","radioForClick","target","root","direct","node","radios","actionControls","actions","suppressTabStop","element","restoreTabStop","previous","TONE_RULE","RULE_ROW_STYLE","RULE_GAP_OVERLAP_PX","FLARE_TIP_INSET_PX","CARD_FLARE_TIP_PX","flareTips","flare","FLARE_CLASS","left","right","paintRule","scroller","tone","colour","rootRect","rootLeft","clip","cardRect","tips","tipLeft","tipRight","from","to","BLEED_STYLE","CONTENT_INSET","TROUGH_SURFACE","TROUGH_STYLE","ADD_TILE_SHAPE_STYLE","PINNED_SLOT_STYLE","EMPTY_ADD_SLOT_STYLE","ADD_PILL_FILL","AddTile","label","icon","onClick","disabled","emphasis","className","jsx","jsxs","FOCUS_RING","PlusIcon","isAddTile","React","hidesAddTile","child","ArrowButton","side","ArrowLeftIcon","ForwardArrowIcon","CardStrip","value","onChange","children","leading","arrows","fadeEdges","snap","bleed","scrollSelectedIntoView","ariaLabel","ariaLabelledBy","style","rootRef","useRef","pinnedRef","scrollerRef","hasPositioned","edges","setEdges","useState","cramped","setCramped","addHostRef","addTileFocused","useAdoptedStyleSheet","childList","cards","wrappedAddTile","hasCards","addTiles","tile","childCount","addTileCount","useLayoutEffect","pinnedSlot","paddingLeft","paddingRight","inset","content","pinned","decide","needs","observer","entries","entry","_b","_a","addInTrack","trackAddTileFocus","useCallback","event","focused","host","active","getRadios","radioOrder","reorders","setReorders","next","count","getNavigableRadios","warned","warnOnce","key","message","derivedTone","setDerivedTone","selectedCard","navigable","tabStop","holdsTabStop","nextTabIndex","control","values","current","selectionSettled","checked","selected","wasPositioned","revealTargetFor","ruleTone","callerPaintsBackground","measure","scrollWidth","clientWidth","scrollLeft","overflows","EDGE_EPSILON_PX","selectedInView","isCardInView","wasInView","onScroll","frame","reveal","onResize","scrollByStep","direction","pageTargetFor","handleKeyDown","enabled","currentPosition","nextPosition","delta","nextValue","handleClick","clicked","showLeftArrow","showRightArrow","fadeLeft","fadeRight","CardStripSlotContext","PINNED_SLOT","SCROLLED_SLOT"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"CardStrip.js","sources":["../../src/components/CardStrip.tsx"],"sourcesContent":["import React, { useCallback, useLayoutEffect, useRef, useState } from 'react';\nimport ArrowLeftIcon from './CustomIcons/ArrowLeftIcon';\nimport ForwardArrowIcon from './CustomIcons/ForwardArrowIcon';\nimport PlusIcon from './CustomIcons/PlusIcon';\nimport { CONTENT_INSET } from './PageLayout/constants';\nimport {\n CARD_FLARE_PX,\n CARD_FLARE_TIP_PX,\n CARD_WIDTH_PX,\n FLARE_CLASS,\n STRIP_RULE_PX,\n} from './SelectableCard';\nimport { EDGE_EPSILON_PX, isCardInView, pageTargetFor, revealTargetFor } from './cardStripGeometry';\nimport { CardStripSlotContext, PINNED_SLOT, SCROLLED_SLOT } from './cardStripSlot';\nimport { FOCUS_RING } from './focusRing';\nimport { useAdoptedStyleSheet } from './useAdoptedStyleSheet';\n\nexport type CardStripAddTileEmphasis = 'primary' | 'secondary';\n\nexport interface CardStripAddTileProps {\n /** Visible label, e.g. \"Add Profile\". Also names the button for assistive tech. */\n label: string;\n /** Defaults to a plus. */\n icon?: React.ReactNode;\n onClick: () => void;\n disabled?: boolean;\n /** Leave unset: CardStrip picks `primary` while the strip is empty and `secondary` once cards exist. */\n emphasis?: CardStripAddTileEmphasis;\n className?: string;\n}\n\n/** Palette for the strip's rule. Pass the tone of whatever card is selected. */\nexport type CardStripTone = 'profile' | 'library' | 'editing';\n\nexport interface CardStripProps {\n /** The selected card's value, matched against each radio child's `data-value`. */\n value: string;\n /** Overrides the palette the strip reads off the selected card. See `CardStripTone`. */\n tone?: CardStripTone;\n onChange: (value: string) => void;\n /** Cards. Any element with `role=\"radio\"` and a `data-value` joins the group; an\n * add tile must be a direct child or it scrolls with the cards. */\n children: React.ReactNode;\n /** Pinned, non-scrolling slot before the cards (the Library card in the profile picker). */\n leading?: React.ReactNode;\n /** Circular scroll affordances, shown only on an edge that can actually scroll. */\n arrows?: boolean;\n /** Fade the cards out at any edge they scroll past. */\n fadeEdges?: boolean;\n /** Snap cards to the leading edge as the strip scrolls. */\n snap?: boolean;\n /** Run the bottom rule the full width of the page card while the cards stay on the gutter.\n * Only has an effect inside a layout that publishes its inset (`PageLayout`). */\n bleed?: boolean;\n /** Whether a selection change scrolls the selected card into view. The strip's opening\n * selection is placed instantly; later ones slide, unless motion is reduced. Set `false`\n * when the value comes from a URL, or a deep-linked strip below the fold jumps the page\n * on load. */\n scrollSelectedIntoView?: boolean;\n 'aria-label'?: string;\n 'aria-labelledby'?: string;\n className?: string;\n style?: React.CSSProperties;\n}\n\n/** Arrow keys move AND select, per the WAI-ARIA radiogroup pattern. */\nconst NAV_KEYS = new Set(['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown', 'Home', 'End']);\n\nconst RADIO_SELECTOR = '[role=\"radio\"]';\nconst SCROLLER_ATTR = 'data-card-strip-scroller';\nconst TROUGH_ATTR = 'data-card-strip-trough';\nconst ROOT_CLASS = 'malachite-card-strip';\nconst SCROLLER_CLASS = 'malachite-card-strip-scroller';\nconst FADE_CLASS = 'malachite-card-strip-fade';\nconst ADD_TILE_CLASS = 'malachite-card-strip-add-tile';\nconst ADD_SLOT_ATTR = 'data-card-strip-add-slot';\n\nconst ACTIONS_SELECTOR = '[data-selectable-card-actions]';\nconst LINK_SELECTOR = '[data-selectable-card-link]';\nconst FOCUSABLE_SELECTOR =\n 'a[href], area[href], button, input, select, textarea, iframe, [contenteditable=\"true\"], [tabindex]';\nconst PREV_TABINDEX_ATTR = 'data-card-strip-prev-tabindex';\n\nconst FADE_WIDTH_PX = 80;\n\nconst ARROW_GLYPH_PX = 11;\nconst GUTTER_REST_PX = 12;\n\nconst LIP_SHADOW = 'var(--malachite-shadow-default)';\nconst ARROW_BACKGROUND =\n 'var(--malachite-card-strip-arrow-background, var(--malachite-card-background, #ffffff))';\nconst ARROW_BORDER = 'var(--malachite-card-strip-arrow-border, #e8e8e8)';\nconst TROUGH_BACKGROUND = 'var(--malachite-card-strip-background, #f1f1f1)';\nconst CARD_CORNER = 'var(--malachite-radius-xxl, 14px)';\nconst CARD_RADIUS = `${CARD_CORNER} ${CARD_CORNER} 0 0`;\nconst TROUGH_CORNER = 'var(--malachite-radius-xxxl, 16px)';\nconst TROUGH_RADIUS = `${TROUGH_CORNER} ${TROUGH_CORNER} 0 0`;\nconst TROUGH_SHOULDER_PX = 4;\n// Fills the gap between the edge card and its neighbour, covering neither.\nconst ARROW_OFFSET_PX = GUTTER_REST_PX + TROUGH_SHOULDER_PX;\n// Any wider and the fade paints over the neighbouring slot.\nconst FADE_OVERHANG_PX = GUTTER_REST_PX;\nconst FADE_RAMP_PX = FADE_WIDTH_PX + (FADE_OVERHANG_PX - TROUGH_SHOULDER_PX);\nconst SLOT_WIDTH_PX = CARD_WIDTH_PX;\nconst TROUGH_FLOOR_PX = 2 * (GUTTER_REST_PX + TROUGH_SHOULDER_PX) + SLOT_WIDTH_PX;\nconst DIVIDER_COLOR = 'var(--malachite-card-strip-divider, #dddddd)';\nconst FADE_COLOR = 'var(--malachite-card-strip-fade, transparent)';\nconst ADD_HOVER_BACKGROUND = 'var(--malachite-selectable-card-hover-background, #e8e8e8)';\nconst ADD_PILL_BORDER = 'var(--malachite-card-strip-arrow-border, #e8e8e8)';\nconst ADD_PILL_BORDER_ACTIVE = 'var(--malachite-selectable-card-hover-rule, #bbbbbb)';\nconst ADD_PILL_SHADOW_DEEP = '0px 1px 0px 0px rgba(0, 0, 0, 0.4)';\nconst ADD_PILL_BACKGROUND = 'var(--malachite-card-background, #ffffff)';\nconst ADD_PILL_FOREGROUND = 'var(--malachite-text-primary, #0a0a0a)';\nconst ADD_PILL_PRIMARY_BACKGROUND =\n 'var(--malachite-card-strip-add-primary-background, var(--malachite-text-primary, #0a0a0a))';\nconst ADD_PILL_PRIMARY_FOREGROUND =\n 'var(--malachite-card-strip-add-primary-foreground, var(--malachite-card-background, #ffffff))';\nconst ADD_PILL_PRIMARY_SHADOW = '0px 1px 0px 0px rgba(10, 10, 10, 0.7)';\n\nconst BOTTOM_RULE_WEIGHT_PX = STRIP_RULE_PX;\n\nconst OVERFLOW_INSET_PX = 16;\n\nconst CLIP_SLACK_PX = 9999;\nconst FOCUS_RING_REACH_PX = 4;\n\n/** A sheet, not inline styles: these rules have to reach children this component does not render. */\nconst SCROLLER_CSS = `\n.${ROOT_CLASS} {\n clip-path: inset(-${CLIP_SLACK_PX}px -${CLIP_SLACK_PX}px 0);\n}\n.${ROOT_CLASS}:has(:focus-visible) {\n clip-path: inset(-${CLIP_SLACK_PX}px -${CLIP_SLACK_PX}px -${FOCUS_RING_REACH_PX}px);\n}\n.${SCROLLER_CLASS} {\n display: flex;\n flex-wrap: nowrap;\n overflow-x: auto;\n overflow-y: hidden;\n scroll-behavior: smooth;\n scrollbar-width: none;\n -ms-overflow-style: none;\n padding-block: ${OVERFLOW_INSET_PX}px;\n margin-block: -${OVERFLOW_INSET_PX}px;\n /* overflow-x clips both axes, so the end cards would lose a flare; the negative margin trades\n the padding back out and scroll-padding keeps the rest position at zero. */\n padding-inline: ${CARD_FLARE_PX}px;\n margin-inline: -${CARD_FLARE_PX}px;\n scroll-padding-inline: ${CARD_FLARE_PX}px;\n}\n/* A card focused at a faded edge has to stay readable, so the fade lifts entirely. */\n.${ROOT_CLASS}:has(:focus-visible) .${FADE_CLASS} {\n display: none;\n}\n.${SCROLLER_CLASS}::-webkit-scrollbar {\n display: none;\n}\n/* No bottom edge: the strip's rule is the baseline for the add tile as much as for a card. */\n.${ADD_TILE_CLASS} > * {\n background: ${TROUGH_BACKGROUND};\n border-radius: ${CARD_RADIUS};\n}\n.${ADD_TILE_CLASS}:hover:not(:has(button:disabled)) > * {\n background: ${ADD_HOVER_BACKGROUND};\n}\n.${ADD_TILE_CLASS} button:active:not(:disabled) {\n opacity: 0.8;\n}\n.${ADD_TILE_CLASS}:has(button:active) > * {\n background: ${TROUGH_BACKGROUND};\n}\n.${ADD_TILE_CLASS}[data-emphasis='secondary'] button {\n border-color: ${ADD_PILL_BORDER};\n box-shadow: ${LIP_SHADOW};\n}\n.${ADD_TILE_CLASS}[data-emphasis='secondary']:hover:not(:has(button:disabled)) button {\n border-color: ${ADD_PILL_BORDER_ACTIVE};\n box-shadow: ${ADD_PILL_SHADOW_DEEP};\n}\n.${ADD_TILE_CLASS}[data-emphasis='secondary'] button:active:not(:disabled) {\n border-color: ${ADD_PILL_BORDER_ACTIVE};\n box-shadow: ${ADD_PILL_SHADOW_DEEP};\n}\n.${ADD_TILE_CLASS}[data-emphasis='primary'] button {\n border-color: transparent;\n box-shadow: ${ADD_PILL_PRIMARY_SHADOW};\n}\n.${SCROLLER_CLASS} > * {\n flex: 0 0 auto;\n min-width: 0;\n}\n.${SCROLLER_CLASS} > * + * {\n border-left: 1px solid ${DIVIDER_COLOR};\n}\n.${SCROLLER_CLASS}[data-snap='true'] {\n scroll-snap-type: x proximity;\n}\n.${SCROLLER_CLASS}[data-snap='true'] > * {\n scroll-snap-align: start;\n}\n@media (prefers-reduced-motion: reduce) {\n .${SCROLLER_CLASS} {\n scroll-behavior: auto;\n }\n .${SCROLLER_CLASS}[data-snap='true'] {\n scroll-snap-type: none;\n }\n .${SCROLLER_CLASS}[data-snap='true'] > * {\n scroll-snap-align: none;\n }\n}`;\n\nconst STYLE_ID = 'malachite-card-strip-style';\n// Its own id: an older malachite copy on the page may already own STYLE_ID without these rules.\nconst ADD_SLOT_STYLE_ID = 'malachite-card-strip-add-slot';\n// In the track the trough is already the tile's shoulder, and it is no card to rule off.\nconst ADD_SLOT_CSS = `\n.${SCROLLER_CLASS} > [${ADD_SLOT_ATTR}] {\n display: flex;\n border-left: none;\n}\n[${ADD_SLOT_ATTR}] > .${ADD_TILE_CLASS} {\n height: 100% !important;\n padding: 0 !important;\n}\n`;\n\n/** `window.matchMedia` is absent under SSR and in older test environments. */\nconst prefersReducedMotion = (): boolean => {\n if (typeof window === 'undefined' || typeof window.matchMedia !== 'function') {\n return true;\n }\n return window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n};\n\nconst radioValue = (radio: HTMLElement): string | null =>\n radio.dataset.value ?? radio.getAttribute('value');\n\nconst isRadioDisabled = (radio: HTMLElement): boolean =>\n radio.hasAttribute('disabled') || radio.getAttribute('aria-disabled') === 'true';\n\nconst cardFor = (radio: HTMLElement): HTMLElement | null => {\n const card = radio.parentElement;\n return card && card.querySelectorAll(RADIO_SELECTOR).length === 1 ? card : null;\n};\n\nconst actionsFor = (radio: HTMLElement): HTMLElement | null =>\n cardFor(radio)?.querySelector<HTMLElement>(ACTIONS_SELECTOR) ?? null;\n\n/** A card is wider than its radio, so `closest` misses clicks on the count row. */\nconst radioForClick = (target: Element, root: Element): HTMLElement | null => {\n const direct = target.closest<HTMLElement>(RADIO_SELECTOR);\n if (direct) {\n return direct;\n }\n if (target.closest(ACTIONS_SELECTOR) || target.closest(LINK_SELECTOR)) {\n return null;\n }\n let node: Element | null = target;\n while (node && root.contains(node)) {\n const radios: NodeListOf<HTMLElement> = node.querySelectorAll(RADIO_SELECTOR);\n if (radios.length === 1 && radios[0].parentElement === node) {\n return radios[0];\n }\n node = node.parentElement;\n }\n return null;\n};\n\n// The card's own controls beside its radio, which only the card holding the tab stop keeps.\nconst cardControls = (radio: HTMLElement): HTMLElement[] => {\n const actions = actionsFor(radio);\n const link = cardFor(radio)?.querySelector<HTMLElement>(LINK_SELECTOR);\n return [\n ...(actions ? Array.from(actions.querySelectorAll<HTMLElement>(FOCUSABLE_SELECTOR)) : []),\n ...(link ? [link] : []),\n ];\n};\n\nconst suppressTabStop = (element: HTMLElement): void => {\n if (!element.hasAttribute(PREV_TABINDEX_ATTR)) {\n element.setAttribute(PREV_TABINDEX_ATTR, element.getAttribute('tabindex') ?? '');\n }\n element.setAttribute('tabindex', '-1');\n};\n\nconst restoreTabStop = (element: HTMLElement): void => {\n if (!element.hasAttribute(PREV_TABINDEX_ATTR)) {\n return;\n }\n const previous = element.getAttribute(PREV_TABINDEX_ATTR);\n element.removeAttribute(PREV_TABINDEX_ATTR);\n if (previous) {\n element.setAttribute('tabindex', previous);\n } else {\n element.removeAttribute('tabindex');\n }\n};\n\nconst TONE_RULE: Record<CardStripTone, string> = {\n profile: 'var(--malachite-selectable-card-selected-border, #047b43)',\n library: 'var(--malachite-selectable-card-library-selected-border, #bbbbbb)',\n editing: 'var(--malachite-selectable-card-pending-foreground, #96580a)',\n};\nconst RULE_ROW_STYLE: React.CSSProperties = {\n backgroundRepeat: 'no-repeat',\n backgroundPosition: 'left bottom',\n backgroundSize: `100% ${BOTTOM_RULE_WEIGHT_PX}px`,\n};\n\n/** The rule runs under the flare's tip rather than butting against it, so antialiasing\n * cannot open the junction into a gap. */\nconst RULE_GAP_OVERLAP_PX = 0.5;\n\nconst FLARE_TIP_INSET_PX = CARD_FLARE_PX - CARD_FLARE_TIP_PX;\n\nconst flareTips = (card: HTMLElement): { left: number; right: number } | null => {\n const flare = card.querySelector(`:scope > .${FLARE_CLASS}`);\n if (!flare) {\n return null;\n }\n const { left, right } = flare.getBoundingClientRect();\n return { left: left + FLARE_TIP_INSET_PX, right: right - FLARE_TIP_INSET_PX };\n};\n\n/** The rule is cut where the selected card stands, never covered: the strip's clip lands on the\n * rule's own edge, so a cover takes the same partial alpha and the rule bleeds through it. */\nconst paintRule = (\n root: HTMLElement | null,\n scroller: HTMLElement | null,\n card: HTMLElement | null | undefined,\n tone: CardStripTone,\n): void => {\n if (!root) {\n return;\n }\n const colour = TONE_RULE[tone];\n const rootRect = root.getBoundingClientRect();\n const rootLeft = rootRect.left;\n const clip = card && scroller?.contains(card) ? scroller.getBoundingClientRect() : rootRect;\n const cardRect = card?.getBoundingClientRect();\n const tips = card ? flareTips(card) : null;\n const tipLeft = tips?.left ?? (cardRect ? cardRect.left - CARD_FLARE_TIP_PX : 0);\n const tipRight = tips?.right ?? (cardRect ? cardRect.right + CARD_FLARE_TIP_PX : 0);\n const from = cardRect ? Math.max(tipLeft, clip.left) + RULE_GAP_OVERLAP_PX - rootLeft : 0;\n const to = cardRect ? Math.min(tipRight, clip.right) - RULE_GAP_OVERLAP_PX - rootLeft : 0;\n\n root.style.backgroundImage =\n to > from\n ? `linear-gradient(to right, ${colour} 0 ${from}px, transparent ${from}px ${to}px, ${colour} ${to}px 100%)`\n : `linear-gradient(to right, ${colour} 0 100%)`;\n};\n\nconst BLEED_STYLE: React.CSSProperties = {\n marginInline: `calc(${CONTENT_INSET} * -1)`,\n paddingInline: CONTENT_INSET,\n};\n\n/** The rule's row is a margin, never padding: a background paints under its own padding, which\n * would hide the very line the troughs stand on. */\nconst TROUGH_SURFACE: React.CSSProperties = {\n background: TROUGH_BACKGROUND,\n borderRadius: TROUGH_RADIUS,\n paddingTop: `${TROUGH_SHOULDER_PX}px`,\n paddingInline: `${TROUGH_SHOULDER_PX}px`,\n marginBottom: `${BOTTOM_RULE_WEIGHT_PX}px`,\n};\nconst TROUGH_STYLE: React.CSSProperties = {\n ...TROUGH_SURFACE,\n marginInline: `${GUTTER_REST_PX}px`,\n};\nconst ADD_TILE_SHAPE_STYLE: React.CSSProperties = TROUGH_SURFACE;\n\nconst PINNED_SLOT_STYLE: React.CSSProperties = TROUGH_SURFACE;\n\nconst EMPTY_ADD_SLOT_STYLE: React.CSSProperties = {\n marginInlineStart: `${GUTTER_REST_PX}px`,\n};\n\nconst ADD_PILL_FILL: Record<CardStripAddTileEmphasis, React.CSSProperties> = {\n primary: {\n backgroundColor: ADD_PILL_PRIMARY_BACKGROUND,\n color: ADD_PILL_PRIMARY_FOREGROUND,\n },\n secondary: { backgroundColor: ADD_PILL_BACKGROUND, color: ADD_PILL_FOREGROUND },\n};\n\nconst AddTile: React.FC<CardStripAddTileProps> = ({\n label,\n icon,\n onClick,\n disabled = false,\n emphasis = 'secondary',\n className = '',\n}) => (\n <div\n className={ADD_TILE_CLASS}\n data-emphasis={emphasis}\n style={{\n ...ADD_TILE_SHAPE_STYLE,\n width: `${SLOT_WIDTH_PX}px`,\n height: `calc(100% - ${BOTTOM_RULE_WEIGHT_PX}px)`,\n }}\n >\n <div className=\"flex h-full items-center justify-center px-4\">\n <button\n type=\"button\"\n onClick={onClick}\n disabled={disabled}\n style={ADD_PILL_FILL[emphasis]}\n className={`${FOCUS_RING} inline-flex items-center justify-center gap-1.5 h-[var(--malachite-control-height-medium,32px)] w-[108px] px-2.5 rounded-xl border border-solid text-[length:var(--malachite-font-size-small,13px)] font-medium whitespace-nowrap ${\n disabled ? 'opacity-50 cursor-not-allowed' : 'cursor-pointer'\n } ${className}`}\n >\n <span className=\"inline-flex h-[13px] w-[13px] shrink-0 items-center justify-center\">\n {icon ?? <PlusIcon size={13} />}\n </span>\n {label}\n </button>\n </div>\n </div>\n);\n\nconst isAddTile = (node: React.ReactNode): node is React.ReactElement<CardStripAddTileProps> =>\n React.isValidElement(node) && node.type === AddTile;\n\nconst hidesAddTile = (child: React.ReactNode): boolean =>\n React.isValidElement<{ children?: React.ReactNode }>(child) &&\n child.type === React.Fragment &&\n React.Children.toArray(child.props.children).some(isAddTile);\n\ninterface ArrowButtonProps {\n side: 'left' | 'right';\n onClick: () => void;\n}\n\nconst ArrowButton: React.FC<ArrowButtonProps> = ({ side, onClick }) => (\n <button\n type=\"button\"\n tabIndex={-1}\n aria-hidden=\"true\"\n aria-label={side === 'left' ? 'Scroll left' : 'Scroll right'}\n onClick={onClick}\n className=\"absolute top-1/2 -translate-y-1/2 z-10 inline-flex items-center justify-center w-5 h-5 rounded-lg cursor-pointer text-[var(--malachite-text-secondary)]\"\n style={{\n [side]: `-${ARROW_OFFSET_PX}px`,\n background: ARROW_BACKGROUND,\n border: `1px solid ${ARROW_BORDER}`,\n boxShadow: LIP_SHADOW,\n }}\n >\n {side === 'left' ? (\n <ArrowLeftIcon size={ARROW_GLYPH_PX} />\n ) : (\n <ForwardArrowIcon size={ARROW_GLYPH_PX} />\n )}\n </button>\n);\n\n/** A horizontally scrolling radiogroup of cards — the \"pick one of these\" strip. */\nconst CardStrip: React.FC<CardStripProps> & { AddTile: React.FC<CardStripAddTileProps> } = ({\n value,\n tone,\n onChange,\n children,\n leading,\n arrows = true,\n fadeEdges = true,\n snap = true,\n bleed = false,\n scrollSelectedIntoView = true,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledBy,\n className = '',\n style,\n}) => {\n const rootRef = useRef<HTMLDivElement>(null);\n const pinnedRef = useRef<HTMLDivElement>(null);\n const scrollerRef = useRef<HTMLDivElement>(null);\n const hasPositioned = useRef(false);\n const [edges, setEdges] = useState({ canScrollLeft: false, canScrollRight: false });\n const [cramped, setCramped] = useState(false);\n const addHostRef = useRef<HTMLDivElement>(null);\n const addTileFocused = useRef(false);\n\n useAdoptedStyleSheet(rootRef, SCROLLER_CSS, STYLE_ID);\n useAdoptedStyleSheet(rootRef, ADD_SLOT_CSS, ADD_SLOT_STYLE_ID);\n\n const childList = React.Children.toArray(children);\n const cards = childList.filter((child) => !isAddTile(child));\n const wrappedAddTile = cards.some(hidesAddTile);\n const hasCards = cards.length > 0;\n\n const addTiles = childList\n .filter(isAddTile)\n .map((tile) =>\n tile.props.emphasis === undefined\n ? React.cloneElement(tile, { emphasis: hasCards ? 'secondary' : 'primary' })\n : tile,\n );\n\n const childCount = childList.length;\n const addTileCount = addTiles.length;\n const hasLeading = Boolean(leading);\n\n // With no room for a card between the pinned tiles, the add tile scrolls with the cards.\n // biome-ignore lint/correctness/useExhaustiveDependencies: a new pinned slot needs observing\n useLayoutEffect(() => {\n const root = rootRef.current;\n if (!root || !hasCards || addTileCount === 0) {\n setCramped(false);\n return;\n }\n const pinnedSlot = pinnedRef.current;\n const { paddingLeft, paddingRight } = getComputedStyle(root);\n const inset = (parseFloat(paddingLeft) || 0) + (parseFloat(paddingRight) || 0);\n let content = root.clientWidth - inset;\n let pinned = pinnedSlot?.offsetWidth ?? 0;\n const decide = (): void => {\n const needs = pinned + addTileCount * SLOT_WIDTH_PX + TROUGH_FLOOR_PX;\n setCramped(content > 0 && content < needs);\n };\n decide();\n // Sizes from the entries: reading layout here would force the layout the observer spares.\n const observer =\n typeof ResizeObserver !== 'undefined'\n ? new ResizeObserver((entries) => {\n for (const entry of entries ?? []) {\n if (entry.target === root) {\n content = entry.contentRect.width;\n } else {\n pinned =\n entry.borderBoxSize?.[0]?.inlineSize ??\n entry.contentRect.width + 2 * TROUGH_SHOULDER_PX;\n }\n }\n decide();\n })\n : null;\n observer?.observe(root);\n if (pinnedSlot) {\n observer?.observe(pinnedSlot);\n }\n return () => observer?.disconnect();\n }, [hasCards, addTileCount, hasLeading]);\n\n const addInTrack = cramped && hasCards;\n const trackAddTileFocus = useCallback((event: React.FocusEvent) => {\n const focused = event.type === 'focus' ? event.target : event.relatedTarget;\n addTileFocused.current = Boolean(\n focused instanceof Node && addHostRef.current?.contains(focused),\n );\n }, []);\n\n // The tile remounts wherever it moves, so focus has to follow it there. Removing a focused\n // element fires no blur, so the flag survives the move.\n // biome-ignore lint/correctness/useExhaustiveDependencies: the tile moving is the signal\n useLayoutEffect(() => {\n const host = addHostRef.current;\n const active = host ? (host.getRootNode() as Document | ShadowRoot).activeElement : null;\n if (addTileFocused.current && host && !(active && host.contains(active))) {\n host.querySelector('button')?.focus({ preventScroll: true });\n }\n }, [addInTrack]);\n\n const getRadios = useCallback((): HTMLElement[] => {\n const root = rootRef.current;\n if (!root) {\n return [];\n }\n return Array.from(root.querySelectorAll<HTMLElement>(RADIO_SELECTOR));\n }, []);\n\n // Read off the DOM rather than the children's keys: unkeyed cards reorder under positional\n // keys that never change. Attribute reads only, so this forces no layout.\n const radioOrder = useRef<string | null>(null);\n const [reorders, setReorders] = useState(0);\n useLayoutEffect(() => {\n const next = JSON.stringify(getRadios().map(radioValue));\n if (radioOrder.current !== null && radioOrder.current !== next) {\n setReorders((count) => count + 1);\n }\n radioOrder.current = next;\n });\n\n const getNavigableRadios = useCallback(\n (): HTMLElement[] => getRadios().filter((radio) => radioValue(radio) !== null),\n [getRadios],\n );\n\n const warned = useRef(new Set<string>());\n const warnOnce = useCallback((key: string, message: string): void => {\n if (warned.current.has(key)) {\n return;\n }\n warned.current.add(key);\n console.warn(message);\n }, []);\n\n const [derivedTone, setDerivedTone] = useState<CardStripTone>('profile');\n\n useLayoutEffect(() => {\n const selectedCard = getRadios()\n .find((radio) => radioValue(radio) === value)\n ?.parentElement?.getAttribute('data-variant');\n if (\n selectedCard === 'profile' ||\n selectedCard === 'library' ||\n selectedCard === 'editing'\n ) {\n setDerivedTone(selectedCard);\n }\n }, [getRadios, value]);\n\n useLayoutEffect(() => {\n const radios = getRadios();\n const navigable = getNavigableRadios();\n const selected = navigable.find((radio) => radioValue(radio) === value);\n const tabStop = selected ?? navigable.find((radio) => !isRadioDisabled(radio)) ?? null;\n\n radios.forEach((radio) => {\n const holdsTabStop = radio === tabStop;\n const nextTabIndex = holdsTabStop ? 0 : -1;\n if (radio.tabIndex !== nextTabIndex) {\n radio.tabIndex = nextTabIndex;\n }\n for (const control of cardControls(radio)) {\n if (holdsTabStop) {\n restoreTabStop(control);\n } else {\n suppressTabStop(control);\n }\n }\n });\n\n if (process.env.NODE_ENV === 'production') {\n return;\n }\n\n if (navigable.length !== radios.length) {\n warnOnce(\n 'missing-value',\n 'CardStrip: a child with role=\"radio\" has no `data-value`. It cannot be selected or reached by arrow keys, so it is excluded from the radio set. Give every card a `data-value`.',\n );\n }\n\n const values = new Set<string>();\n for (const radio of navigable) {\n const current = radioValue(radio);\n if (current === null) {\n continue;\n }\n if (values.has(current)) {\n warnOnce(\n `duplicate:${current}`,\n `CardStrip: two cards share the data-value \"${current}\". Both will read as checked and only the first is selectable — data-value must be unique.`,\n );\n }\n values.add(current);\n }\n\n const selectionSettled = value !== '';\n\n if (radios.length > 0 && selectionSettled && !values.has(value)) {\n warnOnce(\n `unmatched:${value}`,\n `CardStrip: value \"${value}\" matches no card's data-value, so the group reports no selection.`,\n );\n }\n\n const checked = radios.filter(\n (radio) => radio.getAttribute('aria-checked') === 'true',\n ).length;\n if (radios.length > 0 && selectionSettled && checked !== 1) {\n warnOnce(\n `checked:${checked}`,\n `CardStrip: ${checked} cards are aria-checked, but a radiogroup has exactly one. Drive each card's checked state from the strip's \\`value\\`.`,\n );\n }\n\n if (wrappedAddTile) {\n warnOnce(\n 'wrapped-add-tile',\n 'CardStrip: a CardStrip.AddTile inside a fragment is treated as a card and scrolls with them. The add tile must be a direct child of CardStrip.',\n );\n }\n });\n\n const selectedCard = useCallback((): HTMLElement | null => {\n const selected = getRadios().find((radio) => radioValue(radio) === value);\n return selected ? ((selected.closest('[role=\"radio\"]') ?? selected) as HTMLElement) : null;\n }, [getRadios, value]);\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: cards arriving is the signal\n useLayoutEffect(() => {\n if (!scrollSelectedIntoView) {\n return;\n }\n const scroller = scrollerRef.current;\n const card = selectedCard();\n // jsdom implements neither, and a strip that cannot scroll has nothing to bring into view.\n if (!scroller || !card || typeof scroller.scrollTo !== 'function') {\n return;\n }\n\n // The first placement is where the strip opens — a deep link, not a move — so it is\n // instant. Every later one is the selection travelling, and travel is legible only if\n // you can see it happen.\n const wasPositioned = hasPositioned.current;\n hasPositioned.current = true;\n\n const target = revealTargetFor(scroller, card, snap);\n if (target !== null) {\n scroller.scrollTo({\n left: target,\n behavior: wasPositioned && !prefersReducedMotion() ? 'smooth' : 'instant',\n });\n }\n }, [selectedCard, scrollSelectedIntoView, snap, childCount, reorders]);\n\n const ruleTone = tone ?? derivedTone;\n const callerPaintsBackground =\n style?.background !== undefined || style?.backgroundImage !== undefined;\n\n const measure = useCallback(() => {\n const scroller = scrollerRef.current;\n if (!callerPaintsBackground) {\n paintRule(\n rootRef.current,\n scroller,\n getRadios().find((radio) => radioValue(radio) === value)?.parentElement,\n ruleTone,\n );\n }\n if (!scroller) {\n return;\n }\n const { scrollWidth, clientWidth, scrollLeft } = scroller;\n const overflows = scrollWidth > clientWidth + EDGE_EPSILON_PX;\n const next = {\n canScrollLeft: overflows && scrollLeft > EDGE_EPSILON_PX,\n canScrollRight: overflows && scrollLeft + clientWidth < scrollWidth - EDGE_EPSILON_PX,\n };\n setEdges((previous) =>\n previous.canScrollLeft === next.canScrollLeft &&\n previous.canScrollRight === next.canScrollRight\n ? previous\n : next,\n );\n }, [callerPaintsBackground, getRadios, ruleTone, value]);\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: adding, removing or reordering cards moves the selected card, so re-measure on the order\n useLayoutEffect(() => {\n measure();\n\n const scroller = scrollerRef.current;\n if (!scroller) {\n return;\n }\n\n const selectedInView = (): boolean => {\n const card = selectedCard();\n return card !== null && isCardInView(scroller, card);\n };\n let wasInView = selectedInView();\n\n const onScroll = (): void => {\n measure();\n wasInView = selectedInView();\n };\n scroller.addEventListener('scroll', onScroll, { passive: true });\n\n // Bring back a selected card the resize cut off, unless the reader scrolled it away.\n // Next frame rather than in the callback, whose layout reads would force a layout.\n let frame = 0;\n const reveal = (): void => {\n const card = selectedCard();\n const canReveal =\n scrollSelectedIntoView && wasInView && typeof scroller.scrollTo === 'function';\n const target = canReveal && card ? revealTargetFor(scroller, card, snap) : null;\n if (target !== null) {\n scroller.scrollTo({ left: target, behavior: 'instant' });\n }\n wasInView = selectedInView();\n };\n const onResize = (): void => {\n measure();\n if (typeof requestAnimationFrame !== 'function') {\n reveal();\n return;\n }\n cancelAnimationFrame(frame);\n frame = requestAnimationFrame(reveal);\n };\n const observer =\n typeof ResizeObserver !== 'undefined' ? new ResizeObserver(onResize) : null;\n observer?.observe(scroller);\n\n return () => {\n scroller.removeEventListener('scroll', onScroll);\n observer?.disconnect();\n if (typeof cancelAnimationFrame === 'function') {\n cancelAnimationFrame(frame);\n }\n };\n }, [measure, selectedCard, scrollSelectedIntoView, snap, childCount, reorders]);\n\n const scrollByStep = useCallback(\n (direction: -1 | 1) => {\n const scroller = scrollerRef.current;\n if (!scroller || typeof scroller.scrollBy !== 'function') {\n return;\n }\n scroller.scrollBy({\n left: pageTargetFor(scroller, direction, snap) - scroller.scrollLeft,\n behavior: prefersReducedMotion() ? 'auto' : 'smooth',\n });\n },\n [snap],\n );\n\n const handleKeyDown = useCallback(\n (event: React.KeyboardEvent) => {\n if (!NAV_KEYS.has(event.key)) {\n return;\n }\n\n const target = event.target;\n if (!(target instanceof Element) || !target.closest(RADIO_SELECTOR)) {\n return;\n }\n\n const enabled = getNavigableRadios().filter((radio) => !isRadioDisabled(radio));\n if (enabled.length === 0) {\n return;\n }\n\n event.preventDefault();\n\n const currentPosition = enabled.findIndex((radio) => radioValue(radio) === value);\n let nextPosition: number;\n if (event.key === 'Home') {\n nextPosition = 0;\n } else if (event.key === 'End') {\n nextPosition = enabled.length - 1;\n } else {\n const delta = event.key === 'ArrowLeft' || event.key === 'ArrowUp' ? -1 : 1;\n const from = currentPosition === -1 ? 0 : currentPosition;\n nextPosition = (from + delta + enabled.length) % enabled.length;\n }\n\n const next = enabled[nextPosition];\n const nextValue = radioValue(next);\n if (nextValue !== null && nextValue !== value) {\n onChange(nextValue);\n }\n next.focus();\n },\n [getNavigableRadios, onChange, value],\n );\n\n const handleClick = useCallback(\n (event: React.MouseEvent) => {\n const target = event.target;\n if (!(target instanceof Element) || target.closest(`.${ADD_TILE_CLASS}`)) {\n return;\n }\n const root = rootRef.current;\n if (!root) {\n return;\n }\n const radio = radioForClick(target, root);\n if (!radio || isRadioDisabled(radio)) {\n return;\n }\n const clicked = radioValue(radio);\n if (clicked !== null && clicked !== value) {\n onChange(clicked);\n }\n },\n [onChange, value],\n );\n\n const showLeftArrow = arrows && edges.canScrollLeft;\n const showRightArrow = arrows && edges.canScrollRight;\n\n const fadeLeft = fadeEdges && edges.canScrollLeft;\n const fadeRight = fadeEdges && edges.canScrollRight;\n\n return (\n <div\n ref={rootRef}\n onKeyDown={handleKeyDown}\n onFocus={trackAddTileFocus}\n onBlur={trackAddTileFocus}\n onClick={handleClick}\n className={`${ROOT_CLASS} flex items-stretch ${className}`}\n style={{\n ...RULE_ROW_STYLE,\n ...(bleed ? BLEED_STYLE : null),\n ...style,\n }}\n >\n <div\n role=\"radiogroup\"\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n className={hasCards ? 'flex items-stretch min-w-0' : 'flex items-stretch'}\n >\n {leading ? (\n <CardStripSlotContext.Provider value={PINNED_SLOT}>\n <div ref={pinnedRef} className=\"shrink-0\" style={PINNED_SLOT_STYLE}>\n {leading}\n </div>\n </CardStripSlotContext.Provider>\n ) : null}\n {hasCards ? (\n <div\n {...{ [TROUGH_ATTR]: '' }}\n className=\"relative min-w-0 shrink basis-auto\"\n style={TROUGH_STYLE}\n >\n <div\n ref={scrollerRef}\n tabIndex={-1}\n {...{ [SCROLLER_ATTR]: '' }}\n data-snap={snap ? 'true' : 'false'}\n className={SCROLLER_CLASS}\n >\n <CardStripSlotContext.Provider value={SCROLLED_SLOT}>\n {cards}\n </CardStripSlotContext.Provider>\n {addInTrack ? (\n <div ref={addHostRef} {...{ [ADD_SLOT_ATTR]: '' }}>\n {addTiles}\n </div>\n ) : null}\n </div>\n {showLeftArrow ? (\n <ArrowButton side=\"left\" onClick={() => scrollByStep(-1)} />\n ) : null}\n {showRightArrow ? (\n <ArrowButton side=\"right\" onClick={() => scrollByStep(1)} />\n ) : null}\n {fadeLeft || fadeRight ? (\n <div\n aria-hidden\n data-card-strip-fade=\"\"\n className={`${FADE_CLASS} absolute pointer-events-none`}\n style={{\n inset: `-${TROUGH_SHOULDER_PX}px -${FADE_OVERHANG_PX}px 0`,\n background: `linear-gradient(to right, ${fadeLeft ? FADE_COLOR : 'transparent'} 0, transparent ${FADE_RAMP_PX}px, transparent calc(100% - ${FADE_RAMP_PX}px), ${fadeRight ? FADE_COLOR : 'transparent'} 100%)`,\n }}\n />\n ) : null}\n </div>\n ) : null}\n </div>\n {addTiles.length > 0 && !addInTrack ? (\n <div\n ref={addHostRef}\n className=\"shrink-0\"\n style={!hasCards && leading ? EMPTY_ADD_SLOT_STYLE : undefined}\n >\n {addTiles}\n </div>\n ) : null}\n </div>\n );\n};\n\nCardStrip.AddTile = AddTile;\n\nexport default CardStrip;\nexport { CardStrip };\n"],"names":["NAV_KEYS","RADIO_SELECTOR","SCROLLER_ATTR","TROUGH_ATTR","ROOT_CLASS","SCROLLER_CLASS","FADE_CLASS","ADD_TILE_CLASS","ADD_SLOT_ATTR","ACTIONS_SELECTOR","LINK_SELECTOR","FOCUSABLE_SELECTOR","PREV_TABINDEX_ATTR","FADE_WIDTH_PX","ARROW_GLYPH_PX","GUTTER_REST_PX","LIP_SHADOW","ARROW_BACKGROUND","ARROW_BORDER","TROUGH_BACKGROUND","CARD_CORNER","CARD_RADIUS","TROUGH_CORNER","TROUGH_RADIUS","TROUGH_SHOULDER_PX","ARROW_OFFSET_PX","FADE_OVERHANG_PX","FADE_RAMP_PX","SLOT_WIDTH_PX","CARD_WIDTH_PX","TROUGH_FLOOR_PX","DIVIDER_COLOR","FADE_COLOR","ADD_HOVER_BACKGROUND","ADD_PILL_BORDER","ADD_PILL_BORDER_ACTIVE","ADD_PILL_SHADOW_DEEP","ADD_PILL_BACKGROUND","ADD_PILL_FOREGROUND","ADD_PILL_PRIMARY_BACKGROUND","ADD_PILL_PRIMARY_FOREGROUND","ADD_PILL_PRIMARY_SHADOW","BOTTOM_RULE_WEIGHT_PX","STRIP_RULE_PX","OVERFLOW_INSET_PX","CLIP_SLACK_PX","FOCUS_RING_REACH_PX","SCROLLER_CSS","CARD_FLARE_PX","STYLE_ID","ADD_SLOT_STYLE_ID","ADD_SLOT_CSS","prefersReducedMotion","radioValue","radio","isRadioDisabled","cardFor","card","actionsFor","_a","radioForClick","target","root","direct","node","radios","cardControls","actions","link","suppressTabStop","element","restoreTabStop","previous","TONE_RULE","RULE_ROW_STYLE","RULE_GAP_OVERLAP_PX","FLARE_TIP_INSET_PX","CARD_FLARE_TIP_PX","flareTips","flare","FLARE_CLASS","left","right","paintRule","scroller","tone","colour","rootRect","rootLeft","clip","cardRect","tips","tipLeft","tipRight","from","to","BLEED_STYLE","CONTENT_INSET","TROUGH_SURFACE","TROUGH_STYLE","ADD_TILE_SHAPE_STYLE","PINNED_SLOT_STYLE","EMPTY_ADD_SLOT_STYLE","ADD_PILL_FILL","AddTile","label","icon","onClick","disabled","emphasis","className","jsx","jsxs","FOCUS_RING","PlusIcon","isAddTile","React","hidesAddTile","child","ArrowButton","side","ArrowLeftIcon","ForwardArrowIcon","CardStrip","value","onChange","children","leading","arrows","fadeEdges","snap","bleed","scrollSelectedIntoView","ariaLabel","ariaLabelledBy","style","rootRef","useRef","pinnedRef","scrollerRef","hasPositioned","edges","setEdges","useState","cramped","setCramped","addHostRef","addTileFocused","useAdoptedStyleSheet","childList","cards","wrappedAddTile","hasCards","addTiles","tile","childCount","addTileCount","useLayoutEffect","pinnedSlot","paddingLeft","paddingRight","inset","content","pinned","decide","needs","observer","entries","entry","_b","addInTrack","trackAddTileFocus","useCallback","event","focused","host","active","getRadios","radioOrder","reorders","setReorders","next","count","getNavigableRadios","warned","warnOnce","key","message","derivedTone","setDerivedTone","selectedCard","navigable","tabStop","holdsTabStop","nextTabIndex","control","values","current","selectionSettled","checked","selected","wasPositioned","revealTargetFor","ruleTone","callerPaintsBackground","measure","scrollWidth","clientWidth","scrollLeft","overflows","EDGE_EPSILON_PX","selectedInView","isCardInView","wasInView","onScroll","frame","reveal","onResize","scrollByStep","direction","pageTargetFor","handleKeyDown","enabled","currentPosition","nextPosition","delta","nextValue","handleClick","clicked","showLeftArrow","showRightArrow","fadeLeft","fadeRight","CardStripSlotContext","PINNED_SLOT","SCROLLED_SLOT"],"mappings":"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"}
|
|
@@ -1,21 +1,22 @@
|
|
|
1
1
|
import { jsxs as g, Fragment as T, jsx as n } from "react/jsx-runtime";
|
|
2
|
-
import { useState as
|
|
3
|
-
import { createPortal as
|
|
2
|
+
import { useState as y, useRef as C, useCallback as k, useEffect as X, useInsertionEffect as Z } from "react";
|
|
3
|
+
import { createPortal as ee } from "react-dom";
|
|
4
4
|
import { Avatar as B } from "../Avatar.js";
|
|
5
|
-
import
|
|
6
|
-
import
|
|
7
|
-
import
|
|
5
|
+
import te from "../CustomIcons/CaretDownIcon.js";
|
|
6
|
+
import ne from "../CustomIcons/CaretRightIcon.js";
|
|
7
|
+
import re from "../CustomIcons/CaretUpIcon.js";
|
|
8
8
|
import D from "../CustomIcons/CheckIcon.js";
|
|
9
|
-
import { PillButton as
|
|
10
|
-
import { pushEscapeLayer as
|
|
11
|
-
import {
|
|
12
|
-
import {
|
|
13
|
-
import {
|
|
14
|
-
|
|
9
|
+
import { PillButton as oe } from "../PillButton.js";
|
|
10
|
+
import { pushEscapeLayer as ie } from "../escapeLayers.js";
|
|
11
|
+
import { usePopupLayer as M } from "../overlayLayers.js";
|
|
12
|
+
import { useOwnedByPopover as le } from "../popoverTree.js";
|
|
13
|
+
import { ensureOverlayStyles as se } from "../portalOverlay.js";
|
|
14
|
+
import { useTopLayer as ae } from "../topLayer.js";
|
|
15
|
+
const h = 8, _ = 220, z = 240, N = (r, c) => ({
|
|
15
16
|
position: "fixed",
|
|
16
17
|
top: (r == null ? void 0 : r.top) ?? 0,
|
|
17
18
|
left: (r == null ? void 0 : r.left) ?? 0,
|
|
18
|
-
minWidth:
|
|
19
|
+
minWidth: c,
|
|
19
20
|
background: "var(--malachite-card-background, rgb(255, 255, 255))",
|
|
20
21
|
border: "1px solid var(--malachite-card-border, rgb(232, 232, 232))",
|
|
21
22
|
borderRadius: 12,
|
|
@@ -39,94 +40,94 @@ const h = 8, _ = 220, z = 240, N = (r, a) => ({
|
|
|
39
40
|
cursor: "pointer",
|
|
40
41
|
fontSize: "var(--malachite-font-size-small, 13px)",
|
|
41
42
|
color: "var(--malachite-text-primary, rgb(10, 10, 10))"
|
|
42
|
-
},
|
|
43
|
+
}, ce = {
|
|
43
44
|
fontSize: "var(--malachite-font-size-xsmall, 11px)",
|
|
44
45
|
color: "var(--malachite-text-dimmed, rgb(161, 161, 161))"
|
|
45
46
|
}, A = {
|
|
46
47
|
marginLeft: "auto",
|
|
47
48
|
display: "inline-flex",
|
|
48
49
|
color: "var(--malachite-text-success, rgb(2, 122, 66))"
|
|
49
|
-
},
|
|
50
|
+
}, Se = ({
|
|
50
51
|
models: r,
|
|
51
|
-
value:
|
|
52
|
+
value: c,
|
|
52
53
|
optionValue: H,
|
|
53
54
|
onChange: F,
|
|
54
55
|
disabled: U = !1,
|
|
55
|
-
openUp:
|
|
56
|
+
openUp: w = !0,
|
|
56
57
|
"aria-label": Y = "Model"
|
|
57
58
|
}) => {
|
|
58
59
|
var O;
|
|
59
|
-
const [
|
|
60
|
+
const [l, b] = y(!1), [j, G] = y(null), [K, L] = y(null), [V, R] = y(
|
|
60
61
|
null
|
|
61
|
-
), E = C(null),
|
|
62
|
-
|
|
63
|
-
k(() =>
|
|
64
|
-
|
|
62
|
+
), E = C(null), u = C(null), v = C(null), $ = M("actionmenu", l, u), q = M("actionmenu", l, v);
|
|
63
|
+
ae(u, l), le(
|
|
64
|
+
k(() => v.current, []),
|
|
65
|
+
l
|
|
65
66
|
);
|
|
66
|
-
const
|
|
67
|
-
const e = E.current, t =
|
|
67
|
+
const s = r.find((e) => e.value === c), I = k(() => {
|
|
68
|
+
const e = E.current, t = u.current;
|
|
68
69
|
if (!e)
|
|
69
70
|
return;
|
|
70
|
-
const
|
|
71
|
-
G({ top:
|
|
72
|
-
}, [
|
|
73
|
-
|
|
74
|
-
if (!
|
|
75
|
-
|
|
71
|
+
const o = e.getBoundingClientRect(), i = (t == null ? void 0 : t.offsetWidth) || _, a = (t == null ? void 0 : t.offsetHeight) || 0, x = window.innerWidth - i - h, m = Math.max(h, Math.min(o.right - i, x)), d = o.top - a - 4, p = o.bottom + 4, J = d >= h, Q = a === 0 || p + a <= window.innerHeight - h;
|
|
72
|
+
G({ top: w ? J ? d : p : Q ? p : d, left: m });
|
|
73
|
+
}, [w]);
|
|
74
|
+
X(() => {
|
|
75
|
+
if (!l) {
|
|
76
|
+
L(null), R(null);
|
|
76
77
|
return;
|
|
77
78
|
}
|
|
78
|
-
|
|
79
|
-
const e = () =>
|
|
80
|
-
const
|
|
81
|
-
[E.current,
|
|
82
|
-
(
|
|
79
|
+
I();
|
|
80
|
+
const e = () => I(), t = (i) => {
|
|
81
|
+
const a = i.composedPath();
|
|
82
|
+
[E.current, u.current, v.current].some(
|
|
83
|
+
(m) => m !== null && a.includes(m)
|
|
83
84
|
) || b(!1);
|
|
84
|
-
},
|
|
85
|
+
}, o = ie(() => b(!1));
|
|
85
86
|
return window.addEventListener("scroll", e, !0), window.addEventListener("resize", e), document.addEventListener("mousedown", t, !0), () => {
|
|
86
|
-
window.removeEventListener("scroll", e, !0), window.removeEventListener("resize", e), document.removeEventListener("mousedown", t, !0),
|
|
87
|
+
window.removeEventListener("scroll", e, !0), window.removeEventListener("resize", e), document.removeEventListener("mousedown", t, !0), o();
|
|
87
88
|
};
|
|
88
|
-
}, [
|
|
89
|
-
|
|
90
|
-
}, [
|
|
89
|
+
}, [l, I]), Z(() => {
|
|
90
|
+
l && se();
|
|
91
|
+
}, [l]);
|
|
91
92
|
const P = (e, t) => {
|
|
92
|
-
var
|
|
93
|
-
if (!((
|
|
94
|
-
|
|
93
|
+
var m, d, p;
|
|
94
|
+
if (!((m = e.options) != null && m.length)) {
|
|
95
|
+
L(null);
|
|
95
96
|
return;
|
|
96
97
|
}
|
|
97
|
-
const
|
|
98
|
-
(((p =
|
|
98
|
+
const o = t.getBoundingClientRect(), a = (((d = u.current) == null ? void 0 : d.getBoundingClientRect().left) ?? o.left) - z - 4, x = a >= h ? a : Math.min(
|
|
99
|
+
(((p = u.current) == null ? void 0 : p.getBoundingClientRect().right) ?? o.right) + 4,
|
|
99
100
|
window.innerWidth - z - h
|
|
100
101
|
);
|
|
101
|
-
|
|
102
|
-
},
|
|
102
|
+
L(e.value), R({ top: o.top, left: x });
|
|
103
|
+
}, S = (e, t) => {
|
|
103
104
|
F(e.value, t == null ? void 0 : t.value), b(!1);
|
|
104
|
-
},
|
|
105
|
+
}, f = r.find((e) => e.value === K);
|
|
105
106
|
return /* @__PURE__ */ g(T, { children: [
|
|
106
107
|
/* @__PURE__ */ n("div", { ref: E, className: "inline-flex", children: /* @__PURE__ */ n(
|
|
107
|
-
|
|
108
|
+
oe,
|
|
108
109
|
{
|
|
109
|
-
label: (
|
|
110
|
-
icon:
|
|
111
|
-
trailingIcon:
|
|
110
|
+
label: (s == null ? void 0 : s.label) ?? c,
|
|
111
|
+
icon: s != null && s.iconSrc ? /* @__PURE__ */ n(B, { src: s.iconSrc, name: s.label, size: 14 }) : void 0,
|
|
112
|
+
trailingIcon: w ? /* @__PURE__ */ n(re, { size: 10 }) : /* @__PURE__ */ n(te, { size: 10 }),
|
|
112
113
|
shape: "tab",
|
|
113
114
|
size: "small",
|
|
114
115
|
disabled: U,
|
|
115
116
|
onClick: () => b((e) => !e)
|
|
116
117
|
}
|
|
117
118
|
) }),
|
|
118
|
-
|
|
119
|
+
l && ee(
|
|
119
120
|
/* @__PURE__ */ g(T, { children: [
|
|
120
121
|
/* @__PURE__ */ n(
|
|
121
122
|
"div",
|
|
122
123
|
{
|
|
123
|
-
ref:
|
|
124
|
+
ref: u,
|
|
124
125
|
role: "menu",
|
|
125
126
|
"aria-label": Y,
|
|
126
|
-
|
|
127
|
+
...$,
|
|
127
128
|
style: N(j, _),
|
|
128
129
|
children: r.map((e) => {
|
|
129
|
-
var t,
|
|
130
|
+
var t, o;
|
|
130
131
|
return /* @__PURE__ */ g(
|
|
131
132
|
"button",
|
|
132
133
|
{
|
|
@@ -134,25 +135,25 @@ const h = 8, _ = 220, z = 240, N = (r, a) => ({
|
|
|
134
135
|
role: "menuitem",
|
|
135
136
|
"aria-haspopup": (t = e.options) != null && t.length ? "menu" : void 0,
|
|
136
137
|
style: W,
|
|
137
|
-
onMouseEnter: (
|
|
138
|
-
onFocus: (
|
|
138
|
+
onMouseEnter: (i) => P(e, i.currentTarget),
|
|
139
|
+
onFocus: (i) => P(e, i.currentTarget),
|
|
139
140
|
onClick: () => {
|
|
140
|
-
var
|
|
141
|
-
return (
|
|
141
|
+
var i;
|
|
142
|
+
return (i = e.options) != null && i.length ? S(e, e.options[0]) : S(e);
|
|
142
143
|
},
|
|
143
144
|
children: [
|
|
144
145
|
e.iconSrc ? /* @__PURE__ */ n(B, { src: e.iconSrc, name: e.label, size: 14 }) : null,
|
|
145
146
|
e.label,
|
|
146
|
-
e.value ===
|
|
147
|
-
(
|
|
147
|
+
e.value === c ? /* @__PURE__ */ n("span", { style: A, children: /* @__PURE__ */ n(D, { size: 11 }) }) : null,
|
|
148
|
+
(o = e.options) != null && o.length ? /* @__PURE__ */ n(
|
|
148
149
|
"span",
|
|
149
150
|
{
|
|
150
151
|
style: {
|
|
151
|
-
marginLeft: e.value ===
|
|
152
|
+
marginLeft: e.value === c ? 4 : "auto",
|
|
152
153
|
display: "inline-flex",
|
|
153
154
|
color: "var(--malachite-text-dimmed, rgb(161, 161, 161))"
|
|
154
155
|
},
|
|
155
|
-
children: /* @__PURE__ */ n(
|
|
156
|
+
children: /* @__PURE__ */ n(ne, { size: 10 })
|
|
156
157
|
}
|
|
157
158
|
) : null
|
|
158
159
|
]
|
|
@@ -162,21 +163,21 @@ const h = 8, _ = 220, z = 240, N = (r, a) => ({
|
|
|
162
163
|
})
|
|
163
164
|
}
|
|
164
165
|
),
|
|
165
|
-
(O =
|
|
166
|
+
(O = f == null ? void 0 : f.options) != null && O.length ? /* @__PURE__ */ n(
|
|
166
167
|
"div",
|
|
167
168
|
{
|
|
168
|
-
ref:
|
|
169
|
+
ref: v,
|
|
169
170
|
role: "menu",
|
|
170
|
-
"aria-label": `${
|
|
171
|
-
...
|
|
171
|
+
"aria-label": `${f.label} options`,
|
|
172
|
+
...q,
|
|
172
173
|
style: N(V, z),
|
|
173
|
-
children:
|
|
174
|
+
children: f.options.map((e) => /* @__PURE__ */ g(
|
|
174
175
|
"button",
|
|
175
176
|
{
|
|
176
177
|
type: "button",
|
|
177
178
|
role: "menuitem",
|
|
178
179
|
style: { ...W, alignItems: "flex-start" },
|
|
179
|
-
onClick: () =>
|
|
180
|
+
onClick: () => S(f, e),
|
|
180
181
|
children: [
|
|
181
182
|
/* @__PURE__ */ g(
|
|
182
183
|
"span",
|
|
@@ -188,11 +189,11 @@ const h = 8, _ = 220, z = 240, N = (r, a) => ({
|
|
|
188
189
|
},
|
|
189
190
|
children: [
|
|
190
191
|
e.label,
|
|
191
|
-
e.description ? /* @__PURE__ */ n("span", { style:
|
|
192
|
+
e.description ? /* @__PURE__ */ n("span", { style: ce, children: e.description }) : null
|
|
192
193
|
]
|
|
193
194
|
}
|
|
194
195
|
),
|
|
195
|
-
|
|
196
|
+
f.value === c && e.value === H ? /* @__PURE__ */ n("span", { style: A, children: /* @__PURE__ */ n(D, { size: 11 }) }) : null
|
|
196
197
|
]
|
|
197
198
|
},
|
|
198
199
|
e.value
|
|
@@ -205,7 +206,7 @@ const h = 8, _ = 220, z = 240, N = (r, a) => ({
|
|
|
205
206
|
] });
|
|
206
207
|
};
|
|
207
208
|
export {
|
|
208
|
-
|
|
209
|
-
|
|
209
|
+
Se as ChatModelPicker,
|
|
210
|
+
Se as default
|
|
210
211
|
};
|
|
211
212
|
//# sourceMappingURL=ChatModelPicker.js.map
|