@kaspernj/api-maker 1.0.434 → 1.0.435

package/src/utils/card.jsx

@@ -0,0 +1,49 @@
+import BaseComponent from "../base-component"
+import memo from "set-state-compare/src/memo"
+import PropTypes from "prop-types"
+import propTypesExact from "prop-types-exact"
+import {shapeComponent} from "set-state-compare/src/shape-component"
+import Text from "./text"
+
+export default memo(shapeComponent(class ApiMakerUtilsCard extends BaseComponent {
+  static propTypes = propTypesExact({
+    children: PropTypes.node,
+    controls: PropTypes.node,
+    dataSet: PropTypes.object,
+    header: PropTypes.string,
+    style: PropTypes.object
+  })
+
+  render() {
+    const {children, controls, dataSet, header, style} = this.props
+    const {component, ...restDataSet} = dataSet || {}
+    const actualDataSet = Object.assign(
+      {component: classNames("api-maker/utils/card", component)},
+      restDataSet
+    )
+    const actualStyle = Object.assign(
+      {
+        backgroundColor: "#fff",
+        borderRadius: 15,
+        padding: 30
+      },
+      style
+    )
+
+    return (
+      <View dataSet={actualDataSet} style={actualStyle}>
+        {controls &&
+          <View style={{position: "absolute", top: 15, right: 15}}>
+            {controls}
+          </View>
+        }
+        {header &&
+          <Text style={{fontSize: 24}}>
+            {header}
+          </Text>
+        }
+        {children}
+      </View>
+    )
+  }
+}))

package/src/utils/checkbox.jsx

@@ -1,6 +1,6 @@
 import BaseComponent from "../base-component"
 import {CheckBox, Pressable, View} from "react-native"
-import {memo} from "react"
+import memo from "set-state-compare/src/memo"
 import PropTypes from "prop-types"
 import propTypesExact from "prop-types-exact"
 import {shapeComponent} from "set-state-compare/src/shape-component.js"

package/src/utils/modal.jsx

@@ -0,0 +1,59 @@
+import {Modal, Pressable, View} from "react-native"
+import BaseComponent from "../base-component"
+import Card from "./card"
+import FontAwesomeIcon from "react-native-vector-icons/FontAwesome"
+import memo from "set-state-compare/src/memo"
+import {shapeComponent} from "set-state-compare/src/shape-component"
+import useBreakpoint from "../use-breakpoint"
+
+export default memo(shapeComponent(class ApiMakerUtilsComponent extends BaseComponent {
+  render() {
+    const {xs, sm} = useBreakpoint()
+    const {children, dataSet, ...restProps} = this.props
+    const actualDataSet = Object.assign(
+      {
+        component: "api-maker/utils/modal"
+      },
+      dataSet
+    )
+    let width, maxWidth
+
+    if (xs || sm) {
+      width = "95%"
+    } else {
+      width = "80%"
+      maxWidth = 800
+    }
+
+    return (
+      <Modal dataSet={actualDataSet} {...restProps}>
+        <View
+          style={{
+            alignItems: "center",
+            justifyContent: "center",
+            width: "100%",
+            height: "100%",
+            backgroundColor: "rgba(0, 0, 0, 0.8)"
+          }}
+        >
+          <Card
+            controls={this.cardHeaderControls()}
+            style={{width, maxWidth}}
+          >
+            {children}
+          </Card>
+        </View>
+      </Modal>
+    )
+  }
+
+  cardHeaderControls() {
+    return (
+      <Pressable onPress={this.tt.onModalClosePress} style={{marginLeft: "auto", padding: 5}}>
+        <FontAwesomeIcon name="remove" />
+      </Pressable>
+    )
+  }
+
+  onModalClosePress = () => this.props.onRequestClose && this.props.onRequestClose()
+}))

package/src/with-can-can.jsx

@@ -1,5 +1,5 @@
 import useCanCan from "./use-can-can.mjs"
-import {memo} from "react"
+import memo from "set-state-compare/src/memo"
 
 export default (WrappedComponent, abilities) => {
   const WithCanCan = (props) => {

package/src/with-collection.jsx

@@ -1,5 +1,5 @@
 import {digg} from "diggerize"
-import {memo} from "react"
+import memo from "set-state-compare/src/memo"
 import useCollection from "./use-collection"
 
 export default (WrappedComponent, withCollectionArgs) => memo(() => {

package/src/with-model.jsx

@@ -1,4 +1,4 @@
-import {memo} from "react"
+import memo from "set-state-compare/src/memo"
 import useModel from "./use-model.mjs"
 
 export default (WrappedComponent, modelClass, givenArgs) => {