{"_id":"@alaaessam/custom-popup","_rev":"3-0f6874f56284d83596f368a556d79a46","name":"@alaaessam/custom-popup","dist-tags":{"latest":"1.0.1"},"versions":{"1.0.0":{"name":"@alaaessam/custom-popup","version":"1.0.0","main":"build/index.js","scripts":{"start":"node scripts/start.js","build":"node scripts/build.js","demo":"node scripts/demo.js","test":"node scripts/test.js"},"license":"MIT","dependencies":{},"devDependencies":{"@babel/core":"7.6.0","@svgr/webpack":"4.3.2","@typescript-eslint/eslint-plugin":"^2.2.0","@typescript-eslint/parser":"^2.2.0","babel-eslint":"10.0.3","babel-jest":"^24.9.0","babel-loader":"8.0.6","babel-plugin-named-asset-import":"^0.3.4","babel-preset-react-app":"^9.0.2","camelcase":"^5.2.0","case-sensitive-paths-webpack-plugin":"2.2.0","css-loader":"2.1.1","dotenv":"6.2.0","dotenv-expand":"5.1.0","eslint":"^6.1.0","eslint-config-react-app":"^5.0.2","eslint-loader":"3.0.2","eslint-plugin-flowtype":"3.13.0","eslint-plugin-import":"2.18.2","eslint-plugin-jsx-a11y":"6.2.3","eslint-plugin-react":"7.14.3","eslint-plugin-react-hooks":"^1.6.1","file-loader":"3.0.1","fs-extra":"7.0.1","html-webpack-plugin":"4.0.0-beta.5","identity-obj-proxy":"3.0.0","is-wsl":"^1.1.0","jest":"24.9.0","jest-environment-jsdom-fourteen":"0.1.0","jest-resolve":"24.9.0","jest-watch-typeahead":"0.4.0","mini-css-extract-plugin":"0.8.0","optimize-css-assets-webpack-plugin":"5.0.3","pnp-webpack-plugin":"1.5.0","postcss-flexbugs-fixes":"4.1.0","postcss-loader":"3.0.0","postcss-normalize":"7.0.1","postcss-preset-env":"6.7.0","postcss-safe-parser":"4.0.1","react":"^16.10.2","react-app-polyfill":"^1.0.4","react-dev-utils":"^9.1.0","react-dom":"^16.10.2","resolve":"1.12.0","resolve-url-loader":"3.1.0","sass-loader":"7.2.0","semver":"6.3.0","style-loader":"1.0.0","terser-webpack-plugin":"1.4.1","ts-pnp":"1.1.4","url-loader":"2.1.0","webpack":"4.41.0","webpack-dev-server":"3.2.1","webpack-manifest-plugin":"2.1.1","workbox-webpack-plugin":"4.3.1"},"eslintConfig":{"extends":"react-app"},"browserslist":{"production":[">0.2%","not dead","not op_mini all"],"development":["last 1 chrome version","last 1 firefox version","last 1 safari version"]},"jest":{"roots":["<rootDir>/src"],"collectCoverageFrom":["src/**/*.{js,jsx,ts,tsx}","!src/**/*.d.ts"],"setupFiles":["react-app-polyfill/jsdom"],"setupFilesAfterEnv":[],"testMatch":["<rootDir>/src/**/__tests__/**/*.{js,jsx,ts,tsx}","<rootDir>/src/**/*.{spec,test}.{js,jsx,ts,tsx}"],"testEnvironment":"jest-environment-jsdom-fourteen","transform":{"^.+\\.(js|jsx|ts|tsx)$":"<rootDir>/node_modules/babel-jest","^.+\\.css$":"<rootDir>/config/jest/cssTransform.js","^(?!.*\\.(js|jsx|ts|tsx|css|json)$)":"<rootDir>/config/jest/fileTransform.js"},"transformIgnorePatterns":["[/\\\\]node_modules[/\\\\].+\\.(js|jsx|ts|tsx)$","^.+\\.module\\.(css|sass|scss)$"],"modulePaths":[],"moduleNameMapper":{"^react-native$":"react-native-web","^.+\\.module\\.(css|sass|scss)$":"identity-obj-proxy"},"moduleFileExtensions":["web.js","js","web.ts","ts","web.tsx","tsx","json","web.jsx","jsx","node"],"watchPlugins":["jest-watch-typeahead/filename","jest-watch-typeahead/testname"]},"babel":{"presets":["react-app"]},"description":"This project was bootstrapped with [Create React Library](https://github.com/dimimikadze/create-react-library).","repository":{"type":"git","url":"git+https://github.com/Super3laa/Custom-PopUp.git"},"keywords":["PopUp","React","Customizable"],"author":{"name":"Alaa Essam"},"bugs":{"url":"https://github.com/Super3laa/Custom-PopUp/issues"},"homepage":"https://github.com/Super3laa/Custom-PopUp#readme","gitHead":"a9323eefe7573a0fe8e5afcc67bc76f6377819cd","_id":"@alaaessam/custom-popup@1.0.0","_nodeVersion":"12.18.2","_npmVersion":"6.14.5","dist":{"integrity":"sha512-gQOVaLRQDCia2Yyd1gb8lV2SFlWwEfAMrzNjS9K4kF98T/WGwn49Bkud1dEjmWi1lfqQ/btItOWZJi5aPZgq7g==","shasum":"4f957ef80d472c4866b1bb584219cb8d2f7b67ab","tarball":"https://registry.npmjs.org/@alaaessam/custom-popup/-/custom-popup-1.0.0.tgz","fileCount":24,"unpackedSize":110152,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfQRHfCRA9TVsSAnZWagAAYUoQAIlhcFrxQzrDC2rQmjlY\ne11vOS4f9YMFyMXA2du6Zr+oBabl/FbcSN0rLk/kYPJG+v1RWwS+/tu5fd4W\nwhOtqunm+XU+P1tyvctxK3OboNKgwcPlCLRWH0QerREN0N868pY4RKyWVeVC\n2LU7O6IuT0UCU2mSmH000hAfjXi62tnMtf1mhqohjTP/nfLMe+L8eJAbWXjR\n1GIE0NlLr9n4a3MdJlFwtfSJwieKAnpEkVfbJ9+XvQv4aSRK4dLgp9ydpa6/\nXqvfT1NjC8zzgU4hDfIer4CNAVa762Brm7Sjmpr571/N8BbTdZwSV4gB4kIE\nfhREhzCbQrw6FiWGKe1Swo7VT4IppeoXQi5zCdmTQS2OXErQ+65tb2//HtTv\nn4MZVviJBmi/0s5xYRCTU9iCHLYrDr8Ix/E0z/UwozRZEYHXgp0ng+XlaSXM\nljVfPTxQsXeysa5cRqeOoNRIASdEKGa/gySnQtYRaQEJTO6zPxJRbEBSPA+L\nFuHkjXC6IckYgJ5BMGOhTC7X60iNhq7gL0s6+LuHZQmAp6LoP2KAl9kTj0te\nx1oJzSrKekVklb5TPNmcC3C+hiXR+w/234WB0u/UPdAhx56UZoKDroKFs6lc\nYLB+4Ju21DtzUbCD03RkOdJadN37HrpucGLkseuXxH1+kH8TiCT0UMUD+oII\nleBu\r\n=3H/x\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEY/Vv2U1RuJnk1pZoViGgV1r9vsHRnB9TAJK9yxRIUnAiEA+L4vXhcHP4HzCSI50ZvkrRcac69xwPK7PNUJRQsqRx8="}]},"maintainers":[{"name":"superalaa","email":"AlaaEssam2706@gmail.com"}],"_npmUser":{"name":"superalaa","email":"AlaaEssam2706@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/custom-popup_1.0.0_1598099934676_0.7866229451435278"},"_hasShrinkwrap":false},"0.1.0":{"name":"@alaaessam/custom-popup","version":"0.1.0","main":"build/index.js","scripts":{"start":"node scripts/start.js","build":"node scripts/build.js","demo":"node scripts/demo.js","test":"node scripts/test.js"},"license":"MIT","dependencies":{},"devDependencies":{"@babel/core":"7.6.0","@svgr/webpack":"4.3.2","@typescript-eslint/eslint-plugin":"^2.2.0","@typescript-eslint/parser":"^2.2.0","babel-eslint":"10.0.3","babel-jest":"^24.9.0","babel-loader":"8.0.6","babel-plugin-named-asset-import":"^0.3.4","babel-preset-react-app":"^9.0.2","camelcase":"^5.2.0","case-sensitive-paths-webpack-plugin":"2.2.0","css-loader":"2.1.1","dotenv":"6.2.0","dotenv-expand":"5.1.0","eslint":"^6.1.0","eslint-config-react-app":"^5.0.2","eslint-loader":"3.0.2","eslint-plugin-flowtype":"3.13.0","eslint-plugin-import":"2.18.2","eslint-plugin-jsx-a11y":"6.2.3","eslint-plugin-react":"7.14.3","eslint-plugin-react-hooks":"^1.6.1","file-loader":"3.0.1","fs-extra":"7.0.1","html-webpack-plugin":"4.0.0-beta.5","identity-obj-proxy":"3.0.0","is-wsl":"^1.1.0","jest":"24.9.0","jest-environment-jsdom-fourteen":"0.1.0","jest-resolve":"24.9.0","jest-watch-typeahead":"0.4.0","mini-css-extract-plugin":"0.8.0","optimize-css-assets-webpack-plugin":"5.0.3","pnp-webpack-plugin":"1.5.0","postcss-flexbugs-fixes":"4.1.0","postcss-loader":"3.0.0","postcss-normalize":"7.0.1","postcss-preset-env":"6.7.0","postcss-safe-parser":"4.0.1","react":"^16.10.2","react-app-polyfill":"^1.0.4","react-dev-utils":"^9.1.0","react-dom":"^16.10.2","resolve":"1.12.0","resolve-url-loader":"3.1.0","sass-loader":"7.2.0","semver":"6.3.0","style-loader":"1.0.0","terser-webpack-plugin":"1.4.1","ts-pnp":"1.1.4","url-loader":"2.1.0","webpack":"4.41.0","webpack-dev-server":"3.2.1","webpack-manifest-plugin":"2.1.1","workbox-webpack-plugin":"4.3.1"},"eslintConfig":{"extends":"react-app"},"browserslist":{"production":[">0.2%","not dead","not op_mini all"],"development":["last 1 chrome version","last 1 firefox version","last 1 safari version"]},"jest":{"roots":["<rootDir>/src"],"collectCoverageFrom":["src/**/*.{js,jsx,ts,tsx}","!src/**/*.d.ts"],"setupFiles":["react-app-polyfill/jsdom"],"setupFilesAfterEnv":[],"testMatch":["<rootDir>/src/**/__tests__/**/*.{js,jsx,ts,tsx}","<rootDir>/src/**/*.{spec,test}.{js,jsx,ts,tsx}"],"testEnvironment":"jest-environment-jsdom-fourteen","transform":{"^.+\\.(js|jsx|ts|tsx)$":"<rootDir>/node_modules/babel-jest","^.+\\.css$":"<rootDir>/config/jest/cssTransform.js","^(?!.*\\.(js|jsx|ts|tsx|css|json)$)":"<rootDir>/config/jest/fileTransform.js"},"transformIgnorePatterns":["[/\\\\]node_modules[/\\\\].+\\.(js|jsx|ts|tsx)$","^.+\\.module\\.(css|sass|scss)$"],"modulePaths":[],"moduleNameMapper":{"^react-native$":"react-native-web","^.+\\.module\\.(css|sass|scss)$":"identity-obj-proxy"},"moduleFileExtensions":["web.js","js","web.ts","ts","web.tsx","tsx","json","web.jsx","jsx","node"],"watchPlugins":["jest-watch-typeahead/filename","jest-watch-typeahead/testname"]},"babel":{"presets":["react-app"]},"description":"This project was bootstrapped with [Create React Library](https://github.com/dimimikadze/create-react-library).","repository":{"type":"git","url":"git+https://github.com/Super3laa/Custom-PopUp.git"},"keywords":["PopUp","React","Customizable"],"author":{"name":"Alaa Essam"},"bugs":{"url":"https://github.com/Super3laa/Custom-PopUp/issues"},"homepage":"https://github.com/Super3laa/Custom-PopUp#readme","gitHead":"ceb3c37b28d9cfd50028c662f38a944a7eb5ad17","_id":"@alaaessam/custom-popup@0.1.0","_nodeVersion":"12.18.2","_npmVersion":"6.14.5","dist":{"integrity":"sha512-A3AwTXPPQtr9qggN4qlZJe38f0tE5vWplOetzbSv4KVmCLts1OnnQhJMNPcuGMzXHONXjuKEDewPWn0nGwQ6LQ==","shasum":"1b206b78a53f70d82fcee986c817f84ec94fd080","tarball":"https://registry.npmjs.org/@alaaessam/custom-popup/-/custom-popup-0.1.0.tgz","fileCount":24,"unpackedSize":112280,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfQTtiCRA9TVsSAnZWagAAV/AP/RwssK/seSBKRCsCK0/R\n1iF49dQyx+jrBGd53zzqSuZoJbnBfSgD3cH8kJeyxa8hw9DQkqRalkdSPyxY\njxxEVMT/k+Z6nuISgdRyrQVY0b6mqv8gpDUO7cqdVFlGxG1iWgv5PQKN8mxQ\n9v38A58sIoBDxk7ZZzsXkk1+5mgZNPdW4FOoh36geKm628aBSFdIhSSpqipG\nXeOPLlACBGVA0htBBOIqVMdFlqdBziKaGPh3JsyeojwKOBa3GAZJReHt1krA\nLm99VmRWYQM/Az8WuGfuIu1vZsdJLh5RN15gfVE5kxovCYFsg9AKx+rJIxA0\naDkiEjGpw0wG/TmC0XPmWpIJsr6eqsO7vktelP3ycLMeUEqbBeCGKiQxnVRE\nKc9H6UfYOD0ACuDV3yLHJEl1mM/AjKxlkhRySJxh6Vb1keSQPqtN6tMhJEXE\njOxMQ63HxYw/AudEmMf4/tgsOuynBp6IoUZ5RVlM9+KoGmbzkgLinY3envI+\nL1CMxJwo8RVkodJjQs8DgzivRbnDULtdKmvAmnL43s0s3cJrwm7HV3L4BGon\n9KFo11y4AZdT4V5AAgjHES4B85EUDLc6Clh9+PzliBmML9Omc9aY1sXBaEAx\nHAfPMNaE2eG4kjOUjoj7bVrXzF2+PtZLQtYEC3u9nGNZcw02xT+dJF9gyDKF\nMh8s\r\n=KuAY\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIC710f7e9NRGDfvjm8NbfHDlv9n4osMnnm06deXzKUGTAiEAuyo8/KecwyyFT/SbvwRgacQSa/TdYwbqmjIr2KpWApk="}]},"maintainers":[{"name":"superalaa","email":"AlaaEssam2706@gmail.com"}],"_npmUser":{"name":"superalaa","email":"AlaaEssam2706@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/custom-popup_0.1.0_1598110561625_0.3660920655969859"},"_hasShrinkwrap":false},"1.0.1":{"name":"@alaaessam/custom-popup","version":"1.0.1","main":"build/index.js","scripts":{"start":"node scripts/start.js","build":"node scripts/build.js","demo":"node scripts/demo.js","test":"node scripts/test.js"},"license":"MIT","dependencies":{},"devDependencies":{"@babel/core":"7.6.0","@svgr/webpack":"4.3.2","@typescript-eslint/eslint-plugin":"^2.2.0","@typescript-eslint/parser":"^2.2.0","babel-eslint":"10.0.3","babel-jest":"^24.9.0","babel-loader":"8.0.6","babel-plugin-named-asset-import":"^0.3.4","babel-preset-react-app":"^9.0.2","camelcase":"^5.2.0","case-sensitive-paths-webpack-plugin":"2.2.0","css-loader":"2.1.1","dotenv":"6.2.0","dotenv-expand":"5.1.0","eslint":"^6.1.0","eslint-config-react-app":"^5.0.2","eslint-loader":"3.0.2","eslint-plugin-flowtype":"3.13.0","eslint-plugin-import":"2.18.2","eslint-plugin-jsx-a11y":"6.2.3","eslint-plugin-react":"7.14.3","eslint-plugin-react-hooks":"^1.6.1","file-loader":"3.0.1","fs-extra":"7.0.1","html-webpack-plugin":"4.0.0-beta.5","identity-obj-proxy":"3.0.0","is-wsl":"^1.1.0","jest":"24.9.0","jest-environment-jsdom-fourteen":"0.1.0","jest-resolve":"24.9.0","jest-watch-typeahead":"0.4.0","mini-css-extract-plugin":"0.8.0","optimize-css-assets-webpack-plugin":"5.0.3","pnp-webpack-plugin":"1.5.0","postcss-flexbugs-fixes":"4.1.0","postcss-loader":"3.0.0","postcss-normalize":"7.0.1","postcss-preset-env":"6.7.0","postcss-safe-parser":"4.0.1","react":"^16.10.2","react-app-polyfill":"^1.0.4","react-dev-utils":"^9.1.0","react-dom":"^16.10.2","resolve":"1.12.0","resolve-url-loader":"3.1.0","sass-loader":"7.2.0","semver":"6.3.0","style-loader":"1.0.0","terser-webpack-plugin":"1.4.1","ts-pnp":"1.1.4","url-loader":"2.1.0","webpack":"4.41.0","webpack-dev-server":"3.2.1","webpack-manifest-plugin":"2.1.1","workbox-webpack-plugin":"4.3.1"},"eslintConfig":{"extends":"react-app"},"browserslist":{"production":[">0.2%","not dead","not op_mini all"],"development":["last 1 chrome version","last 1 firefox version","last 1 safari version"]},"jest":{"roots":["<rootDir>/src"],"collectCoverageFrom":["src/**/*.{js,jsx,ts,tsx}","!src/**/*.d.ts"],"setupFiles":["react-app-polyfill/jsdom"],"setupFilesAfterEnv":[],"testMatch":["<rootDir>/src/**/__tests__/**/*.{js,jsx,ts,tsx}","<rootDir>/src/**/*.{spec,test}.{js,jsx,ts,tsx}"],"testEnvironment":"jest-environment-jsdom-fourteen","transform":{"^.+\\.(js|jsx|ts|tsx)$":"<rootDir>/node_modules/babel-jest","^.+\\.css$":"<rootDir>/config/jest/cssTransform.js","^(?!.*\\.(js|jsx|ts|tsx|css|json)$)":"<rootDir>/config/jest/fileTransform.js"},"transformIgnorePatterns":["[/\\\\]node_modules[/\\\\].+\\.(js|jsx|ts|tsx)$","^.+\\.module\\.(css|sass|scss)$"],"modulePaths":[],"moduleNameMapper":{"^react-native$":"react-native-web","^.+\\.module\\.(css|sass|scss)$":"identity-obj-proxy"},"moduleFileExtensions":["web.js","js","web.ts","ts","web.tsx","tsx","json","web.jsx","jsx","node"],"watchPlugins":["jest-watch-typeahead/filename","jest-watch-typeahead/testname"]},"babel":{"presets":["react-app"]},"description":"This project was bootstrapped with [Create React Library](https://github.com/dimimikadze/create-react-library).","repository":{"type":"git","url":"git+https://github.com/Super3laa/Custom-PopUp.git"},"keywords":["PopUp","React","Customizable"],"author":{"name":"Alaa Essam"},"bugs":{"url":"https://github.com/Super3laa/Custom-PopUp/issues"},"homepage":"https://github.com/Super3laa/Custom-PopUp#readme","gitHead":"2bf19b210850268b0656a96618f375153530d791","_id":"@alaaessam/custom-popup@1.0.1","_nodeVersion":"12.18.2","_npmVersion":"6.14.5","dist":{"integrity":"sha512-kmkw2RZvkmDHyN/krBe0pVXtpddWTSWk3oWIenWzwwh/jxEbz9+J3LjqWTfJdb26Xor6F5gBvIJ6MLfVCLM73g==","shasum":"cda47e6d534d56a5a497452d5484ee315a3f0f0c","tarball":"https://registry.npmjs.org/@alaaessam/custom-popup/-/custom-popup-1.0.1.tgz","fileCount":24,"unpackedSize":112290,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfQTzYCRA9TVsSAnZWagAABToP/RA+4J33kc1al8HW3J9o\nsRLdd0zvbcYbGDkYnpa7YK28qi8pjnwcZbaIDajZZ3AYdBGQs0uAzGPkfvmH\n0mwREYkS7NfXmpYgs7/QcsxXi3EmMgyI0ZZzDBwU4BHWpNZKz4VUic0BF4w7\n+7JERiYwt3CTjlk6CUfk4wzabv5gYRnDgbbvyfBc2PDTe+7n2HfN0rTRU7ki\nod1IgLxoiUiWj0pS7cNnYecOBP6xbf6CYUDH30BGs+qOA5UaciFtJVva8m1A\nuXvMCh0rIBm6j3oxXdyCGRGnTPAcXY9xKGZP3fGyepNUqPJ5uXTngwyKcgd3\nIVVJAKuAbU2T28lWR+ZDxZvbvWqnCSBGEa4p5vvK78Tq/8syv7I5JA0X/uEx\nQg6kA3TxX4EerA8qfvSVCoRJ1UDQju6hv7gRA6DKB/HOVb+z5CwHrNv5pe6m\nj2CUnKOOv82OjLbrKBUH459szh3bYNQiX0hs7inuYZnsuHQaMHGAwxDAfs0m\nzzZK3ijDbL8Y40ZPb5vk/5jWD6S4NLhPr8bEGEWYi1EDLng83mSSeRxUezRG\nSWTBqobtwuiMkt4KzL69c7NYBZYGr3PZ/TZVuFmRvct0UvtGnvEli2aBHYbz\nQa5VbeOcQCxcr4xm2T4KUq1GKR5jsgb0UqLnJOCUeYqk7WZAw/R6aRjfDjmh\nQjxs\r\n=4XhH\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIH2FrzK5YRVO3k0RNcZkRQfUpdr0KYxMlL9tfn1AUKPcAiEA14ilITvl0qawhuQExzVbL98vv/WoZ6jH/kJLKDtaVew="}]},"maintainers":[{"name":"superalaa","email":"AlaaEssam2706@gmail.com"}],"_npmUser":{"name":"superalaa","email":"AlaaEssam2706@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/custom-popup_1.0.1_1598110936582_0.3252926467787294"},"_hasShrinkwrap":false}},"time":{"created":"2020-08-22T12:38:54.423Z","1.0.0":"2020-08-22T12:38:54.787Z","modified":"2022-04-04T12:32:37.233Z","0.1.0":"2020-08-22T15:36:01.848Z","1.0.1":"2020-08-22T15:42:16.712Z"},"maintainers":[{"name":"superalaa","email":"AlaaEssam2706@gmail.com"}],"description":"This project was bootstrapped with [Create React Library](https://github.com/dimimikadze/create-react-library).","homepage":"https://github.com/Super3laa/Custom-PopUp#readme","keywords":["PopUp","React","Customizable"],"repository":{"type":"git","url":"git+https://github.com/Super3laa/Custom-PopUp.git"},"author":{"name":"Alaa Essam"},"bugs":{"url":"https://github.com/Super3laa/Custom-PopUp/issues"},"license":"MIT","readme":"# Custom PopUp\nWanna Easy PopUp Form Responsive for Creating and Updating your database,\nVoila you're in the right place.\n##\n![Mob](https://imgur.com/sLDfkj2.png)\n##\n![Web](https://media.giphy.com/media/f8tbIN8CHVhDC3H6tf/giphy.gif)\n##\n# How it works ?\n### Installation\ninstall the package\n```sh\n$ npm i @alaaessam/custom-popup\n```\nimport the package to your desiered page\n```javascript\nimport PopUp from '@alaaessam/custom-popup';\n```\nIn Order to make the component work we're gonna do a simple react hook State Mangement to display the form or not see the code below if you want to add a user to your users database\n```javascript\nimport PopUp from '@alaaessam/custom-popup';\nexport default function Users(){\n    {< /* We will toggle newUser to Show/Hide the form*/>}\n    const[newUser,toggleNewUser]=useState(false);\n     return(\n        <React.Fragment>\n        {< /*action goes down here by default we want the form to be closed*/>}\n            {\n                newUser?<PopUp\n                /*Here we will add the inputs,\n                buttons and primaryStyle */\n                />:null\n            }\n            {< /*a Button for adding a New User\n            and toggling the Form state*/>}\n            <button \n            onClick={()=>{toggleNewUser(!newUser);}\n            >Add User</button>\n            //Some other Components in your code\n        </React.Fragment>\n    );\n}\n```\nnow if you try the code above you will get a blank pop up so that means it's working..\nlet's dive in how to populate the form, it's pretty simple.\n\n>From the above example we need inputs for the following:\n>username ,password ,email and permission all should be required you cant submit the form without filling them \n>two button for submit and cancel\n\nFor the inputs we need an array of objects like this\n```javascript\nconst newUserInputs= [{\n        title:\"username\",\n        type: \"text\",\n        required:true,\n        props:{\n            placeholder: \"username\",\n        }\n    },{\n        title:\"password\",\n        type: \"password\",\n        required:true,\n        props:{\n            placeholder: \"Password\",\n        }\n    },{\n        title:\"email\",\n        type: \"email\",\n        required:true,\n        props:{\n            placeholder: \"E-mail address\",\n        }\n    },]\n```\nand selectors for permissions\n```javascript\n  const newUserSelectors=[{\n        title:\"permissions\",\n        options:[{value:'admin',label:\"Admin\"},{value:'secretery',label:\"Secretery\"}],\n        props:{\n\n        }\n    }]\n```\nand two buttons with each button pass the required function\n```javascript\n const newUserButtons=[\n        {\n            name:\"Submit\",\n            backgroundColor:\"#ff4e50\",\n            action:(data)=>{handleNewUser(data)}\n        }, \n        {\n            name:\"Cancel\",\n            backgroundColor:\"#4a4a4a\",\n            action:()=>{toggleNewUser(!newUser)},\n            exitButton:true\n        }\n    ]\n```\nthe component should look like this and we are good to go\n```javascript\n<PopUp \n    content={userInput}\n    selectors={SelectorsUser}\n    buttons={userButtons}\n    primaryColor=\"#ff4e50\"\n/>\n```\nand for auto populate\nmake sure dataValues are a JSON Object with same name of your input and selector \n```javascript\n<PopUp \n    content={userInput}\n    selectors={SelectorsUser}\n    buttons={userButtons}\n    dataValues={editUserDataValues}\n    populateDataValues={true}\n    primaryColor=\"#ff4e50\"\n/>\n```\nWhen Submitting the Form the function that's passed to the submit button will get params as a JSON Object holding all info about the form.\n\nWaiting for you FeedBack for more fearures\n![Web](https://media.giphy.com/media/pzvUEkOeAViy7VS7B6/giphy.gif)","readmeFilename":"README.md"}