@primer/view-components 0.35.0-rc.ab9e1260 → 0.35.0-rc.ad5f177a

Sign up to get free protection for your applications and to get access to all the features.
Files changed (73) hide show
  1. package/app/assets/javascripts/{app/components → components}/primer/primer.d.ts +3 -4
  2. package/app/assets/javascripts/primer_view_components.js +1 -1
  3. package/app/assets/javascripts/primer_view_components.js.map +1 -1
  4. package/app/assets/styles/primer_view_components.css +1 -1
  5. package/app/assets/styles/primer_view_components.css.map +1 -1
  6. package/app/components/primer/alpha/action_bar_element.js +0 -3
  7. package/app/components/primer/alpha/action_list.css +1 -1
  8. package/app/components/primer/alpha/auto_complete.css +1 -1
  9. package/app/components/primer/alpha/banner.css +1 -1
  10. package/app/components/primer/alpha/dialog.css +1 -1
  11. package/app/components/primer/alpha/dialog.css.json +2 -1
  12. package/app/components/primer/alpha/dropdown.css +1 -1
  13. package/app/components/primer/alpha/select_panel_element.js +9 -3
  14. package/app/components/primer/alpha/stack.css +1 -0
  15. package/app/components/primer/alpha/stack.css.json +90 -0
  16. package/app/components/primer/alpha/stack_item.css +1 -0
  17. package/app/components/primer/alpha/stack_item.css.json +12 -0
  18. package/app/components/primer/alpha/tab_nav.css +1 -1
  19. package/app/components/primer/alpha/text_field.css +1 -1
  20. package/app/components/primer/alpha/toggle_switch.css +1 -1
  21. package/app/components/primer/alpha/underline_nav.css +1 -1
  22. package/app/components/primer/beta/avatar.css +1 -1
  23. package/app/components/primer/beta/avatar_stack.css +1 -1
  24. package/app/components/primer/beta/blankslate.css +1 -1
  25. package/app/components/primer/beta/border_box.css +1 -1
  26. package/app/components/primer/beta/button.css +1 -1
  27. package/app/components/primer/beta/counter.css +1 -1
  28. package/app/components/primer/beta/popover.css +1 -1
  29. package/app/components/primer/beta/progress_bar.css +1 -1
  30. package/app/components/primer/beta/state.css +1 -1
  31. package/app/components/primer/dialog_helper.js +0 -1
  32. package/app/components/primer/primer.d.ts +3 -4
  33. package/app/components/primer/primer.js +3 -4
  34. package/package.json +9 -10
  35. package/static/arguments.json +104 -28
  36. package/static/audited_at.json +2 -1
  37. package/static/classes.json +6 -0
  38. package/static/constants.json +148 -7
  39. package/static/info_arch.json +229 -95
  40. package/static/previews.json +107 -47
  41. package/static/statuses.json +2 -1
  42. package/app/assets/javascripts/app/components/primer/alpha/image_crop.d.ts +0 -1
  43. package/app/components/primer/alpha/image_crop.d.ts +0 -1
  44. package/app/components/primer/alpha/image_crop.js +0 -1
  45. /package/app/assets/javascripts/{app/components → components}/primer/alpha/action_bar_element.d.ts +0 -0
  46. /package/app/assets/javascripts/{app/components → components}/primer/alpha/action_list.d.ts +0 -0
  47. /package/app/assets/javascripts/{app/components → components}/primer/alpha/action_menu/action_menu_element.d.ts +0 -0
  48. /package/app/assets/javascripts/{app/components → components}/primer/alpha/dropdown/menu.d.ts +0 -0
  49. /package/app/assets/javascripts/{app/components → components}/primer/alpha/dropdown.d.ts +0 -0
  50. /package/app/assets/javascripts/{app/components → components}/primer/alpha/modal_dialog.d.ts +0 -0
  51. /package/app/assets/javascripts/{app/components → components}/primer/alpha/segmented_control.d.ts +0 -0
  52. /package/app/assets/javascripts/{app/components → components}/primer/alpha/select_panel_element.d.ts +0 -0
  53. /package/app/assets/javascripts/{app/components → components}/primer/alpha/tab_container.d.ts +0 -0
  54. /package/app/assets/javascripts/{app/components → components}/primer/alpha/toggle_switch.d.ts +0 -0
  55. /package/app/assets/javascripts/{app/components → components}/primer/alpha/tool_tip.d.ts +0 -0
  56. /package/app/assets/javascripts/{app/components → components}/primer/alpha/x_banner.d.ts +0 -0
  57. /package/app/assets/javascripts/{app/components → components}/primer/anchored_position.d.ts +0 -0
  58. /package/app/assets/javascripts/{app/components → components}/primer/aria_live.d.ts +0 -0
  59. /package/app/assets/javascripts/{app/components → components}/primer/beta/auto_complete/auto_complete.d.ts +0 -0
  60. /package/app/assets/javascripts/{app/components → components}/primer/beta/clipboard_copy.d.ts +0 -0
  61. /package/app/assets/javascripts/{app/components → components}/primer/beta/nav_list.d.ts +0 -0
  62. /package/app/assets/javascripts/{app/components → components}/primer/beta/nav_list_group_element.d.ts +0 -0
  63. /package/app/assets/javascripts/{app/components → components}/primer/beta/relative_time.d.ts +0 -0
  64. /package/app/assets/javascripts/{app/components → components}/primer/dialog_helper.d.ts +0 -0
  65. /package/app/assets/javascripts/{app/components → components}/primer/focus_group.d.ts +0 -0
  66. /package/app/assets/javascripts/{app/components → components}/primer/scrollable_region.d.ts +0 -0
  67. /package/app/assets/javascripts/{app/components → components}/primer/shared_events.d.ts +0 -0
  68. /package/{lib → app/lib}/primer/forms/primer_multi_input.d.ts +0 -0
  69. /package/{lib → app/lib}/primer/forms/primer_multi_input.js +0 -0
  70. /package/{lib → app/lib}/primer/forms/primer_text_field.d.ts +0 -0
  71. /package/{lib → app/lib}/primer/forms/primer_text_field.js +0 -0
  72. /package/{lib → app/lib}/primer/forms/toggle_switch_input.d.ts +0 -0
  73. /package/{lib → app/lib}/primer/forms/toggle_switch_input.js +0 -0
@@ -1 +1 @@
1
- :root{--duration-fast:80ms;--easing-easeInOut:cubic-bezier(0.65,0,0.35,1)}.Button{align-items:center;background-color:initial;border:var(--borderWidth-thin) solid;border-color:#0000;border-radius:var(--borderRadius-medium);color:var(--button-default-fgColor-rest);cursor:pointer;display:inline-flex;flex-direction:row;font-size:var(--text-body-size-medium);font-weight:var(--base-text-weight-medium);gap:var(--base-size-4);height:var(--control-medium-size);justify-content:space-between;min-width:max-content;padding:0 var(--control-medium-paddingInline-normal);position:relative;text-align:center;transition:var(--duration-fast) var(--easing-easeInOut);transition-property:color,fill,background-color,border-color;-webkit-user-select:none;user-select:none}@media (pointer:coarse){:is(.Button:before){content:"";height:100%;left:50%;min-height:48px;min-width:48px;position:absolute;top:50%;transform:translateX(-50%) translateY(-50%);width:100%}}.Button:hover{transition-duration:var(--duration-fast)}.Button:active{transition:none}.Button:disabled,.Button[aria-disabled=true]{box-shadow:none;cursor:not-allowed}.Button.Button--iconOnly{color:var(--fgColor-muted)}:is(a.Button,summary.Button):hover{-webkit-text-decoration:none;text-decoration:none}.Button-content{align-items:center;display:grid;flex:1 0 auto;grid-template-areas:"leadingVisual text trailingVisual";grid-template-columns:min-content minmax(0,auto) min-content;place-content:center}.Button-content>:not(:last-child){margin-right:var(--control-medium-gap)}.Button-content--alignStart{justify-content:start}.Button-visual{display:flex;pointer-events:none}.Button-visual .Counter{background-color:var(--buttonCounter-default-bgColor-rest);color:inherit}.Button-label{grid-area:text;line-height:var(--text-body-lineHeight-medium);white-space:nowrap}.Button-leadingVisual{grid-area:leadingVisual}.Button-leadingVisual svg{fill:currentcolor}.Button-trailingVisual{grid-area:trailingVisual}.Button-trailingAction{margin-right:calc(var(--base-size-4)*-1)}.Button--small{font-size:var(--text-body-size-small);gap:var(--control-small-gap);height:var(--control-small-size);min-width:var(--control-small-size);padding:0 var(--control-small-paddingInline-condensed)}.Button--small .Button-label{line-height:var(--text-body-lineHeight-small)}:is(.Button--small .Button-content)>:not(:last-child){margin-right:var(--control-small-gap)}.Button--large{gap:var(--control-large-gap);height:var(--control-large-size);padding:0 var(--control-large-paddingInline-spacious)}.Button--large .Button-label{line-height:var(--text-body-lineHeight-large)}:is(.Button--large .Button-content)>:not(:last-child){margin-right:var(--control-large-gap)}.Button--fullWidth{width:100%}.Button--labelWrap{height:unset;min-height:var(--control-medium-size);min-width:-moz-fit-content;min-width:fit-content}.Button--labelWrap .Button-content{align-self:stretch;flex:1 1 auto;padding-block:calc(var(--control-medium-paddingBlock) - 2px)}.Button--labelWrap .Button-label{white-space:unset}.Button--labelWrap.Button--small{height:unset;min-height:var(--control-small-size)}.Button--labelWrap.Button--small .Button-content{padding-block:calc(var(--control-small-paddingBlock) - 2px)}.Button--labelWrap.Button--large{height:unset;min-height:var(--control-large-size);padding-inline:var(--control-large-paddingInline-spacious)}.Button--labelWrap.Button--large .Button-content{padding-block:calc(var(--control-large-paddingBlock) - 2px)}.Button--primary{color:var(--button-primary-fgColor-rest);fill:var(--button-primary-iconColor-rest);background-color:var(--button-primary-bgColor-rest);border-color:var(--button-primary-borderColor-rest);box-shadow:var(--shadow-resting-small,var(--color-btn-primary-shadow))}.Button--primary.Button--iconOnly{color:var(--button-primary-iconColor-rest)}.Button--primary:hover:not(:disabled,.Button--inactive){background-color:var(--button-primary-bgColor-hover);border-color:var(--button-primary-borderColor-hover)}.Button--primary:focus{box-shadow:inset 0 0 0 3px var(--fgColor-onEmphasis);outline:2px solid var(--focus-outlineColor);outline-offset:-2px}.Button--primary:focus:not(:focus-visible){box-shadow:none;outline:1px solid #0000}.Button--primary:focus-visible{box-shadow:inset 0 0 0 3px var(--fgColor-onEmphasis);outline:2px solid var(--focus-outlineColor);outline-offset:-2px}.Button--primary:active:not(:disabled),.Button--primary[aria-pressed=true]{background-color:var(--button-primary-bgColor-active);box-shadow:var(--button-primary-shadow-selected)}.Button--primary:disabled,.Button--primary[aria-disabled=true]{background-color:var(--button-primary-bgColor-disabled);border-color:var(--button-primary-borderColor-disabled);color:var(--button-primary-fgColor-disabled);fill:var(--button-primary-fgColor-disabled)}.Button--primary .Counter{background-color:var(--buttonCounter-primary-bgColor-rest);color:inherit}.Button--secondary{color:var(--button-default-fgColor-rest);fill:var(--fgColor-muted);background-color:var(--button-default-bgColor-rest);border-color:var(--button-default-borderColor-rest);box-shadow:var(--button-default-shadow-resting),var(--button-default-shadow-inset)}.Button--secondary:hover:not(:disabled,.Button--inactive){background-color:var(--button-default-bgColor-hover);border-color:var(--button-default-borderColor-hover)}.Button--secondary:active:not(:disabled){background-color:var(--button-default-bgColor-active);border-color:var(--button-default-borderColor-active)}.Button--secondary[aria-pressed=true]{background-color:var(--button-default-bgColor-selected);box-shadow:var(--shadow-inset)}.Button--secondary:disabled,.Button--secondary[aria-disabled=true]{background-color:var(--button-default-bgColor-disabled);border-color:var(--button-default-borderColor-disabled);color:var(--control-fgColor-disabled);fill:var(--control-fgColor-disabled)}.Button--invisible{color:var(--button-invisible-fgColor-rest)}.Button--invisible.Button--iconOnly{color:var(--button-invisible-iconColor-rest,var(--color-fg-muted))}.Button--invisible:hover:not(:disabled,.Button--inactive){background-color:var(--control-transparent-bgColor-hover,var(--color-action-list-item-default-hover-bg))}.Button--invisible:active:not(:disabled),.Button--invisible[aria-pressed=true]{background-color:var(--button-invisible-bgColor-active)}.Button--invisible:disabled,.Button--invisible[aria-disabled=true]{background-color:var(--button-invisible-bgColor-disabled);border-color:var(--button-invisible-borderColor-disabled);color:var(--button-invisible-fgColor-disabled);fill:var(--button-invisible-fgColor-disabled)}.Button--invisible.Button--invisible-noVisuals .Button-label{color:var(--button-invisible-fgColor-rest)}.Button--invisible .Button-visual{color:var(--button-invisible-iconColor-rest,var(--color-fg-muted))}:is(.Button--invisible .Button-visual) .Counter{color:var(--fgColor-default)}.Button--link{color:var(--fgColor-link);fill:var(--fgColor-link);border:none;display:inline-block;font-size:inherit;height:unset;min-width:-moz-fit-content;min-width:fit-content;padding:0}.Button--link:hover:not(:disabled,.Button--inactive){-webkit-text-decoration:underline;text-decoration:underline}.Button--link:focus,.Button--link:focus-visible{outline-offset:2px}.Button--link:disabled,.Button--link[aria-disabled=true]{background-color:initial;border-color:#0000;color:var(--control-fgColor-disabled);fill:var(--control-fgColor-disabled)}.Button--link .Button-label{white-space:unset}.Button--danger{color:var(--button-danger-fgColor-rest);fill:var(--button-danger-iconColor-rest);background-color:var(--button-danger-bgColor-rest);border-color:var(--button-danger-borderColor-rest);box-shadow:var(--button-default-shadow-resting),var(--button-default-shadow-inset)}.Button--danger.Button--iconOnly{color:var(--button-danger-iconColor-rest)}.Button--danger:hover:not(:disabled,.Button--inactive){color:var(--button-danger-fgColor-hover);fill:var(--button-danger-fgColor-hover);background-color:var(--button-danger-bgColor-hover);border-color:var(--button-danger-borderColor-hover);box-shadow:var(--shadow-resting-small)}.Button--danger:hover:not(:disabled,.Button--inactive) .Counter{background-color:var(--buttonCounter-danger-bgColor-hover);color:var(--buttonCounter-danger-fgColor-hover)}.Button--danger:active:not(:disabled),.Button--danger[aria-pressed=true]{color:var(--button-danger-fgColor-active);fill:var(--button-danger-fgColor-active);background-color:var(--button-danger-bgColor-active);border-color:var(--button-danger-borderColor-active);box-shadow:var(--button-danger-shadow-selected)}.Button--danger:disabled,.Button--danger[aria-disabled=true]{color:var(--button-danger-fgColor-disabled);fill:var(--button-danger-fgColor-disabled);background-color:var(--button-danger-bgColor-disabled);border-color:var(--button-default-borderColor-disabled)}:is(.Button--danger:disabled,.Button--danger[aria-disabled=true]) .Counter{background-color:var(--buttonCounter-danger-bgColor-disabled);color:var(--buttonCounter-danger-fgColor-disabled)}.Button--danger .Counter{background-color:var(--buttonCounter-danger-bgColor-rest);color:var(--buttonCounter-danger-fgColor-rest)}.Button--iconOnly{display:inline-grid;padding:unset;place-content:center;width:var(--control-medium-size)}.Button--iconOnly.Button--small{width:var(--control-small-size)}.Button--iconOnly.Button--large{width:var(--control-large-size)}.Button--inactive:not([aria-disabled=true],:disabled){background-color:var(--button-inactive-bgColor);border:0;color:var(--button-inactive-fgColor);cursor:default}
1
+ :root{--duration-fast:80ms;--easing-easeInOut:cubic-bezier(0.65,0,0.35,1)}.Button{align-items:center;background-color:initial;border:var(--borderWidth-thin) solid;border-color:#0000;border-radius:var(--borderRadius-medium);color:var(--button-default-fgColor-rest);cursor:pointer;display:inline-flex;flex-direction:row;font-size:var(--text-body-size-medium);font-weight:var(--base-text-weight-medium);gap:var(--base-size-4);height:var(--control-medium-size);justify-content:space-between;min-width:max-content;padding:0 var(--control-medium-paddingInline-normal);position:relative;text-align:center;transition:var(--duration-fast) var(--easing-easeInOut);transition-property:color,fill,background-color,border-color;-webkit-user-select:none;user-select:none}@media (pointer:coarse){:is(.Button:before){content:"";height:100%;left:50%;min-height:48px;min-width:48px;position:absolute;top:50%;transform:translateX(-50%) translateY(-50%);width:100%}}.Button:hover{transition-duration:var(--duration-fast)}.Button:active{transition:none}.Button:disabled,.Button[aria-disabled=true]{box-shadow:none;cursor:not-allowed}.Button.Button--iconOnly{color:var(--fgColor-muted)}:is(a.Button,summary.Button):hover{-webkit-text-decoration:none;text-decoration:none}.Button-content{align-items:center;display:grid;flex:1 0 auto;grid-template-areas:"leadingVisual text trailingVisual";grid-template-columns:min-content minmax(0,auto) min-content;place-content:center}.Button-content>:not(:last-child){margin-right:var(--control-medium-gap)}.Button-content--alignStart{justify-content:start}.Button-visual{display:flex;pointer-events:none}.Button-visual .Counter{background-color:var(--buttonCounter-default-bgColor-rest);color:inherit}.Button-label{grid-area:text;line-height:var(--text-body-lineHeight-medium);white-space:nowrap}.Button-leadingVisual{grid-area:leadingVisual}.Button-leadingVisual svg{fill:currentcolor}.Button-trailingVisual{grid-area:trailingVisual}.Button-trailingAction{margin-right:calc(var(--base-size-4)*-1)}.Button--small{font-size:var(--text-body-size-small);gap:var(--control-small-gap);height:var(--control-small-size);min-width:var(--control-small-size);padding:0 var(--control-small-paddingInline-condensed)}.Button--small .Button-label{line-height:var(--text-body-lineHeight-small)}:is(.Button--small .Button-content)>:not(:last-child){margin-right:var(--control-small-gap)}.Button--large{gap:var(--control-large-gap);height:var(--control-large-size);padding:0 var(--control-large-paddingInline-spacious)}.Button--large .Button-label{line-height:var(--text-body-lineHeight-large)}:is(.Button--large .Button-content)>:not(:last-child){margin-right:var(--control-large-gap)}.Button--fullWidth{width:100%}.Button--labelWrap{height:unset;min-height:var(--control-medium-size);min-width:-moz-fit-content;min-width:fit-content}.Button--labelWrap .Button-content{align-self:stretch;flex:1 1 auto;padding-block:calc(var(--control-medium-paddingBlock) - var(--base-size-2))}.Button--labelWrap .Button-label{white-space:unset}.Button--labelWrap.Button--small{height:unset;min-height:var(--control-small-size)}.Button--labelWrap.Button--small .Button-content{padding-block:calc(var(--control-small-paddingBlock) - var(--base-size-2))}.Button--labelWrap.Button--large{height:unset;min-height:var(--control-large-size);padding-inline:var(--control-large-paddingInline-spacious)}.Button--labelWrap.Button--large .Button-content{padding-block:calc(var(--control-large-paddingBlock) - var(--base-size-2))}.Button--primary{color:var(--button-primary-fgColor-rest);fill:var(--button-primary-iconColor-rest);background-color:var(--button-primary-bgColor-rest);border-color:var(--button-primary-borderColor-rest);box-shadow:var(--shadow-resting-small,var(--color-btn-primary-shadow))}.Button--primary.Button--iconOnly{color:var(--button-primary-iconColor-rest)}.Button--primary:hover:not(:disabled,.Button--inactive){background-color:var(--button-primary-bgColor-hover);border-color:var(--button-primary-borderColor-hover)}.Button--primary:focus{box-shadow:inset 0 0 0 3px var(--fgColor-onEmphasis);outline:2px solid var(--focus-outlineColor);outline-offset:-2px}.Button--primary:focus:not(:focus-visible){box-shadow:none;outline:1px solid #0000}.Button--primary:focus-visible{box-shadow:inset 0 0 0 3px var(--fgColor-onEmphasis);outline:2px solid var(--focus-outlineColor);outline-offset:-2px}.Button--primary:active:not(:disabled),.Button--primary[aria-pressed=true]{background-color:var(--button-primary-bgColor-active);box-shadow:var(--button-primary-shadow-selected)}.Button--primary:disabled,.Button--primary[aria-disabled=true]{color:var(--button-primary-fgColor-disabled);fill:var(--button-primary-fgColor-disabled);background-color:var(--button-primary-bgColor-disabled);border-color:var(--button-primary-borderColor-disabled)}.Button--primary .Counter{background-color:var(--buttonCounter-primary-bgColor-rest);color:inherit}.Button--secondary{color:var(--button-default-fgColor-rest);fill:var(--fgColor-muted);background-color:var(--button-default-bgColor-rest);border-color:var(--button-default-borderColor-rest);box-shadow:var(--button-default-shadow-resting),var(--button-default-shadow-inset)}.Button--secondary:hover:not(:disabled,.Button--inactive){background-color:var(--button-default-bgColor-hover);border-color:var(--button-default-borderColor-hover)}.Button--secondary:active:not(:disabled){background-color:var(--button-default-bgColor-active);border-color:var(--button-default-borderColor-active)}.Button--secondary[aria-pressed=true]{background-color:var(--button-default-bgColor-selected);box-shadow:var(--shadow-inset)}.Button--secondary:disabled,.Button--secondary[aria-disabled=true]{color:var(--control-fgColor-disabled);fill:var(--control-fgColor-disabled);background-color:var(--button-default-bgColor-disabled);border-color:var(--button-default-borderColor-disabled)}.Button--invisible{color:var(--button-invisible-fgColor-rest)}.Button--invisible.Button--iconOnly{color:var(--button-invisible-iconColor-rest,var(--color-fg-muted))}.Button--invisible:hover:not(:disabled,.Button--inactive){background-color:var(--control-transparent-bgColor-hover,var(--color-action-list-item-default-hover-bg))}.Button--invisible:active:not(:disabled),.Button--invisible[aria-pressed=true]{background-color:var(--button-invisible-bgColor-active)}.Button--invisible:disabled,.Button--invisible[aria-disabled=true]{color:var(--button-invisible-fgColor-disabled);fill:var(--button-invisible-fgColor-disabled);background-color:var(--button-invisible-bgColor-disabled);border-color:var(--button-invisible-borderColor-disabled)}.Button--invisible.Button--invisible-noVisuals .Button-label{color:var(--button-invisible-fgColor-rest)}.Button--invisible .Button-visual{color:var(--button-invisible-iconColor-rest,var(--color-fg-muted))}:is(.Button--invisible .Button-visual) .Counter{color:var(--fgColor-default)}.Button--link{color:var(--fgColor-link);display:inline-block;font-size:inherit;height:unset;min-width:-moz-fit-content;min-width:fit-content;padding:0;fill:var(--fgColor-link);border:none}.Button--link:hover:not(:disabled,.Button--inactive){-webkit-text-decoration:underline;text-decoration:underline}.Button--link:focus,.Button--link:focus-visible{outline-offset:2px}.Button--link:disabled,.Button--link[aria-disabled=true]{color:var(--control-fgColor-disabled);fill:var(--control-fgColor-disabled);background-color:initial;border-color:#0000}.Button--link .Button-label{white-space:unset}.Button--danger{color:var(--button-danger-fgColor-rest);fill:var(--button-danger-iconColor-rest);background-color:var(--button-danger-bgColor-rest);border-color:var(--button-danger-borderColor-rest);box-shadow:var(--button-default-shadow-resting),var(--button-default-shadow-inset)}.Button--danger.Button--iconOnly{color:var(--button-danger-iconColor-rest)}.Button--danger:hover:not(:disabled,.Button--inactive){color:var(--button-danger-fgColor-hover);fill:var(--button-danger-fgColor-hover);background-color:var(--button-danger-bgColor-hover);border-color:var(--button-danger-borderColor-hover);box-shadow:var(--shadow-resting-small)}.Button--danger:hover:not(:disabled,.Button--inactive) .Counter{background-color:var(--buttonCounter-danger-bgColor-hover);color:var(--buttonCounter-danger-fgColor-hover)}.Button--danger:active:not(:disabled),.Button--danger[aria-pressed=true]{color:var(--button-danger-fgColor-active);fill:var(--button-danger-fgColor-active);background-color:var(--button-danger-bgColor-active);border-color:var(--button-danger-borderColor-active);box-shadow:var(--button-danger-shadow-selected)}.Button--danger:disabled,.Button--danger[aria-disabled=true]{color:var(--button-danger-fgColor-disabled);fill:var(--button-danger-fgColor-disabled);background-color:var(--button-danger-bgColor-disabled);border-color:var(--button-default-borderColor-disabled)}:is(.Button--danger:disabled,.Button--danger[aria-disabled=true]) .Counter{background-color:var(--buttonCounter-danger-bgColor-disabled);color:var(--buttonCounter-danger-fgColor-disabled)}.Button--danger .Counter{background-color:var(--buttonCounter-danger-bgColor-rest);color:var(--buttonCounter-danger-fgColor-rest)}.Button--iconOnly{display:inline-grid;padding:unset;place-content:center;width:var(--control-medium-size)}.Button--iconOnly.Button--small{width:var(--control-small-size)}.Button--iconOnly.Button--large{width:var(--control-large-size)}.Button--inactive:not([aria-disabled=true],:disabled){background-color:var(--button-inactive-bgColor);border:0;color:var(--button-inactive-fgColor);cursor:default}
@@ -1 +1 @@
1
- .Counter{background-color:var(--bgColor-neutral-muted,var(--color-neutral-muted));border:var(--borderWidth-thin) solid var(--counter-borderColor);border-radius:2em;color:var(--fgColor-default);display:inline-block;font-size:var(--text-body-size-small);font-weight:var(--base-text-weight-medium);line-height:calc(var(--base-size-20) - var(--borderWidth-thin)*2);min-width:var(--base-size-20);padding:0 6px;text-align:center}.Counter:empty{display:none}.Counter .octicon{opacity:.8;vertical-align:text-top}.Counter--primary{background-color:var(--bgColor-neutral-emphasis);color:var(--fgColor-onEmphasis)}.Counter--secondary{background-color:var(--bgColor-neutral-muted);color:var(--fgColor-muted)}
1
+ .Counter{background-color:var(--bgColor-neutral-muted,var(--color-neutral-muted));border:var(--borderWidth-thin) solid var(--counter-borderColor);border-radius:2em;color:var(--fgColor-default);display:inline-block;font-size:var(--text-body-size-small);font-weight:var(--base-text-weight-medium);line-height:calc(var(--base-size-20) - var(--borderWidth-thin)*2);min-width:var(--base-size-20);padding:0 var(--base-size-6);text-align:center}.Counter:empty{display:none}.Counter .octicon{opacity:.8;vertical-align:text-top}.Counter--primary{background-color:var(--bgColor-neutral-emphasis);color:var(--fgColor-onEmphasis)}.Counter--secondary{background-color:var(--bgColor-neutral-muted);color:var(--fgColor-muted)}
@@ -1 +1 @@
1
- .Popover{position:absolute;z-index:100}.Popover-message{background-color:var(--overlay-bgColor);border:var(--borderWidth-thin) solid var(--borderColor-default);border-radius:var(--borderRadius-medium);box-shadow:var(--shadow-floating-legacy,var(--color-shadow-large))!important;margin-left:auto;margin-right:auto;position:relative;width:232px}.Popover-message:after,.Popover-message:before{content:"";display:inline-block;left:50%;position:absolute}.Popover-message:before{border:8px solid #0000;border-bottom:8px solid var(--borderColor-default);margin-left:-9px;top:-16px}.Popover-message:after{border:7px solid #0000;border-bottom:7px solid var(--overlay-bgColor);margin-left:-8px;top:-14px}.Popover-message--no-caret:after,.Popover-message--no-caret:before{display:none}:is(.Popover-message--bottom,.Popover-message--bottom-right,.Popover-message--bottom-left):after,:is(.Popover-message--bottom,.Popover-message--bottom-right,.Popover-message--bottom-left):before{border-bottom-color:#0000;top:auto}:is(.Popover-message--bottom,.Popover-message--bottom-right,.Popover-message--bottom-left):before{border-top-color:var(--borderColor-default);bottom:-16px}:is(.Popover-message--bottom,.Popover-message--bottom-right,.Popover-message--bottom-left):after{border-top-color:var(--overlay-bgColor);bottom:-14px}.Popover-message--bottom-right,.Popover-message--top-right{margin-right:0;right:-9px}:is(.Popover-message--top-right,.Popover-message--bottom-right):after,:is(.Popover-message--top-right,.Popover-message--bottom-right):before{left:auto;margin-left:0}:is(.Popover-message--top-right,.Popover-message--bottom-right):before{right:20px}:is(.Popover-message--top-right,.Popover-message--bottom-right):after{right:21px}.Popover-message--bottom-left,.Popover-message--top-left{left:-9px;margin-left:0}:is(.Popover-message--top-left,.Popover-message--bottom-left):after,:is(.Popover-message--top-left,.Popover-message--bottom-left):before{left:24px;margin-left:0}:is(.Popover-message--top-left,.Popover-message--bottom-left):after{left:25px}:is(.Popover-message--right,.Popover-message--right-top,.Popover-message--right-bottom,.Popover-message--left,.Popover-message--left-top,.Popover-message--left-bottom):after,:is(.Popover-message--right,.Popover-message--right-top,.Popover-message--right-bottom,.Popover-message--left,.Popover-message--left-top,.Popover-message--left-bottom):before{border-bottom-color:#0000;left:auto;margin-left:0;top:50%}:is(.Popover-message--right,.Popover-message--right-top,.Popover-message--right-bottom,.Popover-message--left,.Popover-message--left-top,.Popover-message--left-bottom):before{margin-top:-9px}:is(.Popover-message--right,.Popover-message--right-top,.Popover-message--right-bottom,.Popover-message--left,.Popover-message--left-top,.Popover-message--left-bottom):after{margin-top:-8px}:is(.Popover-message--right,.Popover-message--right-top,.Popover-message--right-bottom):before{border-left-color:var(--borderColor-default);right:-16px}:is(.Popover-message--right,.Popover-message--right-top,.Popover-message--right-bottom):after{border-left-color:var(--overlay-bgColor);right:-14px}:is(.Popover-message--left,.Popover-message--left-top,.Popover-message--left-bottom):before{border-right-color:var(--borderColor-default);left:-16px}:is(.Popover-message--left,.Popover-message--left-top,.Popover-message--left-bottom):after{border-right-color:var(--overlay-bgColor);left:-14px}:is(.Popover-message--right-top,.Popover-message--left-top):after,:is(.Popover-message--right-top,.Popover-message--left-top):before{top:24px}:is(.Popover-message--right-bottom,.Popover-message--left-bottom):after,:is(.Popover-message--right-bottom,.Popover-message--left-bottom):before{top:auto}:is(.Popover-message--right-bottom,.Popover-message--left-bottom):before{bottom:16px}:is(.Popover-message--right-bottom,.Popover-message--left-bottom):after{bottom:17px}@media (min-width:544px){.Popover-message--large{min-width:320px}}@media (max-width:767.98px){.Popover{bottom:0!important;left:0!important;position:fixed;right:0!important;top:auto!important}.Popover-message{bottom:auto;left:auto;margin:var(--stack-gap-condensed);right:auto;top:auto;width:auto!important}.Popover-message>.btn-octicon{padding:var(--control-medium-paddingInline-normal)!important}.Popover-message:after,.Popover-message:before{display:none}}
1
+ .Popover{position:absolute;z-index:100}.Popover-message{background-color:var(--overlay-bgColor);border:var(--borderWidth-thin) solid var(--borderColor-default);border-radius:var(--borderRadius-medium);box-shadow:var(--shadow-floating-legacy,var(--color-shadow-large))!important;margin-left:auto;margin-right:auto;position:relative;width:232px}.Popover-message:after,.Popover-message:before{content:"";display:inline-block;left:50%;position:absolute}.Popover-message:before{border:8px solid #0000;border-bottom:8px solid var(--borderColor-default);margin-left:-9px;top:-16px}.Popover-message:after{border:7px solid #0000;border-bottom:7px solid var(--overlay-bgColor);margin-left:-8px;top:-14px}.Popover-message--no-caret:after,.Popover-message--no-caret:before{display:none}:is(.Popover-message--bottom,.Popover-message--bottom-right,.Popover-message--bottom-left):after,:is(.Popover-message--bottom,.Popover-message--bottom-right,.Popover-message--bottom-left):before{border-bottom-color:#0000;top:auto}:is(.Popover-message--bottom,.Popover-message--bottom-right,.Popover-message--bottom-left):before{border-top-color:var(--borderColor-default);bottom:-16px}:is(.Popover-message--bottom,.Popover-message--bottom-right,.Popover-message--bottom-left):after{border-top-color:var(--overlay-bgColor);bottom:-14px}.Popover-message--bottom-right,.Popover-message--top-right{margin-right:0;right:-9px}:is(.Popover-message--top-right,.Popover-message--bottom-right):after,:is(.Popover-message--top-right,.Popover-message--bottom-right):before{left:auto;margin-left:0}:is(.Popover-message--top-right,.Popover-message--bottom-right):after,:is(.Popover-message--top-right,.Popover-message--bottom-right):before{right:var(--base-size-20)}.Popover-message--bottom-left,.Popover-message--top-left{left:-9px;margin-left:0}:is(.Popover-message--top-left,.Popover-message--bottom-left):after,:is(.Popover-message--top-left,.Popover-message--bottom-left):before{left:var(--base-size-24);margin-left:0}:is(.Popover-message--top-left,.Popover-message--bottom-left):after{left:var(--base-size-24)}:is(.Popover-message--right,.Popover-message--right-top,.Popover-message--right-bottom,.Popover-message--left,.Popover-message--left-top,.Popover-message--left-bottom):after,:is(.Popover-message--right,.Popover-message--right-top,.Popover-message--right-bottom,.Popover-message--left,.Popover-message--left-top,.Popover-message--left-bottom):before{border-bottom-color:#0000;left:auto;margin-left:0;top:50%}:is(.Popover-message--right,.Popover-message--right-top,.Popover-message--right-bottom,.Popover-message--left,.Popover-message--left-top,.Popover-message--left-bottom):before{margin-top:-9px}:is(.Popover-message--right,.Popover-message--right-top,.Popover-message--right-bottom,.Popover-message--left,.Popover-message--left-top,.Popover-message--left-bottom):after{margin-top:-8px}:is(.Popover-message--right,.Popover-message--right-top,.Popover-message--right-bottom):before{border-left-color:var(--borderColor-default);right:-16px}:is(.Popover-message--right,.Popover-message--right-top,.Popover-message--right-bottom):after{border-left-color:var(--overlay-bgColor);right:-14px}:is(.Popover-message--left,.Popover-message--left-top,.Popover-message--left-bottom):before{border-right-color:var(--borderColor-default);left:-16px}:is(.Popover-message--left,.Popover-message--left-top,.Popover-message--left-bottom):after{border-right-color:var(--overlay-bgColor);left:-14px}:is(.Popover-message--right-top,.Popover-message--left-top):after,:is(.Popover-message--right-top,.Popover-message--left-top):before{top:var(--base-size-24)}:is(.Popover-message--right-bottom,.Popover-message--left-bottom):after,:is(.Popover-message--right-bottom,.Popover-message--left-bottom):before{top:auto}:is(.Popover-message--right-bottom,.Popover-message--left-bottom):after,:is(.Popover-message--right-bottom,.Popover-message--left-bottom):before{bottom:var(--base-size-16)}@media (min-width:544px){.Popover-message--large{min-width:320px}}@media (max-width:767.98px){.Popover{bottom:0!important;left:0!important;position:fixed;right:0!important;top:auto!important}.Popover-message{bottom:auto;left:auto;margin:var(--stack-gap-condensed);right:auto;top:auto;width:auto!important}.Popover-message>.btn-octicon{padding:var(--control-medium-paddingInline-normal)!important}.Popover-message:after,.Popover-message:before{display:none}}
@@ -1 +1 @@
1
- .Progress{background-color:var(--bgColor-neutral-muted);border-radius:6px;display:flex;height:8px;outline:1px solid #0000;overflow:hidden}.Progress--large{height:10px}.Progress--small{height:5px}.Progress-item{outline:2px solid #0000}.Progress-item+.Progress-item{margin-left:2px}
1
+ .Progress{background-color:var(--bgColor-neutral-muted);border-radius:var(--borderRadius-medium);display:flex;height:8px;outline:1px solid #0000;overflow:hidden}.Progress--large{height:10px}.Progress--small{height:5px}.Progress-item{outline:2px solid #0000}.Progress-item+.Progress-item{margin-left:var(--base-size-2)}
@@ -1 +1 @@
1
- .State,.state{border-radius:2em;display:inline-block;font-size:var(--text-body-size-medium);font-weight:var(--base-text-weight-medium);line-height:var(--control-medium-lineBoxHeight);padding:5px var(--control-medium-paddingInline-normal);text-align:center;white-space:nowrap}.State,.State--draft,.state{background-color:var(--bgColor-neutral-emphasis);border:var(--borderWidth-thin) solid #0000;box-shadow:var(--boxShadow-thin) var(--borderColor-neutral-emphasis);color:var(--fgColor-onEmphasis)}.State--open{background-color:var(--bgColor-open-emphasis,var(--color-open-emphasis));box-shadow:var(--boxShadow-thin) var(--borderColor-open-emphasis)}.State--merged,.State--open{color:var(--fgColor-onEmphasis)}.State--merged{background-color:var(--bgColor-done-emphasis,var(--color-done-emphasis));box-shadow:var(--boxShadow-thin) var(--borderColor-done-emphasis)}.State--closed{background-color:var(--bgColor-closed-emphasis,var(--color-closed-emphasis));box-shadow:var(--boxShadow-thin) var(--borderColor-closed-emphasis);color:var(--fgColor-onEmphasis)}.State--small{font-size:var(--text-body-size-small);line-height:var(--base-size-24);padding:0 10px}.State--small .octicon{width:1em}
1
+ .State,.state{border-radius:2em;display:inline-block;font-size:var(--text-body-size-medium);font-weight:var(--base-text-weight-medium);line-height:var(--control-medium-lineBoxHeight);padding:var(--base-size-4) var(--control-medium-paddingInline-normal);text-align:center;white-space:nowrap}.State,.State--draft,.state{background-color:var(--bgColor-neutral-emphasis);border:var(--borderWidth-thin) solid #0000;box-shadow:var(--boxShadow-thin) var(--borderColor-neutral-emphasis);color:var(--fgColor-onEmphasis)}.State--open{background-color:var(--bgColor-open-emphasis,var(--color-open-emphasis));box-shadow:var(--boxShadow-thin) var(--borderColor-open-emphasis)}.State--merged,.State--open{color:var(--fgColor-onEmphasis)}.State--merged{background-color:var(--bgColor-done-emphasis,var(--color-done-emphasis));box-shadow:var(--boxShadow-thin) var(--borderColor-done-emphasis)}.State--closed{background-color:var(--bgColor-closed-emphasis,var(--color-closed-emphasis));box-shadow:var(--boxShadow-thin) var(--borderColor-closed-emphasis);color:var(--fgColor-onEmphasis)}.State--small{font-size:var(--text-body-size-small);line-height:var(--base-size-24);padding:0 10px}.State--small .octicon{width:1em}
@@ -115,7 +115,6 @@ export class DialogHelperElement extends HTMLElement {
115
115
  _DialogHelperElement_abortController = new WeakMap(), _DialogHelperElement_instances = new WeakSet(), _DialogHelperElement_handleDialogOpenAttribute = function _DialogHelperElement_handleDialogOpenAttribute() {
116
116
  if (!this.dialog)
117
117
  return;
118
- this.ownerDocument.body.classList.toggle('has-modal', this.dialog.matches(':modal'));
119
118
  // We don't want to show the Dialog component as non-modal
120
119
  if (this.dialog.matches('[open]:not(:modal)')) {
121
120
  // eslint-disable-next-line no-restricted-syntax
@@ -9,7 +9,6 @@ import './focus_group';
9
9
  import './scrollable_region';
10
10
  import './aria_live';
11
11
  import './shared_events';
12
- import './alpha/image_crop';
13
12
  import './alpha/modal_dialog';
14
13
  import './beta/nav_list';
15
14
  import './beta/nav_list_group_element';
@@ -21,8 +20,8 @@ import './beta/auto_complete/auto_complete';
21
20
  import './beta/clipboard_copy';
22
21
  import './beta/relative_time';
23
22
  import './alpha/tab_container';
24
- import '../../../lib/primer/forms/primer_multi_input';
25
- import '../../../lib/primer/forms/primer_text_field';
26
- import '../../../lib/primer/forms/toggle_switch_input';
23
+ import '../../lib/primer/forms/primer_multi_input';
24
+ import '../../lib/primer/forms/primer_text_field';
25
+ import '../../lib/primer/forms/toggle_switch_input';
27
26
  import './alpha/action_menu/action_menu_element';
28
27
  import './alpha/select_panel_element';
@@ -9,7 +9,6 @@ import './focus_group';
9
9
  import './scrollable_region';
10
10
  import './aria_live';
11
11
  import './shared_events';
12
- import './alpha/image_crop';
13
12
  import './alpha/modal_dialog';
14
13
  import './beta/nav_list';
15
14
  import './beta/nav_list_group_element';
@@ -21,8 +20,8 @@ import './beta/auto_complete/auto_complete';
21
20
  import './beta/clipboard_copy';
22
21
  import './beta/relative_time';
23
22
  import './alpha/tab_container';
24
- import '../../../lib/primer/forms/primer_multi_input';
25
- import '../../../lib/primer/forms/primer_text_field';
26
- import '../../../lib/primer/forms/toggle_switch_input';
23
+ import '../../lib/primer/forms/primer_multi_input';
24
+ import '../../lib/primer/forms/primer_text_field';
25
+ import '../../lib/primer/forms/toggle_switch_input';
27
26
  import './alpha/action_menu/action_menu_element';
28
27
  import './alpha/select_panel_element';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@primer/view-components",
3
- "version": "0.35.0-rc.ab9e1260",
3
+ "version": "0.35.0-rc.ad5f177a",
4
4
  "description": "ViewComponents for the Primer Design System",
5
5
  "main": "app/assets/javascripts/primer_view_components.js",
6
6
  "module": "app/components/primer/primer.js",
@@ -26,15 +26,15 @@
26
26
  "app/components/primer/**/*.css",
27
27
  "app/components/primer/**/*.css.json",
28
28
  "app/components/primer/**/*.d.ts",
29
- "lib/primer/forms/**/*.js",
30
- "lib/primer/forms/**/*.d.ts"
29
+ "app/lib/primer/forms/**/*.js",
30
+ "app/lib/primer/forms/**/*.d.ts"
31
31
  ],
32
32
  "scripts": {
33
33
  "clean": "git clean -fdX -- app/",
34
34
  "prepare": "script/build-assets",
35
35
  "lint": "npm run lint:stylelint && npm run lint:eslint",
36
- "lint:stylelint": "stylelint 'app/components/**/*.pcss'",
37
- "lint:stylelint:fix": "stylelint 'app/components/**/*.pcss' --fix",
36
+ "lint:stylelint": "stylelint --rd -q 'app/components/**/*.pcss'",
37
+ "lint:stylelint:fix": "npm run lint:stylelint -- --fix",
38
38
  "lint:eslint": "eslint 'app/components/**/*.ts'",
39
39
  "lint:eslint:fix": "eslint 'app/components/**/*.ts' --fix",
40
40
  "changeset:version": "changeset version && script/version",
@@ -64,9 +64,9 @@
64
64
  "@github/markdownlint-github": "^0.6.0",
65
65
  "@github/prettier-config": "0.0.6",
66
66
  "@playwright/test": "^1.35.1",
67
- "@primer/css": "21.3.6",
67
+ "@primer/css": "21.5.0",
68
68
  "@primer/primitives": "^9.0.2",
69
- "@primer/stylelint-config": "^12.7.2",
69
+ "@primer/stylelint-config": "^13.1.1",
70
70
  "@rollup/plugin-node-resolve": "^15.2.3",
71
71
  "@rollup/plugin-typescript": "^8.3.3",
72
72
  "@typescript-eslint/eslint-plugin": "^7.0.1",
@@ -84,13 +84,12 @@
84
84
  "postcss": "^8.4.16",
85
85
  "postcss-cli": "^11.0.0",
86
86
  "postcss-import": "^16.0.0",
87
- "postcss-mixins": "^10.0.0",
87
+ "postcss-mixins": "^11.0.1",
88
88
  "postcss-preset-env": "^10.0.2",
89
89
  "prettier": "^3.3.2",
90
90
  "rollup": "^2.79.1",
91
91
  "rollup-plugin-terser": "^7.0.2",
92
- "stylelint": "^16.1.0",
93
- "stylelint-config-standard": "^36.0.0",
92
+ "stylelint-actions-formatters": "^16.3.1",
94
93
  "tslib": "^2.4.0",
95
94
  "typescript": "^5.2.2",
96
95
  "vite": "^5.4.3",
@@ -974,6 +974,12 @@
974
974
  "default": "`false`",
975
975
  "description": "If true will hide the heading title, while still making it available to Screen Readers."
976
976
  },
977
+ {
978
+ "name": "disable_scroll",
979
+ "type": "Boolean",
980
+ "default": "`true`",
981
+ "description": "When true, disables scrolling the page when the dialog is open."
982
+ },
977
983
  {
978
984
  "name": "system_arguments",
979
985
  "type": "Hash",
@@ -1345,34 +1351,6 @@
1345
1351
  }
1346
1352
  ]
1347
1353
  },
1348
- {
1349
- "component": "ImageCrop",
1350
- "status": "alpha",
1351
- "a11y_reviewed": false,
1352
- "short_name": "ImageCrop",
1353
- "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/image_crop.rb",
1354
- "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/image_crop/default/",
1355
- "parameters": [
1356
- {
1357
- "name": "src",
1358
- "type": "String",
1359
- "default": "N/A",
1360
- "description": "The path of the image to crop."
1361
- },
1362
- {
1363
- "name": "rounded",
1364
- "type": "Boolean",
1365
- "default": "`true`",
1366
- "description": "If the crop mask should be a circle. Defaults to true."
1367
- },
1368
- {
1369
- "name": "system_arguments",
1370
- "type": "Hash",
1371
- "default": "N/A",
1372
- "description": "[System arguments](/system-arguments)"
1373
- }
1374
- ]
1375
- },
1376
1354
  {
1377
1355
  "component": "Layout",
1378
1356
  "status": "alpha",
@@ -2468,6 +2446,18 @@
2468
2446
  "default": "`:outside_bottom`",
2469
2447
  "description": "The side to anchor the Overlay to. One of `:inside_bottom`, `:inside_center`, `:inside_left`, `:inside_right`, `:inside_top`, `:outside_bottom`, `:outside_left`, `:outside_right`, or `:outside_top`."
2470
2448
  },
2449
+ {
2450
+ "name": "loading_label",
2451
+ "type": "String",
2452
+ "default": "`\"Loading content...\"`",
2453
+ "description": "The aria-label to use when the panel is loading, defaults to 'Loading content...'."
2454
+ },
2455
+ {
2456
+ "name": "loading_description",
2457
+ "type": "String",
2458
+ "default": "`nil`",
2459
+ "description": "The description to use when the panel is loading. If not provided, no description will be used."
2460
+ },
2471
2461
  {
2472
2462
  "name": "banner_scheme",
2473
2463
  "type": "Symbol",
@@ -2498,6 +2488,92 @@
2498
2488
  }
2499
2489
  ]
2500
2490
  },
2491
+ {
2492
+ "component": "Stack",
2493
+ "status": "alpha",
2494
+ "a11y_reviewed": false,
2495
+ "short_name": "Stack",
2496
+ "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/stack.rb",
2497
+ "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/stack/default/",
2498
+ "parameters": [
2499
+ {
2500
+ "name": "tag",
2501
+ "type": "Symbol",
2502
+ "default": "`:div`",
2503
+ "description": "Customize the element type of the rendered container."
2504
+ },
2505
+ {
2506
+ "name": "gap",
2507
+ "type": "Symbol",
2508
+ "default": "`GapArg::DEFAULT`",
2509
+ "description": "Specify the gap between children elements in the stack. One of `nil`, `:condensed`, `:normal`, or `:spacious`."
2510
+ },
2511
+ {
2512
+ "name": "direction",
2513
+ "type": "Symbol",
2514
+ "default": "`:vertical`",
2515
+ "description": "Specify the direction for the stack container. One of `nil`, `:horizontal`, or `:vertical`."
2516
+ },
2517
+ {
2518
+ "name": "align",
2519
+ "type": "Symbol",
2520
+ "default": "`:stretch`",
2521
+ "description": "Specify the alignment between items in the cross-axis of the direction. One of `nil`, `:baseline`, `:center`, `:end`, `:start`, or `:stretch`."
2522
+ },
2523
+ {
2524
+ "name": "wrap",
2525
+ "type": "Symbol",
2526
+ "default": "`:nowrap`",
2527
+ "description": "Specify whether items are forced onto one line or can wrap onto multiple lines. One of `nil`, `:nowrap`, or `:wrap`."
2528
+ },
2529
+ {
2530
+ "name": "justify",
2531
+ "type": "Symbol",
2532
+ "default": "`:start`",
2533
+ "description": "Specify how items will be distributed in the stacking direction. One of `nil`, `:center`, `:end`, `:space_between`, `:space_evenly`, or `:start`."
2534
+ },
2535
+ {
2536
+ "name": "padding",
2537
+ "type": "Symbol",
2538
+ "default": "`:none`",
2539
+ "description": "Specify the padding of the stack container. One of `nil`, `:condensed`, `:none`, `:normal`, or `:spacious`."
2540
+ },
2541
+ {
2542
+ "name": "system_arguments",
2543
+ "type": "Hash",
2544
+ "default": "N/A",
2545
+ "description": "[System arguments](/system-arguments)"
2546
+ }
2547
+ ]
2548
+ },
2549
+ {
2550
+ "component": "StackItem",
2551
+ "status": "alpha",
2552
+ "a11y_reviewed": false,
2553
+ "short_name": "StackItem",
2554
+ "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/stack_item.rb",
2555
+ "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/stack_item/default/",
2556
+ "parameters": [
2557
+ {
2558
+ "name": "tag",
2559
+ "type": "Symbol",
2560
+ "default": "`:div`",
2561
+ "description": "Customize the element type of the rendered container."
2562
+ },
2563
+ {
2564
+ "name": "grow",
2565
+ "type": "Boolean",
2566
+ "default": "`false`",
2567
+ "description": "Allow item to keep size or expand to fill the available space."
2568
+ },
2569
+ {
2570
+ "name": "system_arguments",
2571
+ "type": "Hash",
2572
+ "default": "N/A",
2573
+ "description": "[System arguments](/system-arguments)"
2574
+ }
2575
+ ]
2576
+ },
2501
2577
  {
2502
2578
  "component": "SubmitButton",
2503
2579
  "status": "alpha",
@@ -30,7 +30,6 @@
30
30
  "Primer::Alpha::HellipButton": "",
31
31
  "Primer::Alpha::HiddenTextExpander": "",
32
32
  "Primer::Alpha::Image": "",
33
- "Primer::Alpha::ImageCrop": "",
34
33
  "Primer::Alpha::Layout": "",
35
34
  "Primer::Alpha::Layout::Main": "",
36
35
  "Primer::Alpha::Layout::Sidebar": "",
@@ -54,6 +53,8 @@
54
53
  "Primer::Alpha::Select": "",
55
54
  "Primer::Alpha::SelectPanel": "",
56
55
  "Primer::Alpha::SelectPanel::ItemList": "2023-07-10",
56
+ "Primer::Alpha::Stack": "",
57
+ "Primer::Alpha::StackItem": "",
57
58
  "Primer::Alpha::SubmitButton": "",
58
59
  "Primer::Alpha::TabContainer": "",
59
60
  "Primer::Alpha::TabNav": "",
@@ -501,6 +501,12 @@
501
501
  "SelectPanel-loadingPanel": [
502
502
  "Primer::Alpha::SelectPanel"
503
503
  ],
504
+ "Stack": [
505
+ "Primer::Alpha::Stack"
506
+ ],
507
+ "StackItem": [
508
+ "Primer::Alpha::StackItem"
509
+ ],
504
510
  "State": [
505
511
  "Primer::Beta::State"
506
512
  ],