chakra-ui/panda @pandacss/extractor@0.15.4

on GitHub

Patch Changes

• 3a04a92: Fix static extraction of the
  Array Syntax when used with runtime
  conditions

  Given a component like this:

  function App() {
    return <Box py={[2, verticallyCondensed ? 2 : 3, 4]} />
  }

  the py value was incorrectly extracted like this:

   {
      "py": {
          "1": 2,
      },
  },
  {
      "py": {
          "1": 3,
      },
  },

  which would then generate invalid CSS like:

  .paddingBlock\\\\:1_2 {
    1: 2px;
  }
  
  .paddingBlock\\\\:1_3 {
    1: 3px;
  }

  it's now correctly transformed back to an array:

  {
    "py": {
  -    "1": 2,
  +   [
  +       undefined,
  +       2,
  +   ]
    },
  },
  {
    "py": {
  -    "1": 3,
  +   [
  +       undefined,
  +       3,
  +   ]
    },
  },

  which will generate the correct CSS

  @media screen and (min-width: 40em) {
    .sm\\\\:py_2 {
      padding-block: var(--spacing-2);
    }
  
    .sm\\\\:py_3 {
      padding-block: var(--spacing-3);
    }
  }