From 46619ea955296d3aa22449ce31ee190f839c8bf1 Mon Sep 17 00:00:00 2001 From: Alex Kessaris Date: Wed, 26 Jul 2023 13:27:05 -0400 Subject: [PATCH] break up progress bar types using discriminating unions --- src/progress-bar/interfaces.ts | 59 +++++++++++++++++++++------------- 1 file changed, 36 insertions(+), 23 deletions(-) diff --git a/src/progress-bar/interfaces.ts b/src/progress-bar/interfaces.ts index ee9ad00826..28e9919bb5 100644 --- a/src/progress-bar/interfaces.ts +++ b/src/progress-bar/interfaces.ts @@ -3,34 +3,12 @@ import { BaseComponentProps } from '../internal/base-component'; import { NonCancelableEventHandler } from '../internal/events'; -export interface ProgressBarProps extends BaseComponentProps { +interface BaseProgressBarProps extends BaseComponentProps { /** * Indicates the current progress as a percentage. The value must be between 0 and 100. Decimals are rounded. */ value?: number; - /** - * Specifies the progress type. - * - * @defaultValue 'percentage' - */ - type?: ProgressBarProps.ContentType; - - /** - * Specifies the maximum value of the progress when type ratio is selected. - * - * @defaultValue 100 - */ - maxValue?: number; - - /** - * Control localization of the progress bar value. - * - * @defaultValue If type === `percentage`, `${value}%` - * @defaultValue If type === `ratio`, `${value} of ${maxValue}` - */ - ariaValueText?: string; - /** * Specifies the status of the progress bar. You can set it to one of the following: * @@ -91,6 +69,41 @@ export interface ProgressBarProps extends BaseComponentProps { onResultButtonClick?: NonCancelableEventHandler; } +interface PercentageProgressBarProps extends BaseProgressBarProps { + /** + * Specifies the progress type. + * + * @defaultValue 'percentage' + */ + type?: 'percentage'; +} + +interface RatioProgressBarProps extends BaseProgressBarProps { + /** + * Specifies the progress type. + * + * @defaultValue 'percentage' + */ + type: 'ratio'; + + /** + * Specifies the maximum value of the progress when type ratio is selected. + * + * @defaultValue 100 + */ + maxValue?: number; + + /** + * Control localization of the progress bar value. + * + * @defaultValue If type === `percentage`, `${value}%` + * @defaultValue If type === `ratio`, `${value} of ${maxValue}` + */ + ariaValueText?: string; +} + +export type ProgressBarProps = PercentageProgressBarProps | RatioProgressBarProps; + export namespace ProgressBarProps { export type Status = 'in-progress' | 'success' | 'error'; export type Variant = 'standalone' | 'flash' | 'key-value';