@grazziotin/react-components-next 2.1.0 → 2.2.0

package/dist/accessibility/index.mjs

@@ -1,9 +1,15 @@
 import { nvl } from '../chunk-BWW3F4R4.mjs';
+import 'react-toastify/dist/ReactToastify.css';
+import { ToastContainer, toast } from 'react-toastify';
 import SayEngine from 'react-say';
-import { useState, useCallback, useMemo, useEffect } from 'react';
-import { jsx } from 'react/jsx-runtime';
+import { useCallback, useState, useMemo, useEffect } from 'react';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 
-// src/components/accessibility/say/utils/constants.ts
+var DEFAULT_SAY_RATE = 1.4;
+var DEFAULT_SAY_VOLUME = 1;
+var DEFAULT_SAY_PITCH = 0.8;
+var DEFAULT_SAY_VIBRATE_DURATION = 500;
+var DEFAULT_SAY_VOICE = "Google portugu\xEAs do Brasil";
 var SPEECH_APIS = ["speechSynthesis", "SpeechSynthesisUtterance"];
 function hasSpeechSupport() {
   return SPEECH_APIS.every((api) => api in globalThis);
@@ -24,50 +30,11 @@ function getSpeechSupport() {
     SpeechSynthesisUtterance: globalThis.SpeechSynthesisUtterance
   };
 }
-var DEFAULT_SAY_VOICE = "Google portugu\xEAs do Brasil";
-var DEFAULT_SAY_RATE = 1.4;
-var DEFAULT_SAY_PITCH = 0.8;
-var DEFAULT_SAY_VOLUME = 1;
-var DEFAULT_SAY_NOTIFY_AUTO_CLOSE = 1500;
-var DEFAULT_SAY_VIBRATE_DURATION = 500;
 function defaultShouldVibrate(type) {
-  return !type || type === "warning";
+  return type === "warning";
 }
-function useSay({
-  onNotify,
-  defaultNotifyType = "success",
-  vibrateDuration = DEFAULT_SAY_VIBRATE_DURATION,
-  defaultNotifyAutoClose = DEFAULT_SAY_NOTIFY_AUTO_CLOSE,
-  shouldVibrate = defaultShouldVibrate
-} = {}) {
-  const [isSpeaking, setIsSpeaking] = useState(false);
-  const [textSpeaking, setTextSpeaking] = useState("");
-  const say = useCallback(
-    (text, options) => {
-      const type = options == null ? void 0 : options.type;
-      const notify = nvl(options == null ? void 0 : options.notify, true);
-      const vibrate = nvl(options == null ? void 0 : options.vibrate, true);
-      setIsSpeaking(true);
-      setTextSpeaking(text);
-      if (notify && type !== false && onNotify) {
-        onNotify(text, {
-          type: nvl(type, defaultNotifyType),
-          autoClose: nvl(options == null ? void 0 : options.autoClose, defaultNotifyAutoClose)
-        });
-      }
-      if (vibrate && shouldVibrate(type) && navigator.vibrate) {
-        navigator.vibrate(vibrateDuration);
-      }
-    },
-    [
-      onNotify,
-      shouldVibrate,
-      vibrateDuration,
-      defaultNotifyType,
-      defaultNotifyAutoClose
-    ]
-  );
-  return { say, isSpeaking, textSpeaking, setIsSpeaking };
+function showSayNotify(text, { type = "success", autoClose = 4500 }) {
+  toast(text, { type, autoClose });
 }
 function useSpeechPonyfill() {
   const ponyfill = useMemo(() => getSpeechSupport(), []);
@@ -101,26 +68,71 @@ function Say({
   volume = DEFAULT_SAY_VOLUME
 }) {
   const { voices, ponyfill } = useSpeechPonyfill();
+  const canSpeak = isSpeaking && voices.length > 0 && ponyfill;
   const handleEnd = useCallback(() => {
     setIsSpeaking(false);
     onEnd == null ? void 0 : onEnd();
   }, [setIsSpeaking, onEnd]);
-  if (!isSpeaking || voices.length === 0 || !ponyfill) return null;
-  return /* @__PURE__ */ jsx(
-    SayEngine,
-    {
-      text,
-      rate,
-      pitch,
-      volume,
-      onEnd: handleEnd,
-      onStart,
-      ponyfill,
-      voice: voices.find((v) => v.name === voice)
-    }
-  );
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      ToastContainer,
+      {
+        limit: 3,
+        draggable: true,
+        newestOnTop: true,
+        pauseOnHover: true,
+        closeOnClick: true,
+        autoClose: 4500,
+        pauseOnFocusLoss: true,
+        closeButton: false,
+        position: "top-right",
+        style: { fontSize: "14px" }
+      }
+    ),
+    canSpeak && /* @__PURE__ */ jsx(
+      SayEngine,
+      {
+        text,
+        rate,
+        pitch,
+        volume,
+        onEnd: handleEnd,
+        onStart,
+        ponyfill,
+        voice: voices.find((v) => v.name === voice)
+      }
+    )
+  ] });
 }
 var say_default = Say;
+function useSay({
+  notifyAutoClose = 4500,
+  vibrateDuration = DEFAULT_SAY_VIBRATE_DURATION,
+  shouldVibrate = defaultShouldVibrate
+} = {}) {
+  const [isSpeaking, setIsSpeaking] = useState(false);
+  const [textSpeaking, setTextSpeaking] = useState("");
+  const handleSay = useCallback(
+    (text, options) => {
+      const notify = nvl(options.notify, true);
+      const vibrate = nvl(options.vibrate, true);
+      const { type } = options;
+      setIsSpeaking(true);
+      setTextSpeaking(text);
+      if (notify) {
+        showSayNotify(text, {
+          type,
+          autoClose: nvl(options.autoClose, notifyAutoClose)
+        });
+      }
+      if (vibrate && shouldVibrate(type) && navigator.vibrate) {
+        navigator.vibrate(vibrateDuration);
+      }
+    },
+    [shouldVibrate, vibrateDuration, notifyAutoClose]
+  );
+  return { handleSay, isSpeaking, textSpeaking, setIsSpeaking };
+}
 
 export { say_default as Say, useSay };
 //# sourceMappingURL=index.mjs.map

package/dist/accessibility/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/accessibility/say/utils/constants.ts","../../src/components/accessibility/say/use-say.ts","../../src/components/accessibility/say/use-speech-ponyfill.ts","../../src/components/accessibility/say/index.tsx"],"names":["useState","useCallback"],"mappings":"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","file":"index.mjs","sourcesContent":["import type { SpeechPonyfill } from \"./interface\";\r\n\r\nexport const SPEECH_APIS = [\"speechSynthesis\", \"SpeechSynthesisUtterance\"];\r\n\r\nexport function hasSpeechSupport(): boolean {\r\n  return SPEECH_APIS.every((api) => api in globalThis);\r\n}\r\n\r\nexport function voicesAreEqual(\r\n  current: SpeechSynthesisVoice[],\r\n  next: SpeechSynthesisVoice[],\r\n): boolean {\r\n  if (current.length !== next.length) return false;\r\n\r\n  return current.every(\r\n    (v, i) => v.name === next[i]?.name && v.lang === next[i]?.lang,\r\n  );\r\n}\r\n\r\nexport function getSpeechSupport(): SpeechPonyfill | null {\r\n  if (!hasSpeechSupport()) return null;\r\n\r\n  return {\r\n    speechSynthesis: globalThis.speechSynthesis,\r\n    SpeechSynthesisUtterance: globalThis.SpeechSynthesisUtterance,\r\n  };\r\n}\r\n\r\nexport const DEFAULT_SAY_VOICE = \"Google português do Brasil\";\r\nexport const DEFAULT_SAY_RATE = 1.4;\r\nexport const DEFAULT_SAY_PITCH = 0.8;\r\nexport const DEFAULT_SAY_VOLUME = 1;\r\nexport const DEFAULT_SAY_NOTIFY_AUTO_CLOSE = 1500;\r\nexport const DEFAULT_SAY_VIBRATE_DURATION = 500;\r\n\r\nexport function defaultShouldVibrate(\r\n  type?: import(\"./interface\").SayFeedbackType | false,\r\n): boolean {\r\n  return !type || type === \"warning\";\r\n}\r\n\r\nconst sayConstants = `\r\nSintetiza texto em fala via Web Speech API (\\`react-say\\`), com hook \\`useSay\\` para notificação e vibração.\r\n\r\n**Importação:**\r\n\\`\\`\\`tsx\r\nimport { Say, useSay } from \"@grazziotin/react-components-next/accessibility\";\r\n\\`\\`\\`\r\n\r\n**Uso básico:**\r\n\\`\\`\\`tsx\r\nconst { say, isSpeaking, textSpeaking, setIsSpeaking } = useSay({\r\n  onNotify: (text, { type }) => toast(text, { type }),\r\n});\r\n\r\n<>\r\n  <Say\r\n    isSpeaking={isSpeaking}\r\n    text={textSpeaking}\r\n    setIsSpeaking={setIsSpeaking}\r\n  />\r\n  <button type=\"button\" onClick={() => say(\"Operação concluída\")}>\r\n    Falar\r\n  </button>\r\n</>\r\n\\`\\`\\`\r\n\r\nRequer suporte a \\`speechSynthesis\\` no navegador. A voz padrão é \\`Google português do Brasil\\`.\r\n`;\r\n\r\nexport default sayConstants;\r\n","import {\r\n  defaultShouldVibrate,\r\n  DEFAULT_SAY_NOTIFY_AUTO_CLOSE,\r\n  DEFAULT_SAY_VIBRATE_DURATION,\r\n} from \"./utils/constants\";\r\nimport type {\r\n  UseSayReturn,\r\n  UseSayOptions,\r\n  SayCallOptions,\r\n} from \"./utils/interface\";\r\nimport { nvl } from \"@/functions\";\r\nimport { useCallback, useState } from \"react\";\r\n\r\n/**\r\n * Hook para disparar fala, notificação e vibração de forma configurável.\r\n *\r\n * @example\r\n * ```tsx\r\n * const { say, isSpeaking, textSpeaking, setIsSpeaking } = useSay({\r\n *   onNotify: (text, { type }) => toast(text, { type }),\r\n * });\r\n *\r\n * <Say\r\n *   isSpeaking={isSpeaking}\r\n *   text={textSpeaking}\r\n *   setIsSpeaking={setIsSpeaking}\r\n * />\r\n *\r\n * <button type=\"button\" onClick={() => say(\"Operação concluída\")}>\r\n *   Falar\r\n * </button>\r\n * ```\r\n */\r\nexport function useSay({\r\n  onNotify,\r\n  defaultNotifyType = \"success\",\r\n  vibrateDuration = DEFAULT_SAY_VIBRATE_DURATION,\r\n  defaultNotifyAutoClose = DEFAULT_SAY_NOTIFY_AUTO_CLOSE,\r\n  shouldVibrate = defaultShouldVibrate,\r\n}: UseSayOptions = {}): UseSayReturn {\r\n  const [isSpeaking, setIsSpeaking] = useState(false);\r\n  const [textSpeaking, setTextSpeaking] = useState(\"\");\r\n\r\n  const say = useCallback(\r\n    (text: string, options?: SayCallOptions) => {\r\n      const type = options?.type;\r\n      const notify = nvl(options?.notify, true);\r\n      const vibrate = nvl(options?.vibrate, true);\r\n\r\n      setIsSpeaking(true);\r\n      setTextSpeaking(text);\r\n\r\n      if (notify && type !== false && onNotify) {\r\n        onNotify(text, {\r\n          type: nvl(type, defaultNotifyType),\r\n          autoClose: nvl(options?.autoClose, defaultNotifyAutoClose),\r\n        });\r\n      }\r\n\r\n      if (vibrate && shouldVibrate(type) && navigator.vibrate) {\r\n        navigator.vibrate(vibrateDuration);\r\n      }\r\n    },\r\n    [\r\n      onNotify,\r\n      shouldVibrate,\r\n      vibrateDuration,\r\n      defaultNotifyType,\r\n      defaultNotifyAutoClose,\r\n    ],\r\n  );\r\n\r\n  return { say, isSpeaking, textSpeaking, setIsSpeaking };\r\n}\r\n","import {\r\n  getSpeechSupport,\r\n  hasSpeechSupport,\r\n  voicesAreEqual,\r\n} from \"./utils/constants\";\r\nimport { useEffect, useMemo, useState } from \"react\";\r\n\r\nexport function useSpeechPonyfill() {\r\n  const ponyfill = useMemo(() => getSpeechSupport(), []);\r\n  const [voices, setVoices] = useState<SpeechSynthesisVoice[]>([]);\r\n\r\n  useEffect(() => {\r\n    if (!hasSpeechSupport()) return;\r\n\r\n    const synthesis = globalThis.speechSynthesis;\r\n\r\n    const updateVoices = () => {\r\n      setVoices((current) => {\r\n        const next = synthesis.getVoices();\r\n        return voicesAreEqual(current, next) ? current : next;\r\n      });\r\n    };\r\n\r\n    synthesis.onvoiceschanged = updateVoices;\r\n    updateVoices();\r\n\r\n    return () => {\r\n      synthesis.onvoiceschanged = null;\r\n    };\r\n  }, []);\r\n\r\n  return { voices, ponyfill };\r\n}\r\n","\"use client\";\r\n\r\nimport {\r\n  DEFAULT_SAY_PITCH,\r\n  DEFAULT_SAY_RATE,\r\n  DEFAULT_SAY_VOICE,\r\n  DEFAULT_SAY_VOLUME,\r\n} from \"./utils/constants\";\r\nimport SayEngine from \"react-say\";\r\nexport { useSay } from \"./use-say\";\r\nimport React, { useCallback } from \"react\";\r\nimport type { SayProps } from \"./utils/interface\";\r\nimport { useSpeechPonyfill } from \"./use-speech-ponyfill\";\r\n\r\n/**\r\n * Sintetiza texto em fala via Web Speech API (`react-say`).\r\n * Use com {@link useSay} para controlar `isSpeaking`, `text` e `setIsSpeaking`.\r\n *\r\n * @example\r\n * ```tsx\r\n * const { say, isSpeaking, textSpeaking, setIsSpeaking } = useSay({\r\n *   onNotify: (text, { type }) => toast(text, { type }),\r\n * });\r\n *\r\n * return (\r\n *   <>\r\n *     <Say\r\n *       isSpeaking={isSpeaking}\r\n *       text={textSpeaking}\r\n *       setIsSpeaking={setIsSpeaking}\r\n *       voice=\"Google português do Brasil\"\r\n *       rate={1.4}\r\n *     />\r\n *     <button type=\"button\" onClick={() => say(\"Pronto\")}>Falar</button>\r\n *   </>\r\n * );\r\n * ```\r\n */\r\nfunction Say({\r\n  text,\r\n  onEnd,\r\n  onStart,\r\n  isSpeaking,\r\n  setIsSpeaking,\r\n  rate = DEFAULT_SAY_RATE,\r\n  voice = DEFAULT_SAY_VOICE,\r\n  pitch = DEFAULT_SAY_PITCH,\r\n  volume = DEFAULT_SAY_VOLUME,\r\n}: Readonly<SayProps>): React.ReactElement | null {\r\n  const { voices, ponyfill } = useSpeechPonyfill();\r\n\r\n  const handleEnd = useCallback(() => {\r\n    setIsSpeaking(false);\r\n    onEnd?.();\r\n  }, [setIsSpeaking, onEnd]);\r\n\r\n  if (!isSpeaking || voices.length === 0 || !ponyfill) return null;\r\n\r\n  return (\r\n    <SayEngine\r\n      text={text}\r\n      rate={rate}\r\n      pitch={pitch}\r\n      volume={volume}\r\n      onEnd={handleEnd}\r\n      onStart={onStart}\r\n      ponyfill={ponyfill}\r\n      voice={voices.find((v) => v.name === voice)}\r\n    />\r\n  );\r\n}\r\n\r\nexport default Say;\r\n"]}
+{"version":3,"sources":["../../src/components/accessibility/say/utils/constants.ts","../../src/components/accessibility/say/use-speech-ponyfill.ts","../../src/components/accessibility/say/index.tsx","../../src/components/accessibility/say/use-say.ts"],"names":["useState","useCallback"],"mappings":"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","file":"index.mjs","sourcesContent":["import type {\r\n  SayFeedbackType,\r\n  SayNotifyOptions,\r\n  SpeechPonyfill,\r\n} from \"./interface\";\r\nimport { toast } from \"react-toastify\";\r\n\r\nexport const DEFAULT_SAY_RATE = 1.4;\r\nexport const DEFAULT_SAY_VOLUME = 1;\r\nexport const DEFAULT_SAY_PITCH = 0.8;\r\nexport const DEFAULT_SAY_VIBRATE_DURATION = 500;\r\nexport const DEFAULT_SAY_VOICE = \"Google português do Brasil\";\r\nexport const SPEECH_APIS = [\"speechSynthesis\", \"SpeechSynthesisUtterance\"];\r\n\r\nexport function hasSpeechSupport(): boolean {\r\n  return SPEECH_APIS.every((api) => api in globalThis);\r\n}\r\n\r\nexport function voicesAreEqual(\r\n  current: SpeechSynthesisVoice[],\r\n  next: SpeechSynthesisVoice[],\r\n): boolean {\r\n  if (current.length !== next.length) return false;\r\n  return current.every(\r\n    (v, i) => v.name === next[i]?.name && v.lang === next[i]?.lang,\r\n  );\r\n}\r\n\r\nexport function getSpeechSupport(): SpeechPonyfill | null {\r\n  if (!hasSpeechSupport()) return null;\r\n  return {\r\n    speechSynthesis: globalThis.speechSynthesis,\r\n    SpeechSynthesisUtterance: globalThis.SpeechSynthesisUtterance,\r\n  };\r\n}\r\n\r\nexport function defaultShouldVibrate(type: SayFeedbackType): boolean {\r\n  return type === \"warning\";\r\n}\r\n\r\n/** Exibe toast integrado do {@link Say}. */\r\nexport function showSayNotify(\r\n  text: string,\r\n  { type = \"success\", autoClose = 4500 }: SayNotifyOptions,\r\n): void {\r\n  toast(text, { type, autoClose });\r\n}\r\n\r\nconst sayConstants = `\r\nSintetiza texto em fala via Web Speech API (\\`react-say\\`), com toast integrado (\\`react-toastify\\`) e vibração.\r\n\r\n**Importação:**\r\n\\`\\`\\`tsx\r\nimport { Say, useSay } from \"@grazziotin/react-components-next/accessibility\";\r\n\\`\\`\\`\r\n\r\n**Uso básico:**\r\n\\`\\`\\`tsx\r\nconst { handleSay, isSpeaking, textSpeaking, setIsSpeaking } = useSay();\r\n\r\n<>\r\n  <Say\r\n    isSpeaking={isSpeaking}\r\n    text={textSpeaking}\r\n    setIsSpeaking={setIsSpeaking}\r\n  />\r\n  <button type=\"button\" onClick={() => handleSay(\"Operação concluída\", { type: \"success\" })}>\r\n    Falar\r\n  </button>\r\n</>\r\nonSuccess: (r) => handleSay(r.status, { type: \"success\" })\r\n\\`\\`\\`\r\n\r\nMonte \\`<Say />\\` uma vez no layout. Toast e CSS já vêm embutidos.\r\nUse \\`notify: false\\` para falar sem toast: \\`handleSay(texto, { type: \"default\", notify: false })\\`.\r\n`;\r\nexport default sayConstants;\r\n","import {\r\n  voicesAreEqual,\r\n  getSpeechSupport,\r\n  hasSpeechSupport,\r\n} from \"./utils/constants\";\r\n\r\nimport { useEffect, useMemo, useState } from \"react\";\r\n\r\nexport function useSpeechPonyfill() {\r\n  const ponyfill = useMemo(() => getSpeechSupport(), []);\r\n  const [voices, setVoices] = useState<SpeechSynthesisVoice[]>([]);\r\n\r\n  useEffect(() => {\r\n    if (!hasSpeechSupport()) return;\r\n    const synthesis = globalThis.speechSynthesis;\r\n\r\n    const updateVoices = () => {\r\n      setVoices((current) => {\r\n        const next = synthesis.getVoices();\r\n        return voicesAreEqual(current, next) ? current : next;\r\n      });\r\n    };\r\n\r\n    synthesis.onvoiceschanged = updateVoices;\r\n    updateVoices();\r\n\r\n    return () => {\r\n      synthesis.onvoiceschanged = null;\r\n    };\r\n  }, []);\r\n\r\n  return { voices, ponyfill };\r\n}\r\n","\"use client\";\r\nimport \"react-toastify/dist/ReactToastify.css\";\r\n\r\nimport {\r\n  DEFAULT_SAY_PITCH,\r\n  DEFAULT_SAY_RATE,\r\n  DEFAULT_SAY_VOICE,\r\n  DEFAULT_SAY_VOLUME,\r\n} from \"./utils/constants\";\r\nimport SayEngine from \"react-say\";\r\nimport React, { useCallback } from \"react\";\r\nimport { ToastContainer } from \"react-toastify\";\r\nimport type { SayProps } from \"./utils/interface\";\r\nimport { useSpeechPonyfill } from \"./use-speech-ponyfill\";\r\n\r\n/**\r\n * Sintetiza texto em fala via Web Speech API (`react-say`).\r\n * Inclui toast integrado para notificações do {@link useSay}.\r\n *\r\n * @example\r\n * ```tsx\r\n * const { handleSay, isSpeaking, textSpeaking, setIsSpeaking } = useSay();\r\n *\r\n * return (\r\n *   <>\r\n *     <Say\r\n *       isSpeaking={isSpeaking}\r\n *       text={textSpeaking}\r\n *       setIsSpeaking={setIsSpeaking}\r\n *     />\r\n *     <button type=\"button\" onClick={() => handleSay(\"Pronto\", { type: \"success\" })}>\r\n *       Falar\r\n *     </button>\r\n *   </>\r\n * );\r\n * ```\r\n */\r\nfunction Say({\r\n  text,\r\n  onEnd,\r\n  onStart,\r\n  isSpeaking,\r\n  setIsSpeaking,\r\n  rate = DEFAULT_SAY_RATE,\r\n  voice = DEFAULT_SAY_VOICE,\r\n  pitch = DEFAULT_SAY_PITCH,\r\n  volume = DEFAULT_SAY_VOLUME,\r\n}: Readonly<SayProps>): React.ReactElement {\r\n  const { voices, ponyfill } = useSpeechPonyfill();\r\n  const canSpeak = isSpeaking && voices.length > 0 && ponyfill;\r\n\r\n  const handleEnd = useCallback(() => {\r\n    setIsSpeaking(false);\r\n    onEnd?.();\r\n  }, [setIsSpeaking, onEnd]);\r\n\r\n  return (\r\n    <>\r\n      <ToastContainer\r\n        limit={3}\r\n        draggable\r\n        newestOnTop\r\n        pauseOnHover\r\n        closeOnClick\r\n        autoClose={4500}\r\n        pauseOnFocusLoss\r\n        closeButton={false}\r\n        position=\"top-right\"\r\n        style={{ fontSize: \"14px\" }}\r\n      />\r\n      {canSpeak && (\r\n        <SayEngine\r\n          text={text}\r\n          rate={rate}\r\n          pitch={pitch}\r\n          volume={volume}\r\n          onEnd={handleEnd}\r\n          onStart={onStart}\r\n          ponyfill={ponyfill}\r\n          voice={voices.find((v) => v.name === voice)}\r\n        />\r\n      )}\r\n    </>\r\n  );\r\n}\r\nexport default Say;\r\n","import {\r\n  showSayNotify,\r\n  defaultShouldVibrate,\r\n  DEFAULT_SAY_VIBRATE_DURATION,\r\n} from \"./utils/constants\";\r\nimport type {\r\n  SayCallOptions,\r\n  UseSayReturn,\r\n  UseSayOptions,\r\n} from \"./utils/interface\";\r\nimport { nvl } from \"@/functions\";\r\nimport { useCallback, useState } from \"react\";\r\n\r\n/**\r\n * Hook para disparar fala, toast integrado e vibração.\r\n *\r\n * @example\r\n * ```tsx\r\n * const { handleSay, isSpeaking, textSpeaking, setIsSpeaking } = useSay();\r\n *\r\n * <Say\r\n *   isSpeaking={isSpeaking}\r\n *   text={textSpeaking}\r\n *   setIsSpeaking={setIsSpeaking}\r\n * />\r\n *\r\n * handleSay(\"Operação concluída\", { type: \"success\" });\r\n * handleSay(\"Atenção\", { type: \"warning\" });\r\n * handleSay(\"Apenas fala\", { type: \"default\", notify: false });\r\n * ```\r\n */\r\nexport function useSay({\r\n  notifyAutoClose = 4500,\r\n  vibrateDuration = DEFAULT_SAY_VIBRATE_DURATION,\r\n  shouldVibrate = defaultShouldVibrate,\r\n}: UseSayOptions = {}): UseSayReturn {\r\n  const [isSpeaking, setIsSpeaking] = useState(false);\r\n  const [textSpeaking, setTextSpeaking] = useState(\"\");\r\n\r\n  const handleSay = useCallback(\r\n    (text: string, options: SayCallOptions) => {\r\n      const notify = nvl(options.notify, true);\r\n      const vibrate = nvl(options.vibrate, true);\r\n      const { type } = options;\r\n\r\n      setIsSpeaking(true);\r\n      setTextSpeaking(text);\r\n\r\n      if (notify) {\r\n        showSayNotify(text, {\r\n          type,\r\n          autoClose: nvl(options.autoClose, notifyAutoClose),\r\n        });\r\n      }\r\n\r\n      if (vibrate && shouldVibrate(type) && navigator.vibrate) {\r\n        navigator.vibrate(vibrateDuration);\r\n      }\r\n    },\r\n    [shouldVibrate, vibrateDuration, notifyAutoClose],\r\n  );\r\n\r\n  return { handleSay, isSpeaking, textSpeaking, setIsSpeaking };\r\n}\r\n"]}

package/dist/index.css

@@ -1,2 +1,2 @@
 /*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */
-@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-space-x-reverse:0;--tw-border-style:solid;--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial}}}@layer theme{:root,:host{--font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-red-100:oklch(93.6% .032 17.717);--color-red-200:oklch(88.5% .062 18.334);--color-red-600:oklch(57.7% .245 27.325);--color-red-900:oklch(39.6% .141 25.723);--color-amber-100:oklch(96.2% .059 95.617);--color-amber-200:oklch(92.4% .12 95.746);--color-amber-900:oklch(41.4% .112 45.904);--color-green-50:oklch(98.2% .018 155.826);--color-green-100:oklch(96.2% .044 156.743);--color-green-200:oklch(92.5% .084 155.995);--color-green-400:oklch(79.2% .209 151.711);--color-green-500:oklch(72.3% .219 149.579);--color-green-800:oklch(44.8% .119 151.328);--color-green-900:oklch(39.3% .095 152.535);--color-teal-500:oklch(70.4% .14 182.503);--color-blue-100:oklch(93.2% .032 255.585);--color-blue-200:oklch(88.2% .059 254.128);--color-blue-500:oklch(62.3% .214 259.815);--color-blue-900:oklch(37.9% .146 265.522);--color-gray-50:oklch(98.5% .002 247.839);--color-gray-100:oklch(96.7% .003 264.542);--color-gray-200:oklch(92.8% .006 264.531);--color-gray-500:oklch(55.1% .027 264.364);--color-gray-600:oklch(44.6% .03 256.802);--color-gray-700:oklch(37.3% .034 259.733);--color-gray-900:oklch(21% .034 264.665);--color-black:#000;--color-white:#fff;--spacing:.25rem;--container-3xl:48rem;--container-5xl:64rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-2xl:1.5rem;--text-2xl--line-height:calc(2 / 1.5);--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--radius-md:.375rem;--radius-lg:.5rem;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-4{margin-top:calc(var(--spacing) * 4)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.ml-1{margin-left:calc(var(--spacing) * 1)}.block{display:block}.block\!{display:block!important}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline-block{display:inline-block}.h-5{height:calc(var(--spacing) * 5)}.h-15{height:calc(var(--spacing) * 15)}.h-full{height:100%}.min-h-\[210px\]\!{min-height:210px!important}.min-h-screen{min-height:100vh}.w-2{width:calc(var(--spacing) * 2)}.w-5{width:calc(var(--spacing) * 5)}.w-80{width:calc(var(--spacing) * 80)}.w-full{width:100%}.max-w-3xl{max-width:var(--container-3xl)}.max-w-5xl{max-width:var(--container-5xl)}.min-w-0{min-width:calc(var(--spacing) * 0)}.flex-1{flex:1}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.gap-2{gap:calc(var(--spacing) * 2)}.gap-4{gap:calc(var(--spacing) * 4)}:where(.space-x-4>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-start:calc(calc(var(--spacing) * 4) * var(--tw-space-x-reverse));margin-inline-end:calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-x-reverse)))}.truncate\!{text-overflow:ellipsis!important;white-space:nowrap!important;overflow:hidden!important}.overflow-hidden{overflow:hidden}.rounded{border-radius:.25rem}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-tl-md{border-top-left-radius:var(--radius-md)}.rounded-bl-md{border-bottom-left-radius:var(--radius-md)}.border{border-style:var(--tw-border-style);border-width:1px}.border-amber-200{border-color:var(--color-amber-200)}.border-blue-200{border-color:var(--color-blue-200)}.border-gray-200{border-color:var(--color-gray-200)}.border-green-200{border-color:var(--color-green-200)}.border-green-500{border-color:var(--color-green-500)}.border-red-200{border-color:var(--color-red-200)}.bg-\(--primary-color\){background-color:var(--primary-color)}.bg-amber-100{background-color:var(--color-amber-100)}.bg-blue-100{background-color:var(--color-blue-100)}.bg-blue-500{background-color:var(--color-blue-500)}.bg-gray-50{background-color:var(--color-gray-50)}.bg-gray-100{background-color:var(--color-gray-100)}.bg-gray-200{background-color:var(--color-gray-200)}.bg-gray-900{background-color:var(--color-gray-900)}.bg-green-50{background-color:var(--color-green-50)}.bg-green-100{background-color:var(--color-green-100)}.bg-red-100{background-color:var(--color-red-100)}.bg-red-600{background-color:var(--color-red-600)}.bg-teal-500{background-color:var(--color-teal-500)}.bg-white{background-color:var(--color-white)}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-6{padding-inline:calc(var(--spacing) * 6)}.py-0\.5{padding-block:calc(var(--spacing) * .5)}.py-1{padding-block:calc(var(--spacing) * 1)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-4{padding-block:calc(var(--spacing) * 4)}.pt-1{padding-top:calc(var(--spacing) * 1)}.pt-4{padding-top:calc(var(--spacing) * 4)}.pr-4{padding-right:calc(var(--spacing) * 4)}.pr-5{padding-right:calc(var(--spacing) * 5)}.pb-5{padding-bottom:calc(var(--spacing) * 5)}.pl-5{padding-left:calc(var(--spacing) * 5)}.text-center{text-align:center}.font-mono{font-family:var(--font-mono)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-sm\!{font-size:var(--text-sm)!important;line-height:var(--tw-leading,var(--text-sm--line-height))!important}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-xs\!{font-size:var(--text-xs)!important;line-height:var(--tw-leading,var(--text-xs--line-height))!important}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.font-semibold\!{--tw-font-weight:var(--font-weight-semibold)!important;font-weight:var(--font-weight-semibold)!important}.text-ellipsis{text-overflow:ellipsis}.whitespace-nowrap{white-space:nowrap}.text-amber-900{color:var(--color-amber-900)}.text-black{color:var(--color-black)}.text-black\/80{color:#000c}@supports (color:color-mix(in lab, red, red)){.text-black\/80{color:color-mix(in oklab, var(--color-black) 80%, transparent)}}.text-blue-900{color:var(--color-blue-900)}.text-gray-500{color:var(--color-gray-500)}.text-gray-600{color:var(--color-gray-600)}.text-gray-700{color:var(--color-gray-700)}.text-gray-900{color:var(--color-gray-900)}.text-green-400{color:var(--color-green-400)}.text-green-800{color:var(--color-green-800)}.text-green-900{color:var(--color-green-900)}.text-red-900{color:var(--color-red-900)}.text-white{color:var(--color-white)}.uppercase{text-transform:uppercase}.shadow-\[0_2px_6px_-1px_rgba\(0\,0\,0\,\.16\)\,0_6px_18px_-1px_rgba\(0\,0\,0\,\.06\)\]{--tw-shadow:0 2px 6px -1px var(--tw-shadow-color,#00000029), 0 6px 18px -1px var(--tw-shadow-color,#0000000f);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.blur{--tw-blur:blur(8px);filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.select-none{-webkit-user-select:none;user-select:none}.disabled\:opacity-50:disabled{opacity:.5}}@property --tw-space-x-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}
+@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-space-x-reverse:0;--tw-border-style:solid;--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial}}}@layer theme{:root,:host{--font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-red-600:oklch(57.7% .245 27.325);--color-green-50:oklch(98.2% .018 155.826);--color-green-100:oklch(96.2% .044 156.743);--color-green-400:oklch(79.2% .209 151.711);--color-green-500:oklch(72.3% .219 149.579);--color-green-800:oklch(44.8% .119 151.328);--color-teal-500:oklch(70.4% .14 182.503);--color-blue-500:oklch(62.3% .214 259.815);--color-gray-50:oklch(98.5% .002 247.839);--color-gray-100:oklch(96.7% .003 264.542);--color-gray-200:oklch(92.8% .006 264.531);--color-gray-500:oklch(55.1% .027 264.364);--color-gray-600:oklch(44.6% .03 256.802);--color-gray-700:oklch(37.3% .034 259.733);--color-gray-900:oklch(21% .034 264.665);--color-black:#000;--color-white:#fff;--spacing:.25rem;--container-3xl:48rem;--container-5xl:64rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-2xl:1.5rem;--text-2xl--line-height:calc(2 / 1.5);--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--radius-md:.375rem;--radius-lg:.5rem;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-4{margin-top:calc(var(--spacing) * 4)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.ml-1{margin-left:calc(var(--spacing) * 1)}.block\!{display:block!important}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline-block{display:inline-block}.h-5{height:calc(var(--spacing) * 5)}.h-15{height:calc(var(--spacing) * 15)}.h-full{height:100%}.min-h-\[210px\]\!{min-height:210px!important}.min-h-screen{min-height:100vh}.w-2{width:calc(var(--spacing) * 2)}.w-5{width:calc(var(--spacing) * 5)}.w-80{width:calc(var(--spacing) * 80)}.w-full{width:100%}.max-w-3xl{max-width:var(--container-3xl)}.max-w-5xl{max-width:var(--container-5xl)}.min-w-0{min-width:calc(var(--spacing) * 0)}.flex-1{flex:1}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.gap-2{gap:calc(var(--spacing) * 2)}.gap-4{gap:calc(var(--spacing) * 4)}:where(.space-x-4>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-start:calc(calc(var(--spacing) * 4) * var(--tw-space-x-reverse));margin-inline-end:calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-x-reverse)))}.truncate\!{text-overflow:ellipsis!important;white-space:nowrap!important;overflow:hidden!important}.overflow-hidden{overflow:hidden}.rounded{border-radius:.25rem}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-tl-md{border-top-left-radius:var(--radius-md)}.rounded-bl-md{border-bottom-left-radius:var(--radius-md)}.border{border-style:var(--tw-border-style);border-width:1px}.border-green-500{border-color:var(--color-green-500)}.bg-\(--primary-color\){background-color:var(--primary-color)}.bg-blue-500{background-color:var(--color-blue-500)}.bg-gray-50{background-color:var(--color-gray-50)}.bg-gray-100{background-color:var(--color-gray-100)}.bg-gray-200{background-color:var(--color-gray-200)}.bg-gray-900{background-color:var(--color-gray-900)}.bg-green-50{background-color:var(--color-green-50)}.bg-green-100{background-color:var(--color-green-100)}.bg-red-600{background-color:var(--color-red-600)}.bg-teal-500{background-color:var(--color-teal-500)}.bg-white{background-color:var(--color-white)}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-6{padding-inline:calc(var(--spacing) * 6)}.py-0\.5{padding-block:calc(var(--spacing) * .5)}.py-1{padding-block:calc(var(--spacing) * 1)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-4{padding-block:calc(var(--spacing) * 4)}.pt-1{padding-top:calc(var(--spacing) * 1)}.pt-4{padding-top:calc(var(--spacing) * 4)}.pr-4{padding-right:calc(var(--spacing) * 4)}.pr-5{padding-right:calc(var(--spacing) * 5)}.pb-5{padding-bottom:calc(var(--spacing) * 5)}.pl-5{padding-left:calc(var(--spacing) * 5)}.text-center{text-align:center}.font-mono{font-family:var(--font-mono)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-sm\!{font-size:var(--text-sm)!important;line-height:var(--tw-leading,var(--text-sm--line-height))!important}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-xs\!{font-size:var(--text-xs)!important;line-height:var(--tw-leading,var(--text-xs--line-height))!important}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.font-semibold\!{--tw-font-weight:var(--font-weight-semibold)!important;font-weight:var(--font-weight-semibold)!important}.text-ellipsis{text-overflow:ellipsis}.whitespace-nowrap{white-space:nowrap}.text-black{color:var(--color-black)}.text-black\/80{color:#000c}@supports (color:color-mix(in lab, red, red)){.text-black\/80{color:color-mix(in oklab, var(--color-black) 80%, transparent)}}.text-gray-500{color:var(--color-gray-500)}.text-gray-600{color:var(--color-gray-600)}.text-gray-700{color:var(--color-gray-700)}.text-gray-900{color:var(--color-gray-900)}.text-green-400{color:var(--color-green-400)}.text-green-800{color:var(--color-green-800)}.text-white{color:var(--color-white)}.uppercase{text-transform:uppercase}.shadow-\[0_2px_6px_-1px_rgba\(0\,0\,0\,\.16\)\,0_6px_18px_-1px_rgba\(0\,0\,0\,\.06\)\]{--tw-shadow:0 2px 6px -1px var(--tw-shadow-color,#00000029), 0 6px 18px -1px var(--tw-shadow-color,#0000000f);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.blur{--tw-blur:blur(8px);filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.select-none{-webkit-user-select:none;user-select:none}.disabled\:opacity-50:disabled{opacity:.5}}@property --tw-space-x-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@grazziotin/react-components-next",
-  "version": "2.1.0",
+  "version": "2.2.0",
   "description": "Biblioteca de componentes React reutilizáveis",
   "private": false,
   "exports": {
@@ -64,6 +64,7 @@
     "react-dom": ">=18.0.0",
     "react-icons": "^5.6.0",
     "react-say": "^2.2.1",
+    "react-toastify": "^11.1.0",
     "tailwind-merge": "^3.6.0"
   },
   "overrides": {