.eslintcache

[{"C:\\Users\\dakupc\\Documents\\.NetDev\\Drag-Drop-File\\File-DragDropper\\src\\index.tsx":"1","C:\\Users\\dakupc\\Documents\\.NetDev\\Drag-Drop-File\\File-DragDropper\\src\\App.tsx":"2","C:\\Users\\dakupc\\Documents\\.NetDev\\Drag-Drop-File\\File-DragDropper\\src\\Components\\FileDragDrop\\FileDragDrop.tsx":"3","C:\\Users\\dakupc\\Documents\\.NetDev\\Drag-Drop-File\\File-DragDropper\\src\\Components\\constants.tsx":"4","C:\\Users\\dakupc\\Documents\\.NetDev\\Drag-Drop-File\\File-DragDropper\\src\\Components\\Progress\\ProgressBar.tsx":"5","C:\\Users\\dakupc\\Documents\\.NetDev\\Drag-Drop-File\\File-DragDropper\\src\\Components\\Buttons\\StayledButton.tsx":"6","C:\\Users\\dakupc\\Documents\\.NetDev\\Drag-Drop-File\\File-DragDropper\\src\\Components\\Buttons\\CancleButton.tsx":"7","C:\\Users\\dakupc\\Documents\\.NetDev\\React Toast Component\\src\\index.tsx":"8","C:\\Users\\dakupc\\Documents\\.NetDev\\React Toast Component\\src\\App.tsx":"9","C:\\Users\\dakupc\\Documents\\.NetDev\\React Toast Component\\src\\Providers.tsx":"10","C:\\Users\\dakupc\\Documents\\.NetDev\\React Toast Component\\src\\Components\\Toast\\ToastProvider.tsx":"11","C:\\Users\\dakupc\\Documents\\.NetDev\\React Toast Component\\src\\Components\\Toast\\ToastContainer.tsx":"12","C:\\Users\\dakupc\\Documents\\.NetDev\\React Toast Component\\src\\Components\\Toast\\ToastMessage.tsx":"13","C:\\Users\\dakupc\\Documents\\.NetDev\\React Toast Component\\src\\HomePage\\Layout.tsx":"14","C:\\Users\\dakupc\\Documents\\.NetDev\\React Toast Component\\src\\HomePage\\Home.tsx":"15","C:\\Users\\dakupc\\Documents\\.NetDev\\React Toast Component\\src\\Components\\Buttons\\StayledButton.tsx":"16","C:\\Users\\dakupc\\Documents\\.NetDev\\React Toast Component\\src\\Components\\Avatar\\Avatar.tsx":"17","C:\\Users\\dakupc\\Documents\\.NetDev\\React Toast Component\\src\\Components\\Select\\Select.tsx":"18","C:\\Users\\dakupc\\Documents\\.NetDev\\React Toast Component\\src\\Components\\Select\\SelectOption.tsx":"19","C:\\Users\\dakupc\\Documents\\.NetDev\\React Toast Component\\src\\Hooks\\useOutsideClick.tsx":"20","C:\\Users\\dakupc\\Documents\\.NetDev\\React Toast Component\\src\\Components\\ToastDummyMessage.tsx":"21"},{"size":222,"mtime":1606942061793,"results":"22","hashOfConfig":"23"},{"size":1140,"mtime":1606951527245,"results":"24","hashOfConfig":"23"},{"size":10921,"mtime":1606995507533,"results":"25","hashOfConfig":"23"},{"size":1692,"mtime":1606941509511,"results":"26","hashOfConfig":"23"},{"size":2049,"mtime":1606943849676,"results":"27","hashOfConfig":"23"},{"size":2381,"mtime":1606942321522,"results":"28","hashOfConfig":"23"},{"size":590,"mtime":1606944214496,"results":"29","hashOfConfig":"23"},{"size":222,"mtime":1606942061793,"results":"30","hashOfConfig":"31"},{"size":378,"mtime":1607297617718,"results":"32","hashOfConfig":"31"},{"size":1065,"mtime":1607376150463,"results":"33","hashOfConfig":"31"},{"size":4609,"mtime":1607375607755,"results":"34","hashOfConfig":"31"},{"size":2090,"mtime":1607376259386,"results":"35","hashOfConfig":"31"},{"size":3366,"mtime":1607283079145,"results":"36","hashOfConfig":"31"},{"size":230,"mtime":1607376097993,"results":"37","hashOfConfig":"31"},{"size":6922,"mtime":1607376067931,"results":"38","hashOfConfig":"31"},{"size":2569,"mtime":1607283076620,"results":"39","hashOfConfig":"31"},{"size":1811,"mtime":1607283077366,"results":"40","hashOfConfig":"31"},{"size":2294,"mtime":1607372826373,"results":"41","hashOfConfig":"31"},{"size":891,"mtime":1607293554585,"results":"42","hashOfConfig":"31"},{"size":457,"mtime":1607280588831,"results":"43","hashOfConfig":"31"},{"size":1481,"mtime":1607371512628,"results":"44","hashOfConfig":"31"},{"filePath":"45","messages":"46","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"47"},"102f6c5",{"filePath":"48","messages":"49","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"50","messages":"51","errorCount":0,"warningCount":3,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"52","messages":"53","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"47"},{"filePath":"54","messages":"55","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"47"},{"filePath":"56","messages":"57","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"47"},{"filePath":"58","messages":"59","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"47"},{"filePath":"60","messages":"61","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"62"},"h9qkjs",{"filePath":"63","messages":"64","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"62"},{"filePath":"65","messages":"66","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"62"},{"filePath":"67","messages":"68","errorCount":0,"warningCount":4,"fixableErrorCount":0,"fixableWarningCount":0,"source":"69","usedDeprecatedRules":"62"},{"filePath":"70","messages":"71","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"62"},{"filePath":"72","messages":"73","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":"74","usedDeprecatedRules":"75"},{"filePath":"76","messages":"77","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"62"},{"filePath":"78","messages":"79","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"80","usedDeprecatedRules":"62"},{"filePath":"81","messages":"82","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"62"},{"filePath":"83","messages":"84","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"62"},{"filePath":"85","messages":"86","errorCount":0,"warningCount":3,"fixableErrorCount":0,"fixableWarningCount":0,"source":"87","usedDeprecatedRules":"62"},{"filePath":"88","messages":"89","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"62"},{"filePath":"90","messages":"91","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"92","usedDeprecatedRules":"62"},{"filePath":"93","messages":"94","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"62"},"C:\\Users\\dakupc\\Documents\\.NetDev\\Drag-Drop-File\\File-DragDropper\\src\\index.tsx",[],["95","96"],"C:\\Users\\dakupc\\Documents\\.NetDev\\Drag-Drop-File\\File-DragDropper\\src\\App.tsx",["97"],"C:\\Users\\dakupc\\Documents\\.NetDev\\Drag-Drop-File\\File-DragDropper\\src\\Components\\FileDragDrop\\FileDragDrop.tsx",["98","99","100"],"C:\\Users\\dakupc\\Documents\\.NetDev\\Drag-Drop-File\\File-DragDropper\\src\\Components\\constants.tsx",[],"C:\\Users\\dakupc\\Documents\\.NetDev\\Drag-Drop-File\\File-DragDropper\\src\\Components\\Progress\\ProgressBar.tsx",[],"C:\\Users\\dakupc\\Documents\\.NetDev\\Drag-Drop-File\\File-DragDropper\\src\\Components\\Buttons\\StayledButton.tsx",[],"C:\\Users\\dakupc\\Documents\\.NetDev\\Drag-Drop-File\\File-DragDropper\\src\\Components\\Buttons\\CancleButton.tsx",[],"C:\\Users\\dakupc\\Documents\\.NetDev\\React Toast Component\\src\\index.tsx",[],["101","102"],"C:\\Users\\dakupc\\Documents\\.NetDev\\React Toast Component\\src\\App.tsx",[],"C:\\Users\\dakupc\\Documents\\.NetDev\\React Toast Component\\src\\Providers.tsx",[],"C:\\Users\\dakupc\\Documents\\.NetDev\\React Toast Component\\src\\Components\\Toast\\ToastProvider.tsx",["103","104","105","106"],"/* Author: Dalibor Kundrat  https://github.com/damikun */\r\n\r\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\r\nimport React, { useCallback, useContext, useState } from \"react\";\r\nimport ToastContainer, { ToastContainerProps } from \"./ToastContainer\";\r\nimport { Truncate } from \"./ToastMessage\";\r\n\r\n/////////////////////////////////////\r\n/// Types\r\n/////////////////////////////////////\r\n\r\nexport type ToastProviderProps = {\r\n  children: React.ReactNode;\r\n} & ToastContainerProps;\r\n\r\ntype TostMessageType = \"Info\" | \"Success\" | \"Warning\" | \"Error\";\r\n\r\nexport type Toast = {\r\n  id: string;\r\n  lifetime: number;\r\n  message: string | React.ReactNode;\r\n  type?: TostMessageType;\r\n  truncate?: Truncate;\r\n  icon?: IconProp;\r\n  header?: string;\r\n};\r\n\r\nexport type ToastContextType = {\r\n  data: Array<Toast>;\r\n  pushError(message: string, lifetime?: number, truncate?: Truncate): void;\r\n  pushWarning(message: string, lifetime?: number, truncate?: Truncate): void;\r\n  pushSuccess(message: string, lifetime?: number, truncate?: Truncate): void;\r\n  pushInfo(message: string, lifetime?: number, truncate?: Truncate): void;\r\n  push(\r\n    message: string,\r\n    type: TostMessageType,\r\n    lifetime?: number,\r\n    truncate?: Truncate\r\n  ): void;\r\n  pushCustom(\r\n    message: string | React.ReactNode,\r\n    lifetime: number,\r\n    truncate?: Truncate,\r\n    icon?: IconProp | React.ReactNode\r\n  ): void;\r\n  remove(id: string): void;\r\n};\r\n\r\n/////////////////////////////////////\r\n/// Global and Helpers\r\n/////////////////////////////////////\r\n\r\nexport const ToastContext = React.createContext<ToastContextType | undefined>(\r\n  undefined\r\n);\r\n\r\nfunction uuidv4() {\r\n  return \"xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx\".replace(/[xy]/g, function (c) {\r\n    var r = (Math.random() * 16) | 0,\r\n      v = c == \"x\" ? r : (r & 0x3) | 0x8;\r\n    return v.toString(16);\r\n  });\r\n}\r\n\r\nexport const useToast = () => useContext(ToastContext);\r\n\r\nconst DEFAULT_INTERVAL = 2500;\r\n\r\n/////////////////////////////////////\r\n/// Implementation\r\n/////////////////////////////////////\r\n\r\nexport default function ToastProvider({\r\n  children,\r\n  variant,\r\n}: ToastProviderProps) {\r\n  const [data, setData] = useState<Array<Toast>>([]);\r\n\r\n  const Push = useCallback(\r\n    (\r\n      message: string,\r\n      type: TostMessageType,\r\n      lifetime?: number,\r\n      truncate?: Truncate\r\n    ) => {\r\n      if (message) {\r\n        const new_item: Toast = {\r\n          id: uuidv4(),\r\n          message: message,\r\n          type: type,\r\n          lifetime: lifetime ? lifetime : DEFAULT_INTERVAL,\r\n          truncate: truncate,\r\n        };\r\n\r\n        setData((prevState) => [...prevState, new_item]);\r\n      }\r\n    },\r\n    [setData, data]\r\n  );\r\n\r\n  const PushCustom = useCallback(\r\n    (\r\n      message: string | React.ReactNode,\r\n      lifetime?: number,\r\n      truncate?: Truncate,\r\n      icon?: IconProp\r\n    ) => {\r\n      if (message) {\r\n        const new_item: Toast = {\r\n          id: uuidv4(),\r\n          message: message,\r\n          lifetime: lifetime ? lifetime : DEFAULT_INTERVAL,\r\n          truncate: truncate,\r\n          icon: icon,\r\n          type: undefined,\r\n        };\r\n\r\n        setData((prevState) => [...prevState, new_item]);\r\n      }\r\n    },\r\n    [setData, data]\r\n  );\r\n\r\n  const PushError = useCallback(\r\n    (message: string, lifetime?: number, truncate?: Truncate) =>\r\n      Push(message, \"Error\", lifetime, truncate),\r\n    [Push]\r\n  );\r\n  const PushWarning = useCallback(\r\n    (message: string, lifetime?: number, truncate?: Truncate) =>\r\n      Push(message, \"Warning\", lifetime, truncate),\r\n    [Push]\r\n  );\r\n  const PushSuccess = useCallback(\r\n    (message: string, lifetime?: number, truncate?: Truncate) =>\r\n      Push(message, \"Success\", lifetime, truncate),\r\n    [Push]\r\n  );\r\n  const PushInfo = useCallback(\r\n    (message: string, lifetime?: number, truncate?: Truncate) =>\r\n      Push(message, \"Info\", lifetime, truncate),\r\n    [Push]\r\n  );\r\n\r\n  const ToastContexd = useCallback(() => {\r\n    return {\r\n      data: data,\r\n      pushError: PushError,\r\n      pushWarning: PushWarning,\r\n      pushSuccess: PushSuccess,\r\n      pushInfo: PushInfo,\r\n      push: Push,\r\n      pushCustom: PushCustom,\r\n\r\n      async remove(id: string) {\r\n        setData((prevState) => prevState.filter((e) => e.id != id));\r\n      },\r\n    };\r\n  }, [\r\n    data,\r\n    setData,\r\n    PushError,\r\n    PushWarning,\r\n    PushSuccess,\r\n    PushInfo,\r\n    Push,\r\n    PushCustom,\r\n  ]);\r\n\r\n  return (\r\n    <ToastContext.Provider value={ToastContexd()}>\r\n      <ToastContainer variant={variant} />\r\n      {children}\r\n    </ToastContext.Provider>\r\n  );\r\n}\r\n","C:\\Users\\dakupc\\Documents\\.NetDev\\React Toast Component\\src\\Components\\Toast\\ToastContainer.tsx",[],"C:\\Users\\dakupc\\Documents\\.NetDev\\React Toast Component\\src\\Components\\Toast\\ToastMessage.tsx",["107","108"],"/* Author: Dalibor Kundrat  https://github.com/damikun */\r\n\r\nimport React, { useEffect } from \"react\";\r\nimport { Toast } from \"./ToastProvider\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport {\r\n  faTimes,\r\n  faExclamationCircle,\r\n  faCheck,\r\n  faInfoCircle,\r\n} from \"@fortawesome/free-solid-svg-icons\";\r\nimport clsx from \"clsx\";\r\n\r\nconst VARIANTS = {\r\n  Info: {\r\n    base: \"bg-white border-blue-500\",\r\n    iconstyle: \"text-blue-500 \",\r\n    icon: faInfoCircle,\r\n    name: \"Info\",\r\n  },\r\n\r\n  Error: {\r\n    base: \"bg-white border-red-500 \",\r\n    iconstyle: \"text-red-500 \",\r\n    icon: faExclamationCircle,\r\n    name: \"Error\",\r\n  },\r\n\r\n  Warning: {\r\n    base: \"bg-white border-yellow-500\",\r\n    iconstyle: \"text-yellow-500 \",\r\n    icon: faExclamationCircle,\r\n    name: \"Warning\",\r\n  },\r\n\r\n  Success: {\r\n    base: \"bg-white border-green-500\",\r\n    iconstyle: \"text-green-500 \",\r\n    icon: faCheck,\r\n    name: \"Success\",\r\n  },\r\n};\r\n\r\nexport type Truncate =\r\n  | \"truncate-1-lines\"\r\n  | \"truncate-2-lines\"\r\n  | \"truncate-3-lines\";\r\n\r\nexport type ToastMessage = {\r\n  id: string;\r\n  lifetime?: number;\r\n  variant?: keyof typeof VARIANTS | undefined;\r\n  onRemove?: (id: string) => void;\r\n  truncate?: Truncate;\r\n} & Toast;\r\n\r\nexport default function ToastMessage({\r\n  id,\r\n  header,\r\n  message,\r\n  lifetime,\r\n  onRemove,\r\n  truncate = \"truncate-1-lines\",\r\n  icon,\r\n  type,\r\n}: ToastMessage) {\r\n  const Var = type\r\n    ? VARIANTS[type]\r\n    : {\r\n        base: \"bg-white border-gray-600 \",\r\n        iconstyle: \"\",\r\n        icon: icon,\r\n        name: header,\r\n      };\r\n\r\n  useEffect(() => {\r\n    if (lifetime && onRemove) {\r\n      setTimeout(() => {\r\n        onRemove(id);\r\n      }, lifetime);\r\n    }\r\n  }, [lifetime]);\r\n\r\n  return (\r\n    <div\r\n      className={clsx(\r\n        \"flex w-full visible flex-row shadow-lg\",\r\n        \"border-l-4 rounded-md duration-100 cursor-pointer\",\r\n        \"transform transition-all hover:scale-102\",\r\n        Var.base,\r\n        type && \"max-h-40\"\r\n      )}\r\n    >\r\n      <div className=\"flex flex-row p-2 flex-no-wrap w-full\">\r\n        {Var.icon && (\r\n          <div\r\n            className={clsx(\r\n              \"flex items-center h-12 w-12\",\r\n              \"mx-auto text-xl select-none\"\r\n            )}\r\n          >\r\n            <FontAwesomeIcon\r\n              className={clsx(\"mx-auto\", Var.iconstyle)}\r\n              icon={Var.icon}\r\n            />\r\n          </div>\r\n        )}\r\n\r\n        <div className=\"flex flex-col flex-no-wrap px-1 w-full\">\r\n          <div className=\"flex my-auto font-bold select-none\">{Var.name}</div>\r\n          <p\r\n            className={clsx(\r\n              \"-mt-0.5 my-auto break-all flex\",\r\n              \"text-gray-600 text-sm\",\r\n              typeof message === \"string\" && truncate\r\n            )}\r\n          >\r\n            {message}\r\n          </p>\r\n        </div>\r\n        <div\r\n          onClick={() => onRemove && onRemove(id)}\r\n          className={clsx(\r\n            \"w-10 h-12 mr-2 items-center mx-auto\",\r\n            \"text-center leading-none text-lg\"\r\n          )}\r\n        >\r\n          <FontAwesomeIcon\r\n            className={clsx(\r\n              \"mx-auto my-auto h-full text-center text-gray-600\",\r\n              \"cursor-pointer hover:scale-105 transform \"\r\n            )}\r\n            icon={faTimes}\r\n          />\r\n        </div>\r\n      </div>\r\n    </div>\r\n  );\r\n}\r\n",["109","110"],"C:\\Users\\dakupc\\Documents\\.NetDev\\React Toast Component\\src\\HomePage\\Layout.tsx",[],"C:\\Users\\dakupc\\Documents\\.NetDev\\React Toast Component\\src\\HomePage\\Home.tsx",["111"],"import React, { useEffect, useState } from \"react\";\r\nimport clsx from \"clsx\";\r\nimport StayledButton from \"../Components/Buttons/StayledButton\";\r\nimport { useToast } from \"../Components/Toast/ToastProvider\";\r\nimport Select from \"../Components/Select/Select\";\r\nimport SelectOptions from \"../Components/Select/SelectOption\";\r\nimport ToastDummyMessage from \"../Components/ToastDummyMessage\";\r\nimport { useGlobalState } from \"../Providers\";\r\n\r\nconst text = `Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum`;\r\n\r\nexport default function HomePage() {\r\n  const toast = useToast();\r\n  const [interval, setInterval] = useState(1500);\r\n  const [position, setPosition] = useState(\"top_right\");\r\n  const globalState = useGlobalState();\r\n\r\n  useEffect(() => {\r\n    //@ts-ignore\r\n    globalState?.setPosition({ variant: position });\r\n  }, [position]);\r\n\r\n  return (\r\n    <div\r\n      className={clsx(\r\n        \"mx-auto relative my-auto p-5 bg-white\",\r\n        \"shadow-md rounded-md border border-gray-200 \"\r\n      )}\r\n    >\r\n      <div className=\"flex flex-col my-auto h-full space-y-5\">\r\n        <div className=\"flex justify-between\">\r\n          <div className=\"flex flex-col space-y-3 w-32\">\r\n            <SectionHeader name={\"Duration:\"} />\r\n\r\n            <div\r\n              className={clsx(\r\n                \"flex flex-row space-x-1 md:space-x-5 w-full\",\r\n                \"align-middle my-auto \"\r\n              )}\r\n            >\r\n              <Select\r\n                initinal={interval}\r\n                onChange={(value) => setInterval(value as number)}\r\n              >\r\n                <SelectOptions value=\"1000\">1000 ms</SelectOptions>\r\n                <SelectOptions value=\"2500\">2500 ms</SelectOptions>\r\n                <SelectOptions value=\"5000\">5000 ms</SelectOptions>\r\n              </Select>\r\n            </div>\r\n          </div>\r\n          <div className=\"flex flex-col space-y-3 w-32\">\r\n            <SectionHeader justify_end name={\"Position\"} />\r\n            <div\r\n              className={clsx(\r\n                \"flex relative flex-row space-x-1 md:space-x-5 w-full\",\r\n                \"align-middle my-auto w-full\"\r\n              )}\r\n            >\r\n              <Select\r\n                justify_end\r\n                value={GetPositionText(position)}\r\n                initinal={position}\r\n                onChange={(value) => setPosition(value as string)}\r\n              >\r\n                <SelectOptions value=\"top_right\">Top-Right</SelectOptions>\r\n                <SelectOptions value=\"top_middle\">Top-Middle</SelectOptions>\r\n                <SelectOptions value=\"top_left\">Top-Left</SelectOptions>\r\n                <SelectOptions value=\"bottom_right\">Bottom-Right</SelectOptions>\r\n                <SelectOptions value=\"bottom_middle\">\r\n                  Bottom-Middle\r\n                </SelectOptions>\r\n                <SelectOptions value=\"bottom_left\">Bottom-Left</SelectOptions>\r\n              </Select>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <div className=\"flex flex-col space-y-3\">\r\n          <SectionHeader name={\"Types:\"} />\r\n          <div\r\n            className={clsx(\r\n              \"flex relative flex-row space-x-1 md:space-x-5 w-full\",\r\n              \"justify-center align-middle my-auto \"\r\n            )}\r\n          >\r\n            <StayledButton\r\n              variant=\"primaryred\"\r\n              onClick={() => toast?.pushError(\"Oppps Error\", interval)}\r\n            >\r\n              Error\r\n            </StayledButton>\r\n            <StayledButton\r\n              variant=\"primaryorange\"\r\n              onClick={() =>\r\n                toast?.pushWarning(\r\n                  \"Warning appear\",\r\n                  interval,\r\n                  \"truncate-2-lines\"\r\n                )\r\n              }\r\n            >\r\n              Warning\r\n            </StayledButton>\r\n            <StayledButton\r\n              variant=\"primarygreen\"\r\n              onClick={() => toast?.pushSuccess(\"Action success\", interval)}\r\n            >\r\n              Success\r\n            </StayledButton>\r\n            <StayledButton\r\n              variant=\"primaryblue\"\r\n              onClick={() => toast?.pushInfo(\"Info message\", interval)}\r\n            >\r\n              Info\r\n            </StayledButton>\r\n            <StayledButton\r\n              variant=\"primarygray\"\r\n              onClick={() => toast?.pushCustom(<ToastDummyMessage />, interval)}\r\n            >\r\n              Custom\r\n            </StayledButton>\r\n          </div>\r\n        </div>\r\n        <div className=\"flex flex-col space-y-3\">\r\n          <SectionHeader name={\"Truncate:\"} />\r\n          <div\r\n            className={clsx(\r\n              \"flex relative flex-row space-x-1 md:space-x-5 w-full\",\r\n              \" align-middle my-auto \"\r\n            )}\r\n          >\r\n            <StayledButton\r\n              variant=\"secondaryblue\"\r\n              onClick={() =>\r\n                toast?.pushInfo(text, interval, \"truncate-1-lines\")\r\n              }\r\n            >\r\n              1 line\r\n            </StayledButton>\r\n            <StayledButton\r\n              variant=\"secondaryblue\"\r\n              onClick={() =>\r\n                toast?.pushInfo(text, interval, \"truncate-2-lines\")\r\n              }\r\n            >\r\n              2 lines\r\n            </StayledButton>\r\n            <StayledButton\r\n              variant=\"secondaryblue\"\r\n              onClick={() =>\r\n                toast?.pushInfo(text, interval, \"truncate-3-lines\")\r\n              }\r\n            >\r\n              3 lines\r\n            </StayledButton>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  );\r\n}\r\n\r\n/////////////////////////////////\r\n/////////////////////////////////\r\n\r\ntype SectionHeaderProps = {\r\n  name: string;\r\n  justify_end?: boolean;\r\n};\r\nfunction SectionHeader({ justify_end, name }: SectionHeaderProps) {\r\n  return (\r\n    <div\r\n      className={clsx(\r\n        \"flex font-bold text-gray-500 text-base uppercase\",\r\n        justify_end === true && \"justify-end \"\r\n      )}\r\n    >\r\n      {name}\r\n    </div>\r\n  );\r\n}\r\nfunction GetPositionText(value: string) {\r\n  switch (value) {\r\n    case \"top_right\":\r\n      return \"Top-Right\";\r\n    case \"top_left\":\r\n      return \"Top-Left\";\r\n    case \"top_middle\":\r\n      return \"Top-Middle\";\r\n    case \"bottom_right\":\r\n      return \"Bottom-Right\";\r\n    case \"bottom_left\":\r\n      return \"Bottom-Left\";\r\n    case \"bottom_middle\":\r\n      return \"Bottom-Middle\";\r\n  }\r\n}\r\n","C:\\Users\\dakupc\\Documents\\.NetDev\\React Toast Component\\src\\Components\\Buttons\\StayledButton.tsx",[],"C:\\Users\\dakupc\\Documents\\.NetDev\\React Toast Component\\src\\Components\\Avatar\\Avatar.tsx",[],"C:\\Users\\dakupc\\Documents\\.NetDev\\React Toast Component\\src\\Components\\Select\\Select.tsx",["112","113","114"],"/* Author: Dalibor Kundrat  https://github.com/damikun */\r\n\r\nimport clsx from \"clsx\";\r\nimport React, { useCallback, useEffect, useRef } from \"react\";\r\nimport { useState } from \"react\";\r\nimport { useOutsideClick } from \"../../Hooks/useOutsideClick\";\r\n\r\ntype SelectProps = {\r\n  initinal: number | string;\r\n  value?: string;\r\n  children: React.ReactNode;\r\n  onChange?: (value: string | number) => void;\r\n  justify_end?: boolean;\r\n};\r\n\r\nexport type SelectContext = {\r\n  onSelect(value: string | number): void;\r\n};\r\n\r\nexport const SelectContext = React.createContext<SelectContext | undefined>(\r\n  undefined\r\n);\r\n\r\nexport default function Select({\r\n  children,\r\n  onChange,\r\n  initinal,\r\n  justify_end = false,\r\n  value,\r\n}: SelectProps) {\r\n  const [open, setIsOpen] = useState(false);\r\n\r\n  const [selected, setSelected] = useState(initinal);\r\n\r\n  useEffect(() => {\r\n    onChange && onChange(selected);\r\n  }, [selected, onChange]);\r\n\r\n  const ref = useRef(null);\r\n\r\n  function onClickOutside() {\r\n    setIsOpen(false);\r\n  }\r\n\r\n  useOutsideClick(ref, onClickOutside);\r\n\r\n  const handleSlect = useCallback((value: string | number) => {\r\n    setSelected(value);\r\n    setIsOpen(false);\r\n  }, []);\r\n\r\n  const Context = useCallback(() => {\r\n    return {\r\n      onSelect: handleSlect,\r\n    };\r\n  }, []);\r\n\r\n  return (\r\n    <SelectContext.Provider value={Context()}>\r\n      <div\r\n        ref={ref}\r\n        onMouseDown={(e) => {\r\n          e.preventDefault();\r\n          setIsOpen((e) => !e);\r\n        }}\r\n        className={clsx(\r\n          \"flex flex-col w-full border-2 border-transparent\",\r\n          \"hover:border-gray-300 transition duration-150\",\r\n          \"focus:border-blue-500 rounded-md cursor-pointer\"\r\n        )}\r\n      >\r\n        <div className={clsx(\"flex px-1\", justify_end && \"justify-end\")}>\r\n          {value ? value : selected}\r\n        </div>\r\n        <div className=\" h-full relative\">\r\n          {open == true && (\r\n            <div\r\n              className={clsx(\r\n                \"flex flex-col absolute z-10\",\r\n                \"rounded-md shadow-xl bg-white\",\r\n                \"border border-gray-200 mt-1 buttom-0\"\r\n              )}\r\n            >\r\n              {children}\r\n            </div>\r\n          )}\r\n        </div>\r\n      </div>\r\n    </SelectContext.Provider>\r\n  );\r\n}\r\n","C:\\Users\\dakupc\\Documents\\.NetDev\\React Toast Component\\src\\Components\\Select\\SelectOption.tsx",[],"C:\\Users\\dakupc\\Documents\\.NetDev\\React Toast Component\\src\\Hooks\\useOutsideClick.tsx",["115"],"import { useEffect } from \"react\";\r\n\r\nexport function useOutsideClick(ref: any, onEvent: () => void) {\r\n  useEffect(() => {\r\n    function handleClickOutside(event: any) {\r\n      if (ref.current && !ref.current.contains(event.target)) {\r\n        onEvent();\r\n      }\r\n    }\r\n\r\n    document.addEventListener(\"mousedown\", handleClickOutside);\r\n\r\n    return () => {\r\n      document.removeEventListener(\"mousedown\", handleClickOutside);\r\n    };\r\n  }, [ref]);\r\n}\r\n","C:\\Users\\dakupc\\Documents\\.NetDev\\React Toast Component\\src\\Components\\ToastDummyMessage.tsx",[],{"ruleId":"116","replacedBy":"117"},{"ruleId":"118","replacedBy":"119"},{"ruleId":"120","severity":1,"message":"121","line":9,"column":10,"nodeType":"122","messageId":"123","endLine":9,"endColumn":15},{"ruleId":"124","severity":1,"message":"125","line":59,"column":3,"nodeType":"126","endLine":80,"endColumn":4},{"ruleId":"124","severity":1,"message":"127","line":246,"column":28,"nodeType":"122","endLine":246,"endColumn":35},{"ruleId":"124","severity":1,"message":"128","line":255,"column":6,"nodeType":"129","endLine":255,"endColumn":44,"suggestions":"130"},{"ruleId":"116","replacedBy":"131"},{"ruleId":"118","replacedBy":"132"},{"ruleId":"133","severity":1,"message":"134","line":60,"column":13,"nodeType":"135","messageId":"136","endLine":60,"endColumn":15},{"ruleId":"124","severity":1,"message":"137","line":98,"column":5,"nodeType":"129","endLine":98,"endColumn":20,"suggestions":"138"},{"ruleId":"124","severity":1,"message":"137","line":121,"column":5,"nodeType":"129","endLine":121,"endColumn":20,"suggestions":"139"},{"ruleId":"133","severity":1,"message":"140","line":156,"column":61,"nodeType":"135","messageId":"136","endLine":156,"endColumn":63},{"ruleId":"141","severity":1,"message":"142","line":57,"column":25,"nodeType":"122","messageId":"143","endLine":57,"endColumn":37},{"ruleId":"124","severity":1,"message":"144","line":82,"column":6,"nodeType":"129","endLine":82,"endColumn":16,"suggestions":"145"},{"ruleId":"116","replacedBy":"146"},{"ruleId":"118","replacedBy":"147"},{"ruleId":"124","severity":1,"message":"148","line":21,"column":6,"nodeType":"129","endLine":21,"endColumn":16,"suggestions":"149"},{"ruleId":"141","severity":1,"message":"150","line":20,"column":14,"nodeType":"122","messageId":"143","endLine":20,"endColumn":27},{"ruleId":"124","severity":1,"message":"151","line":56,"column":6,"nodeType":"129","endLine":56,"endColumn":8,"suggestions":"152"},{"ruleId":"133","severity":1,"message":"134","line":76,"column":17,"nodeType":"135","messageId":"136","endLine":76,"endColumn":19},{"ruleId":"124","severity":1,"message":"153","line":16,"column":6,"nodeType":"129","endLine":16,"endColumn":11,"suggestions":"154"},"no-native-reassign",["155"],"no-negated-in-lhs",["156"],"@typescript-eslint/no-unused-vars","'state' is assigned a value but never used.","Identifier","unusedVar","react-hooks/exhaustive-deps","The 'upload' function makes the dependencies of useCallback Hook (at line 218) change on every render. Move it inside the useCallback callback. Alternatively, wrap the definition of 'upload' in its own useCallback() Hook.","FunctionDeclaration","The ref value 'divRef.current' will likely have changed by the time this effect cleanup function runs. If this ref points to a node rendered by React, copy 'divRef.current' to a variable inside the effect, and use that variable in the cleanup function.","React Hook useEffect has a missing dependency: 'onDrop'. Either include it or remove the dependency array.","ArrayExpression",["157"],["155"],["156"],"eqeqeq","Expected '===' and instead saw '=='.","BinaryExpression","unexpected","React Hook useCallback has an unnecessary dependency: 'data'. Either exclude it or remove the dependency array.",["158"],["159"],"Expected '!==' and instead saw '!='.","@typescript-eslint/no-redeclare","'ToastMessage' is already defined.","redeclared","React Hook useEffect has missing dependencies: 'id' and 'onRemove'. Either include them or remove the dependency array. If 'onRemove' changes too often, find the parent component that defines it and wrap that definition in useCallback.",["160"],["155"],["156"],"React Hook useEffect has a missing dependency: 'globalState'. Either include it or remove the dependency array.",["161"],"'SelectContext' is already defined.","React Hook useCallback has a missing dependency: 'handleSlect'. Either include it or remove the dependency array.",["162"],"React Hook useEffect has a missing dependency: 'onEvent'. Either include it or remove the dependency array. If 'onEvent' changes too often, find the parent component that defines it and wrap that definition in useCallback.",["163"],"no-global-assign","no-unsafe-negation",{"desc":"164","fix":"165"},{"desc":"166","fix":"167"},{"desc":"166","fix":"168"},{"desc":"169","fix":"170"},{"desc":"171","fix":"172"},{"desc":"173","fix":"174"},{"desc":"175","fix":"176"},"Update the dependencies array to be: [onDragEnter, onDragLeave, onDragOver, onDrop]",{"range":"177","text":"178"},"Update the dependencies array to be: [setData]",{"range":"179","text":"180"},{"range":"181","text":"180"},"Update the dependencies array to be: [id, lifetime, onRemove]",{"range":"182","text":"183"},"Update the dependencies array to be: [globalState, position]",{"range":"184","text":"185"},"Update the dependencies array to be: [handleSlect]",{"range":"186","text":"187"},"Update the dependencies array to be: [onEvent, ref]",{"range":"188","text":"189"},[7063,7101],"[onDragEnter, onDragLeave, onDragOver, onDrop]",[2679,2694],"[setData]",[3225,3240],[1724,1734],"[id, lifetime, onRemove]",[1349,1359],"[globalState, position]",[1287,1289],"[handleSlect]",[445,450],"[onEvent, ref]"]