🧰 Cli: Creating a new explorer is now as simple as running the command uie init then npm run uie. Make sure to install the npm package @kalutheo/uie first
⚙️ Knobs: Allows you to edit values provided to your views in real time thanks to the amazing avh4/elm-debug-controls package
📱 Responsiveness: The layout is now 100% responsive. You can now easily browse your stories from your mobile devices
🌔 Dark mode: it' now possible to switch the explorer to a darkmode, just for your eyes 😎
storiesOf can now support spaces in label ( thanks @sporto)storiesOf "Checkout Widget"
ExternalMsg which facilitates interactivity testing within the explorer (thanks @francescortiz)new major release
🌳 Elm 0.19 Compatible: The code has been migrated to the latest version of Elm
🔌 Simplified Api: Just use the explore function and add your stories to get started
main : UIExplorerProgram {} () {}
main =
explore
defaultConfig [
storiesOf "Button"
[ ( "SignIn", \_ -> button "Sign In" "pink", {} )
, ( "SignOut", \_ -> button "Sign Out" "cyan", {} )
, ( "Loading", \_ -> button "Loading please wait..." "white", {} )
]
]
⚙️ Extensibility: Comes with built in plugins that can be used to extend the library. The Notes Plugin for instance enables markdown notes in your stories, which is great for documenting your UI. You can even define your own plugin that can supercharge the tool thanks to the new configuration system.
🖍 Customization : The configuration allows you to change the look and feel of the header. You can customize the title, the logo and even colors to make the explorer match your brand identity.
🎨 new design : A more subtle and minimalist design has been integrated to Elm UI Explorer. This allows us to focus more on your visual content and reduces noise.