@yamada-ui/react/dist/cjs/hooks/use-eye-dropper/index.cjs.map

React UI components of the Yamada, by the Yamada, for the Yamada built with React and Emotion

{"version":3,"file":"index.cjs","names":[],"sources":["../../../../src/hooks/use-eye-dropper/index.ts"],"sourcesContent":["\"use client\"\n\nimport { useCallback, useState } from \"react\"\nimport { useSafeLayoutEffect } from \"../../utils\"\n\ninterface EyeDropperOptions {\n  signal?: AbortSignal\n}\n\nexport interface EyeDropperReturn {\n  sRGBHex: string\n}\n\n/**\n * `useEyeDropper` is a custom hook that opens the eye dropper tool and returns the color value.\n *\n * @see https://yamada-ui.com/docs/hooks/use-eye-dropper\n */\nexport const useEyeDropper = () => {\n  const [supported, setSupported] = useState(false)\n\n  useSafeLayoutEffect(() => {\n    setSupported(typeof window !== \"undefined\" && \"EyeDropper\" in window)\n  }, [])\n\n  const onOpen = useCallback(\n    async (\n      options: EyeDropperOptions = {},\n    ): Promise<EyeDropperReturn | undefined> => {\n      if (supported) {\n        const eyeDropper = new (window as any).EyeDropper()\n\n        return eyeDropper.open(options)\n      }\n\n      return Promise.resolve(undefined)\n    },\n    [supported],\n  )\n\n  return { supported, onOpen }\n}\n"],"mappings":";;;;;;;;;;;;;;AAkBA,MAAa,sBAAsB;CACjC,MAAM,CAAC,WAAW,oCAAyB,MAAM;AAEjD,0CAA0B;AACxB,eAAa,OAAO,WAAW,eAAe,gBAAgB,OAAO;IACpE,EAAE,CAAC;AAiBN,QAAO;EAAE;EAAW,+BAdlB,OACE,UAA6B,EAAE,KACW;AAC1C,OAAI,UAGF,QAFmB,IAAK,OAAe,YAAY,CAEjC,KAAK,QAAQ;AAGjC,UAAO,QAAQ,QAAQ,OAAU;KAEnC,CAAC,UAAU,CACZ;EAE2B"}