aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--package-lock.json32
-rw-r--r--package.json1
-rw-r--r--src/client/views/nodes/DocumentView.tsx16
-rw-r--r--src/client/views/nodes/trails/PresBox.tsx18
4 files changed, 47 insertions, 20 deletions
diff --git a/package-lock.json b/package-lock.json
index f0f65919b..0ebba74e1 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -164,6 +164,7 @@
"rc-switch": "^4.1.0",
"react": "^18.2.0",
"react-autosuggest": "^10.1.0",
+ "react-awesome-reveal": "^4.2.7",
"react-color": "^2.19.3",
"react-compound-slider": "^3.4.0",
"react-datepicker": "^4.24.0",
@@ -29699,6 +29700,29 @@
"react": ">=16.3.0"
}
},
+ "node_modules/react-awesome-reveal": {
+ "version": "4.2.7",
+ "resolved": "https://registry.npmjs.org/react-awesome-reveal/-/react-awesome-reveal-4.2.7.tgz",
+ "integrity": "sha512-5vETORNz6df0+N+RdPlInw73WBeccfFh73JamnhfbQWwcqCmdeL0Ap5pX9RyRlTMdag5yXAH+FWN8qrnIsyWVA==",
+ "funding": [
+ {
+ "type": "github",
+ "url": "https://github.com/sponsors/morellodev"
+ },
+ {
+ "type": "opencollective",
+ "url": "https://opencollective.com/react-awesome-reveal"
+ }
+ ],
+ "dependencies": {
+ "react-intersection-observer": "^9.5.3",
+ "react-is": "^18.2.0"
+ },
+ "peerDependencies": {
+ "@emotion/react": "^11.0.0",
+ "react": ">=16.14.0"
+ }
+ },
"node_modules/react-color": {
"version": "2.19.3",
"resolved": "https://registry.npmjs.org/react-color/-/react-color-2.19.3.tgz",
@@ -29822,6 +29846,14 @@
"react": "*"
}
},
+ "node_modules/react-intersection-observer": {
+ "version": "9.5.3",
+ "resolved": "https://registry.npmjs.org/react-intersection-observer/-/react-intersection-observer-9.5.3.tgz",
+ "integrity": "sha512-NJzagSdUPS5rPhaLsHXYeJbsvdpbJwL6yCHtMk91hc0ufQ2BnXis+0QQ9NBh6n9n+Q3OyjR6OQLShYbaNBkThQ==",
+ "peerDependencies": {
+ "react": "^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0"
+ }
+ },
"node_modules/react-is": {
"version": "18.2.0",
"resolved": "https://registry.npmjs.org/react-is/-/react-is-18.2.0.tgz",
diff --git a/package.json b/package.json
index 97b50efad..127091e2d 100644
--- a/package.json
+++ b/package.json
@@ -248,6 +248,7 @@
"rc-switch": "^4.1.0",
"react": "^18.2.0",
"react-autosuggest": "^10.1.0",
+ "react-awesome-reveal": "^4.2.7",
"react-color": "^2.19.3",
"react-compound-slider": "^3.4.0",
"react-datepicker": "^4.24.0",
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index a05ea3390..2d5f68a69 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -3,7 +3,7 @@ import { Dropdown, DropdownType, Type } from 'browndash-components';
import { IReactionDisposer, action, computed, makeObservable, observable, reaction, runInAction } from 'mobx';
import { observer } from 'mobx-react';
import { computedFn } from 'mobx-utils';
-// import { Bounce, Fade, Flip, LightSpeed, Roll, Rotate, Zoom } from 'react-reveal';
+import { Bounce, Fade, Flip, JackInTheBox, Roll, Rotate, Zoom } from 'react-awesome-reveal';
import * as React from 'react';
import { Utils, emptyFunction, isTargetChildOf as isParentOf, lightOrDark, returnEmptyString, returnFalse, returnTrue, returnVal, simulateMouseClick } from '../../../Utils';
import { Doc, DocListCast, Field, Opt, StrListCast } from '../../../fields/Doc';
@@ -1264,13 +1264,13 @@ export class DocumentViewInternal extends DocComponent<DocumentViewInternalProps
switch (StrCast(presEffectDoc?.presentation_effect, StrCast(presEffectDoc?.followLinkAnimEffect))) {
default:
case PresEffect.None: return renderDoc;
- // case PresEffect.Zoom: return <Zoom {...effectProps}>{renderDoc}</Zoom>;
- // case PresEffect.Fade: return <Fade {...effectProps}>{renderDoc}</Fade>;
- // case PresEffect.Flip: return <Flip {...effectProps}>{renderDoc}</Flip>;
- // case PresEffect.Rotate: return <Rotate {...effectProps}>{renderDoc}</Rotate>;
- // case PresEffect.Bounce: return <Bounce {...effectProps}>{renderDoc}</Bounce>;
- // case PresEffect.Roll: return <Roll {...effectProps}>{renderDoc}</Roll>;
- // case PresEffect.Lightspeed: return <LightSpeed {...effectProps}>{renderDoc}</LightSpeed>;
+ case PresEffect.Zoom: return <Zoom {...effectProps}>{renderDoc}</Zoom>;
+ case PresEffect.Fade: return <Fade {...effectProps}>{renderDoc}</Fade>;
+ case PresEffect.Flip: return <Flip {...effectProps}>{renderDoc}</Flip>;
+ case PresEffect.Rotate: return <Rotate {...effectProps}>{renderDoc}</Rotate>;
+ case PresEffect.Bounce: return <Bounce {...effectProps}>{renderDoc}</Bounce>;
+ case PresEffect.Roll: return <Roll {...effectProps}>{renderDoc}</Roll>;
+ case PresEffect.Lightspeed: return <JackInTheBox {...effectProps}>{renderDoc}</JackInTheBox>;
}
}
@computed get highlighting() {
diff --git a/src/client/views/nodes/trails/PresBox.tsx b/src/client/views/nodes/trails/PresBox.tsx
index 17993d88e..e213b2fc5 100644
--- a/src/client/views/nodes/trails/PresBox.tsx
+++ b/src/client/views/nodes/trails/PresBox.tsx
@@ -1671,12 +1671,9 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
className={'presBox-dropdownOptions'}
style={{ display: this._openBulletEffectDropdown ? 'grid' : 'none', color: SettingsManager.userColor, background: SettingsManager.userBackgroundColor }}
onPointerDown={e => e.stopPropagation()}>
- {bulletEffect(PresEffect.None)}
- {bulletEffect(PresEffect.Fade)}
- {bulletEffect(PresEffect.Flip)}
- {bulletEffect(PresEffect.Rotate)}
- {bulletEffect(PresEffect.Bounce)}
- {bulletEffect(PresEffect.Roll)}
+ {Object.values(PresEffect)
+ .filter(v => isNaN(Number(v)))
+ .map(effect => bulletEffect(effect))}
</div>
</div>
</div>
@@ -1840,12 +1837,9 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
display: this._openEffectDropdown ? 'grid' : 'none',
}}
onPointerDown={e => e.stopPropagation()}>
- {preseEffect(PresEffect.None)}
- {preseEffect(PresEffect.Fade)}
- {preseEffect(PresEffect.Flip)}
- {preseEffect(PresEffect.Rotate)}
- {preseEffect(PresEffect.Bounce)}
- {preseEffect(PresEffect.Roll)}
+ {Object.values(PresEffect)
+ .filter(v => isNaN(Number(v)))
+ .map(effect => preseEffect(effect))}
</div>
</div>
<div className="ribbon-doubleButton" style={{ display: effect === PresEffectDirection.None ? 'none' : 'inline-flex' }}>