jb_menu 4.1.3

  • README.md
  • CHANGELOG.md
  • Installing
  • Versions
  • 49

jb_menu

An Angular Component for easy responsive menus (was started before angular material).

Usage

  1. Add the component module to your pubspec.yaml with git and specific branch reference

     # update this with current version
     jb_menu: "^1.0.0" "
    
  2. Show this module to angular dependency injection -> see App Class in app_initialize.dart

     import 'package:jb_menu/jb_menu.dart';
    
     class App extends Angular.Module {
    
       App() {
         install(JbMenuModule);
       }
     }
    

Options for jb-menu

Option NameOption ValuesRequiredDesctiption
operation-modestatic or responsiverequiredsets, whether jb-menu reacts to breakpoint changes or not
label-collapsedstring, default "MenĂ¼"optionalsets the text on the menu button in collapsed state
is-openbool, default falseoptionalsets the initial state of the menu to opened, if no other option prohibits this
collapsed-state-breakpointslist of breakpoint names from root contextif not set = operation-mode="static"
breakpoints where the menu should be collapsed
current-breakpointstring, two-way-bindablerequired for operation-mode="responsive"should be bound to <jb-responsive-breakpoints current-breakpoint="[var]"> attribute

Change internal styles:

  1. Add jb-style tag somewhere
  2. Add content attribute to it (two way bindable var)
  3. Add this two way variable to the style attribute of jb-menu or to each jb-menu-item tag to inject the style into their shadow dom

Internal styles in jb-menu: nav { display: inline-flex; flex-flow: row nowrap; align-items: stretch; }

nav.collapsed { width: 100%; flex-flow: column nowrap; align-items: stretch; }

Internal styles in jb-menu-item:

  • { box-sizing: border-box; }

    a { /* text-settings */ text-decoration: none; font-family: 'Roboto', sans-serif; font-style: normal; font-size: 1.5em; font-weight: 300; /text-shadow: #666666 1px 1px 5px;/ color: #000000; /color: #5e5e5e;/

    margin: 5px;
    padding: 5px;
    
    cursor: pointer;
    

    }

    a.collapsed { text-align: center; }

    a:hover, .active { font-weight: bold; padding-left: 3px; padding-right: 2px; /text-shadow: rgb(180, 180, 180) 1px 1px 10px;/ }

Changelog

4.1.0

  • prepares jb-menu for publishing

4.0.0

  • updates angular to 4.0.0 as well as jb_responsive_breakpoints

2.2.0

  • added scss for internal component styling from the outside

2.0.0/2.0.1/2.1.0

  • upgraded whole component to angular2

1.0.6

  • ?

1.0.5

  • fixed error in bound value mode in "active" attribute

1.0.4

  • changed jb-menu dependencies to use https

1.0.3

  • changed style a:hover and a.active in jb_menu_item to be a text shadow instead of font weight bold

1.0.2

  • fixed error with "text" filed access on null object in JbMenu.onShadowRoot

1.0.1

  • added ng-cloak class support to fix content transclusion of menu labels before redering

1.0.0

  • first working version of jb-menu and jb-menu-item

0.0.1

  • Initial version

Use this package as a library

1. Depend on it

Add this to your package's pubspec.yaml file:


dependencies:
  jb_menu: "^4.1.3"

2. Install it

You can install packages from the command line:

with pub:


$ pub get

Alternatively, your editor might support pub get. Check the docs for your editor to learn more.

3. Import it

Now in your Dart code, you can use:


      import 'package:jb_menu/jb_menu.dart';
  
Version Uploaded Documentation Archive
4.1.3 Jan 18, 2018 Go to the documentation of jb_menu 4.1.3 Download jb_menu 4.1.3 archive
4.1.0 Jan 17, 2018 Go to the documentation of jb_menu 4.1.0 Download jb_menu 4.1.0 archive

Analysis

We analyzed this package on Jun 12, 2018, and provided a score, details, and suggestions below. Analysis was completed with status completed using:

  • Dart: 2.0.0-dev.60.0
  • pana: 0.11.3

Scores

Popularity:
Describes how popular the package is relative to other packages. [more]
0 / 100
Health:
Code health derived from static analysis. [more]
98 / 100
Maintenance:
Reflects how tidy and up-to-date the package is. [more]
100 / 100
Overall score:
Weighted score of the above. [more]
49
Learn more about scoring.

Platforms

Detected platforms: web

Primary library: package:jb_menu/jb_menu.dart with components: html.

Suggestions

  • The description is too short.

    Add more detail about the package, what it does and what is its target use case. Try to write at least 60 characters.

  • Maintain an example.

    Create a short demo in the example/ directory to show how to use this package. Common file name patterns include: main.dart, example.dart or you could also use jb_menu.dart.

  • Fix analysis and formatting issues.

    Analysis or formatting checks reported 3 hints.

    Run dartfmt to format lib/jb_menu.dart.

    Run dartfmt to format lib/src/menu/jb_menu_component.dart.

    Similar analysis of the following files failed:

    • lib/src/models/events.dart (hint)

Dependencies

Package Constraint Resolved Available
Direct dependencies
Dart SDK >=1.24.0 <2.0.0
angular ^4.0.0 4.0.0+2 5.0.0-alpha+14
browser ^0.10.0+2 0.10.0+3
dart_to_js_script_rewriter ^1.0.3 1.0.3
jb_responsive_breakpoints ^4.0.3 4.0.3 5.0.0
logging ^0.11.3+1 0.11.3+1
logging_handlers ^0.8.0 0.8.0
transform_sass ^0.3.1 0.3.1
web_components ^0.12.5 0.12.5
Transitive dependencies
analyzer 0.29.11 0.32.1
angular_compiler 0.3.0+1 0.4.0-alpha+14
args 0.13.7 1.4.3
async 2.0.7
barback 0.15.2+16
build 0.11.2 0.12.6
build_barback 0.4.0+2 0.5.0+4
charcode 1.1.1
cli_util 0.0.1+2 0.1.3
code_builder 1.0.4 3.1.0
code_transformers 0.5.1+3 0.5.1+5
collection 1.14.10
convert 2.0.1
crypto 2.0.3
csslib 0.14.4
dart_style 0.2.16 1.0.14
func 1.0.0
glob 1.1.5
html 0.13.3+1
http 0.11.3+16
http_parser 3.1.2
initialize 0.6.2+7
intl 0.15.6
isolate 1.1.0 2.0.1
matcher 0.12.2+1
meta 1.1.5
package_config 1.0.3
package_resolver 1.0.3
path 1.6.0
plugin 0.2.0+2
pool 1.3.5
quiver 0.25.0 0.29.0+1
quiver_hashcode 1.0.0
sass 1.1.1 1.5.1
source_gen 0.7.5+1 0.8.1+3
source_maps 0.10.5
source_span 1.4.0
stack_trace 1.9.2
string_scanner 1.0.2
tuple 1.0.1
typed_data 1.1.5
utf 0.9.0+4
watcher 0.9.7+8
when 0.2.0
which 0.1.3
yaml 2.1.14
Dev dependencies
angular_test ^1.0.1
js 0.6.1 0.6.1
test >=0.12.0 <0.13.0