@sproutsocial/seeds-react-menu 1.17.0 → 1.18.0

package/tsup.config.ts

@@ -3,7 +3,6 @@ import { defineConfig } from "tsup";
 export default defineConfig((options) => ({
   entry: {
     index: "src/index.ts",
-    "v2/index": "src/v2/index.ts",
     "v3/index": "src/v3/index.ts",
   },
   format: ["cjs", "esm"],

package/dist/esm/chunk-ROQATIB7.js

@@ -1,357 +0,0 @@
-// src/MenuContext.tsx
-import React, { createContext, useMemo, useContext } from "react";
-import { jsx } from "react/jsx-runtime";
-var defaultMenuContext = {
-  items: [],
-  itemsMap: {},
-  isItemSelected: () => false,
-  getInputComponentProps: () => ({}),
-  hasVisibleItems: false,
-  isInitialized: false
-};
-var getSelectedItemIds = (selectedItems) => selectedItems?.reduce(
-  (selected, item) => ({ ...selected, [item.id]: true }),
-  {}
-);
-var checkIfItemSelected = ({
-  id,
-  selectedItem,
-  selectedItemIds
-}) => selectedItemIds ? !!selectedItemIds[id] : selectedItem?.id === id;
-var useMenu = ({
-  items = [],
-  isListbox = false,
-  isOpen = false,
-  itemsMap: itemsMapFromProps,
-  selectedItemIds: selectedItemIdsFromProps,
-  selectedItem,
-  selectedItems,
-  getInputProps,
-  contentRef: contentRefFromProps,
-  autoCloseOnEmpty,
-  hiddenItemsCount,
-  ...rest
-} = {}) => {
-  const contentRef = contentRefFromProps || React.createRef();
-  const menuProps = useMemo(() => ({ ...rest }), [rest]);
-  const itemsMap = useMemo(
-    () => itemsMapFromProps || items.reduce((map, item) => {
-      map[`${item.id}`] = {
-        ...item
-      };
-      return map;
-    }, {}),
-    [items, itemsMapFromProps]
-  );
-  const selectedItemIds = useMemo(
-    () => selectedItemIdsFromProps || getSelectedItemIds(selectedItems),
-    [selectedItems, selectedItemIdsFromProps]
-  );
-  const isItemSelected = React.useCallback(
-    (id) => checkIfItemSelected({ id, selectedItem, selectedItemIds }),
-    [selectedItem?.id, selectedItemIds]
-  );
-  const getInputComponentProps = React.useCallback(
-    ({ inputProps, ...props }) => {
-      if (!getInputProps) return {};
-      const {
-        ["aria-activedescendant"]: activedescendant,
-        ["aria-autocomplete"]: autocomplete,
-        ["aria-controls"]: controls,
-        ["aria-expanded"]: expanded,
-        ["aria-labelledby"]: labelledby,
-        role,
-        autoComplete,
-        onClick,
-        value,
-        ...restProps
-      } = getInputProps(props);
-      return {
-        ...restProps,
-        inputProps: {
-          ["aria-activedescendant"]: activedescendant,
-          ["aria-autocomplete"]: autocomplete,
-          ["aria-controls"]: controls,
-          ["aria-expanded"]: expanded,
-          ["aria-labelledby"]: labelledby,
-          role,
-          autoComplete,
-          onClick,
-          value,
-          ...inputProps
-        }
-      };
-    },
-    [getInputProps]
-  );
-  const hasVisibleItems = useMemo(() => {
-    return (hiddenItemsCount ?? 0) < items.length;
-  }, [items, hiddenItemsCount]);
-  return {
-    isOpen,
-    isListbox,
-    items,
-    itemsMap,
-    selectedItem,
-    selectedItems,
-    selectedItemIds,
-    isItemSelected,
-    getInputProps,
-    getInputComponentProps,
-    contentRef,
-    hasVisibleItems,
-    autoCloseOnEmpty,
-    isInitialized: true,
-    ...menuProps
-  };
-};
-var MenuToggleContext = createContext(defaultMenuContext);
-var MenuToggleProvider = ({
-  children,
-  menuContext
-}) => {
-  return /* @__PURE__ */ jsx(MenuToggleContext.Provider, { value: { ...menuContext }, children });
-};
-var useMenuToggleContext = () => {
-  const menuContextValue = useContext(MenuToggleContext);
-  if (menuContextValue === null) {
-    throw new Error(
-      "useMenuToggleContext must be used within a <MenuToggleContext.Provider />"
-    );
-  }
-  return menuContextValue;
-};
-var MenuContentContext = createContext(defaultMenuContext);
-var MenuContentProvider = ({
-  children,
-  menuContext
-}) => {
-  return /* @__PURE__ */ jsx(MenuContentContext.Provider, { value: { ...menuContext }, children });
-};
-var useMenuContentContext = () => {
-  const menuContextValue = useContext(MenuContentContext);
-  if (menuContextValue === null) {
-    throw new Error(
-      "useMenuContentContext must be used within a <MenuContentContext.Provider />"
-    );
-  }
-  return menuContextValue;
-};
-
-// src/MenuItem/styles.tsx
-import styled, { css } from "styled-components";
-import { focusRing, disabled } from "@sproutsocial/seeds-react-mixins";
-import { color, border, flexbox, grid, layout, space } from "styled-system";
-import {
-  CheckboxContainer,
-  InputWrapper,
-  PillInput,
-  checkboxContainerHoverStyles,
-  inputWrapperHoverStyles,
-  pillInputHoverStyles
-} from "@sproutsocial/seeds-react-checkbox";
-var highlightedStyles = css`
-  cursor: pointer;
-  border: 1px solid ${({ theme }) => theme.colors.listItem.border.base};
-  background-color: ${({ theme }) => theme.colors.listItem.background.hover};
-  color: ${({ theme }) => theme.colors.text.body};
-  text-decoration: none;
-`;
-var activeStyles = css`
-  border: 1px solid ${({ theme }) => theme.colors.listItem.border.base};
-  background-color: ${({ theme }) => theme.colors.menuItem.background.active};
-  color: ${({ theme }) => theme.colors.text.body};
-  text-decoration: none;
-`;
-var selectedStyles = css`
-  font-weight: ${({ theme }) => theme.fontWeights.semibold};
-`;
-var MenuItemContainer = styled.li`
-  box-sizing: border-box;
-  list-style-type: none;
-  margin-left: ${({ theme }) => theme.space[300]};
-  margin-right: ${({ theme }) => theme.space[300]};
-
-  &:first-child {
-    margin-top: ${({ theme }) => theme.space[300]};
-  }
-
-  &:last-child {
-    margin-bottom: ${({ theme }) => theme.space[300]};
-  }
-`;
-var StyledMenuItem = styled.button`
-  display: block;
-  box-sizing: border-box;
-  width: 100%;
-  border-radius: ${({ theme }) => theme.radii[500]};
-  background-color: ${({ theme }) => theme.colors.listItem.background.base};
-  border: 1px solid ${({ theme }) => theme.colors.listItem.background.base};
-  color: ${({ theme }) => theme.colors.text.body};
-  font-family: ${({ theme }) => theme.fontFamily};
-  font-weight: ${({ theme }) => theme.fontWeights.normal};
-  text-align: left;
-  text-decoration: none;
-  padding: ${({ theme }) => theme.space[300]};
-  outline: 0;
-  ${({ theme }) => theme.typography[200]};
-  transition: all ${({ theme }) => theme.duration["fast"]};
-
-  /* Highlighted */
-  ${({ $highlighted }) => $highlighted && highlightedStyles}
-
-  /* Hovered, but not focused */
-  &:hover {
-    ${highlightedStyles}
-    ${CheckboxContainer} {
-      ${checkboxContainerHoverStyles}
-    }
-    ${InputWrapper} {
-      ${inputWrapperHoverStyles}
-    }
-    ${PillInput} {
-      ${pillInputHoverStyles}
-    }
-  }
-
-  /* focused */
-  &:focus {
-    ${focusRing}
-  }
-
-  /* Active */
-  ${({ $active }) => $active && activeStyles}
-
-  /* Pressed state*/
-  &:active {
-    ${activeStyles}
-  }
-
-  &[aria-disabled="true"] {
-    cursor: not-allowed;
-    ${disabled}
-  }
-
-  ${({ $selected }) => $selected && selectedStyles}
-
-  ${border}
-  ${color}
-  ${flexbox}
-  ${grid}
-  ${layout}
-  ${space}
-`;
-var MenuItemRow = styled.div`
-  display: flex;
-  align-items: center;
-  pointer-events: none;
-`;
-var MenuItemAction = styled.div`
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  flex-shrink: 0;
-`;
-var MenuItemActionLeft = styled(MenuItemAction)`
-  margin-right: ${({ theme }) => theme.space[300]};
-`;
-var MenuItemActionRight = styled(MenuItemAction)`
-  margin-left: ${({ theme }) => theme.space[300]};
-`;
-var MenuItemText = styled.div`
-  word-break: break-word;
-  flex-grow: 1;
-  min-width: 0;
-`;
-
-// src/MenuToggleButton/MenuToggleButton.tsx
-import { Button } from "@sproutsocial/seeds-react-button";
-import { jsx as jsx2 } from "react/jsx-runtime";
-var MenuToggleButton = (props) => {
-  const { getToggleButtonProps, isListbox, getDropdownProps, ref, ariaProps } = useMenuToggleContext();
-  const {
-    onClick: userOnClick,
-    onKeyDown: userOnKeyDown,
-    onBlur: userOnBlur,
-    ...restProps
-  } = props;
-  const defaultDropdownProps = {
-    ref,
-    onClick: userOnClick,
-    onKeyDown: userOnKeyDown,
-    onBlur: userOnBlur
-  };
-  const dropdownProps = getDropdownProps?.({
-    ...defaultDropdownProps,
-    preventKeyAction: true
-  }) ?? defaultDropdownProps;
-  const toggleButtonProps = getToggleButtonProps?.({
-    ...dropdownProps,
-    refKey: "innerRef",
-    ...ariaProps,
-    ...isListbox ? {} : { role: "button", "aria-haspopup": "menu" }
-  });
-  if (toggleButtonProps && toggleButtonProps["aria-activedescendant"] === "") {
-    toggleButtonProps["aria-activedescendant"] = void 0;
-  }
-  if (toggleButtonProps && toggleButtonProps["aria-expanded"] === false) {
-    toggleButtonProps["aria-controls"] = void 0;
-  }
-  if (toggleButtonProps) {
-    toggleButtonProps["aria-labelledby"] = void 0;
-  }
-  return /* @__PURE__ */ jsx2(Button, { appearance: "secondary", ...toggleButtonProps, ...restProps });
-};
-
-// src/MenuContent/styles.tsx
-import styled2 from "styled-components";
-import {
-  border as border2,
-  color as color2,
-  flexbox as flexbox2,
-  grid as grid2,
-  layout as layout2,
-  position,
-  space as space2
-} from "styled-system";
-var StyledMenuContent = styled2.ul`
-  margin: 0;
-  padding: 0;
-  overflow: auto;
-
-  &:focus {
-    outline: none;
-    box-shadow: none;
-  }
-
-  ${border2}
-  ${color2}
-  ${flexbox2}
-  ${grid2}
-  ${layout2}
-  ${space2}
-  ${position}
-`;
-
-export {
-  defaultMenuContext,
-  getSelectedItemIds,
-  checkIfItemSelected,
-  useMenu,
-  MenuToggleContext,
-  MenuToggleProvider,
-  useMenuToggleContext,
-  MenuContentContext,
-  MenuContentProvider,
-  useMenuContentContext,
-  MenuItemContainer,
-  StyledMenuItem,
-  MenuItemRow,
-  MenuItemAction,
-  MenuItemActionLeft,
-  MenuItemActionRight,
-  MenuItemText,
-  StyledMenuContent,
-  MenuToggleButton
-};
-//# sourceMappingURL=chunk-ROQATIB7.js.map

package/dist/esm/chunk-ROQATIB7.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/MenuContext.tsx","../../src/MenuItem/styles.tsx","../../src/MenuToggleButton/MenuToggleButton.tsx","../../src/MenuContent/styles.tsx"],"sourcesContent":["import React, { createContext, useMemo, useContext } from \"react\";\nimport type {\n  UseComboboxReturnValue,\n  UseComboboxProps,\n  UseSelectReturnValue,\n  UseSelectProps,\n  UseMultipleSelectionReturnValue,\n  UseMultipleSelectionProps,\n} from \"downshift\";\nimport type { TypeTokenInputProps } from \"@sproutsocial/seeds-react-token-input\";\nimport type {\n  TypeInternalItemProps,\n  TypeNotEmptyChildren,\n  TypeDownshiftMergedInputProps,\n} from \"./types\";\n\nexport interface TypeDownshiftComboboxProps\n  extends Partial<UseComboboxProps<TypeInternalItemProps>> {}\n\nexport interface TypeDownshiftSelectProps\n  extends Partial<UseSelectProps<TypeInternalItemProps>> {}\n\nexport interface TypeDownshiftMultiSelectProps\n  extends Partial<\n    Omit<\n      UseMultipleSelectionProps<TypeInternalItemProps>,\n      \"stateReducer\" | \"onStateChange\" | \"getA11yStatusMessage\"\n    >\n  > {\n  // Multi Select Props with conflicting useSelect prop names\n  /** Optional override to the built-in getA11yStatusMessage function for multiple selection*/\n  getA11yMultiStatusMessage?: UseMultipleSelectionProps<TypeInternalItemProps>[\"getA11yStatusMessage\"];\n  /** Optional override to the built-in onStateChange function for multiple selection*/\n  onMultiSelectStateChange?: UseMultipleSelectionProps<TypeInternalItemProps>[\"onStateChange\"];\n  /** Optional override to the built-in stateReducer function for multiple selection*/\n  multiSelectStateReducer?: UseMultipleSelectionProps<TypeInternalItemProps>[\"stateReducer\"];\n}\n\nexport interface TypeDownshiftComboboxReturnValue\n  extends Partial<UseComboboxReturnValue<TypeInternalItemProps>> {}\n\nexport interface TypeDownshiftSelectReturnValue\n  extends Partial<UseSelectReturnValue<TypeInternalItemProps>> {}\n\nexport interface TypeDownshiftMultiSelectReturnValue\n  extends Partial<UseMultipleSelectionReturnValue<TypeInternalItemProps>> {}\n\ntype TypeDonwshiftSharedReturnValue =\n  | \"getLabelProps\"\n  | \"getToggleButtonProps\"\n  | \"getMenuProps\";\ntype TypeDonwshiftSharedProps =\n  | \"onHighlightedIndexChange\"\n  | \"onIsOpenChange\"\n  | \"onSelectedItemChange\"\n  | \"onStateChange\"\n  | \"stateReducer\";\n\nexport interface TypeMenuContextBaseProps {\n  itemsMap?: { [key: string]: TypeInternalItemProps };\n  isListbox?: boolean;\n  hiddenItemsMap?: Record<string, boolean>;\n  hiddenItemsCount?: number;\n  setHiddenItemsMap?: React.Dispatch<\n    React.SetStateAction<Record<string, boolean>>\n  >;\n  subMenuId?: string;\n  setSubMenuId?: (id: string) => void;\n  contentRef?: React.RefObject<HTMLUListElement>;\n}\n\ninterface TypeAllDownshiftProps\n  extends Omit<\n      TypeDownshiftComboboxReturnValue,\n      TypeDonwshiftSharedReturnValue\n    >,\n    Omit<TypeDownshiftComboboxProps, TypeDonwshiftSharedProps>,\n    Omit<TypeDownshiftSelectReturnValue, TypeDonwshiftSharedReturnValue>,\n    Omit<TypeDownshiftSelectProps, TypeDonwshiftSharedProps>,\n    TypeDownshiftMultiSelectReturnValue,\n    TypeDownshiftMultiSelectProps {\n  onHighlightedIndexChange?:\n    | TypeDownshiftComboboxProps[\"onHighlightedIndexChange\"]\n    | TypeDownshiftSelectProps[\"onHighlightedIndexChange\"];\n  onIsOpenChange?:\n    | TypeDownshiftComboboxProps[\"onIsOpenChange\"]\n    | TypeDownshiftSelectProps[\"onIsOpenChange\"];\n  onSelectedItemChange?:\n    | TypeDownshiftComboboxProps[\"onSelectedItemChange\"]\n    | TypeDownshiftSelectProps[\"onSelectedItemChange\"];\n  onStateChange?:\n    | TypeDownshiftComboboxProps[\"onStateChange\"]\n    | TypeDownshiftSelectProps[\"onStateChange\"];\n  stateReducer?:\n    | TypeDownshiftComboboxProps[\"stateReducer\"]\n    | TypeDownshiftSelectProps[\"stateReducer\"];\n  getLabelProps?:\n    | TypeDownshiftComboboxReturnValue[\"getLabelProps\"]\n    | TypeDownshiftSelectReturnValue[\"getLabelProps\"];\n  getToggleButtonProps?:\n    | TypeDownshiftComboboxReturnValue[\"getToggleButtonProps\"]\n    | TypeDownshiftSelectReturnValue[\"getToggleButtonProps\"];\n  getMenuProps?:\n    | TypeDownshiftComboboxReturnValue[\"getMenuProps\"]\n    | TypeDownshiftSelectReturnValue[\"getMenuProps\"];\n}\nexport interface TypeMenuContextProps\n  extends TypeAllDownshiftProps,\n    TypeMenuContextBaseProps {\n  items: TypeInternalItemProps[];\n  itemsMap?: { [key: string]: TypeInternalItemProps };\n  selectedItemIds?: { [key: string]: boolean };\n  isListbox?: boolean;\n  hasVisibleItems?: boolean;\n  autoCloseOnEmpty?: boolean;\n}\n\nexport interface TypeMenuContext extends TypeMenuContextProps {\n  itemsMap: { [key: string]: TypeInternalItemProps };\n  isItemSelected: (id: string) => boolean;\n  getInputComponentProps: (\n    props: Pick<TypeTokenInputProps, \"inputProps\"> &\n      Parameters<Required<TypeMenuContextProps>[\"getInputProps\"]>[0]\n  ) => Omit<TypeDownshiftMergedInputProps<TypeTokenInputProps>, \"onClick\">;\n  isInitialized?: boolean;\n}\n\nexport interface TypeMenuProviderProps {\n  children: TypeNotEmptyChildren;\n  menuContext: TypeMenuContext;\n}\n\nexport interface TypeMenuToggleContext extends TypeMenuContext {\n  ref?:\n    | React.RefObject<any>\n    | ((arg0: React.ElementRef<any> | HTMLElement) => void);\n  toggle?: () => void;\n  show?: () => void;\n  hide?: () => void;\n  ariaProps?: Record<string, any>;\n}\n\nexport interface TypeMenuToggleProviderProps extends TypeMenuProviderProps {\n  menuContext: TypeMenuToggleContext;\n}\n\n/**\n * Object for Initializing the Menu Context\n */\nexport const defaultMenuContext: TypeMenuContext = {\n  items: [],\n  itemsMap: {},\n  isItemSelected: () => false,\n  getInputComponentProps: () => ({}),\n  hasVisibleItems: false,\n  isInitialized: false,\n};\n\nexport const getSelectedItemIds = <\n  T extends TypeMenuContextProps[\"selectedItems\"] | undefined,\n  R = T extends undefined ? undefined : Record<string, boolean>\n>(\n  selectedItems?: T\n): R =>\n  selectedItems?.reduce(\n    (selected, item) => ({ ...selected, [item.id]: true }),\n    {} as Record<string, boolean>\n  ) as R;\n\nexport const checkIfItemSelected = ({\n  id,\n  selectedItem,\n  selectedItemIds,\n}: {\n  id: string;\n  selectedItem?: TypeInternalItemProps | null;\n  selectedItemIds?: TypeMenuContextProps[\"selectedItemIds\"];\n}) => (selectedItemIds ? !!selectedItemIds[id] : selectedItem?.id === id);\n\n/**\n * Hook for initializing Menu context\n */\nexport const useMenu = ({\n  items = [],\n  isListbox = false,\n  isOpen = false,\n  itemsMap: itemsMapFromProps,\n  selectedItemIds: selectedItemIdsFromProps,\n  selectedItem,\n  selectedItems,\n  getInputProps,\n  contentRef: contentRefFromProps,\n  autoCloseOnEmpty,\n  hiddenItemsCount,\n  ...rest\n}: Partial<TypeMenuContextProps> = {}): TypeMenuContext => {\n  const contentRef = contentRefFromProps || React.createRef<HTMLUListElement>();\n  const menuProps = useMemo(() => ({ ...rest }), [rest]);\n  const itemsMap = useMemo(\n    () =>\n      itemsMapFromProps ||\n      items.reduce((map, item) => {\n        map[`${item.id}`] = {\n          ...item,\n        };\n        return map;\n      }, {} as TypeMenuContext[\"itemsMap\"]),\n    [items, itemsMapFromProps]\n  );\n\n  const selectedItemIds = useMemo(\n    () => selectedItemIdsFromProps || getSelectedItemIds(selectedItems),\n    [selectedItems, selectedItemIdsFromProps]\n  );\n\n  const isItemSelected = React.useCallback(\n    (id: string) => checkIfItemSelected({ id, selectedItem, selectedItemIds }),\n    [selectedItem?.id, selectedItemIds]\n  );\n\n  const getInputComponentProps = React.useCallback<\n    TypeMenuContext[\"getInputComponentProps\"]\n  >(\n    ({ inputProps, ...props }) => {\n      if (!getInputProps) return {};\n      const {\n        [\"aria-activedescendant\"]: activedescendant,\n        [\"aria-autocomplete\"]: autocomplete,\n        [\"aria-controls\"]: controls,\n        [\"aria-expanded\"]: expanded,\n        [\"aria-labelledby\"]: labelledby,\n        role,\n        autoComplete,\n        onClick,\n        value,\n        ...restProps\n      } = getInputProps(props);\n      return {\n        ...restProps,\n        inputProps: {\n          [\"aria-activedescendant\"]: activedescendant,\n          [\"aria-autocomplete\"]: autocomplete,\n          [\"aria-controls\"]: controls,\n          [\"aria-expanded\"]: expanded,\n          [\"aria-labelledby\"]: labelledby,\n          role,\n          autoComplete,\n          onClick,\n          value,\n          ...inputProps,\n        },\n      };\n    },\n    [getInputProps]\n  );\n\n  const hasVisibleItems = useMemo(() => {\n    return (hiddenItemsCount ?? 0) < items.length;\n  }, [items, hiddenItemsCount]);\n\n  return {\n    isOpen,\n    isListbox,\n    items,\n    itemsMap,\n    selectedItem,\n    selectedItems,\n    selectedItemIds,\n    isItemSelected,\n    getInputProps,\n    getInputComponentProps,\n    contentRef,\n    hasVisibleItems,\n    autoCloseOnEmpty,\n    isInitialized: true,\n    ...menuProps,\n  };\n};\n\n/**\n * MenuToggleContext factory, sets the type and the initial object\n * @description Context for the Menu Toggle\n */\nexport const MenuToggleContext =\n  createContext<TypeMenuToggleContext>(defaultMenuContext);\n\n/**\n * MenuToggleProvider Component sets the context values into the provider\n * @description Context Provider for the Menu Toggle\n */\nexport const MenuToggleProvider = ({\n  children,\n  menuContext,\n}: TypeMenuToggleProviderProps) => {\n  return (\n    <MenuToggleContext.Provider value={{ ...menuContext }}>\n      {children}\n    </MenuToggleContext.Provider>\n  );\n};\n\n/**\n * Utility hook for consuming MenuToggleContext\n */\nexport const useMenuToggleContext = () => {\n  const menuContextValue = useContext(MenuToggleContext);\n\n  if (menuContextValue === null) {\n    throw new Error(\n      \"useMenuToggleContext must be used within a <MenuToggleContext.Provider />\"\n    );\n  }\n\n  return menuContextValue;\n};\n\n/**\n * MenuContentContext factory, sets the type and the initial object\n * @description Context for the Menu Content\n */\nexport const MenuContentContext =\n  createContext<TypeMenuContext>(defaultMenuContext);\n\n/**\n * MenuContentProvider Component sets the context values into the provider\n * @description Context Provider for the Menu Content\n */\nexport const MenuContentProvider = ({\n  children,\n  menuContext,\n}: TypeMenuProviderProps) => {\n  return (\n    <MenuContentContext.Provider value={{ ...menuContext }}>\n      {children}\n    </MenuContentContext.Provider>\n  );\n};\n\n/**\n * Utility hook for consuming MenuContentContext\n */\nexport const useMenuContentContext = () => {\n  const menuContextValue = useContext(MenuContentContext);\n\n  if (menuContextValue === null) {\n    throw new Error(\n      \"useMenuContentContext must be used within a <MenuContentContext.Provider />\"\n    );\n  }\n\n  return menuContextValue;\n};\n","import styled, { css } from \"styled-components\";\nimport { focusRing, disabled } from \"@sproutsocial/seeds-react-mixins\";\nimport { color, border, flexbox, grid, layout, space } from \"styled-system\";\nimport {\n  CheckboxContainer,\n  InputWrapper,\n  PillInput,\n  checkboxContainerHoverStyles,\n  inputWrapperHoverStyles,\n  pillInputHoverStyles,\n} from \"@sproutsocial/seeds-react-checkbox\";\n\nconst highlightedStyles = css`\n  cursor: pointer;\n  border: 1px solid ${({ theme }) => theme.colors.listItem.border.base};\n  background-color: ${({ theme }) => theme.colors.listItem.background.hover};\n  color: ${({ theme }) => theme.colors.text.body};\n  text-decoration: none;\n`;\n\nconst activeStyles = css`\n  border: 1px solid ${({ theme }) => theme.colors.listItem.border.base};\n  background-color: ${({ theme }) => theme.colors.menuItem.background.active};\n  color: ${({ theme }) => theme.colors.text.body};\n  text-decoration: none;\n`;\n\nconst selectedStyles = css`\n  font-weight: ${({ theme }) => theme.fontWeights.semibold};\n`;\n\nexport const MenuItemContainer = styled.li`\n  box-sizing: border-box;\n  list-style-type: none;\n  margin-left: ${({ theme }) => theme.space[300]};\n  margin-right: ${({ theme }) => theme.space[300]};\n\n  &:first-child {\n    margin-top: ${({ theme }) => theme.space[300]};\n  }\n\n  &:last-child {\n    margin-bottom: ${({ theme }) => theme.space[300]};\n  }\n`;\n\nexport const StyledMenuItem = styled.button<{\n  $highlighted: boolean;\n  $active?: boolean;\n  $selected?: boolean;\n}>`\n  display: block;\n  box-sizing: border-box;\n  width: 100%;\n  border-radius: ${({ theme }) => theme.radii[500]};\n  background-color: ${({ theme }) => theme.colors.listItem.background.base};\n  border: 1px solid ${({ theme }) => theme.colors.listItem.background.base};\n  color: ${({ theme }) => theme.colors.text.body};\n  font-family: ${({ theme }) => theme.fontFamily};\n  font-weight: ${({ theme }) => theme.fontWeights.normal};\n  text-align: left;\n  text-decoration: none;\n  padding: ${({ theme }) => theme.space[300]};\n  outline: 0;\n  ${({ theme }) => theme.typography[200]};\n  transition: all ${({ theme }) => theme.duration[\"fast\"]};\n\n  /* Highlighted */\n  ${({ $highlighted }) => $highlighted && highlightedStyles}\n\n  /* Hovered, but not focused */\n  &:hover {\n    ${highlightedStyles}\n    ${CheckboxContainer} {\n      ${checkboxContainerHoverStyles}\n    }\n    ${InputWrapper} {\n      ${inputWrapperHoverStyles}\n    }\n    ${PillInput} {\n      ${pillInputHoverStyles}\n    }\n  }\n\n  /* focused */\n  &:focus {\n    ${focusRing}\n  }\n\n  /* Active */\n  ${({ $active }) => $active && activeStyles}\n\n  /* Pressed state*/\n  &:active {\n    ${activeStyles}\n  }\n\n  &[aria-disabled=\"true\"] {\n    cursor: not-allowed;\n    ${disabled}\n  }\n\n  ${({ $selected }) => $selected && selectedStyles}\n\n  ${border}\n  ${color}\n  ${flexbox}\n  ${grid}\n  ${layout}\n  ${space}\n`;\n\nexport const MenuItemRow = styled.div`\n  display: flex;\n  align-items: center;\n  pointer-events: none;\n`;\nexport const MenuItemAction = styled.div`\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n`;\n\nexport const MenuItemActionLeft = styled(MenuItemAction)`\n  margin-right: ${({ theme }) => theme.space[300]};\n`;\n\nexport const MenuItemActionRight = styled(MenuItemAction)`\n  margin-left: ${({ theme }) => theme.space[300]};\n`;\n\nexport const MenuItemText = styled.div`\n  word-break: break-word;\n  flex-grow: 1;\n  min-width: 0;\n`;\n","import { Button, type TypeButtonProps } from \"@sproutsocial/seeds-react-button\";\nimport { useMenuToggleContext } from \"../MenuContext\";\nimport type React from \"react\";\n\nexport interface TypeMenuToggleButtonProps extends TypeButtonProps {}\n\n/**\n * @link https://seeds.sproutsocial.com/components/seeds-react-menu/#menutogglebutton\n * @param props - MenuToggleButton accepts all the same props as Button.\n * @description MenuToggleButton extends the Button component to create a toggle for a menu.\n * @see {@link https://seeds.sproutsocial.com/components/button/ Button}\n * @see {@link https://seeds.sproutsocial.com/components/seeds-react-menu/#menulabel MenuLabel}\n */\nexport const MenuToggleButton = (props: TypeMenuToggleButtonProps) => {\n  const { getToggleButtonProps, isListbox, getDropdownProps, ref, ariaProps } =\n    useMenuToggleContext();\n\n  const {\n    onClick: userOnClick,\n    onKeyDown: userOnKeyDown,\n    onBlur: userOnBlur,\n    ...restProps\n  } = props;\n\n  const defaultDropdownProps = {\n    ref,\n    onClick: userOnClick,\n    onKeyDown: userOnKeyDown,\n    onBlur: userOnBlur,\n  };\n\n  const dropdownProps =\n    getDropdownProps?.({\n      ...defaultDropdownProps,\n      preventKeyAction: true,\n    }) ?? defaultDropdownProps;\n\n  const toggleButtonProps = getToggleButtonProps?.({\n    ...dropdownProps,\n    refKey: \"innerRef\",\n    ...ariaProps,\n    ...(isListbox ? {} : { role: \"button\", \"aria-haspopup\": \"menu\" }),\n  });\n\n  // Clean up default downshift aria attributes\n  // If there is not an active descendant, remove the attribute\n  if (toggleButtonProps && toggleButtonProps[\"aria-activedescendant\"] === \"\") {\n    toggleButtonProps[\"aria-activedescendant\"] = undefined;\n  }\n  // If the menu is closed, remove the aria-controls attribute\n  if (toggleButtonProps && toggleButtonProps[\"aria-expanded\"] === false) {\n    // @ts-expect-error downshift types require aria-controls even though it is not required\n    toggleButtonProps[\"aria-controls\"] = undefined;\n  }\n  // Remove aria-labelledby, we add our own Label component\n  if (toggleButtonProps) {\n    toggleButtonProps[\"aria-labelledby\"] = undefined;\n  }\n\n  return (\n    <Button appearance=\"secondary\" {...toggleButtonProps} {...restProps} />\n  );\n};\n","import styled from \"styled-components\";\nimport {\n  border,\n  color,\n  flexbox,\n  grid,\n  layout,\n  position,\n  space,\n} from \"styled-system\";\nimport type { TypeMenuContentProps } from \"./MenuContentTypes\";\n\nexport const StyledMenuContent = styled.ul<TypeMenuContentProps>`\n  margin: 0;\n  padding: 0;\n  overflow: auto;\n\n  &:focus {\n    outline: none;\n    box-shadow: none;\n  }\n\n  ${border}\n  ${color}\n  ${flexbox}\n  ${grid}\n  ${layout}\n  ${space}\n  ${position}\n`;\n"],"mappings":"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","names":["jsx","styled","border","color","flexbox","grid","layout","space"]}