All notable changes to Pine UI will be documented in this file.
The format is based on Keep a Changelog, and this project adheres to Semantic Versioning.
[0.2.1]
Added
Multi-select on
select_menu/1. Passmultiplefor removable chips, a clear-all control, an optionalmax, and a panel that stays open while you pick. It submits asname[], soPlugparses a list.The selection is expressed as one hidden input per option with the unselected ones disabled — disabled inputs are not submitted. That keeps the whole control server-rendered, so it needs no
x-forand therefore nophx-update="ignore"region for LiveView to work around.combobox/1— a text input with a filtered suggestion list that also accepts free text. Use it where the options are a convenience; useselect_menuwhere the value must be one of them.allow_custom={false}makes the list authoritative.tags_input/1— free-form tags as removable chips. Enter or the separator commits, Backspace on an empty input removes the last. Submits as one value joined byseparator.Demo pages for all three, and a
Comboboxmodule grouping the two new components.
[Unreleased]
Added
- Full Pines component parity (42 elements).
- Shipped assets:
priv/static/pine_ui.js(LiveView hooks + Alpine state preservation across DOM patches) andpriv/static/pine_ui.css([x-cloak]rule, marquee/retro-grid keyframes). - Declarative
attr/slotAPIs on every component, with:globalpassthrough forx-,phx-,aria-anddata-attributes. use PineUiPhoenixto import the whole set, withonly:,except:andprefix:options.- Dark mode (
dark:) variants throughout. - A demo application under
dev/, runnable withmix dev. - A real test suite.
Fixed
- Security: Alpine
x-datais now built by JSON-encoding a map rather than by string interpolation. This applies to the deprecated v0.1.x names too — they are now thin adapters onto the new components rather than a separate, unfixed implementation. The previousx-data={"{ tooltipText: '#{...}' }"}form broke on apostrophes and allowed expression injection through interpolated values. DataTable.basic/1rendered an empty<div>andDataTable.expandable/1rendered the literal string.... Both are now real implementations.progress_bar/1was defined twice; the second definition was unreachable.- ARIA attributes were emitted as literal strings (
aria-expanded="x-bind:aria-expanded='open'") instead of Alpine bindings. - Accordion panels hardcoded
id="accordion-content", colliding whenever two appeared on a page. Jason/Poisonwere called at render time despite being optional dependencies.Phoenix.HTMLwas imported without being declared as a dependency.
Changed
- Elixir 1.15 is now the minimum (was 1.14). The library's own code compiles on 1.14,
but its dependency closure no longer does —
plug1.20 andflokiboth require~> 1.15— so 1.14 could not be tested and was not a claim worth making. phoenix_live_viewis now a required dependency at>= 0.20.4(was>= 0.18.0, optional). The library cannot compile withoutPhoenix.Component.- Components adopt Pines' neutral palette in place of the previous indigo accent.
- Variants moved from function suffixes to attributes:
<.button variant="danger">replacesbutton_danger/1. All previous names remain available and are deprecated. :poisonis no longer a dependency;:jasonis required.
Changed (continued)
- The file uploader is rebuilt on LiveView's own
allow_upload/3asPineUiPhoenix.Extras.FileUpload. v0.1.x reimplemented progress and previews in Alpine withFileReader, which never actually uploaded anything to the server. Passupload={@uploads.avatar}for the LiveView mode, or nothing for a plain file input. select/1options: the new<.select>takes{label, value}tuples, matchingoptions_for_select/2. v0.1.x took{value, label}. The deprecatedselect/1wrapper swaps them for you, so existing calls are unaffected.
Deprecated
- The 53
PineUiPhoenix.*facade functions from v0.1.x, and the old sub-module entry points. They continue to work. See the Upgrading to v0.2 guide.
Removed
PineUiPhoenix.Application(an empty supervisor) andPineUiPhoenix.Types(unused aliases ofPhoenix.LiveView.Socket.assigns()).- The 18 internal v0.1.x component modules (~7,500 lines). They were a second implementation
carrying all the defects listed above. The deprecated public names now render through the
new components instead, so the fixes reach them.
PineUiPhoenix.Badge,PineUiPhoenix.Buttonand their siblings are gone; the publicPineUiPhoenix.badge/1style functions remain.
[0.1.3] - 2025-05-07
Added
New components:
- Accordion components:
accordion_item,accordion_group - Tabs components:
tabs,tabs_pills,tabs_boxed - Modal components:
modal,modal_full_screen,modal_side - Switch components:
switch,switch_labeled,switch_card - Dropdown components:
dropdown,dropdown_with_icons,context_menu - Progress components:
progress_bar,progress_circle,progress_steps - Pagination components:
pagination,pagination_simple,pagination_load_more - Toast components:
toast_container,toast,toast_trigger - File upload components:
file_uploader,image_uploader,multi_file_uploader - Image gallery components:
image_gallery,image_gallery_masonry,image_carousel - Data table components:
data_table,data_table_expandable - Date picker components:
date_picker,date_range_picker
- Accordion components:
Improved documentation and component grouping in ExDoc
[0.1.0] - 2023-03-29
Added
- Initial release with the following components:
- Text components: typing_effect, text_animation_blow, text_animation_fade
- Tooltip component with top, left, and right variants
- Button components: primary, secondary, danger with loading states
- Badge components: basic, dot, dismissible
- Card components: basic, interactive, collapsible
- Select components: basic, grouped, searchable
- TextInput components: basic, with_icon, textarea
- Documentation and examples
- Comprehensive test suite