@persona/design-system 0.1.5-pre.4

package/dist/Toggle.d.cts

@@ -0,0 +1,2 @@
+import { n as ToggleProps, t as Toggle } from "./Toggle-BjkbL_uf.cjs";
+export { Toggle, Toggle as default, ToggleProps };

package/dist/Toggle.d.mts

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

package/dist/Tooltip-0i_15ysU.cjs

@@ -0,0 +1,152 @@
+const require_chunk = require("./chunk-CoPdw6nB.cjs");
+require("./variables/transitions.cjs");
+const require_mixins_text = require("./mixins/text.cjs");
+const require_Card = require("./Card-CyCKL-M5.cjs");
+const require_variables_keyframes = require("./variables/keyframes.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 _persona_icons = require("@persona/icons");
+let _persona_icons_12px = require("@persona/icons/12px");
+let _radix_ui_react_tooltip = require("@radix-ui/react-tooltip");
+_radix_ui_react_tooltip = require_chunk.__toESM(_radix_ui_react_tooltip);
+//#region components/Tooltip/Tooltip.tsx
+const FloatingTooltip = (0, styled_components.default)(require_Card.Card_default)`
+  ${({ size = "md" }) => size === "sm" ? require_mixins_text.paragraphMixins.sm : require_mixins_text.paragraphMixins.md};
+  line-height: ${({ size = "md" }) => size === "sm" ? "16px" : "20px"};
+  box-shadow: 0px 0px 14px 2px rgba(0, 0, 0, 0.12);
+  border-radius: 4px;
+  display: flex;
+  align-items: ${({ contentAlignment }) => contentAlignment || "center"};
+  justify-content: center;
+  padding: 6px ${_persona_design_tokens.Spacing[2]};
+  animation: ${require_variables_keyframes.fadeIn} ${"200ms"} ease-in-out;
+  z-index: ${({ zIndex }) => zIndex};
+  margin: 0;
+  max-width: ${({ maxWidth }) => maxWidth || "250px"};
+  color: ${_persona_design_tokens.Color.TextPrimary};
+`;
+const TooltipArrow = styled_components.default.div`
+  width: 0;
+  height: 0;
+  border-color: ${({ theme }) => theme.color.background.primary};
+  border-left: 8px solid transparent;
+  border-top: 8px solid ${({ theme }) => theme.color.background.primary};
+  border-right: 8px solid transparent;
+`;
+const TooltipIcon = styled_components.default.div`
+  display: inline-flex;
+`;
+const Tooltip = ({ trigger: triggerProp, iconTrigger, side = "bottom", hideArrow, defaultOpen, open, delayDuration = 300, onOpenChange, interactive = true, children, "aria-label": ariaLabel, portal = true, disabled = false, className, maxWidth, zIndex = 10, triggerProps, portalProps, contentAlignment, size = "md", ...contentProps }) => {
+	let trigger;
+	if (iconTrigger) trigger = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TooltipIcon, {
+		tabIndex: 0,
+		"aria-label": ariaLabel,
+		className,
+		children: (0, react.cloneElement)(iconTrigger, {
+			focusable: false,
+			"aria-hidden": true
+		})
+	});
+	else trigger = triggerProp;
+	const hasRenderableChildren = react.Children.toArray(children).length > 0;
+	const content = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_radix_ui_react_tooltip.Content, {
+		side,
+		sideOffset: 8,
+		asChild: true,
+		...contentProps,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(FloatingTooltip, {
+			zIndex,
+			contentAlignment,
+			maxWidth,
+			size,
+			children: [children, !hideArrow && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_radix_ui_react_tooltip.Arrow, {
+				asChild: true,
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TooltipArrow, {})
+			})]
+		})
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_radix_ui_react_tooltip.Provider, {
+		delayDuration,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_radix_ui_react_tooltip.Root, {
+			open,
+			defaultOpen,
+			disableHoverableContent: !interactive,
+			onOpenChange,
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_radix_ui_react_tooltip.Trigger, {
+				asChild: true,
+				"aria-label": ariaLabel,
+				...triggerProps,
+				children: trigger
+			}), !disabled && hasRenderableChildren && (portal ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_radix_ui_react_tooltip.Portal, {
+				...portalProps,
+				children: content
+			}) : content)]
+		})
+	});
+};
+//#endregion
+//#region components/Tooltip/HelperTooltip.tsx
+/**
+* Helper component for rendering help text via help icons.
+*/
+const HelperTooltip = ({ children, size = "md", ...props }) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Tooltip, {
+		size,
+		iconTrigger: size === "md" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_persona_icons.CircleHelpIcon, { color: _persona_design_tokens.Color.BorderIconSecondary }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_persona_icons_12px.CircleHelpIcon, { color: _persona_design_tokens.Color.BorderIconSecondary }),
+		...props,
+		children
+	});
+};
+//#endregion
+//#region components/Tooltip/TextUnderlineTooltip.tsx
+const TextWithDashedUnderline = styled_components.default.span`
+  text-decoration: underline;
+  text-decoration-style: dashed;
+  text-decoration-color: ${_persona_design_tokens.Color.CoreSlate700};
+  text-underline-offset: 2px;
+  text-decoration-thickness: 1px;
+  width: fit-content;
+`;
+const TextUnderlineTooltip = ({ children, tooltip, ...props }) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Tooltip, {
+		trigger: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TextWithDashedUnderline, { children }),
+		...props,
+		children: tooltip
+	});
+};
+//#endregion
+Object.defineProperty(exports, "FloatingTooltip", {
+	enumerable: true,
+	get: function() {
+		return FloatingTooltip;
+	}
+});
+Object.defineProperty(exports, "HelperTooltip", {
+	enumerable: true,
+	get: function() {
+		return HelperTooltip;
+	}
+});
+Object.defineProperty(exports, "TextUnderlineTooltip", {
+	enumerable: true,
+	get: function() {
+		return TextUnderlineTooltip;
+	}
+});
+Object.defineProperty(exports, "TextWithDashedUnderline", {
+	enumerable: true,
+	get: function() {
+		return TextWithDashedUnderline;
+	}
+});
+Object.defineProperty(exports, "Tooltip", {
+	enumerable: true,
+	get: function() {
+		return Tooltip;
+	}
+});
+
+//# sourceMappingURL=Tooltip-0i_15ysU.cjs.map

package/dist/Tooltip-0i_15ysU.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tooltip-0i_15ysU.cjs","names":["Card","paragraphMixins","Spacing","fadeIn","Color","Children","TooltipPrimitive","CircleHelpIcon","Color","CircleHelpIconSmall","Color"],"sources":["../components/Tooltip/Tooltip.tsx","../components/Tooltip/HelperTooltip.tsx","../components/Tooltip/TextUnderlineTooltip.tsx"],"sourcesContent":["import { Color, Spacing } from '@persona/design-tokens';\nimport * as TooltipPrimitive from '@radix-ui/react-tooltip';\nimport {\n  Children,\n  cloneElement,\n  type ComponentPropsWithoutRef,\n  type ComponentType,\n  type ReactElement,\n  type ReactNode,\n} from 'react';\nimport styled, { type DefaultTheme, type StyledComponent } from 'styled-components';\n\nimport Card, { type CardProps } from 'design-system/components/Card';\nimport { paragraphMixins } from 'design-system/mixins/text';\nimport { fadeIn } from 'design-system/variables/keyframes';\nimport { TransitionDuration } from 'design-system/variables/transitions';\n\ninterface FloatingTooltipProps extends CardProps {\n  zIndex?: number;\n  contentAlignment: 'start' | 'center' | 'end';\n  maxWidth?: string;\n  size?: 'sm' | 'md';\n}\n\nexport const FloatingTooltip: StyledComponent<\n  ComponentType<ComponentPropsWithoutRef<typeof Card>>,\n  DefaultTheme,\n  FloatingTooltipProps\n> = styled(Card)<FloatingTooltipProps>`\n  ${({ size = 'md' }) => (size === 'sm' ? paragraphMixins.sm : paragraphMixins.md)};\n  line-height: ${({ size = 'md' }) => (size === 'sm' ? '16px' : '20px')};\n  box-shadow: 0px 0px 14px 2px rgba(0, 0, 0, 0.12);\n  border-radius: 4px;\n  display: flex;\n  align-items: ${({ contentAlignment }) => contentAlignment || 'center'};\n  justify-content: center;\n  padding: 6px ${Spacing[2]};\n  animation: ${fadeIn} ${TransitionDuration.Fast} ease-in-out;\n  z-index: ${({ zIndex }) => zIndex};\n  margin: 0;\n  max-width: ${({ maxWidth }) => maxWidth || '250px'};\n  color: ${Color.TextPrimary};\n`;\n\nconst TooltipArrow = styled.div`\n  width: 0;\n  height: 0;\n  border-color: ${({ theme }) => theme.color.background.primary};\n  border-left: 8px solid transparent;\n  border-top: 8px solid ${({ theme }) => theme.color.background.primary};\n  border-right: 8px solid transparent;\n`;\n\nconst TooltipIcon = styled.div`\n  display: inline-flex;\n`;\n\ninterface TooltipBaseProps\n  extends\n    Omit<TooltipPrimitive.TooltipProps, 'disableHoverableContent'>,\n    TooltipPrimitive.TooltipContentProps {\n  /**\n   * Optionally hide tooltip arrow.\n   */\n  hideArrow?: boolean;\n\n  children?: ReactNode;\n\n  /**\n   * Disabling will prevent tooltip from rendering on the trigger\n   */\n  disabled?: boolean;\n\n  /**\n   * Render in a portal.\n   * Disable to render adjacent to trigger for rendering within elements such as modals\n   */\n  portal?: boolean;\n\n  /**\n   * Props applied to Radix UI Portal component\n   */\n  portalProps?: TooltipPrimitive.TooltipPortalProps;\n\n  /**\n   * Determines if the tooltip closes when the mouse hovers into the tooltip content area\n   */\n  interactive?: boolean;\n\n  /**\n   * Override the zIndex in case the tooltip is used in situations where the content is\n   * already elevated\n   */\n  zIndex?: number;\n\n  /**\n   * Max width of the contents in the tooltip\n   */\n  maxWidth?: string;\n\n  /**\n   * Props to apply to Tooltip.Trigger within\n   */\n  triggerProps?: TooltipPrimitive.TooltipTriggerProps;\n\n  /**\n   * Size of the tooltip. Defaults to 'md'.\n   */\n  size?: 'sm' | 'md';\n}\n\nexport interface TooltipStandardProps extends TooltipBaseProps {\n  /**\n   * Element that will trigger the tooltip. A `ref` will be set.\n   */\n  trigger: ReactElement;\n\n  iconTrigger?: never;\n\n  className?: never;\n\n  contentAlignment?: 'start' | 'center' | 'end';\n}\n\nexport interface TooltipWithIconProps extends TooltipBaseProps {\n  trigger?: never;\n\n  /**\n   * Icon that will trigger the tooltip. A wrapper div will be set.\n   */\n  iconTrigger: ReactElement;\n\n  className?: string;\n\n  contentAlignment?: 'start' | 'center' | 'end';\n}\n\ntype TooltipProps = TooltipStandardProps | TooltipWithIconProps;\n\nexport const Tooltip = ({\n  trigger: triggerProp,\n  iconTrigger,\n  side = 'bottom',\n  hideArrow,\n  defaultOpen,\n  open,\n  delayDuration = 300,\n  onOpenChange,\n  interactive = true,\n  children,\n  'aria-label': ariaLabel,\n  portal = true,\n  disabled = false,\n  className,\n  maxWidth,\n  zIndex = 10,\n  triggerProps,\n  portalProps,\n  contentAlignment,\n  size = 'md',\n  ...contentProps\n}: TooltipProps) => {\n  let trigger;\n\n  if (iconTrigger) {\n    trigger = (\n      <TooltipIcon tabIndex={0} aria-label={ariaLabel} className={className}>\n        {cloneElement(iconTrigger, { focusable: false, 'aria-hidden': true })}\n      </TooltipIcon>\n    );\n  } else {\n    trigger = triggerProp;\n  }\n\n  // quick way to check if children are renderable. null, false, and true will be filtered out when converting to an array\n  const hasRenderableChildren = Children.toArray(children).length > 0;\n\n  const content = (\n    <TooltipPrimitive.Content side={side} sideOffset={8} asChild {...contentProps}>\n      <FloatingTooltip\n        zIndex={zIndex}\n        contentAlignment={contentAlignment}\n        maxWidth={maxWidth}\n        size={size}\n      >\n        {children}\n        {!hideArrow && (\n          <TooltipPrimitive.Arrow asChild>\n            <TooltipArrow />\n          </TooltipPrimitive.Arrow>\n        )}\n      </FloatingTooltip>\n    </TooltipPrimitive.Content>\n  );\n\n  return (\n    <TooltipPrimitive.Provider delayDuration={delayDuration}>\n      <TooltipPrimitive.Root\n        open={open}\n        defaultOpen={defaultOpen}\n        disableHoverableContent={!interactive}\n        onOpenChange={onOpenChange}\n      >\n        <TooltipPrimitive.Trigger asChild aria-label={ariaLabel} {...triggerProps}>\n          {trigger}\n        </TooltipPrimitive.Trigger>\n\n        {!disabled &&\n          hasRenderableChildren &&\n          (portal ? (\n            <TooltipPrimitive.Portal {...portalProps}>{content}</TooltipPrimitive.Portal>\n          ) : (\n            content\n          ))}\n      </TooltipPrimitive.Root>\n    </TooltipPrimitive.Provider>\n  );\n};\n\nexport default Tooltip;\n","import { Color } from '@persona/design-tokens';\nimport { CircleHelpIcon } from '@persona/icons';\nimport { CircleHelpIcon as CircleHelpIconSmall } from '@persona/icons/12px';\nimport type { ReactNode } from 'react';\n\nimport Tooltip, { type TooltipWithIconProps } from './Tooltip';\n\nexport interface HelperTooltipProps extends Omit<TooltipWithIconProps, 'iconTrigger'> {\n  children: ReactNode;\n  size?: 'md' | 'sm';\n}\n\n/**\n * Helper component for rendering help text via help icons.\n */\nconst HelperTooltip = ({ children, size = 'md', ...props }: HelperTooltipProps) => {\n  return (\n    <Tooltip\n      size={size}\n      iconTrigger={\n        size === 'md' ? (\n          <CircleHelpIcon color={Color.BorderIconSecondary} />\n        ) : (\n          <CircleHelpIconSmall color={Color.BorderIconSecondary} />\n        )\n      }\n      {...props}\n    >\n      {children}\n    </Tooltip>\n  );\n};\n\nexport default HelperTooltip;\n","import { Color } from '@persona/design-tokens';\nimport type { ReactNode } from 'react';\nimport styled from 'styled-components';\n\nimport Tooltip, { type TooltipStandardProps } from './Tooltip';\n\nexport const TextWithDashedUnderline = styled.span`\n  text-decoration: underline;\n  text-decoration-style: dashed;\n  text-decoration-color: ${Color.CoreSlate700};\n  text-underline-offset: 2px;\n  text-decoration-thickness: 1px;\n  width: fit-content;\n`;\n\ninterface TextUnderlineTooltipProps extends Omit<TooltipStandardProps, 'trigger' | 'iconTrigger'> {\n  tooltip: ReactNode;\n}\n\nconst TextUnderlineTooltip = ({ children, tooltip, ...props }: TextUnderlineTooltipProps) => {\n  return (\n    <Tooltip trigger={<TextWithDashedUnderline>{children}</TextWithDashedUnderline>} {...props}>\n      {tooltip}\n    </Tooltip>\n  );\n};\n\nexport default TextUnderlineTooltip;\n"],"mappings":"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"}

package/dist/Tooltip-C0PS5InA.d.mts

@@ -0,0 +1,100 @@
+import { r as _default, t as CardProps } from "./Card-CcU9cKCd.mjs";
+import { DefaultTheme, StyledComponent } from "styled-components";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import { ComponentPropsWithoutRef, ComponentType, ReactElement, ReactNode } from "react";
+import * as TooltipPrimitive from "@radix-ui/react-tooltip";
+
+//#region components/Tooltip/Tooltip.d.ts
+interface FloatingTooltipProps extends CardProps {
+  zIndex?: number;
+  contentAlignment: 'start' | 'center' | 'end';
+  maxWidth?: string;
+  size?: 'sm' | 'md';
+}
+declare const FloatingTooltip: StyledComponent<ComponentType<ComponentPropsWithoutRef<typeof _default>>, DefaultTheme, FloatingTooltipProps>;
+interface TooltipBaseProps extends Omit<TooltipPrimitive.TooltipProps, 'disableHoverableContent'>, TooltipPrimitive.TooltipContentProps {
+  /**
+   * Optionally hide tooltip arrow.
+   */
+  hideArrow?: boolean;
+  children?: ReactNode;
+  /**
+   * Disabling will prevent tooltip from rendering on the trigger
+   */
+  disabled?: boolean;
+  /**
+   * Render in a portal.
+   * Disable to render adjacent to trigger for rendering within elements such as modals
+   */
+  portal?: boolean;
+  /**
+   * Props applied to Radix UI Portal component
+   */
+  portalProps?: TooltipPrimitive.TooltipPortalProps;
+  /**
+   * Determines if the tooltip closes when the mouse hovers into the tooltip content area
+   */
+  interactive?: boolean;
+  /**
+   * Override the zIndex in case the tooltip is used in situations where the content is
+   * already elevated
+   */
+  zIndex?: number;
+  /**
+   * Max width of the contents in the tooltip
+   */
+  maxWidth?: string;
+  /**
+   * Props to apply to Tooltip.Trigger within
+   */
+  triggerProps?: TooltipPrimitive.TooltipTriggerProps;
+  /**
+   * Size of the tooltip. Defaults to 'md'.
+   */
+  size?: 'sm' | 'md';
+}
+interface TooltipStandardProps extends TooltipBaseProps {
+  /**
+   * Element that will trigger the tooltip. A `ref` will be set.
+   */
+  trigger: ReactElement;
+  iconTrigger?: never;
+  className?: never;
+  contentAlignment?: 'start' | 'center' | 'end';
+}
+interface TooltipWithIconProps extends TooltipBaseProps {
+  trigger?: never;
+  /**
+   * Icon that will trigger the tooltip. A wrapper div will be set.
+   */
+  iconTrigger: ReactElement;
+  className?: string;
+  contentAlignment?: 'start' | 'center' | 'end';
+}
+type TooltipProps = TooltipStandardProps | TooltipWithIconProps;
+declare const Tooltip: ({
+  trigger: triggerProp,
+  iconTrigger,
+  side,
+  hideArrow,
+  defaultOpen,
+  open,
+  delayDuration,
+  onOpenChange,
+  interactive,
+  children,
+  "aria-label": ariaLabel,
+  portal,
+  disabled,
+  className,
+  maxWidth,
+  zIndex,
+  triggerProps,
+  portalProps,
+  contentAlignment,
+  size,
+  ...contentProps
+}: TooltipProps) => _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { TooltipWithIconProps as i, Tooltip as n, TooltipStandardProps as r, FloatingTooltip as t };
+//# sourceMappingURL=Tooltip-C0PS5InA.d.mts.map

package/dist/Tooltip-CE1oH6Iz.d.cts

@@ -0,0 +1,100 @@
+import { r as _default, t as CardProps } from "./Card-CrQL0hXm.cjs";
+import { ComponentPropsWithoutRef, ComponentType, ReactElement, ReactNode } from "react";
+import { DefaultTheme, StyledComponent } from "styled-components";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime.js";
+import * as TooltipPrimitive from "@radix-ui/react-tooltip";
+
+//#region components/Tooltip/Tooltip.d.ts
+interface FloatingTooltipProps extends CardProps {
+  zIndex?: number;
+  contentAlignment: 'start' | 'center' | 'end';
+  maxWidth?: string;
+  size?: 'sm' | 'md';
+}
+declare const FloatingTooltip: StyledComponent<ComponentType<ComponentPropsWithoutRef<typeof _default>>, DefaultTheme, FloatingTooltipProps>;
+interface TooltipBaseProps extends Omit<TooltipPrimitive.TooltipProps, 'disableHoverableContent'>, TooltipPrimitive.TooltipContentProps {
+  /**
+   * Optionally hide tooltip arrow.
+   */
+  hideArrow?: boolean;
+  children?: ReactNode;
+  /**
+   * Disabling will prevent tooltip from rendering on the trigger
+   */
+  disabled?: boolean;
+  /**
+   * Render in a portal.
+   * Disable to render adjacent to trigger for rendering within elements such as modals
+   */
+  portal?: boolean;
+  /**
+   * Props applied to Radix UI Portal component
+   */
+  portalProps?: TooltipPrimitive.TooltipPortalProps;
+  /**
+   * Determines if the tooltip closes when the mouse hovers into the tooltip content area
+   */
+  interactive?: boolean;
+  /**
+   * Override the zIndex in case the tooltip is used in situations where the content is
+   * already elevated
+   */
+  zIndex?: number;
+  /**
+   * Max width of the contents in the tooltip
+   */
+  maxWidth?: string;
+  /**
+   * Props to apply to Tooltip.Trigger within
+   */
+  triggerProps?: TooltipPrimitive.TooltipTriggerProps;
+  /**
+   * Size of the tooltip. Defaults to 'md'.
+   */
+  size?: 'sm' | 'md';
+}
+interface TooltipStandardProps extends TooltipBaseProps {
+  /**
+   * Element that will trigger the tooltip. A `ref` will be set.
+   */
+  trigger: ReactElement;
+  iconTrigger?: never;
+  className?: never;
+  contentAlignment?: 'start' | 'center' | 'end';
+}
+interface TooltipWithIconProps extends TooltipBaseProps {
+  trigger?: never;
+  /**
+   * Icon that will trigger the tooltip. A wrapper div will be set.
+   */
+  iconTrigger: ReactElement;
+  className?: string;
+  contentAlignment?: 'start' | 'center' | 'end';
+}
+type TooltipProps = TooltipStandardProps | TooltipWithIconProps;
+declare const Tooltip: ({
+  trigger: triggerProp,
+  iconTrigger,
+  side,
+  hideArrow,
+  defaultOpen,
+  open,
+  delayDuration,
+  onOpenChange,
+  interactive,
+  children,
+  "aria-label": ariaLabel,
+  portal,
+  disabled,
+  className,
+  maxWidth,
+  zIndex,
+  triggerProps,
+  portalProps,
+  contentAlignment,
+  size,
+  ...contentProps
+}: TooltipProps) => _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { TooltipWithIconProps as i, Tooltip as n, TooltipStandardProps as r, FloatingTooltip as t };
+//# sourceMappingURL=Tooltip-CE1oH6Iz.d.cts.map

package/dist/Tooltip-T7RQpy_a.mjs

@@ -0,0 +1,120 @@
+import "./variables/transitions.mjs";
+import { paragraphMixins } from "./mixins/text.mjs";
+import { t as Card_default } from "./Card-DeJSt5ys.mjs";
+import { fadeIn } from "./variables/keyframes.mjs";
+import { Color, Spacing } from "@persona/design-tokens";
+import styled from "styled-components";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Children, cloneElement } from "react";
+import { CircleHelpIcon } from "@persona/icons";
+import { CircleHelpIcon as CircleHelpIcon$1 } from "@persona/icons/12px";
+import * as TooltipPrimitive from "@radix-ui/react-tooltip";
+//#region components/Tooltip/Tooltip.tsx
+const FloatingTooltip = styled(Card_default)`
+  ${({ size = "md" }) => size === "sm" ? paragraphMixins.sm : paragraphMixins.md};
+  line-height: ${({ size = "md" }) => size === "sm" ? "16px" : "20px"};
+  box-shadow: 0px 0px 14px 2px rgba(0, 0, 0, 0.12);
+  border-radius: 4px;
+  display: flex;
+  align-items: ${({ contentAlignment }) => contentAlignment || "center"};
+  justify-content: center;
+  padding: 6px ${Spacing[2]};
+  animation: ${fadeIn} ${"200ms"} ease-in-out;
+  z-index: ${({ zIndex }) => zIndex};
+  margin: 0;
+  max-width: ${({ maxWidth }) => maxWidth || "250px"};
+  color: ${Color.TextPrimary};
+`;
+const TooltipArrow = styled.div`
+  width: 0;
+  height: 0;
+  border-color: ${({ theme }) => theme.color.background.primary};
+  border-left: 8px solid transparent;
+  border-top: 8px solid ${({ theme }) => theme.color.background.primary};
+  border-right: 8px solid transparent;
+`;
+const TooltipIcon = styled.div`
+  display: inline-flex;
+`;
+const Tooltip = ({ trigger: triggerProp, iconTrigger, side = "bottom", hideArrow, defaultOpen, open, delayDuration = 300, onOpenChange, interactive = true, children, "aria-label": ariaLabel, portal = true, disabled = false, className, maxWidth, zIndex = 10, triggerProps, portalProps, contentAlignment, size = "md", ...contentProps }) => {
+	let trigger;
+	if (iconTrigger) trigger = /* @__PURE__ */ jsx(TooltipIcon, {
+		tabIndex: 0,
+		"aria-label": ariaLabel,
+		className,
+		children: cloneElement(iconTrigger, {
+			focusable: false,
+			"aria-hidden": true
+		})
+	});
+	else trigger = triggerProp;
+	const hasRenderableChildren = Children.toArray(children).length > 0;
+	const content = /* @__PURE__ */ jsx(TooltipPrimitive.Content, {
+		side,
+		sideOffset: 8,
+		asChild: true,
+		...contentProps,
+		children: /* @__PURE__ */ jsxs(FloatingTooltip, {
+			zIndex,
+			contentAlignment,
+			maxWidth,
+			size,
+			children: [children, !hideArrow && /* @__PURE__ */ jsx(TooltipPrimitive.Arrow, {
+				asChild: true,
+				children: /* @__PURE__ */ jsx(TooltipArrow, {})
+			})]
+		})
+	});
+	return /* @__PURE__ */ jsx(TooltipPrimitive.Provider, {
+		delayDuration,
+		children: /* @__PURE__ */ jsxs(TooltipPrimitive.Root, {
+			open,
+			defaultOpen,
+			disableHoverableContent: !interactive,
+			onOpenChange,
+			children: [/* @__PURE__ */ jsx(TooltipPrimitive.Trigger, {
+				asChild: true,
+				"aria-label": ariaLabel,
+				...triggerProps,
+				children: trigger
+			}), !disabled && hasRenderableChildren && (portal ? /* @__PURE__ */ jsx(TooltipPrimitive.Portal, {
+				...portalProps,
+				children: content
+			}) : content)]
+		})
+	});
+};
+//#endregion
+//#region components/Tooltip/HelperTooltip.tsx
+/**
+* Helper component for rendering help text via help icons.
+*/
+const HelperTooltip = ({ children, size = "md", ...props }) => {
+	return /* @__PURE__ */ jsx(Tooltip, {
+		size,
+		iconTrigger: size === "md" ? /* @__PURE__ */ jsx(CircleHelpIcon, { color: Color.BorderIconSecondary }) : /* @__PURE__ */ jsx(CircleHelpIcon$1, { color: Color.BorderIconSecondary }),
+		...props,
+		children
+	});
+};
+//#endregion
+//#region components/Tooltip/TextUnderlineTooltip.tsx
+const TextWithDashedUnderline = styled.span`
+  text-decoration: underline;
+  text-decoration-style: dashed;
+  text-decoration-color: ${Color.CoreSlate700};
+  text-underline-offset: 2px;
+  text-decoration-thickness: 1px;
+  width: fit-content;
+`;
+const TextUnderlineTooltip = ({ children, tooltip, ...props }) => {
+	return /* @__PURE__ */ jsx(Tooltip, {
+		trigger: /* @__PURE__ */ jsx(TextWithDashedUnderline, { children }),
+		...props,
+		children: tooltip
+	});
+};
+//#endregion
+export { Tooltip as a, FloatingTooltip as i, TextWithDashedUnderline as n, HelperTooltip as r, TextUnderlineTooltip as t };
+
+//# sourceMappingURL=Tooltip-T7RQpy_a.mjs.map

package/dist/Tooltip-T7RQpy_a.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tooltip-T7RQpy_a.mjs","names":["Card","CircleHelpIconSmall"],"sources":["../components/Tooltip/Tooltip.tsx","../components/Tooltip/HelperTooltip.tsx","../components/Tooltip/TextUnderlineTooltip.tsx"],"sourcesContent":["import { Color, Spacing } from '@persona/design-tokens';\nimport * as TooltipPrimitive from '@radix-ui/react-tooltip';\nimport {\n  Children,\n  cloneElement,\n  type ComponentPropsWithoutRef,\n  type ComponentType,\n  type ReactElement,\n  type ReactNode,\n} from 'react';\nimport styled, { type DefaultTheme, type StyledComponent } from 'styled-components';\n\nimport Card, { type CardProps } from 'design-system/components/Card';\nimport { paragraphMixins } from 'design-system/mixins/text';\nimport { fadeIn } from 'design-system/variables/keyframes';\nimport { TransitionDuration } from 'design-system/variables/transitions';\n\ninterface FloatingTooltipProps extends CardProps {\n  zIndex?: number;\n  contentAlignment: 'start' | 'center' | 'end';\n  maxWidth?: string;\n  size?: 'sm' | 'md';\n}\n\nexport const FloatingTooltip: StyledComponent<\n  ComponentType<ComponentPropsWithoutRef<typeof Card>>,\n  DefaultTheme,\n  FloatingTooltipProps\n> = styled(Card)<FloatingTooltipProps>`\n  ${({ size = 'md' }) => (size === 'sm' ? paragraphMixins.sm : paragraphMixins.md)};\n  line-height: ${({ size = 'md' }) => (size === 'sm' ? '16px' : '20px')};\n  box-shadow: 0px 0px 14px 2px rgba(0, 0, 0, 0.12);\n  border-radius: 4px;\n  display: flex;\n  align-items: ${({ contentAlignment }) => contentAlignment || 'center'};\n  justify-content: center;\n  padding: 6px ${Spacing[2]};\n  animation: ${fadeIn} ${TransitionDuration.Fast} ease-in-out;\n  z-index: ${({ zIndex }) => zIndex};\n  margin: 0;\n  max-width: ${({ maxWidth }) => maxWidth || '250px'};\n  color: ${Color.TextPrimary};\n`;\n\nconst TooltipArrow = styled.div`\n  width: 0;\n  height: 0;\n  border-color: ${({ theme }) => theme.color.background.primary};\n  border-left: 8px solid transparent;\n  border-top: 8px solid ${({ theme }) => theme.color.background.primary};\n  border-right: 8px solid transparent;\n`;\n\nconst TooltipIcon = styled.div`\n  display: inline-flex;\n`;\n\ninterface TooltipBaseProps\n  extends\n    Omit<TooltipPrimitive.TooltipProps, 'disableHoverableContent'>,\n    TooltipPrimitive.TooltipContentProps {\n  /**\n   * Optionally hide tooltip arrow.\n   */\n  hideArrow?: boolean;\n\n  children?: ReactNode;\n\n  /**\n   * Disabling will prevent tooltip from rendering on the trigger\n   */\n  disabled?: boolean;\n\n  /**\n   * Render in a portal.\n   * Disable to render adjacent to trigger for rendering within elements such as modals\n   */\n  portal?: boolean;\n\n  /**\n   * Props applied to Radix UI Portal component\n   */\n  portalProps?: TooltipPrimitive.TooltipPortalProps;\n\n  /**\n   * Determines if the tooltip closes when the mouse hovers into the tooltip content area\n   */\n  interactive?: boolean;\n\n  /**\n   * Override the zIndex in case the tooltip is used in situations where the content is\n   * already elevated\n   */\n  zIndex?: number;\n\n  /**\n   * Max width of the contents in the tooltip\n   */\n  maxWidth?: string;\n\n  /**\n   * Props to apply to Tooltip.Trigger within\n   */\n  triggerProps?: TooltipPrimitive.TooltipTriggerProps;\n\n  /**\n   * Size of the tooltip. Defaults to 'md'.\n   */\n  size?: 'sm' | 'md';\n}\n\nexport interface TooltipStandardProps extends TooltipBaseProps {\n  /**\n   * Element that will trigger the tooltip. A `ref` will be set.\n   */\n  trigger: ReactElement;\n\n  iconTrigger?: never;\n\n  className?: never;\n\n  contentAlignment?: 'start' | 'center' | 'end';\n}\n\nexport interface TooltipWithIconProps extends TooltipBaseProps {\n  trigger?: never;\n\n  /**\n   * Icon that will trigger the tooltip. A wrapper div will be set.\n   */\n  iconTrigger: ReactElement;\n\n  className?: string;\n\n  contentAlignment?: 'start' | 'center' | 'end';\n}\n\ntype TooltipProps = TooltipStandardProps | TooltipWithIconProps;\n\nexport const Tooltip = ({\n  trigger: triggerProp,\n  iconTrigger,\n  side = 'bottom',\n  hideArrow,\n  defaultOpen,\n  open,\n  delayDuration = 300,\n  onOpenChange,\n  interactive = true,\n  children,\n  'aria-label': ariaLabel,\n  portal = true,\n  disabled = false,\n  className,\n  maxWidth,\n  zIndex = 10,\n  triggerProps,\n  portalProps,\n  contentAlignment,\n  size = 'md',\n  ...contentProps\n}: TooltipProps) => {\n  let trigger;\n\n  if (iconTrigger) {\n    trigger = (\n      <TooltipIcon tabIndex={0} aria-label={ariaLabel} className={className}>\n        {cloneElement(iconTrigger, { focusable: false, 'aria-hidden': true })}\n      </TooltipIcon>\n    );\n  } else {\n    trigger = triggerProp;\n  }\n\n  // quick way to check if children are renderable. null, false, and true will be filtered out when converting to an array\n  const hasRenderableChildren = Children.toArray(children).length > 0;\n\n  const content = (\n    <TooltipPrimitive.Content side={side} sideOffset={8} asChild {...contentProps}>\n      <FloatingTooltip\n        zIndex={zIndex}\n        contentAlignment={contentAlignment}\n        maxWidth={maxWidth}\n        size={size}\n      >\n        {children}\n        {!hideArrow && (\n          <TooltipPrimitive.Arrow asChild>\n            <TooltipArrow />\n          </TooltipPrimitive.Arrow>\n        )}\n      </FloatingTooltip>\n    </TooltipPrimitive.Content>\n  );\n\n  return (\n    <TooltipPrimitive.Provider delayDuration={delayDuration}>\n      <TooltipPrimitive.Root\n        open={open}\n        defaultOpen={defaultOpen}\n        disableHoverableContent={!interactive}\n        onOpenChange={onOpenChange}\n      >\n        <TooltipPrimitive.Trigger asChild aria-label={ariaLabel} {...triggerProps}>\n          {trigger}\n        </TooltipPrimitive.Trigger>\n\n        {!disabled &&\n          hasRenderableChildren &&\n          (portal ? (\n            <TooltipPrimitive.Portal {...portalProps}>{content}</TooltipPrimitive.Portal>\n          ) : (\n            content\n          ))}\n      </TooltipPrimitive.Root>\n    </TooltipPrimitive.Provider>\n  );\n};\n\nexport default Tooltip;\n","import { Color } from '@persona/design-tokens';\nimport { CircleHelpIcon } from '@persona/icons';\nimport { CircleHelpIcon as CircleHelpIconSmall } from '@persona/icons/12px';\nimport type { ReactNode } from 'react';\n\nimport Tooltip, { type TooltipWithIconProps } from './Tooltip';\n\nexport interface HelperTooltipProps extends Omit<TooltipWithIconProps, 'iconTrigger'> {\n  children: ReactNode;\n  size?: 'md' | 'sm';\n}\n\n/**\n * Helper component for rendering help text via help icons.\n */\nconst HelperTooltip = ({ children, size = 'md', ...props }: HelperTooltipProps) => {\n  return (\n    <Tooltip\n      size={size}\n      iconTrigger={\n        size === 'md' ? (\n          <CircleHelpIcon color={Color.BorderIconSecondary} />\n        ) : (\n          <CircleHelpIconSmall color={Color.BorderIconSecondary} />\n        )\n      }\n      {...props}\n    >\n      {children}\n    </Tooltip>\n  );\n};\n\nexport default HelperTooltip;\n","import { Color } from '@persona/design-tokens';\nimport type { ReactNode } from 'react';\nimport styled from 'styled-components';\n\nimport Tooltip, { type TooltipStandardProps } from './Tooltip';\n\nexport const TextWithDashedUnderline = styled.span`\n  text-decoration: underline;\n  text-decoration-style: dashed;\n  text-decoration-color: ${Color.CoreSlate700};\n  text-underline-offset: 2px;\n  text-decoration-thickness: 1px;\n  width: fit-content;\n`;\n\ninterface TextUnderlineTooltipProps extends Omit<TooltipStandardProps, 'trigger' | 'iconTrigger'> {\n  tooltip: ReactNode;\n}\n\nconst TextUnderlineTooltip = ({ children, tooltip, ...props }: TextUnderlineTooltipProps) => {\n  return (\n    <Tooltip trigger={<TextWithDashedUnderline>{children}</TextWithDashedUnderline>} {...props}>\n      {tooltip}\n    </Tooltip>\n  );\n};\n\nexport default TextUnderlineTooltip;\n"],"mappings":";;;;;;;;;;;;AAwBA,MAAa,kBAIT,OAAOA,aAAK;KACX,EAAE,OAAO,WAAY,SAAS,OAAO,gBAAgB,KAAK,gBAAgB,GAAI;kBACjE,EAAE,OAAO,WAAY,SAAS,OAAO,SAAS,OAAQ;;;;kBAItD,EAAE,uBAAuB,oBAAoB,SAAS;;iBAEvD,QAAQ,GAAG;eACb,OAAO,GAAA,QAA2B;cACnC,EAAE,aAAa,OAAO;;gBAEpB,EAAE,eAAe,YAAY,QAAQ;WAC1C,MAAM,YAAY;;AAG7B,MAAM,eAAe,OAAO,GAAG;;;mBAGZ,EAAE,YAAY,MAAM,MAAM,WAAW,QAAQ;;2BAErC,EAAE,YAAY,MAAM,MAAM,WAAW,QAAQ;;;AAIxE,MAAM,cAAc,OAAO,GAAG;;;AAsF9B,MAAa,WAAW,EACtB,SAAS,aACT,aACA,OAAO,UACP,WACA,aACA,MACA,gBAAgB,KAChB,cACA,cAAc,MACd,UACA,cAAc,WACd,SAAS,MACT,WAAW,OACX,WACA,UACA,SAAS,IACT,cACA,aACA,kBACA,OAAO,MACP,GAAG,mBACe;CAClB,IAAI;AAEJ,KAAI,YACF,WACE,oBAAC,aAAD;EAAa,UAAU;EAAG,cAAY;EAAsB;YACzD,aAAa,aAAa;GAAE,WAAW;GAAO,eAAe;GAAM,CAAC;EACzD,CAAA;KAGhB,WAAU;CAIZ,MAAM,wBAAwB,SAAS,QAAQ,SAAS,CAAC,SAAS;CAElE,MAAM,UACJ,oBAAC,iBAAiB,SAAlB;EAAgC;EAAM,YAAY;EAAG,SAAA;EAAQ,GAAI;YAC/D,qBAAC,iBAAD;GACU;GACU;GACR;GACJ;aAJR,CAMG,UACA,CAAC,aACA,oBAAC,iBAAiB,OAAlB;IAAwB,SAAA;cACtB,oBAAC,cAAD,EAAgB,CAAA;IACO,CAAA,CAEX;;EACO,CAAA;AAG7B,QACE,oBAAC,iBAAiB,UAAlB;EAA0C;YACxC,qBAAC,iBAAiB,MAAlB;GACQ;GACO;GACb,yBAAyB,CAAC;GACZ;aAJhB,CAME,oBAAC,iBAAiB,SAAlB;IAA0B,SAAA;IAAQ,cAAY;IAAW,GAAI;cAC1D;IACwB,CAAA,EAE1B,CAAC,YACA,0BACC,SACC,oBAAC,iBAAiB,QAAlB;IAAyB,GAAI;cAAc;IAAkC,CAAA,GAE7E,SAEkB;;EACE,CAAA;;;;;;;ACxMhC,MAAM,iBAAiB,EAAE,UAAU,OAAO,MAAM,GAAG,YAAgC;AACjF,QACE,oBAAC,SAAD;EACQ;EACN,aACE,SAAS,OACP,oBAAC,gBAAD,EAAgB,OAAO,MAAM,qBAAuB,CAAA,GAEpD,oBAACC,kBAAD,EAAqB,OAAO,MAAM,qBAAuB,CAAA;EAG7D,GAAI;EAEH;EACO,CAAA;;;;ACvBd,MAAa,0BAA0B,OAAO,IAAI;;;2BAGvB,MAAM,aAAa;;;;;AAU9C,MAAM,wBAAwB,EAAE,UAAU,SAAS,GAAG,YAAuC;AAC3F,QACE,oBAAC,SAAD;EAAS,SAAS,oBAAC,yBAAD,EAA0B,UAAmC,CAAA;EAAE,GAAI;YAClF;EACO,CAAA"}

package/dist/Tooltip.d.cts

@@ -0,0 +1,2 @@
+import { i as TooltipWithIconProps, n as Tooltip, r as TooltipStandardProps, t as FloatingTooltip } from "./Tooltip-CE1oH6Iz.cjs";
+export { FloatingTooltip, Tooltip, Tooltip as default, TooltipStandardProps, TooltipWithIconProps };

package/dist/Tooltip.d.mts

@@ -0,0 +1,2 @@
+import { i as TooltipWithIconProps, n as Tooltip, r as TooltipStandardProps, t as FloatingTooltip } from "./Tooltip-C0PS5InA.mjs";
+export { FloatingTooltip, Tooltip, Tooltip as default, TooltipStandardProps, TooltipWithIconProps };

package/dist/TruncatedText-0Tf8CwFX.d.mts

@@ -0,0 +1,18 @@
+import * as _$styled_components0 from "styled-components";
+import { ComponentPropsWithoutRef, FC } from "react";
+
+//#region lib/TruncatedText.d.ts
+declare const OverflowEllipsisSpan: _$styled_components0.StyledComponent<"span", any, {}, never>;
+interface TruncatedTextProps extends ComponentPropsWithoutRef<'span'> {
+  titleBehavior?: 'always' | 'conditional';
+}
+/**
+ * Truncates the text if it is too long to fit in the container.
+ *
+ * The text truncation is CSS-driven, but we use JavaScript to detect when truncation
+ * happens so we can set a title attribute dynamically.
+ */
+declare const TruncatedText: FC<TruncatedTextProps>;
+//#endregion
+export { TruncatedText as n, TruncatedTextProps as r, OverflowEllipsisSpan as t };
+//# sourceMappingURL=TruncatedText-0Tf8CwFX.d.mts.map

package/dist/TruncatedText-D8f3AiBL.d.cts

@@ -0,0 +1,18 @@
+import { ComponentPropsWithoutRef, FC } from "react";
+import * as _$styled_components0 from "styled-components";
+
+//#region lib/TruncatedText.d.ts
+declare const OverflowEllipsisSpan: _$styled_components0.StyledComponent<"span", any, {}, never>;
+interface TruncatedTextProps extends ComponentPropsWithoutRef<'span'> {
+  titleBehavior?: 'always' | 'conditional';
+}
+/**
+ * Truncates the text if it is too long to fit in the container.
+ *
+ * The text truncation is CSS-driven, but we use JavaScript to detect when truncation
+ * happens so we can set a title attribute dynamically.
+ */
+declare const TruncatedText: FC<TruncatedTextProps>;
+//#endregion
+export { TruncatedText as n, TruncatedTextProps as r, OverflowEllipsisSpan as t };
+//# sourceMappingURL=TruncatedText-D8f3AiBL.d.cts.map

package/dist/chunk-Bpcn9VDT.mjs

@@ -0,0 +1,39 @@
+//#region \0rolldown/runtime.js
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __esmMin = (fn, res) => () => (fn && (res = fn(fn = 0)), res);
+var __commonJSMin = (cb, mod) => () => (mod || (cb((mod = { exports: {} }).exports, mod), cb = null), mod.exports);
+var __exportAll = (all, no_symbols) => {
+	let target = {};
+	for (var name in all) __defProp(target, name, {
+		get: all[name],
+		enumerable: true
+	});
+	if (!no_symbols) __defProp(target, Symbol.toStringTag, { value: "Module" });
+	return target;
+};
+var __copyProps = (to, from, except, desc) => {
+	if (from && typeof from === "object" || typeof from === "function") for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
+		key = keys[i];
+		if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+			get: ((k) => from[k]).bind(null, key),
+			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+		});
+	}
+	return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
+	value: mod,
+	enumerable: true
+}) : target, mod));
+var __toCommonJS = (mod) => __hasOwnProp.call(mod, "module.exports") ? mod["module.exports"] : __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, { get: (a, b) => (typeof require !== "undefined" ? require : a)[b] }) : x)(function(x) {
+	if (typeof require !== "undefined") return require.apply(this, arguments);
+	throw Error("Calling `require` for \"" + x + "\" in an environment that doesn't expose the `require` function. See https://rolldown.rs/in-depth/bundling-cjs#require-external-modules for more details.");
+});
+//#endregion
+export { __toCommonJS as a, __require as i, __esmMin as n, __toESM as o, __exportAll as r, __commonJSMin as t };