Function a11yPlugin

src/plugins/a11y.ts:44–67

(ColordClass)

 * https://www.w3.org/TR/WCAG20/
 */
const a11yPlugin: Plugin = (ColordClass): void => {
  /**
   * Returns WCAG text color contrast requirement.
   * Read explanation here https://webaim.org/resources/contrastchecker/
   */
  const getMinimalContrast = ({ level = "AA", size = "normal" }: ReadabilityOptions) => {
    if (level === "AAA" && size === "normal") return 7;
    if (level === "AA" && size === "large") return 3;
    return 4.5;
  };

  ColordClass.prototype.luminance = function () {
    return round(getLuminance(this.rgba), 2);
  };

  ColordClass.prototype.contrast = function (color2 = "#FFF") {
    const instance2 = color2 instanceof ColordClass ? color2 : new ColordClass(color2);
    return floor(getContrast(this.rgba, instance2.toRgb()), 2);
  };

  ColordClass.prototype.isReadable = function (color2 = "#FFF", options = {}) {
    return this.contrast(color2) >= getMinimalContrast(options);
  };
};

export default a11yPlugin;