@persona/design-system 0.1.7 → 0.1.9

package/dist/components/PageHeader/index.mjs

@@ -1,64 +1,2 @@
-import { i as Paragraph, n as Heading } from "../../Text-hEoPeOc9.mjs";
-import { Spacing } from "@persona/design-tokens";
-import styled from "styled-components";
-import { jsx, jsxs } from "react/jsx-runtime";
-//#region components/PageHeader/PageHeader.tsx
-const PageHeaderContainer = styled.header`
-  display: flex;
-  width: 100%;
-  justify-content: space-between;
-  align-items: center;
-  padding: ${Spacing[3]} ${Spacing[5]};
-  background-color: ${({ theme }) => theme.color.background.primary};
-  border-bottom: 1px solid ${({ theme }) => theme.color.border.primary};
-  box-sizing: border-box;
-  min-height: 56px; /* Standardize height for most PageHeaders */
-`;
-const TitleContainer = styled.div`
-  display: flex;
-  flex: 1;
-  align-items: center;
-  h1 {
-    margin: 0;
-  }
-  p {
-    margin: 0 0 0 ${Spacing[2]};
-  }
-`;
-const LeftContainer = styled.div`
-  display: flex;
-  align-items: center;
-`;
-const RightContainer = styled.div`
-  display: flex;
-  gap: ${Spacing[2]};
-  margin-left: ${Spacing[3]};
-`;
-const PageHeader = ({ title, subtitle, level = "product", prepend, append, children, ...props }) => /* @__PURE__ */ jsxs(PageHeaderContainer, {
-	...props,
-	children: [/* @__PURE__ */ jsxs(LeftContainer, { children: [
-		prepend && /* @__PURE__ */ jsx("div", { children: prepend }),
-		/* @__PURE__ */ jsxs(TitleContainer, { children: [
-			level === "product" && /* @__PURE__ */ jsx(Heading, {
-				as: "h1",
-				size: "sm",
-				children: title
-			}),
-			level === "detail" && /* @__PURE__ */ jsx(Paragraph, {
-				as: "h1",
-				size: "lg",
-				color: "primary",
-				children: title
-			}),
-			subtitle && /* @__PURE__ */ jsx(Paragraph, {
-				size: "md",
-				children: subtitle
-			})
-		] }),
-		append && /* @__PURE__ */ jsx("div", { children: append })
-	] }), children && /* @__PURE__ */ jsx(RightContainer, { children })]
-});
-//#endregion
+import { n as PageHeaderContainer, t as PageHeader } from "../../PageHeader-jSLud2JI.mjs";
 export { PageHeaderContainer, PageHeader as default };
-
-//# sourceMappingURL=index.mjs.map

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

@@ -1,4 +1,4 @@
-import { t as Pagination } from "../../Pagination-QWNK_hH7.mjs";
-import { r as PageSelector, t as PAGE_LIMIT_BEFORE_SCROLL_MODE } from "../../PageSelector-CMoV-cHa.mjs";
-import { n as MIN_PAGE_SIZE, t as DEFAULT_PAGE_SIZE_OPTIONS } from "../../constants-DVwPpTt5.mjs";
+import { t as Pagination } from "../../Pagination-ygLutOst.mjs";
+import { r as PageSelector, t as PAGE_LIMIT_BEFORE_SCROLL_MODE } from "../../PageSelector-vay4jpMp.mjs";
+import { n as MIN_PAGE_SIZE, t as DEFAULT_PAGE_SIZE_OPTIONS } from "../../constants-BASogfT_.mjs";
 export { DEFAULT_PAGE_SIZE_OPTIONS, MIN_PAGE_SIZE, PAGE_LIMIT_BEFORE_SCROLL_MODE, PageSelector, Pagination as default };

package/dist/components/Pagination/index.mjs

@@ -1,2 +1,2 @@
-import { a as MIN_PAGE_SIZE, i as DEFAULT_PAGE_SIZE_OPTIONS, n as PAGE_LIMIT_BEFORE_SCROLL_MODE, r as PageSelector, t as Pagination_default } from "../../Pagination-Cj08JRG9.mjs";
+import { a as MIN_PAGE_SIZE, i as DEFAULT_PAGE_SIZE_OPTIONS, n as PAGE_LIMIT_BEFORE_SCROLL_MODE, r as PageSelector, t as Pagination_default } from "../../Pagination-BeYukNCj.mjs";
 export { DEFAULT_PAGE_SIZE_OPTIONS, MIN_PAGE_SIZE, PAGE_LIMIT_BEFORE_SCROLL_MODE, PageSelector, Pagination_default as default };

package/dist/components/Pii/index.mjs

@@ -1,2 +1,2 @@
-import { t as Pii_default } from "../../Pii-Bxh6_R4T.mjs";
+import { t as Pii_default } from "../../Pii-QsTrz8wn.mjs";
 export { Pii_default as default };

package/dist/components/Popover/index.mjs

@@ -1,2 +1,2 @@
-import { a as PopoverPortal, i as PopoverContent, n as PopoverCard, o as PopoverTrigger, r as PopoverClose, s as Popover_default, t as PopoverAnchor } from "../../Popover-D0QY5f-J.mjs";
+import { a as PopoverPortal, i as PopoverContent, n as PopoverCard, o as PopoverTrigger, r as PopoverClose, s as Popover_default, t as PopoverAnchor } from "../../Popover-BkDpDdaO.mjs";
 export { PopoverAnchor, PopoverCard, PopoverClose, PopoverContent, PopoverPortal, PopoverTrigger, Popover_default as default };

package/dist/components/ProgressBar/index.mjs

@@ -1,5 +1,5 @@
 import { paragraphMixins } from "../../mixins/text.mjs";
-import { a as Tooltip } from "../../Tooltip-CDvOu1UN.mjs";
+import { a as Tooltip } from "../../Tooltip-BvDbmXak.mjs";
 import { Color, Spacing } from "@persona/design-tokens";
 import styled, { keyframes } from "styled-components";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";

package/dist/components/Radio/index.mjs

@@ -1,2 +1,2 @@
-import { t as Radio } from "../../Radio-C9DevagH.mjs";
+import { t as Radio } from "../../Radio-CSX2eO-O.mjs";
 export { Radio, Radio as default };

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

@@ -1,2 +1,2 @@
-import { n as RadioGroupProps, t as RadioGroup } from "../../RadioGroup-nhMXEbCx.mjs";
+import { n as RadioGroupProps, t as RadioGroup } from "../../RadioGroup-DKqbSfju.mjs";
 export { RadioGroup, RadioGroup as default, RadioGroupProps };

package/dist/components/RadioGroup/index.mjs

@@ -1,2 +1,2 @@
-import { t as RadioGroup } from "../../RadioGroup-B3hRbIWF.mjs";
+import { t as RadioGroup } from "../../RadioGroup-CnK0opBd.mjs";
 export { RadioGroup, RadioGroup as default };

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

@@ -1,2 +1,2 @@
-import { i as SegmentedControlProps, n as SegmentedControlItem, t as SegmentedControl } from "../../SegmentedControl-CE845gnm.mjs";
+import { i as SegmentedControlProps, n as SegmentedControlItem, t as SegmentedControl } from "../../SegmentedControl-DrjdUOU9.mjs";
 export { SegmentedControl, SegmentedControl as default, SegmentedControlItem, SegmentedControlProps };

package/dist/components/SegmentedControl/index.mjs

@@ -1,2 +1,2 @@
-import { n as SegmentedControlItem, t as SegmentedControl } from "../../SegmentedControl-B1ZLgu61.mjs";
+import { n as SegmentedControlItem, t as SegmentedControl } from "../../SegmentedControl-CgDQIVll.mjs";
 export { SegmentedControl, SegmentedControl as default, SegmentedControlItem };

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

@@ -1,2 +1,2 @@
-import { i as SelectProps, n as Select, r as SelectHeader, t as Option } from "../../Select-BMEwCfbv.mjs";
+import { i as SelectProps, n as Select, r as SelectHeader, t as Option } from "../../Select-Bk27TgN8.mjs";
 export { Option, Select, Select as default, SelectHeader, SelectProps };

package/dist/components/Select/index.mjs

@@ -1,2 +1,2 @@
-import { n as Select, r as SelectHeader, t as Option } from "../../Select-ByTgXOlU.mjs";
+import { n as Select, r as SelectHeader, t as Option } from "../../Select-C1ZoRk39.mjs";
 export { Option, Select, Select as default, SelectHeader };

package/dist/components/Slider/index.mjs

@@ -1,10 +1,10 @@
 import { focusStyle } from "../../mixins/focus.mjs";
 import { paragraphMixins } from "../../mixins/text.mjs";
-import { i as FloatingTooltip } from "../../Tooltip-CDvOu1UN.mjs";
+import { i as FloatingTooltip } from "../../Tooltip-BvDbmXak.mjs";
 import { Color, Spacing } from "@persona/design-tokens";
 import styled, { css } from "styled-components";
-import { useEffect, useMemo, useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useMemo, useRef, useState } from "react";
 import { debounce } from "lodash";
 import { mergeProps } from "@react-aria/utils";
 import { useNumberFormatter } from "@react-aria/i18n";

package/dist/components/Spacer/index.mjs

@@ -1,2 +1,2 @@
-import { t as Spacer_default } from "../../Spacer-Ln3KChb5.mjs";
+import { t as Spacer_default } from "../../Spacer-CJp0lwkL.mjs";
 export { Spacer_default as default };

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

@@ -1,2 +1,2 @@
-import { i as StackProps, n as HStackProps, r as Stack, t as HStack } from "../../Stack-UMhJ6F_3.mjs";
+import { i as StackProps, n as HStackProps, r as Stack, t as HStack } from "../../Stack-CkV7k7TE.mjs";
 export { HStack, HStackProps, Stack, Stack as default, StackProps };

package/dist/components/Stack/index.mjs

@@ -1,2 +1,2 @@
-import { n as Stack, t as HStack } from "../../Stack-ckRN7LrP.mjs";
+import { n as Stack, t as HStack } from "../../Stack-Bl54WmhY.mjs";
 export { HStack, Stack, Stack as default };

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

@@ -1,2 +1,2 @@
-import { BackgroundType, StatusIndicator, StatusIndicatorProps, StatusType } from "../../StatusIndicator.mjs";
-export { type BackgroundType, StatusIndicator, StatusIndicator as default, type StatusIndicatorProps, type StatusType };
+import { BackgroundType, STATUSES, Status, StatusIndicator, StatusIndicatorProps, StatusType } from "../../StatusIndicator.mjs";
+export { type BackgroundType, STATUSES, type Status, StatusIndicator, StatusIndicator as default, type StatusIndicatorProps, type StatusType };

package/dist/components/StatusIndicator/index.mjs

@@ -1,9 +1,46 @@
 import { paragraphMixins } from "../../mixins/text.mjs";
+import { TruncatedText } from "../../lib/TruncatedText.mjs";
 import { BorderRadius, Color, Spacing } from "@persona/design-tokens";
 import styled, { css } from "styled-components";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { CircleNullIcon } from "@persona/icons/12px";
+import { CircleCheckFillIcon, CircleFillIcon, CircleHalfIcon, CircleNullIcon, CircleSlashIcon, WarningFillIcon } from "@persona/icons/12px";
 //#region components/StatusIndicator/StatusIndicator.tsx
+const STATUS_CONFIG = {
+	open: {
+		type: "neutral",
+		icon: /* @__PURE__ */ jsx(CircleNullIcon, {})
+	},
+	pending: {
+		type: "neutral",
+		icon: /* @__PURE__ */ jsx(CircleHalfIcon, {})
+	},
+	completed: {
+		type: "success",
+		icon: /* @__PURE__ */ jsx(CircleFillIcon, {})
+	},
+	active: {
+		type: "success",
+		icon: /* @__PURE__ */ jsx(CircleCheckFillIcon, {})
+	},
+	failed: {
+		type: "critical",
+		icon: /* @__PURE__ */ jsx(CircleSlashIcon, {})
+	},
+	needs_review: {
+		type: "warning",
+		icon: /* @__PURE__ */ jsx(WarningFillIcon, {})
+	},
+	canceled: {
+		type: "attention",
+		icon: /* @__PURE__ */ jsx(CircleSlashIcon, {})
+	},
+	archived: {
+		type: "informational",
+		icon: /* @__PURE__ */ jsx(CircleSlashIcon, {})
+	}
+};
+/** All supported `status` preset keys, derived from the config map. */
+const STATUSES = Object.keys(STATUS_CONFIG);
 const FILLED_STATUS_COLORS = {
 	neutral: {
 		background: Color.BackgroundStatusIndicatorDefault,
@@ -93,10 +130,13 @@ const Label = styled.div`
   display: flex;
   flex-direction: column;
   justify-content: center;
-  flex-shrink: 0;
-  line-height: 8px;
+  flex-shrink: ${({ $truncate }) => $truncate ? 1 : 0};
+  min-width: ${({ $truncate }) => $truncate ? "0" : "auto"};
+  /* Line box hugs the font so pill height is driven by padding alone, and clipping an overflowing
+     label can't cut into descenders. Matches Sticker. */
+  line-height: 1;
   white-space: nowrap;
-  text-transform: capitalize;
+  text-transform: ${({ $preserveCase }) => $preserveCase ? "none" : "capitalize"};
   /* Slight optical centering adjustment */
   transform: translateY(0.5px);
   color: ${({ $type, $background }) => {
@@ -111,15 +151,17 @@ const LabelContainer = styled.div`
   display: flex;
   align-items: center;
   gap: ${Spacing[1]};
-  padding: ${({ $hasIcon }) => $hasIcon ? `${Spacing[1]} ${Spacing[2]} ${Spacing[1]} ${Spacing[1]}` : `6px ${Spacing[2]}`};
+  padding: ${({ $hasIcon }) => `${Spacing[1]} ${Spacing[2]} ${Spacing[1]} ${$hasIcon ? Spacing[1] : Spacing[2]}`};
   position: relative;
-  flex-shrink: 0;
+  flex-shrink: ${({ $truncate }) => $truncate ? 1 : 0};
+  min-width: ${({ $truncate }) => $truncate ? "0" : "auto"};
 `;
 const StyledStatusIndicator = styled.div`
   display: inline-flex;
   align-items: center;
   border-radius: ${BorderRadius.Xl};
   width: fit-content;
+  max-width: ${({ $truncate }) => $truncate ? "100%" : "none"};
 
   ${({ $type, $background }) => {
 	return css`
@@ -133,35 +175,42 @@ const StyledStatusIndicator = styled.div`
 *
 * @example
 * ```tsx
+* <StatusIndicator status="active">Active</StatusIndicator>
 * <StatusIndicator type="success" background="filled">Approved</StatusIndicator>
 * <StatusIndicator type="critical" background="none">Failed</StatusIndicator>
 * ```
 */
-const StatusIndicator = ({ type = "neutral", background = "filled", showIcon = true, leadingIcon, children, ...props }) => {
+const StatusIndicator = ({ status, type, background = "filled", showIcon = true, leadingIcon, truncate = false, preserveCase = false, children, ...props }) => {
+	const resolvedType = type ?? (status != null ? STATUS_CONFIG[status].type : "neutral");
 	const colors = background === "filled" ? FILLED_STATUS_COLORS : TRANSPARENT_STATUS_COLORS;
 	let iconToRender;
 	if (!showIcon && background === "filled") iconToRender = null;
 	else if (typeof leadingIcon !== "undefined") iconToRender = leadingIcon;
+	else if (status != null) iconToRender = STATUS_CONFIG[status].icon;
 	else iconToRender = /* @__PURE__ */ jsx(CircleNullIcon, {});
 	const hasIcon = iconToRender != null;
 	return /* @__PURE__ */ jsx(StyledStatusIndicator, {
-		$type: type,
+		$type: resolvedType,
 		$background: background,
+		$truncate: truncate,
 		...props,
 		children: /* @__PURE__ */ jsxs(LabelContainer, {
 			$hasIcon: hasIcon,
+			$truncate: truncate,
 			children: [hasIcon && /* @__PURE__ */ jsx(IconContainer, {
-				$iconColor: colors[type].icon,
+				$iconColor: colors[resolvedType].icon,
 				children: iconToRender
 			}), /* @__PURE__ */ jsx(Label, {
-				$type: type,
+				$type: resolvedType,
 				$background: background,
-				children
+				$truncate: truncate,
+				$preserveCase: preserveCase,
+				children: truncate ? /* @__PURE__ */ jsx(TruncatedText, { children }) : children
 			})]
 		})
 	});
 };
 //#endregion
-export { StatusIndicator, StatusIndicator as default };
+export { STATUSES, StatusIndicator, StatusIndicator as default };
 
 //# sourceMappingURL=index.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":[],"sources":["../../../components/StatusIndicator/StatusIndicator.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef, ReactNode } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { BorderRadius, Color, Spacing } from '@persona/design-tokens';\nimport { CircleNullIcon } from '@persona/icons/12px';\nimport { paragraphMixins } from 'design-system/mixins/text';\n\nexport type StatusType =\n  | 'neutral'\n  | 'attention'\n  | 'warning'\n  | 'critical'\n  | 'success'\n  | 'feature'\n  | 'informational'\n  | 'miscellaneous';\nexport type BackgroundType = 'filled' | 'none';\n\nexport interface StatusIndicatorProps extends ComponentPropsWithoutRef<'div'> {\n  /**\n   * The semantic status type to display\n   */\n  type?: StatusType;\n\n  /**\n   * Whether to show filled background or transparent\n   */\n  background?: BackgroundType;\n\n  /**\n   * Whether to show the icon. When false, displays label-only variant\n   * @default true\n   */\n  showIcon?: boolean;\n\n  /**\n   * Optional custom icon to replace the default icon indicator (12px recommended)\n   * - undefined (default): Shows the default CircleNullIcon\n   * - null: Hides the icon completely\n   * - ReactNode: Shows the provided custom icon\n   * Note: showIcon must be true for this to take effect\n   */\n  leadingIcon?: ReactNode | null;\n\n  /**\n   * The text label to display\n   */\n  children?: ReactNode;\n}\n\ninterface StatusColors {\n  background: string;\n  text: string;\n  icon: string;\n}\n\nconst FILLED_STATUS_COLORS: Record<StatusType, StatusColors> = {\n  neutral: {\n    background: Color.BackgroundStatusIndicatorDefault,\n    text: Color.TextStatusIndicatorDefault,\n    icon: Color.BorderIconLabelGrey,\n  },\n  attention: {\n    background: Color.BackgroundStatusIndicatorAttention,\n    text: Color.TextStatusIndicatorAttention,\n    icon: Color.BorderIconLabelYellow,\n  },\n  warning: {\n    background: Color.BackgroundStatusIndicatorWarning,\n    text: Color.TextStatusIndicatorWarning,\n    icon: Color.BorderIconLabelOrange,\n  },\n  critical: {\n    background: Color.BackgroundStatusIndicatorCritical,\n    text: Color.TextStatusIndicatorCritical,\n    icon: Color.BorderIconLabelRed,\n  },\n  success: {\n    background: Color.BackgroundStatusIndicatorSuccess,\n    text: Color.TextStatusIndicatorSuccess,\n    icon: Color.BorderIconLabelGreen,\n  },\n  feature: {\n    background: Color.BackgroundStatusIndicatorFeature,\n    text: Color.TextStatusIndicatorFeature,\n    icon: Color.BorderIconLabelPurple,\n  },\n  informational: {\n    background: Color.BackgroundStatusIndicatorInformational,\n    text: Color.TextStatusIndicatorInformational,\n    icon: Color.BorderIconLabelBlue,\n  },\n  miscellaneous: {\n    background: Color.BackgroundStatusIndicatorMiscellaneous,\n    text: Color.TextStatusIndicatorMiscellaneous,\n    icon: Color.BorderIconLabelTeal,\n  },\n};\n\nconst TRANSPARENT_STATUS_COLORS: Record<StatusType, StatusColors> = {\n  neutral: {\n    background: 'transparent',\n    text: Color.TextPrimary,\n    icon: Color.BorderIconSecondary,\n  },\n  attention: {\n    background: 'transparent',\n    text: Color.TextPrimary,\n    icon: Color.BorderIconWarning,\n  },\n  warning: {\n    background: 'transparent',\n    text: Color.TextPrimary,\n    icon: Color.BorderIconWarning,\n  },\n  critical: {\n    background: 'transparent',\n    text: Color.TextPrimary,\n    icon: Color.BorderIconDanger,\n  },\n  success: {\n    background: 'transparent',\n    text: Color.TextPrimary,\n    icon: Color.BorderIconSuccess,\n  },\n  feature: {\n    background: 'transparent',\n    text: Color.TextPrimary,\n    icon: Color.BorderIconActive,\n  },\n  informational: {\n    background: 'transparent',\n    text: Color.TextPrimary,\n    icon: Color.BorderIconLabelBlue,\n  },\n  miscellaneous: {\n    background: 'transparent',\n    text: Color.TextPrimary,\n    icon: Color.BorderIconLabelTeal,\n  },\n};\n\nconst Label = styled.div<{ $type: StatusType; $background: BackgroundType }>`\n  ${paragraphMixins.sm}\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  flex-shrink: 0;\n  line-height: 8px;\n  white-space: nowrap;\n  text-transform: capitalize;\n  /* Slight optical centering adjustment */\n  transform: translateY(0.5px);\n  color: ${({ $type, $background }) => {\n    const colors = $background === 'filled' ? FILLED_STATUS_COLORS : TRANSPARENT_STATUS_COLORS;\n    return colors[$type].text;\n  }};\n`;\n\nconst IconContainer = styled.span<{ $iconColor: string }>`\n  line-height: 0;\n  color: ${({ $iconColor }) => $iconColor};\n`;\n\nconst LabelContainer = styled.div<{ $hasIcon: boolean }>`\n  display: flex;\n  align-items: center;\n  gap: ${Spacing[1]};\n  padding: ${({ $hasIcon }) =>\n    $hasIcon ? `${Spacing[1]} ${Spacing[2]} ${Spacing[1]} ${Spacing[1]}` : `6px ${Spacing[2]}`};\n  position: relative;\n  flex-shrink: 0;\n`;\n\nconst StyledStatusIndicator = styled.div<{ $type: StatusType; $background: BackgroundType }>`\n  display: inline-flex;\n  align-items: center;\n  border-radius: ${BorderRadius.Xl};\n  width: fit-content;\n\n  ${({ $type, $background }) => {\n    const colors = $background === 'filled' ? FILLED_STATUS_COLORS : TRANSPARENT_STATUS_COLORS;\n    return css`\n      background-color: ${colors[$type].background};\n    `;\n  }}\n`;\n\n/**\n * StatusIndicator displays semantic status information with a colored icon and label.\n * Supports both filled backgrounds and transparent styles.\n *\n * @example\n * ```tsx\n * <StatusIndicator type=\"success\" background=\"filled\">Approved</StatusIndicator>\n * <StatusIndicator type=\"critical\" background=\"none\">Failed</StatusIndicator>\n * ```\n */\nexport const StatusIndicator = ({\n  type = 'neutral',\n  background = 'filled',\n  showIcon = true,\n  leadingIcon,\n  children,\n  ...props\n}: StatusIndicatorProps) => {\n  const colors = background === 'filled' ? FILLED_STATUS_COLORS : TRANSPARENT_STATUS_COLORS;\n\n  // Determine which icon to show:\n  // - showIcon=false with background='filled': label-only variant (no icon)\n  // - leadingIcon=null: explicitly hide icon\n  // - leadingIcon=undefined: show default icon\n  // - leadingIcon=<ReactNode>: show custom icon (auto-colored via CSS color inheritance)\n  // - background='none' always shows icon (showIcon is ignored for none background)\n  let iconToRender;\n  if (!showIcon && background === 'filled') {\n    iconToRender = null;\n  } else if (typeof leadingIcon !== 'undefined') {\n    iconToRender = leadingIcon;\n  } else {\n    iconToRender = <CircleNullIcon />;\n  }\n  const hasIcon = iconToRender != null;\n\n  return (\n    <StyledStatusIndicator $type={type} $background={background} {...props}>\n      <LabelContainer $hasIcon={hasIcon}>\n        {hasIcon && <IconContainer $iconColor={colors[type].icon}>{iconToRender}</IconContainer>}\n        <Label $type={type} $background={background}>\n          {children}\n        </Label>\n      </LabelContainer>\n    </StyledStatusIndicator>\n  );\n};\n\nexport default StatusIndicator;\n"],"mappings":";;;;;;AAwDA,MAAM,uBAAyD;CAC7D,SAAS;EACP,YAAY,MAAM;EAClB,MAAM,MAAM;EACZ,MAAM,MAAM;EACb;CACD,WAAW;EACT,YAAY,MAAM;EAClB,MAAM,MAAM;EACZ,MAAM,MAAM;EACb;CACD,SAAS;EACP,YAAY,MAAM;EAClB,MAAM,MAAM;EACZ,MAAM,MAAM;EACb;CACD,UAAU;EACR,YAAY,MAAM;EAClB,MAAM,MAAM;EACZ,MAAM,MAAM;EACb;CACD,SAAS;EACP,YAAY,MAAM;EAClB,MAAM,MAAM;EACZ,MAAM,MAAM;EACb;CACD,SAAS;EACP,YAAY,MAAM;EAClB,MAAM,MAAM;EACZ,MAAM,MAAM;EACb;CACD,eAAe;EACb,YAAY,MAAM;EAClB,MAAM,MAAM;EACZ,MAAM,MAAM;EACb;CACD,eAAe;EACb,YAAY,MAAM;EAClB,MAAM,MAAM;EACZ,MAAM,MAAM;EACb;CACF;AAED,MAAM,4BAA8D;CAClE,SAAS;EACP,YAAY;EACZ,MAAM,MAAM;EACZ,MAAM,MAAM;EACb;CACD,WAAW;EACT,YAAY;EACZ,MAAM,MAAM;EACZ,MAAM,MAAM;EACb;CACD,SAAS;EACP,YAAY;EACZ,MAAM,MAAM;EACZ,MAAM,MAAM;EACb;CACD,UAAU;EACR,YAAY;EACZ,MAAM,MAAM;EACZ,MAAM,MAAM;EACb;CACD,SAAS;EACP,YAAY;EACZ,MAAM,MAAM;EACZ,MAAM,MAAM;EACb;CACD,SAAS;EACP,YAAY;EACZ,MAAM,MAAM;EACZ,MAAM,MAAM;EACb;CACD,eAAe;EACb,YAAY;EACZ,MAAM,MAAM;EACZ,MAAM,MAAM;EACb;CACD,eAAe;EACb,YAAY;EACZ,MAAM,MAAM;EACZ,MAAM,MAAM;EACb;CACF;AAED,MAAM,QAAQ,OAAO,GAAuD;IACxE,gBAAgB,GAAG;;;;;;;;;;YAUX,EAAE,OAAO,kBAAkB;AAEnC,SADe,gBAAgB,WAAW,uBAAuB,2BACnD,OAAO;EACrB;;AAGJ,MAAM,gBAAgB,OAAO,IAA4B;;YAE7C,EAAE,iBAAiB,WAAW;;AAG1C,MAAM,iBAAiB,OAAO,GAA0B;;;SAG/C,QAAQ,GAAG;cACN,EAAE,eACZ,WAAW,GAAG,QAAQ,GAAG,GAAG,QAAQ,GAAG,GAAG,QAAQ,GAAG,GAAG,QAAQ,OAAO,OAAO,QAAQ,KAAK;;;;AAK/F,MAAM,wBAAwB,OAAO,GAAuD;;;mBAGzE,aAAa,GAAG;;;KAG9B,EAAE,OAAO,kBAAkB;AAE5B,QAAO,GAAG;2BADK,gBAAgB,WAAW,uBAAuB,2BAEpC,OAAO,WAAW;;EAE/C;;;;;;;;;;;;AAaJ,MAAa,mBAAmB,EAC9B,OAAO,WACP,aAAa,UACb,WAAW,MACX,aACA,UACA,GAAG,YACuB;CAC1B,MAAM,SAAS,eAAe,WAAW,uBAAuB;CAQhE,IAAI;AACJ,KAAI,CAAC,YAAY,eAAe,SAC9B,gBAAe;UACN,OAAO,gBAAgB,YAChC,gBAAe;KAEf,gBAAe,oBAAC,gBAAD,EAAkB,CAAA;CAEnC,MAAM,UAAU,gBAAgB;AAEhC,QACE,oBAAC,uBAAD;EAAuB,OAAO;EAAM,aAAa;EAAY,GAAI;YAC/D,qBAAC,gBAAD;GAAgB,UAAU;aAA1B,CACG,WAAW,oBAAC,eAAD;IAAe,YAAY,OAAO,MAAM;cAAO;IAA6B,CAAA,EACxF,oBAAC,OAAD;IAAO,OAAO;IAAM,aAAa;IAC9B;IACK,CAAA,CACO;;EACK,CAAA"}
+{"version":3,"file":"index.mjs","names":[],"sources":["../../../components/StatusIndicator/StatusIndicator.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef, ReactNode } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { BorderRadius, Color, Spacing } from '@persona/design-tokens';\nimport {\n  CircleCheckFillIcon,\n  CircleFillIcon,\n  CircleHalfIcon,\n  CircleNullIcon,\n  CircleSlashIcon,\n  WarningFillIcon,\n} from '@persona/icons/12px';\nimport { TruncatedText } from 'design-system/lib/TruncatedText';\nimport { paragraphMixins } from 'design-system/mixins/text';\n\nexport type StatusType =\n  | 'neutral'\n  | 'attention'\n  | 'warning'\n  | 'critical'\n  | 'success'\n  | 'feature'\n  | 'informational'\n  | 'miscellaneous';\nexport type BackgroundType = 'filled' | 'none';\n\n/**\n * Narrow set of status presets — one value per type+icon combination.\n * Override color with `type` or icon with `leadingIcon` when needed.\n */\nexport type Status =\n  | 'open'\n  | 'pending'\n  | 'completed'\n  | 'active'\n  | 'failed'\n  | 'needs_review'\n  | 'canceled'\n  | 'archived';\n\nconst STATUS_CONFIG: Record<Status, { type: StatusType; icon: ReactNode }> = {\n  open: { type: 'neutral', icon: <CircleNullIcon /> },\n  pending: { type: 'neutral', icon: <CircleHalfIcon /> },\n  completed: { type: 'success', icon: <CircleFillIcon /> },\n  active: { type: 'success', icon: <CircleCheckFillIcon /> },\n  failed: { type: 'critical', icon: <CircleSlashIcon /> },\n  needs_review: { type: 'warning', icon: <WarningFillIcon /> },\n  canceled: { type: 'attention', icon: <CircleSlashIcon /> },\n  archived: { type: 'informational', icon: <CircleSlashIcon /> },\n};\n\n/** All supported `status` preset keys, derived from the config map. */\nexport const STATUSES = Object.keys(STATUS_CONFIG) as Status[];\n\nexport interface StatusIndicatorProps extends ComponentPropsWithoutRef<'div'> {\n  /**\n   * Preset that sets a default semantic type and icon.\n   * Explicit `type` and `leadingIcon` override the preset.\n   */\n  status?: Status;\n\n  /**\n   * The semantic status type to display. Overrides `status` when both are set.\n   */\n  type?: StatusType;\n\n  /**\n   * Whether to show filled background or transparent\n   */\n  background?: BackgroundType;\n\n  /**\n   * Whether to show the icon. When false, displays label-only variant\n   * @default true\n   */\n  showIcon?: boolean;\n\n  /**\n   * Optional custom icon to replace the default icon indicator (12px recommended)\n   * - undefined (default): Uses `status` icon when set, otherwise CircleNullIcon\n   * - null: Hides the icon completely\n   * - ReactNode: Shows the provided custom icon\n   * Note: showIcon must be true for this to take effect\n   */\n  leadingIcon?: ReactNode | null;\n\n  /**\n   * Truncate the label with an ellipsis instead of letting it overflow its container. Adds a\n   * title tooltip with the full text when it doesn't fit.\n   * @default false\n   */\n  truncate?: boolean;\n\n  /**\n   * Render the label exactly as given instead of capitalizing each word. Use for labels that are\n   * authored outside the product, where the casing is not ours to change.\n   * @default false\n   */\n  preserveCase?: boolean;\n\n  /**\n   * The text label to display\n   */\n  children?: ReactNode;\n}\n\ninterface StatusColors {\n  background: string;\n  text: string;\n  icon: string;\n}\n\nconst FILLED_STATUS_COLORS: Record<StatusType, StatusColors> = {\n  neutral: {\n    background: Color.BackgroundStatusIndicatorDefault,\n    text: Color.TextStatusIndicatorDefault,\n    icon: Color.BorderIconLabelGrey,\n  },\n  attention: {\n    background: Color.BackgroundStatusIndicatorAttention,\n    text: Color.TextStatusIndicatorAttention,\n    icon: Color.BorderIconLabelYellow,\n  },\n  warning: {\n    background: Color.BackgroundStatusIndicatorWarning,\n    text: Color.TextStatusIndicatorWarning,\n    icon: Color.BorderIconLabelOrange,\n  },\n  critical: {\n    background: Color.BackgroundStatusIndicatorCritical,\n    text: Color.TextStatusIndicatorCritical,\n    icon: Color.BorderIconLabelRed,\n  },\n  success: {\n    background: Color.BackgroundStatusIndicatorSuccess,\n    text: Color.TextStatusIndicatorSuccess,\n    icon: Color.BorderIconLabelGreen,\n  },\n  feature: {\n    background: Color.BackgroundStatusIndicatorFeature,\n    text: Color.TextStatusIndicatorFeature,\n    icon: Color.BorderIconLabelPurple,\n  },\n  informational: {\n    background: Color.BackgroundStatusIndicatorInformational,\n    text: Color.TextStatusIndicatorInformational,\n    icon: Color.BorderIconLabelBlue,\n  },\n  miscellaneous: {\n    background: Color.BackgroundStatusIndicatorMiscellaneous,\n    text: Color.TextStatusIndicatorMiscellaneous,\n    icon: Color.BorderIconLabelTeal,\n  },\n};\n\nconst TRANSPARENT_STATUS_COLORS: Record<StatusType, StatusColors> = {\n  neutral: {\n    background: 'transparent',\n    text: Color.TextPrimary,\n    icon: Color.BorderIconSecondary,\n  },\n  attention: {\n    background: 'transparent',\n    text: Color.TextPrimary,\n    icon: Color.BorderIconWarning,\n  },\n  warning: {\n    background: 'transparent',\n    text: Color.TextPrimary,\n    icon: Color.BorderIconWarning,\n  },\n  critical: {\n    background: 'transparent',\n    text: Color.TextPrimary,\n    icon: Color.BorderIconDanger,\n  },\n  success: {\n    background: 'transparent',\n    text: Color.TextPrimary,\n    icon: Color.BorderIconSuccess,\n  },\n  feature: {\n    background: 'transparent',\n    text: Color.TextPrimary,\n    icon: Color.BorderIconActive,\n  },\n  informational: {\n    background: 'transparent',\n    text: Color.TextPrimary,\n    icon: Color.BorderIconLabelBlue,\n  },\n  miscellaneous: {\n    background: 'transparent',\n    text: Color.TextPrimary,\n    icon: Color.BorderIconLabelTeal,\n  },\n};\n\nconst Label = styled.div<{\n  $type: StatusType;\n  $background: BackgroundType;\n  $truncate: boolean;\n  $preserveCase: boolean;\n}>`\n  ${paragraphMixins.sm}\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  flex-shrink: ${({ $truncate }) => ($truncate ? 1 : 0)};\n  min-width: ${({ $truncate }) => ($truncate ? '0' : 'auto')};\n  /* Line box hugs the font so pill height is driven by padding alone, and clipping an overflowing\n     label can't cut into descenders. Matches Sticker. */\n  line-height: 1;\n  white-space: nowrap;\n  text-transform: ${({ $preserveCase }) => ($preserveCase ? 'none' : 'capitalize')};\n  /* Slight optical centering adjustment */\n  transform: translateY(0.5px);\n  color: ${({ $type, $background }) => {\n    const colors = $background === 'filled' ? FILLED_STATUS_COLORS : TRANSPARENT_STATUS_COLORS;\n    return colors[$type].text;\n  }};\n`;\n\nconst IconContainer = styled.span<{ $iconColor: string }>`\n  line-height: 0;\n  color: ${({ $iconColor }) => $iconColor};\n`;\n\nconst LabelContainer = styled.div<{ $hasIcon: boolean; $truncate: boolean }>`\n  display: flex;\n  align-items: center;\n  gap: ${Spacing[1]};\n  padding: ${({ $hasIcon }) =>\n    `${Spacing[1]} ${Spacing[2]} ${Spacing[1]} ${$hasIcon ? Spacing[1] : Spacing[2]}`};\n  position: relative;\n  flex-shrink: ${({ $truncate }) => ($truncate ? 1 : 0)};\n  min-width: ${({ $truncate }) => ($truncate ? '0' : 'auto')};\n`;\n\nconst StyledStatusIndicator = styled.div<{\n  $type: StatusType;\n  $background: BackgroundType;\n  $truncate: boolean;\n}>`\n  display: inline-flex;\n  align-items: center;\n  border-radius: ${BorderRadius.Xl};\n  width: fit-content;\n  max-width: ${({ $truncate }) => ($truncate ? '100%' : 'none')};\n\n  ${({ $type, $background }) => {\n    const colors = $background === 'filled' ? FILLED_STATUS_COLORS : TRANSPARENT_STATUS_COLORS;\n    return css`\n      background-color: ${colors[$type].background};\n    `;\n  }}\n`;\n\n/**\n * StatusIndicator displays semantic status information with a colored icon and label.\n * Supports both filled backgrounds and transparent styles.\n *\n * @example\n * ```tsx\n * <StatusIndicator status=\"active\">Active</StatusIndicator>\n * <StatusIndicator type=\"success\" background=\"filled\">Approved</StatusIndicator>\n * <StatusIndicator type=\"critical\" background=\"none\">Failed</StatusIndicator>\n * ```\n */\nexport const StatusIndicator = ({\n  status,\n  type,\n  background = 'filled',\n  showIcon = true,\n  leadingIcon,\n  truncate = false,\n  preserveCase = false,\n  children,\n  ...props\n}: StatusIndicatorProps) => {\n  const resolvedType = type ?? (status != null ? STATUS_CONFIG[status].type : 'neutral');\n  const colors = background === 'filled' ? FILLED_STATUS_COLORS : TRANSPARENT_STATUS_COLORS;\n\n  // Determine which icon to show:\n  // - showIcon=false with background='filled': label-only variant (no icon)\n  // - leadingIcon set (including null): explicit override\n  // - status set: use preset icon\n  // - otherwise: default CircleNullIcon\n  // - background='none' always shows icon (showIcon is ignored for none background)\n  let iconToRender;\n  if (!showIcon && background === 'filled') {\n    iconToRender = null;\n  } else if (typeof leadingIcon !== 'undefined') {\n    iconToRender = leadingIcon;\n  } else if (status != null) {\n    iconToRender = STATUS_CONFIG[status].icon;\n  } else {\n    iconToRender = <CircleNullIcon />;\n  }\n  const hasIcon = iconToRender != null;\n\n  return (\n    <StyledStatusIndicator\n      $type={resolvedType}\n      $background={background}\n      $truncate={truncate}\n      {...props}\n    >\n      <LabelContainer $hasIcon={hasIcon} $truncate={truncate}>\n        {hasIcon && (\n          <IconContainer $iconColor={colors[resolvedType].icon}>{iconToRender}</IconContainer>\n        )}\n        <Label\n          $type={resolvedType}\n          $background={background}\n          $truncate={truncate}\n          $preserveCase={preserveCase}\n        >\n          {truncate ? <TruncatedText>{children}</TruncatedText> : children}\n        </Label>\n      </LabelContainer>\n    </StyledStatusIndicator>\n  );\n};\n\nexport default StatusIndicator;\n"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-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-DjF9VJQB.mjs";
+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-Bs25ISz7.mjs";
 export { LabelBackgrounds, STICKER_COLOR_CONFIG, Sticker, Sticker as default, StickerContainer, StickerContentContainer, StickerProps, StyledTruncatedText };

package/dist/components/Sticker/index.mjs

@@ -1,2 +1,2 @@
-import { a as StyledTruncatedText, i as StickerContentContainer, n as Sticker, r as StickerContainer, t as STICKER_COLOR_CONFIG } from "../../Sticker-B0TbkV4o.mjs";
+import { a as StyledTruncatedText, i as StickerContentContainer, n as Sticker, r as StickerContainer, t as STICKER_COLOR_CONFIG } from "../../Sticker-CyGb9dEu.mjs";
 export { STICKER_COLOR_CONFIG, Sticker, Sticker as default, StickerContainer, StickerContentContainer, StyledTruncatedText };

package/dist/components/TabBar/index.mjs

@@ -1,2 +1,2 @@
-import { a as TabContainer, i as TabBar, n as StyledTab, r as Tab, t as TabBarIconButton_default } from "../../TabBar-ByusqAXF.mjs";
+import { a as TabContainer, i as TabBar, n as StyledTab, r as Tab, t as TabBarIconButton_default } from "../../TabBar-Bn8PHHBZ.mjs";
 export { StyledTab, Tab, TabBar, TabBar as default, TabBarIconButton_default as TabBarIconButton, TabContainer };

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

@@ -1,8 +1,8 @@
-import { t as Table } from "../../Table-D3nyiZt0.mjs";
-import { t as TableHeaderCell } from "../../TableHeaderCell-B2yiOw4w.mjs";
-import { a as TableCellProps, c as TableTD, i as TableCell, l as TableTR, n as StickyTH, o as TableCellTitle, r as TableActionTD, s as TableIconTD, t as StickyTD, u as TableTH } from "../../index-BPnJP0jZ.mjs";
-import { t as TableRow } from "../../TableRow-C-faHbkL.mjs";
-import { t as TableHead } from "../../TableHead-wl78HqPT.mjs";
-import { t as TableBody } from "../../TableBody-DpRjZgzU.mjs";
-import { t as TableLayout } from "../../TableLayout-_TWUnffx.mjs";
+import { t as Table } from "../../Table-BNScLj9g.mjs";
+import { t as TableHeaderCell } from "../../TableHeaderCell-Br8ZE3Xe.mjs";
+import { a as TableCellProps, c as TableTD, i as TableCell, l as TableTR, n as StickyTH, o as TableCellTitle, r as TableActionTD, s as TableIconTD, t as StickyTD, u as TableTH } from "../../index-DDbjWdk0.mjs";
+import { t as TableRow } from "../../TableRow-BvS4yjo6.mjs";
+import { t as TableHead } from "../../TableHead-LxvG0e9k.mjs";
+import { t as TableBody } from "../../TableBody-CrDNMyT8.mjs";
+import { t as TableLayout } from "../../TableLayout-BZeP8qfg.mjs";
 export { StickyTD, StickyTH, Table, Table as default, TableActionTD, TableBody, TableCell, TableCellProps, TableCellTitle, TableHead, TableHeaderCell, TableIconTD, TableLayout, TableRow, TableTD, TableTH, TableTR };

package/dist/components/Table/index.mjs

@@ -1,2 +1,2 @@
-import { a as StickyTH, c as TableCellTitle, d as TableTR, f as TableTH, h as Table, i as StickyTD, l as TableIconTD, m as TableHeaderCell, n as TableBody, o as TableActionTD, p as TableRow, r as TableHead, s as TableCell, t as TableLayout, u as TableTD } from "../../Table-CNs8p8hL.mjs";
+import { a as StickyTH, c as TableCellTitle, d as TableTR, f as TableTH, h as Table, i as StickyTD, l as TableIconTD, m as TableHeaderCell, n as TableBody, o as TableActionTD, p as TableRow, r as TableHead, s as TableCell, t as TableLayout, u as TableTD } from "../../Table-BfontAeY.mjs";
 export { StickyTD, StickyTH, Table, Table as default, TableActionTD, TableBody, TableCell, TableCellTitle, TableHead, TableHeaderCell, TableIconTD, TableLayout, TableRow, TableTD, TableTH, TableTR };

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

@@ -1,3 +1,3 @@
-import { t as DragDirection } from "../../useTableBoxDragAndDrop-BTtv9PEt.mjs";
-import { a as TableBox, o as TableBoxContext, r as InlineEditConfig, s as TableBoxProps } from "../../TableBoxCell-D1bjYv7b.mjs";
+import { t as DragDirection } from "../../useTableBoxDragAndDrop-BMo-iaUF.mjs";
+import { a as TableBox, o as TableBoxContext, r as InlineEditConfig, s as TableBoxProps } from "../../TableBoxCell-CvjLYhTV.mjs";
 export { DragDirection, InlineEditConfig, TableBoxContext, TableBoxProps, TableBox as default };

package/dist/components/TableBox/index.mjs

@@ -1,2 +1,2 @@
-import { n as TableBoxContext, t as TableBox } from "../../TableBox-DIJffyts.mjs";
+import { n as TableBoxContext, t as TableBox } from "../../TableBox-bmrKh_ax.mjs";
 export { TableBoxContext, TableBox as default };

package/dist/components/TechnicalSticker/index.mjs

@@ -1,12 +1,12 @@
 import { isHovered } from "../../lib/pseudoClass.mjs";
-import { t as MiddleTruncatedText } from "../../MiddleTruncatedText-Bzpg3zAU.mjs";
-import { t as useToggle } from "../../useToggle-3k3EkV8V.mjs";
-import { a as Tooltip } from "../../Tooltip-CDvOu1UN.mjs";
+import { t as MiddleTruncatedText } from "../../MiddleTruncatedText-GXI-CPvs.mjs";
+import { t as useToggle } from "../../useToggle-Bo3yd14Y.mjs";
+import { a as Tooltip } from "../../Tooltip-BvDbmXak.mjs";
 import copyTextToClipboard from "../../lib/copyTextToClipboard.mjs";
 import { BorderRadius, Color, Spacing, Typography } from "@persona/design-tokens";
 import styled, { css } from "styled-components";
-import { useCallback, useEffect, useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useRef, useState } from "react";
 import { CopyIcon } from "@persona/icons/12px";
 //#region components/TechnicalSticker/TechnicalSticker.tsx
 const COPY_CONFIRMATION_TEXT = "Copied!";

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

@@ -1,2 +1,2 @@
-import { a as Label, c as ParagraphProps, d as TabularNumber, i as HeadingProps, l as Span, n as DisplayProps, o as LabelProps, r as Heading, s as Paragraph, t as Display, u as SpanProps } from "../../Text-D3FXEnG6.mjs";
+import { a as Label, c as ParagraphProps, d as TabularNumber, i as HeadingProps, l as Span, n as DisplayProps, o as LabelProps, r as Heading, s as Paragraph, t as Display, u as SpanProps } from "../../Text-DNPbAuUG.mjs";
 export { Display, DisplayProps, Heading, HeadingProps, Label, LabelProps, Paragraph, ParagraphProps, Span, SpanProps, TabularNumber };

package/dist/components/Text/index.mjs

@@ -1,2 +1,2 @@
-import { a as Span, i as Paragraph, n as Heading, o as TabularNumber, r as Label, t as Display } from "../../Text-hEoPeOc9.mjs";
+import { a as Span, i as Paragraph, n as Heading, o as TabularNumber, r as Label, t as Display } from "../../Text-RcEfNFLx.mjs";
 export { Display, Heading, Label, Paragraph, Span, TabularNumber };

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

@@ -1,2 +1,2 @@
-import { n as TextAreaWithStyle, t as TextAreaProps } from "../../TextArea-weASn4Hq.mjs";
+import { n as TextAreaWithStyle, t as TextAreaProps } from "../../TextArea-B89wtTsF.mjs";
 export { TextAreaWithStyle as TextArea, TextAreaWithStyle as default, TextAreaProps };

package/dist/components/TextArea/index.mjs

@@ -1,2 +1,2 @@
-import { t as TextAreaWithStyle } from "../../TextArea-DIPeBLkr.mjs";
+import { t as TextAreaWithStyle } from "../../TextArea-NCLsW-03.mjs";
 export { TextAreaWithStyle as TextArea, TextAreaWithStyle as default };

package/dist/components/Tile/index.mjs

@@ -1,7 +1,7 @@
-import { i as Paragraph, n as Heading } from "../../Text-hEoPeOc9.mjs";
-import { t as TextUnderlineTooltip } from "../../Tooltip-CDvOu1UN.mjs";
-import { n as Stack, t as HStack } from "../../Stack-ckRN7LrP.mjs";
-import { n as Sticker } from "../../Sticker-B0TbkV4o.mjs";
+import { n as Stack, t as HStack } from "../../Stack-Bl54WmhY.mjs";
+import { i as Paragraph, n as Heading } from "../../Text-RcEfNFLx.mjs";
+import { t as TextUnderlineTooltip } from "../../Tooltip-BvDbmXak.mjs";
+import { n as Sticker } from "../../Sticker-CyGb9dEu.mjs";
 import { Color, Spacing } from "@persona/design-tokens";
 import styled from "styled-components";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";

package/dist/components/Toast/index.mjs

@@ -3,7 +3,7 @@ import "../../variables/effect.mjs";
 import "../../variables/transitions.mjs";
 import { paragraphMixins } from "../../mixins/text.mjs";
 import "../../lib/message.mjs";
-import { t as IconButton } from "../../IconButton-DC4rh6ow.mjs";
+import { t as IconButton } from "../../IconButton-P8w0JDI5.mjs";
 import { BorderRadius, Color, Spacing } from "@persona/design-tokens";
 import styled, { css } from "styled-components";
 import { jsx, jsxs } from "react/jsx-runtime";

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

@@ -1,2 +1,2 @@
-import { n as ToggleProps, t as Toggle } from "../../Toggle-BQCOJZjZ.mjs";
+import { n as ToggleProps, t as Toggle } from "../../Toggle-DzYLgxGk.mjs";
 export { Toggle, Toggle as default, ToggleProps };

package/dist/components/Toggle/index.mjs

@@ -1,2 +1,2 @@
-import { t as Toggle } from "../../Toggle-CfjUQlcK.mjs";
+import { t as Toggle } from "../../Toggle-Bie9zCem.mjs";
 export { Toggle, Toggle as default };

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

@@ -1,4 +1,4 @@
-import { i as TooltipWithIconProps, n as Tooltip, r as TooltipStandardProps, t as FloatingTooltip } from "../../Tooltip-DRgufW3i.mjs";
-import { t as HelperTooltip } from "../../HelperTooltip-CofPKyZh.mjs";
-import { n as TextWithDashedUnderline, t as TextUnderlineTooltip } from "../../TextUnderlineTooltip-Cep5cgEQ.mjs";
+import { i as TooltipWithIconProps, n as Tooltip, r as TooltipStandardProps, t as FloatingTooltip } from "../../Tooltip-CUC-JuRL.mjs";
+import { t as HelperTooltip } from "../../HelperTooltip-B7Ysh8B3.mjs";
+import { n as TextWithDashedUnderline, t as TextUnderlineTooltip } from "../../TextUnderlineTooltip-5-0D8s4z.mjs";
 export { FloatingTooltip, HelperTooltip, TextUnderlineTooltip, TextWithDashedUnderline, Tooltip, Tooltip as default, TooltipStandardProps, TooltipWithIconProps };

package/dist/components/Tooltip/index.mjs

@@ -1,2 +1,2 @@
-import { a as Tooltip, i as FloatingTooltip, n as TextWithDashedUnderline, r as HelperTooltip, t as TextUnderlineTooltip } from "../../Tooltip-CDvOu1UN.mjs";
+import { a as Tooltip, i as FloatingTooltip, n as TextWithDashedUnderline, r as HelperTooltip, t as TextUnderlineTooltip } from "../../Tooltip-BvDbmXak.mjs";
 export { FloatingTooltip, HelperTooltip, TextUnderlineTooltip, TextWithDashedUnderline, Tooltip, Tooltip as default };

package/dist/compound-expression.d.mts

@@ -0,0 +1,9 @@
+import { l as FilterRule, n as CompoundExpression } from "./types-D58IoRx6.mjs";
+
+//#region components/DataTable/TableControls/FiltersV2/AdvancedFilterRulesPopover/compound-expression.d.ts
+declare function addRuleToGroup(compound: CompoundExpression, groupIndex: number, rule: FilterRule): CompoundExpression;
+declare function setRuleInGroup(compound: CompoundExpression, groupIndex: number, ruleIndex: number, rule: FilterRule): CompoundExpression;
+declare function removeRuleFromGroup(compound: CompoundExpression, groupIndex: number, ruleIndex: number): CompoundExpression;
+//#endregion
+export { addRuleToGroup, removeRuleFromGroup, setRuleInGroup };
+//# sourceMappingURL=compound-expression.d.mts.map

package/dist/{constants-DVwPpTt5.d.mts → constants-BASogfT_.d.mts}

@@ -3,4 +3,4 @@ declare const DEFAULT_PAGE_SIZE_OPTIONS: number[];
 declare const MIN_PAGE_SIZE = 10;
 //#endregion
 export { MIN_PAGE_SIZE as n, DEFAULT_PAGE_SIZE_OPTIONS as t };
-//# sourceMappingURL=constants-DVwPpTt5.d.mts.map
+//# sourceMappingURL=constants-BASogfT_.d.mts.map

package/dist/constants.d.mts

@@ -1,2 +1,2 @@
-import { n as MIN_PAGE_SIZE, t as DEFAULT_PAGE_SIZE_OPTIONS } from "./constants-DVwPpTt5.mjs";
+import { n as MIN_PAGE_SIZE, t as DEFAULT_PAGE_SIZE_OPTIONS } from "./constants-BASogfT_.mjs";
 export { DEFAULT_PAGE_SIZE_OPTIONS, MIN_PAGE_SIZE };

package/dist/containers.d.mts

@@ -0,0 +1,8 @@
+import * as _$styled_components0 from "styled-components";
+
+//#region layouts/containers.d.ts
+declare const Layout: _$styled_components0.StyledComponent<"div", any, {}, never>;
+declare const DetailLayout: _$styled_components0.StyledComponent<"div", any, {}, never>;
+//#endregion
+export { DetailLayout, Layout };
+//# sourceMappingURL=containers.d.mts.map

package/dist/display.d.mts

@@ -0,0 +1,8 @@
+import { a as FilterField, c as FilterOperator, u as FilterRuleValue } from "./types-D58IoRx6.mjs";
+
+//#region components/DataTable/TableControls/FiltersV2/AdvancedFilterRulesPopover/display.d.ts
+declare function valueDisplayString(value: FilterRuleValue, optionLabels?: Record<string, string>): string | undefined;
+declare function draftValueFor(field: FilterField, operator: FilterOperator): FilterRuleValue;
+//#endregion
+export { draftValueFor, valueDisplayString };
+//# sourceMappingURL=display.d.mts.map

package/dist/fieldPickerOptions.d.mts

@@ -0,0 +1,29 @@
+import { o as ComboboxOptionsOrGroups } from "./ComboboxBase-BsPf8BZh.mjs";
+import { t as FieldRegistry } from "./FieldRegistry-rqSkjchY.mjs";
+
+//#region components/DataTable/TableControls/FiltersV2/fieldPickerOptions.d.ts
+declare const FIELDS_SUBMENU_LABEL = "Fields";
+/**
+ * Build the field-picker option tree shared by the `⊕ Filter` pill picker
+ * (`FilterPickerMenu`) and the advanced-rules field dropdown
+ * (`RuleEditorFields`) so both surface custom fields identically.
+ *
+ * System fields are top-level leaves; every custom field lives behind a
+ * single `nested: true` "Fields" group, with its parent record type rendered
+ * as the leaf's `description` sublabel. Hash subfields (fields whose backend
+ * `path` has more than one segment, e.g. `address.city`) nest one level
+ * deeper, behind their parent segment (`address`). The `nested`
+ * flag is what makes the single-select Combobox render a group as an
+ * expandable submenu — leaf selections commit via `onChange`, group descents
+ * only navigate.
+ *
+ * `visibleCustomFieldParents`, when provided, narrows the Fields submenu to
+ * only the listed parent record-type labels; passing an empty array hides the
+ * submenu entirely. Omit it (or pass `undefined`) to show every group.
+ *
+ * `excludeFieldIds`, when provided, drops those fields from the tree.
+ */
+declare function buildFieldPickerOptions(registry: FieldRegistry, visibleCustomFieldParents?: ReadonlyArray<string>, excludeFieldIds?: ReadonlyArray<string>): ComboboxOptionsOrGroups<string>;
+//#endregion
+export { FIELDS_SUBMENU_LABEL, buildFieldPickerOptions };
+//# sourceMappingURL=fieldPickerOptions.d.mts.map