Skip to content

Commit dea2858

Browse files
committed
Revert "Reapply "feat: Implementation of the Avatar component Style API (#77)" (#79)"
This reverts commit c3f7257.
1 parent c4ad90d commit dea2858

File tree

13 files changed

+11
-396
lines changed

13 files changed

+11
-396
lines changed

pages/avatar/custom-style.page.tsx

Lines changed: 0 additions & 132 deletions
This file was deleted.

pages/avatar/permutations.page.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import { TestBed } from "../app/test-bed";
88
import { ScreenshotArea } from "../screenshot-area";
99
import smiley from "./smiley.png";
1010

11-
export const customIconSvg = (
11+
const customIconSvg = (
1212
<svg
1313
className="w-6 h-6 text-gray-800 dark:text-white"
1414
aria-hidden="true"

scripts/environment.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,6 @@ const values = {
1414
PACKAGE_SOURCE: "chat-components",
1515
PACKAGE_VERSION: packageVersion,
1616
THEME: "open-source-visual-refresh",
17-
SYSTEM: "core",
1817
ALWAYS_VISUAL_REFRESH: true,
1918
};
2019
writeFile(`${basePath}.json`, JSON.stringify(values, null, 2));

scripts/utils/custom-css-properties-list.js

Lines changed: 1 addition & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,5 @@
33
/*
44
* This file is only needed to generate the proper js and scss files in custom-css-properties script
55
*/
6-
const customCssPropertiesList = [
7-
"avatarSize",
8-
"avatarRootBorderWidth",
9-
"avatarFocusRingBorderColor",
10-
"avatarFocusRingBorderRadius",
11-
"avatarFocusRingBorderWidth",
12-
];
6+
const customCssPropertiesList = ["avatarSize"];
137
export default customCssPropertiesList;

src/__tests__/__snapshots__/documenter.test.ts.snap

Lines changed: 0 additions & 92 deletions
Original file line numberDiff line numberDiff line change
@@ -77,98 +77,6 @@ Use it to define initials that uniquely identify the avatar's owner.",
7777
"optional": true,
7878
"type": "boolean",
7979
},
80-
{
81-
"description": "Specifies an object of selectors and properties that are used to apply custom styles.
82-
83-
- \`root.background\` (string) - (Optional) Background of the avatar.
84-
- \`root.borderColor\` (string) - (Optional) Border color of the avatar.
85-
- \`root.borderRadius\` (string) - (Optional) Border radius of the avatar.
86-
- \`root.borderWidth\` (string) - (Optional) Border width of the avatar.
87-
- \`root.boxShadow\` (string) - (Optional) Box shadow of the avatar.
88-
- \`root.color\` (string) - (Optional) Text color of the avatar.
89-
- \`root.focusRing.borderColor\` (string) - (Optional) Focus ring border color.
90-
- \`root.focusRing.borderRadius\` (string) - (Optional) Focus ring border radius.
91-
- \`root.focusRing.borderWidth\` (string) - (Optional) Focus ring border width.",
92-
"inlineType": {
93-
"name": "AvatarProps.Style",
94-
"properties": [
95-
{
96-
"inlineType": {
97-
"name": "object",
98-
"properties": [
99-
{
100-
"name": "background",
101-
"optional": true,
102-
"type": "string",
103-
},
104-
{
105-
"name": "borderColor",
106-
"optional": true,
107-
"type": "string",
108-
},
109-
{
110-
"name": "borderRadius",
111-
"optional": true,
112-
"type": "string",
113-
},
114-
{
115-
"name": "borderWidth",
116-
"optional": true,
117-
"type": "string",
118-
},
119-
{
120-
"name": "boxShadow",
121-
"optional": true,
122-
"type": "string",
123-
},
124-
{
125-
"name": "color",
126-
"optional": true,
127-
"type": "string",
128-
},
129-
{
130-
"inlineType": {
131-
"name": "object",
132-
"properties": [
133-
{
134-
"name": "borderColor",
135-
"optional": true,
136-
"type": "string",
137-
},
138-
{
139-
"name": "borderRadius",
140-
"optional": true,
141-
"type": "string",
142-
},
143-
{
144-
"name": "borderWidth",
145-
"optional": true,
146-
"type": "string",
147-
},
148-
],
149-
"type": "object",
150-
},
151-
"name": "focusRing",
152-
"optional": true,
153-
"type": "{ borderColor?: string | undefined; borderRadius?: string | undefined; borderWidth?: string | undefined; }",
154-
},
155-
],
156-
"type": "object",
157-
},
158-
"name": "root",
159-
"optional": true,
160-
"type": "{ background?: string | undefined; borderColor?: string | undefined; borderRadius?: string | undefined; borderWidth?: string | undefined; boxShadow?: string | undefined; color?: string | undefined; focusRing?: { ...; } | undefined; }",
161-
},
162-
],
163-
"type": "object",
164-
},
165-
"name": "style",
166-
"optional": true,
167-
"systemTags": [
168-
"core",
169-
],
170-
"type": "AvatarProps.Style",
171-
},
17280
{
17381
"description": "The text content shown in the avatar's tooltip.
17482

src/avatar/__tests__/avatar.test.tsx

Lines changed: 0 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -123,38 +123,4 @@ describe("Avatar", () => {
123123
const wrapper = renderAvatar({ ariaLabel, initials: "JD", tooltipText: "Jane Doe" });
124124
expect(wrapper.getElement()).toHaveAttribute("aria-label", ariaLabel);
125125
});
126-
127-
test("style api", () => {
128-
const ariaLabel = "User avatar JD Jane Doe";
129-
const wrapper = renderAvatar({
130-
ariaLabel,
131-
initials: "JD",
132-
tooltipText: "Jane Doe",
133-
style: {
134-
root: {
135-
background: "#000",
136-
borderColor: "magenta",
137-
borderRadius: "16px",
138-
borderWidth: "8px",
139-
boxShadow: "0px 0px 10px blue",
140-
color: "#fff",
141-
},
142-
},
143-
});
144-
145-
expect(getComputedStyle(wrapper.getElement()).getPropertyValue("background")).toBe("rgb(0, 0, 0)");
146-
expect(getComputedStyle(wrapper.getElement()).getPropertyValue("border-radius")).toBe("16px");
147-
expect(getComputedStyle(wrapper.getElement()).getPropertyValue("box-shadow")).toBe("0px 0px 10px blue");
148-
expect(getComputedStyle(wrapper.getElement()).getPropertyValue("color")).toBe("rgb(255, 255, 255)");
149-
150-
expect(
151-
getComputedStyle(wrapper.findByClassName(avatarStyles.content)!.getElement()).getPropertyValue("border-color"),
152-
).toBe("magenta");
153-
expect(
154-
getComputedStyle(wrapper.findByClassName(avatarStyles.content)!.getElement()).getPropertyValue("border-radius"),
155-
).toBe("16px");
156-
expect(
157-
getComputedStyle(wrapper.findByClassName(avatarStyles.content)!.getElement()).getPropertyValue("border-width"),
158-
).toBe("8px");
159-
});
160126
});

src/avatar/interfaces.ts

Lines changed: 0 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -62,22 +62,6 @@ export interface AvatarProps {
6262
*/
6363
imgUrl?: string;
6464

65-
/**
66-
* Specifies an object of selectors and properties that are used to apply custom styles.
67-
*
68-
* - `root.background` (string) - (Optional) Background of the avatar.
69-
* - `root.borderColor` (string) - (Optional) Border color of the avatar.
70-
* - `root.borderRadius` (string) - (Optional) Border radius of the avatar.
71-
* - `root.borderWidth` (string) - (Optional) Border width of the avatar.
72-
* - `root.boxShadow` (string) - (Optional) Box shadow of the avatar.
73-
* - `root.color` (string) - (Optional) Text color of the avatar.
74-
* - `root.focusRing.borderColor` (string) - (Optional) Focus ring border color.
75-
* - `root.focusRing.borderRadius` (string) - (Optional) Focus ring border radius.
76-
* - `root.focusRing.borderWidth` (string) - (Optional) Focus ring border width.
77-
* @awsuiSystem core
78-
*/
79-
style?: AvatarProps.Style;
80-
8165
/**
8266
* Defines the width and height of the avatar.
8367
* This value corresponds to the `width` CSS-property and will center and crop images using `object-fit: cover`.
@@ -88,20 +72,4 @@ export interface AvatarProps {
8872

8973
export namespace AvatarProps {
9074
export type Color = "default" | "gen-ai";
91-
92-
export interface Style {
93-
root?: {
94-
background?: string;
95-
borderColor?: string;
96-
borderRadius?: string;
97-
borderWidth?: string;
98-
boxShadow?: string;
99-
color?: string;
100-
focusRing?: {
101-
borderColor?: string;
102-
borderRadius?: string;
103-
borderWidth?: string;
104-
};
105-
};
106-
}
10775
}

0 commit comments

Comments
 (0)