@primer/view-components 0.35.0-rc.8d2532f4 → 0.35.0-rc.8f715f71
Sign up to get free protection for your applications and to get access to all the features.
- package/app/assets/styles/primer_view_components.css +1 -1
- package/app/assets/styles/primer_view_components.css.map +1 -1
- package/app/components/primer/alpha/dialog.css +1 -1
- package/app/components/primer/alpha/stack.css +1 -0
- package/app/components/primer/alpha/stack.css.json +90 -0
- package/app/components/primer/alpha/stack_item.css +1 -0
- package/app/components/primer/alpha/stack_item.css.json +12 -0
- package/app/lib/primer/forms/primer_multi_input.d.ts +10 -0
- package/app/lib/primer/forms/primer_multi_input.js +44 -0
- package/app/lib/primer/forms/primer_text_field.d.ts +28 -0
- package/app/lib/primer/forms/primer_text_field.js +119 -0
- package/app/lib/primer/forms/toggle_switch_input.d.ts +5 -0
- package/app/lib/primer/forms/toggle_switch_input.js +34 -0
- package/package.json +3 -1
- package/static/arguments.json +86 -0
- package/static/audited_at.json +2 -0
- package/static/classes.json +6 -0
- package/static/constants.json +24 -0
- package/static/info_arch.json +172 -0
- package/static/previews.json +68 -0
- package/static/statuses.json +2 -0
@@ -1 +1 @@
|
|
1
|
-
body.has-modal{overflow:hidden!important;padding-right:var(--dialog-scrollgutter)!important}dialog.Overlay:not([open]){display:none}.Overlay--hidden{display:none!important}.Overlay--visibilityHidden{height:0;opacity:0;overflow:hidden;visibility:hidden}@supports not selector(:popover-open){[popover]:not(.\:popover-open){display:none}}.Overlay{background-color:var(--overlay-bgColor);border:0;border-radius:var(--borderRadius-large);box-shadow:var(--shadow-floating-small);color:var(--fgColor-default);display:flex;flex-direction:column;inset:0;margin:auto;max-height:min(calc(100vh - 2rem),var(--overlay-height));min-width:192px;opacity:1;padding:0;position:static;white-space:normal;width:min(var(--overlay-width),100vw - 2rem)}.Overlay.Overlay--size-auto{max-height:calc(100vh - 2rem);max-width:calc(100vw - 2rem);min-width:192px}.Overlay.Overlay--size-full{height:100vh;width:100vw}.Overlay.Overlay--size-xsmall{--overlay-width:192px;max-height:calc(100vh - 2rem)}.Overlay.Overlay--size-small{--overlay-height:256px;--overlay-width:320px}.Overlay.Overlay--size-small-portrait{--overlay-height:432px;--overlay-width:320px}.Overlay.Overlay--size-medium{--overlay-height:320px;--overlay-width:480px}.Overlay.Overlay--size-medium-portrait{--overlay-height:600px;--overlay-width:480px}.Overlay.Overlay--size-large{--overlay-height:432px;--overlay-width:640px}.Overlay.Overlay--size-xlarge{--overlay-height:600px;--overlay-width:960px}.Overlay.Overlay--height-auto{height:auto}.Overlay.Overlay--placement-left,.Overlay.Overlay--placement-right{height:100%;max-height:unset;position:fixed}@media screen and (prefers-reduced-motion:no-preference){.Overlay.Overlay--motion-scaleFade,.Overlay.Overlay--placement-left,.Overlay.Overlay--placement-right{animation:Overlay--motion-scaleFade .2s cubic-bezier(.33,1,.68,1) 0s 1 normal none running}}.Overlay.Overlay--placement-left{animation-name:Overlay--motion-slideInRight;border-bottom-left-radius:0;border-top-left-radius:0;inset:0 auto 0 0}.Overlay.Overlay--placement-right{animation-name:Overlay--motion-slideInLeft;border-bottom-right-radius:0;border-top-right-radius:0;inset:0 0 0 auto}.Overlay.Overlay--height-xsmall{height:min(192px,100vh - 2rem)}.Overlay.Overlay--height-small{height:min(256px,100vh - 2rem)}.Overlay.Overlay--height-medium{height:min(320px,100vh - 2rem)}.Overlay.Overlay--height-large{height:min(432px,100vh - 2rem)}.Overlay.Overlay--height-xlarge{height:min(600px,100vh - 2rem)}.Overlay.Overlay--width-auto{width:auto}.Overlay.Overlay--width-small{width:min(256px,100vw - 2rem)}.Overlay.Overlay--width-medium{width:min(320px,100vw - 2rem)}.Overlay.Overlay--width-large{width:min(480px,100vw - 2rem)}.Overlay.Overlay--width-xlarge{width:min(640px,100vw - 2rem)}.Overlay.Overlay--width-xxlarge{width:min(960px,100vw - 2rem)}.Overlay:modal{position:fixed}@keyframes Overlay--motion-scaleFade{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}.Overlay-form{flex-grow:1;overflow:auto}.Overlay-form,.Overlay-header{display:flex;flex-direction:column}.Overlay-header{color:var(--fgColor-default);z-index:1}.Overlay-header.Overlay-header--divided{box-shadow:inset 0 calc(var(--borderWidth-thin)*-1) var(--borderColor-default);padding-bottom:var(--stack-padding-condensed)}.Overlay-header.Overlay-header--divided+.Overlay-body{padding-top:var(--stack-padding-normal)}:is(.Overlay-header.Overlay-header--large .Overlay-headerContentWrap) .Overlay-titleWrap{gap:var(--stack-gap-condensed)}:is(:is(.Overlay-header.Overlay-header--large .Overlay-headerContentWrap) .Overlay-titleWrap) .Overlay-title{font-size:var(--text-title-size-medium)}:is(:is(.Overlay-header.Overlay-header--large .Overlay-headerContentWrap) .Overlay-titleWrap) .Overlay-description{font-size:var(--text-body-size-medium)}.Overlay-header .Overlay-headerContentWrap{align-items:flex-start;display:flex;gap:var(--stack-gap-condensed);padding:var(--stack-gap-condensed) var(--stack-gap-condensed) 0 var(--stack-gap-condensed)}:is(.Overlay-header .Overlay-headerContentWrap) .Overlay-actionWrap{display:flex;flex-direction:row;gap:var(--stack-gap-condensed)}:is(.Overlay-header .Overlay-headerContentWrap) .Overlay-titleWrap{display:flex;flex-direction:column;flex-grow:1;gap:var(--control-small-gap);padding:calc(var(--stack-gap-condensed)*.75) 0 calc(var(--stack-gap-condensed)*.75) var(--stack-gap-condensed)}:is(:is(.Overlay-header .Overlay-headerContentWrap) .Overlay-titleWrap) .Overlay-title{font-size:var(--text-body-size-medium);font-weight:var(--base-text-weight-semibold);margin:0}:is(:is(.Overlay-header .Overlay-headerContentWrap) .Overlay-titleWrap) .Overlay-description{color:var(--fgColor-muted);font-size:var(--text-body-size-small);font-weight:var(--base-text-weight-normal);margin:0}.Overlay-headerFilter{padding:var(--stack-gap-condensed) var(--stack-gap-condensed) 0 var(--stack-gap-condensed)}.Overlay-body{flex-grow:1;font-size:var(--text-body-size-medium);overflow-y:auto;padding:var(--stack-padding-normal);padding-top:0;scrollbar-width:thin}.Overlay-body.Overlay-body--paddingCondensed{padding:var(--stack-padding-condensed);padding-top:0}.Overlay-body.Overlay-body--paddingNone{padding:0}.Overlay-footer{display:flex;flex-direction:row;flex-shrink:0;flex-wrap:wrap;padding:0 var(--stack-padding-normal) var(--stack-padding-normal) var(--stack-padding-normal);z-index:1}.Overlay-footer.Overlay-footer--divided{box-shadow:inset 0 var(--borderWidth-thin) var(--borderColor-default);padding-top:var(--stack-padding-normal)}.Overlay-footer.Overlay-footer--alignStart{gap:var(--stack-gap-condensed);justify-content:flex-start}.Overlay-footer.Overlay-footer--alignCenter{gap:var(--stack-gap-condensed);justify-content:center}.Overlay-footer.Overlay-footer--alignEnd{gap:var(--stack-gap-condensed);justify-content:flex-end}.Overlay-closeButton{align-self:flex-start;background-color:initial;border:var(--borderWidth-thin) solid #0000;border-radius:var(--borderRadius-medium);color:var(--fgColor-muted);cursor:pointer;display:grid;flex-shrink:0;height:var(--base-size-32);padding:0;place-content:center;position:relative;transition:.2s cubic-bezier(.3,0,.5,1);transition-property:color,background-color,border-color;-webkit-user-select:none;user-select:none;width:var(--base-size-32)}.Overlay-closeButton:focus,.Overlay-closeButton:hover{background-color:var(--button-default-bgColor-hover);border:var(--borderWidth-thin) solid var(--control-bgColor-hover)}.Overlay-closeButton.close-button{border:var(--borderWidth-thin) solid #0000}.Overlay--full{border-radius:unset!important;flex-grow:1;height:100%;max-height:100vh;max-width:100vw;width:100%}@media (max-width:767px){.Overlay--placement-right-whenNarrow,.Overlay.Overlay--placement-left-whenNarrow{height:100%;max-height:100vh;position:fixed}.Overlay.Overlay--placement-left-whenNarrow{animation-name:Overlay--motion-slideInLeft;border-bottom-left-radius:0;border-top-left-radius:0;inset:0 auto 0 0}.Overlay.Overlay--placement-right-whenNarrow{animation-name:Overlay--motion-slideInLeft;border-bottom-right-radius:0;border-top-right-radius:0;inset:0 0 0 auto}.Overlay.Overlay--placement-bottom-whenNarrow{animation-name:Overlay--motion-slideUp;border-bottom-left-radius:0;border-bottom-right-radius:0;inset:auto 0 0;max-width:100vw;width:100%}.Overlay--full-whenNarrow{border-radius:unset!important;flex-grow:1;height:100%;max-height:100vh;max-width:100vw;width:100%}}@keyframes Overlay--motion-slideDown{0%{transform:translateY(-100%)}}@keyframes Overlay--motion-slideUp{0%{transform:translateY(100%)}}@keyframes Overlay--motion-slideInRight{0%{transform:translateX(-100%)}}@keyframes Overlay--motion-slideInLeft{0%{transform:translateX(100%)}}
|
1
|
+
@property --dialog-scrollgutter{initial-value:0;inherits:false;syntax:"<length>"}body.has-modal{overflow:hidden!important;padding-right:var(--dialog-scrollgutter)!important}dialog.Overlay:not([open]){display:none}.Overlay--hidden{display:none!important}.Overlay--visibilityHidden{height:0;opacity:0;overflow:hidden;visibility:hidden}@supports not selector(:popover-open){[popover]:not(.\:popover-open){display:none}}.Overlay{background-color:var(--overlay-bgColor);border:0;border-radius:var(--borderRadius-large);box-shadow:var(--shadow-floating-small);color:var(--fgColor-default);display:flex;flex-direction:column;inset:0;margin:auto;max-height:min(calc(100vh - 2rem),var(--overlay-height));min-width:192px;opacity:1;padding:0;position:static;white-space:normal;width:min(var(--overlay-width),100vw - 2rem)}.Overlay.Overlay--size-auto{max-height:calc(100vh - 2rem);max-width:calc(100vw - 2rem);min-width:192px}.Overlay.Overlay--size-full{height:100vh;width:100vw}.Overlay.Overlay--size-xsmall{--overlay-width:192px;max-height:calc(100vh - 2rem)}.Overlay.Overlay--size-small{--overlay-height:256px;--overlay-width:320px}.Overlay.Overlay--size-small-portrait{--overlay-height:432px;--overlay-width:320px}.Overlay.Overlay--size-medium{--overlay-height:320px;--overlay-width:480px}.Overlay.Overlay--size-medium-portrait{--overlay-height:600px;--overlay-width:480px}.Overlay.Overlay--size-large{--overlay-height:432px;--overlay-width:640px}.Overlay.Overlay--size-xlarge{--overlay-height:600px;--overlay-width:960px}.Overlay.Overlay--height-auto{height:auto}.Overlay.Overlay--placement-left,.Overlay.Overlay--placement-right{height:100%;max-height:unset;position:fixed}@media screen and (prefers-reduced-motion:no-preference){.Overlay.Overlay--motion-scaleFade,.Overlay.Overlay--placement-left,.Overlay.Overlay--placement-right{animation:Overlay--motion-scaleFade .2s cubic-bezier(.33,1,.68,1) 0s 1 normal none running}}.Overlay.Overlay--placement-left{animation-name:Overlay--motion-slideInRight;border-bottom-left-radius:0;border-top-left-radius:0;inset:0 auto 0 0}.Overlay.Overlay--placement-right{animation-name:Overlay--motion-slideInLeft;border-bottom-right-radius:0;border-top-right-radius:0;inset:0 0 0 auto}.Overlay.Overlay--height-xsmall{height:min(192px,100vh - 2rem)}.Overlay.Overlay--height-small{height:min(256px,100vh - 2rem)}.Overlay.Overlay--height-medium{height:min(320px,100vh - 2rem)}.Overlay.Overlay--height-large{height:min(432px,100vh - 2rem)}.Overlay.Overlay--height-xlarge{height:min(600px,100vh - 2rem)}.Overlay.Overlay--width-auto{width:auto}.Overlay.Overlay--width-small{width:min(256px,100vw - 2rem)}.Overlay.Overlay--width-medium{width:min(320px,100vw - 2rem)}.Overlay.Overlay--width-large{width:min(480px,100vw - 2rem)}.Overlay.Overlay--width-xlarge{width:min(640px,100vw - 2rem)}.Overlay.Overlay--width-xxlarge{width:min(960px,100vw - 2rem)}.Overlay:modal{position:fixed}@keyframes Overlay--motion-scaleFade{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}.Overlay-form{flex-grow:1;overflow:auto}.Overlay-form,.Overlay-header{display:flex;flex-direction:column}.Overlay-header{color:var(--fgColor-default);z-index:1}.Overlay-header.Overlay-header--divided{box-shadow:inset 0 calc(var(--borderWidth-thin)*-1) var(--borderColor-default);padding-bottom:var(--stack-padding-condensed)}.Overlay-header.Overlay-header--divided+.Overlay-body{padding-top:var(--stack-padding-normal)}:is(.Overlay-header.Overlay-header--large .Overlay-headerContentWrap) .Overlay-titleWrap{gap:var(--stack-gap-condensed)}:is(:is(.Overlay-header.Overlay-header--large .Overlay-headerContentWrap) .Overlay-titleWrap) .Overlay-title{font-size:var(--text-title-size-medium)}:is(:is(.Overlay-header.Overlay-header--large .Overlay-headerContentWrap) .Overlay-titleWrap) .Overlay-description{font-size:var(--text-body-size-medium)}.Overlay-header .Overlay-headerContentWrap{align-items:flex-start;display:flex;gap:var(--stack-gap-condensed);padding:var(--stack-gap-condensed) var(--stack-gap-condensed) 0 var(--stack-gap-condensed)}:is(.Overlay-header .Overlay-headerContentWrap) .Overlay-actionWrap{display:flex;flex-direction:row;gap:var(--stack-gap-condensed)}:is(.Overlay-header .Overlay-headerContentWrap) .Overlay-titleWrap{display:flex;flex-direction:column;flex-grow:1;gap:var(--control-small-gap);padding:calc(var(--stack-gap-condensed)*.75) 0 calc(var(--stack-gap-condensed)*.75) var(--stack-gap-condensed)}:is(:is(.Overlay-header .Overlay-headerContentWrap) .Overlay-titleWrap) .Overlay-title{font-size:var(--text-body-size-medium);font-weight:var(--base-text-weight-semibold);margin:0}:is(:is(.Overlay-header .Overlay-headerContentWrap) .Overlay-titleWrap) .Overlay-description{color:var(--fgColor-muted);font-size:var(--text-body-size-small);font-weight:var(--base-text-weight-normal);margin:0}.Overlay-headerFilter{padding:var(--stack-gap-condensed) var(--stack-gap-condensed) 0 var(--stack-gap-condensed)}.Overlay-body{flex-grow:1;font-size:var(--text-body-size-medium);overflow-y:auto;padding:var(--stack-padding-normal);padding-top:0;scrollbar-width:thin}.Overlay-body.Overlay-body--paddingCondensed{padding:var(--stack-padding-condensed);padding-top:0}.Overlay-body.Overlay-body--paddingNone{padding:0}.Overlay-footer{display:flex;flex-direction:row;flex-shrink:0;flex-wrap:wrap;padding:0 var(--stack-padding-normal) var(--stack-padding-normal) var(--stack-padding-normal);z-index:1}.Overlay-footer.Overlay-footer--divided{box-shadow:inset 0 var(--borderWidth-thin) var(--borderColor-default);padding-top:var(--stack-padding-normal)}.Overlay-footer.Overlay-footer--alignStart{gap:var(--stack-gap-condensed);justify-content:flex-start}.Overlay-footer.Overlay-footer--alignCenter{gap:var(--stack-gap-condensed);justify-content:center}.Overlay-footer.Overlay-footer--alignEnd{gap:var(--stack-gap-condensed);justify-content:flex-end}.Overlay-closeButton{align-self:flex-start;background-color:initial;border:var(--borderWidth-thin) solid #0000;border-radius:var(--borderRadius-medium);color:var(--fgColor-muted);cursor:pointer;display:grid;flex-shrink:0;height:var(--base-size-32);padding:0;place-content:center;position:relative;transition:.2s cubic-bezier(.3,0,.5,1);transition-property:color,background-color,border-color;-webkit-user-select:none;user-select:none;width:var(--base-size-32)}.Overlay-closeButton:focus,.Overlay-closeButton:hover{background-color:var(--button-default-bgColor-hover);border:var(--borderWidth-thin) solid var(--control-bgColor-hover)}.Overlay-closeButton.close-button{border:var(--borderWidth-thin) solid #0000}.Overlay--full{border-radius:unset!important;flex-grow:1;height:100%;max-height:100vh;max-width:100vw;width:100%}@media (max-width:767px){.Overlay--placement-right-whenNarrow,.Overlay.Overlay--placement-left-whenNarrow{height:100%;max-height:100vh;position:fixed}.Overlay.Overlay--placement-left-whenNarrow{animation-name:Overlay--motion-slideInLeft;border-bottom-left-radius:0;border-top-left-radius:0;inset:0 auto 0 0}.Overlay.Overlay--placement-right-whenNarrow{animation-name:Overlay--motion-slideInLeft;border-bottom-right-radius:0;border-top-right-radius:0;inset:0 0 0 auto}.Overlay.Overlay--placement-bottom-whenNarrow{animation-name:Overlay--motion-slideUp;border-bottom-left-radius:0;border-bottom-right-radius:0;inset:auto 0 0;max-width:100vw;width:100%}.Overlay--full-whenNarrow{border-radius:unset!important;flex-grow:1;height:100%;max-height:100vh;max-width:100vw;width:100%}}@keyframes Overlay--motion-slideDown{0%{transform:translateY(-100%)}}@keyframes Overlay--motion-slideUp{0%{transform:translateY(100%)}}@keyframes Overlay--motion-slideInRight{0%{transform:translateX(-100%)}}@keyframes Overlay--motion-slideInLeft{0%{transform:translateX(100%)}}
|
@@ -0,0 +1 @@
|
|
1
|
+
.Stack{align-content:flex-start;align-items:stretch;display:flex;flex-flow:column;gap:var(--stack-gap,var(--stack-gap-normal,1rem))}.Stack[data-padding-narrow=none],.Stack[data-padding=none]{padding:0}.Stack[data-padding-narrow=condensed],.Stack[data-padding=condensed]{padding:var(--stack-padding-condensed,8px)}.Stack[data-padding-narrow=normal],.Stack[data-padding=normal]{padding:var(--stack-padding-normal,16px)}.Stack[data-padding-narrow=spacious],.Stack[data-padding=spacious]{padding:var(--stack-padding-spacious,24px)}.Stack[data-direction-narrow=horizontal],.Stack[data-direction=horizontal]{flex-flow:row}.Stack[data-direction-narrow=vertical],.Stack[data-direction=vertical]{flex-flow:column}.Stack[data-gap-narrow=none],.Stack[data-gap=none]{--stack-gap:var(--stack-gap-none,0)}.Stack[data-gap-narrow=condensed],.Stack[data-gap=condensed]{--stack-gap:var(--stack-gap-condensed,0.5rem)}.Stack[data-gap-narrow=normal],.Stack[data-gap=normal]{--stack-gap:var(--stack-gap-normal,1rem)}.Stack[data-gap-narrow=spacious],.Stack[data-gap=spacious]{--stack-gap:var(--stack-gap-spacious,1.5rem)}.Stack[data-align-narrow=start],.Stack[data-align=start]{align-items:flex-start}.Stack[data-align-narrow=center],.Stack[data-align=center]{align-items:center}.Stack[data-align-narrow=end],.Stack[data-align=end]{align-items:flex-end}.Stack[data-align-narrow=baseline],.Stack[data-align=baseline]{align-items:baseline}.Stack[data-justify-narrow=start],.Stack[data-justify=start]{justify-content:flex-start}.Stack[data-justify-narrow=center],.Stack[data-justify=center]{justify-content:center}.Stack[data-justify-narrow=end],.Stack[data-justify=end]{justify-content:flex-end}.Stack[data-justify-narrow=space-between],.Stack[data-justify=space-between]{justify-content:space-between}.Stack[data-justify-narrow=space-evenly],.Stack[data-justify=space-evenly]{justify-content:space-evenly}.Stack[data-wrap-narrow=wrap],.Stack[data-wrap=wrap]{flex-wrap:wrap}.Stack[data-wrap-narrow=nowrap],.Stack[data-wrap=nowrap]{flex-wrap:nowrap}@media (min-width:48rem){.Stack[data-padding-regular=none]{padding:0}.Stack[data-padding-regular=condensed]{padding:var(--stack-padding-condensed,8px)}.Stack[data-padding-regular=normal]{padding:var(--stack-padding-normal,16px)}.Stack[data-padding-regular=spacious]{padding:var(--stack-padding-spacious,24px)}.Stack[data-direction-regular=horizontal]{flex-flow:row}.Stack[data-direction-regular=vertical]{flex-flow:column}.Stack[data-gap-regular=none]{--stack-gap:var(--stack-gap-none,0)}.Stack[data-gap-regular=condensed]{--stack-gap:var(--stack-gap-condensed,0.5rem)}.Stack[data-gap-regular=normal]{--stack-gap:var(--stack-gap-normal,1rem)}.Stack[data-gap-regular=spacious]{--stack-gap:var(--stack-gap-spacious,1.5rem)}.Stack[data-align-regular=start]{align-items:flex-start}.Stack[data-align-regular=center]{align-items:center}.Stack[data-align-regular=end]{align-items:flex-end}.Stack[data-align-regular=baseline]{align-items:baseline}.Stack[data-justify-regular=start]{justify-content:flex-start}.Stack[data-justify-regular=center]{justify-content:center}.Stack[data-justify-regular=end]{justify-content:flex-end}.Stack[data-justify-regular=space-between]{justify-content:space-between}.Stack[data-justify-regular=space-evenly]{justify-content:space-evenly}.Stack[data-wrap-regular=wrap]{flex-wrap:wrap}.Stack[data-wrap-regular=nowrap]{flex-wrap:nowrap}}@media (min-width:87.5rem){.Stack[data-padding-wide=none]{padding:0}.Stack[data-padding-wide=condensed]{padding:var(--stack-padding-condensed,8px)}.Stack[data-padding-wide=normal]{padding:var(--stack-padding-normal,16px)}.Stack[data-padding-wide=spacious]{padding:var(--stack-padding-spacious,24px)}.Stack[data-direction-wide=horizontal]{flex-flow:row}.Stack[data-direction-wide=vertical]{flex-flow:column}.Stack[data-gap-wide=none]{--stack-gap:var(--stack-gap-none,0)}.Stack[data-gap-wide=condensed]{--stack-gap:var(--stack-gap-condensed,0.5rem)}.Stack[data-gap-wide=normal]{--stack-gap:var(--stack-gap-normal,1rem)}.Stack[data-gap-wide=spacious]{--stack-gap:var(--stack-gap-spacious,1.5rem)}.Stack[data-align-wide=start]{align-items:flex-start}.Stack[data-align-wide=center]{align-items:center}.Stack[data-align-wide=end]{align-items:flex-end}.Stack[data-align-wide=baseline]{align-items:baseline}.Stack[data-justify-wide=start]{justify-content:flex-start}.Stack[data-justify-wide=center]{justify-content:center}.Stack[data-justify-wide=end]{justify-content:flex-end}.Stack[data-justify-wide=space-between]{justify-content:space-between}.Stack[data-justify-wide=space-evenly]{justify-content:space-evenly}.Stack[data-wrap-wide=wrap]{flex-wrap:wrap}.Stack[data-wrap-wide=nowrap]{flex-wrap:nowrap}}
|
@@ -0,0 +1,90 @@
|
|
1
|
+
{
|
2
|
+
"name": "alpha/stack",
|
3
|
+
"selectors": [
|
4
|
+
".Stack",
|
5
|
+
".Stack[data-padding-narrow=none]",
|
6
|
+
".Stack[data-padding=none]",
|
7
|
+
".Stack[data-padding-narrow=condensed]",
|
8
|
+
".Stack[data-padding=condensed]",
|
9
|
+
".Stack[data-padding-narrow=normal]",
|
10
|
+
".Stack[data-padding=normal]",
|
11
|
+
".Stack[data-padding-narrow=spacious]",
|
12
|
+
".Stack[data-padding=spacious]",
|
13
|
+
".Stack[data-direction-narrow=horizontal]",
|
14
|
+
".Stack[data-direction=horizontal]",
|
15
|
+
".Stack[data-direction-narrow=vertical]",
|
16
|
+
".Stack[data-direction=vertical]",
|
17
|
+
".Stack[data-gap-narrow=none]",
|
18
|
+
".Stack[data-gap=none]",
|
19
|
+
".Stack[data-gap-narrow=condensed]",
|
20
|
+
".Stack[data-gap=condensed]",
|
21
|
+
".Stack[data-gap-narrow=normal]",
|
22
|
+
".Stack[data-gap=normal]",
|
23
|
+
".Stack[data-gap-narrow=spacious]",
|
24
|
+
".Stack[data-gap=spacious]",
|
25
|
+
".Stack[data-align-narrow=start]",
|
26
|
+
".Stack[data-align=start]",
|
27
|
+
".Stack[data-align-narrow=center]",
|
28
|
+
".Stack[data-align=center]",
|
29
|
+
".Stack[data-align-narrow=end]",
|
30
|
+
".Stack[data-align=end]",
|
31
|
+
".Stack[data-align-narrow=baseline]",
|
32
|
+
".Stack[data-align=baseline]",
|
33
|
+
".Stack[data-justify-narrow=start]",
|
34
|
+
".Stack[data-justify=start]",
|
35
|
+
".Stack[data-justify-narrow=center]",
|
36
|
+
".Stack[data-justify=center]",
|
37
|
+
".Stack[data-justify-narrow=end]",
|
38
|
+
".Stack[data-justify=end]",
|
39
|
+
".Stack[data-justify-narrow=space-between]",
|
40
|
+
".Stack[data-justify=space-between]",
|
41
|
+
".Stack[data-justify-narrow=space-evenly]",
|
42
|
+
".Stack[data-justify=space-evenly]",
|
43
|
+
".Stack[data-wrap-narrow=wrap]",
|
44
|
+
".Stack[data-wrap=wrap]",
|
45
|
+
".Stack[data-wrap-narrow=nowrap]",
|
46
|
+
".Stack[data-wrap=nowrap]",
|
47
|
+
".Stack[data-padding-regular=none]",
|
48
|
+
".Stack[data-padding-regular=condensed]",
|
49
|
+
".Stack[data-padding-regular=normal]",
|
50
|
+
".Stack[data-padding-regular=spacious]",
|
51
|
+
".Stack[data-direction-regular=horizontal]",
|
52
|
+
".Stack[data-direction-regular=vertical]",
|
53
|
+
".Stack[data-gap-regular=none]",
|
54
|
+
".Stack[data-gap-regular=condensed]",
|
55
|
+
".Stack[data-gap-regular=normal]",
|
56
|
+
".Stack[data-gap-regular=spacious]",
|
57
|
+
".Stack[data-align-regular=start]",
|
58
|
+
".Stack[data-align-regular=center]",
|
59
|
+
".Stack[data-align-regular=end]",
|
60
|
+
".Stack[data-align-regular=baseline]",
|
61
|
+
".Stack[data-justify-regular=start]",
|
62
|
+
".Stack[data-justify-regular=center]",
|
63
|
+
".Stack[data-justify-regular=end]",
|
64
|
+
".Stack[data-justify-regular=space-between]",
|
65
|
+
".Stack[data-justify-regular=space-evenly]",
|
66
|
+
".Stack[data-wrap-regular=wrap]",
|
67
|
+
".Stack[data-wrap-regular=nowrap]",
|
68
|
+
".Stack[data-padding-wide=none]",
|
69
|
+
".Stack[data-padding-wide=condensed]",
|
70
|
+
".Stack[data-padding-wide=normal]",
|
71
|
+
".Stack[data-padding-wide=spacious]",
|
72
|
+
".Stack[data-direction-wide=horizontal]",
|
73
|
+
".Stack[data-direction-wide=vertical]",
|
74
|
+
".Stack[data-gap-wide=none]",
|
75
|
+
".Stack[data-gap-wide=condensed]",
|
76
|
+
".Stack[data-gap-wide=normal]",
|
77
|
+
".Stack[data-gap-wide=spacious]",
|
78
|
+
".Stack[data-align-wide=start]",
|
79
|
+
".Stack[data-align-wide=center]",
|
80
|
+
".Stack[data-align-wide=end]",
|
81
|
+
".Stack[data-align-wide=baseline]",
|
82
|
+
".Stack[data-justify-wide=start]",
|
83
|
+
".Stack[data-justify-wide=center]",
|
84
|
+
".Stack[data-justify-wide=end]",
|
85
|
+
".Stack[data-justify-wide=space-between]",
|
86
|
+
".Stack[data-justify-wide=space-evenly]",
|
87
|
+
".Stack[data-wrap-wide=wrap]",
|
88
|
+
".Stack[data-wrap-wide=nowrap]"
|
89
|
+
]
|
90
|
+
}
|
@@ -0,0 +1 @@
|
|
1
|
+
.StackItem{flex:0 1 auto;min-inline-size:0}.StackItem[data-grow-narrow=true],.StackItem[data-grow=true]{flex-grow:1}@media (min-width:48rem){.StackItem[data-grow-regular=true]{flex-grow:1}.StackItem[data-grow-regular=false]{flex-grow:0}}@media (min-width:87.5rem){.StackItem[data-grow-wide=true]{flex-grow:1}.StackItem[data-grow-wide=false]{flex-grow:0}}
|
@@ -0,0 +1,12 @@
|
|
1
|
+
{
|
2
|
+
"name": "alpha/stack_item",
|
3
|
+
"selectors": [
|
4
|
+
".StackItem",
|
5
|
+
".StackItem[data-grow-narrow=true]",
|
6
|
+
".StackItem[data-grow=true]",
|
7
|
+
".StackItem[data-grow-regular=true]",
|
8
|
+
".StackItem[data-grow-regular=false]",
|
9
|
+
".StackItem[data-grow-wide=true]",
|
10
|
+
".StackItem[data-grow-wide=false]"
|
11
|
+
]
|
12
|
+
}
|
@@ -0,0 +1,10 @@
|
|
1
|
+
export declare class PrimerMultiInputElement extends HTMLElement {
|
2
|
+
fields: HTMLInputElement[];
|
3
|
+
activateField(name: string): void;
|
4
|
+
private findField;
|
5
|
+
}
|
6
|
+
declare global {
|
7
|
+
interface Window {
|
8
|
+
PrimerMultiInputElement: typeof PrimerMultiInputElement;
|
9
|
+
}
|
10
|
+
}
|
@@ -0,0 +1,44 @@
|
|
1
|
+
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
2
|
+
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
3
|
+
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
4
|
+
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
5
|
+
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
6
|
+
};
|
7
|
+
/* eslint-disable custom-elements/expose-class-on-global */
|
8
|
+
import { controller, targets } from '@github/catalyst';
|
9
|
+
let PrimerMultiInputElement = class PrimerMultiInputElement extends HTMLElement {
|
10
|
+
activateField(name) {
|
11
|
+
const fieldWithName = this.findField(name);
|
12
|
+
if (!fieldWithName)
|
13
|
+
return;
|
14
|
+
for (const field of this.fields) {
|
15
|
+
if (field === fieldWithName)
|
16
|
+
continue;
|
17
|
+
field.setAttribute('disabled', 'disabled');
|
18
|
+
field.setAttribute('hidden', 'hidden');
|
19
|
+
field.parentElement?.setAttribute('hidden', 'hidden');
|
20
|
+
}
|
21
|
+
fieldWithName.removeAttribute('disabled');
|
22
|
+
fieldWithName.removeAttribute('hidden');
|
23
|
+
fieldWithName.parentElement?.removeAttribute('hidden');
|
24
|
+
}
|
25
|
+
findField(name) {
|
26
|
+
for (const field of this.fields) {
|
27
|
+
if (field.getAttribute('data-name') === name) {
|
28
|
+
return field;
|
29
|
+
}
|
30
|
+
}
|
31
|
+
return null;
|
32
|
+
}
|
33
|
+
};
|
34
|
+
__decorate([
|
35
|
+
targets
|
36
|
+
], PrimerMultiInputElement.prototype, "fields", void 0);
|
37
|
+
PrimerMultiInputElement = __decorate([
|
38
|
+
controller
|
39
|
+
], PrimerMultiInputElement);
|
40
|
+
export { PrimerMultiInputElement };
|
41
|
+
if (!window.customElements.get('primer-multi-input')) {
|
42
|
+
Object.assign(window, { PrimerMultiInputElement });
|
43
|
+
window.customElements.define('primer-multi-input', PrimerMultiInputElement);
|
44
|
+
}
|
@@ -0,0 +1,28 @@
|
|
1
|
+
import '@github/auto-check-element';
|
2
|
+
import type { AutoCheckErrorEvent, AutoCheckSuccessEvent } from '@github/auto-check-element';
|
3
|
+
declare global {
|
4
|
+
interface HTMLElementEventMap {
|
5
|
+
'auto-check-success': AutoCheckSuccessEvent;
|
6
|
+
'auto-check-error': AutoCheckErrorEvent;
|
7
|
+
}
|
8
|
+
}
|
9
|
+
export declare class PrimerTextFieldElement extends HTMLElement {
|
10
|
+
#private;
|
11
|
+
inputElement: HTMLInputElement;
|
12
|
+
validationElement: HTMLElement;
|
13
|
+
validationMessageElement: HTMLElement;
|
14
|
+
validationSuccessIcon: HTMLElement;
|
15
|
+
validationErrorIcon: HTMLElement;
|
16
|
+
leadingVisual: HTMLElement;
|
17
|
+
leadingSpinner: HTMLElement;
|
18
|
+
connectedCallback(): void;
|
19
|
+
disconnectedCallback(): void;
|
20
|
+
clearContents(): void;
|
21
|
+
clearError(): void;
|
22
|
+
setValidationMessage(message: string): void;
|
23
|
+
toggleValidationStyling(isError: boolean): void;
|
24
|
+
setSuccess(message: string): void;
|
25
|
+
setError(message: string): void;
|
26
|
+
showLeadingSpinner(): void;
|
27
|
+
hideLeadingSpinner(): void;
|
28
|
+
}
|
@@ -0,0 +1,119 @@
|
|
1
|
+
/* eslint-disable custom-elements/expose-class-on-global */
|
2
|
+
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
3
|
+
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
4
|
+
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
5
|
+
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
6
|
+
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
7
|
+
};
|
8
|
+
var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
|
9
|
+
if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
|
10
|
+
if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
|
11
|
+
return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
|
12
|
+
};
|
13
|
+
var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
|
14
|
+
if (kind === "m") throw new TypeError("Private method is not writable");
|
15
|
+
if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
|
16
|
+
if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
|
17
|
+
return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
|
18
|
+
};
|
19
|
+
var _PrimerTextFieldElement_abortController;
|
20
|
+
import '@github/auto-check-element';
|
21
|
+
import { controller, target } from '@github/catalyst';
|
22
|
+
let PrimerTextFieldElement = class PrimerTextFieldElement extends HTMLElement {
|
23
|
+
constructor() {
|
24
|
+
super(...arguments);
|
25
|
+
_PrimerTextFieldElement_abortController.set(this, void 0);
|
26
|
+
}
|
27
|
+
connectedCallback() {
|
28
|
+
__classPrivateFieldGet(this, _PrimerTextFieldElement_abortController, "f")?.abort();
|
29
|
+
const { signal } = (__classPrivateFieldSet(this, _PrimerTextFieldElement_abortController, new AbortController(), "f"));
|
30
|
+
this.addEventListener('auto-check-success', async (event) => {
|
31
|
+
const message = await event.detail.response.text();
|
32
|
+
if (message && message.length > 0) {
|
33
|
+
this.setSuccess(message);
|
34
|
+
}
|
35
|
+
else {
|
36
|
+
this.clearError();
|
37
|
+
}
|
38
|
+
}, { signal });
|
39
|
+
this.addEventListener('auto-check-error', async (event) => {
|
40
|
+
const errorMessage = await event.detail.response.text();
|
41
|
+
this.setError(errorMessage);
|
42
|
+
}, { signal });
|
43
|
+
}
|
44
|
+
disconnectedCallback() {
|
45
|
+
__classPrivateFieldGet(this, _PrimerTextFieldElement_abortController, "f")?.abort();
|
46
|
+
}
|
47
|
+
clearContents() {
|
48
|
+
this.inputElement.value = '';
|
49
|
+
this.inputElement.focus();
|
50
|
+
this.inputElement.dispatchEvent(new Event('input', { bubbles: true, cancelable: false }));
|
51
|
+
}
|
52
|
+
clearError() {
|
53
|
+
this.inputElement.removeAttribute('invalid');
|
54
|
+
this.validationElement.hidden = true;
|
55
|
+
this.validationMessageElement.replaceChildren();
|
56
|
+
}
|
57
|
+
setValidationMessage(message) {
|
58
|
+
const template = document.createElement('template');
|
59
|
+
// eslint-disable-next-line github/no-inner-html
|
60
|
+
template.innerHTML = message;
|
61
|
+
const fragment = document.importNode(template.content, true);
|
62
|
+
this.validationMessageElement.replaceChildren(fragment);
|
63
|
+
}
|
64
|
+
toggleValidationStyling(isError) {
|
65
|
+
if (isError) {
|
66
|
+
this.validationElement.classList.remove('FormControl-inlineValidation--success');
|
67
|
+
}
|
68
|
+
else {
|
69
|
+
this.validationElement.classList.add('FormControl-inlineValidation--success');
|
70
|
+
}
|
71
|
+
this.validationSuccessIcon.hidden = isError;
|
72
|
+
this.validationErrorIcon.hidden = !isError;
|
73
|
+
this.inputElement.setAttribute('invalid', isError ? 'true' : 'false');
|
74
|
+
}
|
75
|
+
setSuccess(message) {
|
76
|
+
this.toggleValidationStyling(false);
|
77
|
+
this.setValidationMessage(message);
|
78
|
+
this.validationElement.hidden = false;
|
79
|
+
}
|
80
|
+
setError(message) {
|
81
|
+
this.toggleValidationStyling(true);
|
82
|
+
this.setValidationMessage(message);
|
83
|
+
this.validationElement.hidden = false;
|
84
|
+
}
|
85
|
+
showLeadingSpinner() {
|
86
|
+
this.leadingSpinner?.removeAttribute('hidden');
|
87
|
+
this.leadingVisual?.setAttribute('hidden', '');
|
88
|
+
}
|
89
|
+
hideLeadingSpinner() {
|
90
|
+
this.leadingSpinner?.setAttribute('hidden', '');
|
91
|
+
this.leadingVisual?.removeAttribute('hidden');
|
92
|
+
}
|
93
|
+
};
|
94
|
+
_PrimerTextFieldElement_abortController = new WeakMap();
|
95
|
+
__decorate([
|
96
|
+
target
|
97
|
+
], PrimerTextFieldElement.prototype, "inputElement", void 0);
|
98
|
+
__decorate([
|
99
|
+
target
|
100
|
+
], PrimerTextFieldElement.prototype, "validationElement", void 0);
|
101
|
+
__decorate([
|
102
|
+
target
|
103
|
+
], PrimerTextFieldElement.prototype, "validationMessageElement", void 0);
|
104
|
+
__decorate([
|
105
|
+
target
|
106
|
+
], PrimerTextFieldElement.prototype, "validationSuccessIcon", void 0);
|
107
|
+
__decorate([
|
108
|
+
target
|
109
|
+
], PrimerTextFieldElement.prototype, "validationErrorIcon", void 0);
|
110
|
+
__decorate([
|
111
|
+
target
|
112
|
+
], PrimerTextFieldElement.prototype, "leadingVisual", void 0);
|
113
|
+
__decorate([
|
114
|
+
target
|
115
|
+
], PrimerTextFieldElement.prototype, "leadingSpinner", void 0);
|
116
|
+
PrimerTextFieldElement = __decorate([
|
117
|
+
controller
|
118
|
+
], PrimerTextFieldElement);
|
119
|
+
export { PrimerTextFieldElement };
|
@@ -0,0 +1,34 @@
|
|
1
|
+
/* eslint-disable custom-elements/expose-class-on-global */
|
2
|
+
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
3
|
+
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
4
|
+
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
5
|
+
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
6
|
+
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
7
|
+
};
|
8
|
+
import { controller, target } from '@github/catalyst';
|
9
|
+
let ToggleSwitchInputElement = class ToggleSwitchInputElement extends HTMLElement {
|
10
|
+
connectedCallback() {
|
11
|
+
this.addEventListener('toggleSwitchError', (event) => {
|
12
|
+
this.validationMessageElement.textContent = event.detail;
|
13
|
+
this.validationElement.removeAttribute('hidden');
|
14
|
+
});
|
15
|
+
this.addEventListener('toggleSwitchSuccess', () => {
|
16
|
+
this.validationMessageElement.textContent = '';
|
17
|
+
this.validationElement.setAttribute('hidden', 'hidden');
|
18
|
+
});
|
19
|
+
this.addEventListener('toggleSwitchLoading', () => {
|
20
|
+
this.validationMessageElement.textContent = '';
|
21
|
+
this.validationElement.setAttribute('hidden', 'hidden');
|
22
|
+
});
|
23
|
+
}
|
24
|
+
};
|
25
|
+
__decorate([
|
26
|
+
target
|
27
|
+
], ToggleSwitchInputElement.prototype, "validationElement", void 0);
|
28
|
+
__decorate([
|
29
|
+
target
|
30
|
+
], ToggleSwitchInputElement.prototype, "validationMessageElement", void 0);
|
31
|
+
ToggleSwitchInputElement = __decorate([
|
32
|
+
controller
|
33
|
+
], ToggleSwitchInputElement);
|
34
|
+
export { ToggleSwitchInputElement };
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@primer/view-components",
|
3
|
-
"version": "0.35.0-rc.
|
3
|
+
"version": "0.35.0-rc.8f715f71",
|
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,6 +26,8 @@
|
|
26
26
|
"app/components/primer/**/*.css",
|
27
27
|
"app/components/primer/**/*.css.json",
|
28
28
|
"app/components/primer/**/*.d.ts",
|
29
|
+
"app/lib/primer/forms/**/*.js",
|
30
|
+
"app/lib/primer/forms/**/*.d.ts",
|
29
31
|
"lib/primer/forms/**/*.js",
|
30
32
|
"lib/primer/forms/**/*.d.ts"
|
31
33
|
],
|
package/static/arguments.json
CHANGED
@@ -2510,6 +2510,92 @@
|
|
2510
2510
|
}
|
2511
2511
|
]
|
2512
2512
|
},
|
2513
|
+
{
|
2514
|
+
"component": "Stack",
|
2515
|
+
"status": "alpha",
|
2516
|
+
"a11y_reviewed": false,
|
2517
|
+
"short_name": "Stack",
|
2518
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/stack.rb",
|
2519
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/stack/default/",
|
2520
|
+
"parameters": [
|
2521
|
+
{
|
2522
|
+
"name": "tag",
|
2523
|
+
"type": "Symbol",
|
2524
|
+
"default": "`:div`",
|
2525
|
+
"description": "Customize the element type of the rendered container."
|
2526
|
+
},
|
2527
|
+
{
|
2528
|
+
"name": "gap",
|
2529
|
+
"type": "Symbol",
|
2530
|
+
"default": "`GapArg::DEFAULT`",
|
2531
|
+
"description": "Specify the gap between children elements in the stack. One of `nil`, `:condensed`, `:normal`, or `:spacious`."
|
2532
|
+
},
|
2533
|
+
{
|
2534
|
+
"name": "direction",
|
2535
|
+
"type": "Symbol",
|
2536
|
+
"default": "`:vertical`",
|
2537
|
+
"description": "Specify the direction for the stack container. One of `nil`, `:horizontal`, or `:vertical`."
|
2538
|
+
},
|
2539
|
+
{
|
2540
|
+
"name": "align",
|
2541
|
+
"type": "Symbol",
|
2542
|
+
"default": "`:stretch`",
|
2543
|
+
"description": "Specify the alignment between items in the cross-axis of the direction. One of `nil`, `:baseline`, `:center`, `:end`, `:start`, or `:stretch`."
|
2544
|
+
},
|
2545
|
+
{
|
2546
|
+
"name": "wrap",
|
2547
|
+
"type": "Symbol",
|
2548
|
+
"default": "`:nowrap`",
|
2549
|
+
"description": "Specify whether items are forced onto one line or can wrap onto multiple lines. One of `nil`, `:nowrap`, or `:wrap`."
|
2550
|
+
},
|
2551
|
+
{
|
2552
|
+
"name": "justify",
|
2553
|
+
"type": "Symbol",
|
2554
|
+
"default": "`:start`",
|
2555
|
+
"description": "Specify how items will be distributed in the stacking direction. One of `nil`, `:center`, `:end`, `:space_between`, `:space_evenly`, or `:start`."
|
2556
|
+
},
|
2557
|
+
{
|
2558
|
+
"name": "padding",
|
2559
|
+
"type": "Symbol",
|
2560
|
+
"default": "`:none`",
|
2561
|
+
"description": "Specify the padding of the stack container. One of `nil`, `:condensed`, `:none`, `:normal`, or `:spacious`."
|
2562
|
+
},
|
2563
|
+
{
|
2564
|
+
"name": "system_arguments",
|
2565
|
+
"type": "Hash",
|
2566
|
+
"default": "N/A",
|
2567
|
+
"description": "[System arguments](/system-arguments)"
|
2568
|
+
}
|
2569
|
+
]
|
2570
|
+
},
|
2571
|
+
{
|
2572
|
+
"component": "StackItem",
|
2573
|
+
"status": "alpha",
|
2574
|
+
"a11y_reviewed": false,
|
2575
|
+
"short_name": "StackItem",
|
2576
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/stack_item.rb",
|
2577
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/stack_item/default/",
|
2578
|
+
"parameters": [
|
2579
|
+
{
|
2580
|
+
"name": "tag",
|
2581
|
+
"type": "Symbol",
|
2582
|
+
"default": "`:div`",
|
2583
|
+
"description": "Customize the element type of the rendered container."
|
2584
|
+
},
|
2585
|
+
{
|
2586
|
+
"name": "grow",
|
2587
|
+
"type": "Boolean",
|
2588
|
+
"default": "`false`",
|
2589
|
+
"description": "Allow item to keep size or expand to fill the available space."
|
2590
|
+
},
|
2591
|
+
{
|
2592
|
+
"name": "system_arguments",
|
2593
|
+
"type": "Hash",
|
2594
|
+
"default": "N/A",
|
2595
|
+
"description": "[System arguments](/system-arguments)"
|
2596
|
+
}
|
2597
|
+
]
|
2598
|
+
},
|
2513
2599
|
{
|
2514
2600
|
"component": "SubmitButton",
|
2515
2601
|
"status": "alpha",
|
package/static/audited_at.json
CHANGED
@@ -54,6 +54,8 @@
|
|
54
54
|
"Primer::Alpha::Select": "",
|
55
55
|
"Primer::Alpha::SelectPanel": "",
|
56
56
|
"Primer::Alpha::SelectPanel::ItemList": "2023-07-10",
|
57
|
+
"Primer::Alpha::Stack": "",
|
58
|
+
"Primer::Alpha::StackItem": "",
|
57
59
|
"Primer::Alpha::SubmitButton": "",
|
58
60
|
"Primer::Alpha::TabContainer": "",
|
59
61
|
"Primer::Alpha::TabNav": "",
|
package/static/classes.json
CHANGED
package/static/constants.json
CHANGED
@@ -621,6 +621,30 @@
|
|
621
621
|
},
|
622
622
|
"Primer::Alpha::SelectPanel::ItemList": {
|
623
623
|
},
|
624
|
+
"Primer::Alpha::Stack": {
|
625
|
+
"ARG_CLASSES": [
|
626
|
+
"Primer::Alpha::Stack::JustifyArg",
|
627
|
+
"Primer::Alpha::Stack::DirectionArg",
|
628
|
+
"Primer::Alpha::Stack::AlignArg",
|
629
|
+
"Primer::Alpha::Stack::WrapArg",
|
630
|
+
"Primer::Alpha::Stack::PaddingArg",
|
631
|
+
"Primer::Alpha::Stack::GapArg"
|
632
|
+
],
|
633
|
+
"AlignArg": "Primer::Alpha::Stack::AlignArg",
|
634
|
+
"DEFAULT_TAG": "div",
|
635
|
+
"DirectionArg": "Primer::Alpha::Stack::DirectionArg",
|
636
|
+
"GapArg": "Primer::Alpha::Stack::GapArg",
|
637
|
+
"JustifyArg": "Primer::Alpha::Stack::JustifyArg",
|
638
|
+
"PaddingArg": "Primer::Alpha::Stack::PaddingArg",
|
639
|
+
"WrapArg": "Primer::Alpha::Stack::WrapArg"
|
640
|
+
},
|
641
|
+
"Primer::Alpha::StackItem": {
|
642
|
+
"ARG_CLASSES": [
|
643
|
+
"Primer::Alpha::StackItem::GrowArg"
|
644
|
+
],
|
645
|
+
"DEFAULT_TAG": "div",
|
646
|
+
"GrowArg": "Primer::Alpha::StackItem::GrowArg"
|
647
|
+
},
|
624
648
|
"Primer::Alpha::SubmitButton": {
|
625
649
|
},
|
626
650
|
"Primer::Alpha::TabContainer": {
|