{"_id":"aspen-decorations","_rev":"5-c561226bd0f8780a8eb88c9046bac902","name":"aspen-decorations","dist-tags":{"latest":"1.1.1"},"versions":{"1.0.0":{"name":"aspen-decorations","version":"1.0.0","description":"Complex styling for react-aspen w/ inheritance and negations","main":"dist/index.js","typings":"dist/typings/index.d.ts","scripts":{"test":"jest","build":"tsc","watch":"tsc -w","lint":"tslint --project .","prepack":"npm run lint && npm run build && npm run test && npm run generate-docs","postpublish":"npm run publish-docs","generate-docs":"typedoc --mode file --excludePrivate --excludeProtected --excludeNotExported --theme node_modules/typedoc-clarity-theme/bin --out dist/docs ./src","publish-docs":"gh-pages -d dist/docs"},"dependencies":{"notificar":"^1.0.1"},"peerDependencies":{"aspen-core":"^1.0.0"},"devDependencies":{"@types/jest":"^23.3.11","gh-pages":"^2.0.1","jest":"^23.6.0","ts-jest":"^23.10.5","tslint":"^5.12.1","typedoc":"^0.14.1","typedoc-clarity-theme":"^1.1.0","typescript":"^3.2.2"},"repository":{"type":"git","url":"git+https://github.com/neeksandhu/aspen-decorations.git"},"keywords":["react","aspen","decoration","service","engine","styling","tree","file"],"author":{"name":"Neek Sandhu","email":"neek.sandhu@outlook.com"},"license":"MIT","bugs":{"url":"https://github.com/neeksandhu/aspen-decorations/issues"},"homepage":"https://github.com/neeksandhu/aspen-decorations#readme","gitHead":"debd8695d41d0e4c26898c07119ea8b1caa49aff","_id":"aspen-decorations@1.0.0","_npmVersion":"6.5.0-next.0","_nodeVersion":"11.6.0","_npmUser":{"name":"sweetslush","email":"yo@chipto.io"},"dist":{"integrity":"sha512-ZPUErimtkVDtDTPLWLAq8+xaGOm8/cCO5WAUDoou/o0350w2gHHyKAa6AJ5qmRUgvnwMdAKvJgeteJFcoxTmgA==","shasum":"bec5a16eb977887e09577db35449904418b6d283","tarball":"https://registry.npmjs.org/aspen-decorations/-/aspen-decorations-1.0.0.tgz","fileCount":45,"unpackedSize":3364160,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcPBzpCRA9TVsSAnZWagAAGGkP/0v1kPAL4S+xp4ySStlz\n8EplNMOxswGpdQtDTZnF0X8d3fOt4OaL9ovdK4bJgAz7c0s5huNmHVGMYoly\nRcqThjnu1JCQ7d3WCu+jozV0L+4Rt3+ocXy3Hr8VFgRSN3tQApxbi45lXD+2\nKugY9ZGK3LHieiA1lmTA4m5xeGyb4AEZffn0FUsZfBKYslF+0knLuyhT2aDo\n4q3jdZX77n83KHfhSN4KCE5M6jEftD+d1jtAiubY5CHVuCW/pR76QW2h1BcB\n27Xs95KzOlFeeVvdOhQND/M9qSPyuKAp3kdNrDFiB8gXZowExp8N/E44z/Vl\nP/j3cj9xVfeCf9NT15SKD+mxzDuf4D8J1gzvDXpTmXtg3d19qJBx6KWNudWu\n+tiXUoRhQ3RKnwGGpxZWKg9oY9diPC1qfnGttHRsEX9X/LuO94Xs5XL/ulqI\nSRlwDPIjwYE1SYS1S8+MjdsH7ioQrkOdZ4mWuc0S0DmkXzILSQYWKu+ECm6P\niZFaGblv8AFRNa2bu8lkXW+d1z5etCbTbx8YI6Tqtl4BxhMF5diLrVtpAXzH\nqSoIFmT2ugnBy1FqtcSsVe6wnMNFyx2gj9GeONwrLQvorluF130Yb6oD4qeK\nFmmYZxV0tv03A9nGG4x3EIZQF1c6JlcdbsHRY0m6OxJ3doZC8bU5iDgmNpuq\nV3/O\r\n=rKh+\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEQHEHl2M/V4wM8UOBlvRm3ZT/PaTtZCAB8NLCLM6cX5AiBQq2AQ6YvCrw5BMvIg1kATwzleD17ieUGo5JFP8UoOeg=="}]},"maintainers":[{"name":"sweetslush","email":"yo@chipto.io"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/aspen-decorations_1.0.0_1547443432598_0.22350885662033693"},"_hasShrinkwrap":false},"1.0.1":{"name":"aspen-decorations","version":"1.0.1","description":"Complex styling for react-aspen w/ inheritance and negations","main":"dist/index.js","typings":"dist/typings/index.d.ts","scripts":{"test":"jest","build":"tsc","watch":"tsc -w","lint":"tslint --project .","prepack":"npm run lint && npm run build && npm run test && npm run generate-docs","postpublish":"npm run publish-docs","generate-docs":"typedoc --mode file --excludePrivate --excludeProtected --excludeNotExported --theme node_modules/typedoc-clarity-theme/bin --out dist/docs ./src","publish-docs":"gh-pages -d dist/docs"},"dependencies":{"notificar":"^1.0.1"},"peerDependencies":{"aspen-core":"^1.0.0"},"devDependencies":{"@types/jest":"^23.3.11","gh-pages":"^2.0.1","jest":"^23.6.0","ts-jest":"^23.10.5","tslint":"^5.12.1","typedoc":"^0.14.1","typedoc-clarity-theme":"^1.1.0","typescript":"^3.2.2"},"repository":{"type":"git","url":"git+https://github.com/neeksandhu/aspen-decorations.git"},"keywords":["react","aspen","decoration","service","engine","styling","tree","file"],"author":{"name":"Neek Sandhu","email":"neek.sandhu@outlook.com"},"license":"MIT","bugs":{"url":"https://github.com/neeksandhu/aspen-decorations/issues"},"homepage":"https://github.com/neeksandhu/aspen-decorations#readme","gitHead":"d9de527e8fd99770d05886065b739ce38236f0b1","_id":"aspen-decorations@1.0.1","_npmVersion":"6.5.0-next.0","_nodeVersion":"11.6.0","_npmUser":{"name":"sweetslush","email":"yo@chipto.io"},"dist":{"integrity":"sha512-oSYJ0pZqIVag9etyEODpeavnCNmeusm9Z6Yeh6VHMPIxxE9Qm4su8niqO7/M5WR2+iASn7+WZ4CxJe8cjww1uQ==","shasum":"ea13641fbdd22fb99c55bf34c7b88174980094af","tarball":"https://registry.npmjs.org/aspen-decorations/-/aspen-decorations-1.0.1.tgz","fileCount":45,"unpackedSize":3364953,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcPGXyCRA9TVsSAnZWagAAvFYQAKIhjlL9DA9ESW1Uoohj\neRFO0z1mscqZsjrn8McpIsNsGE4jVId/HExzzU7yqs8JzC0wzSera+ZsWrcM\n5nS1gGlmO9qp+BwdTv2Y2ihIIo4OH24kfpidqHpRZoGu+CxX8PWG3ngXFmB5\nmsCsq0AJnhGX2PCMYVPKE/IbWj4qabLKUiZCp3+1TQFPP33hruN/YQEgzT9w\nufbb7CXgIWkrCSAoEEB6KqhbA06DypRt8ciVL5TJD+95HXqJwgZjKLIA1HJs\ndv772O7mKYV/S5yqE3kHhJr2YzGX9/br6lKMjT8+N4lVTVq/XPfa1NHq1rN6\nSqzZ60IkZLerVOnTegUedXbFRLQk7q5aFxTzzTRhPxrwa0fdbbqt9baxUpx8\nFgpWZqppkdjZ4oAXwJRspvwpH5DiCfALGBTBhlVuL5/09EiwQ31EX6YlAXZb\nRWaJPmAUbH+9KHutpWatdQZlGiikn9S5ih5x05HU5h/Psa/JQyN25qfyL+eG\navAqflEzWDdSSTE/hCASAfAE5ElT0ott+wfYwKEmbjZAbUJ0TKRIUhQkMSoW\nsFJ+LMtb75nj5TUgCjnTAeroLN2zLpf/qOHSK5lNDJReyTU+Cepl1m9DfbwD\nqeY9tlRQyBVOBJ/qeYhTQal8RP2lnwL2qOOPVgqDODEYTkMyBTVcmB2g2QHb\nRrwr\r\n=IZr3\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHyBfru5B5O7d8JgOsCj12sp2HAZOVtnsvctTF4lZKK/AiBuAH/mljXWifNLeCvllj0AhjM7M3Yw6gJ+vq/d0tQF+A=="}]},"maintainers":[{"name":"sweetslush","email":"yo@chipto.io"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/aspen-decorations_1.0.1_1547462130252_0.4189503424179575"},"_hasShrinkwrap":false},"1.0.2":{"name":"aspen-decorations","version":"1.0.2","description":"Complex styling for react-aspen w/ inheritance and negations","main":"dist/index.js","typings":"dist/typings/index.d.ts","scripts":{"test":"jest","build":"tsc","watch":"tsc -w","lint":"tslint --project .","prepack":"npm run lint && npm run build && npm run test && npm run generate-docs","postpublish":"npm run publish-docs","generate-docs":"typedoc --mode file --excludePrivate --excludeProtected --excludeNotExported --theme node_modules/typedoc-clarity-theme/bin --out dist/docs ./src","publish-docs":"gh-pages -d dist/docs"},"dependencies":{"notificar":"^1.0.1"},"peerDependencies":{"aspen-core":"^1.0.2"},"devDependencies":{"@types/jest":"^23.3.11","gh-pages":"^2.0.1","jest":"^23.6.0","ts-jest":"^23.10.5","tslint":"^5.12.1","typedoc":"^0.14.1","typedoc-clarity-theme":"^1.1.0","typescript":"^3.2.2"},"repository":{"type":"git","url":"git+https://github.com/neeksandhu/aspen-decorations.git"},"keywords":["react","aspen","decoration","service","engine","styling","tree","file"],"author":{"name":"Neek Sandhu","email":"neek.sandhu@outlook.com"},"license":"MIT","bugs":{"url":"https://github.com/neeksandhu/aspen-decorations/issues"},"homepage":"https://github.com/neeksandhu/aspen-decorations#readme","gitHead":"695a79a8166de969df0f92e9bde6804f0eeacc58","_id":"aspen-decorations@1.0.2","_npmVersion":"6.5.0-next.0","_nodeVersion":"11.6.0","_npmUser":{"name":"sweetslush","email":"yo@chipto.io"},"dist":{"integrity":"sha512-w6Cn2KS4bMZJkyESZHO8xZAqjiohC0uAhf2IbM1quth/Sc+cvf2bBKhgQhf67LBJv9B3CKFGH0V3bbAUhw3pQw==","shasum":"f684a2ca46089d494ca6b45d9e292c36ad7979da","tarball":"https://registry.npmjs.org/aspen-decorations/-/aspen-decorations-1.0.2.tgz","fileCount":45,"unpackedSize":3364953,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcQBSBCRA9TVsSAnZWagAAO4QP/jEcUj98qyxVinFGjhMp\nA2HYmXNzNdJE9PbfxSo2Xz+RhFtZjSXZWhi1XJBL0/cS74FZD7QE5Q4V0E2u\nKDbfW3od4B5RzUFoCi/YAjIDLY6gQYvlgIzQUdkqXQozB80/8di+pcnJRv1D\nYa87NqmViVGLOOdcHsGnGGZqk3zm1sTDwOe9bUPBKbUJAWMtVZG1imZz+w6z\nCbYbYB3QcWArRsYb6zP0ukJPhpP9J/qafcyH46wOk0H80efosQjJ8MEgP71w\nsSCP1ENGkH5y5k+kjL7QvwWrw3suAJRu481MBSiG9qkVg3WTzL52opNmTHzL\nTxYZSEVUSoIDbZQ5Ua1kdFe1GVgf5o1eC+HqEev4zf4bew2UaKzo4GNr3OxK\nWiT1B+LoL4+tKMobIwyZr1cHOEK8LI0suq279q0nXtO55+H1FZTnNWas4OBN\n5mCNVtCpHql5vkgD8QDFx3DNPP/AALaJPXWe8HPkCwSv32f/Odsla9meEuNj\nBVRNScpp7jQ3uwRHeZdFJLphNXRd5gHjoCqszlRoQla2HOjPmDZyxRl5TQGB\n6id8sX82dSParagHgu9L/T1tl2ivIBFlY7EKyXVLp0dnGEd1JUJbb9cfSGFM\ntOclnRnb5+Pmj8D4tkFyPcKaViSwZUtP7VmUPeX0sTfQHFiSJYhyX6N8yTr7\nb0fd\r\n=C2Cu\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEGA3W9xpZN48ZikZu21ZCJSEZRxreUuKDdlxbjGME2oAiEA8bcIXOkSC91jbia61DWG0nPoWRAa1gZCFnR4sxTLVoA="}]},"maintainers":[{"name":"sweetslush","email":"yo@chipto.io"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/aspen-decorations_1.0.2_1547703425078_0.8462505565473675"},"_hasShrinkwrap":false},"1.1.0":{"name":"aspen-decorations","version":"1.1.0","description":"Complex styling for react-aspen w/ inheritance and negations","main":"dist/index.js","typings":"dist/typings/index.d.ts","scripts":{"test":"jest","build":"tsc","watch":"tsc -w","lint":"tslint --project .","prepack":"npm run lint && npm run build && npm run test && npm run generate-docs","postpublish":"npm run publish-docs","generate-docs":"typedoc --mode file --excludePrivate --excludeProtected --excludeNotExported --theme node_modules/typedoc-clarity-theme/bin --out dist/docs ./src","publish-docs":"gh-pages -d dist/docs"},"dependencies":{"notificar":"^1.0.1"},"peerDependencies":{"aspen-core":"^1.0.3"},"devDependencies":{"@types/jest":"^23.3.11","gh-pages":"^2.0.1","jest":"^23.6.0","ts-jest":"^23.10.5","tslint":"^5.12.1","typedoc":"^0.14.1","typedoc-clarity-theme":"^1.1.0","typescript":"^3.2.2"},"repository":{"type":"git","url":"git+https://github.com/neeksandhu/aspen-decorations.git"},"keywords":["react","aspen","decoration","service","engine","styling","tree","file"],"author":{"name":"Neek Sandhu","email":"neek.sandhu@outlook.com"},"license":"MIT","bugs":{"url":"https://github.com/neeksandhu/aspen-decorations/issues"},"homepage":"https://github.com/neeksandhu/aspen-decorations#readme","gitHead":"d85b37976191ff83202d719354e988a431003ae8","_id":"aspen-decorations@1.1.0","_nodeVersion":"11.13.0","_npmVersion":"6.7.0","dist":{"integrity":"sha512-wapTI5YEt5lTSX2ZES4BNIIJgUBSBPphnxf62jW1tXNu3MIYb2ltiG2wiViXYUjkb8AmtwwvTBEHiVLnRTbvKg==","shasum":"1ab5f152e8190b71efd54f9ecc0f3fc7e606ec7f","tarball":"https://registry.npmjs.org/aspen-decorations/-/aspen-decorations-1.1.0.tgz","fileCount":45,"unpackedSize":3365605,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdSMc2CRA9TVsSAnZWagAAQyEP/i5n/UcsXvtDrJUgC1WR\nQ7Pppf9ytJ70sgYTUN4Ag8fLVisZ08hmiSpJHKZeOpb5lgWG/X/thJiRcZqv\nUx7HWYt31meCP3oQuLydae/Gg1UNobB0qU+KxYqnpbXdH0hUAQZPMnrM5EXv\niR/s3/lQIALaoOU284h1lsxgqFWqYEc8botesYlQXbIDpwWaY+/hQz9yGm6w\n0U8yCA0i8u31NPw/+i6j4hHXe4S2r4MU3Ur0n9gMOsANIO9yMKbPBO3J+lrI\nqpYNglBmyUM9t19KHIlNBR1STM1a5kYOmAoJSHpprA6FS4AJCJryZNbYKIrr\ngVEdi24dEN7uIeK0PZL2T0XgeR7RjxrnMFow/Jk9oGt4lim9a5hCpn1pGd0Y\nxXZUqJaaK9IQG2MB2YaSqcxVaQ4Oh10vmYpffGu/ObrPnBjXltriQ6XvyEG+\nKh4mE9TrK2VluAC9qQY2LM1tJjEgllkJe2LVOdrTl/v4QMwF5RjJAefJpva5\nrOf8x51+TmFp74k8vwrOcY3L89fV2exUju72t0ydz1pYLYYnev2p2kQREZvB\n1G2MnKAl34su7tunECvnxQe4xOi+Vlj5e0nCHza7ilXFgIyOMmXQoLgrExXy\nR3T0sumELlnZ1xDiwDNJceVfUhe6JXHKvpmIysYaaP2tKmehZhiSRUKnt1Vh\nLtq4\r\n=koZy\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCgURLMic+WM5xPNw8V+i1swGkD4sWUVPjkTA9rZFV5/AIhAO1fPHj5LTig080VDDbyCEPCGHNRFmiyG1MHg+dlUT/k"}]},"maintainers":[{"name":"sweetslush","email":"yo@chipto.io"}],"_npmUser":{"name":"sweetslush","email":"yo@chipto.io"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/aspen-decorations_1.1.0_1565050677450_0.5237323932389331"},"_hasShrinkwrap":false},"1.1.1":{"name":"aspen-decorations","version":"1.1.1","description":"Complex styling for react-aspen w/ inheritance and negations","main":"dist/index.js","typings":"dist/typings/index.d.ts","scripts":{"test":"jest","build":"tsc","watch":"tsc -w","lint":"tslint --project .","prepack":"npm run lint && npm run build && npm run test && npm run generate-docs","postpublish":"npm run publish-docs","generate-docs":"typedoc --mode file --excludePrivate --excludeProtected --excludeNotExported --theme node_modules/typedoc-clarity-theme/bin --out dist/docs ./src","publish-docs":"gh-pages -d dist/docs"},"dependencies":{"notificar":"^1.0.1"},"peerDependencies":{"aspen-core":"^1.0.4"},"devDependencies":{"@types/jest":"^23.3.11","gh-pages":"^2.0.1","jest":"^23.6.0","ts-jest":"^23.10.5","tslint":"^5.12.1","typedoc":"^0.14.1","typedoc-clarity-theme":"^1.1.0","typescript":"^3.2.2"},"repository":{"type":"git","url":"git+https://github.com/neeksandhu/aspen-decorations.git"},"keywords":["react","aspen","decoration","service","engine","styling","tree","file"],"author":{"name":"Neek Sandhu","email":"neek.sandhu@outlook.com"},"license":"MIT","bugs":{"url":"https://github.com/neeksandhu/aspen-decorations/issues"},"homepage":"https://github.com/neeksandhu/aspen-decorations#readme","gitHead":"66ed0914eed5bb949d540a7df1ad24788c3b5a1b","_id":"aspen-decorations@1.1.1","_nodeVersion":"12.16.1","_npmVersion":"6.13.4","dist":{"integrity":"sha512-Ej2tv0Gz3bnhkNCyzzjDeG2V5vd49T30ca0SKywHuLA5RKrZ1NutEyZnUYku4WmUV1/TdpHRiSJ759nbZK4xtQ==","shasum":"7d0ca740efab1aa4fd91a1f3db81ac29186607a3","tarball":"https://registry.npmjs.org/aspen-decorations/-/aspen-decorations-1.1.1.tgz","fileCount":45,"unpackedSize":3365694,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfkn6uCRA9TVsSAnZWagAA6DoP/R0bihRwUxlSBeN9KgYP\nBkBUtv0gYgxnkxhoFhvflLWHZZO3ytfRFN3jBfhZ96AcsSJitSmso8E8ZnZz\nB+iQPeYk+SX4e8+TTFs7n5JLY82V0OKgTOLJIAZmrwjNZew6zCnv+acpgAis\n4gTcLj+a0FGnq1WT2ZO6KoOo1S4GShr5W9sqfc7hLkpyIcggUiPiqvs64Osn\nvh36fHSwVDARtAcoEoQc/mu24gpSKPvgdJfUvnVSRPSM7X6j7GDPjftW4O3Z\nlvuo+IG9x1Db0AelL89bw8G3WVoyUu1qrHX/wJ6O7d4Q/eoEIVQs/5Eh/8WB\nRx4ahktkxGl7jjfU0Kk08hbPEZdWMVf3Y1526xsEKGlD21q/wB2YHXZ6F2fY\nyPyTwZzzRzDWHZPUwyrRoJlr91AxGtu9kM9MYGkZgUgZ9SBkXXTOJ79i7HWD\nBBGJcBpjOn80bIqBBaFaodlfmAgwJrq5u/QYw075kfaU0J4Cy98BlugGSFe9\ntKHzKuyxVVRIr192zQXvoxlvcWErOTz068XB9C8ASGLsm3Z3ZeXDrda3nljp\nEWd8eZihNX6VyMzvR2X700Lh9mFJjgBCw5vcIRUly5j99As7OglL8+eJQY4v\nd81avqbmyRJslSD8maB7hl+sMwJsMSpojFzrR/LEzqWuzLK1vKrA7FZ/Z84u\ndqgQ\r\n=C4zZ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDEbjFxMCfwqZodZ1Z+V5GXwfsnBEPZoduNPJcQDYQo9AiEA/ewnXpGy1hQM7DG767kZ2wrro1g+tA8BZ+WRjAIDxm8="}]},"maintainers":[{"name":"sweetslush","email":"yo@chipto.io"}],"_npmUser":{"name":"sweetslush","email":"yo@chipto.io"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/aspen-decorations_1.1.1_1603436205811_0.9713197544852252"},"_hasShrinkwrap":false}},"time":{"created":"2019-01-14T05:23:52.597Z","1.0.0":"2019-01-14T05:23:52.861Z","modified":"2022-04-11T15:23:12.704Z","1.0.1":"2019-01-14T10:35:30.483Z","1.0.2":"2019-01-17T05:37:05.314Z","1.1.0":"2019-08-06T00:17:57.600Z","1.1.1":"2020-10-23T06:56:46.033Z"},"maintainers":[{"name":"sweetslush","email":"yo@chipto.io"}],"description":"Complex styling for react-aspen w/ inheritance and negations","homepage":"https://github.com/neeksandhu/aspen-decorations#readme","keywords":["react","aspen","decoration","service","engine","styling","tree","file"],"repository":{"type":"git","url":"git+https://github.com/neeksandhu/aspen-decorations.git"},"author":{"name":"Neek Sandhu","email":"neek.sandhu@outlook.com"},"bugs":{"url":"https://github.com/neeksandhu/aspen-decorations/issues"},"license":"MIT","readme":"# Complex styling for Aspen trees\n\nTakes care of inheritance, negations and overriding, with absolute ease.\n\n## So what is it?\n\nView libraries which leverage `aspen-core` as model for rendering nested trees typically use virtualization/windowing for rendering the said nested trees as a flat structure.\nVirtualization allows said libraries to limit how many DOM nodes are renderered in the page at any given time. With \"nested trees\" one might expect them to be rendered like this:\n\n```html\n<ul class=\"children\">\n    <li><span class=\"label\">package.json</span></li>\n    <li><span class=\"label\">.gitignore</span></li>\n    <li>\n        <span class=\"label\">src</span>\n        <ul class=\"children\">\n            <li><span class=\"label\">App.js</span></li>\n            <li><span class=\"label\">index.js</span></li>\n        </ul>\n    </li>\n</ul>\n```\n\nHowever, they are rendered like this (efficiency, remember?):\n\n```html\n<div class=\"label\">package.json</div>\n<div class=\"label\">.gitignore</div>\n<div class=\"label\">src</div>\n<div class=\"label\">App.js</div>\n<div class=\"label\">index.js</div>\n```\n\nAnd if you haven't noticed already, this hunt for perfomance increase comes at a price. That is, giving up CSS inheritance we all know and love :(\n\nWith that, you can no longer say, \"ok, this node and *all* of its children (except a few), I want them with red foreground\". Quite sad.\n\n## But now you can 👏👏\n\n...and you don't need to worry about keeping the inheritance up to date. If a child gets moved to another parent, or a new child is added. Inheritances and negations\nare auto-managed once you declare them.\n\n```typescript\n\n// ...\n\n// get the handle to the thing you want to apply some classnames (in future we'll also support glob patterns!)\nconst nodeModulesDir = await treeModel.root.forceLoadFileEntryAtPath('/path/to/node_modules')\n\n// create a Decoration with 'gitignore' classname (you can add extra classnames to one Decoration)\nconst gitIgnoreDeco = new Decoration('gitignore')\n\n// register the decoration\ndecorationManager.addDecoration(gitIgnoreDeco)\n\n// target the thing and all of its children\ngitIgnoreDeco.addTarget(nodeModulesDir, TargetMatchMode.SelfAndChildren)\n\n// you can skip some children using `Decoration#negateTarget(file)` or `Decoration#negateTarget(dir, TargetMatchMode.SelfAndChildren)`\n\n// ...\n```\n\n## Usage\n\n```bash\nnpm i aspen-decorations\n```\n\n> `aspen-core` is a peer dependency that you must install yourself\n\nOnce installed, here's one of the many ways you can consume this service:\n\n> This example assumes you're using this package with `react-aspen` (Other ports shouldn't be much different)\n\n```tsx\nimport * as React from 'react'\nimport * as ReactDOM from 'react-dom'\nimport { DecorationManager } from 'aspen-decorations'\nimport { FileTree, TreeModel } from 'react-aspen'\n\nclass TreeModelX extends TreeModel {\n    private decorations: DecorationManager\n    constructor(host: IBasicFileSystemHost, rootPath: string) {\n        super(host, rootPath)\n        this.decorations = new DecorationManager(this.root)\n    }\n}\n\nclass FileTreeItem extends React.Component {\n    render() {\n        console.log(this.props.decorations.classlist) // > ['active', 'stuff', 'calculated']\n        // ...\n    }\n\n    componentDidMount() {\n        if (this.props.decorations) {\n            this.props.decorations.addChangeListener(this.forceUpdate)\n        }\n    }\n\n    componentWillUnmount() {\n        if (this.props.decorations) {\n            this.props.decorations.removeChangeListener(this.forceUpdate)\n        }\n    }\n\n    componentDidUpdate(prevProps: IItemRendererXProps) {\n        if (prevProps.decorations) {\n            prevProps.decorations.removeChangeListener(this.forceUpdate)\n        }\n        if (this.props.decorations) {\n            this.props.decorations.addChangeListener(this.forceUpdate)\n        }\n    }\n}\n\nclass MySweetFileTree extends React.Component {\n    render() {\n        const { width, height, model } = this.props\n        return (\n            <FileTree\n                width={width}\n                height={height}\n                model={model}\n                itemHeight={24}>\n                {({item, itemType}) => <FileTreeItem item={item} itemType={itemType} decorations={model.decorations.getDecorations(item)} />}\n            </FileTreee>)\n    }\n}\n\nconst host: IBasicFileSystemHost = { pathStyle: 'unix', getItems: async (path) => { /* impl */ }}\nconst treeModelX: TreeModelX = new TreeModelX(host, '/')\n\nReactDOM.render(<MySweetFileTree width={400} height={700} model={treeModelX}/>, document.getElementById('app'))\n```\n\n## API\n\nYou can explore the full API [here](https://neeksandhu.github.io/aspen-decorations). However the rundown below should be more than enough for you to exploit\neverything this package has to offer.\n\nIf you are good at CSS and know how to tame it, `aspen-decorations` will be no different. Here's how:\n\n```typescript\n\nconst activeDeco = new Decoration('active')\n\n// CSS equivalent: `.file-entry.active > .file-label { ... }`\nactiveDeco.addTarget(srcH, TargetMatchMode.Self)\n\n// CSS equivalent: `.file-entry.active * { ... }`\nactiveDeco.addTarget(srcH, TargetMatchMode.SelfAndChildren)\n\n// CSS equivalent: not very sure how to express these but imagine adding `:not(<selector>)` to above examples\nactiveDeco.negateTarget(subDirOfSrcH, TargetMatchMode.Self)\nactiveDeco.negateTarget(subDirOfSrcH, TargetMatchMode.SelfAndChildren)\n```\n\nThat's pretty much it. Just remeber these rules:\n\n - `Decoration.addTarget(<dir>, TargetMatchMode.Self)` won't neccessarily \"shield\" it's children from having that decoration. Use negations to be 100% certain.\n - Rule defined on nearest parent (or itself) will override anything and everything previously defined. That is, inheritances and negations in effect by a parent higher up.\n - A target that is being shadowed by a negation set by one of its parent, can override and reacquire that `Decoration` by adding itself (and/or its children) as a target. \n\n## License\n\nThis project is licensed under MIT license. You are free to use, modify, distribute the code as you like (credits although not required, are highly appreciated)\n","readmeFilename":"README.md"}