@pega/cosmos-react-build 9.0.0-build.9.9 → 10.0.0-build.1.0

package/lib/components/AppShell/AppShell.styles.d.ts

@@ -1,16 +1,18 @@
-export declare const StyledUtils: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledAppShellToggleButton: import("styled-components").StyledComponent<import("@pega/cosmos-react-core").ForwardRefForwardPropsComponent<import("@pega/cosmos-react-core").ButtonProps>, import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledScrollWrap: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledMain: import("styled-components").StyledComponent<"main", import("styled-components").DefaultTheme, {
+export declare const StyledUtils: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const StyledAppShellToggleButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<Omit<import("@pega/cosmos-react-core").ButtonProps, "ref"> & import("react").RefAttributes<HTMLAnchorElement | HTMLButtonElement> & import("@pega/cosmos-react-core").ForwardProps, "ref"> & {
+    ref?: ((instance: HTMLAnchorElement | HTMLButtonElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLAnchorElement | HTMLButtonElement> | null | undefined;
+}, never>> & string & Omit<import("@pega/cosmos-react-core").ForwardRefForwardPropsComponent<import("@pega/cosmos-react-core").ButtonProps>, keyof import("react").Component<any, {}, any>>;
+export declare const StyledScrollWrap: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const StyledMain: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, {
     navOpen: boolean;
     hideNav: boolean;
-}, never>;
-export declare const StyledNav: import("styled-components").StyledComponent<"nav", import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledAppShellCaretIcon: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@pega/cosmos-react-core").IconProps>, import("styled-components").DefaultTheme, {
+}>> & string;
+export declare const StyledNav: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, never>> & string;
+export declare const StyledAppShellCaretIcon: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("@pega/cosmos-react-core").IconProps & import("styled-components/dist/types").BaseObject, {
     nestedListCollapsed?: boolean;
-}, never>;
-export declare const StyledNavListItem: import("styled-components").StyledComponent<"li", import("styled-components").DefaultTheme, {
+}>> & string & Omit<import("react").ForwardRefExoticComponent<import("@pega/cosmos-react-core").IconProps>, keyof import("react").Component<any, {}, any>>;
+export declare const StyledNavListItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, {
     activeTreeRoot?: boolean;
-}, never>;
-export declare const StyledNavList: import("styled-components").StyledComponent<"ul", import("styled-components").DefaultTheme, {}, never>;
+}>> & string;
+export declare const StyledNavList: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, never>> & string;
 //# sourceMappingURL=AppShell.styles.d.ts.map

package/lib/components/AppShell/AppShell.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AppShell.styles.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/AppShell.styles.ts"],"names":[],"mappings":"AAyBA,eAAO,MAAM,WAAW,yGAStB,CAAC;AAIH,eAAO,MAAM,0BAA0B,oNAiBrC,CAAC;AAIH,eAAO,MAAM,gBAAgB,yGAK3B,CAAC;AAIH,eAAO,MAAM,UAAU;aACZ,OAAO;aACP,OAAO;SAoCjB,CAAC;AAIF,eAAO,MAAM,SAAS,yGAoFrB,CAAC;AAIF,eAAO,MAAM,uBAAuB;0BAAwC,OAAO;SAgBjF,CAAC;AAIH,eAAO,MAAM,iBAAiB;qBAAgC,OAAO;SAwEpE,CAAC;AAIF,eAAO,MAAM,aAAa,wGAAc,CAAC"}
+{"version":3,"file":"AppShell.styles.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/AppShell.styles.ts"],"names":[],"mappings":"AAyBA,eAAO,MAAM,WAAW,6NAStB,CAAC;AAIH,eAAO,MAAM,0BAA0B;;2LAiBrC,CAAC;AAIH,eAAO,MAAM,gBAAgB,6NAK3B,CAAC;AAIH,eAAO,MAAM,UAAU;aACZ,OAAO;aACP,OAAO;YAoCjB,CAAC;AAIF,eAAO,MAAM,SAAS,uNAoFrB,CAAC;AAIF,eAAO,MAAM,uBAAuB;0BAAwC,OAAO;0JAgBjF,CAAC;AAIH,eAAO,MAAM,iBAAiB;qBAAgC,OAAO;YAwEpE,CAAC;AAIF,eAAO,MAAM,aAAa,iOAAc,CAAC"}

package/lib/components/AppShell/Header/AppHeader.styles.d.ts

@@ -1,12 +1,16 @@
 import { Text, Tabs } from '@pega/cosmos-react-core';
-export declare const StyledAppHeader: import("styled-components").StyledComponent<"header", import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledBrandContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledBrandButton: import("styled-components").StyledComponent<import("@pega/cosmos-react-core").ForwardRefForwardPropsComponent<import("@pega/cosmos-react-core/lib/components/Button/BareButton").BareButtonProps>, import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledBrandImage: import("styled-components").StyledComponent<import("@pega/cosmos-react-core").ForwardRefForwardPropsComponent<import("@pega/cosmos-react-core").ImageProps>, import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledContext: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledAppHeader: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, never>> & string;
+export declare const StyledBrandContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const StyledBrandButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<Omit<import("@pega/cosmos-react-core/lib/components/Button/BareButton").BareButtonProps, "ref"> & import("react").RefAttributes<HTMLAnchorElement | HTMLButtonElement> & import("@pega/cosmos-react-core").ForwardProps, "ref"> & {
+    ref?: ((instance: HTMLAnchorElement | HTMLButtonElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLAnchorElement | HTMLButtonElement> | null | undefined;
+}, never>> & string & Omit<import("@pega/cosmos-react-core").ForwardRefForwardPropsComponent<import("@pega/cosmos-react-core/lib/components/Button/BareButton").BareButtonProps>, keyof import("react").Component<any, {}, any>>;
+export declare const StyledBrandImage: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<Omit<import("@pega/cosmos-react-core").ImageProps, "ref"> & import("react").RefAttributes<HTMLImageElement> & import("@pega/cosmos-react-core").ForwardProps, "ref"> & {
+    ref?: ((instance: HTMLImageElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLImageElement> | null | undefined;
+}, never>> & string & Omit<import("@pega/cosmos-react-core").ForwardRefForwardPropsComponent<import("@pega/cosmos-react-core").ImageProps>, keyof import("react").Component<any, {}, any>>;
+export declare const StyledContext: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
 export declare const StyledTabs: typeof Tabs;
-export declare const StyledAppHeaderSearch: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledUtilsContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledAppHeaderSearch: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const StyledUtilsContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 export declare const StyledAppName: typeof Text;
 export declare const StyledAppVersion: typeof Text;
 //# sourceMappingURL=AppHeader.styles.d.ts.map

package/lib/components/AppShell/Header/AppHeader.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AppHeader.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/AppShell/Header/AppHeader.styles.ts"],"names":[],"mappings":"AAEA,OAAO,EAAoB,IAAI,EAAE,IAAI,EAAuB,MAAM,yBAAyB,CAAC;AAI5F,eAAO,MAAM,eAAe,4GA8B3B,CAAC;AAIF,eAAO,MAAM,oBAAoB,yGAkBhC,CAAC;AAIF,eAAO,MAAM,iBAAiB,yPAa5B,CAAC;AAIH,eAAO,MAAM,gBAAgB,mNAc3B,CAAC;AAEH,eAAO,MAAM,aAAa,0GAIzB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,OAAO,IA4B9B,CAAC;AAIH,eAAO,MAAM,qBAAqB,yGA0BjC,CAAC;AAIF,eAAO,MAAM,oBAAoB,yGAmBhC,CAAC;AAIF,eAAO,MAAM,aAAa,EAAE,OAAO,IAUjC,CAAC;AAIH,eAAO,MAAM,gBAAgB,EAAE,OAAO,IAKpC,CAAC"}
+{"version":3,"file":"AppHeader.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/AppShell/Header/AppHeader.styles.ts"],"names":[],"mappings":"AAEA,OAAO,EAAoB,IAAI,EAAE,IAAI,EAAuB,MAAM,yBAAyB,CAAC;AAI5F,eAAO,MAAM,eAAe,uNA8B3B,CAAC;AAIF,eAAO,MAAM,oBAAoB,6NAkBhC,CAAC;AAIF,eAAO,MAAM,iBAAiB;;gOAa5B,CAAC;AAIH,eAAO,MAAM,gBAAgB;;0LAc3B,CAAC;AAEH,eAAO,MAAM,aAAa,+NAIzB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,OAAO,IA4B9B,CAAC;AAIH,eAAO,MAAM,qBAAqB,6NA0BjC,CAAC;AAIF,eAAO,MAAM,oBAAoB,6NAmBhC,CAAC;AAIF,eAAO,MAAM,aAAa,EAAE,OAAO,IAUjC,CAAC;AAIH,eAAO,MAAM,gBAAgB,EAAE,OAAO,IAKpC,CAAC"}

package/lib/components/AppShell/Header/BranchButton.d.ts

@@ -1,6 +1,4 @@
 import type { FunctionComponent } from 'react';
-import type { DefaultTheme } from 'styled-components';
-import { Button } from '@pega/cosmos-react-core';
 import type { CountProps, MenuProps, StatusProps } from '@pega/cosmos-react-core';
 export interface BranchButtonProps {
     /** The text for the BranchButton also used to set the aria-label. */
@@ -14,8 +12,12 @@ export interface BranchButtonProps {
     /** An array of MenuItemProps. */
     items: MenuProps['items'];
 }
-export declare const StyledBranchButton: typeof Button;
-export declare const StyledWarnIcon: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@pega/cosmos-react-core").IconProps>, DefaultTheme, {}, never>;
+export declare const StyledBranchButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<Omit<import("@pega/cosmos-react-core").ButtonProps, "ref"> & import("react").RefAttributes<HTMLAnchorElement | HTMLButtonElement> & import("@pega/cosmos-react-core").ForwardProps, "ref"> & {
+    ref?: ((instance: HTMLAnchorElement | HTMLButtonElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLAnchorElement | HTMLButtonElement> | null | undefined;
+}, {
+    branchVariant: BranchButtonProps["variant"];
+}>> & string & Omit<import("@pega/cosmos-react-core").ForwardRefForwardPropsComponent<import("@pega/cosmos-react-core").ButtonProps>, keyof import("react").Component<any, {}, any>>;
+export declare const StyledWarnIcon: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("@pega/cosmos-react-core").IconProps & import("styled-components/dist/types").BaseObject, import("styled-components/dist/types").BaseObject>> & string & Omit<import("react").ForwardRefExoticComponent<import("@pega/cosmos-react-core").IconProps>, keyof import("react").Component<any, {}, any>>;
 declare const BranchButton: FunctionComponent<BranchButtonProps>;
 export default BranchButton;
 //# sourceMappingURL=BranchButton.d.ts.map

package/lib/components/AppShell/Header/BranchButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BranchButton.d.ts","sourceRoot":"","sources":["../../../../src/components/AppShell/Header/BranchButton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAiB,MAAM,OAAO,CAAC;AAE9D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEtD,OAAO,EACL,MAAM,EAcP,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,EAAE,UAAU,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAQlF,MAAM,WAAW,iBAAiB;IAChC,qEAAqE;IACrE,IAAI,EAAE,MAAM,CAAC;IACb,mDAAmD;IACnD,OAAO,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,SAAS,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC,CAAC;IAChE,6CAA6C;IAC7C,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,mEAAmE;IACnE,KAAK,CAAC,EAAE,UAAU,CAAC,UAAU,CAAC,CAAC;IAC/B,iCAAiC;IACjC,KAAK,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;CAC3B;AAED,eAAO,MAAM,kBAAkB,EAAE,OAAO,MAqDtC,CAAC;AAmBH,eAAO,MAAM,cAAc,8JAIzB,CAAC;AAgBH,QAAA,MAAM,YAAY,EAAE,iBAAiB,CAAC,iBAAiB,CAoEtD,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"BranchButton.d.ts","sourceRoot":"","sources":["../../../../src/components/AppShell/Header/BranchButton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAiB,MAAM,OAAO,CAAC;AAmB9D,OAAO,KAAK,EAAE,UAAU,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAQlF,MAAM,WAAW,iBAAiB;IAChC,qEAAqE;IACrE,IAAI,EAAE,MAAM,CAAC;IACb,mDAAmD;IACnD,OAAO,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,SAAS,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC,CAAC;IAChE,6CAA6C;IAC7C,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,mEAAmE;IACnE,KAAK,CAAC,EAAE,UAAU,CAAC,UAAU,CAAC,CAAC;IAC/B,iCAAiC;IACjC,KAAK,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;CAC3B;AAED,eAAO,MAAM,kBAAkB;;;mBACd,iBAAiB,CAAC,SAAS,CAAC;oLAgD3C,CAAC;AAmBH,eAAO,MAAM,cAAc,kaAIzB,CAAC;AAgBH,QAAA,MAAM,YAAY,EAAE,iBAAiB,CAAC,iBAAiB,CAoEtD,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/lib/components/AppShell/Header/BranchButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"BranchButton.js","sourceRoot":"","sources":["../../../../src/components/AppShell/Header/BranchButton.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState } from 'react';\nimport type { FunctionComponent, KeyboardEvent } from 'react';\nimport styled, { css } from 'styled-components';\nimport type { DefaultTheme } from 'styled-components';\n\nimport {\n  Button,\n  defaultThemeProp,\n  Flex,\n  Icon,\n  Menu,\n  Count,\n  Popover,\n  readableColor,\n  useDirection,\n  useElement,\n  registerIcon,\n  useOuterEvent,\n  useI18n,\n  tryCatch\n} from '@pega/cosmos-react-core';\nimport type { CountProps, MenuProps, StatusProps } from '@pega/cosmos-react-core';\nimport * as nodesDownSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/nodes-down-solid.icon';\nimport * as warnSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/warn-solid.icon';\nimport * as caretDownIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-down.icon';\nimport { StyledCount } from '@pega/cosmos-react-core/lib/components/Badges/Count';\n\nregisterIcon(nodesDownSolidIcon, warnSolidIcon, caretDownIcon);\n\nexport interface BranchButtonProps {\n  /** The text for the BranchButton also used to set the aria-label. */\n  text: string;\n  /** Determines the variant for the BranchButton. */\n  variant?: Extract<StatusProps['variant'], 'success' | 'urgent'>;\n  /** Only display the branch and caret icon */\n  compact?: boolean;\n  /** The total count representing the number of unmerged changes. */\n  count?: CountProps['children'];\n  /** An array of MenuItemProps. */\n  items: MenuProps['items'];\n}\n\nexport const StyledBranchButton: typeof Button = styled(Button)(({\n  theme,\n  branchVariant\n}: {\n  theme: DefaultTheme;\n  branchVariant: BranchButtonProps['variant'];\n}) => {\n  const {\n    base: {\n      colors,\n      palette: { 'primary-background': primaryBackground },\n      shadow: { focus },\n      spacing\n    },\n    components: {\n      badges: {\n        status,\n        count: {\n          default: { background, foreground }\n        }\n      }\n    }\n  } = theme;\n\n  const backgroundColor = branchVariant ? status[branchVariant].background : primaryBackground;\n  const borderColor = !branchVariant ? colors.gray.medium : 'transparent';\n  const countBgColor = branchVariant === 'success' ? colors.green.medium : background;\n  const countColor = branchVariant === 'success' ? colors.white : foreground;\n  const buttonColor = tryCatch(() => readableColor(backgroundColor));\n\n  return css`\n    flex-shrink: 0;\n    background-color: ${backgroundColor};\n    border-color: ${borderColor};\n    color: ${buttonColor};\n    padding-inline-start: ${spacing};\n    padding-inline-end: ${spacing};\n\n    &:hover {\n      background-color: ${backgroundColor};\n      box-shadow: ${focus};\n    }\n\n    svg {\n      height: 1rem;\n      width: 1rem;\n    }\n\n    ${StyledCount} {\n      background-color: ${countBgColor};\n      color: ${countColor};\n    }\n  `;\n});\n\nStyledBranchButton.defaultProps = defaultThemeProp;\n\nconst StyledBranchButtonPopover = styled(Popover)(({\n  theme: {\n    base: { spacing, 'content-width': contentWidth }\n  }\n}) => {\n  const minWidth = `calc(${contentWidth.xs} + (2 * ${spacing}))`;\n\n  return css`\n    min-width: ${minWidth};\n    max-width: calc(${minWidth} + 5ch);\n  `;\n});\n\nStyledBranchButtonPopover.defaultProps = defaultThemeProp;\n\nexport const StyledWarnIcon = styled(Icon)(({ theme }) => {\n  return css`\n    color: ${theme.base.colors.red.medium};\n  `;\n});\n\nStyledWarnIcon.defaultProps = defaultThemeProp;\n\nconst StyledEllipsizedText = styled.span(({ theme }) => {\n  return css`\n    max-width: ${theme.base['content-width'].xs};\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    line-height: 1.5;\n  `;\n});\n\nStyledEllipsizedText.defaultProps = defaultThemeProp;\n\nconst BranchButton: FunctionComponent<BranchButtonProps> = (props: BranchButtonProps) => {\n  const { text, variant, count, compact = false, items = [] } = props;\n\n  const [open, setOpen] = useState(false);\n\n  const [popoverEl, setPopoverRef] = useElement<HTMLElement>();\n  const [buttonEl, setButtonEl] = useElement<HTMLElement>();\n  const { rtl } = useDirection();\n  const t = useI18n();\n\n  useOuterEvent('mousedown', [popoverEl, buttonEl], () => {\n    if (open) setOpen(false);\n  });\n\n  let ariaLabel = t('branch_with_no_changes', [text]);\n  if (variant === 'success') {\n    ariaLabel = t('branch_with_no_potential_conflicts', [text, count ?? 0]);\n  } else if (variant === 'urgent') {\n    ariaLabel = t('branch_with_potential_conflicts', [text]);\n  }\n\n  return (\n    <>\n      <StyledBranchButton\n        ref={setButtonEl}\n        aria-expanded={open}\n        aria-haspopup='menu'\n        aria-controls='branch-popover'\n        aria-label={ariaLabel}\n        branchVariant={variant}\n        label={!open && compact ? text : undefined}\n        onClick={() => setOpen(cur => !cur)}\n        onKeyDown={(e: KeyboardEvent) => {\n          if (e.key === 'Escape') setOpen(false);\n        }}\n      >\n        <Flex container={{ alignItems: 'center', gap: compact ? 1 : 0.5 }}>\n          <Icon name='nodes-down-solid' />\n          {!compact && (\n            <>\n              <StyledEllipsizedText>{text}</StyledEllipsizedText>\n              {variant === 'urgent' ? (\n                <StyledWarnIcon name='warn-solid' />\n              ) : (\n                count !== undefined && <Count>{count}</Count>\n              )}\n            </>\n          )}\n          <Icon name='caret-down' />\n        </Flex>\n      </StyledBranchButton>\n      <StyledBranchButtonPopover\n        placement={rtl ? 'bottom-end' : 'bottom-start'}\n        id='branch-popover'\n        hideOnTargetHidden\n        show={open}\n        target={buttonEl}\n        ref={setPopoverRef}\n      >\n        <Menu\n          items={items}\n          scrollAt={20}\n          onItemClick={() => setOpen(false)}\n          focusControlEl={buttonEl || undefined}\n        />\n      </StyledBranchButtonPopover>\n    </>\n  );\n};\n\nexport default BranchButton;\n"]}
+{"version":3,"file":"BranchButton.js","sourceRoot":"","sources":["../../../../src/components/AppShell/Header/BranchButton.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState } from 'react';\nimport type { FunctionComponent, KeyboardEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n  Button,\n  defaultThemeProp,\n  Flex,\n  Icon,\n  Menu,\n  Count,\n  Popover,\n  readableColor,\n  useDirection,\n  useElement,\n  registerIcon,\n  useOuterEvent,\n  useI18n,\n  tryCatch\n} from '@pega/cosmos-react-core';\nimport type { CountProps, MenuProps, StatusProps } from '@pega/cosmos-react-core';\nimport * as nodesDownSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/nodes-down-solid.icon';\nimport * as warnSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/warn-solid.icon';\nimport * as caretDownIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-down.icon';\nimport { StyledCount } from '@pega/cosmos-react-core/lib/components/Badges/Count';\n\nregisterIcon(nodesDownSolidIcon, warnSolidIcon, caretDownIcon);\n\nexport interface BranchButtonProps {\n  /** The text for the BranchButton also used to set the aria-label. */\n  text: string;\n  /** Determines the variant for the BranchButton. */\n  variant?: Extract<StatusProps['variant'], 'success' | 'urgent'>;\n  /** Only display the branch and caret icon */\n  compact?: boolean;\n  /** The total count representing the number of unmerged changes. */\n  count?: CountProps['children'];\n  /** An array of MenuItemProps. */\n  items: MenuProps['items'];\n}\n\nexport const StyledBranchButton = styled(Button)<{\n  branchVariant: BranchButtonProps['variant'];\n}>(({ theme, branchVariant }) => {\n  const {\n    base: {\n      colors,\n      palette: { 'primary-background': primaryBackground },\n      shadow: { focus },\n      spacing\n    },\n    components: {\n      badges: {\n        status,\n        count: {\n          default: { background, foreground }\n        }\n      }\n    }\n  } = theme;\n\n  const backgroundColor = branchVariant ? status[branchVariant].background : primaryBackground;\n  const borderColor = !branchVariant ? colors.gray.medium : 'transparent';\n  const countBgColor = branchVariant === 'success' ? colors.green.medium : background;\n  const countColor = branchVariant === 'success' ? colors.white : foreground;\n  const buttonColor = tryCatch(() => readableColor(backgroundColor));\n\n  return css`\n    flex-shrink: 0;\n    background-color: ${backgroundColor};\n    border-color: ${borderColor};\n    color: ${buttonColor};\n    padding-inline-start: ${spacing};\n    padding-inline-end: ${spacing};\n\n    &:hover {\n      background-color: ${backgroundColor};\n      box-shadow: ${focus};\n    }\n\n    svg {\n      height: 1rem;\n      width: 1rem;\n    }\n\n    ${StyledCount} {\n      background-color: ${countBgColor};\n      color: ${countColor};\n    }\n  `;\n});\n\nStyledBranchButton.defaultProps = defaultThemeProp;\n\nconst StyledBranchButtonPopover = styled(Popover)(({\n  theme: {\n    base: { spacing, 'content-width': contentWidth }\n  }\n}) => {\n  const minWidth = `calc(${contentWidth.xs} + (2 * ${spacing}))`;\n\n  return css`\n    min-width: ${minWidth};\n    max-width: calc(${minWidth} + 5ch);\n  `;\n});\n\nStyledBranchButtonPopover.defaultProps = defaultThemeProp;\n\nexport const StyledWarnIcon = styled(Icon)(({ theme }) => {\n  return css`\n    color: ${theme.base.colors.red.medium};\n  `;\n});\n\nStyledWarnIcon.defaultProps = defaultThemeProp;\n\nconst StyledEllipsizedText = styled.span(({ theme }) => {\n  return css`\n    max-width: ${theme.base['content-width'].xs};\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    line-height: 1.5;\n  `;\n});\n\nStyledEllipsizedText.defaultProps = defaultThemeProp;\n\nconst BranchButton: FunctionComponent<BranchButtonProps> = (props: BranchButtonProps) => {\n  const { text, variant, count, compact = false, items = [] } = props;\n\n  const [open, setOpen] = useState(false);\n\n  const [popoverEl, setPopoverRef] = useElement<HTMLElement>();\n  const [buttonEl, setButtonEl] = useElement<HTMLElement>();\n  const { rtl } = useDirection();\n  const t = useI18n();\n\n  useOuterEvent('mousedown', [popoverEl, buttonEl], () => {\n    if (open) setOpen(false);\n  });\n\n  let ariaLabel = t('branch_with_no_changes', [text]);\n  if (variant === 'success') {\n    ariaLabel = t('branch_with_no_potential_conflicts', [text, count ?? 0]);\n  } else if (variant === 'urgent') {\n    ariaLabel = t('branch_with_potential_conflicts', [text]);\n  }\n\n  return (\n    <>\n      <StyledBranchButton\n        ref={setButtonEl}\n        aria-expanded={open}\n        aria-haspopup='menu'\n        aria-controls='branch-popover'\n        aria-label={ariaLabel}\n        branchVariant={variant}\n        label={!open && compact ? text : undefined}\n        onClick={() => setOpen(cur => !cur)}\n        onKeyDown={(e: KeyboardEvent) => {\n          if (e.key === 'Escape') setOpen(false);\n        }}\n      >\n        <Flex container={{ alignItems: 'center', gap: compact ? 1 : 0.5 }}>\n          <Icon name='nodes-down-solid' />\n          {!compact && (\n            <>\n              <StyledEllipsizedText>{text}</StyledEllipsizedText>\n              {variant === 'urgent' ? (\n                <StyledWarnIcon name='warn-solid' />\n              ) : (\n                count !== undefined && <Count>{count}</Count>\n              )}\n            </>\n          )}\n          <Icon name='caret-down' />\n        </Flex>\n      </StyledBranchButton>\n      <StyledBranchButtonPopover\n        placement={rtl ? 'bottom-end' : 'bottom-start'}\n        id='branch-popover'\n        hideOnTargetHidden\n        show={open}\n        target={buttonEl}\n        ref={setPopoverRef}\n      >\n        <Menu\n          items={items}\n          scrollAt={20}\n          onItemClick={() => setOpen(false)}\n          focusControlEl={buttonEl || undefined}\n        />\n      </StyledBranchButtonPopover>\n    </>\n  );\n};\n\nexport default BranchButton;\n"]}