Commit Graph

475 Commits

Author SHA1 Message Date
Mike Jolley 29600c501f Summary/description consistency update (https://github.com/woocommerce/woocommerce-blocks/pull/1639)
* Audit atomic block labels

* Add summary, descrtiption, and short description to API and use for summary block

* Add summary to cart item api

* Respect short description

* Tweak label of summary block

* Revert product rating label

* One description vs 3

* Update sample content with more appropriate values, and match in cart items sample

* Move summary generation to class

* Tests

* Prevent extending `ProductSummary`

* Tweak $paragraph handling

* More accurate word counting

* add tear down for filter
2020-01-29 10:59:33 +00:00
Mike Jolley b65b93e7e7 Rename the "Align Buttons" option for the All Products Block (https://github.com/woocommerce/woocommerce-blocks/pull/1659)
* Allow css to work for any element

* Rename option to specific last block rather than button
2020-01-29 10:28:40 +00:00
Mike Jolley dcf5bfa67e Fix RTL price slider display issues (https://github.com/woocommerce/woocommerce-blocks/pull/1651)
* Fix slider image direction with RTL

* Fix track position under RTL
2020-01-27 15:16:19 +00:00
Albert Juhé Lluveras 7f048ec9c4 Product grid blocks: display rating stars in the editor (https://github.com/woocommerce/woocommerce-blocks/pull/1650) 2020-01-27 13:56:32 +01:00
Darren Ethier d54340a90e Only populate default attributes on initial mount of block. (https://github.com/woocommerce/woocommerce-blocks/pull/1640)
* Avoid looping through attributes after defaults have been set.

* remove extra method I missed and fix when state updates happen

* don’t update state if we’re not in woo blocks

This prevents non woo blocks from being re-rendered unnecessarily with the state update.

* avoid re-renders and use class property instead
2020-01-24 11:53:15 -05:00
Albert Juhé Lluveras ab51bffaa0 All Products: fix 'Add to Cart' in IE11 (https://github.com/woocommerce/woocommerce-blocks/pull/1642)
* All Products: fix 'Add to Cart' in IE11

* Default Event to null
2020-01-23 19:32:48 +01:00
Mike Jolley 24d2600d43 Move default population to class function instead of using constructor (https://github.com/woocommerce/woocommerce-blocks/pull/1638) 2020-01-23 14:11:15 +00:00
Albert Juhé Lluveras 069b42dc39 Make 'Add order notes?' string localizable (https://github.com/woocommerce/woocommerce-blocks/pull/1629) 2020-01-22 21:35:29 +01:00
Mike Jolley d1737e76c2 Change default rows for product grid blocks to 3 (https://github.com/woocommerce/woocommerce-blocks/pull/1613)
* Change default rows to 3

* Handle all products rows change via deprecation

* Prevent errors if object is undefined

* HOC to set default attribute values

* Separate default attributes from attribute definitions

* Filters to set defaults

* Fix deprecation so attributes are not reordered

* Move flters to index file and limit which blocks are affected

* Fix object assign

* Use typeof for undefined checks

* Move hoc to filter file so it has context

* Fix up comment

* Avoid mutating props

* Prevent multiple `attributes` by cloning props

* Force attributes to be saved to HTML in a specific order, and handle migration

* useEffect to set attributes and avoid prop mutation

* Switch to class component
2020-01-22 16:58:25 +00:00
Mike Jolley 69a509f184 Improved cart styling for desktop and mobile (https://github.com/woocommerce/woocommerce-blocks/pull/1587)
* Style mobile qty selector

* Add dedicated column for image and remove duplicate elements

* Tweak column headers

* Refactor cart styles to use CSS grid, and use nesting for organisation

* adjust column widths

* Remove unused div

* Fix wrapping and flexbox styles

* Add decodeEntities to alt attribute

* Use % basis

* Tweak min widths
2020-01-20 16:43:22 +00:00
Albert Juhé Lluveras e607ce2d1a Preserve query key order in All Products (https://github.com/woocommerce/woocommerce-blocks/pull/1611) 2020-01-20 13:04:13 +01:00
Mike Jolley 8b28a77f01 Consistent HTML entities in Store API (https://github.com/woocommerce/woocommerce-blocks/pull/1597)
* Wrap HTML responses with helper method

* Remove unused get_attribute_taxonomy_name method

* Create prepare_html_response method

* Decode product and attribute names

* Check is_scalar to leave objects alone
2020-01-19 19:19:59 -05:00
Seghir Nadir 7e81841e83 Fix issue in order by date (https://github.com/woocommerce/woocommerce-blocks/pull/1598)
* fix order by of date order in products
2020-01-20 00:00:43 +01:00
Rua Haszard d7be99b520 fix issue when user re-selects same attr when setting up filter block: (https://github.com/woocommerce/woocommerce-blocks/pull/1596)
- exit early if there's no selected attr passed in
2020-01-20 07:58:26 +13:00
Albert Juhé Lluveras 09f2c626f9 Make TextInput respect prefers-reduced-motion preference (https://github.com/woocommerce/woocommerce-blocks/pull/1588)
* Make TextInput respect prefers-reduced-motion preference

* Reverse prefers-reduced-motion check
2020-01-18 10:39:13 +01:00
Albert Juhé Lluveras cad3e72769 Create CountryInput component (https://github.com/woocommerce/woocommerce-blocks/pull/1585)
* Create initial CountryInput component

* Create ShippingCountryInput

* Create BillingCountryInput

* Make backgrounds white

* Correctly align options

* Add CSS resets for 20xy themes

* Fix wrong defaults in countries constants

* Make CountryInput respect 'prefers-reduced-motion'

* Reverse prefers-reduced-motion check

* Set max-width to CountryInput dropdown

* Use decodeEntities to print country names

* Avoid unnecessary JSON enconding and later parsing

* Make sure country name is also encoded when selected

* Fix countries default value
2020-01-17 17:58:08 +01:00
Rua Haszard eaa6b42d89 UI for removing cart items (not including hooking up to API) (https://github.com/woocommerce/woocommerce-blocks/pull/1579)
* correct typography styles for remove link (based on design)

* add trashcan icon from material icons, for removing cart items on mobile

* add & style trash icon for remove cart item on mobile

* a11y - use darker grey for trashcan icon button to improve contrast

* rename IconDelete -> IconTrash

* remove unnecessary div

* use <button> for remove action buttons + add link-button scss mixin

* fix editor styles for cart line items - total column should be right-aligned

* fix various visual issues with cart line items table in editor:
- rows should align hard left and right (first/last child no padding)
- totals should be align-bottom on small screen
- correct vertical padding on column headings
- re-add row border separator lines
2020-01-17 13:46:56 +00:00
Seghir Nadir 4a8c57fbe1 Focus on Full Cart mode after inserting (https://github.com/woocommerce/woocommerce-blocks/pull/1582)
* focus on the cart main block
2020-01-17 13:23:33 +01:00
Rua Haszard f3e4fc2bd4 fix react runtime js error when all products productLink=off: (https://github.com/woocommerce/woocommerce-blocks/pull/1593)
- renderedSalesAndImage is a js var holding react element;
- don't surround with (), converts to obj { renderedSalesAndImage: bla }
2020-01-17 09:50:48 +13:00
Mike Jolley 0e752e9e0d Introduce view switcher component for the cart block (https://github.com/woocommerce/woocommerce-blocks/pull/1576)
* View switcher on cart block

* Dedicated component and styling

* Views and selected should be required

* Rename to ViewSwitcher

* Implement views via render prop

* Remove defaults for required props
2020-01-16 14:50:48 +00:00
Albert Juhé Lluveras 3f0368e63b Checkout: Fix city input field showing country value (II) (https://github.com/woocommerce/woocommerce-blocks/pull/1580) 2020-01-16 12:31:00 +01:00
Mike Jolley 86b8b7779c Add Quantity selector component for cart line items (https://github.com/woocommerce/woocommerce-blocks/pull/1558)
* Implement quantity selector component

* Improve default appearance

* Remove underline

* Add aria speak

* Improved keycode handling

* Add focus styles to buttons and inputs

* Increase constrast
2020-01-15 11:32:54 +00:00
Rua Haszard 5c85ee23cf follow up fixes on cart low stock warning badge (https://github.com/woocommerce/woocommerce-blocks/pull/1564)
* rename low stock prop inside lineitem to avoid unnecessary renders

* remove unnecessary span in low stock warning badge
2020-01-15 12:54:32 +13:00
Rua Haszard 86dca691e5 show discount on cart line items & price styling (https://github.com/woocommerce/woocommerce-blocks/pull/1548)
* show discount on cart line items (no styling)

* style line item discount badge + use correct colors for prices

* show full price inline on mobile

* move all responsive tweaks for cart prices to explicit breakpoints

* add nowrap to FormattedMoneyAmount so prices don't ever wrap

* fix misaligned full price on mobile when prices are large (edge case):
- if price strings are long, the full price stacks above line total
- previous right-margin on full price showed prices misaligned

* allow client code to add class(es) to FormattedMonetaryAmount

* add nowrap so discount badge doesn't wrap

* remove unnecessary span from discount badge +
+ more explicit `display` style for different price column elements
2020-01-15 09:52:42 +13:00
Rua Haszard b9bfef0ba4 show low stock warning badge on cart line items (incl fake test data) (https://github.com/woocommerce/woocommerce-blocks/pull/1557) 2020-01-15 09:50:32 +13:00
Albert Juhé Lluveras 11a033d862 Make RadioControl id optional (https://github.com/woocommerce/woocommerce-blocks/pull/1563) 2020-01-14 21:21:29 +01:00
Albert Juhé Lluveras 1dfcb18a90 Make TextInput id optional (https://github.com/woocommerce/woocommerce-blocks/pull/1560) 2020-01-14 20:10:50 +01:00
Rua Haszard f23dee503f show product details in cart line items: attributes (variations), product short description (https://github.com/woocommerce/woocommerce-blocks/pull/1549)
* show product variation attributes in cart line item + styling:
+ adjust font sizes & colors to match design

* show product description in cart line items…
- this commit also adds descriptions to test cart-items data
- note API does not currently return description/excerpt

* add a class to product attributes to allow custom styling
2020-01-14 12:07:52 +13:00
Seghir Nadir 5c82b2d718 add fieldset and legend to FormStep component (https://github.com/woocommerce/woocommerce-blocks/pull/1400)
Co-authored-by: Darren Ethier <darren@roughsmootheng.in>
2020-01-13 10:21:20 -05:00
Darren Ethier 22f423866e fix errors caused by demo payment methods (https://github.com/woocommerce/woocommerce-blocks/pull/1547) 2020-01-13 10:08:14 -05:00
Mike Jolley 5926a56602 Add Empty Placeholder for the on-sale product block (https://github.com/woocommerce/woocommerce-blocks/pull/1519)
* Add EmptyResponsePlaceholder for on sale block

* Linting

* Address feedback
2020-01-10 14:40:15 +00:00
Albert Juhé Lluveras bd2b8cb279 Add Cart totals to Cart block (https://github.com/woocommerce/woocommerce-blocks/pull/1411)
* Add Cart totals to Cart block

* Accessibility improvements

* Load vendors styles separately

* Use same shipping placeholders for cart and checkout

* Refactor how we import @wordpress/components styles so only panel styles are imported

* Remove style-loader from vendors styles build process

* Add htmlFor attribute to TotalsCouponCodeInput

* Update totalItems shape to match API

* Fix wrong total items shape using numbers instead of strings

* Rename wc-blocks classes to wc-block

* Remove unnecessary parseInt()

* Add radix to parseInt()

* Rename totalRows to totalRowsConfig

* Move placeholder content out of the component

* Use Card component for cart's sidebar (https://github.com/woocommerce/woocommerce-blocks/pull/1423)

* Use Card component for cart's sidebar

* Split RadioControl component

* No need to use Label in RadioControlOption

* Remove no longer valid @todo comment

* Use 'checked' prop instead of 'selected' in RadioControlOption

* Rename wc-blocks classes to wc-block

* Rename wc-blocks classes to wc-block (II)

* Make sure radio control ids are unique using withComponentId

* Load PanelBody and PanelRow from last version of @wordpress/components

* Create vendors-frontend.js file

* Load wordpress-component instead of @wordpress/components from <Button> component

* Only load 'withRestApiHydration' HOC

* Make vendors-frontend a dependency of cart-frontend script

* Revert "Only load 'withRestApiHydration' HOC"

This reverts commit 9f9b9759a98047b26e7d8f04189ffe78c1d5bb06.

* Fix fieldset background
2020-01-10 15:37:27 +01:00
Albert Juhé Lluveras f339e28310 Fix prices showing two currencies in some occasions (https://github.com/woocommerce/woocommerce-blocks/pull/1515) 2020-01-10 11:22:09 +01:00
Albert Juhé Lluveras 016b6b97ec Rename wc-blocks to wc-block classname prefix (https://github.com/woocommerce/woocommerce-blocks/pull/1541) 2020-01-10 10:42:53 +01:00
Albert Juhé Lluveras aa1d8e3e56 Fix Attribute Filter not reacting to query changes (https://github.com/woocommerce/woocommerce-blocks/pull/1540) 2020-01-10 10:42:37 +01:00
Rua Haszard 0763655d42 Cart block: line-items front end initial work (https://github.com/woocommerce/woocommerce-blocks/pull/1333)
* render block on front end, add `Shopping cart` heading (baby steps)

* fake data for editing full cart + show line count in header

* add note about core/html using `is-active` class for toggle state

* reinstate work-in-progress full cart component (lost in rebase)

* reinstate full cart from master

* component for full cart title & item count + margin tweaks:
- add margin between main cart & sidebar
- add margin after cart block

* add cart items sample data + factor sample product image to module

* use sample cart data for item count

* basic table of cart line items (no styling)

* prettification

* show images for cart line items + initial table styling

* cart quantity selector component (work in progress)

* use state for cart product quantity, allow incr/decr from UI (WIP)

* replace WIP custom quantity control with number edit (temporary)

* correctly format cart line item total price

* align cart item columns with headings + indent image on desktop

* tweak css for cart line item padding on mobile so it's more explicit

* show cart line item full price if discounted

* add placeholder for cart remove item link

* switch cart table to flex layout (was table)…
This will allow us to move things around for mobile/responsive layout.

* only show cart items table header on desktop

* more cart items styling - row borders, appropriate padding +
+ move image width to variable
+ fix class name plurality for row (item not items)

* use standard $gap instead of 1em for padding/margins

* responsive (mobile) layout for cart line items:
- shift line $ total to bottom right
- stack quantity selector in product info column

* remove extraneous cart table padding on mobile

* comment about unused styles for quantity selector component

* add follow up issue for todo

* remove inappropriate href

* render srcset & sizes for cart line item product image

* remove todo comment

* switch back to table markup for cart items (in progress):
- table is more semantic, associates headers with columns

* cart line items column widths - product column is larger (60%)

* reinstate table row borders

* bottom-align line item price on mobile

* cart contents heading should be H2 + prettify

* remove unused QuantitySelector code/styles, rename main class in line with BEM

* defaults for QuantitySelector props

* variable/property name tidies - match conventions/API

* fix bug: line total price is only bottom-align on small screen

* move QuantitySelector to root of components, intended to be generally useful

* use lineItem directly for cart, specify shape in PropTypes

* rename cart components to align with "line item" rather than "product"

* rejig class names to better align with new component names & BEM style

* show cart item image correct size:
- use single column for product image and info, with flex container
- specify image width (rem instead of px)

* fix safari issue - cart product images displaying vertically stretched

* shift product name left margin from image, to account for no-image case

* experiment: bump bundlewatch size limit for cart temporarily:
- our fake data inline image is heavy
- when we switch to real API we will no longer need it

* fix issue introduced when moving margin from image to details div:
- product details needs margin on left (not right)

* fix react props issues:
- explicitly destructure image props for srcSet (vs srcset)
- use API key field for line item key instead of id, fix duplicate test id
- CartLineItemsTable takes an array of lineItems (incorrect PropTypes)

* remove redundant divs + use conventional `null` (when no full price)

* override editor styles to ensure cart product image is correct size

* move cart items editor style override to editor.css

* add an explicit readable heading for cart heading to match visual layout
2020-01-10 11:50:14 +13:00
Albert Juhé Lluveras 24fba4880b Fix minor issues with TextInput component (https://github.com/woocommerce/woocommerce-blocks/pull/1523)
* Set default value to TextInput component

* Set TextInput label transition origin

* Set default onChange function prop to noop

* Fix wrong propType name

* Remove default onChange and set it required
2020-01-09 19:06:49 +01:00
Darren Ethier b68b66542b add padding zeros to displayed prices (https://github.com/woocommerce/woocommerce-blocks/pull/1520) 2020-01-08 15:10:29 -05:00
Albert Juhé Lluveras 4be59b5ad1 Add ESLint radix rule (https://github.com/woocommerce/woocommerce-blocks/pull/1512) 2020-01-08 10:48:43 +00:00
Albert Juhé Lluveras 41633e136c Fix withFeedbackPrompt JSDoc definition (https://github.com/woocommerce/woocommerce-blocks/pull/1513) 2020-01-08 10:48:35 +00:00
Darren Ethier 8627b81c16 Add payment method api and components to checkout steps (https://github.com/woocommerce/woocommerce-blocks/pull/1349)
This adds a payment methods api to the checkout block that allows for extension to register payment methods with the block.
2020-01-06 17:28:09 -05:00
Albert Juhé Lluveras 44f70d8438 Fix Cart buttons misalignment in Firefox (https://github.com/woocommerce/woocommerce-blocks/pull/1446) 2020-01-06 12:46:00 +01:00
Albert Juhé Lluveras e082a14e3b Rename checkout classes from 'wc-blocks-xyz' to 'wc-block-xyz' (https://github.com/woocommerce/woocommerce-blocks/pull/1449)
* Rename checkout classes from 'wc-blocks-checkout' to 'wc-block-checkout'

* Rename form components classes from 'wc-blocks-checkout' to 'wc-block-checkout'

* Rename 'wc-components' class names to 'wc-block'
2020-01-03 15:23:49 +01:00
Albert Juhé Lluveras 892a56364c Fix empty cart inner blocks disabled (https://github.com/woocommerce/woocommerce-blocks/pull/1447) 2020-01-03 15:22:50 +01:00
Albert Juhé Lluveras 0a78174d25 Checkout: Fix city input field showing country value (https://github.com/woocommerce/woocommerce-blocks/pull/1467) 2020-01-02 17:36:56 +01:00
Albert Juhé Lluveras 5701f7d6c9 Price filter: allow any numeric input (https://github.com/woocommerce/woocommerce-blocks/pull/1457)
* Price filter: allow any numeric input in inputs

* Price filter: allow negative numbers in input fields (https://github.com/woocommerce/woocommerce-blocks/pull/1458)

* Price filter: allow negative numbers in input fields

* Always update input fields based on minPrice and maxPrice

* Don't default values to 0
2020-01-02 14:07:59 +01:00
Albert Juhé Lluveras 03bfa7d5a5 Remove outdated comments from useStoreProducts (https://github.com/woocommerce/woocommerce-blocks/pull/1466) 2020-01-02 14:00:50 +01:00
Albert Juhé Lluveras a538771bc1 Make price slider accurately represent the selected price independently from step (https://github.com/woocommerce/woocommerce-blocks/pull/1453) 2020-01-02 12:10:41 +01:00
Garrett Hyder 21f1d03199 Fix double 'yet yet' (https://github.com/woocommerce/woocommerce-blocks/pull/1421)
Found during translation of WooCommerce 
Permalink - https://translate.wordpress.org/projects/wp-plugins/woocommerce/dev/en-ca/default/?filters%5Bstatus%5D=either&filters%5Boriginal_id%5D=8771164&filters%5Btranslation_id%5D=68202906
2019-12-20 10:35:08 +01:00
Seghir Nadir aaddf13494 Add type to checkout input fields (https://github.com/woocommerce/woocommerce-blocks/pull/1401)
* add input type

* fix css issues with types and better change default position
2019-12-19 13:59:34 +01:00