Blog Blog

Petal Components v1.0 released - Configurability is here!

Name: Nicolas
Twitter: @nicolashoban

1 year ago

Petal Components v1.0 is now available 🔥

…and the best news is that it now supports configurability! Hooray 🎉

Watch the demo video on this link or click the image below to see just how easy it is to change styles.

Can’t wait to see what cool new styles you come up with and be sure to share them with us!

Links 🔗

Petal Boilerplate project

https://github.com/petalframework/petal_boilerplate

Petal Components docs:

https://petal.build/components

Referencing styles:

https://github.com/petalframework/petal_components/blob/main/assets/default.css

VScode Snippets

Extension:

https://marketplace.visualstudio.com/items?itemName=petalframework.vscode-petal-components-snippets

Cheatsheet:

https://petal.build/components/snippets

Component Requests

If you have any component requests, please create an issue on the Petal Components github repo.

Contributing

If you’d like to help out we’ve got a Phoenix umbrella app that allows you to easily contribute to Petal Components (which is installed as a git submodule). If you create a new component then feel free to submit a PR. Ideally one from the roadmap but we’re open to any new components that would benefit others!

Support

If you have any questions or concerns, please don’t hesitate to send us an email on support@petal.build or reach out to us over at our discord. We’re always happy to help!

The end

More posts

Liveview

Customer Success Story: How Munice Inc. Built a Valuable Custom Back-Office System with Petal Pro and Ash Customer Success Story: How Munice Inc. Built a Valuable Custom Back-Office System with Petal Pro and Ash

LiveView

Artificial Intelligence

Liveview

Building a Real-time Counter App with Phoenix Channels, Phoenix.PubSub, and Flutter In this tutorial, we'll build a simple real-time counter application using Phoenix as the backend and Flutter as the frontend. The counter will be stored on the server-side and transmitted to the Flutter app via WebSockets (Phoenix Channels).

LiveView

Phoenix

Component

Petal Components v2 - a11y support, button group, skeleton & more! Petal Components v2 - a11y support - button_group - skeleton & more!

Component

Liveview

Petal Pro 2.0 - Admin dashboard with graphs/stats, Persistent Notifications, AI-powered Chatbot, Admin can see current users & more. - Persistent Notifications - Admin dashboard with graphs/stats - AI-powered Chatbot using langchain - Admin can see current users & more.

LiveView

Phoenix

Artificial Intelligence

Design

Application UI

Liveview

Petal Pro 1.8.0 - JSON API, Collapsible Sidebar, Expanded User & Org Admin - JSON API: You can use the Petal Pro API for user management (register, sign in and update). It comes with OpenAPI support out of the box. Includes Swagger UI - Update: Can sync all Stripe subscriptions including cancelled ones - Added expanded user and org admin pages - Fixed: PetalProWeb.Controllers.UserAuth.disconnect_user_liveviews doesn't disconnect the user's live views #216 - Fixed: Passwordless sign in issue from latest Phoenix Live View fixed #222 - Update: Sidebar layout now collapsible

LiveView

Phoenix

Design

Component

Application UI

Powering AI Applications With The Petal Stack (Phoenix, Elixir, TailwindCSS, Alpine.js, LiveView): A Modern Approach In the rapidly evolving landscape of web development and artificial intelligence (AI), selecting the right stack for your project can be pivotal. For those venturing into building AI-powered applications, the combination of Phoenix/Elixir for the backend and (TailwindCSS, Alpine.js, LiveView) for the frontend emerges as a powerful and efficient choice.

Liveview

Petal Pro 1.7.0 - Stripe Billing support is here! - Stripe integration and billing support - can buy subscriptions and manage them - support for both individuals and orgs - Use `styler` for code formatting - Redesigned landing page components for a more modern look and feel

LiveView

Phoenix

Design

Component

Summary of: ElixirConf 2023 - Chris McCord - Phoenix Field Notes Summary of: ElixirConf 2023 - Chris McCord - Phoenix Field Notes - Longpolling as a backup for websockets - New data structure: Scope - DNS Cluster - help with distributed elixir - Distributed elixir is awesome - Easily find your HEEX components from the DOM - Can <option>-click anything in the browser and it takes you to the code in VSCode - Server logs in the client console - assign_async + <.async_result> - UploadWriter

Liveview

Petal Pro 1.6.0 - <.image_upload> component for uploading single images like avatars. Used in user settings - Local, Cloudinary and S3 support for <.image_upload> - User Impersonation

LiveView

Phoenix

Component

Application UI

Elixir for Python Developers Learn the essentials of the Elixir programming language from the point of view of a Python developer. Discover your next programming language now!