Card - dark theme

Card

• dark theme
• layout changes - now content doesn't have container, so card becomes direct parent to content.

Search by relevance

• If search text is contained in filename - that file will be propelled to the top.
• search view is now default (was tree view before).

Card focus

• vb-container renamed to vb-card
• vb-card got a new prop focus, that makes all unfocused cards on page disappear.
• Add docs on helpers.

Helpers

VbSlider component is included when you include VueBookComponents.

Remove file extensions option

Interface change

You should pass object for your config instead of function params. This allows vue-book to add more options without breaking changes.

Here's the recommended way:

import Router from 'vue-router'
import { createRoute } from 'vue-book'

const router = new Router({
  routes: [
    createRoute({
      requireContext: require.context('./..', true, /.demo.vue$/), 
      path: '/demo',
      hideFileExtensions: true,
    }),
  ]
})

Before the change, you created the route like this:

VueBook(require.context('./../tree', true, /.vue$/), '/demo')

Deprecation is soft, so nothing will break for now. : 3.

Optional remove extension

You can remove file extensions from the list with hideFileExtensions. By default it's set to false.

createRoute({
  // ... 
  hideFileExtensions: true,
}),

Removals and dependency updates

• all dependencies ramped up to bleeding edge. Most notably, webpack.
• remove options (colors, tree graph, dependency handling) because no one used them.

Resizes and smarter search

New stuff

• Search accepts capital letters (à la webstorm)
• All tabs are resizable.
• All data is stored in local storage, and stays on page refreshes

Description panel and some deprecations

New stuff

• Dependencies - show components that use your component. Or components it depends on.
• Info panel - shows component name, description and dependencies.

Deprecations

Configs now should look like this. All of them are optional.

$componentTree: {
  status: 'stable',
  component: VmTranslationEdit,
  description: `Some description`,
},

vue-router config should look like this:

VueComponentTree(require.context('./../tree', true, /.demo.vue$/), '/app/demo')

Search and flat view

Features

• Text search (keybind: Shift -> Shift).
• Flat view.
• Resists page reload (localStorage).

Bufixes

• No infinite loops anymore.
• General refactoring.