Skip to content

Commit 49566f7

Browse files
committed
chore: move icon in components folder
1 parent d7c5f7b commit 49566f7

File tree

9 files changed

+75
-72
lines changed

9 files changed

+75
-72
lines changed

assets/images/infotip.js

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

assets/images/marker.js

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

src/infotip/components/icon.js

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
/**
2+
* Infotip component renders an SVG icon that represents a infotip.
3+
*
4+
* @return {JSX.Element} SVG component for a infotip icon.
5+
*/
6+
function InfotipIcon() {
7+
return (
8+
<svg
9+
width="24px"
10+
height="24px"
11+
xmlns="http://www.w3.org/2000/svg"
12+
viewBox="0 -24 100 125"
13+
version="1.1"
14+
x="0px"
15+
y="0px"
16+
>
17+
<g stroke="none" strokeWidth="1" fillRule="evenodd">
18+
<path d="M28.089,52.744 L47.281,52.744 C48.987,52.744 50.37,54.127 50.37,55.833 C50.37,57.539 48.987,58.922 47.281,58.922 L28.089,58.922 C26.383,58.922 25,57.539 25,55.833 C25,54.127 26.383,52.744 28.089,52.744 L28.089,52.744 Z M25,41.502 L25,41.502 C25,39.796 26.383,38.413 28.089,38.413 L71.911,38.413 C73.617,38.413 75,39.796 75,41.502 C75,43.208 73.617,44.591 71.911,44.591 L28.089,44.591 C26.383,44.591 25,43.208 25,41.502 L25,41.502 Z M25,27.171 L25,27.171 C25,25.465 26.383,24.082 28.089,24.082 L71.911,24.082 C73.617,24.082 75,25.465 75,27.171 C75,28.877 73.617,30.26 71.911,30.26 L28.089,30.26 C26.383,30.26 25,28.877 25,27.171 L25,27.171 Z M88.822,64 C88.822,66.107 87.107,67.822 85,67.822 L67.729,67.822 L50,82.891 L32.271,67.822 L15,67.822 C12.893,67.822 11.178,66.107 11.178,64 L11.178,19 C11.178,16.892 12.893,15.178 15,15.178 L85,15.178 C87.107,15.178 88.822,16.892 88.822,19 L88.822,64 Z M85,9 L15,9 C9.477,9 5,13.477 5,19 L5,64 C5,69.523 9.477,74 15,74 L30,74 L50,91 L70,74 L85,74 C90.523,74 95,69.523 95,64 L95,19 C95,13.477 90.523,9 85,9 L85,9 Z" />
19+
</g>
20+
</svg>
21+
);
22+
}
23+
24+
export default InfotipIcon;

src/infotip/components/index.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,3 +4,5 @@
44
export { default as IconTab } from './icon-tab';
55
export { default as OverlayTab } from './overlay-tab';
66
export { default as TextTab } from './text-tab';
7+
export { default as InfotipIcon } from './icon';
8+

src/infotip/edit.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ import { useState } from '@wordpress/element';
1111
import './editor.scss';
1212
import './style.scss';
1313
import InlineUI from './inline-ui';
14-
import InfotipIcon from '../../assets/images/infotip';
14+
import { InfotipIcon } from './components';
1515

1616
/**
1717
* Edit component for the Infotip format.

src/infotip/inline-ui.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -48,7 +48,7 @@ function InlineUI({
4848

4949
useEffect(() => {
5050
return () => {
51-
const { ownerDocument } = contentRef.current;
51+
const { ownerDocument } = contentRef;
5252
const infotips = ownerDocument.querySelectorAll('tatva-infotip');
5353
infotips.forEach((infotip) => {
5454
if (infotip && typeof infotip.hideTooltip === 'function') {

src/marker/components/icon.js

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
/**
2+
* Marker component renders an SVG icon that represents a marker.
3+
*
4+
* @return {JSX.Element} SVG component for a marker icon.
5+
*/
6+
function MarkerIcon() {
7+
return (
8+
<svg
9+
width="24px"
10+
height="24px"
11+
xmlns="http://www.w3.org/2000/svg"
12+
viewBox="-5.0 -10.0 110.0 135.0"
13+
>
14+
<path
15+
d="M90.492 24.562a8.787 8.787 0 01.285 12.125l-36.96 40.629a1.957 1.957 0 01-2.824.066L20.784 47.175a1.953 1.953 0 01.066-2.824l40.63-36.96a8.787 8.787 0 0112.124.284z"
16+
fillRule="evenodd"
17+
/>
18+
<path
19+
d="M53.754 77.387l-5.418 5.418a4.886 4.886 0 01-6.035.691c-.004 0-.004-.003-.008-.003-2.914-1.832-5.793-2.614-8.66-2.188-2.946.438-5.84 2.121-8.739 5.004a1.953 1.953 0 01-2.757-.004l-10.27-10.27a1.953 1.953 0 01-.004-2.758c2.886-2.898 4.566-5.793 5.004-8.738.425-2.867-.356-5.75-2.188-8.66 0-.004-.004-.004-.004-.008a4.881 4.881 0 01.692-6.031c2.113-2.118 5.418-5.418 5.418-5.418.761-.762 2-.762 2.761 0l30.207 30.207c.762.761.762 2 0 2.761zm-4.14-1.379L22.167 48.563l-4.035 4.035a.97.97 0 00-.137 1.203c2.387 3.793 3.297 7.57 2.743 11.31-.473 3.18-2.024 6.359-4.77 9.495l7.602 7.602c3.14-2.746 6.32-4.297 9.496-4.77 3.738-.554 7.515.356 11.312 2.747a.976.976 0 001.203-.14l4.035-4.036z"
20+
fillRule="evenodd"
21+
/>
22+
<path
23+
d="M4.867 84.551l9.14-9.14c.763-.762 2-.762 2.762 0l5.989 5.988c.762.761.762 2 0 2.761l-3.152 3.153c-.368.367-.864.57-1.38.57H6.25a1.957 1.957 0 01-1.383-3.336zM6.246 94.863a1.954 1.954 0 010-3.906H93.72a1.954 1.954 0 010 3.906z"
24+
fillRule="evenodd"
25+
/>
26+
</svg>
27+
);
28+
}
29+
30+
export default MarkerIcon;

src/marker/components/index.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,3 +4,4 @@
44
export { default as StyleTab } from './style-tab';
55
export { default as ColorTab } from './color-tab';
66
export { default as AnimationTab } from './animation-tab';
7+
export { default as MarkerIcon } from './icon';

src/marker/edit.js

Lines changed: 16 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import { RichTextToolbarButton } from '@wordpress/block-editor';
88
/**
99
* Internal dependencies
1010
*/
11-
import MarkerIcon from '../../assets/images/marker';
11+
import { MarkerIcon } from './components';
1212
import InlineUI from './inline-ui';
1313

1414
/**
@@ -22,34 +22,34 @@ import InlineUI from './inline-ui';
2222
* @param {Object} props.activeAttributes - The currently active attributes.
2323
* @return {JSX.Element} - The rendered Marker formats.
2424
*/
25-
export function Edit( {
25+
export function Edit({
2626
value,
2727
onChange,
2828
isActive,
2929
contentRef,
3030
activeAttributes,
31-
} ) {
32-
const [ isSettingOpen, setIsSettingOpen ] = useState( false );
31+
}) {
32+
const [isSettingOpen, setIsSettingOpen] = useState(false);
3333

3434
return (
3535
<>
3636
<RichTextToolbarButton
37-
icon={ <MarkerIcon /> }
38-
title={ __( 'Marker', 'blablablocks-formats' ) }
39-
onClick={ () => setIsSettingOpen( true ) }
40-
isActive={ isActive }
37+
icon={<MarkerIcon />}
38+
title={__('Marker', 'blablablocks-formats')}
39+
onClick={() => setIsSettingOpen(true)}
40+
isActive={isActive}
4141
/>
4242

43-
{ isSettingOpen && (
43+
{isSettingOpen && (
4444
<InlineUI
45-
value={ value }
46-
onChange={ onChange }
47-
onClose={ () => setIsSettingOpen( false ) }
48-
activeAttributes={ activeAttributes }
49-
contentRef={ contentRef.current }
50-
isActive={ isActive }
45+
value={value}
46+
onChange={onChange}
47+
onClose={() => setIsSettingOpen(false)}
48+
activeAttributes={activeAttributes}
49+
contentRef={contentRef.current}
50+
isActive={isActive}
5151
/>
52-
) }
52+
)}
5353
</>
5454
);
5555
}

0 commit comments

Comments
 (0)