From 683abd2bc83feed08b80a1e2856ffcbb6cf33408 Mon Sep 17 00:00:00 2001
From: Jon Rohan <rohan@github.com>
Date: Fri, 18 Oct 2024 16:32:42 -0700
Subject: [PATCH] Delete Primer::Alpha::ImageCrop (#3158)
---
.changeset/afraid-teachers-battle.md | 5 +
.../primer/alpha/image_crop.html.erb | 12 ---
app/components/primer/alpha/image_crop.rb | 28 ------
app/components/primer/alpha/image_crop.ts | 1 -
app/components/primer/primer.ts | 1 -
lib/primer/yard/component_manifest.rb | 1 -
previews/primer/alpha/image_crop_preview.rb | 31 ------
static/arguments.json | 28 ------
static/audited_at.json | 1 -
static/constants.json | 2 -
static/info_arch.json | 95 -------------------
static/previews.json | 47 ---------
static/statuses.json | 1 -
test/components/alpha/image_crop_test.rb | 35 -------
test/components/component_test.rb | 1 -
15 files changed, 5 insertions(+), 284 deletions(-)
create mode 100644 .changeset/afraid-teachers-battle.md
delete mode 100644 app/components/primer/alpha/image_crop.html.erb
delete mode 100644 app/components/primer/alpha/image_crop.rb
delete mode 100644 app/components/primer/alpha/image_crop.ts
delete mode 100644 previews/primer/alpha/image_crop_preview.rb
delete mode 100644 test/components/alpha/image_crop_test.rb
diff --git a/.changeset/afraid-teachers-battle.md b/.changeset/afraid-teachers-battle.md
new file mode 100644
index 0000000000..b984c4f588
--- /dev/null
+++ b/.changeset/afraid-teachers-battle.md
@@ -0,0 +1,5 @@
+---
+"@primer/view-components": minor
+---
+
+Delete Primer::Alpha::ImageCrop
diff --git a/app/components/primer/alpha/image_crop.html.erb b/app/components/primer/alpha/image_crop.html.erb
deleted file mode 100644
index 949168a24a..0000000000
--- a/app/components/primer/alpha/image_crop.html.erb
+++ /dev/null
@@ -1,12 +0,0 @@
-<%= render Primer::BaseComponent.new(**@system_arguments) do %>
- <% if loading.present? %>
- <%= loading %>
- <% else %>
- <%= render(Primer::Beta::Spinner.new(size: :large, flex: 1, "data-loading-slot": true)) %>
- <% end %>
-
- <input autocomplete="off" type="hidden" data-image-crop-input="x" name="cropped_x">
- <input autocomplete="off" type="hidden" data-image-crop-input="y" name="cropped_y">
- <input autocomplete="off" type="hidden" data-image-crop-input="width" name="cropped_width">
- <input autocomplete="off" type="hidden" data-image-crop-input="height" name="cropped_height">
-<% end %>
diff --git a/app/components/primer/alpha/image_crop.rb b/app/components/primer/alpha/image_crop.rb
deleted file mode 100644
index 41edacc9b3..0000000000
--- a/app/components/primer/alpha/image_crop.rb
+++ /dev/null
@@ -1,28 +0,0 @@
-# frozen_string_literal: true
-
-module Primer
- module Alpha
- # A client-side mechanism to crop images.
- class ImageCrop < Primer::Component
- # A loading indicator that is shown while the image is loading.
- # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
- renders_one :loading, lambda { |**system_arguments|
- deny_tag_argument(**system_arguments)
- system_arguments[:tag] = :div
- system_arguments[:"data-loading-slot"] = true
-
- Primer::BaseComponent.new(**system_arguments)
- }
-
- # @param src [String] The path of the image to crop.
- # @param rounded [Boolean] If the crop mask should be a circle. Defaults to true.
- # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
- def initialize(src:, rounded: true, **system_arguments)
- @system_arguments = deny_tag_argument(**system_arguments)
- @system_arguments[:tag] = "image-crop"
- @system_arguments[:src] = src
- @system_arguments[:rounded] = true if rounded
- end
- end
- end
-end
diff --git a/app/components/primer/alpha/image_crop.ts b/app/components/primer/alpha/image_crop.ts
deleted file mode 100644
index 099ef196e4..0000000000
--- a/app/components/primer/alpha/image_crop.ts
+++ /dev/null
@@ -1 +0,0 @@
-import '@github/image-crop-element'
diff --git a/app/components/primer/primer.ts b/app/components/primer/primer.ts
index 125370a546..99b644db63 100644
--- a/app/components/primer/primer.ts
+++ b/app/components/primer/primer.ts
@@ -9,7 +9,6 @@ import './focus_group'
import './scrollable_region'
import './aria_live'
import './shared_events'
-import './alpha/image_crop'
import './alpha/modal_dialog'
import './beta/nav_list'
import './beta/nav_list_group_element'
diff --git a/lib/primer/yard/component_manifest.rb b/lib/primer/yard/component_manifest.rb
index deababbf07..862aa41b7e 100644
--- a/lib/primer/yard/component_manifest.rb
+++ b/lib/primer/yard/component_manifest.rb
@@ -14,7 +14,6 @@ class ComponentManifest
Primer::Alpha::HellipButton => {},
Primer::Alpha::Image => {},
Primer::Alpha::OcticonSymbols => {},
- Primer::Alpha::ImageCrop => { js: true },
Primer::IconButton => { js: true },
Primer::Beta::AutoComplete => { js: true },
Primer::Beta::AutoComplete::Item => {},
diff --git a/previews/primer/alpha/image_crop_preview.rb b/previews/primer/alpha/image_crop_preview.rb
deleted file mode 100644
index 483d7d0021..0000000000
--- a/previews/primer/alpha/image_crop_preview.rb
+++ /dev/null
@@ -1,31 +0,0 @@
-# frozen_string_literal: true
-
-module Primer
- module Alpha
- # @label ImageCrop
- class ImageCropPreview < ViewComponent::Preview
- # @label Playground
- #
- # @param rounded [Boolean]
- def playground(rounded: false)
- render(Primer::Alpha::ImageCrop.new(src: Primer::ExampleImage::BASE64_SRC, rounded: rounded))
- end
-
- # @label Default Options
- #
- # @param rounded [Boolean]
- def default(rounded: false)
- render(Primer::Alpha::ImageCrop.new(src: Primer::ExampleImage::BASE64_SRC, rounded: rounded))
- end
-
- # @label Custom loading slot
- #
- # @param rounded [Boolean]
- def loading(rounded: false)
- render(Primer::Alpha::ImageCrop.new(src: Primer::ExampleImage::BASE64_SRC, rounded: rounded)) do |c|
- c.with_loading { "Loading..." }
- end
- end
- end
- end
-end
diff --git a/static/arguments.json b/static/arguments.json
index ac5ba9496b..7a778bac80 100644
--- a/static/arguments.json
+++ b/static/arguments.json
@@ -1351,34 +1351,6 @@
}
]
},
- {
- "component": "ImageCrop",
- "status": "alpha",
- "a11y_reviewed": false,
- "short_name": "ImageCrop",
- "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/image_crop.rb",
- "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/image_crop/default/",
- "parameters": [
- {
- "name": "src",
- "type": "String",
- "default": "N/A",
- "description": "The path of the image to crop."
- },
- {
- "name": "rounded",
- "type": "Boolean",
- "default": "`true`",
- "description": "If the crop mask should be a circle. Defaults to true."
- },
- {
- "name": "system_arguments",
- "type": "Hash",
- "default": "N/A",
- "description": "[System arguments](/system-arguments)"
- }
- ]
- },
{
"component": "Layout",
"status": "alpha",
diff --git a/static/audited_at.json b/static/audited_at.json
index 561518589f..5b789c3186 100644
--- a/static/audited_at.json
+++ b/static/audited_at.json
@@ -30,7 +30,6 @@
"Primer::Alpha::HellipButton": "",
"Primer::Alpha::HiddenTextExpander": "",
"Primer::Alpha::Image": "",
- "Primer::Alpha::ImageCrop": "",
"Primer::Alpha::Layout": "",
"Primer::Alpha::Layout::Main": "",
"Primer::Alpha::Layout::Sidebar": "",
diff --git a/static/constants.json b/static/constants.json
index 44a88b146b..4ff8bad5b1 100644
--- a/static/constants.json
+++ b/static/constants.json
@@ -356,8 +356,6 @@
},
"Primer::Alpha::Image": {
},
- "Primer::Alpha::ImageCrop": {
- },
"Primer::Alpha::Layout": {
"FIRST_IN_SOURCE_DEFAULT": "sidebar",
"FIRST_IN_SOURCE_OPTIONS": [
diff --git a/static/info_arch.json b/static/info_arch.json
index 2787f19776..999989f65d 100644
--- a/static/info_arch.json
+++ b/static/info_arch.json
@@ -4620,101 +4620,6 @@
]
},
- {
- "fully_qualified_name": "Primer::Alpha::ImageCrop",
- "description": "A client-side mechanism to crop images.",
- "accessibility_docs": null,
- "is_form_component": false,
- "is_published": true,
- "requires_js": true,
- "component": "ImageCrop",
- "status": "alpha",
- "a11y_reviewed": false,
- "short_name": "ImageCrop",
- "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/image_crop.rb",
- "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/image_crop/default/",
- "parameters": [
- {
- "name": "src",
- "type": "String",
- "default": "N/A",
- "description": "The path of the image to crop."
- },
- {
- "name": "rounded",
- "type": "Boolean",
- "default": "`true`",
- "description": "If the crop mask should be a circle. Defaults to true."
- },
- {
- "name": "system_arguments",
- "type": "Hash",
- "default": "N/A",
- "description": "{{link_to_system_arguments_docs}}"
- }
- ],
- "slots": [
- {
- "name": "loading",
- "description": "A loading indicator that is shown while the image is loading.",
- "parameters": [
- {
- "name": "system_arguments",
- "type": "Hash",
- "default": "N/A",
- "description": "{{link_to_system_arguments_docs}}"
- }
- ]
- }
- ],
- "methods": [
-
- ],
- "previews": [
- {
- "preview_path": "primer/alpha/image_crop/playground",
- "name": "playground",
- "snapshot": "false",
- "skip_rules": {
- "wont_fix": [
- "region"
- ],
- "will_fix": [
- "color-contrast"
- ]
- }
- },
- {
- "preview_path": "primer/alpha/image_crop/default",
- "name": "default",
- "snapshot": "false",
- "skip_rules": {
- "wont_fix": [
- "region"
- ],
- "will_fix": [
- "color-contrast"
- ]
- }
- },
- {
- "preview_path": "primer/alpha/image_crop/loading",
- "name": "loading",
- "snapshot": "false",
- "skip_rules": {
- "wont_fix": [
- "region"
- ],
- "will_fix": [
- "color-contrast"
- ]
- }
- }
- ],
- "subcomponents": [
-
- ]
- },
{
"fully_qualified_name": "Primer::Alpha::Layout",
"description": "`Layout` provides foundational patterns for responsive pages.\n`Layout` can be used for simple two-column pages, or it can be nested to provide flexible 3-column experiences.\n On smaller screens, `Layout` uses vertically stacked rows to display content.\n\n`Layout` flows as both column, when there's enough horizontal space to render both `Main` and `Sidebar`side-by-side (on a desktop of tablet device, per instance);\nor it flows as a row, when `Main` and `Sidebar` are stacked vertically (e.g. on a mobile device).\n`Layout` should always work in any screen size.",
diff --git a/static/previews.json b/static/previews.json
index 6640b09f2d..4b94cfb672 100644
--- a/static/previews.json
+++ b/static/previews.json
@@ -3978,53 +3978,6 @@
}
]
},
- {
- "name": "image_crop",
- "component": "ImageCrop",
- "status": "alpha",
- "lookup_path": "primer/alpha/image_crop",
- "examples": [
- {
- "preview_path": "primer/alpha/image_crop/playground",
- "name": "playground",
- "snapshot": "false",
- "skip_rules": {
- "wont_fix": [
- "region"
- ],
- "will_fix": [
- "color-contrast"
- ]
- }
- },
- {
- "preview_path": "primer/alpha/image_crop/default",
- "name": "default",
- "snapshot": "false",
- "skip_rules": {
- "wont_fix": [
- "region"
- ],
- "will_fix": [
- "color-contrast"
- ]
- }
- },
- {
- "preview_path": "primer/alpha/image_crop/loading",
- "name": "loading",
- "snapshot": "false",
- "skip_rules": {
- "wont_fix": [
- "region"
- ],
- "will_fix": [
- "color-contrast"
- ]
- }
- }
- ]
- },
{
"name": "label",
"component": "Label",
diff --git a/static/statuses.json b/static/statuses.json
index 6dc0518ebc..d93ff18cb8 100644
--- a/static/statuses.json
+++ b/static/statuses.json
@@ -30,7 +30,6 @@
"Primer::Alpha::HellipButton": "alpha",
"Primer::Alpha::HiddenTextExpander": "alpha",
"Primer::Alpha::Image": "alpha",
- "Primer::Alpha::ImageCrop": "alpha",
"Primer::Alpha::Layout": "alpha",
"Primer::Alpha::Layout::Main": "alpha",
"Primer::Alpha::Layout::Sidebar": "alpha",
diff --git a/test/components/alpha/image_crop_test.rb b/test/components/alpha/image_crop_test.rb
deleted file mode 100644
index e58cd8d3f3..0000000000
--- a/test/components/alpha/image_crop_test.rb
+++ /dev/null
@@ -1,35 +0,0 @@
-# frozen_string_literal: true
-
-require "components/test_helper"
-
-class PrimerAlphaImageCropTest < Minitest::Test
- include Primer::ComponentTestHelpers
-
- def test_simple
- render_inline(Primer::Alpha::ImageCrop.new(src: "image.png"))
-
- assert_selector("image-crop[data-view-component][src=\"image.png\"][rounded]") do
- assert_selector("svg.flex-1.anim-rotate")
- end
- end
-
- def test_square_cropper
- render_inline Primer::Alpha::ImageCrop.new(src: "image.png", rounded: false)
-
- assert_selector("image-crop[data-view-component][src=\"image.png\"]")
- end
-
- def test_custom_loading_element
- render_inline Primer::Alpha::ImageCrop.new(src: "image.png") do |crop|
- crop.with_loading do
- "Loading.."
- end
- end
-
- assert_selector("image-crop[data-view-component][src=\"image.png\"][rounded]") do
- assert_selector("div[data-loading-slot]") do
- assert_text("Loading..")
- end
- end
- end
-end
diff --git a/test/components/component_test.rb b/test/components/component_test.rb
index 931fa37228..54e3e215f3 100644
--- a/test/components/component_test.rb
+++ b/test/components/component_test.rb
@@ -33,7 +33,6 @@ class PrimerComponentTest < Minitest::Test
[Primer::Alpha::TabNav, { label: "label" }],
[Primer::Alpha::UnderlinePanels, { label: "Panel label" }],
[Primer::Alpha::Image, { src: "https://github.com/github.png", alt: "alt" }],
- [Primer::Alpha::ImageCrop, { src: "Foo" }],
[Primer::IconButton, { icon: :star, "aria-label": "Label" }],
[Primer::Alpha::ActionList, { aria: { label: "Action List" } }, lambda do |component|
component.with_item(label: "Foo")