@primer/react 38.21.0-rc.325fde4ea → 38.21.0-rc.5d5468919
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.
- package/CHANGELOG.md +0 -2
- package/dist/ActionList/ActionList-e35e912e.css +2 -0
- package/dist/ActionList/ActionList-e35e912e.css.map +1 -0
- package/dist/ActionList/ActionList.module.css.js +1 -1
- package/dist/ActionList/List.d.ts.map +1 -1
- package/dist/ActionList/List.js +31 -55
- package/package.json +1 -1
- package/dist/ActionList/ActionList-53389912.css +0 -2
- package/dist/ActionList/ActionList-53389912.css.map +0 -1
package/CHANGELOG.md
CHANGED
|
@@ -8,8 +8,6 @@
|
|
|
8
8
|
|
|
9
9
|
### Patch Changes
|
|
10
10
|
|
|
11
|
-
- [#7714](https://github.com/primer/react/pull/7714) [`e974d9f`](https://github.com/primer/react/commit/e974d9f6d156805dbda9639a3fe6091a02a1a754) Thanks [@hectahertz](https://github.com/hectahertz)! - perf(ActionList): replace :has() selector with JS-computed attribute
|
|
12
|
-
|
|
13
11
|
- [#7754](https://github.com/primer/react/pull/7754) [`9e3fe4b`](https://github.com/primer/react/commit/9e3fe4b501ce5affb558bf92697e5c79341903ca) Thanks [@liuliu-dev](https://github.com/liuliu-dev)! - Breadcrumbs: On narrow viewports, only show the current page breadcrumb and the overflow menu when `overflow="menu"` is set.
|
|
14
12
|
|
|
15
13
|
- [#7757](https://github.com/primer/react/pull/7757) [`ed82a1e`](https://github.com/primer/react/commit/ed82a1e0399b98428d4b794239bb37649806b5cc) Thanks [@liuliu-dev](https://github.com/liuliu-dev)! - SelectPanel: Lock body scroll when modal variant is on.
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
.prc-ActionList-ActionList-rPFF2,.prc-ActionList-ActionList-rPFF2 ul{list-style:none;margin:0;padding:0}.prc-ActionList-ActionList-rPFF2:where([data-variant=inset]){padding-block:var(--base-size-8,.5rem)}.prc-ActionList-ActionList-rPFF2:where([data-variant=inset],[data-variant=horizontal-inset]) .prc-ActionList-ActionListItem-So4vC{margin-inline:var(--base-size-8,.5rem)}.prc-ActionList-ActionList-rPFF2:where([data-variant=horizontal-inset]){padding-bottom:var(--base-size-8,.5rem)}.prc-ActionList-ActionList-rPFF2:where([data-dividers=true]) .prc-ActionList-ActionListSubContent-gKsFp:before{background:var(--borderColor-muted,#d1d9e0b3);content:"";display:block;height:1px;position:absolute;top:-7px;width:100%}:is(.prc-ActionList-ActionList-rPFF2:where([data-dividers=true]) [data-description-variant=inline]):before{background:var(--borderColor-muted,#d1d9e0b3);content:"";display:block;height:var(--borderWidth-thin,.0625rem);position:absolute;top:-7px;width:100%}:is(.prc-ActionList-ActionList-rPFF2:where([data-dividers=true]) [data-description-variant=inline]) .prc-ActionList-ActionListSubContent-gKsFp:before{content:unset}.prc-ActionList-ActionList-rPFF2:where([data-dividers=true]) .prc-ActionList-ActionListItem-So4vC:first-of-type .prc-ActionList-ActionListSubContent-gKsFp:before,.prc-ActionList-ActionList-rPFF2:where([data-dividers=true]) .prc-ActionList-Divider-taVfb+.prc-ActionList-ActionListItem-So4vC .prc-ActionList-ActionListSubContent-gKsFp:before{visibility:hidden}.prc-ActionList-ActionList-rPFF2:where([data-dividers=true]) .prc-ActionList-ActionListItem-So4vC:first-of-type [data-description-variant=inline]:before,.prc-ActionList-ActionList-rPFF2:where([data-dividers=true]) .prc-ActionList-Divider-taVfb+.prc-ActionList-ActionListItem-So4vC [data-description-variant=inline]:before{visibility:hidden}.prc-ActionList-ActionList-rPFF2 .prc-ActionList-Divider-taVfb:first-child{display:none}.prc-ActionList-ActionList-rPFF2:has([data-has-description=true]):has([data-has-description=false]) .prc-ActionList-ItemLabel-81ohH{font-weight:var(--base-text-weight-normal,400)}.prc-ActionList-ActionListItem-So4vC{background-color:var(--control-transparent-bgColor-rest,#ffffff00);border-radius:var(--borderRadius-medium,.375rem);list-style:none;position:relative}.prc-ActionList-ActionListItem-So4vC:has(>.prc-ActionList-TrailingAction-dMRxe){display:flex;flex-wrap:nowrap}@media (forced-colors:active){.prc-ActionList-ActionListItem-So4vC :focus,.prc-ActionList-ActionListItem-So4vC:focus-visible,.prc-ActionList-ActionListItem-So4vC>a.prc-ActionList-focus-visible-OJCTY,.prc-ActionList-ActionListItem-So4vC[data-is-active-descendant]{outline:1px solid transparent!important}}@media (hover:hover){.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):active,.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):hover{cursor:pointer}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):hover{background-color:var(--control-transparent-bgColor-hover,#818b981a)}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):hover:not([data-active],:focus-visible){box-shadow:var(--boxShadow-thin,inset 0 0 0 .0625rem) var(--control-transparent-borderColor-active,#ffffff00);outline:solid var(--borderWidth-thin,.0625rem) transparent;outline-offset:calc(var(--borderWidth-thin,.0625rem)*-1)}}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):active{background-color:var(--control-transparent-bgColor-active,#818b9826)}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):active:not([data-active]){box-shadow:var(--boxShadow-thin,inset 0 0 0 .0625rem) var(--control-transparent-borderColor-active,#ffffff00);outline:solid var(--borderWidth-thin,.0625rem) transparent;outline-offset:calc(var(--borderWidth-thin,.0625rem)*-1)}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):focus-visible{box-shadow:none;outline:2px solid var(--focus-outline-color,var(--focus-outlineColor,#0969da));outline-offset:0}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):focus-visible .prc-ActionList-ActionListSubContent-gKsFp:before,.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):focus-visible+.prc-ActionList-ActionListItem-So4vC .prc-ActionList-ActionListSubContent-gKsFp:before{visibility:hidden}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-variant=danger]) .prc-ActionList-ItemLabel-81ohH,.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-variant=danger]) .prc-ActionList-LeadingAction-hbWbh,.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-variant=danger]) .prc-ActionList-LeadingVisual-NBr28{color:var(--control-danger-fgColor-rest,#d1242f)}@media (hover:hover){.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-variant=danger]):hover{background:var(--control-danger-bgColor-hover,#ffebe9)}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-variant=danger]):hover .prc-ActionList-ItemLabel-81ohH,.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-variant=danger]):hover .prc-ActionList-LeadingAction-hbWbh,.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-variant=danger]):hover .prc-ActionList-LeadingVisual-NBr28{color:var(--control-danger-fgColor-hover,#d1242f)}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-variant=danger]):hover [data-kbd-chord]{background-color:var(--bgColor-default,#fff);transition:none}}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-variant=danger]):active{background:var(--control-danger-bgColor-active,#ffebe966)}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-variant=danger]):active .prc-ActionList-ItemLabel-81ohH,.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-variant=danger]):active .prc-ActionList-LeadingAction-hbWbh,.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-variant=danger]):active .prc-ActionList-LeadingVisual-NBr28{color:var(--control-danger-fgColor-hover,#d1242f)}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-variant=danger]):active [data-kbd-chord]{background-color:var(--bgColor-default,#fff);transition:none}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-active]){background:var(--control-transparent-bgColor-selected,#818b9826);outline:2px solid transparent}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-active]) .prc-ActionList-ItemLabel-81ohH{color:var(--control-fgColor-rest,#25292e);font-weight:var(--base-text-weight-semibold,600)}@media (hover:hover){.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-active]):hover{background-color:var(--control-transparent-bgColor-hover,#818b981a)}}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-active]) .prc-ActionList-ActionListSubContent-gKsFp:before,.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-active])+.prc-ActionList-ActionListItem-So4vC .prc-ActionList-ActionListSubContent-gKsFp:before{visibility:hidden}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-active]):after{background:var(--borderColor-accent-emphasis,#0969da);border-radius:var(--borderRadius-medium,.375rem);content:"";height:calc(100% - var(--base-size-8,.5rem));left:calc(var(--base-size-8,.5rem)*-1);position:absolute;top:var(--base-size-4,.25rem);width:var(--base-size-4,.25rem)}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-is-active-descendant]){background:var(--control-transparent-bgColor-selected,#818b9826);outline:2px solid transparent}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-is-active-descendant]):after{background:var(--borderColor-accent-emphasis,#0969da);border-radius:var(--borderRadius-medium,.375rem);content:"";height:calc(100% - var(--base-size-8,.5rem));left:calc(var(--base-size-8,.5rem)*-1);position:absolute;top:var(--base-size-4,.25rem);width:var(--base-size-4,.25rem)}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-inactive=true]) * :not([popover],.prc-ActionList-InactiveWarning-1Dszv){color:var(--fgColor-muted,#59636e)}@media (hover:hover){.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-inactive=true]):hover{background-color:transparent;cursor:not-allowed}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-inactive=true]):hover * :not([popover],.prc-ActionList-InactiveWarning-1Dszv){color:var(--fgColor-muted,#59636e)}}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-inactive=true]):active{background:transparent}:is(.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-loading=true]),.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true])>[data-loading=true]) .prc-ActionList-Description-Z-EZJ,:is(.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-loading=true]),.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true])>[data-loading=true]) .prc-ActionList-ItemLabel-81ohH,:is(.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-loading=true]),.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true])>[data-loading=true]) .prc-ActionList-LeadingAction-hbWbh,:is(.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-loading=true]),.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true])>[data-loading=true]) .prc-ActionList-LeadingVisual-NBr28,:is(.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-loading=true]),.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true])>[data-loading=true]) .prc-ActionList-TrailingVisual-jwT9C,:is(.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-loading=true]),.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true])>[data-loading=true]) .prc-ActionList-VisualWrap-bdCsS{color:var(--fgColor-muted,#59636e)}@media (hover:hover){.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):hover .prc-ActionList-ActionListSubContent-gKsFp:before,.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):hover [data-description-variant=inline]:before,.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):hover+.prc-ActionList-ActionListItem-So4vC .prc-ActionList-ActionListSubContent-gKsFp:before,.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):hover+.prc-ActionList-ActionListItem-So4vC [data-description-variant=inline]:before{visibility:hidden}}.prc-ActionList-ActionListItem-So4vC[data-has-subitem=true]>.prc-ActionList-ActionListContent-KBb8-{z-index:1}@media (hover:hover){:is(.prc-ActionList-ActionListItem-So4vC[data-has-subitem=true]>.prc-ActionList-ActionListContent-KBb8-):hover{background-color:var(--control-transparent-bgColor-hover,#818b981a);cursor:pointer}}:is(.prc-ActionList-ActionListItem-So4vC[data-has-subitem=true]>.prc-ActionList-ActionListContent-KBb8-):active{background-color:var(--control-transparent-bgColor-active,#818b9826)}.prc-ActionList-ActionListItem-So4vC[data-has-subitem=true] .prc-ActionList-Spacer-4tR2m{display:block}:is(.prc-ActionList-ActionListItem-So4vC[aria-disabled=true],.prc-ActionList-ActionListItem-So4vC[data-is-disabled]) .prc-ActionList-ActionListContent-KBb8- *{color:var(--control-fgColor-disabled,#818b98)}@media (hover:hover){:is(:is(.prc-ActionList-ActionListItem-So4vC[aria-disabled=true],.prc-ActionList-ActionListItem-So4vC[data-is-disabled]) .prc-ActionList-ActionListContent-KBb8-):hover{background-color:transparent;cursor:not-allowed}}@media (hover:hover){:is(.prc-ActionList-ActionListItem-So4vC[aria-disabled=true],.prc-ActionList-ActionListItem-So4vC[data-is-disabled]):hover{background-color:transparent}}:is(.prc-ActionList-ActionListItem-So4vC[aria-disabled=true],.prc-ActionList-ActionListItem-So4vC[data-is-disabled]) .prc-ActionList-MultiSelectCheckbox-2OqxZ{background-color:var(--control-bgColor-disabled,#eff2f5);border-color:var(--control-borderColor-disabled,#818b981a)}:is([aria-checked=true]:is(.prc-ActionList-ActionListItem-So4vC[aria-disabled=true],.prc-ActionList-ActionListItem-So4vC[data-is-disabled]),[aria-selected=true]:is(.prc-ActionList-ActionListItem-So4vC[aria-disabled=true],.prc-ActionList-ActionListItem-So4vC[data-is-disabled])) .prc-ActionList-MultiSelectCheckbox-2OqxZ{background-color:var(--control-checked-bgColor-disabled,#818b98);border-color:var(--control-checked-bgColor-disabled,#818b98)}:is(:is([aria-checked=true]:is(.prc-ActionList-ActionListItem-So4vC[aria-disabled=true],.prc-ActionList-ActionListItem-So4vC[data-is-disabled]),[aria-selected=true]:is(.prc-ActionList-ActionListItem-So4vC[aria-disabled=true],.prc-ActionList-ActionListItem-So4vC[data-is-disabled])) .prc-ActionList-MultiSelectCheckbox-2OqxZ):before{background-color:var(--control-checked-fgColor-disabled,#fff)}.prc-ActionList-ActionListItem-So4vC:has(.prc-ActionList-TrailingAction-dMRxe [data-loading=true]):not([data-is-disabled]) .prc-ActionList-ItemLabel-81ohH{color:var(--fgColor-default,#1f2328)}.prc-ActionList-ActionListItem-So4vC:has(.prc-ActionList-TrailingAction-dMRxe [data-loading=true]):not([data-is-disabled]) .prc-ActionList-Description-Z-EZJ{color:var(--fgColor-default,#1f2328)}.prc-ActionList-ActionListItem-So4vC[aria-hidden]+.prc-ActionList-Divider-taVfb{display:none}.prc-ActionList-ActionListItem-So4vC .prc-ActionList-MultiSelectCheckbox-2OqxZ{background-color:var(--bgColor-default,#fff);border:var(--borderWidth-thin,.0625rem) solid var(--control-borderColor-emphasis,#818b98);border-radius:var(--borderRadius-small,.1875rem);cursor:pointer;display:grid;height:var(--base-size-16,1rem);margin:0;place-content:center;position:relative;transition:background-color,border-color 80ms cubic-bezier(.33,1,.68,1);width:var(--base-size-16,1rem)}:is(.prc-ActionList-ActionListItem-So4vC .prc-ActionList-MultiSelectCheckbox-2OqxZ):before{animation:prc-ActionList-checkmarkOut-GbMf4 80ms cubic-bezier(.65,0,.35,1);background-color:var(--control-checked-fgColor-rest,#fff);clip-path:inset(var(--base-size-16,1rem) 0 0 0);content:"";height:var(--base-size-16,1rem);mask-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMiIgaGVpZ2h0PSI5IiBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTIgOSI+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMTEuNzguMjJhLjc1Ljc1IDAgMCAxIDAgMS4wNjFMNC41MiA4LjU0MWEuNzUuNzUgMCAwIDEtMS4wNjIgMEwuMjAyIDUuMjg1YS43NS43NSAwIDAgMSAxLjA2MS0xLjA2MWwyLjcyNSAyLjcyM0wxMC43MTguMjJhLjc1Ljc1IDAgMCAxIDEuMDYyIDAiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPg==");mask-position:center;mask-repeat:no-repeat;mask-size:75%;transition:visibility 0s linear .23s;width:var(--base-size-16,1rem)}@media (forced-colors:active){.prc-ActionList-ActionListItem-So4vC .prc-ActionList-MultiSelectCheckbox-2OqxZ{border-width:var(--borderWidth-thin,.0625rem)}}:is(.prc-ActionList-ActionListItem-So4vC[aria-checked=true],.prc-ActionList-ActionListItem-So4vC[aria-selected=true]) .prc-ActionList-MultiSelectCheckbox-2OqxZ{background-color:var(--control-checked-bgColor-rest,#0969da);border-color:var(--control-checked-borderColor-rest,#0969da);transition:background-color,border-color 80ms cubic-bezier(.32,0,.67,0) 0s}:is(:is(.prc-ActionList-ActionListItem-So4vC[aria-checked=true],.prc-ActionList-ActionListItem-So4vC[aria-selected=true]) .prc-ActionList-MultiSelectCheckbox-2OqxZ):before{animation:prc-ActionList-checkmarkIn-gjsPG 80ms cubic-bezier(.65,0,.35,1) 80ms forwards;transition:visibility 0s linear 0s;visibility:visible}@media (forced-colors:active){:is(.prc-ActionList-ActionListItem-So4vC[aria-checked=true],.prc-ActionList-ActionListItem-So4vC[aria-selected=true]) .prc-ActionList-MultiSelectCheckbox-2OqxZ{border-width:8px}}:is(.prc-ActionList-ActionListItem-So4vC[aria-checked=true],.prc-ActionList-ActionListItem-So4vC[aria-selected=true]) .prc-ActionList-SingleSelectCheckmark-zMd8d{visibility:visible}:is(:is(.prc-ActionList-ActionListItem-So4vC[aria-checked=false],.prc-ActionList-ActionListItem-So4vC[aria-selected=false]) .prc-ActionList-MultiSelectCheckbox-2OqxZ):before{visibility:hidden}:is(.prc-ActionList-ActionListItem-So4vC[aria-checked=false],.prc-ActionList-ActionListItem-So4vC[aria-selected=false]) .prc-ActionList-SingleSelectCheckmark-zMd8d{visibility:hidden}.prc-ActionList-SingleSelectCheckmark-zMd8d{visibility:hidden}.prc-ActionList-ActionListContent-KBb8-{--subitem-depth:0px;background-color:transparent;border:none;border-radius:var(--borderRadius-medium,.375rem);color:var(--control-fgColor-rest,#25292e);display:grid;padding-block:var(--control-medium-paddingBlock,.375rem);padding-inline:var(--control-medium-paddingInline-condensed,.5rem);position:relative;text-align:left;touch-action:manipulation;transition:background 33.333ms linear;-webkit-user-select:none;user-select:none;width:100%;-webkit-tap-highlight-color:transparent;align-items:start;grid-template-areas:"spacer leadingAction leadingVisual content";grid-template-columns:min-content min-content min-content minmax(0,auto);grid-template-rows:min-content}.prc-ActionList-ActionListContent-KBb8->:not(:last-child,.prc-ActionList-Spacer-4tR2m){margin-right:var(--control-medium-gap,.5rem)}.prc-ActionList-ActionListContent-KBb8-:hover{cursor:pointer;-webkit-text-decoration:none;text-decoration:none}.prc-ActionList-ActionListContent-KBb8-[data-size=large]{padding-block:var(--control-large-paddingBlock,.625rem)}.prc-ActionList-ActionListContent-KBb8-[aria-expanded=true] .prc-ActionList-ExpandIcon-J4OqB{transform:scaleY(-1)}.prc-ActionList-ActionListContent-KBb8-[aria-expanded=false] .prc-ActionList-ExpandIcon-J4OqB{transform:scaleY(1)}.prc-ActionList-ActionListContent-KBb8-[aria-expanded=false]~.prc-ActionList-SubGroup-5Zje2{display:none}.prc-ActionList-ActionListContent-KBb8-[aria-expanded=false]:has(~.prc-ActionList-SubGroup-5Zje2 [data-active=true]){background:var(--control-transparent-bgColor-selected,#818b9826)}.prc-ActionList-ActionListContent-KBb8-[aria-expanded=false]:has(~.prc-ActionList-SubGroup-5Zje2 [data-active=true]) .prc-ActionList-ItemLabel-81ohH{font-weight:var(--base-text-weight-semibold,600)}.prc-ActionList-ActionListContent-KBb8-[aria-expanded=false]:has(~.prc-ActionList-SubGroup-5Zje2 [data-active=true]) .prc-ActionList-ActionListSubContent-gKsFp:before,.prc-ActionList-ActionListContent-KBb8-[aria-expanded=false]:has(~.prc-ActionList-SubGroup-5Zje2 [data-active=true])+.prc-ActionList-ActionListItem-So4vC .prc-ActionList-ActionListSubContent-gKsFp:before{visibility:hidden}.prc-ActionList-ActionListContent-KBb8-[aria-expanded=false]:has(~.prc-ActionList-SubGroup-5Zje2 [data-active=true]):after{background:var(--borderColor-accent-emphasis,#0969da);border-radius:var(--borderRadius-medium,.375rem);content:"";height:calc(100% - var(--base-size-8,.5rem));left:calc(var(--base-size-8,.5rem)*-1);position:absolute;top:var(--base-size-4,.25rem);width:var(--base-size-4,.25rem)}.prc-ActionList-ActionListSubContent-gKsFp{align-items:start;display:grid;grid-area:content;grid-template-areas:"label trailingVisual trailingAction";grid-template-columns:minmax(0,auto) min-content min-content;grid-template-rows:min-content;position:relative;width:100%}.prc-ActionList-ActionListSubContent-gKsFp>:not(:last-child){margin-right:var(--control-medium-gap,.5rem)}.prc-ActionList-Spacer-4tR2m{display:none;grid-area:spacer;width:max(0px,var(--subitem-depth) * 8px)}.prc-ActionList-LeadingAction-hbWbh{grid-area:leadingAction}.prc-ActionList-LeadingVisual-NBr28{grid-area:leadingVisual}.prc-ActionList-TrailingVisual-jwT9C{font-size:var(--text-body-size-medium,.875rem);grid-area:trailingVisual}.prc-ActionList-TrailingAction-dMRxe{grid-area:trailingAction}.prc-ActionList-TrailingAction-dMRxe>[data-loading-wrapper]{height:100%}.prc-ActionList-ItemDescriptionWrap-ujC8S{display:flex;flex-direction:column;gap:var(--base-size-4,.25rem);grid-area:label}.prc-ActionList-ItemDescriptionWrap-ujC8S .prc-ActionList-ItemLabel-81ohH{font-weight:var(--base-text-weight-semibold,600);word-break:break-word}.prc-ActionList-ItemDescriptionWrap-ujC8S:where([data-description-variant=inline]){align-items:baseline;flex-direction:row;gap:var(--base-size-8,.5rem);position:relative;word-break:normal}.prc-ActionList-ItemDescriptionWrap-ujC8S:where([data-description-variant=inline]) .prc-ActionList-ItemLabel-81ohH{word-break:normal}.prc-ActionList-ItemDescriptionWrap-ujC8S:where([data-description-variant=inline]):has([data-truncate=true]) .prc-ActionList-ItemLabel-81ohH{flex:1 0 auto}.prc-ActionList-ItemDescriptionWrap-ujC8S:where([data-description-variant=inline]) .prc-ActionList-Description-Z-EZJ{line-height:16px}.prc-ActionList-Description-Z-EZJ{font-size:var(--text-body-size-small,.75rem);font-weight:var(--base-text-weight-normal,400);line-height:16px}.prc-ActionList-Description-Z-EZJ,.prc-ActionList-VisualWrap-bdCsS{color:var(--fgColor-muted,#59636e)}.prc-ActionList-VisualWrap-bdCsS{display:flex;line-height:20px;min-height:var(--base-size-20,1.25rem);min-width:max-content;pointer-events:none;fill:var(--fgColor-muted,#59636e);align-items:center}.prc-ActionList-ItemLabel-81ohH{color:var(--fgColor-default,#1f2328);font-size:var(--text-body-size-medium,.875rem);font-weight:var(--base-text-weight-normal,400);grid-area:label;line-height:20px;position:relative;word-break:break-word}.prc-ActionList-SubGroup-5Zje2 .prc-ActionList-ItemLabel-81ohH{font-size:var(--text-body-size-small,.75rem)}.prc-ActionList-SubGroup-5Zje2 .prc-ActionList-ActionListItem-So4vC{margin-inline:0}.prc-ActionList-TrailingActionButton-UUAk6{border-bottom-left-radius:0;border-top-left-radius:0;height:100%}.prc-ActionList-TrailingActionButton-UUAk6[data-loading=true]:has([data-component=buttonContent]){padding:0 0 0 calc(var(--base-size-12,.75rem)*2)}.prc-ActionList-TrailingActionButton-UUAk6[data-loading=true]:has([data-component=buttonContent]) [data-component=loadingSpinner]{align-items:center;display:flex;height:var(--control-medium-size,2rem);justify-content:center;place-self:end;width:var(--control-medium-size,2rem)}.prc-ActionList-InactiveButtonWrap-Ia-xM:has(.prc-ActionList-TrailingVisual-jwT9C){grid-area:trailingVisual}.prc-ActionList-InactiveButtonWrap-Ia-xM:has(.prc-ActionList-LeadingVisual-NBr28){grid-area:leadingVisual}.prc-ActionList-Divider-taVfb{background:var(--borderColor-muted,#d1d9e0b3);border:0;display:block;height:var(--borderWidth-thin,.0625rem);list-style:none;margin-block-end:var(--base-size-8,.5rem);margin-block-start:calc(var(--base-size-8,.5rem) - var(--borderWidth-thin,.0625rem));padding:0}.prc-ActionList-InactiveButtonReset-uK4-x{background:none;border:none;color:inherit;cursor:pointer;display:flex;font:inherit;padding:0}.prc-ActionList-InactiveWarning-1Dszv{color:var(--fgColor-attention,#9a6700);font-size:var(--text-body-size-small,.75rem);grid-row:2/2;line-height:16px}@keyframes prc-ActionList-checkmarkIn-gjsPG{0%{clip-path:inset(var(--base-size-16,1rem) 0 0 0)}to{clip-path:inset(0 0 0 0)}}@keyframes prc-ActionList-checkmarkOut-GbMf4{0%{clip-path:inset(0 0 0 0)}to{clip-path:inset(var(--base-size-16,1rem) 0 0 0)}}
|
|
2
|
+
/*# sourceMappingURL=ActionList-e35e912e.css.map */
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/ActionList/ActionList.module.css.js","../../postcss-preset-primer/src/mixins/focusOutline.css","../../postcss-preset-primer/src/mixins/activeIndicatorLine.css"],"names":[],"mappings":"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","file":"ActionList-e35e912e.css","sourcesContent":["/* stylelint-disable max-nesting-depth, selector-max-specificity */\n\n.ActionList {\n padding: 0;\n margin: 0;\n list-style: none;\n\n ul {\n padding: 0;\n margin: 0;\n list-style: none;\n }\n\n &:where([data-variant='inset']) {\n padding-block: var(--base-size-8);\n }\n\n &:where([data-variant='inset'], [data-variant='horizontal-inset']) {\n /* this is only to match default experience */\n & .ActionListItem {\n margin-inline: var(--base-size-8);\n }\n }\n\n &:where([data-variant='horizontal-inset']) {\n padding-bottom: var(--base-size-8);\n }\n\n &:where([data-dividers='true']) {\n /* place dividers on the wrapper that excludes leading visuals/actions */\n & .ActionListSubContent::before {\n position: absolute;\n\n /* use this top size after FF removed */\n\n /* top: calc(-1 * var(--control-medium-paddingBlock)); */\n /* stylelint-disable-next-line primer/spacing */\n top: -7px;\n display: block;\n width: 100%;\n height: 1px;\n content: '';\n /* stylelint-disable-next-line primer/colors */\n background: var(--borderColor-muted);\n }\n\n /* if inline description, move pseudo divider to description wrapper */\n & [data-description-variant='inline'] {\n &::before {\n position: absolute;\n\n /* use this top size after FF removed */\n\n /* top: calc(-1 * var(--control-medium-paddingBlock)); */\n /* stylelint-disable-next-line primer/spacing */\n top: -7px;\n display: block;\n width: 100%;\n height: var(--borderWidth-thin);\n content: '';\n /* stylelint-disable-next-line primer/colors */\n background: var(--borderColor-muted);\n }\n\n /* remove the default divider */\n & .ActionListSubContent::before {\n content: unset;\n }\n }\n\n /* hide if item is first of type with label::before, or is the first item after a sectionDivider */\n .ActionListItem:first-of-type .ActionListSubContent::before,\n .Divider + .ActionListItem .ActionListSubContent::before {\n visibility: hidden;\n }\n\n /* hide if item is first of type with label::before, or is the first item after a sectionDivider */\n .ActionListItem:first-of-type [data-description-variant='inline']::before,\n .Divider + .ActionListItem [data-description-variant='inline']::before {\n visibility: hidden;\n }\n }\n\n /* Make sure that the first visible item isn't a divider */\n & .Divider:first-child {\n display: none;\n }\n\n /* if a list has a mix of items with and without descriptions, reset the label font-weight to normal */\n &:has([data-has-description='true']):has([data-has-description='false']) {\n & .ItemLabel {\n font-weight: var(--base-text-weight-normal);\n }\n }\n}\n\n/* ActionListItem is a li that handles visual state, while ActionListItemContent controls actual state via button or link */\n\n.ActionListItem {\n position: relative;\n list-style: none;\n background-color: var(--control-transparent-bgColor-rest);\n border-radius: var(--borderRadius-medium);\n\n /* apply flex if trailing action exists as an immediate child */\n &:has(> .TrailingAction) {\n display: flex;\n flex-wrap: nowrap;\n }\n\n /* state */\n\n @media (forced-colors: active) {\n :focus,\n &:focus-visible,\n /* stylelint-disable-next-line selector-no-qualifying-type */\n >a.focus-visible,\n &[data-is-active-descendant] {\n /* Support for Windows high contrast https://sarahmhigley.com/writing/whcm-quick-tips */\n outline: solid 1px transparent !important;\n }\n }\n\n &:not([data-is-disabled], [data-has-subitem='true']) {\n @media (hover: hover) {\n &:hover,\n &:active {\n cursor: pointer;\n }\n\n &:hover {\n background-color: var(--control-transparent-bgColor-hover);\n\n &:not([data-active], :focus-visible) {\n /* Support for \"Windows high contrast mode\" https:sarahmhigley.com/writing/whcm-quick-tips/ */\n outline: solid var(--borderWidth-thin) transparent;\n outline-offset: calc(-1 * var(--borderWidth-thin));\n box-shadow: var(--boxShadow-thin) var(--control-transparent-borderColor-active);\n }\n }\n }\n\n &:active {\n background-color: var(--control-transparent-bgColor-active);\n\n &:not([data-active]) {\n /* Support for \"Windows high contrast mode\" https:sarahmhigley.com/writing/whcm-quick-tips/ */\n outline: solid var(--borderWidth-thin) transparent;\n outline-offset: calc(-1 * var(--borderWidth-thin));\n box-shadow: var(--boxShadow-thin) var(--control-transparent-borderColor-active);\n }\n }\n\n &:focus-visible {\n @mixin focusOutline 0;\n\n & .ActionListSubContent::before,\n & + .ActionListItem .ActionListSubContent::before {\n visibility: hidden;\n }\n }\n\n /* danger */\n &:where([data-variant='danger']) {\n & .LeadingAction,\n .LeadingVisual,\n .ItemLabel {\n color: var(--control-danger-fgColor-rest);\n }\n\n @media (hover: hover) {\n &:hover {\n background: var(--control-danger-bgColor-hover);\n\n & .LeadingAction,\n .LeadingVisual,\n .ItemLabel {\n color: var(--control-danger-fgColor-hover);\n }\n\n & [data-kbd-chord] {\n background-color: var(--bgColor-default);\n transition: none;\n }\n }\n }\n\n &:active {\n background: var(--control-danger-bgColor-active);\n\n & .LeadingAction,\n .LeadingVisual,\n .ItemLabel {\n color: var(--control-danger-fgColor-hover);\n }\n\n & [data-kbd-chord] {\n background-color: var(--bgColor-default);\n transition: none;\n }\n }\n }\n\n /* active state [aria-current] */\n &:where([data-active]) {\n background: var(--control-transparent-bgColor-selected);\n\n /* provides a visual indication of the current item for Windows high-contrast mode */\n outline: 2px solid transparent;\n\n & .ItemLabel {\n font-weight: var(--base-text-weight-semibold);\n color: var(--control-fgColor-rest);\n }\n\n @media (hover: hover) {\n &:hover {\n background-color: var(--control-transparent-bgColor-hover);\n }\n }\n\n /* hide dividers if showDividers is true and item is active */\n\n & .ActionListSubContent::before,\n & + .ActionListItem .ActionListSubContent::before {\n visibility: hidden;\n }\n\n /* blue accent line */\n &::after {\n @mixin activeIndicatorLine;\n }\n }\n\n &:where([data-is-active-descendant]) {\n background: var(--control-transparent-bgColor-selected);\n\n /* provides a visual indication of the current item for Windows high-contrast mode */\n outline: 2px solid transparent;\n\n /* hide dividers if showDividers is true and item is active */\n\n /* add back in after FF ship */\n\n /* & .ActionListSubContent::before,\n & + .ActionListItem .ActionListSubContent::before {\n visibility: hidden;\n } */\n\n /* blue accent line */\n &::after {\n @mixin activeIndicatorLine;\n }\n }\n\n /* inactive */\n &:where([data-inactive='true']) {\n /* ignore tooltip */\n & * :not([popover], .InactiveWarning) {\n color: var(--fgColor-muted);\n }\n\n @media (hover: hover) {\n &:hover {\n cursor: not-allowed;\n background-color: transparent;\n\n & * :not([popover], .InactiveWarning) {\n color: var(--fgColor-muted);\n }\n }\n }\n\n &:active {\n background: transparent;\n }\n }\n\n &:where([data-loading='true']),\n & > [data-loading='true'] {\n & .ItemLabel,\n & .Description,\n & .LeadingVisual,\n & .TrailingVisual,\n & .LeadingAction,\n & .VisualWrap {\n color: var(--fgColor-muted);\n }\n }\n\n /* hide dividers */\n @media (hover: hover) {\n &:hover {\n & .ActionListSubContent::before,\n & + .ActionListItem .ActionListSubContent::before {\n visibility: hidden;\n }\n\n & [data-description-variant='inline']::before,\n & + .ActionListItem [data-description-variant='inline']::before {\n visibility: hidden;\n }\n }\n }\n }\n\n /* if item has subitem, move hover styles to ActionListContent */\n &[data-has-subitem='true'] {\n /* first child */\n & > .ActionListContent {\n z-index: 1;\n\n @media (hover: hover) {\n &:hover {\n cursor: pointer;\n background-color: var(--control-transparent-bgColor-hover);\n }\n }\n\n &:active {\n background-color: var(--control-transparent-bgColor-active);\n }\n }\n\n & .Spacer {\n display: block;\n }\n }\n\n /* disabled */\n\n &[aria-disabled='true'],\n &[data-is-disabled] {\n & .ActionListContent * {\n color: var(--control-fgColor-disabled);\n }\n\n & .ActionListContent {\n @media (hover: hover) {\n &:hover {\n cursor: not-allowed;\n background-color: transparent;\n }\n }\n }\n\n @media (hover: hover) {\n &:hover {\n background-color: transparent;\n }\n }\n\n & .MultiSelectCheckbox {\n background-color: var(--control-bgColor-disabled);\n border-color: var(--control-borderColor-disabled);\n }\n\n &[aria-checked='true'],\n &[aria-selected='true'] {\n & .MultiSelectCheckbox {\n background-color: var(--control-checked-bgColor-disabled);\n /* stylelint-disable-next-line primer/colors */\n border-color: var(--control-checked-bgColor-disabled);\n\n &::before {\n /* stylelint-disable-next-line primer/colors */\n background-color: var(--control-checked-fgColor-disabled);\n }\n }\n }\n }\n\n /* When TrailingAction is in loading state, keep labels and descriptions accessible */\n &:has(.TrailingAction [data-loading='true']):not([data-is-disabled]) {\n /* Ensure labels and descriptions maintain accessibility contrast */\n & .ItemLabel {\n color: var(--fgColor-default);\n }\n\n & .Description {\n color: var(--fgColor-default);\n }\n }\n\n /* Make sure that the first visible item isn't a divider */\n &[aria-hidden] + .Divider {\n display: none;\n }\n\n /*\n * checkbox item [aria-checked]\n * listbox [aria-selected]\n */\n\n & .MultiSelectCheckbox {\n position: relative;\n display: grid;\n width: var(--base-size-16);\n height: var(--base-size-16);\n margin: 0;\n cursor: pointer;\n background-color: var(--bgColor-default);\n border: var(--borderWidth-thin) solid var(--control-borderColor-emphasis);\n border-radius: var(--borderRadius-small);\n transition:\n background-color,\n border-color 80ms cubic-bezier(0.33, 1, 0.68, 1);\n /* checked -> unchecked - add 120ms delay to fully see animation-out */\n\n place-content: center;\n\n &::before {\n width: var(--base-size-16);\n height: var(--base-size-16);\n content: '';\n /* stylelint-disable-next-line primer/colors */\n background-color: var(--control-checked-fgColor-rest);\n transition: visibility 0s linear 230ms;\n clip-path: inset(var(--base-size-16) 0 0 0);\n\n /* octicon checkmark image */\n mask-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iOSIgdmlld0JveD0iMCAwIDEyIDkiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTEuNzgwMyAwLjIxOTYyNUMxMS45MjEgMC4zNjA0MjcgMTIgMC41NTEzMDUgMTIgMC43NTAzMTNDMTIgMC45NDkzMjEgMTEuOTIxIDEuMTQwMTkgMTEuNzgwMyAxLjI4MUw0LjUxODYgOC41NDA0MkM0LjM3Nzc1IDguNjgxIDQuMTg2ODIgOC43NiAzLjk4Nzc0IDguNzZDMy43ODg2NyA4Ljc2IDMuNTk3NzMgOC42ODEgMy40NTY4OSA4LjU0MDQyTDAuMjAxNjIyIDUuMjg2MkMwLjA2ODkyNzcgNS4xNDM4MyAtMC4wMDMzMDkwNSA0Ljk1NTU1IDAuMDAwMTE2NDkzIDQuNzYwOThDMC4wMDM1NTIwNSA0LjU2NjQzIDAuMDgyMzg5NCA0LjM4MDgxIDAuMjIwMDMyIDQuMjQzMjFDMC4zNTc2NjUgNC4xMDU2MiAwLjU0MzM1NSA0LjAyNjgxIDAuNzM3OTcgNC4wMjMzOEMwLjkzMjU4NCA0LjAxOTk0IDEuMTIwOTMgNC4wOTIxNyAxLjI2MzM0IDQuMjI0ODJMMy45ODc3NCA2Ljk0ODM1TDEwLjcxODYgMC4yMTk2MjVDMTAuODU5NSAwLjA3ODk5MjMgMTEuMDUwNCAwIDExLjI0OTUgMEMxMS40NDg1IDAgMTEuNjM5NSAwLjA3ODk5MjMgMTEuNzgwMyAwLjIxOTYyNVoiIGZpbGw9IndoaXRlIi8+Cjwvc3ZnPgo=');\n mask-size: 75%;\n mask-repeat: no-repeat;\n mask-position: center;\n animation: checkmarkOut 80ms cubic-bezier(0.65, 0, 0.35, 1);\n /* forwards; slightly snappier animation out */\n }\n\n @media (forced-colors: active) {\n /* Support for Windows high contrast https://sarahmhigley.com/writing/whcm-quick-tips */\n\n /* background-color will be overriden but border-width is a workaround */\n border-width: var(--borderWidth-thin);\n }\n }\n\n &[aria-checked='true'],\n &[aria-selected='true'] {\n & .MultiSelectCheckbox {\n background-color: var(--control-checked-bgColor-rest);\n border-color: var(--control-checked-borderColor-rest);\n transition:\n background-color,\n border-color 80ms cubic-bezier(0.32, 0, 0.67, 0) 0ms;\n /* unchecked -> checked */\n\n &::before {\n visibility: visible;\n transition: visibility 0s linear 0s;\n animation: checkmarkIn 80ms cubic-bezier(0.65, 0, 0.35, 1) forwards 80ms;\n }\n\n @media (forced-colors: active) {\n /* Support for Windows high contrast https://sarahmhigley.com/writing/whcm-quick-tips\n background-color will be overriden but border-width is a workaround */\n /* stylelint-disable-next-line primer/borders */\n border-width: 8px;\n }\n }\n\n & .SingleSelectCheckmark {\n visibility: visible;\n }\n }\n\n &[aria-checked='false'],\n &[aria-selected='false'] {\n & .MultiSelectCheckbox {\n &::before {\n visibility: hidden;\n }\n }\n\n & .SingleSelectCheckmark {\n visibility: hidden;\n }\n }\n}\n\n/* hide by default to support inactive state where role cannot be menuitemradio or menuitemcheckbox */\n.SingleSelectCheckmark {\n visibility: hidden;\n}\n\n/* button or a tag */\n\n/* [ [spacer] [leadingAction] [leadingVisual] [content] ] */\n.ActionListContent {\n --subitem-depth: 0px;\n\n position: relative;\n display: grid;\n width: 100%;\n color: var(--control-fgColor-rest);\n text-align: left;\n user-select: none;\n background-color: transparent;\n border: none;\n border-radius: var(--borderRadius-medium);\n transition: background 33.333ms linear;\n /* stylelint-disable-next-line primer/spacing */\n padding-block: var(--control-medium-paddingBlock);\n /* stylelint-disable-next-line primer/spacing */\n padding-inline: var(--control-medium-paddingInline-condensed);\n touch-action: manipulation;\n -webkit-tap-highlight-color: transparent;\n grid-template-rows: min-content;\n grid-template-areas: 'spacer leadingAction leadingVisual content';\n grid-template-columns: min-content min-content min-content minmax(0, auto);\n align-items: start;\n\n /* column-gap persists with empty grid-areas, margin applies only when children exist */\n & > :not(:last-child, .Spacer) {\n /* stylelint-disable-next-line primer/spacing */\n margin-right: var(--control-medium-gap);\n }\n\n &:hover {\n text-decoration: none;\n cursor: pointer;\n }\n\n /* large */\n\n &[data-size='large'] {\n /* stylelint-disable-next-line primer/spacing */\n padding-block: var(--control-large-paddingBlock);\n }\n\n /* collapsible item [aria-expanded] */\n\n &[aria-expanded='true'] {\n & .ExpandIcon {\n transform: scaleY(-1);\n }\n }\n\n &[aria-expanded='false'] {\n & .ExpandIcon {\n transform: scaleY(1);\n }\n\n & ~ .SubGroup {\n display: none;\n }\n\n /* show active indicator on parent collapse if child is active */\n &:has(~ .SubGroup [data-active='true']) {\n background: var(--control-transparent-bgColor-selected);\n\n & .ItemLabel {\n font-weight: var(--base-text-weight-semibold);\n }\n\n & .ActionListSubContent::before,\n & + .ActionListItem .ActionListSubContent::before {\n visibility: hidden;\n }\n\n /* blue accent line */\n &::after {\n @mixin activeIndicatorLine;\n }\n }\n }\n}\n\n/* [ [content] [trailingVisual] [trailingAction] ] */\n.ActionListSubContent {\n grid-area: content;\n position: relative;\n display: grid;\n width: 100%;\n grid-template-rows: min-content;\n grid-template-areas: 'label trailingVisual trailingAction';\n grid-template-columns: minmax(0, auto) min-content min-content;\n align-items: start;\n\n /* column-gap persists with empty grid-areas, margin applies only when children exist */\n & > :not(:last-child) {\n /* stylelint-disable-next-line primer/spacing */\n margin-right: var(--control-medium-gap);\n }\n}\n\n/* place children on grid */\n\n/* spacer used to create depth for nested lists */\n\n.Spacer {\n display: none;\n width: max(0px, var(--subitem-depth) * 8px);\n grid-area: spacer;\n}\n\n.LeadingAction {\n grid-area: leadingAction;\n}\n\n.LeadingVisual {\n grid-area: leadingVisual;\n}\n\n.TrailingVisual {\n grid-area: trailingVisual;\n font-size: var(--text-body-size-medium);\n}\n\n.TrailingAction {\n grid-area: trailingAction;\n\n /* if child is loading button */\n & > *[data-loading-wrapper] {\n height: 100%;\n }\n}\n\n/* wrapper span\ndefault block */\n.ItemDescriptionWrap {\n grid-area: label;\n display: flex;\n flex-direction: column;\n gap: var(--base-size-4);\n\n & .ItemLabel {\n font-weight: var(--base-text-weight-semibold);\n /* stylelint-disable-next-line declaration-property-value-keyword-no-deprecated */\n word-break: break-word;\n }\n\n /* inline */\n &:where([data-description-variant='inline']) {\n position: relative;\n word-break: normal;\n flex-direction: row;\n align-items: baseline;\n gap: var(--base-size-8);\n\n & .ItemLabel {\n word-break: normal;\n }\n\n &:has([data-truncate='true']) {\n & .ItemLabel {\n flex: 1 0 auto;\n }\n }\n\n & .Description {\n /* stylelint-disable-next-line primer/typography */\n line-height: 16px;\n }\n }\n}\n\n/* description */\n.Description {\n font-size: var(--text-body-size-small);\n font-weight: var(--base-text-weight-normal);\n\n /* line-height: var(--text-caption-lineHeight); */\n\n /* remove after FF ships */\n /* stylelint-disable-next-line primer/typography */\n line-height: 16px;\n color: var(--fgColor-muted);\n}\n\n/* helper for grid alignment with multi-line content\nspan wrapping svg or text */\n.VisualWrap {\n display: flex;\n min-width: max-content;\n min-height: var(--base-size-20);\n /* stylelint-disable-next-line primer/typography */\n line-height: 20px;\n /* temporary until we fix line-height rounding in primitives */\n color: var(--fgColor-muted);\n pointer-events: none;\n fill: var(--fgColor-muted);\n align-items: center;\n}\n\n/* text */\n.ItemLabel {\n position: relative;\n font-size: var(--text-body-size-medium);\n font-weight: var(--base-text-weight-normal);\n /* stylelint-disable-next-line primer/typography */\n line-height: 20px;\n /* temporary until we fix line-height rounding in primitives */\n color: var(--fgColor-default);\n grid-area: label;\n /* stylelint-disable-next-line declaration-property-value-keyword-no-deprecated */\n word-break: break-word;\n}\n\n.SubGroup {\n & .ItemLabel {\n font-size: var(--text-body-size-small);\n }\n\n & .ActionListItem {\n margin-inline: 0;\n }\n}\n\n/* trailing action icon button */\n\n.TrailingActionButton {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n height: 100%;\n\n /* Preserve width consistency when loading state is active for text buttons only */\n &[data-loading='true']:has([data-component='buttonContent']) {\n /* Double the left padding to compensate for missing right padding */\n padding: 0 0 0 calc(var(--base-size-12) * 2);\n\n /* Position spinner at the end to align with IconButton */\n & [data-component='loadingSpinner'] {\n place-self: end;\n /* Match the IconButton spinner size */\n width: var(--control-medium-size, 2rem);\n height: var(--control-medium-size, 2rem);\n /* Ensure spinner is properly centered */\n display: flex;\n align-items: center;\n justify-content: center;\n }\n }\n}\n\n.InactiveButtonWrap {\n &:has(.TrailingVisual) {\n grid-area: trailingVisual;\n }\n\n &:has(.LeadingVisual) {\n grid-area: leadingVisual;\n }\n}\n\n.Divider {\n display: block;\n height: var(--borderWidth-thin);\n padding: 0;\n /* stylelint-disable-next-line primer/spacing */\n margin-block-start: calc(var(--base-size-8) - var(--borderWidth-thin));\n margin-block-end: var(--base-size-8);\n list-style: none;\n /* stylelint-disable-next-line primer/colors */\n background: var(--borderColor-muted);\n border: 0;\n}\n\n.InactiveButtonReset {\n display: flex;\n padding: 0;\n font: inherit;\n color: inherit;\n cursor: pointer;\n background: none;\n border: none;\n}\n\n.InactiveWarning {\n font-size: var(--text-body-size-small);\n\n /* line-height: var(--text-caption-lineHeight); */\n\n /* use variable when FF removed */\n /* stylelint-disable-next-line primer/typography */\n line-height: 16px;\n color: var(--fgColor-attention);\n grid-row: 2/2;\n}\n\n@keyframes checkmarkIn {\n from {\n clip-path: inset(var(--base-size-16) 0 0 0);\n }\n\n to {\n clip-path: inset(0 0 0 0);\n }\n}\n\n@keyframes checkmarkOut {\n from {\n clip-path: inset(0 0 0 0);\n }\n\n to {\n clip-path: inset(var(--base-size-16) 0 0 0);\n }\n}\n","@define-mixin focusOutline $outlineOffset: -2px, $outlineColor: var(--focus-outline-color, var(--focus-outlineColor)) {\n outline: 2px solid $outlineColor;\n outline-offset: $outlineOffset;\n box-shadow: none;\n}\n","@define-mixin activeIndicatorLine {\n position: absolute;\n top: var(--base-size-4);\n left: calc(-1 * var(--base-size-8));\n width: var(--base-size-4);\n height: calc(100% - var(--base-size-8));\n content: '';\n /* stylelint-disable-next-line primer/colors */\n background: var(--borderColor-accent-emphasis);\n border-radius: var(--borderRadius-medium);\n}\n"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import './ActionList-
|
|
1
|
+
import './ActionList-e35e912e.css';
|
|
2
2
|
|
|
3
3
|
var classes = {"ActionList":"prc-ActionList-ActionList-rPFF2","ActionListItem":"prc-ActionList-ActionListItem-So4vC","ActionListSubContent":"prc-ActionList-ActionListSubContent-gKsFp","Divider":"prc-ActionList-Divider-taVfb","ItemLabel":"prc-ActionList-ItemLabel-81ohH","TrailingAction":"prc-ActionList-TrailingAction-dMRxe","focus-visible":"prc-ActionList-focus-visible-OJCTY","LeadingAction":"prc-ActionList-LeadingAction-hbWbh","LeadingVisual":"prc-ActionList-LeadingVisual-NBr28","InactiveWarning":"prc-ActionList-InactiveWarning-1Dszv","Description":"prc-ActionList-Description-Z-EZJ","TrailingVisual":"prc-ActionList-TrailingVisual-jwT9C","VisualWrap":"prc-ActionList-VisualWrap-bdCsS","ActionListContent":"prc-ActionList-ActionListContent-KBb8-","Spacer":"prc-ActionList-Spacer-4tR2m","MultiSelectCheckbox":"prc-ActionList-MultiSelectCheckbox-2OqxZ","checkmarkOut":"prc-ActionList-checkmarkOut-GbMf4","checkmarkIn":"prc-ActionList-checkmarkIn-gjsPG","SingleSelectCheckmark":"prc-ActionList-SingleSelectCheckmark-zMd8d","ExpandIcon":"prc-ActionList-ExpandIcon-J4OqB","SubGroup":"prc-ActionList-SubGroup-5Zje2","ItemDescriptionWrap":"prc-ActionList-ItemDescriptionWrap-ujC8S","TrailingActionButton":"prc-ActionList-TrailingActionButton-UUAk6","InactiveButtonWrap":"prc-ActionList-InactiveButtonWrap-Ia-xM","InactiveButtonReset":"prc-ActionList-InactiveButtonReset-uK4-x"};
|
|
4
4
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"List.d.ts","sourceRoot":"","sources":["../../src/ActionList/List.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiB,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"List.d.ts","sourceRoot":"","sources":["../../src/ActionList/List.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiB,MAAM,OAAO,CAAA;AAuFrC,QAAA,MAAM,IAAI,GA3Ea,EAAE,SAAS,KAAK,CAAC,WAAW;;;;;;;;;;;;;;;;;;;;oDA2ER,CAAA;AAI3C,OAAO,EAAC,IAAI,EAAC,CAAA"}
|
package/dist/ActionList/List.js
CHANGED
|
@@ -9,14 +9,13 @@ import { ListContext } from './shared.js';
|
|
|
9
9
|
import { useFocusZone } from '../hooks/useFocusZone.js';
|
|
10
10
|
import { clsx } from 'clsx';
|
|
11
11
|
import classes from './ActionList.module.css.js';
|
|
12
|
-
import useIsomorphicLayoutEffect from '../utils/useIsomorphicLayoutEffect.js';
|
|
13
12
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
14
13
|
import { useProvidedRefOrCreate } from '../hooks/useProvidedRefOrCreate.js';
|
|
15
14
|
import { FocusKeys } from '@primer/behaviors';
|
|
16
15
|
|
|
17
16
|
const UnwrappedList = (props, forwardedRef) => {
|
|
18
17
|
var _slots$heading$props$;
|
|
19
|
-
const $ = c(
|
|
18
|
+
const $ = c(37);
|
|
20
19
|
let className;
|
|
21
20
|
let restProps;
|
|
22
21
|
let role;
|
|
@@ -133,42 +132,19 @@ const UnwrappedList = (props, forwardedRef) => {
|
|
|
133
132
|
t9 = $[20];
|
|
134
133
|
}
|
|
135
134
|
const listContextValue = t9;
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
}
|
|
143
|
-
const hasMixed = list.querySelector("[data-has-description=\"true\"]") !== null && list.querySelector("[data-has-description=\"false\"]") !== null;
|
|
144
|
-
const current = list.getAttribute("data-mixed-descriptions");
|
|
145
|
-
if (hasMixed && current !== "true") {
|
|
146
|
-
list.setAttribute("data-mixed-descriptions", "true");
|
|
147
|
-
} else {
|
|
148
|
-
if (!hasMixed && current !== null) {
|
|
149
|
-
list.removeAttribute("data-mixed-descriptions");
|
|
150
|
-
}
|
|
151
|
-
}
|
|
152
|
-
};
|
|
153
|
-
$[21] = listRef;
|
|
154
|
-
$[22] = t10;
|
|
135
|
+
const t10 = slots.heading;
|
|
136
|
+
let t11;
|
|
137
|
+
if ($[21] !== className) {
|
|
138
|
+
t11 = clsx(classes.ActionList, className);
|
|
139
|
+
$[21] = className;
|
|
140
|
+
$[22] = t11;
|
|
155
141
|
} else {
|
|
156
|
-
|
|
142
|
+
t11 = $[22];
|
|
157
143
|
}
|
|
158
|
-
useIsomorphicLayoutEffect(t10);
|
|
159
|
-
const t11 = slots.heading;
|
|
160
144
|
let t12;
|
|
161
|
-
if ($[23] !==
|
|
162
|
-
t12 =
|
|
163
|
-
|
|
164
|
-
$[24] = t12;
|
|
165
|
-
} else {
|
|
166
|
-
t12 = $[24];
|
|
167
|
-
}
|
|
168
|
-
let t13;
|
|
169
|
-
if ($[25] !== Component || $[26] !== ariaLabelledBy || $[27] !== childrenWithoutSlots || $[28] !== listRef || $[29] !== listRole || $[30] !== restProps || $[31] !== showDividers || $[32] !== t12 || $[33] !== variant) {
|
|
170
|
-
t13 = /*#__PURE__*/jsx(Component, {
|
|
171
|
-
className: t12,
|
|
145
|
+
if ($[23] !== Component || $[24] !== ariaLabelledBy || $[25] !== childrenWithoutSlots || $[26] !== listRef || $[27] !== listRole || $[28] !== restProps || $[29] !== showDividers || $[30] !== t11 || $[31] !== variant) {
|
|
146
|
+
t12 = /*#__PURE__*/jsx(Component, {
|
|
147
|
+
className: t11,
|
|
172
148
|
role: listRole,
|
|
173
149
|
"aria-labelledby": ariaLabelledBy,
|
|
174
150
|
ref: listRef,
|
|
@@ -177,33 +153,33 @@ const UnwrappedList = (props, forwardedRef) => {
|
|
|
177
153
|
...restProps,
|
|
178
154
|
children: childrenWithoutSlots
|
|
179
155
|
});
|
|
180
|
-
$[
|
|
181
|
-
$[
|
|
182
|
-
$[
|
|
183
|
-
$[
|
|
184
|
-
$[
|
|
185
|
-
$[
|
|
186
|
-
$[
|
|
156
|
+
$[23] = Component;
|
|
157
|
+
$[24] = ariaLabelledBy;
|
|
158
|
+
$[25] = childrenWithoutSlots;
|
|
159
|
+
$[26] = listRef;
|
|
160
|
+
$[27] = listRole;
|
|
161
|
+
$[28] = restProps;
|
|
162
|
+
$[29] = showDividers;
|
|
163
|
+
$[30] = t11;
|
|
164
|
+
$[31] = variant;
|
|
187
165
|
$[32] = t12;
|
|
188
|
-
$[33] = variant;
|
|
189
|
-
$[34] = t13;
|
|
190
166
|
} else {
|
|
191
|
-
|
|
167
|
+
t12 = $[32];
|
|
192
168
|
}
|
|
193
|
-
let
|
|
194
|
-
if ($[
|
|
195
|
-
|
|
169
|
+
let t13;
|
|
170
|
+
if ($[33] !== listContextValue || $[34] !== slots.heading || $[35] !== t12) {
|
|
171
|
+
t13 = /*#__PURE__*/jsxs(ListContext.Provider, {
|
|
196
172
|
value: listContextValue,
|
|
197
|
-
children: [
|
|
173
|
+
children: [t10, t12]
|
|
198
174
|
});
|
|
199
|
-
$[
|
|
200
|
-
$[
|
|
201
|
-
$[
|
|
202
|
-
$[
|
|
175
|
+
$[33] = listContextValue;
|
|
176
|
+
$[34] = slots.heading;
|
|
177
|
+
$[35] = t12;
|
|
178
|
+
$[36] = t13;
|
|
203
179
|
} else {
|
|
204
|
-
|
|
180
|
+
t13 = $[36];
|
|
205
181
|
}
|
|
206
|
-
return
|
|
182
|
+
return t13;
|
|
207
183
|
};
|
|
208
184
|
const List = fixedForwardRef(UnwrappedList);
|
|
209
185
|
Object.assign(List, {
|
package/package.json
CHANGED
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
.prc-ActionList-ActionList-rPFF2,.prc-ActionList-ActionList-rPFF2 ul{list-style:none;margin:0;padding:0}.prc-ActionList-ActionList-rPFF2:where([data-variant=inset]){padding-block:var(--base-size-8,.5rem)}.prc-ActionList-ActionList-rPFF2:where([data-variant=inset],[data-variant=horizontal-inset]) .prc-ActionList-ActionListItem-So4vC{margin-inline:var(--base-size-8,.5rem)}.prc-ActionList-ActionList-rPFF2:where([data-variant=horizontal-inset]){padding-bottom:var(--base-size-8,.5rem)}.prc-ActionList-ActionList-rPFF2:where([data-dividers=true]) .prc-ActionList-ActionListSubContent-gKsFp:before{background:var(--borderColor-muted,#d1d9e0b3);content:"";display:block;height:1px;position:absolute;top:-7px;width:100%}:is(.prc-ActionList-ActionList-rPFF2:where([data-dividers=true]) [data-description-variant=inline]):before{background:var(--borderColor-muted,#d1d9e0b3);content:"";display:block;height:var(--borderWidth-thin,.0625rem);position:absolute;top:-7px;width:100%}:is(.prc-ActionList-ActionList-rPFF2:where([data-dividers=true]) [data-description-variant=inline]) .prc-ActionList-ActionListSubContent-gKsFp:before{content:unset}.prc-ActionList-ActionList-rPFF2:where([data-dividers=true]) .prc-ActionList-ActionListItem-So4vC:first-of-type .prc-ActionList-ActionListSubContent-gKsFp:before,.prc-ActionList-ActionList-rPFF2:where([data-dividers=true]) .prc-ActionList-Divider-taVfb+.prc-ActionList-ActionListItem-So4vC .prc-ActionList-ActionListSubContent-gKsFp:before{visibility:hidden}.prc-ActionList-ActionList-rPFF2:where([data-dividers=true]) .prc-ActionList-ActionListItem-So4vC:first-of-type [data-description-variant=inline]:before,.prc-ActionList-ActionList-rPFF2:where([data-dividers=true]) .prc-ActionList-Divider-taVfb+.prc-ActionList-ActionListItem-So4vC [data-description-variant=inline]:before{visibility:hidden}.prc-ActionList-ActionList-rPFF2 .prc-ActionList-Divider-taVfb:first-child{display:none}.prc-ActionList-ActionList-rPFF2[data-mixed-descriptions=true] .prc-ActionList-ItemLabel-81ohH{font-weight:var(--base-text-weight-normal,400)}.prc-ActionList-ActionListItem-So4vC{background-color:var(--control-transparent-bgColor-rest,#ffffff00);border-radius:var(--borderRadius-medium,.375rem);list-style:none;position:relative}.prc-ActionList-ActionListItem-So4vC:has(>.prc-ActionList-TrailingAction-dMRxe){display:flex;flex-wrap:nowrap}@media (forced-colors:active){.prc-ActionList-ActionListItem-So4vC :focus,.prc-ActionList-ActionListItem-So4vC:focus-visible,.prc-ActionList-ActionListItem-So4vC>a.prc-ActionList-focus-visible-OJCTY,.prc-ActionList-ActionListItem-So4vC[data-is-active-descendant]{outline:1px solid transparent!important}}@media (hover:hover){.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):active,.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):hover{cursor:pointer}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):hover{background-color:var(--control-transparent-bgColor-hover,#818b981a)}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):hover:not([data-active],:focus-visible){box-shadow:var(--boxShadow-thin,inset 0 0 0 .0625rem) var(--control-transparent-borderColor-active,#ffffff00);outline:solid var(--borderWidth-thin,.0625rem) transparent;outline-offset:calc(var(--borderWidth-thin,.0625rem)*-1)}}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):active{background-color:var(--control-transparent-bgColor-active,#818b9826)}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):active:not([data-active]){box-shadow:var(--boxShadow-thin,inset 0 0 0 .0625rem) var(--control-transparent-borderColor-active,#ffffff00);outline:solid var(--borderWidth-thin,.0625rem) transparent;outline-offset:calc(var(--borderWidth-thin,.0625rem)*-1)}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):focus-visible{box-shadow:none;outline:2px solid var(--focus-outline-color,var(--focus-outlineColor,#0969da));outline-offset:0}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):focus-visible .prc-ActionList-ActionListSubContent-gKsFp:before,.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):focus-visible+.prc-ActionList-ActionListItem-So4vC .prc-ActionList-ActionListSubContent-gKsFp:before{visibility:hidden}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-variant=danger]) .prc-ActionList-ItemLabel-81ohH,.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-variant=danger]) .prc-ActionList-LeadingAction-hbWbh,.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-variant=danger]) .prc-ActionList-LeadingVisual-NBr28{color:var(--control-danger-fgColor-rest,#d1242f)}@media (hover:hover){.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-variant=danger]):hover{background:var(--control-danger-bgColor-hover,#ffebe9)}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-variant=danger]):hover .prc-ActionList-ItemLabel-81ohH,.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-variant=danger]):hover .prc-ActionList-LeadingAction-hbWbh,.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-variant=danger]):hover .prc-ActionList-LeadingVisual-NBr28{color:var(--control-danger-fgColor-hover,#d1242f)}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-variant=danger]):hover [data-kbd-chord]{background-color:var(--bgColor-default,#fff);transition:none}}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-variant=danger]):active{background:var(--control-danger-bgColor-active,#ffebe966)}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-variant=danger]):active .prc-ActionList-ItemLabel-81ohH,.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-variant=danger]):active .prc-ActionList-LeadingAction-hbWbh,.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-variant=danger]):active .prc-ActionList-LeadingVisual-NBr28{color:var(--control-danger-fgColor-hover,#d1242f)}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-variant=danger]):active [data-kbd-chord]{background-color:var(--bgColor-default,#fff);transition:none}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-active]){background:var(--control-transparent-bgColor-selected,#818b9826);outline:2px solid transparent}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-active]) .prc-ActionList-ItemLabel-81ohH{color:var(--control-fgColor-rest,#25292e);font-weight:var(--base-text-weight-semibold,600)}@media (hover:hover){.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-active]):hover{background-color:var(--control-transparent-bgColor-hover,#818b981a)}}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-active]) .prc-ActionList-ActionListSubContent-gKsFp:before,.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-active])+.prc-ActionList-ActionListItem-So4vC .prc-ActionList-ActionListSubContent-gKsFp:before{visibility:hidden}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-active]):after{background:var(--borderColor-accent-emphasis,#0969da);border-radius:var(--borderRadius-medium,.375rem);content:"";height:calc(100% - var(--base-size-8,.5rem));left:calc(var(--base-size-8,.5rem)*-1);position:absolute;top:var(--base-size-4,.25rem);width:var(--base-size-4,.25rem)}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-is-active-descendant]){background:var(--control-transparent-bgColor-selected,#818b9826);outline:2px solid transparent}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-is-active-descendant]):after{background:var(--borderColor-accent-emphasis,#0969da);border-radius:var(--borderRadius-medium,.375rem);content:"";height:calc(100% - var(--base-size-8,.5rem));left:calc(var(--base-size-8,.5rem)*-1);position:absolute;top:var(--base-size-4,.25rem);width:var(--base-size-4,.25rem)}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-inactive=true]) * :not([popover],.prc-ActionList-InactiveWarning-1Dszv){color:var(--fgColor-muted,#59636e)}@media (hover:hover){.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-inactive=true]):hover{background-color:transparent;cursor:not-allowed}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-inactive=true]):hover * :not([popover],.prc-ActionList-InactiveWarning-1Dszv){color:var(--fgColor-muted,#59636e)}}.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-inactive=true]):active{background:transparent}:is(.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-loading=true]),.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true])>[data-loading=true]) .prc-ActionList-Description-Z-EZJ,:is(.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-loading=true]),.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true])>[data-loading=true]) .prc-ActionList-ItemLabel-81ohH,:is(.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-loading=true]),.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true])>[data-loading=true]) .prc-ActionList-LeadingAction-hbWbh,:is(.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-loading=true]),.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true])>[data-loading=true]) .prc-ActionList-LeadingVisual-NBr28,:is(.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-loading=true]),.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true])>[data-loading=true]) .prc-ActionList-TrailingVisual-jwT9C,:is(.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):where([data-loading=true]),.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true])>[data-loading=true]) .prc-ActionList-VisualWrap-bdCsS{color:var(--fgColor-muted,#59636e)}@media (hover:hover){.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):hover .prc-ActionList-ActionListSubContent-gKsFp:before,.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):hover [data-description-variant=inline]:before,.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):hover+.prc-ActionList-ActionListItem-So4vC .prc-ActionList-ActionListSubContent-gKsFp:before,.prc-ActionList-ActionListItem-So4vC:not([data-is-disabled],[data-has-subitem=true]):hover+.prc-ActionList-ActionListItem-So4vC [data-description-variant=inline]:before{visibility:hidden}}.prc-ActionList-ActionListItem-So4vC[data-has-subitem=true]>.prc-ActionList-ActionListContent-KBb8-{z-index:1}@media (hover:hover){:is(.prc-ActionList-ActionListItem-So4vC[data-has-subitem=true]>.prc-ActionList-ActionListContent-KBb8-):hover{background-color:var(--control-transparent-bgColor-hover,#818b981a);cursor:pointer}}:is(.prc-ActionList-ActionListItem-So4vC[data-has-subitem=true]>.prc-ActionList-ActionListContent-KBb8-):active{background-color:var(--control-transparent-bgColor-active,#818b9826)}.prc-ActionList-ActionListItem-So4vC[data-has-subitem=true] .prc-ActionList-Spacer-4tR2m{display:block}:is(.prc-ActionList-ActionListItem-So4vC[aria-disabled=true],.prc-ActionList-ActionListItem-So4vC[data-is-disabled]) .prc-ActionList-ActionListContent-KBb8- *{color:var(--control-fgColor-disabled,#818b98)}@media (hover:hover){:is(:is(.prc-ActionList-ActionListItem-So4vC[aria-disabled=true],.prc-ActionList-ActionListItem-So4vC[data-is-disabled]) .prc-ActionList-ActionListContent-KBb8-):hover{background-color:transparent;cursor:not-allowed}}@media (hover:hover){:is(.prc-ActionList-ActionListItem-So4vC[aria-disabled=true],.prc-ActionList-ActionListItem-So4vC[data-is-disabled]):hover{background-color:transparent}}:is(.prc-ActionList-ActionListItem-So4vC[aria-disabled=true],.prc-ActionList-ActionListItem-So4vC[data-is-disabled]) .prc-ActionList-MultiSelectCheckbox-2OqxZ{background-color:var(--control-bgColor-disabled,#eff2f5);border-color:var(--control-borderColor-disabled,#818b981a)}:is([aria-checked=true]:is(.prc-ActionList-ActionListItem-So4vC[aria-disabled=true],.prc-ActionList-ActionListItem-So4vC[data-is-disabled]),[aria-selected=true]:is(.prc-ActionList-ActionListItem-So4vC[aria-disabled=true],.prc-ActionList-ActionListItem-So4vC[data-is-disabled])) .prc-ActionList-MultiSelectCheckbox-2OqxZ{background-color:var(--control-checked-bgColor-disabled,#818b98);border-color:var(--control-checked-bgColor-disabled,#818b98)}:is(:is([aria-checked=true]:is(.prc-ActionList-ActionListItem-So4vC[aria-disabled=true],.prc-ActionList-ActionListItem-So4vC[data-is-disabled]),[aria-selected=true]:is(.prc-ActionList-ActionListItem-So4vC[aria-disabled=true],.prc-ActionList-ActionListItem-So4vC[data-is-disabled])) .prc-ActionList-MultiSelectCheckbox-2OqxZ):before{background-color:var(--control-checked-fgColor-disabled,#fff)}.prc-ActionList-ActionListItem-So4vC:has(.prc-ActionList-TrailingAction-dMRxe [data-loading=true]):not([data-is-disabled]) .prc-ActionList-ItemLabel-81ohH{color:var(--fgColor-default,#1f2328)}.prc-ActionList-ActionListItem-So4vC:has(.prc-ActionList-TrailingAction-dMRxe [data-loading=true]):not([data-is-disabled]) .prc-ActionList-Description-Z-EZJ{color:var(--fgColor-default,#1f2328)}.prc-ActionList-ActionListItem-So4vC[aria-hidden]+.prc-ActionList-Divider-taVfb{display:none}.prc-ActionList-ActionListItem-So4vC .prc-ActionList-MultiSelectCheckbox-2OqxZ{background-color:var(--bgColor-default,#fff);border:var(--borderWidth-thin,.0625rem) solid var(--control-borderColor-emphasis,#818b98);border-radius:var(--borderRadius-small,.1875rem);cursor:pointer;display:grid;height:var(--base-size-16,1rem);margin:0;place-content:center;position:relative;transition:background-color,border-color 80ms cubic-bezier(.33,1,.68,1);width:var(--base-size-16,1rem)}:is(.prc-ActionList-ActionListItem-So4vC .prc-ActionList-MultiSelectCheckbox-2OqxZ):before{animation:prc-ActionList-checkmarkOut-GbMf4 80ms cubic-bezier(.65,0,.35,1);background-color:var(--control-checked-fgColor-rest,#fff);clip-path:inset(var(--base-size-16,1rem) 0 0 0);content:"";height:var(--base-size-16,1rem);mask-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMiIgaGVpZ2h0PSI5IiBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTIgOSI+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMTEuNzguMjJhLjc1Ljc1IDAgMCAxIDAgMS4wNjFMNC41MiA4LjU0MWEuNzUuNzUgMCAwIDEtMS4wNjIgMEwuMjAyIDUuMjg1YS43NS43NSAwIDAgMSAxLjA2MS0xLjA2MWwyLjcyNSAyLjcyM0wxMC43MTguMjJhLjc1Ljc1IDAgMCAxIDEuMDYyIDAiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPg==");mask-position:center;mask-repeat:no-repeat;mask-size:75%;transition:visibility 0s linear .23s;width:var(--base-size-16,1rem)}@media (forced-colors:active){.prc-ActionList-ActionListItem-So4vC .prc-ActionList-MultiSelectCheckbox-2OqxZ{border-width:var(--borderWidth-thin,.0625rem)}}:is(.prc-ActionList-ActionListItem-So4vC[aria-checked=true],.prc-ActionList-ActionListItem-So4vC[aria-selected=true]) .prc-ActionList-MultiSelectCheckbox-2OqxZ{background-color:var(--control-checked-bgColor-rest,#0969da);border-color:var(--control-checked-borderColor-rest,#0969da);transition:background-color,border-color 80ms cubic-bezier(.32,0,.67,0) 0s}:is(:is(.prc-ActionList-ActionListItem-So4vC[aria-checked=true],.prc-ActionList-ActionListItem-So4vC[aria-selected=true]) .prc-ActionList-MultiSelectCheckbox-2OqxZ):before{animation:prc-ActionList-checkmarkIn-gjsPG 80ms cubic-bezier(.65,0,.35,1) 80ms forwards;transition:visibility 0s linear 0s;visibility:visible}@media (forced-colors:active){:is(.prc-ActionList-ActionListItem-So4vC[aria-checked=true],.prc-ActionList-ActionListItem-So4vC[aria-selected=true]) .prc-ActionList-MultiSelectCheckbox-2OqxZ{border-width:8px}}:is(.prc-ActionList-ActionListItem-So4vC[aria-checked=true],.prc-ActionList-ActionListItem-So4vC[aria-selected=true]) .prc-ActionList-SingleSelectCheckmark-zMd8d{visibility:visible}:is(:is(.prc-ActionList-ActionListItem-So4vC[aria-checked=false],.prc-ActionList-ActionListItem-So4vC[aria-selected=false]) .prc-ActionList-MultiSelectCheckbox-2OqxZ):before{visibility:hidden}:is(.prc-ActionList-ActionListItem-So4vC[aria-checked=false],.prc-ActionList-ActionListItem-So4vC[aria-selected=false]) .prc-ActionList-SingleSelectCheckmark-zMd8d{visibility:hidden}.prc-ActionList-SingleSelectCheckmark-zMd8d{visibility:hidden}.prc-ActionList-ActionListContent-KBb8-{--subitem-depth:0px;background-color:transparent;border:none;border-radius:var(--borderRadius-medium,.375rem);color:var(--control-fgColor-rest,#25292e);display:grid;padding-block:var(--control-medium-paddingBlock,.375rem);padding-inline:var(--control-medium-paddingInline-condensed,.5rem);position:relative;text-align:left;touch-action:manipulation;transition:background 33.333ms linear;-webkit-user-select:none;user-select:none;width:100%;-webkit-tap-highlight-color:transparent;align-items:start;grid-template-areas:"spacer leadingAction leadingVisual content";grid-template-columns:min-content min-content min-content minmax(0,auto);grid-template-rows:min-content}.prc-ActionList-ActionListContent-KBb8->:not(:last-child,.prc-ActionList-Spacer-4tR2m){margin-right:var(--control-medium-gap,.5rem)}.prc-ActionList-ActionListContent-KBb8-:hover{cursor:pointer;-webkit-text-decoration:none;text-decoration:none}.prc-ActionList-ActionListContent-KBb8-[data-size=large]{padding-block:var(--control-large-paddingBlock,.625rem)}.prc-ActionList-ActionListContent-KBb8-[aria-expanded=true] .prc-ActionList-ExpandIcon-J4OqB{transform:scaleY(-1)}.prc-ActionList-ActionListContent-KBb8-[aria-expanded=false] .prc-ActionList-ExpandIcon-J4OqB{transform:scaleY(1)}.prc-ActionList-ActionListContent-KBb8-[aria-expanded=false]~.prc-ActionList-SubGroup-5Zje2{display:none}.prc-ActionList-ActionListContent-KBb8-[aria-expanded=false]:has(~.prc-ActionList-SubGroup-5Zje2 [data-active=true]){background:var(--control-transparent-bgColor-selected,#818b9826)}.prc-ActionList-ActionListContent-KBb8-[aria-expanded=false]:has(~.prc-ActionList-SubGroup-5Zje2 [data-active=true]) .prc-ActionList-ItemLabel-81ohH{font-weight:var(--base-text-weight-semibold,600)}.prc-ActionList-ActionListContent-KBb8-[aria-expanded=false]:has(~.prc-ActionList-SubGroup-5Zje2 [data-active=true]) .prc-ActionList-ActionListSubContent-gKsFp:before,.prc-ActionList-ActionListContent-KBb8-[aria-expanded=false]:has(~.prc-ActionList-SubGroup-5Zje2 [data-active=true])+.prc-ActionList-ActionListItem-So4vC .prc-ActionList-ActionListSubContent-gKsFp:before{visibility:hidden}.prc-ActionList-ActionListContent-KBb8-[aria-expanded=false]:has(~.prc-ActionList-SubGroup-5Zje2 [data-active=true]):after{background:var(--borderColor-accent-emphasis,#0969da);border-radius:var(--borderRadius-medium,.375rem);content:"";height:calc(100% - var(--base-size-8,.5rem));left:calc(var(--base-size-8,.5rem)*-1);position:absolute;top:var(--base-size-4,.25rem);width:var(--base-size-4,.25rem)}.prc-ActionList-ActionListSubContent-gKsFp{align-items:start;display:grid;grid-area:content;grid-template-areas:"label trailingVisual trailingAction";grid-template-columns:minmax(0,auto) min-content min-content;grid-template-rows:min-content;position:relative;width:100%}.prc-ActionList-ActionListSubContent-gKsFp>:not(:last-child){margin-right:var(--control-medium-gap,.5rem)}.prc-ActionList-Spacer-4tR2m{display:none;grid-area:spacer;width:max(0px,var(--subitem-depth) * 8px)}.prc-ActionList-LeadingAction-hbWbh{grid-area:leadingAction}.prc-ActionList-LeadingVisual-NBr28{grid-area:leadingVisual}.prc-ActionList-TrailingVisual-jwT9C{font-size:var(--text-body-size-medium,.875rem);grid-area:trailingVisual}.prc-ActionList-TrailingAction-dMRxe{grid-area:trailingAction}.prc-ActionList-TrailingAction-dMRxe>[data-loading-wrapper]{height:100%}.prc-ActionList-ItemDescriptionWrap-ujC8S{display:flex;flex-direction:column;gap:var(--base-size-4,.25rem);grid-area:label}.prc-ActionList-ItemDescriptionWrap-ujC8S .prc-ActionList-ItemLabel-81ohH{font-weight:var(--base-text-weight-semibold,600);word-break:break-word}.prc-ActionList-ItemDescriptionWrap-ujC8S:where([data-description-variant=inline]){align-items:baseline;flex-direction:row;gap:var(--base-size-8,.5rem);position:relative;word-break:normal}.prc-ActionList-ItemDescriptionWrap-ujC8S:where([data-description-variant=inline]) .prc-ActionList-ItemLabel-81ohH{word-break:normal}.prc-ActionList-ItemDescriptionWrap-ujC8S:where([data-description-variant=inline]):has([data-truncate=true]) .prc-ActionList-ItemLabel-81ohH{flex:1 0 auto}.prc-ActionList-ItemDescriptionWrap-ujC8S:where([data-description-variant=inline]) .prc-ActionList-Description-Z-EZJ{line-height:16px}.prc-ActionList-Description-Z-EZJ{font-size:var(--text-body-size-small,.75rem);font-weight:var(--base-text-weight-normal,400);line-height:16px}.prc-ActionList-Description-Z-EZJ,.prc-ActionList-VisualWrap-bdCsS{color:var(--fgColor-muted,#59636e)}.prc-ActionList-VisualWrap-bdCsS{display:flex;line-height:20px;min-height:var(--base-size-20,1.25rem);min-width:max-content;pointer-events:none;fill:var(--fgColor-muted,#59636e);align-items:center}.prc-ActionList-ItemLabel-81ohH{color:var(--fgColor-default,#1f2328);font-size:var(--text-body-size-medium,.875rem);font-weight:var(--base-text-weight-normal,400);grid-area:label;line-height:20px;position:relative;word-break:break-word}.prc-ActionList-SubGroup-5Zje2 .prc-ActionList-ItemLabel-81ohH{font-size:var(--text-body-size-small,.75rem)}.prc-ActionList-SubGroup-5Zje2 .prc-ActionList-ActionListItem-So4vC{margin-inline:0}.prc-ActionList-TrailingActionButton-UUAk6{border-bottom-left-radius:0;border-top-left-radius:0;height:100%}.prc-ActionList-TrailingActionButton-UUAk6[data-loading=true]:has([data-component=buttonContent]){padding:0 0 0 calc(var(--base-size-12,.75rem)*2)}.prc-ActionList-TrailingActionButton-UUAk6[data-loading=true]:has([data-component=buttonContent]) [data-component=loadingSpinner]{align-items:center;display:flex;height:var(--control-medium-size,2rem);justify-content:center;place-self:end;width:var(--control-medium-size,2rem)}.prc-ActionList-InactiveButtonWrap-Ia-xM:has(.prc-ActionList-TrailingVisual-jwT9C){grid-area:trailingVisual}.prc-ActionList-InactiveButtonWrap-Ia-xM:has(.prc-ActionList-LeadingVisual-NBr28){grid-area:leadingVisual}.prc-ActionList-Divider-taVfb{background:var(--borderColor-muted,#d1d9e0b3);border:0;display:block;height:var(--borderWidth-thin,.0625rem);list-style:none;margin-block-end:var(--base-size-8,.5rem);margin-block-start:calc(var(--base-size-8,.5rem) - var(--borderWidth-thin,.0625rem));padding:0}.prc-ActionList-InactiveButtonReset-uK4-x{background:none;border:none;color:inherit;cursor:pointer;display:flex;font:inherit;padding:0}.prc-ActionList-InactiveWarning-1Dszv{color:var(--fgColor-attention,#9a6700);font-size:var(--text-body-size-small,.75rem);grid-row:2/2;line-height:16px}@keyframes prc-ActionList-checkmarkIn-gjsPG{0%{clip-path:inset(var(--base-size-16,1rem) 0 0 0)}to{clip-path:inset(0 0 0 0)}}@keyframes prc-ActionList-checkmarkOut-GbMf4{0%{clip-path:inset(0 0 0 0)}to{clip-path:inset(var(--base-size-16,1rem) 0 0 0)}}
|
|
2
|
-
/*# sourceMappingURL=ActionList-53389912.css.map */
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/ActionList/ActionList.module.css.js","../../postcss-preset-primer/src/mixins/focusOutline.css","../../postcss-preset-primer/src/mixins/activeIndicatorLine.css"],"names":[],"mappings":"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","file":"ActionList-53389912.css","sourcesContent":["/* stylelint-disable max-nesting-depth, selector-max-specificity */\n\n.ActionList {\n padding: 0;\n margin: 0;\n list-style: none;\n\n ul {\n padding: 0;\n margin: 0;\n list-style: none;\n }\n\n &:where([data-variant='inset']) {\n padding-block: var(--base-size-8);\n }\n\n &:where([data-variant='inset'], [data-variant='horizontal-inset']) {\n /* this is only to match default experience */\n & .ActionListItem {\n margin-inline: var(--base-size-8);\n }\n }\n\n &:where([data-variant='horizontal-inset']) {\n padding-bottom: var(--base-size-8);\n }\n\n &:where([data-dividers='true']) {\n /* place dividers on the wrapper that excludes leading visuals/actions */\n & .ActionListSubContent::before {\n position: absolute;\n\n /* use this top size after FF removed */\n\n /* top: calc(-1 * var(--control-medium-paddingBlock)); */\n /* stylelint-disable-next-line primer/spacing */\n top: -7px;\n display: block;\n width: 100%;\n height: 1px;\n content: '';\n /* stylelint-disable-next-line primer/colors */\n background: var(--borderColor-muted);\n }\n\n /* if inline description, move pseudo divider to description wrapper */\n & [data-description-variant='inline'] {\n &::before {\n position: absolute;\n\n /* use this top size after FF removed */\n\n /* top: calc(-1 * var(--control-medium-paddingBlock)); */\n /* stylelint-disable-next-line primer/spacing */\n top: -7px;\n display: block;\n width: 100%;\n height: var(--borderWidth-thin);\n content: '';\n /* stylelint-disable-next-line primer/colors */\n background: var(--borderColor-muted);\n }\n\n /* remove the default divider */\n & .ActionListSubContent::before {\n content: unset;\n }\n }\n\n /* hide if item is first of type with label::before, or is the first item after a sectionDivider */\n .ActionListItem:first-of-type .ActionListSubContent::before,\n .Divider + .ActionListItem .ActionListSubContent::before {\n visibility: hidden;\n }\n\n /* hide if item is first of type with label::before, or is the first item after a sectionDivider */\n .ActionListItem:first-of-type [data-description-variant='inline']::before,\n .Divider + .ActionListItem [data-description-variant='inline']::before {\n visibility: hidden;\n }\n }\n\n /* Make sure that the first visible item isn't a divider */\n & .Divider:first-child {\n display: none;\n }\n\n /* if a list has a mix of items with and without descriptions, reset the label font-weight to normal */\n &[data-mixed-descriptions='true'] {\n & .ItemLabel {\n font-weight: var(--base-text-weight-normal);\n }\n }\n}\n\n/* ActionListItem is a li that handles visual state, while ActionListItemContent controls actual state via button or link */\n\n.ActionListItem {\n position: relative;\n list-style: none;\n background-color: var(--control-transparent-bgColor-rest);\n border-radius: var(--borderRadius-medium);\n\n /* apply flex if trailing action exists as an immediate child */\n &:has(> .TrailingAction) {\n display: flex;\n flex-wrap: nowrap;\n }\n\n /* state */\n\n @media (forced-colors: active) {\n :focus,\n &:focus-visible,\n /* stylelint-disable-next-line selector-no-qualifying-type */\n >a.focus-visible,\n &[data-is-active-descendant] {\n /* Support for Windows high contrast https://sarahmhigley.com/writing/whcm-quick-tips */\n outline: solid 1px transparent !important;\n }\n }\n\n &:not([data-is-disabled], [data-has-subitem='true']) {\n @media (hover: hover) {\n &:hover,\n &:active {\n cursor: pointer;\n }\n\n &:hover {\n background-color: var(--control-transparent-bgColor-hover);\n\n &:not([data-active], :focus-visible) {\n /* Support for \"Windows high contrast mode\" https:sarahmhigley.com/writing/whcm-quick-tips/ */\n outline: solid var(--borderWidth-thin) transparent;\n outline-offset: calc(-1 * var(--borderWidth-thin));\n box-shadow: var(--boxShadow-thin) var(--control-transparent-borderColor-active);\n }\n }\n }\n\n &:active {\n background-color: var(--control-transparent-bgColor-active);\n\n &:not([data-active]) {\n /* Support for \"Windows high contrast mode\" https:sarahmhigley.com/writing/whcm-quick-tips/ */\n outline: solid var(--borderWidth-thin) transparent;\n outline-offset: calc(-1 * var(--borderWidth-thin));\n box-shadow: var(--boxShadow-thin) var(--control-transparent-borderColor-active);\n }\n }\n\n &:focus-visible {\n @mixin focusOutline 0;\n\n & .ActionListSubContent::before,\n & + .ActionListItem .ActionListSubContent::before {\n visibility: hidden;\n }\n }\n\n /* danger */\n &:where([data-variant='danger']) {\n & .LeadingAction,\n .LeadingVisual,\n .ItemLabel {\n color: var(--control-danger-fgColor-rest);\n }\n\n @media (hover: hover) {\n &:hover {\n background: var(--control-danger-bgColor-hover);\n\n & .LeadingAction,\n .LeadingVisual,\n .ItemLabel {\n color: var(--control-danger-fgColor-hover);\n }\n\n & [data-kbd-chord] {\n background-color: var(--bgColor-default);\n transition: none;\n }\n }\n }\n\n &:active {\n background: var(--control-danger-bgColor-active);\n\n & .LeadingAction,\n .LeadingVisual,\n .ItemLabel {\n color: var(--control-danger-fgColor-hover);\n }\n\n & [data-kbd-chord] {\n background-color: var(--bgColor-default);\n transition: none;\n }\n }\n }\n\n /* active state [aria-current] */\n &:where([data-active]) {\n background: var(--control-transparent-bgColor-selected);\n\n /* provides a visual indication of the current item for Windows high-contrast mode */\n outline: 2px solid transparent;\n\n & .ItemLabel {\n font-weight: var(--base-text-weight-semibold);\n color: var(--control-fgColor-rest);\n }\n\n @media (hover: hover) {\n &:hover {\n background-color: var(--control-transparent-bgColor-hover);\n }\n }\n\n /* hide dividers if showDividers is true and item is active */\n\n & .ActionListSubContent::before,\n & + .ActionListItem .ActionListSubContent::before {\n visibility: hidden;\n }\n\n /* blue accent line */\n &::after {\n @mixin activeIndicatorLine;\n }\n }\n\n &:where([data-is-active-descendant]) {\n background: var(--control-transparent-bgColor-selected);\n\n /* provides a visual indication of the current item for Windows high-contrast mode */\n outline: 2px solid transparent;\n\n /* hide dividers if showDividers is true and item is active */\n\n /* add back in after FF ship */\n\n /* & .ActionListSubContent::before,\n & + .ActionListItem .ActionListSubContent::before {\n visibility: hidden;\n } */\n\n /* blue accent line */\n &::after {\n @mixin activeIndicatorLine;\n }\n }\n\n /* inactive */\n &:where([data-inactive='true']) {\n /* ignore tooltip */\n & * :not([popover], .InactiveWarning) {\n color: var(--fgColor-muted);\n }\n\n @media (hover: hover) {\n &:hover {\n cursor: not-allowed;\n background-color: transparent;\n\n & * :not([popover], .InactiveWarning) {\n color: var(--fgColor-muted);\n }\n }\n }\n\n &:active {\n background: transparent;\n }\n }\n\n &:where([data-loading='true']),\n & > [data-loading='true'] {\n & .ItemLabel,\n & .Description,\n & .LeadingVisual,\n & .TrailingVisual,\n & .LeadingAction,\n & .VisualWrap {\n color: var(--fgColor-muted);\n }\n }\n\n /* hide dividers */\n @media (hover: hover) {\n &:hover {\n & .ActionListSubContent::before,\n & + .ActionListItem .ActionListSubContent::before {\n visibility: hidden;\n }\n\n & [data-description-variant='inline']::before,\n & + .ActionListItem [data-description-variant='inline']::before {\n visibility: hidden;\n }\n }\n }\n }\n\n /* if item has subitem, move hover styles to ActionListContent */\n &[data-has-subitem='true'] {\n /* first child */\n & > .ActionListContent {\n z-index: 1;\n\n @media (hover: hover) {\n &:hover {\n cursor: pointer;\n background-color: var(--control-transparent-bgColor-hover);\n }\n }\n\n &:active {\n background-color: var(--control-transparent-bgColor-active);\n }\n }\n\n & .Spacer {\n display: block;\n }\n }\n\n /* disabled */\n\n &[aria-disabled='true'],\n &[data-is-disabled] {\n & .ActionListContent * {\n color: var(--control-fgColor-disabled);\n }\n\n & .ActionListContent {\n @media (hover: hover) {\n &:hover {\n cursor: not-allowed;\n background-color: transparent;\n }\n }\n }\n\n @media (hover: hover) {\n &:hover {\n background-color: transparent;\n }\n }\n\n & .MultiSelectCheckbox {\n background-color: var(--control-bgColor-disabled);\n border-color: var(--control-borderColor-disabled);\n }\n\n &[aria-checked='true'],\n &[aria-selected='true'] {\n & .MultiSelectCheckbox {\n background-color: var(--control-checked-bgColor-disabled);\n /* stylelint-disable-next-line primer/colors */\n border-color: var(--control-checked-bgColor-disabled);\n\n &::before {\n /* stylelint-disable-next-line primer/colors */\n background-color: var(--control-checked-fgColor-disabled);\n }\n }\n }\n }\n\n /* When TrailingAction is in loading state, keep labels and descriptions accessible */\n &:has(.TrailingAction [data-loading='true']):not([data-is-disabled]) {\n /* Ensure labels and descriptions maintain accessibility contrast */\n & .ItemLabel {\n color: var(--fgColor-default);\n }\n\n & .Description {\n color: var(--fgColor-default);\n }\n }\n\n /* Make sure that the first visible item isn't a divider */\n &[aria-hidden] + .Divider {\n display: none;\n }\n\n /*\n * checkbox item [aria-checked]\n * listbox [aria-selected]\n */\n\n & .MultiSelectCheckbox {\n position: relative;\n display: grid;\n width: var(--base-size-16);\n height: var(--base-size-16);\n margin: 0;\n cursor: pointer;\n background-color: var(--bgColor-default);\n border: var(--borderWidth-thin) solid var(--control-borderColor-emphasis);\n border-radius: var(--borderRadius-small);\n transition:\n background-color,\n border-color 80ms cubic-bezier(0.33, 1, 0.68, 1);\n /* checked -> unchecked - add 120ms delay to fully see animation-out */\n\n place-content: center;\n\n &::before {\n width: var(--base-size-16);\n height: var(--base-size-16);\n content: '';\n /* stylelint-disable-next-line primer/colors */\n background-color: var(--control-checked-fgColor-rest);\n transition: visibility 0s linear 230ms;\n clip-path: inset(var(--base-size-16) 0 0 0);\n\n /* octicon checkmark image */\n mask-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iOSIgdmlld0JveD0iMCAwIDEyIDkiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTEuNzgwMyAwLjIxOTYyNUMxMS45MjEgMC4zNjA0MjcgMTIgMC41NTEzMDUgMTIgMC43NTAzMTNDMTIgMC45NDkzMjEgMTEuOTIxIDEuMTQwMTkgMTEuNzgwMyAxLjI4MUw0LjUxODYgOC41NDA0MkM0LjM3Nzc1IDguNjgxIDQuMTg2ODIgOC43NiAzLjk4Nzc0IDguNzZDMy43ODg2NyA4Ljc2IDMuNTk3NzMgOC42ODEgMy40NTY4OSA4LjU0MDQyTDAuMjAxNjIyIDUuMjg2MkMwLjA2ODkyNzcgNS4xNDM4MyAtMC4wMDMzMDkwNSA0Ljk1NTU1IDAuMDAwMTE2NDkzIDQuNzYwOThDMC4wMDM1NTIwNSA0LjU2NjQzIDAuMDgyMzg5NCA0LjM4MDgxIDAuMjIwMDMyIDQuMjQzMjFDMC4zNTc2NjUgNC4xMDU2MiAwLjU0MzM1NSA0LjAyNjgxIDAuNzM3OTcgNC4wMjMzOEMwLjkzMjU4NCA0LjAxOTk0IDEuMTIwOTMgNC4wOTIxNyAxLjI2MzM0IDQuMjI0ODJMMy45ODc3NCA2Ljk0ODM1TDEwLjcxODYgMC4yMTk2MjVDMTAuODU5NSAwLjA3ODk5MjMgMTEuMDUwNCAwIDExLjI0OTUgMEMxMS40NDg1IDAgMTEuNjM5NSAwLjA3ODk5MjMgMTEuNzgwMyAwLjIxOTYyNVoiIGZpbGw9IndoaXRlIi8+Cjwvc3ZnPgo=');\n mask-size: 75%;\n mask-repeat: no-repeat;\n mask-position: center;\n animation: checkmarkOut 80ms cubic-bezier(0.65, 0, 0.35, 1);\n /* forwards; slightly snappier animation out */\n }\n\n @media (forced-colors: active) {\n /* Support for Windows high contrast https://sarahmhigley.com/writing/whcm-quick-tips */\n\n /* background-color will be overriden but border-width is a workaround */\n border-width: var(--borderWidth-thin);\n }\n }\n\n &[aria-checked='true'],\n &[aria-selected='true'] {\n & .MultiSelectCheckbox {\n background-color: var(--control-checked-bgColor-rest);\n border-color: var(--control-checked-borderColor-rest);\n transition:\n background-color,\n border-color 80ms cubic-bezier(0.32, 0, 0.67, 0) 0ms;\n /* unchecked -> checked */\n\n &::before {\n visibility: visible;\n transition: visibility 0s linear 0s;\n animation: checkmarkIn 80ms cubic-bezier(0.65, 0, 0.35, 1) forwards 80ms;\n }\n\n @media (forced-colors: active) {\n /* Support for Windows high contrast https://sarahmhigley.com/writing/whcm-quick-tips\n background-color will be overriden but border-width is a workaround */\n /* stylelint-disable-next-line primer/borders */\n border-width: 8px;\n }\n }\n\n & .SingleSelectCheckmark {\n visibility: visible;\n }\n }\n\n &[aria-checked='false'],\n &[aria-selected='false'] {\n & .MultiSelectCheckbox {\n &::before {\n visibility: hidden;\n }\n }\n\n & .SingleSelectCheckmark {\n visibility: hidden;\n }\n }\n}\n\n/* hide by default to support inactive state where role cannot be menuitemradio or menuitemcheckbox */\n.SingleSelectCheckmark {\n visibility: hidden;\n}\n\n/* button or a tag */\n\n/* [ [spacer] [leadingAction] [leadingVisual] [content] ] */\n.ActionListContent {\n --subitem-depth: 0px;\n\n position: relative;\n display: grid;\n width: 100%;\n color: var(--control-fgColor-rest);\n text-align: left;\n user-select: none;\n background-color: transparent;\n border: none;\n border-radius: var(--borderRadius-medium);\n transition: background 33.333ms linear;\n /* stylelint-disable-next-line primer/spacing */\n padding-block: var(--control-medium-paddingBlock);\n /* stylelint-disable-next-line primer/spacing */\n padding-inline: var(--control-medium-paddingInline-condensed);\n touch-action: manipulation;\n -webkit-tap-highlight-color: transparent;\n grid-template-rows: min-content;\n grid-template-areas: 'spacer leadingAction leadingVisual content';\n grid-template-columns: min-content min-content min-content minmax(0, auto);\n align-items: start;\n\n /* column-gap persists with empty grid-areas, margin applies only when children exist */\n & > :not(:last-child, .Spacer) {\n /* stylelint-disable-next-line primer/spacing */\n margin-right: var(--control-medium-gap);\n }\n\n &:hover {\n text-decoration: none;\n cursor: pointer;\n }\n\n /* large */\n\n &[data-size='large'] {\n /* stylelint-disable-next-line primer/spacing */\n padding-block: var(--control-large-paddingBlock);\n }\n\n /* collapsible item [aria-expanded] */\n\n &[aria-expanded='true'] {\n & .ExpandIcon {\n transform: scaleY(-1);\n }\n }\n\n &[aria-expanded='false'] {\n & .ExpandIcon {\n transform: scaleY(1);\n }\n\n & ~ .SubGroup {\n display: none;\n }\n\n /* show active indicator on parent collapse if child is active */\n &:has(~ .SubGroup [data-active='true']) {\n background: var(--control-transparent-bgColor-selected);\n\n & .ItemLabel {\n font-weight: var(--base-text-weight-semibold);\n }\n\n & .ActionListSubContent::before,\n & + .ActionListItem .ActionListSubContent::before {\n visibility: hidden;\n }\n\n /* blue accent line */\n &::after {\n @mixin activeIndicatorLine;\n }\n }\n }\n}\n\n/* [ [content] [trailingVisual] [trailingAction] ] */\n.ActionListSubContent {\n grid-area: content;\n position: relative;\n display: grid;\n width: 100%;\n grid-template-rows: min-content;\n grid-template-areas: 'label trailingVisual trailingAction';\n grid-template-columns: minmax(0, auto) min-content min-content;\n align-items: start;\n\n /* column-gap persists with empty grid-areas, margin applies only when children exist */\n & > :not(:last-child) {\n /* stylelint-disable-next-line primer/spacing */\n margin-right: var(--control-medium-gap);\n }\n}\n\n/* place children on grid */\n\n/* spacer used to create depth for nested lists */\n\n.Spacer {\n display: none;\n width: max(0px, var(--subitem-depth) * 8px);\n grid-area: spacer;\n}\n\n.LeadingAction {\n grid-area: leadingAction;\n}\n\n.LeadingVisual {\n grid-area: leadingVisual;\n}\n\n.TrailingVisual {\n grid-area: trailingVisual;\n font-size: var(--text-body-size-medium);\n}\n\n.TrailingAction {\n grid-area: trailingAction;\n\n /* if child is loading button */\n & > *[data-loading-wrapper] {\n height: 100%;\n }\n}\n\n/* wrapper span\ndefault block */\n.ItemDescriptionWrap {\n grid-area: label;\n display: flex;\n flex-direction: column;\n gap: var(--base-size-4);\n\n & .ItemLabel {\n font-weight: var(--base-text-weight-semibold);\n /* stylelint-disable-next-line declaration-property-value-keyword-no-deprecated */\n word-break: break-word;\n }\n\n /* inline */\n &:where([data-description-variant='inline']) {\n position: relative;\n word-break: normal;\n flex-direction: row;\n align-items: baseline;\n gap: var(--base-size-8);\n\n & .ItemLabel {\n word-break: normal;\n }\n\n &:has([data-truncate='true']) {\n & .ItemLabel {\n flex: 1 0 auto;\n }\n }\n\n & .Description {\n /* stylelint-disable-next-line primer/typography */\n line-height: 16px;\n }\n }\n}\n\n/* description */\n.Description {\n font-size: var(--text-body-size-small);\n font-weight: var(--base-text-weight-normal);\n\n /* line-height: var(--text-caption-lineHeight); */\n\n /* remove after FF ships */\n /* stylelint-disable-next-line primer/typography */\n line-height: 16px;\n color: var(--fgColor-muted);\n}\n\n/* helper for grid alignment with multi-line content\nspan wrapping svg or text */\n.VisualWrap {\n display: flex;\n min-width: max-content;\n min-height: var(--base-size-20);\n /* stylelint-disable-next-line primer/typography */\n line-height: 20px;\n /* temporary until we fix line-height rounding in primitives */\n color: var(--fgColor-muted);\n pointer-events: none;\n fill: var(--fgColor-muted);\n align-items: center;\n}\n\n/* text */\n.ItemLabel {\n position: relative;\n font-size: var(--text-body-size-medium);\n font-weight: var(--base-text-weight-normal);\n /* stylelint-disable-next-line primer/typography */\n line-height: 20px;\n /* temporary until we fix line-height rounding in primitives */\n color: var(--fgColor-default);\n grid-area: label;\n /* stylelint-disable-next-line declaration-property-value-keyword-no-deprecated */\n word-break: break-word;\n}\n\n.SubGroup {\n & .ItemLabel {\n font-size: var(--text-body-size-small);\n }\n\n & .ActionListItem {\n margin-inline: 0;\n }\n}\n\n/* trailing action icon button */\n\n.TrailingActionButton {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n height: 100%;\n\n /* Preserve width consistency when loading state is active for text buttons only */\n &[data-loading='true']:has([data-component='buttonContent']) {\n /* Double the left padding to compensate for missing right padding */\n padding: 0 0 0 calc(var(--base-size-12) * 2);\n\n /* Position spinner at the end to align with IconButton */\n & [data-component='loadingSpinner'] {\n place-self: end;\n /* Match the IconButton spinner size */\n width: var(--control-medium-size, 2rem);\n height: var(--control-medium-size, 2rem);\n /* Ensure spinner is properly centered */\n display: flex;\n align-items: center;\n justify-content: center;\n }\n }\n}\n\n.InactiveButtonWrap {\n &:has(.TrailingVisual) {\n grid-area: trailingVisual;\n }\n\n &:has(.LeadingVisual) {\n grid-area: leadingVisual;\n }\n}\n\n.Divider {\n display: block;\n height: var(--borderWidth-thin);\n padding: 0;\n /* stylelint-disable-next-line primer/spacing */\n margin-block-start: calc(var(--base-size-8) - var(--borderWidth-thin));\n margin-block-end: var(--base-size-8);\n list-style: none;\n /* stylelint-disable-next-line primer/colors */\n background: var(--borderColor-muted);\n border: 0;\n}\n\n.InactiveButtonReset {\n display: flex;\n padding: 0;\n font: inherit;\n color: inherit;\n cursor: pointer;\n background: none;\n border: none;\n}\n\n.InactiveWarning {\n font-size: var(--text-body-size-small);\n\n /* line-height: var(--text-caption-lineHeight); */\n\n /* use variable when FF removed */\n /* stylelint-disable-next-line primer/typography */\n line-height: 16px;\n color: var(--fgColor-attention);\n grid-row: 2/2;\n}\n\n@keyframes checkmarkIn {\n from {\n clip-path: inset(var(--base-size-16) 0 0 0);\n }\n\n to {\n clip-path: inset(0 0 0 0);\n }\n}\n\n@keyframes checkmarkOut {\n from {\n clip-path: inset(0 0 0 0);\n }\n\n to {\n clip-path: inset(var(--base-size-16) 0 0 0);\n }\n}\n","@define-mixin focusOutline $outlineOffset: -2px, $outlineColor: var(--focus-outline-color, var(--focus-outlineColor)) {\n outline: 2px solid $outlineColor;\n outline-offset: $outlineOffset;\n box-shadow: none;\n}\n","@define-mixin activeIndicatorLine {\n position: absolute;\n top: var(--base-size-4);\n left: calc(-1 * var(--base-size-8));\n width: var(--base-size-4);\n height: calc(100% - var(--base-size-8));\n content: '';\n /* stylelint-disable-next-line primer/colors */\n background: var(--borderColor-accent-emphasis);\n border-radius: var(--borderRadius-medium);\n}\n"]}
|