Shopify/polaris-viz

Gradients incorrectly formed for line chart and spark line chart

thephfernandes opened this issue · 1 comments

thephfernandes commented

Bug summary

Gradients are being completely filled on the two components in the title of this issue.
Captura de Tela 2023-08-24 às 15 45 21
Captura de Tela 2023-08-24 às 15 47 49

I am using remix-react, importing the esm stylesheet as mentioned in the documentation, and have no custom configuration in the librarys <PolarisVizProvider> component

Expected behavior

Gradients should not be filled

Actual behavior

Steps to reproduce the problem

  1. Create a basic remix app
  2. Install polaris-viz using npm or yarn
  3. Render a line chart or spark line chart component on the index page.

Specifications

  • Polaris-Viz version number: 9.4.0
  • Browser: Chrome, Firefox, Opera
  • System:
    OS: macOS 13.0.1
    CPU: (8) arm64 Apple M1
    Memory: 88.80 MB / 8.00 GB
    Shell: 5.8.1 - /bin/zsh
  • Binaries:
    Node: 20.2.0 - /opt/homebrew/bin/node
    npm: 9.6.6 - /opt/homebrew/bin/npm
  • Browsers:
    Chrome: 116.0.5845.96
    Safari: 16.1
  • npmPackages:
    @shopify/polaris-viz: ^9.4.0 => 9.10.6
    react: ^18.2.0 => 18.2.0
    react-dom: ^18.2.0 => 18.2.0
mattsrobot commented

Dear @thephfernandes,

Apologies for hijacking this issue, but how are you importing polaris-viz, the Shopify Remix template uses CommonJS and Polaris-Viz is built as an ESM module. Thankyou kindly.