{"_id":"@abr-ya/lib-travel-kit-demo","_rev":"1-92f9ccdd5952ba64eaea57dc5ab5825f","name":"@abr-ya/lib-travel-kit-demo","dist-tags":{"latest":"0.1.1"},"versions":{"0.1.1":{"name":"@abr-ya/lib-travel-kit-demo","author":{"name":"abr-ya"},"version":"0.1.1","license":"MIT","private":false,"main":"dist/index.js","typings":"dist/index.d.ts","engines":{"node":">=12.13"},"module":"dist/lib-travel-kit-demo.esm.js","size-limit":[{"path":"dist/lib-travel-kit-demo.cjs.production.min.js","limit":"10 KB"},{"path":"dist/lib-travel-kit-demo.esm.js","limit":"10 KB"}],"scripts":{"start":"tsdx watch","build":"NODE_ENV=production tsdx build","test":"tsdx test","lint":"tsdx lint","prepare":"tsdx build","size":"size-limit","analyze":"size-limit --why","storybook":"start-storybook -p 6006","build-storybook":"build-storybook","build:css":"postcss ./src/styles/tailwind.css build -o css/tailwind.dist.css --minify","pub":"npm publish --access=public"},"peerDependencies":{"react":"17.0.1","react-dom":"17.0.1"},"devDependencies":{"@babel/core":"7.12.13","@headlessui/react":"1.4.1","@fontsource/inter":"4.5.0","@size-limit/preset-small-lib":"4.9.2","@storybook/addon-a11y":"6.3.12","@storybook/addon-essentials":"6.3.12","@storybook/addon-info":"5.3.21","@storybook/addon-links":"6.3.12","@storybook/addons":"6.3.12","@storybook/react":"6.3.12","@tailwindcss/forms":"0.3.4","@tailwindcss/postcss7-compat":"2.0.3","@testing-library/jest-dom":"5.11.9","@testing-library/react":"11.2.5","@testing-library/react-hooks":"7.0.2","@types/react":"17.0.1","@types/react-dom":"17.0.0","autoprefixer":"9","babel-jest":"27.3.1","babel-loader":"8.2.2","classnames":"2.3.1","postcss":"7","prettier":"2.4.1","react-headless-pagination":"0.1.0","react-icons":"4.3.1","react-is":"17.0.1","size-limit":"4.9.2","storybook-addon-designs":"6.2.0","tailwindcss":"npm:@tailwindcss/postcss7-compat","tailwindcss-breakpoints-inscpector":"1.0.0","tsdx":"0.14.1","typescript":"4.1.3"},"description":"- React\r - Typescript\r - StoryBook\r - TailwindCSS\r - Figma\r - TSDX","_id":"@abr-ya/lib-travel-kit-demo@0.1.1","_nodeVersion":"16.13.0","_npmVersion":"8.1.0","dist":{"integrity":"sha512-gAji0ps9g7x7p1f4K+3EzVKsZJFMBof2TuHE8eyN9wMRkbHm9Rmji8zIJUbXoGwk6jz3V2HqllHMMD3j8yOO8w==","shasum":"fe40c2d689b04b880daf351a3daacdbfe854865f","tarball":"https://registry.npmjs.org/@abr-ya/lib-travel-kit-demo/-/lib-travel-kit-demo-0.1.1.tgz","fileCount":40,"unpackedSize":380528,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhqiEJCRA9TVsSAnZWagAAoxEP/16FfeDe0v3V+FPyjpJi\nnNpIV53FDhtlVGj1RF9h0WrhhvvwOfo5SZKd1hG9dZ5dPAzSPU4g6aV8dzye\nOVubpYlNyGydBQtFVdVGZB92NefKNoFbCo35m2FvucEl8EcZZEqpDvk2M130\nl7DtqXDVeXZtQSziX7YmhRnPJMjKsNOxZGPEzmEtKM2Kn06JwwdMfb5QL9Tl\n/BSYsmKcSi4wSON+I5xM75EZBgl3eq8EIWFl1vCo3jBb43qHpKk3Vyz9WKbX\nkttTbh59jti5x2koVNiYYupgenlFARdvAsnGqZmVT20QMTB0ihUdMFCTz85F\nsnhMoWMQveX1Ru0J6h5GhGfDuWk8q1JcADavcN+2pUpTqNgGFlSVrsL3x9jS\nklhEai9BmavIraq+nKV0g/VB7CyuHvww/FgMfYEhedBJZjkce1nRCNYOhEiU\nT1tcf6GkT+hsU7TnyHAGl/+83CkI7KQmWA3WnJemvcludQ+1dNRWD5fXndBz\n3/vkAd1c1k6mDCdr1pdNI4pkxSHTtilKfM3VMVzqnMFRLXI/y24DEkAtzxMG\nnSb9+f2T26+oYJ4EBgwf5qRUsQA+e5OxAPamnEpL6P0/EenM/Ahu5H4gKQ+4\nIhWmuIoodfuLjsUSDXqbDgWzNgRrzJdY2qSVhFpONkBOm12436zL+3XnWXkF\nEuXz\r\n=6imT\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDYUAfnidGx784QLXuR1Y3QtQecIdGsMnHRJf8Ccc3LegIhAK9uumeklYfZ+HagC0orLmm+vxsiz/wVEw1qhuSVEnZq"}]},"_npmUser":{"name":"abr-ya","email":"a.ya.coder@gmail.com"},"directories":{},"maintainers":[{"name":"abr-ya","email":"a.ya.coder@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/lib-travel-kit-demo_0.1.1_1638539529748_0.88476001561437"},"_hasShrinkwrap":false}},"time":{"created":"2021-12-03T13:52:09.696Z","0.1.1":"2021-12-03T13:52:09.892Z","modified":"2022-04-04T11:01:35.185Z"},"maintainers":[{"name":"abr-ya","email":"a.ya.coder@gmail.com"}],"description":"- React\r - Typescript\r - StoryBook\r - TailwindCSS\r - Figma\r - TSDX","author":{"name":"abr-ya"},"license":"MIT","readme":"# Demo Travel UI-kit\r\n- React\r\n- Typescript\r\n- StoryBook\r\n- TailwindCSS\r\n- Figma\r\n- TSDX\r\n\r\n## Custom installation instructions\r\n\r\nFirst we use tsdx to setup our react + storybook.\r\n\r\n```\r\nnpx tsdx create courseStorybook\r\nyarn add -D tailwindcss@npm:@tailwindcss/postcss7-compat @tailwindcss/postcss7-compat postcss@^7 autoprefixer@^9\r\n```\r\n\r\nIf you get the error (\"Received malformed response from registry for undefined. The registry may be down.\") in the preceding step try\r\n\r\n```\r\nnpm install -D tailwindcss@npm:@tailwindcss/postcss7-compat @tailwindcss/postcss7-compat postcss@^7 autoprefixer@^9\r\n```\r\n\r\nNow we can initialize TailwindCSS in our project\r\n\r\n```\r\nnpx tailwindcss init\r\n```\r\n\r\nCreate tsdx.config.js in root\r\n\r\n```\r\n// tsdx.config.js\r\n\r\nmodule.exports = {\r\n  rollup(config, options) {\r\n    options.env = \"production\";\r\n\r\n    return config;\r\n  },\r\n};\r\n\r\n```\r\n\r\nCreate tailwind.css in /src\r\n\r\n```\r\n// src/tailwind.css\r\n\r\n@tailwind base;\r\n@tailwind components;\r\n@tailwind utilities;\r\n```\r\n\r\nIn index.tsx\r\n\r\n```\r\nimport './tailwind.css`;\r\n```\r\n\r\nFinally, check which packages you are missing and need to be installed (go through the package.json).\r\n\r\n## Commands\r\n\r\n### build:css\r\n\r\n- Install postcss globally: npm install postcss-cli -g\r\n  Then run yarn build:css\r\n\r\nTSDX scaffolds your new library inside `/src`, and also sets up a [Parcel-based](https://parceljs.org) playground for it inside `/example`.\r\n\r\nThe recommended workflow is to run TSDX in one terminal:\r\n\r\n```bash\r\nnpm start # or yarn start\r\n```\r\n\r\nThis builds to `/dist` and runs the project in watch mode so any edits you save inside `src` causes a rebuild to `/dist`.\r\n\r\nThen run either Storybook or the example playground:\r\n\r\n### Storybook\r\n\r\nRun inside another terminal:\r\n\r\n```bash\r\nyarn storybook\r\n```\r\n\r\nThis loads the stories from `./stories`.\r\n\r\n> NOTE: Stories should reference the components as if using the library, similar to the example playground. This means importing from the root project directory. This has been aliased in the tsconfig and the storybook webpack config as a helper.\r\n\r\n### Example\r\n\r\nThen run the example inside another:\r\n\r\n```bash\r\ncd example\r\nnpm i # or yarn to install dependencies\r\nnpm start # or yarn start\r\n```\r\n\r\nThe default example imports and live reloads whatever is in `/dist`, so if you are seeing an out of date component, make sure TSDX is running in watch mode like we recommend above. **No symlinking required**, we use [Parcel's aliasing](https://parceljs.org/module_resolution.html#aliases).\r\n\r\nTo do a one-off build, use `npm run build` or `yarn build`.\r\n\r\nTo run tests, use `npm test` or `yarn test`.\r\n\r\n## Configuration\r\n\r\nCode quality is set up for you with `prettier`, `husky`, and `lint-staged`. Adjust the respective fields in `package.json` accordingly.\r\n\r\n### Jest\r\n\r\nJest tests are set up to run with `npm test` or `yarn test`.\r\n\r\n### Bundle analysis\r\n\r\nCalculates the real cost of your library using [size-limit](https://github.com/ai/size-limit) with `npm run size` and visulize it with `npm run analyze`.\r\n\r\n## Continuous Integration\r\n\r\n### GitHub Actions\r\n\r\nTwo actions are added by default:\r\n\r\n- `main` which installs deps w/ cache, lints, tests, and builds on all pushes against a Node and OS matrix\r\n- `size` which comments cost comparison of your library on every pull request using [size-limit](https://github.com/ai/size-limit)\r\n\r\n## Named Exports\r\n\r\nPer Palmer Group guidelines, [always use named exports.](https://github.com/palmerhq/typescript#exports) Code split inside your React app instead of your React library.\r\n\r\n## Including Styles\r\n\r\nThere are many ways to ship styles, including with CSS-in-JS. TSDX has no opinion on this, configure how you like.\r\n\r\nFor vanilla CSS, you can include it at the root directory and add it to the `files` section in your `package.json`, so that it can be imported separately by your users and run through their bundler's loader.\r\n\r\n## Publishing to NPM\r\n\r\nWe recommend using [np](https://github.com/sindresorhus/np).\r\n\r\n[TSDX Docs](https://tsdx.io/).\r\n","readmeFilename":"README.md"}