Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(steps/tabs): remove prop destroyOnHide #1138

Merged
merged 3 commits into from
Jan 30, 2025
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 0 additions & 1 deletion packages/docs/components/Steps.md
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,6 @@ sidebarDepth: 2
| animation | Transition animation name | [string, string, string, string] \| [string, string] | `[next`, `prev]`, `[right`, `left`, `down`, `up]` | <div><small>From <b>config</b>:</small></div><code style='white-space: nowrap; padding: 0;'>steps: {<br>&nbsp;&nbsp;animation: [ "slide-next", "slide-prev", "slide-down", "slide-up",]<br>}</code> |
| ariaNextLabel | Accessibility next button aria label | string | - | <div><small>From <b>config</b>:</small></div><code style='white-space: nowrap; padding: 0;'>steps: {<br>&nbsp;&nbsp;ariaNextLabel: "Next"<br>}</code> |
| ariaPreviousLabel | Accessibility previous button aria label | string | - | <div><small>From <b>config</b>:</small></div><code style='white-space: nowrap; padding: 0;'>steps: {<br>&nbsp;&nbsp;ariaPreviousLabel: "Previous"<br>}</code> |
| destroyOnHide | Destroy stepItem on hide | boolean | - | <code style='white-space: nowrap; padding: 0;'>false</code> |
| hasNavigation | Next and previous buttons below the component. You can use this property if you want to use your own custom navigation items. | boolean | - | <code style='white-space: nowrap; padding: 0;'>true</code> |
| iconNext | Icon to use for navigation button | string | - | <div><small>From <b>config</b>:</small></div><code style='white-space: nowrap; padding: 0;'>steps: {<br>&nbsp;&nbsp;iconNext: "chevron-right"<br>}</code> |
| iconPack | Icon pack to use for the navigation | string | `mdi`, `fa`, `fas and any other custom icon pack` | <div><small>From <b>config</b>:</small></div><code style='white-space: nowrap; padding: 0;'>steps: {<br>&nbsp;&nbsp;iconPack: undefined<br>}</code> |
Expand Down
1 change: 0 additions & 1 deletion packages/docs/components/Tabs.md
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,6 @@ sidebarDepth: 2
| animateInitially | Apply animation on the initial render | boolean | - | <div><small>From <b>config</b>:</small></div><code style='white-space: nowrap; padding: 0;'>tabs: {<br>&nbsp;&nbsp;animateInitially: false<br>}</code> |
| animated | Tab will have an animation | boolean | - | <div><small>From <b>config</b>:</small></div><code style='white-space: nowrap; padding: 0;'>tabs: {<br>&nbsp;&nbsp;animated: true<br>}</code> |
| animation | Transition animation name | [string, string, string, string] \| [string, string] | `[next`, `prev]`, `[right`, `left`, `down`, `up]` | <div><small>From <b>config</b>:</small></div><code style='white-space: nowrap; padding: 0;'>tabs: {<br>&nbsp;&nbsp;animation: [ "slide-next", "slide-prev", "slide-down", "slide-up",]<br>}</code> |
| destroyOnHide | Destroy tabItem on hide | boolean | - | <code style='white-space: nowrap; padding: 0;'>false</code> |
| expanded | Tabs will be expanded (full-width) | boolean | - | <code style='white-space: nowrap; padding: 0;'>false</code> |
| v-model | The selected item value, use v-model to make it two-way binding | string\|number\|object | - | |
| multiline | Show tab items multiline when there is no space | boolean | - | <code style='white-space: nowrap; padding: 0;'>false</code> |
Expand Down
6 changes: 2 additions & 4 deletions packages/oruga/src/components/steps/StepItem.vue
Original file line number Diff line number Diff line change
Expand Up @@ -190,17 +190,15 @@ const panelClasses = defineClasses(["stepPanelClass", "o-steps__panel"]);
@binding {boolean} active - if item is shown
-->
<slot :active="isActive && visible">
<template v-if="!parent.destroyOnHide || (isActive && visible)">
<!-- injected component -->
<component
:is="component"
v-if="component"
v-bind="$props.props"
v-on="$props.events || {}" />

<!-- default content prop -->
<template v-else>{{ content }}</template>
</template>
<!-- default content prop -->
<template v-else>{{ content }}</template>
</slot>
</div>
</Transition>
Expand Down
1 change: 0 additions & 1 deletion packages/oruga/src/components/steps/Steps.vue
Original file line number Diff line number Diff line change
Expand Up @@ -98,7 +98,6 @@ const provideData = computed<StepsComponent>(() => ({
animated: props.animated,
animation: props.animation,
animateInitially: props.animateInitially,
destroyOnHide: props.destroyOnHide,
variant: props.variant,
}));

Expand Down
5 changes: 0 additions & 5 deletions packages/oruga/src/components/steps/props.ts
Original file line number Diff line number Diff line change
Expand Up @@ -47,11 +47,6 @@ export type StepsProps<T> = {
* Next and previous buttons below the component. You can use this property if you want to use your own custom navigation items.
*/
hasNavigation?: boolean;
/**
* Destroy stepItem on hide
* @deprecated implement this yourself, using the `active` slot prop
*/
destroyOnHide?: boolean;
/** Step navigation is animated */
animated?: boolean;
/**
Expand Down
1 change: 0 additions & 1 deletion packages/oruga/src/components/steps/types.ts
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,6 @@ export type StepsComponent = {
animated: boolean;
animation: string[];
animateInitially: boolean;
destroyOnHide: boolean;
variant: string;
};

Expand Down
6 changes: 2 additions & 4 deletions packages/oruga/src/components/tabs/TabItem.vue
Original file line number Diff line number Diff line change
Expand Up @@ -175,17 +175,15 @@ const panelClasses = defineClasses(["tabPanelClass", "o-tabs__panel"]);
@binding {boolean} active - if item is shown
-->
<slot :active="isActive && visible">
<template v-if="!parent.destroyOnHide || (isActive && visible)">
<!-- injected component -->
<component
:is="component"
v-if="component"
v-bind="$props.props"
v-on="$props.events || {}" />

<!-- default content prop -->
<template v-else>{{ content }}</template>
</template>
<!-- default content prop -->
<template v-else>{{ content }}</template>
</slot>

<!--
Expand Down
1 change: 0 additions & 1 deletion packages/oruga/src/components/tabs/Tabs.vue
Original file line number Diff line number Diff line change
Expand Up @@ -91,7 +91,6 @@ const provideData = computed<TabsComponent>(() => ({
animated: props.animated,
animation: props.animation,
animateInitially: props.animateInitially,
destroyOnHide: props.destroyOnHide,
}));

/** provide functionalities and data to child item components */
Expand Down
5 changes: 0 additions & 5 deletions packages/oruga/src/components/tabs/props.ts
Original file line number Diff line number Diff line change
Expand Up @@ -41,11 +41,6 @@ export type TabsProps<T> = {
type?: string;
/** Tabs will be expanded (full-width) */
expanded?: boolean;
/**
* Destroy tabItem on hide
* @deprecated implement this yourself, using the `active` slot prop
*/
destroyOnHide?: boolean;
/** Set the tab active on navigation focus */
activateOnFocus?: boolean;
/** Tab will have an animation */
Expand Down
1 change: 0 additions & 1 deletion packages/oruga/src/components/tabs/types.ts
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,6 @@ export type TabsComponent = {
animated: boolean;
animation: string[];
animateInitially: boolean;
destroyOnHide: boolean;
};

export type TabItem<T> = Omit<ProviderItem<T>, "data"> & TabItemComponent<T>;
Loading