@wavemaker/app-rn-runtime 12.0.0-next.45752 → 12.0.0-next.47809

package/components/input/radioset/radioset.props.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["BaseDatasetProps","WmRadiosetProps","constructor","args","_defineProperty","xs","sm","md","lg"],"sources":["radioset.props.ts"],"sourcesContent":["import BaseDatasetProps from '@wavemaker/app-rn-runtime/components/input/basedataset/basedataset.props';\n\nexport default class WmRadiosetProps extends BaseDatasetProps {\n  dataset: any = 'Option 1, Option 2, Option 3';\n  itemsperrow =  {\n    xs: 1,\n    sm: 1,\n    md: 1,\n    lg: 1,\n };\n radiosetscroll: boolean = true;\n renderitempartial?: (item: any, index: number, partialName: string)=> React.ReactNode;\n numberofskeletonitems?: number | string\n}\n"],"mappings":";;;AAAA,OAAOA,gBAAgB,MAAM,0EAA0E;AAEvG,eAAe,MAAMC,eAAe,SAASD,gBAAgB,CAAC;EAAAE,YAAA,GAAAC,IAAA;IAAA,SAAAA,IAAA;IAAAC,eAAA,kBAC7C,8BAA8B;IAAAA,eAAA,sBAC9B;MACbC,EAAE,EAAE,CAAC;MACLC,EAAE,EAAE,CAAC;MACLC,EAAE,EAAE,CAAC;MACLC,EAAE,EAAE;IACP,CAAC;IAAAJ,eAAA,yBACyB,IAAI;IAAAA,eAAA;IAAAA,eAAA;EAAA;AAG/B","ignoreList":[]}

package/components/input/radioset/radioset.styles.js

@@ -0,0 +1,102 @@
+import BASE_THEME from '@wavemaker/app-rn-runtime/styles/theme';
+import { defineStyles } from '@wavemaker/app-rn-runtime/core/base.component';
+export const DEFAULT_CLASS = 'app-radioset';
+BASE_THEME.registerStyle((themeVariables, addStyle) => {
+  const defaultStyles = defineStyles({
+    root: {
+      color: themeVariables.checkedColor
+    },
+    text: {},
+    group: {
+      flexDirection: 'row',
+      flexWrap: 'wrap'
+    },
+    groupHeaderTitle: {
+      backgroundColor: themeVariables.groupHeadingBgColor,
+      fontSize: 16,
+      paddingLeft: 8,
+      paddingRight: 8,
+      lineHeight: 40,
+      fontFamily: themeVariables.baseFont
+    },
+    item: {
+      flexDirection: 'row',
+      alignContent: 'center',
+      marginRight: -20,
+      marginTop: 8
+    },
+    noscrollitem: {
+      flexDirection: 'row',
+      alignContent: 'center',
+      marginTop: 8,
+      marginLeft: 16
+    },
+    selectedItem: {},
+    selectedLabel: {},
+    radioLabel: {
+      alignSelf: 'center',
+      fontFamily: themeVariables.baseFont,
+      fontSize: 16,
+      color: themeVariables.labelDefaultColor,
+      marginLeft: 8
+    },
+    skeleton: {
+      root: {
+        width: '100%',
+        height: 16,
+        borderRadius: 4
+      }
+    },
+    uncheckedRadio: {
+      root: {
+        width: 20,
+        height: 20,
+        borderRadius: 10,
+        borderStyle: "solid",
+        borderWidth: 2,
+        borderColor: themeVariables.checkedBorderColor
+      },
+      text: {},
+      icon: {
+        opacity: 0
+      }
+    },
+    checkedRadio: {
+      root: {
+        width: 20,
+        height: 20,
+        borderRadius: 10,
+        borderStyle: "solid",
+        borderWidth: 2,
+        borderColor: themeVariables.checkedBorderColor
+      },
+      text: {
+        fontSize: 16
+      },
+      icon: {
+        color: themeVariables.checkedColor,
+        padding: 0
+      }
+    }
+  });
+  addStyle(DEFAULT_CLASS, '', defaultStyles);
+
+  // Add horizontal form input styles for horizontal form field layouts - positioned early to avoid overriding more specific styles
+  addStyle('form-radioset-input-horizontal', '', {
+    root: {
+      flex: 1,
+      // Take remaining space after label
+      minWidth: 0,
+      // Allow shrinking below intrinsic content size if needed
+      maxWidth: '100%' // Prevent overflow
+    },
+    text: {}
+  });
+  addStyle(DEFAULT_CLASS + '-disabled', '', {
+    root: {
+      color: themeVariables.checkedDisabledColor,
+      opacity: 0.8
+    }
+  });
+});
+//# sourceMappingURL=radioset.styles.js.map

package/components/input/radioset/radioset.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["BASE_THEME","defineStyles","DEFAULT_CLASS","registerStyle","themeVariables","addStyle","defaultStyles","root","color","checkedColor","text","group","flexDirection","flexWrap","groupHeaderTitle","backgroundColor","groupHeadingBgColor","fontSize","paddingLeft","paddingRight","lineHeight","fontFamily","baseFont","item","alignContent","marginRight","marginTop","noscrollitem","marginLeft","selectedItem","selectedLabel","radioLabel","alignSelf","labelDefaultColor","skeleton","width","height","borderRadius","uncheckedRadio","borderStyle","borderWidth","borderColor","checkedBorderColor","icon","opacity","checkedRadio","padding","flex","minWidth","maxWidth","checkedDisabledColor"],"sources":["radioset.styles.ts"],"sourcesContent":["import BASE_THEME, { AllStyle } from '@wavemaker/app-rn-runtime/styles/theme';\nimport { BaseStyles, defineStyles } from '@wavemaker/app-rn-runtime/core/base.component';\nimport { WmSkeletonStyles } from '@wavemaker/app-rn-runtime/components/basic/skeleton/skeleton.styles';\nimport { WmIconStyles } from '@wavemaker/app-rn-runtime/components/basic/icon/icon.styles';\n\nexport type WmRadiosetStyles = BaseStyles & {\n  group: AllStyle,\n  groupHeaderTitle: AllStyle;\n  item: AllStyle;\n  selectedItem: AllStyle;\n  radioLabel: AllStyle;\n  skeleton: WmSkeletonStyles;\n  uncheckedRadio: WmIconStyles;\n  checkedRadio: WmIconStyles;\n};\n\nexport const DEFAULT_CLASS = 'app-radioset';\nBASE_THEME.registerStyle((themeVariables, addStyle) => {\n  const defaultStyles: WmRadiosetStyles = defineStyles({\n      root: {\n        color: themeVariables.checkedColor\n      },\n      text: {},\n      group: {\n        flexDirection: 'row',\n        flexWrap: 'wrap'\n      },\n      groupHeaderTitle: {\n        backgroundColor: themeVariables.groupHeadingBgColor,\n        fontSize: 16,\n        paddingLeft: 8,\n        paddingRight: 8,\n        lineHeight: 40,\n        fontFamily: themeVariables.baseFont\n      } as AllStyle,\n      item: {\n        flexDirection: 'row',\n        alignContent: 'center',\n        marginRight: -20,\n        marginTop: 8\n      } as AllStyle,\n      noscrollitem:{\n        flexDirection: 'row',\n        alignContent: 'center',\n        marginTop: 8, \n        marginLeft: 16 \n      } as AllStyle,\n      selectedItem: {} as AllStyle,\n      selectedLabel: {} as AllStyle,\n      radioLabel: {\n          alignSelf: 'center',\n          fontFamily: themeVariables.baseFont,\n          fontSize: 16,\n          color: themeVariables.labelDefaultColor,\n          marginLeft: 8\n      } as AllStyle,\n      skeleton: {\n        root: {\n          width: '100%',\n          height: 16,\n          borderRadius: 4,\n        }\n      } as any as WmSkeletonStyles,\n      uncheckedRadio: {\n        root: {\n          width: 20,\n          height: 20,\n          borderRadius: 10,\n          borderStyle: \"solid\",\n          borderWidth: 2,\n          borderColor: themeVariables.checkedBorderColor,\n        },\n        text: {},\n        icon: {\n          opacity: 0,\n        }\n      } as WmIconStyles,\n      checkedRadio : {\n        root: {\n          width: 20,\n          height: 20,\n          borderRadius: 10,\n          borderStyle: \"solid\",\n          borderWidth: 2,\n          borderColor: themeVariables.checkedBorderColor,\n        },\n        text: {\n          fontSize: 16,\n        },\n        icon : {\n          color: themeVariables.checkedColor,\n          padding: 0,\n        }\n  } as WmIconStyles\n});\n\n  addStyle(DEFAULT_CLASS, '', defaultStyles);\n  \n  // Add horizontal form input styles for horizontal form field layouts - positioned early to avoid overriding more specific styles\n  addStyle('form-radioset-input-horizontal', '', {\n    root: {\n      flex: 1, // Take remaining space after label\n      minWidth: 0, // Allow shrinking below intrinsic content size if needed\n      maxWidth: '100%' // Prevent overflow\n    },\n    text: {}\n  } as BaseStyles);\n  \n  addStyle(DEFAULT_CLASS + '-disabled', '', {\n    root : {\n      color: themeVariables.checkedDisabledColor,\n      opacity: 0.8\n    }\n  });\n});\n"],"mappings":"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","ignoreList":[]}

package/components/input/rating/rating.component.js

@@ -0,0 +1,147 @@
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import React from 'react';
+import { View, Text } from 'react-native';
+import { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';
+import WmIcon from '@wavemaker/app-rn-runtime/components/basic/icon/icon.component';
+import WmRatingProps from './rating.props';
+import { DEFAULT_CLASS } from './rating.styles';
+import { cloneDeep, isArray, isNumber, isString } from 'lodash-es';
+export class WmRatingState extends BaseComponentState {
+  constructor(...args) {
+    super(...args);
+    _defineProperty(this, "items", null);
+    _defineProperty(this, "caption", null);
+    _defineProperty(this, "selectedIndex", -1);
+    _defineProperty(this, "isDefault", false);
+  }
+}
+export default class WmRating extends BaseComponent {
+  constructor(props) {
+    super(props, DEFAULT_CLASS, new WmRatingProps());
+  }
+  get caption() {
+    return this.state.caption;
+  }
+  prepareItems(props) {
+    let items = [];
+    if (!props.dataset && props.maxvalue) {
+      items = Array.from(Array(+props.maxvalue).keys());
+      items = items.map(v => v + 1);
+    } else if (isString(props.dataset)) {
+      items = props.dataset.split(',');
+    } else {
+      items = props.dataset || [];
+    }
+    if (isArray(items) && items[0] !== Object(items[0])) {
+      items = items.map((v, i) => ({
+        key: i + 1,
+        value: v
+      }));
+    }
+    let selectedIndex = -1;
+    if (props.datavalue !== undefined && props.datavalue !== null) {
+      selectedIndex = items.findIndex((item, k) => item[props.datafield] == props.datavalue);
+      if (selectedIndex === -1 && isNumber(props.datavalue)) {
+        selectedIndex = props.datavalue;
+      }
+    }
+    let caption = '';
+    if (selectedIndex > -1 && props.showcaptions) {
+      const selectedItem = items[selectedIndex];
+      if (selectedItem) {
+        if (props.getDisplayExpression) {
+          caption = props.getDisplayExpression(selectedItem);
+        } else {
+          caption = selectedItem[props.displayfield];
+        }
+      } else {
+        caption = selectedIndex + 1;
+      }
+    }
+    this.updateState({
+      items: items,
+      selectedIndex: selectedIndex,
+      caption: caption
+    });
+  }
+  onPropertyChange(name, $new, $old) {
+    switch (name) {
+      case 'dataset':
+      case 'datafield':
+      case 'displayfield':
+      case 'maxvalue':
+      case 'datavalue':
+        this.prepareItems(this.state.props);
+        if (name === 'datavalue') {
+          const isDefault = this.state.props.isdefault;
+          if (isDefault) {
+            this.updateState({
+              props: {
+                isdefault: false
+              }
+            }, this.props.onFieldChange && this.props.onFieldChange.bind(this, 'datavalue', $new, $old, isDefault));
+          } else {
+            this.props.onFieldChange && this.props.onFieldChange('datavalue', $new, $old, isDefault);
+          }
+        }
+        break;
+      case 'readonly':
+        this.updateState({
+          props: {
+            disabled: $new
+          }
+        });
+        break;
+    }
+  }
+  changeValue(i) {
+    const props = this.state.props;
+    const oldValue = props.datavalue;
+    if (!props.readonly) {
+      let value = this.state.items[i] ? this.state.items[i][props.datafield || ''] : i;
+      this.updateState({
+        props: {
+          datavalue: value
+        }
+      }, () => {
+        !this.props.onFieldChange && value !== oldValue && this.invokeEventCallback('onChange', [undefined, this.proxy, value, oldValue]);
+      });
+    }
+  }
+  renderWidget(props) {
+    const maxValue = props.maxvalue ? +props.maxvalue : 5;
+    const arr = Array.from(Array(maxValue).keys());
+    let selectedIconStyles = this.styles.selectedIcon;
+    if (props.iconcolor) {
+      selectedIconStyles = cloneDeep(this.styles.selectedIcon);
+      selectedIconStyles.text.color = props.iconcolor;
+    }
+    return /*#__PURE__*/React.createElement(View, {
+      style: this.styles.root,
+      onLayout: event => this.handleLayout(event)
+    }, this._background, arr.map((v, i) => this.state.selectedIndex > -1 && i <= this.state.selectedIndex ? /*#__PURE__*/React.createElement(WmIcon, {
+      id: this.getTestId('star' + i),
+      key: i,
+      iconclass: "wi wi-star",
+      iconsize: props.iconsize,
+      styles: selectedIconStyles,
+      onTap: () => {
+        this.changeValue(i);
+      }
+    }) : null), arr.map((v, i) => this.state.selectedIndex === -1 || i > this.state.selectedIndex ? /*#__PURE__*/React.createElement(WmIcon, {
+      id: this.getTestId('star' + i),
+      key: i,
+      iconclass: "wi wi-star-border",
+      iconsize: props.iconsize,
+      styles: this.styles.icon,
+      onTap: () => {
+        this.changeValue(i);
+      }
+    }) : null), !!props.showcaptions ? /*#__PURE__*/React.createElement(Text, {
+      style: this.styles.text
+    }, this.state.caption) : null);
+  }
+}
+//# sourceMappingURL=rating.component.js.map

package/components/input/rating/rating.component.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","Text","BaseComponent","BaseComponentState","WmIcon","WmRatingProps","DEFAULT_CLASS","cloneDeep","isArray","isNumber","isString","WmRatingState","constructor","args","_defineProperty","WmRating","props","caption","state","prepareItems","items","dataset","maxvalue","Array","from","keys","map","v","split","Object","i","key","value","selectedIndex","datavalue","undefined","findIndex","item","k","datafield","showcaptions","selectedItem","getDisplayExpression","displayfield","updateState","onPropertyChange","name","$new","$old","isDefault","isdefault","onFieldChange","bind","disabled","changeValue","oldValue","readonly","invokeEventCallback","proxy","renderWidget","maxValue","arr","selectedIconStyles","styles","selectedIcon","iconcolor","text","color","createElement","style","root","onLayout","event","handleLayout","_background","id","getTestId","iconclass","iconsize","onTap","icon"],"sources":["rating.component.tsx"],"sourcesContent":["import React from 'react';\nimport { View, Text } from 'react-native';\nimport { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';\nimport WmIcon from '@wavemaker/app-rn-runtime/components/basic/icon/icon.component';\n\nimport WmRatingProps from './rating.props';\nimport { DEFAULT_CLASS, WmRatingStyles } from './rating.styles';\nimport { cloneDeep, isArray, isEmpty, isNumber, isString } from 'lodash-es';\n\nexport class WmRatingState extends BaseComponentState<WmRatingProps> {\n  items: any[] = null as any;\n  caption: any = null as any;\n  selectedIndex = -1;\n  isDefault = false;\n}\n\nexport default class WmRating extends BaseComponent<WmRatingProps, WmRatingState, WmRatingStyles> {\n\n  constructor(props: WmRatingProps) {\n    super(props, DEFAULT_CLASS, new WmRatingProps());\n  }\n\n  get caption() {\n    return this.state.caption;\n  }\n\n  prepareItems(props: WmRatingProps) {\n    let items: any[] = [];\n    if (!props.dataset && props.maxvalue) {\n      items = Array.from(Array(+props.maxvalue).keys());\n      items = items.map(v => v + 1);\n    } else if (isString(props.dataset)) {\n      items = props.dataset.split(',');\n    } else {\n      items = props.dataset as any[] || [];\n    }\n    if (isArray(items) && items[0] !== Object(items[0])) {\n      items = items.map((v, i) => ({\n        key: i + 1,\n        value: v\n      }));\n    }\n    let selectedIndex = -1;\n    if (props.datavalue !== undefined && props.datavalue !== null) {\n      selectedIndex = items.findIndex((item: any, k) => item[props.datafield as string] == props.datavalue);\n      if (selectedIndex === -1 && isNumber(props.datavalue)) {\n        selectedIndex = props.datavalue;\n      }\n    }\n    let caption: any = '';\n    if (selectedIndex > -1 && props.showcaptions) {\n      const selectedItem = items[selectedIndex];\n      if (selectedItem) {\n        if (props.getDisplayExpression) {\n          caption = props.getDisplayExpression(selectedItem);\n        } else {\n          caption = selectedItem[props.displayfield as string];\n        }\n      } else {\n        caption = selectedIndex + 1;\n      }\n    }\n    this.updateState({\n      items: items,\n      selectedIndex: selectedIndex,\n      caption: caption\n    } as WmRatingState);\n  }\n\n  onPropertyChange(name: string, $new: any, $old: any) {\n    switch(name) {\n      case 'dataset' :\n      case 'datafield' :\n      case 'displayfield' :\n      case 'maxvalue':\n      case 'datavalue' :\n        this.prepareItems(this.state.props);\n        if (name === 'datavalue') {\n          const isDefault = this.state.props.isdefault;\n          if (isDefault) {\n            this.updateState({ props: {isdefault: false} } as WmRatingState, this.props.onFieldChange && this.props.onFieldChange.bind(this, 'datavalue', $new, $old, isDefault));\n          } else {\n            this.props.onFieldChange && this.props.onFieldChange('datavalue', $new, $old, isDefault);\n          }\n        }\n        break;\n      case 'readonly' :\n        this.updateState({\n          props: {\n            disabled: $new\n          }\n        } as WmRatingState);\n        break;\n    }\n  }\n\n  changeValue(i: number) {\n    const props = this.state.props;\n    const oldValue = props.datavalue;\n    if (!props.readonly) {\n      let value = this.state.items[i] ? this.state.items[i][props.datafield || '']: i;\n      this.updateState({\n        props: {\n          datavalue:  value\n        }\n      } as WmRatingState, () => {\n        !this.props.onFieldChange && value !== oldValue && this.invokeEventCallback('onChange', [undefined, this.proxy, value, oldValue]);\n      });\n    }\n  }\n\n  renderWidget(props: WmRatingProps) {\n    const maxValue = props.maxvalue ? +props.maxvalue : 5;\n    const arr = Array.from(Array(maxValue).keys());\n\n    let selectedIconStyles = this.styles.selectedIcon;\n    if (props.iconcolor) {\n      selectedIconStyles = cloneDeep(this.styles.selectedIcon);\n      selectedIconStyles.text.color = props.iconcolor;\n    }\n    return (\n    <View style={this.styles.root} onLayout={(event) => this.handleLayout(event)}>\n      {this._background}\n      {arr.map((v, i) => (\n        (this.state.selectedIndex > -1 && i <= this.state.selectedIndex) ? <WmIcon\n          id={this.getTestId('star' + i)}\n          key={i}\n          iconclass=\"wi wi-star\"\n          iconsize={props.iconsize}\n          styles={selectedIconStyles}\n          onTap={() => { this.changeValue(i)}}\n        ></WmIcon> : null\n      ))}\n      {arr.map((v, i) => (\n        (this.state.selectedIndex === -1 || i > this.state.selectedIndex) ? <WmIcon\n          id={this.getTestId('star' + i)}\n          key={i}\n          iconclass=\"wi wi-star-border\"\n          iconsize={props.iconsize}\n          styles={this.styles.icon}\n          onTap={() => { this.changeValue(i)}}\n        ></WmIcon> : null\n      ))}\n      { !!props.showcaptions ? (<Text style={this.styles.text}>{this.state.caption}</Text>) : null }\n    </View>);\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/components/input/rating/rating.props.js

@@ -0,0 +1,21 @@
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import { BaseProps } from '@wavemaker/app-rn-runtime/core/base.component';
+export default class WmRatingProps extends BaseProps {
+  constructor(...args) {
+    super(...args);
+    _defineProperty(this, "dataset", null);
+    _defineProperty(this, "datafield", 'key');
+    _defineProperty(this, "displayfield", 'value');
+    _defineProperty(this, "getDisplayExpression", null);
+    _defineProperty(this, "datavalue", null);
+    _defineProperty(this, "maxvalue", 5);
+    _defineProperty(this, "readonly", false);
+    _defineProperty(this, "iconcolor", null);
+    _defineProperty(this, "iconsize", null);
+    _defineProperty(this, "showcaptions", true);
+    _defineProperty(this, "onFieldChange", void 0);
+  }
+}
+//# sourceMappingURL=rating.props.js.map

package/components/input/rating/rating.styles.js

@@ -0,0 +1,48 @@
+import BASE_THEME from '@wavemaker/app-rn-runtime/styles/theme';
+import { defineStyles } from '@wavemaker/app-rn-runtime/core/base.component';
+export const DEFAULT_CLASS = 'app-rating';
+BASE_THEME.registerStyle((themeVariables, addStyle) => {
+  const defaultStyles = defineStyles({
+    root: {
+      flexDirection: 'row',
+      alignContent: 'center',
+      padding: 8
+    },
+    icon: {
+      text: {
+        fontSize: 32,
+        color: themeVariables.ratingIconColor
+      }
+    },
+    selectedIcon: {
+      text: {
+        fontSize: 32,
+        color: themeVariables.ratingSelectedIconColor
+      }
+    },
+    text: {
+      alignSelf: 'center',
+      paddingLeft: 8,
+      color: themeVariables.ratingSelectedIconColor
+    }
+  });
+  addStyle(DEFAULT_CLASS, '', defaultStyles);
+
+  // Add horizontal form input styles for horizontal form field layouts - positioned early to avoid overriding more specific styles
+  addStyle('form-rating-input-horizontal', '', {
+    root: {
+      flex: 1,
+      // Take remaining space after label
+      minWidth: 0,
+      // Allow shrinking below intrinsic content size if needed
+      maxWidth: '100%' // Prevent overflow
+    },
+    text: {}
+  });
+  addStyle(DEFAULT_CLASS + '-disabled', '', {
+    root: {
+      opacity: 0.5
+    }
+  });
+});
+//# sourceMappingURL=rating.styles.js.map

package/components/input/rating/rating.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["BASE_THEME","defineStyles","DEFAULT_CLASS","registerStyle","themeVariables","addStyle","defaultStyles","root","flexDirection","alignContent","padding","icon","text","fontSize","color","ratingIconColor","selectedIcon","ratingSelectedIconColor","alignSelf","paddingLeft","flex","minWidth","maxWidth","opacity"],"sources":["rating.styles.ts"],"sourcesContent":["import BASE_THEME from '@wavemaker/app-rn-runtime/styles/theme';\nimport { BaseStyles, defineStyles } from '@wavemaker/app-rn-runtime/core/base.component';\nimport { WmIconStyles } from '../../basic/icon/icon.styles';\n\nexport type WmRatingStyles = BaseStyles & {\n    icon: WmIconStyles,\n    selectedIcon: WmIconStyles\n};\n\nexport const DEFAULT_CLASS = 'app-rating';\nBASE_THEME.registerStyle((themeVariables, addStyle) => {\n    const defaultStyles: WmRatingStyles = defineStyles({\n        root: {\n            flexDirection: 'row',\n            alignContent: 'center',\n            padding: 8\n        },\n        icon: {\n            text: {\n                fontSize: 32,\n                color: themeVariables.ratingIconColor\n            }\n        } as WmIconStyles,\n        selectedIcon: {\n            text: {\n                fontSize: 32,\n                color: themeVariables.ratingSelectedIconColor\n            }\n        } as WmIconStyles,\n        text: {\n            alignSelf: 'center',\n            paddingLeft: 8,\n            color: themeVariables.ratingSelectedIconColor\n        }\n    });\n\n    addStyle(DEFAULT_CLASS, '', defaultStyles);\n    \n    // Add horizontal form input styles for horizontal form field layouts - positioned early to avoid overriding more specific styles\n    addStyle('form-rating-input-horizontal', '', {\n      root: {\n        flex: 1, // Take remaining space after label\n        minWidth: 0, // Allow shrinking below intrinsic content size if needed\n        maxWidth: '100%' // Prevent overflow\n      },\n      text: {}\n    } as BaseStyles);\n    \n    addStyle(DEFAULT_CLASS + '-disabled', '', {\n        root : {\n        opacity: 0.5\n        }\n    });\n});"],"mappings":"AAAA,OAAOA,UAAU,MAAM,wCAAwC;AAC/D,SAAqBC,YAAY,QAAQ,+CAA+C;AAQxF,OAAO,MAAMC,aAAa,GAAG,YAAY;AACzCF,UAAU,CAACG,aAAa,CAAC,CAACC,cAAc,EAAEC,QAAQ,KAAK;EACnD,MAAMC,aAA6B,GAAGL,YAAY,CAAC;IAC/CM,IAAI,EAAE;MACFC,aAAa,EAAE,KAAK;MACpBC,YAAY,EAAE,QAAQ;MACtBC,OAAO,EAAE;IACb,CAAC;IACDC,IAAI,EAAE;MACFC,IAAI,EAAE;QACFC,QAAQ,EAAE,EAAE;QACZC,KAAK,EAAEV,cAAc,CAACW;MAC1B;IACJ,CAAiB;IACjBC,YAAY,EAAE;MACVJ,IAAI,EAAE;QACFC,QAAQ,EAAE,EAAE;QACZC,KAAK,EAAEV,cAAc,CAACa;MAC1B;IACJ,CAAiB;IACjBL,IAAI,EAAE;MACFM,SAAS,EAAE,QAAQ;MACnBC,WAAW,EAAE,CAAC;MACdL,KAAK,EAAEV,cAAc,CAACa;IAC1B;EACJ,CAAC,CAAC;EAEFZ,QAAQ,CAACH,aAAa,EAAE,EAAE,EAAEI,aAAa,CAAC;;EAE1C;EACAD,QAAQ,CAAC,8BAA8B,EAAE,EAAE,EAAE;IAC3CE,IAAI,EAAE;MACJa,IAAI,EAAE,CAAC;MAAE;MACTC,QAAQ,EAAE,CAAC;MAAE;MACbC,QAAQ,EAAE,MAAM,CAAC;IACnB,CAAC;IACDV,IAAI,EAAE,CAAC;EACT,CAAe,CAAC;EAEhBP,QAAQ,CAACH,aAAa,GAAG,WAAW,EAAE,EAAE,EAAE;IACtCK,IAAI,EAAG;MACPgB,OAAO,EAAE;IACT;EACJ,CAAC,CAAC;AACN,CAAC,CAAC","ignoreList":[]}

package/components/input/select/select.component.js

@@ -0,0 +1,254 @@
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import React from 'react';
+import { Dimensions, StatusBar, Text, View } from 'react-native';
+import { ScrollView } from 'react-native-gesture-handler';
+import { find, isEmpty, isString } from 'lodash';
+import WmSelectProps from './select.props';
+import { DEFAULT_CLASS } from './select.styles';
+import { BaseDatasetComponent, BaseDatasetState } from '@wavemaker/app-rn-runtime/components/input/basedataset/basedataset.component';
+import WmIcon from '@wavemaker/app-rn-runtime/components/basic/icon/icon.component';
+import { ModalConsumer } from '@wavemaker/app-rn-runtime/core/modal.service';
+import WmButton from '@wavemaker/app-rn-runtime/components/basic/button/button.component';
+import { Tappable } from '@wavemaker/app-rn-runtime/core/tappable.component';
+import { AccessibilityWidgetType, getAccessibilityProps } from '@wavemaker/app-rn-runtime/core/accessibility';
+import { BackgroundComponent } from '@wavemaker/app-rn-runtime/styles/background.component';
+import { createSkeleton } from '@wavemaker/app-rn-runtime/components/basic/skeleton/skeleton.component';
+export class WmSelectState extends BaseDatasetState {
+  constructor(...args) {
+    super(...args);
+    _defineProperty(this, "modalOptions", {});
+    _defineProperty(this, "isOpened", false);
+    _defineProperty(this, "selectedValue", '');
+    _defineProperty(this, "position", {});
+    _defineProperty(this, "selectWidth", 0);
+  }
+}
+export default class WmSelect extends BaseDatasetComponent {
+  constructor(props) {
+    super(props, DEFAULT_CLASS, new WmSelectProps(), new WmSelectState());
+    _defineProperty(this, "view", null);
+    _defineProperty(this, "widgetRef", null);
+    _defineProperty(this, "isDefaultValue", true);
+    _defineProperty(this, "computePosition", e => {
+      const position = {};
+      const windowDimensions = Dimensions.get('window');
+      this.view.measure((x, y, width, height, px, py) => {
+        let popoverwidth = this.state.selectWidth;
+        if (popoverwidth && isString(popoverwidth)) {
+          popoverwidth = parseInt(popoverwidth);
+        }
+        this.isRTL ? position.right = px : position.left = px;
+        if (px + popoverwidth > windowDimensions.width) {
+          this.isRTL ? position.right = px + width - popoverwidth : position.left = px + width - popoverwidth;
+        }
+        position.top = py + height;
+        this.updateState({
+          position: position
+        });
+      });
+    });
+    _defineProperty(this, "showPopover", () => {
+      this.updateState({
+        isOpened: true
+      });
+    });
+    _defineProperty(this, "hide", () => {});
+  }
+  onPress(event) {
+    if (this.state.props.disabled) {
+      return;
+    }
+    if (!this.state.isOpened) {
+      this.showPopover();
+    }
+    this.invokeEventCallback('onFocus', [event, this.proxy]);
+  }
+  onPropertyChange(name, $new, $old) {
+    super.onPropertyChange(name, $new, $old);
+    switch (name) {
+      case 'datavalue':
+        if (isNaN($new) && isEmpty($new)) {
+          this.updateState({
+            props: {
+              displayValue: this.state.props.placeholder || ''
+            }
+          });
+        }
+    }
+  }
+  prepareModalOptions(content, styles, modalService) {
+    const o = this.state.modalOptions;
+    o.modalStyle = styles.modal;
+    o.contentStyle = {
+      ...styles.modalContent,
+      ...this.state.position
+    };
+    o.content = content;
+    o.isModal = true;
+    o.centered = true;
+    o.onClose = () => {
+      this.hide = () => {};
+      if (this.isDefaultValue && this.state.props.displayValue === '') {
+        this.validate(this.state.props.displayValue);
+        setTimeout(() => {
+          this.props.triggerValidation && this.props.triggerValidation();
+        }, 0);
+      }
+      this.invokeEventCallback('onBlur', [{}, this.proxy]);
+      this.setState({
+        isOpened: false,
+        modalOptions: {}
+      });
+    };
+    this.hide = () => modalService.hideModal(this.state.modalOptions);
+    return o;
+  }
+  focus() {
+    var _this$widgetRef;
+    this === null || this === void 0 || (_this$widgetRef = this.widgetRef) === null || _this$widgetRef === void 0 || _this$widgetRef.focus();
+  }
+  renderSkeletonForText() {
+    return createSkeleton(this.theme, {}, {
+      ...this.styles.textSkeleton.root
+    });
+  }
+  renderSelect() {
+    const props = this.state.props;
+    const select = this.styles.root;
+    return (
+      /*#__PURE__*/
+      /*
+       * onLayout function is required.
+       * https://github.com/naoufal/react-native-accordion/pull/19/files
+       */
+      React.createElement(View, {
+        style: [this.styles.root, this.state.isValid ? {} : this.styles.invalid, {
+          backgroundColor: props.disabled ? this.styles.disabledText.backgroundColor : this.styles.root.backgroundColor
+        }, this._showSkeleton ? {
+          justifyContent: 'space-between'
+        } : {}],
+        ref: ref => {
+          this.view = ref;
+        },
+        onLayout: event => {
+          this.updateState({
+            selectWidth: event.nativeEvent.layout.width
+          });
+        }
+      }, select.backgroundImage ? /*#__PURE__*/React.createElement(BackgroundComponent, {
+        image: select.backgroundImage,
+        position: select.backgroundPosition || 'center',
+        size: select.backgroundSize || 'contain',
+        repeat: select.backgroundRepeat || 'no-repeat',
+        resizeMode: select.backgroundResizeMode,
+        style: {
+          borderRadius: this.styles.root.borderRadius
+        }
+      }) : null, this._showSkeleton && (this.state.props.displayValue || props.placeholder) ? this.renderSkeletonForText() : /*#__PURE__*/React.createElement(Text, _extends({
+        style: [this.styles.text, this.state.props.displayValue ? {} : {
+          color: this.styles.placeholderText.color
+        }],
+        ref: ref => {
+          this.widgetRef = ref;
+        }
+      }, this.getTestPropsForInput(), getAccessibilityProps(AccessibilityWidgetType.SELECT, props), {
+        onPress: this.onPress.bind(this)
+      }), this.state.props.displayValue || props.placeholder || ' '), /*#__PURE__*/React.createElement(WmButton, {
+        styles: this._showSkeleton ? this.styles.arrowButtonSkeleton.root : this.styles.arrowButton,
+        iconclass: 'wi wi-keyboard-arrow-down',
+        onTap: this.onPress.bind(this),
+        hint: props === null || props === void 0 ? void 0 : props.hint
+      }))
+    );
+  }
+  isSelected(item) {
+    const val = this.state.props.datafield === 'All Fields' ? item.dataObject : item.datafield;
+    return this.state.props.datavalue === val;
+  }
+  onItemSelect(item, isPlaceholder) {
+    this.isDefaultValue = false;
+    this.onChange(isPlaceholder ? '' : this.state.props.datafield === 'All Fields' ? item.dataObject : item.datafield);
+    this.hide();
+  }
+  renderSelectItem(item, index, isPlaceholder, isLast) {
+    let selected = this.isSelected(item);
+    return /*#__PURE__*/React.createElement(Tappable, _extends({}, this.getTestPropsForAction('selectitem' + index), {
+      onTap: this.onItemSelect.bind(this, item, isPlaceholder),
+      accessibilityProps: {
+        ...getAccessibilityProps(AccessibilityWidgetType.SELECT, {
+          ...this.props,
+          expanded: this.state.isOpened
+        })
+      },
+      disableTouchEffect: this.state.props.disabletoucheffect
+    }), /*#__PURE__*/React.createElement(View, {
+      style: [this.styles.selectItem, isLast ? this.styles.lastSelectItem : null, selected ? this.styles.selectedItem : null]
+    }, /*#__PURE__*/React.createElement(Text, _extends({}, this.getTestPropsForLabel('label' + index), {
+      style: [this.styles.selectItemText, {
+        color: isPlaceholder ? this.styles.placeholderText.color : selected ? this.styles.selectedItemText.color : this.styles.selectItemText.color
+      }]
+    }), isPlaceholder ? this.state.props.placeholder : item.displayexp || item.displayfield), /*#__PURE__*/React.createElement(WmIcon, {
+      id: this.getTestId('checkicon' + index),
+      iconclass: "wi wi-check",
+      styles: this.theme.mergeStyle(this.styles.checkIcon, {
+        root: {
+          opacity: !isPlaceholder && selected ? 1 : 0
+        }
+      })
+    })));
+  }
+  updateDefaultQueryModel() {
+    if (this.state.dataItems && this.state.dataItems.length && this.isDefaultValue) {
+      const selectedItem = find(this.state.dataItems, item => item.selected);
+      selectedItem && this.updateState({
+        props: {
+          displayValue: selectedItem.displayexp || selectedItem.displayfield || ''
+        }
+      });
+    }
+  }
+  componentDidMount() {
+    super.componentDidMount();
+    this.updateDefaultQueryModel();
+  }
+  onDataItemsUpdate() {
+    super.onDataItemsUpdate();
+    this.updateDefaultQueryModel();
+  }
+  renderWidget(props) {
+    var _this$state$props$cla;
+    let isDropdown = (_this$state$props$cla = this.state.props.classname) === null || _this$state$props$cla === void 0 ? void 0 : _this$state$props$cla.includes('select-dropdown');
+    const styles = this.theme.mergeStyle(this.styles, this.theme.getStyle('select-dropdown'));
+    if (isDropdown && this.state.selectWidth) {
+      styles.modalContent.width = this.styles.dropdown.width || this.state.selectWidth;
+    }
+    return /*#__PURE__*/React.createElement(View, {
+      onLayout: event => {
+        isDropdown ? this.computePosition(event) : () => {};
+        this.handleLayout(event);
+      },
+      style: [this.styles.rootWrapper]
+    }, this._background, this.renderSelect(), this.state.isOpened ? /*#__PURE__*/React.createElement(ModalConsumer, null, modalService => {
+      const items = this.state.dataItems;
+      modalService.showModal(this.prepareModalOptions(/*#__PURE__*/React.createElement(ScrollView, {
+        style: isDropdown ? [{
+          width: this.state.selectWidth
+        }, this.styles.dropdown] : {
+          width: '100%',
+          maxHeight: Dimensions.get('window').height - 64 - (StatusBar.currentHeight || 0)
+        },
+        contentContainerStyle: this.styles.dropDownContent
+      }, props.placeholder ? /*#__PURE__*/React.createElement(View, {
+        key: props.name + '_placeholder',
+        style: this.styles.placeholderText
+      }, this.renderSelectItem({}, 0, true, false)) : null, items && items.map((item, index) => /*#__PURE__*/React.createElement(View, {
+        key: item.key
+      }, this.renderSelectItem(item, index, false, index === items.length - 1)))), isDropdown ? styles : this.styles, modalService));
+      return null;
+    }) : null);
+  }
+}
+//# sourceMappingURL=select.component.js.map