Skip to content
This repository was archived by the owner on Oct 1, 2024. It is now read-only.

Commit 3441eae

Browse files
martinjagodicmartinjagodic
committed
chore: remove react-toggled (decaporg#6876)
* feat: remove react-toggled wip: tests dont pass yet * fix: update snapshots
1 parent d1ee3ed commit 3441eae

File tree

5 files changed

+39
-41
lines changed

5 files changed

+39
-41
lines changed

‎packages/decap-cms-core/src/components/Editor/EditorToolbar.js

+1
Original file line numberDiff line numberDiff line change
@@ -451,6 +451,7 @@ export class EditorToolbar extends React.Component {
451451
<ToolbarDropdown
452452
dropdownTopOverlap="40px"
453453
dropdownWidth="150px"
454+
key="td-publish-create"
454455
renderButton={() => (
455456
<PublishedToolbarButton>
456457
{isPersisting

‎packages/decap-cms-core/src/components/Editor/__tests__/__snapshots__/EditorToolbar.spec.js.snap

+15-15
Original file line numberDiff line numberDiff line change
@@ -200,7 +200,7 @@ exports[`EditorToolbar should render normal save button 1`] = `
200200
class="emotion-21 emotion-22"
201201
>
202202
<mock-link
203-
classname="css-16gdrpq-ToolbarSectionBackLink-toolbarSection e1d2l9mo8"
203+
classname="css-h6rugo-ToolbarSectionBackLink-toolbarSection e1d2l9mo8"
204204
to=""
205205
>
206206
<div
@@ -463,7 +463,7 @@ exports[`EditorToolbar should render normal save button 2`] = `
463463
class="emotion-21 emotion-22"
464464
>
465465
<mock-link
466-
classname="css-16gdrpq-ToolbarSectionBackLink-toolbarSection e1d2l9mo8"
466+
classname="css-h6rugo-ToolbarSectionBackLink-toolbarSection e1d2l9mo8"
467467
to=""
468468
>
469469
<div
@@ -695,7 +695,7 @@ exports[`EditorToolbar should render with default props 1`] = `
695695
class="emotion-18 emotion-19"
696696
>
697697
<mock-link
698-
classname="css-16gdrpq-ToolbarSectionBackLink-toolbarSection e1d2l9mo8"
698+
classname="css-h6rugo-ToolbarSectionBackLink-toolbarSection e1d2l9mo8"
699699
to=""
700700
>
701701
<div
@@ -980,7 +980,7 @@ exports[`EditorToolbar should render with status=draft,useOpenAuthoring=false 1`
980980
class="emotion-23 emotion-24"
981981
>
982982
<mock-link
983-
classname="css-16gdrpq-ToolbarSectionBackLink-toolbarSection e1d2l9mo8"
983+
classname="css-h6rugo-ToolbarSectionBackLink-toolbarSection e1d2l9mo8"
984984
to=""
985985
>
986986
<div
@@ -1310,7 +1310,7 @@ exports[`EditorToolbar should render with status=draft,useOpenAuthoring=true 1`]
13101310
class="emotion-30 emotion-31"
13111311
>
13121312
<mock-link
1313-
classname="css-16gdrpq-ToolbarSectionBackLink-toolbarSection e1d2l9mo8"
1313+
classname="css-h6rugo-ToolbarSectionBackLink-toolbarSection e1d2l9mo8"
13141314
to=""
13151315
>
13161316
<div
@@ -1634,7 +1634,7 @@ exports[`EditorToolbar should render with status=pending_publish,useOpenAuthorin
16341634
class="emotion-23 emotion-24"
16351635
>
16361636
<mock-link
1637-
classname="css-16gdrpq-ToolbarSectionBackLink-toolbarSection e1d2l9mo8"
1637+
classname="css-h6rugo-ToolbarSectionBackLink-toolbarSection e1d2l9mo8"
16381638
to=""
16391639
>
16401640
<div
@@ -1946,7 +1946,7 @@ exports[`EditorToolbar should render with status=pending_publish,useOpenAuthorin
19461946
class="emotion-28 emotion-29"
19471947
>
19481948
<mock-link
1949-
classname="css-16gdrpq-ToolbarSectionBackLink-toolbarSection e1d2l9mo8"
1949+
classname="css-h6rugo-ToolbarSectionBackLink-toolbarSection e1d2l9mo8"
19501950
to=""
19511951
>
19521952
<div
@@ -2265,7 +2265,7 @@ exports[`EditorToolbar should render with status=pending_review,useOpenAuthoring
22652265
class="emotion-23 emotion-24"
22662266
>
22672267
<mock-link
2268-
classname="css-16gdrpq-ToolbarSectionBackLink-toolbarSection e1d2l9mo8"
2268+
classname="css-h6rugo-ToolbarSectionBackLink-toolbarSection e1d2l9mo8"
22692269
to=""
22702270
>
22712271
<div
@@ -2595,7 +2595,7 @@ exports[`EditorToolbar should render with status=pending_review,useOpenAuthoring
25952595
class="emotion-30 emotion-31"
25962596
>
25972597
<mock-link
2598-
classname="css-16gdrpq-ToolbarSectionBackLink-toolbarSection e1d2l9mo8"
2598+
classname="css-h6rugo-ToolbarSectionBackLink-toolbarSection e1d2l9mo8"
25992599
to=""
26002600
>
26012601
<div
@@ -2862,7 +2862,7 @@ exports[`EditorToolbar should render with workflow controls hasUnpublishedChange
28622862
class="emotion-18 emotion-19"
28632863
>
28642864
<mock-link
2865-
classname="css-16gdrpq-ToolbarSectionBackLink-toolbarSection e1d2l9mo8"
2865+
classname="css-h6rugo-ToolbarSectionBackLink-toolbarSection e1d2l9mo8"
28662866
to=""
28672867
>
28682868
<div
@@ -3064,7 +3064,7 @@ exports[`EditorToolbar should render with workflow controls hasUnpublishedChange
30643064
class="emotion-16 emotion-17"
30653065
>
30663066
<mock-link
3067-
classname="css-16gdrpq-ToolbarSectionBackLink-toolbarSection e1d2l9mo8"
3067+
classname="css-h6rugo-ToolbarSectionBackLink-toolbarSection e1d2l9mo8"
30683068
to=""
30693069
>
30703070
<div
@@ -3286,7 +3286,7 @@ exports[`EditorToolbar should render with workflow controls hasUnpublishedChange
32863286
class="emotion-18 emotion-19"
32873287
>
32883288
<mock-link
3289-
classname="css-16gdrpq-ToolbarSectionBackLink-toolbarSection e1d2l9mo8"
3289+
classname="css-h6rugo-ToolbarSectionBackLink-toolbarSection e1d2l9mo8"
32903290
to=""
32913291
>
32923292
<div
@@ -3513,7 +3513,7 @@ exports[`EditorToolbar should render with workflow controls hasUnpublishedChange
35133513
class="emotion-18 emotion-19"
35143514
>
35153515
<mock-link
3516-
classname="css-16gdrpq-ToolbarSectionBackLink-toolbarSection e1d2l9mo8"
3516+
classname="css-h6rugo-ToolbarSectionBackLink-toolbarSection e1d2l9mo8"
35173517
to=""
35183518
>
35193519
<div
@@ -3740,7 +3740,7 @@ exports[`EditorToolbar should render with workflow controls hasUnpublishedChange
37403740
class="emotion-18 emotion-19"
37413741
>
37423742
<mock-link
3743-
classname="css-16gdrpq-ToolbarSectionBackLink-toolbarSection e1d2l9mo8"
3743+
classname="css-h6rugo-ToolbarSectionBackLink-toolbarSection e1d2l9mo8"
37443744
to=""
37453745
>
37463746
<div
@@ -3967,7 +3967,7 @@ exports[`EditorToolbar should render with workflow controls hasUnpublishedChange
39673967
class="emotion-18 emotion-19"
39683968
>
39693969
<mock-link
3970-
classname="css-16gdrpq-ToolbarSectionBackLink-toolbarSection e1d2l9mo8"
3970+
classname="css-h6rugo-ToolbarSectionBackLink-toolbarSection e1d2l9mo8"
39713971
to=""
39723972
>
39733973
<div

‎packages/decap-cms-ui-default/package.json

-1
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,6 @@
1818
},
1919
"dependencies": {
2020
"react-aria-menubutton": "^7.0.0",
21-
"react-toggled": "^1.1.2",
2221
"react-transition-group": "^4.4.5"
2322
},
2423
"peerDependencies": {

‎packages/decap-cms-ui-default/src/Toggle.js

+23-20
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,7 @@
1-
import React from 'react';
1+
import React, { useState } from 'react';
22
import PropTypes from 'prop-types';
33
import styled from '@emotion/styled';
44
import { css } from '@emotion/core';
5-
import ReactToggled from 'react-toggled';
65

76
import { colors, colorsRaw, shadows, transitions } from './styles';
87

@@ -56,25 +55,29 @@ function Toggle({
5655
Background = ToggleBackground,
5756
Handle = ToggleHandle,
5857
}) {
58+
const [isActive, setIsActive] = useState(active);
59+
60+
function handleToggle() {
61+
setIsActive(prevIsActive => !prevIsActive);
62+
if (onChange) {
63+
onChange(!isActive);
64+
}
65+
}
66+
5967
return (
60-
<ReactToggled on={active} onToggle={onChange}>
61-
{({ on, getTogglerProps }) => (
62-
<Container
63-
id={id}
64-
onFocus={onFocus}
65-
onBlur={onBlur}
66-
className={className}
67-
{...getTogglerProps({
68-
role: 'switch',
69-
'aria-checked': on.toString(),
70-
'aria-expanded': null,
71-
})}
72-
>
73-
<Background isActive={on} />
74-
<Handle isActive={on} />
75-
</Container>
76-
)}
77-
</ReactToggled>
68+
<Container
69+
id={id}
70+
onFocus={onFocus}
71+
onBlur={onBlur}
72+
className={className}
73+
onClick={handleToggle}
74+
role="switch"
75+
aria-checked={isActive?.toString()}
76+
aria-expanded={null}
77+
>
78+
<Background isActive={isActive} />
79+
<Handle isActive={isActive} />
80+
</Container>
7881
);
7982
}
8083

‎yarn.lock

-5
Original file line numberDiff line numberDiff line change
@@ -16328,11 +16328,6 @@ react-toastify@^9.1.1:
1632816328
dependencies:
1632916329
clsx "^1.1.1"
1633016330

16331-
react-toggled@^1.1.2:
16332-
version "1.2.7"
16333-
resolved "https://registry.yarnpkg.com/react-toggled/-/react-toggled-1.2.7.tgz#be1b72058358dd1ffe11811e4427e5c9cf140c10"
16334-
integrity sha512-3am1uA5ZzDwUkReEuUkK+fJ0DAYcGiLraWEPqXfL1kKD/NHbbB7fB/t+5FflMGd+FA6n9hih1es4pui1yzKi0w==
16335-
1633616331
react-topbar-progress-indicator@^4.0.0:
1633716332
version "4.1.1"
1633816333
resolved "https://registry.yarnpkg.com/react-topbar-progress-indicator/-/react-topbar-progress-indicator-4.1.1.tgz#58d89114b8ddc2ec6e6235495bff7ab39900d100"

0 commit comments

Comments
 (0)