Skip to content

Commit

Permalink
fix : address feedback from PR
Browse files Browse the repository at this point in the history
  • Loading branch information
idebenone committed Oct 18, 2024
1 parent 05f6cde commit bd0b1fd
Show file tree
Hide file tree
Showing 3 changed files with 23 additions and 13 deletions.
4 changes: 3 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -116,7 +116,7 @@ actions: [

**_NOTE:_** return value of `action` callback for settings whether action button should be toggled or not is *deprecated*. Consider using `toggle` option instead.

Enable features such as border, background tunes and caption by adding `features`-array in the configuration:
You can enable/disable features such as border, background tunes and caption by adding `features` array in the configuration:
```js
features: {
background: boolean,
Expand All @@ -126,6 +126,8 @@ features: {
}
```

**_NOTE:_** set caption to `optional` in order to configure caption as a tune.

## Output data

This Tool returns `data` with following format
Expand Down
29 changes: 18 additions & 11 deletions src/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -191,7 +191,7 @@ export default class ImageTool implements BlockTool {
* Renders Block content
*/
public render(): HTMLDivElement {
if (this.config.features && this.config.features.caption === true) {
if (this.config.features?.caption === true || (this.config.features?.caption === 'optional' && this.data.caption)) {
this.ui.applyTune('caption', true);
}

Expand Down Expand Up @@ -226,12 +226,12 @@ export default class ImageTool implements BlockTool {
// Merge default tunes with the ones that might be added by user
// @see https://github.com/editor-js/image/pull/49
const tunes = ImageTool.tunes.concat(this.config.actions || []);
const featureTuneMap: Record<string, string> = {
border: 'withBorder',
background: 'withBackground',
stretched: 'stretched',
caption: 'caption',
};
const featureTuneMap = new Map<string, string>([
['border', 'withBorder'],
['background', 'withBackground'],
['stretched', 'stretched'],
['caption', 'caption'],
]);

if (this.config.features?.caption === 'optional') {
tunes.push({
Expand All @@ -244,12 +244,19 @@ export default class ImageTool implements BlockTool {

const availableTunes = tunes.filter((tune) => {
if (this.config.features) {
const featureKey = Object.keys(featureTuneMap).find(key => featureTuneMap[key] === tune.name);
const featureKey = [...featureTuneMap.entries()].find(
([, value]) => value === tune.name
)?.[0];

if (featureKey != null) {
return this.config.features[featureKey as keyof FeaturesConfig];
}

return this.config.features[featureKey as keyof FeaturesConfig];
return false;
}
}
);

return false;
});

return availableTunes.map(tune => ({
icon: tune.icon,
Expand Down
3 changes: 2 additions & 1 deletion src/types/types.ts
Original file line number Diff line number Diff line change
Expand Up @@ -101,7 +101,7 @@ export type ImageToolData<Actions = {}, AdditionalFileData = {}> = {
} & (Actions extends Record<string, boolean> ? Actions : {});

/**
* @description Enable or disable features.
* @description Allows to enable or disable features.
*/
export type FeaturesConfig = {
/**
Expand All @@ -114,6 +114,7 @@ export type FeaturesConfig = {
border: boolean;
/**
* Flag to enable/disable caption.
* Can be set to 'optional' to allow users to toggle via block tunes.
*/
caption: boolean | 'optional';
/**
Expand Down

0 comments on commit bd0b1fd

Please sign in to comment.