{"_id":"@craydel-v3/craydel-sidebar-menu","name":"@craydel-v3/craydel-sidebar-menu","dist-tags":{"latest":"1.0.0"},"versions":{"1.0.0":{"name":"@craydel-v3/craydel-sidebar-menu","version":"1.0.0","description":"A custom Vuetify sidebar menu component for Craydel.","author":{"name":"Wasim Al-Haddad"},"license":"MIT","keywords":["vuetify3","sidebar","menu","vue","nuxt3"],"publishConfig":{"access":"public"},"gitHead":"0496472e89f3429bbc61ada3d14c81957735fbc4","_id":"@craydel-v3/craydel-sidebar-menu@1.0.0","_nodeVersion":"18.18.0","_npmVersion":"lerna/7.3.0/node@v18.18.0+x64 (win32)","dist":{"integrity":"sha512-R1gotKiextwHJJttnGJAjE5vzMwGkn4mleCHP/NxRRrX0JcGrXIS6cA1DBBeyMyL2S2pEBQf75TkrohFNJ1FBg==","shasum":"6774c897dd2e63cb9c4e89a22f3c39faecdbdf19","tarball":"https://registry.npmjs.org/@craydel-v3/craydel-sidebar-menu/-/craydel-sidebar-menu-1.0.0.tgz","fileCount":5,"unpackedSize":8728,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCuEkiGiMmmmKEjgvgLOiMYYurbETtr7ciJqPo+SPUnywIhAL6lOM6DafY2ta+WKS+w/KPlD3XqobsDBojRc+jPAVCY"}]},"_npmUser":{"name":"sayedwasim","email":"wasimalhaddad@gmail.com"},"directories":{},"maintainers":[{"name":"sayedwasim","email":"wasimalhaddad@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/craydel-sidebar-menu_1.0.0_1697116782445_0.2746626382354005"},"_hasShrinkwrap":false}},"time":{"created":"2023-10-12T13:19:42.333Z","1.0.0":"2023-10-12T13:19:42.741Z","modified":"2023-10-12T13:19:43.052Z"},"maintainers":[{"name":"sayedwasim","email":"wasimalhaddad@gmail.com"}],"description":"A custom Vuetify sidebar menu component for Craydel.","keywords":["vuetify3","sidebar","menu","vue","nuxt3"],"author":{"name":"Wasim Al-Haddad"},"license":"MIT","readme":"# CraydelSidebarMenu\n\n## Installation\n\nGet the latest version by NPM:\n\n```bash\n$ npm i @craydel-v3/craydel-sidebar-menu\n```\n\n## Component Import\n\nImport the module chosen directly in your component\n\n```javascript\n<script>\n  import CraydelSidebarMenu from \"@craydel-v3/craydel-sidebar-menu/src/CraydelSidebarMenu.vue\";\n\n  export default {\n  components: {CraydelSidebarMenu}\n}\n</script>\n```\n\n## Props\n\n| Name       | Type    | Default | Description                                                                                                                                                                                          |\n|------------|---------|---------|------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|\n| show-menu  | boolean | false   | Controls whether the component is visible or hidden.                                                                                                                                                 |\n| menu-items | array   | []      | Array of objects that will look for the keys **text**, **icon** (mdi icons), **link**, **target** (default href target options) and if required  **sub_menu** array with **text** and **link** keys. |\n\n&emsp;\n\n## Events\n\n| Name  | Description                      |\n|-------|:---------------------------------|\n| close | Emitted when the menu is closed. |\n\n&emsp;\n\n## Slots\n\n| Name    | Description                                                                       |\n|---------|:----------------------------------------------------------------------------------|\n| header  | A slot at the top of the menu.                                                    |\n| default | The default Vue slot. Used for any content that will appear after the menu items. |\n\n&emsp;\n\n## Usage\n\nAn example showing a sidebar menu. The sidebar menu has a header and default slot that is visible only on mobile.\n\n```html\n<client-only>\n  <v-btn @click=\"show_menu = true\" v-if=\"$vuetify.display.mobile\">Open menu</v-btn>\n</client-only>\n\n<craydel-sidebar-menu\n        :show-menu=\"show_menu\"\n        :menu-items=\"menu_items\"\n        @close=\"show_menu = false\"\n>\n  <template v-slot:header v-if=\"$vuetify.display.mobile\">\n    <div class=\"pa-4\">Navigation</div>\n  </template>\n\n  <div v-if=\"$vuetify.display.mobile\">© Copyright 2023. All Rights Reserved.</div>\n</craydel-sidebar-menu>\n```\n\n```javascript\ndata()\n{\n  return {\n    show_menu: false,\n    menu_items: [\n      {\n        text: 'Home',\n        icon: 'mdi-home',\n        link: '/',\n      },\n      {\n        text: 'About Us',\n        icon: 'mdi-account-group',\n        link: '',\n        sub_menu: [\n          {\n            text: 'Our Team',\n            link: '#'\n          },\n          {\n            text: 'Our History',\n            link: '#'\n          }\n        ]\n      },\n      {\n        text: 'Contacts',\n        icon: 'mdi-phone',\n        link: '/contacts',\n        target: '_blank'\n      },\n    ]\n  }\n}\n```","readmeFilename":"README.md"}