@sproutsocial/seeds-react-panel 1.2.1 → 1.2.2

package/.turbo/turbo-build.log

@@ -10,12 +10,12 @@ $ tsup --dts && cp src/panel.css dist/panel.css
 ESM Build start
 CJS dist/index.js     22.94 KB
 CJS dist/index.js.map 49.28 KB
-CJS ⚡️ Build success in 87ms
+CJS ⚡️ Build success in 41ms
 ESM dist/esm/index.js     18.61 KB
 ESM dist/esm/index.js.map 49.09 KB
-ESM ⚡️ Build success in 87ms
+ESM ⚡️ Build success in 41ms
 DTS Build start
-DTS ⚡️ Build success in 4014ms
+DTS ⚡️ Build success in 2758ms
 DTS dist/index.d.ts  9.41 KB
 DTS dist/index.d.mts 9.41 KB
-Done in 5.61s.
+Done in 3.86s.

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @sproutsocial/seeds-react-panel
 
+## 1.2.2
+
+### Patch Changes
+
+- Updated dependencies [9d7c36d]
+  - @sproutsocial/seeds-react-hooks@3.4.0
+  - @sproutsocial/seeds-react-drawer@2.2.23
+
 ## 1.2.1
 
 ### Patch Changes

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/PanelHybrid.tsx","../../src/PanelContext.tsx","../../src/PanelHeader.tsx","../../src/PanelCloseButton.tsx","../../src/PanelShared.tsx","../../src/PanelContent.tsx","../../src/styles.ts","../../src/PanelMobile.tsx","../../src/PanelMobileActionsHeader.tsx","../../src/PanelStyled.tsx","../../src/PanelTailwind.tsx","../../src/PanelFooter.tsx","../../src/Panel.tsx","../../src/PanelProvider.tsx","../../src/PanelTypes.ts","../../src/index.ts"],"sourcesContent":["import { needsStyledComponents } from \"@sproutsocial/seeds-react-system-props\";\nimport { PanelStyled } from \"./PanelStyled\";\nimport { PanelTailwind } from \"./PanelTailwind\";\nimport type { TypePanelProps } from \"./PanelTypes\";\n\n/**\n * Hybrid Panel router. Chooses the styled-components path when the consumer\n * passes a styled-system (`COMMON`) prop or a `styled()` extension, otherwise\n * the preferred Tailwind path.\n *\n * The routing decision runs on the *leftover* props after Panel's own domain\n * props are destructured — critically, `width` and `zIndex` are Panel domain\n * props whose names also appear in `STYLED_SYSTEM_PROPS`. Gating on the full\n * prop object would push almost every real Panel usage (anything setting\n * `width`) onto the styled path and defeat the migration, so we exclude the\n * domain props first and gate only on `rest`.\n */\nexport const PanelHybrid = (props: TypePanelProps) => {\n  const {\n    children,\n    closeButtonLabel,\n    header,\n    headerless,\n    footer,\n    title,\n    titleId,\n    direction,\n    width,\n    gap,\n    mobileBreakpoint,\n    zIndex,\n    id,\n    snapPoints,\n    defaultSnapPoint,\n    snapPoint,\n    onSnapPointChange,\n    snapToSequentialPoints,\n    actions,\n    actionsInHeader,\n    \"aria-labelledby\": ariaLabelledBy,\n    \"aria-label\": ariaLabel,\n    ...rest\n  } = props;\n\n  if (needsStyledComponents(rest)) {\n    return <PanelStyled {...props} />;\n  }\n\n  return <PanelTailwind {...props} />;\n};\n\nPanelHybrid.displayName = \"Panel\";\n","import * as React from \"react\";\nimport type { TypePanelContext } from \"./PanelTypes\";\n\nexport const PanelContext = React.createContext<TypePanelContext | null>(null);\n\nexport const usePanelContext = (): TypePanelContext => {\n  const ctx = React.useContext(PanelContext);\n  if (!ctx) {\n    throw new Error(\n      \"usePanelContext must be used within a <PanelProvider>. Wrap the consuming tree in <PanelProvider> to provide isPanelOpen / togglePanel.\"\n    );\n  }\n  return ctx;\n};\n","import Box from \"@sproutsocial/seeds-react-box\";\nimport Text from \"@sproutsocial/seeds-react-text\";\nimport { needsStyledComponents } from \"@sproutsocial/seeds-react-system-props\";\nimport { usePanelContext } from \"./PanelContext\";\nimport { PanelCloseButton } from \"./PanelCloseButton\";\nimport { cn } from \"./PanelShared\";\nimport type { TypePanelHeaderProps } from \"./PanelTypes\";\n\n/**\n * Styled-components header — the backward-compatible fallback. The hybrid\n * router sends consumers here whenever they pass styled-system props (e.g.\n * `<Panel.Header alignItems=\"center\">`) or a `styled()` extension, so the full\n * `Box` prop surface keeps working.\n */\nconst PanelHeaderStyled = ({\n  title = \"\",\n  id = undefined,\n  children,\n  render,\n  ...rest\n}: TypePanelHeaderProps) => (\n  <Box\n    display=\"flex\"\n    flex=\"0 0 auto\"\n    justifyContent=\"space-between\"\n    alignItems=\"center\"\n    p={400}\n    borderBottom=\"1px solid\"\n    borderColor=\"container.border.base\"\n    {...rest}\n  >\n    {children || (\n      <>\n        <Text.Headline id={id}>{title}</Text.Headline>\n        <PanelCloseButton />\n      </>\n    )}\n  </Box>\n);\n\n/**\n * Tailwind/CSS-class header — the preferred path. Renders a plain `<div>` with\n * the `seeds-panel-header` class from panel.css instead of a styled `Box`. The\n * `render` prop is handled by the hybrid before reaching here.\n */\nconst PanelHeaderTailwind = ({\n  title = \"\",\n  id = undefined,\n  children,\n  render,\n  ...rest\n}: TypePanelHeaderProps) => {\n  const { className, ...domRest } = rest as {\n    className?: string;\n  } & Record<string, unknown>;\n\n  return (\n    <div className={cn(\"seeds-panel-header\", className)} {...domRest}>\n      {children || (\n        <>\n          <Text.Headline id={id}>{title}</Text.Headline>\n          <PanelCloseButton />\n        </>\n      )}\n    </div>\n  );\n};\n\n/**\n * Hybrid header router. The `render` escape hatch short-circuits before any\n * routing (matching the original always-styled behaviour); otherwise it routes\n * on the leftover props after the header's own props are removed.\n */\nexport const PanelHeader = (props: TypePanelHeaderProps) => {\n  const panelContext = usePanelContext();\n\n  if (props.render) {\n    return props.render(panelContext);\n  }\n\n  const { title, id, children, render, ...rest } = props;\n\n  if (needsStyledComponents(rest)) {\n    return <PanelHeaderStyled {...props} />;\n  }\n\n  return <PanelHeaderTailwind {...props} />;\n};\n\nPanelHeader.displayName = \"Panel.Header\";\n","import * as React from \"react\";\nimport Button from \"@sproutsocial/seeds-react-button\";\nimport Icon from \"@sproutsocial/seeds-react-icon\";\nimport { usePanelContext } from \"./PanelContext\";\nimport type { TypePanelCloseButtonProps } from \"./PanelTypes\";\n\nexport const PanelCloseButton = (props: TypePanelCloseButtonProps) => {\n  const panelContext = usePanelContext();\n\n  if (props.render) {\n    return props.render(panelContext) ?? null;\n  }\n\n  return (\n    <Button\n      appearance=\"pill\"\n      aria-label={panelContext.closeButtonLabel}\n      onClick={panelContext.closePanel}\n      {...props}\n    >\n      {props.children || (\n        <Icon aria-hidden name=\"collapse-panel-right-outline\" />\n      )}\n    </Button>\n  );\n};\n\nPanelCloseButton.displayName = \"Panel.CloseButton\";\n","import * as React from \"react\";\nimport { useIsMobile } from \"@sproutsocial/seeds-react-hooks\";\nimport { usePanelContext } from \"./PanelContext\";\nimport type {\n  PanelDirection,\n  TypePanelProps,\n  TypePanelContext,\n} from \"./PanelTypes\";\n\n/**\n * Class-name merge helper. Copied intentionally rather than imported from\n * `@sproutsocial/seeds-react-utilities` — `cn` is not exported there, so each\n * migrated Tailwind component carries its own copy (mirrors AvatarTailwind /\n * DrawerShared). Because Panel is a multi-part component, the helper lives once\n * here and is imported by every Tailwind sub-component instead of being\n * duplicated in each file.\n */\nexport function cn(\n  ...inputs: (string | undefined | null | false | Record<string, boolean>)[]\n): string {\n  const classes: string[] = [];\n\n  for (const input of inputs) {\n    if (!input) continue;\n\n    if (typeof input === \"string\") {\n      classes.push(input);\n    } else if (typeof input === \"object\") {\n      for (const [key, value] of Object.entries(input)) {\n        if (value) {\n          classes.push(key);\n        }\n      }\n    }\n  }\n\n  return classes.join(\" \");\n}\n\n/**\n * Dynamic geometry for the outer `<aside>` on the Tailwind path. These values\n * depend on runtime props (open state, width, gap, direction) and are asserted\n * as computed styles by the jsdom tests, so they must be inline `style` rather\n * than CSS-variable-driven classes (panel.css is not loaded under jsdom). The\n * static chrome (background, radius, transition, overflow, flex-grow/shrink)\n * lives in panel.css.\n *\n * The gap sits on the margin edge facing the adjacent content: left when the\n * panel anchors right, right when it anchors left, top when it anchors to the\n * bottom (mirrors `gapSide` in styles.ts).\n */\nexport const getPanelContainerStyle = (\n  direction: PanelDirection,\n  width: number,\n  gap: number,\n  isPanelOpen: boolean\n): React.CSSProperties => {\n  const gapValue = isPanelOpen && gap ? `${gap}px` : \"0px\";\n  const style: React.CSSProperties = {\n    flexBasis: isPanelOpen ? `${width}px` : \"0px\",\n  };\n\n  if (direction === \"bottom\") {\n    style.width = \"100%\";\n  } else {\n    style.alignSelf = \"stretch\";\n  }\n\n  if (direction === \"right\") {\n    style.marginLeft = gapValue;\n  } else if (direction === \"left\") {\n    style.marginRight = gapValue;\n  } else {\n    style.marginTop = gapValue;\n  }\n\n  return style;\n};\n\n/**\n * Dynamic geometry for the inner layout `<div>` on the Tailwind path. The\n * direction-dependent min-width/min-height come from the `width` prop.\n */\nexport const getPanelInnerStyle = (\n  direction: PanelDirection,\n  width: number\n): React.CSSProperties =>\n  direction === \"bottom\"\n    ? { minHeight: `${width}px`, width: \"100%\" }\n    : { minWidth: `${width}px`, height: \"100%\" };\n\n/**\n * Shared render logic for both the styled and the Tailwind shells: reads the\n * PanelProvider context, enriches it (closeButtonLabel/headerless), freezes the\n * last-rendered children during the collapse, resolves the mobile breakpoint,\n * and computes the auto-wired accessible name. Centralising it here guarantees\n * the two shells stay behaviourally identical — only the desktop container\n * markup differs between them.\n */\nexport const usePanelShell = (props: TypePanelProps) => {\n  const {\n    children,\n    closeButtonLabel,\n    header,\n    headerless = false,\n    footer,\n    title,\n    titleId,\n    direction = \"right\",\n    width = 384,\n    gap = 4,\n    mobileBreakpoint,\n    zIndex,\n    id,\n    snapPoints,\n    defaultSnapPoint,\n    snapPoint,\n    onSnapPointChange,\n    snapToSequentialPoints,\n    actions,\n    actionsInHeader,\n    \"aria-labelledby\": ariaLabelledByProp,\n    \"aria-label\": ariaLabel,\n    ...rest\n  } = props;\n\n  const panelContext = usePanelContext();\n  const { isPanelOpen, closePanel } = panelContext;\n  const isMobile = useIsMobile(mobileBreakpoint);\n\n  // Expose closeButtonLabel through context so PanelCloseButton can read it\n  // without prop drilling — same pattern as DrawerContext.\n  const enrichedValue = React.useMemo<TypePanelContext>(\n    () => ({ ...panelContext, closeButtonLabel, headerless }),\n    [panelContext, closeButtonLabel, headerless]\n  );\n\n  // Freeze the last-rendered children during the collapse so consumers that\n  // conditionally render content don't produce an empty panel shell while the\n  // flex-basis animation runs.\n  const prevChildrenRef = React.useRef<React.ReactNode>(null);\n  if (isPanelOpen) {\n    prevChildrenRef.current = children;\n  }\n  const renderedChildren = isPanelOpen ? children : prevChildrenRef.current;\n\n  // When the consumer relies on the default header, its title element renders\n  // with `id={titleId}`. Auto-wire `aria-labelledby` so the dialog/aside has an\n  // accessible name without forcing every caller to repeat the id.\n  const effectiveAriaLabelledBy =\n    ariaLabelledByProp ?? (!headerless && header == null ? titleId : undefined);\n\n  return {\n    rest,\n    children,\n    closeButtonLabel,\n    header,\n    headerless,\n    footer,\n    title,\n    titleId,\n    direction,\n    width,\n    gap,\n    zIndex,\n    id,\n    snapPoints,\n    defaultSnapPoint,\n    snapPoint,\n    onSnapPointChange,\n    snapToSequentialPoints,\n    actions,\n    actionsInHeader,\n    ariaLabel,\n    isPanelOpen,\n    closePanel,\n    isMobile,\n    enrichedValue,\n    renderedChildren,\n    effectiveAriaLabelledBy,\n  };\n};\n\n/**\n * The shared shell values consumed by both the styled and the Tailwind desktop\n * shells and by the shared mobile render. Inferred from `usePanelShell` so the\n * `rest` pass-through keeps its precise type (mirrors `TypeDrawerShell`).\n */\nexport type TypePanelShell = ReturnType<typeof usePanelShell>;\n","import * as React from \"react\";\nimport { needsStyledComponents } from \"@sproutsocial/seeds-react-system-props\";\nimport { Content } from \"./styles\";\nimport { usePanelContext } from \"./PanelContext\";\nimport { cn } from \"./PanelShared\";\nimport type { TypePanelContentProps } from \"./PanelTypes\";\n\n/**\n * Styled-components content — the backward-compatible fallback. Routed to when\n * the consumer passes styled-system props (e.g. `<Panel.Content color=\"...\">`).\n */\nconst PanelContentStyled = ({ children, ...rest }: TypePanelContentProps) => {\n  // In headerless mode the content renders flush as a flex column and defers\n  // overflow scrolling to its children, so the panel can host content that\n  // owns its own chrome and fills the panel height (e.g. via flex: 1 1 auto).\n  const { headerless } = usePanelContext();\n\n  return (\n    <Content\n      flex=\"1 1 auto\"\n      minHeight=\"0\"\n      p={headerless ? 0 : 450}\n      $scroll={!headerless}\n      color=\"text.body\"\n      data-panel-content=\"\"\n      {...rest}\n    >\n      {children}\n    </Content>\n  );\n};\n\n/**\n * Tailwind/CSS-class content — the preferred path. Renders a plain\n * `<div data-panel-content>` with the `seeds-panel-content` class from\n * panel.css. The scroll behaviour depends on `headerless` (read from context)\n * and is asserted by the jsdom tests, so it is applied inline rather than via\n * the CSS class (panel.css is not loaded under jsdom).\n */\nconst PanelContentTailwind = ({ children, ...rest }: TypePanelContentProps) => {\n  const { headerless } = usePanelContext();\n  const scroll = !headerless;\n\n  const { className, style, ...domRest } = rest as {\n    className?: string;\n    style?: React.CSSProperties;\n  } & Record<string, unknown>;\n\n  const contentStyle: React.CSSProperties = {\n    overflowY: scroll ? \"auto\" : \"hidden\",\n  };\n  // When content owns its own scrolling (headerless), lay out as a flex column\n  // so a child can flex to the panel's full height.\n  if (!scroll) {\n    contentStyle.display = \"flex\";\n    contentStyle.flexDirection = \"column\";\n  }\n  Object.assign(contentStyle, style);\n\n  return (\n    <div\n      className={cn(\n        \"seeds-panel-content\",\n        { \"seeds-panel-content--headerless\": !!headerless },\n        className\n      )}\n      style={contentStyle}\n      data-panel-content=\"\"\n      {...domRest}\n    >\n      {children}\n    </div>\n  );\n};\n\n/**\n * Hybrid content router. Routes on the leftover props after the content's own\n * props are removed.\n */\nexport const PanelContent = (props: TypePanelContentProps) => {\n  const { children, ...rest } = props;\n\n  if (needsStyledComponents(rest)) {\n    return <PanelContentStyled {...props} />;\n  }\n\n  return <PanelContentTailwind {...props} />;\n};\n\nPanelContent.displayName = \"Panel.Content\";\n","import styled, { css } from \"styled-components\";\nimport { COMMON } from \"@sproutsocial/seeds-react-system-props\";\nimport type { TypeSystemCommonProps } from \"@sproutsocial/seeds-react-system-props\";\nimport { MOTION_DURATION_MEDIUM } from \"@sproutsocial/seeds-motion/unitless\";\nimport Box from \"@sproutsocial/seeds-react-box\";\nimport type { PanelDirection } from \"./PanelTypes\";\n\ninterface PanelContainerProps extends TypeSystemCommonProps {\n  $isOpen: boolean;\n  $direction: PanelDirection;\n  $width: number;\n  $gap: number;\n}\n\nconst gapSide = (direction: PanelDirection): \"left\" | \"right\" | \"top\" => {\n  if (direction === \"right\") return \"left\";\n  if (direction === \"left\") return \"right\";\n  return \"top\";\n};\n\nexport const PanelContainer = styled.aside<PanelContainerProps>`\n  background: ${(props) => props.theme.colors.container.background.base};\n  flex-grow: 0;\n  flex-shrink: 0;\n  overflow: hidden;\n  transition: flex-basis ${MOTION_DURATION_MEDIUM}s ease-in-out,\n    margin ${MOTION_DURATION_MEDIUM}s ease-in-out;\n  flex-basis: ${(props) => (props.$isOpen ? `${props.$width}px` : \"0px\")};\n  margin-${(props) => gapSide(props.$direction)}: ${(props) =>\n  props.$isOpen && props.$gap ? `${props.$gap}px` : \"0px\"};\n  border-radius: ${({ theme }) => theme.radii[800]};\n\n  ${(props) =>\n    props.$direction === \"bottom\"\n      ? css`\n          width: 100%;\n        `\n      : css`\n          align-self: stretch;\n        `}\n\n  ${COMMON}\n`;\n\nexport const PanelInner = styled.div<{\n  $direction: PanelDirection;\n  $width: number;\n}>`\n  ${(props) =>\n    props.$direction === \"bottom\"\n      ? css`\n          min-height: ${props.$width}px;\n          width: 100%;\n        `\n      : css`\n          min-width: ${props.$width}px;\n          height: 100%;\n        `}\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n`;\n\nexport const Content = styled(Box)<{ $scroll?: boolean }>`\n  overflow-y: ${({ $scroll = true }) => ($scroll ? \"auto\" : \"hidden\")};\n  /*\n   * When content owns its own scrolling ($scroll false, i.e. headerless), lay\n   * out as a flex column so a child can flex to the panel's full height —\n   * percentage heights can't resolve against a block container here.\n   */\n  ${({ $scroll = true }) =>\n    !$scroll &&\n    css`\n      display: flex;\n      flex-direction: column;\n    `}\n`;\n\nexport const Footer = styled(Box)`\n  flex: 0 0 auto;\n  overflow: hidden;\n  /*\n   * On mobile the Panel renders inside the Drawer's bottom sheet, whose popup\n   * deliberately bleeds 3rem (--bleed) below the viewport for elastic\n   * overscroll (see seeds-react-drawer/src/styles.ts). A footer pinned to the\n   * end of that popup would land inside the bleed and clip below the fold, so\n   * we lift it by the inherited --bleed; the gap left behind shows the popup's\n   * own background, so there is no visible seam. On desktop --bleed is unset,\n   * so the 0px fallback leaves the footer untouched.\n   */\n  margin-bottom: var(--bleed, 0px);\n`;\n","import * as React from \"react\";\nimport Drawer from \"@sproutsocial/seeds-react-drawer\";\nimport { PanelContext } from \"./PanelContext\";\nimport { PanelContent } from \"./PanelContent\";\nimport { PanelMobileActionsHeader } from \"./PanelMobileActionsHeader\";\nimport type { TypePanelShell } from \"./PanelShared\";\n\n/**\n * Mobile bottom-sheet rendering, shared verbatim by both the styled and the\n * Tailwind shells. The mobile path always renders through `Drawer`, which is\n * itself already migrated to the hybrid pattern, so nothing here depends on the\n * root routing gate — the two shells render an identical mobile tree.\n */\nexport const PanelMobile = ({ shell }: { shell: TypePanelShell }) => {\n  const {\n    rest,\n    children,\n    closeButtonLabel,\n    header,\n    headerless,\n    footer,\n    title,\n    titleId,\n    zIndex,\n    snapPoints,\n    defaultSnapPoint,\n    snapPoint,\n    onSnapPointChange,\n    snapToSequentialPoints,\n    actions,\n    actionsInHeader,\n    ariaLabel,\n    isPanelOpen,\n    closePanel,\n    enrichedValue,\n    effectiveAriaLabelledBy,\n  } = shell;\n\n  // With `actionsInHeader`, Drawer suppresses the floating rail and expects the\n  // consumer to render the actions inside a custom header. Auto-compose one\n  // (title + action pills + close pill) when the consumer hasn't supplied their\n  // own header; otherwise we'd drop `actions` on the floor.\n  const shouldRenderActionsHeader =\n    !headerless &&\n    header == null &&\n    actionsInHeader === true &&\n    !!actions &&\n    actions.length > 0;\n\n  // Headerless suppresses the built-in header entirely; the children own all\n  // chrome in that mode.\n  let defaultMobileHeader: React.ReactNode = null;\n  if (!headerless) {\n    defaultMobileHeader = shouldRenderActionsHeader ? (\n      <PanelMobileActionsHeader\n        title={title}\n        titleId={titleId}\n        actions={actions!}\n      />\n    ) : (\n      <Drawer.Header title={title} id={titleId} />\n    );\n  }\n\n  return (\n    <PanelContext.Provider value={enrichedValue}>\n      <Drawer\n        {...rest}\n        open={isPanelOpen}\n        onClose={closePanel}\n        direction=\"bottom\"\n        closeButtonLabel={closeButtonLabel}\n        zIndex={zIndex}\n        snapPoints={snapPoints}\n        defaultSnapPoint={defaultSnapPoint}\n        snapPoint={snapPoint}\n        onSnapPointChange={onSnapPointChange}\n        snapToSequentialPoints={snapToSequentialPoints}\n        actions={actions}\n        actionsInHeader={actionsInHeader}\n        aria-labelledby={effectiveAriaLabelledBy}\n        aria-label={ariaLabel}\n      >\n        {header ?? defaultMobileHeader}\n        <PanelContent>{children}</PanelContent>\n        {footer}\n      </Drawer>\n    </PanelContext.Provider>\n  );\n};\n","import * as React from \"react\";\nimport Button from \"@sproutsocial/seeds-react-button\";\nimport Drawer from \"@sproutsocial/seeds-react-drawer\";\nimport Icon from \"@sproutsocial/seeds-react-icon\";\n// eslint-disable-next-line import/no-deprecated\nimport Text from \"@sproutsocial/seeds-react-text\";\nimport type { TypeDrawerActionProps } from \"@sproutsocial/seeds-react-drawer\";\n\ninterface TypePanelMobileActionsHeaderProps {\n  title?: string;\n  titleId?: string;\n  actions: TypeDrawerActionProps[];\n}\n\n/**\n * Mobile bottom-sheet header used by Panel when `actionsInHeader` is set and\n * no custom `header` is provided. Renders the title on the left and the\n * forwarded actions plus a close button as pills on the right — mirrors the\n * pattern in `seeds-react-peek-in/PeekIn.tsx`. The Drawer's floating rail is\n * suppressed in this combination (`actionsInHeader` opts out), so without this\n * header the actions would render nowhere.\n *\n * This header is composed internally by Panel (it receives no consumer\n * styled-system props), so its chrome is emitted directly as `seeds-panel-*`\n * classes from panel.css rather than through a styled `Box`.\n */\nexport const PanelMobileActionsHeader = ({\n  title,\n  titleId,\n  actions,\n}: TypePanelMobileActionsHeaderProps) => (\n  <Drawer.Header\n    render={(ctx) => (\n      <div className=\"seeds-panel-mobile-actions-header\">\n        <Text\n          as=\"h2\"\n          fontSize={400}\n          fontWeight=\"semibold\"\n          color=\"text.headline\"\n          id={titleId}\n        >\n          {title}\n        </Text>\n        <div className=\"seeds-panel-mobile-actions-buttons\">\n          {actions.map((action, i) => (\n            <Button\n              key={i}\n              appearance=\"pill\"\n              aria-label={action[\"aria-label\"]}\n              onClick={action.onClick}\n              disabled={action.disabled}\n            >\n              {action.iconName && <Icon aria-hidden name={action.iconName} />}\n            </Button>\n          ))}\n          <Button\n            appearance=\"pill\"\n            aria-label={ctx.closeButtonLabel}\n            onClick={ctx.onClose}\n          >\n            <Icon aria-hidden name=\"x-outline\" />\n          </Button>\n        </div>\n      </div>\n    )}\n  />\n);\n\nPanelMobileActionsHeader.displayName = \"PanelMobileActionsHeader\";\n","import { PanelContext } from \"./PanelContext\";\nimport { PanelHeader } from \"./PanelHeader\";\nimport { PanelContent } from \"./PanelContent\";\nimport { PanelMobile } from \"./PanelMobile\";\nimport { PanelContainer, PanelInner } from \"./styles\";\nimport { usePanelShell } from \"./PanelShared\";\nimport type { TypePanelProps } from \"./PanelTypes\";\n\n/**\n * Styled-components shell — the backward-compatible fallback. The hybrid router\n * sends consumers here whenever they pass a `COMMON`-mixin styled-system prop\n * (e.g. `mt`, `mb`, `mr`) or a `styled()` extension, so the full styled prop\n * surface on the outer container keeps working exactly as before.\n */\nexport const PanelStyled = (props: TypePanelProps) => {\n  const shell = usePanelShell(props);\n  const {\n    rest,\n    header,\n    headerless,\n    footer,\n    title,\n    titleId,\n    direction,\n    width,\n    gap,\n    id,\n    ariaLabel,\n    isPanelOpen,\n    isMobile,\n    enrichedValue,\n    renderedChildren,\n    effectiveAriaLabelledBy,\n  } = shell;\n\n  if (isMobile) {\n    return <PanelMobile shell={shell} />;\n  }\n\n  return (\n    <PanelContext.Provider value={enrichedValue}>\n      <PanelContainer\n        {...rest}\n        $isOpen={isPanelOpen}\n        $direction={direction}\n        $width={width}\n        $gap={gap}\n        data-qa-panel={id}\n        data-qa-panel-isopen={isPanelOpen}\n        aria-labelledby={effectiveAriaLabelledBy}\n        aria-label={ariaLabel}\n      >\n        <PanelInner $direction={direction} $width={width}>\n          {header ??\n            (headerless ? null : <PanelHeader title={title} id={titleId} />)}\n          <PanelContent>{renderedChildren}</PanelContent>\n          {footer}\n        </PanelInner>\n      </PanelContainer>\n    </PanelContext.Provider>\n  );\n};\n","import * as React from \"react\";\nimport { PanelContext } from \"./PanelContext\";\nimport { PanelHeader } from \"./PanelHeader\";\nimport { PanelContent } from \"./PanelContent\";\nimport { PanelMobile } from \"./PanelMobile\";\nimport {\n  cn,\n  usePanelShell,\n  getPanelContainerStyle,\n  getPanelInnerStyle,\n} from \"./PanelShared\";\nimport type { TypePanelProps } from \"./PanelTypes\";\n\n/**\n * Tailwind/CSS-class shell — the preferred path, routed to by the hybrid when\n * the consumer passes no styled-system props or `styled()` extension. Renders a\n * plain `<aside>` (implicit `complementary` role) with the `seeds-panel` classes\n * from panel.css instead of a styled container. Runtime geometry (flex-basis,\n * gap margin, direction shape, inner min-width/min-height) is applied inline\n * because the jsdom tests assert those as computed styles and panel.css is not\n * loaded there. The mobile path renders identically to the styled shell via\n * the shared `PanelMobile`.\n */\nexport const PanelTailwind = (props: TypePanelProps) => {\n  const shell = usePanelShell(props);\n  const {\n    rest,\n    header,\n    headerless,\n    footer,\n    title,\n    titleId,\n    direction,\n    width,\n    gap,\n    id,\n    ariaLabel,\n    isPanelOpen,\n    isMobile,\n    enrichedValue,\n    renderedChildren,\n    effectiveAriaLabelledBy,\n  } = shell;\n\n  if (isMobile) {\n    return <PanelMobile shell={shell} />;\n  }\n\n  // `rest` carries only non-styled pass-through props on this path (the gate\n  // routes styled-system props to PanelStyled). Peel off className/style so we\n  // can merge them onto the component's own class and inline geometry rather\n  // than letting a spread clobber them.\n  const { className, style, ...domRest } = rest as {\n    className?: string;\n    style?: React.CSSProperties;\n  } & Record<string, unknown>;\n\n  const containerStyle = getPanelContainerStyle(\n    direction,\n    width,\n    gap,\n    isPanelOpen\n  );\n  const innerStyle = getPanelInnerStyle(direction, width);\n\n  return (\n    <PanelContext.Provider value={enrichedValue}>\n      <aside\n        {...domRest}\n        className={cn(\"seeds-panel\", className)}\n        style={{ ...containerStyle, ...style }}\n        data-qa-panel={id}\n        data-qa-panel-isopen={isPanelOpen}\n        aria-labelledby={effectiveAriaLabelledBy}\n        aria-label={ariaLabel}\n      >\n        <div className=\"seeds-panel-inner\" style={innerStyle}>\n          {header ??\n            (headerless ? null : <PanelHeader title={title} id={titleId} />)}\n          <PanelContent>{renderedChildren}</PanelContent>\n          {footer}\n        </div>\n      </aside>\n    </PanelContext.Provider>\n  );\n};\n","import * as React from \"react\";\nimport { needsStyledComponents } from \"@sproutsocial/seeds-react-system-props\";\nimport { Footer } from \"./styles\";\nimport { cn } from \"./PanelShared\";\nimport type { TypePanelFooterProps } from \"./PanelTypes\";\n\n/**\n * Styled-components footer — the backward-compatible fallback. Routed to when\n * the consumer passes styled-system props (e.g. `<Panel.Footer bg=\"...\">`).\n */\nconst PanelFooterStyled = ({ children, ...rest }: TypePanelFooterProps) => (\n  <Footer p={450} data-panel-footer=\"\" {...rest}>\n    {children}\n  </Footer>\n);\n\n/**\n * Tailwind/CSS-class footer — the preferred path. Renders a plain\n * `<div data-panel-footer>` with the `seeds-panel-footer` class from panel.css.\n *\n * `margin-bottom: var(--bleed, 0px)` lifts the footer above the Drawer's mobile\n * bottom-sheet bleed (see styles.ts). It is asserted by the jsdom tests and the\n * `--bleed` var is only set at runtime by the mobile Drawer, so it is applied\n * inline (falling back to 0px on desktop).\n */\nconst PanelFooterTailwind = ({ children, ...rest }: TypePanelFooterProps) => {\n  const { className, style, ...domRest } = rest as {\n    className?: string;\n    style?: React.CSSProperties;\n  } & Record<string, unknown>;\n\n  return (\n    <div\n      className={cn(\"seeds-panel-footer\", className)}\n      style={{ marginBottom: \"var(--bleed, 0px)\", ...style }}\n      data-panel-footer=\"\"\n      {...domRest}\n    >\n      {children}\n    </div>\n  );\n};\n\n/**\n * Hybrid footer router. Routes on the leftover props after the footer's own\n * props are removed.\n */\nexport const PanelFooter = (props: TypePanelFooterProps) => {\n  const { children, ...rest } = props;\n\n  if (needsStyledComponents(rest)) {\n    return <PanelFooterStyled {...props} />;\n  }\n\n  return <PanelFooterTailwind {...props} />;\n};\n\nPanelFooter.displayName = \"Panel.Footer\";\n","import { PanelHybrid } from \"./PanelHybrid\";\nimport { PanelHeader } from \"./PanelHeader\";\nimport { PanelContent } from \"./PanelContent\";\nimport { PanelCloseButton } from \"./PanelCloseButton\";\nimport { PanelFooter } from \"./PanelFooter\";\nimport type { TypePanelProps } from \"./PanelTypes\";\n\n/**\n * Panel compound component. Automatically routes between the Tailwind\n * implementation (preferred, no runtime CSS-in-JS) and the styled-components\n * implementation (for consumers using styled-system props or a `styled()`\n * extension). Public API, exports, and the `.Header/.Content/.CloseButton/\n * .Footer` static attachments are unchanged.\n */\nconst PanelComponent = (props: TypePanelProps) => <PanelHybrid {...props} />;\n\nPanelComponent.displayName = \"Panel\";\nPanelComponent.Header = PanelHeader;\nPanelComponent.Content = PanelContent;\nPanelComponent.CloseButton = PanelCloseButton;\nPanelComponent.Footer = PanelFooter;\n\nexport const Panel = PanelComponent;\nexport default PanelComponent;\n","import * as React from \"react\";\nimport { PanelContext } from \"./PanelContext\";\nimport type { TypePanelContext, TypePanelProviderProps } from \"./PanelTypes\";\n\nexport const PanelProvider = ({\n  children,\n  defaultOpen = false,\n  open: controlledOpen,\n  onOpenChange,\n}: TypePanelProviderProps) => {\n  const [internalOpen, setInternalOpen] = React.useState(defaultOpen);\n  const isControlled = controlledOpen !== undefined;\n  const isPanelOpen = isControlled ? controlledOpen : internalOpen;\n\n  const setOpen = React.useCallback(\n    (next: boolean) => {\n      if (!isControlled) setInternalOpen(next);\n      onOpenChange?.(next);\n    },\n    [isControlled, onOpenChange]\n  );\n\n  const openPanel = React.useCallback(() => setOpen(true), [setOpen]);\n  const closePanel = React.useCallback(() => setOpen(false), [setOpen]);\n  const togglePanel = React.useCallback(\n    () => setOpen(!isPanelOpen),\n    [setOpen, isPanelOpen]\n  );\n\n  const value = React.useMemo<TypePanelContext>(\n    () => ({ isPanelOpen, openPanel, closePanel, togglePanel }),\n    [isPanelOpen, openPanel, closePanel, togglePanel]\n  );\n\n  return (\n    <PanelContext.Provider value={value}>{children}</PanelContext.Provider>\n  );\n};\n","import * as React from \"react\";\nimport type {\n  TypeSystemCommonProps,\n  TypeStyledComponentsCommonProps,\n} from \"@sproutsocial/seeds-react-system-props\";\nimport type { TypeBoxProps } from \"@sproutsocial/seeds-react-box\";\nimport type { TypeButtonProps } from \"@sproutsocial/seeds-react-button\";\nimport type {\n  TypeDrawerSnapPoint,\n  TypeDrawerActionProps,\n} from \"@sproutsocial/seeds-react-drawer\";\n\nexport type { TypeDrawerActionProps as TypePanelActionProps };\n\nexport type PanelDirection = \"left\" | \"right\" | \"bottom\";\n\nexport interface TypePanelContext {\n  isPanelOpen: boolean;\n  togglePanel: () => void;\n  openPanel: () => void;\n  closePanel: () => void;\n  closeButtonLabel?: string;\n  /**\n   * Set by `Panel` when rendered headerless. `Panel.Content` reads this to\n   * render flush (no padding) and defer overflow scrolling to its children.\n   */\n  headerless?: boolean;\n}\n\nexport interface TypePanelProviderProps {\n  children: React.ReactNode;\n  /** Initial open state for uncontrolled usage. */\n  defaultOpen?: boolean;\n  /** Controlled open state. When provided, the provider becomes controlled. */\n  open?: boolean;\n  /** Called whenever the open state changes. Required for controlled usage. */\n  onOpenChange?: (open: boolean) => void;\n}\n\nexport interface TypePanelProps\n  extends TypeStyledComponentsCommonProps,\n    TypeSystemCommonProps,\n    Omit<React.ComponentPropsWithoutRef<\"div\">, \"color\"> {\n  children: React.ReactNode;\n\n  /** Label for the close button. Usually \"Close\". */\n  closeButtonLabel: string;\n\n  /**\n   * Custom header content. When provided, replaces the auto-rendered default\n   * header entirely — `title` and `titleId` are ignored.\n   */\n  header?: React.ReactNode;\n\n  /** Custom footer content. Not rendered when omitted. */\n  footer?: React.ReactNode;\n\n  /**\n   * Renders children flush, without the built-in header/close button or content\n   * padding, and lets the children own overflow scrolling. Use when the content\n   * provides its own chrome (e.g. an embedded agent UI). Provide `aria-label`\n   * (or `aria-labelledby`) for an accessible name, since no header title is\n   * rendered. `title`, `titleId`, and `closeButtonLabel` are ignored in this\n   * mode. Defaults to false.\n   */\n  headerless?: boolean;\n\n  /** Title shown in the auto-rendered default header. Ignored when `header` is provided. */\n  title?: string;\n\n  /**\n   * Sets the `id` on the title element of the auto-rendered header. When the\n   * default header is used, Panel automatically wires `aria-labelledby` to this\n   * id so the dialog/aside has an accessible name. Pass an explicit\n   * `aria-labelledby` to override (e.g. when pointing at a different element).\n   * Ignored when `header` is provided — supply your own `aria-labelledby` in\n   * that case.\n   */\n  titleId?: string;\n\n  /** Side the panel anchors to on desktop. Defaults to \"right\". */\n  direction?: PanelDirection;\n\n  /**\n   * Width (px) when direction is \"left\" or \"right\", or height (px) when\n   * direction is \"bottom\". Defaults to 384 to match the existing web-app-core\n   * Panel.\n   */\n  width?: number;\n\n  /**\n   * Visual gap (px) between the panel and the adjacent content. Applied as\n   * margin on the side facing the content (left when direction=\"right\",\n   * right when direction=\"left\", top when direction=\"bottom\"). Animates with\n   * the panel's open/close transition and collapses to 0 when closed so the\n   * gap does not remain visible alongside a zero-width panel. Defaults to 0.\n   */\n  gap?: number;\n\n  /**\n   * Forwarded to `useIsMobile`. Accepts a px number or any CSS media-query\n   * length. Below this width, the panel renders as an overlay bottom sheet\n   * (via seeds-react-drawer). Defaults to the theme's `breakpoints.sm`.\n   */\n  mobileBreakpoint?: number | string;\n\n  /** Applies only to the mobile bottom-sheet rendering. */\n  zIndex?: number;\n\n  /** Optional id used for data-qa-panel attributes. */\n  id?: string;\n\n  /**\n   * Snap points the panel can rest at when rendered as a mobile bottom sheet.\n   * Numbers 0–1 are viewport-height fractions; numbers > 1 are pixels; strings\n   * accept `px`/`rem` (e.g. `\"480px\"`, `\"30rem\"`). Order matters — the last\n   * entry is the \"expanded\" state. Ignored on the desktop side-panel rendering.\n   */\n  snapPoints?: TypeDrawerSnapPoint[];\n\n  /** Initial snap point for uncontrolled use. Mobile only. */\n  defaultSnapPoint?: TypeDrawerSnapPoint | null;\n\n  /** Controlled active snap point. Pair with `onSnapPointChange`. Mobile only. */\n  snapPoint?: TypeDrawerSnapPoint | null;\n\n  /** Fires when the active snap point changes. Mobile only. */\n  onSnapPointChange?: (snapPoint: TypeDrawerSnapPoint | null) => void;\n\n  /**\n   * When true, fast swipes can't skip past adjacent snap points. Mobile only.\n   */\n  snapToSequentialPoints?: boolean;\n\n  /**\n   * Action buttons shown in a floating rail above the panel on mobile (the\n   * bottom-sheet rendering). Ignored on desktop side-panel rendering — pass\n   * actions through `header`/`footer` slots there. The rail owns the close\n   * button so the default header omits its built-in close affordance.\n   */\n  actions?: TypeDrawerActionProps[];\n\n  /**\n   * Opt out of the floating mobile rail and render the `actions` inline in the\n   * header as pill buttons instead. Useful for nested bottom sheets and\n   * snap-point layouts where the floating rail would collide with surrounding\n   * UI. Defaults to `false`.\n   *\n   * When `header` is omitted, Panel auto-composes a mobile header that renders\n   * the title, the `actions` as pills, and a close-button pill. When `header`\n   * is provided, the consumer is responsible for rendering the actions inside\n   * their own header — `actions` is forwarded for context only.\n   */\n  actionsInHeader?: boolean;\n}\n\nexport interface TypePanelHeaderProps extends TypeBoxProps {\n  title?: string;\n  /**\n   * When children are provided, `<Panel.CloseButton />` is NOT rendered\n   * automatically. Include it yourself to preserve keyboard accessibility.\n   */\n  children?: React.ReactNode;\n  /** Render-prop override that receives the parent panel context. */\n  render?: React.FC<TypePanelContext>;\n}\n\nexport interface TypePanelContentProps extends TypeBoxProps {\n  children?: React.ReactNode;\n}\n\nexport interface TypePanelFooterProps extends TypeBoxProps {\n  children?: React.ReactNode;\n}\n\nexport interface TypePanelCloseButtonProps\n  extends Omit<TypeButtonProps, \"children\"> {\n  /** Render-prop override that receives the parent panel context. */\n  render?: React.FC<TypePanelContext>;\n  children?: React.ReactNode;\n}\n","import Panel from \"./Panel\";\n\nexport default Panel;\nexport { Panel };\nexport { PanelContext, usePanelContext } from \"./PanelContext\";\nexport { PanelProvider } from \"./PanelProvider\";\nexport { PanelHeader } from \"./PanelHeader\";\nexport { PanelContent } from \"./PanelContent\";\nexport { PanelCloseButton } from \"./PanelCloseButton\";\nexport { PanelFooter } from \"./PanelFooter\";\nexport * from \"./PanelTypes\";\n"],"mappings":"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","names":["needsStyledComponents","React","jsx","needsStyledComponents","Box","jsx","needsStyledComponents","Drawer","Button","Icon","Text","jsx","jsxs","jsx","jsxs","Drawer","jsx","jsxs","jsx","jsxs","jsx","needsStyledComponents","needsStyledComponents","jsx","needsStyledComponents","jsx","React","jsx"]}
+{"version":3,"sources":["../../src/PanelHybrid.tsx","../../src/PanelContext.tsx","../../src/PanelHeader.tsx","../../src/PanelCloseButton.tsx","../../src/PanelShared.tsx","../../src/PanelContent.tsx","../../src/styles.ts","../../src/PanelMobile.tsx","../../src/PanelMobileActionsHeader.tsx","../../src/PanelStyled.tsx","../../src/PanelTailwind.tsx","../../src/PanelFooter.tsx","../../src/Panel.tsx","../../src/PanelProvider.tsx","../../src/PanelTypes.ts","../../src/index.ts"],"sourcesContent":["import { needsStyledComponents } from \"@sproutsocial/seeds-react-system-props\";\nimport { PanelStyled } from \"./PanelStyled\";\nimport { PanelTailwind } from \"./PanelTailwind\";\nimport type { TypePanelProps } from \"./PanelTypes\";\n\n/**\n * Hybrid Panel router. Chooses the styled-components path when the consumer\n * passes a styled-system (`COMMON`) prop or a `styled()` extension, otherwise\n * the preferred Tailwind path.\n *\n * The routing decision runs on the *leftover* props after Panel's own domain\n * props are destructured — critically, `width` and `zIndex` are Panel domain\n * props whose names also appear in `STYLED_SYSTEM_PROPS`. Gating on the full\n * prop object would push almost every real Panel usage (anything setting\n * `width`) onto the styled path and defeat the migration, so we exclude the\n * domain props first and gate only on `rest`.\n */\nexport const PanelHybrid = (props: TypePanelProps) => {\n  const {\n    children,\n    closeButtonLabel,\n    header,\n    headerless,\n    footer,\n    title,\n    titleId,\n    direction,\n    width,\n    gap,\n    mobileBreakpoint,\n    zIndex,\n    id,\n    snapPoints,\n    defaultSnapPoint,\n    snapPoint,\n    onSnapPointChange,\n    snapToSequentialPoints,\n    actions,\n    actionsInHeader,\n    \"aria-labelledby\": ariaLabelledBy,\n    \"aria-label\": ariaLabel,\n    ...rest\n  } = props;\n\n  if (needsStyledComponents(rest)) {\n    return <PanelStyled {...props} />;\n  }\n\n  return <PanelTailwind {...props} />;\n};\n\nPanelHybrid.displayName = \"Panel\";\n","import * as React from \"react\";\nimport type { TypePanelContext } from \"./PanelTypes\";\n\nexport const PanelContext = React.createContext<TypePanelContext | null>(null);\n\nexport const usePanelContext = (): TypePanelContext => {\n  const ctx = React.useContext(PanelContext);\n  if (!ctx) {\n    throw new Error(\n      \"usePanelContext must be used within a <PanelProvider>. Wrap the consuming tree in <PanelProvider> to provide isPanelOpen / togglePanel.\"\n    );\n  }\n  return ctx;\n};\n","import Box from \"@sproutsocial/seeds-react-box\";\nimport Text from \"@sproutsocial/seeds-react-text\";\nimport { needsStyledComponents } from \"@sproutsocial/seeds-react-system-props\";\nimport { usePanelContext } from \"./PanelContext\";\nimport { PanelCloseButton } from \"./PanelCloseButton\";\nimport { cn } from \"./PanelShared\";\nimport type { TypePanelHeaderProps } from \"./PanelTypes\";\n\n/**\n * Styled-components header — the backward-compatible fallback. The hybrid\n * router sends consumers here whenever they pass styled-system props (e.g.\n * `<Panel.Header alignItems=\"center\">`) or a `styled()` extension, so the full\n * `Box` prop surface keeps working.\n */\nconst PanelHeaderStyled = ({\n  title = \"\",\n  id = undefined,\n  children,\n  render,\n  ...rest\n}: TypePanelHeaderProps) => (\n  <Box\n    display=\"flex\"\n    flex=\"0 0 auto\"\n    justifyContent=\"space-between\"\n    alignItems=\"center\"\n    p={400}\n    borderBottom=\"1px solid\"\n    borderColor=\"container.border.base\"\n    {...rest}\n  >\n    {children || (\n      <>\n        <Text.Headline id={id}>{title}</Text.Headline>\n        <PanelCloseButton />\n      </>\n    )}\n  </Box>\n);\n\n/**\n * Tailwind/CSS-class header — the preferred path. Renders a plain `<div>` with\n * the `seeds-panel-header` class from panel.css instead of a styled `Box`. The\n * `render` prop is handled by the hybrid before reaching here.\n */\nconst PanelHeaderTailwind = ({\n  title = \"\",\n  id = undefined,\n  children,\n  render,\n  ...rest\n}: TypePanelHeaderProps) => {\n  const { className, ...domRest } = rest as {\n    className?: string;\n  } & Record<string, unknown>;\n\n  return (\n    <div className={cn(\"seeds-panel-header\", className)} {...domRest}>\n      {children || (\n        <>\n          <Text.Headline id={id}>{title}</Text.Headline>\n          <PanelCloseButton />\n        </>\n      )}\n    </div>\n  );\n};\n\n/**\n * Hybrid header router. The `render` escape hatch short-circuits before any\n * routing (matching the original always-styled behaviour); otherwise it routes\n * on the leftover props after the header's own props are removed.\n */\nexport const PanelHeader = (props: TypePanelHeaderProps) => {\n  const panelContext = usePanelContext();\n\n  if (props.render) {\n    return props.render(panelContext);\n  }\n\n  const { title, id, children, render, ...rest } = props;\n\n  if (needsStyledComponents(rest)) {\n    return <PanelHeaderStyled {...props} />;\n  }\n\n  return <PanelHeaderTailwind {...props} />;\n};\n\nPanelHeader.displayName = \"Panel.Header\";\n","import * as React from \"react\";\nimport Button from \"@sproutsocial/seeds-react-button\";\nimport Icon from \"@sproutsocial/seeds-react-icon\";\nimport { usePanelContext } from \"./PanelContext\";\nimport type { TypePanelCloseButtonProps } from \"./PanelTypes\";\n\nexport const PanelCloseButton = (props: TypePanelCloseButtonProps) => {\n  const panelContext = usePanelContext();\n\n  if (props.render) {\n    return props.render(panelContext) ?? null;\n  }\n\n  return (\n    <Button\n      appearance=\"pill\"\n      aria-label={panelContext.closeButtonLabel}\n      onClick={panelContext.closePanel}\n      {...props}\n    >\n      {props.children || (\n        <Icon aria-hidden name=\"collapse-panel-right-outline\" />\n      )}\n    </Button>\n  );\n};\n\nPanelCloseButton.displayName = \"Panel.CloseButton\";\n","import * as React from \"react\";\nimport { useIsMobile } from \"@sproutsocial/seeds-react-hooks\";\nimport { usePanelContext } from \"./PanelContext\";\nimport type {\n  PanelDirection,\n  TypePanelProps,\n  TypePanelContext,\n} from \"./PanelTypes\";\n\n/**\n * Class-name merge helper. Copied intentionally rather than imported from\n * `@sproutsocial/seeds-react-utilities` — `cn` is not exported there, so each\n * migrated Tailwind component carries its own copy (mirrors AvatarTailwind /\n * DrawerShared). Because Panel is a multi-part component, the helper lives once\n * here and is imported by every Tailwind sub-component instead of being\n * duplicated in each file.\n */\nexport function cn(\n  ...inputs: (string | undefined | null | false | Record<string, boolean>)[]\n): string {\n  const classes: string[] = [];\n\n  for (const input of inputs) {\n    if (!input) continue;\n\n    if (typeof input === \"string\") {\n      classes.push(input);\n    } else if (typeof input === \"object\") {\n      for (const [key, value] of Object.entries(input)) {\n        if (value) {\n          classes.push(key);\n        }\n      }\n    }\n  }\n\n  return classes.join(\" \");\n}\n\n/**\n * Dynamic geometry for the outer `<aside>` on the Tailwind path. These values\n * depend on runtime props (open state, width, gap, direction) and are asserted\n * as computed styles by the jsdom tests, so they must be inline `style` rather\n * than CSS-variable-driven classes (panel.css is not loaded under jsdom). The\n * static chrome (background, radius, transition, overflow, flex-grow/shrink)\n * lives in panel.css.\n *\n * The gap sits on the margin edge facing the adjacent content: left when the\n * panel anchors right, right when it anchors left, top when it anchors to the\n * bottom (mirrors `gapSide` in styles.ts).\n */\nexport const getPanelContainerStyle = (\n  direction: PanelDirection,\n  width: number,\n  gap: number,\n  isPanelOpen: boolean\n): React.CSSProperties => {\n  const gapValue = isPanelOpen && gap ? `${gap}px` : \"0px\";\n  const style: React.CSSProperties = {\n    flexBasis: isPanelOpen ? `${width}px` : \"0px\",\n  };\n\n  if (direction === \"bottom\") {\n    style.width = \"100%\";\n  } else {\n    style.alignSelf = \"stretch\";\n  }\n\n  if (direction === \"right\") {\n    style.marginLeft = gapValue;\n  } else if (direction === \"left\") {\n    style.marginRight = gapValue;\n  } else {\n    style.marginTop = gapValue;\n  }\n\n  return style;\n};\n\n/**\n * Dynamic geometry for the inner layout `<div>` on the Tailwind path. The\n * direction-dependent min-width/min-height come from the `width` prop.\n */\nexport const getPanelInnerStyle = (\n  direction: PanelDirection,\n  width: number\n): React.CSSProperties =>\n  direction === \"bottom\"\n    ? { minHeight: `${width}px`, width: \"100%\" }\n    : { minWidth: `${width}px`, height: \"100%\" };\n\n/**\n * Shared render logic for both the styled and the Tailwind shells: reads the\n * PanelProvider context, enriches it (closeButtonLabel/headerless), freezes the\n * last-rendered children during the collapse, resolves the mobile breakpoint,\n * and computes the auto-wired accessible name. Centralising it here guarantees\n * the two shells stay behaviourally identical — only the desktop container\n * markup differs between them.\n */\nexport const usePanelShell = (props: TypePanelProps) => {\n  const {\n    children,\n    closeButtonLabel,\n    header,\n    headerless = false,\n    footer,\n    title,\n    titleId,\n    direction = \"right\",\n    width = 384,\n    gap = 4,\n    mobileBreakpoint,\n    zIndex,\n    id,\n    snapPoints,\n    defaultSnapPoint,\n    snapPoint,\n    onSnapPointChange,\n    snapToSequentialPoints,\n    actions,\n    actionsInHeader,\n    \"aria-labelledby\": ariaLabelledByProp,\n    \"aria-label\": ariaLabel,\n    ...rest\n  } = props;\n\n  const panelContext = usePanelContext();\n  const { isPanelOpen, closePanel } = panelContext;\n  const isMobile = useIsMobile(mobileBreakpoint);\n\n  // Expose closeButtonLabel through context so PanelCloseButton can read it\n  // without prop drilling — same pattern as DrawerContext.\n  const enrichedValue = React.useMemo<TypePanelContext>(\n    () => ({ ...panelContext, closeButtonLabel, headerless }),\n    [panelContext, closeButtonLabel, headerless]\n  );\n\n  // Freeze the last-rendered children during the collapse so consumers that\n  // conditionally render content don't produce an empty panel shell while the\n  // flex-basis animation runs.\n  const prevChildrenRef = React.useRef<React.ReactNode>(null);\n  if (isPanelOpen) {\n    prevChildrenRef.current = children;\n  }\n  const renderedChildren = isPanelOpen ? children : prevChildrenRef.current;\n\n  // When the consumer relies on the default header, its title element renders\n  // with `id={titleId}`. Auto-wire `aria-labelledby` so the dialog/aside has an\n  // accessible name without forcing every caller to repeat the id.\n  const effectiveAriaLabelledBy =\n    ariaLabelledByProp ?? (!headerless && header == null ? titleId : undefined);\n\n  return {\n    rest,\n    children,\n    closeButtonLabel,\n    header,\n    headerless,\n    footer,\n    title,\n    titleId,\n    direction,\n    width,\n    gap,\n    zIndex,\n    id,\n    snapPoints,\n    defaultSnapPoint,\n    snapPoint,\n    onSnapPointChange,\n    snapToSequentialPoints,\n    actions,\n    actionsInHeader,\n    ariaLabel,\n    isPanelOpen,\n    closePanel,\n    isMobile,\n    enrichedValue,\n    renderedChildren,\n    effectiveAriaLabelledBy,\n  };\n};\n\n/**\n * The shared shell values consumed by both the styled and the Tailwind desktop\n * shells and by the shared mobile render. Inferred from `usePanelShell` so the\n * `rest` pass-through keeps its precise type (mirrors `TypeDrawerShell`).\n */\nexport type TypePanelShell = ReturnType<typeof usePanelShell>;\n","import * as React from \"react\";\nimport { needsStyledComponents } from \"@sproutsocial/seeds-react-system-props\";\nimport { Content } from \"./styles\";\nimport { usePanelContext } from \"./PanelContext\";\nimport { cn } from \"./PanelShared\";\nimport type { TypePanelContentProps } from \"./PanelTypes\";\n\n/**\n * Styled-components content — the backward-compatible fallback. Routed to when\n * the consumer passes styled-system props (e.g. `<Panel.Content color=\"...\">`).\n */\nconst PanelContentStyled = ({ children, ...rest }: TypePanelContentProps) => {\n  // In headerless mode the content renders flush as a flex column and defers\n  // overflow scrolling to its children, so the panel can host content that\n  // owns its own chrome and fills the panel height (e.g. via flex: 1 1 auto).\n  const { headerless } = usePanelContext();\n\n  return (\n    <Content\n      flex=\"1 1 auto\"\n      minHeight=\"0\"\n      p={headerless ? 0 : 450}\n      $scroll={!headerless}\n      color=\"text.body\"\n      data-panel-content=\"\"\n      {...rest}\n    >\n      {children}\n    </Content>\n  );\n};\n\n/**\n * Tailwind/CSS-class content — the preferred path. Renders a plain\n * `<div data-panel-content>` with the `seeds-panel-content` class from\n * panel.css. The scroll behaviour depends on `headerless` (read from context)\n * and is asserted by the jsdom tests, so it is applied inline rather than via\n * the CSS class (panel.css is not loaded under jsdom).\n */\nconst PanelContentTailwind = ({ children, ...rest }: TypePanelContentProps) => {\n  const { headerless } = usePanelContext();\n  const scroll = !headerless;\n\n  const { className, style, ...domRest } = rest as {\n    className?: string;\n    style?: React.CSSProperties;\n  } & Record<string, unknown>;\n\n  const contentStyle: React.CSSProperties = {\n    overflowY: scroll ? \"auto\" : \"hidden\",\n  };\n  // When content owns its own scrolling (headerless), lay out as a flex column\n  // so a child can flex to the panel's full height.\n  if (!scroll) {\n    contentStyle.display = \"flex\";\n    contentStyle.flexDirection = \"column\";\n  }\n  Object.assign(contentStyle, style);\n\n  return (\n    <div\n      className={cn(\n        \"seeds-panel-content\",\n        { \"seeds-panel-content--headerless\": !!headerless },\n        className\n      )}\n      style={contentStyle}\n      data-panel-content=\"\"\n      {...domRest}\n    >\n      {children}\n    </div>\n  );\n};\n\n/**\n * Hybrid content router. Routes on the leftover props after the content's own\n * props are removed.\n */\nexport const PanelContent = (props: TypePanelContentProps) => {\n  const { children, ...rest } = props;\n\n  if (needsStyledComponents(rest)) {\n    return <PanelContentStyled {...props} />;\n  }\n\n  return <PanelContentTailwind {...props} />;\n};\n\nPanelContent.displayName = \"Panel.Content\";\n","import styled, { css } from \"styled-components\";\nimport { COMMON } from \"@sproutsocial/seeds-react-system-props\";\nimport type { TypeSystemCommonProps } from \"@sproutsocial/seeds-react-system-props\";\nimport { MOTION_DURATION_MEDIUM } from \"@sproutsocial/seeds-motion/unitless\";\nimport Box from \"@sproutsocial/seeds-react-box\";\nimport type { PanelDirection } from \"./PanelTypes\";\n\ninterface PanelContainerProps extends TypeSystemCommonProps {\n  $isOpen: boolean;\n  $direction: PanelDirection;\n  $width: number;\n  $gap: number;\n}\n\nconst gapSide = (direction: PanelDirection): \"left\" | \"right\" | \"top\" => {\n  if (direction === \"right\") return \"left\";\n  if (direction === \"left\") return \"right\";\n  return \"top\";\n};\n\nexport const PanelContainer = styled.aside<PanelContainerProps>`\n  background: ${(props) => props.theme.colors.container.background.base};\n  flex-grow: 0;\n  flex-shrink: 0;\n  overflow: hidden;\n  transition: flex-basis ${MOTION_DURATION_MEDIUM}s ease-in-out,\n    margin ${MOTION_DURATION_MEDIUM}s ease-in-out;\n  flex-basis: ${(props) => (props.$isOpen ? `${props.$width}px` : \"0px\")};\n  margin-${(props) => gapSide(props.$direction)}: ${(props) =>\n  props.$isOpen && props.$gap ? `${props.$gap}px` : \"0px\"};\n  border-radius: ${({ theme }) => theme.radii[800]};\n\n  ${(props) =>\n    props.$direction === \"bottom\"\n      ? css`\n          width: 100%;\n        `\n      : css`\n          align-self: stretch;\n        `}\n\n  ${COMMON}\n`;\n\nexport const PanelInner = styled.div<{\n  $direction: PanelDirection;\n  $width: number;\n}>`\n  ${(props) =>\n    props.$direction === \"bottom\"\n      ? css`\n          min-height: ${props.$width}px;\n          width: 100%;\n        `\n      : css`\n          min-width: ${props.$width}px;\n          height: 100%;\n        `}\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n`;\n\nexport const Content = styled(Box)<{ $scroll?: boolean }>`\n  overflow-y: ${({ $scroll = true }) => ($scroll ? \"auto\" : \"hidden\")};\n  /*\n   * When content owns its own scrolling ($scroll false, i.e. headerless), lay\n   * out as a flex column so a child can flex to the panel's full height —\n   * percentage heights can't resolve against a block container here.\n   */\n  ${({ $scroll = true }) =>\n    !$scroll &&\n    css`\n      display: flex;\n      flex-direction: column;\n    `}\n`;\n\nexport const Footer = styled(Box)`\n  flex: 0 0 auto;\n  overflow: hidden;\n  /*\n   * On mobile the Panel renders inside the Drawer's bottom sheet, whose popup\n   * deliberately bleeds 3rem (--bleed) below the viewport for elastic\n   * overscroll (see seeds-react-drawer/src/styles.ts). A footer pinned to the\n   * end of that popup would land inside the bleed and clip below the fold, so\n   * we lift it by the inherited --bleed; the gap left behind shows the popup's\n   * own background, so there is no visible seam. On desktop --bleed is unset,\n   * so the 0px fallback leaves the footer untouched.\n   */\n  margin-bottom: var(--bleed, 0px);\n`;\n","import * as React from \"react\";\nimport Drawer from \"@sproutsocial/seeds-react-drawer\";\nimport { PanelContext } from \"./PanelContext\";\nimport { PanelContent } from \"./PanelContent\";\nimport { PanelMobileActionsHeader } from \"./PanelMobileActionsHeader\";\nimport type { TypePanelShell } from \"./PanelShared\";\n\n/**\n * Mobile bottom-sheet rendering, shared verbatim by both the styled and the\n * Tailwind shells. The mobile path always renders through `Drawer`, which is\n * itself already migrated to the hybrid pattern, so nothing here depends on the\n * root routing gate — the two shells render an identical mobile tree.\n */\nexport const PanelMobile = ({ shell }: { shell: TypePanelShell }) => {\n  const {\n    rest,\n    children,\n    closeButtonLabel,\n    header,\n    headerless,\n    footer,\n    title,\n    titleId,\n    zIndex,\n    snapPoints,\n    defaultSnapPoint,\n    snapPoint,\n    onSnapPointChange,\n    snapToSequentialPoints,\n    actions,\n    actionsInHeader,\n    ariaLabel,\n    isPanelOpen,\n    closePanel,\n    enrichedValue,\n    effectiveAriaLabelledBy,\n  } = shell;\n\n  // With `actionsInHeader`, Drawer suppresses the floating rail and expects the\n  // consumer to render the actions inside a custom header. Auto-compose one\n  // (title + action pills + close pill) when the consumer hasn't supplied their\n  // own header; otherwise we'd drop `actions` on the floor.\n  const shouldRenderActionsHeader =\n    !headerless &&\n    header == null &&\n    actionsInHeader === true &&\n    !!actions &&\n    actions.length > 0;\n\n  // Headerless suppresses the built-in header entirely; the children own all\n  // chrome in that mode.\n  let defaultMobileHeader: React.ReactNode = null;\n  if (!headerless) {\n    defaultMobileHeader = shouldRenderActionsHeader ? (\n      <PanelMobileActionsHeader\n        title={title}\n        titleId={titleId}\n        actions={actions!}\n      />\n    ) : (\n      <Drawer.Header title={title} id={titleId} />\n    );\n  }\n\n  return (\n    <PanelContext.Provider value={enrichedValue}>\n      <Drawer\n        {...rest}\n        open={isPanelOpen}\n        onClose={closePanel}\n        direction=\"bottom\"\n        closeButtonLabel={closeButtonLabel}\n        zIndex={zIndex}\n        snapPoints={snapPoints}\n        defaultSnapPoint={defaultSnapPoint}\n        snapPoint={snapPoint}\n        onSnapPointChange={onSnapPointChange}\n        snapToSequentialPoints={snapToSequentialPoints}\n        actions={actions}\n        actionsInHeader={actionsInHeader}\n        aria-labelledby={effectiveAriaLabelledBy}\n        aria-label={ariaLabel}\n      >\n        {header ?? defaultMobileHeader}\n        <PanelContent>{children}</PanelContent>\n        {footer}\n      </Drawer>\n    </PanelContext.Provider>\n  );\n};\n","import * as React from \"react\";\nimport Button from \"@sproutsocial/seeds-react-button\";\nimport Drawer from \"@sproutsocial/seeds-react-drawer\";\nimport Icon from \"@sproutsocial/seeds-react-icon\";\n// eslint-disable-next-line import/no-deprecated\nimport Text from \"@sproutsocial/seeds-react-text\";\nimport type { TypeDrawerActionProps } from \"@sproutsocial/seeds-react-drawer\";\n\ninterface TypePanelMobileActionsHeaderProps {\n  title?: string;\n  titleId?: string;\n  actions: TypeDrawerActionProps[];\n}\n\n/**\n * Mobile bottom-sheet header used by Panel when `actionsInHeader` is set and\n * no custom `header` is provided. Renders the title on the left and the\n * forwarded actions plus a close button as pills on the right — mirrors the\n * pattern in `seeds-react-peek-in/PeekIn.tsx`. The Drawer's floating rail is\n * suppressed in this combination (`actionsInHeader` opts out), so without this\n * header the actions would render nowhere.\n *\n * This header is composed internally by Panel (it receives no consumer\n * styled-system props), so its chrome is emitted directly as `seeds-panel-*`\n * classes from panel.css rather than through a styled `Box`.\n */\nexport const PanelMobileActionsHeader = ({\n  title,\n  titleId,\n  actions,\n}: TypePanelMobileActionsHeaderProps) => (\n  <Drawer.Header\n    render={(ctx) => (\n      <div className=\"seeds-panel-mobile-actions-header\">\n        <Text\n          as=\"h2\"\n          fontSize={400}\n          fontWeight=\"semibold\"\n          color=\"text.headline\"\n          id={titleId}\n        >\n          {title}\n        </Text>\n        <div className=\"seeds-panel-mobile-actions-buttons\">\n          {actions.map((action, i) => (\n            <Button\n              key={i}\n              appearance=\"pill\"\n              aria-label={action[\"aria-label\"]}\n              onClick={action.onClick}\n              disabled={action.disabled}\n            >\n              {action.iconName && <Icon aria-hidden name={action.iconName} />}\n            </Button>\n          ))}\n          <Button\n            appearance=\"pill\"\n            aria-label={ctx.closeButtonLabel}\n            onClick={ctx.onClose}\n          >\n            <Icon aria-hidden name=\"x-outline\" />\n          </Button>\n        </div>\n      </div>\n    )}\n  />\n);\n\nPanelMobileActionsHeader.displayName = \"PanelMobileActionsHeader\";\n","import { PanelContext } from \"./PanelContext\";\nimport { PanelHeader } from \"./PanelHeader\";\nimport { PanelContent } from \"./PanelContent\";\nimport { PanelMobile } from \"./PanelMobile\";\nimport { PanelContainer, PanelInner } from \"./styles\";\nimport { usePanelShell } from \"./PanelShared\";\nimport type { TypePanelProps } from \"./PanelTypes\";\n\n/**\n * Styled-components shell — the backward-compatible fallback. The hybrid router\n * sends consumers here whenever they pass a `COMMON`-mixin styled-system prop\n * (e.g. `mt`, `mb`, `mr`) or a `styled()` extension, so the full styled prop\n * surface on the outer container keeps working exactly as before.\n */\nexport const PanelStyled = (props: TypePanelProps) => {\n  const shell = usePanelShell(props);\n  const {\n    rest,\n    header,\n    headerless,\n    footer,\n    title,\n    titleId,\n    direction,\n    width,\n    gap,\n    id,\n    ariaLabel,\n    isPanelOpen,\n    isMobile,\n    enrichedValue,\n    renderedChildren,\n    effectiveAriaLabelledBy,\n  } = shell;\n\n  if (isMobile) {\n    return <PanelMobile shell={shell} />;\n  }\n\n  return (\n    <PanelContext.Provider value={enrichedValue}>\n      <PanelContainer\n        {...rest}\n        $isOpen={isPanelOpen}\n        $direction={direction}\n        $width={width}\n        $gap={gap}\n        data-qa-panel={id}\n        data-qa-panel-isopen={isPanelOpen}\n        aria-labelledby={effectiveAriaLabelledBy}\n        aria-label={ariaLabel}\n      >\n        <PanelInner $direction={direction} $width={width}>\n          {header ??\n            (headerless ? null : <PanelHeader title={title} id={titleId} />)}\n          <PanelContent>{renderedChildren}</PanelContent>\n          {footer}\n        </PanelInner>\n      </PanelContainer>\n    </PanelContext.Provider>\n  );\n};\n","import * as React from \"react\";\nimport { PanelContext } from \"./PanelContext\";\nimport { PanelHeader } from \"./PanelHeader\";\nimport { PanelContent } from \"./PanelContent\";\nimport { PanelMobile } from \"./PanelMobile\";\nimport {\n  cn,\n  usePanelShell,\n  getPanelContainerStyle,\n  getPanelInnerStyle,\n} from \"./PanelShared\";\nimport type { TypePanelProps } from \"./PanelTypes\";\n\n/**\n * Tailwind/CSS-class shell — the preferred path, routed to by the hybrid when\n * the consumer passes no styled-system props or `styled()` extension. Renders a\n * plain `<aside>` (implicit `complementary` role) with the `seeds-panel` classes\n * from panel.css instead of a styled container. Runtime geometry (flex-basis,\n * gap margin, direction shape, inner min-width/min-height) is applied inline\n * because the jsdom tests assert those as computed styles and panel.css is not\n * loaded there. The mobile path renders identically to the styled shell via\n * the shared `PanelMobile`.\n */\nexport const PanelTailwind = (props: TypePanelProps) => {\n  const shell = usePanelShell(props);\n  const {\n    rest,\n    header,\n    headerless,\n    footer,\n    title,\n    titleId,\n    direction,\n    width,\n    gap,\n    id,\n    ariaLabel,\n    isPanelOpen,\n    isMobile,\n    enrichedValue,\n    renderedChildren,\n    effectiveAriaLabelledBy,\n  } = shell;\n\n  if (isMobile) {\n    return <PanelMobile shell={shell} />;\n  }\n\n  // `rest` carries only non-styled pass-through props on this path (the gate\n  // routes styled-system props to PanelStyled). Peel off className/style so we\n  // can merge them onto the component's own class and inline geometry rather\n  // than letting a spread clobber them.\n  const { className, style, ...domRest } = rest as {\n    className?: string;\n    style?: React.CSSProperties;\n  } & Record<string, unknown>;\n\n  const containerStyle = getPanelContainerStyle(\n    direction,\n    width,\n    gap,\n    isPanelOpen\n  );\n  const innerStyle = getPanelInnerStyle(direction, width);\n\n  return (\n    <PanelContext.Provider value={enrichedValue}>\n      <aside\n        {...domRest}\n        className={cn(\"seeds-panel\", className)}\n        style={{ ...containerStyle, ...style }}\n        data-qa-panel={id}\n        data-qa-panel-isopen={isPanelOpen}\n        aria-labelledby={effectiveAriaLabelledBy}\n        aria-label={ariaLabel}\n      >\n        <div className=\"seeds-panel-inner\" style={innerStyle}>\n          {header ??\n            (headerless ? null : <PanelHeader title={title} id={titleId} />)}\n          <PanelContent>{renderedChildren}</PanelContent>\n          {footer}\n        </div>\n      </aside>\n    </PanelContext.Provider>\n  );\n};\n","import * as React from \"react\";\nimport { needsStyledComponents } from \"@sproutsocial/seeds-react-system-props\";\nimport { Footer } from \"./styles\";\nimport { cn } from \"./PanelShared\";\nimport type { TypePanelFooterProps } from \"./PanelTypes\";\n\n/**\n * Styled-components footer — the backward-compatible fallback. Routed to when\n * the consumer passes styled-system props (e.g. `<Panel.Footer bg=\"...\">`).\n */\nconst PanelFooterStyled = ({ children, ...rest }: TypePanelFooterProps) => (\n  <Footer p={450} data-panel-footer=\"\" {...rest}>\n    {children}\n  </Footer>\n);\n\n/**\n * Tailwind/CSS-class footer — the preferred path. Renders a plain\n * `<div data-panel-footer>` with the `seeds-panel-footer` class from panel.css.\n *\n * `margin-bottom: var(--bleed, 0px)` lifts the footer above the Drawer's mobile\n * bottom-sheet bleed (see styles.ts). It is asserted by the jsdom tests and the\n * `--bleed` var is only set at runtime by the mobile Drawer, so it is applied\n * inline (falling back to 0px on desktop).\n */\nconst PanelFooterTailwind = ({ children, ...rest }: TypePanelFooterProps) => {\n  const { className, style, ...domRest } = rest as {\n    className?: string;\n    style?: React.CSSProperties;\n  } & Record<string, unknown>;\n\n  return (\n    <div\n      className={cn(\"seeds-panel-footer\", className)}\n      style={{ marginBottom: \"var(--bleed, 0px)\", ...style }}\n      data-panel-footer=\"\"\n      {...domRest}\n    >\n      {children}\n    </div>\n  );\n};\n\n/**\n * Hybrid footer router. Routes on the leftover props after the footer's own\n * props are removed.\n */\nexport const PanelFooter = (props: TypePanelFooterProps) => {\n  const { children, ...rest } = props;\n\n  if (needsStyledComponents(rest)) {\n    return <PanelFooterStyled {...props} />;\n  }\n\n  return <PanelFooterTailwind {...props} />;\n};\n\nPanelFooter.displayName = \"Panel.Footer\";\n","import { PanelHybrid } from \"./PanelHybrid\";\nimport { PanelHeader } from \"./PanelHeader\";\nimport { PanelContent } from \"./PanelContent\";\nimport { PanelCloseButton } from \"./PanelCloseButton\";\nimport { PanelFooter } from \"./PanelFooter\";\nimport type { TypePanelProps } from \"./PanelTypes\";\n\n/**\n * Panel compound component. Automatically routes between the Tailwind\n * implementation (preferred, no runtime CSS-in-JS) and the styled-components\n * implementation (for consumers using styled-system props or a `styled()`\n * extension). Public API, exports, and the `.Header/.Content/.CloseButton/\n * .Footer` static attachments are unchanged.\n */\nconst PanelComponent = (props: TypePanelProps) => <PanelHybrid {...props} />;\n\nPanelComponent.displayName = \"Panel\";\nPanelComponent.Header = PanelHeader;\nPanelComponent.Content = PanelContent;\nPanelComponent.CloseButton = PanelCloseButton;\nPanelComponent.Footer = PanelFooter;\n\nexport const Panel = PanelComponent;\nexport default PanelComponent;\n","import * as React from \"react\";\nimport { PanelContext } from \"./PanelContext\";\nimport type { TypePanelContext, TypePanelProviderProps } from \"./PanelTypes\";\n\nexport const PanelProvider = ({\n  children,\n  defaultOpen = false,\n  open: controlledOpen,\n  onOpenChange,\n}: TypePanelProviderProps) => {\n  const [internalOpen, setInternalOpen] = React.useState(defaultOpen);\n  const isControlled = controlledOpen !== undefined;\n  const isPanelOpen = isControlled ? controlledOpen : internalOpen;\n\n  const setOpen = React.useCallback(\n    (next: boolean) => {\n      if (!isControlled) setInternalOpen(next);\n      onOpenChange?.(next);\n    },\n    [isControlled, onOpenChange]\n  );\n\n  const openPanel = React.useCallback(() => setOpen(true), [setOpen]);\n  const closePanel = React.useCallback(() => setOpen(false), [setOpen]);\n  const togglePanel = React.useCallback(\n    () => setOpen(!isPanelOpen),\n    [setOpen, isPanelOpen]\n  );\n\n  const value = React.useMemo<TypePanelContext>(\n    () => ({ isPanelOpen, openPanel, closePanel, togglePanel }),\n    [isPanelOpen, openPanel, closePanel, togglePanel]\n  );\n\n  return (\n    <PanelContext.Provider value={value}>{children}</PanelContext.Provider>\n  );\n};\n","import * as React from \"react\";\nimport type {\n  TypeSystemCommonProps,\n  TypeStyledComponentsCommonProps,\n} from \"@sproutsocial/seeds-react-system-props\";\nimport type { TypeBoxProps } from \"@sproutsocial/seeds-react-box\";\nimport type { TypeButtonProps } from \"@sproutsocial/seeds-react-button\";\nimport type {\n  TypeDrawerSnapPoint,\n  TypeDrawerActionProps,\n} from \"@sproutsocial/seeds-react-drawer\";\n\nexport type { TypeDrawerActionProps as TypePanelActionProps };\n\nexport type PanelDirection = \"left\" | \"right\" | \"bottom\";\n\nexport interface TypePanelContext {\n  isPanelOpen: boolean;\n  togglePanel: () => void;\n  openPanel: () => void;\n  closePanel: () => void;\n  closeButtonLabel?: string;\n  /**\n   * Set by `Panel` when rendered headerless. `Panel.Content` reads this to\n   * render flush (no padding) and defer overflow scrolling to its children.\n   */\n  headerless?: boolean;\n}\n\nexport interface TypePanelProviderProps {\n  children: React.ReactNode;\n  /** Initial open state for uncontrolled usage. */\n  defaultOpen?: boolean;\n  /** Controlled open state. When provided, the provider becomes controlled. */\n  open?: boolean;\n  /** Called whenever the open state changes. Required for controlled usage. */\n  onOpenChange?: (open: boolean) => void;\n}\n\nexport interface TypePanelProps\n  extends TypeStyledComponentsCommonProps,\n    TypeSystemCommonProps,\n    Omit<React.ComponentPropsWithoutRef<\"div\">, \"color\"> {\n  children: React.ReactNode;\n\n  /** Label for the close button. Usually \"Close\". */\n  closeButtonLabel: string;\n\n  /**\n   * Custom header content. When provided, replaces the auto-rendered default\n   * header entirely — `title` and `titleId` are ignored.\n   */\n  header?: React.ReactNode;\n\n  /** Custom footer content. Not rendered when omitted. */\n  footer?: React.ReactNode;\n\n  /**\n   * Renders children flush, without the built-in header/close button or content\n   * padding, and lets the children own overflow scrolling. Use when the content\n   * provides its own chrome (e.g. an embedded agent UI). Provide `aria-label`\n   * (or `aria-labelledby`) for an accessible name, since no header title is\n   * rendered. `title`, `titleId`, and `closeButtonLabel` are ignored in this\n   * mode. Defaults to false.\n   */\n  headerless?: boolean;\n\n  /** Title shown in the auto-rendered default header. Ignored when `header` is provided. */\n  title?: string;\n\n  /**\n   * Sets the `id` on the title element of the auto-rendered header. When the\n   * default header is used, Panel automatically wires `aria-labelledby` to this\n   * id so the dialog/aside has an accessible name. Pass an explicit\n   * `aria-labelledby` to override (e.g. when pointing at a different element).\n   * Ignored when `header` is provided — supply your own `aria-labelledby` in\n   * that case.\n   */\n  titleId?: string;\n\n  /** Side the panel anchors to on desktop. Defaults to \"right\". */\n  direction?: PanelDirection;\n\n  /**\n   * Width (px) when direction is \"left\" or \"right\", or height (px) when\n   * direction is \"bottom\". Defaults to 384 to match the existing web-app-core\n   * Panel.\n   */\n  width?: number;\n\n  /**\n   * Visual gap (px) between the panel and the adjacent content. Applied as\n   * margin on the side facing the content (left when direction=\"right\",\n   * right when direction=\"left\", top when direction=\"bottom\"). Animates with\n   * the panel's open/close transition and collapses to 0 when closed so the\n   * gap does not remain visible alongside a zero-width panel. Defaults to 0.\n   */\n  gap?: number;\n\n  /**\n   * Forwarded to `useIsMobile`. Accepts a px number or any CSS media-query\n   * length. Below this width, the panel renders as an overlay bottom sheet\n   * (via seeds-react-drawer). Defaults to the theme's `breakpoints.md`.\n   */\n  mobileBreakpoint?: number | string;\n\n  /** Applies only to the mobile bottom-sheet rendering. */\n  zIndex?: number;\n\n  /** Optional id used for data-qa-panel attributes. */\n  id?: string;\n\n  /**\n   * Snap points the panel can rest at when rendered as a mobile bottom sheet.\n   * Numbers 0–1 are viewport-height fractions; numbers > 1 are pixels; strings\n   * accept `px`/`rem` (e.g. `\"480px\"`, `\"30rem\"`). Order matters — the last\n   * entry is the \"expanded\" state. Ignored on the desktop side-panel rendering.\n   */\n  snapPoints?: TypeDrawerSnapPoint[];\n\n  /** Initial snap point for uncontrolled use. Mobile only. */\n  defaultSnapPoint?: TypeDrawerSnapPoint | null;\n\n  /** Controlled active snap point. Pair with `onSnapPointChange`. Mobile only. */\n  snapPoint?: TypeDrawerSnapPoint | null;\n\n  /** Fires when the active snap point changes. Mobile only. */\n  onSnapPointChange?: (snapPoint: TypeDrawerSnapPoint | null) => void;\n\n  /**\n   * When true, fast swipes can't skip past adjacent snap points. Mobile only.\n   */\n  snapToSequentialPoints?: boolean;\n\n  /**\n   * Action buttons shown in a floating rail above the panel on mobile (the\n   * bottom-sheet rendering). Ignored on desktop side-panel rendering — pass\n   * actions through `header`/`footer` slots there. The rail owns the close\n   * button so the default header omits its built-in close affordance.\n   */\n  actions?: TypeDrawerActionProps[];\n\n  /**\n   * Opt out of the floating mobile rail and render the `actions` inline in the\n   * header as pill buttons instead. Useful for nested bottom sheets and\n   * snap-point layouts where the floating rail would collide with surrounding\n   * UI. Defaults to `false`.\n   *\n   * When `header` is omitted, Panel auto-composes a mobile header that renders\n   * the title, the `actions` as pills, and a close-button pill. When `header`\n   * is provided, the consumer is responsible for rendering the actions inside\n   * their own header — `actions` is forwarded for context only.\n   */\n  actionsInHeader?: boolean;\n}\n\nexport interface TypePanelHeaderProps extends TypeBoxProps {\n  title?: string;\n  /**\n   * When children are provided, `<Panel.CloseButton />` is NOT rendered\n   * automatically. Include it yourself to preserve keyboard accessibility.\n   */\n  children?: React.ReactNode;\n  /** Render-prop override that receives the parent panel context. */\n  render?: React.FC<TypePanelContext>;\n}\n\nexport interface TypePanelContentProps extends TypeBoxProps {\n  children?: React.ReactNode;\n}\n\nexport interface TypePanelFooterProps extends TypeBoxProps {\n  children?: React.ReactNode;\n}\n\nexport interface TypePanelCloseButtonProps\n  extends Omit<TypeButtonProps, \"children\"> {\n  /** Render-prop override that receives the parent panel context. */\n  render?: React.FC<TypePanelContext>;\n  children?: React.ReactNode;\n}\n","import Panel from \"./Panel\";\n\nexport default Panel;\nexport { Panel };\nexport { PanelContext, usePanelContext } from \"./PanelContext\";\nexport { PanelProvider } from \"./PanelProvider\";\nexport { PanelHeader } from \"./PanelHeader\";\nexport { PanelContent } from \"./PanelContent\";\nexport { PanelCloseButton } from \"./PanelCloseButton\";\nexport { PanelFooter } from \"./PanelFooter\";\nexport * from \"./PanelTypes\";\n"],"mappings":"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","names":["needsStyledComponents","React","jsx","needsStyledComponents","Box","jsx","needsStyledComponents","Drawer","Button","Icon","Text","jsx","jsxs","jsx","jsxs","Drawer","jsx","jsxs","jsx","jsxs","jsx","needsStyledComponents","needsStyledComponents","jsx","needsStyledComponents","jsx","React","jsx"]}

package/dist/index.d.mts

@@ -78,7 +78,7 @@ interface TypePanelProps extends TypeStyledComponentsCommonProps, TypeSystemComm
     /**
      * Forwarded to `useIsMobile`. Accepts a px number or any CSS media-query
      * length. Below this width, the panel renders as an overlay bottom sheet
-     * (via seeds-react-drawer). Defaults to the theme's `breakpoints.sm`.
+     * (via seeds-react-drawer). Defaults to the theme's `breakpoints.md`.
      */
     mobileBreakpoint?: number | string;
     /** Applies only to the mobile bottom-sheet rendering. */

package/dist/index.d.ts

@@ -78,7 +78,7 @@ interface TypePanelProps extends TypeStyledComponentsCommonProps, TypeSystemComm
     /**
      * Forwarded to `useIsMobile`. Accepts a px number or any CSS media-query
      * length. Below this width, the panel renders as an overlay bottom sheet
-     * (via seeds-react-drawer). Defaults to the theme's `breakpoints.sm`.
+     * (via seeds-react-drawer). Defaults to the theme's `breakpoints.md`.
      */
     mobileBreakpoint?: number | string;
     /** Applies only to the mobile bottom-sheet rendering. */

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts","../src/PanelHybrid.tsx","../src/PanelContext.tsx","../src/PanelHeader.tsx","../src/PanelCloseButton.tsx","../src/PanelShared.tsx","../src/PanelContent.tsx","../src/styles.ts","../src/PanelMobile.tsx","../src/PanelMobileActionsHeader.tsx","../src/PanelStyled.tsx","../src/PanelTailwind.tsx","../src/PanelFooter.tsx","../src/Panel.tsx","../src/PanelProvider.tsx","../src/PanelTypes.ts"],"sourcesContent":["import Panel from \"./Panel\";\n\nexport default Panel;\nexport { Panel };\nexport { PanelContext, usePanelContext } from \"./PanelContext\";\nexport { PanelProvider } from \"./PanelProvider\";\nexport { PanelHeader } from \"./PanelHeader\";\nexport { PanelContent } from \"./PanelContent\";\nexport { PanelCloseButton } from \"./PanelCloseButton\";\nexport { PanelFooter } from \"./PanelFooter\";\nexport * from \"./PanelTypes\";\n","import { needsStyledComponents } from \"@sproutsocial/seeds-react-system-props\";\nimport { PanelStyled } from \"./PanelStyled\";\nimport { PanelTailwind } from \"./PanelTailwind\";\nimport type { TypePanelProps } from \"./PanelTypes\";\n\n/**\n * Hybrid Panel router. Chooses the styled-components path when the consumer\n * passes a styled-system (`COMMON`) prop or a `styled()` extension, otherwise\n * the preferred Tailwind path.\n *\n * The routing decision runs on the *leftover* props after Panel's own domain\n * props are destructured — critically, `width` and `zIndex` are Panel domain\n * props whose names also appear in `STYLED_SYSTEM_PROPS`. Gating on the full\n * prop object would push almost every real Panel usage (anything setting\n * `width`) onto the styled path and defeat the migration, so we exclude the\n * domain props first and gate only on `rest`.\n */\nexport const PanelHybrid = (props: TypePanelProps) => {\n  const {\n    children,\n    closeButtonLabel,\n    header,\n    headerless,\n    footer,\n    title,\n    titleId,\n    direction,\n    width,\n    gap,\n    mobileBreakpoint,\n    zIndex,\n    id,\n    snapPoints,\n    defaultSnapPoint,\n    snapPoint,\n    onSnapPointChange,\n    snapToSequentialPoints,\n    actions,\n    actionsInHeader,\n    \"aria-labelledby\": ariaLabelledBy,\n    \"aria-label\": ariaLabel,\n    ...rest\n  } = props;\n\n  if (needsStyledComponents(rest)) {\n    return <PanelStyled {...props} />;\n  }\n\n  return <PanelTailwind {...props} />;\n};\n\nPanelHybrid.displayName = \"Panel\";\n","import * as React from \"react\";\nimport type { TypePanelContext } from \"./PanelTypes\";\n\nexport const PanelContext = React.createContext<TypePanelContext | null>(null);\n\nexport const usePanelContext = (): TypePanelContext => {\n  const ctx = React.useContext(PanelContext);\n  if (!ctx) {\n    throw new Error(\n      \"usePanelContext must be used within a <PanelProvider>. Wrap the consuming tree in <PanelProvider> to provide isPanelOpen / togglePanel.\"\n    );\n  }\n  return ctx;\n};\n","import Box from \"@sproutsocial/seeds-react-box\";\nimport Text from \"@sproutsocial/seeds-react-text\";\nimport { needsStyledComponents } from \"@sproutsocial/seeds-react-system-props\";\nimport { usePanelContext } from \"./PanelContext\";\nimport { PanelCloseButton } from \"./PanelCloseButton\";\nimport { cn } from \"./PanelShared\";\nimport type { TypePanelHeaderProps } from \"./PanelTypes\";\n\n/**\n * Styled-components header — the backward-compatible fallback. The hybrid\n * router sends consumers here whenever they pass styled-system props (e.g.\n * `<Panel.Header alignItems=\"center\">`) or a `styled()` extension, so the full\n * `Box` prop surface keeps working.\n */\nconst PanelHeaderStyled = ({\n  title = \"\",\n  id = undefined,\n  children,\n  render,\n  ...rest\n}: TypePanelHeaderProps) => (\n  <Box\n    display=\"flex\"\n    flex=\"0 0 auto\"\n    justifyContent=\"space-between\"\n    alignItems=\"center\"\n    p={400}\n    borderBottom=\"1px solid\"\n    borderColor=\"container.border.base\"\n    {...rest}\n  >\n    {children || (\n      <>\n        <Text.Headline id={id}>{title}</Text.Headline>\n        <PanelCloseButton />\n      </>\n    )}\n  </Box>\n);\n\n/**\n * Tailwind/CSS-class header — the preferred path. Renders a plain `<div>` with\n * the `seeds-panel-header` class from panel.css instead of a styled `Box`. The\n * `render` prop is handled by the hybrid before reaching here.\n */\nconst PanelHeaderTailwind = ({\n  title = \"\",\n  id = undefined,\n  children,\n  render,\n  ...rest\n}: TypePanelHeaderProps) => {\n  const { className, ...domRest } = rest as {\n    className?: string;\n  } & Record<string, unknown>;\n\n  return (\n    <div className={cn(\"seeds-panel-header\", className)} {...domRest}>\n      {children || (\n        <>\n          <Text.Headline id={id}>{title}</Text.Headline>\n          <PanelCloseButton />\n        </>\n      )}\n    </div>\n  );\n};\n\n/**\n * Hybrid header router. The `render` escape hatch short-circuits before any\n * routing (matching the original always-styled behaviour); otherwise it routes\n * on the leftover props after the header's own props are removed.\n */\nexport const PanelHeader = (props: TypePanelHeaderProps) => {\n  const panelContext = usePanelContext();\n\n  if (props.render) {\n    return props.render(panelContext);\n  }\n\n  const { title, id, children, render, ...rest } = props;\n\n  if (needsStyledComponents(rest)) {\n    return <PanelHeaderStyled {...props} />;\n  }\n\n  return <PanelHeaderTailwind {...props} />;\n};\n\nPanelHeader.displayName = \"Panel.Header\";\n","import * as React from \"react\";\nimport Button from \"@sproutsocial/seeds-react-button\";\nimport Icon from \"@sproutsocial/seeds-react-icon\";\nimport { usePanelContext } from \"./PanelContext\";\nimport type { TypePanelCloseButtonProps } from \"./PanelTypes\";\n\nexport const PanelCloseButton = (props: TypePanelCloseButtonProps) => {\n  const panelContext = usePanelContext();\n\n  if (props.render) {\n    return props.render(panelContext) ?? null;\n  }\n\n  return (\n    <Button\n      appearance=\"pill\"\n      aria-label={panelContext.closeButtonLabel}\n      onClick={panelContext.closePanel}\n      {...props}\n    >\n      {props.children || (\n        <Icon aria-hidden name=\"collapse-panel-right-outline\" />\n      )}\n    </Button>\n  );\n};\n\nPanelCloseButton.displayName = \"Panel.CloseButton\";\n","import * as React from \"react\";\nimport { useIsMobile } from \"@sproutsocial/seeds-react-hooks\";\nimport { usePanelContext } from \"./PanelContext\";\nimport type {\n  PanelDirection,\n  TypePanelProps,\n  TypePanelContext,\n} from \"./PanelTypes\";\n\n/**\n * Class-name merge helper. Copied intentionally rather than imported from\n * `@sproutsocial/seeds-react-utilities` — `cn` is not exported there, so each\n * migrated Tailwind component carries its own copy (mirrors AvatarTailwind /\n * DrawerShared). Because Panel is a multi-part component, the helper lives once\n * here and is imported by every Tailwind sub-component instead of being\n * duplicated in each file.\n */\nexport function cn(\n  ...inputs: (string | undefined | null | false | Record<string, boolean>)[]\n): string {\n  const classes: string[] = [];\n\n  for (const input of inputs) {\n    if (!input) continue;\n\n    if (typeof input === \"string\") {\n      classes.push(input);\n    } else if (typeof input === \"object\") {\n      for (const [key, value] of Object.entries(input)) {\n        if (value) {\n          classes.push(key);\n        }\n      }\n    }\n  }\n\n  return classes.join(\" \");\n}\n\n/**\n * Dynamic geometry for the outer `<aside>` on the Tailwind path. These values\n * depend on runtime props (open state, width, gap, direction) and are asserted\n * as computed styles by the jsdom tests, so they must be inline `style` rather\n * than CSS-variable-driven classes (panel.css is not loaded under jsdom). The\n * static chrome (background, radius, transition, overflow, flex-grow/shrink)\n * lives in panel.css.\n *\n * The gap sits on the margin edge facing the adjacent content: left when the\n * panel anchors right, right when it anchors left, top when it anchors to the\n * bottom (mirrors `gapSide` in styles.ts).\n */\nexport const getPanelContainerStyle = (\n  direction: PanelDirection,\n  width: number,\n  gap: number,\n  isPanelOpen: boolean\n): React.CSSProperties => {\n  const gapValue = isPanelOpen && gap ? `${gap}px` : \"0px\";\n  const style: React.CSSProperties = {\n    flexBasis: isPanelOpen ? `${width}px` : \"0px\",\n  };\n\n  if (direction === \"bottom\") {\n    style.width = \"100%\";\n  } else {\n    style.alignSelf = \"stretch\";\n  }\n\n  if (direction === \"right\") {\n    style.marginLeft = gapValue;\n  } else if (direction === \"left\") {\n    style.marginRight = gapValue;\n  } else {\n    style.marginTop = gapValue;\n  }\n\n  return style;\n};\n\n/**\n * Dynamic geometry for the inner layout `<div>` on the Tailwind path. The\n * direction-dependent min-width/min-height come from the `width` prop.\n */\nexport const getPanelInnerStyle = (\n  direction: PanelDirection,\n  width: number\n): React.CSSProperties =>\n  direction === \"bottom\"\n    ? { minHeight: `${width}px`, width: \"100%\" }\n    : { minWidth: `${width}px`, height: \"100%\" };\n\n/**\n * Shared render logic for both the styled and the Tailwind shells: reads the\n * PanelProvider context, enriches it (closeButtonLabel/headerless), freezes the\n * last-rendered children during the collapse, resolves the mobile breakpoint,\n * and computes the auto-wired accessible name. Centralising it here guarantees\n * the two shells stay behaviourally identical — only the desktop container\n * markup differs between them.\n */\nexport const usePanelShell = (props: TypePanelProps) => {\n  const {\n    children,\n    closeButtonLabel,\n    header,\n    headerless = false,\n    footer,\n    title,\n    titleId,\n    direction = \"right\",\n    width = 384,\n    gap = 4,\n    mobileBreakpoint,\n    zIndex,\n    id,\n    snapPoints,\n    defaultSnapPoint,\n    snapPoint,\n    onSnapPointChange,\n    snapToSequentialPoints,\n    actions,\n    actionsInHeader,\n    \"aria-labelledby\": ariaLabelledByProp,\n    \"aria-label\": ariaLabel,\n    ...rest\n  } = props;\n\n  const panelContext = usePanelContext();\n  const { isPanelOpen, closePanel } = panelContext;\n  const isMobile = useIsMobile(mobileBreakpoint);\n\n  // Expose closeButtonLabel through context so PanelCloseButton can read it\n  // without prop drilling — same pattern as DrawerContext.\n  const enrichedValue = React.useMemo<TypePanelContext>(\n    () => ({ ...panelContext, closeButtonLabel, headerless }),\n    [panelContext, closeButtonLabel, headerless]\n  );\n\n  // Freeze the last-rendered children during the collapse so consumers that\n  // conditionally render content don't produce an empty panel shell while the\n  // flex-basis animation runs.\n  const prevChildrenRef = React.useRef<React.ReactNode>(null);\n  if (isPanelOpen) {\n    prevChildrenRef.current = children;\n  }\n  const renderedChildren = isPanelOpen ? children : prevChildrenRef.current;\n\n  // When the consumer relies on the default header, its title element renders\n  // with `id={titleId}`. Auto-wire `aria-labelledby` so the dialog/aside has an\n  // accessible name without forcing every caller to repeat the id.\n  const effectiveAriaLabelledBy =\n    ariaLabelledByProp ?? (!headerless && header == null ? titleId : undefined);\n\n  return {\n    rest,\n    children,\n    closeButtonLabel,\n    header,\n    headerless,\n    footer,\n    title,\n    titleId,\n    direction,\n    width,\n    gap,\n    zIndex,\n    id,\n    snapPoints,\n    defaultSnapPoint,\n    snapPoint,\n    onSnapPointChange,\n    snapToSequentialPoints,\n    actions,\n    actionsInHeader,\n    ariaLabel,\n    isPanelOpen,\n    closePanel,\n    isMobile,\n    enrichedValue,\n    renderedChildren,\n    effectiveAriaLabelledBy,\n  };\n};\n\n/**\n * The shared shell values consumed by both the styled and the Tailwind desktop\n * shells and by the shared mobile render. Inferred from `usePanelShell` so the\n * `rest` pass-through keeps its precise type (mirrors `TypeDrawerShell`).\n */\nexport type TypePanelShell = ReturnType<typeof usePanelShell>;\n","import * as React from \"react\";\nimport { needsStyledComponents } from \"@sproutsocial/seeds-react-system-props\";\nimport { Content } from \"./styles\";\nimport { usePanelContext } from \"./PanelContext\";\nimport { cn } from \"./PanelShared\";\nimport type { TypePanelContentProps } from \"./PanelTypes\";\n\n/**\n * Styled-components content — the backward-compatible fallback. Routed to when\n * the consumer passes styled-system props (e.g. `<Panel.Content color=\"...\">`).\n */\nconst PanelContentStyled = ({ children, ...rest }: TypePanelContentProps) => {\n  // In headerless mode the content renders flush as a flex column and defers\n  // overflow scrolling to its children, so the panel can host content that\n  // owns its own chrome and fills the panel height (e.g. via flex: 1 1 auto).\n  const { headerless } = usePanelContext();\n\n  return (\n    <Content\n      flex=\"1 1 auto\"\n      minHeight=\"0\"\n      p={headerless ? 0 : 450}\n      $scroll={!headerless}\n      color=\"text.body\"\n      data-panel-content=\"\"\n      {...rest}\n    >\n      {children}\n    </Content>\n  );\n};\n\n/**\n * Tailwind/CSS-class content — the preferred path. Renders a plain\n * `<div data-panel-content>` with the `seeds-panel-content` class from\n * panel.css. The scroll behaviour depends on `headerless` (read from context)\n * and is asserted by the jsdom tests, so it is applied inline rather than via\n * the CSS class (panel.css is not loaded under jsdom).\n */\nconst PanelContentTailwind = ({ children, ...rest }: TypePanelContentProps) => {\n  const { headerless } = usePanelContext();\n  const scroll = !headerless;\n\n  const { className, style, ...domRest } = rest as {\n    className?: string;\n    style?: React.CSSProperties;\n  } & Record<string, unknown>;\n\n  const contentStyle: React.CSSProperties = {\n    overflowY: scroll ? \"auto\" : \"hidden\",\n  };\n  // When content owns its own scrolling (headerless), lay out as a flex column\n  // so a child can flex to the panel's full height.\n  if (!scroll) {\n    contentStyle.display = \"flex\";\n    contentStyle.flexDirection = \"column\";\n  }\n  Object.assign(contentStyle, style);\n\n  return (\n    <div\n      className={cn(\n        \"seeds-panel-content\",\n        { \"seeds-panel-content--headerless\": !!headerless },\n        className\n      )}\n      style={contentStyle}\n      data-panel-content=\"\"\n      {...domRest}\n    >\n      {children}\n    </div>\n  );\n};\n\n/**\n * Hybrid content router. Routes on the leftover props after the content's own\n * props are removed.\n */\nexport const PanelContent = (props: TypePanelContentProps) => {\n  const { children, ...rest } = props;\n\n  if (needsStyledComponents(rest)) {\n    return <PanelContentStyled {...props} />;\n  }\n\n  return <PanelContentTailwind {...props} />;\n};\n\nPanelContent.displayName = \"Panel.Content\";\n","import styled, { css } from \"styled-components\";\nimport { COMMON } from \"@sproutsocial/seeds-react-system-props\";\nimport type { TypeSystemCommonProps } from \"@sproutsocial/seeds-react-system-props\";\nimport { MOTION_DURATION_MEDIUM } from \"@sproutsocial/seeds-motion/unitless\";\nimport Box from \"@sproutsocial/seeds-react-box\";\nimport type { PanelDirection } from \"./PanelTypes\";\n\ninterface PanelContainerProps extends TypeSystemCommonProps {\n  $isOpen: boolean;\n  $direction: PanelDirection;\n  $width: number;\n  $gap: number;\n}\n\nconst gapSide = (direction: PanelDirection): \"left\" | \"right\" | \"top\" => {\n  if (direction === \"right\") return \"left\";\n  if (direction === \"left\") return \"right\";\n  return \"top\";\n};\n\nexport const PanelContainer = styled.aside<PanelContainerProps>`\n  background: ${(props) => props.theme.colors.container.background.base};\n  flex-grow: 0;\n  flex-shrink: 0;\n  overflow: hidden;\n  transition: flex-basis ${MOTION_DURATION_MEDIUM}s ease-in-out,\n    margin ${MOTION_DURATION_MEDIUM}s ease-in-out;\n  flex-basis: ${(props) => (props.$isOpen ? `${props.$width}px` : \"0px\")};\n  margin-${(props) => gapSide(props.$direction)}: ${(props) =>\n  props.$isOpen && props.$gap ? `${props.$gap}px` : \"0px\"};\n  border-radius: ${({ theme }) => theme.radii[800]};\n\n  ${(props) =>\n    props.$direction === \"bottom\"\n      ? css`\n          width: 100%;\n        `\n      : css`\n          align-self: stretch;\n        `}\n\n  ${COMMON}\n`;\n\nexport const PanelInner = styled.div<{\n  $direction: PanelDirection;\n  $width: number;\n}>`\n  ${(props) =>\n    props.$direction === \"bottom\"\n      ? css`\n          min-height: ${props.$width}px;\n          width: 100%;\n        `\n      : css`\n          min-width: ${props.$width}px;\n          height: 100%;\n        `}\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n`;\n\nexport const Content = styled(Box)<{ $scroll?: boolean }>`\n  overflow-y: ${({ $scroll = true }) => ($scroll ? \"auto\" : \"hidden\")};\n  /*\n   * When content owns its own scrolling ($scroll false, i.e. headerless), lay\n   * out as a flex column so a child can flex to the panel's full height —\n   * percentage heights can't resolve against a block container here.\n   */\n  ${({ $scroll = true }) =>\n    !$scroll &&\n    css`\n      display: flex;\n      flex-direction: column;\n    `}\n`;\n\nexport const Footer = styled(Box)`\n  flex: 0 0 auto;\n  overflow: hidden;\n  /*\n   * On mobile the Panel renders inside the Drawer's bottom sheet, whose popup\n   * deliberately bleeds 3rem (--bleed) below the viewport for elastic\n   * overscroll (see seeds-react-drawer/src/styles.ts). A footer pinned to the\n   * end of that popup would land inside the bleed and clip below the fold, so\n   * we lift it by the inherited --bleed; the gap left behind shows the popup's\n   * own background, so there is no visible seam. On desktop --bleed is unset,\n   * so the 0px fallback leaves the footer untouched.\n   */\n  margin-bottom: var(--bleed, 0px);\n`;\n","import * as React from \"react\";\nimport Drawer from \"@sproutsocial/seeds-react-drawer\";\nimport { PanelContext } from \"./PanelContext\";\nimport { PanelContent } from \"./PanelContent\";\nimport { PanelMobileActionsHeader } from \"./PanelMobileActionsHeader\";\nimport type { TypePanelShell } from \"./PanelShared\";\n\n/**\n * Mobile bottom-sheet rendering, shared verbatim by both the styled and the\n * Tailwind shells. The mobile path always renders through `Drawer`, which is\n * itself already migrated to the hybrid pattern, so nothing here depends on the\n * root routing gate — the two shells render an identical mobile tree.\n */\nexport const PanelMobile = ({ shell }: { shell: TypePanelShell }) => {\n  const {\n    rest,\n    children,\n    closeButtonLabel,\n    header,\n    headerless,\n    footer,\n    title,\n    titleId,\n    zIndex,\n    snapPoints,\n    defaultSnapPoint,\n    snapPoint,\n    onSnapPointChange,\n    snapToSequentialPoints,\n    actions,\n    actionsInHeader,\n    ariaLabel,\n    isPanelOpen,\n    closePanel,\n    enrichedValue,\n    effectiveAriaLabelledBy,\n  } = shell;\n\n  // With `actionsInHeader`, Drawer suppresses the floating rail and expects the\n  // consumer to render the actions inside a custom header. Auto-compose one\n  // (title + action pills + close pill) when the consumer hasn't supplied their\n  // own header; otherwise we'd drop `actions` on the floor.\n  const shouldRenderActionsHeader =\n    !headerless &&\n    header == null &&\n    actionsInHeader === true &&\n    !!actions &&\n    actions.length > 0;\n\n  // Headerless suppresses the built-in header entirely; the children own all\n  // chrome in that mode.\n  let defaultMobileHeader: React.ReactNode = null;\n  if (!headerless) {\n    defaultMobileHeader = shouldRenderActionsHeader ? (\n      <PanelMobileActionsHeader\n        title={title}\n        titleId={titleId}\n        actions={actions!}\n      />\n    ) : (\n      <Drawer.Header title={title} id={titleId} />\n    );\n  }\n\n  return (\n    <PanelContext.Provider value={enrichedValue}>\n      <Drawer\n        {...rest}\n        open={isPanelOpen}\n        onClose={closePanel}\n        direction=\"bottom\"\n        closeButtonLabel={closeButtonLabel}\n        zIndex={zIndex}\n        snapPoints={snapPoints}\n        defaultSnapPoint={defaultSnapPoint}\n        snapPoint={snapPoint}\n        onSnapPointChange={onSnapPointChange}\n        snapToSequentialPoints={snapToSequentialPoints}\n        actions={actions}\n        actionsInHeader={actionsInHeader}\n        aria-labelledby={effectiveAriaLabelledBy}\n        aria-label={ariaLabel}\n      >\n        {header ?? defaultMobileHeader}\n        <PanelContent>{children}</PanelContent>\n        {footer}\n      </Drawer>\n    </PanelContext.Provider>\n  );\n};\n","import * as React from \"react\";\nimport Button from \"@sproutsocial/seeds-react-button\";\nimport Drawer from \"@sproutsocial/seeds-react-drawer\";\nimport Icon from \"@sproutsocial/seeds-react-icon\";\n// eslint-disable-next-line import/no-deprecated\nimport Text from \"@sproutsocial/seeds-react-text\";\nimport type { TypeDrawerActionProps } from \"@sproutsocial/seeds-react-drawer\";\n\ninterface TypePanelMobileActionsHeaderProps {\n  title?: string;\n  titleId?: string;\n  actions: TypeDrawerActionProps[];\n}\n\n/**\n * Mobile bottom-sheet header used by Panel when `actionsInHeader` is set and\n * no custom `header` is provided. Renders the title on the left and the\n * forwarded actions plus a close button as pills on the right — mirrors the\n * pattern in `seeds-react-peek-in/PeekIn.tsx`. The Drawer's floating rail is\n * suppressed in this combination (`actionsInHeader` opts out), so without this\n * header the actions would render nowhere.\n *\n * This header is composed internally by Panel (it receives no consumer\n * styled-system props), so its chrome is emitted directly as `seeds-panel-*`\n * classes from panel.css rather than through a styled `Box`.\n */\nexport const PanelMobileActionsHeader = ({\n  title,\n  titleId,\n  actions,\n}: TypePanelMobileActionsHeaderProps) => (\n  <Drawer.Header\n    render={(ctx) => (\n      <div className=\"seeds-panel-mobile-actions-header\">\n        <Text\n          as=\"h2\"\n          fontSize={400}\n          fontWeight=\"semibold\"\n          color=\"text.headline\"\n          id={titleId}\n        >\n          {title}\n        </Text>\n        <div className=\"seeds-panel-mobile-actions-buttons\">\n          {actions.map((action, i) => (\n            <Button\n              key={i}\n              appearance=\"pill\"\n              aria-label={action[\"aria-label\"]}\n              onClick={action.onClick}\n              disabled={action.disabled}\n            >\n              {action.iconName && <Icon aria-hidden name={action.iconName} />}\n            </Button>\n          ))}\n          <Button\n            appearance=\"pill\"\n            aria-label={ctx.closeButtonLabel}\n            onClick={ctx.onClose}\n          >\n            <Icon aria-hidden name=\"x-outline\" />\n          </Button>\n        </div>\n      </div>\n    )}\n  />\n);\n\nPanelMobileActionsHeader.displayName = \"PanelMobileActionsHeader\";\n","import { PanelContext } from \"./PanelContext\";\nimport { PanelHeader } from \"./PanelHeader\";\nimport { PanelContent } from \"./PanelContent\";\nimport { PanelMobile } from \"./PanelMobile\";\nimport { PanelContainer, PanelInner } from \"./styles\";\nimport { usePanelShell } from \"./PanelShared\";\nimport type { TypePanelProps } from \"./PanelTypes\";\n\n/**\n * Styled-components shell — the backward-compatible fallback. The hybrid router\n * sends consumers here whenever they pass a `COMMON`-mixin styled-system prop\n * (e.g. `mt`, `mb`, `mr`) or a `styled()` extension, so the full styled prop\n * surface on the outer container keeps working exactly as before.\n */\nexport const PanelStyled = (props: TypePanelProps) => {\n  const shell = usePanelShell(props);\n  const {\n    rest,\n    header,\n    headerless,\n    footer,\n    title,\n    titleId,\n    direction,\n    width,\n    gap,\n    id,\n    ariaLabel,\n    isPanelOpen,\n    isMobile,\n    enrichedValue,\n    renderedChildren,\n    effectiveAriaLabelledBy,\n  } = shell;\n\n  if (isMobile) {\n    return <PanelMobile shell={shell} />;\n  }\n\n  return (\n    <PanelContext.Provider value={enrichedValue}>\n      <PanelContainer\n        {...rest}\n        $isOpen={isPanelOpen}\n        $direction={direction}\n        $width={width}\n        $gap={gap}\n        data-qa-panel={id}\n        data-qa-panel-isopen={isPanelOpen}\n        aria-labelledby={effectiveAriaLabelledBy}\n        aria-label={ariaLabel}\n      >\n        <PanelInner $direction={direction} $width={width}>\n          {header ??\n            (headerless ? null : <PanelHeader title={title} id={titleId} />)}\n          <PanelContent>{renderedChildren}</PanelContent>\n          {footer}\n        </PanelInner>\n      </PanelContainer>\n    </PanelContext.Provider>\n  );\n};\n","import * as React from \"react\";\nimport { PanelContext } from \"./PanelContext\";\nimport { PanelHeader } from \"./PanelHeader\";\nimport { PanelContent } from \"./PanelContent\";\nimport { PanelMobile } from \"./PanelMobile\";\nimport {\n  cn,\n  usePanelShell,\n  getPanelContainerStyle,\n  getPanelInnerStyle,\n} from \"./PanelShared\";\nimport type { TypePanelProps } from \"./PanelTypes\";\n\n/**\n * Tailwind/CSS-class shell — the preferred path, routed to by the hybrid when\n * the consumer passes no styled-system props or `styled()` extension. Renders a\n * plain `<aside>` (implicit `complementary` role) with the `seeds-panel` classes\n * from panel.css instead of a styled container. Runtime geometry (flex-basis,\n * gap margin, direction shape, inner min-width/min-height) is applied inline\n * because the jsdom tests assert those as computed styles and panel.css is not\n * loaded there. The mobile path renders identically to the styled shell via\n * the shared `PanelMobile`.\n */\nexport const PanelTailwind = (props: TypePanelProps) => {\n  const shell = usePanelShell(props);\n  const {\n    rest,\n    header,\n    headerless,\n    footer,\n    title,\n    titleId,\n    direction,\n    width,\n    gap,\n    id,\n    ariaLabel,\n    isPanelOpen,\n    isMobile,\n    enrichedValue,\n    renderedChildren,\n    effectiveAriaLabelledBy,\n  } = shell;\n\n  if (isMobile) {\n    return <PanelMobile shell={shell} />;\n  }\n\n  // `rest` carries only non-styled pass-through props on this path (the gate\n  // routes styled-system props to PanelStyled). Peel off className/style so we\n  // can merge them onto the component's own class and inline geometry rather\n  // than letting a spread clobber them.\n  const { className, style, ...domRest } = rest as {\n    className?: string;\n    style?: React.CSSProperties;\n  } & Record<string, unknown>;\n\n  const containerStyle = getPanelContainerStyle(\n    direction,\n    width,\n    gap,\n    isPanelOpen\n  );\n  const innerStyle = getPanelInnerStyle(direction, width);\n\n  return (\n    <PanelContext.Provider value={enrichedValue}>\n      <aside\n        {...domRest}\n        className={cn(\"seeds-panel\", className)}\n        style={{ ...containerStyle, ...style }}\n        data-qa-panel={id}\n        data-qa-panel-isopen={isPanelOpen}\n        aria-labelledby={effectiveAriaLabelledBy}\n        aria-label={ariaLabel}\n      >\n        <div className=\"seeds-panel-inner\" style={innerStyle}>\n          {header ??\n            (headerless ? null : <PanelHeader title={title} id={titleId} />)}\n          <PanelContent>{renderedChildren}</PanelContent>\n          {footer}\n        </div>\n      </aside>\n    </PanelContext.Provider>\n  );\n};\n","import * as React from \"react\";\nimport { needsStyledComponents } from \"@sproutsocial/seeds-react-system-props\";\nimport { Footer } from \"./styles\";\nimport { cn } from \"./PanelShared\";\nimport type { TypePanelFooterProps } from \"./PanelTypes\";\n\n/**\n * Styled-components footer — the backward-compatible fallback. Routed to when\n * the consumer passes styled-system props (e.g. `<Panel.Footer bg=\"...\">`).\n */\nconst PanelFooterStyled = ({ children, ...rest }: TypePanelFooterProps) => (\n  <Footer p={450} data-panel-footer=\"\" {...rest}>\n    {children}\n  </Footer>\n);\n\n/**\n * Tailwind/CSS-class footer — the preferred path. Renders a plain\n * `<div data-panel-footer>` with the `seeds-panel-footer` class from panel.css.\n *\n * `margin-bottom: var(--bleed, 0px)` lifts the footer above the Drawer's mobile\n * bottom-sheet bleed (see styles.ts). It is asserted by the jsdom tests and the\n * `--bleed` var is only set at runtime by the mobile Drawer, so it is applied\n * inline (falling back to 0px on desktop).\n */\nconst PanelFooterTailwind = ({ children, ...rest }: TypePanelFooterProps) => {\n  const { className, style, ...domRest } = rest as {\n    className?: string;\n    style?: React.CSSProperties;\n  } & Record<string, unknown>;\n\n  return (\n    <div\n      className={cn(\"seeds-panel-footer\", className)}\n      style={{ marginBottom: \"var(--bleed, 0px)\", ...style }}\n      data-panel-footer=\"\"\n      {...domRest}\n    >\n      {children}\n    </div>\n  );\n};\n\n/**\n * Hybrid footer router. Routes on the leftover props after the footer's own\n * props are removed.\n */\nexport const PanelFooter = (props: TypePanelFooterProps) => {\n  const { children, ...rest } = props;\n\n  if (needsStyledComponents(rest)) {\n    return <PanelFooterStyled {...props} />;\n  }\n\n  return <PanelFooterTailwind {...props} />;\n};\n\nPanelFooter.displayName = \"Panel.Footer\";\n","import { PanelHybrid } from \"./PanelHybrid\";\nimport { PanelHeader } from \"./PanelHeader\";\nimport { PanelContent } from \"./PanelContent\";\nimport { PanelCloseButton } from \"./PanelCloseButton\";\nimport { PanelFooter } from \"./PanelFooter\";\nimport type { TypePanelProps } from \"./PanelTypes\";\n\n/**\n * Panel compound component. Automatically routes between the Tailwind\n * implementation (preferred, no runtime CSS-in-JS) and the styled-components\n * implementation (for consumers using styled-system props or a `styled()`\n * extension). Public API, exports, and the `.Header/.Content/.CloseButton/\n * .Footer` static attachments are unchanged.\n */\nconst PanelComponent = (props: TypePanelProps) => <PanelHybrid {...props} />;\n\nPanelComponent.displayName = \"Panel\";\nPanelComponent.Header = PanelHeader;\nPanelComponent.Content = PanelContent;\nPanelComponent.CloseButton = PanelCloseButton;\nPanelComponent.Footer = PanelFooter;\n\nexport const Panel = PanelComponent;\nexport default PanelComponent;\n","import * as React from \"react\";\nimport { PanelContext } from \"./PanelContext\";\nimport type { TypePanelContext, TypePanelProviderProps } from \"./PanelTypes\";\n\nexport const PanelProvider = ({\n  children,\n  defaultOpen = false,\n  open: controlledOpen,\n  onOpenChange,\n}: TypePanelProviderProps) => {\n  const [internalOpen, setInternalOpen] = React.useState(defaultOpen);\n  const isControlled = controlledOpen !== undefined;\n  const isPanelOpen = isControlled ? controlledOpen : internalOpen;\n\n  const setOpen = React.useCallback(\n    (next: boolean) => {\n      if (!isControlled) setInternalOpen(next);\n      onOpenChange?.(next);\n    },\n    [isControlled, onOpenChange]\n  );\n\n  const openPanel = React.useCallback(() => setOpen(true), [setOpen]);\n  const closePanel = React.useCallback(() => setOpen(false), [setOpen]);\n  const togglePanel = React.useCallback(\n    () => setOpen(!isPanelOpen),\n    [setOpen, isPanelOpen]\n  );\n\n  const value = React.useMemo<TypePanelContext>(\n    () => ({ isPanelOpen, openPanel, closePanel, togglePanel }),\n    [isPanelOpen, openPanel, closePanel, togglePanel]\n  );\n\n  return (\n    <PanelContext.Provider value={value}>{children}</PanelContext.Provider>\n  );\n};\n","import * as React from \"react\";\nimport type {\n  TypeSystemCommonProps,\n  TypeStyledComponentsCommonProps,\n} from \"@sproutsocial/seeds-react-system-props\";\nimport type { TypeBoxProps } from \"@sproutsocial/seeds-react-box\";\nimport type { TypeButtonProps } from \"@sproutsocial/seeds-react-button\";\nimport type {\n  TypeDrawerSnapPoint,\n  TypeDrawerActionProps,\n} from \"@sproutsocial/seeds-react-drawer\";\n\nexport type { TypeDrawerActionProps as TypePanelActionProps };\n\nexport type PanelDirection = \"left\" | \"right\" | \"bottom\";\n\nexport interface TypePanelContext {\n  isPanelOpen: boolean;\n  togglePanel: () => void;\n  openPanel: () => void;\n  closePanel: () => void;\n  closeButtonLabel?: string;\n  /**\n   * Set by `Panel` when rendered headerless. `Panel.Content` reads this to\n   * render flush (no padding) and defer overflow scrolling to its children.\n   */\n  headerless?: boolean;\n}\n\nexport interface TypePanelProviderProps {\n  children: React.ReactNode;\n  /** Initial open state for uncontrolled usage. */\n  defaultOpen?: boolean;\n  /** Controlled open state. When provided, the provider becomes controlled. */\n  open?: boolean;\n  /** Called whenever the open state changes. Required for controlled usage. */\n  onOpenChange?: (open: boolean) => void;\n}\n\nexport interface TypePanelProps\n  extends TypeStyledComponentsCommonProps,\n    TypeSystemCommonProps,\n    Omit<React.ComponentPropsWithoutRef<\"div\">, \"color\"> {\n  children: React.ReactNode;\n\n  /** Label for the close button. Usually \"Close\". */\n  closeButtonLabel: string;\n\n  /**\n   * Custom header content. When provided, replaces the auto-rendered default\n   * header entirely — `title` and `titleId` are ignored.\n   */\n  header?: React.ReactNode;\n\n  /** Custom footer content. Not rendered when omitted. */\n  footer?: React.ReactNode;\n\n  /**\n   * Renders children flush, without the built-in header/close button or content\n   * padding, and lets the children own overflow scrolling. Use when the content\n   * provides its own chrome (e.g. an embedded agent UI). Provide `aria-label`\n   * (or `aria-labelledby`) for an accessible name, since no header title is\n   * rendered. `title`, `titleId`, and `closeButtonLabel` are ignored in this\n   * mode. Defaults to false.\n   */\n  headerless?: boolean;\n\n  /** Title shown in the auto-rendered default header. Ignored when `header` is provided. */\n  title?: string;\n\n  /**\n   * Sets the `id` on the title element of the auto-rendered header. When the\n   * default header is used, Panel automatically wires `aria-labelledby` to this\n   * id so the dialog/aside has an accessible name. Pass an explicit\n   * `aria-labelledby` to override (e.g. when pointing at a different element).\n   * Ignored when `header` is provided — supply your own `aria-labelledby` in\n   * that case.\n   */\n  titleId?: string;\n\n  /** Side the panel anchors to on desktop. Defaults to \"right\". */\n  direction?: PanelDirection;\n\n  /**\n   * Width (px) when direction is \"left\" or \"right\", or height (px) when\n   * direction is \"bottom\". Defaults to 384 to match the existing web-app-core\n   * Panel.\n   */\n  width?: number;\n\n  /**\n   * Visual gap (px) between the panel and the adjacent content. Applied as\n   * margin on the side facing the content (left when direction=\"right\",\n   * right when direction=\"left\", top when direction=\"bottom\"). Animates with\n   * the panel's open/close transition and collapses to 0 when closed so the\n   * gap does not remain visible alongside a zero-width panel. Defaults to 0.\n   */\n  gap?: number;\n\n  /**\n   * Forwarded to `useIsMobile`. Accepts a px number or any CSS media-query\n   * length. Below this width, the panel renders as an overlay bottom sheet\n   * (via seeds-react-drawer). Defaults to the theme's `breakpoints.sm`.\n   */\n  mobileBreakpoint?: number | string;\n\n  /** Applies only to the mobile bottom-sheet rendering. */\n  zIndex?: number;\n\n  /** Optional id used for data-qa-panel attributes. */\n  id?: string;\n\n  /**\n   * Snap points the panel can rest at when rendered as a mobile bottom sheet.\n   * Numbers 0–1 are viewport-height fractions; numbers > 1 are pixels; strings\n   * accept `px`/`rem` (e.g. `\"480px\"`, `\"30rem\"`). Order matters — the last\n   * entry is the \"expanded\" state. Ignored on the desktop side-panel rendering.\n   */\n  snapPoints?: TypeDrawerSnapPoint[];\n\n  /** Initial snap point for uncontrolled use. Mobile only. */\n  defaultSnapPoint?: TypeDrawerSnapPoint | null;\n\n  /** Controlled active snap point. Pair with `onSnapPointChange`. Mobile only. */\n  snapPoint?: TypeDrawerSnapPoint | null;\n\n  /** Fires when the active snap point changes. Mobile only. */\n  onSnapPointChange?: (snapPoint: TypeDrawerSnapPoint | null) => void;\n\n  /**\n   * When true, fast swipes can't skip past adjacent snap points. Mobile only.\n   */\n  snapToSequentialPoints?: boolean;\n\n  /**\n   * Action buttons shown in a floating rail above the panel on mobile (the\n   * bottom-sheet rendering). Ignored on desktop side-panel rendering — pass\n   * actions through `header`/`footer` slots there. The rail owns the close\n   * button so the default header omits its built-in close affordance.\n   */\n  actions?: TypeDrawerActionProps[];\n\n  /**\n   * Opt out of the floating mobile rail and render the `actions` inline in the\n   * header as pill buttons instead. Useful for nested bottom sheets and\n   * snap-point layouts where the floating rail would collide with surrounding\n   * UI. Defaults to `false`.\n   *\n   * When `header` is omitted, Panel auto-composes a mobile header that renders\n   * the title, the `actions` as pills, and a close-button pill. When `header`\n   * is provided, the consumer is responsible for rendering the actions inside\n   * their own header — `actions` is forwarded for context only.\n   */\n  actionsInHeader?: boolean;\n}\n\nexport interface TypePanelHeaderProps extends TypeBoxProps {\n  title?: string;\n  /**\n   * When children are provided, `<Panel.CloseButton />` is NOT rendered\n   * automatically. Include it yourself to preserve keyboard accessibility.\n   */\n  children?: React.ReactNode;\n  /** Render-prop override that receives the parent panel context. */\n  render?: React.FC<TypePanelContext>;\n}\n\nexport interface TypePanelContentProps extends TypeBoxProps {\n  children?: React.ReactNode;\n}\n\nexport interface TypePanelFooterProps extends TypeBoxProps {\n  children?: React.ReactNode;\n}\n\nexport interface TypePanelCloseButtonProps\n  extends Omit<TypeButtonProps, \"children\"> {\n  /** Render-prop override that receives the parent panel context. */\n  render?: React.FC<TypePanelContext>;\n  children?: React.ReactNode;\n}\n"],"mappings":"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","names":["import_seeds_react_system_props","React","Button","Icon","React","import_jsx_runtime","Box","Text","React","import_seeds_react_system_props","import_seeds_react_system_props","import_seeds_react_box","styled","Box","import_jsx_runtime","React","import_seeds_react_drawer","React","import_seeds_react_button","import_seeds_react_icon","import_seeds_react_text","import_jsx_runtime","Drawer","Text","Button","Icon","import_jsx_runtime","Drawer","import_jsx_runtime","React","import_jsx_runtime","import_jsx_runtime","React","import_seeds_react_system_props","import_jsx_runtime","import_jsx_runtime","React","import_jsx_runtime","React"]}
+{"version":3,"sources":["../src/index.ts","../src/PanelHybrid.tsx","../src/PanelContext.tsx","../src/PanelHeader.tsx","../src/PanelCloseButton.tsx","../src/PanelShared.tsx","../src/PanelContent.tsx","../src/styles.ts","../src/PanelMobile.tsx","../src/PanelMobileActionsHeader.tsx","../src/PanelStyled.tsx","../src/PanelTailwind.tsx","../src/PanelFooter.tsx","../src/Panel.tsx","../src/PanelProvider.tsx","../src/PanelTypes.ts"],"sourcesContent":["import Panel from \"./Panel\";\n\nexport default Panel;\nexport { Panel };\nexport { PanelContext, usePanelContext } from \"./PanelContext\";\nexport { PanelProvider } from \"./PanelProvider\";\nexport { PanelHeader } from \"./PanelHeader\";\nexport { PanelContent } from \"./PanelContent\";\nexport { PanelCloseButton } from \"./PanelCloseButton\";\nexport { PanelFooter } from \"./PanelFooter\";\nexport * from \"./PanelTypes\";\n","import { needsStyledComponents } from \"@sproutsocial/seeds-react-system-props\";\nimport { PanelStyled } from \"./PanelStyled\";\nimport { PanelTailwind } from \"./PanelTailwind\";\nimport type { TypePanelProps } from \"./PanelTypes\";\n\n/**\n * Hybrid Panel router. Chooses the styled-components path when the consumer\n * passes a styled-system (`COMMON`) prop or a `styled()` extension, otherwise\n * the preferred Tailwind path.\n *\n * The routing decision runs on the *leftover* props after Panel's own domain\n * props are destructured — critically, `width` and `zIndex` are Panel domain\n * props whose names also appear in `STYLED_SYSTEM_PROPS`. Gating on the full\n * prop object would push almost every real Panel usage (anything setting\n * `width`) onto the styled path and defeat the migration, so we exclude the\n * domain props first and gate only on `rest`.\n */\nexport const PanelHybrid = (props: TypePanelProps) => {\n  const {\n    children,\n    closeButtonLabel,\n    header,\n    headerless,\n    footer,\n    title,\n    titleId,\n    direction,\n    width,\n    gap,\n    mobileBreakpoint,\n    zIndex,\n    id,\n    snapPoints,\n    defaultSnapPoint,\n    snapPoint,\n    onSnapPointChange,\n    snapToSequentialPoints,\n    actions,\n    actionsInHeader,\n    \"aria-labelledby\": ariaLabelledBy,\n    \"aria-label\": ariaLabel,\n    ...rest\n  } = props;\n\n  if (needsStyledComponents(rest)) {\n    return <PanelStyled {...props} />;\n  }\n\n  return <PanelTailwind {...props} />;\n};\n\nPanelHybrid.displayName = \"Panel\";\n","import * as React from \"react\";\nimport type { TypePanelContext } from \"./PanelTypes\";\n\nexport const PanelContext = React.createContext<TypePanelContext | null>(null);\n\nexport const usePanelContext = (): TypePanelContext => {\n  const ctx = React.useContext(PanelContext);\n  if (!ctx) {\n    throw new Error(\n      \"usePanelContext must be used within a <PanelProvider>. Wrap the consuming tree in <PanelProvider> to provide isPanelOpen / togglePanel.\"\n    );\n  }\n  return ctx;\n};\n","import Box from \"@sproutsocial/seeds-react-box\";\nimport Text from \"@sproutsocial/seeds-react-text\";\nimport { needsStyledComponents } from \"@sproutsocial/seeds-react-system-props\";\nimport { usePanelContext } from \"./PanelContext\";\nimport { PanelCloseButton } from \"./PanelCloseButton\";\nimport { cn } from \"./PanelShared\";\nimport type { TypePanelHeaderProps } from \"./PanelTypes\";\n\n/**\n * Styled-components header — the backward-compatible fallback. The hybrid\n * router sends consumers here whenever they pass styled-system props (e.g.\n * `<Panel.Header alignItems=\"center\">`) or a `styled()` extension, so the full\n * `Box` prop surface keeps working.\n */\nconst PanelHeaderStyled = ({\n  title = \"\",\n  id = undefined,\n  children,\n  render,\n  ...rest\n}: TypePanelHeaderProps) => (\n  <Box\n    display=\"flex\"\n    flex=\"0 0 auto\"\n    justifyContent=\"space-between\"\n    alignItems=\"center\"\n    p={400}\n    borderBottom=\"1px solid\"\n    borderColor=\"container.border.base\"\n    {...rest}\n  >\n    {children || (\n      <>\n        <Text.Headline id={id}>{title}</Text.Headline>\n        <PanelCloseButton />\n      </>\n    )}\n  </Box>\n);\n\n/**\n * Tailwind/CSS-class header — the preferred path. Renders a plain `<div>` with\n * the `seeds-panel-header` class from panel.css instead of a styled `Box`. The\n * `render` prop is handled by the hybrid before reaching here.\n */\nconst PanelHeaderTailwind = ({\n  title = \"\",\n  id = undefined,\n  children,\n  render,\n  ...rest\n}: TypePanelHeaderProps) => {\n  const { className, ...domRest } = rest as {\n    className?: string;\n  } & Record<string, unknown>;\n\n  return (\n    <div className={cn(\"seeds-panel-header\", className)} {...domRest}>\n      {children || (\n        <>\n          <Text.Headline id={id}>{title}</Text.Headline>\n          <PanelCloseButton />\n        </>\n      )}\n    </div>\n  );\n};\n\n/**\n * Hybrid header router. The `render` escape hatch short-circuits before any\n * routing (matching the original always-styled behaviour); otherwise it routes\n * on the leftover props after the header's own props are removed.\n */\nexport const PanelHeader = (props: TypePanelHeaderProps) => {\n  const panelContext = usePanelContext();\n\n  if (props.render) {\n    return props.render(panelContext);\n  }\n\n  const { title, id, children, render, ...rest } = props;\n\n  if (needsStyledComponents(rest)) {\n    return <PanelHeaderStyled {...props} />;\n  }\n\n  return <PanelHeaderTailwind {...props} />;\n};\n\nPanelHeader.displayName = \"Panel.Header\";\n","import * as React from \"react\";\nimport Button from \"@sproutsocial/seeds-react-button\";\nimport Icon from \"@sproutsocial/seeds-react-icon\";\nimport { usePanelContext } from \"./PanelContext\";\nimport type { TypePanelCloseButtonProps } from \"./PanelTypes\";\n\nexport const PanelCloseButton = (props: TypePanelCloseButtonProps) => {\n  const panelContext = usePanelContext();\n\n  if (props.render) {\n    return props.render(panelContext) ?? null;\n  }\n\n  return (\n    <Button\n      appearance=\"pill\"\n      aria-label={panelContext.closeButtonLabel}\n      onClick={panelContext.closePanel}\n      {...props}\n    >\n      {props.children || (\n        <Icon aria-hidden name=\"collapse-panel-right-outline\" />\n      )}\n    </Button>\n  );\n};\n\nPanelCloseButton.displayName = \"Panel.CloseButton\";\n","import * as React from \"react\";\nimport { useIsMobile } from \"@sproutsocial/seeds-react-hooks\";\nimport { usePanelContext } from \"./PanelContext\";\nimport type {\n  PanelDirection,\n  TypePanelProps,\n  TypePanelContext,\n} from \"./PanelTypes\";\n\n/**\n * Class-name merge helper. Copied intentionally rather than imported from\n * `@sproutsocial/seeds-react-utilities` — `cn` is not exported there, so each\n * migrated Tailwind component carries its own copy (mirrors AvatarTailwind /\n * DrawerShared). Because Panel is a multi-part component, the helper lives once\n * here and is imported by every Tailwind sub-component instead of being\n * duplicated in each file.\n */\nexport function cn(\n  ...inputs: (string | undefined | null | false | Record<string, boolean>)[]\n): string {\n  const classes: string[] = [];\n\n  for (const input of inputs) {\n    if (!input) continue;\n\n    if (typeof input === \"string\") {\n      classes.push(input);\n    } else if (typeof input === \"object\") {\n      for (const [key, value] of Object.entries(input)) {\n        if (value) {\n          classes.push(key);\n        }\n      }\n    }\n  }\n\n  return classes.join(\" \");\n}\n\n/**\n * Dynamic geometry for the outer `<aside>` on the Tailwind path. These values\n * depend on runtime props (open state, width, gap, direction) and are asserted\n * as computed styles by the jsdom tests, so they must be inline `style` rather\n * than CSS-variable-driven classes (panel.css is not loaded under jsdom). The\n * static chrome (background, radius, transition, overflow, flex-grow/shrink)\n * lives in panel.css.\n *\n * The gap sits on the margin edge facing the adjacent content: left when the\n * panel anchors right, right when it anchors left, top when it anchors to the\n * bottom (mirrors `gapSide` in styles.ts).\n */\nexport const getPanelContainerStyle = (\n  direction: PanelDirection,\n  width: number,\n  gap: number,\n  isPanelOpen: boolean\n): React.CSSProperties => {\n  const gapValue = isPanelOpen && gap ? `${gap}px` : \"0px\";\n  const style: React.CSSProperties = {\n    flexBasis: isPanelOpen ? `${width}px` : \"0px\",\n  };\n\n  if (direction === \"bottom\") {\n    style.width = \"100%\";\n  } else {\n    style.alignSelf = \"stretch\";\n  }\n\n  if (direction === \"right\") {\n    style.marginLeft = gapValue;\n  } else if (direction === \"left\") {\n    style.marginRight = gapValue;\n  } else {\n    style.marginTop = gapValue;\n  }\n\n  return style;\n};\n\n/**\n * Dynamic geometry for the inner layout `<div>` on the Tailwind path. The\n * direction-dependent min-width/min-height come from the `width` prop.\n */\nexport const getPanelInnerStyle = (\n  direction: PanelDirection,\n  width: number\n): React.CSSProperties =>\n  direction === \"bottom\"\n    ? { minHeight: `${width}px`, width: \"100%\" }\n    : { minWidth: `${width}px`, height: \"100%\" };\n\n/**\n * Shared render logic for both the styled and the Tailwind shells: reads the\n * PanelProvider context, enriches it (closeButtonLabel/headerless), freezes the\n * last-rendered children during the collapse, resolves the mobile breakpoint,\n * and computes the auto-wired accessible name. Centralising it here guarantees\n * the two shells stay behaviourally identical — only the desktop container\n * markup differs between them.\n */\nexport const usePanelShell = (props: TypePanelProps) => {\n  const {\n    children,\n    closeButtonLabel,\n    header,\n    headerless = false,\n    footer,\n    title,\n    titleId,\n    direction = \"right\",\n    width = 384,\n    gap = 4,\n    mobileBreakpoint,\n    zIndex,\n    id,\n    snapPoints,\n    defaultSnapPoint,\n    snapPoint,\n    onSnapPointChange,\n    snapToSequentialPoints,\n    actions,\n    actionsInHeader,\n    \"aria-labelledby\": ariaLabelledByProp,\n    \"aria-label\": ariaLabel,\n    ...rest\n  } = props;\n\n  const panelContext = usePanelContext();\n  const { isPanelOpen, closePanel } = panelContext;\n  const isMobile = useIsMobile(mobileBreakpoint);\n\n  // Expose closeButtonLabel through context so PanelCloseButton can read it\n  // without prop drilling — same pattern as DrawerContext.\n  const enrichedValue = React.useMemo<TypePanelContext>(\n    () => ({ ...panelContext, closeButtonLabel, headerless }),\n    [panelContext, closeButtonLabel, headerless]\n  );\n\n  // Freeze the last-rendered children during the collapse so consumers that\n  // conditionally render content don't produce an empty panel shell while the\n  // flex-basis animation runs.\n  const prevChildrenRef = React.useRef<React.ReactNode>(null);\n  if (isPanelOpen) {\n    prevChildrenRef.current = children;\n  }\n  const renderedChildren = isPanelOpen ? children : prevChildrenRef.current;\n\n  // When the consumer relies on the default header, its title element renders\n  // with `id={titleId}`. Auto-wire `aria-labelledby` so the dialog/aside has an\n  // accessible name without forcing every caller to repeat the id.\n  const effectiveAriaLabelledBy =\n    ariaLabelledByProp ?? (!headerless && header == null ? titleId : undefined);\n\n  return {\n    rest,\n    children,\n    closeButtonLabel,\n    header,\n    headerless,\n    footer,\n    title,\n    titleId,\n    direction,\n    width,\n    gap,\n    zIndex,\n    id,\n    snapPoints,\n    defaultSnapPoint,\n    snapPoint,\n    onSnapPointChange,\n    snapToSequentialPoints,\n    actions,\n    actionsInHeader,\n    ariaLabel,\n    isPanelOpen,\n    closePanel,\n    isMobile,\n    enrichedValue,\n    renderedChildren,\n    effectiveAriaLabelledBy,\n  };\n};\n\n/**\n * The shared shell values consumed by both the styled and the Tailwind desktop\n * shells and by the shared mobile render. Inferred from `usePanelShell` so the\n * `rest` pass-through keeps its precise type (mirrors `TypeDrawerShell`).\n */\nexport type TypePanelShell = ReturnType<typeof usePanelShell>;\n","import * as React from \"react\";\nimport { needsStyledComponents } from \"@sproutsocial/seeds-react-system-props\";\nimport { Content } from \"./styles\";\nimport { usePanelContext } from \"./PanelContext\";\nimport { cn } from \"./PanelShared\";\nimport type { TypePanelContentProps } from \"./PanelTypes\";\n\n/**\n * Styled-components content — the backward-compatible fallback. Routed to when\n * the consumer passes styled-system props (e.g. `<Panel.Content color=\"...\">`).\n */\nconst PanelContentStyled = ({ children, ...rest }: TypePanelContentProps) => {\n  // In headerless mode the content renders flush as a flex column and defers\n  // overflow scrolling to its children, so the panel can host content that\n  // owns its own chrome and fills the panel height (e.g. via flex: 1 1 auto).\n  const { headerless } = usePanelContext();\n\n  return (\n    <Content\n      flex=\"1 1 auto\"\n      minHeight=\"0\"\n      p={headerless ? 0 : 450}\n      $scroll={!headerless}\n      color=\"text.body\"\n      data-panel-content=\"\"\n      {...rest}\n    >\n      {children}\n    </Content>\n  );\n};\n\n/**\n * Tailwind/CSS-class content — the preferred path. Renders a plain\n * `<div data-panel-content>` with the `seeds-panel-content` class from\n * panel.css. The scroll behaviour depends on `headerless` (read from context)\n * and is asserted by the jsdom tests, so it is applied inline rather than via\n * the CSS class (panel.css is not loaded under jsdom).\n */\nconst PanelContentTailwind = ({ children, ...rest }: TypePanelContentProps) => {\n  const { headerless } = usePanelContext();\n  const scroll = !headerless;\n\n  const { className, style, ...domRest } = rest as {\n    className?: string;\n    style?: React.CSSProperties;\n  } & Record<string, unknown>;\n\n  const contentStyle: React.CSSProperties = {\n    overflowY: scroll ? \"auto\" : \"hidden\",\n  };\n  // When content owns its own scrolling (headerless), lay out as a flex column\n  // so a child can flex to the panel's full height.\n  if (!scroll) {\n    contentStyle.display = \"flex\";\n    contentStyle.flexDirection = \"column\";\n  }\n  Object.assign(contentStyle, style);\n\n  return (\n    <div\n      className={cn(\n        \"seeds-panel-content\",\n        { \"seeds-panel-content--headerless\": !!headerless },\n        className\n      )}\n      style={contentStyle}\n      data-panel-content=\"\"\n      {...domRest}\n    >\n      {children}\n    </div>\n  );\n};\n\n/**\n * Hybrid content router. Routes on the leftover props after the content's own\n * props are removed.\n */\nexport const PanelContent = (props: TypePanelContentProps) => {\n  const { children, ...rest } = props;\n\n  if (needsStyledComponents(rest)) {\n    return <PanelContentStyled {...props} />;\n  }\n\n  return <PanelContentTailwind {...props} />;\n};\n\nPanelContent.displayName = \"Panel.Content\";\n","import styled, { css } from \"styled-components\";\nimport { COMMON } from \"@sproutsocial/seeds-react-system-props\";\nimport type { TypeSystemCommonProps } from \"@sproutsocial/seeds-react-system-props\";\nimport { MOTION_DURATION_MEDIUM } from \"@sproutsocial/seeds-motion/unitless\";\nimport Box from \"@sproutsocial/seeds-react-box\";\nimport type { PanelDirection } from \"./PanelTypes\";\n\ninterface PanelContainerProps extends TypeSystemCommonProps {\n  $isOpen: boolean;\n  $direction: PanelDirection;\n  $width: number;\n  $gap: number;\n}\n\nconst gapSide = (direction: PanelDirection): \"left\" | \"right\" | \"top\" => {\n  if (direction === \"right\") return \"left\";\n  if (direction === \"left\") return \"right\";\n  return \"top\";\n};\n\nexport const PanelContainer = styled.aside<PanelContainerProps>`\n  background: ${(props) => props.theme.colors.container.background.base};\n  flex-grow: 0;\n  flex-shrink: 0;\n  overflow: hidden;\n  transition: flex-basis ${MOTION_DURATION_MEDIUM}s ease-in-out,\n    margin ${MOTION_DURATION_MEDIUM}s ease-in-out;\n  flex-basis: ${(props) => (props.$isOpen ? `${props.$width}px` : \"0px\")};\n  margin-${(props) => gapSide(props.$direction)}: ${(props) =>\n  props.$isOpen && props.$gap ? `${props.$gap}px` : \"0px\"};\n  border-radius: ${({ theme }) => theme.radii[800]};\n\n  ${(props) =>\n    props.$direction === \"bottom\"\n      ? css`\n          width: 100%;\n        `\n      : css`\n          align-self: stretch;\n        `}\n\n  ${COMMON}\n`;\n\nexport const PanelInner = styled.div<{\n  $direction: PanelDirection;\n  $width: number;\n}>`\n  ${(props) =>\n    props.$direction === \"bottom\"\n      ? css`\n          min-height: ${props.$width}px;\n          width: 100%;\n        `\n      : css`\n          min-width: ${props.$width}px;\n          height: 100%;\n        `}\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n`;\n\nexport const Content = styled(Box)<{ $scroll?: boolean }>`\n  overflow-y: ${({ $scroll = true }) => ($scroll ? \"auto\" : \"hidden\")};\n  /*\n   * When content owns its own scrolling ($scroll false, i.e. headerless), lay\n   * out as a flex column so a child can flex to the panel's full height —\n   * percentage heights can't resolve against a block container here.\n   */\n  ${({ $scroll = true }) =>\n    !$scroll &&\n    css`\n      display: flex;\n      flex-direction: column;\n    `}\n`;\n\nexport const Footer = styled(Box)`\n  flex: 0 0 auto;\n  overflow: hidden;\n  /*\n   * On mobile the Panel renders inside the Drawer's bottom sheet, whose popup\n   * deliberately bleeds 3rem (--bleed) below the viewport for elastic\n   * overscroll (see seeds-react-drawer/src/styles.ts). A footer pinned to the\n   * end of that popup would land inside the bleed and clip below the fold, so\n   * we lift it by the inherited --bleed; the gap left behind shows the popup's\n   * own background, so there is no visible seam. On desktop --bleed is unset,\n   * so the 0px fallback leaves the footer untouched.\n   */\n  margin-bottom: var(--bleed, 0px);\n`;\n","import * as React from \"react\";\nimport Drawer from \"@sproutsocial/seeds-react-drawer\";\nimport { PanelContext } from \"./PanelContext\";\nimport { PanelContent } from \"./PanelContent\";\nimport { PanelMobileActionsHeader } from \"./PanelMobileActionsHeader\";\nimport type { TypePanelShell } from \"./PanelShared\";\n\n/**\n * Mobile bottom-sheet rendering, shared verbatim by both the styled and the\n * Tailwind shells. The mobile path always renders through `Drawer`, which is\n * itself already migrated to the hybrid pattern, so nothing here depends on the\n * root routing gate — the two shells render an identical mobile tree.\n */\nexport const PanelMobile = ({ shell }: { shell: TypePanelShell }) => {\n  const {\n    rest,\n    children,\n    closeButtonLabel,\n    header,\n    headerless,\n    footer,\n    title,\n    titleId,\n    zIndex,\n    snapPoints,\n    defaultSnapPoint,\n    snapPoint,\n    onSnapPointChange,\n    snapToSequentialPoints,\n    actions,\n    actionsInHeader,\n    ariaLabel,\n    isPanelOpen,\n    closePanel,\n    enrichedValue,\n    effectiveAriaLabelledBy,\n  } = shell;\n\n  // With `actionsInHeader`, Drawer suppresses the floating rail and expects the\n  // consumer to render the actions inside a custom header. Auto-compose one\n  // (title + action pills + close pill) when the consumer hasn't supplied their\n  // own header; otherwise we'd drop `actions` on the floor.\n  const shouldRenderActionsHeader =\n    !headerless &&\n    header == null &&\n    actionsInHeader === true &&\n    !!actions &&\n    actions.length > 0;\n\n  // Headerless suppresses the built-in header entirely; the children own all\n  // chrome in that mode.\n  let defaultMobileHeader: React.ReactNode = null;\n  if (!headerless) {\n    defaultMobileHeader = shouldRenderActionsHeader ? (\n      <PanelMobileActionsHeader\n        title={title}\n        titleId={titleId}\n        actions={actions!}\n      />\n    ) : (\n      <Drawer.Header title={title} id={titleId} />\n    );\n  }\n\n  return (\n    <PanelContext.Provider value={enrichedValue}>\n      <Drawer\n        {...rest}\n        open={isPanelOpen}\n        onClose={closePanel}\n        direction=\"bottom\"\n        closeButtonLabel={closeButtonLabel}\n        zIndex={zIndex}\n        snapPoints={snapPoints}\n        defaultSnapPoint={defaultSnapPoint}\n        snapPoint={snapPoint}\n        onSnapPointChange={onSnapPointChange}\n        snapToSequentialPoints={snapToSequentialPoints}\n        actions={actions}\n        actionsInHeader={actionsInHeader}\n        aria-labelledby={effectiveAriaLabelledBy}\n        aria-label={ariaLabel}\n      >\n        {header ?? defaultMobileHeader}\n        <PanelContent>{children}</PanelContent>\n        {footer}\n      </Drawer>\n    </PanelContext.Provider>\n  );\n};\n","import * as React from \"react\";\nimport Button from \"@sproutsocial/seeds-react-button\";\nimport Drawer from \"@sproutsocial/seeds-react-drawer\";\nimport Icon from \"@sproutsocial/seeds-react-icon\";\n// eslint-disable-next-line import/no-deprecated\nimport Text from \"@sproutsocial/seeds-react-text\";\nimport type { TypeDrawerActionProps } from \"@sproutsocial/seeds-react-drawer\";\n\ninterface TypePanelMobileActionsHeaderProps {\n  title?: string;\n  titleId?: string;\n  actions: TypeDrawerActionProps[];\n}\n\n/**\n * Mobile bottom-sheet header used by Panel when `actionsInHeader` is set and\n * no custom `header` is provided. Renders the title on the left and the\n * forwarded actions plus a close button as pills on the right — mirrors the\n * pattern in `seeds-react-peek-in/PeekIn.tsx`. The Drawer's floating rail is\n * suppressed in this combination (`actionsInHeader` opts out), so without this\n * header the actions would render nowhere.\n *\n * This header is composed internally by Panel (it receives no consumer\n * styled-system props), so its chrome is emitted directly as `seeds-panel-*`\n * classes from panel.css rather than through a styled `Box`.\n */\nexport const PanelMobileActionsHeader = ({\n  title,\n  titleId,\n  actions,\n}: TypePanelMobileActionsHeaderProps) => (\n  <Drawer.Header\n    render={(ctx) => (\n      <div className=\"seeds-panel-mobile-actions-header\">\n        <Text\n          as=\"h2\"\n          fontSize={400}\n          fontWeight=\"semibold\"\n          color=\"text.headline\"\n          id={titleId}\n        >\n          {title}\n        </Text>\n        <div className=\"seeds-panel-mobile-actions-buttons\">\n          {actions.map((action, i) => (\n            <Button\n              key={i}\n              appearance=\"pill\"\n              aria-label={action[\"aria-label\"]}\n              onClick={action.onClick}\n              disabled={action.disabled}\n            >\n              {action.iconName && <Icon aria-hidden name={action.iconName} />}\n            </Button>\n          ))}\n          <Button\n            appearance=\"pill\"\n            aria-label={ctx.closeButtonLabel}\n            onClick={ctx.onClose}\n          >\n            <Icon aria-hidden name=\"x-outline\" />\n          </Button>\n        </div>\n      </div>\n    )}\n  />\n);\n\nPanelMobileActionsHeader.displayName = \"PanelMobileActionsHeader\";\n","import { PanelContext } from \"./PanelContext\";\nimport { PanelHeader } from \"./PanelHeader\";\nimport { PanelContent } from \"./PanelContent\";\nimport { PanelMobile } from \"./PanelMobile\";\nimport { PanelContainer, PanelInner } from \"./styles\";\nimport { usePanelShell } from \"./PanelShared\";\nimport type { TypePanelProps } from \"./PanelTypes\";\n\n/**\n * Styled-components shell — the backward-compatible fallback. The hybrid router\n * sends consumers here whenever they pass a `COMMON`-mixin styled-system prop\n * (e.g. `mt`, `mb`, `mr`) or a `styled()` extension, so the full styled prop\n * surface on the outer container keeps working exactly as before.\n */\nexport const PanelStyled = (props: TypePanelProps) => {\n  const shell = usePanelShell(props);\n  const {\n    rest,\n    header,\n    headerless,\n    footer,\n    title,\n    titleId,\n    direction,\n    width,\n    gap,\n    id,\n    ariaLabel,\n    isPanelOpen,\n    isMobile,\n    enrichedValue,\n    renderedChildren,\n    effectiveAriaLabelledBy,\n  } = shell;\n\n  if (isMobile) {\n    return <PanelMobile shell={shell} />;\n  }\n\n  return (\n    <PanelContext.Provider value={enrichedValue}>\n      <PanelContainer\n        {...rest}\n        $isOpen={isPanelOpen}\n        $direction={direction}\n        $width={width}\n        $gap={gap}\n        data-qa-panel={id}\n        data-qa-panel-isopen={isPanelOpen}\n        aria-labelledby={effectiveAriaLabelledBy}\n        aria-label={ariaLabel}\n      >\n        <PanelInner $direction={direction} $width={width}>\n          {header ??\n            (headerless ? null : <PanelHeader title={title} id={titleId} />)}\n          <PanelContent>{renderedChildren}</PanelContent>\n          {footer}\n        </PanelInner>\n      </PanelContainer>\n    </PanelContext.Provider>\n  );\n};\n","import * as React from \"react\";\nimport { PanelContext } from \"./PanelContext\";\nimport { PanelHeader } from \"./PanelHeader\";\nimport { PanelContent } from \"./PanelContent\";\nimport { PanelMobile } from \"./PanelMobile\";\nimport {\n  cn,\n  usePanelShell,\n  getPanelContainerStyle,\n  getPanelInnerStyle,\n} from \"./PanelShared\";\nimport type { TypePanelProps } from \"./PanelTypes\";\n\n/**\n * Tailwind/CSS-class shell — the preferred path, routed to by the hybrid when\n * the consumer passes no styled-system props or `styled()` extension. Renders a\n * plain `<aside>` (implicit `complementary` role) with the `seeds-panel` classes\n * from panel.css instead of a styled container. Runtime geometry (flex-basis,\n * gap margin, direction shape, inner min-width/min-height) is applied inline\n * because the jsdom tests assert those as computed styles and panel.css is not\n * loaded there. The mobile path renders identically to the styled shell via\n * the shared `PanelMobile`.\n */\nexport const PanelTailwind = (props: TypePanelProps) => {\n  const shell = usePanelShell(props);\n  const {\n    rest,\n    header,\n    headerless,\n    footer,\n    title,\n    titleId,\n    direction,\n    width,\n    gap,\n    id,\n    ariaLabel,\n    isPanelOpen,\n    isMobile,\n    enrichedValue,\n    renderedChildren,\n    effectiveAriaLabelledBy,\n  } = shell;\n\n  if (isMobile) {\n    return <PanelMobile shell={shell} />;\n  }\n\n  // `rest` carries only non-styled pass-through props on this path (the gate\n  // routes styled-system props to PanelStyled). Peel off className/style so we\n  // can merge them onto the component's own class and inline geometry rather\n  // than letting a spread clobber them.\n  const { className, style, ...domRest } = rest as {\n    className?: string;\n    style?: React.CSSProperties;\n  } & Record<string, unknown>;\n\n  const containerStyle = getPanelContainerStyle(\n    direction,\n    width,\n    gap,\n    isPanelOpen\n  );\n  const innerStyle = getPanelInnerStyle(direction, width);\n\n  return (\n    <PanelContext.Provider value={enrichedValue}>\n      <aside\n        {...domRest}\n        className={cn(\"seeds-panel\", className)}\n        style={{ ...containerStyle, ...style }}\n        data-qa-panel={id}\n        data-qa-panel-isopen={isPanelOpen}\n        aria-labelledby={effectiveAriaLabelledBy}\n        aria-label={ariaLabel}\n      >\n        <div className=\"seeds-panel-inner\" style={innerStyle}>\n          {header ??\n            (headerless ? null : <PanelHeader title={title} id={titleId} />)}\n          <PanelContent>{renderedChildren}</PanelContent>\n          {footer}\n        </div>\n      </aside>\n    </PanelContext.Provider>\n  );\n};\n","import * as React from \"react\";\nimport { needsStyledComponents } from \"@sproutsocial/seeds-react-system-props\";\nimport { Footer } from \"./styles\";\nimport { cn } from \"./PanelShared\";\nimport type { TypePanelFooterProps } from \"./PanelTypes\";\n\n/**\n * Styled-components footer — the backward-compatible fallback. Routed to when\n * the consumer passes styled-system props (e.g. `<Panel.Footer bg=\"...\">`).\n */\nconst PanelFooterStyled = ({ children, ...rest }: TypePanelFooterProps) => (\n  <Footer p={450} data-panel-footer=\"\" {...rest}>\n    {children}\n  </Footer>\n);\n\n/**\n * Tailwind/CSS-class footer — the preferred path. Renders a plain\n * `<div data-panel-footer>` with the `seeds-panel-footer` class from panel.css.\n *\n * `margin-bottom: var(--bleed, 0px)` lifts the footer above the Drawer's mobile\n * bottom-sheet bleed (see styles.ts). It is asserted by the jsdom tests and the\n * `--bleed` var is only set at runtime by the mobile Drawer, so it is applied\n * inline (falling back to 0px on desktop).\n */\nconst PanelFooterTailwind = ({ children, ...rest }: TypePanelFooterProps) => {\n  const { className, style, ...domRest } = rest as {\n    className?: string;\n    style?: React.CSSProperties;\n  } & Record<string, unknown>;\n\n  return (\n    <div\n      className={cn(\"seeds-panel-footer\", className)}\n      style={{ marginBottom: \"var(--bleed, 0px)\", ...style }}\n      data-panel-footer=\"\"\n      {...domRest}\n    >\n      {children}\n    </div>\n  );\n};\n\n/**\n * Hybrid footer router. Routes on the leftover props after the footer's own\n * props are removed.\n */\nexport const PanelFooter = (props: TypePanelFooterProps) => {\n  const { children, ...rest } = props;\n\n  if (needsStyledComponents(rest)) {\n    return <PanelFooterStyled {...props} />;\n  }\n\n  return <PanelFooterTailwind {...props} />;\n};\n\nPanelFooter.displayName = \"Panel.Footer\";\n","import { PanelHybrid } from \"./PanelHybrid\";\nimport { PanelHeader } from \"./PanelHeader\";\nimport { PanelContent } from \"./PanelContent\";\nimport { PanelCloseButton } from \"./PanelCloseButton\";\nimport { PanelFooter } from \"./PanelFooter\";\nimport type { TypePanelProps } from \"./PanelTypes\";\n\n/**\n * Panel compound component. Automatically routes between the Tailwind\n * implementation (preferred, no runtime CSS-in-JS) and the styled-components\n * implementation (for consumers using styled-system props or a `styled()`\n * extension). Public API, exports, and the `.Header/.Content/.CloseButton/\n * .Footer` static attachments are unchanged.\n */\nconst PanelComponent = (props: TypePanelProps) => <PanelHybrid {...props} />;\n\nPanelComponent.displayName = \"Panel\";\nPanelComponent.Header = PanelHeader;\nPanelComponent.Content = PanelContent;\nPanelComponent.CloseButton = PanelCloseButton;\nPanelComponent.Footer = PanelFooter;\n\nexport const Panel = PanelComponent;\nexport default PanelComponent;\n","import * as React from \"react\";\nimport { PanelContext } from \"./PanelContext\";\nimport type { TypePanelContext, TypePanelProviderProps } from \"./PanelTypes\";\n\nexport const PanelProvider = ({\n  children,\n  defaultOpen = false,\n  open: controlledOpen,\n  onOpenChange,\n}: TypePanelProviderProps) => {\n  const [internalOpen, setInternalOpen] = React.useState(defaultOpen);\n  const isControlled = controlledOpen !== undefined;\n  const isPanelOpen = isControlled ? controlledOpen : internalOpen;\n\n  const setOpen = React.useCallback(\n    (next: boolean) => {\n      if (!isControlled) setInternalOpen(next);\n      onOpenChange?.(next);\n    },\n    [isControlled, onOpenChange]\n  );\n\n  const openPanel = React.useCallback(() => setOpen(true), [setOpen]);\n  const closePanel = React.useCallback(() => setOpen(false), [setOpen]);\n  const togglePanel = React.useCallback(\n    () => setOpen(!isPanelOpen),\n    [setOpen, isPanelOpen]\n  );\n\n  const value = React.useMemo<TypePanelContext>(\n    () => ({ isPanelOpen, openPanel, closePanel, togglePanel }),\n    [isPanelOpen, openPanel, closePanel, togglePanel]\n  );\n\n  return (\n    <PanelContext.Provider value={value}>{children}</PanelContext.Provider>\n  );\n};\n","import * as React from \"react\";\nimport type {\n  TypeSystemCommonProps,\n  TypeStyledComponentsCommonProps,\n} from \"@sproutsocial/seeds-react-system-props\";\nimport type { TypeBoxProps } from \"@sproutsocial/seeds-react-box\";\nimport type { TypeButtonProps } from \"@sproutsocial/seeds-react-button\";\nimport type {\n  TypeDrawerSnapPoint,\n  TypeDrawerActionProps,\n} from \"@sproutsocial/seeds-react-drawer\";\n\nexport type { TypeDrawerActionProps as TypePanelActionProps };\n\nexport type PanelDirection = \"left\" | \"right\" | \"bottom\";\n\nexport interface TypePanelContext {\n  isPanelOpen: boolean;\n  togglePanel: () => void;\n  openPanel: () => void;\n  closePanel: () => void;\n  closeButtonLabel?: string;\n  /**\n   * Set by `Panel` when rendered headerless. `Panel.Content` reads this to\n   * render flush (no padding) and defer overflow scrolling to its children.\n   */\n  headerless?: boolean;\n}\n\nexport interface TypePanelProviderProps {\n  children: React.ReactNode;\n  /** Initial open state for uncontrolled usage. */\n  defaultOpen?: boolean;\n  /** Controlled open state. When provided, the provider becomes controlled. */\n  open?: boolean;\n  /** Called whenever the open state changes. Required for controlled usage. */\n  onOpenChange?: (open: boolean) => void;\n}\n\nexport interface TypePanelProps\n  extends TypeStyledComponentsCommonProps,\n    TypeSystemCommonProps,\n    Omit<React.ComponentPropsWithoutRef<\"div\">, \"color\"> {\n  children: React.ReactNode;\n\n  /** Label for the close button. Usually \"Close\". */\n  closeButtonLabel: string;\n\n  /**\n   * Custom header content. When provided, replaces the auto-rendered default\n   * header entirely — `title` and `titleId` are ignored.\n   */\n  header?: React.ReactNode;\n\n  /** Custom footer content. Not rendered when omitted. */\n  footer?: React.ReactNode;\n\n  /**\n   * Renders children flush, without the built-in header/close button or content\n   * padding, and lets the children own overflow scrolling. Use when the content\n   * provides its own chrome (e.g. an embedded agent UI). Provide `aria-label`\n   * (or `aria-labelledby`) for an accessible name, since no header title is\n   * rendered. `title`, `titleId`, and `closeButtonLabel` are ignored in this\n   * mode. Defaults to false.\n   */\n  headerless?: boolean;\n\n  /** Title shown in the auto-rendered default header. Ignored when `header` is provided. */\n  title?: string;\n\n  /**\n   * Sets the `id` on the title element of the auto-rendered header. When the\n   * default header is used, Panel automatically wires `aria-labelledby` to this\n   * id so the dialog/aside has an accessible name. Pass an explicit\n   * `aria-labelledby` to override (e.g. when pointing at a different element).\n   * Ignored when `header` is provided — supply your own `aria-labelledby` in\n   * that case.\n   */\n  titleId?: string;\n\n  /** Side the panel anchors to on desktop. Defaults to \"right\". */\n  direction?: PanelDirection;\n\n  /**\n   * Width (px) when direction is \"left\" or \"right\", or height (px) when\n   * direction is \"bottom\". Defaults to 384 to match the existing web-app-core\n   * Panel.\n   */\n  width?: number;\n\n  /**\n   * Visual gap (px) between the panel and the adjacent content. Applied as\n   * margin on the side facing the content (left when direction=\"right\",\n   * right when direction=\"left\", top when direction=\"bottom\"). Animates with\n   * the panel's open/close transition and collapses to 0 when closed so the\n   * gap does not remain visible alongside a zero-width panel. Defaults to 0.\n   */\n  gap?: number;\n\n  /**\n   * Forwarded to `useIsMobile`. Accepts a px number or any CSS media-query\n   * length. Below this width, the panel renders as an overlay bottom sheet\n   * (via seeds-react-drawer). Defaults to the theme's `breakpoints.md`.\n   */\n  mobileBreakpoint?: number | string;\n\n  /** Applies only to the mobile bottom-sheet rendering. */\n  zIndex?: number;\n\n  /** Optional id used for data-qa-panel attributes. */\n  id?: string;\n\n  /**\n   * Snap points the panel can rest at when rendered as a mobile bottom sheet.\n   * Numbers 0–1 are viewport-height fractions; numbers > 1 are pixels; strings\n   * accept `px`/`rem` (e.g. `\"480px\"`, `\"30rem\"`). Order matters — the last\n   * entry is the \"expanded\" state. Ignored on the desktop side-panel rendering.\n   */\n  snapPoints?: TypeDrawerSnapPoint[];\n\n  /** Initial snap point for uncontrolled use. Mobile only. */\n  defaultSnapPoint?: TypeDrawerSnapPoint | null;\n\n  /** Controlled active snap point. Pair with `onSnapPointChange`. Mobile only. */\n  snapPoint?: TypeDrawerSnapPoint | null;\n\n  /** Fires when the active snap point changes. Mobile only. */\n  onSnapPointChange?: (snapPoint: TypeDrawerSnapPoint | null) => void;\n\n  /**\n   * When true, fast swipes can't skip past adjacent snap points. Mobile only.\n   */\n  snapToSequentialPoints?: boolean;\n\n  /**\n   * Action buttons shown in a floating rail above the panel on mobile (the\n   * bottom-sheet rendering). Ignored on desktop side-panel rendering — pass\n   * actions through `header`/`footer` slots there. The rail owns the close\n   * button so the default header omits its built-in close affordance.\n   */\n  actions?: TypeDrawerActionProps[];\n\n  /**\n   * Opt out of the floating mobile rail and render the `actions` inline in the\n   * header as pill buttons instead. Useful for nested bottom sheets and\n   * snap-point layouts where the floating rail would collide with surrounding\n   * UI. Defaults to `false`.\n   *\n   * When `header` is omitted, Panel auto-composes a mobile header that renders\n   * the title, the `actions` as pills, and a close-button pill. When `header`\n   * is provided, the consumer is responsible for rendering the actions inside\n   * their own header — `actions` is forwarded for context only.\n   */\n  actionsInHeader?: boolean;\n}\n\nexport interface TypePanelHeaderProps extends TypeBoxProps {\n  title?: string;\n  /**\n   * When children are provided, `<Panel.CloseButton />` is NOT rendered\n   * automatically. Include it yourself to preserve keyboard accessibility.\n   */\n  children?: React.ReactNode;\n  /** Render-prop override that receives the parent panel context. */\n  render?: React.FC<TypePanelContext>;\n}\n\nexport interface TypePanelContentProps extends TypeBoxProps {\n  children?: React.ReactNode;\n}\n\nexport interface TypePanelFooterProps extends TypeBoxProps {\n  children?: React.ReactNode;\n}\n\nexport interface TypePanelCloseButtonProps\n  extends Omit<TypeButtonProps, \"children\"> {\n  /** Render-prop override that receives the parent panel context. */\n  render?: React.FC<TypePanelContext>;\n  children?: React.ReactNode;\n}\n"],"mappings":"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","names":["import_seeds_react_system_props","React","Button","Icon","React","import_jsx_runtime","Box","Text","React","import_seeds_react_system_props","import_seeds_react_system_props","import_seeds_react_box","styled","Box","import_jsx_runtime","React","import_seeds_react_drawer","React","import_seeds_react_button","import_seeds_react_icon","import_seeds_react_text","import_jsx_runtime","Drawer","Text","Button","Icon","import_jsx_runtime","Drawer","import_jsx_runtime","React","import_jsx_runtime","import_jsx_runtime","React","import_seeds_react_system_props","import_jsx_runtime","import_jsx_runtime","React","import_jsx_runtime","React"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sproutsocial/seeds-react-panel",
-  "version": "1.2.1",
+  "version": "1.2.2",
   "description": "Seeds React Panel",
   "author": "Sprout Social, Inc.",
   "license": "MIT",

package/src/PanelTypes.ts

@@ -100,7 +100,7 @@ export interface TypePanelProps
   /**
    * Forwarded to `useIsMobile`. Accepts a px number or any CSS media-query
    * length. Below this width, the panel renders as an overlay bottom sheet
-   * (via seeds-react-drawer). Defaults to the theme's `breakpoints.sm`.
+   * (via seeds-react-drawer). Defaults to the theme's `breakpoints.md`.
    */
   mobileBreakpoint?: number | string;