{"_id":"@dfnc/grapesjs-tailwind","_rev":"6-94293405cfe4834091970fd6a332d63b","name":"@dfnc/grapesjs-tailwind","dist-tags":{"latest":"0.0.9"},"versions":{"0.0.0":{"name":"@dfnc/grapesjs-tailwind","version":"0.0.0","description":"Grapesjs Tailwind","main":"dist/grapesjs-tailwind.min.js","scripts":{"start":"grapesjs-cli serve","build":"grapesjs-cli build","bump":"npm version patch -m 'Bump v%s'"},"keywords":["grapesjs","plugin"],"devDependencies":{"grapesjs-cli":"^4.1.3"},"license":"MIT","dependencies":{"css":"^3.0.0"},"_id":"@dfnc/grapesjs-tailwind@0.0.0","gitHead":"6b7909864a330845292694df07ab6b4fa1d4050f","_nodeVersion":"20.11.1","_npmVersion":"10.2.4","dist":{"integrity":"sha512-nGiZoFzRar8KpjaSWkk2NVo+B2Em3+Dzu+0ZAZYaABLwAsTHsHeSk4Eg84UUEFL5ckacWL3H/sB1InS6uUq50g==","shasum":"ac8923a2673fe76e50591cb249e6172fd6925d4a","tarball":"https://registry.npmjs.org/@dfnc/grapesjs-tailwind/-/grapesjs-tailwind-0.0.0.tgz","fileCount":9,"unpackedSize":1368857,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIB67jdtY1B2wgxIBvxMEqwbeZDaQmREMu95vyhcEpaN5AiArwhFiHbAS25HLnbfebhKWF9b4OgPCS90/v3vfLcXszg=="}]},"_npmUser":{"name":"thodinh.sg","email":"d.tr.tho@gmail.com"},"directories":{},"maintainers":[{"name":"thodinh.sg","email":"d.tr.tho@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/grapesjs-tailwind_0.0.0_1709051424710_0.9900687156934498"},"_hasShrinkwrap":false},"0.0.3":{"name":"@dfnc/grapesjs-tailwind","version":"0.0.3","description":"Grapesjs Tailwind","main":"dist/grapesjs-tailwind.min.js","scripts":{"start":"grapesjs-cli serve","build":"grapesjs-cli build","bump":"npm version patch -m 'Bump v%s'"},"keywords":["grapesjs","plugin"],"devDependencies":{"grapesjs-cli":"^4.1.3"},"license":"MIT","dependencies":{"css":"^3.0.0"},"_id":"@dfnc/grapesjs-tailwind@0.0.3","gitHead":"6b7909864a330845292694df07ab6b4fa1d4050f","_nodeVersion":"20.11.1","_npmVersion":"10.2.4","dist":{"integrity":"sha512-nS+R3V2kIcprYr3F0qpnbB7x7xU512BKz+mZ06wMnVAdErZW3f330LKgqUBZN8DZi0rZTXLS0CD5ywO3XPeNcg==","shasum":"7959369aecfe81f59aac3bd0c35d4f4fa2a98b2d","tarball":"https://registry.npmjs.org/@dfnc/grapesjs-tailwind/-/grapesjs-tailwind-0.0.3.tgz","fileCount":7,"unpackedSize":685940,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICMtUPzFvStAhmYb0GHnz5xJ8J38TnxSirRaYjSRdw/YAiEAs77RQA7ELoH9Mc3Ax11MVZE1aqCCEnJmOR2nNX8ZO3o="}]},"_npmUser":{"name":"thodinh.sg","email":"d.tr.tho@gmail.com"},"directories":{},"maintainers":[{"name":"thodinh.sg","email":"d.tr.tho@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/grapesjs-tailwind_0.0.3_1709055842720_0.5398621573739797"},"_hasShrinkwrap":false},"0.0.4":{"name":"@dfnc/grapesjs-tailwind","version":"0.0.4","description":"Grapesjs Tailwind","main":"dist/index.js","scripts":{"start":"grapesjs-cli serve","build":"grapesjs-cli build","bump":"npm version patch -m 'Bump v%s'"},"keywords":["grapesjs","plugin"],"devDependencies":{"grapesjs-cli":"^4.1.3"},"license":"MIT","dependencies":{"css":"^3.0.0"},"_id":"@dfnc/grapesjs-tailwind@0.0.4","gitHead":"6b7909864a330845292694df07ab6b4fa1d4050f","_nodeVersion":"20.11.1","_npmVersion":"10.2.4","dist":{"integrity":"sha512-RXVddjkAVPMbj20M3s06pF+zgm3ZH3Q5lUXLkMzVf97mEnupWF4Szl4JmpIekXjFZV9fpOVZaNNpW8U40fRv3Q==","shasum":"3545a080990b1c717e23e4ff13edf6564bbf1ee6","tarball":"https://registry.npmjs.org/@dfnc/grapesjs-tailwind/-/grapesjs-tailwind-0.0.4.tgz","fileCount":7,"unpackedSize":685924,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEBWsABor7k1jXl/aIV407HyooLJ+9RQszi/QFSPbAu6AiBQ5jD4uH1xNn3p3aeB3K7QWLLufry4wPzoqiFSGI1zbQ=="}]},"_npmUser":{"name":"thodinh.sg","email":"d.tr.tho@gmail.com"},"directories":{},"maintainers":[{"name":"thodinh.sg","email":"d.tr.tho@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/grapesjs-tailwind_0.0.4_1709055923619_0.38739029469537"},"_hasShrinkwrap":false},"0.0.5":{"name":"@dfnc/grapesjs-tailwind","version":"0.0.5","description":"Grapesjs Tailwind","main":"dist/index.js","scripts":{"start":"grapesjs-cli serve","build":"grapesjs-cli build","bump":"npm version patch -m 'Bump v%s'"},"keywords":["grapesjs","plugin"],"devDependencies":{"grapesjs-cli":"^4.1.3"},"license":"MIT","dependencies":{"css":"^3.0.0"},"_id":"@dfnc/grapesjs-tailwind@0.0.5","gitHead":"6b7909864a330845292694df07ab6b4fa1d4050f","_nodeVersion":"20.11.1","_npmVersion":"10.2.4","dist":{"integrity":"sha512-xHuuXh+gh7w2xWIqzHJEAcYAqb9wl1Ishd66xQ9yJKm4HvrlRyZbHUUNmMCfhR9s+5Jhmn8ngIXmMuwuyEPkqQ==","shasum":"9a9e4645c7c7c55ac483b5b85e62dccae3c0ab4c","tarball":"https://registry.npmjs.org/@dfnc/grapesjs-tailwind/-/grapesjs-tailwind-0.0.5.tgz","fileCount":7,"unpackedSize":596994,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFLb1HjNbjj9rj7j4P8bYOAf/PlkPfWWaUS4dB2xRShvAiEAhpmrXXVNPg1L58IMQeDEma5ph5Rd5QWewm/8aGGcwLs="}]},"_npmUser":{"name":"thodinh.sg","email":"d.tr.tho@gmail.com"},"directories":{},"maintainers":[{"name":"thodinh.sg","email":"d.tr.tho@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/grapesjs-tailwind_0.0.5_1709063125736_0.5498061479899792"},"_hasShrinkwrap":false},"0.0.7":{"name":"@dfnc/grapesjs-tailwind","version":"0.0.7","description":"Grapesjs Tailwind","main":"dist/index.js","scripts":{"start":"grapesjs-cli serve","build":"grapesjs-cli build","bump":"npm version patch -m 'Bump v%s'"},"keywords":["grapesjs","plugin"],"devDependencies":{"grapesjs-cli":"^4.1.3"},"license":"MIT","dependencies":{"css":"^3.0.0"},"_id":"@dfnc/grapesjs-tailwind@0.0.7","gitHead":"6b7909864a330845292694df07ab6b4fa1d4050f","_nodeVersion":"20.11.1","_npmVersion":"10.2.4","dist":{"integrity":"sha512-YjaYjHUHNJp24GgrPz49s9HI/ec0ZUn3Rox0Io/hv7wrBczK0HhYLQzyd2AHur77NxWiBCGcP1fA9gwDC77YIA==","shasum":"9a8288e560b64a18cbf830e3057b9dfd696ec066","tarball":"https://registry.npmjs.org/@dfnc/grapesjs-tailwind/-/grapesjs-tailwind-0.0.7.tgz","fileCount":7,"unpackedSize":841605,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIG81R+30XLbf9DrWpRf8HaqQgtg5kJSiPU4bdqefW5XXAiAztEKZtYY8Ei1dZmxtp/x7JjSHItrvNZAdJMLCcDmFLA=="}]},"_npmUser":{"name":"thodinh.sg","email":"d.tr.tho@gmail.com"},"directories":{},"maintainers":[{"name":"thodinh.sg","email":"d.tr.tho@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/grapesjs-tailwind_0.0.7_1709063755627_0.33144464046365485"},"_hasShrinkwrap":false},"0.0.8":{"name":"@dfnc/grapesjs-tailwind","version":"0.0.8","description":"Grapesjs Tailwind","main":"dist/index.js","scripts":{"start":"grapesjs-cli serve","build":"grapesjs-cli build","bump":"npm version patch -m 'Bump v%s'"},"keywords":["grapesjs","plugin"],"devDependencies":{"grapesjs-cli":"^4.1.3"},"license":"MIT","dependencies":{"css":"^3.0.0"},"_id":"@dfnc/grapesjs-tailwind@0.0.8","gitHead":"6b7909864a330845292694df07ab6b4fa1d4050f","_nodeVersion":"20.11.1","_npmVersion":"10.2.4","dist":{"integrity":"sha512-WkE2Mzqmrc7zbFSAe5Acxgal1NrnPSoaTju+afIrKo0Ym6cPYIkRvUP1G8DcQJkcdsXUvDvlNO+bMFZRSes/xQ==","shasum":"0d3d57f578d15dc78e42fc7d73dc72724f485c49","tarball":"https://registry.npmjs.org/@dfnc/grapesjs-tailwind/-/grapesjs-tailwind-0.0.8.tgz","fileCount":7,"unpackedSize":841279,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQD0vJ+llJuqBJl6Yp7Lm9fSdslgSylOlxen6B5xy9/I9AIhAOWMxj2wpKld7xJ9ko8csvaLeUMyZ37EmETgwl0Ux+6u"}]},"_npmUser":{"name":"thodinh.sg","email":"d.tr.tho@gmail.com"},"directories":{},"maintainers":[{"name":"thodinh.sg","email":"d.tr.tho@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/grapesjs-tailwind_0.0.8_1709063847300_0.38187545819515334"},"_hasShrinkwrap":false},"0.0.9":{"name":"@dfnc/grapesjs-tailwind","version":"0.0.9","description":"Grapesjs Tailwind","main":"dist/index.js","scripts":{"start":"grapesjs-cli serve","build":"grapesjs-cli build","bump":"npm version patch -m 'Bump v%s'"},"keywords":["grapesjs","plugin"],"devDependencies":{"grapesjs-cli":"^4.1.3"},"license":"MIT","dependencies":{"css":"^3.0.0"},"_id":"@dfnc/grapesjs-tailwind@0.0.9","gitHead":"6b7909864a330845292694df07ab6b4fa1d4050f","_nodeVersion":"20.11.1","_npmVersion":"10.2.4","dist":{"integrity":"sha512-2QjhYHjWnZrhXxdh4ScQu+F9E+PviJ3vPB01im88gv3dmN8uhQv+F5WiQdkB5OxO94dMfcoP2uQ48J7ECipjUA==","shasum":"0744798ed565a6bb6b41d1753153cc91eb504e30","tarball":"https://registry.npmjs.org/@dfnc/grapesjs-tailwind/-/grapesjs-tailwind-0.0.9.tgz","fileCount":7,"unpackedSize":841222,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFZFOJl2KA0XTHAbMHxGN1luXM1gJox/+6cZeEbYVAvbAiBh0RWwlNKJk+dAOH2HTxycWcyA0X9qRk0rs5KNyVs1HA=="}]},"_npmUser":{"name":"thodinh.sg","email":"d.tr.tho@gmail.com"},"directories":{},"maintainers":[{"name":"thodinh.sg","email":"d.tr.tho@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/grapesjs-tailwind_0.0.9_1709064156672_0.8216200529216915"},"_hasShrinkwrap":false}},"time":{"created":"2024-02-27T16:30:24.611Z","0.0.0":"2024-02-27T16:30:25.017Z","modified":"2024-02-27T20:02:37.405Z","0.0.3":"2024-02-27T17:44:02.889Z","0.0.4":"2024-02-27T17:45:23.814Z","0.0.5":"2024-02-27T19:45:25.909Z","0.0.7":"2024-02-27T19:55:55.785Z","0.0.8":"2024-02-27T19:57:27.476Z","0.0.9":"2024-02-27T20:02:36.943Z"},"maintainers":[{"name":"thodinh.sg","email":"d.tr.tho@gmail.com"}],"description":"Grapesjs Tailwind","keywords":["grapesjs","plugin"],"license":"MIT","readme":"# Grapesjs Tailwind(WIP)\n\n[DEMO](https://codepen.io/ju99ernaut/pen/BaKGadb)\n\n> Requires [`grapesjs-plugin-forms`](https://github.com/artf/grapesjs-plugin-forms)\n\nTailwind intergration which includes the complete set of blocks from [Tailblocks.cc](https://tailblocks.cc/), bases on [Destack](https://github.com/LiveDuo/destack).\n\n### HTML\n```html\n<link href=\"https://unpkg.com/grapesjs/dist/css/grapes.min.css\" rel=\"stylesheet\">\n<script src=\"https://unpkg.com/grapesjs\"></script>\n<script src=\"https://unpkg.com/grapesjs-tailwind\"></script>\n\n<div id=\"gjs\"></div>\n```\n\n### JS\n```js\n// Handle tailwind's use of slashes in css names\nconst escapeName = (name) => `${name}`.trim().replace(/([^a-z0-9\\w-:/]+)/gi, '-');\n\nconst editor = grapesjs.init({\n  container: '#gjs',\n  height: '100%',\n  fromElement: true,\n  storageManager: false,\n  selectorManager: { escapeName },\n  plugins: ['grapesjs-tailwind'],\n});\n```\n\n### CSS\n```css\nbody, html {\n  margin: 0;\n  height: 100%;\n}\n\n.change-theme-button {\n  width: 40px;\n  height: 40px;\n  border-radius: 50%;\n  margin: 5px;\n}\n\n.change-theme-button:focus {\n  /* background-color: yellow; */\n  outline: none;\n  box-shadow: 0 0 0 2pt #c5c5c575;\n}\n```\n\n### `Optional` CSS\n```css\n/* Make blocks full width */\n.gjs-block {\n    padding: 0 !important;\n    width: 100% !important;\n    min-height: auto !important;\n}\n\n/* Fit icons properly */\n.gjs-block svg {\n    width: 100%;\n}\n```\n\n\n## Summary\n\n* Plugin name: `grapesjs-tailwind`\n* Commands\n    * `get-tailwindCss` - Get Tailwind CSS of your page\n    * `open-update-theme` - Open theme modal\n\n### `get-tailwindCss` Usage\n\n```js\n// By default it will print css to console\neditor.runCommand('get-tailwindCss');\n\n// Using options\neditor.runCommand('get-tailwindCss', { /* Options here */ });\n```\n\n#### `get-tailwindCss` Options\n\n| Option | Description | Default |\n|-|-|-\n| `callback` | Calback for resulting css | `twcss => console.log(twcss)` |\n\n\n## Options\n\n| Option | Description | Default |\n|-|-|-\n| `tailwindPlayCdn` | URL for fetching tailwind play cdn | `https://cdn.tailwindcss.com` |\n| `plugins` | array to include tailwind 1st party plugins | `[]` |\n| `config` | custom tailwind config | `{}` |\n| `changeThemeText` | Change theme modal title | `Change Theme` |\n\n\n\n## Download\n\n* CDN\n  * `https://unpkg.com/grapesjs-tailwind`\n* NPM\n  * `npm i grapesjs-tailwind`\n* GIT\n  * `git clone https://github.com/Ju99ernaut/grapesjs-tailwind.git`\n\n\n\n## Usage\n\nDirectly in the browser\n```html\n<link href=\"https://unpkg.com/grapesjs/dist/css/grapes.min.css\" rel=\"stylesheet\"/>\n<script src=\"https://unpkg.com/grapesjs\"></script>\n<script src=\"path/to/grapesjs-tailwind.min.js\"></script>\n\n<div id=\"gjs\"></div>\n\n<script type=\"text/javascript\">\n  var editor = grapesjs.init({\n      container: '#gjs',\n      // ...\n      plugins: ['grapesjs-tailwind'],\n      pluginsOpts: {\n        'grapesjs-tailwind': { /* options */ }\n      }\n  });\n</script>\n```\n\nModern javascript\n```js\nimport grapesjs from 'grapesjs';\nimport plugin from 'grapesjs-tailwind';\nimport 'grapesjs/dist/css/grapes.min.css';\n\nconst editor = grapesjs.init({\n  container : '#gjs',\n  // ...\n  plugins: [plugin],\n  pluginsOpts: {\n    [plugin]: { /* options */ }\n  }\n  // or\n  plugins: [\n    editor => plugin(editor, { /* options */ }),\n  ],\n});\n```\n\n\n\n## Development\n\nClone the repository\n\n```sh\n$ git clone https://github.com/Ju99ernaut/grapesjs-tailwind.git\n$ cd grapesjs-tailwind\n```\n\nInstall dependencies\n\n```sh\n$ npm i\n```\n\nStart the dev server\n\n```sh\n$ npm start\n```\n\nBuild the source\n\n```sh\n$ npm run build\n```\n\n\n\n## License\n\nMIT\n","readmeFilename":"README.md"}