- Update for liveview > 1.0
- Stop generating phx-feedback-for in favour of
Phoenix.Component.used_input? - Require Elixir 1.15
- Require Phoenix HTML 4.0 https://github.com/phoenixframework/phoenix_live_view/blob/v1.0/CHANGELOG.md#core-components
- Brought back
unchecked_value&checked_valuefor checkboxes inui_inputandui_raw_input.
- Changed
ui_tabsandui_tab_buttonto follow accessibility guidelines: replaced the<ul>with a<div role="tablist">and instead of nesting the buttons inside<li>s they are now the direct children of thedivand have arole="tab"set. As a side effect the gap between the tabs is now a little smaller. - Fix compiler warnings for elixir 17+ and upgrade dependencies.
- Switched bitstyles version comparisons from string comparisons to tuple comparisons, which will ensure correct output if bitstyles version ever contains a number above 9.
- Modified the process of downgrading classnames to the target bitstyles version by chaining renames. This is necessary preparation work to support bitstyles
v6.0.0. - Added support for bitstyles
v6.0.0. You can continue using bitstyles_phoenix with a lower bitstyles version, or migrate your codebase to bitstylesv6.0.0.
Follow the bitstyles changelog for version 6.0.0.
There are no changes to bitstyles_phoenix component APIs.
- Added support for phoenix_html
v4. You can also continue using phoenix_htmlv3. To replacePhoenix.HTML.Forminput helpers removed in phoenix_htmlv4, new componentsui_raw_inputandui_raw_labelwere added. - Added support for bitstyles
v5.0.0. You can continue using bitstyles_phoenix with a lower bitstyles version, or migrate your codebase to bitstylesv5.0.0.
Follow the bitstyles changelog 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.
- Bump LiveView.
- Add
Modalcomponent.
- Updated to LiveView 0.18.18.
- Add
CardandAvatarcomponents.
- Fixed version backwards compatibility.
- Add
heading_classoption toui_section_titleto set classes on the heading ui_dl_itemsnow aligns the items to the baseline (following the Bitstyles examples)- Updated to bitstyles
v4.3.0.
- Inputs now render a required label *. This can be configured via
required_labelconfig. If you do not want this new behaviour, define an empty component as required label.
- When
ui_buttonis 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.
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.
- Updated to LiveView 0.18.X
- Removed BitstylesPhoenix.Helpers.Button
- Removed
ui_button/2helper -> Use theui_buttoncomponent - Removed
ui_icon_button/3helper -> Use theui_icon_buttoncomponent
- Removed
ui_buttoncomponent now acts as a wrapper for Phoenix.Component.link- Removed
link_fnonui_buttoncomponent, since it's main use-case is now deprecated.
- Removed
- 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>...
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.
All ui_* component helpers are now instead HEEx function 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_tagtoui_error ui_inputdroppeddatetimeinput type (was not working anyways)ui_inputdroppedradioinput type (useui_unwrapped_inputwithradio_buttoninstead)ui_inputdroppedtextareainput type (useui_textareainstead)- Removed
ui_time/2without replacement for now - Removed
xclassnames/1. Useclassnames/1from the same module instead. classnames/1now returnsfalseinstead of empty string when there is no class set.- Removed
BitstylesPhoenix.Componentsmodule. Instead ofuse BitstylesPhoenix.Componentsdouse BitstylesPhoenix. - Removed all
e2e_classnameoptions. Useclassinstead, which will trim the e2e classes by default (like before). - Changed
trim_e2e_classesconfig. In order to migrate change the following=>config :bitstyles_phoenix, :trim_e2e_classes, falseconfig :bitstyles_phoenix, :trim_e2e_classes, [enabled: false]
- All components now accept extra attributes that are passed on to the outermost parent attribute.
- Config option to configure
classnames/1prefixes to remove other prefixes thane2e-instead (e.g.test-). - Backwards compatibility option for different versions of
bitstyles(seebitstyles_versionconfig option) - The
BitstylesPhoenix.Iconcomponentsfileattribute can now get a default value viaicon_fileapplication config. ui_dropdownandui_js_dropdown(Live/Alpine3) componentsBitstylesPhoenix.LiveandBitstylesPhoenix.Alpine3for quick imports of the live and alpine3 components- Integration tests and example configuration with the
demoapp - Added
ui_icon_button/2&ui_icon_button/3as helpers. - Added various new components:
Button,Tabs,Breadcrumbs,Sidebar,Dropdown,Content... - Added
iconoption toui_button. - Added support for
:datetimetype inui_input, rendered as Browser-native datetime input element
- Added dependency to
phoenix_live_view>= 1.17.0 (for usingsigil_H/1and new component syntax) - Doctest now use
flokito prettify the output HTML, so docs will be a nicer read. classnames/1is now imported by default withuse BitstylesPhoenix- Updated to bitstyles
v3.0.0 ui_errorsnow uses larger padding
- Updated
phoenix_htmldependency to~> 3. See its changelog for backwards incompatible changes.
- Added
link_fnoption inui_buttonto support LiveView'slive_patch/live_redirect
- Updated dependencies
- Update to bitstyles 1.5.0 (Update flash component padding)
- Fix
use BitstylesPhoenix.Components(see #34)
- Better documentation for form helpers
- Multiple errors on ones field are now rendered as a list
- Do not forward options from form helpers to each
labelanymore, but instead pass options throughlabel_opts. - Drop
hiddenandresetinput types forui_input.
- deprecated
ui_error/2in favour of the newui_errors/2
BitstylesPhoenix.UseSVG.ui_svg/2to display inline svg references with<use>tags and support for external SVGs.- Make
BitstylesPhoenix.Icon.ui_icon/2useui_svginternally to support theexternaloption.
- Fix icons in docs for
BitstylesPhoenix.Icon.ui_icon/2.
- 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
- Badge component
- Flash component
- New option to specify pixel width & height for SVG icons
- Added a CHANGELOG.md, this file
- Moved components from
BitstylesPhoenix.Components.*toBitstylesPhoenix.*. Not actionable if you useuse BitstylesPhoenix.Components