Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(QB-23021): make ARGB for cell data work #298

Open
wants to merge 2 commits into
base: master
Choose a base branch
from

Conversation

JohanLohmanderKnowit
Copy link
Contributor

@JohanLohmanderKnowit JohanLohmanderKnowit commented Apr 23, 2024

Extracts the prebuilt package and fixes the bug in it. The reason for doing this is that we will deprecate this component soon and this was the least effort, more correct fix would be to update to latest version of sn-table and make a new react native version of it. That would be close to a re-write though, so keeping like this for now.

Code changed in handle-data.js:

const getExpressionColor = (col, row, key) => {
  if (col.stylingInfo?.length > 0 && row.qAttrExps?.qValues?.length > 0) {
    const bgIndex = col.stylingInfo.indexOf(key);
    if (bgIndex !== -1 && bgIndex < row.qAttrExps.qValues.length) {
      const rgbString = resolveToARGBorRGB(row.qAttrExps.qValues[bgIndex].qText);
      if (rgbString !== 'none') {
        const count = rgbString.startsWith("argb") === true ? 5 : 4;
        return `#${rgbString
          .slice(count, -1)
          .split(',')
          .map((x) => (+x).toString(16).padStart(2, 0))
          .join('')}`;
      }
    }
  }
  return undefined;
};


export function resolveToARGBorRGB(input) {
  // rgb
  let matches = /^rgb\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*\)$/i.exec(input);
  if (matches) {
    return `rgb(${matches[1]},${matches[2]},${matches[3]})`;
  }
  // rgba
  matches = /^rgba\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d(\.\d+)?)\s*\)$/i.exec(input);
  if (matches) {
    return `argb(${matches[2]},${matches[3]},${matches[4]},${matches[1]})`;
  }
  // argb
  matches = /^argb\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*\)$/i.exec(input);
  if (matches) {
    //const a = Math.round(matches[1] / 2.55) / 100;
    return `argb(${matches[1]},${matches[2]},${matches[3]},${matches[4]})`;
  }

  // css color
  const color = input && cssColors[input.toLowerCase()];
  if (color) {
    return typeof color.a !== 'undefined'
      ? `rgba(${color.r},${color.g},${color.b},${color.a})`
      : `rgb(${color.r},${color.g},${color.b})`;
  }
  // invalid
  return 'none';
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
1 participant