Liquid 3.0 - re: Array syntax now adding "[ " and " ]"

Advanced Development
1

re: Difference #3

We use liquid to dynamically add rgb colors to our websites via CSS variables. Prior to Liquid 3.0 Array syntax it worked pretty well:

Dynamic field value for “Color RGB”:
0,92,185

Liquid example:
{% capture color1raw -%}{{hex.ColorRGB | split: ‘,’}}{% endcapture -%}
{% capture color1rgb -%}{{hex.ColorRGB | split: ‘,’ | prepend: “rgb(” | append: “)” }}{% endcapture -%}

{% assign color1raw = “0,92,185” %}
{% assign color1rgb = “rgb(0,92,185)” %}

–color1raw: {{color1raw}};
–color1rgb: {{color1rgb}};

Output was:
–color1raw: 0,92,185;
–color1rgb: rgb(0,92,185);

Output is now:
–color1raw: [ 0,92,185 ];
–color1rgb: rgb([ 0,92,185 ]);

The new brackets/space break the CSS variable. We’ve tried everything we can think of inside the 3.0 array, but we can’t seem to get the “[ " and " ]” removed for correct rgb output. I’m hoping it’s something simple and I’m just not smart enough to figure it out. I’m afraid it’s wrecking it at the initial capture (field value with | split: “,”). Please help if you have any ideas on how to remove the new brackets/space from this array, as it’s not meant to be an array.

Tried: --color1raw: {{color1raw | remove: “[ " | remove: " ]” }};
Output: --color1raw: [ 0,92,185 ]; (not affected)

Tried: --color1raw: {{color1raw | join: “,” }};
Output: --color1raw: [ 0,92,185 ]; (not affected)

Tried: --color1raw: {{color1raw | split: “,” }};
Output: --color1raw: [ [ 0,92,185 ] ]; (double bracket)

2

@craigwhitlock I haven’t tested this, but have you tried {{color1raw[0]}}

The updated output with the “[]” is interpreted as an array type, so to access the values in an array directly you’ll need to use the array key.

Let me know if that helps.

3

If I did my test correctly replacing your split: ‘,’ with join: ‘,’ should work. Also, is your rgb data in the hex.ColorRGB item field?

If so you don’t need to capture it. You could call it direct
{{hex.ColorRGB}} for the raw and
{{hex.ColorRGB | join: ‘,’ | prepend: “rgb(” | append: “)” }} for the RGB.

You could also assign it
{% assign color1raw = hex.ColorRGB %}
{% assign color1rgb = hex.ColorRGB | join: ‘,’ | prepend: “rgb(” | append: “)” %}