@weareconceptstudio/account 0.0.6 → 0.0.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -61,8 +61,8 @@ const AddressForm = Memo(({ title, data, selected, createAddress, updateAddress
61
61
  form.current.setFieldsValue({ city_id: '' });
62
62
  }
63
63
  }, []);
64
- return (React.createElement(AddressFormStyle, { theme: theme(globalTheme) },
65
- React.createElement(Text, { tag: `h6`, text: title, className: `account-h6 account-font-bold account-primary-color1` }),
64
+ return (React.createElement(AddressFormStyle, { theme: theme(globalTheme), className: 'address-form-block' },
65
+ React.createElement(Text, { tag: `h6`, text: title, className: `account-h6 account-font-bold account-primary-color1 address-form-block-title` }),
66
66
  React.createElement(Form, { ref: form, onSubmit: onFinish, onChange: handleFormChange, initialValues: data },
67
67
  React.createElement("div", { className: `form-wrapper` },
68
68
  React.createElement(Form.Item, { name: 'country_id', label: 'country' },
@@ -87,16 +87,13 @@ const AddressForm = Memo(({ title, data, selected, createAddress, updateAddress
87
87
  React.createElement(Input.Number, { placeholder: 'zipCodePlaceholder' })),
88
88
  React.createElement(Form.Item, { name: 'phone', label: 'phone' },
89
89
  React.createElement(PhoneNumber, null))),
90
- React.createElement("div", { className: `default-info-wrap` }, !data?.is_default ? (React.createElement("div", { className: `banner-wrap cursor-pointer`, onClick: () => setIsChecked(!isChecked) }, isChecked ? (React.createElement("div", { className: 'checkbox-wrap', role: 'button' },
91
- React.createElement(CheckboxCheckedIcon, null))) : (React.createElement("div", { className: 'checkbox-wrap', role: 'button' },
92
- React.createElement(CheckboxIcon, null))))) : (React.createElement("div", null, "Test")
93
- // <Text
94
- // className={`account-p account-p2 account-font-medium account-primary-color1`}
95
- // text={`${selected.type === 'shipping' ? 'thisYourDefaultShippingAddress' : 'thisYourDefaultBillingAddress'}`}
96
- // />
97
- )),
90
+ React.createElement("div", { className: `default-info-wrap` }, !data?.is_default ? (React.createElement("div", { className: `banner-wrap cursor-pointer`, onClick: () => setIsChecked(!isChecked) },
91
+ isChecked ? (React.createElement("div", { className: 'checkbox-wrap', role: 'button' },
92
+ React.createElement(CheckboxCheckedIcon, null))) : (React.createElement("div", { className: 'checkbox-wrap', role: 'button' },
93
+ React.createElement(CheckboxIcon, null))),
94
+ React.createElement(Text, { className: `account-p account-p2 account-font-medium account-primary-color1 address-form-is-default-checkbox`, text: `${selected.type === 'shipping' ? 'makeYourDefaultShippingAddress' : 'makeYourDefaultBillingAddress'}` }))) : (React.createElement(Text, { className: `account-p account-p2 account-font-medium account-primary-color1 address-form-is-default`, text: `${selected.type === 'shipping' ? 'thisYourDefaultShippingAddress' : 'thisYourDefaultBillingAddress'}` }))),
98
95
  React.createElement("div", { className: `cancel-and-save-wrap` },
99
- React.createElement(AccountButton, { text: `cancel`, onClick: closePopup, btnType: `green-large-text` }),
100
- React.createElement(AccountButton, { type: 'submit', text: `saveAndApply`, btnType: `full-width`, className: `${isDisabled ? 'disabled' : ''}` })))));
96
+ React.createElement(AccountButton, { text: `cancel`, onClick: closePopup, btnType: `green-large-text`, className: `address-form-cancel-btn` }),
97
+ React.createElement(AccountButton, { type: 'submit', text: `saveAndApply`, btnType: `full-width`, className: `address-form-cancel-submit ${isDisabled ? 'disabled' : ''}` })))));
101
98
  });
102
99
  export default AddressForm;
@@ -28,14 +28,14 @@ const AddressItem = ({ title, data, checkout_review, select_address, type, onCli
28
28
  React.createElement(Text, { className: `account-p account-p3 account-font-regular account-primary-color1 col-wrap`, text: `${data.address_1}, ${data.address_2 ? data.address_2 + ',' : ''}` }),
29
29
  React.createElement(Text, { className: `account-p account-p3 account-font-regular account-primary-color1`, text: `${data.region}, ${data.zip_code}, ${data.city}, ${data.country}` }),
30
30
  React.createElement(Text, { className: `account-p account-p3 account-font-regular account-primary-color1 phone col-wrap`, text: `${data.phone_number}` })),
31
- data.is_default ? (React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color1 margin-style`, text: `${type === 'shipping' ? 'defaultShippingAddress' : 'defaultBillingAddress'}` })) : (React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color1 margin-style opacity-zero`, text: `empty` })),
31
+ data.is_default ? (React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color1 margin-style is-default`, text: `${type === 'shipping' ? 'defaultShippingAddress' : 'defaultBillingAddress'}` })) : (React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color1 margin-style opacity-zero`, text: `empty` })),
32
32
  select_address && (React.createElement("div", { className: `circle-selected-wrap cursor-pointer ${checkedId === data.id ? 'active' : ''}`, onClick: () => setCheckedId(data.id) },
33
33
  React.createElement("svg", { version: '1.1', viewBox: '0 0 32 32', xmlns: 'http://www.w3.org/2000/svg', className: `checkbox-icon ${checkedId === data.id ? 'selected' : 'note-selected'}` },
34
34
  React.createElement("path", { d: 'M13.345 30.462c-1.062 0-1.859-0.531-2.39-1.328l-9.56-16.996c-0.797-1.328-0.266-2.921 1.062-3.718 1.328-0.531 2.921 0 3.718 1.328l7.436 13.012 12.481-20.183c0.797-1.328 2.39-1.593 3.718-0.797s1.593 2.39 0.797 3.718l-14.871 23.635c-0.531 0.797-1.328 1.328-2.39 1.328z' }))))),
35
35
  !checkout_review && (React.createElement("div", { className: `edit-remove-wrapper` },
36
- React.createElement(AccountButton, { text: `edit`, btnType: `green-small-text`, onClick: handleEditAddressPopup }),
36
+ React.createElement(AccountButton, { text: `edit`, btnType: `green-small-text`, onClick: handleEditAddressPopup, className: 'btn-one-address-version' }),
37
37
  !select_address && !data.is_default && (React.createElement(React.Fragment, null,
38
38
  React.createElement("div", { className: `vertical-line` }),
39
- React.createElement(AccountButton, { text: `remove`, btnType: `green-small-text`, onClick: handleDeletePopup })))))))));
39
+ React.createElement(AccountButton, { text: `remove`, onClick: handleDeletePopup, btnType: `green-small-text`, className: 'btn-more-address-version' })))))))));
40
40
  };
41
41
  export default AddressItem;
@@ -5,8 +5,8 @@ import EmptyOrdersStyle from './style';
5
5
  //* Components
6
6
  import AccountButton from '../ui/AccountButton';
7
7
  const EmptyOrders = Memo(() => {
8
- return (React.createElement(EmptyOrdersStyle, null,
9
- React.createElement(Text, { tag: `h6`, className: `account-h6 account-font-bold account-primary-color1`, text: `emptyTitle` }),
10
- React.createElement(Text, { className: `account-p account-p2 account-font-regular account-primary-color1 description`, text: `emptyDesc` })));
8
+ return (React.createElement(EmptyOrdersStyle, { className: 'empty-orders' },
9
+ React.createElement(Text, { tag: `h6`, className: `account-h6 account-font-bold account-primary-color1 empty-orders-title`, text: `emptyTitle` }),
10
+ React.createElement(Text, { className: `account-p account-p2 account-font-regular account-primary-color1 empty-orders-description`, text: `emptyDesc` })));
11
11
  });
12
12
  export default EmptyOrders;
@@ -3,7 +3,7 @@ const EmptyOrdersStyle = styled.section `
3
3
  --account_descMTop: var(--sp3x);
4
4
  --account_descMBot: var(--sp7x);
5
5
 
6
- .description {
6
+ .empty-orders-description {
7
7
  margin-top: var(--account_descMTop);
8
8
  margin-bottom: var(--account_descMBot);
9
9
  }
@@ -13,7 +13,7 @@ const OrderDetails = memo(({ className, status, order_date, delivery_date, order
13
13
  React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color1` },
14
14
  translate('orderStatus'),
15
15
  ":"),
16
- status === 'delivered' ? (React.createElement(Text, { className: `account-p account-p4 account-font-bold account-primary-color1 account-primary-color5-bg status-item value`, text: 'delivered' })) : status === 'canceled' ? (React.createElement(Text, { className: `account-p account-p4 account-font-bold account-error-color account-secondary-color7-bg status-item value`, text: 'canceled' })) : (React.createElement(Text, { className: `account-p account-p4 account-font-bold account-secondary-color1 account-secondary-color8-bg status-item value`, text: 'inProgress' }))),
16
+ status === 'delivered' ? (React.createElement(Text, { className: `account-p account-p4 account-font-bold account-primary-color1 account-primary-color5-bg status-item value delivered`, text: 'delivered' })) : status === 'canceled' ? (React.createElement(Text, { className: `account-p account-p4 account-font-bold account-error-color account-secondary-color7-bg status-item value canceled`, text: 'canceled' })) : (React.createElement(Text, { className: `account-p account-p4 account-font-bold account-secondary-color1 account-secondary-color8-bg status-item value in-progress`, text: 'inProgress' }))),
17
17
  React.createElement("div", { className: `order-detail-item-wrap` },
18
18
  React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color1` },
19
19
  translate('orderDate'),
@@ -12,7 +12,7 @@ const OrderItem = Memo(({ data }) => {
12
12
  React.createElement(Text, { className: `account-p account-p4 account-font-medium account-primary-color1`, text: data.total_items })),
13
13
  React.createElement("div", { className: `col-item od-col-3 nowrap` },
14
14
  React.createElement(Text, { className: `account-p account-p4 account-font-medium account-primary-color1`, text: `ID ${data.order_number}` })),
15
- React.createElement("div", { className: `col-item od-col-4 nowrap` }, data.status === 'delivered' ? (React.createElement(Text, { className: `account-p account-p4 account-font-bold account-primary-color1 account-primary-color5-bg status-item`, text: 'delivered' })) : data.status === 'canceled' ? (React.createElement(Text, { className: `account-p account-p4 account-font-bold account-error-color account-secondary-color7-bg status-item`, text: 'canceled' })) : (React.createElement(Text, { className: `account-p account-p4 account-font-bold account-secondary-color1 account-secondary-color8-bg status-item`, text: 'inProgress' }))),
15
+ React.createElement("div", { className: `col-item od-col-4 nowrap` }, data.status === 'delivered' ? (React.createElement(Text, { className: `account-p account-p4 account-font-bold account-primary-color1 account-primary-color5-bg status-item delivered`, text: 'delivered' })) : data.status === 'canceled' ? (React.createElement(Text, { className: `account-p account-p4 account-font-bold account-error-color account-secondary-color7-bg status-item canceled`, text: 'canceled' })) : (React.createElement(Text, { className: `account-p account-p4 account-font-bold account-secondary-color1 account-secondary-color8-bg status-item in-progress`, text: 'inProgress' }))),
16
16
  React.createElement("div", { className: `col-item od-col-5 nowrap` },
17
17
  React.createElement(Text, { className: `account-p account-p4 account-font-medium account-primary-color1`, text: handlePriceCheckFunc(data.total_price, data.currency) })),
18
18
  React.createElement("div", { className: `col-item od-col-6 nowrap` },
@@ -45,7 +45,7 @@ const OrdersList = ({ data, total, pageSize, router, pathname, searchParams }) =
45
45
  React.createElement("div", { className: `left-item-wrap last` },
46
46
  React.createElement(Text, { className: `account-p account-p4 account-font-bold account-primary-color1`, text: `${translate('orderNumber')}:` }),
47
47
  React.createElement(Text, { className: `account-p account-p4 account-font-regular account-primary-color1 value`, text: `ID ${item.order_number}` }))),
48
- React.createElement("div", { className: `right-wrap` }, item.status === 'delivered' ? (React.createElement(Text, { className: `account-p account-p4 account-font-bold account-primary-color1 account-primary-color5-bg status-item`, text: 'delivered' })) : item.status === 'canceled' ? (React.createElement(Text, { className: `account-p account-p4 account-font-bold account-error-color account-secondary-color7-bg status-item`, text: 'canceled' })) : (React.createElement(Text, { className: `account-p account-p4 account-font-bold account-secondary-color1 account-secondary-color8-bg status-item`, text: 'inProgress' })))),
48
+ React.createElement("div", { className: `right-wrap` }, item.status === 'delivered' ? (React.createElement(Text, { className: `account-p account-p4 account-font-bold account-primary-color1 account-primary-color5-bg status-item delivered`, text: 'delivered' })) : item.status === 'canceled' ? (React.createElement(Text, { className: `account-p account-p4 account-font-bold account-error-color account-secondary-color7-bg status-item canceled`, text: 'canceled' })) : (React.createElement(Text, { className: `account-p account-p4 account-font-bold account-secondary-color1 account-secondary-color8-bg status-item in-progress`, text: 'inProgress' })))),
49
49
  React.createElement("div", { className: `last-col-wrap` },
50
50
  React.createElement("div", { className: `left-wrap` },
51
51
  React.createElement("div", { className: `left-item-wrap` },
@@ -16,7 +16,6 @@ const TotalCheckout = memo(({ isShipping, children, confirmation, buttonProps, i
16
16
  useEffect(() => {
17
17
  setHeaderHeight(document.getElementsByTagName('header')[0]?.clientHeight);
18
18
  }, [winWidth]);
19
- console.log(shippingCost);
20
19
  return (React.createElement(TotalCheckoutStyle, { "$headerHeight": headerHeight },
21
20
  React.createElement("div", { className: `cart-main-wrap` },
22
21
  React.createElement("div", { className: `left-panel-wrap panel` }, children),
@@ -39,7 +39,6 @@ const Item = memo(({ data, edit, favorite, remove, select, isLast, favorites, ac
39
39
  React.createElement("div", { className: `col-item tl-col-3 col-item-3 nowrap` }, data?.product?.sale_price ? (React.createElement("div", null,
40
40
  React.createElement(Text, { className: `account-p account-p3 account-font-bold account-secondary-color2 alignRight`, text: handlePriceCheckFunc(data?.product?.sale_price, currency) }),
41
41
  React.createElement(Text, { className: `account-p account-p3 account-font-regular account-primary-color2 line-through value align-right`, text: handlePriceCheckFunc(data.product?.price, currency) }))) : (React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color1 alignRight`, text: handlePriceCheckFunc(data.product?.price, currency) }))),
42
- console.log(data.total),
43
42
  React.createElement("div", { className: `col-item tl-col-4 col-item-4 nowrap` },
44
43
  React.createElement("div", { className: `col-item-inner-wrap` },
45
44
  React.createElement("div", { className: `flex-end-wrap` }, data?.product.sale_price ? (React.createElement("div", null,
@@ -39,7 +39,7 @@ const ItemMobile = memo(({ data, additionalParameters, isLast, favorites }) => {
39
39
  // className={`quantity-select-mobile-wrap`}
40
40
  // onChange={(val) => addToCart({ productId: data.product.id, variantId: data.selectedVariant.id, optionId: data.selectedOption.id, qty: val, update: true })}
41
41
  // />
42
- React.createElement(Select, { allowSearch: false, options: selectionList, value: 1, onChange: (val) => console.log(val) })) : (React.createElement("div", { className: `mobile-info-item` },
42
+ React.createElement(Select, { allowSearch: false, options: selectionList, value: 1, onChange: () => { } })) : (React.createElement("div", { className: `mobile-info-item` },
43
43
  React.createElement(Text, { className: `account-p account-p3 account-font-medium primaryColor1`, text: `quantityWithSymbol` }),
44
44
  "\u00A0",
45
45
  React.createElement(Text, { className: `account-p account-p3 account-font-medium primaryColor1`, text: data.qty }))))) : (React.createElement("div", { className: `mobile-info-item` },
@@ -25,7 +25,9 @@ const AccountButtonStyle = styled.div `
25
25
  border: 2px solid var(--account_primaryColor14);
26
26
  color: var(--account_backgroundColor);
27
27
  border-radius: var(--account_btnBorderRad);
28
- transition: 0.1s;
28
+ transition:
29
+ background-color var(--account_trTime) ease-out,
30
+ border var(--account_trTime) ease-out;
29
31
  display: inline-flex;
30
32
  justify-content: center;
31
33
  align-items: center;
@@ -9,12 +9,12 @@ import AccountButton from '../AccountButton';
9
9
  const WarningMessageForPopup = React.memo(({ isDelete = false, isThankYou = false, onRemove, title, description, globalData }) => {
10
10
  const { closePopup } = useUi();
11
11
  const globalTheme = useTheme();
12
- return (React.createElement(WarningMessageForPopupStyle, { theme: theme(globalTheme) },
13
- React.createElement(Text, { tag: `h6`, className: `account-h6 account-font-bold account-primary-color1`, text: title }),
12
+ return (React.createElement(WarningMessageForPopupStyle, { className: 'warning-message-block', theme: theme(globalTheme) },
13
+ React.createElement(Text, { tag: `h6`, className: `account-h6 account-font-bold account-primary-color1 warning-message-title`, text: title }),
14
14
  React.createElement(Text, { className: `account-p account-p2 account-font-regular account-primary-color1 confirm-delete-address-text`, text: description }),
15
- React.createElement("div", { className: `cancel-remove-wrap ${!isDelete && 'mobile-margin'}` }, isDelete ? (React.createElement(React.Fragment, null,
16
- React.createElement(AccountButton, { btnType: `green-large-text`, text: `cancel`, onClick: closePopup }),
17
- React.createElement(AccountButton, { text: `remove`, btnType: `full-width`, onClick: () => {
15
+ React.createElement("div", { className: `cancel-remove-wrap ${!isDelete ? 'mobile-margin' : ''}` }, isDelete ? (React.createElement(React.Fragment, null,
16
+ React.createElement(AccountButton, { text: `cancel`, onClick: closePopup, btnType: `green-large-text`, className: 'warning-message-popup-close' }),
17
+ React.createElement(AccountButton, { text: `remove`, btnType: `full-width`, className: 'warning-message-popup-remove', onClick: () => {
18
18
  onRemove();
19
19
  closePopup();
20
20
  } }))) : isThankYou ? (
@@ -24,8 +24,9 @@ const WarningMessageForPopup = React.memo(({ isDelete = false, isThankYou = fals
24
24
  // btnType={`full-width`}
25
25
  // text={`continueToShop`}
26
26
  // url={globalData?.menu_bar[0]?.slug}
27
+ // className={'warning-message-popup-continue'}
27
28
  // />
28
29
  // ) : null
29
- React.createElement("div", null, "Global Data")) : (React.createElement(AccountButton, { text: `done`, btnType: `full-width`, onClick: closePopup })))));
30
+ React.createElement("div", null, "Global Data")) : (React.createElement(AccountButton, { text: `done`, onClick: closePopup, btnType: `full-width`, className: 'warning-message-popup-done' })))));
30
31
  });
31
32
  export default WarningMessageForPopup;
@@ -60,7 +60,7 @@ const AccountStyle = styled.section `
60
60
 
61
61
  .sidebar-item {
62
62
  color: var(--account_primaryColor3);
63
- transition: color var(--account_trTime);
63
+ transition: color var(--account_trTime) ease-out;
64
64
  }
65
65
 
66
66
  @media (hover: hover) {
@@ -3,7 +3,7 @@ import { AddressWrap } from '../../components';
3
3
  import AddressesTemplateStyle from './style';
4
4
  const AddressesTemplate = ({ type = 'single', addresses }) => {
5
5
  return (React.createElement(AddressesTemplateStyle, null, type == 'single' ? (React.createElement(AddressWrap, { addresses: addresses })) : (React.createElement(React.Fragment, null,
6
- React.createElement(AddressWrap, { title: 'shippingAddress' }),
7
- React.createElement(AddressWrap, { title: 'billingAddress' })))));
6
+ React.createElement(AddressWrap, { title: 'shippingAddress', addresses: addresses }),
7
+ React.createElement(AddressWrap, { title: 'billingAddress', addresses: addresses })))));
8
8
  };
9
9
  export default AddressesTemplate;
@@ -55,7 +55,7 @@ const ForgotPasswordTemplateStyle = styled.section `
55
55
  margin-top: var(--account_tryAgainWrapMTop);
56
56
 
57
57
  .try-again-text {
58
- transition: all var(--account_trTime) ease;
58
+ transition: color var(--account_trTime) ease-out;
59
59
  cursor: pointer;
60
60
 
61
61
  @media (hover: hover) {
@@ -78,7 +78,7 @@ const ForgotPasswordTemplateStyle = styled.section `
78
78
  margin-top: var(--account_loginExternalMTop);
79
79
 
80
80
  .login-external {
81
- transition: all var(--account_trTime) ease;
81
+ transition: color var(--account_trTime) ease-out;
82
82
 
83
83
  @media (hover: hover) {
84
84
  &:hover {
@@ -55,7 +55,7 @@ const ResetPasswordTemplateStyleStyle = styled.section `
55
55
  margin-top: var(--account_forgotPasswordMTop);
56
56
 
57
57
  .forgotLink {
58
- transition: all var(--account_trTime) ease;
58
+ transition: color var(--account_trTime) ease-out;
59
59
 
60
60
  @media (hover: hover) {
61
61
  &:hover {
@@ -40,7 +40,7 @@ const SignInTemplateStyle = styled.section `
40
40
  margin-top: var(--account_forgotPasswordMTop);
41
41
 
42
42
  .forgotLink {
43
- transition: all var(--account_trTime) ease;
43
+ transition: color var(--account_trTime) ease-out;
44
44
 
45
45
  @media (hover: hover) {
46
46
  &:hover {
@@ -64,7 +64,7 @@ const SignInTemplateStyle = styled.section `
64
64
  margin-left: var(--account_joinNowDistance);
65
65
 
66
66
  .joinNowLink {
67
- transition: all var(--account_trTime) ease;
67
+ transition: color var(--account_trTime) ease-out;
68
68
 
69
69
  @media (hover: hover) {
70
70
  &:hover {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@weareconceptstudio/account",
3
- "version": "0.0.6",
3
+ "version": "0.0.7",
4
4
  "description": "Concept Studio Account",
5
5
  "author": "Concept Studio",
6
6
  "license": "ISC",