{"_id":"@craydel/craydel-avatar-with-details","_rev":"2-9dc04c87b1271e1028565151a84fab43","name":"@craydel/craydel-avatar-with-details","dist-tags":{"latest":"1.0.2"},"versions":{"1.0.0":{"name":"@craydel/craydel-avatar-with-details","version":"1.0.0","description":"A custom Vuetify avatar with details component for Craydel.","author":{"name":"Wasim Al-Haddad"},"keywords":["vuetify","avatar","vue","nuxt"],"dependencies":{"@craydel/craydel-avatar":"^1.0.1"},"publishConfig":{"access":"public"},"gitHead":"8d2fa7b87080568438878ca4e9c741412eccb7ff","_id":"@craydel/craydel-avatar-with-details@1.0.0","_nodeVersion":"16.14.0","_npmVersion":"lerna/7.3.0/node@v16.14.0+x64 (win32)","dist":{"integrity":"sha512-1Q2QG9+19UiohGGmvLE3zVA+AUgM0S6i7VQkvx7mVObagmiKx9/dQ44BDRzIzZyjmVakG7VZDsUtckm9gtjdxQ==","shasum":"662eae4a8a1429cea7a70ce26e924c74e555c3ce","tarball":"https://registry.npmjs.org/@craydel/craydel-avatar-with-details/-/craydel-avatar-with-details-1.0.0.tgz","fileCount":4,"unpackedSize":6093,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGIwJAbDY2labfUVB7QXzYt49d+kraQwCBd/mb5GfkF+AiB8PGOSdZmQeJ5s8oU/nPZadL5B15XPZi+vwb3SMXySmw=="}]},"_npmUser":{"name":"sayedwasim","email":"wasimalhaddad@gmail.com"},"directories":{},"maintainers":[{"name":"sayedwasim","email":"wasimalhaddad@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/craydel-avatar-with-details_1.0.0_1695040853492_0.5563712922030197"},"_hasShrinkwrap":false},"1.0.1":{"name":"@craydel/craydel-avatar-with-details","version":"1.0.1","description":"A custom Vuetify avatar with details component for Craydel.","author":{"name":"Wasim Al-Haddad"},"keywords":["vuetify","avatar","vue","nuxt"],"dependencies":{"@craydel/craydel-avatar":"^1.0.1"},"publishConfig":{"access":"public"},"gitHead":"e658d4a176c5e4e403ed4de4ca0b08bb7934ca29","_id":"@craydel/craydel-avatar-with-details@1.0.1","_nodeVersion":"16.14.0","_npmVersion":"lerna/7.3.0/node@v16.14.0+x64 (win32)","dist":{"integrity":"sha512-YoxRmnnHE9RZoS33T8/p3eBJ/djf5op/pasge6QYtVxEOkzdgPK0nxN+ic+ha1fBKGPpjHPsDveXFdoXSu0aPw==","shasum":"ac6a2b137b1202fb2da3e36af12cdfaf738a2680","tarball":"https://registry.npmjs.org/@craydel/craydel-avatar-with-details/-/craydel-avatar-with-details-1.0.1.tgz","fileCount":4,"unpackedSize":6239,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDS6dojlVV5cPlV7N+sA42BpjiOzrHz3TXkjrg9yZJGCwIgE3Zdp4Ke/MTeYGsKUlQ5NEXwbRdLeeVwoM0QCeEOF5k="}]},"_npmUser":{"name":"sayedwasim","email":"wasimalhaddad@gmail.com"},"directories":{},"maintainers":[{"name":"sayedwasim","email":"wasimalhaddad@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/craydel-avatar-with-details_1.0.1_1695042522713_0.5003065138802179"},"_hasShrinkwrap":false},"1.0.2":{"name":"@craydel/craydel-avatar-with-details","version":"1.0.2","description":"A custom Vuetify avatar with details component for Craydel.","author":{"name":"Wasim Al-Haddad"},"license":"MIT","keywords":["vuetify","avatar","vue","nuxt"],"dependencies":{"@craydel/craydel-avatar":"^1.0.2"},"publishConfig":{"access":"public"},"gitHead":"dcab0c7dceab40486e8eab7a571b75fdce0e93e5","_id":"@craydel/craydel-avatar-with-details@1.0.2","_nodeVersion":"16.14.0","_npmVersion":"lerna/7.3.0/node@v16.14.0+x64 (win32)","dist":{"integrity":"sha512-F0daa0OE2ZtO8tSYQ5K6lRRcz2sWLULqnglUE3xoKfFY6heIDLc6UGvmt35vWBMH3WNGr2Iam48SUn8KiX3hNQ==","shasum":"432c810dd9999afbd27a780ca55f834674d98841","tarball":"https://registry.npmjs.org/@craydel/craydel-avatar-with-details/-/craydel-avatar-with-details-1.0.2.tgz","fileCount":5,"unpackedSize":7312,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCwycwjlrDfpcYrRh6982p5j6/6wgatm+2WPOFTvUsc3AIgM0ekOByXwRpuxjJLsvnL25bIHuSTwe1bihlBJ0cYkOg="}]},"_npmUser":{"name":"sayedwasim","email":"wasimalhaddad@gmail.com"},"directories":{},"maintainers":[{"name":"sayedwasim","email":"wasimalhaddad@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/craydel-avatar-with-details_1.0.2_1695211476207_0.33603139831217477"},"_hasShrinkwrap":false}},"time":{"created":"2023-09-18T12:40:53.368Z","1.0.0":"2023-09-18T12:40:53.692Z","modified":"2023-09-20T12:04:36.624Z","1.0.1":"2023-09-18T13:08:42.898Z","1.0.2":"2023-09-20T12:04:36.385Z"},"maintainers":[{"name":"sayedwasim","email":"wasimalhaddad@gmail.com"}],"description":"A custom Vuetify avatar with details component for Craydel.","keywords":["vuetify","avatar","vue","nuxt"],"author":{"name":"Wasim Al-Haddad"},"readme":"# CraydelAvatarWithDetails\n\n## Installation\n\nGet the latest version by NPM:\n\n```bash\n$ npm i @craydel/craydel-avatar-with-details\n```\n\n## Register Plugin\n\nIf you use the plugin API, the component will be registered as a global component just like when\nincluding it with the script tag, but you won't need to re-register it through the `components` property in your own\ncomponents.\n\nCreate the plugin file e.g `craydel-components.js` file.\n\n```javascript\n// craydel-components.js\nimport Vue from 'vue'\nimport CraydelAvatarWithDetails from '@craydel/craydel-avatar-with-details/src/CraydelAvatarWithDetails.vue'\n\nconst Components = {\n  CraydelAvatarWithDetails,\n};\n\nObject.keys(Components).forEach(name => {\n  Vue.component(name, Components[name]);\n});\n\nexport default Components;\n```\n\nNext reference the plugin file in your nuxt.config.js\n\n```javascript\n// Plugins to run before rendering page: https://go.nuxtjs.dev/config-plugins\nplugins: [\n  '~/plugins/craydel-components.js'\n]\n```\n\n## Props\n\n| Name         | Type             | Default   | Description                                                                                         |\n|--------------|------------------|-----------|-----------------------------------------------------------------------------------------------------|\n| photo        | string           | undefined | Sets the avatar as an image.                                                                        |\n| display-name | string           | undefined | Generates a random color that is applied to the avatar based on the display-name.                   |\n| acronym      | string           | undefined | Sets the avatar as an acronym.                                                                      |\n| email        | string           | undefined | Sets the email for the avatar. Note: this text could be anything. Not necessarily an email address. |\n| size         | number \\| string | 40        | Sets the height and width of the component.                                                         |\n| clickable    | boolean          | false     | If set, the component will be rendered as clickable that has @click handler.                        |\n| on           | object           | undefined | Used for binding to an activator.                                                                   |\n\n&emsp;\n\n## Events\n\n| Name  | Description                                          |\n|-------|:-----------------------------------------------------|\n| click | Event that is emitted when the component is clicked. |\n\n&emsp;\n\n## Usage\n\nAn example showing an avatar that will display the initials 'JD', the name 'John Doe' and an email address 'john.doe@gmail.com'.\n\n```html\n\n<craydel-avatar-with-details\n        display-name=\"John Doe\"\n        acronym=\"JD\"\n        email=\"john.doe@gmail.com\"\n></craydel-avatar-with-details>\n```","readmeFilename":"README.md","license":"MIT"}