@primer/react 38.0.0-rc.8 → 38.0.0-rc.9
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 +23 -0
- package/dist/ActionList/Selection.js +1 -2
- package/dist/ActionMenu/ActionMenu-bb42318d.css +2 -0
- package/dist/ActionMenu/ActionMenu-bb42318d.css.map +1 -0
- package/dist/ActionMenu/ActionMenu.d.ts.map +1 -1
- package/dist/ActionMenu/ActionMenu.js +6 -0
- package/dist/ActionMenu/ActionMenu.module.css.js +1 -1
- package/dist/Banner/Banner-c1744c4b.css +2 -0
- package/dist/Banner/Banner-c1744c4b.css.map +1 -0
- package/dist/Banner/Banner.d.ts +8 -0
- package/dist/Banner/Banner.d.ts.map +1 -1
- package/dist/Banner/Banner.js +2 -0
- package/dist/Banner/Banner.module.css.js +2 -2
- package/dist/Banner/index.d.ts +1 -0
- package/dist/Banner/index.d.ts.map +1 -1
- package/dist/Breadcrumbs/Breadcrumbs-dbfc9d95.css +2 -0
- package/dist/Breadcrumbs/Breadcrumbs-dbfc9d95.css.map +1 -0
- package/dist/Breadcrumbs/Breadcrumbs.module.css.js +1 -1
- package/dist/Button/ButtonBase-643c673a.css +2 -0
- package/dist/Button/ButtonBase-643c673a.css.map +1 -0
- package/dist/Button/ButtonBase.module.css.js +1 -1
- package/dist/Details/Details.d.ts.map +1 -1
- package/dist/Details/Details.js +19 -41
- package/dist/index.d.ts +1 -3
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +0 -2
- package/dist/sx.d.ts +0 -2
- package/dist/sx.d.ts.map +1 -1
- package/generated/components.json +9 -149
- package/package.json +1 -1
- package/dist/ActionMenu/ActionMenu-5fe972e2.css +0 -2
- package/dist/ActionMenu/ActionMenu-5fe972e2.css.map +0 -1
- package/dist/Banner/Banner-459c533a.css +0 -2
- package/dist/Banner/Banner-459c533a.css.map +0 -1
- package/dist/Breadcrumbs/Breadcrumbs-7cbdf03c.css +0 -2
- package/dist/Breadcrumbs/Breadcrumbs-7cbdf03c.css.map +0 -1
- package/dist/Button/ButtonBase-4c44bb02.css +0 -2
- package/dist/Button/ButtonBase-4c44bb02.css.map +0 -1
- package/dist/sx.js +0 -8
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,28 @@
|
|
|
1
1
|
# @primer/react
|
|
2
2
|
|
|
3
|
+
## 38.0.0-rc.9
|
|
4
|
+
|
|
5
|
+
### Major Changes
|
|
6
|
+
|
|
7
|
+
- [#7032](https://github.com/primer/react/pull/7032) [`9fce541`](https://github.com/primer/react/commit/9fce5419ce76c94837f2bd4b013f007837a97182) Thanks [@francinelucca](https://github.com/francinelucca)! - - remove sx, SxProp, exports
|
|
8
|
+
- add type ThemeColorPaths, type ThemeShadowPaths
|
|
9
|
+
|
|
10
|
+
### Minor Changes
|
|
11
|
+
|
|
12
|
+
- [#7045](https://github.com/primer/react/pull/7045) [`7595b8d`](https://github.com/primer/react/commit/7595b8d0d534043aeca69f0862a8ffd5c911c50c) Thanks [@langermank](https://github.com/langermank)! - Add new `Banner` `actionsLayout` prop to handle actions layout edge cases
|
|
13
|
+
|
|
14
|
+
### Patch Changes
|
|
15
|
+
|
|
16
|
+
- [#7020](https://github.com/primer/react/pull/7020) [`aaa2e1f`](https://github.com/primer/react/commit/aaa2e1f5589a862557b6f7d5194e0579bc952c84) Thanks [@hectahertz](https://github.com/hectahertz)! - Fixes `Details` flickering, prevents re-renders
|
|
17
|
+
|
|
18
|
+
- [#7008](https://github.com/primer/react/pull/7008) [`ca6d60d`](https://github.com/primer/react/commit/ca6d60d37dcdaec354bbdd097fd8c656971e752b) Thanks [@langermank](https://github.com/langermank)! - Use primitives for Button line-height
|
|
19
|
+
|
|
20
|
+
- [#7046](https://github.com/primer/react/pull/7046) [`4ffe66d`](https://github.com/primer/react/commit/4ffe66d0d87c5ab8a3c0d9ef4e9ba571e6d57393) Thanks [@pksjce](https://github.com/pksjce)! - Fix: ActionMenu with overflow contains scrollbars within its rounded border
|
|
21
|
+
|
|
22
|
+
- [#7030](https://github.com/primer/react/pull/7030) [`52d6cf7`](https://github.com/primer/react/commit/52d6cf7e7cc2a0f4ea3186ee61412a2a2549b530) Thanks [@francinelucca](https://github.com/francinelucca)! - fix(SelectPanel): remove hidden attribute from selection Radio
|
|
23
|
+
|
|
24
|
+
- [#7048](https://github.com/primer/react/pull/7048) [`f4a92f6`](https://github.com/primer/react/commit/f4a92f6d5fab8aee0bebb0b3bd8a400d55dc6cc7) Thanks [@langermank](https://github.com/langermank)! - Adjust Breadcrumb item focus outline
|
|
25
|
+
|
|
3
26
|
## 38.0.0-rc.8
|
|
4
27
|
|
|
5
28
|
### Major Changes
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
.prc-ActionMenu-ActionMenuContainer-XdFHv:where([data-variant=fullscreen]){padding-top:var(--base-size-36,2.25rem)}.prc-ActionMenu-ActionMenuContainer-XdFHv:where([data-overflow-auto]){overflow:auto}.prc-ActionMenu-ActionMenuContainer-XdFHv:where([data-overflow-hidden]){overflow:hidden}.prc-ActionMenu-ActionMenuContainer-XdFHv:where([data-overflow-scroll]){overflow:scroll}.prc-ActionMenu-ActionMenuContainer-XdFHv:where([data-overflow-visible]){overflow:visible}.prc-ActionMenu-ActionMenuContainer-XdFHv:where([data-max-height-xsmall]){max-height:192px}.prc-ActionMenu-ActionMenuContainer-XdFHv:where([data-max-height-small]){max-height:256px}.prc-ActionMenu-ActionMenuContainer-XdFHv:where([data-max-height-medium]){max-height:320px}.prc-ActionMenu-ActionMenuContainer-XdFHv:where([data-max-height-large]){max-height:432px}.prc-ActionMenu-ActionMenuContainer-XdFHv:where([data-max-height-xlarge]){max-height:600px}.prc-ActionMenu-ActionMenuContainer-XdFHv:where([data-max-height-fit-content]){max-height:-moz-fit-content;max-height:fit-content}
|
|
2
|
+
/*# sourceMappingURL=ActionMenu-bb42318d.css.map */
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/ActionMenu/ActionMenu.module.css"],"names":[],"mappings":"AACE,2EACE,uCACF,CAGA,sEACE,aACF,CAEA,wEACE,eACF,CAEA,wEACE,eACF,CAEA,yEACE,gBACF,CAGA,0EACE,gBACF,CAEA,yEACE,gBACF,CAEA,0EACE,gBACF,CAEA,yEACE,gBACF,CAEA,0EACE,gBACF,CAEA,+EACE,2BAAuB,CAAvB,sBACF","file":"ActionMenu-bb42318d.css","sourcesContent":[".ActionMenuContainer {\n &:where([data-variant='fullscreen']) {\n padding-top: var(--base-size-36);\n }\n\n /* Overflow variants */\n &:where([data-overflow-auto]) {\n overflow: auto;\n }\n\n &:where([data-overflow-hidden]) {\n overflow: hidden;\n }\n\n &:where([data-overflow-scroll]) {\n overflow: scroll;\n }\n\n &:where([data-overflow-visible]) {\n overflow: visible;\n }\n\n /* Max-height size tokens (mirror Overlay sizes) */\n &:where([data-max-height-xsmall]) {\n max-height: 192px;\n }\n\n &:where([data-max-height-small]) {\n max-height: 256px;\n }\n\n &:where([data-max-height-medium]) {\n max-height: 320px;\n }\n\n &:where([data-max-height-large]) {\n max-height: 432px;\n }\n\n &:where([data-max-height-xlarge]) {\n max-height: 600px;\n }\n\n &:where([data-max-height-fit-content]) {\n max-height: fit-content;\n }\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ActionMenu.d.ts","sourceRoot":"","sources":["../../src/ActionMenu/ActionMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8D,MAAM,OAAO,CAAA;AAElF,OAAO,KAAK,EAAC,oBAAoB,EAAC,MAAM,oBAAoB,CAAA;AAE5D,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,YAAY,CAAA;AAI5C,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,WAAW,CAAA;AAC1C,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,mBAAmB,CAAA;AAIrD,OAAO,KAAK,EAAC,mBAAmB,IAAI,8BAA8B,EAAC,MAAM,sBAAsB,CAAA;AAK/F,OAAO,KAAK,EAAC,gBAAgB,EAAE,cAAc,EAAC,MAAM,sBAAsB,CAAA;AAE1E,MAAM,MAAM,gBAAgB,GAAG,CAC7B,OAAO,EAAE,cAAc,GAAG,eAAe,GAAG,QAAQ,GAAG,KAAK,GAAG,aAAa,GAAG,YAAY,GAAG,OAAO,KAClG,IAAI,CAAA;AAET,MAAM,MAAM,gBAAgB,GAAG,IAAI,CACjC,oBAAoB,EACpB,WAAW,GAAG,cAAc,GAAG,MAAM,GAAG,QAAQ,GAAG,UAAU,CAC9D,GAAG;IACF,OAAO,CAAC,EAAE,gBAAgB,CAAA;IAC1B,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB,CAAA;AAGD,MAAM,MAAM,eAAe,GAAG;IAC5B;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,YAAY,EAAE,GAAG,KAAK,CAAC,YAAY,CAAA;IAEnD;;OAEG;IACH,IAAI,CAAC,EAAE,OAAO,CAAA;IAEd;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,CAAC,EAAE,OAAO,KAAK,IAAI,CAAA;CACpC,GAAG,IAAI,CAAC,oBAAoB,EAAE,WAAW,CAAC,CAAA;AAqI3C,MAAM,MAAM,qBAAqB,GAAG;IAAC,QAAQ,EAAE,KAAK,CAAC,YAAY,CAAC;IAAC,EAAE,CAAC,EAAE,MAAM,CAAA;CAAC,GAAG,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,CAAA;AAyDnH,6CAA6C;AAC7C,MAAM,MAAM,qBAAqB,GAAG,WAAW,CAAA;AAe/C,KAAK,gBAAgB,GAAG,OAAO,CAAC,YAAY,CAAC,GAC3C,IAAI,CAAC,oBAAoB,EAAE,OAAO,GAAG,MAAM,GAAG,SAAS,CAAC,GAAG;IACzD;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,gBAAgB,CAAC,EAAE,CAAC,EAAC,QAAQ,EAAC,EAAE;QAAC,QAAQ,EAAE,cAAc,CAAA;KAAC,KAAK,IAAI,CAAA;CACpE,CAAA;
|
|
1
|
+
{"version":3,"file":"ActionMenu.d.ts","sourceRoot":"","sources":["../../src/ActionMenu/ActionMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8D,MAAM,OAAO,CAAA;AAElF,OAAO,KAAK,EAAC,oBAAoB,EAAC,MAAM,oBAAoB,CAAA;AAE5D,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,YAAY,CAAA;AAI5C,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,WAAW,CAAA;AAC1C,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,mBAAmB,CAAA;AAIrD,OAAO,KAAK,EAAC,mBAAmB,IAAI,8BAA8B,EAAC,MAAM,sBAAsB,CAAA;AAK/F,OAAO,KAAK,EAAC,gBAAgB,EAAE,cAAc,EAAC,MAAM,sBAAsB,CAAA;AAE1E,MAAM,MAAM,gBAAgB,GAAG,CAC7B,OAAO,EAAE,cAAc,GAAG,eAAe,GAAG,QAAQ,GAAG,KAAK,GAAG,aAAa,GAAG,YAAY,GAAG,OAAO,KAClG,IAAI,CAAA;AAET,MAAM,MAAM,gBAAgB,GAAG,IAAI,CACjC,oBAAoB,EACpB,WAAW,GAAG,cAAc,GAAG,MAAM,GAAG,QAAQ,GAAG,UAAU,CAC9D,GAAG;IACF,OAAO,CAAC,EAAE,gBAAgB,CAAA;IAC1B,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB,CAAA;AAGD,MAAM,MAAM,eAAe,GAAG;IAC5B;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,YAAY,EAAE,GAAG,KAAK,CAAC,YAAY,CAAA;IAEnD;;OAEG;IACH,IAAI,CAAC,EAAE,OAAO,CAAA;IAEd;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,CAAC,EAAE,OAAO,KAAK,IAAI,CAAA;CACpC,GAAG,IAAI,CAAC,oBAAoB,EAAE,WAAW,CAAC,CAAA;AAqI3C,MAAM,MAAM,qBAAqB,GAAG;IAAC,QAAQ,EAAE,KAAK,CAAC,YAAY,CAAC;IAAC,EAAE,CAAC,EAAE,MAAM,CAAA;CAAC,GAAG,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,CAAA;AAyDnH,6CAA6C;AAC7C,MAAM,MAAM,qBAAqB,GAAG,WAAW,CAAA;AAe/C,KAAK,gBAAgB,GAAG,OAAO,CAAC,YAAY,CAAC,GAC3C,IAAI,CAAC,oBAAoB,EAAE,OAAO,GAAG,MAAM,GAAG,SAAS,CAAC,GAAG;IACzD;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,gBAAgB,CAAC,EAAE,CAAC,EAAC,QAAQ,EAAC,EAAE;QAAC,QAAQ,EAAE,cAAc,CAAA;KAAC,KAAK,IAAI,CAAA;CACpE,CAAA;AAyFH,eAAO,MAAM,UAAU;;;kBArKP,KAAK,CAAC,YAAY;aACvB,MAAM;;;;CAoK4E,CAAA"}
|
|
@@ -267,6 +267,12 @@ const Overlay = ({
|
|
|
267
267
|
ref: containerRef,
|
|
268
268
|
className: styles.ActionMenuContainer,
|
|
269
269
|
"data-variant": responsiveVariant,
|
|
270
|
+
...(overlayProps.overflow ? {
|
|
271
|
+
[`data-overflow-${overlayProps.overflow}`]: ''
|
|
272
|
+
} : {}),
|
|
273
|
+
...(overlayProps.maxHeight ? {
|
|
274
|
+
[`data-max-height-${overlayProps.maxHeight}`]: ''
|
|
275
|
+
} : {}),
|
|
270
276
|
children: /*#__PURE__*/jsx(ActionListContainerContext.Provider, {
|
|
271
277
|
value: {
|
|
272
278
|
container: 'ActionMenu',
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
.prc-Banner-Banner-IR8eJ{align-items:start;background-color:var(--banner-bgColor);border:var(--borderWidth-thin,.0625rem) solid var(--banner-borderColor);border-radius:var(--borderRadius-medium,.375rem);display:grid;grid-template-columns:auto minmax(0,1fr) auto;padding:var(--base-size-8,.5rem)}@supports (container-type:inline-size){.prc-Banner-Banner-IR8eJ[data-actions-layout=default]{container:banner/inline-size}}.prc-Banner-Banner-IR8eJ[data-actions-layout=stacked] .prc-Banner-BannerContainer-lbx3d{flex-direction:column}.prc-Banner-Banner-IR8eJ[data-actions-layout=stacked] .prc-Banner-BannerActions-XCfHL :where([data-primary-action=trailing]){display:none}.prc-Banner-Banner-IR8eJ[data-actions-layout=stacked] .prc-Banner-BannerActions-XCfHL :where([data-primary-action=leading]){display:flex}.prc-Banner-Banner-IR8eJ[data-actions-layout=inline] .prc-Banner-BannerContainer-lbx3d{flex-wrap:nowrap}.prc-Banner-Banner-IR8eJ[data-actions-layout=inline] .prc-Banner-BannerActions-XCfHL{flex:0 0 auto}.prc-Banner-Banner-IR8eJ[data-actions-layout=inline] .prc-Banner-BannerActions-XCfHL :where([data-primary-action=trailing]){display:flex}.prc-Banner-Banner-IR8eJ[data-actions-layout=inline] .prc-Banner-BannerActions-XCfHL :where([data-primary-action=leading]){display:none}.prc-Banner-Banner-IR8eJ[data-layout=compact]{padding:var(--base-size-4,.25rem)}.prc-Banner-Banner-IR8eJ[data-variant=critical]{--banner-bgColor:var(--bgColor-danger-muted,var(--color-danger-subtle));--banner-borderColor:var(--borderColor-danger-muted,var(--color-danger-muted));--banner-icon-fgColor:var(--fgColor-danger,var(--color-danger-fg))}.prc-Banner-Banner-IR8eJ[data-variant=info]{--banner-bgColor:var(--bgColor-accent-muted,var(--color-accent-subtle));--banner-borderColor:var(--borderColor-accent-muted,var(--color-accent-muted));--banner-icon-fgColor:var(--fgColor-accent,var(--color-accent-fg))}.prc-Banner-Banner-IR8eJ[data-variant=success]{--banner-bgColor:var(--bgColor-success-muted,var(--color-success-subtle));--banner-borderColor:var(--borderColor-success-muted,var(--color-success-muted));--banner-icon-fgColor:var(--fgColor-success,var(--color-success-fg))}.prc-Banner-Banner-IR8eJ[data-variant=upsell]{--banner-bgColor:var(--bgColor-upsell-muted,#fbefff);--banner-borderColor:var(--borderColor-upsell-muted,#c297ff66);--banner-icon-fgColor:var(--fgColor-upsell,#8250df)}.prc-Banner-Banner-IR8eJ[data-variant=warning]{--banner-bgColor:var(--bgColor-attention-muted,var(--color-attention-subtle));--banner-borderColor:var(--borderColor-attention-muted,var(--color-attention-muted));--banner-icon-fgColor:var(--fgColor-attention,var(--color-attention-fg))}.prc-Banner-BannerContainer-lbx3d{align-items:start;column-gap:var(--base-size-4,.25rem);font-size:var(--text-body-size-medium,.875rem);line-height:var(--text-body-lineHeight-medium,1.4285);row-gap:var(--base-size-4,.25rem)}.prc-Banner-Banner-IR8eJ :where(.prc-Banner-BannerContainer-lbx3d){display:flex;flex-wrap:wrap;justify-content:space-between}.prc-Banner-Banner-IR8eJ[data-dismissible]:not([data-title-hidden],[data-actions-layout=inline]) .prc-Banner-BannerContainer-lbx3d{display:grid;grid-template-columns:auto;grid-template-rows:auto}.prc-Banner-BannerContent-zTITK{display:grid;grid-column-start:1;margin-block:var(--base-size-8,.5rem);row-gap:var(--base-size-4,.25rem)}.prc-Banner-Banner-IR8eJ[data-title-hidden]:not(:has(.prc-Banner-BannerActions-XCfHL)) .prc-Banner-BannerContent-zTITK{margin-block:var(--base-size-6,.375rem)}@media screen and (min-width:544px){.prc-Banner-BannerContent-zTITK{flex:1 1 0%}}.prc-Banner-BannerTitle-TcuJl{font-size:inherit;font-weight:var(--base-text-weight-semibold,600);margin:0}.prc-Banner-BannerIcon-WuOyf{display:grid;padding:var(--base-size-8,.5rem);place-items:center}.prc-Banner-BannerIcon-WuOyf svg{color:var(--banner-icon-fgColor);height:var(--base-size-20,1.25rem);fill:var(--banner-icon-fgColor)}.prc-Banner-Banner-IR8eJ[data-title-hidden]:not(:has(.prc-Banner-BannerActions-XCfHL)) .prc-Banner-BannerIcon-WuOyf svg{height:var(--base-size-16,1rem)}.prc-Banner-BannerDismiss-uBZVm{display:grid;margin-inline-start:var(--base-size-4,.25rem);padding:var(--base-size-8,.5rem);place-items:center}:where(.prc-Banner-Banner-IR8eJ):has(.prc-Banner-BannerActions-XCfHL) .prc-Banner-BannerDismiss-uBZVm{margin-block:var(--base-size-2,.125rem)}.prc-Banner-BannerDismiss-uBZVm svg{color:var(--banner-icon-fgColor)}.prc-Banner-BannerActionsContainer-ukGMH{align-items:center;column-gap:var(--base-size-12,.75rem);display:flex;margin-block:var(--base-size-2,.125rem)}.prc-Banner-BannerActions-XCfHL :where([data-primary-action=trailing]){display:none}.prc-Banner-Banner-IR8eJ[data-dismissible]:not([data-title-hidden],[data-actions-layout=inline]) .prc-Banner-BannerActions-XCfHL{margin-block-end:var(--base-size-6,.375rem)}.prc-Banner-Banner-IR8eJ[data-dismissible]:not([data-title-hidden],[data-actions-layout=inline]) .prc-Banner-BannerActionsContainer-ukGMH[data-primary-action=trailing]{display:none}.prc-Banner-Banner-IR8eJ[data-dismissible]:not([data-title-hidden],[data-actions-layout=inline]) .prc-Banner-BannerActionsContainer-ukGMH[data-primary-action=leading]{display:flex}@container banner (max-width: 500px){.prc-Banner-BannerContainer-lbx3d{display:grid}.prc-Banner-BannerContainer-lbx3d:has(.prc-Banner-BannerActionsContainer-ukGMH){grid-template-rows:auto auto}.prc-Banner-BannerActions-XCfHL{margin-block-end:var(--base-size-6,.375rem)}.prc-Banner-BannerActions-XCfHL [data-primary-action=trailing]{display:none}.prc-Banner-BannerActions-XCfHL [data-primary-action=leading]{display:flex}}@container banner (min-width: 500px){.prc-Banner-BannerContainer-lbx3d{display:grid;grid-template-columns:auto auto}:where(.prc-Banner-Banner-IR8eJ):not([data-dismissible]) :where(.prc-Banner-BannerActionsContainer-ukGMH[data-primary-action=trailing]) :where([data-variant=link]:only-child){padding-inline:0 var(--base-size-12,.75rem)}.prc-Banner-BannerActions-XCfHL [data-primary-action=trailing]{display:flex;min-height:var(--base-size-32,2rem)}.prc-Banner-BannerActions-XCfHL [data-primary-action=leading]{display:none}}
|
|
2
|
+
/*# sourceMappingURL=Banner-c1744c4b.css.map */
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/Banner/Banner.module.css"],"names":[],"mappings":"AAAA,yBASE,iBAAkB,CALlB,sCAAuC,CAEvC,uEAA+D,CAC/D,gDAAyC,CANzC,YAAa,CAOb,6CAA+C,CAN/C,gCAgFF,CAtEI,uCADF,sDAEI,4BAEJ,CADE,CAIA,wFACE,qBACF,CAEA,6HACE,YACF,CAEA,4HACE,YACF,CAIA,uFACE,gBACF,CAEA,qFACE,aACF,CAEA,4HACE,YACF,CAEA,2HACE,YACF,CAGF,8CACE,iCACF,CAEA,gDACE,uEAA6C,CAC7C,8EAAqD,CACrD,kEACF,CAEA,4CACE,uEAA6C,CAC7C,8EAAqD,CACrD,kEACF,CAEA,+CACE,yEAA8C,CAC9C,gFAAsD,CACtD,oEACF,CAEA,8CACE,oDAA6C,CAC7C,8DAAqD,CACrD,mDACF,CAEA,+CACE,6EAAgD,CAChD,oFAAwD,CACxD,wEACF,CAKF,kCAEE,iBAAkB,CAGlB,oCAA8B,CAJ9B,8CAAuC,CAEvC,qDAA+C,CAC/C,iCAEF,CAEA,mEACE,YAAa,CACb,cAAe,CACf,6BACF,CAEA,mIACE,YAAa,CACb,0BAA2B,CAC3B,uBACF,CAIA,gCACE,YAAa,CAEb,mBAAoB,CACpB,qCAAgC,CAFhC,iCAGF,CAEA,uHACE,uCACF,CAEA,oCACE,gCACE,WACF,CACF,CAEA,8BAEE,iBAAkB,CAClB,gDAA6C,CAF7C,QAGF,CAIA,6BACE,YAAa,CAEb,gCAA2B,CAD3B,kBAEF,CAEA,iCAIE,gCAAiC,CAFjC,kCAA2B,CAI3B,+BACF,CAGA,wHACE,+BACF,CAIA,gCACE,YAAa,CAGb,6CAAuC,CADvC,gCAA2B,CAD3B,kBAGF,CAEA,sGACE,uCACF,CAEA,oCAEE,gCACF,CAIA,yCAGE,kBAAmB,CADnB,qCAA+B,CAD/B,YAAa,CAGb,uCACF,CAEA,uEACE,YACF,CAEA,iIACE,2CACF,CAGA,wKAEE,YACF,CAGA,uKAEE,YACF,CAIA,qCACE,kCACE,YACF,CAEA,gFACE,4BACF,CAEA,gCACE,2CACF,CAEA,+DACE,YACF,CAEA,8DACE,YACF,CACF,CAEA,qCACE,kCACE,YAAa,CACb,+BACF,CAEA,+KAGE,2CACF,CAEA,+DACE,YAAa,CACb,mCACF,CAEA,8DACE,YACF,CACF","file":"Banner-c1744c4b.css","sourcesContent":[".Banner {\n display: grid;\n padding: var(--base-size-8);\n /* stylelint-disable-next-line primer/colors */\n background-color: var(--banner-bgColor);\n /* stylelint-disable-next-line primer/colors */\n border: var(--borderWidth-thin) solid var(--banner-borderColor);\n border-radius: var(--borderRadius-medium);\n grid-template-columns: auto minmax(0, 1fr) auto;\n align-items: start;\n\n &[data-actions-layout='default'] {\n @supports (container-type: inline-size) {\n container: banner / inline-size;\n }\n }\n\n &[data-actions-layout='stacked'] {\n & .BannerContainer {\n flex-direction: column;\n }\n\n & .BannerActions :where([data-primary-action='trailing']) {\n display: none;\n }\n\n & .BannerActions :where([data-primary-action='leading']) {\n display: flex;\n }\n }\n\n &[data-actions-layout='inline'] {\n & .BannerContainer {\n flex-wrap: nowrap;\n }\n\n & .BannerActions {\n flex: 0 0 auto;\n }\n\n & .BannerActions :where([data-primary-action='trailing']) {\n display: flex;\n }\n\n & .BannerActions :where([data-primary-action='leading']) {\n display: none;\n }\n }\n\n &[data-layout='compact'] {\n padding: var(--base-size-4);\n }\n\n &[data-variant='critical'] {\n --banner-bgColor: var(--bgColor-danger-muted);\n --banner-borderColor: var(--borderColor-danger-muted);\n --banner-icon-fgColor: var(--fgColor-danger);\n }\n\n &[data-variant='info'] {\n --banner-bgColor: var(--bgColor-accent-muted);\n --banner-borderColor: var(--borderColor-accent-muted);\n --banner-icon-fgColor: var(--fgColor-accent);\n }\n\n &[data-variant='success'] {\n --banner-bgColor: var(--bgColor-success-muted);\n --banner-borderColor: var(--borderColor-success-muted);\n --banner-icon-fgColor: var(--fgColor-success);\n }\n\n &[data-variant='upsell'] {\n --banner-bgColor: var(--bgColor-upsell-muted);\n --banner-borderColor: var(--borderColor-upsell-muted);\n --banner-icon-fgColor: var(--fgColor-upsell);\n }\n\n &[data-variant='warning'] {\n --banner-bgColor: var(--bgColor-attention-muted);\n --banner-borderColor: var(--borderColor-attention-muted);\n --banner-icon-fgColor: var(--fgColor-attention);\n }\n}\n\n/* BannerContainer -------------------------------------------------------- */\n\n.BannerContainer {\n font-size: var(--text-body-size-medium);\n align-items: start;\n line-height: var(--text-body-lineHeight-medium);\n row-gap: var(--base-size-4);\n column-gap: var(--base-size-4);\n}\n\n.Banner :where(.BannerContainer) {\n display: flex;\n flex-wrap: wrap;\n justify-content: space-between;\n}\n\n.Banner[data-dismissible]:not([data-title-hidden], [data-actions-layout='inline']) .BannerContainer {\n display: grid;\n grid-template-columns: auto;\n grid-template-rows: auto;\n}\n\n/* BannerContent ---------------------------------------------------------- */\n\n.BannerContent {\n display: grid;\n row-gap: var(--base-size-4);\n grid-column-start: 1;\n margin-block: var(--base-size-8);\n}\n\n.Banner[data-title-hidden]:not(:has(.BannerActions)) .BannerContent {\n margin-block: var(--base-size-6);\n}\n\n@media screen and (min-width: 544px) {\n .BannerContent {\n flex: 1 1 0%;\n }\n}\n\n.BannerTitle {\n margin: 0;\n font-size: inherit;\n font-weight: var(--base-text-weight-semibold);\n}\n\n/* BannerIcon ------------------------------------------------------------- */\n\n.BannerIcon {\n display: grid;\n place-items: center;\n padding: var(--base-size-8);\n}\n\n.BannerIcon svg {\n /* 20px is the line box height of the trailing action buttons */\n height: var(--base-size-20);\n /* stylelint-disable-next-line primer/colors */\n color: var(--banner-icon-fgColor);\n /* stylelint-disable-next-line primer/colors */\n fill: var(--banner-icon-fgColor);\n}\n\n/* stylelint-disable-next-line selector-max-specificity */\n.Banner[data-title-hidden]:not(:has(.BannerActions)) .BannerIcon svg {\n height: var(--base-size-16);\n}\n\n/* BannerDismiss ---------------------------------------------------------- */\n\n.BannerDismiss {\n display: grid;\n place-items: center;\n padding: var(--base-size-8);\n margin-inline-start: var(--base-size-4);\n}\n\n:where(.Banner):has(.BannerActions) .BannerDismiss {\n margin-block: var(--base-size-2);\n}\n\n.BannerDismiss svg {\n /* stylelint-disable-next-line primer/colors */\n color: var(--banner-icon-fgColor);\n}\n\n/* BannerActions ---------------------------------------------------------- */\n\n.BannerActionsContainer {\n display: flex;\n column-gap: var(--base-size-12);\n align-items: center;\n margin-block: var(--base-size-2);\n}\n\n.BannerActions :where([data-primary-action='trailing']) {\n display: none;\n}\n\n.Banner[data-dismissible]:not([data-title-hidden], [data-actions-layout='inline']) .BannerActions {\n margin-block-end: var(--base-size-6);\n}\n\n/* stylelint-disable-next-line selector-max-specificity */\n.Banner[data-dismissible]:not([data-title-hidden], [data-actions-layout='inline'])\n .BannerActionsContainer[data-primary-action='trailing'] {\n display: none;\n}\n\n/* stylelint-disable-next-line selector-max-specificity */\n.Banner[data-dismissible]:not([data-title-hidden], [data-actions-layout='inline'])\n .BannerActionsContainer[data-primary-action='leading'] {\n display: flex;\n}\n\n/* Layout ------------------------------------------------------------------- */\n\n@container banner (max-width: 500px) {\n .BannerContainer {\n display: grid;\n }\n\n .BannerContainer:has(.BannerActionsContainer) {\n grid-template-rows: auto auto;\n }\n\n .BannerActions {\n margin-block-end: var(--base-size-6);\n }\n\n .BannerActions [data-primary-action='trailing'] {\n display: none;\n }\n\n .BannerActions [data-primary-action='leading'] {\n display: flex;\n }\n}\n\n@container banner (min-width: 500px) {\n .BannerContainer {\n display: grid;\n grid-template-columns: auto auto;\n }\n\n :where(.Banner):not([data-dismissible])\n :where(.BannerActionsContainer[data-primary-action='trailing'])\n :where([data-variant='link']:only-child) {\n padding-inline: 0 var(--base-size-12);\n }\n\n .BannerActions [data-primary-action='trailing'] {\n display: flex;\n min-height: var(--base-size-32, 2rem);\n }\n\n .BannerActions [data-primary-action='leading'] {\n display: none;\n }\n}\n"]}
|
package/dist/Banner/Banner.d.ts
CHANGED
|
@@ -52,6 +52,10 @@ export type BannerProps = React.ComponentPropsWithoutRef<'section'> & {
|
|
|
52
52
|
* Specify the layout of the Banner. Compact layout will reduce the padding.
|
|
53
53
|
*/
|
|
54
54
|
layout?: 'default' | 'compact';
|
|
55
|
+
/**
|
|
56
|
+
* Override the default actions layout behavior
|
|
57
|
+
*/
|
|
58
|
+
actionsLayout?: 'inline' | 'stacked' | 'default';
|
|
55
59
|
};
|
|
56
60
|
export declare const Banner: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & {
|
|
57
61
|
/**
|
|
@@ -103,6 +107,10 @@ export declare const Banner: React.ForwardRefExoticComponent<Omit<React.Detailed
|
|
|
103
107
|
* Specify the layout of the Banner. Compact layout will reduce the padding.
|
|
104
108
|
*/
|
|
105
109
|
layout?: "default" | "compact";
|
|
110
|
+
/**
|
|
111
|
+
* Override the default actions layout behavior
|
|
112
|
+
*/
|
|
113
|
+
actionsLayout?: "inline" | "stacked" | "default";
|
|
106
114
|
} & React.RefAttributes<HTMLElement>>;
|
|
107
115
|
type HeadingElement = 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
|
|
108
116
|
export type BannerTitleProps<As extends HeadingElement> = {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Banner.d.ts","sourceRoot":"","sources":["../../src/Banner/Banner.tsx"],"names":[],"mappings":"AACA,OAAO,KAA8B,MAAM,OAAO,CAAA;AAElD,OAAO,EAAqB,KAAK,WAAW,EAAC,MAAM,WAAW,CAAA;AAI9D,OAAO,KAAK,EAAC,mBAAmB,IAAI,8BAA8B,EAAC,MAAM,sBAAsB,CAAA;AAE/F,MAAM,MAAM,aAAa,GAAG,UAAU,GAAG,MAAM,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,CAAA;AAElF,MAAM,MAAM,WAAW,GAAG,KAAK,CAAC,wBAAwB,CAAC,SAAS,CAAC,GAAG;IACpE;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAA;IAErB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAElB;;;OAGG;IACH,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAE7B;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAA;IAEnB;;OAEG;IACH,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAEtB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;IAEtB;;OAEG;IACH,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAE/B;;OAEG;IACH,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAEjC;;;OAGG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAEvB;;OAEG;IACH,OAAO,CAAC,EAAE,aAAa,CAAA;IAEvB;;OAEG;IACH,MAAM,CAAC,EAAE,SAAS,GAAG,SAAS,CAAA;
|
|
1
|
+
{"version":3,"file":"Banner.d.ts","sourceRoot":"","sources":["../../src/Banner/Banner.tsx"],"names":[],"mappings":"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"}
|
package/dist/Banner/Banner.js
CHANGED
|
@@ -36,6 +36,7 @@ const Banner = /*#__PURE__*/React.forwardRef(function Banner({
|
|
|
36
36
|
secondaryAction,
|
|
37
37
|
title,
|
|
38
38
|
variant = 'info',
|
|
39
|
+
actionsLayout = 'default',
|
|
39
40
|
...rest
|
|
40
41
|
}, forwardRef) {
|
|
41
42
|
const dismissible = !!onDismiss;
|
|
@@ -71,6 +72,7 @@ const Banner = /*#__PURE__*/React.forwardRef(function Banner({
|
|
|
71
72
|
"data-dismissible": onDismiss ? '' : undefined,
|
|
72
73
|
"data-title-hidden": hideTitle ? '' : undefined,
|
|
73
74
|
"data-variant": variant,
|
|
75
|
+
"data-actions-layout": actionsLayout,
|
|
74
76
|
tabIndex: -1,
|
|
75
77
|
ref: ref,
|
|
76
78
|
"data-layout": rest.layout || 'default',
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import './Banner-
|
|
1
|
+
import './Banner-c1744c4b.css';
|
|
2
2
|
|
|
3
|
-
var classes = {"Banner":"prc-Banner-Banner-IR8eJ","BannerContainer":"prc-Banner-BannerContainer-lbx3d","
|
|
3
|
+
var classes = {"Banner":"prc-Banner-Banner-IR8eJ","BannerContainer":"prc-Banner-BannerContainer-lbx3d","BannerActions":"prc-Banner-BannerActions-XCfHL","BannerContent":"prc-Banner-BannerContent-zTITK","BannerTitle":"prc-Banner-BannerTitle-TcuJl","BannerIcon":"prc-Banner-BannerIcon-WuOyf","BannerDismiss":"prc-Banner-BannerDismiss-uBZVm","BannerActionsContainer":"prc-Banner-BannerActionsContainer-ukGMH"};
|
|
4
4
|
|
|
5
5
|
export { classes as default };
|
package/dist/Banner/index.d.ts
CHANGED
|
@@ -12,6 +12,7 @@ export declare const Banner: import("react").ForwardRefExoticComponent<Omit<impo
|
|
|
12
12
|
title?: React.ReactNode;
|
|
13
13
|
variant?: import("./Banner").BannerVariant;
|
|
14
14
|
layout?: "default" | "compact";
|
|
15
|
+
actionsLayout?: "inline" | "stacked" | "default";
|
|
15
16
|
} & import("react").RefAttributes<HTMLElement>> & {
|
|
16
17
|
Title: typeof BannerTitle;
|
|
17
18
|
Description: typeof BannerDescription;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Banner/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,WAAW,EACX,iBAAiB,EAGlB,MAAM,UAAU,CAAA;AACjB,OAAO,KAAK,EACV,WAAW,EACX,gBAAgB,EAChB,sBAAsB,EACtB,wBAAwB,EACxB,0BAA0B,EAC3B,MAAM,UAAU,CAAA;AAEjB,eAAO,MAAM,MAAM
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Banner/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,WAAW,EACX,iBAAiB,EAGlB,MAAM,UAAU,CAAA;AACjB,OAAO,KAAK,EACV,WAAW,EACX,gBAAgB,EAChB,sBAAsB,EACtB,wBAAwB,EACxB,0BAA0B,EAC3B,MAAM,UAAU,CAAA;AAEjB,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;CAKjB,CAAA;AAEF,YAAY,EACV,WAAW,EACX,gBAAgB,EAChB,sBAAsB,EACtB,wBAAwB,EACxB,0BAA0B,GAC3B,CAAA"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
.prc-Breadcrumbs-BreadcrumbsBase-6gqOz{display:flex;justify-content:space-between;width:100%}.prc-Breadcrumbs-BreadcrumbsList-K7eeK{margin-bottom:0;margin-top:0;padding-left:0}:is([data-overflow=menu],[data-overflow=menu-with-root]) .prc-Breadcrumbs-BreadcrumbsList-K7eeK{display:flex;flex-direction:row;white-space:nowrap}.prc-Breadcrumbs-ItemSeparator-nYObp{align-self:center;color:var(--fgColor-muted,var(--color-fg-muted));display:flex;justify-content:center;-webkit-user-select:none;user-select:none;white-space:nowrap}.prc-Breadcrumbs-ItemWrapper-Mfwuj{list-style:none}.prc-Breadcrumbs-ItemWrapper-Mfwuj,.prc-Breadcrumbs-ItemWrapper-Mfwuj:after{display:inline-block;font-size:var(--text-body-size-medium,.875rem)}.prc-Breadcrumbs-ItemWrapper-Mfwuj:after{border-right:.1em solid var(--fgColor-muted,var(--color-fg-muted));content:"";height:.8em;margin:0 .5em;transform:rotate(15deg) translateY(.0625em)}.prc-Breadcrumbs-ItemWrapper-Mfwuj:first-child{margin-left:0}.prc-Breadcrumbs-ItemWrapper-Mfwuj:last-child:after{content:none}.prc-Breadcrumbs-Item-7BKO-{display:inline-block;font-size:var(--text-body-size-medium,.875rem)}.prc-Breadcrumbs-Item-7BKO-:focus-visible{border-radius:var(--borderRadius-small,.1875rem);box-shadow:none;outline:2px solid var(--focus-outlineColor,var(--color-accent-fg));outline-offset:2px}[data-variant=normal] .prc-Breadcrumbs-Item-7BKO-{color:var(--fgColor-link,var(--color-accent-fg));-webkit-text-decoration:none;text-decoration:none}:is([data-variant=normal] .prc-Breadcrumbs-Item-7BKO-):not([aria-current]):hover{-webkit-text-decoration:underline;text-decoration:underline}:is([data-variant=normal] .prc-Breadcrumbs-Item-7BKO-):focus-visible{-webkit-text-decoration:none;text-decoration:none}[aria-current]:is([data-variant=normal] .prc-Breadcrumbs-Item-7BKO-){color:var(--fgColor-default,var(--color-fg-default))}[data-variant=spacious] .prc-Breadcrumbs-Item-7BKO-{border-radius:var(--borderRadius-medium,.375rem);color:var(--fgColor-default,var(--color-fg-default));padding-block:var(--base-size-4,.25rem);padding-inline:var(--base-size-6,.375rem);-webkit-text-decoration:none;text-decoration:none}:is([data-variant=spacious] .prc-Breadcrumbs-Item-7BKO-):hover{background:var(--control-transparent-bgColor-hover,var(--color-action-list-item-default-hover-bg));-webkit-text-decoration:none;text-decoration:none}[aria-current]:is([data-variant=spacious] .prc-Breadcrumbs-Item-7BKO-){font-weight:var(--base-text-weight-semibold,600)}.prc-Breadcrumbs-BreadcrumbsItem-FHLFr{align-items:center;display:inline-grid;flex:0 99999 auto;grid-auto-flow:column;list-style:none;min-width:auto;white-space:nowrap}.prc-Breadcrumbs-BreadcrumbsItem-FHLFr:has(.prc-Breadcrumbs-MenuOverlay-aCOyl){white-space:normal}.prc-Breadcrumbs-BreadcrumbsItem-FHLFr:first-child{margin-left:0}.prc-Breadcrumbs-BreadcrumbsItem-FHLFr:last-child .prc-Breadcrumbs-ItemSeparator-nYObp{display:none}.prc-Breadcrumbs-BreadcrumbsItem-FHLFr .prc-Breadcrumbs-MenuDetails-TXUai{display:inline-block;position:relative}:is(.prc-Breadcrumbs-BreadcrumbsItem-FHLFr .prc-Breadcrumbs-MenuDetails-TXUai) summary{cursor:pointer;list-style:none}:is(:is(.prc-Breadcrumbs-BreadcrumbsItem-FHLFr .prc-Breadcrumbs-MenuDetails-TXUai) summary)::-webkit-details-marker{display:none}.prc-Breadcrumbs-BreadcrumbsItem-FHLFr .prc-Breadcrumbs-MenuOverlay-aCOyl{background-color:var(--overlay-bgColor,var(--color-canvas-overlay));border-radius:var(--borderRadius-large,.75rem);box-shadow:var(--shadow-floating-small,var(--color-overlay-shadow));max-height:100vh;max-width:var(--overlay-width-small,20rem);min-width:var(--overlay-width-xsmall,12rem);overflow:hidden;position:absolute;top:calc(var(--overlay-offset,.25rem) + var(--control-small-size,1.75rem));z-index:1}@media (prefers-reduced-motion:no-preference){.prc-Breadcrumbs-BreadcrumbsItem-FHLFr .prc-Breadcrumbs-MenuOverlay-aCOyl{animation:prc-Breadcrumbs-overlay-appear-Ct2Xv .2s cubic-bezier(.33,1,.68,1)}}
|
|
2
|
+
/*# sourceMappingURL=Breadcrumbs-dbfc9d95.css.map */
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/Breadcrumbs/Breadcrumbs.module.css","../../postcss-preset-primer/src/mixins/focusOutline.css"],"names":[],"mappings":"AAAA,uCACE,YAAa,CACb,6BAA8B,CAC9B,UACF,CAEA,uCAGE,eAAgB,CADhB,YAAa,CADb,cAGF,CAIE,gGAEE,YAAa,CACb,kBAAmB,CAFnB,kBAGF,CAGF,qCAGE,iBAAkB,CAFlB,gDAA2B,CAC3B,YAAa,CAEb,sBAAuB,CAEvB,wBAAiB,CAAjB,gBAAiB,CADjB,kBAEF,CAEA,mCAGE,eAuBF,CArBE,4EAJA,oBAAqB,CACrB,8CAaA,CAVA,yCAQE,kEAA8C,CAF9C,UAAW,CAJX,WAAa,CAEb,aAAe,CAKf,2CACF,CAEA,+CACE,aACF,CAGE,oDACE,YACF,CAIJ,4BACE,oBAAqB,CACrB,8CAOF,CALE,0CACE,gDAAwC,CC5D1C,eAAgB,CAFhB,kEAAgC,CAChC,kBDgEA,CAIA,kDACE,gDAA0B,CAC1B,4BAAqB,CAArB,oBAeF,CAZI,iFACE,iCAA0B,CAA1B,yBACF,CAGF,qEACE,4BAAqB,CAArB,oBACF,CAEA,qEACE,oDACF,CAKF,oDAKE,gDAAyC,CAJzC,oDAA6B,CAG7B,uCAAiC,CADjC,yCAAkC,CADlC,4BAAqB,CAArB,oBAaF,CARE,+DACE,kGAAoD,CACpD,4BAAqB,CAArB,oBACF,CAEA,uEACE,gDACF,CAIJ,uCAGE,kBAAmB,CAFnB,mBAAoB,CAGpB,iBAAkB,CAFlB,qBAAsB,CAKtB,eAAgB,CAFhB,cAAe,CACf,kBAiDF,CA7CE,+EACE,kBACF,CAEA,mDACE,aACF,CAGE,uFACE,YACF,CAGF,0EAEE,oBAAqB,CADrB,iBAWF,CARE,uFAEE,cAAe,CADf,eAMF,CAHE,oHACE,YACF,CAIJ,0EAKE,mEAAwC,CADxC,8CAAwC,CADxC,mEAAwC,CAIxC,gBAAiB,CACjB,0CAAqC,CAFrC,2CAAsC,CAGtC,eAAgB,CARhB,iBAAkB,CAUlB,0EAA4D,CAT5D,SAcF,CAHE,8CAbF,0EAcI,4EAEJ,CADE","file":"Breadcrumbs-dbfc9d95.css","sourcesContent":[".BreadcrumbsBase {\n display: flex;\n justify-content: space-between;\n width: 100%;\n}\n\n.BreadcrumbsList {\n padding-left: 0;\n margin-top: 0;\n margin-bottom: 0;\n}\n\n[data-overflow='menu'],\n[data-overflow='menu-with-root'] {\n & .BreadcrumbsList {\n white-space: nowrap;\n display: flex;\n flex-direction: row;\n }\n}\n\n.ItemSeparator {\n color: var(--fgColor-muted);\n display: flex;\n align-self: center;\n justify-content: center;\n white-space: nowrap;\n user-select: none;\n}\n\n.ItemWrapper {\n display: inline-block;\n font-size: var(--text-body-size-medium);\n list-style: none;\n\n &::after {\n display: inline-block;\n height: 0.8em;\n /* stylelint-disable-next-line primer/spacing */\n margin: 0 0.5em;\n font-size: var(--text-body-size-medium);\n content: '';\n /* stylelint-disable-next-line primer/borders, primer/colors */\n border-right: 0.1em solid var(--fgColor-muted);\n transform: rotate(15deg) translateY(0.0625em);\n }\n\n &:first-child {\n margin-left: 0;\n }\n\n &:last-child {\n &::after {\n content: none;\n }\n }\n}\n\n.Item {\n display: inline-block;\n font-size: var(--text-body-size-medium);\n\n &:focus-visible {\n border-radius: var(--borderRadius-small);\n\n @mixin focusOutline 2px;\n }\n}\n\n[data-variant='normal'] {\n & .Item {\n color: var(--fgColor-link);\n text-decoration: none;\n\n &:not([aria-current]) {\n &:hover {\n text-decoration: underline;\n }\n }\n\n &:focus-visible {\n text-decoration: none;\n }\n\n &[aria-current] {\n color: var(--fgColor-default);\n }\n }\n}\n\n[data-variant='spacious'] {\n & .Item {\n color: var(--fgColor-default);\n text-decoration: none;\n padding-inline: var(--base-size-6);\n padding-block: var(--base-size-4);\n border-radius: var(--borderRadius-medium);\n\n &:hover {\n background: var(--control-transparent-bgColor-hover);\n text-decoration: none;\n }\n\n &[aria-current] {\n font-weight: var(--base-text-weight-semibold);\n }\n }\n}\n\n.BreadcrumbsItem {\n display: inline-grid;\n grid-auto-flow: column;\n align-items: center;\n flex: 0 99999 auto;\n min-width: auto;\n white-space: nowrap;\n list-style: none;\n\n /* allow menu items to wrap line */\n &:has(.MenuOverlay) {\n white-space: normal;\n }\n\n &:first-child {\n margin-left: 0;\n }\n\n &:last-child {\n .ItemSeparator {\n display: none;\n }\n }\n\n .MenuDetails {\n position: relative;\n display: inline-block;\n\n & summary {\n list-style: none;\n cursor: pointer;\n\n &::-webkit-details-marker {\n display: none;\n }\n }\n }\n\n .MenuOverlay {\n position: absolute;\n z-index: 1;\n box-shadow: var(--shadow-floating-small);\n border-radius: var(--borderRadius-large);\n background-color: var(--overlay-bgColor);\n min-width: var(--overlay-width-xsmall);\n max-height: 100vh;\n max-width: var(--overlay-width-small);\n overflow: hidden;\n /* stylelint-disable-next-line primer/spacing */\n top: calc(var(--overlay-offset) + var(--control-small-size));\n\n @media (prefers-reduced-motion: no-preference) {\n animation: overlay-appear 200ms cubic-bezier(0.33, 1, 0.68, 1);\n }\n }\n}\n","@define-mixin focusOutline $outlineOffset: -2px, $outlineColor: var(--focus-outlineColor) {\n outline: 2px solid $outlineColor;\n outline-offset: $outlineOffset;\n box-shadow: none;\n}\n"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import './Breadcrumbs-
|
|
1
|
+
import './Breadcrumbs-dbfc9d95.css';
|
|
2
2
|
|
|
3
3
|
var classes = {"BreadcrumbsBase":"prc-Breadcrumbs-BreadcrumbsBase-6gqOz","BreadcrumbsList":"prc-Breadcrumbs-BreadcrumbsList-K7eeK","ItemSeparator":"prc-Breadcrumbs-ItemSeparator-nYObp","ItemWrapper":"prc-Breadcrumbs-ItemWrapper-Mfwuj","Item":"prc-Breadcrumbs-Item-7BKO-","BreadcrumbsItem":"prc-Breadcrumbs-BreadcrumbsItem-FHLFr","MenuOverlay":"prc-Breadcrumbs-MenuOverlay-aCOyl","MenuDetails":"prc-Breadcrumbs-MenuDetails-TXUai"};
|
|
4
4
|
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
.prc-Button-ButtonBase-c50BI{align-items:center;appearance:none;background-color:transparent;border:var(--borderWidth-thin,.0625rem) solid;border-color:var(--button-default-borderColor-rest,var(--color-btn-border));border-radius:var(--borderRadius-medium,.375rem);color:var(--button-default-fgColor-rest,var(--color-btn-text));cursor:pointer;display:flex;font-family:inherit;font-size:var(--text-body-size-medium,.875rem);font-weight:var(--base-text-weight-medium,500);gap:var(--base-size-8,.5rem);height:var(--control-medium-size,2rem);justify-content:space-between;min-width:max-content;padding:0 var(--control-medium-paddingInline-normal,.75rem);text-align:center;-webkit-text-decoration:none;text-decoration:none;transition:80ms cubic-bezier(.65,0,.35,1);transition-property:color,fill,background-color,border-color;-webkit-user-select:none;user-select:none}.prc-Button-ButtonBase-c50BI:hover{transition-duration:80ms}.prc-Button-ButtonBase-c50BI:focus-visible{box-shadow:none;outline:2px solid var(--focus-outlineColor,var(--color-accent-fg));outline-offset:-2px}.prc-Button-ButtonBase-c50BI:active{transition:none}.prc-Button-ButtonBase-c50BI:disabled,.prc-Button-ButtonBase-c50BI[aria-disabled=true]:not([data-loading=true]){box-shadow:none;cursor:not-allowed}:is(.prc-Button-ButtonBase-c50BI:disabled,.prc-Button-ButtonBase-c50BI[aria-disabled=true]:not([data-loading=true])) .prc-Button-CounterLabel-f5-4u,:is(.prc-Button-ButtonBase-c50BI:disabled,.prc-Button-ButtonBase-c50BI[aria-disabled=true]:not([data-loading=true])) .prc-Button-Visual-2epfX{color:inherit}@media (forced-colors:active){.prc-Button-ButtonBase-c50BI:focus{outline:1px solid transparent}}.prc-Button-ButtonBase-c50BI :where(.prc-Button-Visual-2epfX){color:var(--fgColor-muted,var(--color-fg-muted));display:flex;pointer-events:none}.prc-Button-ButtonBase-c50BI :where(.prc-Button-VisualWrap-Db-eB){display:flex;pointer-events:none}.prc-Button-ButtonBase-c50BI:where(.prc-Button-IconButton-szpyj){display:inline-grid;flex-shrink:0;min-width:unset;padding:unset;place-content:center;width:var(--control-medium-size,2rem)}.prc-Button-ButtonBase-c50BI:where(.prc-Button-IconButton-szpyj):where([data-size=small]){width:var(--control-small-size,1.75rem)}.prc-Button-ButtonBase-c50BI:where(.prc-Button-IconButton-szpyj):where([data-size=large]){width:var(--control-large-size,2.5rem)}.prc-Button-ButtonBase-c50BI:where([href]){display:inline-flex}.prc-Button-ButtonBase-c50BI:where([href]):hover{-webkit-text-decoration:none;text-decoration:none}.prc-Button-ButtonBase-c50BI :where(.prc-Button-ButtonContent-HKbr-){align-content:center;align-items:center;display:grid;flex:1 0 auto;grid-template-areas:"leadingVisual text trailingVisual";grid-template-columns:min-content minmax(0,auto) min-content}:is(.prc-Button-ButtonBase-c50BI :where(.prc-Button-ButtonContent-HKbr-))>:not(:last-child){margin-right:var(--base-size-8,.5rem)}:is(.prc-Button-ButtonBase-c50BI :where(.prc-Button-ButtonContent-HKbr-)):where([data-align=center]){justify-content:center}:is(.prc-Button-ButtonBase-c50BI :where(.prc-Button-ButtonContent-HKbr-)):where([data-align=start]){justify-content:flex-start}.prc-Button-ButtonBase-c50BI :where([data-component=leadingVisual]){grid-area:leadingVisual}.prc-Button-ButtonBase-c50BI :where(.prc-Button-Label-pTQ3x){grid-area:text;line-height:var(--text-body-lineHeight-medium,1.4285);white-space:nowrap}.prc-Button-ButtonBase-c50BI :where([data-component=trailingVisual]){grid-area:trailingVisual}.prc-Button-ButtonBase-c50BI :where([data-component=trailingAction]){margin-right:calc(var(--base-size-4,.25rem)*-1)}.prc-Button-ButtonBase-c50BI:where([data-size=small]){font-size:var(--text-body-size-small,.75rem);gap:var(--control-small-gap,.25rem);height:var(--control-small-size,1.75rem);padding:0 var(--control-small-paddingInline-condensed,.5rem)}.prc-Button-ButtonBase-c50BI:where([data-size=small]) .prc-Button-ButtonContent-HKbr->:not(:last-child){margin-right:var(--control-small-gap,.25rem)}.prc-Button-ButtonBase-c50BI:where([data-size=small]) .prc-Button-Label-pTQ3x{line-height:var(--text-body-lineHeight-small,1.6666)}.prc-Button-ButtonBase-c50BI:where([data-size=large]){gap:var(--control-large-gap,.5rem);height:var(--control-large-size,2.5rem);padding:0 var(--control-large-paddingInline-spacious,1rem)}.prc-Button-ButtonBase-c50BI:where([data-size=large]) .prc-Button-ButtonContent-HKbr->:not(:last-child){margin-right:var(--control-large-gap,.5rem)}.prc-Button-ButtonBase-c50BI:where([data-block=block]){width:100%}.prc-Button-ButtonBase-c50BI:where([data-label-wrap=true]){height:unset;min-height:var(--control-medium-size,2rem);min-width:-moz-fit-content;min-width:fit-content}.prc-Button-ButtonBase-c50BI:where([data-label-wrap=true]) .prc-Button-ButtonContent-HKbr-{align-self:stretch;flex:1 1 auto;padding-block:calc(var(--control-medium-paddingBlock,.375rem) - var(--base-size-2,.125rem))}.prc-Button-ButtonBase-c50BI:where([data-label-wrap=true]) .prc-Button-Label-pTQ3x{white-space:unset;word-break:break-word}.prc-Button-ButtonBase-c50BI:where([data-label-wrap=true]):where([data-size=small]){height:unset;min-height:var(--control-small-size,1.75rem)}.prc-Button-ButtonBase-c50BI:where([data-label-wrap=true]):where([data-size=small]) .prc-Button-ButtonContent-HKbr-{padding-block:calc(var(--control-small-paddingBlock,.25rem) - var(--base-size-2,.125rem))}.prc-Button-ButtonBase-c50BI:where([data-label-wrap=true]):where([data-size=large]){height:unset;min-height:var(--control-large-size,2.5rem);padding-inline:var(--control-large-paddingInline-spacious,1rem)}.prc-Button-ButtonBase-c50BI:where([data-label-wrap=true]):where([data-size=large]) .prc-Button-ButtonContent-HKbr-{padding-block:calc(var(--control-large-paddingBlock,.625rem) - var(--base-size-2,.125rem))}.prc-Button-ButtonBase-c50BI:where([data-loading=true]) .prc-Button-LoadingSpinner-hLV6o:not([data-component=leadingVisual],[data-component=trailingVisual],[data-component=trailingAction]){grid-area:text;margin-right:0!important;place-self:center}:is(.prc-Button-ButtonBase-c50BI:where([data-loading=true]) .prc-Button-LoadingSpinner-hLV6o:not([data-component=leadingVisual],[data-component=trailingVisual],[data-component=trailingAction]))+.prc-Button-Label-pTQ3x{visibility:hidden}.prc-Button-ButtonBase-c50BI .prc-Button-LoadingSpinner-hLV6o{align-items:center;display:flex;justify-content:center}.prc-Button-ButtonBase-c50BI:where([data-variant=default]){background-color:var(--button-default-bgColor-rest,var(--color-btn-bg));box-shadow:var(--button-default-shadow-resting,var(--color-btn-shadow));color:var(--button-default-fgColor-rest,var(--color-btn-text))}.prc-Button-ButtonBase-c50BI[aria-expanded=true]:where([data-variant=default]){background-color:var(--button-default-bgColor-active,var(--color-btn-active-bg));border-color:var(--button-default-borderColor-active,var(--color-btn-active-border))}.prc-Button-ButtonBase-c50BI:where([data-variant=default]):hover{background-color:var(--button-default-bgColor-hover,var(--color-btn-hover-bg));border-color:var(--button-default-borderColor-hover,var(--color-btn-hover-border))}.prc-Button-ButtonBase-c50BI:where([data-variant=default]):active{background-color:var(--button-default-bgColor-active,var(--color-btn-active-bg));border-color:var(--button-default-borderColor-active,var(--color-btn-active-border))}.prc-Button-ButtonBase-c50BI:where([data-variant=default]):disabled,.prc-Button-ButtonBase-c50BI[aria-disabled=true]:where([data-variant=default]):not([data-loading=true]){background-color:var(--button-default-bgColor-disabled,var(--color-btn-bg));border-color:var(--button-default-borderColor-disabled,var(--color-btn-border));box-shadow:none;color:var(--control-fgColor-disabled,var(--color-primer-fg-disabled))}.prc-Button-ButtonBase-c50BI:where([data-variant=default]) .prc-Button-CounterLabel-f5-4u{background-color:var(--buttonCounter-default-bgColor-rest,var(--color-btn-counter-bg))!important}.prc-Button-ButtonBase-c50BI:where([data-variant=default]):where(.prc-Button-IconButton-szpyj){color:var(--fgColor-muted,var(--color-fg-muted))}.prc-Button-ButtonBase-c50BI:where([data-variant=primary]){background-color:var(--button-primary-bgColor-rest,var(--color-btn-primary-bg));border-color:var(--button-primary-borderColor-rest,var(--color-btn-primary-border));box-shadow:var(--shadow-resting-small,var(--color-shadow-small));color:var(--button-primary-fgColor-rest,var(--color-btn-primary-text))}.prc-Button-ButtonBase-c50BI[aria-expanded=true]:where([data-variant=primary]){background-color:var(--button-primary-bgColor-active,var(--color-btn-primary-selected-bg));box-shadow:var(--button-primary-shadow-selected,var(--color-btn-primary-selected-shadow))}.prc-Button-ButtonBase-c50BI:where([data-variant=primary]):hover{background-color:var(--button-primary-bgColor-hover,var(--color-btn-primary-hover-bg));border-color:var(--button-primary-borderColor-hover,var(--color-btn-primary-hover-border))}.prc-Button-ButtonBase-c50BI:where([data-variant=primary]):focus-visible{box-shadow:inset 0 0 0 3px var(--fgColor-onEmphasis,var(--color-fg-on-emphasis));outline:2px solid var(--focus-outlineColor,var(--color-accent-fg));outline-offset:-2px}.prc-Button-ButtonBase-c50BI:where([data-variant=primary]):active{background-color:var(--button-primary-bgColor-active,var(--color-btn-primary-selected-bg));box-shadow:var(--button-primary-shadow-selected,var(--color-btn-primary-selected-shadow))}.prc-Button-ButtonBase-c50BI:where([data-variant=primary]):disabled,.prc-Button-ButtonBase-c50BI[aria-disabled=true]:where([data-variant=primary]):not([data-loading=true]){background-color:var(--button-primary-bgColor-disabled,var(--color-btn-primary-disabled-bg));border-color:var(--button-primary-borderColor-disabled,var(--color-btn-primary-disabled-border));box-shadow:none;color:var(--button-primary-fgColor-disabled,var(--color-btn-primary-disabled-text))}.prc-Button-ButtonBase-c50BI:where([data-variant=primary]) .prc-Button-CounterLabel-f5-4u{background-color:var(--buttonCounter-primary-bgColor-rest,var(--color-btn-primary-counter-bg))!important;color:var(--button-primary-fgColor-rest,var(--color-btn-primary-text))!important}.prc-Button-ButtonBase-c50BI:where([data-variant=primary]) .prc-Button-Visual-2epfX{color:var(--button-primary-fgColor-rest,var(--color-btn-primary-text))}.prc-Button-ButtonBase-c50BI:where([data-variant=danger]){background-color:var(--button-danger-bgColor-rest,var(--color-btn-bg));box-shadow:var(--button-default-shadow-resting,var(--color-btn-shadow));color:var(--button-danger-fgColor-rest,var(--color-btn-danger-text))}.prc-Button-ButtonBase-c50BI[aria-expanded=true]:where([data-variant=danger]){background-color:var(--button-danger-bgColor-active,var(--color-btn-danger-selected-bg));border-color:var(--button-danger-borderColor-active,var(--color-btn-danger-selected-border));box-shadow:var(--button-danger-shadow-selected,var(--color-btn-danger-selected-shadow));color:var(--button-danger-fgColor-active,var(--color-btn-danger-selected-text))}.prc-Button-ButtonBase-c50BI[aria-expanded=true]:where([data-variant=danger]) .prc-Button-Visual-2epfX{color:var(--button-danger-iconColor-hover,var(--color-btn-danger-hover-icon))}.prc-Button-ButtonBase-c50BI:where([data-variant=danger]):hover{background-color:var(--button-danger-bgColor-hover,var(--color-btn-danger-hover-bg));border-color:var(--button-danger-borderColor-hover,var(--color-btn-danger-hover-border));box-shadow:var(--shadow-resting-small,var(--color-shadow-small));color:var(--button-danger-fgColor-hover,var(--color-btn-danger-hover-text))}.prc-Button-ButtonBase-c50BI:where([data-variant=danger]):hover .prc-Button-CounterLabel-f5-4u{background-color:var(--buttonCounter-danger-bgColor-hover,var(--color-btn-danger-hover-counter-bg))!important;color:var(--buttonCounter-danger-fgColor-hover,var(--color-btn-danger-hover-counter-fg))!important}.prc-Button-ButtonBase-c50BI:where([data-variant=danger]):hover .prc-Button-Visual-2epfX{color:var(--button-danger-iconColor-hover,var(--color-btn-danger-hover-icon))}.prc-Button-ButtonBase-c50BI:where([data-variant=danger]):active{background-color:var(--button-danger-bgColor-active,var(--color-btn-danger-selected-bg));border-color:var(--button-danger-borderColor-active,var(--color-btn-danger-selected-border));box-shadow:var(--button-danger-shadow-selected,var(--color-btn-danger-selected-shadow));color:var(--button-danger-fgColor-active,var(--color-btn-danger-selected-text))}.prc-Button-ButtonBase-c50BI:where([data-variant=danger]):active .prc-Button-CounterLabel-f5-4u{background-color:var(--buttonCounter-danger-bgColor-hover,var(--color-btn-danger-hover-counter-bg))!important;color:var(--buttonCounter-danger-fgColor-hover,var(--color-btn-danger-hover-counter-fg))!important}.prc-Button-ButtonBase-c50BI:where([data-variant=danger]):active .prc-Button-Visual-2epfX{color:var(--button-danger-iconColor-hover,var(--color-btn-danger-hover-icon))}.prc-Button-ButtonBase-c50BI:where([data-variant=danger]):disabled,.prc-Button-ButtonBase-c50BI[aria-disabled=true]:where([data-variant=danger]):not([data-loading=true]){background-color:var(--button-danger-bgColor-disabled,var(--color-btn-danger-disabled-bg));border-color:var(--button-default-borderColor-disabled,var(--color-btn-border));box-shadow:none;color:var(--button-danger-fgColor-disabled,var(--color-btn-danger-disabled-text))}:is(.prc-Button-ButtonBase-c50BI:where([data-variant=danger]):disabled,.prc-Button-ButtonBase-c50BI[aria-disabled=true]:where([data-variant=danger]):not([data-loading=true])) .prc-Button-CounterLabel-f5-4u{background-color:var(--buttonCounter-danger-bgColor-disabled,var(--color-btn-danger-disabled-counter-bg))!important;color:var(--buttonCounter-danger-fgColor-disabled,var(--color-btn-danger-disabled-counter-fg))!important}.prc-Button-ButtonBase-c50BI:where([data-variant=danger]) .prc-Button-CounterLabel-f5-4u{background-color:var(--buttonCounter-danger-bgColor-rest,var(--color-btn-danger-counter-bg))!important;color:var(--buttonCounter-danger-fgColor-rest,var(--color-btn-danger-counter-fg))!important}.prc-Button-ButtonBase-c50BI:where([data-variant=danger]) .prc-Button-Visual-2epfX{color:var(--button-danger-iconColor-rest,var(--color-btn-danger-icon))}.prc-Button-ButtonBase-c50BI:where([data-variant=invisible]){border-color:transparent;box-shadow:none;color:var(--button-default-fgColor-rest,var(--color-btn-text))}.prc-Button-ButtonBase-c50BI[aria-expanded=true]:where([data-variant=invisible]){background-color:var(--button-invisible-bgColor-active,var(--color-action-list-item-default-active-bg))}.prc-Button-ButtonBase-c50BI:where([data-variant=invisible]):hover{background-color:var(--button-invisible-bgColor-hover,var(--color-action-list-item-default-hover-bg))}.prc-Button-ButtonBase-c50BI:where([data-variant=invisible]):hover .prc-Button-Visual-2epfX{color:var(--button-invisible-iconColor-hover,#59636e)}.prc-Button-ButtonBase-c50BI:where([data-variant=invisible]):active{background-color:var(--button-invisible-bgColor-active,var(--color-action-list-item-default-active-bg))}.prc-Button-ButtonBase-c50BI:where([data-variant=invisible]):active .prc-Button-Visual-2epfX{color:var(--button-invisible-iconColor-hover,#59636e)}.prc-Button-ButtonBase-c50BI:where([data-variant=invisible]):disabled,.prc-Button-ButtonBase-c50BI[aria-disabled=true]:where([data-variant=invisible]):not([data-loading=true]){background-color:var(--button-invisible-bgColor-disabled,var(--color-action-list-item-default-selected-bg));border-color:var(--button-invisible-borderColor-disabled,var(--color-action-list-item-default-selected-bg));box-shadow:none;color:var(--button-invisible-fgColor-disabled,var(--color-primer-fg-disabled))}.prc-Button-ButtonBase-c50BI:where([data-variant=invisible]) .prc-Button-Visual-2epfX{color:var(--button-invisible-iconColor-rest,#59636e)}.prc-Button-ButtonBase-c50BI:where([data-variant=invisible]) .prc-Button-CounterLabel-f5-4u{background-color:var(--buttonCounter-invisible-bgColor-rest,#818b981f)!important}.prc-Button-ButtonBase-c50BI:where([data-variant=invisible]):where(.prc-Button-IconButton-szpyj){color:var(--button-invisible-iconColor-rest,#59636e)}.prc-Button-ButtonBase-c50BI:where([data-variant=link]){border:unset;color:var(--fgColor-link,var(--color-accent-fg));display:inline-flex;font-size:inherit;height:unset;min-width:-moz-fit-content;min-width:fit-content;padding:0;text-align:left}.prc-Button-ButtonBase-c50BI:where([data-variant=link]):hover:not(:disabled,[data-inactive]){-webkit-text-decoration:underline;text-decoration:underline}.prc-Button-ButtonBase-c50BI:where([data-variant=link]):focus,.prc-Button-ButtonBase-c50BI:where([data-variant=link]):focus-visible{outline-offset:2px}.prc-Button-ButtonBase-c50BI:where([data-variant=link]):disabled,.prc-Button-ButtonBase-c50BI[aria-disabled=true]:where([data-variant=link]):not([data-loading=true]){background-color:transparent;border-color:transparent;color:var(--control-fgColor-disabled,var(--color-primer-fg-disabled))}.prc-Button-ButtonBase-c50BI:where([data-variant=link]) .prc-Button-Label-pTQ3x{white-space:unset}.prc-Button-ButtonBase-c50BI:where([data-variant=link]):where([data-inactive]){background:transparent!important;color:var(--button-inactive-fgColor,#59636e)}.prc-Button-ButtonBase-c50BI:where([data-variant=link]) .prc-Button-Visual-2epfX{color:var(--fgColor-link,var(--color-accent-fg))}.prc-Button-ButtonBase-c50BI:where([data-inactive]),.prc-Button-ButtonBase-c50BI:where([data-inactive]):active,.prc-Button-ButtonBase-c50BI:where([data-inactive]):hover{background-color:var(--button-inactive-bgColor,#e6eaef);border-color:var(--button-inactive-bgColor,#e6eaef);box-shadow:none;color:var(--button-inactive-fgColor,#59636e);cursor:auto}:is(.prc-Button-ButtonBase-c50BI:where([data-inactive]),.prc-Button-ButtonBase-c50BI:where([data-inactive]):hover,.prc-Button-ButtonBase-c50BI:where([data-inactive]):active) .prc-Button-CounterLabel-f5-4u,:is(.prc-Button-ButtonBase-c50BI:where([data-inactive]),.prc-Button-ButtonBase-c50BI:where([data-inactive]):hover,.prc-Button-ButtonBase-c50BI:where([data-inactive]):active) .prc-Button-Visual-2epfX{color:inherit!important}.prc-Button-ButtonBase-c50BI:where([data-has-count]):has([data-component=leadingVisual]):not(:has([data-component=text])){padding-inline:var(--control-medium-paddingInline-condensed,.5rem)}.prc-Button-ButtonBase-c50BI:where([data-has-count]):has([data-component=leadingVisual]):not(:has([data-component=text])):where([data-size=small]){padding-inline:var(--control-xsmall-paddingInline-condensed,.25rem)}.prc-Button-ButtonBase-c50BI:where([data-has-count]):has([data-component=leadingVisual]):not(:has([data-component=text])):where([data-size=large]){padding-inline:var(--control-large-paddingInline-normal,.75rem)}.prc-Button-ConditionalWrapper-WLT4Z{display:block}
|
|
2
|
+
/*# sourceMappingURL=ButtonBase-643c673a.css.map */
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/Button/ButtonBase.module.css","../../postcss-preset-primer/src/mixins/focusOutline.css","../../postcss-preset-primer/src/mixins/focusOutlineOnEmphasis.css"],"names":[],"mappings":"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","file":"ButtonBase-643c673a.css","sourcesContent":["/* Base styles */\n.ButtonBase {\n display: flex;\n min-width: max-content;\n height: var(--control-medium-size);\n /* stylelint-disable-next-line primer/spacing */\n padding: 0 var(--control-medium-paddingInline-normal);\n font-family: inherit;\n font-size: var(--text-body-size-medium);\n font-weight: var(--base-text-weight-medium);\n color: var(--button-default-fgColor-rest);\n text-align: center;\n text-decoration: none;\n cursor: pointer;\n user-select: none;\n background-color: transparent;\n border: var(--borderWidth-thin) solid;\n border-color: var(--button-default-borderColor-rest);\n border-radius: var(--borderRadius-medium);\n transition: 80ms cubic-bezier(0.65, 0, 0.35, 1);\n transition-property: color, fill, background-color, border-color;\n appearance: none;\n align-items: center;\n justify-content: space-between;\n gap: var(--base-size-8);\n\n &:hover {\n transition-duration: 80ms;\n }\n\n &:focus-visible {\n @mixin focusOutline;\n }\n\n &:active {\n transition: none;\n }\n\n &:disabled,\n &[aria-disabled='true']:not([data-loading='true']) {\n cursor: not-allowed;\n box-shadow: none;\n\n & .Visual,\n & .CounterLabel {\n color: inherit;\n }\n }\n\n @media (forced-colors: active) {\n &:focus {\n outline: solid 1px transparent;\n }\n }\n\n /* Visuals */\n & :where(.Visual) {\n display: flex;\n color: var(--fgColor-muted);\n pointer-events: none;\n }\n\n /* mostly for CounterLabel */\n & :where(.VisualWrap) {\n display: flex;\n pointer-events: none;\n }\n\n /* IconButton */\n\n &:where(.IconButton) {\n display: inline-grid;\n width: var(--control-medium-size);\n min-width: unset;\n /* stylelint-disable-next-line primer/spacing */\n padding: unset;\n place-content: center;\n flex-shrink: 0;\n\n &:where([data-size='small']) {\n width: var(--control-small-size);\n }\n\n &:where([data-size='large']) {\n width: var(--control-large-size);\n }\n }\n\n /* LinkButton */\n\n &:where([href]) {\n display: inline-flex;\n\n &:hover {\n text-decoration: none;\n }\n }\n\n /* Button layout */\n\n & :where(.ButtonContent) {\n flex: 1 0 auto;\n display: grid;\n grid-template-areas: 'leadingVisual text trailingVisual';\n grid-template-columns: min-content minmax(0, auto) min-content;\n align-items: center;\n align-content: center;\n\n & > :not(:last-child) {\n margin-right: var(--base-size-8);\n }\n\n /* Content alignment */\n\n &:where([data-align='center']) {\n justify-content: center;\n }\n\n &:where([data-align='start']) {\n justify-content: flex-start;\n }\n }\n\n & :where([data-component='leadingVisual']) {\n grid-area: leadingVisual;\n }\n\n & :where(.Label) {\n line-height: var(--text-body-lineHeight-medium);\n white-space: nowrap;\n grid-area: text;\n }\n\n & :where([data-component='trailingVisual']) {\n grid-area: trailingVisual;\n }\n\n & :where([data-component='trailingAction']) {\n margin-right: calc(var(--base-size-4) * -1);\n }\n\n /* Size */\n\n &:where([data-size='small']) {\n height: var(--control-small-size);\n /* stylelint-disable-next-line primer/spacing */\n padding: 0 var(--control-small-paddingInline-condensed);\n gap: var(--control-small-gap);\n font-size: var(--text-body-size-small);\n\n & .ButtonContent > :not(:last-child) {\n /* stylelint-disable-next-line primer/spacing */\n margin-right: var(--control-small-gap);\n }\n\n & .Label {\n line-height: var(--text-body-lineHeight-small);\n }\n }\n\n &:where([data-size='large']) {\n height: var(--control-large-size);\n /* stylelint-disable-next-line primer/spacing */\n padding: 0 var(--control-large-paddingInline-spacious);\n gap: var(--control-large-gap);\n\n & .ButtonContent > :not(:last-child) {\n /* stylelint-disable-next-line primer/spacing */\n margin-right: var(--control-large-gap);\n }\n }\n\n /* Full width */\n\n &:where([data-block='block']) {\n width: 100%;\n }\n\n /* Wrap label text */\n\n &:where([data-label-wrap='true']) {\n min-width: fit-content;\n height: unset;\n min-height: var(--control-medium-size);\n\n & .ButtonContent {\n flex: 1 1 auto;\n align-self: stretch;\n /* stylelint-disable-next-line primer/spacing */\n padding-block: calc(var(--control-medium-paddingBlock) - var(--base-size-2));\n }\n\n & .Label {\n /* stylelint-disable-next-line declaration-property-value-keyword-no-deprecated */\n word-break: break-word;\n white-space: unset;\n }\n\n &:where([data-size='small']) {\n height: unset;\n min-height: var(--control-small-size);\n\n & .ButtonContent {\n /* stylelint-disable-next-line primer/spacing */\n padding-block: calc(var(--control-small-paddingBlock) - var(--base-size-2));\n }\n }\n\n &:where([data-size='large']) {\n height: unset;\n min-height: var(--control-large-size);\n /* stylelint-disable-next-line primer/spacing */\n padding-inline: var(--control-large-paddingInline-spacious);\n\n & .ButtonContent {\n /* stylelint-disable-next-line primer/spacing */\n padding-block: calc(var(--control-large-paddingBlock) - var(--base-size-2));\n }\n }\n }\n\n /* Loading */\n\n /* only hide label if there's no leading/trailing visuals\n * move spinner to label spot if not leading/trailing visuals\n */\n\n &:where([data-loading='true']) {\n &\n .LoadingSpinner:not(\n [data-component='leadingVisual'],\n [data-component='trailingVisual'],\n [data-component='trailingAction']\n ) {\n grid-area: text;\n margin-right: 0 !important;\n place-self: center;\n\n & + .Label {\n visibility: hidden;\n }\n }\n }\n\n /* Styles for the spinner element displayed when the Button is in a loading state.\n * Ensures the spinner is centered within its container. */\n .LoadingSpinner {\n display: flex;\n align-items: center;\n justify-content: center;\n }\n\n /* Default Variant */\n\n &:where([data-variant='default']) {\n color: var(--button-default-fgColor-rest);\n background-color: var(--button-default-bgColor-rest);\n box-shadow: var(--button-default-shadow-resting);\n\n &[aria-expanded='true'] {\n background-color: var(--button-default-bgColor-active);\n border-color: var(--button-default-borderColor-active);\n }\n\n &:hover {\n background-color: var(--button-default-bgColor-hover);\n border-color: var(--button-default-borderColor-hover);\n }\n\n &:active {\n background-color: var(--button-default-bgColor-active);\n border-color: var(--button-default-borderColor-active);\n }\n\n &:disabled,\n &[aria-disabled='true']:not([data-loading='true']) {\n color: var(--control-fgColor-disabled);\n background-color: var(--button-default-bgColor-disabled);\n border-color: var(--button-default-borderColor-disabled);\n box-shadow: none;\n }\n\n & .CounterLabel {\n background-color: var(--buttonCounter-default-bgColor-rest) !important; /* temporarily override our own sx prop */\n }\n\n &:where(.IconButton) {\n color: var(--fgColor-muted);\n }\n }\n\n /* Primary variant */\n\n &:where([data-variant='primary']) {\n color: var(--button-primary-fgColor-rest);\n background-color: var(--button-primary-bgColor-rest);\n border-color: var(--button-primary-borderColor-rest);\n box-shadow: var(--shadow-resting-small);\n\n &[aria-expanded='true'] {\n background-color: var(--button-primary-bgColor-active);\n box-shadow: var(--button-primary-shadow-selected);\n }\n\n &:hover {\n background-color: var(--button-primary-bgColor-hover);\n border-color: var(--button-primary-borderColor-hover);\n }\n\n &:focus-visible {\n @mixin focusOutlineOnEmphasis;\n }\n\n &:active {\n background-color: var(--button-primary-bgColor-active);\n box-shadow: var(--button-primary-shadow-selected);\n }\n\n &:disabled,\n &[aria-disabled='true']:not([data-loading='true']) {\n color: var(--button-primary-fgColor-disabled);\n background-color: var(--button-primary-bgColor-disabled);\n border-color: var(--button-primary-borderColor-disabled);\n box-shadow: none;\n }\n\n & .CounterLabel {\n color: var(--button-primary-fgColor-rest) !important; /* temporarily override our own sx prop */\n background-color: var(--buttonCounter-primary-bgColor-rest) !important; /* temporarily override our own sx prop */\n }\n\n /* temporarily using the fgColor to match legacy and reduce visual changes- will eventually be iconColor */\n & .Visual {\n color: var(--button-primary-fgColor-rest);\n }\n }\n\n /* Danger variant */\n\n &:where([data-variant='danger']) {\n color: var(--button-danger-fgColor-rest);\n background-color: var(--button-danger-bgColor-rest);\n box-shadow: var(--button-default-shadow-resting);\n\n &[aria-expanded='true'] {\n color: var(--button-danger-fgColor-active);\n background-color: var(--button-danger-bgColor-active);\n border-color: var(--button-danger-borderColor-active);\n box-shadow: var(--button-danger-shadow-selected);\n\n & .Visual {\n color: var(--button-danger-iconColor-hover);\n }\n }\n\n &:hover {\n color: var(--button-danger-fgColor-hover);\n background-color: var(--button-danger-bgColor-hover);\n border-color: var(--button-danger-borderColor-hover);\n box-shadow: var(--shadow-resting-small);\n\n & .CounterLabel {\n color: var(--buttonCounter-danger-fgColor-hover) !important; /* temporarily override our own sx prop */\n background-color: var(--buttonCounter-danger-bgColor-hover) !important;\n }\n\n & .Visual {\n color: var(--button-danger-iconColor-hover);\n }\n }\n\n &:active {\n color: var(--button-danger-fgColor-active);\n background-color: var(--button-danger-bgColor-active);\n border-color: var(--button-danger-borderColor-active);\n box-shadow: var(--button-danger-shadow-selected);\n\n & .CounterLabel {\n color: var(--buttonCounter-danger-fgColor-hover) !important; /* temporarily override our own sx prop */\n background-color: var(--buttonCounter-danger-bgColor-hover) !important;\n }\n\n & .Visual {\n color: var(--button-danger-iconColor-hover);\n }\n }\n\n &:disabled,\n &[aria-disabled='true']:not([data-loading='true']) {\n color: var(--button-danger-fgColor-disabled);\n background-color: var(--button-danger-bgColor-disabled);\n border-color: var(--button-default-borderColor-disabled);\n box-shadow: none;\n\n & .CounterLabel {\n color: var(--buttonCounter-danger-fgColor-disabled) !important; /* temporarily override our own sx prop */\n background-color: var(--buttonCounter-danger-bgColor-disabled) !important;\n }\n }\n\n & .CounterLabel {\n color: var(--buttonCounter-danger-fgColor-rest) !important; /* temporarily override our own sx prop */\n background-color: var(--buttonCounter-danger-bgColor-rest) !important;\n }\n\n & .Visual {\n color: var(--button-danger-iconColor-rest);\n }\n }\n\n /* Invisible variant */\n\n &:where([data-variant='invisible']) {\n color: var(--button-default-fgColor-rest);\n border-color: transparent;\n box-shadow: none;\n\n &[aria-expanded='true'] {\n background-color: var(--button-invisible-bgColor-active);\n }\n\n &:hover {\n background-color: var(--button-invisible-bgColor-hover);\n\n & .Visual {\n color: var(--button-invisible-iconColor-hover);\n }\n }\n\n &:active {\n background-color: var(--button-invisible-bgColor-active);\n\n & .Visual {\n color: var(--button-invisible-iconColor-hover);\n }\n }\n\n &:disabled,\n &[aria-disabled='true']:not([data-loading='true']) {\n color: var(--button-invisible-fgColor-disabled);\n background-color: var(--button-invisible-bgColor-disabled);\n border-color: var(--button-invisible-borderColor-disabled);\n box-shadow: none;\n }\n\n & .Visual {\n color: var(--button-invisible-iconColor-rest);\n }\n\n & .CounterLabel {\n background-color: var(--buttonCounter-invisible-bgColor-rest) !important;\n }\n\n &:where(.IconButton) {\n color: var(--button-invisible-iconColor-rest);\n }\n }\n\n /* Link variant */\n\n &:where([data-variant='link']) {\n display: inline-flex;\n min-width: fit-content;\n height: unset;\n padding: 0;\n font-size: inherit;\n color: var(--fgColor-link);\n text-align: left;\n border: unset;\n\n &:hover:not(:disabled, [data-inactive]) {\n text-decoration: underline;\n }\n\n &:focus-visible,\n &:focus {\n outline-offset: 2px;\n }\n\n &:disabled,\n &[aria-disabled='true']:not([data-loading='true']) {\n color: var(--control-fgColor-disabled);\n background-color: transparent;\n border-color: transparent;\n }\n\n & .Label {\n white-space: unset;\n }\n\n &:where([data-inactive]) {\n color: var(--button-inactive-fgColor);\n background: transparent !important;\n }\n\n & .Visual {\n color: var(--fgColor-link);\n }\n }\n\n /* Inactive */\n\n &:where([data-inactive]),\n &:where([data-inactive]):hover,\n &:where([data-inactive]):active {\n color: var(--button-inactive-fgColor);\n cursor: auto;\n background-color: var(--button-inactive-bgColor);\n /* stylelint-disable-next-line primer/colors */\n border-color: var(--button-inactive-bgColor);\n box-shadow: none;\n\n & .Visual,\n & .CounterLabel {\n color: inherit !important;\n }\n }\n\n /* Icon-only + Counter */\n\n &:where([data-has-count]):has([data-component='leadingVisual']):not(:has([data-component='text'])) {\n /* stylelint-disable-next-line primer/spacing */\n padding-inline: var(--control-medium-paddingInline-condensed);\n\n &:where([data-size='small']) {\n /* stylelint-disable-next-line primer/spacing */\n padding-inline: var(--control-xsmall-paddingInline-condensed);\n }\n\n &:where([data-size='large']) {\n /* stylelint-disable-next-line primer/spacing */\n padding-inline: var(--control-large-paddingInline-normal);\n }\n }\n}\n\n.ConditionalWrapper {\n display: block;\n}\n","@define-mixin focusOutline $outlineOffset: -2px, $outlineColor: var(--focus-outlineColor) {\n outline: 2px solid $outlineColor;\n outline-offset: $outlineOffset;\n box-shadow: none;\n}\n","/* outline with fg box-shadow for buttons */\n@define-mixin focusOutlineOnEmphasis $outlineOffset: -2px, $outlineColor: var(--focus-outlineColor) {\n outline: 2px solid $outlineColor;\n outline-offset: $outlineOffset;\n /* stylelint-disable-next-line primer/box-shadow */\n box-shadow: inset 0 0 0 3px var(--fgColor-onEmphasis);\n}\n"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import './ButtonBase-
|
|
1
|
+
import './ButtonBase-643c673a.css';
|
|
2
2
|
|
|
3
3
|
var classes = {"ButtonBase":"prc-Button-ButtonBase-c50BI","CounterLabel":"prc-Button-CounterLabel-f5-4u","Visual":"prc-Button-Visual-2epfX","VisualWrap":"prc-Button-VisualWrap-Db-eB","IconButton":"prc-Button-IconButton-szpyj","ButtonContent":"prc-Button-ButtonContent-HKbr-","Label":"prc-Button-Label-pTQ3x","LoadingSpinner":"prc-Button-LoadingSpinner-hLV6o","ConditionalWrapper":"prc-Button-ConditionalWrapper-WLT4Z"};
|
|
4
4
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Details.d.ts","sourceRoot":"","sources":["../../src/Details/Details.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,
|
|
1
|
+
{"version":3,"file":"Details.d.ts","sourceRoot":"","sources":["../../src/Details/Details.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAY,KAAK,wBAAwB,EAAoB,MAAM,OAAO,CAAA;AAqCxF,MAAM,MAAM,YAAY,CAAC,EAAE,SAAS,KAAK,CAAC,WAAW,IAAI;IACvD;;OAEG;IACH,EAAE,CAAC,EAAE,EAAE,CAAA;IACP,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC3B,GAAG,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,WAAW,SAAS,EAAE,GAAG,EAAE,GAAG,SAAS,CAAC,CAAA;AAEjF,iBAAS,OAAO,CAAC,EAAE,SAAS,KAAK,CAAC,WAAW,EAAE,EAAC,EAAE,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAC,EAAE,YAAY,CAAC,EAAE,CAAC,qBAOxF;kBAPQ,OAAO;;;AAUhB,OAAO,EAAC,OAAO,EAAC,CAAA;AAEhB,QAAA,MAAM,OAAO;;CAEX,CAAA;AAEF,MAAM,MAAM,YAAY,GAAG,wBAAwB,CAAC,SAAS,CAAC,CAAA;AAC9D,eAAe,OAAO,CAAA"}
|
package/dist/Details/Details.js
CHANGED
|
@@ -1,12 +1,13 @@
|
|
|
1
1
|
import { c } from 'react-compiler-runtime';
|
|
2
|
-
import React, {
|
|
2
|
+
import React, { useEffect } from 'react';
|
|
3
|
+
import { warning } from '../utils/warning.js';
|
|
3
4
|
import { clsx } from 'clsx';
|
|
4
5
|
import classes from './Details.module.css.js';
|
|
5
6
|
import { useMergedRefs } from '../internal/hooks/useMergedRefs.js';
|
|
6
|
-
import { jsx
|
|
7
|
+
import { jsx } from 'react/jsx-runtime';
|
|
7
8
|
|
|
8
9
|
const Root = /*#__PURE__*/React.forwardRef((t0, forwardRef) => {
|
|
9
|
-
const $ = c(
|
|
10
|
+
const $ = c(13);
|
|
10
11
|
let children;
|
|
11
12
|
let className;
|
|
12
13
|
let rest;
|
|
@@ -27,32 +28,21 @@ const Root = /*#__PURE__*/React.forwardRef((t0, forwardRef) => {
|
|
|
27
28
|
}
|
|
28
29
|
const detailsRef = React.useRef(null);
|
|
29
30
|
const ref = useMergedRefs(forwardRef, detailsRef);
|
|
30
|
-
const [hasSummary, setHasSummary] = useState(false);
|
|
31
31
|
let t1;
|
|
32
32
|
let t2;
|
|
33
33
|
if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
|
|
34
34
|
t1 = () => {
|
|
35
|
+
if (!(process.env.NODE_ENV !== "production")) {
|
|
36
|
+
return;
|
|
37
|
+
}
|
|
35
38
|
const {
|
|
36
39
|
current: details
|
|
37
40
|
} = detailsRef;
|
|
38
41
|
if (!details) {
|
|
39
42
|
return;
|
|
40
43
|
}
|
|
41
|
-
const
|
|
42
|
-
|
|
43
|
-
setHasSummary(!!summary);
|
|
44
|
-
};
|
|
45
|
-
updateSummary();
|
|
46
|
-
const observer = new MutationObserver(() => {
|
|
47
|
-
updateSummary();
|
|
48
|
-
});
|
|
49
|
-
observer.observe(details, {
|
|
50
|
-
childList: true,
|
|
51
|
-
subtree: true
|
|
52
|
-
});
|
|
53
|
-
return () => {
|
|
54
|
-
observer.disconnect();
|
|
55
|
-
};
|
|
44
|
+
const summary = details.querySelector("summary:not([data-default-summary])");
|
|
45
|
+
process.env.NODE_ENV !== "production" ? warning(summary === null, "The <Details> component must have a <summary> child component. You can either use <Details.Summary> or a native <summary> element.") : void 0;
|
|
56
46
|
};
|
|
57
47
|
t2 = [];
|
|
58
48
|
$[4] = t1;
|
|
@@ -71,34 +61,22 @@ const Root = /*#__PURE__*/React.forwardRef((t0, forwardRef) => {
|
|
|
71
61
|
t3 = $[7];
|
|
72
62
|
}
|
|
73
63
|
let t4;
|
|
74
|
-
if ($[8] !==
|
|
75
|
-
t4 =
|
|
76
|
-
"data-default-summary": true,
|
|
77
|
-
children: "See Details"
|
|
78
|
-
});
|
|
79
|
-
$[8] = hasSummary;
|
|
80
|
-
$[9] = t4;
|
|
81
|
-
} else {
|
|
82
|
-
t4 = $[9];
|
|
83
|
-
}
|
|
84
|
-
let t5;
|
|
85
|
-
if ($[10] !== children || $[11] !== ref || $[12] !== rest || $[13] !== t3 || $[14] !== t4) {
|
|
86
|
-
t5 = /*#__PURE__*/jsxs("details", {
|
|
64
|
+
if ($[8] !== children || $[9] !== ref || $[10] !== rest || $[11] !== t3) {
|
|
65
|
+
t4 = /*#__PURE__*/jsx("details", {
|
|
87
66
|
className: t3,
|
|
88
67
|
...rest,
|
|
89
68
|
ref: ref,
|
|
90
|
-
children:
|
|
69
|
+
children: children
|
|
91
70
|
});
|
|
92
|
-
$[
|
|
93
|
-
$[
|
|
94
|
-
$[
|
|
95
|
-
$[
|
|
96
|
-
$[
|
|
97
|
-
$[15] = t5;
|
|
71
|
+
$[8] = children;
|
|
72
|
+
$[9] = ref;
|
|
73
|
+
$[10] = rest;
|
|
74
|
+
$[11] = t3;
|
|
75
|
+
$[12] = t4;
|
|
98
76
|
} else {
|
|
99
|
-
|
|
77
|
+
t4 = $[12];
|
|
100
78
|
}
|
|
101
|
-
return
|
|
79
|
+
return t4;
|
|
102
80
|
});
|
|
103
81
|
Root.displayName = 'Details';
|
|
104
82
|
function Summary(t0) {
|
package/dist/index.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { default as theme } from './theme';
|
|
1
|
+
export { default as theme, type ThemeColorPaths, type ThemeShadowPaths } from './theme';
|
|
2
2
|
export { get as themeGet } from './constants';
|
|
3
3
|
export { default as BaseStyles } from './BaseStyles';
|
|
4
4
|
export type { BaseStylesProps } from './BaseStyles';
|
|
@@ -141,8 +141,6 @@ export { Stack } from './Stack';
|
|
|
141
141
|
export type { StackProps, StackItemProps } from './Stack';
|
|
142
142
|
export { PageHeader } from './PageHeader';
|
|
143
143
|
export type { PageHeaderProps, TitleProps as PageHeaderTitleProps, ActionsProps as PageHeaderActionsProps, TitleAreaProps as PageHeaderTitleAreaProps, ChildrenPropTypes as PageHeaderChildrenPropTypes, } from './PageHeader';
|
|
144
|
-
export { default as sx, merge } from './sx';
|
|
145
|
-
export type { BetterCssProperties, BetterSystemStyleObject, SxProp } from './sx';
|
|
146
144
|
export { SkeletonBox } from './Skeleton';
|
|
147
145
|
export type { SkeletonBoxProps } from './Skeleton';
|
|
148
146
|
//# sourceMappingURL=index.d.ts.map
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAEA,OAAO,EAAC,OAAO,IAAI,KAAK,EAAC,MAAM,SAAS,CAAA;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
|
package/dist/index.js
CHANGED
|
@@ -31,7 +31,6 @@ export { default as SideNav } from './SideNav.js';
|
|
|
31
31
|
export { UnderlineNav } from './UnderlineNav/index.js';
|
|
32
32
|
export { default as ActionBar } from './ActionBar/index.js';
|
|
33
33
|
export { Stack } from './Stack/index.js';
|
|
34
|
-
export { default as sx } from './sx.js';
|
|
35
34
|
export { default as Radio } from './Radio/Radio.js';
|
|
36
35
|
export { default as Avatar } from './Avatar/Avatar.js';
|
|
37
36
|
export { default as AvatarStack } from './AvatarStack/AvatarStack.js';
|
|
@@ -79,7 +78,6 @@ export { Tooltip } from './TooltipV2/Tooltip.js';
|
|
|
79
78
|
export { TreeView } from './TreeView/TreeView.js';
|
|
80
79
|
export { VisuallyHidden } from './VisuallyHidden/VisuallyHidden.js';
|
|
81
80
|
export { PageHeader } from './PageHeader/PageHeader.js';
|
|
82
|
-
export { default as merge } from 'deepmerge';
|
|
83
81
|
export { SkeletonBox } from './Skeleton/SkeletonBox.js';
|
|
84
82
|
export { ButtonComponent as Button } from './Button/Button.js';
|
|
85
83
|
export { ButtonBase } from './Button/ButtonBase.js';
|
package/dist/sx.d.ts
CHANGED
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import type { SystemCssProperties, SystemStyleObject } from '@styled-system/css';
|
|
2
2
|
import type { ThemeColorPaths, ThemeShadowPaths } from './theme';
|
|
3
3
|
import type { ColorProps, BorderColorProps, ShadowProps } from 'styled-system';
|
|
4
|
-
import merge from 'deepmerge';
|
|
5
4
|
export type BetterCssProperties = {
|
|
6
5
|
[K in keyof SystemCssProperties]: K extends keyof ColorProps ? ThemeColorPaths | SystemCssProperties[K] : K extends keyof BorderColorProps ? ThemeColorPaths | SystemCssProperties[K] : K extends keyof ShadowProps ? ThemeShadowPaths | SystemCssProperties[K] : SystemCssProperties[K];
|
|
7
6
|
};
|
|
@@ -22,5 +21,4 @@ export interface SxProp {
|
|
|
22
21
|
}
|
|
23
22
|
declare const sx: (props: SxProp) => import("@styled-system/css").CssFunctionReturnType;
|
|
24
23
|
export default sx;
|
|
25
|
-
export { merge };
|
|
26
24
|
//# sourceMappingURL=sx.d.ts.map
|
package/dist/sx.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sx.d.ts","sourceRoot":"","sources":["../src/sx.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,mBAAmB,EAAE,iBAAiB,EAAC,MAAM,oBAAoB,CAAA;AAE9E,OAAO,KAAK,EAAC,eAAe,EAAE,gBAAgB,EAAC,MAAM,SAAS,CAAA;AAC9D,OAAO,KAAK,EAAC,UAAU,EAAE,gBAAgB,EAAE,WAAW,EAAC,MAAM,eAAe,CAAA;
|
|
1
|
+
{"version":3,"file":"sx.d.ts","sourceRoot":"","sources":["../src/sx.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,mBAAmB,EAAE,iBAAiB,EAAC,MAAM,oBAAoB,CAAA;AAE9E,OAAO,KAAK,EAAC,eAAe,EAAE,gBAAgB,EAAC,MAAM,SAAS,CAAA;AAC9D,OAAO,KAAK,EAAC,UAAU,EAAE,gBAAgB,EAAE,WAAW,EAAC,MAAM,eAAe,CAAA;AAE5E,MAAM,MAAM,mBAAmB,GAAG;KAC/B,CAAC,IAAI,MAAM,mBAAmB,GAAG,CAAC,SAAS,MAAM,UAAU,GACxD,eAAe,GAAG,mBAAmB,CAAC,CAAC,CAAC,GACxC,CAAC,SAAS,MAAM,gBAAgB,GAC9B,eAAe,GAAG,mBAAmB,CAAC,CAAC,CAAC,GACxC,CAAC,SAAS,MAAM,WAAW,GACzB,gBAAgB,GAAG,mBAAmB,CAAC,CAAC,CAAC,GACzC,mBAAmB,CAAC,CAAC,CAAC;CAC/B,CAAA;AAGD,MAAM,MAAM,mBAAmB,GAAG;IAChC,CAAC,GAAG,EAAE,KAAK,MAAM,EAAE,GAAG,MAAM,GAAG,MAAM,CAAA;CACtC,CAAA;AAED,KAAK,iBAAiB,GAAG;IACvB,CAAC,WAAW,EAAE,MAAM,GAAG,iBAAiB,GAAG,mBAAmB,CAAA;CAC/D,CAAA;AAED,MAAM,MAAM,uBAAuB,GAAG,mBAAmB,GAAG,iBAAiB,GAAG,mBAAmB,GAAG,iBAAiB,CAAA;AAEvH,MAAM,WAAW,MAAM;IACrB;;;;SAIK;IACL,EAAE,CAAC,EAAE,uBAAuB,CAAA;CAC7B;AAED,QAAA,MAAM,EAAE,GAAI,OAAO,MAAM,uDAAkB,CAAA;AAE3C,eAAe,EAAE,CAAA"}
|
|
@@ -1158,11 +1158,6 @@
|
|
|
1158
1158
|
"required": false,
|
|
1159
1159
|
"description": "URL of the avatar image.",
|
|
1160
1160
|
"defaultValue": ""
|
|
1161
|
-
},
|
|
1162
|
-
{
|
|
1163
|
-
"name": "sx",
|
|
1164
|
-
"type": "SystemStyleObject",
|
|
1165
|
-
"deprecated": true
|
|
1166
1161
|
}
|
|
1167
1162
|
],
|
|
1168
1163
|
"subcomponents": []
|
|
@@ -1366,6 +1361,11 @@
|
|
|
1366
1361
|
"name": "layout",
|
|
1367
1362
|
"type": "'default' | 'compact'",
|
|
1368
1363
|
"description": "Specify the layout of the Banner. Compact layout will reduce the padding."
|
|
1364
|
+
},
|
|
1365
|
+
{
|
|
1366
|
+
"name": "actionsLayout",
|
|
1367
|
+
"type": "'default' | 'inline' | 'stacked'",
|
|
1368
|
+
"description": "Override the responsive layout of the action buttons. 'inline' layout will display the buttons inline with the title and description, while 'stacked' layout will always render the buttons in a new row."
|
|
1369
1369
|
}
|
|
1370
1370
|
],
|
|
1371
1371
|
"subcomponents": [
|
|
@@ -1556,11 +1556,6 @@
|
|
|
1556
1556
|
"name": "as",
|
|
1557
1557
|
"type": "React.ElementType",
|
|
1558
1558
|
"defaultValue": "\"div\""
|
|
1559
|
-
},
|
|
1560
|
-
{
|
|
1561
|
-
"name": "sx",
|
|
1562
|
-
"type": "SystemStyleObject",
|
|
1563
|
-
"deprecated": true
|
|
1564
1559
|
}
|
|
1565
1560
|
],
|
|
1566
1561
|
"subcomponents": []
|
|
@@ -1632,12 +1627,6 @@
|
|
|
1632
1627
|
"required": false,
|
|
1633
1628
|
"description": "How to handle overflow when breadcrumbs don't fit in the container. 'wrap' allows items to wrap to new lines. 'menu' collapses items into an overflow menu. 'menu-with-root' also collapses items into an overflow menu but includes the root (first) breadcrumb in the menu so only the last items remain visible.",
|
|
1634
1629
|
"defaultValue": "'wrap'"
|
|
1635
|
-
},
|
|
1636
|
-
{
|
|
1637
|
-
"name": "sx",
|
|
1638
|
-
"type": "SystemStyleObject",
|
|
1639
|
-
"deprecated": true,
|
|
1640
|
-
"description": "System styles (deprecated, use CSS classes instead)"
|
|
1641
1630
|
}
|
|
1642
1631
|
],
|
|
1643
1632
|
"subcomponents": [
|
|
@@ -1677,11 +1666,6 @@
|
|
|
1677
1666
|
"name": "as",
|
|
1678
1667
|
"type": "React.ElementType",
|
|
1679
1668
|
"defaultValue": "\"a\""
|
|
1680
|
-
},
|
|
1681
|
-
{
|
|
1682
|
-
"name": "sx",
|
|
1683
|
-
"type": "SystemStyleObject",
|
|
1684
|
-
"deprecated": true
|
|
1685
1669
|
}
|
|
1686
1670
|
],
|
|
1687
1671
|
"passthrough": {
|
|
@@ -3190,23 +3174,12 @@
|
|
|
3190
3174
|
{
|
|
3191
3175
|
"name": "wide",
|
|
3192
3176
|
"type": "boolean"
|
|
3193
|
-
},
|
|
3194
|
-
{
|
|
3195
|
-
"name": "sx",
|
|
3196
|
-
"type": "SystemStyleObject",
|
|
3197
|
-
"deprecated": true
|
|
3198
3177
|
}
|
|
3199
3178
|
],
|
|
3200
3179
|
"subcomponents": [
|
|
3201
3180
|
{
|
|
3202
3181
|
"name": "Dialog.Header",
|
|
3203
|
-
"props": [
|
|
3204
|
-
{
|
|
3205
|
-
"name": "sx",
|
|
3206
|
-
"type": "SystemStyleObject",
|
|
3207
|
-
"deprecated": true
|
|
3208
|
-
}
|
|
3209
|
-
]
|
|
3182
|
+
"props": []
|
|
3210
3183
|
}
|
|
3211
3184
|
]
|
|
3212
3185
|
},
|
|
@@ -4878,11 +4851,6 @@
|
|
|
4878
4851
|
"type": "| 'none' | 'condensed' | 'normal'",
|
|
4879
4852
|
"defaultValue": "'normal'",
|
|
4880
4853
|
"description": ""
|
|
4881
|
-
},
|
|
4882
|
-
{
|
|
4883
|
-
"name": "sx",
|
|
4884
|
-
"type": "SystemStyleObject",
|
|
4885
|
-
"deprecated": true
|
|
4886
4854
|
}
|
|
4887
4855
|
],
|
|
4888
4856
|
"subcomponents": [
|
|
@@ -4925,11 +4893,6 @@
|
|
|
4925
4893
|
"type": "| boolean | { narrow?: boolean regular?: boolean wide?: boolean }",
|
|
4926
4894
|
"defaultValue": "false",
|
|
4927
4895
|
"description": "Whether the header is hidden."
|
|
4928
|
-
},
|
|
4929
|
-
{
|
|
4930
|
-
"name": "sx",
|
|
4931
|
-
"type": "SystemStyleObject",
|
|
4932
|
-
"deprecated": true
|
|
4933
4896
|
}
|
|
4934
4897
|
]
|
|
4935
4898
|
},
|
|
@@ -4971,11 +4934,6 @@
|
|
|
4971
4934
|
"type": "| boolean | { narrow?: boolean regular?: boolean wide?: boolean }",
|
|
4972
4935
|
"defaultValue": "false",
|
|
4973
4936
|
"description": "Whether the content is hidden."
|
|
4974
|
-
},
|
|
4975
|
-
{
|
|
4976
|
-
"name": "sx",
|
|
4977
|
-
"type": "SystemStyleObject",
|
|
4978
|
-
"deprecated": true
|
|
4979
4937
|
}
|
|
4980
4938
|
]
|
|
4981
4939
|
},
|
|
@@ -5059,11 +5017,6 @@
|
|
|
5059
5017
|
"description": "Which side of the page the pane should be on. Can be changed for different viewport widths.",
|
|
5060
5018
|
"defaultValue": ""
|
|
5061
5019
|
},
|
|
5062
|
-
{
|
|
5063
|
-
"name": "sx",
|
|
5064
|
-
"type": "SystemStyleObject",
|
|
5065
|
-
"deprecated": true
|
|
5066
|
-
},
|
|
5067
5020
|
{
|
|
5068
5021
|
"name": "ref",
|
|
5069
5022
|
"type": "React.RefObject<HTMLDivElement>"
|
|
@@ -5109,11 +5062,6 @@
|
|
|
5109
5062
|
"type": "| boolean | { narrow?: boolean regular?: boolean wide?: boolean }",
|
|
5110
5063
|
"defaultValue": "false",
|
|
5111
5064
|
"description": "Whether the footer is hidden."
|
|
5112
|
-
},
|
|
5113
|
-
{
|
|
5114
|
-
"name": "sx",
|
|
5115
|
-
"type": "SystemStyleObject",
|
|
5116
|
-
"deprecated": true
|
|
5117
5065
|
}
|
|
5118
5066
|
]
|
|
5119
5067
|
}
|
|
@@ -5262,11 +5210,6 @@
|
|
|
5262
5210
|
"type": "boolean",
|
|
5263
5211
|
"defaultValue": "false",
|
|
5264
5212
|
"description": "Set to true to render the popover using relative positioning."
|
|
5265
|
-
},
|
|
5266
|
-
{
|
|
5267
|
-
"name": "sx",
|
|
5268
|
-
"type": "SystemStyleObject",
|
|
5269
|
-
"deprecated": true
|
|
5270
5213
|
}
|
|
5271
5214
|
],
|
|
5272
5215
|
"subcomponents": [
|
|
@@ -5279,11 +5222,6 @@
|
|
|
5279
5222
|
"defaultValue": "div",
|
|
5280
5223
|
"description": "Sets the underlying HTML tag for the component"
|
|
5281
5224
|
},
|
|
5282
|
-
{
|
|
5283
|
-
"name": "sx",
|
|
5284
|
-
"type": "SystemStyleObject",
|
|
5285
|
-
"deprecated": true
|
|
5286
|
-
},
|
|
5287
5225
|
{
|
|
5288
5226
|
"name": "width",
|
|
5289
5227
|
"type": "| 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'auto'",
|
|
@@ -5425,11 +5363,6 @@
|
|
|
5425
5363
|
"type": "string",
|
|
5426
5364
|
"defaultValue": "'bg.successInverse'",
|
|
5427
5365
|
"description": "Set the progress bar color"
|
|
5428
|
-
},
|
|
5429
|
-
{
|
|
5430
|
-
"name": "sx",
|
|
5431
|
-
"type": "SystemStyleObject",
|
|
5432
|
-
"deprecated": true
|
|
5433
5366
|
}
|
|
5434
5367
|
],
|
|
5435
5368
|
"subcomponents": [
|
|
@@ -5453,11 +5386,6 @@
|
|
|
5453
5386
|
"type": "string | number",
|
|
5454
5387
|
"description": "Used to set the size of the green bar",
|
|
5455
5388
|
"defaultValue": "0"
|
|
5456
|
-
},
|
|
5457
|
-
{
|
|
5458
|
-
"name": "sx",
|
|
5459
|
-
"type": "SystemStyleObject",
|
|
5460
|
-
"deprecated": true
|
|
5461
5389
|
}
|
|
5462
5390
|
]
|
|
5463
5391
|
}
|
|
@@ -5610,11 +5538,6 @@
|
|
|
5610
5538
|
"type": "boolean",
|
|
5611
5539
|
"defaultValue": "false",
|
|
5612
5540
|
"description": "If true, the user must make a selection before the owning form can be submitted"
|
|
5613
|
-
},
|
|
5614
|
-
{
|
|
5615
|
-
"name": "sx",
|
|
5616
|
-
"type": "SystemStyleObject",
|
|
5617
|
-
"deprecated": true
|
|
5618
5541
|
}
|
|
5619
5542
|
],
|
|
5620
5543
|
"subcomponents": [
|
|
@@ -5637,11 +5560,6 @@
|
|
|
5637
5560
|
"type": "React.ReactNode",
|
|
5638
5561
|
"defaultValue": "",
|
|
5639
5562
|
"description": "The caption content"
|
|
5640
|
-
},
|
|
5641
|
-
{
|
|
5642
|
-
"name": "sx",
|
|
5643
|
-
"type": "SystemStyleObject",
|
|
5644
|
-
"deprecated": true
|
|
5645
5563
|
}
|
|
5646
5564
|
]
|
|
5647
5565
|
},
|
|
@@ -5660,11 +5578,6 @@
|
|
|
5660
5578
|
"defaultValue": "",
|
|
5661
5579
|
"required": true,
|
|
5662
5580
|
"description": "Changes the visual style to match the validation status"
|
|
5663
|
-
},
|
|
5664
|
-
{
|
|
5665
|
-
"name": "sx",
|
|
5666
|
-
"type": "SystemStyleObject",
|
|
5667
|
-
"deprecated": true
|
|
5668
5581
|
}
|
|
5669
5582
|
]
|
|
5670
5583
|
}
|
|
@@ -7012,11 +6925,6 @@
|
|
|
7012
6925
|
"name": "aria-label",
|
|
7013
6926
|
"type": "string",
|
|
7014
6927
|
"description": "Used to set the `aria-label` on the top level `<nav>` element."
|
|
7015
|
-
},
|
|
7016
|
-
{
|
|
7017
|
-
"name": "sx",
|
|
7018
|
-
"type": "SystemStyleObject",
|
|
7019
|
-
"deprecated": true
|
|
7020
6928
|
}
|
|
7021
6929
|
],
|
|
7022
6930
|
"subcomponents": [
|
|
@@ -7040,11 +6948,6 @@
|
|
|
7040
6948
|
"name": "to",
|
|
7041
6949
|
"type": "string | Partial<Path>",
|
|
7042
6950
|
"description": "Used when the item is rendered using a component like React Router's `Link`. The path to navigate to."
|
|
7043
|
-
},
|
|
7044
|
-
{
|
|
7045
|
-
"name": "sx",
|
|
7046
|
-
"type": "SystemStyleObject",
|
|
7047
|
-
"deprecated": true
|
|
7048
6951
|
}
|
|
7049
6952
|
]
|
|
7050
6953
|
}
|
|
@@ -7307,11 +7210,6 @@
|
|
|
7307
7210
|
"deprecated": true,
|
|
7308
7211
|
"description": "(Use leadingVisual or trailingVisual) An Octicon React component. To be used inside of input. Positioned on the left edge."
|
|
7309
7212
|
},
|
|
7310
|
-
{
|
|
7311
|
-
"name": "sx",
|
|
7312
|
-
"type": "SystemStyleObject",
|
|
7313
|
-
"deprecated": true
|
|
7314
|
-
},
|
|
7315
7213
|
{
|
|
7316
7214
|
"name": "ref",
|
|
7317
7215
|
"type": "React.RefObject<HTMLInputElement>"
|
|
@@ -7354,11 +7252,6 @@
|
|
|
7354
7252
|
"name": "as",
|
|
7355
7253
|
"type": "React.ElementType",
|
|
7356
7254
|
"defaultValue": "\"button\""
|
|
7357
|
-
},
|
|
7358
|
-
{
|
|
7359
|
-
"name": "sx",
|
|
7360
|
-
"type": "SystemStyleObject",
|
|
7361
|
-
"deprecated": true
|
|
7362
7255
|
}
|
|
7363
7256
|
],
|
|
7364
7257
|
"passthrough": {
|
|
@@ -7634,11 +7527,6 @@
|
|
|
7634
7527
|
"name": "clipSidebar",
|
|
7635
7528
|
"type": "boolean",
|
|
7636
7529
|
"description": "Hides the sidebar above the first Timeline.Item and below the last Timeline.Item."
|
|
7637
|
-
},
|
|
7638
|
-
{
|
|
7639
|
-
"name": "sx",
|
|
7640
|
-
"type": "SystemStyleObject",
|
|
7641
|
-
"deprecated": true
|
|
7642
7530
|
}
|
|
7643
7531
|
],
|
|
7644
7532
|
"subcomponents": [
|
|
@@ -7649,43 +7537,20 @@
|
|
|
7649
7537
|
"name": "condensed",
|
|
7650
7538
|
"type": "boolean",
|
|
7651
7539
|
"description": "Reduces vertical padding and removes background from an item's badge."
|
|
7652
|
-
},
|
|
7653
|
-
{
|
|
7654
|
-
"name": "sx",
|
|
7655
|
-
"type": "SystemStyleObject",
|
|
7656
|
-
"deprecated": true
|
|
7657
7540
|
}
|
|
7658
7541
|
]
|
|
7659
7542
|
},
|
|
7660
7543
|
{
|
|
7661
7544
|
"name": "Timeline.Badge",
|
|
7662
|
-
"props": [
|
|
7663
|
-
{
|
|
7664
|
-
"name": "sx",
|
|
7665
|
-
"type": "SystemStyleObject",
|
|
7666
|
-
"deprecated": true
|
|
7667
|
-
}
|
|
7668
|
-
]
|
|
7545
|
+
"props": []
|
|
7669
7546
|
},
|
|
7670
7547
|
{
|
|
7671
7548
|
"name": "Timeline.Body",
|
|
7672
|
-
"props": [
|
|
7673
|
-
{
|
|
7674
|
-
"name": "sx",
|
|
7675
|
-
"type": "SystemStyleObject",
|
|
7676
|
-
"deprecated": true
|
|
7677
|
-
}
|
|
7678
|
-
]
|
|
7549
|
+
"props": []
|
|
7679
7550
|
},
|
|
7680
7551
|
{
|
|
7681
7552
|
"name": "Timeline.Break",
|
|
7682
|
-
"props": [
|
|
7683
|
-
{
|
|
7684
|
-
"name": "sx",
|
|
7685
|
-
"type": "SystemStyleObject",
|
|
7686
|
-
"deprecated": true
|
|
7687
|
-
}
|
|
7688
|
-
]
|
|
7553
|
+
"props": []
|
|
7689
7554
|
}
|
|
7690
7555
|
]
|
|
7691
7556
|
},
|
|
@@ -8390,11 +8255,6 @@
|
|
|
8390
8255
|
"name": "as",
|
|
8391
8256
|
"type": "React.ElementType",
|
|
8392
8257
|
"defaultValue": "'div'"
|
|
8393
|
-
},
|
|
8394
|
-
{
|
|
8395
|
-
"name": "sx",
|
|
8396
|
-
"type": "SystemStyleObject",
|
|
8397
|
-
"deprecated": true
|
|
8398
8258
|
}
|
|
8399
8259
|
],
|
|
8400
8260
|
"subcomponents": []
|
package/package.json
CHANGED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/ActionMenu/ActionMenu.module.css"],"names":[],"mappings":"AACE,2EACE,uCACF","file":"ActionMenu-5fe972e2.css","sourcesContent":[".ActionMenuContainer {\n &:where([data-variant='fullscreen']) {\n padding-top: var(--base-size-36);\n }\n}\n"]}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
.prc-Banner-Banner-IR8eJ{align-items:start;background-color:var(--banner-bgColor);border:var(--borderWidth-thin,.0625rem) solid var(--banner-borderColor);border-radius:var(--borderRadius-medium,.375rem);display:grid;grid-template-columns:auto minmax(0,1fr) auto;padding:var(--base-size-8,.5rem)}@supports (container-type:inline-size){.prc-Banner-Banner-IR8eJ{container:banner/inline-size}}.prc-Banner-Banner-IR8eJ[data-layout=compact]{padding:var(--base-size-4,.25rem)}.prc-Banner-Banner-IR8eJ[data-variant=critical]{--banner-bgColor:var(--bgColor-danger-muted,var(--color-danger-subtle));--banner-borderColor:var(--borderColor-danger-muted,var(--color-danger-muted));--banner-icon-fgColor:var(--fgColor-danger,var(--color-danger-fg))}.prc-Banner-Banner-IR8eJ[data-variant=info]{--banner-bgColor:var(--bgColor-accent-muted,var(--color-accent-subtle));--banner-borderColor:var(--borderColor-accent-muted,var(--color-accent-muted));--banner-icon-fgColor:var(--fgColor-accent,var(--color-accent-fg))}.prc-Banner-Banner-IR8eJ[data-variant=success]{--banner-bgColor:var(--bgColor-success-muted,var(--color-success-subtle));--banner-borderColor:var(--borderColor-success-muted,var(--color-success-muted));--banner-icon-fgColor:var(--fgColor-success,var(--color-success-fg))}.prc-Banner-Banner-IR8eJ[data-variant=upsell]{--banner-bgColor:var(--bgColor-upsell-muted,#fbefff);--banner-borderColor:var(--borderColor-upsell-muted,#c297ff66);--banner-icon-fgColor:var(--fgColor-upsell,#8250df)}.prc-Banner-Banner-IR8eJ[data-variant=warning]{--banner-bgColor:var(--bgColor-attention-muted,var(--color-attention-subtle));--banner-borderColor:var(--borderColor-attention-muted,var(--color-attention-muted));--banner-icon-fgColor:var(--fgColor-attention,var(--color-attention-fg))}.prc-Banner-BannerContainer-lbx3d{align-items:start;column-gap:var(--base-size-4,.25rem);font-size:var(--text-body-size-medium,.875rem);line-height:var(--text-body-lineHeight-medium,1.4285);row-gap:var(--base-size-4,.25rem)}.prc-Banner-Banner-IR8eJ :where(.prc-Banner-BannerContainer-lbx3d){display:flex;flex-wrap:wrap;justify-content:space-between}.prc-Banner-Banner-IR8eJ[data-dismissible]:not([data-title-hidden=""]) .prc-Banner-BannerContainer-lbx3d{display:grid;grid-template-columns:auto;grid-template-rows:auto}.prc-Banner-BannerContent-zTITK{display:grid;grid-column-start:1;margin-block:var(--base-size-8,.5rem);row-gap:var(--base-size-4,.25rem)}.prc-Banner-Banner-IR8eJ[data-title-hidden]:not(:has(.prc-Banner-BannerActions-XCfHL)) .prc-Banner-BannerContent-zTITK{margin-block:var(--base-size-6,.375rem)}@media screen and (min-width:544px){.prc-Banner-BannerContent-zTITK{flex:1 1 0%}}.prc-Banner-BannerTitle-TcuJl{font-size:inherit;font-weight:var(--base-text-weight-semibold,600);margin:0}.prc-Banner-BannerIcon-WuOyf{display:grid;padding:var(--base-size-8,.5rem);place-items:center}.prc-Banner-BannerIcon-WuOyf svg{color:var(--banner-icon-fgColor);height:var(--base-size-20,1.25rem);fill:var(--banner-icon-fgColor)}.prc-Banner-Banner-IR8eJ[data-title-hidden]:not(:has(.prc-Banner-BannerActions-XCfHL)) .prc-Banner-BannerIcon-WuOyf svg{height:var(--base-size-16,1rem)}.prc-Banner-BannerDismiss-uBZVm{display:grid;margin-inline-start:var(--base-size-4,.25rem);padding:var(--base-size-8,.5rem);place-items:center}:where(.prc-Banner-Banner-IR8eJ):has(.prc-Banner-BannerActions-XCfHL) .prc-Banner-BannerDismiss-uBZVm{margin-block:var(--base-size-2,.125rem)}.prc-Banner-BannerDismiss-uBZVm svg{color:var(--banner-icon-fgColor)}.prc-Banner-BannerActionsContainer-ukGMH{align-items:center;column-gap:var(--base-size-12,.75rem);display:flex;margin-block:var(--base-size-2,.125rem)}.prc-Banner-BannerActions-XCfHL :where([data-primary-action=trailing]){display:none}@media screen and (min-width:48rem){.prc-Banner-BannerActions-XCfHL :where([data-primary-action=trailing]){display:flex}.prc-Banner-BannerActions-XCfHL :where([data-primary-action=leading]){display:none}}.prc-Banner-Banner-IR8eJ[data-dismissible]:not([data-title-hidden]) .prc-Banner-BannerActions-XCfHL{margin-block-end:var(--base-size-6,.375rem)}.prc-Banner-Banner-IR8eJ[data-dismissible]:not([data-title-hidden]) .prc-Banner-BannerActionsContainer-ukGMH[data-primary-action=trailing]{display:none}.prc-Banner-Banner-IR8eJ[data-dismissible]:not([data-title-hidden]) .prc-Banner-BannerActionsContainer-ukGMH[data-primary-action=leading]{display:flex}@container banner (max-width: 500px){.prc-Banner-BannerContainer-lbx3d{display:grid}.prc-Banner-BannerContainer-lbx3d:has(.prc-Banner-BannerActionsContainer-ukGMH){grid-template-rows:auto auto}.prc-Banner-BannerActions-XCfHL{margin-block-end:var(--base-size-6,.375rem)}.prc-Banner-BannerActions-XCfHL [data-primary-action=trailing]{display:none}.prc-Banner-BannerActions-XCfHL [data-primary-action=leading]{display:flex}}@container banner (min-width: 500px){.prc-Banner-BannerContainer-lbx3d{display:grid;grid-template-columns:auto auto}:where(.prc-Banner-Banner-IR8eJ):not([data-dismissible]) :where(.prc-Banner-BannerActionsContainer-ukGMH[data-primary-action=trailing]) :where([data-variant=link]:only-child){padding-inline:0 var(--base-size-12,.75rem)}.prc-Banner-BannerActions-XCfHL [data-primary-action=trailing]{display:flex;min-height:var(--base-size-32,2rem)}.prc-Banner-BannerActions-XCfHL [data-primary-action=leading]{display:none}}
|
|
2
|
-
/*# sourceMappingURL=Banner-459c533a.css.map */
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/Banner/Banner.module.css"],"names":[],"mappings":"AAAA,yBASE,iBAAkB,CALlB,sCAAuC,CAEvC,uEAA+D,CAC/D,gDAAyC,CANzC,YAAa,CAOb,6CAA+C,CAN/C,gCA8CF,CArCE,uCAXF,yBAYI,4BAoCJ,CAnCE,CAEA,8CACE,iCACF,CAEA,gDACE,uEAA6C,CAC7C,8EAAqD,CACrD,kEACF,CAEA,4CACE,uEAA6C,CAC7C,8EAAqD,CACrD,kEACF,CAEA,+CACE,yEAA8C,CAC9C,gFAAsD,CACtD,oEACF,CAEA,8CACE,oDAA6C,CAC7C,8DAAqD,CACrD,mDACF,CAEA,+CACE,6EAAgD,CAChD,oFAAwD,CACxD,wEACF,CAKF,kCAEE,iBAAkB,CAGlB,oCAA8B,CAJ9B,8CAAuC,CAEvC,qDAA+C,CAC/C,iCAEF,CAEA,mEACE,YAAa,CACb,cAAe,CACf,6BACF,CAEA,yGACE,YAAa,CACb,0BAA2B,CAC3B,uBACF,CAIA,gCACE,YAAa,CAEb,mBAAoB,CACpB,qCAAgC,CAFhC,iCAGF,CAEA,uHACE,uCACF,CAEA,oCACE,gCACE,WACF,CACF,CAEA,8BAEE,iBAAkB,CAClB,gDAA6C,CAF7C,QAGF,CAIA,6BACE,YAAa,CAEb,gCAA2B,CAD3B,kBAEF,CAEA,iCAIE,gCAAiC,CAFjC,kCAA2B,CAI3B,+BACF,CAGA,wHACE,+BACF,CAIA,gCACE,YAAa,CAGb,6CAAuC,CADvC,gCAA2B,CAD3B,kBAGF,CAEA,sGACE,uCACF,CAEA,oCAEE,gCACF,CAIA,yCAGE,kBAAmB,CADnB,qCAA+B,CAD/B,YAAa,CAGb,uCACF,CAEA,uEACE,YACF,CAEA,oCACE,uEACE,YACF,CAEA,sEACE,YACF,CACF,CAEA,oGACE,2CACF,CAGA,2IACE,YACF,CAGA,0IACE,YACF,CAIA,qCACE,kCACE,YACF,CAEA,gFACE,4BACF,CAEA,gCACE,2CACF,CAEA,+DACE,YACF,CAEA,8DACE,YACF,CACF,CAEA,qCACE,kCACE,YAAa,CACb,+BACF,CAEA,+KAGE,2CACF,CAEA,+DACE,YAAa,CACb,mCACF,CAEA,8DACE,YACF,CACF","file":"Banner-459c533a.css","sourcesContent":[".Banner {\n display: grid;\n padding: var(--base-size-8);\n /* stylelint-disable-next-line primer/colors */\n background-color: var(--banner-bgColor);\n /* stylelint-disable-next-line primer/colors */\n border: var(--borderWidth-thin) solid var(--banner-borderColor);\n border-radius: var(--borderRadius-medium);\n grid-template-columns: auto minmax(0, 1fr) auto;\n align-items: start;\n\n @supports (container-type: inline-size) {\n container: banner / inline-size;\n }\n\n &[data-layout='compact'] {\n padding: var(--base-size-4);\n }\n\n &[data-variant='critical'] {\n --banner-bgColor: var(--bgColor-danger-muted);\n --banner-borderColor: var(--borderColor-danger-muted);\n --banner-icon-fgColor: var(--fgColor-danger);\n }\n\n &[data-variant='info'] {\n --banner-bgColor: var(--bgColor-accent-muted);\n --banner-borderColor: var(--borderColor-accent-muted);\n --banner-icon-fgColor: var(--fgColor-accent);\n }\n\n &[data-variant='success'] {\n --banner-bgColor: var(--bgColor-success-muted);\n --banner-borderColor: var(--borderColor-success-muted);\n --banner-icon-fgColor: var(--fgColor-success);\n }\n\n &[data-variant='upsell'] {\n --banner-bgColor: var(--bgColor-upsell-muted);\n --banner-borderColor: var(--borderColor-upsell-muted);\n --banner-icon-fgColor: var(--fgColor-upsell);\n }\n\n &[data-variant='warning'] {\n --banner-bgColor: var(--bgColor-attention-muted);\n --banner-borderColor: var(--borderColor-attention-muted);\n --banner-icon-fgColor: var(--fgColor-attention);\n }\n}\n\n/* BannerContainer -------------------------------------------------------- */\n\n.BannerContainer {\n font-size: var(--text-body-size-medium);\n align-items: start;\n line-height: var(--text-body-lineHeight-medium);\n row-gap: var(--base-size-4);\n column-gap: var(--base-size-4);\n}\n\n.Banner :where(.BannerContainer) {\n display: flex;\n flex-wrap: wrap;\n justify-content: space-between;\n}\n\n.Banner[data-dismissible]:not([data-title-hidden='']) .BannerContainer {\n display: grid;\n grid-template-columns: auto;\n grid-template-rows: auto;\n}\n\n/* BannerContent ---------------------------------------------------------- */\n\n.BannerContent {\n display: grid;\n row-gap: var(--base-size-4);\n grid-column-start: 1;\n margin-block: var(--base-size-8);\n}\n\n.Banner[data-title-hidden]:not(:has(.BannerActions)) .BannerContent {\n margin-block: var(--base-size-6);\n}\n\n@media screen and (min-width: 544px) {\n .BannerContent {\n flex: 1 1 0%;\n }\n}\n\n.BannerTitle {\n margin: 0;\n font-size: inherit;\n font-weight: var(--base-text-weight-semibold);\n}\n\n/* BannerIcon ------------------------------------------------------------- */\n\n.BannerIcon {\n display: grid;\n place-items: center;\n padding: var(--base-size-8);\n}\n\n.BannerIcon svg {\n /* 20px is the line box height of the trailing action buttons */\n height: var(--base-size-20);\n /* stylelint-disable-next-line primer/colors */\n color: var(--banner-icon-fgColor);\n /* stylelint-disable-next-line primer/colors */\n fill: var(--banner-icon-fgColor);\n}\n\n/* stylelint-disable-next-line selector-max-specificity */\n.Banner[data-title-hidden]:not(:has(.BannerActions)) .BannerIcon svg {\n height: var(--base-size-16);\n}\n\n/* BannerDismiss ---------------------------------------------------------- */\n\n.BannerDismiss {\n display: grid;\n place-items: center;\n padding: var(--base-size-8);\n margin-inline-start: var(--base-size-4);\n}\n\n:where(.Banner):has(.BannerActions) .BannerDismiss {\n margin-block: var(--base-size-2);\n}\n\n.BannerDismiss svg {\n /* stylelint-disable-next-line primer/colors */\n color: var(--banner-icon-fgColor);\n}\n\n/* BannerActions ---------------------------------------------------------- */\n\n.BannerActionsContainer {\n display: flex;\n column-gap: var(--base-size-12);\n align-items: center;\n margin-block: var(--base-size-2);\n}\n\n.BannerActions :where([data-primary-action='trailing']) {\n display: none;\n}\n\n@media screen and (--viewportRange-regular) {\n .BannerActions :where([data-primary-action='trailing']) {\n display: flex;\n }\n\n .BannerActions :where([data-primary-action='leading']) {\n display: none;\n }\n}\n\n.Banner[data-dismissible]:not([data-title-hidden]) .BannerActions {\n margin-block-end: var(--base-size-6);\n}\n\n/* stylelint-disable-next-line selector-max-specificity */\n.Banner[data-dismissible]:not([data-title-hidden]) .BannerActionsContainer[data-primary-action='trailing'] {\n display: none;\n}\n\n/* stylelint-disable-next-line selector-max-specificity */\n.Banner[data-dismissible]:not([data-title-hidden]) .BannerActionsContainer[data-primary-action='leading'] {\n display: flex;\n}\n\n/* Layout ------------------------------------------------------------------- */\n\n@container banner (max-width: 500px) {\n .BannerContainer {\n display: grid;\n }\n\n .BannerContainer:has(.BannerActionsContainer) {\n grid-template-rows: auto auto;\n }\n\n .BannerActions {\n margin-block-end: var(--base-size-6);\n }\n\n .BannerActions [data-primary-action='trailing'] {\n display: none;\n }\n\n .BannerActions [data-primary-action='leading'] {\n display: flex;\n }\n}\n\n@container banner (min-width: 500px) {\n .BannerContainer {\n display: grid;\n grid-template-columns: auto auto;\n }\n\n :where(.Banner):not([data-dismissible])\n :where(.BannerActionsContainer[data-primary-action='trailing'])\n :where([data-variant='link']:only-child) {\n padding-inline: 0 var(--base-size-12);\n }\n\n .BannerActions [data-primary-action='trailing'] {\n display: flex;\n min-height: var(--base-size-32, 2rem);\n }\n\n .BannerActions [data-primary-action='leading'] {\n display: none;\n }\n}\n"]}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
.prc-Breadcrumbs-BreadcrumbsBase-6gqOz{display:flex;justify-content:space-between;width:100%}.prc-Breadcrumbs-BreadcrumbsList-K7eeK{margin-bottom:0;margin-top:0;padding-left:0}:is([data-overflow=menu],[data-overflow=menu-with-root]) .prc-Breadcrumbs-BreadcrumbsList-K7eeK{display:flex;flex-direction:row;white-space:nowrap}.prc-Breadcrumbs-ItemSeparator-nYObp{align-self:center;color:var(--fgColor-muted,var(--color-fg-muted));display:flex;justify-content:center;-webkit-user-select:none;user-select:none;white-space:nowrap}.prc-Breadcrumbs-ItemWrapper-Mfwuj{list-style:none}.prc-Breadcrumbs-ItemWrapper-Mfwuj,.prc-Breadcrumbs-ItemWrapper-Mfwuj:after{display:inline-block;font-size:var(--text-body-size-medium,.875rem)}.prc-Breadcrumbs-ItemWrapper-Mfwuj:after{border-right:.1em solid var(--fgColor-muted,var(--color-fg-muted));content:"";height:.8em;margin:0 .5em;transform:rotate(15deg) translateY(.0625em)}.prc-Breadcrumbs-ItemWrapper-Mfwuj:first-child{margin-left:0}.prc-Breadcrumbs-ItemWrapper-Mfwuj:last-child:after{content:none}.prc-Breadcrumbs-Item-7BKO-{display:inline-block;font-size:var(--text-body-size-medium,.875rem)}.prc-Breadcrumbs-Item-7BKO-:focus-visible{box-shadow:none;outline:2px solid var(--focus-outlineColor,var(--color-accent-fg));outline-offset:1px}[data-variant=normal] .prc-Breadcrumbs-Item-7BKO-{color:var(--fgColor-link,var(--color-accent-fg));-webkit-text-decoration:none;text-decoration:none}:is([data-variant=normal] .prc-Breadcrumbs-Item-7BKO-):not([aria-current]):hover{-webkit-text-decoration:underline;text-decoration:underline}:is([data-variant=normal] .prc-Breadcrumbs-Item-7BKO-):focus-visible{-webkit-text-decoration:none;text-decoration:none}[aria-current]:is([data-variant=normal] .prc-Breadcrumbs-Item-7BKO-){color:var(--fgColor-default,var(--color-fg-default))}[data-variant=spacious] .prc-Breadcrumbs-Item-7BKO-{border-radius:var(--borderRadius-medium,.375rem);color:var(--fgColor-default,var(--color-fg-default));padding-block:var(--base-size-4,.25rem);padding-inline:var(--base-size-6,.375rem);-webkit-text-decoration:none;text-decoration:none}:is([data-variant=spacious] .prc-Breadcrumbs-Item-7BKO-):hover{background:var(--control-transparent-bgColor-hover,var(--color-action-list-item-default-hover-bg));-webkit-text-decoration:none;text-decoration:none}[aria-current]:is([data-variant=spacious] .prc-Breadcrumbs-Item-7BKO-){font-weight:var(--base-text-weight-semibold,600)}.prc-Breadcrumbs-BreadcrumbsItem-FHLFr{align-items:center;display:inline-grid;flex:0 99999 auto;grid-auto-flow:column;list-style:none;min-width:auto;white-space:nowrap}.prc-Breadcrumbs-BreadcrumbsItem-FHLFr:has(.prc-Breadcrumbs-MenuOverlay-aCOyl){white-space:normal}.prc-Breadcrumbs-BreadcrumbsItem-FHLFr:first-child{margin-left:0}.prc-Breadcrumbs-BreadcrumbsItem-FHLFr:last-child .prc-Breadcrumbs-ItemSeparator-nYObp{display:none}.prc-Breadcrumbs-BreadcrumbsItem-FHLFr .prc-Breadcrumbs-MenuDetails-TXUai{display:inline-block;position:relative}:is(.prc-Breadcrumbs-BreadcrumbsItem-FHLFr .prc-Breadcrumbs-MenuDetails-TXUai) summary{cursor:pointer;list-style:none}:is(:is(.prc-Breadcrumbs-BreadcrumbsItem-FHLFr .prc-Breadcrumbs-MenuDetails-TXUai) summary)::-webkit-details-marker{display:none}.prc-Breadcrumbs-BreadcrumbsItem-FHLFr .prc-Breadcrumbs-MenuOverlay-aCOyl{background-color:var(--overlay-bgColor,var(--color-canvas-overlay));border-radius:var(--borderRadius-large,.75rem);box-shadow:var(--shadow-floating-small,var(--color-overlay-shadow));max-height:100vh;max-width:var(--overlay-width-small,20rem);min-width:var(--overlay-width-xsmall,12rem);overflow:hidden;position:absolute;top:calc(var(--overlay-offset,.25rem) + var(--control-small-size,1.75rem));z-index:1}@media (prefers-reduced-motion:no-preference){.prc-Breadcrumbs-BreadcrumbsItem-FHLFr .prc-Breadcrumbs-MenuOverlay-aCOyl{animation:prc-Breadcrumbs-overlay-appear-Ct2Xv .2s cubic-bezier(.33,1,.68,1)}}
|
|
2
|
-
/*# sourceMappingURL=Breadcrumbs-7cbdf03c.css.map */
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/Breadcrumbs/Breadcrumbs.module.css","../../postcss-preset-primer/src/mixins/focusOutline.css"],"names":[],"mappings":"AAAA,uCACE,YAAa,CACb,6BAA8B,CAC9B,UACF,CAEA,uCAGE,eAAgB,CADhB,YAAa,CADb,cAGF,CAIE,gGAEE,YAAa,CACb,kBAAmB,CAFnB,kBAGF,CAGF,qCAGE,iBAAkB,CAFlB,gDAA2B,CAC3B,YAAa,CAEb,sBAAuB,CAEvB,wBAAiB,CAAjB,gBAAiB,CADjB,kBAEF,CAEA,mCAGE,eAuBF,CArBE,4EAJA,oBAAqB,CACrB,8CAaA,CAVA,yCAQE,kEAA8C,CAF9C,UAAW,CAJX,WAAa,CAEb,aAAe,CAKf,2CACF,CAEA,+CACE,aACF,CAGE,oDACE,YACF,CAIJ,4BACE,oBAAqB,CACrB,8CAKF,CAHE,0CC3DA,eAAgB,CAFhB,kEAAgC,CAChC,kBD8DA,CAIA,kDACE,gDAA0B,CAC1B,4BAAqB,CAArB,oBAeF,CAZI,iFACE,iCAA0B,CAA1B,yBACF,CAGF,qEACE,4BAAqB,CAArB,oBACF,CAEA,qEACE,oDACF,CAKF,oDAKE,gDAAyC,CAJzC,oDAA6B,CAG7B,uCAAiC,CADjC,yCAAkC,CADlC,4BAAqB,CAArB,oBAaF,CARE,+DACE,kGAAoD,CACpD,4BAAqB,CAArB,oBACF,CAEA,uEACE,gDACF,CAIJ,uCAGE,kBAAmB,CAFnB,mBAAoB,CAGpB,iBAAkB,CAFlB,qBAAsB,CAKtB,eAAgB,CAFhB,cAAe,CACf,kBAiDF,CA7CE,+EACE,kBACF,CAEA,mDACE,aACF,CAGE,uFACE,YACF,CAGF,0EAEE,oBAAqB,CADrB,iBAWF,CARE,uFAEE,cAAe,CADf,eAMF,CAHE,oHACE,YACF,CAIJ,0EAKE,mEAAwC,CADxC,8CAAwC,CADxC,mEAAwC,CAIxC,gBAAiB,CACjB,0CAAqC,CAFrC,2CAAsC,CAGtC,eAAgB,CARhB,iBAAkB,CAUlB,0EAA4D,CAT5D,SAcF,CAHE,8CAbF,0EAcI,4EAEJ,CADE","file":"Breadcrumbs-7cbdf03c.css","sourcesContent":[".BreadcrumbsBase {\n display: flex;\n justify-content: space-between;\n width: 100%;\n}\n\n.BreadcrumbsList {\n padding-left: 0;\n margin-top: 0;\n margin-bottom: 0;\n}\n\n[data-overflow='menu'],\n[data-overflow='menu-with-root'] {\n & .BreadcrumbsList {\n white-space: nowrap;\n display: flex;\n flex-direction: row;\n }\n}\n\n.ItemSeparator {\n color: var(--fgColor-muted);\n display: flex;\n align-self: center;\n justify-content: center;\n white-space: nowrap;\n user-select: none;\n}\n\n.ItemWrapper {\n display: inline-block;\n font-size: var(--text-body-size-medium);\n list-style: none;\n\n &::after {\n display: inline-block;\n height: 0.8em;\n /* stylelint-disable-next-line primer/spacing */\n margin: 0 0.5em;\n font-size: var(--text-body-size-medium);\n content: '';\n /* stylelint-disable-next-line primer/borders, primer/colors */\n border-right: 0.1em solid var(--fgColor-muted);\n transform: rotate(15deg) translateY(0.0625em);\n }\n\n &:first-child {\n margin-left: 0;\n }\n\n &:last-child {\n &::after {\n content: none;\n }\n }\n}\n\n.Item {\n display: inline-block;\n font-size: var(--text-body-size-medium);\n\n &:focus-visible {\n @mixin focusOutline 1px;\n }\n}\n\n[data-variant='normal'] {\n & .Item {\n color: var(--fgColor-link);\n text-decoration: none;\n\n &:not([aria-current]) {\n &:hover {\n text-decoration: underline;\n }\n }\n\n &:focus-visible {\n text-decoration: none;\n }\n\n &[aria-current] {\n color: var(--fgColor-default);\n }\n }\n}\n\n[data-variant='spacious'] {\n & .Item {\n color: var(--fgColor-default);\n text-decoration: none;\n padding-inline: var(--base-size-6);\n padding-block: var(--base-size-4);\n border-radius: var(--borderRadius-medium);\n\n &:hover {\n background: var(--control-transparent-bgColor-hover);\n text-decoration: none;\n }\n\n &[aria-current] {\n font-weight: var(--base-text-weight-semibold);\n }\n }\n}\n\n.BreadcrumbsItem {\n display: inline-grid;\n grid-auto-flow: column;\n align-items: center;\n flex: 0 99999 auto;\n min-width: auto;\n white-space: nowrap;\n list-style: none;\n\n /* allow menu items to wrap line */\n &:has(.MenuOverlay) {\n white-space: normal;\n }\n\n &:first-child {\n margin-left: 0;\n }\n\n &:last-child {\n .ItemSeparator {\n display: none;\n }\n }\n\n .MenuDetails {\n position: relative;\n display: inline-block;\n\n & summary {\n list-style: none;\n cursor: pointer;\n\n &::-webkit-details-marker {\n display: none;\n }\n }\n }\n\n .MenuOverlay {\n position: absolute;\n z-index: 1;\n box-shadow: var(--shadow-floating-small);\n border-radius: var(--borderRadius-large);\n background-color: var(--overlay-bgColor);\n min-width: var(--overlay-width-xsmall);\n max-height: 100vh;\n max-width: var(--overlay-width-small);\n overflow: hidden;\n /* stylelint-disable-next-line primer/spacing */\n top: calc(var(--overlay-offset) + var(--control-small-size));\n\n @media (prefers-reduced-motion: no-preference) {\n animation: overlay-appear 200ms cubic-bezier(0.33, 1, 0.68, 1);\n }\n }\n}\n","@define-mixin focusOutline $outlineOffset: -2px, $outlineColor: var(--focus-outlineColor) {\n outline: 2px solid $outlineColor;\n outline-offset: $outlineOffset;\n box-shadow: none;\n}\n"]}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
.prc-Button-ButtonBase-c50BI{align-items:center;appearance:none;background-color:transparent;border:var(--borderWidth-thin,.0625rem) solid;border-color:var(--button-default-borderColor-rest,var(--color-btn-border));border-radius:var(--borderRadius-medium,.375rem);color:var(--button-default-fgColor-rest,var(--color-btn-text));cursor:pointer;display:flex;font-family:inherit;font-size:var(--text-body-size-medium,.875rem);font-weight:var(--base-text-weight-medium,500);gap:var(--base-size-8,.5rem);height:var(--control-medium-size,2rem);justify-content:space-between;min-width:max-content;padding:0 var(--control-medium-paddingInline-normal,.75rem);text-align:center;-webkit-text-decoration:none;text-decoration:none;transition:80ms cubic-bezier(.65,0,.35,1);transition-property:color,fill,background-color,border-color;-webkit-user-select:none;user-select:none}.prc-Button-ButtonBase-c50BI:hover{transition-duration:80ms}.prc-Button-ButtonBase-c50BI:focus-visible{box-shadow:none;outline:2px solid var(--focus-outlineColor,var(--color-accent-fg));outline-offset:-2px}.prc-Button-ButtonBase-c50BI:active{transition:none}.prc-Button-ButtonBase-c50BI:disabled,.prc-Button-ButtonBase-c50BI[aria-disabled=true]:not([data-loading=true]){box-shadow:none;cursor:not-allowed}:is(.prc-Button-ButtonBase-c50BI:disabled,.prc-Button-ButtonBase-c50BI[aria-disabled=true]:not([data-loading=true])) .prc-Button-CounterLabel-f5-4u,:is(.prc-Button-ButtonBase-c50BI:disabled,.prc-Button-ButtonBase-c50BI[aria-disabled=true]:not([data-loading=true])) .prc-Button-Visual-2epfX{color:inherit}@media (forced-colors:active){.prc-Button-ButtonBase-c50BI:focus{outline:1px solid transparent}}.prc-Button-ButtonBase-c50BI :where(.prc-Button-Visual-2epfX){color:var(--fgColor-muted,var(--color-fg-muted));display:flex;pointer-events:none}.prc-Button-ButtonBase-c50BI :where(.prc-Button-VisualWrap-Db-eB){display:flex;pointer-events:none}.prc-Button-ButtonBase-c50BI:where(.prc-Button-IconButton-szpyj){display:inline-grid;flex-shrink:0;min-width:unset;padding:unset;place-content:center;width:var(--control-medium-size,2rem)}.prc-Button-ButtonBase-c50BI:where(.prc-Button-IconButton-szpyj):where([data-size=small]){width:var(--control-small-size,1.75rem)}.prc-Button-ButtonBase-c50BI:where(.prc-Button-IconButton-szpyj):where([data-size=large]){width:var(--control-large-size,2.5rem)}.prc-Button-ButtonBase-c50BI:where([href]){display:inline-flex}.prc-Button-ButtonBase-c50BI:where([href]):hover{-webkit-text-decoration:none;text-decoration:none}.prc-Button-ButtonBase-c50BI :where(.prc-Button-ButtonContent-HKbr-){align-content:center;align-items:center;display:grid;flex:1 0 auto;grid-template-areas:"leadingVisual text trailingVisual";grid-template-columns:min-content minmax(0,auto) min-content}:is(.prc-Button-ButtonBase-c50BI :where(.prc-Button-ButtonContent-HKbr-))>:not(:last-child){margin-right:var(--base-size-8,.5rem)}:is(.prc-Button-ButtonBase-c50BI :where(.prc-Button-ButtonContent-HKbr-)):where([data-align=center]){justify-content:center}:is(.prc-Button-ButtonBase-c50BI :where(.prc-Button-ButtonContent-HKbr-)):where([data-align=start]){justify-content:flex-start}.prc-Button-ButtonBase-c50BI :where([data-component=leadingVisual]){grid-area:leadingVisual}.prc-Button-ButtonBase-c50BI :where(.prc-Button-Label-pTQ3x){grid-area:text;line-height:1.4285714;white-space:nowrap}.prc-Button-ButtonBase-c50BI :where([data-component=trailingVisual]){grid-area:trailingVisual}.prc-Button-ButtonBase-c50BI :where([data-component=trailingAction]){margin-right:calc(var(--base-size-4,.25rem)*-1)}.prc-Button-ButtonBase-c50BI:where([data-size=small]){font-size:var(--text-body-size-small,.75rem);gap:var(--control-small-gap,.25rem);height:var(--control-small-size,1.75rem);padding:0 var(--control-small-paddingInline-condensed,.5rem)}.prc-Button-ButtonBase-c50BI:where([data-size=small]) .prc-Button-ButtonContent-HKbr->:not(:last-child){margin-right:var(--control-small-gap,.25rem)}.prc-Button-ButtonBase-c50BI:where([data-size=small]) .prc-Button-Label-pTQ3x{line-height:1.6666667}.prc-Button-ButtonBase-c50BI:where([data-size=large]){gap:var(--control-large-gap,.5rem);height:var(--control-large-size,2.5rem);padding:0 var(--control-large-paddingInline-spacious,1rem)}.prc-Button-ButtonBase-c50BI:where([data-size=large]) .prc-Button-ButtonContent-HKbr->:not(:last-child){margin-right:var(--control-large-gap,.5rem)}.prc-Button-ButtonBase-c50BI:where([data-block=block]){width:100%}.prc-Button-ButtonBase-c50BI:where([data-label-wrap=true]){height:unset;min-height:var(--control-medium-size,2rem);min-width:-moz-fit-content;min-width:fit-content}.prc-Button-ButtonBase-c50BI:where([data-label-wrap=true]) .prc-Button-ButtonContent-HKbr-{align-self:stretch;flex:1 1 auto;padding-block:calc(var(--control-medium-paddingBlock,.375rem) - var(--base-size-2,.125rem))}.prc-Button-ButtonBase-c50BI:where([data-label-wrap=true]) .prc-Button-Label-pTQ3x{white-space:unset;word-break:break-word}.prc-Button-ButtonBase-c50BI:where([data-label-wrap=true]):where([data-size=small]){height:unset;min-height:var(--control-small-size,1.75rem)}.prc-Button-ButtonBase-c50BI:where([data-label-wrap=true]):where([data-size=small]) .prc-Button-ButtonContent-HKbr-{padding-block:calc(var(--control-small-paddingBlock,.25rem) - var(--base-size-2,.125rem))}.prc-Button-ButtonBase-c50BI:where([data-label-wrap=true]):where([data-size=large]){height:unset;min-height:var(--control-large-size,2.5rem);padding-inline:var(--control-large-paddingInline-spacious,1rem)}.prc-Button-ButtonBase-c50BI:where([data-label-wrap=true]):where([data-size=large]) .prc-Button-ButtonContent-HKbr-{padding-block:calc(var(--control-large-paddingBlock,.625rem) - var(--base-size-2,.125rem))}.prc-Button-ButtonBase-c50BI:where([data-loading=true]) .prc-Button-LoadingSpinner-hLV6o:not([data-component=leadingVisual],[data-component=trailingVisual],[data-component=trailingAction]){grid-area:text;margin-right:0!important;place-self:center}:is(.prc-Button-ButtonBase-c50BI:where([data-loading=true]) .prc-Button-LoadingSpinner-hLV6o:not([data-component=leadingVisual],[data-component=trailingVisual],[data-component=trailingAction]))+.prc-Button-Label-pTQ3x{visibility:hidden}.prc-Button-ButtonBase-c50BI .prc-Button-LoadingSpinner-hLV6o{align-items:center;display:flex;justify-content:center}.prc-Button-ButtonBase-c50BI:where([data-variant=default]){background-color:var(--button-default-bgColor-rest,var(--color-btn-bg));box-shadow:var(--button-default-shadow-resting,var(--color-btn-shadow));color:var(--button-default-fgColor-rest,var(--color-btn-text))}.prc-Button-ButtonBase-c50BI[aria-expanded=true]:where([data-variant=default]){background-color:var(--button-default-bgColor-active,var(--color-btn-active-bg));border-color:var(--button-default-borderColor-active,var(--color-btn-active-border))}.prc-Button-ButtonBase-c50BI:where([data-variant=default]):hover{background-color:var(--button-default-bgColor-hover,var(--color-btn-hover-bg));border-color:var(--button-default-borderColor-hover,var(--color-btn-hover-border))}.prc-Button-ButtonBase-c50BI:where([data-variant=default]):active{background-color:var(--button-default-bgColor-active,var(--color-btn-active-bg));border-color:var(--button-default-borderColor-active,var(--color-btn-active-border))}.prc-Button-ButtonBase-c50BI:where([data-variant=default]):disabled,.prc-Button-ButtonBase-c50BI[aria-disabled=true]:where([data-variant=default]):not([data-loading=true]){background-color:var(--button-default-bgColor-disabled,var(--color-btn-bg));border-color:var(--button-default-borderColor-disabled,var(--color-btn-border));box-shadow:none;color:var(--control-fgColor-disabled,var(--color-primer-fg-disabled))}.prc-Button-ButtonBase-c50BI:where([data-variant=default]) .prc-Button-CounterLabel-f5-4u{background-color:var(--buttonCounter-default-bgColor-rest,var(--color-btn-counter-bg))!important}.prc-Button-ButtonBase-c50BI:where([data-variant=default]):where(.prc-Button-IconButton-szpyj){color:var(--fgColor-muted,var(--color-fg-muted))}.prc-Button-ButtonBase-c50BI:where([data-variant=primary]){background-color:var(--button-primary-bgColor-rest,var(--color-btn-primary-bg));border-color:var(--button-primary-borderColor-rest,var(--color-btn-primary-border));box-shadow:var(--shadow-resting-small,var(--color-shadow-small));color:var(--button-primary-fgColor-rest,var(--color-btn-primary-text))}.prc-Button-ButtonBase-c50BI[aria-expanded=true]:where([data-variant=primary]){background-color:var(--button-primary-bgColor-active,var(--color-btn-primary-selected-bg));box-shadow:var(--button-primary-shadow-selected,var(--color-btn-primary-selected-shadow))}.prc-Button-ButtonBase-c50BI:where([data-variant=primary]):hover{background-color:var(--button-primary-bgColor-hover,var(--color-btn-primary-hover-bg));border-color:var(--button-primary-borderColor-hover,var(--color-btn-primary-hover-border))}.prc-Button-ButtonBase-c50BI:where([data-variant=primary]):focus-visible{box-shadow:inset 0 0 0 3px var(--fgColor-onEmphasis,var(--color-fg-on-emphasis));outline:2px solid var(--focus-outlineColor,var(--color-accent-fg));outline-offset:-2px}.prc-Button-ButtonBase-c50BI:where([data-variant=primary]):active{background-color:var(--button-primary-bgColor-active,var(--color-btn-primary-selected-bg));box-shadow:var(--button-primary-shadow-selected,var(--color-btn-primary-selected-shadow))}.prc-Button-ButtonBase-c50BI:where([data-variant=primary]):disabled,.prc-Button-ButtonBase-c50BI[aria-disabled=true]:where([data-variant=primary]):not([data-loading=true]){background-color:var(--button-primary-bgColor-disabled,var(--color-btn-primary-disabled-bg));border-color:var(--button-primary-borderColor-disabled,var(--color-btn-primary-disabled-border));box-shadow:none;color:var(--button-primary-fgColor-disabled,var(--color-btn-primary-disabled-text))}.prc-Button-ButtonBase-c50BI:where([data-variant=primary]) .prc-Button-CounterLabel-f5-4u{background-color:var(--buttonCounter-primary-bgColor-rest,var(--color-btn-primary-counter-bg))!important;color:var(--button-primary-fgColor-rest,var(--color-btn-primary-text))!important}.prc-Button-ButtonBase-c50BI:where([data-variant=primary]) .prc-Button-Visual-2epfX{color:var(--button-primary-fgColor-rest,var(--color-btn-primary-text))}.prc-Button-ButtonBase-c50BI:where([data-variant=danger]){background-color:var(--button-danger-bgColor-rest,var(--color-btn-bg));box-shadow:var(--button-default-shadow-resting,var(--color-btn-shadow));color:var(--button-danger-fgColor-rest,var(--color-btn-danger-text))}.prc-Button-ButtonBase-c50BI[aria-expanded=true]:where([data-variant=danger]){background-color:var(--button-danger-bgColor-active,var(--color-btn-danger-selected-bg));border-color:var(--button-danger-borderColor-active,var(--color-btn-danger-selected-border));box-shadow:var(--button-danger-shadow-selected,var(--color-btn-danger-selected-shadow));color:var(--button-danger-fgColor-active,var(--color-btn-danger-selected-text))}.prc-Button-ButtonBase-c50BI[aria-expanded=true]:where([data-variant=danger]) .prc-Button-Visual-2epfX{color:var(--button-danger-iconColor-hover,var(--color-btn-danger-hover-icon))}.prc-Button-ButtonBase-c50BI:where([data-variant=danger]):hover{background-color:var(--button-danger-bgColor-hover,var(--color-btn-danger-hover-bg));border-color:var(--button-danger-borderColor-hover,var(--color-btn-danger-hover-border));box-shadow:var(--shadow-resting-small,var(--color-shadow-small));color:var(--button-danger-fgColor-hover,var(--color-btn-danger-hover-text))}.prc-Button-ButtonBase-c50BI:where([data-variant=danger]):hover .prc-Button-CounterLabel-f5-4u{background-color:var(--buttonCounter-danger-bgColor-hover,var(--color-btn-danger-hover-counter-bg))!important;color:var(--buttonCounter-danger-fgColor-hover,var(--color-btn-danger-hover-counter-fg))!important}.prc-Button-ButtonBase-c50BI:where([data-variant=danger]):hover .prc-Button-Visual-2epfX{color:var(--button-danger-iconColor-hover,var(--color-btn-danger-hover-icon))}.prc-Button-ButtonBase-c50BI:where([data-variant=danger]):active{background-color:var(--button-danger-bgColor-active,var(--color-btn-danger-selected-bg));border-color:var(--button-danger-borderColor-active,var(--color-btn-danger-selected-border));box-shadow:var(--button-danger-shadow-selected,var(--color-btn-danger-selected-shadow));color:var(--button-danger-fgColor-active,var(--color-btn-danger-selected-text))}.prc-Button-ButtonBase-c50BI:where([data-variant=danger]):active .prc-Button-CounterLabel-f5-4u{background-color:var(--buttonCounter-danger-bgColor-hover,var(--color-btn-danger-hover-counter-bg))!important;color:var(--buttonCounter-danger-fgColor-hover,var(--color-btn-danger-hover-counter-fg))!important}.prc-Button-ButtonBase-c50BI:where([data-variant=danger]):active .prc-Button-Visual-2epfX{color:var(--button-danger-iconColor-hover,var(--color-btn-danger-hover-icon))}.prc-Button-ButtonBase-c50BI:where([data-variant=danger]):disabled,.prc-Button-ButtonBase-c50BI[aria-disabled=true]:where([data-variant=danger]):not([data-loading=true]){background-color:var(--button-danger-bgColor-disabled,var(--color-btn-danger-disabled-bg));border-color:var(--button-default-borderColor-disabled,var(--color-btn-border));box-shadow:none;color:var(--button-danger-fgColor-disabled,var(--color-btn-danger-disabled-text))}:is(.prc-Button-ButtonBase-c50BI:where([data-variant=danger]):disabled,.prc-Button-ButtonBase-c50BI[aria-disabled=true]:where([data-variant=danger]):not([data-loading=true])) .prc-Button-CounterLabel-f5-4u{background-color:var(--buttonCounter-danger-bgColor-disabled,var(--color-btn-danger-disabled-counter-bg))!important;color:var(--buttonCounter-danger-fgColor-disabled,var(--color-btn-danger-disabled-counter-fg))!important}.prc-Button-ButtonBase-c50BI:where([data-variant=danger]) .prc-Button-CounterLabel-f5-4u{background-color:var(--buttonCounter-danger-bgColor-rest,var(--color-btn-danger-counter-bg))!important;color:var(--buttonCounter-danger-fgColor-rest,var(--color-btn-danger-counter-fg))!important}.prc-Button-ButtonBase-c50BI:where([data-variant=danger]) .prc-Button-Visual-2epfX{color:var(--button-danger-iconColor-rest,var(--color-btn-danger-icon))}.prc-Button-ButtonBase-c50BI:where([data-variant=invisible]){border-color:transparent;box-shadow:none;color:var(--button-default-fgColor-rest,var(--color-btn-text))}.prc-Button-ButtonBase-c50BI[aria-expanded=true]:where([data-variant=invisible]){background-color:var(--button-invisible-bgColor-active,var(--color-action-list-item-default-active-bg))}.prc-Button-ButtonBase-c50BI:where([data-variant=invisible]):hover{background-color:var(--button-invisible-bgColor-hover,var(--color-action-list-item-default-hover-bg))}.prc-Button-ButtonBase-c50BI:where([data-variant=invisible]):hover .prc-Button-Visual-2epfX{color:var(--button-invisible-iconColor-hover,#59636e)}.prc-Button-ButtonBase-c50BI:where([data-variant=invisible]):active{background-color:var(--button-invisible-bgColor-active,var(--color-action-list-item-default-active-bg))}.prc-Button-ButtonBase-c50BI:where([data-variant=invisible]):active .prc-Button-Visual-2epfX{color:var(--button-invisible-iconColor-hover,#59636e)}.prc-Button-ButtonBase-c50BI:where([data-variant=invisible]):disabled,.prc-Button-ButtonBase-c50BI[aria-disabled=true]:where([data-variant=invisible]):not([data-loading=true]){background-color:var(--button-invisible-bgColor-disabled,var(--color-action-list-item-default-selected-bg));border-color:var(--button-invisible-borderColor-disabled,var(--color-action-list-item-default-selected-bg));box-shadow:none;color:var(--button-invisible-fgColor-disabled,var(--color-primer-fg-disabled))}.prc-Button-ButtonBase-c50BI:where([data-variant=invisible]) .prc-Button-Visual-2epfX{color:var(--button-invisible-iconColor-rest,#59636e)}.prc-Button-ButtonBase-c50BI:where([data-variant=invisible]) .prc-Button-CounterLabel-f5-4u{background-color:var(--buttonCounter-invisible-bgColor-rest,#818b981f)!important}.prc-Button-ButtonBase-c50BI:where([data-variant=invisible]):where(.prc-Button-IconButton-szpyj){color:var(--button-invisible-iconColor-rest,#59636e)}.prc-Button-ButtonBase-c50BI:where([data-variant=link]){border:unset;color:var(--fgColor-link,var(--color-accent-fg));display:inline-flex;font-size:inherit;height:unset;min-width:-moz-fit-content;min-width:fit-content;padding:0;text-align:left}.prc-Button-ButtonBase-c50BI:where([data-variant=link]):hover:not(:disabled,[data-inactive]){-webkit-text-decoration:underline;text-decoration:underline}.prc-Button-ButtonBase-c50BI:where([data-variant=link]):focus,.prc-Button-ButtonBase-c50BI:where([data-variant=link]):focus-visible{outline-offset:2px}.prc-Button-ButtonBase-c50BI:where([data-variant=link]):disabled,.prc-Button-ButtonBase-c50BI[aria-disabled=true]:where([data-variant=link]):not([data-loading=true]){background-color:transparent;border-color:transparent;color:var(--control-fgColor-disabled,var(--color-primer-fg-disabled))}.prc-Button-ButtonBase-c50BI:where([data-variant=link]) .prc-Button-Label-pTQ3x{white-space:unset}.prc-Button-ButtonBase-c50BI:where([data-variant=link]):where([data-inactive]){background:transparent!important;color:var(--button-inactive-fgColor,#59636e)}.prc-Button-ButtonBase-c50BI:where([data-variant=link]) .prc-Button-Visual-2epfX{color:var(--fgColor-link,var(--color-accent-fg))}.prc-Button-ButtonBase-c50BI:where([data-inactive]),.prc-Button-ButtonBase-c50BI:where([data-inactive]):active,.prc-Button-ButtonBase-c50BI:where([data-inactive]):hover{background-color:var(--button-inactive-bgColor,#e6eaef);border-color:var(--button-inactive-bgColor,#e6eaef);box-shadow:none;color:var(--button-inactive-fgColor,#59636e);cursor:auto}:is(.prc-Button-ButtonBase-c50BI:where([data-inactive]),.prc-Button-ButtonBase-c50BI:where([data-inactive]):hover,.prc-Button-ButtonBase-c50BI:where([data-inactive]):active) .prc-Button-CounterLabel-f5-4u,:is(.prc-Button-ButtonBase-c50BI:where([data-inactive]),.prc-Button-ButtonBase-c50BI:where([data-inactive]):hover,.prc-Button-ButtonBase-c50BI:where([data-inactive]):active) .prc-Button-Visual-2epfX{color:inherit!important}.prc-Button-ButtonBase-c50BI:where([data-has-count]):has([data-component=leadingVisual]):not(:has([data-component=text])){padding-inline:var(--control-medium-paddingInline-condensed,.5rem)}.prc-Button-ButtonBase-c50BI:where([data-has-count]):has([data-component=leadingVisual]):not(:has([data-component=text])):where([data-size=small]){padding-inline:var(--control-xsmall-paddingInline-condensed,.25rem)}.prc-Button-ButtonBase-c50BI:where([data-has-count]):has([data-component=leadingVisual]):not(:has([data-component=text])):where([data-size=large]){padding-inline:var(--control-large-paddingInline-normal,.75rem)}.prc-Button-ConditionalWrapper-WLT4Z{display:block}
|
|
2
|
-
/*# sourceMappingURL=ButtonBase-4c44bb02.css.map */
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/Button/ButtonBase.module.css","../../postcss-preset-primer/src/mixins/focusOutline.css","../../postcss-preset-primer/src/mixins/focusOutlineOnEmphasis.css"],"names":[],"mappings":"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","file":"ButtonBase-4c44bb02.css","sourcesContent":["/* Base styles */\n.ButtonBase {\n display: flex;\n min-width: max-content;\n height: var(--control-medium-size);\n /* stylelint-disable-next-line primer/spacing */\n padding: 0 var(--control-medium-paddingInline-normal);\n font-family: inherit;\n font-size: var(--text-body-size-medium);\n font-weight: var(--base-text-weight-medium);\n color: var(--button-default-fgColor-rest);\n text-align: center;\n text-decoration: none;\n cursor: pointer;\n user-select: none;\n background-color: transparent;\n border: var(--borderWidth-thin) solid;\n border-color: var(--button-default-borderColor-rest);\n border-radius: var(--borderRadius-medium);\n transition: 80ms cubic-bezier(0.65, 0, 0.35, 1);\n transition-property: color, fill, background-color, border-color;\n appearance: none;\n align-items: center;\n justify-content: space-between;\n gap: var(--base-size-8);\n\n &:hover {\n transition-duration: 80ms;\n }\n\n &:focus-visible {\n @mixin focusOutline;\n }\n\n &:active {\n transition: none;\n }\n\n &:disabled,\n &[aria-disabled='true']:not([data-loading='true']) {\n cursor: not-allowed;\n box-shadow: none;\n\n & .Visual,\n & .CounterLabel {\n color: inherit;\n }\n }\n\n @media (forced-colors: active) {\n &:focus {\n outline: solid 1px transparent;\n }\n }\n\n /* Visuals */\n & :where(.Visual) {\n display: flex;\n color: var(--fgColor-muted);\n pointer-events: none;\n }\n\n /* mostly for CounterLabel */\n & :where(.VisualWrap) {\n display: flex;\n pointer-events: none;\n }\n\n /* IconButton */\n\n &:where(.IconButton) {\n display: inline-grid;\n width: var(--control-medium-size);\n min-width: unset;\n /* stylelint-disable-next-line primer/spacing */\n padding: unset;\n place-content: center;\n flex-shrink: 0;\n\n &:where([data-size='small']) {\n width: var(--control-small-size);\n }\n\n &:where([data-size='large']) {\n width: var(--control-large-size);\n }\n }\n\n /* LinkButton */\n\n &:where([href]) {\n display: inline-flex;\n\n &:hover {\n text-decoration: none;\n }\n }\n\n /* Button layout */\n\n & :where(.ButtonContent) {\n flex: 1 0 auto;\n display: grid;\n grid-template-areas: 'leadingVisual text trailingVisual';\n grid-template-columns: min-content minmax(0, auto) min-content;\n align-items: center;\n align-content: center;\n\n & > :not(:last-child) {\n margin-right: var(--base-size-8);\n }\n\n /* Content alignment */\n\n &:where([data-align='center']) {\n justify-content: center;\n }\n\n &:where([data-align='start']) {\n justify-content: flex-start;\n }\n }\n\n & :where([data-component='leadingVisual']) {\n grid-area: leadingVisual;\n }\n\n & :where(.Label) {\n /* stylelint-disable-next-line primer/typography */\n line-height: 1.4285714; /* temporary until we use Text component with --text-body-lineHeight-medium */\n white-space: nowrap;\n grid-area: text;\n }\n\n & :where([data-component='trailingVisual']) {\n grid-area: trailingVisual;\n }\n\n & :where([data-component='trailingAction']) {\n margin-right: calc(var(--base-size-4) * -1);\n }\n\n /* Size */\n\n &:where([data-size='small']) {\n height: var(--control-small-size);\n /* stylelint-disable-next-line primer/spacing */\n padding: 0 var(--control-small-paddingInline-condensed);\n gap: var(--control-small-gap);\n font-size: var(--text-body-size-small);\n\n & .ButtonContent > :not(:last-child) {\n /* stylelint-disable-next-line primer/spacing */\n margin-right: var(--control-small-gap);\n }\n\n & .Label {\n /* stylelint-disable-next-line primer/typography */\n line-height: 1.6666667; /* temporary until we use Text component with --text-body-lineHeight-small */\n }\n }\n\n &:where([data-size='large']) {\n height: var(--control-large-size);\n /* stylelint-disable-next-line primer/spacing */\n padding: 0 var(--control-large-paddingInline-spacious);\n gap: var(--control-large-gap);\n\n & .ButtonContent > :not(:last-child) {\n /* stylelint-disable-next-line primer/spacing */\n margin-right: var(--control-large-gap);\n }\n }\n\n /* Full width */\n\n &:where([data-block='block']) {\n width: 100%;\n }\n\n /* Wrap label text */\n\n &:where([data-label-wrap='true']) {\n min-width: fit-content;\n height: unset;\n min-height: var(--control-medium-size);\n\n & .ButtonContent {\n flex: 1 1 auto;\n align-self: stretch;\n /* stylelint-disable-next-line primer/spacing */\n padding-block: calc(var(--control-medium-paddingBlock) - var(--base-size-2));\n }\n\n & .Label {\n /* stylelint-disable-next-line declaration-property-value-keyword-no-deprecated */\n word-break: break-word;\n white-space: unset;\n }\n\n &:where([data-size='small']) {\n height: unset;\n min-height: var(--control-small-size);\n\n & .ButtonContent {\n /* stylelint-disable-next-line primer/spacing */\n padding-block: calc(var(--control-small-paddingBlock) - var(--base-size-2));\n }\n }\n\n &:where([data-size='large']) {\n height: unset;\n min-height: var(--control-large-size);\n /* stylelint-disable-next-line primer/spacing */\n padding-inline: var(--control-large-paddingInline-spacious);\n\n & .ButtonContent {\n /* stylelint-disable-next-line primer/spacing */\n padding-block: calc(var(--control-large-paddingBlock) - var(--base-size-2));\n }\n }\n }\n\n /* Loading */\n\n /* only hide label if there's no leading/trailing visuals\n * move spinner to label spot if not leading/trailing visuals\n */\n\n &:where([data-loading='true']) {\n &\n .LoadingSpinner:not(\n [data-component='leadingVisual'],\n [data-component='trailingVisual'],\n [data-component='trailingAction']\n ) {\n grid-area: text;\n margin-right: 0 !important;\n place-self: center;\n\n & + .Label {\n visibility: hidden;\n }\n }\n }\n\n /* Styles for the spinner element displayed when the Button is in a loading state.\n * Ensures the spinner is centered within its container. */\n .LoadingSpinner {\n display: flex;\n align-items: center;\n justify-content: center;\n }\n\n /* Default Variant */\n\n &:where([data-variant='default']) {\n color: var(--button-default-fgColor-rest);\n background-color: var(--button-default-bgColor-rest);\n box-shadow: var(--button-default-shadow-resting);\n\n &[aria-expanded='true'] {\n background-color: var(--button-default-bgColor-active);\n border-color: var(--button-default-borderColor-active);\n }\n\n &:hover {\n background-color: var(--button-default-bgColor-hover);\n border-color: var(--button-default-borderColor-hover);\n }\n\n &:active {\n background-color: var(--button-default-bgColor-active);\n border-color: var(--button-default-borderColor-active);\n }\n\n &:disabled,\n &[aria-disabled='true']:not([data-loading='true']) {\n color: var(--control-fgColor-disabled);\n background-color: var(--button-default-bgColor-disabled);\n border-color: var(--button-default-borderColor-disabled);\n box-shadow: none;\n }\n\n & .CounterLabel {\n background-color: var(--buttonCounter-default-bgColor-rest) !important; /* temporarily override our own sx prop */\n }\n\n &:where(.IconButton) {\n color: var(--fgColor-muted);\n }\n }\n\n /* Primary variant */\n\n &:where([data-variant='primary']) {\n color: var(--button-primary-fgColor-rest);\n background-color: var(--button-primary-bgColor-rest);\n border-color: var(--button-primary-borderColor-rest);\n box-shadow: var(--shadow-resting-small);\n\n &[aria-expanded='true'] {\n background-color: var(--button-primary-bgColor-active);\n box-shadow: var(--button-primary-shadow-selected);\n }\n\n &:hover {\n background-color: var(--button-primary-bgColor-hover);\n border-color: var(--button-primary-borderColor-hover);\n }\n\n &:focus-visible {\n @mixin focusOutlineOnEmphasis;\n }\n\n &:active {\n background-color: var(--button-primary-bgColor-active);\n box-shadow: var(--button-primary-shadow-selected);\n }\n\n &:disabled,\n &[aria-disabled='true']:not([data-loading='true']) {\n color: var(--button-primary-fgColor-disabled);\n background-color: var(--button-primary-bgColor-disabled);\n border-color: var(--button-primary-borderColor-disabled);\n box-shadow: none;\n }\n\n & .CounterLabel {\n color: var(--button-primary-fgColor-rest) !important; /* temporarily override our own sx prop */\n background-color: var(--buttonCounter-primary-bgColor-rest) !important; /* temporarily override our own sx prop */\n }\n\n /* temporarily using the fgColor to match legacy and reduce visual changes- will eventually be iconColor */\n & .Visual {\n color: var(--button-primary-fgColor-rest);\n }\n }\n\n /* Danger variant */\n\n &:where([data-variant='danger']) {\n color: var(--button-danger-fgColor-rest);\n background-color: var(--button-danger-bgColor-rest);\n box-shadow: var(--button-default-shadow-resting);\n\n &[aria-expanded='true'] {\n color: var(--button-danger-fgColor-active);\n background-color: var(--button-danger-bgColor-active);\n border-color: var(--button-danger-borderColor-active);\n box-shadow: var(--button-danger-shadow-selected);\n\n & .Visual {\n color: var(--button-danger-iconColor-hover);\n }\n }\n\n &:hover {\n color: var(--button-danger-fgColor-hover);\n background-color: var(--button-danger-bgColor-hover);\n border-color: var(--button-danger-borderColor-hover);\n box-shadow: var(--shadow-resting-small);\n\n & .CounterLabel {\n color: var(--buttonCounter-danger-fgColor-hover) !important; /* temporarily override our own sx prop */\n background-color: var(--buttonCounter-danger-bgColor-hover) !important;\n }\n\n & .Visual {\n color: var(--button-danger-iconColor-hover);\n }\n }\n\n &:active {\n color: var(--button-danger-fgColor-active);\n background-color: var(--button-danger-bgColor-active);\n border-color: var(--button-danger-borderColor-active);\n box-shadow: var(--button-danger-shadow-selected);\n\n & .CounterLabel {\n color: var(--buttonCounter-danger-fgColor-hover) !important; /* temporarily override our own sx prop */\n background-color: var(--buttonCounter-danger-bgColor-hover) !important;\n }\n\n & .Visual {\n color: var(--button-danger-iconColor-hover);\n }\n }\n\n &:disabled,\n &[aria-disabled='true']:not([data-loading='true']) {\n color: var(--button-danger-fgColor-disabled);\n background-color: var(--button-danger-bgColor-disabled);\n border-color: var(--button-default-borderColor-disabled);\n box-shadow: none;\n\n & .CounterLabel {\n color: var(--buttonCounter-danger-fgColor-disabled) !important; /* temporarily override our own sx prop */\n background-color: var(--buttonCounter-danger-bgColor-disabled) !important;\n }\n }\n\n & .CounterLabel {\n color: var(--buttonCounter-danger-fgColor-rest) !important; /* temporarily override our own sx prop */\n background-color: var(--buttonCounter-danger-bgColor-rest) !important;\n }\n\n & .Visual {\n color: var(--button-danger-iconColor-rest);\n }\n }\n\n /* Invisible variant */\n\n &:where([data-variant='invisible']) {\n color: var(--button-default-fgColor-rest);\n border-color: transparent;\n box-shadow: none;\n\n &[aria-expanded='true'] {\n background-color: var(--button-invisible-bgColor-active);\n }\n\n &:hover {\n background-color: var(--button-invisible-bgColor-hover);\n\n & .Visual {\n color: var(--button-invisible-iconColor-hover);\n }\n }\n\n &:active {\n background-color: var(--button-invisible-bgColor-active);\n\n & .Visual {\n color: var(--button-invisible-iconColor-hover);\n }\n }\n\n &:disabled,\n &[aria-disabled='true']:not([data-loading='true']) {\n color: var(--button-invisible-fgColor-disabled);\n background-color: var(--button-invisible-bgColor-disabled);\n border-color: var(--button-invisible-borderColor-disabled);\n box-shadow: none;\n }\n\n & .Visual {\n color: var(--button-invisible-iconColor-rest);\n }\n\n & .CounterLabel {\n background-color: var(--buttonCounter-invisible-bgColor-rest) !important;\n }\n\n &:where(.IconButton) {\n color: var(--button-invisible-iconColor-rest);\n }\n }\n\n /* Link variant */\n\n &:where([data-variant='link']) {\n display: inline-flex;\n min-width: fit-content;\n height: unset;\n padding: 0;\n font-size: inherit;\n color: var(--fgColor-link);\n text-align: left;\n border: unset;\n\n &:hover:not(:disabled, [data-inactive]) {\n text-decoration: underline;\n }\n\n &:focus-visible,\n &:focus {\n outline-offset: 2px;\n }\n\n &:disabled,\n &[aria-disabled='true']:not([data-loading='true']) {\n color: var(--control-fgColor-disabled);\n background-color: transparent;\n border-color: transparent;\n }\n\n & .Label {\n white-space: unset;\n }\n\n &:where([data-inactive]) {\n color: var(--button-inactive-fgColor);\n background: transparent !important;\n }\n\n & .Visual {\n color: var(--fgColor-link);\n }\n }\n\n /* Inactive */\n\n &:where([data-inactive]),\n &:where([data-inactive]):hover,\n &:where([data-inactive]):active {\n color: var(--button-inactive-fgColor);\n cursor: auto;\n background-color: var(--button-inactive-bgColor);\n /* stylelint-disable-next-line primer/colors */\n border-color: var(--button-inactive-bgColor);\n box-shadow: none;\n\n & .Visual,\n & .CounterLabel {\n color: inherit !important;\n }\n }\n\n /* Icon-only + Counter */\n\n &:where([data-has-count]):has([data-component='leadingVisual']):not(:has([data-component='text'])) {\n /* stylelint-disable-next-line primer/spacing */\n padding-inline: var(--control-medium-paddingInline-condensed);\n\n &:where([data-size='small']) {\n /* stylelint-disable-next-line primer/spacing */\n padding-inline: var(--control-xsmall-paddingInline-condensed);\n }\n\n &:where([data-size='large']) {\n /* stylelint-disable-next-line primer/spacing */\n padding-inline: var(--control-large-paddingInline-normal);\n }\n }\n}\n\n.ConditionalWrapper {\n display: block;\n}\n","@define-mixin focusOutline $outlineOffset: -2px, $outlineColor: var(--focus-outlineColor) {\n outline: 2px solid $outlineColor;\n outline-offset: $outlineOffset;\n box-shadow: none;\n}\n","/* outline with fg box-shadow for buttons */\n@define-mixin focusOutlineOnEmphasis $outlineOffset: -2px, $outlineColor: var(--focus-outlineColor) {\n outline: 2px solid $outlineColor;\n outline-offset: $outlineOffset;\n /* stylelint-disable-next-line primer/box-shadow */\n box-shadow: inset 0 0 0 3px var(--fgColor-onEmphasis);\n}\n"]}
|