%= content_tag(:div,
id: object.id,
data: object.data,
class: object.classname,
**combined_html_options) do %>
<%
# convert deprecated prop values
size = object.size
size = "sm" if object.size == "xs"
size = "md" if object.size == "lg"
%>
<% if object.unstyled %>
<% if object.show_icon %>
<%= pb_rails("icon", props: { custom_icon: Playbook::Engine.root.join(clock_icon), fixed_width: true }) %>
<% end %>
<%= content_tag(:time, datetime: object.pb_date_time.to_iso) do %>
<%= object.format_time_string %>
<% if object.show_timezone %>
<%= object.pb_date_time.to_timezone.upcase %>
<% end %>
<% end %>
<% elsif size == "md" %>
<% if object.show_icon %>
<%= pb_rails("body", props: { color: "light", tag: "span"}) do %>
<%= pb_rails("icon", props: { custom_icon: Playbook::Engine.root.join(clock_icon), fixed_width: true }) %>
<% end %>
<% end %>
<%= content_tag(:time, datetime: object.pb_date_time.to_iso) do %>
<%= pb_rails("body", props: { tag: "span", text: object.format_time_string, classname: "pb_time" }) %>
<% if object.show_timezone %>
<%= pb_rails("body", props: { color: "light", tag: "span", text: object.pb_date_time.to_timezone.upcase }) %>
<% end %>
<% end %>
<% else %>
<% if object.show_icon %>
<%= pb_rails("body", props: { color: "light", tag: "span"}) do %>
<%= pb_rails("icon", props: { custom_icon: Playbook::Engine.root.join(clock_icon), fixed_width: true, size: "sm" }) %>
<% end %>
<% end %>
<%= content_tag(:time, datetime: object.pb_date_time.to_iso) do %>
<%= pb_rails("caption", props: { color: "light", tag: "span", text: object.format_time_string }) do %>
<%= object.format_time_string %>
<% if object.show_timezone %>
<%= object.pb_date_time.to_timezone.upcase %>
<% end %>
<% end %>
<% end %>
<% end %>
<% end %>