Skip to content

Commit

Permalink
feat: update private change handlers to protected (#5872)
Browse files Browse the repository at this point in the history
* update attribute and observable change handlers with internal logic to be protected instead of private

* Change files

* udpate api docs
  • Loading branch information
chrisdholt authored and nicholasrice committed May 5, 2022
1 parent 115227d commit 4bafba8
Show file tree
Hide file tree
Showing 44 changed files with 284 additions and 193 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
{
"type": "minor",
"comment": "update attribute and observable change handlers with internal logic to be protected instead of private",
"packageName": "@microsoft/fast-foundation",
"email": "[email protected]",
"dependentChangeType": "patch"
}
Original file line number Diff line number Diff line change
Expand Up @@ -114,10 +114,28 @@ export const myAnchoredRegion = AnchoredRegion.compose({

#### Methods

| Name | Privacy | Description | Parameters | Return | Inherited From |
| ----------------- | --------- | ----------- | ---------- | ------ | ----------------- |
| `templateChanged` | protected | | | `void` | FoundationElement |
| `stylesChanged` | protected | | | `void` | FoundationElement |
| Name | Privacy | Description | Parameters | Return | Inherited From |
| ---------------------------------- | --------- | ----------- | --------------------------------------------------- | ------ | ----------------- |
| `anchorChanged` | protected | | | `void` | |
| `viewportChanged` | protected | | | `void` | |
| `horizontalPositioningModeChanged` | protected | | | `void` | |
| `horizontalDefaultPositionChanged` | protected | | | `void` | |
| `horizontalViewportLockChanged` | protected | | | `void` | |
| `horizontalInsetChanged` | protected | | | `void` | |
| `horizontalThresholdChanged` | protected | | | `void` | |
| `horizontalScalingChanged` | protected | | | `void` | |
| `verticalPositioningModeChanged` | protected | | | `void` | |
| `verticalDefaultPositionChanged` | protected | | | `void` | |
| `verticalViewportLockChanged` | protected | | | `void` | |
| `verticalInsetChanged` | protected | | | `void` | |
| `verticalThresholdChanged` | protected | | | `void` | |
| `verticalScalingChanged` | protected | | | `void` | |
| `fixedPlacementChanged` | protected | | | `void` | |
| `autoUpdateModeChanged` | protected | | `prevMode: AutoUpdateMode, newMode: AutoUpdateMode` | `void` | |
| `anchorElementChanged` | protected | | | `void` | |
| `viewportElementChanged` | protected | | | `void` | |
| `templateChanged` | protected | | | `void` | FoundationElement |
| `stylesChanged` | protected | | | `void` | FoundationElement |

#### Events

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -90,7 +90,7 @@ export class AnchoredRegion extends FoundationElement {
*/
@attr
public anchor: string = "";
private anchorChanged(): void {
protected anchorChanged(): void {
if (this.initialLayoutComplete) {
this.anchorElement = this.getAnchor();
}
Expand All @@ -105,7 +105,7 @@ export class AnchoredRegion extends FoundationElement {
*/
@attr
public viewport: string = "";
private viewportChanged(): void {
protected viewportChanged(): void {
if (this.initialLayoutComplete) {
this.viewportElement = this.getViewport();
}
Expand All @@ -123,7 +123,7 @@ export class AnchoredRegion extends FoundationElement {
*/
@attr({ attribute: "horizontal-positioning-mode" })
public horizontalPositioningMode: AxisPositioningMode = "uncontrolled";
private horizontalPositioningModeChanged(): void {
protected horizontalPositioningModeChanged(): void {
this.requestReset();
}

Expand All @@ -136,7 +136,7 @@ export class AnchoredRegion extends FoundationElement {
*/
@attr({ attribute: "horizontal-default-position" })
public horizontalDefaultPosition: HorizontalPosition = "unset";
private horizontalDefaultPositionChanged(): void {
protected horizontalDefaultPositionChanged(): void {
this.updateForAttributeChange();
}

Expand All @@ -149,7 +149,7 @@ export class AnchoredRegion extends FoundationElement {
*/
@attr({ attribute: "horizontal-viewport-lock", mode: "boolean" })
public horizontalViewportLock: boolean = false;
private horizontalViewportLockChanged(): void {
protected horizontalViewportLockChanged(): void {
this.updateForAttributeChange();
}

Expand All @@ -162,7 +162,7 @@ export class AnchoredRegion extends FoundationElement {
*/
@attr({ attribute: "horizontal-inset", mode: "boolean" })
public horizontalInset: boolean = false;
private horizontalInsetChanged(): void {
protected horizontalInsetChanged(): void {
this.updateForAttributeChange();
}

Expand All @@ -176,7 +176,7 @@ export class AnchoredRegion extends FoundationElement {
*/
@attr({ attribute: "horizontal-threshold" })
public horizontalThreshold: number;
private horizontalThresholdChanged(): void {
protected horizontalThresholdChanged(): void {
this.updateForAttributeChange();
}

Expand All @@ -189,7 +189,7 @@ export class AnchoredRegion extends FoundationElement {
*/
@attr({ attribute: "horizontal-scaling" })
public horizontalScaling: AxisScalingMode = "content";
private horizontalScalingChanged(): void {
protected horizontalScalingChanged(): void {
this.updateForAttributeChange();
}

Expand All @@ -205,7 +205,7 @@ export class AnchoredRegion extends FoundationElement {
*/
@attr({ attribute: "vertical-positioning-mode" })
public verticalPositioningMode: AxisPositioningMode = "uncontrolled";
private verticalPositioningModeChanged(): void {
protected verticalPositioningModeChanged(): void {
this.requestReset();
}

Expand All @@ -218,7 +218,7 @@ export class AnchoredRegion extends FoundationElement {
*/
@attr({ attribute: "vertical-default-position" })
public verticalDefaultPosition: VerticalPosition = "unset";
private verticalDefaultPositionChanged(): void {
protected verticalDefaultPositionChanged(): void {
this.updateForAttributeChange();
}

Expand All @@ -231,7 +231,7 @@ export class AnchoredRegion extends FoundationElement {
*/
@attr({ attribute: "vertical-viewport-lock", mode: "boolean" })
public verticalViewportLock: boolean = false;
private verticalViewportLockChanged(): void {
protected verticalViewportLockChanged(): void {
this.updateForAttributeChange();
}

Expand All @@ -244,7 +244,7 @@ export class AnchoredRegion extends FoundationElement {
*/
@attr({ attribute: "vertical-inset", mode: "boolean" })
public verticalInset: boolean = false;
private verticalInsetChanged(): void {
protected verticalInsetChanged(): void {
this.updateForAttributeChange();
}

Expand All @@ -258,7 +258,7 @@ export class AnchoredRegion extends FoundationElement {
*/
@attr({ attribute: "vertical-threshold" })
public verticalThreshold: number;
private verticalThresholdChanged(): void {
protected verticalThresholdChanged(): void {
this.updateForAttributeChange();
}

Expand All @@ -271,7 +271,7 @@ export class AnchoredRegion extends FoundationElement {
*/
@attr({ attribute: "vertical-scaling" })
public verticalScaling: AxisScalingMode = "content";
private verticalScalingChanged(): void {
protected verticalScalingChanged(): void {
this.updateForAttributeChange();
}

Expand All @@ -286,7 +286,7 @@ export class AnchoredRegion extends FoundationElement {
*/
@attr({ attribute: "fixed-placement", mode: "boolean" })
public fixedPlacement: boolean = false;
private fixedPlacementChanged(): void {
protected fixedPlacementChanged(): void {
if (
(this as FoundationElement).$fastController.isConnected &&
this.initialLayoutComplete
Expand All @@ -304,7 +304,7 @@ export class AnchoredRegion extends FoundationElement {
*/
@attr({ attribute: "auto-update-mode" })
public autoUpdateMode: AutoUpdateMode = "anchor";
private autoUpdateModeChanged(
protected autoUpdateModeChanged(
prevMode: AutoUpdateMode,
newMode: AutoUpdateMode
): void {
Expand All @@ -329,7 +329,7 @@ export class AnchoredRegion extends FoundationElement {
*/
@observable
public anchorElement: HTMLElement | null = null;
private anchorElementChanged(): void {
protected anchorElementChanged(): void {
this.requestReset();
}

Expand All @@ -340,7 +340,7 @@ export class AnchoredRegion extends FoundationElement {
*/
@observable
public viewportElement: HTMLElement | null = null;
private viewportElementChanged(): void {
protected viewportElementChanged(): void {
if (
(this as FoundationElement).$fastController.isConnected &&
this.initialLayoutComplete
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -120,7 +120,7 @@ This component is built with the expectation that focus is delegated to the anch

| Name | Privacy | Description | Parameters | Return | Inherited From |
| ------------------------------- | --------- | ----------- | ---------- | ------ | ----------------- |
| `slottedBreadcrumbItemsChanged` | public | | | | |
| `slottedBreadcrumbItemsChanged` | protected | | | | |
| `templateChanged` | protected | | | `void` | FoundationElement |
| `stylesChanged` | protected | | | `void` | FoundationElement |

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ export class Breadcrumb extends FoundationElement {
*/
@observable
public slottedBreadcrumbItems: HTMLElement[];
public slottedBreadcrumbItemsChanged() {
protected slottedBreadcrumbItemsChanged() {
if (this.$fastController.isConnected) {
if (
this.slottedBreadcrumbItems === undefined ||
Expand Down
14 changes: 10 additions & 4 deletions packages/web-components/fast-foundation/src/button/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -88,10 +88,16 @@ This component is built with the expectation that focus is delegated to the butt

#### Methods

| Name | Privacy | Description | Parameters | Return | Inherited From |
| ----------------- | --------- | ----------- | ---------- | ------ | ----------------- |
| `templateChanged` | protected | | | `void` | FoundationElement |
| `stylesChanged` | protected | | | `void` | FoundationElement |
| Name | Privacy | Description | Parameters | Return | Inherited From |
| ----------------------- | --------- | ----------- | ------------------------------------------------------------------------------------------ | ------ | ----------------- |
| `formactionChanged` | protected | | | `void` | |
| `formenctypeChanged` | protected | | | `void` | |
| `formmethodChanged` | protected | | | `void` | |
| `formnovalidateChanged` | protected | | | `void` | |
| `formtargetChanged` | protected | | | `void` | |
| `typeChanged` | protected | | `previous: "submit" or "reset" or "button" or void, next: "submit" or "reset" or "button"` | `void` | |
| `templateChanged` | protected | | | `void` | FoundationElement |
| `stylesChanged` | protected | | | `void` | FoundationElement |

#### Attributes

Expand Down
12 changes: 6 additions & 6 deletions packages/web-components/fast-foundation/src/button/button.ts
Original file line number Diff line number Diff line change
Expand Up @@ -56,7 +56,7 @@ export class Button extends FormAssociatedButton {
*/
@attr
public formaction: string;
private formactionChanged(): void {
protected formactionChanged(): void {
if (this.proxy instanceof HTMLInputElement) {
this.proxy.formAction = this.formaction;
}
Expand All @@ -71,7 +71,7 @@ export class Button extends FormAssociatedButton {
*/
@attr
public formenctype: string;
private formenctypeChanged(): void {
protected formenctypeChanged(): void {
if (this.proxy instanceof HTMLInputElement) {
this.proxy.formEnctype = this.formenctype;
}
Expand All @@ -86,7 +86,7 @@ export class Button extends FormAssociatedButton {
*/
@attr
public formmethod: string;
private formmethodChanged(): void {
protected formmethodChanged(): void {
if (this.proxy instanceof HTMLInputElement) {
this.proxy.formMethod = this.formmethod;
}
Expand All @@ -101,7 +101,7 @@ export class Button extends FormAssociatedButton {
*/
@attr({ mode: "boolean" })
public formnovalidate: boolean;
private formnovalidateChanged(): void {
protected formnovalidateChanged(): void {
if (this.proxy instanceof HTMLInputElement) {
this.proxy.formNoValidate = this.formnovalidate;
}
Expand All @@ -116,7 +116,7 @@ export class Button extends FormAssociatedButton {
*/
@attr
public formtarget: "_self" | "_blank" | "_parent" | "_top";
private formtargetChanged(): void {
protected formtargetChanged(): void {
if (this.proxy instanceof HTMLInputElement) {
this.proxy.formTarget = this.formtarget;
}
Expand All @@ -131,7 +131,7 @@ export class Button extends FormAssociatedButton {
*/
@attr
public type: "submit" | "reset" | "button";
private typeChanged(
protected typeChanged(
previous: "submit" | "reset" | "button" | void,
next: "submit" | "reset" | "button"
): void {
Expand Down
10 changes: 5 additions & 5 deletions packages/web-components/fast-foundation/src/calendar/calendar.ts
Original file line number Diff line number Diff line change
Expand Up @@ -101,7 +101,7 @@ export class Calendar extends FoundationElement {
*/
@attr
public locale: string = "en-US";
private localeChanged(): void {
protected localeChanged(): void {
this.dateFormatter.locale = this.locale;
}

Expand All @@ -125,7 +125,7 @@ export class Calendar extends FoundationElement {
*/
@attr({ attribute: "day-format", mode: "fromView" })
public dayFormat: DayFormat = "numeric";
private dayFormatChanged(): void {
protected dayFormatChanged(): void {
this.dateFormatter.dayFormat = this.dayFormat;
}

Expand All @@ -135,7 +135,7 @@ export class Calendar extends FoundationElement {
*/
@attr({ attribute: "weekday-format", mode: "fromView" })
public weekdayFormat: WeekdayFormat = "short";
private weekdayFormatChanged(): void {
protected weekdayFormatChanged(): void {
this.dateFormatter.weekdayFormat = this.weekdayFormat;
}

Expand All @@ -145,7 +145,7 @@ export class Calendar extends FoundationElement {
*/
@attr({ attribute: "month-format", mode: "fromView" })
public monthFormat: MonthFormat = "long";
private monthFormatChanged(): void {
protected monthFormatChanged(): void {
this.dateFormatter.monthFormat = this.monthFormat;
}

Expand All @@ -155,7 +155,7 @@ export class Calendar extends FoundationElement {
*/
@attr({ attribute: "year-format", mode: "fromView" })
public yearFormat: YearFormat = "numeric";
private yearFormatChanged(): void {
protected yearFormatChanged(): void {
this.dateFormatter.yearFormat = this.yearFormat;
}

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -99,6 +99,7 @@ export const myCheckbox = Checkbox.compose<CheckboxOptions>({

| Name | Privacy | Description | Parameters | Return | Inherited From |
| ----------------- | --------- | ----------- | ---------- | ------ | ----------------- |
| `readOnlyChanged` | protected | | | `void` | |
| `templateChanged` | protected | | | `void` | FoundationElement |
| `stylesChanged` | protected | | | `void` | FoundationElement |

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ export class Checkbox extends FormAssociatedCheckbox {
*/
@attr({ attribute: "readonly", mode: "boolean" })
public readOnly: boolean; // Map to proxy element
private readOnlyChanged(): void {
protected readOnlyChanged(): void {
if (this.proxy instanceof HTMLInputElement) {
this.proxy.readOnly = this.readOnly;
}
Expand Down
Loading

0 comments on commit 4bafba8

Please sign in to comment.