Skip to content

Commit

Permalink
feat(wizard): remove deprecated, undocumented inline wizard mode
Browse files Browse the repository at this point in the history 
BREAKING CHANGE:
- The inline wizard mode has been removed.
- The `clrModalOverrideScrollService` modal input has been removed.
  • Loading branch information
@kevinbuhmann
kevinbuhmann committed Dec 19, 2022
1 parent aab7d82 commit 7470769
Show file tree
Hide file tree
Showing 12 changed files with 4 additions and 223 deletions.
1 change: 0 additions & 1 deletion .storybook/stories/modal/modal.stories.ts
View file
Expand Up @@ -27,7 +27,6 @@ const defaultStory: Story = args => ({
[clrModalCloseButtonAriaLabel]="clrModalCloseButtonAriaLabel"
[clrModalLabelledById]="clrModalLabelledById"
[clrModalOpen]="clrModalOpen"
[clrModalOverrideScrollService]="clrModalOverrideScrollService"
[clrModalPreventClose]="clrModalPreventClose"
[clrModalSize]="clrModalSize"
[clrModalSkipAnimation]="clrModalSkipAnimation"
Expand Down
14 changes: 3 additions & 11 deletions projects/angular/clarity.api.md
View file
Expand Up @@ -2855,8 +2855,6 @@ export class ClrModal implements OnChanges, OnDestroy {
// (undocumented)
altClose: EventEmitter<boolean>;
// (undocumented)
bypassScrollService: boolean;
// (undocumented)
closable: boolean;
// (undocumented)
close(): void;
Expand Down Expand Up @@ -2893,7 +2891,7 @@ export class ClrModal implements OnChanges, OnDestroy {
// (undocumented)
stopClose: boolean;
// (undocumented)
static ɵcmp: i0.ɵɵComponentDeclaration<ClrModal, "clr-modal", never, { "_open": "clrModalOpen"; "closable": "clrModalClosable"; "closeButtonAriaLabel": "clrModalCloseButtonAriaLabel"; "size": "clrModalSize"; "staticBackdrop": "clrModalStaticBackdrop"; "skipAnimation": "clrModalSkipAnimation"; "bypassScrollService": "clrModalOverrideScrollService"; "stopClose": "clrModalPreventClose"; "labelledBy": "clrModalLabelledById"; }, { "_openChanged": "clrModalOpenChange"; "altClose": "clrModalAlternateClose"; }, never, [".modal-nav", ".modal-title", ".modal-body", ".modal-footer"], false, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<ClrModal, "clr-modal", never, { "_open": "clrModalOpen"; "closable": "clrModalClosable"; "closeButtonAriaLabel": "clrModalCloseButtonAriaLabel"; "size": "clrModalSize"; "staticBackdrop": "clrModalStaticBackdrop"; "skipAnimation": "clrModalSkipAnimation"; "stopClose": "clrModalPreventClose"; "labelledBy": "clrModalLabelledById"; }, { "_openChanged": "clrModalOpenChange"; "altClose": "clrModalAlternateClose"; }, never, [".modal-nav", ".modal-title", ".modal-body", ".modal-footer"], false, never>;
// (undocumented)
static ɵfac: i0.ɵɵFactoryDeclaration<ClrModal, never>;
}
Expand Down Expand Up @@ -4463,7 +4461,7 @@ export class ClrVerticalNavModule {

// @public (undocumented)
export class ClrWizard implements OnDestroy, AfterContentInit, DoCheck {
constructor(platformId: any, navService: WizardNavigationService, pageCollection: PageCollectionService, buttonService: ButtonHubService, headerActionService: HeaderActionService, elementRef: ElementRef, differs: IterableDiffers);
constructor(platformId: any, navService: WizardNavigationService, pageCollection: PageCollectionService, buttonService: ButtonHubService, headerActionService: HeaderActionService, differs: IterableDiffers);
// Warning: (ae-forgotten-export) The symbol "ButtonHubService" needs to be exported by the entry point index.d.ts
//
// (undocumented)
Expand Down Expand Up @@ -4497,8 +4495,6 @@ export class ClrWizard implements OnDestroy, AfterContentInit, DoCheck {
get isFirst(): boolean;
// (undocumented)
get isLast(): boolean;
// (undocumented)
get isStatic(): boolean;
modalCancel(): void;
// Warning: (ae-forgotten-export) The symbol "WizardNavigationService" needs to be exported by the entry point index.d.ts
//
Expand Down Expand Up @@ -4531,10 +4527,6 @@ export class ClrWizard implements OnDestroy, AfterContentInit, DoCheck {
set stopCancel(value: boolean);
// (undocumented)
get stopCancel(): boolean;
// (undocumented)
get stopModalAnimations(): string;
// @deprecated (undocumented)
_stopModalAnimations: boolean;
set stopNavigation(value: boolean);
// (undocumented)
get stopNavigation(): boolean;
Expand All @@ -4548,7 +4540,7 @@ export class ClrWizard implements OnDestroy, AfterContentInit, DoCheck {
// (undocumented)
wizardTitle: ElementRef;
// (undocumented)
static ɵcmp: i0.ɵɵComponentDeclaration<ClrWizard, "clr-wizard", never, { "size": "clrWizardSize"; "closable": "clrWizardClosable"; "forceForward": "clrWizardForceForwardNavigation"; "clrWizardOpen": "clrWizardOpen"; "stopNext": "clrWizardPreventDefaultNext"; "stopCancel": "clrWizardPreventDefaultCancel"; "stopNavigation": "clrWizardPreventNavigation"; "disableStepnav": "clrWizardDisableStepnav"; "_stopModalAnimations": "clrWizardPreventModalAnimation"; }, { "_openChanged": "clrWizardOpenChange"; "onCancel": "clrWizardOnCancel"; "wizardFinished": "clrWizardOnFinish"; "onReset": "clrWizardOnReset"; "currentPageChanged": "clrWizardCurrentPageChanged"; "onMoveNext": "clrWizardOnNext"; "onMovePrevious": "clrWizardOnPrevious"; }, ["pages", "headerActions"], ["clr-wizard-title", "clr-wizard-header-action", "*", "clr-wizard-button"], false, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<ClrWizard, "clr-wizard", never, { "size": "clrWizardSize"; "closable": "clrWizardClosable"; "forceForward": "clrWizardForceForwardNavigation"; "clrWizardOpen": "clrWizardOpen"; "stopNext": "clrWizardPreventDefaultNext"; "stopCancel": "clrWizardPreventDefaultCancel"; "stopNavigation": "clrWizardPreventNavigation"; "disableStepnav": "clrWizardDisableStepnav"; }, { "_openChanged": "clrWizardOpenChange"; "onCancel": "clrWizardOnCancel"; "wizardFinished": "clrWizardOnFinish"; "onReset": "clrWizardOnReset"; "currentPageChanged": "clrWizardCurrentPageChanged"; "onMoveNext": "clrWizardOnNext"; "onMovePrevious": "clrWizardOnPrevious"; }, ["pages", "headerActions"], ["clr-wizard-title", "clr-wizard-header-action", "*", "clr-wizard-button"], false, never>;
// (undocumented)
static ɵfac: i0.ɵɵFactoryDeclaration<ClrWizard, never>;
}
Expand Down
8 changes: 0 additions & 8 deletions projects/angular/src/deprecations.spec.ts
View file
Expand Up @@ -8,7 +8,6 @@ import { ClrDatagrid } from './data/datagrid/datagrid';
import { ClrDatagridColumnToggle } from './data/datagrid/datagrid-column-toggle';
import { ClrDatagridColumnToggleButton } from './data/datagrid/datagrid-column-toggle-button';
import { ClrDatagridColumnToggleTitle } from './data/datagrid/datagrid-column-toggle-title';
import { ClrWizard } from './wizard/wizard';

describe('Deprecations', () => {
// When we deprecate some code, we should write a test to verify it is still in the bundle
Expand All @@ -26,11 +25,4 @@ describe('Deprecations', () => {
expect(propTest.set).toBeDefined();
});
});

describe('3.0', () => {
it('should deprecate inline wizard inputs', () => {
const propTest = Object.getOwnPropertyDescriptor(ClrWizard.prototype, 'stopModalAnimations');
expect(propTest.get).toBeDefined();
});
});
});
4 changes: 1 addition & 3 deletions projects/angular/src/modal/modal.ts
View file
Expand Up @@ -64,8 +64,6 @@ export class ClrModal implements OnChanges, OnDestroy {
@Input('clrModalStaticBackdrop') staticBackdrop = true;
@Input('clrModalSkipAnimation') skipAnimation = 'false';

// presently this is only used by wizards
@Input('clrModalOverrideScrollService') bypassScrollService = false;
@Input('clrModalPreventClose') stopClose = false;
@Output('clrModalAlternateClose') altClose: EventEmitter<boolean> = new EventEmitter<boolean>(false);

Expand All @@ -75,7 +73,7 @@ export class ClrModal implements OnChanges, OnDestroy {

// Detect when _open is set to true and set no-scrolling to true
ngOnChanges(changes: { [propName: string]: SimpleChange }): void {
if (!this.bypassScrollService && changes && Object.prototype.hasOwnProperty.call(changes, '_open')) {
if (changes && Object.prototype.hasOwnProperty.call(changes, '_open')) {
if (changes._open.currentValue) {
this._scrollingService.stopScrolling();
} else {
Expand Down
83 changes: 0 additions & 83 deletions projects/angular/src/wizard/_wizard.clarity.scss
View file
Expand Up @@ -456,89 +456,6 @@
}
}

/** @deprecated since 3.0, inline wizard style should be removed in 4.0 */
.clr-wizard--inline {
display: block;
width: 100%;
// you will want to set a fixed width and height for these static wizards
// otherwise, you'll get some minor jumping along the right edge when it is
// closed...

& > clr-modal > .modal:focus {
// need to remove the outline style or trap-focus directive will make
// outline appear in Safari and Microsoft browsers
outline-style: none;
outline-color: transparent;
}

clr-modal {
@include equilateral(100%);
display: block;
}

.modal {
padding: 0;
position: static;
height: 100%;
max-height: 100%;

.content-container {
height: 100%;

.nav-panel {
@include equilateral(99%);
}
}

.modal-content {
box-shadow: none;
}

.modal-dialog {
min-height: 100%;
@include equilateral(100%);
z-index: auto;
}
}

.modal-body-wrapper {
height: 100%;
}

.modal-header .close {
display: none;
}

.nav.navList {
padding-top: 0;
}

.modal-dialog .modal-content .modal-body .content-area {
overflow-y: auto;
}

.modal-backdrop {
@include equilateral(0);
display: none;
}

.modal-content-wrapper {
align-items: stretch;
height: 100%;
}

.clr-wizard-stepnav-wrapper,
&.clr-wizard .modal-content {
min-height: 100%;
height: auto;
max-height: 100%;

.clr-wizard-stepnav {
height: 100%;
}
}
}

.clr-wizard--no-shadow {
.modal-content-wrapper,
.modal-dialog {
Expand Down
2 changes: 0 additions & 2 deletions projects/angular/src/wizard/wizard.html
View file
Expand Up @@ -9,8 +9,6 @@
[clrModalSize]="size"
[clrModalClosable]="closable"
[clrModalStaticBackdrop]="true"
[clrModalSkipAnimation]="stopModalAnimations"
[clrModalOverrideScrollService]="isStatic"
[clrModalPreventClose]="true"
(clrModalAlternateClose)="modalCancel()"
[clrModalLabelledById]="wizardId"
Expand Down
24 changes: 0 additions & 24 deletions projects/angular/src/wizard/wizard.ts
View file
Expand Up @@ -152,17 +152,6 @@ export class ClrWizard implements OnDestroy, AfterContentInit, DoCheck {
}
private _disableStepnav = false;

/**
* Used to communicate to the underlying modal that animations are not
* wanted. Primary use is for the display of static/inline wizards.
* Set using `[clrWizardPreventModalAnimation]` input.
*/
/** @deprecated since 3.0, input should be removed in 4.0 because is only related to inline wizards */
@Input('clrWizardPreventModalAnimation') _stopModalAnimations = false;
get stopModalAnimations(): string {
return this._stopModalAnimations ? 'true' : 'false';
}

/**
* Emits when the wizard is opened or closed.
* Listen via `(clrWizardOpenChange)` event.
Expand Down Expand Up @@ -229,10 +218,6 @@ export class ClrWizard implements OnDestroy, AfterContentInit, DoCheck {
return this.navService.currentPageIsFirst;
}

get isStatic(): boolean {
return (this.elementRef.nativeElement as HTMLElement).classList.contains('clr-wizard--inline');
}

wizardId = uniqueIdFactory();

private differ: any; // for marking when the collection of wizard pages has been added to or deleted from
Expand All @@ -244,7 +229,6 @@ export class ClrWizard implements OnDestroy, AfterContentInit, DoCheck {
public pageCollection: PageCollectionService,
public buttonService: ButtonHubService,
public headerActionService: HeaderActionService,
private elementRef: ElementRef,
differs: IterableDiffers
) {
this.subscriptions.push(
Expand All @@ -261,7 +245,6 @@ export class ClrWizard implements OnDestroy, AfterContentInit, DoCheck {
ngAfterContentInit(): void {
this.pageCollection.pages = this.pages;
this.headerActionService.wizardHeaderActions = this.headerActions;
this.initializeButtons();
}

ngDoCheck(): void {
Expand Down Expand Up @@ -490,13 +473,6 @@ export class ClrWizard implements OnDestroy, AfterContentInit, DoCheck {
}
}

private initializeButtons(): void {
// Only trigger buttons ready if default is open (inlined)
if (this._open) {
this.buttonService.buttonsReady = true;
}
}

private emitWizardFinished(): void {
if (!this.stopNext) {
this.forceFinish();
Expand Down
64 changes: 0 additions & 64 deletions projects/demo/src/app/wizard/wizard-inline.demo.html
View file

This file was deleted.

19 changes: 0 additions & 19 deletions projects/demo/src/app/wizard/wizard-inline.demo.ts
View file

This file was deleted.

4 changes: 0 additions & 4 deletions projects/demo/src/app/wizard/wizard.demo.module.ts
View file
Expand Up @@ -17,8 +17,6 @@ import { WizardCustomButtonsDemo } from './wizard-custom-buttons.demo';
import { WizardForceForwardDemo } from './wizard-force-forward.demo';
import { WizardFormValidation } from './wizard-form-validation.demo';
import { WizardHeaderActionsDemo } from './wizard-header-actions.demo';
/** @deprecated since 3.0, inline wizard should be removed in 4.0 */
import { WizardInlineDemo } from './wizard-inline.demo';
import { WizardJumpToDemo } from './wizard-jump-to.demo';
import { WizardNotClosableDemo } from './wizard-not-closable.demo';
import { WizardResetDemo } from './wizard-reset.demo';
Expand All @@ -41,7 +39,6 @@ import { ROUTING } from './wizard.demo.routing';
WizardResetDemo,
WizardHeaderActionsDemo,
WizardAltCancelDemo,
WizardInlineDemo,
WizardJumpToDemo,
WizardAltNextDemo,
WizardForceForwardDemo,
Expand All @@ -58,7 +55,6 @@ import { ROUTING } from './wizard.demo.routing';
WizardCustomButtonsDemo,
WizardHeaderActionsDemo,
WizardAltCancelDemo,
WizardInlineDemo,
WizardResetDemo,
WizardJumpToDemo,
WizardAltNextDemo,
Expand Down
3 changes: 0 additions & 3 deletions projects/demo/src/app/wizard/wizard.demo.routing.ts
View file
Expand Up @@ -15,8 +15,6 @@ import { WizardCustomButtonsDemo } from './wizard-custom-buttons.demo';
import { WizardForceForwardDemo } from './wizard-force-forward.demo';
import { WizardFormValidation } from './wizard-form-validation.demo';
import { WizardHeaderActionsDemo } from './wizard-header-actions.demo';
/** @deprecated since 3.0, inlie wizard should be removed in 4.0 */
import { WizardInlineDemo } from './wizard-inline.demo';
import { WizardJumpToDemo } from './wizard-jump-to.demo';
import { WizardNotClosableDemo } from './wizard-not-closable.demo';
import { WizardResetDemo } from './wizard-reset.demo';
Expand All @@ -39,7 +37,6 @@ const ROUTES: Routes = [
{ path: 'custom-buttons', component: WizardCustomButtonsDemo },
{ path: 'header-actions', component: WizardHeaderActionsDemo },
{ path: 'alt-cancel', component: WizardAltCancelDemo },
{ path: 'inline', component: WizardInlineDemo },
{ path: 'jump-to', component: WizardJumpToDemo },
{ path: 'reset', component: WizardResetDemo },
{ path: 'alt-next', component: WizardAltNextDemo },
Expand Down
1 change: 0 additions & 1 deletion projects/demo/src/app/wizard/wizard.demo.ts
View file
Expand Up @@ -29,7 +29,6 @@ import { Component, ViewEncapsulation } from '@angular/core';
<li><a [routerLink]="['./header-actions']">Header actions</a></li>
<li><a [routerLink]="['./alt-cancel']">Alt cancel</a></li>
<li><a [routerLink]="['./alt-next']">Alt next</a></li>
<li><a [routerLink]="['./inline']">Inline/static wizard</a></li>
<li><a [routerLink]="['./force-forward']">Force forward</a></li>
<li><a [routerLink]="['./stop-navigation']">Stop navigation</a></li>
</ul>
Expand Down

0 comments on commit 7470769

Please sign in to comment.