How to use the @simonwep/pickr function in @simonwep/pickr

mounted() {
            this.pickr = new Pickr({
                el: this.$refs.pickr,
                lockOpacity: true,
                default: this.color,
                theme: 'nano',

                swatches: this.$config.predefinedColors,
                defaultRepresentation: 'HEXA',
                components: {

                    // Main components
                    preview: true,
                    hue: true,

                    // Input / output Options
                    interaction: {
                        input: true,

useLayoutEffect(() => {
    if (!container.current) {
      throw new Error("missing container element");
    }
    pickr.current = new Pickr({
      el: container.current,

      // Pickr internally calls setColor() after initialization, so if our setColor
      // happens too early it will be overridden by the default color
      default: colorRef.current,

      theme: "monolith",
      useAsButton: true,
      comparison: false,
      lockOpacity: true,
      components: {
        preview: false,
        hue: true,
        interaction: {
          input: true,
        },

private initPickr = () => {
		this.pickr = new Pickr({
			el: '.clr-pickr',
			default: '#00FFAA',
			theme: 'classic',
			lockOpacity: true,
			components: {
				preview: true,
				opacity: true,
				hue: true,
				interaction: {
					input: true,
					save: true
				}
			}
		});
		this.pickr.on('init', instance => {
			this.pickr.setColor(this.store.get("color", "#FF9900"));

setTimeout(() => {
    const pickr = new Pickr({
      el: picker,
      theme: "nano",
      default: old,
      autoReposition: false,
      components: {
        preview: true,
        opacity: true,
        hue: true,
        interaction: {
          cancel: true,
          save: true
        }
      },
      strings: {
        save: TEXT.OK,
        cancel: TEXT.CANCEL