@wavemaker-ai/app-rn-runtime 1.0.0-rc.647469

package/components/container/tile/tile.component.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","BaseComponent","BaseComponentState","WmTileProps","DEFAULT_CLASS","Tappable","Animatedview","createSkeleton","WmTileState","WmTile","constructor","props","renderSkeleton","showskeletonchildren","_this$props","skeletonStyles","styles","skeleton","root","text","theme","createElement","style","opacity","children","getBackground","_showSkeleton","_background","renderWidget","_extends","getTestPropsForAction","target","width","disableTouchEffect","state","disabletoucheffect","onLayout","event","handleLayout","entryanimation","animation","delay","animationdelay"],"sources":["tile.component.tsx"],"sourcesContent":["import React from 'react';\nimport { LayoutChangeEvent, View } from 'react-native'\nimport { BaseComponent, BaseComponentState } from '@wavemaker-ai/app-rn-runtime/core/base.component';\n\nimport WmTileProps from './tile.props';\nimport { DEFAULT_CLASS, WmTileStyles } from './tile.styles';\nimport { Tappable } from '@wavemaker-ai/app-rn-runtime/core/tappable.component';\nimport { Animatedview } from '@wavemaker-ai/app-rn-runtime/components/basic/animatedview.component';\nimport { WmSkeletonStyles } from '@wavemaker-ai/app-rn-runtime/components/basic/skeleton/skeleton.styles';\nimport { createSkeleton } from '@wavemaker-ai/app-rn-runtime/components/basic/skeleton/skeleton.component';\n\nexport class WmTileState extends BaseComponentState<WmTileProps> {}\n\nexport default class WmTile extends BaseComponent<WmTileProps, WmTileState, WmTileStyles> {\n\n  constructor(props: WmTileProps) {\n    super(props, DEFAULT_CLASS, new WmTileProps());\n  }\n\n  public renderSkeleton(props: WmTileProps): React.ReactNode {\n    if(!props.showskeletonchildren) {\n      const skeletonStyles: WmSkeletonStyles = this.props?.styles?.skeleton || { root: {}, text: {}  } as WmSkeletonStyles\n      return createSkeleton(this.theme, skeletonStyles, {\n        ...this.styles.root\n      }, (<View style={[this.styles.root, { opacity: 0 }]}>\n        {props.children}\n      </View>))\n    }\n    return null;\n  }\n\n  getBackground(): React.JSX.Element | null {\n    return this._showSkeleton ? null : this._background\n  }\n\n  renderWidget(props: WmTileProps) {\n    const styles = this._showSkeleton ? {\n      ...this.styles.root,\n      ...this.styles.skeleton.root\n     } : this.styles.root;\n\n    return (\n    <Tappable\n      {...this.getTestPropsForAction()}\n      target={this}\n      styles={{\n        width: '100%'\n      }}\n      disableTouchEffect={this.state.props.disabletoucheffect}\n      onLayout={(event: LayoutChangeEvent) => this.handleLayout(event)}\n    >\n      <Animatedview entryanimation={props.animation} delay={props.animationdelay} style={styles}>{this.getBackground()}{props.children}</Animatedview>\n    </Tappable>);\n  }\n}\n\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAA4BC,IAAI,QAAQ,cAAc;AACtD,SAASC,aAAa,EAAEC,kBAAkB,QAAQ,kDAAkD;AAEpG,OAAOC,WAAW,MAAM,cAAc;AACtC,SAASC,aAAa,QAAsB,eAAe;AAC3D,SAASC,QAAQ,QAAQ,sDAAsD;AAC/E,SAASC,YAAY,QAAQ,sEAAsE;AAEnG,SAASC,cAAc,QAAQ,2EAA2E;AAE1G,OAAO,MAAMC,WAAW,SAASN,kBAAkB,CAAc;AAEjE,eAAe,MAAMO,MAAM,SAASR,aAAa,CAAyC;EAExFS,WAAWA,CAACC,KAAkB,EAAE;IAC9B,KAAK,CAACA,KAAK,EAAEP,aAAa,EAAE,IAAID,WAAW,CAAC,CAAC,CAAC;EAChD;EAEOS,cAAcA,CAACD,KAAkB,EAAmB;IACzD,IAAG,CAACA,KAAK,CAACE,oBAAoB,EAAE;MAAA,IAAAC,WAAA;MAC9B,MAAMC,cAAgC,GAAG,EAAAD,WAAA,OAAI,CAACH,KAAK,cAAAG,WAAA,gBAAAA,WAAA,GAAVA,WAAA,CAAYE,MAAM,cAAAF,WAAA,uBAAlBA,WAAA,CAAoBG,QAAQ,KAAI;QAAEC,IAAI,EAAE,CAAC,CAAC;QAAEC,IAAI,EAAE,CAAC;MAAG,CAAqB;MACpH,OAAOZ,cAAc,CAAC,IAAI,CAACa,KAAK,EAAEL,cAAc,EAAE;QAChD,GAAG,IAAI,CAACC,MAAM,CAACE;MACjB,CAAC,eAAGnB,KAAA,CAAAsB,aAAA,CAACrB,IAAI;QAACsB,KAAK,EAAE,CAAC,IAAI,CAACN,MAAM,CAACE,IAAI,EAAE;UAAEK,OAAO,EAAE;QAAE,CAAC;MAAE,GACjDZ,KAAK,CAACa,QACH,CAAE,CAAC;IACX;IACA,OAAO,IAAI;EACb;EAEAC,aAAaA,CAAA,EAA6B;IACxC,OAAO,IAAI,CAACC,aAAa,GAAG,IAAI,GAAG,IAAI,CAACC,WAAW;EACrD;EAEAC,YAAYA,CAACjB,KAAkB,EAAE;IAC/B,MAAMK,MAAM,GAAG,IAAI,CAACU,aAAa,GAAG;MAClC,GAAG,IAAI,CAACV,MAAM,CAACE,IAAI;MACnB,GAAG,IAAI,CAACF,MAAM,CAACC,QAAQ,CAACC;IACzB,CAAC,GAAG,IAAI,CAACF,MAAM,CAACE,IAAI;IAErB,oBACAnB,KAAA,CAAAsB,aAAA,CAAChB,QAAQ,EAAAwB,QAAA,KACH,IAAI,CAACC,qBAAqB,CAAC,CAAC;MAChCC,MAAM,EAAE,IAAK;MACbf,MAAM,EAAE;QACNgB,KAAK,EAAE;MACT,CAAE;MACFC,kBAAkB,EAAE,IAAI,CAACC,KAAK,CAACvB,KAAK,CAACwB,kBAAmB;MACxDC,QAAQ,EAAGC,KAAwB,IAAK,IAAI,CAACC,YAAY,CAACD,KAAK;IAAE,iBAEjEtC,KAAA,CAAAsB,aAAA,CAACf,YAAY;MAACiC,cAAc,EAAE5B,KAAK,CAAC6B,SAAU;MAACC,KAAK,EAAE9B,KAAK,CAAC+B,cAAe;MAACpB,KAAK,EAAEN;IAAO,GAAE,IAAI,CAACS,aAAa,CAAC,CAAC,EAAEd,KAAK,CAACa,QAAuB,CACvI,CAAC;EACb;AACF","ignoreList":[]}

package/components/container/tile/tile.props.js

@@ -0,0 +1,13 @@
+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-ai/app-rn-runtime/core/base.component';
+export default class WmTileProps extends BaseProps {
+  constructor(...args) {
+    super(...args);
+    _defineProperty(this, "animation", null);
+    _defineProperty(this, "animationdelay", null);
+    _defineProperty(this, "children", void 0);
+  }
+}
+//# sourceMappingURL=tile.props.js.map

package/components/container/tile/tile.props.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["BaseProps","WmTileProps","constructor","args","_defineProperty"],"sources":["tile.props.ts"],"sourcesContent":["import { BaseProps } from '@wavemaker-ai/app-rn-runtime/core/base.component';\n\nexport default class WmTileProps extends BaseProps {\n  animation: string = null as any;\n  animationdelay?: number = null as any;\n  children: any;\n}\n\n"],"mappings":";;;AAAA,SAASA,SAAS,QAAQ,kDAAkD;AAE5E,eAAe,MAAMC,WAAW,SAASD,SAAS,CAAC;EAAAE,YAAA,GAAAC,IAAA;IAAA,SAAAA,IAAA;IAAAC,eAAA,oBAC7B,IAAI;IAAAA,eAAA,yBACE,IAAI;IAAAA,eAAA;EAAA;AAEhC","ignoreList":[]}

package/components/container/tile/tile.styles.js

@@ -0,0 +1,38 @@
+import BASE_THEME from '@wavemaker-ai/app-rn-runtime/styles/theme';
+import { defineStyles } from '@wavemaker-ai/app-rn-runtime/core/base.component';
+export const DEFAULT_CLASS = 'app-tile';
+BASE_THEME.registerStyle((themeVariables, addStyle) => {
+  const defaultStyles = defineStyles({
+    root: {
+      borderRadius: 6,
+      borderWidth: 1,
+      borderStyle: 'solid',
+      borderColor: themeVariables.transparent,
+      padding: 12
+    },
+    text: {},
+    skeleton: {
+      root: {
+        width: '100%'
+      }
+    }
+  });
+  addStyle(DEFAULT_CLASS, '', defaultStyles);
+  addStyle('tile-template-text', '', {
+    text: {
+      color: themeVariables.tilePrimaryTextColor
+    }
+  });
+  addStyle('well', '', {
+    root: {
+      padding: 20,
+      marginBottom: 20,
+      borderWidth: 1,
+      backgroundColor: themeVariables.tileWellbgColor,
+      borderColor: themeVariables.tileWellBorderColor,
+      borderStyle: 'solid',
+      borderRadius: 2
+    }
+  });
+});
+//# sourceMappingURL=tile.styles.js.map

package/components/container/tile/tile.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["BASE_THEME","defineStyles","DEFAULT_CLASS","registerStyle","themeVariables","addStyle","defaultStyles","root","borderRadius","borderWidth","borderStyle","borderColor","transparent","padding","text","skeleton","width","color","tilePrimaryTextColor","marginBottom","backgroundColor","tileWellbgColor","tileWellBorderColor"],"sources":["tile.styles.ts"],"sourcesContent":["import BASE_THEME from '@wavemaker-ai/app-rn-runtime/styles/theme';\nimport { BaseStyles, defineStyles } from '@wavemaker-ai/app-rn-runtime/core/base.component';\nimport { WmSkeletonStyles } from '@wavemaker-ai/app-rn-runtime/components/basic/skeleton/skeleton.styles';\n\nexport type WmTileStyles = BaseStyles & {\n  skeleton: WmSkeletonStyles\n};\n\nexport const DEFAULT_CLASS = 'app-tile';\nBASE_THEME.registerStyle((themeVariables, addStyle) => {\n  const defaultStyles: WmTileStyles = defineStyles({\n      root: {\n        borderRadius: 6,\n        borderWidth: 1,\n        borderStyle: 'solid',\n        borderColor: themeVariables.transparent,\n        padding: 12\n      },\n      text: {},\n      skeleton: {\n        root:{\n          width: '100%',\n        },\n      } as any as WmSkeletonStyles\n  });\n\n  addStyle(DEFAULT_CLASS, '', defaultStyles);\n\n  addStyle('tile-template-text', '', {\n    text: {\n      color: themeVariables.tilePrimaryTextColor\n    }\n  } as any);\n\n  addStyle('well', '', {\n    root: {\n      padding: 20,\n      marginBottom: 20,\n      borderWidth: 1,\n      backgroundColor: themeVariables.tileWellbgColor,\n      borderColor: themeVariables.tileWellBorderColor,\n      borderStyle: 'solid',\n      borderRadius: 2\n    }\n  });\n});\n"],"mappings":"AAAA,OAAOA,UAAU,MAAM,2CAA2C;AAClE,SAAqBC,YAAY,QAAQ,kDAAkD;AAO3F,OAAO,MAAMC,aAAa,GAAG,UAAU;AACvCF,UAAU,CAACG,aAAa,CAAC,CAACC,cAAc,EAAEC,QAAQ,KAAK;EACrD,MAAMC,aAA2B,GAAGL,YAAY,CAAC;IAC7CM,IAAI,EAAE;MACJC,YAAY,EAAE,CAAC;MACfC,WAAW,EAAE,CAAC;MACdC,WAAW,EAAE,OAAO;MACpBC,WAAW,EAAEP,cAAc,CAACQ,WAAW;MACvCC,OAAO,EAAE;IACX,CAAC;IACDC,IAAI,EAAE,CAAC,CAAC;IACRC,QAAQ,EAAE;MACRR,IAAI,EAAC;QACHS,KAAK,EAAE;MACT;IACF;EACJ,CAAC,CAAC;EAEFX,QAAQ,CAACH,aAAa,EAAE,EAAE,EAAEI,aAAa,CAAC;EAE1CD,QAAQ,CAAC,oBAAoB,EAAE,EAAE,EAAE;IACjCS,IAAI,EAAE;MACJG,KAAK,EAAEb,cAAc,CAACc;IACxB;EACF,CAAQ,CAAC;EAETb,QAAQ,CAAC,MAAM,EAAE,EAAE,EAAE;IACnBE,IAAI,EAAE;MACJM,OAAO,EAAE,EAAE;MACXM,YAAY,EAAE,EAAE;MAChBV,WAAW,EAAE,CAAC;MACdW,eAAe,EAAEhB,cAAc,CAACiB,eAAe;MAC/CV,WAAW,EAAEP,cAAc,CAACkB,mBAAmB;MAC/CZ,WAAW,EAAE,OAAO;MACpBF,YAAY,EAAE;IAChB;EACF,CAAC,CAAC;AACJ,CAAC,CAAC","ignoreList":[]}

package/components/container/wizard/wizard.component.js

@@ -0,0 +1,550 @@
+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 { Text, View, TouchableOpacity, Platform, TouchableWithoutFeedback } from 'react-native';
+import { isArray, merge } from 'lodash';
+import { BaseComponent, BaseComponentState } from '@wavemaker-ai/app-rn-runtime/core/base.component';
+import WmWizardProps from './wizard.props';
+import { DEFAULT_CLASS } from './wizard.styles';
+import WmButton from '@wavemaker-ai/app-rn-runtime/components/basic/button/button.component';
+import WmIcon from '@wavemaker-ai/app-rn-runtime/components/basic/icon/icon.component';
+import WmAnchor from '@wavemaker-ai/app-rn-runtime/components/basic/anchor/anchor.component';
+import WmProgressCircle from '@wavemaker-ai/app-rn-runtime/components/basic/progress-circle/progress-circle.component';
+import WmPopover from '@wavemaker-ai/app-rn-runtime/components/navigation/popover/popover.component';
+import WmLabel from '@wavemaker-ai/app-rn-runtime/components/basic/label/label.component';
+import { createSkeleton } from '@wavemaker-ai/app-rn-runtime/components/basic/skeleton/skeleton.component';
+export class WmWizardState extends BaseComponentState {
+  constructor(...args) {
+    super(...args);
+    _defineProperty(this, "currentStep", 0);
+    _defineProperty(this, "isDone", false);
+  }
+}
+export default class WmWizard extends BaseComponent {
+  constructor(props) {
+    super(props, DEFAULT_CLASS, new WmWizardProps());
+    _defineProperty(this, "numberOfSteps", null);
+    _defineProperty(this, "steps", []);
+    _defineProperty(this, "popOverRef", null);
+    _defineProperty(this, "listener", {
+      onComponentInit: c => {
+        if (c instanceof WmPopover) {
+          this.popOverRef = c;
+        }
+      }
+    });
+  }
+  updateDefaultStep() {
+    const steps = this.steps;
+    const props = this.props;
+    let defaultStepIndex = 0;
+    if (isArray(steps) && props.defaultstep) {
+      steps && steps.map((item, index) => {
+        if (props.defaultstep === item.props.name) {
+          defaultStepIndex = index;
+        }
+      });
+    }
+    this.updateCurrentStep(defaultStepIndex);
+  }
+  addWizardStep(step) {
+    this.steps[step.props.index] = step;
+    this.forceUpdate();
+  }
+  componentDidMount() {
+    super.componentDidMount();
+    if (this.props.defaultstep && this.props.defaultstep != 'none') {
+      this.updateDefaultStep();
+    }
+  }
+  componentDidUpdate(prevProps, prevState, snapshot) {
+    super.componentDidUpdate && super.componentDidUpdate(prevProps, prevState, snapshot);
+    // * when a variable is bind to default step
+    if (this.props.defaultstep && prevProps.defaultstep !== this.props.defaultstep) {
+      this.updateDefaultStep();
+    }
+  }
+  showActiveStep() {
+    var _this$steps$this$stat;
+    (_this$steps$this$stat = this.steps[this.state.currentStep]) === null || _this$steps$this$stat === void 0 || _this$steps$this$stat.setActive();
+  }
+  updateCurrentStep(index, isDone = false) {
+    var _this$steps$this$stat2, _this$steps$nextStep;
+    const lastStep = this.state.currentStep;
+    let nextStep = index;
+    (_this$steps$this$stat2 = this.steps[this.state.currentStep]) === null || _this$steps$this$stat2 === void 0 || _this$steps$this$stat2.setInActive();
+
+    // check for next available step if next or prev steps show prop is false
+    if ((_this$steps$nextStep = this.steps[nextStep]) !== null && _this$steps$nextStep !== void 0 && _this$steps$nextStep.state && !this.steps[nextStep].state.props.show) {
+      if (lastStep < nextStep) {
+        for (let i = nextStep + 1; i < this.steps.length; i++) {
+          if (this.steps[i].state.props.show) {
+            nextStep = i;
+            break;
+          }
+        }
+      } else if (lastStep > nextStep) {
+        for (let i = nextStep - 1; i >= 0; i--) {
+          if (this.steps[i].state.props.show) {
+            nextStep = i;
+            break;
+          }
+        }
+      }
+    }
+    this.updateState({
+      currentStep: nextStep,
+      isDone: isDone
+    }, () => {
+      this.showActiveStep();
+      if (lastStep !== nextStep) {
+        this.invokeEventCallback('onChange', [null, this.proxy, nextStep + 1, lastStep + 1]);
+      }
+    });
+    this.forceUpdate();
+  }
+  getStepStyle(index) {
+    const style = [this.styles.step];
+    if (this.state.isDone || index < this.state.currentStep) {
+      style.push(this.styles.doneStep);
+    } else if (this.state.currentStep === index) {
+      style.push(this.styles.activeStep);
+    }
+    return style;
+  }
+  renderMenuPopover() {
+    const menuDataset = this.props.getmenudataexpression || ((item, index) => '');
+    const Labels = this.steps.map(step => step.state.props.title);
+    return /*#__PURE__*/React.createElement(WmPopover, {
+      id: this.getTestId('menu'),
+      styles: this.styles.popover,
+      contentanimation: 'slideInDown',
+      caption: '',
+      popoverheight: this.styles.popover.popover.height || null,
+      popoverwidth: this.styles.popover.popover.width || null,
+      listener: this.listener,
+      iconclass: this.props.popovericonclass || 'fa fa-caret-down',
+      iconposition: "right",
+      type: "dropdown"
+    }, /*#__PURE__*/React.createElement(View, {
+      style: this.styles.popover.popover
+    }, Labels.map((item, index) => {
+      const currentMenuItem = index == this.state.currentStep;
+      const caption = menuDataset({
+        "count": this.steps.length
+      }, index);
+      return /*#__PURE__*/React.createElement(TouchableWithoutFeedback, {
+        key: 'wizard_menu_item_' + index,
+        onPress: () => {
+          this.popOverRef.hide();
+        }
+      }, /*#__PURE__*/React.createElement(View, {
+        style: [this.styles.stepMenu, currentMenuItem ? this.styles.activeStepMenu : {}]
+      }, /*#__PURE__*/React.createElement(WmIcon, {
+        id: this.getTestId('icon'),
+        caption: caption,
+        iconclass: currentMenuItem ? "wi wi-radio-button-checked" : 'wi wi-radio-button-unchecked',
+        styles: currentMenuItem ? this.styles.stepMenuActiveIcon : this.styles.stepMenuIcon
+      }), /*#__PURE__*/React.createElement(WmLabel, {
+        caption: item,
+        styles: currentMenuItem ? this.styles.stepMenuActiveLabel : this.styles.stepMenuLabel
+      })));
+    })));
+  }
+  renderProgressCircleHeader(item, index) {
+    const progressTitle = this.props.progresstitle || index + 1 + '/' + this.steps.length;
+    return /*#__PURE__*/React.createElement(View, {
+      style: [this.styles.headerWrapper],
+      key: index + 1
+    }, /*#__PURE__*/React.createElement(View, {
+      style: this.styles.stepWrapper
+    }, /*#__PURE__*/React.createElement(View, {
+      style: {
+        flex: 1,
+        alignItems: 'flex-start',
+        justifyContent: 'center',
+        flexDirection: 'row'
+      }
+    }, /*#__PURE__*/React.createElement(WmProgressCircle, {
+      id: this.getTestId('progress'),
+      minvalue: 0,
+      maxvalue: this.steps.length,
+      datavalue: index + 1,
+      captionplacement: 'inside',
+      type: this.props.progresstype,
+      title: progressTitle,
+      subtitle: '',
+      styles: this.styles.progressCircle
+    })), /*#__PURE__*/React.createElement(View, {
+      style: this.styles.stepTitleWrapper
+    }, /*#__PURE__*/React.createElement(Text, _extends({
+      style: this.styles.stepTitle
+    }, this.getTestPropsForLabel('step' + (index + 1) + '_title')), item.props.title || 'Step Title'), /*#__PURE__*/React.createElement(Text, _extends({
+      style: this.styles.stepSubTitle
+    }, this.getTestPropsForLabel('step' + (index + 1) + '_subtitle')), item.props.subtitle || 'Step Sub Title')), /*#__PURE__*/React.createElement(View, {
+      style: {
+        flexDirection: 'row',
+        alignItems: 'flex-end',
+        justifyContent: 'flex-end',
+        flex: 1
+      }
+    }, this.renderMenuPopover())));
+  }
+  stepConnectorWidth(isFirstOrLastConnector, stepIndex) {
+    if (stepIndex === this.lastStepIndex() || stepIndex === this.firstStepIndex()) {
+      return '50%';
+    }
+    return isFirstOrLastConnector ? '50%' : '100%';
+  }
+  stepConnectorHeight(isFirstOrLastConnector, stepIndex) {
+    if (stepIndex === this.lastStepIndex() || stepIndex === this.firstStepIndex()) {
+      return '50%';
+    }
+    return isFirstOrLastConnector ? '50%' : '100%';
+  }
+  getDotStyle(index) {
+    const style = [this.styles.stepDot];
+    if (this.state.currentStep === index) {
+      style.push(this.styles.activeStepDot);
+    }
+    return style;
+  }
+  renderDot(index) {
+    return /*#__PURE__*/React.createElement(View, {
+      style: this.getDotStyle(index)
+    });
+  }
+  getConnectorPosition() {
+    var _this$styles;
+    const stepStyles = (_this$styles = this.styles) === null || _this$styles === void 0 ? void 0 : _this$styles.step;
+    if (!stepStyles) return {};
+    const cssWidth = stepStyles.width;
+    const cssHeight = stepStyles.height;
+    const parseStyleValue = value => {
+      if (typeof value === 'number') {
+        return value;
+      }
+      if (typeof value === 'string') {
+        const numValue = parseFloat(value);
+        return isNaN(numValue) ? null : numValue;
+      }
+      return null;
+    };
+    const width = parseStyleValue(cssWidth);
+    const height = parseStyleValue(cssHeight);
+    const result = {};
+    // Calculate connector positions based on actual circle dimensions
+    if (height !== null) {
+      result.top = height / 2 - 1;
+    }
+    if (width !== null) {
+      result.left = width / 2 - 1;
+    }
+    return result;
+  }
+  renderWizardHeader(item, index) {
+    var _this$state$props$cla, _this$state$props$cla2, _this$state$props$cla3, _this$state$props$cla4;
+    const isLastStep = index === this.lastStepIndex();
+    const isFirstStep = index === this.firstStepIndex();
+    const isActiveStep = index === this.state.currentStep;
+    const isNumberTextLayout = this.state.props.classname === 'number-text-inline';
+    const isVertical = (_this$state$props$cla = this.state.props.classname) === null || _this$state$props$cla === void 0 ? void 0 : _this$state$props$cla.includes('vertical');
+    const isDotted = (_this$state$props$cla2 = this.state.props.classname) === null || _this$state$props$cla2 === void 0 ? void 0 : _this$state$props$cla2.includes('dottedstepper');
+    const isStepperBasic = (_this$state$props$cla3 = this.state.props.classname) === null || _this$state$props$cla3 === void 0 ? void 0 : _this$state$props$cla3.includes('stepper-basic');
+    const isIconStepper = (_this$state$props$cla4 = this.state.props.classname) === null || _this$state$props$cla4 === void 0 ? void 0 : _this$state$props$cla4.includes('iconstepper');
+    const wizardStepCountVisibility = index >= this.state.currentStep && !this.state.isDone || !this.state.currentStep;
+    return item.state.props.show !== false ? /*#__PURE__*/React.createElement(View, {
+      style: [this.styles.headerWrapper, isNumberTextLayout ? {
+        paddingRight: isActiveStep ? 0 : 5,
+        paddingLeft: index === this.state.currentStep + 1 ? 0 : 5
+      } : {}],
+      key: index + 1
+    }, /*#__PURE__*/React.createElement(TouchableOpacity, {
+      style: this.styles.stepWrapper,
+      onPress: this.updateCurrentStep.bind(this, index, false),
+      disabled: index >= this.state.currentStep || !this.state.props.headernavigation,
+      accessibilityRole: "header"
+    }, !this._showSkeleton ? isStepperBasic ? /*#__PURE__*/React.createElement(View, _extends({
+      style: this.getStepStyle(index)
+    }, this.getTestPropsForAction('step' + index))) : /*#__PURE__*/React.createElement(View, _extends({
+      style: this.getStepStyle(index)
+    }, this.getTestPropsForAction('step' + index)), isIconStepper ? /*#__PURE__*/React.createElement(WmIcon, {
+      id: this.getTestId('stepicon'),
+      styles: isActiveStep ? merge({}, this.styles.stepIcon, {
+        icon: {
+          color: this.styles.activeStep.color
+        }
+      }) : index < this.state.currentStep || this.state.isDone ? merge({}, this.styles.stepIcon, {
+        icon: {
+          color: this.styles.doneStep.color
+        }
+      }) : this.styles.stepIcon,
+      iconclass: item.state.props.iconclass
+    }) : isDotted ? /*#__PURE__*/React.createElement(React.Fragment, null, index < this.state.currentStep || this.state.isDone ? /*#__PURE__*/React.createElement(WmIcon, {
+      id: this.getTestId('status'),
+      styles: isActiveStep ? merge({}, this.styles.stepIcon, {
+        icon: {
+          color: this.styles.activeStep.color
+        }
+      }) : this.styles.stepIcon,
+      iconclass: item.state.props.iconclass || 'wm-sl-l sl-check'
+    }) : this.renderDot(index)) : /*#__PURE__*/React.createElement(React.Fragment, null, wizardStepCountVisibility && /*#__PURE__*/React.createElement(Text, _extends({
+      style: isActiveStep ? [this.styles.activeStep, this.styles.activeStepCounter] : this.styles.stepCounter
+    }, this.getTestPropsForLabel('step' + (index + 1) + '_indicator')), index + 1), (index < this.state.currentStep || this.state.isDone) && /*#__PURE__*/React.createElement(WmIcon, {
+      id: this.getTestId('status'),
+      styles: isActiveStep ? merge({}, this.styles.stepIcon, {
+        icon: {
+          color: this.styles.activeStep.color
+        }
+      }) : this.styles.stepIcon,
+      iconclass: item.state.props.iconclass || 'wm-sl-l sl-check'
+    }))) : /*#__PURE__*/React.createElement(WmLabel, {
+      showskeleton: true,
+      styles: {
+        root: {
+          ...this.getStepStyle(index)[0]
+        }
+      }
+    }), (isActiveStep || isIconStepper || this.state.props.showalltitles) && /*#__PURE__*/React.createElement(View, {
+      style: this.styles.stepTitleWrapper
+    }, /*#__PURE__*/React.createElement(Text, _extends({
+      style: this.styles.stepTitle
+    }, this.getTestPropsForLabel('step' + (index + 1) + '_title')), item.state.props.title || 'Step Title'), /*#__PURE__*/React.createElement(Text, _extends({
+      style: this.styles.stepSubTitle
+    }, this.getTestPropsForLabel('step' + (index + 1) + '_subtitle')), item.state.props.subtitle)), !isStepperBasic && this.numberOfSteps > 1 && isActiveStep && /*#__PURE__*/React.createElement(View, {
+      style: [this.styles.numberTextStepConnector, {
+        width: isLastStep ? 0 : 50
+      }]
+    })), !isStepperBasic && this.getTotalVisibleSteps() > 1 && item.state.props.show && !isVertical && /*#__PURE__*/React.createElement(View, {
+      style: [this.styles.stepConnector, {
+        width: this.stepConnectorWidth(isFirstStep || isLastStep, index),
+        left: Platform.OS === "web" ? !this.isRTL && isFirstStep || this.isRTL && isLastStep ? '50%' : '0%' : isFirstStep ? '50%' : '0%'
+      }, this.getConnectorPosition().top ? {
+        top: this.getConnectorPosition().top
+      } : {}]
+    }), !isStepperBasic && this.getTotalVisibleSteps() > 1 && item.state.props.show && isVertical && /*#__PURE__*/React.createElement(View, {
+      style: [this.styles.stepConnector, {
+        height: this.stepConnectorHeight(isFirstStep || isLastStep, index),
+        top: isFirstStep ? '50%' : '0%'
+      }, this.getConnectorPosition().left ? {
+        left: this.getConnectorPosition().left
+      } : {}]
+    })) : null;
+  }
+  prev() {
+    if (this.state.props.skipdefaultprevious) {
+      this.invokeEventCallback('onPrev', ['prev', this.proxy]);
+      return;
+    }
+    const index = this.state.currentStep;
+    if (index <= 0) {
+      return;
+    }
+    const currentStep = this.steps[index];
+    this.invokeEventCallback('onPrev', ['prev', this.proxy]);
+    if (currentStep.invokePrevCB(index) == false) {
+      return;
+    }
+    this.updateCurrentStep(index - 1);
+  }
+  previous() {
+    this.prev();
+  }
+  next(eventName) {
+    if (eventName !== 'skip' && this.state.props.skipdefaultnext) {
+      this.invokeEventCallback('onNext', ['next', this.proxy]);
+      return;
+    }
+    const index = this.state.currentStep;
+    if (index >= this.steps.length - 1) {
+      return;
+    }
+    const currentStep = this.steps[index];
+    if (eventName === 'skip') {
+      this.invokeEventCallback('onSkip', ['skip', this.proxy]);
+      currentStep.invokeSkipCB(index);
+    } else {
+      this.invokeEventCallback('onNext', ['next', this.proxy]);
+      if (currentStep.invokeNextCB(index) == false) {
+        return;
+      }
+    }
+    this.updateCurrentStep(index + 1);
+  }
+  done($event) {
+    if (this.state.props.skipdefaultdone) {
+      this.invokeEventCallback('onDone', ['done', this.proxy]);
+      return;
+    }
+    if (this.state.currentStep !== this.lastStepIndex()) {
+      return;
+    }
+    this.updateState({
+      isDone: true
+    });
+    this.invokeEventCallback('onDone', ['done', this.proxy]);
+  }
+  cancel() {
+    this.invokeEventCallback('onCancel', ['cancel', this.proxy]);
+    if (this.state.props.skipdefaultcancel) {
+      return;
+    }
+  }
+  skip() {
+    if (this.state.props.skipdefaultskip) {
+      this.invokeEventCallback('onSkip', ['skip', this.proxy]);
+      return;
+    }
+    this.next('skip');
+  }
+  hasPreviousStep() {
+    var _this$steps$this$stat3;
+    return this.state.currentStep > 0 && ((_this$steps$this$stat3 = this.steps[this.state.currentStep]) === null || _this$steps$this$stat3 === void 0 ? void 0 : _this$steps$this$stat3.state.props.showprev) !== false;
+  }
+  hasNextStep() {
+    var _this$steps$this$stat4;
+    return this.state.currentStep < this.lastStepIndex() && ((_this$steps$this$stat4 = this.steps[this.state.currentStep]) === null || _this$steps$this$stat4 === void 0 ? void 0 : _this$steps$this$stat4.state.props.shownext) !== false;
+  }
+  hasNoNextStep() {
+    var _this$steps$this$stat5;
+    return this.state.currentStep === this.lastStepIndex() && ((_this$steps$this$stat5 = this.steps[this.state.currentStep]) === null || _this$steps$this$stat5 === void 0 ? void 0 : _this$steps$this$stat5.state.props.showdone) !== false;
+  }
+  isSkippable() {
+    var _this$steps$this$stat6;
+    return !!((_this$steps$this$stat6 = this.steps[this.state.currentStep]) !== null && _this$steps$this$stat6 !== void 0 && _this$steps$this$stat6.state.props.enableskip);
+  }
+  disablePrevious() {
+    var _this$steps$this$stat7;
+    return !!((_this$steps$this$stat7 = this.steps[this.state.currentStep]) !== null && _this$steps$this$stat7 !== void 0 && _this$steps$this$stat7.state.props.disableprev);
+  }
+  disableNext() {
+    var _this$steps$this$stat8;
+    return !!((_this$steps$this$stat8 = this.steps[this.state.currentStep]) !== null && _this$steps$this$stat8 !== void 0 && _this$steps$this$stat8.state.props.disablenext);
+  }
+  disableDone() {
+    var _this$steps$this$stat9;
+    return !!((_this$steps$this$stat9 = this.steps[this.state.currentStep]) !== null && _this$steps$this$stat9 !== void 0 && _this$steps$this$stat9.state.props.disabledone);
+  }
+  isCancelable() {
+    return !!this.state.props.cancelable;
+  }
+  getBackground() {
+    return this._showSkeleton ? null : this._background;
+  }
+  lastStepIndex() {
+    let lastStep = 0;
+    for (let i = 0; i < this.steps.length; i++) {
+      if (this.steps[i].state.props.show) {
+        lastStep = i;
+      }
+    }
+    return lastStep;
+  }
+  firstStepIndex() {
+    let firstStep = -1;
+    for (let i = 0; i < this.steps.length; i++) {
+      if (this.steps[i].state.props.show) {
+        if (firstStep === -1) {
+          firstStep = i;
+        }
+      }
+    }
+    return firstStep;
+  }
+  getTotalVisibleSteps() {
+    let lastStep = 0;
+    for (let i = 0; i < this.steps.length; i++) {
+      if (this.steps[i].state.props.show) {
+        lastStep++;
+      }
+    }
+    return lastStep;
+  }
+  renderSkeleton(props) {
+    if (!props.showskeletonchildren) {
+      var _this$props;
+      const skeletonStyles = ((_this$props = this.props) === null || _this$props === void 0 || (_this$props = _this$props.styles) === null || _this$props === void 0 ? void 0 : _this$props.skeleton) || {
+        root: {},
+        text: {}
+      };
+      return createSkeleton(this.theme, skeletonStyles, {
+        ...this.styles.root
+      }, /*#__PURE__*/React.createElement(View, {
+        style: [this.styles.root, {
+          opacity: 0
+        }]
+      }, props.children));
+    }
+    return null;
+  }
+  renderWidget(props) {
+    var _this$state$props$cla5;
+    this.numberOfSteps = this.steps.length;
+    const activeStep = this.steps[this.state.currentStep];
+    const isSkippable = activeStep && activeStep.state.props.enableskip;
+    const isProgressCircleHeader = (_this$state$props$cla5 = this.state.props.classname) === null || _this$state$props$cla5 === void 0 ? void 0 : _this$state$props$cla5.includes('progress-circle-header');
+    const styles = this._showSkeleton ? {
+      ...this.styles.root,
+      ...this.styles.skeleton.root
+    } : this.styles.root;
+    if (props.showactions) {
+      return /*#__PURE__*/React.createElement(View, {
+        style: styles,
+        onLayout: event => this.handleLayout(event)
+      }, this.getBackground(), /*#__PURE__*/React.createElement(View, {
+        style: this.styles.wizardHeader
+      }, activeStep && isProgressCircleHeader ? this.renderProgressCircleHeader(activeStep, this.state.currentStep) : this.steps ? this.steps.map((step, i) => this.renderWizardHeader(step, i)) : null), /*#__PURE__*/React.createElement(View, {
+        style: this.styles.wizardBody
+      }, props.children));
+    }
+    return /*#__PURE__*/React.createElement(View, {
+      style: styles,
+      onLayout: event => this.handleLayout(event)
+    }, this.getBackground(), /*#__PURE__*/React.createElement(View, {
+      style: this.styles.wizardHeader
+    }, activeStep && isProgressCircleHeader ? this.renderProgressCircleHeader(activeStep, this.state.currentStep) : this.steps ? this.steps.map((step, i) => this.renderWizardHeader(step, i)) : null), /*#__PURE__*/React.createElement(View, {
+      style: this.styles.wizardBody
+    }, props.children), /*#__PURE__*/React.createElement(View, {
+      style: [this.styles.wizardFooter, {
+        flexDirection: props.actionsalignment === 'right' ? 'row-reverse' : 'row'
+      }]
+    }, this.state.currentStep === this.lastStepIndex() && activeStep.state.props.showdone && /*#__PURE__*/React.createElement(WmButton, {
+      iconclass: props.donebtniconclass,
+      styles: merge({}, this.styles.wizardActions, this.theme.getStyle('btn-default'), this.styles.doneButton),
+      id: this.getTestId('donebtn'),
+      caption: props.donebtnlabel,
+      onTap: this.done.bind(this),
+      disabled: activeStep.state.props.disabledone
+    }), this.state.currentStep < this.lastStepIndex() && activeStep.state.props.shownext && /*#__PURE__*/React.createElement(WmButton, {
+      iconclass: 'wi wi-chevron-right',
+      styles: merge({}, this.styles.wizardActions, this.theme.getStyle('btn-default'), this.styles.nextButton),
+      id: this.getTestId('nextbtn'),
+      iconposition: 'right',
+      caption: props.nextbtnlabel,
+      onTap: this.next.bind(this),
+      disabled: activeStep.state.props.disablenext
+    }), this.state.currentStep > 0 && activeStep.state.props.showprev && /*#__PURE__*/React.createElement(WmButton, {
+      iconclass: 'wi wi-chevron-left',
+      styles: merge({}, this.theme.getStyle('btn-default'), this.styles.wizardActions, this.styles.prevButton),
+      caption: props.previousbtnlabel,
+      id: this.getTestId('prevbtn'),
+      onTap: this.prev.bind(this),
+      disabled: activeStep.state.props.disableprev
+    }), props.cancelable ? /*#__PURE__*/React.createElement(WmButton, {
+      id: this.getTestId('cancelbtn'),
+      caption: props.cancelbtnlabel,
+      styles: merge({}, this.theme.getStyle('btn-default'), this.styles.wizardActions, this.styles.cancelButton),
+      onTap: this.cancel.bind(this)
+    }) : null, isSkippable && /*#__PURE__*/React.createElement(WmAnchor, {
+      iconclass: 'wi wi-chevron-right',
+      iconposition: 'right',
+      caption: 'Skip',
+      id: this.getTestId('skip'),
+      styles: merge({}, this.styles.wizardActions, this.styles.skipLink),
+      onTap: this.skip.bind(this)
+    })));
+  }
+}
+//# sourceMappingURL=wizard.component.js.map