@persona/design-system 0.10.10 → 0.10.12

package/dist/components/Chart/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","names":["Swatch"],"sources":["../../../src/components/Chart/chartColors.ts","../../../src/components/Chart/useChartColors.ts","../../../src/components/Chart/chartFrameLayout.ts","../../../src/components/Chart/ChartFrame.tsx","../../../src/components/Chart/ChartLegend.tsx","../../../src/components/Chart/useChartSeriesVisibility.ts","../../../src/components/Chart/ChartPopover.tsx","../../../src/components/Chart/useChartStyles.ts"],"sourcesContent":["import type { Color } from '@persona/design-tokens';\n\nimport { chartingColors, type MaybeChartingTheme } from '#src/lib/semanticColor';\nimport { chartingDark, type ChartingTokens } from '#src/variables/charting';\n\n/**\n * The charting palettes a chart may use. Each maps to a `ChartingColors` palette from\n * `@persona/design-tokens` (or its dark-mode twin under a PDS colour mode):\n *\n * - `qualitative` → `Qualitative` (12): distinct, unordered series. The default; its order is\n *   tuned for accessibility, so series take colours in this order.\n * - `sequentialMono` → `SequentialMono` (8): ordered magnitude in one hue.\n * - `sequentialDivergent` → `SequentialDivergent` (10): values diverging around a midpoint.\n *\n * The legacy `Sequential` and `Categorical` palettes are deliberately not offered.\n *\n * @experimental Part of the in-progress PDS charting components; the API may change.\n */\nexport type ChartPalette = 'qualitative' | 'sequentialMono' | 'sequentialDivergent';\n\n/** @experimental */\nexport const CHART_PALETTE_TOKENS = {\n  qualitative: 'Qualitative',\n  sequentialMono: 'SequentialMono',\n  sequentialDivergent: 'SequentialDivergent',\n} as const satisfies Record<ChartPalette, keyof ChartingTokens>;\n\n/** @experimental */\nexport const DEFAULT_CHART_PALETTE: ChartPalette = 'qualitative';\n\n/** @experimental */\nexport type ChartColorMode = 'light' | 'dark';\n\n/**\n * A colour override for one series: a Persona `Color` token, or a light/dark pair of tokens.\n * `Color` is a string enum, so a raw hex string (`'#3F48FD'`) does not type-check.\n *\n * Wrap overrides in {@link chartColor} so the `pds/semantic-color` lint rule accepts the `Color.*`\n * reference.\n *\n * @experimental\n */\nexport type ChartColor = Color | { readonly light: Color; readonly dark: Color };\n\n/**\n * Marks a series colour override as a deliberate chart colour. It returns its argument unchanged;\n * its job is to type-check the override (Persona tokens only, never hex) and to tell the\n * `pds/semantic-color` lint rule that the `Color.*` inside is intended.\n *\n * ```ts\n * { key: 'fraud', label: 'Fraud', color: chartColor(Color.CoreRed600) }\n * { key: 'fraud', label: 'Fraud', color: chartColor({ light: Color.CoreRed600, dark: Color.CoreRed400 }) }\n * ```\n *\n * @experimental\n */\nexport const chartColor = <C extends ChartColor>(color: C): C => color;\n\n/** One series as far as colour resolution is concerned. @experimental */\nexport interface ChartSeriesColorInput<K extends string = string> {\n  key: K;\n  color?: ChartColor;\n}\n\n/** @experimental */\nexport interface ResolveSeriesColorsOptions {\n  /** Palettes for the active colour mode, e.g. `chartingColors(theme)`. Defaults to light. */\n  tokens?: ChartingTokens;\n  /** Defaults to `'qualitative'`. */\n  palette?: ChartPalette;\n  /** Picks the side of a light/dark override pair. Defaults to `'light'`. */\n  mode?: ChartColorMode;\n}\n\n/** The ordered colours of `palette` in `tokens`. @experimental */\nexport const chartPaletteColors = (\n  tokens: ChartingTokens,\n  palette: ChartPalette = DEFAULT_CHART_PALETTE,\n): readonly Color[] => tokens[CHART_PALETTE_TOKENS[palette]];\n\n/** Resolves an override to the single token for `mode`. @experimental */\nexport const resolveChartColor = (color: ChartColor, mode: ChartColorMode): Color =>\n  typeof color === 'string' ? color : color[mode];\n\n/** `'dark'` when `theme` carries the dark charting palettes, else `'light'`. @experimental */\nexport const chartColorModeOf = (theme: MaybeChartingTheme | undefined): ChartColorMode =>\n  theme?.charting === chartingDark ? 'dark' : 'light';\n\nconst warnedPaletteOverflow = new Set<string>();\n\n/**\n * Assigns each series a colour token, keyed by series key.\n *\n * Series without an override take the palette colour at their own index, so a series keeps its\n * colour when another is hidden or overridden. Past the end of the palette colours repeat and a\n * development warning suggests grouping the extra series (e.g. into \"Other\"): never invent colours.\n *\n * @experimental\n */\nexport function resolveSeriesColors<K extends string>(\n  series: readonly ChartSeriesColorInput<K>[],\n  { tokens = chartingColors(undefined), palette, mode = 'light' }: ResolveSeriesColorsOptions = {},\n): Record<K, Color> {\n  const colors = chartPaletteColors(tokens, palette);\n  const resolved = {} as Record<K, Color>;\n\n  series.forEach(({ key, color }, index) => {\n    resolved[key] = color ? resolveChartColor(color, mode) : colors[index % colors.length];\n  });\n\n  const overflowKey = `${palette ?? DEFAULT_CHART_PALETTE}:${series.length}`;\n  if (\n    process.env.NODE_ENV !== 'production' &&\n    series.length > colors.length &&\n    !warnedPaletteOverflow.has(overflowKey)\n  ) {\n    warnedPaletteOverflow.add(overflowKey);\n    console.warn(\n      `[PDS charts] ${series.length} series exceed the ${colors.length}-colour ` +\n        `${palette ?? DEFAULT_CHART_PALETTE} palette, so colours repeat. ` +\n        'Group the extra series (for example into \"Other\") instead of adding colours.',\n    );\n  }\n\n  return resolved;\n}\n","import { useCallback, useMemo } from 'react';\nimport { useTheme } from 'styled-components';\n\nimport type { Color } from '@persona/design-tokens';\n\nimport { chartingColors, type MaybeChartingTheme } from '#src/lib/semanticColor';\n\nimport {\n  type ChartColorMode,\n  chartColorModeOf,\n  type ChartPalette,\n  chartPaletteColors,\n  type ChartSeriesColorInput,\n  DEFAULT_CHART_PALETTE,\n  resolveSeriesColors,\n} from './chartColors';\n\n/** @experimental */\nexport interface ChartColors {\n  /** The colour mode the palettes were read for. */\n  mode: ChartColorMode;\n  /** The ordered colours of the selected palette for that mode. */\n  colors: readonly Color[];\n  /** {@link resolveSeriesColors} bound to the selected palette and mode. */\n  resolve: <K extends string>(series: readonly ChartSeriesColorInput<K>[]) => Record<K, Color>;\n}\n\n/**\n * The chart colours for the current PDS colour mode. Reads the charting palettes `PDSProvider` /\n * `ColorModeScope` install on the styled-components theme, so charts follow dark mode with no\n * extra setup; without a PDS colour mode it returns the light `ChartingColors`.\n *\n * ```tsx\n * const { resolve } = useChartColors();\n * const colors = resolve([{ key: 'approved' }, { key: 'declined', color: chartColor(Color.CoreRed600) }]);\n * <Bar dataKey='approved' fill={colors.approved} />\n * ```\n *\n * @experimental\n */\nexport function useChartColors(palette: ChartPalette = DEFAULT_CHART_PALETTE): ChartColors {\n  const theme = useTheme() as MaybeChartingTheme | undefined;\n  const tokens = chartingColors(theme);\n  const mode = chartColorModeOf(theme);\n  const colors = chartPaletteColors(tokens, palette);\n\n  const resolve = useCallback(\n    <K extends string>(series: readonly ChartSeriesColorInput<K>[]) =>\n      resolveSeriesColors(series, { tokens, palette, mode }),\n    [tokens, palette, mode],\n  );\n\n  return useMemo(() => ({ mode, colors, resolve }), [mode, colors, resolve]);\n}\n","import { createContext, useContext } from 'react';\n\n/**\n * Where a `ChartFrame` places its legend:\n * - `'stack'` (default): left-aligned above the plot; legend items run in a wrapping row.\n * - `'right'`: inline to the right of the plot, top-aligned; legend items run in a column.\n *\n * @experimental Part of the in-progress PDS charting components; the API may change.\n */\nexport type ChartLegendPosition = 'stack' | 'right';\n\n/** @experimental */\nexport const DEFAULT_CHART_LEGEND_POSITION: ChartLegendPosition = 'stack';\n\n/**\n * Plot height in px when a `ChartFrame` is given none. The plot always fills the frame's width.\n *\n * @experimental\n */\nexport const CHART_DEFAULT_HEIGHT = 300;\n\n/**\n * Opacity of a de-emphasised series: a hidden series' legend swatch, and the series a pointer is\n * not on (its popover row and its segment in the hovered bar).\n *\n * @experimental\n */\nexport const CHART_INACTIVE_OPACITY = 0.65;\n\n/**\n * Recharts margin for a plot inside a `ChartFrame`. The frame owns the spacing around the plot\n * (`Spacing[3]` between legend and plot) and lets axis labels overflow the SVG, so the chart adds\n * no margin of its own: `<BarChart margin={CHART_PLOT_MARGIN} ...>`.\n *\n * @experimental\n */\nexport const CHART_PLOT_MARGIN = { top: 0, right: 0, bottom: 0, left: 0 } as const;\n\nconst ChartLegendPositionContext = createContext<ChartLegendPosition | undefined>(undefined);\n\n/** Provided by `ChartFrame` so its `ChartLegend` lays its items out to match. */\nexport const ChartLegendPositionProvider = ChartLegendPositionContext.Provider;\n\n/** The legend position of the enclosing `ChartFrame`, or `undefined` outside one. */\nexport const useChartLegendPosition = (): ChartLegendPosition | undefined =>\n  useContext(ChartLegendPositionContext);\n","import type { ReactElement } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { Spacing } from '@persona/design-tokens';\n\nimport {\n  ChartLegendPositionProvider,\n  type ChartLegendPosition,\n  CHART_DEFAULT_HEIGHT,\n  DEFAULT_CHART_LEGEND_POSITION,\n} from './chartFrameLayout';\nimport type { ChartLegendProps } from './ChartLegend';\n\ntype ChartFrameLabel =\n  | { 'aria-label': string; 'aria-labelledby'?: never }\n  | { 'aria-labelledby': string; 'aria-label'?: never };\n\n/** @experimental */\nexport type ChartFrameProps = ChartFrameLabel & {\n  /**\n   * The chart's legend. Pass `null` to omit it, e.g. for a single-series chart whose surrounding\n   * heading already names the series.\n   */\n  legend: ReactElement<ChartLegendProps> | null;\n  /**\n   * `'stack'` (default) puts the legend left-aligned above the plot; `'right'` puts it inline to\n   * the right of the plot, as wide as its longest label up to 200px (longer labels end in an\n   * ellipsis). The legend and plot are `Spacing[4]` apart when stacked and `Spacing[3]` apart inline.\n   */\n  legendPosition?: ChartLegendPosition;\n  /**\n   * Plot area height in px. Defaults to 300 (`CHART_DEFAULT_HEIGHT`). The plot always fills 100%\n   * of the frame's width, and the frame fills its container.\n   */\n  height?: number;\n  /**\n   * The plot: a Recharts chart, sized by the frame (e.g. wrapped in `ResponsiveContainer`). Give it\n   * `margin={CHART_PLOT_MARGIN}` so the frame's spacing is the only gap around the plot.\n   */\n  children: ReactElement;\n  /** Applied to the root `<figure>`, e.g. to position or size the frame. */\n  className?: string;\n};\n\n// Legend-to-plot gap: Spacing[4] (16px) when the legend sits above the plot, Spacing[3] (12px)\n// when it is inline on the right.\nconst Frame = styled.figure<{ $position: ChartLegendPosition }>`\n  display: flex;\n  gap: ${({ $position }) => ($position === 'right' ? Spacing[3] : Spacing[4])};\n  box-sizing: border-box;\n  width: 100%;\n  margin: 0;\n  min-width: 0;\n  ${({ $position }) =>\n    $position === 'right'\n      ? css`\n          flex-direction: row-reverse;\n          align-items: flex-start;\n        `\n      : css`\n          flex-direction: column;\n          align-items: flex-start;\n        `}\n`;\n\n// Inline legend cap: no width token exists (the Spacing scale stops at 56px). Labels past it\n// truncate with an ellipsis; 33% keeps the legend from squeezing a narrow plot.\nconst INLINE_LEGEND_MAX_WIDTH = '200px';\n\nconst LegendSlot = styled.div<{ $position: ChartLegendPosition }>`\n  min-width: 0;\n  ${({ $position }) =>\n    $position === 'right' &&\n    css`\n      flex: 0 0 auto;\n      width: max-content; /* fits the longest label, on one line */\n      max-width: min(${INLINE_LEGEND_MAX_WIDTH}, 33%);\n    `}\n`;\n\nconst Plot = styled.div<{ $height: number }>`\n  align-self: stretch;\n  flex: 1 1 auto;\n  min-width: 0;\n  height: ${({ $height }) => $height}px;\n\n  /* Axis labels may overflow the plot box instead of needing a Recharts margin. */\n  .recharts-surface {\n    overflow: visible;\n  }\n`;\n\n/**\n * Lays out a chart: its legend and the plot area, `Spacing[4]` apart stacked (`Spacing[3]` inline), with the legend left-aligned\n * above the plot (`legendPosition='stack'`, the default) or inline on its right (`'right'`). The\n * frame has no header, border or surface of its own: titles, descriptions and controls belong to\n * the surrounding container (for example a `CardV2`), which also names the chart via\n * `aria-labelledby`.\n *\n * Size: the chart fills 100% of its container's width, and the plot is 300px tall\n * (`CHART_DEFAULT_HEIGHT`) unless `height` overrides it.\n *\n * @experimental Part of the in-progress PDS charting components; the API may change.\n */\nexport function ChartFrame({\n  legend,\n  legendPosition = DEFAULT_CHART_LEGEND_POSITION,\n  height = CHART_DEFAULT_HEIGHT,\n  children,\n  className,\n  ...label\n}: ChartFrameProps) {\n  return (\n    <ChartLegendPositionProvider value={legendPosition}>\n      <Frame\n        $position={legendPosition}\n        className={className}\n        data-legend-position={legendPosition}\n        {...label}\n      >\n        {legend && <LegendSlot $position={legendPosition}>{legend}</LegendSlot>}\n        <Plot $height={height}>{children}</Plot>\n      </Frame>\n    </ChartLegendPositionProvider>\n  );\n}\n\nexport default ChartFrame;\n","import styled from 'styled-components';\n\nimport { BorderRadius, Color, Spacing } from '@persona/design-tokens';\n\nimport Stack from '#src/components/Stack';\nimport { Paragraph } from '#src/components/Text';\nimport { semanticColor } from '#src/lib/semanticColor';\nimport { focusOutline } from '#src/mixins/focus';\nimport { paragraphMixins } from '#src/mixins/text';\n\nimport { CHART_INACTIVE_OPACITY, useChartLegendPosition } from './chartFrameLayout';\n\n/** One series in a {@link ChartLegend}. @experimental */\nexport interface ChartLegendItem<K extends string = string> {\n  key: K;\n  label: string;\n  /** The series colour, from `useChartColors().resolve(...)` or `resolveSeriesColors(...)`. */\n  color: Color;\n}\n\n/** A titled set of legend items, e.g. the series sharing an axis. @experimental */\nexport interface ChartLegendGroup<K extends string = string> {\n  key: string;\n  /** Shown above the group's items in uppercase mono text. */\n  label: string;\n  items: readonly ChartLegendItem<K>[];\n}\n\n/** Either flat `items` or titled `groups`; groups are optional. @experimental */\nexport type ChartLegendContent<K extends string = string> =\n  | { items: readonly ChartLegendItem<K>[]; groups?: never }\n  | { groups: readonly ChartLegendGroup<K>[]; items?: never };\n\n/** @experimental */\nexport type ChartLegendProps<K extends string = string> = ChartLegendContent<K> & {\n  /** Keys of the series currently hidden. Pair with {@link useChartSeriesVisibility}. */\n  hidden?: readonly K[];\n  /**\n   * Called with a series key when its legend item is clicked. When set, every item is a toggle\n   * button (`aria-pressed` is true while the series is shown); when omitted, the legend is static.\n   * Every series may be hidden.\n   */\n  onToggle?: (key: K) => void;\n  /** Names the legend for assistive tech. Defaults to \"Chart legend\". */\n  'aria-label'?: string;\n  /** Applied to the legend's root element (the list, or the group wrapper with `groups`). */\n  className?: string;\n};\n\n// Placeholder sizes until the Figma Legend frame (2033-22027) is available.\nconst SWATCH_SIZE = Spacing[3];\n\nconst List = styled(Stack)`\n  min-width: 0;\n  max-width: 100%;\n  margin: 0;\n  padding: 0;\n  list-style: none;\n`;\n\nconst ListItem = styled.li`\n  display: flex;\n  min-width: 0;\n  max-width: 100%;\n`;\n\n// One line: past the legend's max width (inline legend) the label ends in an ellipsis.\nconst Label = styled(Paragraph)`\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n`;\n\nconst Swatch = styled.span<{ $color: Color; $hidden: boolean }>`\n  flex-shrink: 0;\n  width: ${SWATCH_SIZE};\n  height: ${SWATCH_SIZE};\n  border-radius: ${BorderRadius.Sm};\n  background: ${({ $color }) => $color};\n  opacity: ${({ $hidden }) => ($hidden ? CHART_INACTIVE_OPACITY : 1)};\n`;\n\n// Flex rows with the TextMedium line box: the 12px swatch centres on the 20px label line.\nconst ToggleButton = styled.button`\n  ${paragraphMixins.md};\n  display: flex;\n  align-items: center;\n  gap: ${Spacing[2]};\n  min-width: 0;\n  max-width: 100%;\n  margin: 0;\n  padding: 0;\n  border: 0;\n  border-radius: ${BorderRadius.Sm};\n  background: none;\n  color: inherit;\n  text-align: start;\n  cursor: pointer;\n  ${focusOutline}\n\n  /* Hover and pressed fill, as on a text Button. The same-colour spread ring paints the fill a\n     little past the item without changing the legend's layout. */\n  &:hover {\n    ${({ theme }) => {\n      const fill = semanticColor(theme, 'ActionNeutralHover', Color.CoreSlate100);\n      return `background-color: ${fill}; box-shadow: 0 0 0 ${Spacing[1]} ${fill};`;\n    }}\n  }\n\n  &:active {\n    ${({ theme }) => {\n      const fill = semanticColor(theme, 'ActionNeutralActive', Color.CoreSlate200);\n      return `background-color: ${fill}; box-shadow: 0 0 0 ${Spacing[1]} ${fill};`;\n    }}\n  }\n`;\n\nconst StaticItem = styled.span`\n  ${paragraphMixins.md};\n  display: flex;\n  align-items: center;\n  gap: ${Spacing[2]};\n  min-width: 0;\n  max-width: 100%;\n`;\n\nconst GroupTitle = styled.span`\n  ${paragraphMixins.smMono};\n  text-transform: uppercase;\n  color: ${({ theme }) => semanticColor(theme, 'FgSecondary', Color.TextSecondary)};\n`;\n\ninterface LegendItemsProps<K extends string> {\n  items: readonly ChartLegendItem<K>[];\n  hidden: readonly K[];\n  onToggle?: (key: K) => void;\n  'aria-label': string;\n  vertical: boolean;\n  className?: string;\n}\n\nfunction LegendItems<K extends string>({\n  items,\n  hidden,\n  onToggle,\n  'aria-label': ariaLabel,\n  vertical,\n  className,\n}: LegendItemsProps<K>) {\n  return (\n    <List\n      as='ul'\n      className={className}\n      aria-label={ariaLabel}\n      direction={vertical ? 'vertical' : 'horizontal'}\n      spacing={vertical ? Spacing[2] : Spacing[4]}\n      wrap={vertical ? undefined : 'wrap'}\n      align={vertical ? 'flex-start' : 'center'}\n    >\n      {items.map(({ key, label, color }) => {\n        const isHidden = hidden.includes(key);\n        const content = (\n          <>\n            <Swatch $color={color} $hidden={isHidden} aria-hidden />\n            <Label as='span' size='md' color={isHidden ? 'tertiary' : 'primary'} title={label}>\n              {label}\n            </Label>\n          </>\n        );\n        return (\n          <ListItem key={key}>\n            {onToggle ? (\n              <ToggleButton type='button' aria-pressed={!isHidden} onClick={() => onToggle(key)}>\n                {content}\n              </ToggleButton>\n            ) : (\n              <StaticItem>{content}</StaticItem>\n            )}\n          </ListItem>\n        );\n      })}\n    </List>\n  );\n}\n\n/**\n * The series key for a chart: a square colour swatch and a `TextMedium` label per series, laid out\n * in a row that wraps (a column when it sits right of the plot in a `ChartFrame`). With `onToggle`,\n * each item toggles its series; a hidden series keeps a filled swatch at 65% opacity and gets a\n * muted label.\n *\n * Pass `groups` instead of `items` for a grouped legend: groups stack `Spacing[2]` apart, each with\n * an uppercase mono title `Spacing[1]` above its row of items.\n *\n * @experimental Part of the in-progress PDS charting components; the API may change.\n */\nexport function ChartLegend<K extends string>({\n  items,\n  groups,\n  hidden = [],\n  onToggle,\n  'aria-label': ariaLabel = 'Chart legend',\n  className,\n}: ChartLegendProps<K>) {\n  // Beside the plot (`ChartFrame legendPosition='right'`) the items run in a column.\n  const vertical = useChartLegendPosition() === 'right';\n\n  if (!groups) {\n    return (\n      <LegendItems\n        items={items}\n        hidden={hidden}\n        onToggle={onToggle}\n        aria-label={ariaLabel}\n        vertical={vertical}\n        className={className}\n      />\n    );\n  }\n\n  return (\n    <Stack\n      role='group'\n      aria-label={ariaLabel}\n      className={className}\n      spacing={Spacing[2]}\n      align='flex-start'\n    >\n      {groups.map((group) => (\n        <Stack key={group.key} spacing={Spacing[1]} align='flex-start'>\n          <GroupTitle aria-hidden>{group.label}</GroupTitle>\n          <LegendItems\n            items={group.items}\n            hidden={hidden}\n            onToggle={onToggle}\n            aria-label={group.label}\n            vertical={vertical}\n          />\n        </Stack>\n      ))}\n    </Stack>\n  );\n}\n\nexport default ChartLegend;\n","import { useCallback, useMemo, useState } from 'react';\n\n/** @experimental */\nexport interface ChartSeriesVisibility<K extends string> {\n  /** Keys of the hidden series, in series order: pass to `ChartLegend`'s `hidden`. */\n  hidden: K[];\n  /** Pass to `ChartLegend`'s `onToggle`. */\n  toggle: (key: K) => void;\n  isHidden: (key: K) => boolean;\n  /** True when every series is hidden; the plot keeps its size and axes. */\n  allHidden: boolean;\n}\n\n/**\n * Show/hide state for a chart's series, driven by a {@link ChartLegend}. Every series may be hidden.\n * Hide a Recharts series with its `hide` prop (`<Bar hide={isHidden(key)} />`) rather than\n * unmounting it, so colours and axes stay put.\n *\n * @experimental\n */\nexport function useChartSeriesVisibility<K extends string>(\n  keys: readonly K[],\n  initialHidden: readonly K[] = [],\n): ChartSeriesVisibility<K> {\n  const [hiddenSet, setHiddenSet] = useState<ReadonlySet<K>>(() => new Set(initialHidden));\n\n  const toggle = useCallback((key: K) => {\n    setHiddenSet((current) => {\n      const next = new Set(current);\n      if (next.has(key)) {\n        next.delete(key);\n      } else {\n        next.add(key);\n      }\n      return next;\n    });\n  }, []);\n\n  const isHidden = useCallback((key: K) => hiddenSet.has(key), [hiddenSet]);\n\n  return useMemo(() => {\n    const hidden = keys.filter((key) => hiddenSet.has(key));\n    return {\n      hidden,\n      toggle,\n      isHidden,\n      allHidden: keys.length > 0 && hidden.length === keys.length,\n    };\n  }, [keys, hiddenSet, toggle, isHidden]);\n}\n","import type { ReactNode } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { BorderRadius, Color, Spacing } from '@persona/design-tokens';\n\nimport { usePDSLocale } from '#src/lib/i18n';\nimport { semanticColor } from '#src/lib/semanticColor';\nimport { paragraphMixins } from '#src/mixins/text';\nimport { Elevation, Hairline } from '#src/variables/effect';\n\nimport { CHART_INACTIVE_OPACITY } from './chartFrameLayout';\n\n/**\n * The popover density. `'default'` is the standalone chart popover (256px wide). `'condensed'` is\n * for small charts inside table cells (210px wide): the same text, tighter padding and row gaps,\n * and never a total row.\n *\n * @experimental Part of the in-progress PDS charting components; the API may change.\n */\nexport type ChartPopoverSize = 'default' | 'condensed';\n\n/**\n * One series the popover may list. `series` sets the row order, the label and the swatch colour; a\n * Recharts payload entry is matched to a series by its `dataKey`.\n *\n * @experimental\n */\nexport interface ChartPopoverSeries<K extends string = string> {\n  key: K;\n  label: ReactNode;\n  /** The series colour token, e.g. from `useChartColors().resolve(...)`. Falls back to the payload colour. */\n  color?: Color;\n}\n\n/**\n * One Recharts tooltip payload entry, typed structurally so the same component accepts the\n * payloads of Recharts 2 (`TooltipProps`) and Recharts 3 (`TooltipContentProps`).\n *\n * @experimental\n */\nexport interface ChartPopoverPayloadEntry {\n  dataKey?: unknown;\n  name?: unknown;\n  value?: unknown;\n  color?: string;\n  fill?: string;\n  stroke?: string;\n  /** Set by Recharts 3 for a series rendered with `hide`. */\n  hide?: boolean;\n  /** Set for legend-inactive series. */\n  inactive?: boolean;\n  /** `'none'` marks an entry Recharts itself keeps out of its tooltip. */\n  type?: string;\n  payload?: unknown;\n}\n\n/** One rendered row. @experimental */\nexport interface ChartPopoverRow {\n  key: string;\n  label: ReactNode;\n  /** The swatch colour: a Persona chart colour token. */\n  color?: string;\n  value: number | string | null | undefined;\n}\n\ninterface ChartPopoverPanelOwnProps<K extends string = string> {\n  /** The header, e.g. the formatted x-axis category. Omitted when empty. */\n  label?: ReactNode;\n  /** The rows, top to bottom. */\n  rows: readonly ChartPopoverRow[];\n  /** Formats each row value and the total. Defaults to locale number formatting. */\n  valueFormatter?: (value: number | string, seriesKey: K | 'total') => ReactNode;\n  /** Appends a total row summing the numeric values of the visible rows. Ignored when `condensed`. */\n  showTotal?: boolean;\n  /** Overrides the computed total. */\n  total?: number;\n  /** Label of the total row. Defaults to `'Total'`. */\n  totalLabel?: ReactNode;\n  /** Defaults to `'default'`. */\n  size?: ChartPopoverSize;\n  /**\n   * Popover width in px. Defaults to 256 (`'default'`) or 210 (`'condensed'`); pass a larger number\n   * for long series names. The height always follows the rows. Series names that still do not fit\n   * are truncated with an ellipsis; values never truncate or wrap.\n   */\n  width?: number;\n  /**\n   * The series the pointer is on (`useChartActiveSeries().activeSeries`). Its row stays at full\n   * strength and the other series rows drop to 65% opacity; the total row is unaffected.\n   */\n  activeSeries?: K;\n  className?: string;\n}\n\n/** @experimental */\nexport type ChartPopoverPanelProps<K extends string = string> = ChartPopoverPanelOwnProps<K>;\n\n/** @experimental */\nexport interface ChartPopoverProps<K extends string = string> extends Omit<\n  ChartPopoverPanelOwnProps<K>,\n  'rows' | 'label'\n> {\n  /** Injected by Recharts `<Tooltip>`. */\n  active?: boolean;\n  /** Injected by Recharts `<Tooltip>`. */\n  payload?: readonly ChartPopoverPayloadEntry[];\n  /** Injected by Recharts `<Tooltip>`: the hovered category. */\n  label?: unknown;\n  /**\n   * The chart's series, in display order. Rows follow this order and only series listed here are\n   * shown. Without it, rows follow the payload order and use the payload's names and colours.\n   */\n  series?: readonly ChartPopoverSeries<K>[];\n  /** Series keys hidden by the legend; they get no row. */\n  hiddenSeries?: Iterable<K>;\n  /** Formats the header from the hovered category. Defaults to the category as is. */\n  labelFormatter?: (label: unknown, payload: readonly ChartPopoverPayloadEntry[]) => ReactNode;\n}\n\n/** Default popover widths in px (Figma). @experimental */\nexport const CHART_POPOVER_WIDTH: Record<ChartPopoverSize, number> = {\n  default: 256,\n  condensed: 210,\n};\n\n// The sizes share their text (TextMedium rows, TextMediumBold title) and differ in spacing.\nconst SPACING = {\n  default: { padding: Spacing[3], gap: Spacing[2] },\n  condensed: { padding: Spacing[2], gap: Spacing[1] },\n} as const satisfies Record<ChartPopoverSize, unknown>;\n\ntype SizeProps = { $size: ChartPopoverSize };\n\nconst Panel = styled.div<SizeProps>`\n  ${paragraphMixins.md};\n  box-sizing: border-box;\n  display: flex;\n  flex-direction: column;\n  gap: ${({ $size }) => SPACING[$size].gap};\n  padding: ${({ $size }) => SPACING[$size].padding};\n  border-radius: ${BorderRadius.Md};\n  background-color: ${({ theme }) => semanticColor(theme, 'SurfacePrimary', Color.BackgroundPrimary)};\n  box-shadow: ${Elevation.Mid};\n  color: ${({ theme }) => semanticColor(theme, 'FgPrimary', Color.TextPrimary)};\n  pointer-events: none;\n`;\n\nconst Header = styled.div`\n  ${paragraphMixins.mdBold};\n`;\n\nconst Rows = styled.ul<SizeProps>`\n  display: flex;\n  flex-direction: column;\n  gap: ${({ $size }) => SPACING[$size].gap};\n  margin: 0;\n  padding: 0;\n  list-style: none;\n`;\n\nconst Row = styled.li<{ $dimmed?: boolean }>`\n  display: grid;\n  grid-template-columns: auto minmax(0, 1fr) auto;\n  align-items: center;\n  column-gap: ${Spacing[2]};\n  opacity: ${({ $dimmed }) => ($dimmed ? CHART_INACTIVE_OPACITY : 1)};\n`;\n\nconst TotalRow = styled(Row)`\n  padding-top: ${Spacing[1]};\n  box-shadow: ${Hairline.Top};\n`;\n\n// PDS has no 2px radius token (BorderRadius starts at Sm = 3px); the swatch design is 2px.\nconst SWATCH_RADIUS = '2px';\n\n// The fill is the series' chart colour token, so it is set inline rather than through a semantic\n// token. 12px square in both sizes.\nconst Swatch = styled.span`\n  width: ${Spacing[3]};\n  height: ${Spacing[3]};\n  border-radius: ${SWATCH_RADIUS};\n  flex-shrink: 0;\n`;\n\nconst SeriesName = styled.span`\n  overflow: hidden;\n  color: ${({ theme }) => semanticColor(theme, 'FgSecondary', Color.TextSecondary)};\n  text-overflow: ellipsis;\n  white-space: nowrap;\n`;\n\n// TextMedium like the rest of the body (proportional figures, no mono or tabular numerals).\nconst Value = styled.span`\n  ${paragraphMixins.md};\n  text-align: right;\n  white-space: nowrap;\n`;\n\nconst isPresent = (value: unknown): value is number | string =>\n  typeof value === 'number' ? !Number.isNaN(value) : typeof value === 'string' && value !== '';\n\n/**\n * The chart popover body: an optional header, one row per series (swatch, name, right-aligned\n * value) and an optional total row. Use it directly for a popover drawn outside Recharts; inside a\n * Recharts chart use {@link ChartPopover}.\n *\n * @experimental Part of the in-progress PDS charting components; the API may change.\n */\nexport function ChartPopoverPanel<K extends string = string>({\n  label,\n  rows,\n  valueFormatter,\n  showTotal = false,\n  total,\n  totalLabel = 'Total',\n  size = 'default',\n  width,\n  activeSeries,\n  className,\n}: ChartPopoverPanelProps<K>) {\n  const locale = usePDSLocale();\n  const format = (value: number | string, key: K | 'total'): ReactNode => {\n    if (valueFormatter) {\n      return valueFormatter(value, key);\n    }\n    return typeof value === 'number' ? value.toLocaleString(locale) : value;\n  };\n\n  const totalValue =\n    total ??\n    rows.reduce(\n      (sum, { value }) => (typeof value === 'number' && !Number.isNaN(value) ? sum + value : sum),\n      0,\n    );\n  const hasLabel = label !== undefined && label !== null && label !== '';\n\n  return (\n    <Panel\n      $size={size}\n      className={className}\n      data-size={size}\n      data-test='chart-popover'\n      style={{ width: width ?? CHART_POPOVER_WIDTH[size] }}\n    >\n      {hasLabel && <Header>{label}</Header>}\n      <Rows $size={size}>\n        {rows.map((row) => (\n          <Row\n            key={row.key}\n            $dimmed={activeSeries !== undefined && row.key !== activeSeries}\n            data-active={activeSeries === row.key || undefined}\n          >\n            <Swatch aria-hidden style={{ background: row.color }} />\n            <SeriesName title={typeof row.label === 'string' ? row.label : undefined}>\n              {row.label}\n            </SeriesName>\n            <Value>{isPresent(row.value) ? format(row.value, row.key as K) : '–'}</Value>\n          </Row>\n        ))}\n        {showTotal && size !== 'condensed' && (\n          <TotalRow>\n            {/* An unpainted swatch keeps the total label aligned with the series names. */}\n            <Swatch aria-hidden />\n            <span>{totalLabel}</span>\n            <Value>{format(totalValue, 'total')}</Value>\n          </TotalRow>\n        )}\n      </Rows>\n    </Panel>\n  );\n}\n\nconst entryKey = ({ dataKey, name }: ChartPopoverPayloadEntry): string | undefined => {\n  if (typeof dataKey === 'string' || typeof dataKey === 'number') {\n    return String(dataKey);\n  }\n  return typeof name === 'string' || typeof name === 'number' ? String(name) : undefined;\n};\n\nconst isEntryVisible = (entry: ChartPopoverPayloadEntry): boolean =>\n  !entry.hide && !entry.inactive && entry.type !== 'none';\n\n/**\n * Builds the popover rows from a Recharts tooltip payload: drops hidden and inactive series, then\n * orders, labels and colours the rest by `series` (or keeps the payload order without it).\n *\n * @experimental\n */\nexport function chartPopoverRows<K extends string>(\n  payload: readonly ChartPopoverPayloadEntry[],\n  series?: readonly ChartPopoverSeries<K>[],\n  hiddenSeries?: Iterable<K>,\n): ChartPopoverRow[] {\n  const hidden = new Set<string>(hiddenSeries ?? []);\n  const visible = new Map<string, ChartPopoverPayloadEntry>();\n  for (const entry of payload) {\n    const key = entryKey(entry);\n    if (key !== undefined && !hidden.has(key) && isEntryVisible(entry) && !visible.has(key)) {\n      visible.set(key, entry);\n    }\n  }\n\n  const payloadColor = (entry: ChartPopoverPayloadEntry) =>\n    entry.color ?? entry.fill ?? entry.stroke;\n\n  if (!series) {\n    return [...visible].map(([key, entry]) => ({\n      key,\n      label: isPresent(entry.name) ? entry.name : key,\n      color: payloadColor(entry),\n      value: entry.value as ChartPopoverRow['value'],\n    }));\n  }\n\n  return series.flatMap(({ key, label, color }) => {\n    const entry = visible.get(key);\n    return entry\n      ? [\n          {\n            key,\n            label,\n            color: color ?? payloadColor(entry),\n            value: entry.value as ChartPopoverRow['value'],\n          },\n        ]\n      : [];\n  });\n}\n\n/**\n * Chart popover (tooltip) content for Recharts 2 and 3. Pass it to `<Tooltip content={...} />`;\n * Recharts injects `active`, `payload` and `label`.\n *\n * ```tsx\n * const series = [{ key: 'approved', label: 'Approved', color: colors.approved }, ...];\n * <Tooltip cursor={false} content={<ChartPopover series={series} hiddenSeries={hidden} />} />\n * ```\n *\n * Renders nothing while inactive or when every series is hidden.\n *\n * @experimental Part of the in-progress PDS charting components; the API may change.\n */\nexport function ChartPopover<K extends string = string>({\n  active,\n  payload,\n  label,\n  series,\n  hiddenSeries,\n  labelFormatter,\n  ...panelProps\n}: ChartPopoverProps<K>) {\n  if (!active || !payload || payload.length === 0) {\n    return null;\n  }\n  const rows = chartPopoverRows(payload, series, hiddenSeries);\n  if (rows.length === 0) {\n    return null;\n  }\n  const header = labelFormatter ? labelFormatter(label, payload) : (label as ReactNode);\n\n  return <ChartPopoverPanel<K> {...panelProps} label={header} rows={rows} />;\n}\n","import { useCallback, useState } from 'react';\nimport { useTheme } from 'styled-components';\n\nimport { Color, Typography } from '@persona/design-tokens';\n\nimport { semanticColor } from '#src/lib/semanticColor';\nimport type { PersonaTheme } from '#src/theme';\n\nimport { CHART_INACTIVE_OPACITY } from './chartFrameLayout';\n\n// Between Recharts 3's cursor rectangle (200) and its bars (300).\nconst GRID_Z_INDEX = 250;\n\n/** Axis tick text style (TextSmall). @experimental */\nexport interface ChartTickStyle {\n  fill: string;\n  fontSize: string;\n  fontFamily: string;\n}\n\n/** What {@link useChartStyles} returns: props to spread on Recharts components. @experimental */\nexport interface ChartStyles {\n  /** The resolved semantic colours behind the props below. */\n  colors: { grid: string; axis: string; text: string; surface: string; hover: string };\n  grid: { vertical: false; stroke: string; zIndex: number };\n  xAxis: { tick: ChartTickStyle; tickLine: false; axisLine: { stroke: string } };\n  yAxis: { tick: ChartTickStyle; tickLine: false; axisLine: false };\n  barCursor: { fill: string; fillOpacity: number };\n  lineCursor: { stroke: string };\n  segmentGap: { stroke: string; strokeWidth: number };\n  activeDot: { r: number; stroke: string; strokeWidth: number };\n}\n\n/**\n * PDS styling for hand-built Recharts charts, as props to spread on Recharts' own components so a\n * custom chart (reference lines, formatters, extra children) keeps the PDS look:\n *\n * ```tsx\n * const styles = useChartStyles();\n * <BarChart data={data} margin={CHART_PLOT_MARGIN}>\n *   <Tooltip cursor={styles.barCursor} content={<ChartPopover series={series} />} />\n *   <CartesianGrid {...styles.grid} />\n *   <XAxis dataKey='month' {...styles.xAxis} tickFormatter={formatMonth} />\n *   <YAxis {...styles.yAxis} />\n *   <ReferenceLine y={target} stroke={styles.colors.axis} strokeDasharray='4 4' />\n *   ...\n * </BarChart>\n * ```\n *\n * Colours come from semantic tokens, so they follow light and dark mode.\n *\n * @experimental Part of the in-progress PDS charting components; the API may change.\n */\nexport function useChartStyles(): ChartStyles {\n  const theme = useTheme() as PersonaTheme | undefined;\n  const colors = {\n    grid: semanticColor(theme, 'BorderDivider', Color.BorderHairline),\n    axis: semanticColor(theme, 'BorderDefault', Color.BorderDivider),\n    text: semanticColor(theme, 'FgSecondary', Color.TextSecondary),\n    surface: semanticColor(theme, 'SurfacePrimary', Color.BackgroundPrimary),\n    hover: semanticColor(theme, 'SurfaceHover', Color.BackgroundSecondary),\n  };\n  const tick: ChartTickStyle = {\n    fill: colors.text,\n    fontSize: Typography.TextSmall.fontSize,\n    fontFamily: Typography.TextSmall.fontFamily,\n  };\n  return {\n    colors,\n    /**\n     * `<CartesianGrid>`: horizontal gridlines only, drawn over the tooltip cursor band so they stay\n     * visible through it. Recharts 3 layers by `zIndex` (its cursor band is 200, bars 300); Recharts 2\n     * ignores `zIndex` and layers by child order, so put `<Tooltip>` before `<CartesianGrid>`.\n     */\n    grid: { vertical: false, stroke: colors.grid, zIndex: GRID_Z_INDEX },\n    /** `<XAxis>`: no tick marks, a baseline in the default border colour. */\n    xAxis: { tick, tickLine: false, axisLine: { stroke: colors.axis } },\n    /** `<YAxis>`: no tick marks or axis line. */\n    yAxis: { tick, tickLine: false, axisLine: false },\n    /** `<Tooltip cursor>` for bar charts: a translucent band, so gridlines show through. */\n    barCursor: { fill: colors.hover, fillOpacity: CHART_INACTIVE_OPACITY },\n    /** `<Tooltip cursor>` for line charts: a vertical line. */\n    lineCursor: { stroke: colors.axis },\n    /** `<Bar>` in a stack: a 1px surface-coloured line between segments. */\n    segmentGap: { stroke: colors.surface, strokeWidth: 1 },\n    /** `<Line activeDot>`: the hovered point, ringed in the surface colour. */\n    activeDot: { r: 4, stroke: colors.surface, strokeWidth: 2 },\n  };\n}\n\n/** @experimental */\nexport interface ChartActiveSeries<K extends string> {\n  /** The series under the pointer, for `ChartPopover activeSeries`. */\n  activeSeries: K | undefined;\n  /** Spread on each `<Bar>`: tracks which series and category the pointer is on. */\n  barHandlers: (key: K) => {\n    onMouseEnter: (data: unknown, index: number) => void;\n    onMouseLeave: () => void;\n  };\n  /**\n   * `fillOpacity` for a series' bar at `index` (pass it to a `<Cell>`): 0.65 for the other series in\n   * the hovered category, 1 otherwise.\n   */\n  segmentOpacity: (key: K, index: number) => number;\n}\n\n/**\n * Hover emphasis for bars holding several series (stacked or grouped): the segment under the\n * pointer stays at full strength, the other segments of the same category drop to 65% opacity, and\n * `activeSeries` dims the matching popover rows.\n *\n * ```tsx\n * const { activeSeries, barHandlers, segmentOpacity } = useChartActiveSeries<Key>();\n * <Tooltip content={<ChartPopover series={series} activeSeries={activeSeries} />} />\n * {series.map(({ key }) => (\n *   <Bar key={key} dataKey={key} {...barHandlers(key)}>\n *     {data.map((_, i) => <Cell key={i} fillOpacity={segmentOpacity(key, i)} />)}\n *   </Bar>\n * ))}\n * ```\n *\n * @experimental\n */\nexport function useChartActiveSeries<K extends string>(): ChartActiveSeries<K> {\n  const [active, setActive] = useState<{ key: K; index: number } | null>(null);\n  const barHandlers = useCallback(\n    (key: K) => ({\n      onMouseEnter: (_data: unknown, index: number) => setActive({ key, index }),\n      onMouseLeave: () => setActive(null),\n    }),\n    [],\n  );\n  const segmentOpacity = (key: K, index: number) =>\n    active && active.index === index && active.key !== key ? CHART_INACTIVE_OPACITY : 1;\n  return { activeSeries: active?.key, barHandlers, segmentOpacity };\n}\n"],"mappings":";;;;;;;;;;;;;;AAqBA,MAAa,uBAAuB;CAClC,aAAa;CACb,gBAAgB;CAChB,qBAAqB;CACtB;;AAGD,MAAa,wBAAsC;;;;;;;;;;;;;AA4BnD,MAAa,cAAoC,UAAgB;;AAmBjE,MAAa,sBACX,QACA,UAAwB,0BACH,OAAO,qBAAqB;;AAGnD,MAAa,qBAAqB,OAAmB,SACnD,OAAO,UAAU,WAAW,QAAQ,MAAM;;AAG5C,MAAa,oBAAoB,UAC/B,OAAO,aAAa,eAAe,SAAS;AAE9C,MAAM,wCAAwB,IAAI,KAAa;;;;;;;;;;AAW/C,SAAgB,oBACd,QACA,EAAE,SAAS,eAAe,KAAA,EAAU,EAAE,SAAS,OAAO,YAAwC,EAAE,EAC9E;CAClB,MAAM,SAAS,mBAAmB,QAAQ,QAAQ;CAClD,MAAM,WAAW,EAAE;AAEnB,QAAO,SAAS,EAAE,KAAK,SAAS,UAAU;AACxC,WAAS,OAAO,QAAQ,kBAAkB,OAAO,KAAK,GAAG,OAAO,QAAQ,OAAO;GAC/E;CAEF,MAAM,cAAc,GAAG,WAAA,cAAiC,GAAG,OAAO;AAClE,KACE,QAAQ,IAAI,aAAa,gBACzB,OAAO,SAAS,OAAO,UACvB,CAAC,sBAAsB,IAAI,YAAY,EACvC;AACA,wBAAsB,IAAI,YAAY;AACtC,UAAQ,KACN,gBAAgB,OAAO,OAAO,qBAAqB,OAAO,OAAO,UAC5D,WAAA,cAAiC,2GAEvC;;AAGH,QAAO;;;;;;;;;;;;;;;;;ACpFT,SAAgB,eAAe,UAAwB,uBAAoC;CACzF,MAAM,QAAQ,UAAU;CACxB,MAAM,SAAS,eAAe,MAAM;CACpC,MAAM,OAAO,iBAAiB,MAAM;CACpC,MAAM,SAAS,mBAAmB,QAAQ,QAAQ;CAElD,MAAM,UAAU,aACK,WACjB,oBAAoB,QAAQ;EAAE;EAAQ;EAAS;EAAM,CAAC,EACxD;EAAC;EAAQ;EAAS;EAAK,CACxB;AAED,QAAO,eAAe;EAAE;EAAM;EAAQ;EAAS,GAAG;EAAC;EAAM;EAAQ;EAAQ,CAAC;;;;;ACxC5E,MAAa,gCAAqD;;;;;;AAOlE,MAAa,uBAAuB;;;;;;;AAQpC,MAAa,yBAAyB;;;;;;;;AAStC,MAAa,oBAAoB;CAAE,KAAK;CAAG,OAAO;CAAG,QAAQ;CAAG,MAAM;CAAG;AAEzE,MAAM,6BAA6B,cAA+C,KAAA,EAAU;;AAG5F,MAAa,8BAA8B,2BAA2B;;AAGtE,MAAa,+BACX,WAAW,2BAA2B;;;ACCxC,MAAM,QAAQ,OAAO,MAA0C;;UAErD,EAAE,gBAAiB,cAAc,UAAU,QAAQ,KAAK,QAAQ,GAAI;;;;;KAKzE,EAAE,gBACH,cAAc,UACV,GAAG;;;YAIH,GAAG;;;UAGD;;AAKV,MAAM,0BAA0B;AAEhC,MAAM,aAAa,OAAO,GAAuC;;KAE5D,EAAE,gBACH,cAAc,WACd,GAAG;;;uBAGgB,wBAAwB;MACzC;;AAGN,MAAM,OAAO,OAAO,GAAwB;;;;aAI/B,EAAE,cAAc,QAAQ;;;;;;;;;;;;;;;;;;;AAoBrC,SAAgB,WAAW,EACzB,QACA,iBAAiB,+BACjB,SAAA,KACA,UACA,WACA,GAAG,SACe;AAClB,QACE,oBAAC,6BAAD;EAA6B,OAAO;YAClC,qBAAC,OAAD;GACE,WAAW;GACA;GACX,wBAAsB;GACtB,GAAI;aAJN,CAMG,UAAU,oBAAC,YAAD;IAAY,WAAW;cAAiB;IAAoB,CAAA,EACvE,oBAAC,MAAD;IAAM,SAAS;IAAS;IAAgB,CAAA,CAClC;;EACoB,CAAA;;;;ACzElC,MAAM,cAAc,QAAQ;AAE5B,MAAM,OAAO,OAAO,MAAM;;;;;;;AAQ1B,MAAM,WAAW,OAAO,EAAE;;;;;AAO1B,MAAM,QAAQ,OAAO,UAAU;;;;;;AAO/B,MAAMA,WAAS,OAAO,IAAyC;;WAEpD,YAAY;YACX,YAAY;mBACL,aAAa,GAAG;iBAClB,EAAE,aAAa,OAAO;cACzB,EAAE,cAAe,UAAU,yBAAyB,EAAG;;AAIrE,MAAM,eAAe,OAAO,MAAM;IAC9B,gBAAgB,GAAG;;;SAGd,QAAQ,GAAG;;;;;;mBAMD,aAAa,GAAG;;;;;IAK/B,aAAa;;;;;OAKV,EAAE,YAAY;CACf,MAAM,OAAO,cAAc,OAAO,sBAAsB,MAAM,aAAa;AAC3E,QAAO,qBAAqB,KAAK,sBAAsB,QAAQ,GAAG,GAAG,KAAK;EAC1E;;;;OAIC,EAAE,YAAY;CACf,MAAM,OAAO,cAAc,OAAO,uBAAuB,MAAM,aAAa;AAC5E,QAAO,qBAAqB,KAAK,sBAAsB,QAAQ,GAAG,GAAG,KAAK;EAC1E;;;AAIN,MAAM,aAAa,OAAO,IAAI;IAC1B,gBAAgB,GAAG;;;SAGd,QAAQ,GAAG;;;;AAKpB,MAAM,aAAa,OAAO,IAAI;IAC1B,gBAAgB,OAAO;;YAEf,EAAE,YAAY,cAAc,OAAO,eAAe,MAAM,cAAc,CAAC;;AAYnF,SAAS,YAA8B,EACrC,OACA,QACA,UACA,cAAc,WACd,UACA,aACsB;AACtB,QACE,oBAAC,MAAD;EACE,IAAG;EACQ;EACX,cAAY;EACZ,WAAW,WAAW,aAAa;EACnC,SAAS,WAAW,QAAQ,KAAK,QAAQ;EACzC,MAAM,WAAW,KAAA,IAAY;EAC7B,OAAO,WAAW,eAAe;YAEhC,MAAM,KAAK,EAAE,KAAK,OAAO,YAAY;GACpC,MAAM,WAAW,OAAO,SAAS,IAAI;GACrC,MAAM,UACJ,qBAAA,YAAA,EAAA,UAAA,CACE,oBAACA,UAAD;IAAQ,QAAQ;IAAO,SAAS;IAAU,eAAA;IAAc,CAAA,EACxD,oBAAC,OAAD;IAAO,IAAG;IAAO,MAAK;IAAK,OAAO,WAAW,aAAa;IAAW,OAAO;cACzE;IACK,CAAA,CACP,EAAA,CAAA;AAEL,UACE,oBAAC,UAAD,EAAA,UACG,WACC,oBAAC,cAAD;IAAc,MAAK;IAAS,gBAAc,CAAC;IAAU,eAAe,SAAS,IAAI;cAC9E;IACY,CAAA,GAEf,oBAAC,YAAD,EAAA,UAAa,SAAqB,CAAA,EAE3B,EARI,IAQJ;IAEb;EACG,CAAA;;;;;;;;;;;;;AAeX,SAAgB,YAA8B,EAC5C,OACA,QACA,SAAS,EAAE,EACX,UACA,cAAc,YAAY,gBAC1B,aACsB;CAEtB,MAAM,WAAW,wBAAwB,KAAK;AAE9C,KAAI,CAAC,OACH,QACE,oBAAC,aAAD;EACS;EACC;EACE;EACV,cAAY;EACF;EACC;EACX,CAAA;AAIN,QACE,oBAAC,OAAD;EACE,MAAK;EACL,cAAY;EACD;EACX,SAAS,QAAQ;EACjB,OAAM;YAEL,OAAO,KAAK,UACX,qBAAC,OAAD;GAAuB,SAAS,QAAQ;GAAI,OAAM;aAAlD,CACE,oBAAC,YAAD;IAAY,eAAA;cAAa,MAAM;IAAmB,CAAA,EAClD,oBAAC,aAAD;IACE,OAAO,MAAM;IACL;IACE;IACV,cAAY,MAAM;IACR;IACV,CAAA,CACI;KATI,MAAM,IASV,CACR;EACI,CAAA;;;;;;;;;;;AC7NZ,SAAgB,yBACd,MACA,gBAA8B,EAAE,EACN;CAC1B,MAAM,CAAC,WAAW,gBAAgB,eAA+B,IAAI,IAAI,cAAc,CAAC;CAExF,MAAM,SAAS,aAAa,QAAW;AACrC,gBAAc,YAAY;GACxB,MAAM,OAAO,IAAI,IAAI,QAAQ;AAC7B,OAAI,KAAK,IAAI,IAAI,CACf,MAAK,OAAO,IAAI;OAEhB,MAAK,IAAI,IAAI;AAEf,UAAO;IACP;IACD,EAAE,CAAC;CAEN,MAAM,WAAW,aAAa,QAAW,UAAU,IAAI,IAAI,EAAE,CAAC,UAAU,CAAC;AAEzE,QAAO,cAAc;EACnB,MAAM,SAAS,KAAK,QAAQ,QAAQ,UAAU,IAAI,IAAI,CAAC;AACvD,SAAO;GACL;GACA;GACA;GACA,WAAW,KAAK,SAAS,KAAK,OAAO,WAAW,KAAK;GACtD;IACA;EAAC;EAAM;EAAW;EAAQ;EAAS,CAAC;;;;;ACwEzC,MAAa,sBAAwD;CACnE,SAAS;CACT,WAAW;CACZ;AAGD,MAAM,UAAU;CACd,SAAS;EAAE,SAAS,QAAQ;EAAI,KAAK,QAAQ;EAAI;CACjD,WAAW;EAAE,SAAS,QAAQ;EAAI,KAAK,QAAQ;EAAI;CACpD;AAID,MAAM,QAAQ,OAAO,GAAc;IAC/B,gBAAgB,GAAG;;;;UAIb,EAAE,YAAY,QAAQ,OAAO,IAAI;cAC7B,EAAE,YAAY,QAAQ,OAAO,QAAQ;mBAChC,aAAa,GAAG;uBACZ,EAAE,YAAY,cAAc,OAAO,kBAAkB,MAAM,kBAAkB,CAAC;6FACvE;YAClB,EAAE,YAAY,cAAc,OAAO,aAAa,MAAM,YAAY,CAAC;;;AAI/E,MAAM,SAAS,OAAO,GAAG;IACrB,gBAAgB,OAAO;;AAG3B,MAAM,OAAO,OAAO,EAAa;;;UAGvB,EAAE,YAAY,QAAQ,OAAO,IAAI;;;;;AAM3C,MAAM,MAAM,OAAO,EAAyB;;;;gBAI5B,QAAQ,GAAG;cACb,EAAE,cAAe,UAAU,yBAAyB,EAAG;;AAGrE,MAAM,WAAW,OAAO,IAAI;iBACX,QAAQ,GAAG;gBACZ,SAAS,IAAI;;AAQ7B,MAAM,SAAS,OAAO,IAAI;WACf,QAAQ,GAAG;YACV,QAAQ,GAAG;mBACJ,MAAc;;;AAIjC,MAAM,aAAa,OAAO,IAAI;;YAElB,EAAE,YAAY,cAAc,OAAO,eAAe,MAAM,cAAc,CAAC;;;;AAMnF,MAAM,QAAQ,OAAO,IAAI;IACrB,gBAAgB,GAAG;;;;AAKvB,MAAM,aAAa,UACjB,OAAO,UAAU,WAAW,CAAC,OAAO,MAAM,MAAM,GAAG,OAAO,UAAU,YAAY,UAAU;;;;;;;;AAS5F,SAAgB,kBAA6C,EAC3D,OACA,MACA,gBACA,YAAY,OACZ,OACA,aAAa,SACb,OAAO,WACP,OACA,cACA,aAC4B;CAC5B,MAAM,SAAS,cAAc;CAC7B,MAAM,UAAU,OAAwB,QAAgC;AACtE,MAAI,eACF,QAAO,eAAe,OAAO,IAAI;AAEnC,SAAO,OAAO,UAAU,WAAW,MAAM,eAAe,OAAO,GAAG;;CAGpE,MAAM,aACJ,SACA,KAAK,QACF,KAAK,EAAE,YAAa,OAAO,UAAU,YAAY,CAAC,OAAO,MAAM,MAAM,GAAG,MAAM,QAAQ,KACvF,EACD;CACH,MAAM,WAAW,UAAU,KAAA,KAAa,UAAU,QAAQ,UAAU;AAEpE,QACE,qBAAC,OAAD;EACE,OAAO;EACI;EACX,aAAW;EACX,aAAU;EACV,OAAO,EAAE,OAAO,SAAS,oBAAoB,OAAO;YALtD,CAOG,YAAY,oBAAC,QAAD,EAAA,UAAS,OAAe,CAAA,EACrC,qBAAC,MAAD;GAAM,OAAO;aAAb,CACG,KAAK,KAAK,QACT,qBAAC,KAAD;IAEE,SAAS,iBAAiB,KAAA,KAAa,IAAI,QAAQ;IACnD,eAAa,iBAAiB,IAAI,OAAO,KAAA;cAH3C;KAKE,oBAAC,QAAD;MAAQ,eAAA;MAAY,OAAO,EAAE,YAAY,IAAI,OAAO;MAAI,CAAA;KACxD,oBAAC,YAAD;MAAY,OAAO,OAAO,IAAI,UAAU,WAAW,IAAI,QAAQ,KAAA;gBAC5D,IAAI;MACM,CAAA;KACb,oBAAC,OAAD,EAAA,UAAQ,UAAU,IAAI,MAAM,GAAG,OAAO,IAAI,OAAO,IAAI,IAAS,GAAG,KAAY,CAAA;KACzE;MATC,IAAI,IASL,CACN,EACD,aAAa,SAAS,eACrB,qBAAC,UAAD,EAAA,UAAA;IAEE,oBAAC,QAAD,EAAQ,eAAA,MAAc,CAAA;IACtB,oBAAC,QAAD,EAAA,UAAO,YAAkB,CAAA;IACzB,oBAAC,OAAD,EAAA,UAAQ,OAAO,YAAY,QAAQ,EAAS,CAAA;IACnC,EAAA,CAAA,CAER;KACD;;;AAIZ,MAAM,YAAY,EAAE,SAAS,WAAyD;AACpF,KAAI,OAAO,YAAY,YAAY,OAAO,YAAY,SACpD,QAAO,OAAO,QAAQ;AAExB,QAAO,OAAO,SAAS,YAAY,OAAO,SAAS,WAAW,OAAO,KAAK,GAAG,KAAA;;AAG/E,MAAM,kBAAkB,UACtB,CAAC,MAAM,QAAQ,CAAC,MAAM,YAAY,MAAM,SAAS;;;;;;;AAQnD,SAAgB,iBACd,SACA,QACA,cACmB;CACnB,MAAM,SAAS,IAAI,IAAY,gBAAgB,EAAE,CAAC;CAClD,MAAM,0BAAU,IAAI,KAAuC;AAC3D,MAAK,MAAM,SAAS,SAAS;EAC3B,MAAM,MAAM,SAAS,MAAM;AAC3B,MAAI,QAAQ,KAAA,KAAa,CAAC,OAAO,IAAI,IAAI,IAAI,eAAe,MAAM,IAAI,CAAC,QAAQ,IAAI,IAAI,CACrF,SAAQ,IAAI,KAAK,MAAM;;CAI3B,MAAM,gBAAgB,UACpB,MAAM,SAAS,MAAM,QAAQ,MAAM;AAErC,KAAI,CAAC,OACH,QAAO,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,KAAK,YAAY;EACzC;EACA,OAAO,UAAU,MAAM,KAAK,GAAG,MAAM,OAAO;EAC5C,OAAO,aAAa,MAAM;EAC1B,OAAO,MAAM;EACd,EAAE;AAGL,QAAO,OAAO,SAAS,EAAE,KAAK,OAAO,YAAY;EAC/C,MAAM,QAAQ,QAAQ,IAAI,IAAI;AAC9B,SAAO,QACH,CACE;GACE;GACA;GACA,OAAO,SAAS,aAAa,MAAM;GACnC,OAAO,MAAM;GACd,CACF,GACD,EAAE;GACN;;;;;;;;;;;;;;;AAgBJ,SAAgB,aAAwC,EACtD,QACA,SACA,OACA,QACA,cACA,gBACA,GAAG,cACoB;AACvB,KAAI,CAAC,UAAU,CAAC,WAAW,QAAQ,WAAW,EAC5C,QAAO;CAET,MAAM,OAAO,iBAAiB,SAAS,QAAQ,aAAa;AAC5D,KAAI,KAAK,WAAW,EAClB,QAAO;CAET,MAAM,SAAS,iBAAiB,eAAe,OAAO,QAAQ,GAAI;AAElE,QAAO,oBAAC,mBAAD;EAAsB,GAAI;EAAY,OAAO;EAAc;EAAQ,CAAA;;;;AC9V5E,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;AA0CrB,SAAgB,iBAA8B;CAC5C,MAAM,QAAQ,UAAU;CACxB,MAAM,SAAS;EACb,MAAM,cAAc,OAAO,iBAAiB,MAAM,eAAe;EACjE,MAAM,cAAc,OAAO,iBAAiB,MAAM,cAAc;EAChE,MAAM,cAAc,OAAO,eAAe,MAAM,cAAc;EAC9D,SAAS,cAAc,OAAO,kBAAkB,MAAM,kBAAkB;EACxE,OAAO,cAAc,OAAO,gBAAgB,MAAM,oBAAoB;EACvE;CACD,MAAM,OAAuB;EAC3B,MAAM,OAAO;EACb,UAAU,WAAW,UAAU;EAC/B,YAAY,WAAW,UAAU;EAClC;AACD,QAAO;EACL;;;;;;EAMA,MAAM;GAAE,UAAU;GAAO,QAAQ,OAAO;GAAM,QAAQ;GAAc;;EAEpE,OAAO;GAAE;GAAM,UAAU;GAAO,UAAU,EAAE,QAAQ,OAAO,MAAM;GAAE;;EAEnE,OAAO;GAAE;GAAM,UAAU;GAAO,UAAU;GAAO;;EAEjD,WAAW;GAAE,MAAM,OAAO;GAAO,aAAa;GAAwB;;EAEtE,YAAY,EAAE,QAAQ,OAAO,MAAM;;EAEnC,YAAY;GAAE,QAAQ,OAAO;GAAS,aAAa;GAAG;;EAEtD,WAAW;GAAE,GAAG;GAAG,QAAQ,OAAO;GAAS,aAAa;GAAG;EAC5D;;;;;;;;;;;;;;;;;;;AAoCH,SAAgB,uBAA+D;CAC7E,MAAM,CAAC,QAAQ,aAAa,SAA2C,KAAK;CAC5E,MAAM,cAAc,aACjB,SAAY;EACX,eAAe,OAAgB,UAAkB,UAAU;GAAE;GAAK;GAAO,CAAC;EAC1E,oBAAoB,UAAU,KAAK;EACpC,GACD,EAAE,CACH;CACD,MAAM,kBAAkB,KAAQ,UAC9B,UAAU,OAAO,UAAU,SAAS,OAAO,QAAQ,MAAM,yBAAyB;AACpF,QAAO;EAAE,cAAc,QAAQ;EAAK;EAAa;EAAgB"}

package/dist/components/Checkbox/index.mjs

@@ -1,2 +1,2 @@
-import { t as Checkbox } from "../../Checkbox-Dr4LMKHV.mjs";
+import { t as Checkbox } from "../../Checkbox-BAh-wF_F.mjs";
 export { Checkbox, Checkbox as default };

package/dist/components/CodeHighlight/index.mjs

@@ -3,7 +3,7 @@ import { t as useToggle } from "../../useToggle-1z8JE7Ym.mjs";
 import { Z_INDICES } from "../../lib/zindex.mjs";
 import { focusOutline } from "../../mixins/focus.mjs";
 import { semanticScrollbar } from "../../mixins/scrollbar.mjs";
-import { n as Button } from "../../IconButton-DxHB2g80.mjs";
+import { n as Button } from "../../IconButton-Bj1fry_K.mjs";
 import PrismWithLanguages_default from "./PrismWithLanguages.mjs";
 import { useCallback, useLayoutEffect, useMemo, useRef, useState } from "react";
 import { Color, Spacing } from "@persona/design-tokens";

package/dist/components/Combobox/index.d.mts

@@ -1,3 +1,5 @@
-import { D as flattenOptions, a as ComboboxOptionGroup, i as ComboboxOption, o as ComboboxOptionsOrGroups, t as CaretButton } from "../../ComboboxBase-BPXqJHaQ.mjs";
-import { n as ComboboxProps, t as Combobox } from "../../Combobox-CIKqTYZt.mjs";
-export { CaretButton, Combobox, Combobox as default, ComboboxOption, ComboboxOptionGroup, ComboboxOptionsOrGroups, ComboboxProps, flattenOptions };
+import { O as flattenOptions, a as ComboboxOptionGroup, i as ComboboxOption, n as ComboboxBaseProps, o as ComboboxOptionsOrGroups, s as ComboboxServerBaseProps, t as CaretButton } from "../../ComboboxBase-CrFweFGi.mjs";
+import { n as ComboboxMultiSelectProps, r as ComboboxServerMultiSelectProps } from "../../ComboboxMultiSelect-Cp5GBGQj.mjs";
+import { r as ComboboxSingleSelectProps, t as ComboboxServerSingleSelectProps } from "../../ComboboxSingleSelect-u7fK3Yvy.mjs";
+import { n as ComboboxProps, r as ComboboxServerProps, t as Combobox } from "../../Combobox-DbcSss15.mjs";
+export { CaretButton, Combobox, Combobox as default, ComboboxBaseProps, ComboboxMultiSelectProps, ComboboxOption, ComboboxOptionGroup, ComboboxOptionsOrGroups, ComboboxProps, ComboboxServerBaseProps, ComboboxServerMultiSelectProps, ComboboxServerProps, ComboboxServerSingleSelectProps, ComboboxSingleSelectProps, flattenOptions };

package/dist/components/Combobox/index.mjs

@@ -1,2 +1,2 @@
-import { n as CaretButton, r as flattenOptions, t as Combobox } from "../../Combobox-Gb_j1dg6.mjs";
+import { n as CaretButton, r as flattenOptions, t as Combobox } from "../../Combobox-BNjYEAmv.mjs";
 export { CaretButton, Combobox, Combobox as default, flattenOptions };

package/dist/components/DataTable/TableControls/index.d.mts

@@ -1,22 +1,22 @@
 import { n as ControlBarProps, t as ControlBar } from "../../../ControlBar-B3Jn8G0k.mjs";
-import { a as FilterConditionOperator, c as FilterFieldType, d as FilterRuleValue, f as FilterRuleValueChange, g as isEmptyState, h as TopLevelFilterRule, i as EMPTY_FILTER_STATE, l as FilterOperator, m as FilterStateV2, n as CompoundExpression, o as FilterField, p as FilterSize, r as DateRangeFilterValue, s as FilterFieldSource, t as AndGroup, u as FilterRule } from "../../../types-DLnCkvTt.mjs";
-import { n as RawFieldInfo, r as buildFieldRegistry, t as FieldRegistry } from "../../../FieldRegistry-C2NVPhMO.mjs";
-import { n as ValueControlResolver, r as resolveValueControl, t as ResolveValueControlOptions } from "../../../value-control-resolver-XQbGCdsP.mjs";
-import { t as FilterBar } from "../../../FilterBar-BE_gBM0H.mjs";
-import { a as ComboboxFilterConfig, c as FilterRenderOptions, d as InputFilterConfig, f as MultiSelectFilterConfig, i as BaseFilterConfig, l as FilterTypeDefinition, o as DateRangeFilterConfig, p as SelectFilterConfig, r as BaseActiveFilter, s as FilterConfig, t as ActiveFilter, u as FilterTypeResolver } from "../../../types-BEdERA4v.mjs";
-import { i as TableViewConfigurationProps, n as TableViewConfigurationDropdown, r as TableViewConfigurationDropdownProps, t as TableViewConfiguration } from "../../../TableViewConfigurationDropdown-Cp7ausV_.mjs";
-import { n as TableControlsFiltersV2Props, r as TableControlsProps, t as TableControls } from "../../../TableControls-Clo_0Mty.mjs";
+import { a as FilterConditionOperator, c as FilterFieldType, d as FilterRuleValue, f as FilterRuleValueChange, g as isEmptyState, h as TopLevelFilterRule, i as EMPTY_FILTER_STATE, l as FilterOperator, m as FilterStateV2, n as CompoundExpression, o as FilterField, p as FilterSize, r as DateRangeFilterValue, s as FilterFieldSource, t as AndGroup, u as FilterRule } from "../../../types-BJqmRXFV.mjs";
+import { n as RawFieldInfo, r as buildFieldRegistry, t as FieldRegistry } from "../../../FieldRegistry-CJwGpUVK.mjs";
+import { n as ValueControlResolver, r as resolveValueControl, t as ResolveValueControlOptions } from "../../../value-control-resolver-BFJZEWDn.mjs";
+import { t as FilterBar } from "../../../FilterBar-CA4mDAXK.mjs";
+import { a as ComboboxFilterConfig, c as FilterRenderOptions, d as InputFilterConfig, f as MultiSelectFilterConfig, i as BaseFilterConfig, l as FilterTypeDefinition, o as DateRangeFilterConfig, p as SelectFilterConfig, r as BaseActiveFilter, s as FilterConfig, t as ActiveFilter, u as FilterTypeResolver } from "../../../types-NO2GRlM-.mjs";
+import { i as TableViewConfigurationProps, n as TableViewConfigurationDropdown, r as TableViewConfigurationDropdownProps, t as TableViewConfiguration } from "../../../TableViewConfigurationDropdown-DE9HFXYY.mjs";
+import { n as TableControlsFiltersV2Props, r as TableControlsProps, t as TableControls } from "../../../TableControls-DE6eHq8h.mjs";
 import { n as DataTableCompactBar } from "../../../CompactBar-BLZZWtIE.mjs";
-import { i as useTableControls, n as TableControlsContextProps, r as TableControlsProvider, t as TableControlsContext } from "../../../TableControlsContext-BNd6z9mD.mjs";
-import { a as resolveFilterTypeDefinition, i as isFilterActive, n as FiltersContainer, r as getActiveFilters } from "../../../filters-DTBc0mE7.mjs";
+import { i as useTableControls, n as TableControlsContextProps, r as TableControlsProvider, t as TableControlsContext } from "../../../TableControlsContext-C2_2EuMh.mjs";
+import { a as resolveFilterTypeDefinition, i as isFilterActive, n as FiltersContainer, r as getActiveFilters } from "../../../filters-DW7pqWv3.mjs";
 import { t as dateRuleIntent } from "../../../date-rule-intent-DDDCA6kc.mjs";
-import { t as resolveDateRangeRuleValue } from "../../../date-range-rule-value-ASr06ClE.mjs";
-import { t as FilterBarProps } from "../../../index-kIon1vPp.mjs";
-import { a as useFilterBarSize, i as FilterSizeTokens, t as FILTER_SIZE_TOKENS } from "../../../filter-size-context-CmFyIPCm.mjs";
-import { n as PillShellProps, t as PillShell } from "../../../PillShell-B7Bm-dsE.mjs";
-import { _ as isNumericComparisonOperator, a as emptyValueForRule, b as reconcileValueForOperator, c as getDefaultOperatorForType, d as getOperatorsForType, n as NumericComparisonOperator, p as isCompleteDateRange, t as NUMERIC_COMPARISON_OPERATORS, u as getOperatorsForField, v as isRangeOperator, y as isValuelessOperator } from "../../../operators-BHxKZcpD.mjs";
-import { a as decodeFilterStateFromUrl, i as decodeFilterStateFromString, n as UrlStateCodecResult, o as encodeFilterStateToUrlParam, r as applyFilterStateToSearchParams, t as FILTER_STATE_URL_PARAM } from "../../../url-state-CXUuK3_r.mjs";
-import { n as UseFilterStateV2Result, r as useFilterStateV2, t as UseFilterStateV2Options } from "../../../useFilterStateV2-DBpbxAEC.mjs";
-import { n as isFilterStateV2, r as pruneToRegistry, t as hasCompleteValue } from "../../../validation-Tgg3AhuP.mjs";
-import { t as ValueControlProps } from "../../../types-CqcbWyUY.mjs";
-export { ActiveFilter, AndGroup, BaseActiveFilter, BaseFilterConfig, ComboboxFilterConfig, CompoundExpression, ControlBar, ControlBarProps, DataTableCompactBar, DateRangeFilterConfig, DateRangeFilterValue, EMPTY_FILTER_STATE, FILTER_SIZE_TOKENS, FILTER_STATE_URL_PARAM, FieldRegistry, FilterBar, FilterBarProps, FilterConditionOperator, FilterConfig, FilterField, FilterFieldSource, FilterFieldType, FilterOperator, FilterRenderOptions, FilterRule, FilterRuleValue, FilterRuleValueChange, FilterSize, FilterSizeTokens, FilterStateV2, FilterTypeDefinition, FilterTypeResolver, FiltersContainer, InputFilterConfig, MultiSelectFilterConfig, NUMERIC_COMPARISON_OPERATORS, NumericComparisonOperator, PillShell, PillShellProps, RawFieldInfo, ResolveValueControlOptions, SelectFilterConfig, TableControlsContext, TableControlsContextProps, TableControlsFiltersV2Props, TableControlsProps, TableControlsProvider, TableViewConfiguration, TableViewConfigurationDropdown, TableViewConfigurationDropdownProps, TableViewConfigurationProps, TopLevelFilterRule, UrlStateCodecResult, UseFilterStateV2Options, UseFilterStateV2Result, ValueControlProps, ValueControlResolver, applyFilterStateToSearchParams, buildFieldRegistry, dateRuleIntent, decodeFilterStateFromString, decodeFilterStateFromUrl, TableControls as default, emptyValueForRule, encodeFilterStateToUrlParam, getActiveFilters, getDefaultOperatorForType, getOperatorsForField, getOperatorsForType, hasCompleteValue, isCompleteDateRange, isEmptyState, isFilterActive, isFilterStateV2, isNumericComparisonOperator, isRangeOperator, isValuelessOperator, pruneToRegistry, reconcileValueForOperator, resolveDateRangeRuleValue, resolveFilterTypeDefinition, resolveValueControl, useFilterBarSize, useFilterStateV2, useTableControls };
+import { t as resolveDateRangeRuleValue } from "../../../date-range-rule-value-DyLlMtjr.mjs";
+import { t as FilterBarProps } from "../../../index-DTM_t7OG.mjs";
+import { a as useFilterBarSize, i as FilterSizeTokens, t as FILTER_SIZE_TOKENS } from "../../../filter-size-context-DVnjmuhk.mjs";
+import { n as PillShellProps, t as PillShell } from "../../../PillShell-Bkyu5FXB.mjs";
+import { a as emptyValueForRule, b as isValuelessOperator, c as getConditionValueError, d as getOperatorsForField, f as getOperatorsForType, l as getDefaultOperatorForType, m as isCompleteDateRange, n as NumericComparisonOperator, t as NUMERIC_COMPARISON_OPERATORS, v as isNumericComparisonOperator, x as reconcileValueForOperator, y as isRangeOperator } from "../../../operators-B8_k3r69.mjs";
+import { a as decodeFilterStateFromUrl, i as decodeFilterStateFromString, n as UrlStateCodecResult, o as encodeFilterStateToUrlParam, r as applyFilterStateToSearchParams, t as FILTER_STATE_URL_PARAM } from "../../../url-state-CXPmXzIZ.mjs";
+import { n as UseFilterStateV2Result, r as useFilterStateV2, t as UseFilterStateV2Options } from "../../../useFilterStateV2-DiTS9DTg.mjs";
+import { n as isFilterStateV2, r as pruneToRegistry, t as hasCompleteValue } from "../../../validation-BDQdQ1cY.mjs";
+import { t as ValueControlProps } from "../../../types-BOsCi-kZ.mjs";
+export { ActiveFilter, AndGroup, BaseActiveFilter, BaseFilterConfig, ComboboxFilterConfig, CompoundExpression, ControlBar, ControlBarProps, DataTableCompactBar, DateRangeFilterConfig, DateRangeFilterValue, EMPTY_FILTER_STATE, FILTER_SIZE_TOKENS, FILTER_STATE_URL_PARAM, FieldRegistry, FilterBar, FilterBarProps, FilterConditionOperator, FilterConfig, FilterField, FilterFieldSource, FilterFieldType, FilterOperator, FilterRenderOptions, FilterRule, FilterRuleValue, FilterRuleValueChange, FilterSize, FilterSizeTokens, FilterStateV2, FilterTypeDefinition, FilterTypeResolver, FiltersContainer, InputFilterConfig, MultiSelectFilterConfig, NUMERIC_COMPARISON_OPERATORS, NumericComparisonOperator, PillShell, PillShellProps, RawFieldInfo, ResolveValueControlOptions, SelectFilterConfig, TableControlsContext, TableControlsContextProps, TableControlsFiltersV2Props, TableControlsProps, TableControlsProvider, TableViewConfiguration, TableViewConfigurationDropdown, TableViewConfigurationDropdownProps, TableViewConfigurationProps, TopLevelFilterRule, UrlStateCodecResult, UseFilterStateV2Options, UseFilterStateV2Result, ValueControlProps, ValueControlResolver, applyFilterStateToSearchParams, buildFieldRegistry, dateRuleIntent, decodeFilterStateFromString, decodeFilterStateFromUrl, TableControls as default, emptyValueForRule, encodeFilterStateToUrlParam, getActiveFilters, getConditionValueError, getDefaultOperatorForType, getOperatorsForField, getOperatorsForType, hasCompleteValue, isCompleteDateRange, isEmptyState, isFilterActive, isFilterStateV2, isNumericComparisonOperator, isRangeOperator, isValuelessOperator, pruneToRegistry, reconcileValueForOperator, resolveDateRangeRuleValue, resolveFilterTypeDefinition, resolveValueControl, useFilterBarSize, useFilterStateV2, useTableControls };

package/dist/components/DataTable/TableControls/index.mjs

@@ -1,2 +1,2 @@
-import { A as isNumericComparisonOperator, B as useTableControls, C as useFilterBarSize, D as getOperatorsForField, E as getDefaultOperatorForType, F as getActiveFilters, H as DataTableCompactBar, I as isFilterActive, L as resolveFilterTypeDefinition, M as isValuelessOperator, N as reconcileValueForOperator, O as getOperatorsForType, P as FiltersContainer, R as TableControlsContext, S as FILTER_SIZE_TOKENS, T as emptyValueForRule, V as ControlBar, _ as EMPTY_FILTER_STATE, a as encodeFilterStateToUrlParam, b as resolveValueControl, c as FilterBar_default, d as TableViewConfiguration, f as TableViewConfigurationDropdown, g as pruneToRegistry, h as isFilterStateV2, i as decodeFilterStateFromUrl, j as isRangeOperator, k as isCompleteDateRange, l as resolveDateRangeRuleValue, m as hasCompleteValue, n as applyFilterStateToSearchParams, o as FieldRegistry, p as useFilterStateV2, r as decodeFilterStateFromString, s as buildFieldRegistry, t as FILTER_STATE_URL_PARAM, u as TableControls, v as isEmptyState, w as NUMERIC_COMPARISON_OPERATORS, x as dateRuleIntent, y as PillShell, z as TableControlsProvider } from "../../../TableControls-BrP_BqnF.mjs";
-export { ControlBar, DataTableCompactBar, EMPTY_FILTER_STATE, FILTER_SIZE_TOKENS, FILTER_STATE_URL_PARAM, FieldRegistry, FilterBar_default as FilterBar, FiltersContainer, NUMERIC_COMPARISON_OPERATORS, PillShell, TableControlsContext, TableControlsProvider, TableViewConfiguration, TableViewConfigurationDropdown, applyFilterStateToSearchParams, buildFieldRegistry, dateRuleIntent, decodeFilterStateFromString, decodeFilterStateFromUrl, TableControls as default, emptyValueForRule, encodeFilterStateToUrlParam, getActiveFilters, getDefaultOperatorForType, getOperatorsForField, getOperatorsForType, hasCompleteValue, isCompleteDateRange, isEmptyState, isFilterActive, isFilterStateV2, isNumericComparisonOperator, isRangeOperator, isValuelessOperator, pruneToRegistry, reconcileValueForOperator, resolveDateRangeRuleValue, resolveFilterTypeDefinition, resolveValueControl, useFilterBarSize, useFilterStateV2, useTableControls };
+import { A as isCompleteDateRange, B as TableControlsProvider, C as useFilterBarSize, D as getDefaultOperatorForType, E as getConditionValueError, F as FiltersContainer, H as ControlBar, I as getActiveFilters, L as isFilterActive, M as isRangeOperator, N as isValuelessOperator, O as getOperatorsForField, P as reconcileValueForOperator, R as resolveFilterTypeDefinition, S as FILTER_SIZE_TOKENS, T as emptyValueForRule, U as DataTableCompactBar, V as useTableControls, _ as EMPTY_FILTER_STATE, a as encodeFilterStateToUrlParam, b as resolveValueControl, c as FilterBar_default, d as TableViewConfiguration, f as TableViewConfigurationDropdown, g as pruneToRegistry, h as isFilterStateV2, i as decodeFilterStateFromUrl, j as isNumericComparisonOperator, k as getOperatorsForType, l as resolveDateRangeRuleValue, m as hasCompleteValue, n as applyFilterStateToSearchParams, o as FieldRegistry, p as useFilterStateV2, r as decodeFilterStateFromString, s as buildFieldRegistry, t as FILTER_STATE_URL_PARAM, u as TableControls, v as isEmptyState, w as NUMERIC_COMPARISON_OPERATORS, x as dateRuleIntent, y as PillShell, z as TableControlsContext } from "../../../TableControls-BXykbUBf.mjs";
+export { ControlBar, DataTableCompactBar, EMPTY_FILTER_STATE, FILTER_SIZE_TOKENS, FILTER_STATE_URL_PARAM, FieldRegistry, FilterBar_default as FilterBar, FiltersContainer, NUMERIC_COMPARISON_OPERATORS, PillShell, TableControlsContext, TableControlsProvider, TableViewConfiguration, TableViewConfigurationDropdown, applyFilterStateToSearchParams, buildFieldRegistry, dateRuleIntent, decodeFilterStateFromString, decodeFilterStateFromUrl, TableControls as default, emptyValueForRule, encodeFilterStateToUrlParam, getActiveFilters, getConditionValueError, getDefaultOperatorForType, getOperatorsForField, getOperatorsForType, hasCompleteValue, isCompleteDateRange, isEmptyState, isFilterActive, isFilterStateV2, isNumericComparisonOperator, isRangeOperator, isValuelessOperator, pruneToRegistry, reconcileValueForOperator, resolveDateRangeRuleValue, resolveFilterTypeDefinition, resolveValueControl, useFilterBarSize, useFilterStateV2, useTableControls };

package/dist/components/DataTable/index.d.mts

@@ -1,9 +1,9 @@
-import { C as RowAction, D as RowDataWithTourTarget, E as RowDataWithSubrowsToAlwaysShowIds, O as SortProps, S as RenderValueStickerFormatConfig, T as RowDataWithSubrows, _ as DataTableColumns, a as DataTableColumnBaseFormat, b as DatetimeConfig, c as DataTableColumnDatetimeFormat, d as DataTableColumnImageFormat, f as DataTableColumnNumberFormat, g as DataTableColumnURLFormat, h as DataTableColumnStringFormat, i as ColumnConfig, k as StickerMapping, l as DataTableColumnFormat, m as DataTableColumnStickerFormat, n as ClientFilterConfig, o as DataTableColumnCheckboxFormat, p as DataTableColumnPiiFormat, r as ClientFilterType, s as DataTableColumnDateFormat, t as BulkAction, u as DataTableColumnIDFormat, v as DataTableVariables, w as RowDataWithDetails, x as HeadlessFilterConfig, y as DateConfig } from "../../types-BiqzeNsa.mjs";
-import { r as useTableColumns, t as RenderFormatFn } from "../../useTableColumns-Xd14vx_h.mjs";
-import { a as FloatingActionBarContainer, i as DataTableProps, n as DataTableContainer, r as DataTableControls, t as DataTable } from "../../DataTable-BE9inUi-.mjs";
+import { C as RowAction, D as RowDataWithTourTarget, E as RowDataWithSubrowsToAlwaysShowIds, O as SortProps, S as RenderValueStickerFormatConfig, T as RowDataWithSubrows, _ as DataTableColumns, a as DataTableColumnBaseFormat, b as DatetimeConfig, c as DataTableColumnDatetimeFormat, d as DataTableColumnImageFormat, f as DataTableColumnNumberFormat, g as DataTableColumnURLFormat, h as DataTableColumnStringFormat, i as ColumnConfig, k as StickerMapping, l as DataTableColumnFormat, m as DataTableColumnStickerFormat, n as ClientFilterConfig, o as DataTableColumnCheckboxFormat, p as DataTableColumnPiiFormat, r as ClientFilterType, s as DataTableColumnDateFormat, t as BulkAction, u as DataTableColumnIDFormat, v as DataTableVariables, w as RowDataWithDetails, x as HeadlessFilterConfig, y as DateConfig } from "../../types-Dws2XDz2.mjs";
+import { r as useTableColumns, t as RenderFormatFn } from "../../useTableColumns-tITjHasE.mjs";
+import { a as FloatingActionBarContainer, i as DataTableProps, n as DataTableContainer, r as DataTableControls, t as DataTable } from "../../DataTable-C1mdfmQa.mjs";
 import { t as FloatingActionBar } from "../../FloatingActionBar-BUgSKimy.mjs";
 import { t as Inserter } from "../../Inserter-BtUatmsd.mjs";
-import { n as getFilterFnName, t as generateClientFilters } from "../../clientFilterUtils-CGHYF5NE.mjs";
+import { n as getFilterFnName, t as generateClientFilters } from "../../clientFilterUtils-2TBUC31K.mjs";
 import { t as getColumnWidths } from "../../constants-DMTL6rF3.mjs";
-import { a as renderAsDate, c as renderAsNumber, d as renderAsSticker, f as renderAsString, i as renderAsCopyableString, l as renderAsPDSFormat, n as renderAsCheckbox, o as renderAsDatetime, p as renderAsURL, r as renderAsCheckboxHeader, s as renderAsLightweightImage, t as PDSFormatOptions, u as renderAsPii } from "../../helpers-CBJ2AqGZ.mjs";
+import { a as renderAsDate, c as renderAsNumber, d as renderAsSticker, f as renderAsString, i as renderAsCopyableString, l as renderAsPDSFormat, n as renderAsCheckbox, o as renderAsDatetime, p as renderAsURL, r as renderAsCheckboxHeader, s as renderAsLightweightImage, t as PDSFormatOptions, u as renderAsPii } from "../../helpers-BTD2kXLs.mjs";
 export { BulkAction, ClientFilterConfig, ClientFilterType, ColumnConfig, DataTable, DataTable as default, DataTableColumnBaseFormat, DataTableColumnCheckboxFormat, DataTableColumnDateFormat, DataTableColumnDatetimeFormat, DataTableColumnFormat, DataTableColumnIDFormat, DataTableColumnImageFormat, DataTableColumnNumberFormat, DataTableColumnPiiFormat, DataTableColumnStickerFormat, DataTableColumnStringFormat, DataTableColumnURLFormat, DataTableColumns, DataTableContainer, DataTableControls, DataTableProps, DataTableVariables, DateConfig, DatetimeConfig, FloatingActionBar, FloatingActionBarContainer, HeadlessFilterConfig, Inserter, PDSFormatOptions, RenderFormatFn, RenderValueStickerFormatConfig, RowAction, RowDataWithDetails, RowDataWithSubrows, RowDataWithSubrowsToAlwaysShowIds, RowDataWithTourTarget, SortProps, StickerMapping, generateClientFilters, getColumnWidths, getFilterFnName, renderAsCheckbox, renderAsCheckboxHeader, renderAsCopyableString, renderAsDate, renderAsDatetime, renderAsLightweightImage, renderAsNumber, renderAsPDSFormat, renderAsPii, renderAsSticker, renderAsString, renderAsURL, useTableColumns };

package/dist/components/DataTable/index.mjs

@@ -1,2 +1,2 @@
-import { S as getFilterFnName, _ as renderAsString, a as useTableColumns, b as getColumnWidths, c as renderAsCheckboxHeader, d as renderAsDatetime, f as renderAsLightweightImage, g as renderAsSticker, h as renderAsPii, i as FloatingActionBarContainer, l as renderAsCopyableString, m as renderAsPDSFormat, n as DataTableContainer, o as Inserter, p as renderAsNumber, r as DataTableControls, s as renderAsCheckbox, t as DataTable, u as renderAsDate, v as renderAsURL, x as generateClientFilters, y as FloatingActionBar } from "../../DataTable-CIZJ1vO8.mjs";
+import { S as getFilterFnName, _ as renderAsString, a as useTableColumns, b as getColumnWidths, c as renderAsCheckboxHeader, d as renderAsDatetime, f as renderAsLightweightImage, g as renderAsSticker, h as renderAsPii, i as FloatingActionBarContainer, l as renderAsCopyableString, m as renderAsPDSFormat, n as DataTableContainer, o as Inserter, p as renderAsNumber, r as DataTableControls, s as renderAsCheckbox, t as DataTable, u as renderAsDate, v as renderAsURL, x as generateClientFilters, y as FloatingActionBar } from "../../DataTable-DdSY9mzT.mjs";
 export { DataTable, DataTable as default, DataTableContainer, DataTableControls, FloatingActionBar, FloatingActionBarContainer, Inserter, generateClientFilters, getColumnWidths, getFilterFnName, renderAsCheckbox, renderAsCheckboxHeader, renderAsCopyableString, renderAsDate, renderAsDatetime, renderAsLightweightImage, renderAsNumber, renderAsPDSFormat, renderAsPii, renderAsSticker, renderAsString, renderAsURL, useTableColumns };

package/dist/components/DataTable/types.d.mts

@@ -1,2 +1,2 @@
-import { C as RowAction, D as RowDataWithTourTarget, E as RowDataWithSubrowsToAlwaysShowIds, O as SortProps, S as RenderValueStickerFormatConfig, T as RowDataWithSubrows, _ as DataTableColumns, a as DataTableColumnBaseFormat, b as DatetimeConfig, c as DataTableColumnDatetimeFormat, d as DataTableColumnImageFormat, f as DataTableColumnNumberFormat, g as DataTableColumnURLFormat, h as DataTableColumnStringFormat, i as ColumnConfig, k as StickerMapping, l as DataTableColumnFormat, m as DataTableColumnStickerFormat, n as ClientFilterConfig, o as DataTableColumnCheckboxFormat, p as DataTableColumnPiiFormat, r as ClientFilterType, s as DataTableColumnDateFormat, t as BulkAction, u as DataTableColumnIDFormat, v as DataTableVariables, w as RowDataWithDetails, x as HeadlessFilterConfig, y as DateConfig } from "../../types-BiqzeNsa.mjs";
+import { C as RowAction, D as RowDataWithTourTarget, E as RowDataWithSubrowsToAlwaysShowIds, O as SortProps, S as RenderValueStickerFormatConfig, T as RowDataWithSubrows, _ as DataTableColumns, a as DataTableColumnBaseFormat, b as DatetimeConfig, c as DataTableColumnDatetimeFormat, d as DataTableColumnImageFormat, f as DataTableColumnNumberFormat, g as DataTableColumnURLFormat, h as DataTableColumnStringFormat, i as ColumnConfig, k as StickerMapping, l as DataTableColumnFormat, m as DataTableColumnStickerFormat, n as ClientFilterConfig, o as DataTableColumnCheckboxFormat, p as DataTableColumnPiiFormat, r as ClientFilterType, s as DataTableColumnDateFormat, t as BulkAction, u as DataTableColumnIDFormat, v as DataTableVariables, w as RowDataWithDetails, x as HeadlessFilterConfig, y as DateConfig } from "../../types-Dws2XDz2.mjs";
 export { BulkAction, ClientFilterConfig, ClientFilterType, ColumnConfig, DataTableColumnBaseFormat, DataTableColumnCheckboxFormat, DataTableColumnDateFormat, DataTableColumnDatetimeFormat, DataTableColumnFormat, DataTableColumnIDFormat, DataTableColumnImageFormat, DataTableColumnNumberFormat, DataTableColumnPiiFormat, DataTableColumnStickerFormat, DataTableColumnStringFormat, DataTableColumnURLFormat, DataTableColumns, DataTableVariables, DateConfig, DatetimeConfig, HeadlessFilterConfig, RenderValueStickerFormatConfig, RowAction, RowDataWithDetails, RowDataWithSubrows, RowDataWithSubrowsToAlwaysShowIds, RowDataWithTourTarget, SortProps, StickerMapping };

package/dist/components/DatePicker/index.mjs

@@ -1,2 +1,2 @@
-import { a as RangeCalendar, i as DateField, n as Calendar, r as DateRangePicker, t as DatePicker } from "../../DatePicker-C9redLBr.mjs";
+import { a as RangeCalendar, i as DateField, n as Calendar, r as DateRangePicker, t as DatePicker } from "../../DatePicker-DiilpYQg.mjs";
 export { Calendar, DateField, DatePicker, DatePicker as default, DateRangePicker, RangeCalendar };

package/dist/components/DropdownButton/index.mjs

@@ -1,2 +1,2 @@
-import { t as DropdownButton } from "../../DropdownButton-DpLG-cIj.mjs";
+import { t as DropdownButton } from "../../DropdownButton-BxZ5hn0X.mjs";
 export { DropdownButton, DropdownButton as default };

package/dist/components/DropdownMenu/index.d.mts

@@ -1,2 +1,2 @@
-import { n as DropdownMenuProps, r as _default, t as DropdownMenu } from "../../DropdownMenu-B6D4stkF.mjs";
+import { n as DropdownMenuProps, r as _default, t as DropdownMenu } from "../../DropdownMenu-CQR0U-zM.mjs";
 export { DropdownMenu, DropdownMenuProps, _default as default };

package/dist/components/DropdownMenu/index.mjs

@@ -1,2 +1,2 @@
-import { n as DropdownMenu_default, t as DropdownMenu } from "../../DropdownMenu-c8XK2Lr4.mjs";
+import { n as DropdownMenu_default, t as DropdownMenu } from "../../DropdownMenu-Ip75l4Th.mjs";
 export { DropdownMenu, DropdownMenu_default as default };

package/dist/components/FloatingPanel/index.mjs

@@ -3,19 +3,20 @@ import { a as styled, r as css } from "../../styledComponentsInterop-Cs5CCPRy.mj
 import { semanticColor } from "../../lib/semanticColor.mjs";
 import { t as usePathname } from "../../router-BxmA940v.mjs";
 import { paragraphMixins } from "../../mixins/text.mjs";
+import { ReducedMotionFade, TransitionEasingCurve } from "../../variables/transitions.mjs";
 import { Z_INDICES } from "../../lib/zindex.mjs";
 import "../../variables/effect.mjs";
 import { semanticScrollbar } from "../../mixins/scrollbar.mjs";
 import { n as Stack } from "../../Stack-Bzom2BTR.mjs";
-import { t as IconButton } from "../../IconButton-DxHB2g80.mjs";
+import { t as IconButton } from "../../IconButton-Bj1fry_K.mjs";
 import { cloneElement, createContext, isValidElement, useCallback, useContext, useEffect, useRef, useState } from "react";
 import { BorderRadius, Color, Spacing } from "@persona/design-tokens";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { ArrowCollapseIcon, ArrowExpandIcon, XIcon } from "@persona/icons";
-import { motion, useDragControls, useMotionValue, useReducedMotion } from "framer-motion";
 import { createPortal, flushSync } from "react-dom";
 import { v4 } from "uuid";
 import { flip, offset, shift, useFloating } from "@floating-ui/react";
+import { motion, useDragControls, useMotionValue, useReducedMotion } from "framer-motion";
 //#region src/components/FloatingPanel/utils.ts
 const PADDING = 8;
 function autoFitMaxHeight(viewportHeight, topOffset, minHeight) {
@@ -266,10 +267,10 @@ function FloatingPanel({ title = "Panel title", children, portal = true, trigger
 	]);
 	useEffect(() => {
 		if (wasFullSizeToggled) {
-			const timer = setTimeout(() => setWasFullSizeToggled(false), 400);
+			const timer = setTimeout(() => setWasFullSizeToggled(false), parseInt(prefersReducedMotion ? ReducedMotionFade.duration : "400ms", 10));
 			return () => clearTimeout(timer);
 		}
-	}, [wasFullSizeToggled]);
+	}, [wasFullSizeToggled, prefersReducedMotion]);
 	useEffect(() => {
 		panelSizeRef.current = panelSize;
 	}, [panelSize]);
@@ -447,21 +448,22 @@ function FloatingPanel({ title = "Panel title", children, portal = true, trigger
 			y: fullSize ? 8 : panelPosition.y,
 			width: fullSize ? `calc(100% - ${8 + fullscreenRightInset}px)` : panelSize.width,
 			...isAutoHeight ? {} : { height: fullSize ? "calc(100% - 16px)" : panelSize.height },
-			opacity: isPositionReady ? 1 : 0
+			opacity: wasFullSizeToggled && prefersReducedMotion ? [0, 1] : isPositionReady ? 1 : 0
 		},
-		transition: wasFullSizeToggled ? {
+		transition: wasFullSizeToggled ? prefersReducedMotion ? {
+			duration: 0,
+			opacity: {
+				duration: ReducedMotionFade.durationInSeconds,
+				ease: TransitionEasingCurve.Move
+			}
+		} : {
 			type: "tween",
-			ease: [
-				.83,
-				0,
-				.17,
-				1
-			],
-			duration: prefersReducedMotion ? 1.2 : .4
+			ease: TransitionEasingCurve.Move,
+			duration: .4
 		} : {
 			opacity: {
 				duration: .15,
-				ease: "easeOut"
+				ease: TransitionEasingCurve.Enter
 			},
 			duration: 0
 		},

package/dist/components/FloatingPanel/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":["uuid"],"sources":["../../../src/components/FloatingPanel/utils.ts","../../../src/components/FloatingPanel/FloatingPanel.tsx","../../../src/components/FloatingPanel/FloatingPanelContext.tsx","../../../src/components/FloatingPanel/FloatingPanelRenderer.tsx"],"sourcesContent":["export const PADDING = 8;\nexport const EDGE_PADDING = PADDING * 6;\n\n// Cap a content-fitting panel's height to the room below its top edge so it\n// can't overflow the viewport bottom when anchored partway down the screen.\nexport function autoFitMaxHeight(viewportHeight: number, topOffset: number, minHeight: number) {\n  return Math.max(minHeight, viewportHeight - Math.max(EDGE_PADDING, topOffset) - EDGE_PADDING);\n}\n","import { flip, offset, type Placement, shift, useFloating } from '@floating-ui/react';\nimport { motion, useDragControls, useMotionValue, useReducedMotion } from 'framer-motion';\nimport {\n  isValidElement,\n  type ReactNode,\n  type RefObject,\n  useCallback,\n  useContext,\n  useEffect,\n  useRef,\n  useState,\n} from 'react';\nimport { createPortal, flushSync } from 'react-dom';\nimport styled, { css } from 'styled-components';\n\nimport { IconButton } from '@persona/design-system/components/Button';\nimport Stack from '@persona/design-system/components/Stack';\nimport { Z_INDICES } from '@persona/design-system/lib/zindex';\nimport { paragraphMixins } from '@persona/design-system/mixins/text';\nimport { Elevation } from '@persona/design-system/variables/effect';\nimport { BorderRadius, Color, Spacing } from '@persona/design-tokens';\nimport { ArrowCollapseIcon, ArrowExpandIcon, XIcon } from '@persona/icons';\n\nimport ConfigContext from '#src/lib/ConfigContext';\nimport { usePathname } from '#src/lib/router';\nimport { semanticColor } from '#src/lib/semanticColor';\nimport { semanticScrollbar } from '#src/mixins/scrollbar';\n\nimport { autoFitMaxHeight, PADDING } from './utils';\n\nexport const FLOATING_PANEL_ID_PREFIX = 'floating-panel__' as const;\n\nenum ResizeDirection {\n  North = 'n',\n  South = 's',\n  East = 'e',\n  West = 'w',\n  NorthEast = 'ne',\n  NorthWest = 'nw',\n  SouthEast = 'se',\n  SouthWest = 'sw',\n}\n\nexport interface FloatingPanelProps {\n  /** The title text displayed in the panel header */\n  title: ReactNode;\n  /** Callback function called when the close button is clicked */\n  onClose?: () => void;\n  /** Content to render inside the main panel area */\n  children?: ReactNode;\n  /** Optional React component rendered to the left of the expand button in the header */\n  headerActions?: ReactNode;\n\n  /** Whether the panel displays the fullsize button */\n  canFullsize?: boolean;\n\n  /** When true, the panel opens already in full-size (maximized) mode. */\n  defaultFullSize?: boolean;\n\n  /** Initial width of the panel in pixels */\n  initialWidth?: number;\n  /** Initial height of the panel in pixels */\n  initialHeight?: number;\n  /** Minimum width the panel can be resized to in pixels */\n  minWidth?: number;\n  /** Minimum height the panel can be resized to in pixels */\n  minHeight?: number;\n\n  footerButtons?: ReactNode;\n\n  footerAdditionalAction?: ReactNode;\n\n  portal?: boolean;\n\n  /** Reference to the element that triggered this panel, used for automatic positioning */\n  triggerRef?: RefObject<HTMLElement>;\n\n  /** Which placement of the trigger element to position the panel on */\n  placement?: Placement;\n\n  /** Additional main axis offset in pixels from the calculated position. Main axis is defined as the axis in position to where its being defined\n   * i.e. right, top, left ,bottom */\n  mainAxisOffset?: number;\n\n  /** Additional cross offset in pixels from the calculated position. Cross is defined as the axis that runs along the alignment\n   * of the floating element. */\n  crossAxisOffset?: number;\n\n  /** remove padding from the panel content */\n  noPadding?: boolean;\n\n  /** When true, automatically calls `onClose` if the route changes after the\n   * panel mounts. Mirrors the auto-dismiss-on-navigation behavior provided by\n   * `PanelProvider` / `usePersistentFloatingPanel` for panels that don't opt\n   * into the persistent panel context. Defaults to `false` so existing\n   * consumers (e.g. dirty-check confirmation flows) are not broken. */\n  dismissOnNavigate?: boolean;\n\n  /** When true, the panel's height auto-fits its content via CSS (`max-content`)\n   * up to the viewport, instead of using `initialHeight`. Once the user manually\n   * resizes, the panel switches to pixel mode and stays there. `initialHeight`\n   * is ignored while auto-fitting. */\n  fitContent?: boolean;\n}\n\nconst FloatingPanelContainer = styled(motion.div)<{\n  $fitHeight?: boolean;\n  $maxHeight?: number;\n  $minHeight?: number;\n}>`\n  position: absolute;\n  z-index: ${Z_INDICES.modal};\n  background: ${({ theme }) =>\n    semanticColor(theme, 'SurfaceElevated', theme.color.background.primary)};\n  border: 1px solid ${({ theme }) => semanticColor(theme, 'BorderSubtle', Color.BorderDivider)};\n  border-radius: ${BorderRadius.Lg};\n  box-shadow: ${Elevation.Low};\n  display: flex;\n  flex-direction: column;\n  cursor: auto;\n  ${({ $fitHeight, $maxHeight, $minHeight }) =>\n    $fitHeight &&\n    css`\n      height: auto;\n      max-height: ${$maxHeight ?? 0}px;\n      min-height: ${$minHeight ?? 0}px;\n    `}\n`;\n\nconst DragHandle = styled(motion.div)<{ isFullSize: boolean }>`\n  cursor: ${({ isFullSize }) => (isFullSize ? 'default' : 'grab')};\n  user-select: none;\n\n  &:active {\n    cursor: ${({ isFullSize }) => (isFullSize ? 'default' : 'grabbing')};\n  }\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  min-height: 48px;\n  height: 48px;\n  overflow: hidden;\n  padding: ${Spacing[1]} ${Spacing[1]} ${Spacing[1]} ${Spacing[3]};\n  border-bottom: 1px solid ${({ theme }) => semanticColor(theme, 'BorderSubtle', Color.BorderDivider)};\n`;\n\nconst Footer = styled.div`\n  padding: ${Spacing[1]} ${Spacing[1]} ${Spacing[1]} ${Spacing[3]};\n  border-top: 1px solid ${({ theme }) => semanticColor(theme, 'BorderSubtle', Color.BorderDivider)};\n  overflow-x: hidden;\n  background-color: ${({ theme }) =>\n    semanticColor(theme, 'SurfaceElevated', theme.color.background.primary)};\n  width: 100%;\n  border-radius: 0 0 ${BorderRadius.Lg} ${BorderRadius.Lg};\n`;\n\nconst ResizeHandleBase = styled.div`\n  position: absolute;\n  user-select: none;\n`;\n\n// Sets the width and height for base corner to 20px\nconst ResizeHandleBaseCorner = styled(ResizeHandleBase)`\n  width: 1.25rem;\n  height: 1.25rem;\n`;\n\nconst ResizeHandleBottomRight = styled(ResizeHandleBaseCorner)`\n  bottom: -0.75rem;\n  right: -0.75rem;\n  cursor: nwse-resize;\n`;\n\nconst ResizeHandleBottomLeft = styled(ResizeHandleBaseCorner)`\n  bottom: -0.75rem;\n  left: -0.75rem;\n  cursor: nesw-resize;\n`;\n\nconst ResizeHandleTopLeft = styled(ResizeHandleBaseCorner)`\n  top: -0.75rem;\n  left: -0.75rem;\n  cursor: nwse-resize;\n`;\n\nconst ResizeHandleTopRight = styled(ResizeHandleBaseCorner)`\n  top: -0.75rem;\n  right: -0.75rem;\n  cursor: nesw-resize;\n`;\n\n// These are all the Resize handles for the four cardinal direction,\n// To calculate the width, we subtract by the padding of 1rem on both sides\n// which are corners of the panel\nconst ResizeHandleBottom = styled(ResizeHandleBase)`\n  bottom: -0.75rem;\n  left: 0.5rem;\n  width: calc(100% - 1rem);\n  height: 1rem;\n  cursor: ns-resize;\n  user-select: none;\n`;\n\nconst ResizeHandleTop = styled(ResizeHandleBase)`\n  top: -0.75rem;\n  left: 0.5rem;\n  width: calc(100% - 1rem);\n  height: 1rem;\n  cursor: ns-resize;\n`;\n\nconst ResizeHandleRight = styled(ResizeHandleBase)`\n  right: -0.75rem;\n  top: 0.5rem;\n  width: 1rem;\n  height: calc(100% - 1rem);\n  cursor: ew-resize;\n`;\n\nconst ResizeHandleLeft = styled(ResizeHandleBase)`\n  left: -0.75rem;\n  top: 0.5rem;\n  width: 1rem;\n  height: calc(100% - 1rem);\n  cursor: ew-resize;\n`;\n\nconst PanelContent = styled.div<{ $noPadding?: boolean; $fitHeight?: boolean }>`\n  overflow-y: auto;\n  ${semanticScrollbar}\n  overscroll-behavior: contain;\n  min-height: 0;\n  /* While the panel height is derived from its content, the content must size\n     itself (a percentage flex-basis against an indefinite height collapses in\n     WebKit); it still shrinks when the panel hits its max-height. */\n  flex: ${({ $fitHeight }) => ($fitHeight ? '0 1 auto' : '1 1 0%')};\n  padding: ${({ $noPadding }) => ($noPadding ? 0 : Spacing[3])};\n`;\n\n// Sets a min width so that the text will display, but overflows if needed\nconst PanelText = styled.p`\n  ${paragraphMixins.sm}\n  white-space: nowrap;\n  min-width: 3rem;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  display: flex;\n  align-items: center;\n  font-weight: 500;\n`;\n\nconst StyledIconButton = styled(IconButton)`\n  width: 1.5rem;\n  height: 1.5rem;\n  border-radius: ${BorderRadius.Md};\n`;\n\n// Only rendered when dismissOnNavigate is true, keeping the router lookup out of the\n// main component body so FloatingPanel works without a Router when not needed.\nfunction DismissOnNavigate({ onClose }: { onClose: () => void }) {\n  const pathname = usePathname();\n  const initialPathname = useRef(pathname);\n  useEffect(() => {\n    if (pathname !== initialPathname.current) {\n      onClose();\n    }\n  }, [pathname, onClose]);\n  return null;\n}\n\nexport default function FloatingPanel({\n  title = 'Panel title',\n  children,\n  portal = true,\n  triggerRef,\n  initialWidth = 400,\n  initialHeight = 600,\n  minWidth = 100,\n  minHeight = 150,\n  mainAxisOffset = 0,\n  crossAxisOffset = 0,\n  footerButtons,\n  footerAdditionalAction,\n  placement = 'right',\n  canFullsize = true,\n  defaultFullSize = false,\n  noPadding,\n  headerActions,\n  dismissOnNavigate = false,\n  fitContent = false,\n  onClose = () => {},\n  ...restProps\n}: FloatingPanelProps) {\n  const { floatingPanel } = useContext(ConfigContext);\n  const fullscreenRightInset = floatingPanel?.fullscreenRightInset ?? PADDING;\n  const hasFooter = footerButtons || footerAdditionalAction;\n  const isAdditionalActionButton =\n    isValidElement(footerAdditionalAction) && footerAdditionalAction.type === 'button';\n\n  const [panelSize, setPanelSize] = useState({ width: initialWidth, height: initialHeight });\n  const panelSizeRef = useRef({ width: initialWidth, height: initialHeight });\n  const [panelPosition, setPanelPosition] = useState({ x: 0, y: 0 });\n  const [isPositionReady, setIsPositionReady] = useState(!triggerRef); // Ready immediately if no triggerRef\n\n  const [fullSize, setFullSize] = useState(defaultFullSize);\n  const resizeBottomRef = useRef<number | null>(null);\n  const resizeRightRef = useRef<number | null>(null);\n\n  const [wasFullSizeToggled, setWasFullSizeToggled] = useState(false);\n  const resizeOffsetRef = useRef({ x: 0, y: 0 });\n\n  const resizeDirectionRef = useRef<ResizeDirection | null>(null);\n  const resizeStartDimensionsRef = useRef({\n    width: initialWidth,\n    height: initialHeight,\n    x: 0,\n    y: 0,\n  });\n\n  // Track if the user has manually resized the panel\n  const [hasManuallyResized, setHasManuallyResized] = useState(false);\n  const contentRef = useRef<HTMLDivElement>(null);\n\n  // Track reduced motion preference\n  const prefersReducedMotion = useReducedMotion();\n\n  const dragControls = useDragControls();\n\n  const x = useMotionValue(0);\n  const y = useMotionValue(0);\n\n  const {\n    x: floatingX,\n    y: floatingY,\n    refs,\n  } = useFloating({\n    placement: placement,\n    elements: {\n      reference: triggerRef?.current || undefined,\n    },\n    middleware: [\n      offset({\n        mainAxis: mainAxisOffset,\n        crossAxis: crossAxisOffset,\n      }),\n      flip(),\n      // flip() only swaps sides, so a large panel can still open clipped off an\n      // edge. shift() slides it back into view on both axes (crossAxis covers the\n      // side axis flip leaves unhandled).\n      shift({ crossAxis: true, padding: PADDING }),\n    ],\n  });\n\n  useEffect(() => {\n    // Only update position when floating values are not at the default 0,0\n    // or when we don't have a triggerRef (meaning we should use initial position)\n    if (!triggerRef || floatingX !== 0 || floatingY !== 0) {\n      setPanelPosition({\n        x: floatingX,\n        y: floatingY,\n      });\n      setIsPositionReady(true);\n    }\n  }, [floatingX, floatingY, triggerRef]);\n\n  // Window dimensions and drag constraints\n  const [windowDimensions, setWindowDimensions] = useState({\n    width: typeof window !== 'undefined' ? window.innerWidth : 1200,\n    height: typeof window !== 'undefined' ? window.innerHeight : 800,\n  });\n\n  // Update window dimensions on resize\n  useEffect(() => {\n    const handleResize = () => {\n      setWindowDimensions({\n        width: window.innerWidth,\n        height: window.innerHeight,\n      });\n    };\n\n    window.addEventListener('resize', handleResize);\n    return () => window.removeEventListener('resize', handleResize);\n  }, []);\n\n  const dragConstraints = fullSize\n    ? undefined\n    : {\n        left: PADDING,\n        right: Math.max(PADDING, windowDimensions.width - panelSize.width - PADDING),\n        top: PADDING,\n        bottom: Math.max(PADDING, windowDimensions.height - panelSize.height - PADDING),\n      };\n\n  // Clamp initial position and any position updates to be within bounds\n  const clampPositionToBounds = useCallback(\n    (position: { x: number; y: number }) => {\n      if (fullSize) {\n        return position;\n      }\n\n      return {\n        x: Math.max(\n          PADDING,\n          Math.min(\n            position.x,\n            Math.max(PADDING, windowDimensions.width - panelSize.width - PADDING),\n          ),\n        ),\n        y: Math.max(\n          PADDING,\n          Math.min(\n            position.y,\n            Math.max(PADDING, windowDimensions.height - panelSize.height - PADDING),\n          ),\n        ),\n      };\n    },\n    [windowDimensions, panelSize, fullSize],\n  );\n\n  // Clamp position on window resize\n  useEffect(() => {\n    if (!fullSize) {\n      const clampedPosition = clampPositionToBounds(panelPosition);\n      if (clampedPosition.x !== panelPosition.x || clampedPosition.y !== panelPosition.y) {\n        setPanelPosition(clampedPosition);\n      }\n    }\n  }, [windowDimensions, panelPosition, clampPositionToBounds, fullSize]);\n\n  useEffect(() => {\n    if (wasFullSizeToggled) {\n      const timer = setTimeout(() => setWasFullSizeToggled(false), 400); // match duration\n      return () => clearTimeout(timer);\n    }\n  }, [wasFullSizeToggled]);\n\n  // We need this useEffect here to sync a ref to the panel size, which is needed for resizing\n  useEffect(() => {\n    panelSizeRef.current = panelSize;\n  }, [panelSize]);\n\n  // True while the panel is letting CSS auto-fit its height to content\n  // (`fitContent` opt-in, no manual resize yet, not in fullsize). In this mode\n  // we omit `height` from the framer-motion animate prop so the styled\n  // container's `height: max-content` is in effect.\n  const isAutoHeight = fitContent && !hasManuallyResized && !fullSize;\n\n  // Unified resize handler for all directions\n  function handleResizeMouseDown(\n    event: React.MouseEvent<HTMLDivElement>,\n    direction: ResizeDirection,\n  ) {\n    event.preventDefault();\n    event.stopPropagation();\n\n    let currentWidth: number;\n    let currentHeight: number;\n    let currentX: number;\n    let currentY: number;\n\n    if (fullSize) {\n      // Exit fullscreen but preserve the current rendered dimensions so the panel\n      // appears to stay in place while the user resizes from the edges.\n      // Measure from the DOM so we get the real pixel width/height regardless of\n      // what `calc(100% - 16px)` resolves to (differs for portaled vs. in-place\n      // panels because `100%` is relative to the containing block, not the viewport).\n      const container = contentRef.current?.parentElement;\n      currentWidth = container?.offsetWidth ?? windowDimensions.width - 16;\n      currentHeight = container?.offsetHeight ?? windowDimensions.height - 16;\n      currentX = 8;\n      currentY = 8;\n      // Sync motion values now so x.get()/y.get() return the correct position for\n      // computing fixed-edge anchors below.\n      x.set(8);\n      y.set(8);\n      setFullSize(false);\n      setPanelSize({ width: currentWidth, height: currentHeight });\n      setPanelPosition({ x: currentX, y: currentY });\n    } else if (isAutoHeight) {\n      // If we're leaving CSS auto-fit, capture the current rendered height so the\n      // panel doesn't jump from its content-fit size back to `initialHeight` when\n      // pixel mode takes over.\n      const container = contentRef.current?.parentElement;\n      currentHeight = container?.offsetHeight ?? panelSize.height;\n      currentWidth = panelSize.width;\n      currentX = panelPosition.x;\n      currentY = panelPosition.y;\n      setPanelSize({ width: currentWidth, height: currentHeight });\n    } else {\n      currentWidth = panelSize.width;\n      currentHeight = panelSize.height;\n      currentX = panelPosition.x;\n      currentY = panelPosition.y;\n    }\n\n    panelSizeRef.current = { width: currentWidth, height: currentHeight };\n    // Capture start dimensions in a ref so handleResizeMouseMove (stale closure)\n    // can read the correct initial values for unchanged axes without depending on\n    // panelSize/panelPosition state captured at listener-registration time.\n    resizeStartDimensionsRef.current = {\n      width: currentWidth,\n      height: currentHeight,\n      x: currentX,\n      y: currentY,\n    };\n\n    // Mark that user has manually resized - disable auto-resize from now on\n    setHasManuallyResized(true);\n\n    resizeDirectionRef.current = direction;\n\n    // Calculate initial offsets and fixed points based on direction\n    if (direction === ResizeDirection.SouthEast) {\n      // Bottom-right: resize from bottom-right corner\n      resizeOffsetRef.current = {\n        x: event.clientX - currentWidth,\n        y: event.clientY - currentHeight,\n      };\n    } else if (direction === ResizeDirection.SouthWest) {\n      // Bottom-left: resize from bottom-left corner\n      resizeRightRef.current = x.get() + currentWidth;\n      resizeOffsetRef.current = {\n        x: event.clientX,\n        y: event.clientY - currentHeight,\n      };\n    } else if (direction === ResizeDirection.NorthWest) {\n      // Top-left: resize from top-left corner\n      resizeRightRef.current = x.get() + currentWidth;\n      resizeBottomRef.current = y.get() + currentHeight;\n      resizeOffsetRef.current = {\n        x: event.clientX,\n        y: event.clientY,\n      };\n    } else if (direction === ResizeDirection.NorthEast) {\n      // Top-right: resize from top-right corner\n      resizeBottomRef.current = y.get() + currentHeight;\n      resizeOffsetRef.current = {\n        x: event.clientX - currentWidth,\n        y: event.clientY,\n      };\n    } else if (direction === ResizeDirection.West) {\n      // Left edge\n      resizeRightRef.current = x.get() + currentWidth;\n      resizeOffsetRef.current = {\n        x: event.clientX,\n        y: 0,\n      };\n    } else if (direction === ResizeDirection.East) {\n      // Right edge\n      resizeOffsetRef.current = {\n        x: event.clientX - currentWidth,\n        y: 0,\n      };\n    } else if (direction === ResizeDirection.North) {\n      // Top edge\n      resizeBottomRef.current = y.get() + currentHeight;\n      resizeOffsetRef.current = {\n        x: 0,\n        y: event.clientY,\n      };\n    } else if (direction === ResizeDirection.South) {\n      // Bottom edge\n      resizeOffsetRef.current = {\n        x: 0,\n        y: event.clientY - currentHeight,\n      };\n    }\n\n    document.addEventListener('mousemove', handleResizeMouseMove);\n    document.addEventListener('mouseup', handleResizeMouseUp);\n  }\n\n  // ResizeMouseMove to calculate the new size and position of the panel\n  function handleResizeMouseMove(event: MouseEvent) {\n    const direction = resizeDirectionRef.current;\n    // Use resizeStartDimensionsRef (a ref, always current) rather than panelSize/panelPosition\n    // (stale closure values). For unchanged axes, these provide the correct starting dimensions\n    // set at drag start — including the case where the drag began in fullscreen mode.\n    let newWidth = resizeStartDimensionsRef.current.width;\n    let newHeight = resizeStartDimensionsRef.current.height;\n    let clampedX = resizeStartDimensionsRef.current.x;\n    let clampedY = resizeStartDimensionsRef.current.y;\n\n    if (direction === ResizeDirection.SouthEast) {\n      // Bottom-right corner\n      newWidth = Math.round(Math.max(minWidth, event.clientX - resizeOffsetRef.current.x));\n      newHeight = Math.round(Math.max(minHeight, event.clientY - resizeOffsetRef.current.y));\n    } else if (direction === ResizeDirection.SouthWest) {\n      // Bottom-left corner\n      const right = resizeRightRef.current!;\n      const proposedX = event.clientX;\n      newWidth = Math.round(Math.max(minWidth, right - proposedX));\n      clampedX = Math.round(right - newWidth);\n      newHeight = Math.round(Math.max(minHeight, event.clientY - resizeOffsetRef.current.y));\n    } else if (direction === ResizeDirection.NorthWest) {\n      // Top-left corner\n      const right = resizeRightRef.current!;\n      const bottom = resizeBottomRef.current!;\n      const proposedX = event.clientX;\n      const proposedY = event.clientY;\n      newWidth = Math.round(Math.max(minWidth, right - proposedX));\n      newHeight = Math.round(Math.max(minHeight, bottom - proposedY));\n      clampedX = Math.round(right - newWidth);\n      clampedY = Math.round(bottom - newHeight);\n    } else if (direction === ResizeDirection.NorthEast) {\n      // Top-right corner\n      const bottom = resizeBottomRef.current!;\n      const proposedY = event.clientY;\n      newWidth = Math.round(Math.max(minWidth, event.clientX - resizeOffsetRef.current.x));\n      newHeight = Math.round(Math.max(minHeight, bottom - proposedY));\n      clampedY = Math.round(bottom - newHeight);\n    } else if (direction === ResizeDirection.West) {\n      // Left edge\n      const right = resizeRightRef.current!;\n      const proposedX = event.clientX;\n      newWidth = Math.round(Math.max(minWidth, right - proposedX));\n      clampedX = Math.round(right - newWidth);\n    } else if (direction === ResizeDirection.East) {\n      // Right edge\n      newWidth = Math.round(Math.max(minWidth, event.clientX - resizeOffsetRef.current.x));\n    } else if (direction === ResizeDirection.North) {\n      // Top edge\n      const bottom = resizeBottomRef.current!;\n      const proposedY = event.clientY;\n      newHeight = Math.round(Math.max(minHeight, bottom - proposedY));\n      clampedY = Math.round(bottom - newHeight);\n    } else if (direction === ResizeDirection.South) {\n      // Bottom edge\n      newHeight = Math.round(Math.max(minHeight, event.clientY - resizeOffsetRef.current.y));\n    }\n\n    // We need to flush sync here because it would create jitter while the panel resizes from other directions\n    // this is because the browser will animate serially, but we want to update the position and size together\n    // so that the panel doesn't jump around\n    flushSync(() => {\n      setPanelPosition({ x: clampedX, y: clampedY });\n      setPanelSize({ width: newWidth, height: newHeight });\n    });\n  }\n\n  function handleResizeMouseUp() {\n    document.removeEventListener('mousemove', handleResizeMouseMove);\n    document.removeEventListener('mouseup', handleResizeMouseUp);\n  }\n\n  const panelContent = (\n    <FloatingPanelContainer\n      // Need to keep the values of x and y for positioning\n      ref={refs.setFloating}\n      $fitHeight={isAutoHeight}\n      $maxHeight={autoFitMaxHeight(windowDimensions.height, panelPosition.y, minHeight)}\n      $minHeight={minHeight}\n      style={{\n        x,\n        y,\n      }}\n      initial={{\n        top: 0,\n        left: 0,\n        opacity: 0,\n      }}\n      animate={{\n        x: fullSize ? PADDING : panelPosition.x,\n        y: fullSize ? PADDING : panelPosition.y,\n\n        // When fullscreen, leave space for any reserved right-side content.\n        width: fullSize ? `calc(100% - ${PADDING + fullscreenRightInset}px)` : panelSize.width,\n        // Omit height when CSS auto-fit is active so `height: max-content`\n        // on the styled container takes effect.\n        ...(isAutoHeight ? {} : { height: fullSize ? 'calc(100% - 16px)' : panelSize.height }),\n        opacity: isPositionReady ? 1 : 0,\n      }}\n      transition={\n        wasFullSizeToggled\n          ? {\n              type: 'tween',\n              // Easing curve for a smooth transition\n              ease: [0.83, 0.0, 0.17, 1.0],\n              duration: prefersReducedMotion ? 1.2 : 0.4,\n            }\n          : { opacity: { duration: 0.15, ease: 'easeOut' }, duration: 0 }\n      }\n      onDragEnd={() => {\n        if (!fullSize) {\n          const newPosition = { x: x.get(), y: y.get() };\n          const clampedPosition = clampPositionToBounds(newPosition);\n          setPanelPosition(clampedPosition);\n        }\n      }}\n      drag={!fullSize}\n      dragControls={dragControls}\n      dragListener={false}\n      dragMomentum={false}\n      dragConstraints={dragConstraints}\n      // The frame portals to the body, so panels that dismiss on an outside click\n      // need this id to recognize a click in here as one of their own overlays.\n      id={`${FLOATING_PANEL_ID_PREFIX}container`}\n      {...restProps}\n    >\n      <DragHandle isFullSize={fullSize} onPointerDown={(e) => dragControls.start(e)}>\n        <Stack align='center' direction='horizontal' justify='space-between'>\n          <PanelText>{title}</PanelText>\n          <Stack direction='horizontal' align='center' spacing={Spacing[1]}>\n            {headerActions}\n            {canFullsize && (\n              <StyledIconButton\n                size='sm'\n                aria-label={fullSize ? 'collapse' : 'expand'}\n                id='floating-panel__toggle-fullsize'\n                onClick={() => {\n                  setWasFullSizeToggled(true);\n                  setFullSize(!fullSize);\n                }}\n              >\n                {fullSize ? <ArrowCollapseIcon /> : <ArrowExpandIcon />}\n              </StyledIconButton>\n            )}\n\n            <StyledIconButton\n              size='sm'\n              id='floating-panel__close-panel'\n              onClick={() => onClose?.()}\n              aria-label='close'\n            >\n              <XIcon />\n            </StyledIconButton>\n          </Stack>\n        </Stack>\n      </DragHandle>\n      <PanelContent ref={contentRef} $noPadding={noPadding} $fitHeight={isAutoHeight}>\n        {children}\n      </PanelContent>\n      {hasFooter && (\n        <Footer style={{ paddingLeft: isAdditionalActionButton ? Spacing[1] : Spacing[3] }}>\n          <Stack\n            align='center'\n            direction='horizontal'\n            justify={footerAdditionalAction ? 'space-between' : 'flex-end'}\n          >\n            {footerAdditionalAction &&\n              (isAdditionalActionButton ? (\n                footerAdditionalAction\n              ) : (\n                <PanelText>{footerAdditionalAction}</PanelText>\n              ))}\n\n            {footerButtons && <div>{footerButtons}</div>}\n          </Stack>\n        </Footer>\n      )}\n      <ResizeHandleBottomRight\n        data-test='resize-handle-se'\n        onMouseDown={(event) => handleResizeMouseDown(event, ResizeDirection.SouthEast)}\n      />\n      <ResizeHandleBottom\n        onMouseDown={(event) => handleResizeMouseDown(event, ResizeDirection.South)}\n      />\n      <ResizeHandleBottomLeft\n        onMouseDown={(event) => handleResizeMouseDown(event, ResizeDirection.SouthWest)}\n      />\n      <ResizeHandleLeft\n        onMouseDown={(event) => handleResizeMouseDown(event, ResizeDirection.West)}\n      />\n      <ResizeHandleTopLeft\n        onMouseDown={(event) => handleResizeMouseDown(event, ResizeDirection.NorthWest)}\n      />\n      <ResizeHandleTop\n        onMouseDown={(event) => handleResizeMouseDown(event, ResizeDirection.North)}\n      />\n      <ResizeHandleTopRight\n        onMouseDown={(event) => handleResizeMouseDown(event, ResizeDirection.NorthEast)}\n      />\n      <ResizeHandleRight\n        onMouseDown={(event) => handleResizeMouseDown(event, ResizeDirection.East)}\n      />\n    </FloatingPanelContainer>\n  );\n\n  const content = (\n    <>\n      {dismissOnNavigate && <DismissOnNavigate onClose={onClose} />}\n      {panelContent}\n    </>\n  );\n\n  return portal ? createPortal(content, document.body) : content;\n}\n","import {\n  createContext,\n  type ReactElement,\n  type ReactNode,\n  useCallback,\n  useContext,\n  useEffect,\n  useState,\n} from 'react';\nimport { v4 as uuid } from 'uuid';\n\nimport { usePathname } from '#src/lib/router';\n\nexport type Panel = {\n  key: string;\n  panelElement: ReactElement;\n  persistUntilPathRoot?: string;\n};\n\ninterface PanelContextType {\n  openPanel: (panel: Panel) => void;\n  closePanel: (key: string) => void;\n  togglePanel: (panel: Panel) => void;\n  closeAllPanels: () => void;\n  isPanelOpen: (key: string) => boolean;\n  panels: Panel[];\n}\n\nconst PanelContext = createContext<PanelContextType | null>(null);\n\nexport const PanelProvider = ({ children }: { children: ReactNode }) => {\n  const [panels, setPanels] = useState<Panel[]>([]);\n  const pathname = usePathname();\n\n  function shouldPanelPersist(currentUrl: string, persistUntilPathRoot?: string): boolean {\n    if (!persistUntilPathRoot) {\n      return false;\n    }\n    return currentUrl.includes(persistUntilPathRoot);\n  }\n\n  const openPanel = useCallback(\n    (panel: Panel) => {\n      const { key, panelElement, persistUntilPathRoot } = panel;\n      const pathRoot = persistUntilPathRoot || pathname;\n      setPanels((prev) => [\n        ...prev.filter((p) => p.key !== key), // Remove existing panel with same key\n        { key, panelElement, persistUntilPathRoot: pathRoot },\n      ]);\n    },\n    [pathname],\n  );\n\n  const closePanel = useCallback((key: string) => {\n    setPanels((prev) => prev.filter((panel) => panel.key !== key));\n  }, []);\n\n  const isPanelOpen = useCallback(\n    (key: string) => {\n      return panels.some((panel) => panel.key === key);\n    },\n    [panels],\n  );\n\n  const togglePanel = useCallback(\n    (panel: Panel) => {\n      const { key } = panel;\n      if (isPanelOpen(key)) {\n        closePanel(key);\n      } else {\n        openPanel(panel);\n      }\n    },\n    [isPanelOpen, closePanel, openPanel],\n  );\n\n  const closeAllPanels = useCallback(() => {\n    setPanels([]);\n  }, []);\n\n  useEffect(() => {\n    const nextLocation = pathname;\n\n    setPanels((prevPanels) =>\n      prevPanels.filter((panel) => shouldPanelPersist(nextLocation, panel.persistUntilPathRoot)),\n    );\n  }, [pathname]);\n\n  return (\n    <PanelContext.Provider\n      value={{ openPanel, closePanel, togglePanel, closeAllPanels, panels, isPanelOpen }}\n    >\n      {children}\n    </PanelContext.Provider>\n  );\n};\n\nexport const usePersistentFloatingPanels = () => {\n  const ctx = useContext(PanelContext);\n  if (!ctx) {\n    throw new Error('usePersistentFloatingPanels must be used within a PanelProvider');\n  }\n  return ctx;\n};\n\n// This hook is used to open a panel that persists across multiple pages\n// For single page panels, use the useToggle hook instead to manage individual panel state.\nexport const usePersistentFloatingPanel = (panelId?: string) => {\n  const ctx = useContext(PanelContext);\n  if (!ctx) {\n    throw new Error('usePersistentFloatingPanels must be used within a PanelProvider');\n  }\n\n  // If the panel doesn't need to persist across multiple pages, we generate an id that can be passed back\n  const currentPanelId = panelId || `panel-${uuid()}`;\n\n  return {\n    id: currentPanelId,\n    openPanel: useCallback(\n      (panel: Panel) => {\n        ctx.openPanel(panel);\n      },\n      [ctx],\n    ),\n    closePanel: useCallback(() => {\n      ctx.closePanel(currentPanelId);\n    }, [currentPanelId, ctx]),\n    togglePanel: useCallback(\n      (panel: Panel) => {\n        ctx.togglePanel(panel);\n      },\n      [ctx],\n    ),\n    isPanelOpen: ctx.isPanelOpen(currentPanelId),\n  };\n};\n","import { cloneElement } from 'react';\nimport { createPortal } from 'react-dom';\n\nimport { usePersistentFloatingPanels } from './FloatingPanelContext';\n\nexport default function FloatingPanelRenderer() {\n  const { panels, closePanel } = usePersistentFloatingPanels();\n\n  if (panels.length === 0) {\n    return null;\n  }\n\n  return createPortal(\n    panels.map(({ key, panelElement: panel }) => {\n      return cloneElement(panel, { onClose: () => closePanel(key), key: key });\n    }),\n    document.body,\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"index.mjs","names":["uuid"],"sources":["../../../src/components/FloatingPanel/utils.ts","../../../src/components/FloatingPanel/FloatingPanel.tsx","../../../src/components/FloatingPanel/FloatingPanelContext.tsx","../../../src/components/FloatingPanel/FloatingPanelRenderer.tsx"],"sourcesContent":["export const PADDING = 8;\nexport const EDGE_PADDING = PADDING * 6;\n\n// Cap a content-fitting panel's height to the room below its top edge so it\n// can't overflow the viewport bottom when anchored partway down the screen.\nexport function autoFitMaxHeight(viewportHeight: number, topOffset: number, minHeight: number) {\n  return Math.max(minHeight, viewportHeight - Math.max(EDGE_PADDING, topOffset) - EDGE_PADDING);\n}\n","import { flip, offset, type Placement, shift, useFloating } from '@floating-ui/react';\nimport { motion, useDragControls, useMotionValue, useReducedMotion } from 'framer-motion';\nimport {\n  isValidElement,\n  type ReactNode,\n  type RefObject,\n  useCallback,\n  useContext,\n  useEffect,\n  useRef,\n  useState,\n} from 'react';\nimport { createPortal, flushSync } from 'react-dom';\nimport styled, { css } from 'styled-components';\n\nimport { IconButton } from '@persona/design-system/components/Button';\nimport Stack from '@persona/design-system/components/Stack';\nimport { Z_INDICES } from '@persona/design-system/lib/zindex';\nimport { paragraphMixins } from '@persona/design-system/mixins/text';\nimport { Elevation } from '@persona/design-system/variables/effect';\nimport { BorderRadius, Color, Spacing } from '@persona/design-tokens';\nimport { ArrowCollapseIcon, ArrowExpandIcon, XIcon } from '@persona/icons';\n\nimport ConfigContext from '#src/lib/ConfigContext';\nimport { usePathname } from '#src/lib/router';\nimport { semanticColor } from '#src/lib/semanticColor';\nimport { semanticScrollbar } from '#src/mixins/scrollbar';\nimport {\n  ReducedMotionFade,\n  TransitionDuration,\n  TransitionDurationInSeconds,\n  TransitionEasingCurve,\n} from '#src/variables/transitions';\n\nimport { autoFitMaxHeight, PADDING } from './utils';\n\nexport const FLOATING_PANEL_ID_PREFIX = 'floating-panel__' as const;\n\nenum ResizeDirection {\n  North = 'n',\n  South = 's',\n  East = 'e',\n  West = 'w',\n  NorthEast = 'ne',\n  NorthWest = 'nw',\n  SouthEast = 'se',\n  SouthWest = 'sw',\n}\n\nexport interface FloatingPanelProps {\n  /** The title text displayed in the panel header */\n  title: ReactNode;\n  /** Callback function called when the close button is clicked */\n  onClose?: () => void;\n  /** Content to render inside the main panel area */\n  children?: ReactNode;\n  /** Optional React component rendered to the left of the expand button in the header */\n  headerActions?: ReactNode;\n\n  /** Whether the panel displays the fullsize button */\n  canFullsize?: boolean;\n\n  /** When true, the panel opens already in full-size (maximized) mode. */\n  defaultFullSize?: boolean;\n\n  /** Initial width of the panel in pixels */\n  initialWidth?: number;\n  /** Initial height of the panel in pixels */\n  initialHeight?: number;\n  /** Minimum width the panel can be resized to in pixels */\n  minWidth?: number;\n  /** Minimum height the panel can be resized to in pixels */\n  minHeight?: number;\n\n  footerButtons?: ReactNode;\n\n  footerAdditionalAction?: ReactNode;\n\n  portal?: boolean;\n\n  /** Reference to the element that triggered this panel, used for automatic positioning */\n  triggerRef?: RefObject<HTMLElement>;\n\n  /** Which placement of the trigger element to position the panel on */\n  placement?: Placement;\n\n  /** Additional main axis offset in pixels from the calculated position. Main axis is defined as the axis in position to where its being defined\n   * i.e. right, top, left ,bottom */\n  mainAxisOffset?: number;\n\n  /** Additional cross offset in pixels from the calculated position. Cross is defined as the axis that runs along the alignment\n   * of the floating element. */\n  crossAxisOffset?: number;\n\n  /** remove padding from the panel content */\n  noPadding?: boolean;\n\n  /** When true, automatically calls `onClose` if the route changes after the\n   * panel mounts. Mirrors the auto-dismiss-on-navigation behavior provided by\n   * `PanelProvider` / `usePersistentFloatingPanel` for panels that don't opt\n   * into the persistent panel context. Defaults to `false` so existing\n   * consumers (e.g. dirty-check confirmation flows) are not broken. */\n  dismissOnNavigate?: boolean;\n\n  /** When true, the panel's height auto-fits its content via CSS (`max-content`)\n   * up to the viewport, instead of using `initialHeight`. Once the user manually\n   * resizes, the panel switches to pixel mode and stays there. `initialHeight`\n   * is ignored while auto-fitting. */\n  fitContent?: boolean;\n}\n\nconst FloatingPanelContainer = styled(motion.div)<{\n  $fitHeight?: boolean;\n  $maxHeight?: number;\n  $minHeight?: number;\n}>`\n  position: absolute;\n  z-index: ${Z_INDICES.modal};\n  background: ${({ theme }) =>\n    semanticColor(theme, 'SurfaceElevated', theme.color.background.primary)};\n  border: 1px solid ${({ theme }) => semanticColor(theme, 'BorderSubtle', Color.BorderDivider)};\n  border-radius: ${BorderRadius.Lg};\n  box-shadow: ${Elevation.Low};\n  display: flex;\n  flex-direction: column;\n  cursor: auto;\n  ${({ $fitHeight, $maxHeight, $minHeight }) =>\n    $fitHeight &&\n    css`\n      height: auto;\n      max-height: ${$maxHeight ?? 0}px;\n      min-height: ${$minHeight ?? 0}px;\n    `}\n`;\n\nconst DragHandle = styled(motion.div)<{ isFullSize: boolean }>`\n  cursor: ${({ isFullSize }) => (isFullSize ? 'default' : 'grab')};\n  user-select: none;\n\n  &:active {\n    cursor: ${({ isFullSize }) => (isFullSize ? 'default' : 'grabbing')};\n  }\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  min-height: 48px;\n  height: 48px;\n  overflow: hidden;\n  padding: ${Spacing[1]} ${Spacing[1]} ${Spacing[1]} ${Spacing[3]};\n  border-bottom: 1px solid ${({ theme }) => semanticColor(theme, 'BorderSubtle', Color.BorderDivider)};\n`;\n\nconst Footer = styled.div`\n  padding: ${Spacing[1]} ${Spacing[1]} ${Spacing[1]} ${Spacing[3]};\n  border-top: 1px solid ${({ theme }) => semanticColor(theme, 'BorderSubtle', Color.BorderDivider)};\n  overflow-x: hidden;\n  background-color: ${({ theme }) =>\n    semanticColor(theme, 'SurfaceElevated', theme.color.background.primary)};\n  width: 100%;\n  border-radius: 0 0 ${BorderRadius.Lg} ${BorderRadius.Lg};\n`;\n\nconst ResizeHandleBase = styled.div`\n  position: absolute;\n  user-select: none;\n`;\n\n// Sets the width and height for base corner to 20px\nconst ResizeHandleBaseCorner = styled(ResizeHandleBase)`\n  width: 1.25rem;\n  height: 1.25rem;\n`;\n\nconst ResizeHandleBottomRight = styled(ResizeHandleBaseCorner)`\n  bottom: -0.75rem;\n  right: -0.75rem;\n  cursor: nwse-resize;\n`;\n\nconst ResizeHandleBottomLeft = styled(ResizeHandleBaseCorner)`\n  bottom: -0.75rem;\n  left: -0.75rem;\n  cursor: nesw-resize;\n`;\n\nconst ResizeHandleTopLeft = styled(ResizeHandleBaseCorner)`\n  top: -0.75rem;\n  left: -0.75rem;\n  cursor: nwse-resize;\n`;\n\nconst ResizeHandleTopRight = styled(ResizeHandleBaseCorner)`\n  top: -0.75rem;\n  right: -0.75rem;\n  cursor: nesw-resize;\n`;\n\n// These are all the Resize handles for the four cardinal direction,\n// To calculate the width, we subtract by the padding of 1rem on both sides\n// which are corners of the panel\nconst ResizeHandleBottom = styled(ResizeHandleBase)`\n  bottom: -0.75rem;\n  left: 0.5rem;\n  width: calc(100% - 1rem);\n  height: 1rem;\n  cursor: ns-resize;\n  user-select: none;\n`;\n\nconst ResizeHandleTop = styled(ResizeHandleBase)`\n  top: -0.75rem;\n  left: 0.5rem;\n  width: calc(100% - 1rem);\n  height: 1rem;\n  cursor: ns-resize;\n`;\n\nconst ResizeHandleRight = styled(ResizeHandleBase)`\n  right: -0.75rem;\n  top: 0.5rem;\n  width: 1rem;\n  height: calc(100% - 1rem);\n  cursor: ew-resize;\n`;\n\nconst ResizeHandleLeft = styled(ResizeHandleBase)`\n  left: -0.75rem;\n  top: 0.5rem;\n  width: 1rem;\n  height: calc(100% - 1rem);\n  cursor: ew-resize;\n`;\n\nconst PanelContent = styled.div<{ $noPadding?: boolean; $fitHeight?: boolean }>`\n  overflow-y: auto;\n  ${semanticScrollbar}\n  overscroll-behavior: contain;\n  min-height: 0;\n  /* While the panel height is derived from its content, the content must size\n     itself (a percentage flex-basis against an indefinite height collapses in\n     WebKit); it still shrinks when the panel hits its max-height. */\n  flex: ${({ $fitHeight }) => ($fitHeight ? '0 1 auto' : '1 1 0%')};\n  padding: ${({ $noPadding }) => ($noPadding ? 0 : Spacing[3])};\n`;\n\n// Sets a min width so that the text will display, but overflows if needed\nconst PanelText = styled.p`\n  ${paragraphMixins.sm}\n  white-space: nowrap;\n  min-width: 3rem;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  display: flex;\n  align-items: center;\n  font-weight: 500;\n`;\n\nconst StyledIconButton = styled(IconButton)`\n  width: 1.5rem;\n  height: 1.5rem;\n  border-radius: ${BorderRadius.Md};\n`;\n\n// Only rendered when dismissOnNavigate is true, keeping the router lookup out of the\n// main component body so FloatingPanel works without a Router when not needed.\nfunction DismissOnNavigate({ onClose }: { onClose: () => void }) {\n  const pathname = usePathname();\n  const initialPathname = useRef(pathname);\n  useEffect(() => {\n    if (pathname !== initialPathname.current) {\n      onClose();\n    }\n  }, [pathname, onClose]);\n  return null;\n}\n\nexport default function FloatingPanel({\n  title = 'Panel title',\n  children,\n  portal = true,\n  triggerRef,\n  initialWidth = 400,\n  initialHeight = 600,\n  minWidth = 100,\n  minHeight = 150,\n  mainAxisOffset = 0,\n  crossAxisOffset = 0,\n  footerButtons,\n  footerAdditionalAction,\n  placement = 'right',\n  canFullsize = true,\n  defaultFullSize = false,\n  noPadding,\n  headerActions,\n  dismissOnNavigate = false,\n  fitContent = false,\n  onClose = () => {},\n  ...restProps\n}: FloatingPanelProps) {\n  const { floatingPanel } = useContext(ConfigContext);\n  const fullscreenRightInset = floatingPanel?.fullscreenRightInset ?? PADDING;\n  const hasFooter = footerButtons || footerAdditionalAction;\n  const isAdditionalActionButton =\n    isValidElement(footerAdditionalAction) && footerAdditionalAction.type === 'button';\n\n  const [panelSize, setPanelSize] = useState({ width: initialWidth, height: initialHeight });\n  const panelSizeRef = useRef({ width: initialWidth, height: initialHeight });\n  const [panelPosition, setPanelPosition] = useState({ x: 0, y: 0 });\n  const [isPositionReady, setIsPositionReady] = useState(!triggerRef); // Ready immediately if no triggerRef\n\n  const [fullSize, setFullSize] = useState(defaultFullSize);\n  const resizeBottomRef = useRef<number | null>(null);\n  const resizeRightRef = useRef<number | null>(null);\n\n  const [wasFullSizeToggled, setWasFullSizeToggled] = useState(false);\n  const resizeOffsetRef = useRef({ x: 0, y: 0 });\n\n  const resizeDirectionRef = useRef<ResizeDirection | null>(null);\n  const resizeStartDimensionsRef = useRef({\n    width: initialWidth,\n    height: initialHeight,\n    x: 0,\n    y: 0,\n  });\n\n  // Track if the user has manually resized the panel\n  const [hasManuallyResized, setHasManuallyResized] = useState(false);\n  const contentRef = useRef<HTMLDivElement>(null);\n\n  // Track reduced motion preference\n  const prefersReducedMotion = useReducedMotion();\n\n  const dragControls = useDragControls();\n\n  const x = useMotionValue(0);\n  const y = useMotionValue(0);\n\n  const {\n    x: floatingX,\n    y: floatingY,\n    refs,\n  } = useFloating({\n    placement: placement,\n    elements: {\n      reference: triggerRef?.current || undefined,\n    },\n    middleware: [\n      offset({\n        mainAxis: mainAxisOffset,\n        crossAxis: crossAxisOffset,\n      }),\n      flip(),\n      // flip() only swaps sides, so a large panel can still open clipped off an\n      // edge. shift() slides it back into view on both axes (crossAxis covers the\n      // side axis flip leaves unhandled).\n      shift({ crossAxis: true, padding: PADDING }),\n    ],\n  });\n\n  useEffect(() => {\n    // Only update position when floating values are not at the default 0,0\n    // or when we don't have a triggerRef (meaning we should use initial position)\n    if (!triggerRef || floatingX !== 0 || floatingY !== 0) {\n      setPanelPosition({\n        x: floatingX,\n        y: floatingY,\n      });\n      setIsPositionReady(true);\n    }\n  }, [floatingX, floatingY, triggerRef]);\n\n  // Window dimensions and drag constraints\n  const [windowDimensions, setWindowDimensions] = useState({\n    width: typeof window !== 'undefined' ? window.innerWidth : 1200,\n    height: typeof window !== 'undefined' ? window.innerHeight : 800,\n  });\n\n  // Update window dimensions on resize\n  useEffect(() => {\n    const handleResize = () => {\n      setWindowDimensions({\n        width: window.innerWidth,\n        height: window.innerHeight,\n      });\n    };\n\n    window.addEventListener('resize', handleResize);\n    return () => window.removeEventListener('resize', handleResize);\n  }, []);\n\n  const dragConstraints = fullSize\n    ? undefined\n    : {\n        left: PADDING,\n        right: Math.max(PADDING, windowDimensions.width - panelSize.width - PADDING),\n        top: PADDING,\n        bottom: Math.max(PADDING, windowDimensions.height - panelSize.height - PADDING),\n      };\n\n  // Clamp initial position and any position updates to be within bounds\n  const clampPositionToBounds = useCallback(\n    (position: { x: number; y: number }) => {\n      if (fullSize) {\n        return position;\n      }\n\n      return {\n        x: Math.max(\n          PADDING,\n          Math.min(\n            position.x,\n            Math.max(PADDING, windowDimensions.width - panelSize.width - PADDING),\n          ),\n        ),\n        y: Math.max(\n          PADDING,\n          Math.min(\n            position.y,\n            Math.max(PADDING, windowDimensions.height - panelSize.height - PADDING),\n          ),\n        ),\n      };\n    },\n    [windowDimensions, panelSize, fullSize],\n  );\n\n  // Clamp position on window resize\n  useEffect(() => {\n    if (!fullSize) {\n      const clampedPosition = clampPositionToBounds(panelPosition);\n      if (clampedPosition.x !== panelPosition.x || clampedPosition.y !== panelPosition.y) {\n        setPanelPosition(clampedPosition);\n      }\n    }\n  }, [windowDimensions, panelPosition, clampPositionToBounds, fullSize]);\n\n  useEffect(() => {\n    if (wasFullSizeToggled) {\n      const timer = setTimeout(\n        () => setWasFullSizeToggled(false),\n        parseInt(prefersReducedMotion ? ReducedMotionFade.duration : TransitionDuration.Medium, 10),\n      );\n      return () => clearTimeout(timer);\n    }\n  }, [wasFullSizeToggled, prefersReducedMotion]);\n\n  // We need this useEffect here to sync a ref to the panel size, which is needed for resizing\n  useEffect(() => {\n    panelSizeRef.current = panelSize;\n  }, [panelSize]);\n\n  // True while the panel is letting CSS auto-fit its height to content\n  // (`fitContent` opt-in, no manual resize yet, not in fullsize). In this mode\n  // we omit `height` from the framer-motion animate prop so the styled\n  // container's `height: max-content` is in effect.\n  const isAutoHeight = fitContent && !hasManuallyResized && !fullSize;\n\n  // Unified resize handler for all directions\n  function handleResizeMouseDown(\n    event: React.MouseEvent<HTMLDivElement>,\n    direction: ResizeDirection,\n  ) {\n    event.preventDefault();\n    event.stopPropagation();\n\n    let currentWidth: number;\n    let currentHeight: number;\n    let currentX: number;\n    let currentY: number;\n\n    if (fullSize) {\n      // Exit fullscreen but preserve the current rendered dimensions so the panel\n      // appears to stay in place while the user resizes from the edges.\n      // Measure from the DOM so we get the real pixel width/height regardless of\n      // what `calc(100% - 16px)` resolves to (differs for portaled vs. in-place\n      // panels because `100%` is relative to the containing block, not the viewport).\n      const container = contentRef.current?.parentElement;\n      currentWidth = container?.offsetWidth ?? windowDimensions.width - 16;\n      currentHeight = container?.offsetHeight ?? windowDimensions.height - 16;\n      currentX = 8;\n      currentY = 8;\n      // Sync motion values now so x.get()/y.get() return the correct position for\n      // computing fixed-edge anchors below.\n      x.set(8);\n      y.set(8);\n      setFullSize(false);\n      setPanelSize({ width: currentWidth, height: currentHeight });\n      setPanelPosition({ x: currentX, y: currentY });\n    } else if (isAutoHeight) {\n      // If we're leaving CSS auto-fit, capture the current rendered height so the\n      // panel doesn't jump from its content-fit size back to `initialHeight` when\n      // pixel mode takes over.\n      const container = contentRef.current?.parentElement;\n      currentHeight = container?.offsetHeight ?? panelSize.height;\n      currentWidth = panelSize.width;\n      currentX = panelPosition.x;\n      currentY = panelPosition.y;\n      setPanelSize({ width: currentWidth, height: currentHeight });\n    } else {\n      currentWidth = panelSize.width;\n      currentHeight = panelSize.height;\n      currentX = panelPosition.x;\n      currentY = panelPosition.y;\n    }\n\n    panelSizeRef.current = { width: currentWidth, height: currentHeight };\n    // Capture start dimensions in a ref so handleResizeMouseMove (stale closure)\n    // can read the correct initial values for unchanged axes without depending on\n    // panelSize/panelPosition state captured at listener-registration time.\n    resizeStartDimensionsRef.current = {\n      width: currentWidth,\n      height: currentHeight,\n      x: currentX,\n      y: currentY,\n    };\n\n    // Mark that user has manually resized - disable auto-resize from now on\n    setHasManuallyResized(true);\n\n    resizeDirectionRef.current = direction;\n\n    // Calculate initial offsets and fixed points based on direction\n    if (direction === ResizeDirection.SouthEast) {\n      // Bottom-right: resize from bottom-right corner\n      resizeOffsetRef.current = {\n        x: event.clientX - currentWidth,\n        y: event.clientY - currentHeight,\n      };\n    } else if (direction === ResizeDirection.SouthWest) {\n      // Bottom-left: resize from bottom-left corner\n      resizeRightRef.current = x.get() + currentWidth;\n      resizeOffsetRef.current = {\n        x: event.clientX,\n        y: event.clientY - currentHeight,\n      };\n    } else if (direction === ResizeDirection.NorthWest) {\n      // Top-left: resize from top-left corner\n      resizeRightRef.current = x.get() + currentWidth;\n      resizeBottomRef.current = y.get() + currentHeight;\n      resizeOffsetRef.current = {\n        x: event.clientX,\n        y: event.clientY,\n      };\n    } else if (direction === ResizeDirection.NorthEast) {\n      // Top-right: resize from top-right corner\n      resizeBottomRef.current = y.get() + currentHeight;\n      resizeOffsetRef.current = {\n        x: event.clientX - currentWidth,\n        y: event.clientY,\n      };\n    } else if (direction === ResizeDirection.West) {\n      // Left edge\n      resizeRightRef.current = x.get() + currentWidth;\n      resizeOffsetRef.current = {\n        x: event.clientX,\n        y: 0,\n      };\n    } else if (direction === ResizeDirection.East) {\n      // Right edge\n      resizeOffsetRef.current = {\n        x: event.clientX - currentWidth,\n        y: 0,\n      };\n    } else if (direction === ResizeDirection.North) {\n      // Top edge\n      resizeBottomRef.current = y.get() + currentHeight;\n      resizeOffsetRef.current = {\n        x: 0,\n        y: event.clientY,\n      };\n    } else if (direction === ResizeDirection.South) {\n      // Bottom edge\n      resizeOffsetRef.current = {\n        x: 0,\n        y: event.clientY - currentHeight,\n      };\n    }\n\n    document.addEventListener('mousemove', handleResizeMouseMove);\n    document.addEventListener('mouseup', handleResizeMouseUp);\n  }\n\n  // ResizeMouseMove to calculate the new size and position of the panel\n  function handleResizeMouseMove(event: MouseEvent) {\n    const direction = resizeDirectionRef.current;\n    // Use resizeStartDimensionsRef (a ref, always current) rather than panelSize/panelPosition\n    // (stale closure values). For unchanged axes, these provide the correct starting dimensions\n    // set at drag start — including the case where the drag began in fullscreen mode.\n    let newWidth = resizeStartDimensionsRef.current.width;\n    let newHeight = resizeStartDimensionsRef.current.height;\n    let clampedX = resizeStartDimensionsRef.current.x;\n    let clampedY = resizeStartDimensionsRef.current.y;\n\n    if (direction === ResizeDirection.SouthEast) {\n      // Bottom-right corner\n      newWidth = Math.round(Math.max(minWidth, event.clientX - resizeOffsetRef.current.x));\n      newHeight = Math.round(Math.max(minHeight, event.clientY - resizeOffsetRef.current.y));\n    } else if (direction === ResizeDirection.SouthWest) {\n      // Bottom-left corner\n      const right = resizeRightRef.current!;\n      const proposedX = event.clientX;\n      newWidth = Math.round(Math.max(minWidth, right - proposedX));\n      clampedX = Math.round(right - newWidth);\n      newHeight = Math.round(Math.max(minHeight, event.clientY - resizeOffsetRef.current.y));\n    } else if (direction === ResizeDirection.NorthWest) {\n      // Top-left corner\n      const right = resizeRightRef.current!;\n      const bottom = resizeBottomRef.current!;\n      const proposedX = event.clientX;\n      const proposedY = event.clientY;\n      newWidth = Math.round(Math.max(minWidth, right - proposedX));\n      newHeight = Math.round(Math.max(minHeight, bottom - proposedY));\n      clampedX = Math.round(right - newWidth);\n      clampedY = Math.round(bottom - newHeight);\n    } else if (direction === ResizeDirection.NorthEast) {\n      // Top-right corner\n      const bottom = resizeBottomRef.current!;\n      const proposedY = event.clientY;\n      newWidth = Math.round(Math.max(minWidth, event.clientX - resizeOffsetRef.current.x));\n      newHeight = Math.round(Math.max(minHeight, bottom - proposedY));\n      clampedY = Math.round(bottom - newHeight);\n    } else if (direction === ResizeDirection.West) {\n      // Left edge\n      const right = resizeRightRef.current!;\n      const proposedX = event.clientX;\n      newWidth = Math.round(Math.max(minWidth, right - proposedX));\n      clampedX = Math.round(right - newWidth);\n    } else if (direction === ResizeDirection.East) {\n      // Right edge\n      newWidth = Math.round(Math.max(minWidth, event.clientX - resizeOffsetRef.current.x));\n    } else if (direction === ResizeDirection.North) {\n      // Top edge\n      const bottom = resizeBottomRef.current!;\n      const proposedY = event.clientY;\n      newHeight = Math.round(Math.max(minHeight, bottom - proposedY));\n      clampedY = Math.round(bottom - newHeight);\n    } else if (direction === ResizeDirection.South) {\n      // Bottom edge\n      newHeight = Math.round(Math.max(minHeight, event.clientY - resizeOffsetRef.current.y));\n    }\n\n    // We need to flush sync here because it would create jitter while the panel resizes from other directions\n    // this is because the browser will animate serially, but we want to update the position and size together\n    // so that the panel doesn't jump around\n    flushSync(() => {\n      setPanelPosition({ x: clampedX, y: clampedY });\n      setPanelSize({ width: newWidth, height: newHeight });\n    });\n  }\n\n  function handleResizeMouseUp() {\n    document.removeEventListener('mousemove', handleResizeMouseMove);\n    document.removeEventListener('mouseup', handleResizeMouseUp);\n  }\n\n  const panelContent = (\n    <FloatingPanelContainer\n      // Need to keep the values of x and y for positioning\n      ref={refs.setFloating}\n      $fitHeight={isAutoHeight}\n      $maxHeight={autoFitMaxHeight(windowDimensions.height, panelPosition.y, minHeight)}\n      $minHeight={minHeight}\n      style={{\n        x,\n        y,\n      }}\n      initial={{\n        top: 0,\n        left: 0,\n        opacity: 0,\n      }}\n      animate={{\n        x: fullSize ? PADDING : panelPosition.x,\n        y: fullSize ? PADDING : panelPosition.y,\n\n        // When fullscreen, leave space for any reserved right-side content.\n        width: fullSize ? `calc(100% - ${PADDING + fullscreenRightInset}px)` : panelSize.width,\n        // Omit height when CSS auto-fit is active so `height: max-content`\n        // on the styled container takes effect.\n        ...(isAutoHeight ? {} : { height: fullSize ? 'calc(100% - 16px)' : panelSize.height }),\n        // Under reduced motion the size jumps and the panel fades back in instead.\n        opacity: wasFullSizeToggled && prefersReducedMotion ? [0, 1] : isPositionReady ? 1 : 0,\n      }}\n      transition={\n        wasFullSizeToggled\n          ? prefersReducedMotion\n            ? {\n                duration: 0,\n                opacity: {\n                  duration: ReducedMotionFade.durationInSeconds,\n                  ease: TransitionEasingCurve.Move,\n                },\n              }\n            : {\n                type: 'tween',\n                ease: TransitionEasingCurve.Move,\n                duration: TransitionDurationInSeconds.Medium,\n              }\n          : {\n              opacity: {\n                duration: TransitionDurationInSeconds.Faster,\n                ease: TransitionEasingCurve.Enter,\n              },\n              duration: 0,\n            }\n      }\n      onDragEnd={() => {\n        if (!fullSize) {\n          const newPosition = { x: x.get(), y: y.get() };\n          const clampedPosition = clampPositionToBounds(newPosition);\n          setPanelPosition(clampedPosition);\n        }\n      }}\n      drag={!fullSize}\n      dragControls={dragControls}\n      dragListener={false}\n      dragMomentum={false}\n      dragConstraints={dragConstraints}\n      // The frame portals to the body, so panels that dismiss on an outside click\n      // need this id to recognize a click in here as one of their own overlays.\n      id={`${FLOATING_PANEL_ID_PREFIX}container`}\n      {...restProps}\n    >\n      <DragHandle isFullSize={fullSize} onPointerDown={(e) => dragControls.start(e)}>\n        <Stack align='center' direction='horizontal' justify='space-between'>\n          <PanelText>{title}</PanelText>\n          <Stack direction='horizontal' align='center' spacing={Spacing[1]}>\n            {headerActions}\n            {canFullsize && (\n              <StyledIconButton\n                size='sm'\n                aria-label={fullSize ? 'collapse' : 'expand'}\n                id='floating-panel__toggle-fullsize'\n                onClick={() => {\n                  setWasFullSizeToggled(true);\n                  setFullSize(!fullSize);\n                }}\n              >\n                {fullSize ? <ArrowCollapseIcon /> : <ArrowExpandIcon />}\n              </StyledIconButton>\n            )}\n\n            <StyledIconButton\n              size='sm'\n              id='floating-panel__close-panel'\n              onClick={() => onClose?.()}\n              aria-label='close'\n            >\n              <XIcon />\n            </StyledIconButton>\n          </Stack>\n        </Stack>\n      </DragHandle>\n      <PanelContent ref={contentRef} $noPadding={noPadding} $fitHeight={isAutoHeight}>\n        {children}\n      </PanelContent>\n      {hasFooter && (\n        <Footer style={{ paddingLeft: isAdditionalActionButton ? Spacing[1] : Spacing[3] }}>\n          <Stack\n            align='center'\n            direction='horizontal'\n            justify={footerAdditionalAction ? 'space-between' : 'flex-end'}\n          >\n            {footerAdditionalAction &&\n              (isAdditionalActionButton ? (\n                footerAdditionalAction\n              ) : (\n                <PanelText>{footerAdditionalAction}</PanelText>\n              ))}\n\n            {footerButtons && <div>{footerButtons}</div>}\n          </Stack>\n        </Footer>\n      )}\n      <ResizeHandleBottomRight\n        data-test='resize-handle-se'\n        onMouseDown={(event) => handleResizeMouseDown(event, ResizeDirection.SouthEast)}\n      />\n      <ResizeHandleBottom\n        onMouseDown={(event) => handleResizeMouseDown(event, ResizeDirection.South)}\n      />\n      <ResizeHandleBottomLeft\n        onMouseDown={(event) => handleResizeMouseDown(event, ResizeDirection.SouthWest)}\n      />\n      <ResizeHandleLeft\n        onMouseDown={(event) => handleResizeMouseDown(event, ResizeDirection.West)}\n      />\n      <ResizeHandleTopLeft\n        onMouseDown={(event) => handleResizeMouseDown(event, ResizeDirection.NorthWest)}\n      />\n      <ResizeHandleTop\n        onMouseDown={(event) => handleResizeMouseDown(event, ResizeDirection.North)}\n      />\n      <ResizeHandleTopRight\n        onMouseDown={(event) => handleResizeMouseDown(event, ResizeDirection.NorthEast)}\n      />\n      <ResizeHandleRight\n        onMouseDown={(event) => handleResizeMouseDown(event, ResizeDirection.East)}\n      />\n    </FloatingPanelContainer>\n  );\n\n  const content = (\n    <>\n      {dismissOnNavigate && <DismissOnNavigate onClose={onClose} />}\n      {panelContent}\n    </>\n  );\n\n  return portal ? createPortal(content, document.body) : content;\n}\n","import {\n  createContext,\n  type ReactElement,\n  type ReactNode,\n  useCallback,\n  useContext,\n  useEffect,\n  useState,\n} from 'react';\nimport { v4 as uuid } from 'uuid';\n\nimport { usePathname } from '#src/lib/router';\n\nexport type Panel = {\n  key: string;\n  panelElement: ReactElement;\n  persistUntilPathRoot?: string;\n};\n\ninterface PanelContextType {\n  openPanel: (panel: Panel) => void;\n  closePanel: (key: string) => void;\n  togglePanel: (panel: Panel) => void;\n  closeAllPanels: () => void;\n  isPanelOpen: (key: string) => boolean;\n  panels: Panel[];\n}\n\nconst PanelContext = createContext<PanelContextType | null>(null);\n\nexport const PanelProvider = ({ children }: { children: ReactNode }) => {\n  const [panels, setPanels] = useState<Panel[]>([]);\n  const pathname = usePathname();\n\n  function shouldPanelPersist(currentUrl: string, persistUntilPathRoot?: string): boolean {\n    if (!persistUntilPathRoot) {\n      return false;\n    }\n    return currentUrl.includes(persistUntilPathRoot);\n  }\n\n  const openPanel = useCallback(\n    (panel: Panel) => {\n      const { key, panelElement, persistUntilPathRoot } = panel;\n      const pathRoot = persistUntilPathRoot || pathname;\n      setPanels((prev) => [\n        ...prev.filter((p) => p.key !== key), // Remove existing panel with same key\n        { key, panelElement, persistUntilPathRoot: pathRoot },\n      ]);\n    },\n    [pathname],\n  );\n\n  const closePanel = useCallback((key: string) => {\n    setPanels((prev) => prev.filter((panel) => panel.key !== key));\n  }, []);\n\n  const isPanelOpen = useCallback(\n    (key: string) => {\n      return panels.some((panel) => panel.key === key);\n    },\n    [panels],\n  );\n\n  const togglePanel = useCallback(\n    (panel: Panel) => {\n      const { key } = panel;\n      if (isPanelOpen(key)) {\n        closePanel(key);\n      } else {\n        openPanel(panel);\n      }\n    },\n    [isPanelOpen, closePanel, openPanel],\n  );\n\n  const closeAllPanels = useCallback(() => {\n    setPanels([]);\n  }, []);\n\n  useEffect(() => {\n    const nextLocation = pathname;\n\n    setPanels((prevPanels) =>\n      prevPanels.filter((panel) => shouldPanelPersist(nextLocation, panel.persistUntilPathRoot)),\n    );\n  }, [pathname]);\n\n  return (\n    <PanelContext.Provider\n      value={{ openPanel, closePanel, togglePanel, closeAllPanels, panels, isPanelOpen }}\n    >\n      {children}\n    </PanelContext.Provider>\n  );\n};\n\nexport const usePersistentFloatingPanels = () => {\n  const ctx = useContext(PanelContext);\n  if (!ctx) {\n    throw new Error('usePersistentFloatingPanels must be used within a PanelProvider');\n  }\n  return ctx;\n};\n\n// This hook is used to open a panel that persists across multiple pages\n// For single page panels, use the useToggle hook instead to manage individual panel state.\nexport const usePersistentFloatingPanel = (panelId?: string) => {\n  const ctx = useContext(PanelContext);\n  if (!ctx) {\n    throw new Error('usePersistentFloatingPanels must be used within a PanelProvider');\n  }\n\n  // If the panel doesn't need to persist across multiple pages, we generate an id that can be passed back\n  const currentPanelId = panelId || `panel-${uuid()}`;\n\n  return {\n    id: currentPanelId,\n    openPanel: useCallback(\n      (panel: Panel) => {\n        ctx.openPanel(panel);\n      },\n      [ctx],\n    ),\n    closePanel: useCallback(() => {\n      ctx.closePanel(currentPanelId);\n    }, [currentPanelId, ctx]),\n    togglePanel: useCallback(\n      (panel: Panel) => {\n        ctx.togglePanel(panel);\n      },\n      [ctx],\n    ),\n    isPanelOpen: ctx.isPanelOpen(currentPanelId),\n  };\n};\n","import { cloneElement } from 'react';\nimport { createPortal } from 'react-dom';\n\nimport { usePersistentFloatingPanels } from './FloatingPanelContext';\n\nexport default function FloatingPanelRenderer() {\n  const { panels, closePanel } = usePersistentFloatingPanels();\n\n  if (panels.length === 0) {\n    return null;\n  }\n\n  return createPortal(\n    panels.map(({ key, panelElement: panel }) => {\n      return cloneElement(panel, { onClose: () => closePanel(key), key: key });\n    }),\n    document.body,\n  );\n}\n"],"mappings":"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"}