Commit 09b34fcb authored by chris's avatar chris
Browse files

icon and wrapper

parent 1a26b43f
......@@ -30,6 +30,8 @@ import {
TrackingAndEditingToolGroupService,
FullScreenService,
FullScreenToolGroupService,
SpecialCharactersService,
SpecialCharactersToolGroupService,
} from 'wax-prosemirror-services';
import { DefaultSchema } from 'wax-prosemirror-utilities';
......@@ -55,6 +57,7 @@ export default {
'Notes',
'Lists',
'Images',
'SpecialCharacters',
'CodeBlock',
'Tables',
'TrackingAndEditing',
......@@ -129,5 +132,7 @@ export default {
new TrackingAndEditingToolGroupService(),
new FullScreenService(),
new FullScreenToolGroupService(),
new SpecialCharactersService(),
new SpecialCharactersToolGroupService(),
],
};
/* eslint react/prop-types: 0 */
import React, { useState } from 'react';
import React from 'react';
import styled from 'styled-components';
import { grid } from '@pubsweet/ui-toolkit';
import { WaxContext } from 'wax-prosemirror-core';
import Icon from '../../helpers/Icon';
const Wrapper = styled.div`
width: 400px;
background: #fff;
font-size: 14px;
border-radius: 1.03093% / 8%;
box-shadow: rgba(9, 30, 66, 0.25) 0px 4px 8px 0px,
rgba(9, 30, 66, 0.31) 0px 0px 1px 0px;
transform-origin: 50% 50% 0px;
padding: ${grid(2)};
`;
const SpecialCharactersComponent = ({ close }) => {
return null;
return <Wrapper>Special Characters</Wrapper>;
};
export default SpecialCharactersComponent;
import React, { useRef, useMemo, useState } from 'react';
import React, { useMemo, useState } from 'react';
import styled from 'styled-components';
import { grid } from '@pubsweet/ui-toolkit';
......@@ -21,7 +21,6 @@ const DropWrapper = styled.div`
const SpecialCharactersTool = ({ view = {}, item }) => {
const { icon, title } = item;
const dropElement = useRef();
const [isOpen, setIsOpen] = useState(false);
const MemorizedDropdown = useMemo(
......@@ -38,7 +37,7 @@ const SpecialCharactersTool = ({ view = {}, item }) => {
/>
{isOpen && (
<DropWrapper ref={dropElement}>
<DropWrapper>
<SpecialCharactersComponent
close={() => {
setIsOpen(false);
......
......@@ -260,4 +260,18 @@ export default {
<path d="M5 16h3v3h2v-5H5v2zm3-8H5v2h5V5H8v3zm6 11h2v-3h3v-2h-5v5zm2-11V5h-2v5h5V8h-3z" />
</Svg>
),
specialCharacters: ({ className }) => (
<Svg className={className} viewBox="0 0 24 24" fill="none">
<g>
<rect fill="none" height="24" width="24" x="0" />
</g>
<g>
<g>
<g>
<path d="M11.88,9.14c1.28,0.06,1.61,1.15,1.63,1.66h1.79c-0.08-1.98-1.49-3.19-3.45-3.19C9.64,7.61,8,9,8,12.14 c0,1.94,0.93,4.24,3.84,4.24c2.22,0,3.41-1.65,3.44-2.95h-1.79c-0.03,0.59-0.45,1.38-1.63,1.44C10.55,14.83,10,13.81,10,12.14 C10,9.25,11.28,9.16,11.88,9.14z M12,2C6.48,2,2,6.48,2,12s4.48,10,10,10s10-4.48,10-10S17.52,2,12,2z M12,20c-4.41,0-8-3.59-8-8 s3.59-8,8-8s8,3.59,8,8S16.41,20,12,20z" />
</g>
</g>
</g>
</Svg>
),
};
......@@ -8,9 +8,9 @@ import Tools from '../lib/Tools';
export default
@injectable()
class SpecialCharacters extends Tools {
title = 'Find And Replace';
icon = 'findAndReplace';
name = 'find';
title = 'Special Characters';
icon = 'specialCharacters';
name = 'specialCharacters';
get run() {
return (state, dispatch) => {};
......
......@@ -10,4 +10,4 @@ class SpecialCharacters extends ToolGroup {
}
}
export default SpecialCharactersTool;
export default SpecialCharacters;
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment