q-colorize-mixin/dist/api/QColorizeMixin.json

Quasar color mixin

{
  "type": "component",
  "meta": {
    "docsUrl": "https://hawkeye64.github.io/q-colorize-mixin/docs"
  },
  "props": {
    "color": {
      "type": "String",
      "category": "style",
      "desc": "Any color from the [Quasar Color Pallete](https://quasar.dev/style/color-palette) or a CSS color (#, rgb, rgba, hls, etc)",
      "examples": [
        "color=\"orange-8\"",
        "color=\"#c8c8c8\"",
        "color=\"crimson\""
      ]
    }
  },
  "methods": {
    "setTextColor": {
      "desc": "Sets the text color of the passed in object. Function determines if passed in `color` is a Quasar color or CSS color",
      "params": {
        "color": {
          "type": "String",
          "desc": "Any color from the [Quasar Color Pallete](https://quasar.dev/style/color-palette) or a CSS color (#, rgb, rgba, hls, etc)",
          "examples": [
            "crimson",
            "red-8",
            "#cf0FF0"
          ]
        },
        "data": {
          "type": "Object",
          "desc": "Typically the `{ }` of a render function"
        }
      },
      "returns": {
        "type": "Object",
        "desc": "The passed in `data` with modifications"
      }
    },
    "setBackgroundColor": {
      "desc": "Sets the background color of the passed in object. Function determines if passed in `color` is a Quasar color or CSS color",
      "params": {
        "color": {
          "type": "String",
          "desc": "Any color from the [Quasar Color Pallete](https://quasar.dev/style/color-palette) or a CSS color (#, rgb, rgba, hls, etc)",
          "examples": [
            "crimson",
            "red-8",
            "#cf0FF0"
          ]
        },
        "data": {
          "type": "Object",
          "desc": "Typically the `{ }` of a render function"
        }
      },
      "returns": {
        "type": "Object",
        "desc": "The passed in `data` with modifications"
      }
    },
    "setBorderColor": {
      "desc": "Sets the border color of the passed in object. Function determines if passed in `color` is a Quasar color or CSS color",
      "params": {
        "color": {
          "type": "String",
          "desc": "Any color from the [Quasar Color Pallete](https://quasar.dev/style/color-palette) or a CSS color (#, rgb, rgba, hls, etc)",
          "examples": [
            "crimson",
            "red-8",
            "#cf0FF0"
          ]
        },
        "data": {
          "type": "Object",
          "desc": "Typically the `{ }` of a render function"
        }
      },
      "returns": {
        "type": "Object",
        "desc": "The passed in `data` with modifications"
      }
    },
    "setBothColors": {
      "desc": "Combination of `setTextColor` and `setBackgroundColor`",
      "params": {
        "color": {
          "type": "String",
          "desc": "Any color from the [Quasar Color Pallete](https://quasar.dev/style/color-palette) or a CSS color (#, rgb, rgba, hls, etc)",
          "examples": [
            "crimson",
            "red-8",
            "#cf0FF0"
          ]
        },
        "bgColor": {
          "type": "String",
          "desc": "Any color from the [Quasar Color Pallete](https://quasar.dev/style/color-palette) or a CSS color (#, rgb, rgba, hls, etc)",
          "examples": [
            "crimson",
            "red-8",
            "#cf0FF0"
          ]
        },
        "data": {
          "type": "Object",
          "desc": "Typically the `{ }` of a render function"
        }
      },
      "returns": {
        "type": "Object",
        "desc": "The passed in `data` with modifications"
      }
    },
    "isNamedCssColor": {
      "desc": "Returns true if passed in color is a css named color",
      "params": {
        "color": {
          "type": "String",
          "desc": "Any color from the [Quasar Color Pallete](https://quasar.dev/style/color-palette) or a CSS color (#, rgb, rgba, hls, etc)",
          "examples": [
            "isNamedCssColor('slateblue')",
            "isNamedCssColor('whitesmoke')"
          ]
        }
      },
      "returns": {
        "type": "Boolean",
        "desc": "Returns true if passed in color is a css named color"
      }
    },
    "isCssColor": {
      "desc": "Returns true if passed in color is a named color, hex color or rgb/rgba/hsl/hsla color",
      "params": {
        "color": {
          "type": "String",
          "desc": "Any CSS named color, hex color or rgb/rgba/hsl/hsla color",
          "examples": [
            "isCssColor('transparent')",
            "isCssColor('#c0c0c0')",
            "isCssColor('oldlace')",
            "isCssColor('rgba(255,0,0,0.2)')",
            "isCssColor('--orange-8')"
          ]
        }
      },
      "returns": {
        "type": "Boolean",
        "desc": "Returns true if passed in color is a named color, hex color or rgb/rgba/hsl/hsla color"
      }
    },
    "isCssVar": {
      "desc": "Returns true if passed in color is a CSS variable starting with `--`",
      "params": {
        "color": {
          "type": "String",
          "desc": "Any css var color",
          "examples": [
            "isCssVar('--orange-8')",
            "isCssVar('--blue-grey-6')"
          ]
        }
      },
      "returns": {
        "type": "Boolean",
        "desc": "Returns true if passed in color is a CSS variable starting with `--`"
      }
    },
    "calculateColor": {
      "desc": "Check if a color is a standard CSS color or a Quasar color (if Quasar, returns the calculated Quasar color)",
      "params": {
        "color": {
          "type": "String",
          "desc": "Any color from the [Quasar Color Pallete](https://quasar.dev/style/color-palette), CSS color (#, rgb, rgba, hls, etc), or CSS var color"
        },
        "defaultColor": {
          "type": "String",
          "desc": "",
          "default": "black"
        }
      },
      "returns": {
        "type": "String",
        "desc": "The calculated color"
      }
    },
    "makeQuasarColorVar": {
      "desc": "Generate a CSS variable definition based on the quasar color or existing variable passed in",
      "params": {
        "color": {
          "type": "String",
          "desc": "Any color from the [Quasar Color Pallete](https://quasar.dev/style/color-palette), CSS color (#, rgb, rgba, hls, etc), or CSS var color"
        },
        "defaultColor": {
          "type": "String",
          "desc": "",
          "default": "black"
        }
      },
      "returns": {
        "type": "String",
        "desc": "The generated CSS variable definition"
      }
    },
    "isValidCssColor": {
      "desc": "Tests if the passed in data is a CSS color",
      "params": {
        "color": {
          "type": "String",
          "desc": "Any color from the [Quasar Color Pallete](https://quasar.dev/style/color-palette), CSS color (#, rgb, rgba, hls, etc), or CSS var color"
        }
      },
      "returns": {
        "type": "Boolean",
        "desc": "Returns true if passed in data is a CSS color"
      }
    }
  }
}