@persona/design-system 0.1.8 → 0.2.0

package/dist/Sticker-CIoseh9f.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"Sticker-CIoseh9f.cjs","names":["Color","Stack","Spacing","paragraphMixins","TruncatedText","IconButton","BorderRadius","isDisabled","isFocusedVisible","isNotDisabled","isHovered","XIcon"],"sources":["../components/Sticker/Sticker.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef, MouseEventHandler, ReactNode } from 'react';\nimport styled from 'styled-components';\n\nimport { BorderRadius, Color, Spacing } from '@persona/design-tokens';\nimport { XIcon } from '@persona/icons/12px';\nimport { IconButton } from 'design-system/components/Button';\nimport Stack from 'design-system/components/Stack';\nimport {\n  isDisabled,\n  isFocusedVisible,\n  isHovered,\n  isNotDisabled,\n} from 'design-system/lib/pseudoClass';\nimport { TruncatedText } from 'design-system/lib/TruncatedText';\nimport { paragraphMixins } from 'design-system/mixins/text';\nimport type { Variant } from 'design-system/theme';\n// Define the options with labels\nexport const STICKER_COLOR_CONFIG = {\n  white: 'White',\n  blue: 'Blue',\n  teal: 'Teal',\n  green: 'Green',\n  yellow: 'Yellow',\n  orange: 'Orange',\n  pink: 'Pink',\n  red: 'Red',\n  purple: 'Purple',\n  darkGrey: 'Dark Grey',\n  grey: 'Grey',\n} as const;\n\n// Derive the type from the object keys\nexport type LabelBackgrounds = keyof typeof STICKER_COLOR_CONFIG;\n\nexport interface StickerProps extends ComponentPropsWithoutRef<'div'> {\n  variant?: LabelBackgrounds | Exclude<Variant, 'inverse'>;\n\n  /**\n   * Icon to render to the left of the Sticker. 12px icons recommended.\n   */\n  icon?: ReactNode;\n\n  /**\n   * Callback to call upon clicking \"x\" button. Non-null will render the button.\n   */\n  onDismiss?: MouseEventHandler;\n\n  /**\n   * Additional props to pass to the dismiss \"x\" button.\n   */\n  dismissButtonProps?: ComponentPropsWithoutRef<'button'>;\n\n  /**\n   * Renders disabled style for the entire Sticker and disables \"x\" button.\n   */\n  disabled?: boolean;\n\n  /**\n   * Shows a required asterisk (*) that won't be cut off when text is truncated.\n   */\n  isRequired?: boolean;\n\n  /**\n   * In some cases we render a sticker/badge on a secondary background, which needs an adjustment\n   * for certain variants.\n   */\n  onSecondaryBackground?: boolean;\n}\n\nconst StickerIcon = styled('div')<Pick<StickerProps, 'variant'>>`\n  color: ${({ theme, variant }) => {\n    switch (variant) {\n      case 'darkGrey':\n      case 'red':\n        return theme.color.text.inverse;\n      default:\n        return 'inherit';\n    }\n  }};\n  line-height: 0;\n  svg {\n    width: 12px;\n    height: 12px;\n  }\n`;\n\nconst RequiredAsterisk = styled.span`\n  color: ${Color.TextDanger};\n  /* Ensure asterisk never gets hidden and takes minimal space */\n  flex-shrink: 0;\n`;\n\nexport const StickerContainer = styled(Stack)`\n  padding: 2px ${Spacing[1]};\n  /* Ensure container can shrink for text truncation */\n  min-width: 0;\n  flex: 1;\n`;\n\nexport const StickerContentContainer = styled(StickerContainer)`\n  ${paragraphMixins.sm}\n  padding: 0;\n`;\n\nexport const StyledTruncatedText = styled(TruncatedText)`\n  ${paragraphMixins.sm}\n  flex: 1;\n  min-width: 0;\n  line-height: 1;\n  transform: translateY(0.5px);\n`;\n\nconst DismissButton = styled(IconButton)<Pick<StickerProps, 'variant' | 'disabled'>>`\n  /* Note this will break if the element is not on a white background. Variable is provided to be able to override. */\n  --background-color-behind-sticker: ${Color.PrimaryWhite};\n\n  border: none;\n\n  padding: 0 ${Spacing[1]};\n  border-radius: ${BorderRadius.Sm};\n  width: 1rem;\n\n  height: 100%;\n\n  display: inline-flex;\n  align-items: center;\n\n  svg {\n    width: 12px;\n    height: 12px;\n  }\n  color: ${({ theme, variant, disabled }) => {\n    if (variant === 'red' || variant === 'darkGrey') {\n      return theme.color.text.inverse;\n    }\n    return disabled ? 'inherit' : Color.BorderIconPrimary;\n  }};\n\n  &${isDisabled} {\n    background-color: inherit !important;\n    color: inherit !important;\n  }\n\n  &${isFocusedVisible}${isNotDisabled} {\n    box-shadow: 0 0 0 1px var(--background-color-behind-sticker);\n  }\n\n  &${isHovered}${isNotDisabled} {\n    cursor: pointer;\n\n    background: ${({ variant }) => {\n      if (variant === 'grey' || variant === 'basic') {\n        return Color.BackgroundLabelGreyHover;\n      } else if (variant === 'darkGrey') {\n        return Color.BackgroundLabelDarkGreyHover;\n      } else if (variant === 'purple') {\n        return Color.BackgroundLabelPurpleHover;\n      } else if (variant === 'red' || variant === 'danger') {\n        return Color.BackgroundLabelDarkRedHover;\n      } else if (variant === 'orange') {\n        return Color.BackgroundLabelOrangeHover;\n      } else if (variant === 'yellow' || variant === 'caution') {\n        return Color.BackgroundLabelYellowHover;\n      } else if (variant === 'green' || variant === 'success') {\n        return Color.BackgroundLabelGreenHover;\n      } else if (variant === 'teal') {\n        return Color.BackgroundLabelTealHover;\n      } else if (variant === 'blue') {\n        return Color.BackgroundLabelBlueHover;\n      } else if (variant === 'pink') {\n        return Color.BackgroundLabelRedHover;\n      } else if (variant === 'white') {\n        return Color.BackgroundLabelWhiteHover;\n      } else {\n        return 'inherit';\n      }\n    }};\n  }\n`;\n\nconst StyledSticker = styled('div')<\n  StickerProps & { sizeIcon?: boolean; $onSecondaryBackground?: boolean }\n>`\n  display: inline-flex;\n  white-space: nowrap;\n\n  border-radius: ${BorderRadius.Sm};\n  height: 1rem;\n  max-width: 100%;\n\n  color: ${({ theme, variant, disabled }) => {\n    if (disabled) {\n      return variant === 'red' || variant === 'darkGrey'\n        ? theme.color.text.inverse\n        : theme.color.text.disabled;\n    }\n    switch (variant) {\n      case 'darkGrey':\n      case 'red':\n        return theme.color.text.inverse;\n      default:\n        return theme.color.text.primary;\n    }\n  }};\n  background: ${({ variant, disabled, $onSecondaryBackground }) => {\n    if (disabled) {\n      switch (variant) {\n        case 'white':\n          return Color.BackgroundLabelWhite;\n        case 'blue':\n          return Color.BackgroundLabelBlueDisabled;\n        case 'teal':\n          return Color.BackgroundLabelTealDisabled;\n        case 'green':\n        case 'success':\n          return Color.BackgroundLabelGreenDisabled;\n        case 'yellow':\n        case 'caution':\n          return Color.BackgroundLabelYellowDisabled;\n        case 'orange':\n          return Color.BackgroundLabelOrangeDisabled;\n        case 'pink':\n        case 'danger':\n          return Color.BackgroundLabelRedDisabled;\n        case 'red':\n          return Color.BackgroundLabelDarkRedDisabled;\n        case 'purple':\n        case 'primary':\n          return Color.BackgroundLabelPurpleDisabled;\n        case 'darkGrey':\n          return Color.BackgroundLabelDarkGreyDisabled;\n        case 'basic':\n        case 'grey':\n        default:\n          if ($onSecondaryBackground) {\n            // eslint-disable-next-line rulesdir/no-core-color-tokens\n            return Color.CoreSlate100;\n          }\n          return Color.BackgroundLabelGreyDisabled;\n      }\n    }\n    switch (variant) {\n      case 'white':\n        return Color.BackgroundLabelWhiteDisabled;\n      case 'blue':\n        return Color.BackgroundLabelBlue;\n      case 'teal':\n        return Color.BackgroundLabelTeal;\n      case 'green':\n      case 'success':\n        return Color.BackgroundLabelGreen;\n      case 'yellow':\n      case 'caution':\n        return Color.BackgroundLabelYellow;\n      case 'orange':\n        return Color.BackgroundLabelOrange;\n      case 'pink':\n      case 'danger':\n        return Color.BackgroundLabelRed;\n      case 'red':\n        return Color.BackgroundLabelDarkRed;\n      case 'purple':\n      case 'primary':\n        return Color.BackgroundLabelPurple;\n      case 'darkGrey':\n        return Color.BackgroundLabelDarkGrey;\n      case 'basic':\n      default:\n        if ($onSecondaryBackground) {\n          // eslint-disable-next-line rulesdir/no-core-color-tokens\n          return Color.CoreSlate200;\n        }\n        return Color.BackgroundLabelGrey;\n    }\n  }};\n`;\n\nexport const Sticker = ({\n  variant,\n  icon,\n  children,\n  onDismiss,\n  disabled,\n  dismissButtonProps,\n  isRequired,\n  onSecondaryBackground,\n  ...props\n}: StickerProps) => {\n  const hasContent = children != null;\n\n  if (!hasContent) {\n    const hasIcon = icon != null;\n    if (!hasIcon) {\n      console.warn('Sticker component requires content and/or an icon to render');\n      return null;\n    }\n\n    if (hasIcon && !props['aria-label']) {\n      console.warn('Sticker component requires an aria-label when only rendering an icon');\n    }\n  }\n\n  return (\n    <StyledSticker\n      $onSecondaryBackground={onSecondaryBackground}\n      variant={variant}\n      disabled={disabled}\n      sizeIcon={!!icon && !hasContent}\n      {...props}\n    >\n      <StickerContainer direction='horizontal' align='center' spacing={Spacing[0]}>\n        <StickerContentContainer direction='horizontal' align='center' spacing={Spacing[1]}>\n          {icon && <StickerIcon variant={variant}>{icon}</StickerIcon>}\n          {hasContent && <StyledTruncatedText>{children}</StyledTruncatedText>}\n        </StickerContentContainer>\n        {isRequired && <RequiredAsterisk>*</RequiredAsterisk>}\n      </StickerContainer>\n\n      {onDismiss && (\n        <DismissButton\n          variant={variant}\n          disabled={disabled}\n          id='sticker__dismiss-button'\n          size='sm'\n          onClick={onDismiss}\n          aria-label='Remove'\n          {...dismissButtonProps}\n        >\n          <XIcon />\n        </DismissButton>\n      )}\n    </StyledSticker>\n  );\n};\n\nexport default Sticker;\n"],"mappings":";;;;;;;;;;;;AAiBA,MAAa,uBAAuB;CAClC,OAAO;CACP,MAAM;CACN,MAAM;CACN,OAAO;CACP,QAAQ;CACR,QAAQ;CACR,MAAM;CACN,KAAK;CACL,QAAQ;CACR,UAAU;CACV,MAAM;CACP;AAwCD,MAAM,cAAc,CAAA,GAAA,kBAAA,SAAO,MAAM;YACrB,EAAE,OAAO,cAAc;AAC/B,SAAQ,SAAR;EACE,KAAK;EACL,KAAK,MACH,QAAO,MAAM,MAAM,KAAK;EAC1B,QACE,QAAO;;EAEX;;;;;;;AAQJ,MAAM,mBAAmB,kBAAA,QAAO,IAAI;WACzBA,uBAAAA,MAAM,WAAW;;;;AAK5B,MAAa,mBAAmB,CAAA,GAAA,kBAAA,SAAOC,cAAAA,MAAM;iBAC5BC,uBAAAA,QAAQ,GAAG;;;;;AAM5B,MAAa,0BAA0B,CAAA,GAAA,kBAAA,SAAO,iBAAiB;IAC3DC,oBAAAA,gBAAgB,GAAG;;;AAIvB,MAAa,sBAAsB,CAAA,GAAA,kBAAA,SAAOC,0BAAAA,cAAc;IACpDD,oBAAAA,gBAAgB,GAAG;;;;;;AAOvB,MAAM,gBAAgB,CAAA,GAAA,kBAAA,SAAOE,mBAAAA,WAAW;;uCAEDL,uBAAAA,MAAM,aAAa;;;;eAI3CE,uBAAAA,QAAQ,GAAG;mBACPI,uBAAAA,aAAa,GAAG;;;;;;;;;;;;YAYvB,EAAE,OAAO,SAAS,eAAe;AACzC,KAAI,YAAY,SAAS,YAAY,WACnC,QAAO,MAAM,MAAM,KAAK;AAE1B,QAAO,WAAW,YAAYN,uBAAAA,MAAM;EACpC;;KAECO,wBAAAA,WAAW;;;;;KAKXC,wBAAAA,mBAAmBC,wBAAAA,cAAc;;;;KAIjCC,wBAAAA,YAAYD,wBAAAA,cAAc;;;mBAGZ,EAAE,cAAc;AAC7B,KAAI,YAAY,UAAU,YAAY,QACpC,QAAOT,uBAAAA,MAAM;UACJ,YAAY,WACrB,QAAOA,uBAAAA,MAAM;UACJ,YAAY,SACrB,QAAOA,uBAAAA,MAAM;UACJ,YAAY,SAAS,YAAY,SAC1C,QAAOA,uBAAAA,MAAM;UACJ,YAAY,SACrB,QAAOA,uBAAAA,MAAM;UACJ,YAAY,YAAY,YAAY,UAC7C,QAAOA,uBAAAA,MAAM;UACJ,YAAY,WAAW,YAAY,UAC5C,QAAOA,uBAAAA,MAAM;UACJ,YAAY,OACrB,QAAOA,uBAAAA,MAAM;UACJ,YAAY,OACrB,QAAOA,uBAAAA,MAAM;UACJ,YAAY,OACrB,QAAOA,uBAAAA,MAAM;UACJ,YAAY,QACrB,QAAOA,uBAAAA,MAAM;KAEb,QAAO;EAET;;;AAIN,MAAM,gBAAgB,CAAA,GAAA,kBAAA,SAAO,MAAM;;;;mBAMhBM,uBAAAA,aAAa,GAAG;;;;YAIvB,EAAE,OAAO,SAAS,eAAe;AACzC,KAAI,SACF,QAAO,YAAY,SAAS,YAAY,aACpC,MAAM,MAAM,KAAK,UACjB,MAAM,MAAM,KAAK;AAEvB,SAAQ,SAAR;EACE,KAAK;EACL,KAAK,MACH,QAAO,MAAM,MAAM,KAAK;EAC1B,QACE,QAAO,MAAM,MAAM,KAAK;;EAE5B;iBACa,EAAE,SAAS,UAAU,6BAA6B;AAC/D,KAAI,SACF,SAAQ,SAAR;EACE,KAAK,QACH,QAAON,uBAAAA,MAAM;EACf,KAAK,OACH,QAAOA,uBAAAA,MAAM;EACf,KAAK,OACH,QAAOA,uBAAAA,MAAM;EACf,KAAK;EACL,KAAK,UACH,QAAOA,uBAAAA,MAAM;EACf,KAAK;EACL,KAAK,UACH,QAAOA,uBAAAA,MAAM;EACf,KAAK,SACH,QAAOA,uBAAAA,MAAM;EACf,KAAK;EACL,KAAK,SACH,QAAOA,uBAAAA,MAAM;EACf,KAAK,MACH,QAAOA,uBAAAA,MAAM;EACf,KAAK;EACL,KAAK,UACH,QAAOA,uBAAAA,MAAM;EACf,KAAK,WACH,QAAOA,uBAAAA,MAAM;EAGf;AACE,OAAI,uBAEF,QAAOA,uBAAAA,MAAM;AAEf,UAAOA,uBAAAA,MAAM;;AAGnB,SAAQ,SAAR;EACE,KAAK,QACH,QAAOA,uBAAAA,MAAM;EACf,KAAK,OACH,QAAOA,uBAAAA,MAAM;EACf,KAAK,OACH,QAAOA,uBAAAA,MAAM;EACf,KAAK;EACL,KAAK,UACH,QAAOA,uBAAAA,MAAM;EACf,KAAK;EACL,KAAK,UACH,QAAOA,uBAAAA,MAAM;EACf,KAAK,SACH,QAAOA,uBAAAA,MAAM;EACf,KAAK;EACL,KAAK,SACH,QAAOA,uBAAAA,MAAM;EACf,KAAK,MACH,QAAOA,uBAAAA,MAAM;EACf,KAAK;EACL,KAAK,UACH,QAAOA,uBAAAA,MAAM;EACf,KAAK,WACH,QAAOA,uBAAAA,MAAM;EAEf;AACE,OAAI,uBAEF,QAAOA,uBAAAA,MAAM;AAEf,UAAOA,uBAAAA,MAAM;;EAEjB;;AAGJ,MAAa,WAAW,EACtB,SACA,MACA,UACA,WACA,UACA,oBACA,YACA,uBACA,GAAG,YACe;CAClB,MAAM,aAAa,YAAY;AAE/B,KAAI,CAAC,YAAY;EACf,MAAM,UAAU,QAAQ;AACxB,MAAI,CAAC,SAAS;AACZ,WAAQ,KAAK,8DAA8D;AAC3E,UAAO;;AAGT,MAAI,WAAW,CAAC,MAAM,cACpB,SAAQ,KAAK,uEAAuE;;AAIxF,QACE,iBAAA,GAAA,kBAAA,MAAC,eAAD;EACE,wBAAwB;EACf;EACC;EACV,UAAU,CAAC,CAAC,QAAQ,CAAC;EACrB,GAAI;YALN,CAOE,iBAAA,GAAA,kBAAA,MAAC,kBAAD;GAAkB,WAAU;GAAa,OAAM;GAAS,SAASE,uBAAAA,QAAQ;aAAzE,CACE,iBAAA,GAAA,kBAAA,MAAC,yBAAD;IAAyB,WAAU;IAAa,OAAM;IAAS,SAASA,uBAAAA,QAAQ;cAAhF,CACG,QAAQ,iBAAA,GAAA,kBAAA,KAAC,aAAD;KAAsB;eAAU;KAAmB,CAAA,EAC3D,cAAc,iBAAA,GAAA,kBAAA,KAAC,qBAAD,EAAsB,UAA+B,CAAA,CAC5C;OACzB,cAAc,iBAAA,GAAA,kBAAA,KAAC,kBAAD,EAAA,UAAkB,KAAoB,CAAA,CACpC;MAElB,aACC,iBAAA,GAAA,kBAAA,KAAC,eAAD;GACW;GACC;GACV,IAAG;GACH,MAAK;GACL,SAAS;GACT,cAAW;GACX,GAAI;aAEJ,iBAAA,GAAA,kBAAA,KAACS,oBAAAA,OAAD,EAAS,CAAA;GACK,CAAA,CAEJ"}

package/dist/Sticker.d.cts

@@ -1,2 +0,0 @@
-import { a as StickerContentContainer, i as StickerContainer, n as STICKER_COLOR_CONFIG, o as StickerProps, r as Sticker, s as StyledTruncatedText, t as LabelBackgrounds } from "./Sticker-CI-XxUmM.cjs";
-export { LabelBackgrounds, STICKER_COLOR_CONFIG, Sticker, Sticker as default, StickerContainer, StickerContentContainer, StickerProps, StyledTruncatedText };

package/dist/SwatchPicker.d.cts

@@ -1,18 +0,0 @@
-import { ComponentPropsWithoutRef } from "react";
-import * as _$react_jsx_runtime0 from "react/jsx-runtime.js";
-
-//#region components/SwatchPicker/SwatchPicker.d.ts
-interface SwatchPickerProps extends Omit<ComponentPropsWithoutRef<'div'>, 'onChange'> {
-  value: string;
-  onChange: (color: string) => void;
-  colors: string[];
-}
-declare const SwatchPicker: ({
-  value,
-  onChange,
-  colors,
-  ...restProps
-}: SwatchPickerProps) => _$react_jsx_runtime0.JSX.Element;
-//#endregion
-export { SwatchPicker, SwatchPicker as default, SwatchPickerProps };
-//# sourceMappingURL=SwatchPicker.d.cts.map

package/dist/Tab.d.cts

@@ -1,26 +0,0 @@
-import { r as ButtonProps, t as Button } from "./Button-C_3p5Xfi.cjs";
-import * as _$react from "react";
-import { ComponentPropsWithoutRef, ElementType, ReactElement } from "react";
-import * as _$styled_components0 from "styled-components";
-import * as _$react_jsx_runtime0 from "react/jsx-runtime.js";
-
-//#region components/TabBar/Tab.d.ts
-interface TabProps<T extends ElementType = 'button'> extends ComponentPropsWithoutRef<typeof Button> {
-  selected?: boolean;
-  badge?: ReactElement;
-  as?: T;
-  size?: 'md' | 'sm';
-}
-declare const StyledTab: _$styled_components0.StyledComponent<_$react.ForwardRefExoticComponent<Omit<ButtonProps, "ref"> & _$react.RefAttributes<HTMLButtonElement>>, any, TabProps<"button">, never>;
-declare const Tab: <T extends ElementType = "button">({
-  selected,
-  disabled,
-  children,
-  badge,
-  as,
-  size,
-  ...elemProps
-}: TabProps<T> & ComponentPropsWithoutRef<T>) => _$react_jsx_runtime0.JSX.Element;
-//#endregion
-export { StyledTab, Tab as default };
-//# sourceMappingURL=Tab.d.cts.map

package/dist/TabBar-PFaDNRw0.cjs

@@ -1,298 +0,0 @@
-const require_chunk = require("./chunk-CKQMccvm.cjs");
-const require_lib_pseudoClass = require("./lib/pseudoClass.cjs");
-require("./variables/transitions.cjs");
-const require_mixins_text = require("./mixins/text.cjs");
-const require_IconButton = require("./IconButton-nlgjJQCS.cjs");
-const require_Badge = require("./Badge-ADPloFsd.cjs");
-let _persona_design_tokens = require("@persona/design-tokens");
-let styled_components = require("styled-components");
-styled_components = require_chunk.__toESM(styled_components);
-let react_jsx_runtime = require("react/jsx-runtime");
-let react = require("react");
-let _react_aria_utils = require("@react-aria/utils");
-//#region components/TabBar/TabBarContext.ts
-var TabBarContext_default = (0, react.createContext)({});
-//#endregion
-//#region components/TabBar/TabBar.tsx
-const TabBarContainer = styled_components.default.div`
-  display: flex;
-  height: ${_persona_design_tokens.Spacing[6]};
-  position: relative;
-  box-sizing: border-box;
-  border-bottom: 1px solid ${_persona_design_tokens.Color.BorderDivider};
-  justify-content: space-between;
-  gap: ${_persona_design_tokens.Spacing[4]};
-`;
-const RightActions = styled_components.default.div`
-  align-self: center;
-`;
-const TitleTab = styled_components.default.div`
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  ${require_mixins_text.paragraphMixins.mdBold};
-`;
-const StyledTabContainer = styled_components.default.div`
-  display: flex;
-  gap: ${({ $size = "md" }) => $size === "sm" ? _persona_design_tokens.Spacing[3] : _persona_design_tokens.Spacing[4]};
-  // These two lines prevent the overflow hidden from hiding the bottom border of the selected tab
-  margin-bottom: -2px;
-  padding-bottom: 2px;
-  overflow: hidden;
-  flex-wrap: wrap;
-`;
-const TabContainer = (0, react.forwardRef)(function TabContainer({ children, maxTabChars, size, ...props }, forwardedRef) {
-	const tabListRef = (0, react.useRef)(null);
-	const getIndexOfCurrentTab = (list) => {
-		return getIndex(list, document.activeElement);
-	};
-	const handleKeyDown = (e) => {
-		const list = getTabList(tabListRef.current.children);
-		if (document.activeElement && !list.includes(document.activeElement)) return;
-		switch (e.key) {
-			case "ArrowLeft": {
-				const curIndex = getIndexOfCurrentTab(list);
-				list[curIndex === 0 ? list.length - 1 : curIndex - 1].focus();
-				break;
-			}
-			case "ArrowRight":
-				list[(getIndexOfCurrentTab(list) + 1) % list.length].focus();
-				break;
-			case "Home":
-				list[0].focus();
-				break;
-			case "End":
-				list[list.length - 1].focus();
-				break;
-			default: break;
-		}
-	};
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TabBarContext_default.Provider, {
-		value: {
-			maxTabChars,
-			size
-		},
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyledTabContainer, {
-			role: "tablist",
-			ref: (0, _react_aria_utils.mergeRefs)(tabListRef, forwardedRef),
-			onKeyDown: handleKeyDown,
-			$size: size,
-			...props,
-			children
-		})
-	});
-});
-const getIndex = (children, element) => {
-	return children.indexOf(element);
-};
-const getTabList = (list) => {
-	return Array.from(list).filter((e) => {
-		return !(e.getAttribute("aria-disabled") || e.getAttribute("disabled"));
-	});
-};
-const TabBar = (0, react.forwardRef)(function TabBar({ children, actions, title, "data-tour-target": dataTourTarget, maxTabChars, size, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, ...elemProps }, forwardedRef) {
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(TabBarContainer, {
-		...elemProps,
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(TabContainer, {
-			ref: forwardedRef,
-			maxTabChars,
-			size,
-			"aria-label": ariaLabel,
-			"aria-labelledby": ariaLabelledBy,
-			children: [title && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TitleTab, {
-				"data-tour-target": dataTourTarget,
-				children: title
-			}), children]
-		}), actions && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RightActions, { children: actions })]
-	});
-});
-//#endregion
-//#region components/TabBar/Tab.tsx
-const BadgeContainer = styled_components.default.span`
-  display: inline-flex;
-  vertical-align: middle;
-  padding: 0;
-  margin-left: ${_persona_design_tokens.Spacing[1]};
-`;
-const sizeStyles = {
-	md: styled_components.css`
-    ${require_mixins_text.paragraphMixins.md}
-  `,
-	sm: styled_components.css`
-    ${require_mixins_text.paragraphMixins.sm}
-  `
-};
-const tabSelectedStyle = styled_components.css`
-  color: ${({ theme }) => theme.color.primary.brand};
-  border-bottom-color: ${({ theme }) => theme.color.primary.brand};
-  box-shadow: none;
-  &:after {
-    transition: border-bottom-color ${"200ms"};
-    border-bottom-color: ${({ theme }) => theme.color.primary.brand};
-  }
-`;
-const StyledTab = (0, styled_components.default)(require_IconButton.Button).attrs({
-	width: "auto",
-	variant: "basic"
-})`
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  position: relative;
-  white-space: nowrap;
-  background-color: transparent;
-  color: ${({ theme, disabled }) => disabled ? theme.color.variants.basic.textDisabled : theme.color.text.tertiary};
-  transition: color ${"200ms"} ease-out;
-  height: 32px;
-  margin: 0;
-  padding: 0;
-  ${({ size }) => sizeStyles[size || "md"]};
-  outline: none;
-  border-radius: ${({ theme }) => theme.button.borderRadius};
-
-  a {
-    color: currentColor;
-  }
-
-  /* remove default button focused/hovered box shadow */
-  &${require_lib_pseudoClass.isActive}${require_lib_pseudoClass.isNotDisabled} {
-    background-color: unset;
-  }
-  &${require_lib_pseudoClass.isHovered}${require_lib_pseudoClass.isNotDisabled} {
-    background-color: unset;
-    ${({ selected }) => !selected && styled_components.css`
-        color: ${_persona_design_tokens.Color.TextPrimary};
-      `}
-  }
-  &${require_lib_pseudoClass.isFocused}${require_lib_pseudoClass.isNotDisabled} {
-    box-shadow: none;
-    background-color: unset;
-  }
-  &${require_lib_pseudoClass.isHovered}${require_lib_pseudoClass.isFocused}${require_lib_pseudoClass.isNotDisabled} {
-    background-color: unset;
-  }
-  &:disabled {
-    background-color: unset;
-  }
-
-  &:after {
-    position: absolute;
-    bottom: 0px;
-    width: 100%;
-    border-bottom: 1px solid transparent;
-    content: '';
-  }
-
-  &.selected,
-  &.active {
-    ${tabSelectedStyle}
-  }
-
-  ${({ selected }) => selected && tabSelectedStyle}
-
-  ${({ disabled }) => disabled && styled_components.css`
-      cursor: default;
-    `}
-
-  a& {
-    text-decoration: none;
-  }
-`;
-/**
-* Helper function to truncate text if it exceeds maxCharacters
-*/
-const truncateText = (text, maxCharacters) => {
-	if (text.length <= maxCharacters) return text;
-	return `${text.substring(0, maxCharacters).trimEnd()}...`;
-};
-const Tab = ({ selected, disabled, children, badge, as, size, ...elemProps }) => {
-	const { maxTabChars, size: contextSize } = (0, react.useContext)(TabBarContext_default);
-	const finalSize = size || contextSize || "md";
-	const hasTruncation = maxTabChars && typeof children === "string";
-	const displayChildren = hasTruncation ? truncateText(children, maxTabChars) : children;
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(StyledTab, {
-		role: "tab",
-		selected,
-		"aria-selected": selected,
-		"aria-disabled": disabled,
-		disabled,
-		as,
-		size: finalSize,
-		title: hasTruncation ? children : void 0,
-		...elemProps,
-		children: [displayChildren, badge && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BadgeContainer, { children: badge.type === require_Badge.Badge ? (0, react.cloneElement)(badge, {
-			variant: selected ? "active" : "basic",
-			onSecondaryBackground: true
-		}) : badge })]
-	});
-};
-//#endregion
-//#region components/TabBar/TabBarIconButton.tsx
-var TabBarIconButton_default = (0, styled_components.default)(require_IconButton.IconButton).attrs({ size: "sm" })`
-  padding-left: ${_persona_design_tokens.Spacing[2]};
-  padding-right: ${_persona_design_tokens.Spacing[2]};
-  border-radius: ${_persona_design_tokens.BorderRadius.Sm};
-
-  // remove default button focused/hovered box shadow
-  &${require_lib_pseudoClass.isActive}${require_lib_pseudoClass.isNotDisabled} {
-    background-color: transparent;
-  }
-  &${require_lib_pseudoClass.isHovered}${require_lib_pseudoClass.isNotDisabled} {
-    box-shadow: none;
-  }
-  &${require_lib_pseudoClass.isFocused}${require_lib_pseudoClass.isNotDisabled} {
-    box-shadow: none;
-  }
-  &${require_lib_pseudoClass.isHovered}${require_lib_pseudoClass.isFocused}${require_lib_pseudoClass.isNotDisabled} {
-    box-shadow: none;
-  }
-  &:disabled {
-    background-color: transparent;
-  }
-  &:focus-visible${require_lib_pseudoClass.isNotDisabled}, &${require_lib_pseudoClass.isHovered}${require_lib_pseudoClass.isNotDisabled}:focus-visible {
-    box-shadow: 0 0 0 3px ${({ theme }) => theme.color.variants.basic.highlight};
-  }
-
-  svg {
-    color: ${_persona_design_tokens.Color.CoreSlate800};
-  }
-
-  &:hover {
-    svg {
-      color: ${_persona_design_tokens.Color.CoreSlate900};
-    }
-  }
-`;
-//#endregion
-Object.defineProperty(exports, "StyledTab", {
-	enumerable: true,
-	get: function() {
-		return StyledTab;
-	}
-});
-Object.defineProperty(exports, "Tab", {
-	enumerable: true,
-	get: function() {
-		return Tab;
-	}
-});
-Object.defineProperty(exports, "TabBar", {
-	enumerable: true,
-	get: function() {
-		return TabBar;
-	}
-});
-Object.defineProperty(exports, "TabBarIconButton_default", {
-	enumerable: true,
-	get: function() {
-		return TabBarIconButton_default;
-	}
-});
-Object.defineProperty(exports, "TabContainer", {
-	enumerable: true,
-	get: function() {
-		return TabContainer;
-	}
-});
-
-//# sourceMappingURL=TabBar-PFaDNRw0.cjs.map

package/dist/TabBar-PFaDNRw0.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"TabBar-PFaDNRw0.cjs","names":["Spacing","Color","paragraphMixins","TabBarContext","Spacing","paragraphMixins","Button","isActive","isNotDisabled","isHovered","Color","isFocused","TabBarContext","Badge","IconButton","Spacing","BorderRadius","isActive","isNotDisabled","isHovered","isFocused","Color"],"sources":["../components/TabBar/TabBarContext.ts","../components/TabBar/TabBar.tsx","../components/TabBar/Tab.tsx","../components/TabBar/TabBarIconButton.tsx"],"sourcesContent":["import { createContext } from 'react';\n\nexport default createContext<{ maxTabChars?: number; size?: 'md' | 'sm' }>({});\n","import { mergeRefs } from '@react-aria/utils';\nimport {\n  type ComponentPropsWithoutRef,\n  type ForwardedRef,\n  forwardRef,\n  type KeyboardEventHandler,\n  type ReactNode,\n  useRef,\n} from 'react';\nimport styled from 'styled-components';\n\nimport { Color, Spacing } from '@persona/design-tokens';\nimport TabBarContext from 'design-system/components/TabBar/TabBarContext';\nimport { paragraphMixins } from 'design-system/mixins/text';\n\nconst TabBarContainer = styled.div`\n  display: flex;\n  height: ${Spacing[6]};\n  position: relative;\n  box-sizing: border-box;\n  border-bottom: 1px solid ${Color.BorderDivider};\n  justify-content: space-between;\n  gap: ${Spacing[4]};\n`;\n\nconst RightActions = styled.div`\n  align-self: center;\n`;\n\nconst TitleTab = styled.div`\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  ${paragraphMixins.mdBold};\n`;\n\nconst StyledTabContainer = styled.div<{ $size?: 'md' | 'sm' }>`\n  display: flex;\n  gap: ${({ $size = 'md' }) => ($size === 'sm' ? Spacing[3] : Spacing[4])};\n  // These two lines prevent the overflow hidden from hiding the bottom border of the selected tab\n  margin-bottom: -2px;\n  padding-bottom: 2px;\n  overflow: hidden;\n  flex-wrap: wrap;\n`;\n\ninterface TabContainerProps extends ComponentPropsWithoutRef<'div'> {\n  children: ReactNode;\n  /**\n   * Truncate tab text to the specified number of characters.\n   */\n  maxTabChars?: number;\n  /**\n   * Size of the tabs. Affects font size.\n   */\n  size?: 'md' | 'sm';\n}\n\nexport const TabContainer = forwardRef<HTMLDivElement, TabContainerProps>(function TabContainer(\n  { children, maxTabChars, size, ...props },\n  forwardedRef,\n) {\n  const tabListRef = useRef<HTMLDivElement>(null);\n\n  const getIndexOfCurrentTab = (list: Element[]) => {\n    /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n    return getIndex(list, document.activeElement);\n  };\n\n  const handleKeyDown: KeyboardEventHandler<HTMLDivElement> = (e) => {\n    // https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/tab_role\n    /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n    const list = getTabList(tabListRef.current.children);\n\n    if (document.activeElement && !list.includes(document.activeElement)) {\n      return;\n    }\n\n    switch (e.key) {\n      case 'ArrowLeft': {\n        // Go to previous tab\n        const curIndex = getIndexOfCurrentTab(list);\n        const nextIndex = curIndex === 0 ? list.length - 1 : curIndex - 1;\n        (list[nextIndex] as HTMLElement).focus();\n        break;\n      }\n      case 'ArrowRight': {\n        // Go to next tab\n        const curIndex = getIndexOfCurrentTab(list);\n        (list[(curIndex + 1) % list.length] as HTMLElement).focus();\n        break;\n      }\n      case 'Home': {\n        // Go to first tab\n        (list[0] as HTMLElement).focus();\n        break;\n      }\n      case 'End': {\n        // Go to last tab\n        (list[list.length - 1] as HTMLElement).focus();\n        break;\n      }\n      default:\n        break;\n    }\n  };\n\n  return (\n    <TabBarContext.Provider value={{ maxTabChars, size }}>\n      <StyledTabContainer\n        role='tablist'\n        ref={mergeRefs<HTMLDivElement>(tabListRef, forwardedRef)}\n        onKeyDown={handleKeyDown}\n        $size={size}\n        {...props}\n      >\n        {children}\n      </StyledTabContainer>\n    </TabBarContext.Provider>\n  );\n});\n\nconst getIndex = (children: Element[], element: Element) => {\n  return children.indexOf(element);\n};\n\nconst getTabList = (list: HTMLCollection) => {\n  /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n  return Array.from(list).filter((e: HTMLElement) => {\n    return !(e.getAttribute('aria-disabled') || e.getAttribute('disabled'));\n  });\n};\n\nexport interface TabBarProps extends ComponentPropsWithoutRef<'div'> {\n  actions?: ReactNode;\n  title?: string;\n  'data-tour-target'?: string;\n  /**\n   * Truncate tab text to the specified number of characters.\n   */\n  maxTabChars?: number;\n  /**\n   * Size of the tabs. Affects font size.\n   */\n  size?: 'md' | 'sm';\n}\n\nexport const TabBar = forwardRef<HTMLDivElement, TabBarProps>(function TabBar(\n  {\n    children,\n    actions,\n    title,\n    'data-tour-target': dataTourTarget,\n    maxTabChars,\n    size,\n    'aria-label': ariaLabel,\n    'aria-labelledby': ariaLabelledBy,\n    ...elemProps\n  },\n  forwardedRef: ForwardedRef<HTMLDivElement>,\n) {\n  return (\n    <TabBarContainer {...elemProps}>\n      <TabContainer\n        ref={forwardedRef}\n        maxTabChars={maxTabChars}\n        size={size}\n        aria-label={ariaLabel}\n        aria-labelledby={ariaLabelledBy}\n      >\n        {title && <TitleTab data-tour-target={dataTourTarget}>{title}</TitleTab>}\n        {children}\n      </TabContainer>\n      {actions && <RightActions>{actions}</RightActions>}\n    </TabBarContainer>\n  );\n});\n\nexport default TabBar;\n","import {\n  cloneElement,\n  type ComponentPropsWithoutRef,\n  type ElementType,\n  type ReactElement,\n  useContext,\n} from 'react';\nimport styled, {\n  css,\n  type DefaultTheme,\n  type FlattenInterpolation,\n  type ThemeProps,\n} from 'styled-components';\n\nimport { Color, Spacing } from '@persona/design-tokens';\nimport Badge from 'design-system/components/Badge';\nimport Button from 'design-system/components/Button';\nimport TabBarContext from 'design-system/components/TabBar/TabBarContext';\nimport { isActive, isFocused, isHovered, isNotDisabled } from 'design-system/lib/pseudoClass';\nimport { paragraphMixins } from 'design-system/mixins/text';\nimport { TransitionDuration } from 'design-system/variables/transitions';\n\ninterface TabProps<T extends ElementType = 'button'> extends ComponentPropsWithoutRef<\n  typeof Button\n> {\n  selected?: boolean;\n  badge?: ReactElement;\n  as?: T;\n  size?: 'md' | 'sm';\n}\n\nconst BadgeContainer = styled.span`\n  display: inline-flex;\n  vertical-align: middle;\n  padding: 0;\n  margin-left: ${Spacing[1]};\n`;\n\nconst sizeStyles: Record<\n  NonNullable<TabProps['size']>,\n  FlattenInterpolation<ThemeProps<DefaultTheme>>\n> = {\n  md: css`\n    ${paragraphMixins.md}\n  `,\n  sm: css`\n    ${paragraphMixins.sm}\n  `,\n};\n\nconst tabSelectedStyle = css`\n  color: ${({ theme }) => theme.color.primary.brand};\n  border-bottom-color: ${({ theme }) => theme.color.primary.brand};\n  box-shadow: none;\n  &:after {\n    transition: border-bottom-color ${TransitionDuration.Fast};\n    border-bottom-color: ${({ theme }) => theme.color.primary.brand};\n  }\n`;\n\nexport const StyledTab = styled(Button).attrs<TabProps>({\n  width: 'auto',\n  variant: 'basic',\n})<TabProps>`\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  position: relative;\n  white-space: nowrap;\n  background-color: transparent;\n  color: ${({ theme, disabled }) =>\n    disabled ? theme.color.variants.basic.textDisabled : theme.color.text.tertiary};\n  transition: color ${TransitionDuration.Fast} ease-out;\n  height: 32px;\n  margin: 0;\n  padding: 0;\n  ${({ size }) => sizeStyles[size || 'md']};\n  outline: none;\n  border-radius: ${({ theme }) => theme.button.borderRadius};\n\n  a {\n    color: currentColor;\n  }\n\n  /* remove default button focused/hovered box shadow */\n  &${isActive}${isNotDisabled} {\n    background-color: unset;\n  }\n  &${isHovered}${isNotDisabled} {\n    background-color: unset;\n    ${({ selected }) =>\n      !selected &&\n      css`\n        color: ${Color.TextPrimary};\n      `}\n  }\n  &${isFocused}${isNotDisabled} {\n    box-shadow: none;\n    background-color: unset;\n  }\n  &${isHovered}${isFocused}${isNotDisabled} {\n    background-color: unset;\n  }\n  &:disabled {\n    background-color: unset;\n  }\n\n  &:after {\n    position: absolute;\n    bottom: 0px;\n    width: 100%;\n    border-bottom: 1px solid transparent;\n    content: '';\n  }\n\n  &.selected,\n  &.active {\n    ${tabSelectedStyle}\n  }\n\n  ${({ selected }) => selected && tabSelectedStyle}\n\n  ${({ disabled }) =>\n    disabled &&\n    css`\n      cursor: default;\n    `}\n\n  a& {\n    text-decoration: none;\n  }\n`;\n\n/**\n * Helper function to truncate text if it exceeds maxCharacters\n */\nconst truncateText = (text: string, maxCharacters: number): string => {\n  if (text.length <= maxCharacters) {\n    return text;\n  }\n  return `${text.substring(0, maxCharacters).trimEnd()}...`;\n};\n\nconst Tab = <T extends ElementType = 'button'>({\n  selected,\n  disabled,\n  children,\n  badge,\n  as,\n  size,\n  ...elemProps\n}: TabProps<T> & ComponentPropsWithoutRef<T>) => {\n  const { maxTabChars, size: contextSize } = useContext(TabBarContext);\n  const finalSize = size || contextSize || 'md';\n\n  // Truncate text if maxTabChars is provided and children is a string\n  const hasTruncation = maxTabChars && typeof children === 'string';\n  const displayChildren = hasTruncation ? truncateText(children, maxTabChars) : children;\n\n  return (\n    <StyledTab\n      role='tab'\n      selected={selected}\n      aria-selected={selected}\n      aria-disabled={disabled}\n      disabled={disabled}\n      as={as as ElementType}\n      size={finalSize}\n      title={hasTruncation ? children : undefined}\n      {...elemProps}\n    >\n      {displayChildren}\n      {badge && (\n        <BadgeContainer>\n          {badge.type === Badge\n            ? cloneElement(badge, {\n                variant: selected ? 'active' : 'basic',\n                onSecondaryBackground: true,\n              })\n            : badge}\n        </BadgeContainer>\n      )}\n    </StyledTab>\n  );\n};\n\nexport default Tab;\n","import styled from 'styled-components';\n\nimport { BorderRadius, Color, Spacing } from '@persona/design-tokens';\nimport { IconButton } from 'design-system/components/Button';\nimport { isActive, isFocused, isHovered, isNotDisabled } from 'design-system/lib/pseudoClass';\n\nexport default styled(IconButton).attrs({\n  size: 'sm',\n})`\n  padding-left: ${Spacing[2]};\n  padding-right: ${Spacing[2]};\n  border-radius: ${BorderRadius.Sm};\n\n  // remove default button focused/hovered box shadow\n  &${isActive}${isNotDisabled} {\n    background-color: transparent;\n  }\n  &${isHovered}${isNotDisabled} {\n    box-shadow: none;\n  }\n  &${isFocused}${isNotDisabled} {\n    box-shadow: none;\n  }\n  &${isHovered}${isFocused}${isNotDisabled} {\n    box-shadow: none;\n  }\n  &:disabled {\n    background-color: transparent;\n  }\n  &:focus-visible${isNotDisabled}, &${isHovered}${isNotDisabled}:focus-visible {\n    box-shadow: 0 0 0 3px ${({ theme }) => theme.color.variants.basic.highlight};\n  }\n\n  svg {\n    color: ${Color.CoreSlate800};\n  }\n\n  &:hover {\n    svg {\n      color: ${Color.CoreSlate900};\n    }\n  }\n`;\n"],"mappings":"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"}

package/dist/TabBar-zSA8kyE6.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"TabBar-zSA8kyE6.mjs","names":["TabBarContext","TabBarContext"],"sources":["../components/TabBar/TabBarContext.ts","../components/TabBar/TabBar.tsx","../components/TabBar/Tab.tsx","../components/TabBar/TabBarIconButton.tsx"],"sourcesContent":["import { createContext } from 'react';\n\nexport default createContext<{ maxTabChars?: number; size?: 'md' | 'sm' }>({});\n","import { mergeRefs } from '@react-aria/utils';\nimport {\n  type ComponentPropsWithoutRef,\n  type ForwardedRef,\n  forwardRef,\n  type KeyboardEventHandler,\n  type ReactNode,\n  useRef,\n} from 'react';\nimport styled from 'styled-components';\n\nimport { Color, Spacing } from '@persona/design-tokens';\nimport TabBarContext from 'design-system/components/TabBar/TabBarContext';\nimport { paragraphMixins } from 'design-system/mixins/text';\n\nconst TabBarContainer = styled.div`\n  display: flex;\n  height: ${Spacing[6]};\n  position: relative;\n  box-sizing: border-box;\n  border-bottom: 1px solid ${Color.BorderDivider};\n  justify-content: space-between;\n  gap: ${Spacing[4]};\n`;\n\nconst RightActions = styled.div`\n  align-self: center;\n`;\n\nconst TitleTab = styled.div`\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  ${paragraphMixins.mdBold};\n`;\n\nconst StyledTabContainer = styled.div<{ $size?: 'md' | 'sm' }>`\n  display: flex;\n  gap: ${({ $size = 'md' }) => ($size === 'sm' ? Spacing[3] : Spacing[4])};\n  // These two lines prevent the overflow hidden from hiding the bottom border of the selected tab\n  margin-bottom: -2px;\n  padding-bottom: 2px;\n  overflow: hidden;\n  flex-wrap: wrap;\n`;\n\ninterface TabContainerProps extends ComponentPropsWithoutRef<'div'> {\n  children: ReactNode;\n  /**\n   * Truncate tab text to the specified number of characters.\n   */\n  maxTabChars?: number;\n  /**\n   * Size of the tabs. Affects font size.\n   */\n  size?: 'md' | 'sm';\n}\n\nexport const TabContainer = forwardRef<HTMLDivElement, TabContainerProps>(function TabContainer(\n  { children, maxTabChars, size, ...props },\n  forwardedRef,\n) {\n  const tabListRef = useRef<HTMLDivElement>(null);\n\n  const getIndexOfCurrentTab = (list: Element[]) => {\n    /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n    return getIndex(list, document.activeElement);\n  };\n\n  const handleKeyDown: KeyboardEventHandler<HTMLDivElement> = (e) => {\n    // https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/tab_role\n    /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n    const list = getTabList(tabListRef.current.children);\n\n    if (document.activeElement && !list.includes(document.activeElement)) {\n      return;\n    }\n\n    switch (e.key) {\n      case 'ArrowLeft': {\n        // Go to previous tab\n        const curIndex = getIndexOfCurrentTab(list);\n        const nextIndex = curIndex === 0 ? list.length - 1 : curIndex - 1;\n        (list[nextIndex] as HTMLElement).focus();\n        break;\n      }\n      case 'ArrowRight': {\n        // Go to next tab\n        const curIndex = getIndexOfCurrentTab(list);\n        (list[(curIndex + 1) % list.length] as HTMLElement).focus();\n        break;\n      }\n      case 'Home': {\n        // Go to first tab\n        (list[0] as HTMLElement).focus();\n        break;\n      }\n      case 'End': {\n        // Go to last tab\n        (list[list.length - 1] as HTMLElement).focus();\n        break;\n      }\n      default:\n        break;\n    }\n  };\n\n  return (\n    <TabBarContext.Provider value={{ maxTabChars, size }}>\n      <StyledTabContainer\n        role='tablist'\n        ref={mergeRefs<HTMLDivElement>(tabListRef, forwardedRef)}\n        onKeyDown={handleKeyDown}\n        $size={size}\n        {...props}\n      >\n        {children}\n      </StyledTabContainer>\n    </TabBarContext.Provider>\n  );\n});\n\nconst getIndex = (children: Element[], element: Element) => {\n  return children.indexOf(element);\n};\n\nconst getTabList = (list: HTMLCollection) => {\n  /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n  return Array.from(list).filter((e: HTMLElement) => {\n    return !(e.getAttribute('aria-disabled') || e.getAttribute('disabled'));\n  });\n};\n\nexport interface TabBarProps extends ComponentPropsWithoutRef<'div'> {\n  actions?: ReactNode;\n  title?: string;\n  'data-tour-target'?: string;\n  /**\n   * Truncate tab text to the specified number of characters.\n   */\n  maxTabChars?: number;\n  /**\n   * Size of the tabs. Affects font size.\n   */\n  size?: 'md' | 'sm';\n}\n\nexport const TabBar = forwardRef<HTMLDivElement, TabBarProps>(function TabBar(\n  {\n    children,\n    actions,\n    title,\n    'data-tour-target': dataTourTarget,\n    maxTabChars,\n    size,\n    'aria-label': ariaLabel,\n    'aria-labelledby': ariaLabelledBy,\n    ...elemProps\n  },\n  forwardedRef: ForwardedRef<HTMLDivElement>,\n) {\n  return (\n    <TabBarContainer {...elemProps}>\n      <TabContainer\n        ref={forwardedRef}\n        maxTabChars={maxTabChars}\n        size={size}\n        aria-label={ariaLabel}\n        aria-labelledby={ariaLabelledBy}\n      >\n        {title && <TitleTab data-tour-target={dataTourTarget}>{title}</TitleTab>}\n        {children}\n      </TabContainer>\n      {actions && <RightActions>{actions}</RightActions>}\n    </TabBarContainer>\n  );\n});\n\nexport default TabBar;\n","import {\n  cloneElement,\n  type ComponentPropsWithoutRef,\n  type ElementType,\n  type ReactElement,\n  useContext,\n} from 'react';\nimport styled, {\n  css,\n  type DefaultTheme,\n  type FlattenInterpolation,\n  type ThemeProps,\n} from 'styled-components';\n\nimport { Color, Spacing } from '@persona/design-tokens';\nimport Badge from 'design-system/components/Badge';\nimport Button from 'design-system/components/Button';\nimport TabBarContext from 'design-system/components/TabBar/TabBarContext';\nimport { isActive, isFocused, isHovered, isNotDisabled } from 'design-system/lib/pseudoClass';\nimport { paragraphMixins } from 'design-system/mixins/text';\nimport { TransitionDuration } from 'design-system/variables/transitions';\n\ninterface TabProps<T extends ElementType = 'button'> extends ComponentPropsWithoutRef<\n  typeof Button\n> {\n  selected?: boolean;\n  badge?: ReactElement;\n  as?: T;\n  size?: 'md' | 'sm';\n}\n\nconst BadgeContainer = styled.span`\n  display: inline-flex;\n  vertical-align: middle;\n  padding: 0;\n  margin-left: ${Spacing[1]};\n`;\n\nconst sizeStyles: Record<\n  NonNullable<TabProps['size']>,\n  FlattenInterpolation<ThemeProps<DefaultTheme>>\n> = {\n  md: css`\n    ${paragraphMixins.md}\n  `,\n  sm: css`\n    ${paragraphMixins.sm}\n  `,\n};\n\nconst tabSelectedStyle = css`\n  color: ${({ theme }) => theme.color.primary.brand};\n  border-bottom-color: ${({ theme }) => theme.color.primary.brand};\n  box-shadow: none;\n  &:after {\n    transition: border-bottom-color ${TransitionDuration.Fast};\n    border-bottom-color: ${({ theme }) => theme.color.primary.brand};\n  }\n`;\n\nexport const StyledTab = styled(Button).attrs<TabProps>({\n  width: 'auto',\n  variant: 'basic',\n})<TabProps>`\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  position: relative;\n  white-space: nowrap;\n  background-color: transparent;\n  color: ${({ theme, disabled }) =>\n    disabled ? theme.color.variants.basic.textDisabled : theme.color.text.tertiary};\n  transition: color ${TransitionDuration.Fast} ease-out;\n  height: 32px;\n  margin: 0;\n  padding: 0;\n  ${({ size }) => sizeStyles[size || 'md']};\n  outline: none;\n  border-radius: ${({ theme }) => theme.button.borderRadius};\n\n  a {\n    color: currentColor;\n  }\n\n  /* remove default button focused/hovered box shadow */\n  &${isActive}${isNotDisabled} {\n    background-color: unset;\n  }\n  &${isHovered}${isNotDisabled} {\n    background-color: unset;\n    ${({ selected }) =>\n      !selected &&\n      css`\n        color: ${Color.TextPrimary};\n      `}\n  }\n  &${isFocused}${isNotDisabled} {\n    box-shadow: none;\n    background-color: unset;\n  }\n  &${isHovered}${isFocused}${isNotDisabled} {\n    background-color: unset;\n  }\n  &:disabled {\n    background-color: unset;\n  }\n\n  &:after {\n    position: absolute;\n    bottom: 0px;\n    width: 100%;\n    border-bottom: 1px solid transparent;\n    content: '';\n  }\n\n  &.selected,\n  &.active {\n    ${tabSelectedStyle}\n  }\n\n  ${({ selected }) => selected && tabSelectedStyle}\n\n  ${({ disabled }) =>\n    disabled &&\n    css`\n      cursor: default;\n    `}\n\n  a& {\n    text-decoration: none;\n  }\n`;\n\n/**\n * Helper function to truncate text if it exceeds maxCharacters\n */\nconst truncateText = (text: string, maxCharacters: number): string => {\n  if (text.length <= maxCharacters) {\n    return text;\n  }\n  return `${text.substring(0, maxCharacters).trimEnd()}...`;\n};\n\nconst Tab = <T extends ElementType = 'button'>({\n  selected,\n  disabled,\n  children,\n  badge,\n  as,\n  size,\n  ...elemProps\n}: TabProps<T> & ComponentPropsWithoutRef<T>) => {\n  const { maxTabChars, size: contextSize } = useContext(TabBarContext);\n  const finalSize = size || contextSize || 'md';\n\n  // Truncate text if maxTabChars is provided and children is a string\n  const hasTruncation = maxTabChars && typeof children === 'string';\n  const displayChildren = hasTruncation ? truncateText(children, maxTabChars) : children;\n\n  return (\n    <StyledTab\n      role='tab'\n      selected={selected}\n      aria-selected={selected}\n      aria-disabled={disabled}\n      disabled={disabled}\n      as={as as ElementType}\n      size={finalSize}\n      title={hasTruncation ? children : undefined}\n      {...elemProps}\n    >\n      {displayChildren}\n      {badge && (\n        <BadgeContainer>\n          {badge.type === Badge\n            ? cloneElement(badge, {\n                variant: selected ? 'active' : 'basic',\n                onSecondaryBackground: true,\n              })\n            : badge}\n        </BadgeContainer>\n      )}\n    </StyledTab>\n  );\n};\n\nexport default Tab;\n","import styled from 'styled-components';\n\nimport { BorderRadius, Color, Spacing } from '@persona/design-tokens';\nimport { IconButton } from 'design-system/components/Button';\nimport { isActive, isFocused, isHovered, isNotDisabled } from 'design-system/lib/pseudoClass';\n\nexport default styled(IconButton).attrs({\n  size: 'sm',\n})`\n  padding-left: ${Spacing[2]};\n  padding-right: ${Spacing[2]};\n  border-radius: ${BorderRadius.Sm};\n\n  // remove default button focused/hovered box shadow\n  &${isActive}${isNotDisabled} {\n    background-color: transparent;\n  }\n  &${isHovered}${isNotDisabled} {\n    box-shadow: none;\n  }\n  &${isFocused}${isNotDisabled} {\n    box-shadow: none;\n  }\n  &${isHovered}${isFocused}${isNotDisabled} {\n    box-shadow: none;\n  }\n  &:disabled {\n    background-color: transparent;\n  }\n  &:focus-visible${isNotDisabled}, &${isHovered}${isNotDisabled}:focus-visible {\n    box-shadow: 0 0 0 3px ${({ theme }) => theme.color.variants.basic.highlight};\n  }\n\n  svg {\n    color: ${Color.CoreSlate800};\n  }\n\n  &:hover {\n    svg {\n      color: ${Color.CoreSlate900};\n    }\n  }\n`;\n"],"mappings":"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"}

package/dist/TabBar.d.cts

@@ -1,33 +0,0 @@
-import * as _$react from "react";
-import { ComponentPropsWithoutRef, ReactNode } from "react";
-
-//#region components/TabBar/TabBar.d.ts
-interface TabContainerProps extends ComponentPropsWithoutRef<'div'> {
-  children: ReactNode;
-  /**
-   * Truncate tab text to the specified number of characters.
-   */
-  maxTabChars?: number;
-  /**
-   * Size of the tabs. Affects font size.
-   */
-  size?: 'md' | 'sm';
-}
-declare const TabContainer: _$react.ForwardRefExoticComponent<TabContainerProps & _$react.RefAttributes<HTMLDivElement>>;
-interface TabBarProps extends ComponentPropsWithoutRef<'div'> {
-  actions?: ReactNode;
-  title?: string;
-  'data-tour-target'?: string;
-  /**
-   * Truncate tab text to the specified number of characters.
-   */
-  maxTabChars?: number;
-  /**
-   * Size of the tabs. Affects font size.
-   */
-  size?: 'md' | 'sm';
-}
-declare const TabBar: _$react.ForwardRefExoticComponent<TabBarProps & _$react.RefAttributes<HTMLDivElement>>;
-//#endregion
-export { TabBar, TabBar as default, TabBarProps, TabContainer };
-//# sourceMappingURL=TabBar.d.cts.map

package/dist/TabBarIconButton.d.cts

@@ -1,10 +0,0 @@
-import { n as IconButtonProps } from "./IconButton-ZcyTFjPn.cjs";
-import * as _$react from "react";
-import * as _$styled_components0 from "styled-components";
-
-//#region components/TabBar/TabBarIconButton.d.ts
-declare const _default: _$styled_components0.StyledComponent<_$react.ForwardRefExoticComponent<Omit<IconButtonProps, "ref"> & _$react.RefAttributes<HTMLButtonElement>>, any, {
-  size: "sm";
-}, "size">;
-export = _default;
-//# sourceMappingURL=TabBarIconButton.d.cts.map

package/dist/Table-BNScLj9g.d.mts

@@ -1,13 +0,0 @@
-import * as _$styled_components0 from "styled-components";
-
-//#region components/Table/Table.d.ts
-interface TableProps {
-  size?: 'sm' | 'md';
-  isLoading?: boolean;
-}
-declare const Table: _$styled_components0.StyledComponent<"table", any, {
-  role: "table";
-} & TableProps, "role">;
-//#endregion
-export { Table as t };
-//# sourceMappingURL=Table-BNScLj9g.d.mts.map