Skip to content

Commit

Permalink
chore: remove defaults from stories
Browse files Browse the repository at this point in the history
  • Loading branch information
@edburyenegren-okta
edburyenegren-okta committed Mar 29, 2023
1 parent a3a521c commit b80ddd3
Show file tree
Hide file tree
Showing 2 changed files with 0 additions and 240 deletions.
125 changes: 0 additions & 125 deletions ...ages/odyssey-storybook/src/components/odyssey-mui/Autocomplete/Autocomplete.mdx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,71 +14,6 @@ Examples of MUI's variant behaviors to help us decide and style our own offering

Note, some of these behaviors may currently be broken or have unsuitable UI.

### autoHighlight

If `true`, the first option is automatically highlighted.

Default: `true`

<Canvas>
<Story id="mui-components-forms-autocomplete--auto-highlight" />
</Canvas>

### autoSelect

If `true`, the selected option becomes the value of the input when the Autocomplete loses focus unless the user chooses a different option or changes the character string in the input.

Default: `false`

<Canvas>
<Story id="mui-components-forms-autocomplete--auto-select" />
</Canvas>

### blurOnSelect

Control if the input should be blurred when an option is selected:

- `false` the input is not blurred.
- `true` the input is always blurred.
- `touch` the input is blurred after a touch event.
- `mouse` the input is blurred after a mouse event.

Default: `false`

<Canvas>
<Story id="mui-components-forms-autocomplete--blur-on-select" />
</Canvas>

### clearOnBlur

If `true`, the input's text is cleared on blur if no value is selected. Set to `true` if you want to help the user enter a new value. Set to `false` if you want to help the user resume their search.

Default: `!props.freeSolo`

<Canvas>
<Story id="mui-components-forms-autocomplete--clear-on-blur" />
</Canvas>

### clearOnEscape

If `true`, clear all values when the user presses escape _and_ the popup is closed.

Default: `true`

<Canvas>
<Story id="mui-components-forms-autocomplete--clear-on-escape" />
</Canvas>

### disableCloseOnSelect

If `true`, the popup won't close when a value is selected.

Default: `props.multiple`

<Canvas>
<Story id="mui-components-forms-autocomplete--disable-close-on-select" />
</Canvas>

### disabled

If `true`, the component is disabled.
Expand All @@ -89,16 +24,6 @@ Default: `false`
<Story id="mui-components-forms-autocomplete--disabled" />
</Canvas>

### fitlerSelectedOptions

If `true`, hide the selected options from the list box.

Default: `false`

<Canvas>
<Story id="mui-components-forms-autocomplete--filter-selected-options" />
</Canvas>

### freeSolo

If `true`, the Autocomplete is free solo, meaning that the user input is not bound to provided options.
Expand All @@ -109,26 +34,6 @@ Default: `false`
<Story id="mui-components-forms-autocomplete--free-solo" />
</Canvas>

### fullWidth

If `true`, the input will take up the full width of its container.

Default: `false`

<Canvas>
<Story id="mui-components-forms-autocomplete--full-width" />
</Canvas>

### handleHomeEndKeys

If `true`, the component handles the <kbd>Home</kbd> and <kbd>End</kbd> keys when the popup is open. It should move focus to the first option and last option, respectively.

Default: `true`

<Canvas>
<Story id="mui-components-forms-autocomplete--handle-home-end-keys" />
</Canvas>

### includeInputInList

If `true`, the highlight can move to the input.
Expand All @@ -139,16 +44,6 @@ Default: `false`
<Story id="mui-components-forms-autocomplete--include-input-in-list" />
</Canvas>

### limitTags

The maximum number of tags that will be visible when not focused. Set `-1` to disable the limit.

Default: `-1`

<Canvas>
<Story id="mui-components-forms-autocomplete--limit-tags" />
</Canvas>

### loading

If `true`, the component is in a loading state. This shows the `loadingText` in place of suggestions (only if there are no suggestions to show, e.g. options are empty).
Expand All @@ -169,16 +64,6 @@ Default: `false`
<Story id="mui-components-forms-autocomplete--multiple" />
</Canvas>

### openOnFocus

If `true`, the popup will open on input focus.

Default: `false`

<Canvas>
<Story id="mui-components-forms-autocomplete--open-on-focus" />
</Canvas>

### readOnly

If `true`, the component becomes readonly. It is also supported for multiple tags where the tag cannot be deleted.
Expand All @@ -189,16 +74,6 @@ Default: `false`
<Story id="mui-components-forms-autocomplete--read-only" />
</Canvas>

### selectOnFocus

If `true`, the input's text is selected on focus. It helps the user clear the selected value.

Default: `true`

<Canvas>
<Story id="mui-components-forms-autocomplete--select-on-focus" />
</Canvas>

## MUI TextField

For testing props/behaviors in their default MUI environment.
Expand Down
115 changes: 0 additions & 115 deletions packages/odyssey-storybook/src/components/odyssey-mui/Autocomplete/Autocomplete.stories.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,64 +25,18 @@ const storybookMeta: ComponentMeta<typeof Autocomplete> = {
},
},
argTypes: {
// autoComplete appears to be broken in both examples
autoComplete: {
control: "boolean",
defaultValue: false,
},
autoHighlight: {
control: "boolean",
defaultValue: true,
},
autoSelect: {
control: "boolean",
defaultValue: false,
},
blurOnSelect: {
control: "radio",
options: [true, false, "mouse", "touch"],
defaultValue: false,
},
clearOnBlur: {
control: "boolean",
defaultValue: false,
},
clearOnEscape: {
control: "boolean",
defaultValue: true,
},
disableCloseOnSelect: {
control: "boolean",
defaultValue: false,
},
disabled: {
control: "boolean",
defaultValue: false,
},
filterSelectedOptions: {
control: "boolean",
defaultValue: false,
},
freeSolo: {
control: "boolean",
defaultValue: false,
},
fullWidth: {
control: "boolean",
defaultValue: false,
},
handleHomeEndKeys: {
control: "boolean",
defaultValue: true,
},
includeInputInList: {
control: "boolean",
defaultValue: false,
},
limitTags: {
control: "text",
defaultValue: "-1",
},
loading: {
control: "boolean",
defaultValue: false,
Expand All @@ -91,18 +45,10 @@ const storybookMeta: ComponentMeta<typeof Autocomplete> = {
control: "boolean",
defaultValue: false,
},
openOnFocus: {
control: "boolean",
defaultValue: false,
},
readOnly: {
control: "boolean",
defaultValue: false,
},
selectOnFocus: {
control: "boolean",
defaultValue: true,
},
},
decorators: [MuiThemeDecorator],
};
Expand Down Expand Up @@ -289,73 +235,22 @@ const MuiTemplate: ComponentStory<typeof Autocomplete> = (args) => {
export const Default = Template.bind({});
Default.args = {};

export const autoHighlight = Template.bind({});
autoHighlight.args = {
autoHighlight: true,
};

export const autoSelect = Template.bind({});
autoSelect.args = {
autoSelect: true,
};

export const blurOnSelect = Template.bind({});
blurOnSelect.args = {
blurOnSelect: true,
};

export const clearOnBlur = Template.bind({});
clearOnBlur.args = {
clearOnBlur: true,
};

export const clearOnEscape = Template.bind({});
clearOnEscape.args = {
clearOnEscape: true,
};

export const disableCloseOnSelect = Template.bind({});
disableCloseOnSelect.args = {
disableCloseOnSelect: true,
};

export const disabled = Template.bind({});
disabled.args = {
disabled: true,
value: "The Godfather",
};

export const filterSelectedOptions = Template.bind({});
filterSelectedOptions.args = {
filterSelectedOptions: true,
};

export const freeSolo = Template.bind({});
freeSolo.args = {
freeSolo: true,
};

export const fullWidth = Template.bind({});
fullWidth.args = {
fullWidth: true,
};

export const handleHomeEndKeys = Template.bind({});
handleHomeEndKeys.args = {
handleHomeEndKeys: true,
};

export const includeInputInList = Template.bind({});
includeInputInList.args = {
includeInputInList: true,
};

export const limitTags = Template.bind({});
limitTags.args = {
limitTags: 3,
multiple: true,
};

export const loading = EmptyTemplate.bind({});
loading.args = {
loading: true,
Expand All @@ -366,22 +261,12 @@ multiple.args = {
multiple: true,
};

export const openOnFocus = Template.bind({});
openOnFocus.args = {
openOnFocus: true,
};

export const readOnly = Template.bind({});
readOnly.args = {
readOnly: true,
value: "The Godfather",
};

export const selectOnFocus = Template.bind({});
selectOnFocus.args = {
selectOnFocus: true,
};

export const MaterialSingle = MuiTemplate.bind({});
MaterialSingle.args = {};

Expand Down

0 comments on commit b80ddd3

Please sign in to comment.