woocommerce/plugins/woocommerce-blocks/assets/js/components/text-toolbar-button
Mike Jolley cd9f7e0ccb ⚛️ Introduce Product Element Blocks (https://github.com/woocommerce/woocommerce-blocks/pull/2871)
* Product selection when out of context for price and title blocks

* Move product element name/description/icons to constant files

* Add attributes and hocs to all elements

* Standalone block rendering

* Add a placeholder if title has no content

* Revert "Add a placeholder if title has no content"

This reverts commit 29115154b33eedc661ccd3cc758acdbc5041ffbc.

* parentClassName is not always present

* Loading state

* Wrap description in P

* Fixed loading styles when nested

* Maintain product shape in useProductData

* feature gate elements from showing in inserter

* fix feature flag

* include price PR

* edit withProductSelector to be a hoc

* fix lint issue

Co-authored-by: Seghir Nadir <nadir.seghir@gmail.com>
2020-07-22 13:20:54 +01:00
..
README.md Cart block: line-items front end initial work (https://github.com/woocommerce/woocommerce-blocks/pull/1333) 2020-01-10 11:50:14 +13:00
index.js ⚛️ Introduce Product Element Blocks (https://github.com/woocommerce/woocommerce-blocks/pull/2871) 2020-07-22 13:20:54 +01:00
style.scss ⚛️ Introduce Product Element Blocks (https://github.com/woocommerce/woocommerce-blocks/pull/2871) 2020-07-22 13:20:54 +01:00

README.md

TextToolbarButton

TextToolbarButton is used in Toolbar for text buttons which show isToggled state.

Notes:

  • Gutenberg core has ToolbarGroup and ToolbarButton in progress. When these are available this component may not be needed.
  • Gutenberg core html block uses regular Button in toolbar, and sets is-active class to trigger "active" styling when button is toggled on.

Usage

Example: two text buttons to select edit modes for cart block.

<BlockControls>
  <Toolbar>
    <TextToolbarButton
      onClick={ toggleFullCartMode }
      isToggled={ isFullCartMode }>
      {  __(
        'Full Cart',
        'woo-gutenberg-products-block'
      ) }
    </TextToolbarButton>
    <TextToolbarButton
      onClick={ toggleFullCartMode }
      isToggled={ ! isFullCartMode }>
      {  __(
        'Empty Cart',
        'woo-gutenberg-products-block'
      ) }
    </TextToolbarButton>
  </Toolbar>
</BlockControls>