@react-md/app-bar/CHANGELOG.md

This small package implments the AppBar spec in material design.

# Change Log

All notable changes to this project will be documented in this file.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.

# [3.1.0](https://github.com/mlaursen/react-md/compare/v3.0.1...v3.1.0) (2021-09-10)


### Other Internal Changes

* ran `yarn format` to include new files ([48d3d7f](https://github.com/mlaursen/react-md/commit/48d3d7fddb0435edf7dec9d0ba38cf3f0f251709))






## [3.0.1](https://github.com/mlaursen/react-md/compare/v3.0.0...v3.0.1) (2021-08-15)


### Bug Fixes

* Updated peerDependencies to fix yarn berry peer requirements ([250efcd](https://github.com/mlaursen/react-md/commit/250efcdd81ea39c06b08eb30109589c89d9b8e0f)), closes [#1224](https://github.com/mlaursen/react-md/issues/1224)






# [3.0.0](https://github.com/mlaursen/react-md/compare/v2.9.1...v3.0.0) (2021-08-13)


### Bug Fixes

* **sass:** use math.div instead of division since it's deprecated ([d8c3f12](https://github.com/mlaursen/react-md/commit/d8c3f1299ea35814667c5915880744399e5b2108))






## [2.9.1](https://github.com/mlaursen/react-md/compare/v2.9.0...v2.9.1) (2021-07-27)


### Other Internal Changes

* **install:** slighly reduce install size by excluding tests in publish ([9d01a44](https://github.com/mlaursen/react-md/commit/9d01a44b81b619d6ac1c4d458005c99838fc6894))






# [2.9.0](https://github.com/mlaursen/react-md/compare/v2.8.5...v2.9.0) (2021-07-18)

**Note:** Version bump only for package @react-md/app-bar





## [2.8.5](https://github.com/mlaursen/react-md/compare/v2.8.4...v2.8.5) (2021-07-03)

**Note:** Version bump only for package @react-md/app-bar





## [2.8.4](https://github.com/mlaursen/react-md/compare/v2.8.3...v2.8.4) (2021-06-10)

**Note:** Version bump only for package @react-md/app-bar





## [2.8.3](https://github.com/mlaursen/react-md/compare/v2.8.2...v2.8.3) (2021-05-18)


### Documentation

* **react-md.dev:** updated tsdoc to work with `typedoc` ([cf54c35](https://github.com/mlaursen/react-md/commit/cf54c359268332245d1dad8a8d91e0476cd8cb33))






## [2.8.2](https://github.com/mlaursen/react-md/compare/v2.8.1...v2.8.2) (2021-04-23)

**Note:** Version bump only for package @react-md/app-bar





# [2.8.0](https://github.com/mlaursen/react-md/compare/v2.7.1...v2.8.0) (2021-04-22)


### Other Internal Changes

* **tsconfig:** separate tsconfig by package instead of a single root ([b278230](https://github.com/mlaursen/react-md/commit/b2782303b2a2db07eeaa25b6a3d04337976cffaa))






## [2.7.1](https://github.com/mlaursen/react-md/compare/v2.7.0...v2.7.1) (2021-03-23)


### Other Internal Changes

* **ts:** stopped using FC type ([c5daa47](https://github.com/mlaursen/react-md/commit/c5daa47d73516e075c036fd745e7228d7f155a62))






# [2.7.0](https://github.com/mlaursen/react-md/compare/v2.6.0...v2.7.0) (2021-02-28)


### Documentation

* **tsdoc:** fixed remaining tsdoc syntax warnings ([946f4dd](https://github.com/mlaursen/react-md/commit/946f4dddf380b9f2313fb76d54d969aa2adbff53))
* **tsdoc:** fixed some tsdoc annotations and styling ([0449b86](https://github.com/mlaursen/react-md/commit/0449b86e4e51793710b35a452b7ebcbb6e7b5b2e))


### Other Internal Changes

* updated test coverage to not include conditional component PropTypes ([24e5df1](https://github.com/mlaursen/react-md/commit/24e5df14c731411d7691253383435036326407b5))






# [2.6.0](https://github.com/mlaursen/react-md/compare/v2.5.5...v2.6.0) (2021-02-13)

**Note:** Version bump only for package @react-md/app-bar





## [2.5.5](https://github.com/mlaursen/react-md/compare/v2.5.4...v2.5.5) (2021-01-30)

**Note:** Version bump only for package [@react-md/app-bar](../app-bar)

## [2.5.4](https://github.com/mlaursen/react-md/compare/v2.5.3...v2.5.4) (2021-01-27)

**Note:** Version bump only for package [@react-md/app-bar](../app-bar)

# [2.5.0](https://github.com/mlaursen/react-md/compare/v2.4.3...v2.5.0) (2020-12-15)

**Note:** Version bump only for package [@react-md/app-bar](../app-bar)

## [2.4.2](https://github.com/mlaursen/react-md/compare/v2.4.1...v2.4.2) (2020-10-23)

**Note:** Version bump only for package [@react-md/alert](../app-bar)

## [2.4.1](https://github.com/mlaursen/react-md/compare/v2.4.0...v2.4.1) (2020-10-17)

**Note:** Version bump only for package [@react-md/alert](../app-bar)

# [2.4.0](https://github.com/mlaursen/react-md/compare/v2.3.1...v2.4.0) (2020-10-17)

### Features

- [@react-md/theme](../theme): Better Contrast Colors by Default and dev-utils
  refactor ([#955](https://github.com/mlaursen/react-md/issues/955))
  ([519b128](https://github.com/mlaursen/react-md/commit/519b128522de944d55ff96a1e1125447665ed586))

## [2.3.1](https://github.com/mlaursen/react-md/compare/v2.2.0...v2.3.1) (2020-09-15)

**Note:** Version bump only for package [@react-md/app-bar](../app-bar)

# [2.3.0](https://github.com/mlaursen/react-md/compare/v2.2.0...v2.3.0) (2020-09-10)

**Note:** Version bump only for package [@react-md/app-bar](../app-bar)

## [2.2.2](https://github.com/mlaursen/react-md/compare/v2.2.1...v2.2.2) (2020-09-02)

**Note:** Version bump only for package [@react-md/app-bar](../app-bar)

## [2.2.1](https://github.com/mlaursen/react-md/compare/v2.2.0...v2.2.1) (2020-09-02)

**Note:** Version bump only for package [@react-md/app-bar](../app-bar)

# [2.2.0](https://github.com/mlaursen/react-md/compare/v2.1.2...v2.2.0) (2020-08-11)

**Note:** Version bump only for package [@react-md/app-bar](../app-bar)

## [2.1.2](https://github.com/mlaursen/react-md/compare/v2.1.1...v2.1.2) (2020-08-01)

**Note:** Version bump only for package [@react-md/app-bar](../app-bar)

## [2.1.1](https://github.com/mlaursen/react-md/compare/v2.1.0...v2.1.1) (2020-07-21)

**Note:** Version bump only for package [@react-md/app-bar](../app-bar)

# [2.1.0](https://github.com/mlaursen/react-md/compare/v2.0.4...v2.1.0) (2020-07-12)

### Bug Fixes

- `AppBar` text color now defaults to
  `rmd-theme-var(text-primary-on-background)`
  ([2c3ea5e](https://github.com/mlaursen/react-md/commit/2c3ea5e984b033b05098d01499a41a24790b639c))

## [2.0.2](https://github.com/mlaursen/react-md/compare/v2.0.1...v2.0.2) (2020-06-30)

### Bug Fixes

- **LICENSE:** Removed the time range from license since it was incorrect
  ([50c9021](https://github.com/mlaursen/react-md/commit/50c9021cedc0d642758b9fd541bb6c93d2fe1786))
- Added `sideEffects` field to `package.json`
  ([31820b9](https://github.com/mlaursen/react-md/commit/31820b9b43705e5849664500a17b6849eb6dc2a9))
- `sideEffects` formatting
  ([78a7b6b](https://github.com/mlaursen/react-md/commit/78a7b6b0e40c7daefb749835670705f21bd21720))

## v2.0.1

No changes.

## v2.0.0

This package is a replacement of the old `Toolbar` component in `v1` that has
now been separated into multiple components for additional customization.

Now exports:

- `AppBar`
- `AppBarTitle`
- `AppBarNav`
- `AppBarAction`

### New Behavior and Features

- now exports multiple components for rendering an `AppBar`
- now supports right-to-left languages out of the box to update margin and
  padding as needed
- can now be rendered at the bottom of the page
- better support for prominent sizing with nested `AppBar`s for rows
- slightly better support for automatic color inherit logic for `AppBar`
  specific components (means other components won't inherit the color
  automatically by default)
- the height no longer changes on mobile and tablet devices depending on if its
  orientation
- automatically updates the theme colors to have accessible text
- now supports multiple themes: `"primary"`, `"secondary"`, and `"default"`

### Breaking Changes

- the sizing behavior was updated to use a `height` prop instead of multiple
  boolean flags
- the `AppBar` no longer supports the `nav`, `title` `actions`, `actionLeft`,
  and `actionRight` props since they are new components that should be used as
  `children` of the `AppBar`
- no longer supports the `titleMenu` props since it is no longer required

#### New SCSS Variables, Functions, and Mixins

- `$rmd-app-bar-fixed-elevation: 2 !default` - the material design elevation
  (box-shadow) to apply when an `AppBar` is fixed to the top or bottom of the
  page
- `$rmd-app-bar-height: 3.5rem !default` - the default height for the app bar
- `$rmd-app-bar-dense-height: 3rem !default` - the dense height for the app bar
- `$rmd-app-bar-prominent-height: $rmd-app-bar-height * 2 !default` - the
  prominent height for the app bar
- `$rmd-app-bar-prominent-dense-height: $rmd-app-bar-dense-height * 2 !default` -
  the prominent and dense height for the app bar
- `$rmd-app-bar-nav-margin: $rmd-app-bar-keyline - (($rmd-button-icon-size - $rmd-icon-size) / 2)` -
  the amount of margin to apply to the `AppBarNav``
- `$rmd-app-bar-keyline: 1rem !default` - the default keyline to use for either
  the `AppBarNav` or `AppBarTitle` to align with other content on the page
- `$rmd-app-bar-lr-margin: 0.25rem !default` - the amount of margin to apply to
  the first and last elements in the `AppBar`
- `$rmd-app-bar-primary-background-color: rmd-theme-var(primary) !default` - the
  "primary" theme background-color
- `$rmd-app-bar-primary-color: rmd-theme-var(on-primary) !default` - the
  "primary" theme text color
- `$rmd-app-bar-secondary-background-color: rmd-theme-var(secondary) !default` -
  the "secondary" theme background-color
- `$rmd-app-bar-secondary-color: rmd-theme-var(on-secondary) !default` - the
  "secondary" theme text color
- `$rmd-app-bar-default-light-theme-background-color: $rmd-grey-100 !default` -
  the background color to use for the "default" theme on light themed apps
- `$rmd-app-bar-default-light-theme-color: if(rmd-theme-tone($rmd-app-bar-default-light-theme-background-color) == light, $rmd-black-base, $rmd-white-base) !default` -
  the text color to use for the "default" theme on light themed apps
- `$rmd-app-bar-default-dark-theme-background-color: $rmd-grey-900 !default` -
  the background color to use for the "default" theme on dark themed apps
- `$rmd-app-bar-default-dark-theme-color: if(rmd-theme-tone($rmd-app-bar-default-dark-theme-background-color) == light, $rmd-black-base, $rmd-white-base) !default` -
  the background color to use for the "default" theme on dark themed apps
- `$rmd-app-bar-default-background-color: if(rmd-theme-tone($rmd-theme-background) == light, $rmd-app-bar-default-light-theme-background-color, $rmd-app-bar-default-dark-theme-background-color) !default` -
  the background color to use for the "default" theme
- `$rmd-app-bar-default-color: if(rmd-theme-tone($rmd-app-bar-default-background-color) == light, $rmd-app-bar-default-light-theme-color, $rmd-app-bar-default-dark-theme-color) !default` -
  the text color to use for the "default" theme
- `@function rmd-app-bar-theme` - gets one of the theme values and validates
  that the theme name is valid
- `@function rmd-app-bar-theme-var` - gets one of the theme values as a css
  variable with a fallback value and validates that the theme name is valid
- `@mixin rmd-app-bar-theme` - applies one of the theme values to a css property
  as a css variable
- `@mixin rmd-app-bar-theme-update-var` - updates one of the theme values as a
  css variable
- `@mixin rmd-app-bar-offset($property: padding-top, $height-type: height)` - a
  mixin that can be used to apply one of the app bar's height types as a css
  property

#### Renamed SCSS Variables, Functions, and Mixins

- renamed `$md-toolbar-z-index` to `$rmd-app-bar-z-index` and changed the
  default value from `15` to `10`
- renamed `$md-toolbar-title-keyline` to `$rmd-app-bar-title-keyline` and
  changed the default value from `null` to `4.5rem`

#### Removed SCSS Variables Placeholders, and Mixins

- removed `$md-toolbar-include-themed` since it is no longer required
- removed `$md-toolbar-include-prominent` since it is no longer required
- removed `$md-toolbar-include-btn-text`, `$md-toolbar-btn-keyline`,
  `md-toolbar-mobile-btn-keyline`, `md-toolbar-tablet-btn-keyline`, and
  `md-toolbar-desktop-btn-keyline` since they are no longer required
- removed `$md-toolbar-include-text-fields` since it is no longer required
- removed `$md-toolbar-include-autocomplete` since it is no longer required
- removed `$md-toolbar-include-select-field`, `$md-toolbar-select-field-margin`,
  `$md-toolbar-mobile-select-field-margin`,
  `$md-toolbar-tablet-select-field-margin`,
  `$md-toolbar-tablet-landscape-select-field-margin`, and
  `$md-toolbar-desktop-select-field-margin` since they are no longer required
- removed `$m-toolbar-relative-padding` and
  `$md-toolbar-include-relative-padding-class-names` since the functionality was
  changed
- removed `$md-toolbar-inset-margin` since it is no longer required
- removed `$md-toolbar-mobile-title-keyline`,
  `$md-toolbar-tablet-title-keyline`, and `$md-toolbar-desktop-title-keyline`
  since they are no longer required
- removed `$md-toolbar-prominent-title-font-size` since it is no longer
  supported
- removed the `$md-toolbar-mobile-portrait-height`,
  `$md-toolbar-mobile-landscape-height`, `$md-toolbar-mobile-prominent-height`,
  `$md-toolbar-tablet-height`, `$md-toolbar-tablet-prominent-height`,
  `$md-toolbar-desktop-height`, `$md-toolbar-desktop-prominent-height`,
  `$md-toolbar-height`, and `$md-toolbar-prominent-height` in favor of the new
  height variables