vueops-storybook 1.1.1 → 1.1.3

package/dist/index.js

@@ -1,8 +1,27 @@
 'use strict';
 
-require('react');
+var React = require('react');
 var reactNative = require('react-native');
 
+function _interopNamespaceDefault(e) {
+    var n = Object.create(null);
+    if (e) {
+        Object.keys(e).forEach(function (k) {
+            if (k !== 'default') {
+                var d = Object.getOwnPropertyDescriptor(e, k);
+                Object.defineProperty(n, k, d.get ? d : {
+                    enumerable: true,
+                    get: function () { return e[k]; }
+                });
+            }
+        });
+    }
+    n.default = e;
+    return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+
 const { width, height } = reactNative.Dimensions.get('window');
 const [shortDimension, longDimension] = width < height ? [width, height] : [height, width];
 
@@ -56,7 +75,7 @@ reactNative.StyleSheet.create({
   }
 });
 
-reactNative.StyleSheet.create({
+const storyBookCommonStyle = reactNative.StyleSheet.create({
   primaryButton: {
     backgroundColor: AppColors.primaryBlue,
     padding: scale(10),
@@ -85,11 +104,28 @@ reactNative.StyleSheet.create({
   }
 });
 
+var _path;
+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); }
+var SvgLeftArrow = function SvgLeftArrow(props) {
+  return /*#__PURE__*/React__namespace.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 16,
+    height: 14,
+    fill: "none"
+  }, props), _path || (_path = /*#__PURE__*/React__namespace.createElement("path", {
+    stroke: "#475467",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: 1.67,
+    d: "M15 7.25H1m0 0 5.25 5.25M1 7.25 6.25 2"
+  })));
+};
+
 const fontFamily = {
   robotoBold: "Roboto-bold",
   robotoMedium: "Roboto-Medium"
 };
-reactNative.StyleSheet.create({
+const storyBookCommonFontStyles = reactNative.StyleSheet.create({
   commonText: {
     fontWeight: "400",
     fontSize: scale(14),
@@ -115,7 +151,7 @@ reactNative.StyleSheet.create({
   }
 });
 
-reactNative.StyleSheet.create({
+const styles = reactNative.StyleSheet.create({
   button: {
     justifyContent: "center",
     marginHorizontal: "3%",
@@ -198,3 +234,52 @@ reactNative.StyleSheet.create({
 
 reactNative.Dimensions.get("window").width;
 reactNative.Dimensions.get("window").height;
+
+const ComponentStings = {
+  PRIMARY: "Primary",
+  SECONDARY: "Secondary",
+  TERTIARY: "Tertiary",
+  TRANSPARENT: "Transparent"};
+
+const Button = ({ title, onPress, variant = ComponentStings.PRIMARY, disabled, loading, leftIcon }) => {
+  const getButtonStyle = () => {
+    switch (variant) {
+      case ComponentStings.PRIMARY:
+        return storyBookCommonStyle.primaryButton;
+      case ComponentStings.SECONDARY:
+        return storyBookCommonStyle.secondaryButton;
+      case ComponentStings.TERTIARY:
+        return storyBookCommonStyle.tertiaryButton;
+      case ComponentStings.TRANSPARENT:
+        return storyBookCommonStyle.transparentButton;
+      default:
+        return storyBookCommonStyle.primaryButton;
+    }
+  };
+  const getTextStyle = () => {
+    switch (variant) {
+      case ComponentStings.PRIMARY:
+        return storyBookCommonFontStyles.primaryText;
+      case ComponentStings.SECONDARY:
+        return storyBookCommonFontStyles.secondaryText;
+      case ComponentStings.TERTIARY:
+        return styles.tertiaryText;
+      case ComponentStings.TRANSPARENT:
+        return styles.transparentText;
+      default:
+        return storyBookCommonFontStyles.primaryText;
+    }
+  };
+  return /* @__PURE__ */ React.createElement(
+    reactNative.TouchableOpacity,
+    {
+      activeOpacity: 0.8,
+      style: [getButtonStyle(), disabled && styles.disabledButton],
+      onPress,
+      disabled: disabled || loading
+    },
+    /* @__PURE__ */ React.createElement(reactNative.View, { style: styles.content }, leftIcon && /* @__PURE__ */ React.createElement(SvgLeftArrow, { right: 10 }), /* @__PURE__ */ React.createElement(reactNative.Text, { style: getTextStyle() }, title))
+  );
+};
+
+exports.Button = Button;

package/package.json

@@ -41,6 +41,15 @@
     "tsconfig-paths-webpack-plugin": "^4.2.0",
     "typescript": "^5.8.3"
   },
+  "version": "1.1.3",
+  "private": false,
+  "name": "vueops-storybook",
+  "type": "module",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
   "scripts": {
     "start": "expo start",
     "build": "rollup -c",
@@ -51,14 +60,5 @@
     "storybook": "cross-env STORYBOOK_ENABLED='true' expo start",
     "storybook:ios": "cross-env STORYBOOK_ENABLED='true' expo start --ios",
     "storybook:android": "cross-env STORYBOOK_ENABLED='true' expo start --android"
-  },
-  "version": "1.1.1",
-  "private": false,
-  "name": "vueops-storybook",
-  "type": "module",
-  "main": "dist/index.js",
-  "types": "dist/index.d.ts",
-  "files": [
-    "dist"
-  ]
-}
+  }
+}