esoftplay-event 0.0.0-n → 0.0.0-p

package/modules/lib/style.live.ts

@@ -0,0 +1,110 @@
+// noPage
+import { Dimensions, Platform, StatusBar } from "react-native";
+function isIphoneX() {
+  const dimen = Dimensions.get('window');
+  const dimenHeight = [780, 812, 844, 852, 896, 926, 932, 1170, 874, 956]
+  return (
+    Platform.OS === 'ios' &&
+    !Platform.isPad &&
+    !Platform.isTV &&
+    (dimenHeight.includes(dimen.height) || dimenHeight.includes(dimen.width))
+  );
+}
+/* LIVE */
+
+const { height, width } = Dimensions.get("window");
+const STATUSBAR_HEIGHT = (Platform.OS === "ios" ? isIphoneX() ? 44 : 20 : StatusBar.currentHeight) || 0;
+const STATUSBAR_HEIGHT_MASTER = (Platform.OS === "ios" ? isIphoneX() ? 44 : 20 : StatusBar.currentHeight) || 0;
+const colorPrimary = "#FFC523";
+const colorPrimaryMarket = "#A62287";
+const colorPrimaryMart = "#40CEFF";
+const colorPrimaryDark = "#FFC523";
+const colorAccent = "#FFF";
+const colorGrey = "#F1F1F3";
+const colorTextPrimary = "#9e9e9e";
+const headerHeight = 56
+const colorBgGrey = '#EEF1F8';
+
+const colorBrown = '#704728'
+const colorBrownLight = '#C5906C'
+const colorRed = "#dc143c";
+const colorBlue = "#3EA4DC";
+const colorGreen = "#2CB159";
+const colorLightGrey = "#EDEDED";
+const colorTextBody = "#909090";
+const colorTextCaption = "#BEBEBE";
+
+function elevation(value: any): any {
+  if (Platform.OS === "ios") {
+    if (value == 0) return {}
+    return { shadowColor: "black", shadowOffset: { width: 0, height: value / 2 }, shadowRadius: value, shadowOpacity: 0.24 }
+  }
+  return { elevation: value }
+}
+// Add your default style here
+/*
+Sample :
+
+###################
+le
+const styles = StyleSheet.create({
+  container: {
+    ...defaultStyle.container
+  },
+});
+
+##################
+
+*/
+
+const defaultStyle = {
+  container: {
+    flex: 1,
+  },
+  imageSliderSize: {
+    width: width,
+    height: width * 0.8 // make image ratio square
+  },
+  statusBar: {
+    height: STATUSBAR_HEIGHT_MASTER,
+    backgroundColor: colorPrimaryDark
+  },
+  overflowHidden: {
+    overflow: "hidden"
+  },
+  textPrimary13: {
+    fontSize: 13,
+    color: colorPrimary
+  },
+  textPrimaryDark13: {
+    fontSize: 13,
+    color: colorPrimaryDark
+  },
+}
+
+export default class Style {
+  static isIphoneX: boolean = isIphoneX();
+  static STATUSBAR_HEIGHT: number = STATUSBAR_HEIGHT;
+  static STATUSBAR_HEIGHT_MASTER: number = STATUSBAR_HEIGHT_MASTER;
+  static colorPrimary: string = colorPrimary;
+  static colorPrimaryDark: string = colorPrimaryDark;
+  static colorPrimaryMarket: string = colorPrimaryMarket;
+  static colorPrimaryMart: string = colorPrimaryMart;
+  static colorAccent: string = colorAccent;
+  static colorGrey: string = colorGrey;
+  static colorBrownLight: string = colorBrownLight;
+  static colorBgGrey: string = colorBgGrey;
+  static colorBrown: string = colorBrown;
+  static colorGreen: string = colorGreen;
+  static colorBlue: string = colorBlue;
+  static colorRed: string = colorRed;
+  static colorTextPrimary: string = colorTextPrimary;
+  static colorTextBody: string = colorTextBody;
+  static colorTextCaption: string = colorTextCaption;
+  static colorLightGrey: string = colorLightGrey;
+  static elevation(val: number): any { return elevation(val) };
+  static width: number = width;
+  static height: number = height;
+  static defaultStyle: any = defaultStyle;
+  static headerHeight: number = headerHeight;
+}

package/modules/lib/style.ts

@@ -0,0 +1,109 @@
+// noPage
+import { Dimensions, Platform, StatusBar } from "react-native";
+function isIphoneX() {
+  const dimen = Dimensions.get('window');
+  const dimenHeight = [780, 812, 844, 852, 896, 926, 932, 1170, 874, 956]
+  return (
+    Platform.OS === 'ios' &&
+    !Platform.isPad &&
+    !Platform.isTV &&
+    (dimenHeight.includes(dimen.height) || dimenHeight.includes(dimen.width))
+  );
+}
+
+const { height, width } = Dimensions.get("window");
+const STATUSBAR_HEIGHT = (Platform.OS === "ios" ? isIphoneX() ? 44 : 20 : StatusBar.currentHeight) || 0;
+const STATUSBAR_HEIGHT_MASTER = (Platform.OS === "ios" ? isIphoneX() ? 44 : 20 : StatusBar.currentHeight) || 0;
+const colorPrimary = "#00BF63";
+const colorPrimaryMarket = "#4D5255";
+const colorPrimaryMart = "#40CEFF";
+const colorPrimaryDark = "#4D5255";
+const colorAccent = "#FFF";
+const colorGrey = "#F1F1F3";
+const colorTextPrimary = "#9e9e9e";
+const headerHeight = 56
+const colorBgGrey = '#EEF1F8';
+
+const colorBrown = '#704728'
+const colorBrownLight = '#C5906C'
+const colorRed = "#dc143c";
+const colorBlue = "#3EA4DC";
+const colorGreen = "#2CB159";
+const colorLightGrey = "#EDEDED";
+const colorTextBody = "#909090";
+const colorTextCaption = "#BEBEBE";
+
+function elevation(value: any): any {
+  if (Platform.OS === "ios") {
+    if (value == 0) return {}
+    return { shadowColor: "black", shadowOffset: { width: 0, height: value / 2 }, shadowRadius: value, shadowOpacity: 0.24 }
+  }
+  return { elevation: value }
+}
+// Add your default style here
+/*
+Sample :
+
+###################
+le
+const styles = StyleSheet.create({
+  container: {
+    ...defaultStyle.container
+  },
+});
+
+##################
+
+*/
+
+const defaultStyle = {
+  container: {
+    flex: 1,
+  },
+  imageSliderSize: {
+    width: width,
+    height: width * 0.8 // make image ratio square
+  },
+  statusBar: {
+    height: STATUSBAR_HEIGHT_MASTER,
+    backgroundColor: colorPrimaryDark
+  },
+  overflowHidden: {
+    overflow: "hidden"
+  },
+  textPrimary13: {
+    fontSize: 13,
+    color: colorPrimary
+  },
+  textPrimaryDark13: {
+    fontSize: 13,
+    color: colorPrimaryDark
+  },
+}
+
+export default class Style {
+  static isIphoneX: boolean = isIphoneX();
+  static STATUSBAR_HEIGHT: number = STATUSBAR_HEIGHT;
+  static STATUSBAR_HEIGHT_MASTER: number = STATUSBAR_HEIGHT_MASTER;
+  static colorPrimary: string = colorPrimary;
+  static colorPrimaryDark: string = colorPrimaryDark;
+  static colorPrimaryMarket: string = colorPrimaryMarket;
+  static colorPrimaryMart: string = colorPrimaryMart;
+  static colorAccent: string = colorAccent;
+  static colorGrey: string = colorGrey;
+  static colorBrownLight: string = colorBrownLight;
+  static colorBgGrey: string = colorBgGrey;
+  static colorBrown: string = colorBrown;
+  static colorGreen: string = colorGreen;
+  static colorBlue: string = colorBlue;
+  static colorRed: string = colorRed;
+  static colorTextPrimary: string = colorTextPrimary;
+  static colorTextBody: string = colorTextBody;
+  static colorTextCaption: string = colorTextCaption;
+  static colorLightGrey: string = colorLightGrey;
+  static elevation(val: number): any { return elevation(val) };
+  static width: number = width;
+  static height: number = height;
+  static defaultStyle: any = defaultStyle;
+  static headerHeight: number = headerHeight;
+}

package/modules/lib/swipe.tsx

@@ -0,0 +1,74 @@
+// noPage
+
+import { LibComponent } from 'esoftplay/cache/lib/component/import';
+
+import React from 'react';
+import { View } from 'react-native';
+//@ts-ignore
+import { Swipeable } from 'react-native-gesture-handler';
+
+export interface LibSwipeConfig {
+  renderView: (close: () => void) => any,
+  onSwipeComplete: () => void,
+}
+
+export interface LibSwipeProps {
+  animate: () => void
+  leftSide?: LibSwipeConfig,
+  rightSide?: LibSwipeConfig
+  delay?: number
+}
+export interface LibSwipeState {
+  height: any
+}
+
+
+export default class m extends LibComponent<LibSwipeProps, LibSwipeState> {
+  swipeRef = React.createRef<Swipeable>()
+  timeout: any
+  viewRef = React.createRef<View>()
+  constructor(props: LibSwipeProps) {
+    super(props)
+    this.close = this.close.bind(this);
+    this.hide = this.hide.bind(this);
+    this.state = {
+      height: 'auto'
+    }
+  }
+
+  close(): void {
+    clearTimeout(this.timeout)
+    this.swipeRef?.current?.close();
+  };
+
+  hide(): void {
+    this.props?.animate?.()
+    this.setState({ height: 0 })
+  }
+
+  render(): any {
+    const { children } = this.props;
+    return (
+      <Swipeable
+        ref={this.swipeRef}
+        friction={2}
+        leftThreshold={80}
+        onSwipeableRightOpen={() => {
+          this.timeout = setTimeout(this.hide, this.props.delay || 1000);
+          this.props?.rightSide?.onSwipeComplete()
+        }}
+        onSwipeableLeftOpen={() => {
+          this.timeout = setTimeout(this.hide, this.props.delay || 1000);
+          this.props?.leftSide?.onSwipeComplete()
+        }}
+        enableTrackpadTwoFingerGesture
+        rightThreshold={40}
+        renderLeftActions={() => this.props?.leftSide ? this.props.leftSide?.renderView?.(this.close) : null}
+        renderRightActions={() => this.props?.rightSide ? this.props.rightSide?.renderView?.(this.close) : null}>
+        <View style={{ height: this.state.height }} >
+          {children}
+        </View>
+      </Swipeable>
+    );
+  }
+}

package/modules/lib/tap.tsx

@@ -0,0 +1,28 @@
+// withHooks
+
+import React from 'react';
+import { View } from 'react-native';
+import { State, TapGestureHandler } from 'react-native-gesture-handler';
+
+export interface LibTapArgs {
+
+}
+export interface LibTapProps {
+  children: any,
+  onCoordinateGet: (x: number, y: number) => void,
+  style?: any
+}
+export default function m(props: LibTapProps): any {
+  const handleEnded = ({ nativeEvent }: any) => {
+    if (nativeEvent.state === State.ACTIVE) {
+      const { x, y } = nativeEvent;
+      props.onCoordinateGet(x, y);
+    }
+  };
+
+  return (
+    <TapGestureHandler onHandlerStateChange={handleEnded} {...props} >
+      <View>{props.children}</View>
+    </TapGestureHandler>
+  );
+}

package/modules/lib/test.tsx

@@ -0,0 +1,157 @@
+// withHooks
+import { LibCompose, LibComposeProperty } from 'esoftplay/cache/lib/compose/import';
+import esp from 'esoftplay/esp';
+import useSafeState from 'esoftplay/state';
+import React, { useEffect, useRef } from 'react';
+import { TextInput } from 'react-native';
+
+export interface LibTestArgs {
+
+}
+export interface LibTestProps {
+
+}
+
+// const View = (props: ViewProps) => createElement('RCTView', props);
+// const Text = (props: TextProps) => createElement('RCTText', props);
+// const CB = (props: ComponentButtonProps) => esp.mod("component/button")(props)
+// Usage with createElement
+// const Element = cloneElement(, { text: 'Hello World!' });
+
+const updated = [{ id: 1 }, { id: 2 }, { id: 3 }, { id: 5 }, { id: 6 }, { id: 4 }]
+const lama = [0, 0, 0, 0, 2, 1]
+
+
+export default function m(props: LibTestProps): any {
+  const [data, setData, getData] = useSafeState("https://api.bbo.co.id/event_detail/254?lang_id=1")
+  const build = esp.modProp("lib/compose").build
+
+
+  useEffect(() => {
+    // import('esoftplay/esp').then((esp) => {
+    //   esp.default.modProp("lib/toast").show("OK")
+    // }).catch((e) => { console.log(e) })
+  }, [])
+
+
+  // Example usage:
+  const jsonStructure =
+    build("View", {
+      style: { flex: 1 },
+      children: [
+        build("component/header", {
+          bgColor: "#ffffcd",
+          title: "Masmun",
+          iconShare: true,
+          subtitle: "KOK BISA", notif: true
+        }),
+        build("ScrollView", {
+          style: { flex: 1 },
+          children: build("View", {
+            style: { backgroundColor: '#f1f2f3' },
+            children: [
+              build('Text', { children: 'Hello', style: { margin: 17, fontWeight: "bold" } }),
+              build('Text', { children: 'Hello', style: { margin: 17, fontWeight: "bold" } }),
+              build('Text', { children: 'Hello', style: { margin: 17, fontWeight: "bold" } }),
+              build('Text', { children: 'Hello', style: { margin: 17, fontWeight: "bold" } }),
+              build('Text', { children: 'Hello', style: { margin: 17, fontWeight: "bold" } }),
+              build('Text', { children: 'Hello', style: { margin: 17, fontWeight: "bold" } }),
+              build("component/input", {
+                icon: "arrow-left",
+                onChangeText: LibComposeProperty.forms.input("name"),
+                placeholder: "NAMAEwa"
+              }),
+              build("component/input", {
+                icon: "arrow-left",
+                style: { marginHorizontal: 20, marginBottom: 20 },
+                onChangeText: LibComposeProperty.forms.select("ssss", "2"),
+                placeholder: "AGEE"
+              }),
+              build("component/button", {
+                label: "meetmee",
+                style: { marginHorizontal: 17 },
+                onPress: '#form.select.metme:one1',
+                backgroundColor: "lime"
+              }),
+              // build('Text', { children: 'Hello', style: { margin: 17, fontWeight: "bold" } }),
+              // build('Text', { children: 'Hello', style: { margin: 17, fontWeight: "bold" } }),
+              // build('Text', { children: 'Hello', style: { margin: 17, fontWeight: "bold" } }),
+              // build('Text', { children: 'Hello', style: { margin: 17, fontWeight: "bold" } }),
+              // build("lib/picture", { source: { uri: "https://cdn.antaranews.com/cache/1200x800/2024/09/10/1000233682.jpg" }, resizeMode: "contain", style: { aspectRatio: 1 } }),
+              build("component/button", {
+                label: "Pencet Saya",
+                style: { marginHorizontal: 17, marginTop: 20 },
+                //             onPress: `#clientFn() => {
+                //               import('esoftplay/esp').then((esp) => {
+                //   esp.default.modProp("lib/toast").show("OK")
+                // }).catch((e) => { console.log(e) })
+                //             }`,
+                onPress: LibComposeProperty.actions.curl("user_login", JSON.stringify({ "namesss": "masmun" })),
+                // onPress: `#action.curl.["user_login",{"username":"masmun","login":"1"}]`,
+                backgroundColor: "red"
+              })
+            ],
+          })
+        })
+      ]
+    })
+
+    ;
+
+  console.log(JSON.stringify({ jsonStructure }, null, 2));
+
+  const valueRef = useRef<TextInput>(null)
+
+  function interpolate(input: number, inputRange: number[], outputRange: number[], clamp = true) {
+    if (inputRange.length !== outputRange.length || inputRange.length < 2) {
+      throw new Error("Input and output ranges must have the same length and at least two values.");
+    }
+
+    // Find the segment of the range where the input belongs
+    for (let i = 0; i < inputRange.length - 1; i++) {
+      if (input >= inputRange[i] && input <= inputRange[i + 1]) {
+        // Interpolate within this segment
+        const t = (input - inputRange[i]) / (inputRange[i + 1] - inputRange[i]);
+        const value = outputRange[i] + t * (outputRange[i + 1] - outputRange[i]);
+        return clamp
+          ? Math.max(outputRange[0], Math.min(outputRange[outputRange.length - 1], value))
+          : value;
+      }
+    }
+
+    // If the input is outside the range, clamp to the nearest bound
+    if (clamp) {
+      if (input < inputRange[0]) {
+        return outputRange[0];
+      }
+      if (input > inputRange[inputRange.length - 1]) {
+        return outputRange[outputRange.length - 1];
+      }
+    }
+
+    throw new Error("Input value could not be interpolated.");
+  }
+
+
+  // <View style={{ flex: 1, justifyContent: 'flex-end' }} >
+  //   <LibNumbermeter
+  //     range={[0, 100]}
+  //     onValueChange={(value) => { console.log({ value }) }}
+  //     valueDisplayEdit={(val) => `${val}%`}
+  //   />
+  // </View>
+  // <ErrorBoundary onError={(err, stc) => { console.error({ err, stc }) }} >
+  return (
+    <LibCompose schema={jsonStructure} />
+  )
+  // <Button title='SSS' onPress={() => { console.log(masmun) }} />
+  // </ErrorBoundary>
+
+  // build('TextInput', { placeholder: 'Click Me',onc }),
+  // return (
+  //   <View style={{ flex: 1, backgroundColor: 'red', justifyContent: 'center', alignItems: 'center', marginTop: LibStyle.STATUSBAR_HEIGHT }} >
+  //     <Text>MASMUN</Text>
+  //     <CB label='SMMASA' backgroundColor='green' onPress={() => { }} />
+  //   </View>
+  // )
+}