diff --git a/src/actions/actionProperties.tsx b/src/actions/actionProperties.tsx
index eba0d21e..b195c8aa 100644
--- a/src/actions/actionProperties.tsx
+++ b/src/actions/actionProperties.tsx
@@ -35,7 +35,10 @@ export const actionChangeStrokeColor: Action = {
Stroke
element.strokeColor)}
+ color={
+ getSelectedAttribute(elements, element => element.strokeColor) ||
+ appState.currentItemStrokeColor
+ }
onChange={updateData}
/>
>
@@ -54,15 +57,15 @@ export const actionChangeBackgroundColor: Action = {
appState: { ...appState, currentItemBackgroundColor: value }
};
},
- PanelComponent: ({ elements, updateData }) => (
+ PanelComponent: ({ elements, appState, updateData }) => (
<>
Background
element.backgroundColor
- )}
+ color={
+ getSelectedAttribute(elements, element => element.backgroundColor) ||
+ appState.currentItemBackgroundColor
+ }
onChange={updateData}
/>
>
diff --git a/src/index.tsx b/src/index.tsx
index 92ffd423..30abc0b6 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -343,8 +343,12 @@ export class App extends React.Component<{}, AppState> {
};
private renderSelectedShapeActions(elements: readonly ExcalidrawElement[]) {
+ const { elementType } = this.state;
const selectedElements = elements.filter(el => el.isSelected);
- if (selectedElements.length === 0) {
+ const hasSelectedElements = selectedElements.length > 0;
+ const isTextToolSelected = elementType === "text";
+ const isShapeToolSelected = elementType !== "selection";
+ if (!(hasSelectedElements || isShapeToolSelected || isTextToolSelected)) {
return null;
}
@@ -358,7 +362,8 @@ export class App extends React.Component<{}, AppState> {
this.syncActionResult
)}
- {hasBackground(elements) && (
+ {(hasBackground(elements) ||
+ (isShapeToolSelected && !isTextToolSelected)) && (
<>
{this.actionManager.renderAction(
"changeBackgroundColor",
@@ -377,7 +382,8 @@ export class App extends React.Component<{}, AppState> {
>
)}
- {hasStroke(elements) && (
+ {(hasStroke(elements) ||
+ (isShapeToolSelected && !isTextToolSelected)) && (
<>
{this.actionManager.renderAction(
"changeStrokeWidth",
@@ -396,7 +402,7 @@ export class App extends React.Component<{}, AppState> {
>
)}
- {hasText(elements) && (
+ {(hasText(elements) || isTextToolSelected) && (
<>
{this.actionManager.renderAction(
"changeFontSize",