openproject/app/components/open_project/common/attribute_component.html.erb

<div
  data-controller="attribute"
  data-attribute-background-reference-id-value="<%= background_reference_id %>"
  class="op-long-text-attribute">

  <%= render(
        Primer::Beta::Text.new(
          tag: :div,
          classes: ["op-long-text-attribute--text", PARAGRAPH_CSS_CLASS],
          color: text_color,
          style: "max-height: #{max_height};",
          data: {
            "attribute-target": "descriptionText"
          }
        )
      ) { short_text } %>

  <%= render(
        Primer::Beta::Text.new(
          tag: :div,
          display: display_expand_button_value,
          classes: "op-long-text-attribute--text-hider",
          data: { "attribute-target": "textHider" }
        )
      ) %>

  <%= render(
        Primer::Alpha::HiddenTextExpander.new(
          inline: false,
          "aria-label": I18n.t("label_attribute_expand_text", attribute: name),
          display: display_expand_button_value,
          data: {
            "attribute-target": "expandButton",
            "test-selector": "expand-button"
          },
          button_arguments: { "data-show-dialog-id": id },
          classes: "op-long-text-attribute--text-expander"
        )
      ) %>

  <%= render(
        Primer::Alpha::Dialog.new(
          id: id,
          data: {
            "test-selector": "attribute-dialog"
          },
          title: name,
          size: :large
        )
      ) do |component|
        component.with_body { full_text }
        component.with_header(variant: :large)
      end %>
</div>