Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Implement used_input? instead of phx-feedback-for #382

Merged
merged 1 commit into from
Dec 11, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
46 changes: 18 additions & 28 deletions assets/default.css
Original file line number Diff line number Diff line change
Expand Up @@ -808,26 +808,22 @@
@apply mb-0;
}

:not(.phx-no-feedback).pc-form-field-wrapper--error input,
:not(.phx-no-feedback).pc-form-field-wrapper--error select,
:not(.phx-no-feedback).pc-form-field-wrapper--error textarea {
.pc-form-field-wrapper--error input,
.pc-form-field-wrapper--error select,
.pc-form-field-wrapper--error textarea {
@apply border-danger-500 focus:border-danger-500 text-danger-900 placeholder-danger-700 bg-danger-50 dark:text-danger-100 dark:placeholder-danger-300 dark:bg-danger-900 focus:ring-danger-500;
}
:not(.phx-no-feedback).pc-form-field-wrapper--error input[type="checkbox"] {
.pc-form-field-wrapper--error input[type="checkbox"] {
@apply bg-danger-200 dark:bg-danger-700;
}
:not(.phx-no-feedback).pc-form-field-wrapper--error
.pc-switch
.pc-switch__fake-input {
.pc-form-field-wrapper--error .pc-switch .pc-switch__fake-input {
@apply bg-danger-200 border-danger-500 dark:bg-danger-600 dark:border-danger-800;
}
:not(.phx-no-feedback).pc-form-field-wrapper--error
.pc-radio-card
.pc-radio-card__fake-input {
.pc-form-field-wrapper--error .pc-radio-card .pc-radio-card__fake-input {
@apply bg-danger-200 dark:bg-danger-800 border-danger-500;
}
:not(.phx-no-feedback).pc-form-field-wrapper--error .pc-label,
:not(.phx-no-feedback).pc-form-field-wrapper--error .pc-checkbox-label {
.pc-form-field-wrapper--error .pc-label,
.pc-form-field-wrapper--error .pc-checkbox-label {
@apply !text-danger-600 dark:!text-danger-200;
}
.pc-checkbox-label {
Expand All @@ -844,19 +840,9 @@
content: " *";
display: inline;
}
.phx-no-feedback.pc-error,
.phx-no-feedback .pc-error {
@apply hidden;
}
.pc-form-field-error {
@apply mt-1 text-xs italic text-danger-500;
}
.phx-no-feedback.pc-form-field-error {
@apply hidden;
}
.phx-no-feedback .pc-form-field-error {
@apply hidden;
}
.pc-form-help-text {
@apply mt-2 text-sm text-gray-500 dark:text-gray-400;
}
Expand Down Expand Up @@ -1015,7 +1001,7 @@
}

/* Add error state styles */
:not(.phx-no-feedback).pc-form-field-wrapper--error .pc-date-input-icon {
.pc-form-field-wrapper--error .pc-date-input-icon {
@apply bg-danger-50 dark:bg-danger-900;
}

Expand Down Expand Up @@ -2531,17 +2517,21 @@
@apply text-sm border-gray-300 rounded-md shadow-sm cursor-pointer disabled:bg-gray-100 disabled:cursor-not-allowed focus:border-primary-500 focus:ring-primary-500 dark:border-gray-600 dark:focus:border-primary-500 dark:bg-gray-800 dark:text-gray-300 focus:outline-none;
}

label.has-error:not(.phx-no-feedback) {
label.has-error {
@apply !text-danger-900 dark:!text-danger-200;
}

span.has-error {
@apply !text-danger-900 dark:!text-danger-200;
}

textarea.has-error:not(.phx-no-feedback),
input.has-error:not(.phx-no-feedback):not(:checked),
select.has-error:not(.phx-no-feedback) {
textarea.has-error,
input.has-error:not(:checked),
select.has-error {
@apply !border-danger-500 focus:!border-danger-500 !text-danger-900 !placeholder-danger-700 !bg-danger-50 dark:!text-danger-100 dark:!placeholder-danger-300 dark:!bg-danger-900 focus:!ring-danger-500;
}

input[type="file_input"].has-error:not(.phx-no-feedback) {
input[type="file_input"].has-error {
@apply !border-danger-500 !rounded-md focus:!border-danger-500 !text-danger-900 !placeholder-danger-700 !bg-danger-50 file:!border-none dark:!border-none dark:!bg-gray-950 dark:text-danger-400;
}

Expand Down
4 changes: 2 additions & 2 deletions lib/petal_components/accordion.ex
Original file line number Diff line number Diff line change
Expand Up @@ -89,7 +89,7 @@ defmodule PetalComponents.Accordion do
else: "pc-accordion-item__heading"
)
}>
<%= current_item.heading %>
{current_item.heading}
</span>

<%= if @variant == "ghost" do %>
Expand Down Expand Up @@ -134,7 +134,7 @@ defmodule PetalComponents.Accordion do
]
)
}>
<%= render_slot(current_item, current_item.entry) %>
{render_slot(current_item, current_item.entry)}
</div>
</div>
</div>
Expand Down
4 changes: 2 additions & 2 deletions lib/petal_components/alert.ex
Original file line number Diff line number Diff line change
Expand Up @@ -54,12 +54,12 @@ defmodule PetalComponents.Alert do
<div>
<%= if @heading do %>
<h2 id={@heading_id} class="pc-alert__heading">
<%= @heading %>
{@heading}
</h2>
<% end %>

<div id={@label_id} class="pc-alert__label">
<%= render_slot(@inner_block) || @label %>
{render_slot(@inner_block) || @label}
</div>
</div>

Expand Down
2 changes: 1 addition & 1 deletion lib/petal_components/avatar.ex
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,7 @@ defmodule PetalComponents.Avatar do
@class
]}
>
<%= generate_initials(@name) %>
{generate_initials(@name)}
</div>
<% else %>
<img
Expand Down
2 changes: 1 addition & 1 deletion lib/petal_components/badge.ex
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ defmodule PetalComponents.Badge do
@class
]}
>
<%= render_slot(@inner_block) || @label %>
{render_slot(@inner_block) || @label}
</badge>
"""
end
Expand Down
2 changes: 1 addition & 1 deletion lib/petal_components/breadcrumbs.ex
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@ defmodule PetalComponents.Breadcrumbs do
<.icon name={link[:icon]} class={["pc-breadcrumb-icon", link[:icon_class]]} />
<% end %>
<%= if link[:label] do %>
<%= link.label %>
{link.label}
<% end %>
</div>
</Link.a>
Expand Down
6 changes: 3 additions & 3 deletions lib/petal_components/button.ex
Original file line number Diff line number Diff line change
Expand Up @@ -69,7 +69,7 @@ defmodule PetalComponents.Button do
<% end %>
<% end %>

<%= render_slot(@inner_block) || @label %>
{render_slot(@inner_block) || @label}
</Link.a>
"""
end
Expand Down Expand Up @@ -134,11 +134,11 @@ defmodule PetalComponents.Button do
<%= if @loading do %>
<Loading.spinner show={true} size_class={"pc-icon-button-spinner--#{@size}"} />
<% else %>
<%= render_slot(@inner_block) %>
{render_slot(@inner_block)}

<div :if={@tooltip} role="tooltip" class="pc-icon-button__tooltip">
<span class="pc-icon-button__tooltip__text">
<%= @tooltip %>
{@tooltip}
</span>
<div class="pc-icon-button__tooltip__arrow"></div>
</div>
Expand Down
10 changes: 5 additions & 5 deletions lib/petal_components/button_group.ex
Original file line number Diff line number Diff line change
Expand Up @@ -95,9 +95,9 @@ defmodule PetalComponents.ButtonGroup do
{group_btn_assigns}
>
<%= if is_function(group_btn_assigns.inner_block) do %>
<%= render_slot(group_btn_assigns) %>
{render_slot(group_btn_assigns)}
<% else %>
<%= group_btn_assigns.label %>
{group_btn_assigns.label}
<% end %>
</.group_button>
</div>
Expand Down Expand Up @@ -129,7 +129,7 @@ defmodule PetalComponents.ButtonGroup do
class={[@class | group_btn_class(assigns)]}
{@rest}
>
<%= render_slot(@inner_block) %>
{render_slot(@inner_block)}
</button>
"""
end
Expand All @@ -140,15 +140,15 @@ defmodule PetalComponents.ButtonGroup do

~H"""
<button disabled aria-disabled class={[@class | group_btn_class(assigns)]} {@rest}>
<%= render_slot(@inner_block) %>
{render_slot(@inner_block)}
</button>
"""
end

defp group_button(%{kind: "link"} = assigns) do
~H"""
<.link class={[@class | group_btn_class(assigns)]} {@rest}>
<%= render_slot(@inner_block) %>
{render_slot(@inner_block)}
</.link>
"""
end
Expand Down
16 changes: 8 additions & 8 deletions lib/petal_components/card.ex
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ defmodule PetalComponents.Card do
~H"""
<div {@rest} class={["pc-card", "pc-card--#{@variant}", @class]}>
<div class="pc-card__inner">
<%= render_slot(@inner_block) %>
{render_slot(@inner_block)}
</div>
</div>
"""
Expand Down Expand Up @@ -50,14 +50,14 @@ defmodule PetalComponents.Card do
~H"""
<div {@rest} class={["pc-card__content", @class]}>
<div :if={@category} class={["pc-card__category", @category_color_class]}>
<%= @category %>
{@category}
</div>

<div :if={@heading} class="pc-card__heading">
<%= @heading %>
{@heading}
</div>

<%= render_slot(@inner_block) || @label %>
{render_slot(@inner_block) || @label}
</div>
"""
end
Expand All @@ -69,7 +69,7 @@ defmodule PetalComponents.Card do
def card_footer(assigns) do
~H"""
<div {@rest} class={["pc-card__footer", @class]}>
<%= render_slot(@inner_block) %>
{render_slot(@inner_block)}
</div>
"""
end
Expand All @@ -88,13 +88,13 @@ defmodule PetalComponents.Card do
<.avatar src={@img} alt={@name} size="md" />
<div class="pc-review-meta">
<figcaption>
<.p no_margin class="text-sm pc-review-name"><%= @name %></.p>
<.p no_margin class="text-sm pc-review-name">{@name}</.p>
</figcaption>
<p class="pc-review-username"><%= @username %></p>
<p class="pc-review-username">{@username}</p>
</div>
</div>
<blockquote class="pc-review-body">
<.p class="text-sm" no_margin><%= @body %></.p>
<.p class="text-sm" no_margin>{@body}</.p>
</blockquote>
</figure>
"""
Expand Down
2 changes: 1 addition & 1 deletion lib/petal_components/container.ex
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ defmodule PetalComponents.Container do
@class
]}
>
<%= render_slot(@inner_block) %>
{render_slot(@inner_block)}
</div>
"""
end
Expand Down
8 changes: 4 additions & 4 deletions lib/petal_components/dropdown.ex
Original file line number Diff line number Diff line change
Expand Up @@ -71,12 +71,12 @@ defmodule PetalComponents.Dropdown do
<span class="sr-only">Open options</span>

<%= if @label do %>
<%= @label %>
{@label}
<.icon name="hero-chevron-down-solid" class="w-5 h-5 pc-dropdown__chevron" />
<% end %>

<%= if @trigger_element do %>
<%= render_slot(@trigger_element) %>
{render_slot(@trigger_element)}
<% end %>

<%= if !@label && @trigger_element == [] do %>
Expand All @@ -97,7 +97,7 @@ defmodule PetalComponents.Dropdown do
aria-labelledby="options-menu"
>
<div class="py-1" role="none">
<%= render_slot(@inner_block) %>
{render_slot(@inner_block)}
</div>
</div>
</div>
Expand Down Expand Up @@ -126,7 +126,7 @@ defmodule PetalComponents.Dropdown do
role="menuitem"
{@rest}
>
<%= render_slot(@inner_block) || @label %>
{render_slot(@inner_block) || @label}
</Link.a>
"""
end
Expand Down
Loading
Loading