Skip to content

Commit

Permalink
Remove large size options from SegmentedControl (#2551)
Browse files Browse the repository at this point in the history
  • Loading branch information
jonrohan authored Jan 31, 2024
1 parent 1d20198 commit 5340243
Show file tree
Hide file tree
Showing 14 changed files with 7 additions and 74 deletions.
5 changes: 5 additions & 0 deletions .changeset/red-parrots-tap.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"@primer/view-components": minor
---

Remove large size options from SegmentedControl
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
16 changes: 0 additions & 16 deletions app/components/primer/alpha/segmented_control.pcss
Original file line number Diff line number Diff line change
Expand Up @@ -50,22 +50,6 @@
}
}

.SegmentedControl--large {
& .SegmentedControl-item {
height: var(--control-large-size);

& .Button {
padding-inline: calc(var(--control-large-paddingInline-normal) - var(--segmentedControl-item-padding));
}
}

&.SegmentedControl--iconOnly {
& .SegmentedControl-item {
width: var(--control-large-size);
}
}
}

/* item */

.SegmentedControl-item {
Expand Down
1 change: 0 additions & 1 deletion app/components/primer/alpha/segmented_control.rb
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,6 @@ class SegmentedControl < Primer::Component
SIZE_MAPPINGS = {
:small => "SegmentedControl--small",
:medium => "SegmentedControl--medium",
:large => "SegmentedControl--large",
DEFAULT_SIZE => "SegmentedControl--medium"
}.freeze
SIZE_OPTIONS = SIZE_MAPPINGS.keys
Expand Down
53 changes: 1 addition & 52 deletions previews/primer/alpha/segmented_control_preview.rb
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ class SegmentedControlPreview < ViewComponent::Preview
# @param full_width [Boolean] toggle
# @param hide_labels [Boolean] toggle
# @param icon [Symbol] octicon
# @param size select [small, medium, large]
# @param size select [small, medium]
def playground(full_width: false, hide_labels: false, size: :medium, icon: :none)
if icon == :none
icon = hide_labels ? :zap : nil
Expand Down Expand Up @@ -55,17 +55,6 @@ def full_width_medium(hide_labels: false)
component.with_item(label: "Blame")
end
end

# @label Size large
# @param hide_labels [Boolean] toggle
# @snapshot
def full_width_large(hide_labels: false)
render(Primer::Alpha::SegmentedControl.new("aria-label": "File view", hide_labels: hide_labels, full_width: true, size: :large)) do |component|
component.with_item(label: "Preview", selected: true)
component.with_item(label: "Raw")
component.with_item(label: "Blame")
end
end
# @!endgroup

# @!group Icons and text
Expand All @@ -88,16 +77,6 @@ def icons_and_text_medium
component.with_item(label: "Blame", icon: :people)
end
end

# @label Size large
# @snapshot
def icons_and_text_large
render(Primer::Alpha::SegmentedControl.new("aria-label": "File view", size: :large)) do |component|
component.with_item(label: "Preview", icon: :eye, selected: true)
component.with_item(label: "Raw", icon: :"file-code")
component.with_item(label: "Blame", icon: :people)
end
end
# @!endgroup

# @!group Trailing Label
Expand All @@ -122,17 +101,6 @@ def trailing_label_width_medium
end
end
end

# @label Size large
# @snapshot
def trailing_label_width_large
render(Primer::Alpha::SegmentedControl.new("aria-label": "Billing duration", size: :large)) do |component|
component.with_item(label: "Monthly")
component.with_item(label: "Yearly", selected: true) do |button|
button.with_trailing_visual_label(scheme: :accent) { "-8%" }
end
end
end
# @!endgroup

# @!group Icons only
Expand All @@ -156,16 +124,6 @@ def icon_only_medium
end
end

# @label Size large
# @snapshot
def icon_only_large
render(Primer::Alpha::SegmentedControl.new("aria-label": "File view", hide_labels: true, size: :large)) do |component|
component.with_item(label: "Preview", icon: :eye, selected: true)
component.with_item(label: "Raw", icon: :"file-code")
component.with_item(label: "Blame", icon: :people)
end
end

# @label Full width, size small
def icon_only_full_width_small
render(Primer::Alpha::SegmentedControl.new("aria-label": "File view", hide_labels: true, full_width: true, size: :small)) do |component|
Expand All @@ -183,15 +141,6 @@ def icon_only_full_width_medium
component.with_item(label: "Blame", icon: :people)
end
end

# @label Full width, size large
def icon_only_full_width_large
render(Primer::Alpha::SegmentedControl.new("aria-label": "File view", hide_labels: true, full_width: true, size: :large)) do |component|
component.with_item(label: "Preview", icon: :eye, selected: true)
component.with_item(label: "Raw", icon: :"file-code")
component.with_item(label: "Blame", icon: :people)
end
end
# @!endgroup

# NOTE: this preview uses a group to force it's display below the other groups
Expand Down
3 changes: 0 additions & 3 deletions static/classes.json
Original file line number Diff line number Diff line change
Expand Up @@ -468,9 +468,6 @@
"SegmentedControl--iconOnly": [
"Primer::Alpha::SegmentedControl"
],
"SegmentedControl--large": [
"Primer::Alpha::SegmentedControl"
],
"SegmentedControl--medium": [
"Primer::Alpha::SegmentedControl"
],
Expand Down
3 changes: 1 addition & 2 deletions static/constants.json
Original file line number Diff line number Diff line change
Expand Up @@ -565,8 +565,7 @@
"Item": "Primer::Alpha::SegmentedControl::Item",
"SIZE_MAPPINGS": {
"small": "SegmentedControl--small",
"medium": "SegmentedControl--medium",
"large": "SegmentedControl--large"
"medium": "SegmentedControl--medium"
},
"SIZE_OPTIONS": [
"small",
Expand Down

0 comments on commit 5340243

Please sign in to comment.