Skip to content

Commit

Permalink
Feedback
Browse files Browse the repository at this point in the history
  • Loading branch information
@m-akinc
m-akinc committed Mar 13, 2024
1 parent f1171a6 commit 32dce4b
Show file tree
Hide file tree
Showing 8 changed files with 214 additions and 73 deletions.
24 changes: 15 additions & 9 deletions packages/nimble-components/src/anchor-button/tests/anchor-button-matrix.stories.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,9 @@ import {
disabledStates,
DisabledState,
InteractionState,
interactionStates
interactionStates,
nonInteractionStates,
disabledInteractionsFilter
} from '../../utilities/tests/states';
import { createStory } from '../../utilities/tests/storybook';
import { hiddenWrapper } from '../../utilities/tests/hidden';
Expand Down Expand Up @@ -76,7 +78,7 @@ const component = (

export const anchorButtonThemeMatrix: StoryFn = createMatrixThemeStory(
createMatrix(component, [
interactionStates.slice(0, 1),
nonInteractionStates,
disabledStates,
appearanceStates,
appearanceVariantStates,
Expand All @@ -85,13 +87,17 @@ export const anchorButtonThemeMatrix: StoryFn = createMatrixThemeStory(
);

export const anchorButtonInteractionsThemeMatrix: StoryFn = createMatrixThemeStory(
createMatrix(component, [
interactionStates.slice(1),
disabledStates,
appearanceStates,
appearanceVariantStates,
[[false, true, false]]
])
createMatrix(
component,
[
interactionStates,
disabledStates,
appearanceStates,
appearanceVariantStates,
[[false, true, false]]
],
disabledInteractionsFilter
)
);

export const hiddenAnchorButton: StoryFn = createStory(
Expand Down
28 changes: 20 additions & 8 deletions packages/nimble-components/src/anchor/tests/anchor-matrix.stories.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,9 @@ import { bodyFont } from '../../theme-provider/design-tokens';
import { anchorTag } from '..';
import {
interactionStates,
type InteractionState
nonInteractionStates,
type InteractionState,
disabledInteractionsFilter

Check failure on line 19 in packages/nimble-components/src/anchor/tests/anchor-matrix.stories.ts

View workflow job for this annotation

GitHub Actions / build 

'disabledInteractionsFilter' is defined but never used

Check failure on line 19 in packages/nimble-components/src/anchor/tests/anchor-matrix.stories.ts

View workflow job for this annotation

GitHub Actions / build 

'disabledInteractionsFilter' is defined but never used
} from '../../utilities/tests/states';

const metadata: Meta = {
Expand Down Expand Up @@ -61,20 +63,30 @@ const component = (

export const anchorThemeMatrix: StoryFn = createMatrixThemeStory(
createMatrix(component, [
interactionStates.slice(0, 1),
nonInteractionStates,
disabledStates,
underlineHiddenStates,
appearanceStates
])
);

export const anchorInteractionsThemeMatrix: StoryFn = createMatrixThemeStory(
createMatrix(component, [
interactionStates.slice(1),
disabledStates,
underlineHiddenStates,
appearanceStates
])
createMatrix(
component,
[
interactionStates,
disabledStates,
underlineHiddenStates,
appearanceStates
],
// A custom DisabledState type is used in this file, so we can't use the shared disabledInteractionsFilter
(interactionState: InteractionState, disabledState: DisabledState) => {
return (
disabledState[0] !== 'Disabled'
|| interactionState[0] === 'Hovered'
);
}
)
);

export const hiddenAnchor: StoryFn = createStory(
Expand Down
24 changes: 15 additions & 9 deletions packages/nimble-components/src/button/tests/button-matrix.stories.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,9 @@ import {
disabledStates,
DisabledState,
InteractionState,
interactionStates
interactionStates,
nonInteractionStates,
disabledInteractionsFilter
} from '../../utilities/tests/states';
import { createStory } from '../../utilities/tests/storybook';
import { hiddenWrapper } from '../../utilities/tests/hidden';
Expand Down Expand Up @@ -73,7 +75,7 @@ const component = (

export const buttonThemeMatrix: StoryFn = createMatrixThemeStory(
createMatrix(component, [
interactionStates.slice(0, 1),
nonInteractionStates,
disabledStates,
appearanceStates,
appearanceVariantStates,
Expand All @@ -82,13 +84,17 @@ export const buttonThemeMatrix: StoryFn = createMatrixThemeStory(
);

export const buttonInteractionsThemeMatrix: StoryFn = createMatrixThemeStory(
createMatrix(component, [
interactionStates.slice(1),
disabledStates,
appearanceStates,
appearanceVariantStates,
[[false, true, false]]
])
createMatrix(
component,
[
interactionStates,
disabledStates,
appearanceStates,
appearanceVariantStates,
[[false, true, false]]
],
disabledInteractionsFilter
)
);

export const hiddenButton: StoryFn = createStory(
Expand Down
59 changes: 44 additions & 15 deletions packages/nimble-components/src/menu-button/tests/menu-button-matrix.stories.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,9 @@ import {
disabledStates,
DisabledState,
InteractionState,
interactionStates
interactionStates,
nonInteractionStates,
disabledInteractionsFilter
} from '../../utilities/tests/states';
import { createStory } from '../../utilities/tests/storybook';
import { hiddenWrapper } from '../../utilities/tests/hidden';
Expand Down Expand Up @@ -71,23 +73,50 @@ const component = (
`;

export const menuButtonThemeMatrix: StoryFn = createMatrixThemeStory(
createMatrix(component, [
interactionStates.slice(0, 1),
partVisibilityStates,
openStates,
disabledStates,
appearanceStates
])
createMatrix(
component,
[
nonInteractionStates,
partVisibilityStates,
openStates,
disabledStates,
appearanceStates
],
// Disabled and open is not a valid state
(
_interactionState: InteractionState,
_partVisibilityState: PartVisibilityState,
openState: OpenState,
disabledState: DisabledState
) => {
return disabledState[0] !== 'Disabled' || openState[0] !== 'Open';
}
)
);

export const menuButtonInteractionsThemeMatrix: StoryFn = createMatrixThemeStory(
createMatrix(component, [
interactionStates.slice(1),
[[false, true, false]],
openStates,
disabledStates,
appearanceStates
])
createMatrix(
component,
[
interactionStates,
[[false, true, false]],
openStates,
disabledStates,
appearanceStates
],
// Only interaction relevant to disabled controls is hover
(
interactionState: InteractionState,
_partVisibilityState: PartVisibilityState,
_openState: OpenState,
disabledState: DisabledState
) => {
return disabledInteractionsFilter(
interactionState,
disabledState
);
}
)
);

export const hiddenMenuButton: StoryFn = createStory(
Expand Down
26 changes: 16 additions & 10 deletions packages/nimble-components/src/number-field/tests/number-field-matrix.stories.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,9 @@ import {
errorStates,
ErrorState,
InteractionState,
interactionStates
interactionStates,
nonInteractionStates,
disabledInteractionsFilter
} from '../../utilities/tests/states';
import { hiddenWrapper } from '../../utilities/tests/hidden';
import { NumberFieldAppearance } from '../types';
Expand Down Expand Up @@ -71,7 +73,7 @@ const component = (

export const numberFieldThemeMatrix: StoryFn = createMatrixThemeStory(
createMatrix(component, [
interactionStates.slice(0, 1),
nonInteractionStates,
disabledStates,
hideStepStates,
valueStates,
Expand All @@ -81,14 +83,18 @@ export const numberFieldThemeMatrix: StoryFn = createMatrixThemeStory(
);

export const numberFieldInteractionsThemeMatrix: StoryFn = createMatrixThemeStory(
createMatrix(component, [
interactionStates.filter(x => x[0] && !x[0].includes('Active')),
disabledStates,
hideStepStates.slice(0, 1),
valueStates.slice(1, 2),
errorStates.slice(0, 2),
appearanceStates
])
createMatrix(
component,
[
interactionStates.filter(x => !x[0].includes('Active')), // skip irrelevant active states
disabledStates,
hideStepStates.filter(x => x[0] !== 'Hide Step'), // always show inc/dec buttons
valueStates.filter(x => x[0] !== 'Placeholder'), // don't test placeholder text
errorStates.filter(x => x[0] !== 'Error No Message'), // don't test error state w/o error text
appearanceStates
],
disabledInteractionsFilter
)
);

export const hiddenNumberField: StoryFn = createStory(
Expand Down
35 changes: 26 additions & 9 deletions packages/nimble-components/src/toggle-button/tests/toggle-button-matrix.stories.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,9 @@ import {
disabledStates,
DisabledState,
InteractionState,
interactionStates
interactionStates,
nonInteractionStates,
disabledInteractionsFilter
} from '../../utilities/tests/states';
import { createStory } from '../../utilities/tests/storybook';
import { hiddenWrapper } from '../../utilities/tests/hidden';
Expand Down Expand Up @@ -73,7 +75,7 @@ const component = (

export const toggleButtonThemeMatrix: StoryFn = createMatrixThemeStory(
createMatrix(component, [
interactionStates.slice(0, 1),
nonInteractionStates,
partVisibilityStates,
checkedStates,
disabledStates,
Expand All @@ -82,13 +84,28 @@ export const toggleButtonThemeMatrix: StoryFn = createMatrixThemeStory(
);

export const toggleButtonInteractionsThemeMatrix: StoryFn = createMatrixThemeStory(
createMatrix(component, [
interactionStates.filter(x => x[0] && !x[0].includes('Active')),
[[false, true, false]],
checkedStates,
disabledStates,
appearanceStates
])
createMatrix(
component,
[
interactionStates,
[[false, true, false]],
checkedStates,
disabledStates,
appearanceStates
],
// Only interaction relevant to disabled controls is hover
(
interactionState: InteractionState,
_partVisibilityState: PartVisibilityState,
_checkedState: CheckedState,
disabledState: DisabledState
) => {
return disabledInteractionsFilter(
interactionState,
disabledState
);
}
)
);

export const hiddenButton: StoryFn = createStory(
Expand Down
Loading

0 comments on commit 32dce4b

Please sign in to comment.