-
-
-
diff --git a/scripts/apps/authoring/widgets/widgets.ts b/scripts/apps/authoring/widgets/widgets.ts
index 7c46afdab0..3d5f3017a8 100644
--- a/scripts/apps/authoring/widgets/widgets.ts
+++ b/scripts/apps/authoring/widgets/widgets.ts
@@ -243,7 +243,7 @@ function WidgetsManagerCtrl(
});
if (this.widgetFromPreferences) {
- let widgetFromPreferences = $scope.widgets.find((widget) =>
+ let widgetFromPreferences = $scope.widgets?.find((widget) =>
widget._id === this.widgetFromPreferences._id);
if (widgetFromPreferences) {
@@ -338,6 +338,7 @@ function WidgetsManagerCtrl(
} else {
angular.element('body').addClass('main-section--pinned-tabs');
$scope.pinnedWidget = widget;
+ $scope.active = widget;
widget.pinned = true;
this.updateUserPreferences(widget);
@@ -349,7 +350,7 @@ function WidgetsManagerCtrl(
widgetReactIntegration.pinWidget = $scope.pinWidget;
widgetReactIntegration.getActiveWidget = () => $scope.active ?? $scope.pinnedWidget;
widgetReactIntegration.getPinnedWidget =
- () => $scope.widgets.find(({pinned}) => pinned === true)?.name ?? null;
+ () => $scope.widgets?.find(({pinned}) => pinned === true)?.name ?? null;
widgetReactIntegration.WidgetHeaderComponent = WidgetHeaderComponent;
widgetReactIntegration.WidgetLayoutComponent = WidgetLayoutComponent;
@@ -377,7 +378,11 @@ function WidgetsManagerCtrl(
$scope.active.afterClose($scope);
}
- $scope.active = null;
+ if ($scope.pinnedWidget != null) {
+ $scope.active = $scope.pinnedWidget;
+ } else {
+ $scope.active = null;
+ }
};
// activate widget based on query string
diff --git a/scripts/apps/dashboard/widget-react.tsx b/scripts/apps/dashboard/widget-react.tsx
index a8c7f5ede2..fcc34b76c1 100644
--- a/scripts/apps/dashboard/widget-react.tsx
+++ b/scripts/apps/dashboard/widget-react.tsx
@@ -4,13 +4,20 @@ import React from 'react';
import {IArticle, IArticleSideWidget} from 'superdesk-api';
interface IProps {
- widget: IArticleSideWidget;
+ widget: {
+ active: IArticleSideWidget;
+ pinnedWidget: IArticleSideWidget;
+ };
article: IArticle;
}
-export class WidgetReact extends React.PureComponent {
+interface IState {
+ widgetDisplayed: IArticleSideWidget['component'];
+}
+
+export class WidgetReact extends React.PureComponent {
render() {
- const Component = this.props.widget.component;
+ const Component = this.props.widget.active?.component ?? this.props.widget?.pinnedWidget?.component;
// Ensure that widget component re-mounts if the item is locked/unlocked.
// Avoid null key in case item is unlocked - use a random string to force it to re-mount.
@@ -23,7 +30,8 @@ export class WidgetReact extends React.PureComponent {
initialState={(() => {
const localStorageWidgetState = JSON.parse(localStorage.getItem('SIDE_WIDGET') ?? 'null');
- if (localStorageWidgetState?.id === this.props.widget._id) {
+ if (localStorageWidgetState?.id
+ === (this.props.widget.active?._id ?? this.props.widget.pinnedWidget._id)) {
const initialState = localStorageWidgetState?.initialState;
localStorage.removeItem('SIDE_WIDGET');
diff --git a/scripts/core/editor3/components/custom-block.scss b/scripts/core/editor3/components/custom-block.scss
index d734d3f750..f1ad789ef3 100644
--- a/scripts/core/editor3/components/custom-block.scss
+++ b/scripts/core/editor3/components/custom-block.scss
@@ -1,6 +1,8 @@
.editor3-custom-block {
.table-block table td {
- border: 1px solid var(--sd-editor-colour__controls-border)!important;
+ border: 1px solid var(--sd-editor-colour__controls-border) !important;
+ border-radius: 0 var(--b-radius--large) var(--b-radius--large);
+ padding: var(--space--1-5) !important;
}
.table-inside table {
@@ -15,7 +17,6 @@
.editor3-custom-block--label {
font-size: 11px;
font-weight: 500;
- color: var(--color-text);
text-transform: uppercase;
letter-spacing: 0.08em;
padding-block-start: 1px; // make text be vertically in the center of the bounding box
@@ -26,21 +27,22 @@
--handle-height: 14px;
display: flex;
- padding: 4px 8px;
- padding-inline-start: 4px; // less padding for drag handle
- gap: 8px;
+ padding: var(--space--0-5) var(--space--1);
+ gap: var(--gap-1);
align-items: center;
cursor: grab;
- border-start-start-radius: 2px;
- border-start-end-radius: 2px;
-
+ border-start-start-radius: var(--b-radius--medium);
+ border-start-end-radius: var(--b-radius--medium);
background: var(--sd-editor-colour__controls-border);
-
+ opacity: 0.8;
+ transition: opacity 0.2s ease;
+ color: currentColor;
&:hover {
- background: gray;
+ opacity: 1;
}
-
&:active {
- background:var(--sd-colour-primary);
+ background-color: var(--sd-colour-interactive);
+ color: white;
+
}
}
diff --git a/scripts/core/editor3/components/toolbar/TableControls.tsx b/scripts/core/editor3/components/toolbar/TableControls.tsx
index ff2251f7cf..f2daefc503 100644
--- a/scripts/core/editor3/components/toolbar/TableControls.tsx
+++ b/scripts/core/editor3/components/toolbar/TableControls.tsx
@@ -111,14 +111,12 @@ const TableControlsComponent: React.FunctionComponent = (props) => {
return (
<>
{
- editorFormat.includes('link') && (
- setTablePopup(PopupTypes.Link, payload)}
- iconName="link"
- tooltip={gettext('Link')}
- />
- )
+ setTablePopup(PopupTypes.Link, payload)}
+ iconName="link"
+ tooltip={gettext('Link')}
+ />
}
{
@@ -129,11 +127,6 @@ const TableControlsComponent: React.FunctionComponent = (props) => {
/>
)
}
-
- setTablePopup(PopupTypes.Link, payload)}
- />
);
} else if (type in inlineStyles) {
@@ -161,6 +154,12 @@ const TableControlsComponent: React.FunctionComponent = (props) => {
}
})
}
+
+ {/* LinkToolbar must be the last node. */}
+ setTablePopup(PopupTypes.Link, payload)}
+ />
);
};
diff --git a/scripts/core/editor3/html/to-html/AtomicBlockParser.ts b/scripts/core/editor3/html/to-html/AtomicBlockParser.ts
index d43948a2a1..16bdaa6a95 100644
--- a/scripts/core/editor3/html/to-html/AtomicBlockParser.ts
+++ b/scripts/core/editor3/html/to-html/AtomicBlockParser.ts
@@ -8,6 +8,7 @@ import {CustomEditor3Entity} from 'core/editor3/constants';
import {IEditorDragDropArticleEmbed} from 'core/editor3/reducers/editor3';
import {assertNever} from 'core/helpers/typescript-helpers';
import {sdApi} from 'api';
+import {configurableAlgorithms} from 'core/ui/configurable-algorithms';
/**
* @ngdoc class
@@ -231,33 +232,24 @@ export class AtomicBlockParser {
return '';
}
- function getHighestHeadingText(el: HTMLElement): string | null {
- const headings: Array = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'];
-
- for (const tag of headings) {
- const result = el.querySelector(tag);
-
- if (result != null) {
- return result.textContent;
- }
- }
-
- return null;
- }
-
+ const vocabulary = sdApi.vocabularies.getAll().get(data.vocabularyId);
+ const blockId = vocabulary._id;
const {cells} = data;
- const blockName = sdApi.vocabularies.getAll().get(data.vocabularyId).display_name;
const cellContentState: ContentState = convertFromRaw(cells[0][0]);
const tableCellContentHtml = editor3StateToHtml(cellContentState);
- const tableCellContentElement: HTMLElement =
- new DOMParser().parseFromString(tableCellContentHtml, 'text/html').body;
- const heading: string | null = getHighestHeadingText(tableCellContentElement);
- const attributes = [`data-custom-block-type="${blockName}"`];
- if (heading != null) {
- attributes.push(`data-custom-block-title="${heading}"`);
- }
+ const attributes: Array<{name: string; value: string}> = [
+ {name: 'data-custom-block-type', value: blockId},
+ ...(
+ configurableAlgorithms.editor3?.customBlocks?.getAdditionalWrapperAttributes(
+ vocabulary,
+ tableCellContentHtml,
+ ) ?? []
+ ),
+ ];
+
+ const attributesString = attributes.map(({name, value}) => `${name}="${value}"`).join(' ');
- return `${tableCellContentHtml}
`;
+ return `${tableCellContentHtml}
`;
}
}
diff --git a/scripts/core/editor3/styles.scss b/scripts/core/editor3/styles.scss
index daab8a2bd3..43b9541819 100644
--- a/scripts/core/editor3/styles.scss
+++ b/scripts/core/editor3/styles.scss
@@ -936,7 +936,6 @@ $editor-styleButton-size: 3rem;
right: auto;
z-index: 10;
box-shadow: 0px 1px 5px #00000066;
- background-color: #f8f8f8;
}
.sd-input-style .Editor3-root {
diff --git a/scripts/core/superdesk-api.d.ts b/scripts/core/superdesk-api.d.ts
index 66fd9bff48..179d804405 100644
--- a/scripts/core/superdesk-api.d.ts
+++ b/scripts/core/superdesk-api.d.ts
@@ -2034,10 +2034,11 @@ declare module 'superdesk-api' {
export interface IConfigurableAlgorithms {
countLines?(plainText: string, lineLength: number): number;
- }
-
- export interface IConfigurableAlgorithms {
- countLines?(plainText: string, lineLength: number): number;
+ editor3?: {
+ customBlocks?: {
+ getAdditionalWrapperAttributes?(customBlockVocabulary: IVocabulary, html: string): Array<{name: string; value: string}>;
+ };
+ }
}
export interface IListItemProps {