@persona/design-system 0.1.8 → 0.2.0

package/dist/DropdownMenu-FkiManPP.d.cts

@@ -1,75 +0,0 @@
-import { l as MenuItemProps, s as MenuHeadingProps } from "./Menu-fUnbIYr5.cjs";
-import { ComponentPropsWithRef, ComponentPropsWithoutRef, ElementType, FC, FunctionComponentElement } from "react";
-import * as _$styled_components0 from "styled-components";
-import * as _$react_jsx_runtime0 from "react/jsx-runtime.js";
-import { Property } from "csstype";
-import * as Primitive from "@radix-ui/react-dropdown-menu";
-
-//#region components/DropdownMenu/DropdownMenu.d.ts
-interface DropdownMenuProps extends Primitive.DropdownMenuProps, Pick<Primitive.DropdownMenuContentProps, 'side' | 'align'> {
-  id?: string;
-  className?: string;
-  trigger: FunctionComponentElement<any>;
-  /**
-   * Props passed to internal DropdownMenu.Content component.
-   */
-  contentProps?: Primitive.DropdownMenuContentProps;
-  /**
-   * Props passed to internal DropdownMenu.Trigger component.
-   */
-  triggerProps?: Primitive.DropdownMenuTriggerProps;
-  /**
-   * Props passed to internal DropdownMenu.Portal component.
-   */
-  portalProps?: Primitive.DropdownMenuPortalProps;
-  /**
-   * Whether or not to wrap menu with DropdownMenu.Portal component.
-   */
-  portal?: boolean;
-  /**
-   * Whether or not clicks render menu items.
-   */
-  disabled?: boolean;
-  zIndex?: Property.ZIndex;
-}
-declare const DropdownMenu: ({
-  trigger,
-  children,
-  side,
-  align,
-  contentProps,
-  triggerProps,
-  portalProps,
-  className,
-  portal,
-  modal,
-  disabled,
-  zIndex,
-  ...props
-}: DropdownMenuProps) => _$react_jsx_runtime0.JSX.Element | null;
-interface DropdownMenuItemProps<T extends ElementType = 'div'> extends MenuItemProps<T>, Omit<Primitive.DropdownMenuItemProps, 'asChild' | 'children'> {}
-interface DropdownMenuItemType<T extends ElementType = 'div'> extends FC<DropdownMenuItemProps<T> & ComponentPropsWithRef<T>> {
-  <T extends ElementType = 'div'>(props: DropdownMenuItemProps<T> & ComponentPropsWithoutRef<T>): ReturnType<FC<DropdownMenuItemProps<T> & ComponentPropsWithoutRef<T>>>;
-}
-declare const _default: (({
-  trigger,
-  children,
-  side,
-  align,
-  contentProps,
-  triggerProps,
-  portalProps,
-  className,
-  portal,
-  modal,
-  disabled,
-  zIndex,
-  ...props
-}: DropdownMenuProps) => _$react_jsx_runtime0.JSX.Element | null) & {
-  Item: DropdownMenuItemType<"div">;
-  Heading: _$styled_components0.StyledComponent<"li", any, MenuHeadingProps, never>;
-  Divider: (props: ComponentPropsWithoutRef<"hr">) => _$react_jsx_runtime0.JSX.Element;
-};
-//#endregion
-export { DropdownMenuProps as n, _default as r, DropdownMenu as t };
-//# sourceMappingURL=DropdownMenu-FkiManPP.d.cts.map

package/dist/DropdownMenu.d.cts

@@ -1,2 +0,0 @@
-import { n as DropdownMenuProps, r as _default, t as DropdownMenu } from "./DropdownMenu-FkiManPP.cjs";
-export { DropdownMenu, DropdownMenuProps, _default as default };

package/dist/ErrorProps-Dxqb4gw_.d.cts

@@ -1,8 +0,0 @@
-//#region types/ErrorProps.d.ts
-interface ErrorProps {
-  hasError?: boolean;
-  hasWarning?: boolean;
-}
-//#endregion
-export { ErrorProps as t };
-//# sourceMappingURL=ErrorProps-Dxqb4gw_.d.cts.map

package/dist/ErrorProps.d.cts

@@ -1,2 +0,0 @@
-import { t as ErrorProps } from "./ErrorProps-Dxqb4gw_.cjs";
-export = ErrorProps;

package/dist/FieldRegistry-rqSkjchY.d.mts

@@ -1,122 +0,0 @@
-import { a as FilterField, c as FilterOperator } from "./types-D58IoRx6.mjs";
-
-//#region components/DataTable/TableControls/FiltersV2/FieldRegistry.d.ts
-/**
- * Per-resource field registry.
- *
- * Built from the backend's `field_key_to_info` payload (extended in v2 to
- * include `type`, `options`, `item_type`, and a `source`/`parent_record_type`
- * pair for custom fields). The registry is the single place the UI looks up
- * "what field is this and what can the user do with it" — value control
- * rendering, operator vocabulary, picker grouping, and popover footer text
- * all route through here.
- *
- * Construction is tolerant of partial metadata: if `type` is missing the
- * field falls back to `'string'`.
- */
-declare class FieldRegistry<TField extends FilterField = FilterField> {
-  readonly resource: string;
-  private readonly byId;
-  /** Custom fields grouped by parent record type label, used by the picker submenu. */
-  private readonly customByParent;
-  /** Parent record id → its display label, used to resolve selector pills to picker groups. */
-  private readonly parentLabelByRecordId;
-  private readonly systemFields;
-  private readonly narrowingSelectors;
-  constructor(resource: string, fields: ReadonlyArray<TField>);
-  parentRecordLabelForId(recordId: string): string | undefined;
-  has(fieldId: string): boolean;
-  get(fieldId: string): TField | undefined;
-  /**
-   * Get a field by id, throwing if it isn't registered. Use this when the
-   * fieldId came from state we own (e.g. an existing `FilterRule`) and a
-   * missing field is a programming error rather than user input.
-   */
-  getOrThrow(fieldId: string): TField;
-  /** All registered fields, in insertion order. */
-  all(): ReadonlyArray<TField>;
-  /** System / built-in fields, used as the top section of the `⊕ Filter` menu. */
-  systemFieldsList(): ReadonlyArray<TField>;
-  /** Custom fields grouped by parent record type for the picker submenu. */
-  customFieldGroups(): ReadonlyArray<{
-    parent: string;
-    fields: ReadonlyArray<TField>;
-  }>;
-  /**
-   * Fields that drive the picker's field-narrowing. A field is inferred
-   * as a scoping selector (e.g. `account_type`, `case_template`) when its
-   * `options[].value` set intersects the registry's custom-field
-   * `parentRecordId`s — matching on the backend id, not the display label,
-   * so a suffixed or colliding label (`"KYC Standard (CAS)"`) still
-   * narrows correctly. `FilterBar` turns an active `is` pill on such a
-   * field into the visible parent labels via {@link parentRecordLabelForId}.
-   *
-   * A coincidental id collision would falsely tag a field as a selector —
-   * benign (it just narrows too); layer on a backend flag if ever needed.
-   */
-  narrowingSelectorFields(): ReadonlyArray<TField>;
-  /** Operator vocabulary for a registered field, gated by its `allowedOperators` then type. */
-  operatorsFor(fieldId: string): ReadonlyArray<FilterOperator>;
-  /** Default operator for a registered field. Used when creating a new pill. */
-  defaultOperatorFor(fieldId: string): FilterOperator;
-  /**
-   * Pick the operator to use for a rule after a field swap. If the
-   * previous operator is still in the new field's vocabulary, keep it
-   * (the user's intent likely carries over — e.g. `is_empty` stays
-   * `is_empty` regardless of field type). Otherwise fall back to the
-   * field's default operator.
-   *
-   * Lives on the registry rather than as a free helper because the
-   * answer is entirely a function of registry-owned data (operator
-   * vocabulary per type) — and centralizing it keeps the field-swap
-   * semantics consistent across `FilterBar.handlePickField`,
-   * `AdvancedFilterRulesPopover.handleFieldChange`, and any future
-   * caller.
-   */
-  reconcileOperator(fieldId: string, prevOperator: FilterOperator): FilterOperator;
-  /**
-   * Build a `value → label` lookup for a `choices` / `multi_choices`
-   * field, suitable for translating raw option ids into the human
-   * labels rendered by `FilterPill` chips and value-control headers.
-   * Returns `undefined` when the field has no options so callers can
-   * skip the lookup entirely.
-   *
-   * Memoized per-field so repeated reads from render loops don't
-   * rebuild the same map. Field options are immutable for the lifetime
-   * of a `FieldRegistry`, so the cache never needs invalidation.
-   */
-  optionLabelsFor(fieldId: string): Record<string, string> | undefined;
-  private readonly optionLabelCache;
-}
-/**
- * Backend metadata for one field as exposed by the v2 `field_key_to_info`
- * payload. All fields except `label` are optional — v1 responses only carry
- * `label`/`tokens`. The registry tolerates the missing fields and falls back
- * to safe defaults.
- */
-interface RawFieldInfo {
-  label: string;
-  tokens?: ReadonlyArray<string>;
-  /** v2 metadata — present once the backend ships its extended schema. */
-  type?: string;
-  source?: string;
-  parent_record_type?: string;
-  parent_record_id?: string;
-  options?: ReadonlyArray<{
-    label: string;
-    value: string;
-  }>;
-  item_type?: string;
-  path?: ReadonlyArray<string>;
-}
-/**
- * Build a registry from a `field_key_to_info` map. Forgiving by design — any
- * key whose `type` is missing or unrecognized falls back to `'string'`, and
- * `source` defaults to `'custom'` (current `customFilters` are all custom).
- */
-declare function buildFieldRegistry(resource: string, fieldKeyToInfo: Record<string, RawFieldInfo>, options?: {
-  systemFields?: ReadonlyArray<FilterField>;
-}): FieldRegistry;
-//#endregion
-export { RawFieldInfo as n, buildFieldRegistry as r, FieldRegistry as t };
-//# sourceMappingURL=FieldRegistry-rqSkjchY.d.mts.map

package/dist/FieldRegistry.d.cts

@@ -1,2 +0,0 @@
-import { n as RawFieldInfo, r as buildFieldRegistry, t as FieldRegistry } from "./FieldRegistry-OX60T3hr.cjs";
-export { FieldRegistry, RawFieldInfo, buildFieldRegistry };

package/dist/FilterBar-YzOh02f9.d.cts

@@ -1,103 +0,0 @@
-import { d as FilterSize, f as FilterStateV2 } from "./types-B_HHNlia.cjs";
-import { t as FieldRegistry } from "./FieldRegistry-OX60T3hr.cjs";
-import { n as ValueControlResolver } from "./value-control-resolver-B9p25q3G.cjs";
-import * as _$react_jsx_runtime0 from "react/jsx-runtime.js";
-
-//#region components/DataTable/TableControls/FiltersV2/FilterBar/FilterBar.d.ts
-/**
- * Filter UI v2 — the top-level FilterBar component.
- *
- * Composes the picker, simple-rule pills, simple-rule popovers, Rules pill,
- * Advanced Filter Rules popover, and type-aware value controls into one bar.
- *
- * Popover open/close transitions flow through Radix's `onOpenChange`
- * callbacks rather than explicit `onClick` handlers on the pills. That keeps
- * the user's pill click and Radix's `Slot`-injected toggle handler from
- * fighting over which one wins (the symptom looks like "the popover opens
- * and immediately closes" — both fire, the first sets open=true, the second
- * toggles open back to false).
- */
-interface FilterBarProps {
-  /**
-   * Registry built from this resource's `field_key_to_info` response.
-   * The registry defines which fields are filterable, each field's type,
-   * option labels, and custom-field parent grouping.
-   */
-  registry: FieldRegistry;
-  /**
-   * Initial state. Defaults to the empty state. For URL/saved-view
-   * hydration, pass the decoded `FilterStateV2` here.
-   *
-   * Re-read when it changes. This lets saved-view and URL hydration swap
-   * the whole filter state after mount without requiring the caller to
-   * remount the bar.
-   *
-   * A pill without a value isn't part of this state and survives hydration —
-   * it is the bar's while it has none, and only its field leaving the registry
-   * drops it.
-   */
-  initialState?: FilterStateV2;
-  /**
-   * Called whenever the structured filter state changes.
-   *
-   * Kept as a single-arg callback so the most common consumer — a
-   * `setState`-style parent driving the bar as a controlled component
-   * (`<FilterBar initialState={state} onChange={setState} />`) — can
-   * pass `setState` directly.
-   *
-   * Reports only valued filters, so feeding the reported state straight
-   * back as `initialState` is a no-op.
-   */
-  onChange?: (state: FilterStateV2) => void;
-  /**
-   * Whether this bar should show the Rules pill + Advanced Filter Rules
-   * popover. When `false`, compound state is pinned to empty.
-   *
-   * @defaultValue `true`
-   */
-  advancedRulesEnabled?: boolean;
-  /**
-   * Keeps the Add-filter picker from building a second top-level pill on a
-   * field that already has one: a field in use drops out of the picker, and
-   * the trigger disappears once no field is left. Compound rules are
-   * unaffected — a field can back a pill and any number of Advanced Filter
-   * Rules at once. Leave off for hosts whose serializer reads repeated rules
-   * on one field as a conjunction (e.g. two date bounds spanning a range).
-   *
-   * Rules arriving through `initialState` are rendered as given; a saved view
-   * holding duplicates keeps them rather than having pills silently dropped
-   * out from under it, so a host that stored duplicates before enabling this
-   * can migrate them on its own terms.
-   *
-   * @defaultValue `false`
-   */
-  singleUseFields?: boolean;
-  /**
-   * Size variant for every Filter UI v2 subcomponent. `'md'` is the
-   * standard-DataTable default (14px font, 16px icons, 32px-tall
-   * controls). `'sm'` is the compact-DataTable variant (12px font,
-   * 12px icons, 24px-tall controls). Propagated to subcomponents via
-   * `FilterBarContext` so each one reads the active size without
-   * the caller having to pass it through every level.
-   *
-   * @defaultValue `'md'`
-   */
-  size?: FilterSize;
-  /**
-   * Renders host-specific field types before falling back to PDS controls.
-   * Return a nullish value to use the built-in resolver.
-   */
-  valueControlResolver?: ValueControlResolver;
-}
-declare function FilterBar({
-  registry,
-  initialState,
-  onChange,
-  advancedRulesEnabled,
-  singleUseFields,
-  size,
-  valueControlResolver
-}: FilterBarProps): _$react_jsx_runtime0.JSX.Element;
-//#endregion
-export { FilterBarProps as n, FilterBar as t };
-//# sourceMappingURL=FilterBar-YzOh02f9.d.cts.map

package/dist/FilterBar.d.cts

@@ -1,2 +0,0 @@
-import { n as FilterBarProps, t as FilterBar } from "./FilterBar-YzOh02f9.cjs";
-export { FilterBarProps, FilterBar as default };

package/dist/FloatingActionBar.d.cts

@@ -1,40 +0,0 @@
-import * as _$react_jsx_runtime0 from "react/jsx-runtime.js";
-
-//#region components/DataTable/FloatingActionBar.d.ts
-interface FloatingActionBarProps {
-  selectedCount: number;
-  onClearSelection: React.MouseEventHandler<HTMLButtonElement>;
-  extraContent?: React.ReactNode;
-  actions: ({
-    label: string;
-    variant?: 'basic' | 'primary' | 'inverse' | 'danger' | 'text' | 'outline';
-    popover?: {
-      options: {
-        label: string;
-        value: string;
-      }[];
-      onOptionSelect: (option: string) => void | Promise<void>;
-    };
-    onClick: () => void | Promise<void>;
-  } | {
-    'aria-label': string;
-    icon: React.ReactNode;
-    variant?: 'basic' | 'primary' | 'inverse' | 'danger' | 'text' | 'outline';
-    popover?: {
-      options: {
-        label: string;
-        value: string;
-      }[];
-      onOptionSelect: (option: string) => void | Promise<void>;
-    };
-    onClick: () => void | Promise<void>;
-  })[];
-}
-declare const FloatingActionBar: ({
-  selectedCount,
-  onClearSelection,
-  extraContent,
-  actions
-}: FloatingActionBarProps) => _$react_jsx_runtime0.JSX.Element;
-export = FloatingActionBar;
-//# sourceMappingURL=FloatingActionBar.d.cts.map

package/dist/FormControl-DFp_qcW1.d.cts

@@ -1,60 +0,0 @@
-import { t as ErrorProps } from "./ErrorProps-Dxqb4gw_.cjs";
-import * as _$react from "react";
-import { ComponentPropsWithoutRef, ReactNode } from "react";
-import * as _$styled_components0 from "styled-components";
-import * as _$react_jsx_runtime0 from "react/jsx-runtime.js";
-import { Root } from "@radix-ui/react-label";
-
-//#region components/FormControl/FormControl.d.ts
-type LabelSizes = 'md' | 'sm';
-interface FormLabelProps extends ComponentPropsWithoutRef<typeof Root> {
-  tooltip?: ReactNode;
-  size?: LabelSizes;
-  side?: 'top' | 'right' | 'bottom' | 'left';
-  labelTooltipZIndex?: number;
-}
-declare const FormLabel: ({
-  tooltip,
-  side,
-  size,
-  children,
-  labelTooltipZIndex,
-  ...props
-}: FormLabelProps) => _$react_jsx_runtime0.JSX.Element;
-/**
- * Used to target an input field within a FormControl.
- */
-declare const FormInputContainer: _$styled_components0.StyledComponent<"div", any, {}, never>;
-interface HelperTextProps extends ComponentPropsWithoutRef<'div'>, ErrorProps {}
-declare const HelperText: _$react.ForwardRefExoticComponent<HelperTextProps & _$react.RefAttributes<HTMLDivElement>>;
-declare const ErrorText: _$react.ForwardRefExoticComponent<Omit<_$react.DetailedHTMLProps<_$react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & _$react.RefAttributes<HTMLDivElement>>;
-declare const WarningText: _$react.ForwardRefExoticComponent<Omit<_$react.DetailedHTMLProps<_$react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & _$react.RefAttributes<HTMLDivElement>>;
-declare const Container: _$styled_components0.StyledComponent<"div", any, {
-  $configField?: boolean;
-  $hasRightActions?: boolean;
-  $configFieldInputWidth?: string;
-}, never>;
-interface FormControlBaseProps extends ErrorProps {
-  inputId?: string;
-  disabled?: boolean;
-  /**
-   * Whether to render the form field as a config field.
-   * This will remove the label and helper text.
-   */
-  configField?: boolean;
-  /**
-   * Whether the form field has right actions.
-   */
-  hasRightActions?: boolean;
-  /**
-   * Override the width of the form input container when `configField` is true.
-   * Accepts any valid CSS width value (e.g. `'33%'`, `'66.67%'`).
-   * Defaults to `'50%'`.
-   */
-  configFieldInputWidth?: string;
-}
-interface FormControlProps extends ComponentPropsWithoutRef<'div'>, FormControlBaseProps {}
-declare const FormControl: _$react.ForwardRefExoticComponent<FormControlProps & _$react.RefAttributes<HTMLDivElement>>;
-//#endregion
-export { FormControlProps as a, FormLabelProps as c, FormControlBaseProps as i, HelperText as l, ErrorText as n, FormInputContainer as o, FormControl as r, FormLabel as s, Container as t, WarningText as u };
-//# sourceMappingURL=FormControl-DFp_qcW1.d.cts.map

package/dist/FormControl-MkBXuUF6.cjs

@@ -1,212 +0,0 @@
-const require_chunk = require("./chunk-CKQMccvm.cjs");
-const require_Tooltip = require("./Tooltip-olP3rdUO.cjs");
-const require_useFormGroup = require("./useFormGroup-Bmnzgq0S.cjs");
-const require_useFormField = require("./useFormField-BZlArnsI.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 lodash_fp_uniqueId_js = require("lodash/fp/uniqueId.js");
-lodash_fp_uniqueId_js = require_chunk.__toESM(lodash_fp_uniqueId_js);
-let _radix_ui_react_label = require("@radix-ui/react-label");
-//#region components/FormControl/FormControl.tsx
-const LabelBase = (0, styled_components.default)(_radix_ui_react_label.Root)`
-  ${({ $size }) => {
-	switch ($size) {
-		default:
-		case "md": return styled_components.css`
-          ${_persona_design_tokens.Typography.TextMedium};
-        `;
-		case "sm": return styled_components.css`
-          ${_persona_design_tokens.Typography.TextSmall};
-        `;
-	}
-}}
-
-  color: ${({ theme }) => theme.color.text.primary};
-`;
-const FormLabel = ({ tooltip, side, size, children, labelTooltipZIndex, ...props }) => {
-	const field = require_useFormField.useFormField({ labelId: props.id });
-	const formGroup = require_useFormGroup.useFormGroup();
-	const labelProps = {
-		id: field.labelId,
-		htmlFor: field.inputId,
-		...props
-	};
-	const effectivelabelTooltipZIndex = labelTooltipZIndex ?? formGroup.labelTooltipZIndex;
-	if (tooltip) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Tooltip.Tooltip, {
-		size,
-		trigger: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LabelBase, {
-			...labelProps,
-			$size: size,
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Tooltip.TextWithDashedUnderline, { children })
-		}),
-		side,
-		...effectivelabelTooltipZIndex != null && { zIndex: effectivelabelTooltipZIndex },
-		children: tooltip
-	});
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LabelBase, {
-		...labelProps,
-		$size: size,
-		children
-	});
-};
-/**
-* Used to target an input field within a FormControl.
-*/
-const FormInputContainer = styled_components.default.div``;
-const HelperTextBase = styled_components.default.div`
-  ${_persona_design_tokens.Typography.TextSmall};
-  line-height: 1;
-  color: ${({ theme, hasWarning, hasError }) => hasError ? theme.color.variants.danger.default : hasWarning ? _persona_design_tokens.Color.CoreOrange900 : theme.color.text.secondary};
-`;
-const HelperText = (0, react.forwardRef)(function HelperText(props, ref) {
-	const field = require_useFormField.useFormField({ helperTextId: props.id });
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(HelperTextBase, {
-		hasError: field.hasError,
-		hasWarning: field.hasWarning,
-		id: field.helperTextId,
-		ref,
-		...props
-	});
-});
-const ErrorText = (0, react.forwardRef)(function ErrorText(props, ref) {
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(HelperTextBase, {
-		hasError: true,
-		id: require_useFormField.useFormField({ errorTextId: props.id }).errorTextId,
-		ref,
-		...props
-	});
-});
-const WarningText = (0, react.forwardRef)(function WarningText(props, ref) {
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(HelperTextBase, {
-		hasWarning: true,
-		id: require_useFormField.useFormField({ warningTextId: props.id }).warningTextId,
-		ref,
-		...props
-	});
-});
-const Container = styled_components.default.div`
-  display: flex;
-  ${({ $configField, $hasRightActions, $configFieldInputWidth }) => $configField ? $hasRightActions ? styled_components.css`
-            flex-direction: column;
-          ` : styled_components.css`
-            flex-direction: row;
-            align-items: center;
-            justify-content: space-between;
-            gap: ${_persona_design_tokens.Spacing[4]};
-            min-width: 288px;
-
-            > ${FormInputContainer} {
-              display: flex;
-              flex-direction: row-reverse;
-              width: ${$configFieldInputWidth ?? "50%"};
-              min-width: 180px;
-            }
-
-            &:has(textarea) {
-              flex-direction: column;
-              align-items: flex-start;
-              gap: ${_persona_design_tokens.Spacing[1]};
-
-              > ${FormInputContainer} {
-                width: 100%;
-              }
-            }
-          ` : styled_components.css`
-          flex-direction: column;
-          margin-bottom: ${_persona_design_tokens.Spacing[3]};
-        `}
-
-  > *:not(:first-child) {
-    margin-top: ${({ $configField, $hasRightActions }) => $hasRightActions ? _persona_design_tokens.Spacing[1] : $configField ? _persona_design_tokens.Spacing[0] : _persona_design_tokens.Spacing[2]};
-  }
-
-  > ${HelperTextBase} {
-    margin-top: ${_persona_design_tokens.Spacing[1]};
-  }
-`;
-const FormControl = (0, react.forwardRef)(function FormControl({ children, hasError, hasWarning, inputId, disabled, configField, hasRightActions, configFieldInputWidth, ...props }, ref) {
-	const generatedId = (0, react.useMemo)(() => (0, lodash_fp_uniqueId_js.default)("pds_form_control__"), []);
-	const initFormField = {
-		hasError,
-		hasWarning,
-		disabled,
-		inputId: inputId ?? generatedId,
-		configField
-	};
-	react.Children.map(children, (child) => {
-		if ((0, react.isValidElement)(child)) switch (child.type) {
-			case FormLabel:
-				initFormField.labelId = child.props.id ?? `${initFormField.inputId}-label`;
-				break;
-			case HelperText:
-				initFormField.helperTextId = child.props.id ?? `${initFormField.inputId}-help-text`;
-				break;
-			case ErrorText:
-				initFormField.errorTextId = child.props.id ?? `${initFormField.inputId}-error-text`;
-				break;
-			case WarningText:
-				initFormField.warningTextId = child.props.id ?? `${initFormField.inputId}-warning-text`;
-				break;
-		}
-	});
-	const field = require_useFormField.useFormField(initFormField);
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_useFormField.FormControlContext.Provider, {
-		value: field,
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Container, {
-			ref,
-			$configField: field.configField,
-			$hasRightActions: hasRightActions,
-			$configFieldInputWidth: configFieldInputWidth,
-			...props,
-			children
-		})
-	});
-});
-//#endregion
-Object.defineProperty(exports, "Container", {
-	enumerable: true,
-	get: function() {
-		return Container;
-	}
-});
-Object.defineProperty(exports, "ErrorText", {
-	enumerable: true,
-	get: function() {
-		return ErrorText;
-	}
-});
-Object.defineProperty(exports, "FormControl", {
-	enumerable: true,
-	get: function() {
-		return FormControl;
-	}
-});
-Object.defineProperty(exports, "FormInputContainer", {
-	enumerable: true,
-	get: function() {
-		return FormInputContainer;
-	}
-});
-Object.defineProperty(exports, "FormLabel", {
-	enumerable: true,
-	get: function() {
-		return FormLabel;
-	}
-});
-Object.defineProperty(exports, "HelperText", {
-	enumerable: true,
-	get: function() {
-		return HelperText;
-	}
-});
-Object.defineProperty(exports, "WarningText", {
-	enumerable: true,
-	get: function() {
-		return WarningText;
-	}
-});
-
-//# sourceMappingURL=FormControl-MkBXuUF6.cjs.map

package/dist/FormControl-MkBXuUF6.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"FormControl-MkBXuUF6.cjs","names":["Root","Typography","useFormField","useFormGroup","Tooltip","TextWithDashedUnderline","Color","Spacing","FormControlContext"],"sources":["../components/FormControl/FormControl.tsx"],"sourcesContent":["import { Root } from '@radix-ui/react-label';\nimport uniqueId from 'lodash/fp/uniqueId';\nimport {\n  Children,\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  isValidElement,\n  type ReactNode,\n  useMemo,\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { Color, Spacing, Typography } from '@persona/design-tokens';\nimport useFormGroup from 'design-system/components/ConfigFormGroup/useFormGroup';\nimport useFormField, {\n  FormControlContext,\n  type FormControlContextProps,\n} from 'design-system/components/FormControl/useFormField';\nimport Tooltip, { TextWithDashedUnderline } from 'design-system/components/Tooltip';\nimport type ErrorProps from 'design-system/types/ErrorProps';\n\ntype LabelSizes = 'md' | 'sm';\n\ninterface StyledLabelProps {\n  $size?: LabelSizes;\n}\n\nconst LabelBase = styled(Root)<StyledLabelProps>`\n  ${({ $size }) => {\n    switch ($size) {\n      default:\n      case 'md':\n        return css`\n          ${Typography.TextMedium};\n        `;\n      case 'sm':\n        return css`\n          ${Typography.TextSmall};\n        `;\n    }\n  }}\n\n  color: ${({ theme }) => theme.color.text.primary};\n`;\n\nexport interface FormLabelProps extends ComponentPropsWithoutRef<typeof Root> {\n  tooltip?: ReactNode;\n  size?: LabelSizes;\n  side?: 'top' | 'right' | 'bottom' | 'left';\n  labelTooltipZIndex?: number;\n}\n\nexport const FormLabel = ({\n  tooltip,\n  side,\n  size,\n  children,\n  labelTooltipZIndex,\n  ...props\n}: FormLabelProps) => {\n  const field = useFormField({ labelId: props.id });\n  const formGroup = useFormGroup();\n  const labelProps = {\n    id: field.labelId,\n    htmlFor: field.inputId,\n    ...props,\n  };\n\n  // Use labelTooltipZIndex from props, then from form group context\n  const effectivelabelTooltipZIndex = labelTooltipZIndex ?? formGroup.labelTooltipZIndex;\n\n  if (tooltip) {\n    return (\n      <Tooltip\n        size={size}\n        trigger={\n          <LabelBase {...labelProps} $size={size}>\n            <TextWithDashedUnderline>{children}</TextWithDashedUnderline>\n          </LabelBase>\n        }\n        side={side}\n        {...(effectivelabelTooltipZIndex != null && { zIndex: effectivelabelTooltipZIndex })}\n      >\n        {tooltip}\n      </Tooltip>\n    );\n  }\n\n  return (\n    <LabelBase {...labelProps} $size={size}>\n      {children}\n    </LabelBase>\n  );\n};\n\n/**\n * Used to target an input field within a FormControl.\n */\nexport const FormInputContainer = styled.div``;\n\nconst HelperTextBase = styled.div<ErrorProps>`\n  ${Typography.TextSmall};\n  line-height: 1;\n  color: ${({ theme, hasWarning, hasError }) =>\n    hasError\n      ? theme.color.variants.danger.default\n      : hasWarning\n        ? Color.CoreOrange900\n        : theme.color.text.secondary};\n`;\n\ninterface HelperTextProps extends ComponentPropsWithoutRef<'div'>, ErrorProps {}\n\nexport const HelperText = forwardRef<HTMLDivElement, HelperTextProps>(\n  function HelperText(props, ref) {\n    const field = useFormField({ helperTextId: props.id });\n    return (\n      <HelperTextBase\n        hasError={field.hasError}\n        hasWarning={field.hasWarning}\n        id={field.helperTextId}\n        ref={ref}\n        {...props}\n      />\n    );\n  },\n);\n\nexport const ErrorText = forwardRef<HTMLDivElement, React.ComponentPropsWithoutRef<'div'>>(\n  function ErrorText(props, ref) {\n    const field = useFormField({ errorTextId: props.id });\n    return <HelperTextBase hasError id={field.errorTextId} ref={ref} {...props} />;\n  },\n);\n\nexport const WarningText = forwardRef<HTMLDivElement, React.ComponentPropsWithoutRef<'div'>>(\n  function WarningText(props, ref) {\n    const field = useFormField({ warningTextId: props.id });\n    return <HelperTextBase hasWarning id={field.warningTextId} ref={ref} {...props} />;\n  },\n);\n\nexport const Container = styled.div<{\n  $configField?: boolean;\n  $hasRightActions?: boolean;\n  $configFieldInputWidth?: string;\n}>`\n  display: flex;\n  ${({ $configField, $hasRightActions, $configFieldInputWidth }) =>\n    $configField\n      ? $hasRightActions\n        ? css`\n            flex-direction: column;\n          `\n        : css`\n            flex-direction: row;\n            align-items: center;\n            justify-content: space-between;\n            gap: ${Spacing[4]};\n            min-width: 288px;\n\n            > ${FormInputContainer} {\n              display: flex;\n              flex-direction: row-reverse;\n              width: ${$configFieldInputWidth ?? '50%'};\n              min-width: 180px;\n            }\n\n            &:has(textarea) {\n              flex-direction: column;\n              align-items: flex-start;\n              gap: ${Spacing[1]};\n\n              > ${FormInputContainer} {\n                width: 100%;\n              }\n            }\n          `\n      : css`\n          flex-direction: column;\n          margin-bottom: ${Spacing[3]};\n        `}\n\n  > *:not(:first-child) {\n    margin-top: ${({ $configField, $hasRightActions }) =>\n      $hasRightActions ? Spacing[1] : $configField ? Spacing[0] : Spacing[2]};\n  }\n\n  > ${HelperTextBase} {\n    margin-top: ${Spacing[1]};\n  }\n`;\n\nexport interface FormControlBaseProps extends ErrorProps {\n  inputId?: string;\n  disabled?: boolean;\n  /**\n   * Whether to render the form field as a config field.\n   * This will remove the label and helper text.\n   */\n  configField?: boolean;\n  /**\n   * Whether the form field has right actions.\n   */\n  hasRightActions?: boolean;\n  /**\n   * Override the width of the form input container when `configField` is true.\n   * Accepts any valid CSS width value (e.g. `'33%'`, `'66.67%'`).\n   * Defaults to `'50%'`.\n   */\n  configFieldInputWidth?: string;\n}\n\nexport interface FormControlProps extends ComponentPropsWithoutRef<'div'>, FormControlBaseProps {}\n\nexport const FormControl = forwardRef<HTMLDivElement, FormControlProps>(function FormControl(\n  {\n    children,\n    hasError,\n    hasWarning,\n    inputId,\n    disabled,\n    configField,\n    hasRightActions,\n    configFieldInputWidth,\n    ...props\n  }: FormControlProps,\n  ref,\n) {\n  const generatedId = useMemo(() => uniqueId('pds_form_control__'), []);\n\n  const initFormField: FormControlContextProps = {\n    hasError,\n    hasWarning,\n    disabled,\n    inputId: inputId ?? generatedId,\n    configField,\n  };\n\n  Children.map(children, (child: ReactNode) => {\n    if (isValidElement(child)) {\n      switch (child.type) {\n        case FormLabel: {\n          initFormField.labelId = child.props.id ?? `${initFormField.inputId}-label`;\n          break;\n        }\n        case HelperText: {\n          initFormField.helperTextId = child.props.id ?? `${initFormField.inputId}-help-text`;\n          break;\n        }\n        case ErrorText: {\n          initFormField.errorTextId = child.props.id ?? `${initFormField.inputId}-error-text`;\n          break;\n        }\n        case WarningText: {\n          initFormField.warningTextId = child.props.id ?? `${initFormField.inputId}-warning-text`;\n          break;\n        }\n      }\n    }\n  });\n\n  const field = useFormField(initFormField);\n\n  return (\n    <FormControlContext.Provider value={field}>\n      <Container\n        ref={ref}\n        $configField={field.configField}\n        $hasRightActions={hasRightActions}\n        $configFieldInputWidth={configFieldInputWidth}\n        {...props}\n      >\n        {children}\n      </Container>\n    </FormControlContext.Provider>\n  );\n});\n\nexport default FormControl;\n"],"mappings":"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"}

package/dist/FormControl.d.cts

@@ -1,2 +0,0 @@
-import { a as FormControlProps, c as FormLabelProps, i as FormControlBaseProps, l as HelperText, n as ErrorText, o as FormInputContainer, r as FormControl, s as FormLabel, t as Container, u as WarningText } from "./FormControl-DFp_qcW1.cjs";
-export { Container, ErrorText, FormControl, FormControl as default, FormControlBaseProps, FormControlProps, FormInputContainer, FormLabel, FormLabelProps, HelperText, WarningText };