flash-notifications 0.0.23 → 0.0.25

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/container/index.jsx"],"names":[],"mappings":";;kBAE8C,OAAO"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/container/index.jsx"],"names":[],"mappings":";;kBAG8C,OAAO"}
@@ -1,25 +1,18 @@
1
- import useEventEmitter from "@kaspernj/api-maker/build/use-event-emitter";
2
1
  import { digg } from "diggerize";
2
+ import PropTypes from "prop-types";
3
+ import propTypesExact from "prop-types-exact";
3
4
  import React, { memo, useEffect, useMemo } from "react";
4
- import { StyleSheet, View } from "react-native";
5
5
  import { shapeComponent, ShapeComponent } from "set-state-compare/src/shape-component";
6
+ import useBreakpoint from "@kaspernj/api-maker/build/use-breakpoint";
7
+ import useEventEmitter from "@kaspernj/api-maker/build/use-event-emitter";
6
8
  import useEnvSense from "env-sense/src/use-env-sense.js";
7
- import useStyles from "@kaspernj/api-maker/build/use-styles.js";
9
+ import { View } from "react-native";
8
10
  import events from "../events";
9
11
  import Notification from "./notification";
10
- const styles = StyleSheet.create({
11
- view: {
12
- zIndex: 99999
13
- },
14
- viewSmDown: {
15
- right: 20,
16
- left: 20
17
- },
18
- viewMdUp: {
19
- right: 20
20
- }
21
- });
22
12
  export default memo(shapeComponent(class FlashNotificationsContainer extends ShapeComponent {
13
+ static propTypes = propTypesExact({
14
+ insets: PropTypes.object
15
+ });
23
16
  timeouts = [];
24
17
  setup() {
25
18
  this.useStates({
@@ -36,15 +29,35 @@ export default memo(shapeComponent(class FlashNotificationsContainer extends Sha
36
29
  }, []);
37
30
  }
38
31
  render() {
32
+ const insets = this.props.insets || {};
33
+ const { smDown, mdUp } = useBreakpoint();
39
34
  const { isNative } = useEnvSense();
40
- const viewStyleFromStyles = useStyles(styles, "view");
41
- const viewStyle = useMemo(() => [
42
- viewStyleFromStyles,
43
- {
44
- position: isNative ? "absolute" : "fixed",
45
- top: 20
35
+ const viewStyle = useMemo(() => {
36
+ let top = 20;
37
+ let right = 0;
38
+ let left = undefined;
39
+ if (insets.top)
40
+ top += insets.top;
41
+ if (insets.right)
42
+ right += insets.right;
43
+ if (smDown) {
44
+ left = 20;
45
+ if (insets.left)
46
+ left += insets.left;
47
+ right += 20;
46
48
  }
47
- ], []);
49
+ else if (mdUp) {
50
+ right += 20;
51
+ }
52
+ const style = {
53
+ position: isNative ? "absolute" : "fixed",
54
+ top,
55
+ right,
56
+ left,
57
+ zIndex: 99999
58
+ };
59
+ return style;
60
+ }, [isNative, smDown, mdUp, insets.top, insets.right, insets.left]);
48
61
  return (React.createElement(View, { dataSet: this.rootViewDataSet ||= { component: "flash-notifications-container" }, style: viewStyle, testID: "flash-notificaitons/container" }, this.s.notifications.map((notification) => React.createElement(Notification, { count: notification.count, key: `notification-${notification.count}`, message: notification.message, notification: notification, onRemovedClicked: this.tt.onRemovedClicked, title: notification.title, type: notification.type }))));
49
62
  }
50
63
  onPushNotification = (detail) => {
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/container/index.jsx"],"names":[],"mappings":"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","sourcesContent":["import useEventEmitter from \"@kaspernj/api-maker/build/use-event-emitter\"\nimport {digg} from \"diggerize\"\nimport React, {memo, useEffect, useMemo} from \"react\"\nimport {StyleSheet, View} from \"react-native\"\nimport {shapeComponent, ShapeComponent} from \"set-state-compare/src/shape-component\"\nimport useEnvSense from \"env-sense/src/use-env-sense.js\"\nimport useStyles from \"@kaspernj/api-maker/build/use-styles.js\"\n\nimport events from \"../events\"\nimport Notification from \"./notification\"\n\nconst styles = StyleSheet.create({\n view: {\n zIndex: 99999\n },\n viewSmDown: {\n right: 20,\n left: 20\n },\n viewMdUp: {\n right: 20\n }\n})\n\nexport default memo(shapeComponent(class FlashNotificationsContainer extends ShapeComponent {\n timeouts = []\n\n setup() {\n this.useStates({\n count: 0,\n notifications: []\n })\n\n useEventEmitter(events, \"pushNotification\", this.tt.onPushNotification)\n useEffect(() => {\n return () => {\n for (const timeout of this.tt.timeouts) {\n clearTimeout(timeout)\n }\n }\n }, [])\n }\n\n render() {\n const {isNative} = useEnvSense()\n const viewStyleFromStyles = useStyles(styles, \"view\")\n const viewStyle = useMemo(() => [\n viewStyleFromStyles,\n {\n position: isNative ? \"absolute\" : \"fixed\",\n top: 20\n }\n ], [])\n\n return (\n <View\n dataSet={this.rootViewDataSet ||= {component: \"flash-notifications-container\"}}\n style={viewStyle}\n testID=\"flash-notificaitons/container\"\n >\n {this.s.notifications.map((notification) =>\n <Notification\n count={notification.count}\n key={`notification-${notification.count}`}\n message={notification.message}\n notification={notification}\n onRemovedClicked={this.tt.onRemovedClicked}\n title={notification.title}\n type={notification.type}\n />\n )}\n </View>\n )\n }\n\n onPushNotification = (detail) => {\n const count = this.s.count + 1\n const timeout = setTimeout(() => this.removeNotification(count), 4000)\n\n this.tt.timeouts.push(timeout)\n\n const notification = {\n count,\n message: digg(detail, \"message\"),\n title: digg(detail, \"title\"),\n type: digg(detail, \"type\")\n }\n\n this.setState({count, notifications: this.s.notifications.concat([notification])})\n }\n\n onRemovedClicked = (notification) => this.removeNotification(digg(notification, \"count\"))\n\n removeNotification = (count) => {\n this.setState({\n notifications: this.s.notifications.filter((notification) => notification.count != count)\n })\n }\n}))\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/container/index.jsx"],"names":[],"mappings":"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","sourcesContent":["import {digg} from \"diggerize\"\nimport PropTypes from \"prop-types\"\nimport propTypesExact from \"prop-types-exact\"\nimport React, {memo, useEffect, useMemo} from \"react\"\nimport {shapeComponent, ShapeComponent} from \"set-state-compare/src/shape-component\"\nimport useBreakpoint from \"@kaspernj/api-maker/build/use-breakpoint\"\nimport useEventEmitter from \"@kaspernj/api-maker/build/use-event-emitter\"\nimport useEnvSense from \"env-sense/src/use-env-sense.js\"\nimport {View} from \"react-native\"\n\nimport events from \"../events\"\nimport Notification from \"./notification\"\n\nexport default memo(shapeComponent(class FlashNotificationsContainer extends ShapeComponent {\n static propTypes = propTypesExact({\n insets: PropTypes.object\n })\n\n timeouts = []\n\n setup() {\n this.useStates({\n count: 0,\n notifications: []\n })\n\n useEventEmitter(events, \"pushNotification\", this.tt.onPushNotification)\n useEffect(() => {\n return () => {\n for (const timeout of this.tt.timeouts) {\n clearTimeout(timeout)\n }\n }\n }, [])\n }\n\n render() {\n const insets = this.props.insets || {}\n const {smDown, mdUp} = useBreakpoint()\n const {isNative} = useEnvSense()\n\n const viewStyle = useMemo(() => {\n let top = 20\n let right = 0\n let left = undefined\n\n if (insets.top) top += insets.top\n if (insets.right) right += insets.right\n\n if (smDown) {\n left = 20\n\n if (insets.left) left += insets.left\n\n right += 20\n } else if (mdUp) {\n right += 20\n }\n\n const style = {\n position: isNative ? \"absolute\" : \"fixed\",\n top,\n right,\n left,\n zIndex: 99999\n }\n\n return style\n }, [isNative, smDown, mdUp, insets.top, insets.right, insets.left])\n\n return (\n <View\n dataSet={this.rootViewDataSet ||= {component: \"flash-notifications-container\"}}\n style={viewStyle}\n testID=\"flash-notificaitons/container\"\n >\n {this.s.notifications.map((notification) =>\n <Notification\n count={notification.count}\n key={`notification-${notification.count}`}\n message={notification.message}\n notification={notification}\n onRemovedClicked={this.tt.onRemovedClicked}\n title={notification.title}\n type={notification.type}\n />\n )}\n </View>\n )\n }\n\n onPushNotification = (detail) => {\n const count = this.s.count + 1\n const timeout = setTimeout(() => this.removeNotification(count), 4000)\n\n this.tt.timeouts.push(timeout)\n\n const notification = {\n count,\n message: digg(detail, \"message\"),\n title: digg(detail, \"title\"),\n type: digg(detail, \"type\")\n }\n\n this.setState({count, notifications: this.s.notifications.concat([notification])})\n }\n\n onRemovedClicked = (notification) => this.removeNotification(digg(notification, \"count\"))\n\n removeNotification = (count) => {\n this.setState({\n notifications: this.s.notifications.filter((notification) => notification.count != count)\n })\n }\n}))\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "flash-notifications",
3
- "version": "0.0.23",
3
+ "version": "0.0.25",
4
4
  "description": "My new module",
5
5
  "main": "build/index.js",
6
6
  "types": "build/index.d.ts",
@@ -1,28 +1,21 @@
1
- import useEventEmitter from "@kaspernj/api-maker/build/use-event-emitter"
2
1
  import {digg} from "diggerize"
2
+ import PropTypes from "prop-types"
3
+ import propTypesExact from "prop-types-exact"
3
4
  import React, {memo, useEffect, useMemo} from "react"
4
- import {StyleSheet, View} from "react-native"
5
5
  import {shapeComponent, ShapeComponent} from "set-state-compare/src/shape-component"
6
+ import useBreakpoint from "@kaspernj/api-maker/build/use-breakpoint"
7
+ import useEventEmitter from "@kaspernj/api-maker/build/use-event-emitter"
6
8
  import useEnvSense from "env-sense/src/use-env-sense.js"
7
- import useStyles from "@kaspernj/api-maker/build/use-styles.js"
9
+ import {View} from "react-native"
8
10
 
9
11
  import events from "../events"
10
12
  import Notification from "./notification"
11
13
 
12
- const styles = StyleSheet.create({
13
- view: {
14
- zIndex: 99999
15
- },
16
- viewSmDown: {
17
- right: 20,
18
- left: 20
19
- },
20
- viewMdUp: {
21
- right: 20
22
- }
23
- })
24
-
25
14
  export default memo(shapeComponent(class FlashNotificationsContainer extends ShapeComponent {
15
+ static propTypes = propTypesExact({
16
+ insets: PropTypes.object
17
+ })
18
+
26
19
  timeouts = []
27
20
 
28
21
  setup() {
@@ -42,15 +35,38 @@ export default memo(shapeComponent(class FlashNotificationsContainer extends Sha
42
35
  }
43
36
 
44
37
  render() {
38
+ const insets = this.props.insets || {}
39
+ const {smDown, mdUp} = useBreakpoint()
45
40
  const {isNative} = useEnvSense()
46
- const viewStyleFromStyles = useStyles(styles, "view")
47
- const viewStyle = useMemo(() => [
48
- viewStyleFromStyles,
49
- {
41
+
42
+ const viewStyle = useMemo(() => {
43
+ let top = 20
44
+ let right = 0
45
+ let left = undefined
46
+
47
+ if (insets.top) top += insets.top
48
+ if (insets.right) right += insets.right
49
+
50
+ if (smDown) {
51
+ left = 20
52
+
53
+ if (insets.left) left += insets.left
54
+
55
+ right += 20
56
+ } else if (mdUp) {
57
+ right += 20
58
+ }
59
+
60
+ const style = {
50
61
  position: isNative ? "absolute" : "fixed",
51
- top: 20
62
+ top,
63
+ right,
64
+ left,
65
+ zIndex: 99999
52
66
  }
53
- ], [])
67
+
68
+ return style
69
+ }, [isNative, smDown, mdUp, insets.top, insets.right, insets.left])
54
70
 
55
71
  return (
56
72
  <View