Dialog

render NitroKit::Flex.new(
  dir: :row,
  gap: 1,
  align: :center,
  wrap: :nowrap,
  id: "gallery-dialog-transcript-actions"
) do
  render NitroKit::Button.new("Redact", size: :sm, variant: :destructive)
  render NitroKit::Button.new("Permalink", href: "#transcript-permalink", size: :sm)
  render NitroKit::Dialog.new(id: "gallery-dialog-transcript-details") do |dialog|
    dialog.trigger("Details", size: :sm)
    dialog.panel(title: "Transcript details") do
      p { "The panel block is the yielded application-content slot." }
    end
  end
end

render NitroKit::Dialog.new(id: "gallery-dialog-remove-member") do |dialog|
  dialog.trigger("Remove member", variant: :destructive)
  dialog.panel(
    title: "Remove Katherine Johnson?",
    description: "Katherine will immediately lose access to this workspace."
  ) do
    dialog.close_button(label: "Keep team member")
    form(
      action: "/gallery/destructive_action",
      method: "post",
      id: "gallery-dialog-delete-form"
    ) do
      input(type: "hidden", name: "_method", value: "delete")
      render NitroKit::Button.new(
        "Remove team member",
        type: :submit,
        variant: :destructive
      )
    end
  end
end

sample("Open nonmodal panel", slug: "nonmodal") do
  render NitroKit::Dialog.new(id: "gallery-dialog-open", dismissible: false) do |dialog|
    dialog.panel(
      title: "Release notes",
      description: "This server-rendered panel is deliberately nonmodal and stays open; dismissal would belong to a page action.",
      nonmodal: true
    )
  end
end
sample("Required decision", slug: "required-decision") do
  render NitroKit::Dialog.new(
    id: "gallery-dialog-required",
    dismissible: false
  ) do |dialog|
    dialog.trigger("Accept updated terms")
    dialog.panel(
      title: "Accept the updated terms",
      description: "This workspace cannot be used until an owner accepts the new processing terms."
    ) do
      render NitroKit::Button.new(
        "Accept terms",
        id: "gallery-dialog-required-accept",
        variant: :primary,
        html: { command: "close", commandfor: "gallery-dialog-required-panel" }
      )
    end
  end
end
sample("Disabled trigger", slug: "disabled-trigger") do
  render NitroKit::Dialog.new(id: "gallery-dialog-disabled") do |dialog|
    dialog.trigger("Unavailable action", disabled: true)
    dialog.panel(title: "Unavailable action") do
      dialog.close_button
    end
  end
end

render NitroKit::Dialog.new(id: "gallery-dialog-long") do |dialog|
  dialog.trigger("Read processing terms")
  dialog.panel(
    title: "Data processing terms",
    description: "Review the complete terms before accepting them for this workspace."
  ) do
    12.times do |index|
      p do
        "Section #{index + 1}. The processor handles workspace content only on documented " \
          "instructions from the controller, keeps every sub-processor under equivalent " \
          "obligations, and reports a personal-data breach without undue delay."
      end
    end
    dialog.close_button(label: "Close terms")
  end
end

render NitroKit::Dialog.new(id: "gallery-dialog-invite") do |dialog|
  dialog.trigger("Invite teammate", variant: :primary)
  dialog.panel(
    title: "Invite a teammate",
    description: "Choose an address and the role this person should receive."
  ) do
    form(id: "gallery-dialog-invite-form", action: "#invite", method: "post") do
      render NitroKit::FieldGroup.new do
        render NitroKit::Field.new(
          nil,
          :email,
          as: :email,
          id: "gallery-dialog-invite-email",
          name: "invitation[email]",
          value: "[email protected]",
          label: "Email",
          autocomplete: "email",
          required: true,
          html: { id: "gallery-dialog-invite-email-field" }
        )
        render NitroKit::Field.new(
          nil,
          :role,
          as: :select,
          id: "gallery-dialog-invite-role",
          name: "invitation[role]",
          value: "member",
          label: "Role",
          options: Gallery::Forms::TeamInvitation::ROLES,
          html: { id: "gallery-dialog-invite-role-field" }
        )
        render NitroKit::Button.new(
          "Send invitation",
          id: "gallery-dialog-invite-submit",
          type: :submit,
          variant: :primary
        )
      end
      dialog.close_button(label: "Cancel invitation")
    end
  end
end