@openware/components - npm Package Compare versions

Comparing version 2.0.33 to 2.0.34

dist/atoms/index.d.ts

@@ -16,1 +16,2 @@ export * from './Avatar/Avatar';
 export * from './CloseButton/CloseButton';
+export * from './PercentageButton/PercentageButton';

dist/molecules/Order/Order.d.ts

@@ -33,10 +33,14 @@ import * as React from 'react';
     /**
-     * If orderType is 'Limit' this value will be used as price for buy tab
+     * If orderType is 'Market' this value will be used as price for buy tab
      */
     priceMarketBuy: number;
     /**
-     * If orderType is 'Limit' this value will be used as price for sell tab
+     * If orderType is 'Market' this value will be used as price for sell tab
      */
     priceMarketSell: number;
     /**
+     * If orderType is 'Limit' this value will be used as price
+     */
+    priceLimit?: number;
+    /**
      * Name of currency for price field
@@ -50,11 +54,2 @@ */
     /**
-     * Value for current order price
-     *
-     */
-    price: string;
-    /**
-     * Function for handling amount value
-     */
-    handleChangeInputPrice: (value: string) => void;
-    /**
      * Whether order is disabled to execute
@@ -69,4 +64,12 @@ */
     /**
+     * Precision of amount, total, available, fee value
+     */
+    currentMarketAskPrecision: number;
+    /**
+     * Precision of price value
+     */
+    currentMarketBidPrecision: number;
+    /**
      * @default 'Order Type'
-     * Text for Order Type field Text.
+     * Text for order type dropdown label.
      */
@@ -100,4 +103,14 @@ orderTypeText?: string;
     /**
+     * @default 'BUY'
+     * Text for buy order submit button.
+     */
+    submitBuyButtonText?: string;
+    /**
+     * @default 'SELL'
+     * Text for sell order submit button.
+     */
+    submitSellButtonText?: string;
+    /**
      * @default 'Buy'
-     * Text for Estimated fee field Text.
+     * Text for Buy tab label.
      */
@@ -107,3 +120,3 @@ labelFirst?: string;
      * @default 'Sell'
-     * Text for Estimated fee field Text.
+     * Text for Sell tab label.
      */
@@ -110,0 +123,0 @@ labelSecond?: string;

dist/molecules/OrderForm/OrderForm.d.ts

@@ -10,6 +10,10 @@ import * as React from 'react';
     /**
-     * Price that is applied during total order amount calculation
+     * Price that is applied during total order amount calculation when type is Market
      */
     priceMarket: number;
     /**
+     * Price that is applied during total order amount calculation when type is Market
+     */
+    priceLimit?: number;
+    /**
      * Type of form, can be 'buy' or 'cell'
@@ -19,6 +23,2 @@ */
     /**
-     * Callback that is called when form is submitted
-     */
-    onSubmit: OnSubmitCallback;
-    /**
      * Available types of order
@@ -41,13 +41,13 @@ */
     /**
-     * Value for current order price
+     * Amount of money in a wallet
      */
-    price: string;
+    available?: number;
     /**
-     * Function for handling amount value
+     * Precision of amount, total, available, fee value
      */
-    handleChangeInputPrice: (value: string) => void;
+    currentMarketAskPrecision: number;
     /**
-     * Amount of money in a wallet
+     * Precision of price value
      */
-    available?: number;
+    currentMarketBidPrecision: number;
     /**
@@ -58,4 +58,8 @@ * Whether order is disabled to execute
     /**
+     * Callback that is called when form is submitted
+     */
+    onSubmit: OnSubmitCallback;
+    /**
      * @default 'Order Type'
-     * Text for Order Type field Text.
+     * Text for order type dropdown label.
      */
@@ -88,2 +92,7 @@ orderTypeText?: string;
     estimatedFeeText?: string;
+    /**
+     * @default type.toUpperCase()
+     * Text for submit Button.
+     */
+    submitButtonText?: string;
 }
@@ -93,15 +102,20 @@ interface OrderFormState {
     amount: string;
+    price: string;
+    priceMarket: number;
+    currentMarketAskPrecision: number;
+    currentMarketBidPrecision: number;
+    amountFocused: boolean;
+    priceFocused: boolean;
 }
 declare class OrderForm extends React.Component<OrderFormProps, OrderFormState> {
     constructor(props: OrderFormProps);
+    componentWillReceiveProps(next: OrderFormProps): void;
     render(): JSX.Element;
-    static cleanPositiveFloatInput(text: string): string;
-    private checkIsDisabled;
-    private convertTotal;
+    private handleOrderTypeChange;
+    private handleFieldFocus;
+    private handlePriceChange;
     private handleAmountChange;
-    private changeState;
-    private checkValue;
-    private handleOrderTypeChange;
+    private handleChangeAmountByButton;
     private handleSubmit;
 }
 export { OrderForm, OrderFormProps, OrderFormState, };

dist/molecules/OrderInput/OrderInput.d.ts

@@ -14,2 +14,14 @@ import * as React from 'react';
     /**
+     * Checking if input focused
+     */
+    isFocused: boolean;
+    /**
+     * Label on the border
+     */
+    label?: string;
+    /**
+     * Placeholder on the border
+     */
+    placeholder?: string;
+    /**
      * Value of Input component
@@ -24,2 +36,6 @@ */
     /**
+     * Function for handling input focus
+     */
+    handleFocusInput: () => void;
+    /**
      * Function for handling 'Enter' key
@@ -26,0 +42,0 @@ */

docs/atoms/index.d.ts

@@ -16,1 +16,2 @@ export * from './Avatar/Avatar';
 export * from './CloseButton/CloseButton';
+export * from './PercentageButton/PercentageButton';

docs/molecules/Order/Order.d.ts

@@ -33,10 +33,14 @@ import * as React from 'react';
     /**
-     * If orderType is 'Limit' this value will be used as price for buy tab
+     * If orderType is 'Market' this value will be used as price for buy tab
      */
     priceMarketBuy: number;
     /**
-     * If orderType is 'Limit' this value will be used as price for sell tab
+     * If orderType is 'Market' this value will be used as price for sell tab
      */
     priceMarketSell: number;
     /**
+     * If orderType is 'Limit' this value will be used as price
+     */
+    priceLimit?: number;
+    /**
      * Name of currency for price field
@@ -50,11 +54,2 @@ */
     /**
-     * Value for current order price
-     *
-     */
-    price: string;
-    /**
-     * Function for handling amount value
-     */
-    handleChangeInputPrice: (value: string) => void;
-    /**
      * Whether order is disabled to execute
@@ -69,4 +64,12 @@ */
     /**
+     * Precision of amount, total, available, fee value
+     */
+    currentMarketAskPrecision: number;
+    /**
+     * Precision of price value
+     */
+    currentMarketBidPrecision: number;
+    /**
      * @default 'Order Type'
-     * Text for Order Type field Text.
+     * Text for order type dropdown label.
      */
@@ -100,4 +103,14 @@ orderTypeText?: string;
     /**
+     * @default 'BUY'
+     * Text for buy order submit button.
+     */
+    submitBuyButtonText?: string;
+    /**
+     * @default 'SELL'
+     * Text for sell order submit button.
+     */
+    submitSellButtonText?: string;
+    /**
      * @default 'Buy'
-     * Text for Estimated fee field Text.
+     * Text for Buy tab label.
      */
@@ -107,3 +120,3 @@ labelFirst?: string;
      * @default 'Sell'
-     * Text for Estimated fee field Text.
+     * Text for Sell tab label.
      */
@@ -110,0 +123,0 @@ labelSecond?: string;

docs/molecules/OrderForm/OrderForm.d.ts

@@ -10,6 +10,10 @@ import * as React from 'react';
     /**
-     * Price that is applied during total order amount calculation
+     * Price that is applied during total order amount calculation when type is Market
      */
     priceMarket: number;
     /**
+     * Price that is applied during total order amount calculation when type is Market
+     */
+    priceLimit?: number;
+    /**
      * Type of form, can be 'buy' or 'cell'
@@ -19,6 +23,2 @@ */
     /**
-     * Callback that is called when form is submitted
-     */
-    onSubmit: OnSubmitCallback;
-    /**
      * Available types of order
@@ -41,13 +41,13 @@ */
     /**
-     * Value for current order price
+     * Amount of money in a wallet
      */
-    price: string;
+    available?: number;
     /**
-     * Function for handling amount value
+     * Precision of amount, total, available, fee value
      */
-    handleChangeInputPrice: (value: string) => void;
+    currentMarketAskPrecision: number;
     /**
-     * Amount of money in a wallet
+     * Precision of price value
      */
-    available?: number;
+    currentMarketBidPrecision: number;
     /**
@@ -58,4 +58,8 @@ * Whether order is disabled to execute
     /**
+     * Callback that is called when form is submitted
+     */
+    onSubmit: OnSubmitCallback;
+    /**
      * @default 'Order Type'
-     * Text for Order Type field Text.
+     * Text for order type dropdown label.
      */
@@ -88,2 +92,7 @@ orderTypeText?: string;
     estimatedFeeText?: string;
+    /**
+     * @default type.toUpperCase()
+     * Text for submit Button.
+     */
+    submitButtonText?: string;
 }
@@ -93,15 +102,20 @@ interface OrderFormState {
     amount: string;
+    price: string;
+    priceMarket: number;
+    currentMarketAskPrecision: number;
+    currentMarketBidPrecision: number;
+    amountFocused: boolean;
+    priceFocused: boolean;
 }
 declare class OrderForm extends React.Component<OrderFormProps, OrderFormState> {
     constructor(props: OrderFormProps);
+    componentWillReceiveProps(next: OrderFormProps): void;
     render(): JSX.Element;
-    static cleanPositiveFloatInput(text: string): string;
-    private checkIsDisabled;
-    private convertTotal;
+    private handleOrderTypeChange;
+    private handleFieldFocus;
+    private handlePriceChange;
     private handleAmountChange;
-    private changeState;
-    private checkValue;
-    private handleOrderTypeChange;
+    private handleChangeAmountByButton;
     private handleSubmit;
 }
 export { OrderForm, OrderFormProps, OrderFormState, };

docs/molecules/OrderInput/OrderInput.d.ts

@@ -14,2 +14,14 @@ import * as React from 'react';
     /**
+     * Checking if input focused
+     */
+    isFocused: boolean;
+    /**
+     * Label on the border
+     */
+    label?: string;
+    /**
+     * Placeholder on the border
+     */
+    placeholder?: string;
+    /**
      * Value of Input component
@@ -24,2 +36,6 @@ */
     /**
+     * Function for handling input focus
+     */
+    handleFocusInput: () => void;
+    /**
      * Function for handling 'Enter' key
@@ -26,0 +42,0 @@ */

package.json

 {
   "name": "@openware/components",
-  "version": "2.0.33",
+  "version": "2.0.34",
   "description": "CryptoBase React UI Components",
@@ -5,0 +5,0 @@ "main": "dist/index.js",

src/atoms/index.ts

@@ -16,1 +16,2 @@ export * from './Avatar/Avatar';
 export * from './CloseButton/CloseButton';
+export * from './PercentageButton/PercentageButton';

src/molecules/Order/readme.md

 Order example:
 
 ```js
-var price = '';
 
@@ -17,7 +16,11 @@ const handleChangePrice = (value) => { console.log(price); }
   priceMarketSell={10}
+  currentMarketAskPrecision={5}
+  currentMarketBidPrecision={4}
   from="btc"
   to="eth"
-  price={price}
+  orderTypeText={'Order Type'}
+  priceText={'Price'}
+  amountText={'Amount'}
   handleChangeInputPrice={handleChangePrice}
 />
 ```

src/molecules/OrderForm/readme.md

@@ -8,3 +8,2 @@ OrderForm example:
 ];
-var price = '';
 
@@ -22,5 +21,4 @@ const handleChangePrice = (price) => { console.log(price); }
     orderTypes={orderTypes}
-    price={price}
     handleChangeInputPrice={handleChangePrice}
 />
 ```

No alert changes

Improved metrics

Total package byte prevSize

2744800

increased by1.32%

Number of package files

439

increased by2.09%

Lines of code

17615

increased by3.01%

No dependency changes