openproject-primer_view_components 0.59.1 → 0.60.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/CHANGELOG.md +16 -0
- data/app/assets/javascripts/components/primer/open_project/border_box/collapsible_header.d.ts +1 -1
- data/app/assets/javascripts/primer_view_components.js +1 -1
- data/app/assets/javascripts/primer_view_components.js.map +1 -1
- data/app/assets/styles/primer_view_components.css +1 -1
- data/app/assets/styles/primer_view_components.css.map +1 -1
- data/app/components/primer/alpha/auto_complete.css +1 -1
- data/app/components/primer/alpha/auto_complete.css.map +1 -1
- data/app/components/primer/alpha/banner.css +1 -1
- data/app/components/primer/alpha/banner.css.json +2 -0
- data/app/components/primer/alpha/banner.css.map +1 -1
- data/app/components/primer/alpha/banner.pcss +11 -1
- data/app/components/primer/alpha/banner.rb +5 -3
- data/app/components/primer/alpha/button_marketing.css +1 -1
- data/app/components/primer/alpha/button_marketing.css.map +1 -1
- data/app/components/primer/alpha/select.rb +1 -0
- data/app/components/primer/alpha/select_panel.rb +2 -3
- data/app/components/primer/alpha/text_area.rb +1 -0
- data/app/components/primer/alpha/text_field.css +1 -1
- data/app/components/primer/alpha/text_field.css.json +6 -4
- data/app/components/primer/alpha/text_field.css.map +1 -1
- data/app/components/primer/alpha/text_field.pcss +5 -1
- data/app/components/primer/alpha/text_field.rb +1 -0
- data/app/components/primer/alpha/toggle_switch.css +1 -1
- data/app/components/primer/alpha/toggle_switch.css.map +1 -1
- data/app/components/primer/beta/flash.css +1 -1
- data/app/components/primer/beta/flash.css.map +1 -1
- data/app/components/primer/open_project/border_box/collapsible_header.d.ts +1 -1
- data/app/components/primer/open_project/border_box/collapsible_header.js +6 -10
- data/app/components/primer/open_project/border_box/collapsible_header.rb +2 -3
- data/app/components/primer/open_project/border_box/collapsible_header.ts +7 -11
- data/app/components/primer/open_project/input_group.css +1 -1
- data/app/components/primer/open_project/input_group.css.json +1 -0
- data/app/components/primer/open_project/input_group.css.map +1 -1
- data/app/components/primer/open_project/input_group.pcss +5 -1
- data/app/components/primer/open_project/input_group.rb +1 -0
- data/app/lib/primer/forms/dsl/input.rb +4 -0
- data/lib/primer/view_components/version.rb +2 -2
- data/previews/primer/alpha/banner_preview.rb +9 -3
- data/previews/primer/alpha/select_preview.rb +1 -1
- data/previews/primer/alpha/text_area_preview.rb +1 -1
- data/previews/primer/alpha/text_field_preview.rb +3 -3
- data/previews/primer/forms_preview/custom_width_fields_form.html.erb +9 -0
- data/previews/primer/open_project/input_group_preview.rb +1 -1
- data/static/arguments.json +104 -2
- data/static/constants.json +6 -2
- data/static/info_arch.json +119 -4
- data/static/previews.json +13 -0
- metadata +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["toggle_switch.pcss","<no source>"],"names":[],"mappings":"AAQA,yCAHE,mBAOF,CAJA,cACE,kBAAmB,CAEnB,4CACF,CAGE,8CACE,WAAY,CACZ,kBACF,CAEA,+CACE,QAAS,CACT,iBACF,CAGF,oBAgBE,
|
|
1
|
+
{"version":3,"sources":["toggle_switch.pcss","<no source>"],"names":[],"mappings":"AAQA,yCAHE,mBAOF,CAJA,cACE,kBAAmB,CAEnB,4CACF,CAGE,8CACE,WAAY,CACZ,kBACF,CAEA,+CACE,QAAS,CACT,iBACF,CAGF,oBAgBE,eAAgB,CANhB,iDAAkD,CAClD,yEAA0E,CAC1E,wCAAyC,CAJzC,cAAe,CANf,aAAc,CAEd,iCAAkC,CAElC,eAAgB,CADhB,SAAU,CAJV,iBAAkB,CAMlB,4BAAqB,CAArB,oBAAqB,CAOrB,wBAAyB,CACzB,iDAAmD,CAFnD,mDAAyD,CAJzD,wBAAiB,CAAjB,gBAAiB,CANjB,yBAyCF,CA1BE,4DAEE,kBACF,CAEA,0BACE,kDACF,CAEA,2BACE,mDACF,CAEA,wBAEI,gCC3DN,WAAA,YAAA,SAAA,gBAAA,kBAAA,QAAA,4CAAA,UD2DgC,CAE9B,CAEA,gCAGE,0CACE,eACF,CACF,CAGF,iDAEE,qDAAsD,CACtD,kBAAyB,CAFzB,6CAGF,CAEA,uCACE,oDAAqD,CACrD,2CAyBF,CAtBI,6DACE,qDACF,CAEA,8DACE,sDACF,CAGF,0DACE,mDAAoD,CACpD,mDAAoD,CACpD,0BACF,CAEA,8DACE,uBACF,CAEA,gEACE,0BACF,CAGF,8BAEE,qDAAsD,CACtD,kBAAyB,CAFzB,kBAAmB,CAGnB,wBAcF,CAZE,iDACE,uCAAwC,CACxC,eACF,CAMA,4GACE,0CACF,CAGF,oBAEE,kBAAmB,CADnB,YAAa,CAGb,WAAY,CACZ,eAAgB,CAFhB,UAGF,CAEA,uBAGE,yCAA0C,CAG1C,2BAEF,CAEA,gDAHE,YAAa,CALb,aAAc,CAEd,wBAAyB,CACzB,6BAaF,CARA,yBAGE,sCAAuC,CAGvC,uBAEF,CAEA,mBAME,gDAAiD,CACjD,wEAAyE,CACzE,wCAAyC,CALzC,QAAS,CAMT,0EAA4E,CAR5E,iBAAkB,CAClB,KAAM,CASN,wBAAyB,CACzB,6BAA8B,CAF9B,mDAAyD,CALzD,SAAU,CADV,SAaF,CAHE,gCAdF,mBAeI,eAEJ,CADE,CAGF,qBAIE,4BAA6B,CAF7B,sCAAuC,CACvC,8CAA+C,CAF/C,iBAAkB,CAIlB,gBACF,CAEA,yBACE,YAAa,CAGb,kBAAoB,CAFpB,yBAGF,CAGE,0CACE,qCACF,CAEA,yCAEE,iCAAkC,CADlC,yBAEF,CAIA,6CACE,0BACF,CAGF,uBACE,QAAS,CACT,iBACF,CAEA,wBACE,WAAY,CACZ,kBACF,CAEA,2BACE,0BAKF,CAHE,gDACE,eACF","file":"toggle_switch.css","sourcesContent":["/* ToggleSwitch */\n\n/* Catalyst in dotcom applies a display: block to all web component elements. This\n** rule overrides it so the status label and toggle switch are laid out correctly. */\n.ToggleSwitch.ToggleSwitch {\n display: inline-flex;\n}\n\n.ToggleSwitch {\n align-items: center;\n display: inline-flex;\n gap: var(--controlStack-medium-gap-condensed);\n}\n\n.ToggleSwitch--checked {\n & .ToggleSwitch-statusOn {\n height: auto;\n visibility: visible;\n }\n\n & .ToggleSwitch-statusOff {\n height: 0;\n visibility: hidden;\n }\n}\n\n.ToggleSwitch-track {\n position: relative;\n display: block;\n width: var(--base-size-64);\n height: var(--control-medium-size);\n padding: 0;\n overflow: hidden;\n text-decoration: none;\n cursor: pointer;\n user-select: none;\n background-color: var(--controlTrack-bgColor-rest);\n border: var(--borderWidth-thin) solid var(--controlTrack-borderColor-rest);\n border-radius: var(--borderRadius-medium);\n transition-timing-function: cubic-bezier(0.5, 1, 0.89, 1);\n transition-duration: 80ms;\n transition-property: background-color, border-color;\n appearance: none;\n\n &:focus,\n &:focus-visible {\n outline-offset: 1px;\n }\n\n &:hover {\n background-color: var(--controlTrack-bgColor-hover);\n }\n\n &:active {\n background-color: var(--controlTrack-bgColor-active);\n }\n\n @media (pointer: coarse) {\n &::before {\n @mixin minTouchTarget 44px;\n }\n }\n\n @media (prefers-reduced-motion) {\n transition: none;\n\n & * {\n transition: none;\n }\n }\n}\n\n.ToggleSwitch-track[aria-pressed='true'][disabled] {\n color: var(--control-checked-fgColor-disabled);\n background-color: var(--controlTrack-bgColor-disabled);\n border-color: transparent;\n}\n\n.ToggleSwitch-track[aria-pressed='true'] {\n background-color: var(--control-checked-bgColor-rest);\n border-color: var(--borderColor-transparent);\n\n &:not([disabled]) {\n &:hover {\n background-color: var(--control-checked-bgColor-hover);\n }\n\n &:active {\n background-color: var(--control-checked-bgColor-active);\n }\n }\n\n & .ToggleSwitch-knob {\n background-color: var(--controlKnob-bgColor-checked);\n border-color: var(--controlKnob-borderColor-checked);\n transform: translateX(100%);\n }\n\n & .ToggleSwitch-lineIcon {\n transform: translateX(0%);\n }\n\n & .ToggleSwitch-circleIcon {\n transform: translateX(100%);\n }\n}\n\n.ToggleSwitch-track[disabled] {\n cursor: not-allowed;\n background-color: var(--controlTrack-bgColor-disabled);\n border-color: transparent;\n transition-property: none;\n\n & .ToggleSwitch-knob {\n border-color: var(--borderColor-default);\n box-shadow: none;\n }\n\n & .ToggleSwitch-lineIcon {\n color: var(--controlTrack-fgColor-disabled);\n }\n\n & .ToggleSwitch-circleIcon {\n color: var(--controlTrack-fgColor-disabled);\n }\n}\n\n.ToggleSwitch-icons {\n display: flex;\n align-items: center;\n width: 100%;\n height: 100%;\n overflow: hidden;\n}\n\n.ToggleSwitch-lineIcon {\n /* stylelint-disable-next-line primer/typography */\n line-height: 0;\n color: var(--control-checked-fgColor-rest);\n transition-duration: 80ms;\n transition-property: transform;\n transform: translateX(-100%);\n flex: 1 0 50%;\n}\n\n.ToggleSwitch-circleIcon {\n /* stylelint-disable-next-line primer/typography */\n line-height: 0;\n color: var(--controlTrack-fgColor-rest);\n transition-duration: 80ms;\n transition-property: transform;\n transform: translateX(0);\n flex: 1 0 50%;\n}\n\n.ToggleSwitch-knob {\n position: absolute;\n top: 0;\n bottom: 0;\n z-index: 1;\n width: 50%;\n background-color: var(--controlKnob-bgColor-rest);\n border: var(--borderWidth-thin) solid var(--controlKnob-borderColor-rest);\n border-radius: var(--borderRadius-medium);\n box-shadow: var(--shadow-resting-medium), var(--button-default-shadow-inset);\n transition-timing-function: cubic-bezier(0.5, 1, 0.89, 1);\n transition-duration: 80ms;\n transition-property: transform;\n\n @media (prefers-reduced-motion) {\n transition: none;\n }\n}\n\n.ToggleSwitch-status {\n position: relative;\n font-size: var(--text-body-size-medium);\n line-height: var(--text-title-lineHeight-large);\n color: var(--fgColor-default);\n text-align: right;\n}\n\n.ToggleSwitch-statusIcon {\n display: flex;\n width: var(--base-size-16);\n /* stylelint-disable-next-line primer/spacing */\n margin-top: 0.063rem;\n}\n\n.ToggleSwitch--small {\n & .ToggleSwitch-status {\n font-size: var(--text-body-size-small);\n }\n\n & .ToggleSwitch-track {\n width: var(--base-size-48);\n height: var(--control-xsmall-size);\n }\n}\n\n.ToggleSwitch--disabled {\n & .ToggleSwitch-status {\n color: var(--fgColor-muted);\n }\n}\n\n.ToggleSwitch-statusOn {\n height: 0;\n visibility: hidden;\n}\n\n.ToggleSwitch-statusOff {\n height: auto;\n visibility: visible;\n}\n\n.ToggleSwitch--statusAtEnd {\n flex-direction: row-reverse;\n\n & .ToggleSwitch-status {\n text-align: left;\n }\n}\n",null]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.flash:not(.Banner){background-image:linear-gradient(var(--bgColor-accent-muted),var(--bgColor-accent-muted));border-color:var(--borderColor-accent-muted);border-radius:var(--borderRadius-medium);border-style:solid;border-width:var(--borderWidth-thin);color:var(--fgColor-default);padding:var(--base-size-20) var(--control-medium-paddingInline-spacious);position:relative}.flash:not(.Banner) .octicon{color:var(--fgColor-accent);margin-right:var(--base-size-12)}.flash:not(.Banner) p:last-child{margin-bottom:0}.flash-messages{margin-bottom:var(--stack-gap-spacious)}.flash-close:not(.Banner-close){
|
|
1
|
+
.flash:not(.Banner){background-image:linear-gradient(var(--bgColor-accent-muted),var(--bgColor-accent-muted));border-color:var(--borderColor-accent-muted);border-radius:var(--borderRadius-medium);border-style:solid;border-width:var(--borderWidth-thin);color:var(--fgColor-default);padding:var(--base-size-20) var(--control-medium-paddingInline-spacious);position:relative}.flash:not(.Banner) .octicon{color:var(--fgColor-accent);margin-right:var(--base-size-12)}.flash:not(.Banner) p:last-child{margin-bottom:0}.flash-messages{margin-bottom:var(--stack-gap-spacious)}.flash-close:not(.Banner-close){appearance:none;background:none;border:0;cursor:pointer;float:right;margin-top:calc(var(--base-size-4)*-1);text-align:center}.flash-close:not(.Banner-close):hover{opacity:.7}.flash-close:not(.Banner-close):active{opacity:.5}.flash-close:not(.Banner-close) .octicon{margin-right:0}.flash-action:not(.Banner-actions){background-clip:padding-box;float:right;margin-left:var(--stack-gap-spacious);margin-top:-3px}.flash-action.btn:not(.Banner-actions) .octicon{color:var(--fgColor-muted);margin-right:var(--control-small-gap)}.flash-action.btn-primary:not(.Banner-actions){background-clip:initial}.flash-action.btn-primary:not(.Banner-actions) .octicon{color:inherit}.flash-warn:not(.Banner){background-image:linear-gradient(var(--bgColor-attention-muted),var(--bgColor-attention-muted));border-color:var(--borderColor-attention-muted);color:var(--fgColor-default)}.flash-warn:not(.Banner) .octicon{color:var(--fgColor-attention)}.flash-error:not(.Banner){background-image:linear-gradient(var(--bgColor-danger-muted),var(--bgColor-danger-muted));border-color:var(--borderColor-danger-muted);color:var(--fgColor-default)}.flash-error:not(.Banner) .octicon{color:var(--fgColor-danger)}.flash-success:not(.Banner){background-image:linear-gradient(var(--bgColor-success-muted),var(--bgColor-success-muted));border-color:var(--borderColor-success-muted);color:var(--fgColor-default)}.flash-success:not(.Banner) .octicon{color:var(--fgColor-success)}.flash-full:not(.Banner){border-radius:0;border-width:var(--borderWidth-thin) 0;margin-top:calc(var(--borderWidth-thin)*-1)}.flash-banner{border-left:0;border-radius:0;border-right:0;border-top:0;position:fixed;top:0;width:100%;z-index:90}.flash-banner,.flash-full{background-color:var(--bgColor-default)}.warning{background-color:var(--bgColor-attention-muted);font-weight:var(--base-text-weight-semibold);margin-bottom:.8em;padding:.5em}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["flash.pcss"],"names":[],"mappings":"AAKA,oBAME,yFAA2F,CAC3F,4CAA6C,CAG7C,wCAAyC,CAFzC,kBAAmB,CACnB,oCAAqC,CAJrC,4BAA6B,CAH7B,wEAAyE,CADzE,iBAoBF,CATE,6BAEE,2BAA4B,CAD5B,gCAEF,CAGA,iCACE,eACF,CAIF,gBACE,uCACF,CAGA,gCASE,
|
|
1
|
+
{"version":3,"sources":["flash.pcss"],"names":[],"mappings":"AAKA,oBAME,yFAA2F,CAC3F,4CAA6C,CAG7C,wCAAyC,CAFzC,kBAAmB,CACnB,oCAAqC,CAJrC,4BAA6B,CAH7B,wEAAyE,CADzE,iBAoBF,CATE,6BAEE,2BAA4B,CAD5B,gCAEF,CAGA,iCACE,eACF,CAIF,gBACE,uCACF,CAGA,gCASE,eAAgB,CAFhB,eAAgB,CAChB,QAAS,CAJT,cAAe,CAHf,WAAY,CACZ,sCAAyC,CACzC,iBAmBF,CAXE,sCACE,UACF,CAEA,uCACE,UACF,CAEA,yCACE,cACF,CAIF,mCAIE,2BAA4B,CAH5B,WAAY,CAEZ,qCAAsC,CADtC,eAgBF,CAZE,gDAEE,0BAA2B,CAD3B,qCAEF,CAEA,+CACE,uBAKF,CAHE,wDACE,aACF,CAMJ,yBAEE,+FAAiG,CACjG,+CAAgD,CAFhD,4BAOF,CAHE,kCACE,8BACF,CAGF,0BAEE,yFAA2F,CAC3F,4CAA6C,CAF7C,4BAOF,CAHE,mCACE,2BACF,CAGF,4BAEE,2FAA6F,CAC7F,6CAA8C,CAF9C,4BAOF,CAHE,qCACE,4BACF,CAKF,yBAGE,eAAgB,CADhB,sCAAuC,CADvC,2CAGF,CAGA,cAOE,aAAc,CACd,eAAgB,CAFhB,cAAe,CADf,YAAa,CAJb,cAAe,CACf,KAAM,CAEN,UAAW,CADX,UAMF,CAGA,0BAEE,uCACF,CAGA,SAIE,+CAAgD,CADhD,4CAA6C,CAD7C,kBAAoB,CADpB,YAIF","file":"flash.css","sourcesContent":["/* stylelint-disable primer/spacing */\n\n/* flash */\n\n/* Default flash */\n.flash:not(.Banner) {\n position: relative;\n padding: var(--base-size-20) var(--control-medium-paddingInline-spacious);\n\n /* Default color */\n color: var(--fgColor-default);\n background-image: linear-gradient(var(--bgColor-accent-muted), var(--bgColor-accent-muted));\n border-color: var(--borderColor-accent-muted);\n border-style: solid;\n border-width: var(--borderWidth-thin);\n border-radius: var(--borderRadius-medium);\n\n & .octicon {\n margin-right: var(--base-size-12);\n color: var(--fgColor-accent);\n }\n\n /* stylelint-disable-next-line selector-max-type */\n & p:last-child {\n margin-bottom: 0;\n }\n}\n\n/* Contain the flash messages */\n.flash-messages {\n margin-bottom: var(--stack-gap-spacious);\n}\n\n/* Close button */\n.flash-close:not(.Banner-close) {\n float: right;\n margin-top: calc(var(--base-size-4) * -1);\n text-align: center;\n cursor: pointer;\n\n /* Undo `<button>` styles */\n background: none;\n border: 0;\n appearance: none;\n\n &:hover {\n opacity: 0.7;\n }\n\n &:active {\n opacity: 0.5;\n }\n\n & .octicon {\n margin-right: 0;\n }\n}\n\n/* Action button */\n.flash-action:not(.Banner-actions) {\n float: right;\n margin-top: -3px;\n margin-left: var(--stack-gap-spacious);\n background-clip: padding-box;\n\n &.btn .octicon {\n margin-right: var(--control-small-gap);\n color: var(--fgColor-muted);\n }\n\n &.btn-primary {\n background-clip: border-box;\n\n & .octicon {\n color: inherit;\n }\n }\n}\n\n/* Color variations */\n\n.flash-warn:not(.Banner) {\n color: var(--fgColor-default);\n background-image: linear-gradient(var(--bgColor-attention-muted), var(--bgColor-attention-muted));\n border-color: var(--borderColor-attention-muted);\n\n & .octicon {\n color: var(--fgColor-attention);\n }\n}\n\n.flash-error:not(.Banner) {\n color: var(--fgColor-default);\n background-image: linear-gradient(var(--bgColor-danger-muted), var(--bgColor-danger-muted));\n border-color: var(--borderColor-danger-muted);\n\n & .octicon {\n color: var(--fgColor-danger);\n }\n}\n\n.flash-success:not(.Banner) {\n color: var(--fgColor-default);\n background-image: linear-gradient(var(--bgColor-success-muted), var(--bgColor-success-muted));\n border-color: var(--borderColor-success-muted);\n\n & .octicon {\n color: var(--fgColor-success);\n }\n}\n\n/* Layout variations */\n\n.flash-full:not(.Banner) {\n margin-top: calc(var(--borderWidth-thin) * -1);\n border-width: var(--borderWidth-thin) 0;\n border-radius: 0;\n}\n\n/* A banner rendered at the top of the page. */\n.flash-banner {\n position: fixed;\n top: 0;\n z-index: 90;\n width: 100%;\n border-top: 0;\n border-right: 0;\n border-left: 0;\n border-radius: 0;\n}\n\n/* Makes sure the background is opaque to cover any content underneath */\n.flash-full,\n.flash-banner {\n background-color: var(--bgColor-default);\n}\n\n/* FIXME deprecate this */\n.warning {\n padding: 0.5em;\n margin-bottom: 0.8em;\n font-weight: var(--base-text-weight-semibold);\n background-color: var(--bgColor-attention-muted);\n}\n"]}
|
|
@@ -29,19 +29,15 @@ let CollapsibleHeaderElement = class CollapsibleHeaderElement extends HTMLElemen
|
|
|
29
29
|
}
|
|
30
30
|
}
|
|
31
31
|
hideAll() {
|
|
32
|
-
this.arrowDown
|
|
33
|
-
this.arrowUp
|
|
34
|
-
|
|
35
|
-
this.description.classList.add('d-none');
|
|
36
|
-
}
|
|
32
|
+
this.arrowDown?.classList.remove('d-none');
|
|
33
|
+
this.arrowUp?.classList.add('d-none');
|
|
34
|
+
this.description?.classList.add('d-none');
|
|
37
35
|
this.classList.add('CollapsibleHeader--collapsed');
|
|
38
36
|
}
|
|
39
37
|
expandAll() {
|
|
40
|
-
this.arrowDown
|
|
41
|
-
this.arrowUp
|
|
42
|
-
|
|
43
|
-
this.description.classList.remove('d-none');
|
|
44
|
-
}
|
|
38
|
+
this.arrowDown?.classList.add('d-none');
|
|
39
|
+
this.arrowUp?.classList.remove('d-none');
|
|
40
|
+
this.description?.classList.remove('d-none');
|
|
45
41
|
this.classList.remove('CollapsibleHeader--collapsed');
|
|
46
42
|
}
|
|
47
43
|
};
|
|
@@ -3,9 +3,8 @@
|
|
|
3
3
|
module Primer
|
|
4
4
|
module OpenProject
|
|
5
5
|
module BorderBox
|
|
6
|
-
#
|
|
7
|
-
#
|
|
8
|
-
# @accessibility Add any accessibility considerations
|
|
6
|
+
# A component to be used inside Primer::Beta::BorderBox.
|
|
7
|
+
# It will toggle the visibility of the complete Box body
|
|
9
8
|
class CollapsibleHeader < Primer::Component
|
|
10
9
|
status :open_project
|
|
11
10
|
|
|
@@ -4,7 +4,7 @@ import {attr, controller, target} from '@github/catalyst'
|
|
|
4
4
|
class CollapsibleHeaderElement extends HTMLElement {
|
|
5
5
|
@target arrowDown: HTMLElement
|
|
6
6
|
@target arrowUp: HTMLElement
|
|
7
|
-
@target description: HTMLElement
|
|
7
|
+
@target description: HTMLElement | undefined
|
|
8
8
|
|
|
9
9
|
@attr collapsed: string
|
|
10
10
|
private _collapsed: boolean
|
|
@@ -33,23 +33,19 @@ class CollapsibleHeaderElement extends HTMLElement {
|
|
|
33
33
|
}
|
|
34
34
|
|
|
35
35
|
private hideAll() {
|
|
36
|
-
this.arrowDown
|
|
37
|
-
this.arrowUp
|
|
36
|
+
this.arrowDown?.classList.remove('d-none')
|
|
37
|
+
this.arrowUp?.classList.add('d-none')
|
|
38
38
|
|
|
39
|
-
|
|
40
|
-
this.description.classList.add('d-none')
|
|
41
|
-
}
|
|
39
|
+
this.description?.classList.add('d-none')
|
|
42
40
|
|
|
43
41
|
this.classList.add('CollapsibleHeader--collapsed')
|
|
44
42
|
}
|
|
45
43
|
|
|
46
44
|
private expandAll() {
|
|
47
|
-
this.arrowDown
|
|
48
|
-
this.arrowUp
|
|
45
|
+
this.arrowDown?.classList.add('d-none')
|
|
46
|
+
this.arrowUp?.classList.remove('d-none')
|
|
49
47
|
|
|
50
|
-
|
|
51
|
-
this.description.classList.remove('d-none')
|
|
52
|
-
}
|
|
48
|
+
this.description?.classList.remove('d-none')
|
|
53
49
|
|
|
54
50
|
this.classList.remove('CollapsibleHeader--collapsed')
|
|
55
51
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.InputGroup.InputGroup-input-width--auto{width:auto}.InputGroup.InputGroup-input-width--small{max-width:min(256px,100vw - 2rem)}.InputGroup.InputGroup-input-width--medium{max-width:min(320px,100vw - 2rem)}.InputGroup.InputGroup-input-width--large{max-width:min(480px,100vw - 2rem)}.InputGroup.InputGroup-input-width--xlarge{max-width:min(
|
|
1
|
+
.InputGroup.InputGroup-input-width--auto{width:auto}.InputGroup.InputGroup-input-width--xsmall{max-width:min(144px,100vw - 2rem)}.InputGroup.InputGroup-input-width--small{max-width:min(256px,100vw - 2rem)}.InputGroup.InputGroup-input-width--medium{max-width:min(320px,100vw - 2rem)}.InputGroup.InputGroup-input-width--large{max-width:min(480px,100vw - 2rem)}.InputGroup.InputGroup-input-width--xlarge{max-width:min(680px,100vw - 2rem)}.InputGroup.InputGroup-input-width--xxlarge{max-width:min(960px,100vw - 2rem)}
|
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
"name": "open_project/input_group",
|
|
3
3
|
"selectors": [
|
|
4
4
|
".InputGroup.InputGroup-input-width--auto",
|
|
5
|
+
".InputGroup.InputGroup-input-width--xsmall",
|
|
5
6
|
".InputGroup.InputGroup-input-width--small",
|
|
6
7
|
".InputGroup.InputGroup-input-width--medium",
|
|
7
8
|
".InputGroup.InputGroup-input-width--large",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["input_group.pcss"],"names":[],"mappings":"AACI,yCACI,UACJ,CAEA,0CACI,iCACJ,CAEA,2CACI,iCACJ,CAEA,0CACI,iCACJ,CAEA,2CACI,iCACJ,CAEA,4CACI,iCACJ","file":"input_group.css","sourcesContent":[".InputGroup {\n &.InputGroup-input-width--auto {\n width: auto;\n }\n\n &.InputGroup-input-width--small {\n max-width: min(256px, 100vw - 2rem);\n }\n\n &.InputGroup-input-width--medium {\n max-width: min(320px, 100vw - 2rem);\n }\n\n &.InputGroup-input-width--large {\n max-width: min(480px, 100vw - 2rem);\n }\n\n &.InputGroup-input-width--xlarge {\n max-width: min(
|
|
1
|
+
{"version":3,"sources":["input_group.pcss"],"names":[],"mappings":"AACI,yCACI,UACJ,CAEA,2CACI,iCACJ,CAEA,0CACI,iCACJ,CAEA,2CACI,iCACJ,CAEA,0CACI,iCACJ,CAEA,2CACI,iCACJ,CAEA,4CACI,iCACJ","file":"input_group.css","sourcesContent":[".InputGroup {\n &.InputGroup-input-width--auto {\n width: auto;\n }\n\n &.InputGroup-input-width--xsmall {\n max-width: min(144px, 100vw - 2rem);\n }\n\n &.InputGroup-input-width--small {\n max-width: min(256px, 100vw - 2rem);\n }\n\n &.InputGroup-input-width--medium {\n max-width: min(320px, 100vw - 2rem);\n }\n\n &.InputGroup-input-width--large {\n max-width: min(480px, 100vw - 2rem);\n }\n\n &.InputGroup-input-width--xlarge {\n max-width: min(680px, 100vw - 2rem);\n }\n\n &.InputGroup-input-width--xxlarge {\n max-width: min(960px, 100vw - 2rem);\n }\n}\n"]}
|
|
@@ -3,6 +3,10 @@
|
|
|
3
3
|
width: auto;
|
|
4
4
|
}
|
|
5
5
|
|
|
6
|
+
&.InputGroup-input-width--xsmall {
|
|
7
|
+
max-width: min(144px, 100vw - 2rem);
|
|
8
|
+
}
|
|
9
|
+
|
|
6
10
|
&.InputGroup-input-width--small {
|
|
7
11
|
max-width: min(256px, 100vw - 2rem);
|
|
8
12
|
}
|
|
@@ -16,7 +20,7 @@
|
|
|
16
20
|
}
|
|
17
21
|
|
|
18
22
|
&.InputGroup-input-width--xlarge {
|
|
19
|
-
max-width: min(
|
|
23
|
+
max-width: min(680px, 100vw - 2rem);
|
|
20
24
|
}
|
|
21
25
|
|
|
22
26
|
&.InputGroup-input-width--xxlarge {
|
|
@@ -9,6 +9,7 @@ module Primer
|
|
|
9
9
|
DEFAULT_INPUT_WIDTH = :auto
|
|
10
10
|
INPUT_WIDTH_MAPPINGS = {
|
|
11
11
|
DEFAULT_INPUT_WIDTH => "InputGroup-input-width--auto",
|
|
12
|
+
:xsmall => "InputGroup-input-width--xsmall",
|
|
12
13
|
:small => "InputGroup-input-width--small",
|
|
13
14
|
:medium => "InputGroup-input-width--medium",
|
|
14
15
|
:large => "InputGroup-input-width--large",
|
|
@@ -33,6 +33,9 @@ module Primer
|
|
|
33
33
|
# @!macro [new] form_full_width_arguments
|
|
34
34
|
# @param full_width [Boolean] When set to `true`, the field will take up all the horizontal space allowed by its container. Defaults to `true`.
|
|
35
35
|
|
|
36
|
+
# @!macro [new] form_input_width_arguments
|
|
37
|
+
# @param input_width [Symbol] The width of the field. <%= one_of(Primer::Forms::Dsl::Input::INPUT_WIDTH_OPTIONS) %>
|
|
38
|
+
|
|
36
39
|
# @!macro [new] form_system_arguments
|
|
37
40
|
# @param system_arguments [Hash] A hash of attributes passed to the underlying Rails builder methods. These options may mean something special depending on the type of input, otherwise they are emitted as HTML attributes. See the [Rails documentation](https://guides.rubyonrails.org/form_helpers.html) for more information. In addition, the usual Primer utility arguments are accepted in system arguments. For example, passing `mt: 2` will add the `mt-2` class to the input. See the Primer system arguments docs for details.
|
|
38
41
|
|
|
@@ -48,6 +51,7 @@ module Primer
|
|
|
48
51
|
DEFAULT_INPUT_WIDTH = :auto
|
|
49
52
|
INPUT_WIDTH_MAPPINGS = {
|
|
50
53
|
DEFAULT_INPUT_WIDTH => "FormControl-input-width--auto",
|
|
54
|
+
:xsmall => "FormControl-input-width--xsmall",
|
|
51
55
|
:small => "FormControl-input-width--small",
|
|
52
56
|
:medium => "FormControl-input-width--medium",
|
|
53
57
|
:large => "FormControl-input-width--large",
|
|
@@ -11,7 +11,7 @@ module Primer
|
|
|
11
11
|
# @param dismiss_scheme [Symbol] select [none, remove, hide]
|
|
12
12
|
# @param dismiss_label text
|
|
13
13
|
# @param icon [Symbol] octicon
|
|
14
|
-
# @param scheme [Symbol] select [default, warning, danger, success]
|
|
14
|
+
# @param scheme [Symbol] select [default, warning, danger, success, upsell]
|
|
15
15
|
# @param content text
|
|
16
16
|
# @param description text
|
|
17
17
|
def playground(full: false, full_when_narrow: false, dismiss_scheme: Primer::Alpha::Banner::DEFAULT_DISMISS_SCHEME, dismiss_label: Primer::Alpha::Banner::DEFAULT_DISMISS_LABEL, icon: :people, scheme: Primer::Alpha::Banner::DEFAULT_SCHEME, content: "This is a banner!", description: nil)
|
|
@@ -49,6 +49,12 @@ module Primer
|
|
|
49
49
|
def scheme_warning
|
|
50
50
|
render(Primer::Alpha::Banner.new(scheme: :warning)) { "This is a warning banner!" }
|
|
51
51
|
end
|
|
52
|
+
|
|
53
|
+
# @label Upsell
|
|
54
|
+
# @snapshot
|
|
55
|
+
def scheme_upsell
|
|
56
|
+
render(Primer::Alpha::Banner.new(scheme: :upsell)) { "This is a upsell banner!" }
|
|
57
|
+
end
|
|
52
58
|
#
|
|
53
59
|
# @!endgroup
|
|
54
60
|
|
|
@@ -78,7 +84,7 @@ module Primer
|
|
|
78
84
|
# @param full toggle
|
|
79
85
|
# @param dismiss_scheme [Symbol] select [none, remove, hide]
|
|
80
86
|
# @param icon [Symbol] octicon
|
|
81
|
-
# @param scheme [Symbol] select [default, warning, danger, success]
|
|
87
|
+
# @param scheme [Symbol] select [default, warning, danger, success, upsell]
|
|
82
88
|
# @param content text
|
|
83
89
|
# @snapshot
|
|
84
90
|
def with_action_button(full: false, dismiss_scheme: Primer::Alpha::Banner::DEFAULT_DISMISS_SCHEME, icon: :people, scheme: Primer::Alpha::Banner::DEFAULT_SCHEME, content: "This is a banner with an action!")
|
|
@@ -91,7 +97,7 @@ module Primer
|
|
|
91
97
|
# @param full toggle
|
|
92
98
|
# @param dismiss_scheme [Symbol] select [none, remove, hide]
|
|
93
99
|
# @param icon [Symbol] octicon
|
|
94
|
-
# @param scheme [Symbol] select [default, warning, danger, success]
|
|
100
|
+
# @param scheme [Symbol] select [default, warning, danger, success, upsell]
|
|
95
101
|
# @param content text
|
|
96
102
|
# @snapshot
|
|
97
103
|
def with_action_content(full: false, dismiss_scheme: Primer::Alpha::Banner::DEFAULT_DISMISS_SCHEME, icon: :people, scheme: Primer::Alpha::Banner::DEFAULT_SCHEME, content: "Did you know? Comments can be edited.")
|
|
@@ -18,7 +18,7 @@ module Primer
|
|
|
18
18
|
# @param disabled toggle
|
|
19
19
|
# @param invalid toggle
|
|
20
20
|
# @param validation_message text
|
|
21
|
-
# @param input_width [Symbol] select [auto, small, medium, large, xlarge, xxlarge]
|
|
21
|
+
# @param input_width [Symbol] select [auto, xsmall, small, medium, large, xlarge, xxlarge]
|
|
22
22
|
def playground(
|
|
23
23
|
name: "my-select-list",
|
|
24
24
|
id: "my-select-list",
|
|
@@ -16,7 +16,7 @@ module Primer
|
|
|
16
16
|
# @param disabled toggle
|
|
17
17
|
# @param invalid toggle
|
|
18
18
|
# @param validation_message text
|
|
19
|
-
# @param input_width [Symbol] select [auto, small, medium, large, xlarge, xxlarge]
|
|
19
|
+
# @param input_width [Symbol] select [auto, xsmall, small, medium, large, xlarge, xxlarge]
|
|
20
20
|
def playground(
|
|
21
21
|
name: "my-text-area",
|
|
22
22
|
id: "my-text-area",
|
|
@@ -24,7 +24,7 @@ module Primer
|
|
|
24
24
|
# @param monospace toggle
|
|
25
25
|
# @param leading_visual_icon octicon
|
|
26
26
|
# @param leading_spinner toggle
|
|
27
|
-
# @param input_width [Symbol] select [auto, small, medium, large, xlarge, xxlarge]
|
|
27
|
+
# @param input_width [Symbol] select [auto, xsmall, small, medium, large, xlarge, xxlarge]
|
|
28
28
|
def playground(
|
|
29
29
|
name: "my-text-field",
|
|
30
30
|
id: "my-text-field",
|
|
@@ -200,7 +200,7 @@ module Primer
|
|
|
200
200
|
end
|
|
201
201
|
|
|
202
202
|
# @label With trailing label
|
|
203
|
-
# @snapshot
|
|
203
|
+
# @snapshot
|
|
204
204
|
def with_trailing_label
|
|
205
205
|
render(Primer::Alpha::TextField.new(trailing_visual: { label: { text: "Hello" } }, name: "my-text-field-15", label: "My text field"))
|
|
206
206
|
end
|
|
@@ -219,7 +219,7 @@ module Primer
|
|
|
219
219
|
#
|
|
220
220
|
# @!endgroup
|
|
221
221
|
|
|
222
|
-
# @!group Auto check
|
|
222
|
+
# @!group Auto check
|
|
223
223
|
#
|
|
224
224
|
# @label Auto check request ok
|
|
225
225
|
def with_auto_check_ok
|
|
@@ -28,6 +28,15 @@
|
|
|
28
28
|
caption: "What else do you need?",
|
|
29
29
|
input_width: :small
|
|
30
30
|
)
|
|
31
|
+
|
|
32
|
+
f.text_field(
|
|
33
|
+
name: :hours,
|
|
34
|
+
label: "hours",
|
|
35
|
+
type: :number,
|
|
36
|
+
required: true,
|
|
37
|
+
trailing_visual: { text: { text: "min" } },
|
|
38
|
+
input_width: :xsmall
|
|
39
|
+
)
|
|
31
40
|
end
|
|
32
41
|
end
|
|
33
42
|
%>
|
|
@@ -21,7 +21,7 @@ module Primer
|
|
|
21
21
|
# @param value [String]
|
|
22
22
|
# @param visually_hide_label toggle
|
|
23
23
|
# @param readonly toggle
|
|
24
|
-
# @param input_width [Symbol] select [auto, small, medium, large, xlarge, xxlarge]
|
|
24
|
+
# @param input_width [Symbol] select [auto, xsmall, small, medium, large, xlarge, xxlarge]
|
|
25
25
|
# @param caption [String]
|
|
26
26
|
def playground(
|
|
27
27
|
trailing_action: :clipboardCopy,
|
data/static/arguments.json
CHANGED
|
@@ -674,7 +674,7 @@
|
|
|
674
674
|
"name": "scheme",
|
|
675
675
|
"type": "Symbol",
|
|
676
676
|
"default": "`:default`",
|
|
677
|
-
"description": "One of `:danger`, `:default`, `:success`, or `:warning`."
|
|
677
|
+
"description": "One of `:danger`, `:default`, `:success`, `:upsell`, or `:warning`."
|
|
678
678
|
},
|
|
679
679
|
{
|
|
680
680
|
"name": "system_arguments",
|
|
@@ -2316,6 +2316,12 @@
|
|
|
2316
2316
|
"default": "N/A",
|
|
2317
2317
|
"description": "A hash of attributes passed to the underlying Rails builder methods. These options may mean something special depending on the type of input, otherwise they are emitted as HTML attributes. See the [Rails documentation](https://guides.rubyonrails.org/form_helpers.html) for more information. In addition, the usual Primer utility arguments are accepted in system arguments. For example, passing `mt: 2` will add the `mt-2` class to the input. See the Primer system arguments docs for details."
|
|
2318
2318
|
},
|
|
2319
|
+
{
|
|
2320
|
+
"name": "input_width",
|
|
2321
|
+
"type": "Symbol",
|
|
2322
|
+
"default": "N/A",
|
|
2323
|
+
"description": "The width of the field. One of `:auto`, `:large`, `:medium`, `:small`, `:xlarge`, `:xsmall`, or `:xxlarge`."
|
|
2324
|
+
},
|
|
2319
2325
|
{
|
|
2320
2326
|
"name": "multiple",
|
|
2321
2327
|
"type": "Boolean",
|
|
@@ -2344,11 +2350,95 @@
|
|
|
2344
2350
|
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/select_panel.rb",
|
|
2345
2351
|
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/select_panel/default/",
|
|
2346
2352
|
"parameters": [
|
|
2353
|
+
{
|
|
2354
|
+
"name": "src",
|
|
2355
|
+
"type": "String",
|
|
2356
|
+
"default": "`nil`",
|
|
2357
|
+
"description": "The URL to fetch search results from."
|
|
2358
|
+
},
|
|
2359
|
+
{
|
|
2360
|
+
"name": "title",
|
|
2361
|
+
"type": "String",
|
|
2362
|
+
"default": "`\"Menu\"`",
|
|
2363
|
+
"description": "The title that appears at the top of the panel."
|
|
2364
|
+
},
|
|
2365
|
+
{
|
|
2366
|
+
"name": "id",
|
|
2367
|
+
"type": "String",
|
|
2368
|
+
"default": "`self.class.generate_id`",
|
|
2369
|
+
"description": "The unique ID of the panel."
|
|
2370
|
+
},
|
|
2371
|
+
{
|
|
2372
|
+
"name": "size",
|
|
2373
|
+
"type": "Symbol",
|
|
2374
|
+
"default": "`:small`",
|
|
2375
|
+
"description": "The size of the panel. One of `:auto`, `:large`, `:medium`, `:medium_portrait`, `:small`, or `:xlarge`."
|
|
2376
|
+
},
|
|
2377
|
+
{
|
|
2378
|
+
"name": "select_variant",
|
|
2379
|
+
"type": "Symbol",
|
|
2380
|
+
"default": "`:single`",
|
|
2381
|
+
"description": "One of `:multiple`, `:none`, or `:single`."
|
|
2382
|
+
},
|
|
2383
|
+
{
|
|
2384
|
+
"name": "fetch_strategy",
|
|
2385
|
+
"type": "Symbol",
|
|
2386
|
+
"default": "`:remote`",
|
|
2387
|
+
"description": "One of `:eventually_local`, `:local`, or `:remote`."
|
|
2388
|
+
},
|
|
2389
|
+
{
|
|
2390
|
+
"name": "no_results_label",
|
|
2391
|
+
"type": "String",
|
|
2392
|
+
"default": "`\"No results found\"`",
|
|
2393
|
+
"description": "The label to display when no results are found."
|
|
2394
|
+
},
|
|
2395
|
+
{
|
|
2396
|
+
"name": "preload",
|
|
2397
|
+
"type": "Boolean",
|
|
2398
|
+
"default": "`false`",
|
|
2399
|
+
"description": "Whether to preload search results when the page loads. If this option is false, results are loaded when the panel is opened."
|
|
2400
|
+
},
|
|
2401
|
+
{
|
|
2402
|
+
"name": "dynamic_label",
|
|
2403
|
+
"type": "Boolean",
|
|
2404
|
+
"default": "`false`",
|
|
2405
|
+
"description": "Whether or not to display the text of the currently selected item in the show button."
|
|
2406
|
+
},
|
|
2407
|
+
{
|
|
2408
|
+
"name": "dynamic_label_prefix",
|
|
2409
|
+
"type": "String",
|
|
2410
|
+
"default": "`nil`",
|
|
2411
|
+
"description": "If provided, the prefix is prepended to the dynamic label and displayed in the show button."
|
|
2412
|
+
},
|
|
2413
|
+
{
|
|
2414
|
+
"name": "dynamic_aria_label_prefix",
|
|
2415
|
+
"type": "String",
|
|
2416
|
+
"default": "`nil`",
|
|
2417
|
+
"description": "If provided, the prefix is prepended to the dynamic label and set as the value of the `aria-label` attribute on the show button."
|
|
2418
|
+
},
|
|
2419
|
+
{
|
|
2420
|
+
"name": "body_id",
|
|
2421
|
+
"type": "String",
|
|
2422
|
+
"default": "`nil`",
|
|
2423
|
+
"description": "The unique ID of the panel body. If not provided, the body ID will be set to the panel ID with a \"-body\" suffix."
|
|
2424
|
+
},
|
|
2425
|
+
{
|
|
2426
|
+
"name": "list_arguments",
|
|
2427
|
+
"type": "Hash",
|
|
2428
|
+
"default": "`{}`",
|
|
2429
|
+
"description": "Arguments to pass to the underlying [ActionList](/components/alpha/actionlist) component. Only has an effect for the local fetch strategy."
|
|
2430
|
+
},
|
|
2431
|
+
{
|
|
2432
|
+
"name": "form_arguments",
|
|
2433
|
+
"type": "Hash",
|
|
2434
|
+
"default": "`{}`",
|
|
2435
|
+
"description": "Form arguments. Supported for `local`, and experimentally supported for `remote` and `eventually_local` strategies by enabling the `use_experimental_non_local_form` flag."
|
|
2436
|
+
},
|
|
2347
2437
|
{
|
|
2348
2438
|
"name": "use_experimental_non_local_form",
|
|
2349
2439
|
"type": "Boolean",
|
|
2350
2440
|
"default": "`false`",
|
|
2351
|
-
"description": "A feature flag used to slowly roll out moving the input field (generated from form arguments) to the top of the SelectPanel HTML thus allowing remote fetching to have default form values."
|
|
2441
|
+
"description": "A feature flag used to slowly roll out moving the input field (generated from form arguments) to the top of the SelectPanel HTML thus allowing remote fetching to have default form values. At this time, support is only available for the :single select variant. See: https://github.com/github/primer/issues/4923."
|
|
2352
2442
|
},
|
|
2353
2443
|
{
|
|
2354
2444
|
"name": "show_filter",
|
|
@@ -2771,6 +2861,12 @@
|
|
|
2771
2861
|
"type": "Hash",
|
|
2772
2862
|
"default": "N/A",
|
|
2773
2863
|
"description": "A hash of attributes passed to the underlying Rails builder methods. These options may mean something special depending on the type of input, otherwise they are emitted as HTML attributes. See the [Rails documentation](https://guides.rubyonrails.org/form_helpers.html) for more information. In addition, the usual Primer utility arguments are accepted in system arguments. For example, passing `mt: 2` will add the `mt-2` class to the input. See the Primer system arguments docs for details."
|
|
2864
|
+
},
|
|
2865
|
+
{
|
|
2866
|
+
"name": "input_width",
|
|
2867
|
+
"type": "Symbol",
|
|
2868
|
+
"default": "N/A",
|
|
2869
|
+
"description": "The width of the field. One of `:auto`, `:large`, `:medium`, `:small`, `:xlarge`, `:xsmall`, or `:xxlarge`."
|
|
2774
2870
|
}
|
|
2775
2871
|
]
|
|
2776
2872
|
},
|
|
@@ -2902,6 +2998,12 @@
|
|
|
2902
2998
|
"default": "N/A",
|
|
2903
2999
|
"description": "A hash of attributes passed to the underlying Rails builder methods. These options may mean something special depending on the type of input, otherwise they are emitted as HTML attributes. See the [Rails documentation](https://guides.rubyonrails.org/form_helpers.html) for more information. In addition, the usual Primer utility arguments are accepted in system arguments. For example, passing `mt: 2` will add the `mt-2` class to the input. See the Primer system arguments docs for details."
|
|
2904
3000
|
},
|
|
3001
|
+
{
|
|
3002
|
+
"name": "input_width",
|
|
3003
|
+
"type": "Symbol",
|
|
3004
|
+
"default": "N/A",
|
|
3005
|
+
"description": "The width of the field. One of `:auto`, `:large`, `:medium`, `:small`, `:xlarge`, `:xsmall`, or `:xxlarge`."
|
|
3006
|
+
},
|
|
2905
3007
|
{
|
|
2906
3008
|
"name": "placeholder",
|
|
2907
3009
|
"type": "String",
|
data/static/constants.json
CHANGED
|
@@ -197,7 +197,8 @@
|
|
|
197
197
|
"default": "bell",
|
|
198
198
|
"warning": "alert",
|
|
199
199
|
"danger": "stop",
|
|
200
|
-
"success": "check-circle"
|
|
200
|
+
"success": "check-circle",
|
|
201
|
+
"upsell": "info"
|
|
201
202
|
},
|
|
202
203
|
"DEFAULT_SCHEME": "default",
|
|
203
204
|
"DEFAULT_TAG": "div",
|
|
@@ -217,7 +218,8 @@
|
|
|
217
218
|
"default": "",
|
|
218
219
|
"warning": "Banner--warning",
|
|
219
220
|
"danger": "Banner--error",
|
|
220
|
-
"success": "Banner--success"
|
|
221
|
+
"success": "Banner--success",
|
|
222
|
+
"upsell": "Banner--upsell"
|
|
221
223
|
},
|
|
222
224
|
"TAG_OPTIONS": [
|
|
223
225
|
"div",
|
|
@@ -1621,6 +1623,7 @@
|
|
|
1621
1623
|
"GeneratedSlotMethods": "Primer::OpenProject::InputGroup::GeneratedSlotMethods",
|
|
1622
1624
|
"INPUT_WIDTH_MAPPINGS": {
|
|
1623
1625
|
"auto": "InputGroup-input-width--auto",
|
|
1626
|
+
"xsmall": "InputGroup-input-width--xsmall",
|
|
1624
1627
|
"small": "InputGroup-input-width--small",
|
|
1625
1628
|
"medium": "InputGroup-input-width--medium",
|
|
1626
1629
|
"large": "InputGroup-input-width--large",
|
|
@@ -1629,6 +1632,7 @@
|
|
|
1629
1632
|
},
|
|
1630
1633
|
"INPUT_WIDTH_OPTIONS": [
|
|
1631
1634
|
"auto",
|
|
1635
|
+
"xsmall",
|
|
1632
1636
|
"small",
|
|
1633
1637
|
"medium",
|
|
1634
1638
|
"large",
|