flash-notifications 0.0.23 → 0.0.24

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,26 @@ 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
- {
35
+ const viewStyle = useMemo(() => {
36
+ const style = {
44
37
  position: isNative ? "absolute" : "fixed",
45
- top: 20
38
+ top: 20 + insets.top,
39
+ right: insets.right,
40
+ left: insets.left,
41
+ zIndex: 99999
42
+ };
43
+ if (smDown) {
44
+ style.left += 20;
45
+ style.right += 20;
46
+ }
47
+ else if (mdUp) {
48
+ style.right += 20;
46
49
  }
47
- ], []);
50
+ return style;
51
+ }, [isNative, smDown, mdUp, insets.top, insets.right, insets.bottom, insets.left]);
48
52
  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
53
  }
50
54
  onPushNotification = (detail) => {
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/container/index.jsx"],"names":[],"mappings":"AAAA,OAAO,eAAe,MAAM,6CAA6C,CAAA;AACzE,OAAO,EAAC,IAAI,EAAC,MAAM,WAAW,CAAA;AAC9B,OAAO,KAAK,EAAE,EAAC,IAAI,EAAE,SAAS,EAAE,OAAO,EAAC,MAAM,OAAO,CAAA;AACrD,OAAO,EAAC,UAAU,EAAE,IAAI,EAAC,MAAM,cAAc,CAAA;AAC7C,OAAO,EAAC,cAAc,EAAE,cAAc,EAAC,MAAM,uCAAuC,CAAA;AACpF,OAAO,WAAW,MAAM,gCAAgC,CAAA;AACxD,OAAO,SAAS,MAAM,yCAAyC,CAAA;AAE/D,OAAO,MAAM,MAAM,WAAW,CAAA;AAC9B,OAAO,YAAY,MAAM,gBAAgB,CAAA;AAEzC,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;IAC/B,IAAI,EAAE;QACJ,MAAM,EAAE,KAAK;KACd;IACD,UAAU,EAAE;QACV,KAAK,EAAE,EAAE;QACT,IAAI,EAAE,EAAE;KACT;IACD,QAAQ,EAAE;QACR,KAAK,EAAE,EAAE;KACV;CACF,CAAC,CAAA;AAEF,eAAe,IAAI,CAAC,cAAc,CAAC,MAAM,2BAA4B,SAAQ,cAAc;IACzF,QAAQ,GAAG,EAAE,CAAA;IAEb,KAAK;QACH,IAAI,CAAC,SAAS,CAAC;YACb,KAAK,EAAE,CAAC;YACR,aAAa,EAAE,EAAE;SAClB,CAAC,CAAA;QAEF,eAAe,CAAC,MAAM,EAAE,kBAAkB,EAAE,IAAI,CAAC,EAAE,CAAC,kBAAkB,CAAC,CAAA;QACvE,SAAS,CAAC,GAAG,EAAE;YACb,OAAO,GAAG,EAAE;gBACV,KAAK,MAAM,OAAO,IAAI,IAAI,CAAC,EAAE,CAAC,QAAQ,EAAE,CAAC;oBACvC,YAAY,CAAC,OAAO,CAAC,CAAA;gBACvB,CAAC;YACH,CAAC,CAAA;QACH,CAAC,EAAE,EAAE,CAAC,CAAA;IACR,CAAC;IAED,MAAM;QACJ,MAAM,EAAC,QAAQ,EAAC,GAAG,WAAW,EAAE,CAAA;QAChC,MAAM,mBAAmB,GAAG,SAAS,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;QACrD,MAAM,SAAS,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC;YAC9B,mBAAmB;YACnB;gBACE,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,OAAO;gBACzC,GAAG,EAAE,EAAE;aACR;SACF,EAAE,EAAE,CAAC,CAAA;QAEN,OAAO,CACL,oBAAC,IAAI,IACH,OAAO,EAAE,IAAI,CAAC,eAAe,KAAK,EAAC,SAAS,EAAE,+BAA+B,EAAC,EAC9E,KAAK,EAAE,SAAS,EAChB,MAAM,EAAC,+BAA+B,IAErC,IAAI,CAAC,CAAC,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,YAAY,EAAE,EAAE,CACzC,oBAAC,YAAY,IACX,KAAK,EAAE,YAAY,CAAC,KAAK,EACzB,GAAG,EAAE,gBAAgB,YAAY,CAAC,KAAK,EAAE,EACzC,OAAO,EAAE,YAAY,CAAC,OAAO,EAC7B,YAAY,EAAE,YAAY,EAC1B,gBAAgB,EAAE,IAAI,CAAC,EAAE,CAAC,gBAAgB,EAC1C,KAAK,EAAE,YAAY,CAAC,KAAK,EACzB,IAAI,EAAE,YAAY,CAAC,IAAI,GACvB,CACH,CACI,CACR,CAAA;IACH,CAAC;IAED,kBAAkB,GAAG,CAAC,MAAM,EAAE,EAAE;QAC9B,MAAM,KAAK,GAAG,IAAI,CAAC,CAAC,CAAC,KAAK,GAAG,CAAC,CAAA;QAC9B,MAAM,OAAO,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC,EAAE,IAAI,CAAC,CAAA;QAEtE,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;QAE9B,MAAM,YAAY,GAAG;YACnB,KAAK;YACL,OAAO,EAAE,IAAI,CAAC,MAAM,EAAE,SAAS,CAAC;YAChC,KAAK,EAAE,IAAI,CAAC,MAAM,EAAE,OAAO,CAAC;YAC5B,IAAI,EAAE,IAAI,CAAC,MAAM,EAAE,MAAM,CAAC;SAC3B,CAAA;QAED,IAAI,CAAC,QAAQ,CAAC,EAAC,KAAK,EAAE,aAAa,EAAE,IAAI,CAAC,CAAC,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC,YAAY,CAAC,CAAC,EAAC,CAAC,CAAA;IACpF,CAAC,CAAA;IAED,gBAAgB,GAAG,CAAC,YAAY,EAAE,EAAE,CAAC,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,YAAY,EAAE,OAAO,CAAC,CAAC,CAAA;IAEzF,kBAAkB,GAAG,CAAC,KAAK,EAAE,EAAE;QAC7B,IAAI,CAAC,QAAQ,CAAC;YACZ,aAAa,EAAE,IAAI,CAAC,CAAC,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC,YAAY,EAAE,EAAE,CAAC,YAAY,CAAC,KAAK,IAAI,KAAK,CAAC;SAC1F,CAAC,CAAA;IACJ,CAAC,CAAA;CACF,CAAC,CAAC,CAAA","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 const style = {\n position: isNative ? \"absolute\" : \"fixed\",\n top: 20 + insets.top,\n right: insets.right,\n left: insets.left,\n zIndex: 99999\n }\n\n if (smDown) {\n style.left += 20\n style.right += 20\n } else if (mdUp) {\n style.right += 20\n }\n\n return style\n }, [isNative, smDown, mdUp, insets.top, insets.right, insets.bottom, 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.24",
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,28 @@ 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
+ const style = {
50
44
  position: isNative ? "absolute" : "fixed",
51
- top: 20
45
+ top: 20 + insets.top,
46
+ right: insets.right,
47
+ left: insets.left,
48
+ zIndex: 99999
49
+ }
50
+
51
+ if (smDown) {
52
+ style.left += 20
53
+ style.right += 20
54
+ } else if (mdUp) {
55
+ style.right += 20
52
56
  }
53
- ], [])
57
+
58
+ return style
59
+ }, [isNative, smDown, mdUp, insets.top, insets.right, insets.bottom, insets.left])
54
60
 
55
61
  return (
56
62
  <View