/**
 * Mode of a list-style component.
 *
 * - `'standalone'` — the component renders as its own page (route loads it
 *   directly). Needs full page padding.
 * - `'embed'` — the component is nested inside another detail/form container
 *   that already provides spacing. Horizontal padding would double-indent.
 */
export type ListContainerMode = 'standalone' | 'embed';

/**
 * Resolves the Tailwind class string for a list-style component's outer
 * container, accounting for standalone vs embed mode. Centralizes the
 * convention so any list component (current or future) can opt into the
 * same spacing rules.
 *
 * @example
 * // No mode input (always standalone)
 * protected readonly containerClass = listContainerClass('standalone');
 *
 * @example
 * // Mode-aware (component has a `mode` input)
 * protected readonly containerClass = computed(() =>
 *   listContainerClass(this.mode()),
 * );
 */
export function listContainerClass(mode: ListContainerMode): string {
  return mode === 'standalone' ? 'space-y-3 px-4 pt-2 pb-6 sm:px-6' : 'space-y-3 pb-6';
}
