# Changelog
## v2.4.0 - 2024-07-18
- Added support for phoenix_html `v4`. You can also continue using phoenix_html `v3`. To replace `Phoenix.HTML.Form` input helpers removed in phoenix_html `v4`, new components `ui_raw_input` and `ui_raw_label` were added.
- Added support for bitstyles `v5.0.0`. You can continue using bitstyles_phoenix with a lower bitstyles version, or migrate your codebase to bitstyles `v5.0.0`.
### How to migrate to bitstyles `v5.0.0`
Follow the [bitstyles changelog](https://github.com/bitcrowd/bitstyles/blob/main/CHANGELOG.md#500---2023-01-03) for versions 5.0.0 and 5.0.0-alpha-1. Even if you're using the `BitstylesPhoenix.Helper.Classnames.classnames/1` helper to apply bitstyles classes in your own codebase, you will still need to migrate some of them yourself. For example, the class `u-gap-m` could not have been migrated via the helper because it exists in both bitstyles versions with different meanings (`u-gap-m` and `u-gap-l` in bitstyles 4.3.0 are equivalent to `u-gap-l` and `u-gap-xl` in bitstyles `v5.0.0`).
The `variant` attribute of the `Button` component is deprecated in bitstyles `v5.0.0`. Use the attributes `shape` and `color` instead.
## v2.3.1 - 2023-10-23
- Bump LiveView.
## v2.3.0 - 2023-05-15
- Add `Modal` component.
## v2.2.0 - 2023-03-20
- Updated to LiveView 0.18.18.
- Add `Card` and `Avatar` components.
## v2.1.1 - 2022-12-02
- Fixed version backwards compatibility.
## v2.1.0 - 2022-12-02
### Changed
- Add `heading_class` option to `ui_section_title` to set classes on the heading
- `ui_dl_items` now aligns the items to the baseline (following the Bitstyles examples)
- Updated to bitstyles `v4.3.0`.
### Added
- Inputs now render a required label *. This can be configured via `required_label` config. If you do not want this new behaviour, define an empty component as required label.
### Breaking
- When `ui_button` is disabled it always renders a button now instead of a link with a disabled property. In most cases this should be fine, but it could break e2e tests that check for links or similar things.
## v2.0.0 - 2022-11-12
Since there is quite some changes in liveview 0.18.0 mainly about link helpers this breaks with the existing API for the `ui_button` and
`ui_icon_button` components quite a lot. Since the underlying phoenix helper for generating links is now available as component as well,
the support for the `ui_button` as helper is dropped completely in favor of components.
### Breaking
- Updated to LiveView 0.18.X
- Removed BitstylesPhoenix.Helpers.Button
- Removed `ui_button/2` helper
-> Use the `ui_button` component
- Removed `ui_icon_button/3` helper
-> Use the `ui_icon_button` component
- `ui_button` component now acts as a wrapper for Phoenix.Component.link
- Removed `link_fn` on `ui_button` component, since it's main use-case is now deprecated.
### How to update:
- Upgrade to LiveView > 0.18
`<%= ui_button("some label", to: some_path) %>` => `<.ui_button href={some_path}>some label</.ui_button>`
`<.ui_button to={some_path} %>some label</.ui_button>` => `<.ui_button href={some_path}>some label</.ui_button>`
`<.ui_button to={some_path} link_fn={&live_redirect/2}%>some label</.ui_button>` => `<.ui_button navigate={some_path}>some label</.ui_button>`
`<.ui_button to={some_path} link_fn={&live_patch/2}%>some label</.ui_button>` => `<.ui_button patch={some_path}>some label</.ui_button>`
`<%= ui_icon_button("some label", to: some_path) %>` => `<.ui_icon_button href={some_path}>some label</.ui_button>`
...
## v1.0.0 - 2022-01-04
This version breaks with the existing API quite a lot 🔥, since we changed the library to take advantage of the recent developments in Phoenix and LiveView.
### Breaking
All `ui_*` component helpers are now instead [HEEx function components](https://hexdocs.pm/phoenix/views.html#html-components). They will expect the options and arguments
now through component attributes. The only exception is `ui_button`, which still delegate to the link_helper given via `link_fn`, but is also available as component.
In order to migrate to the new components update to Phoenix 1.6.0 and LiveView 1.17.0 and change all templates from
`*.html.eex` to `*.html.heex` to be able to use the new component syntax. After that you can change your previous `ui_*` helpers to use the new syntax:
`<%= ui_badge("foo", variant: "warning") %>` => `<.ui_badge variant: "warning">foo</.ui_badge>`
If you have contexts, where you do not want to use `heex` templates yet, you can call the functions via `Phoenix.LiveView.Helpers.component/2`.
Below is a list of changes that happened besides the componentization:
- Renamed `ui_error_tag` to `ui_error`
- `ui_input` dropped `datetime` input type (was not working anyways)
- `ui_input` dropped `radio` input type (use `ui_unwrapped_input` with `radio_button` instead)
- `ui_input` dropped `textarea` input type (use `ui_textarea` instead)
- Removed `ui_time/2` without replacement for now
- Removed `xclassnames/1`. Use `classnames/1` from the same module instead.
- `classnames/1` now returns `false` instead of empty string when there is no class set.
- Removed `BitstylesPhoenix.Components` module. Instead of `use BitstylesPhoenix.Components` do `use BitstylesPhoenix`.
- Removed all `e2e_classname` options. Use `class` instead, which will trim the e2e classes by default (like before).
- Changed `trim_e2e_classes` config. In order to migrate change the following
```
config :bitstyles_phoenix, :trim_e2e_classes, false
```
=>
```
config :bitstyles_phoenix, :trim_e2e_classes, [enabled: false]
```
### Added
- All components now accept extra attributes that are passed on to the outermost parent attribute.
- Config option to configure `classnames/1` prefixes to remove other prefixes than `e2e-` instead (e.g. `test-`).
- Backwards compatibility option for different versions of `bitstyles` (see `bitstyles_version` config option)
- The `BitstylesPhoenix.Icon` components `file` attribute can now get a default value via `icon_file` application config.
- `ui_dropdown` and `ui_js_dropdown` (Live/Alpine3) components
- `BitstylesPhoenix.Live` and `BitstylesPhoenix.Alpine3` for quick imports of the live and alpine3 components
- Integration tests and example configuration with the `demo` app
- Added `ui_icon_button/2` & `ui_icon_button/3` as helpers.
- Added various new components: `Button`, `Tabs`, `Breadcrumbs`, `Sidebar`, `Dropdown`, `Content` ...
- Added `icon` option to `ui_button`.
- Added support for `:datetime` type in `ui_input`, rendered as Browser-native datetime input element
### Changed
- Added dependency to `phoenix_live_view` >= 1.17.0 (for using `sigil_H/1` and new component syntax)
- Doctest now use `floki` to prettify the output HTML, so docs will be a nicer read.
- `classnames/1` is now imported by default with `use BitstylesPhoenix`
- Updated to bitstyles `v3.0.0`
- `ui_errors` now uses larger padding
## v0.8.0
### Changed
- Updated `phoenix_html` dependency to `~> 3`. See [its changelog](https://github.com/phoenixframework/phoenix_html/blob/master/CHANGELOG.md) for backwards incompatible changes.
## v0.7.0
- Added `link_fn` option in `ui_button` to support LiveView's `live_patch`/`live_redirect`
## v0.6.0
### Changed
- Updated dependencies
### Breaking
- Update to bitstyles 1.5.0 (Update flash component padding)
## v0.5.1
### Fixed
- Fix `use BitstylesPhoenix.Components` (see https://github.com/bitcrowd/bitstyles_phoenix/pull/34)
## v0.5.0
### Added
- Better documentation for form helpers
### Changes
- Multiple errors on ones field are now rendered as a list
### Breaking/Bugfix
- Do not forward options from form helpers to each `label` anymore, but instead pass options through `label_opts`.
- Drop `hidden` and `reset` input types for `ui_input`.
### Deprecations
- deprecated `ui_error/2` in favour of the new `ui_errors/2`
## v0.4.0
### Added
- `BitstylesPhoenix.UseSVG.ui_svg/2` to display inline svg references with `<use>` tags and support for external SVGs.
- Make `BitstylesPhoenix.Icon.ui_icon/2` use `ui_svg` internally to support the `external` option.
### Fixes
- Fix icons in docs for `BitstylesPhoenix.Icon.ui_icon/2`.
## v0.3.0
### Changes
- Examples and showcases are now inlined and doctested, to assure they won't break and to be more scalable for more components.
- Restructured top level module doc
### Added
- Badge component
- Flash component
- New option to specify pixel width & height for SVG icons
- Added a CHANGELOG.md, this file
### Breaking
- Moved components from `BitstylesPhoenix.Components.*` to `BitstylesPhoenix.*`. Not actionable if you use `use BitstylesPhoenix.Components`