@primer/react 38.0.0-rc.4 → 38.0.0-rc.5
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 +58 -0
- package/dist/ActionList/Item.d.ts +47 -4
- package/dist/ActionList/Item.d.ts.map +1 -1
- package/dist/ActionList/Item.js +11 -3
- package/dist/ActionList/List.d.ts +23 -3
- package/dist/ActionList/List.d.ts.map +1 -1
- package/dist/ActionList/List.js +20 -13
- package/dist/ActionList/index.d.ts +67 -2
- package/dist/ActionList/index.d.ts.map +1 -1
- package/dist/ActionList/shared.d.ts +12 -6
- package/dist/ActionList/shared.d.ts.map +1 -1
- package/dist/ActionList/shared.js +3 -0
- package/dist/Autocomplete/Autocomplete.d.ts +1 -1
- package/dist/Autocomplete/AutocompleteMenu.d.ts.map +1 -1
- package/dist/Autocomplete/AutocompleteMenu.js +2 -2
- package/dist/Avatar/Avatar.d.ts +2 -3
- package/dist/Avatar/Avatar.d.ts.map +1 -1
- package/dist/Avatar/Avatar.js +38 -46
- package/dist/Breadcrumbs/Breadcrumbs.d.ts +15 -12
- package/dist/Breadcrumbs/Breadcrumbs.d.ts.map +1 -1
- package/dist/Breadcrumbs/Breadcrumbs.js +35 -34
- package/dist/Button/ButtonBase.d.ts.map +1 -1
- package/dist/Button/ButtonBase.js +8 -4
- package/dist/CheckboxGroup/CheckboxGroup.d.ts +1 -1
- package/dist/CheckboxGroup/CheckboxGroup.d.ts.map +1 -1
- package/dist/CheckboxGroup/index.d.ts +1 -1
- package/dist/CheckboxGroup/index.d.ts.map +1 -1
- package/dist/CircleBadge/CircleBadge-87549d20.css +2 -0
- package/dist/CircleBadge/CircleBadge-87549d20.css.map +1 -0
- package/dist/CircleBadge/CircleBadge.d.ts +14 -14
- package/dist/CircleBadge/CircleBadge.d.ts.map +1 -1
- package/dist/CircleBadge/CircleBadge.js +69 -13
- package/dist/CircleBadge/CircleBadge.module.css.js +5 -0
- package/dist/DataTable/{Table-87f4043f.css → Table-7f5cb3e4.css} +2 -2
- package/dist/DataTable/Table-7f5cb3e4.css.map +1 -0
- package/dist/DataTable/Table.js +1 -1
- package/dist/DataTable/Table.module.css.js +2 -2
- package/dist/Dialog/{Dialog-8a809d11.css → Dialog-1a61e61a.css} +2 -2
- package/dist/Dialog/Dialog-1a61e61a.css.map +1 -0
- package/dist/Dialog/Dialog.d.ts +6 -12
- package/dist/Dialog/Dialog.d.ts.map +1 -1
- package/dist/Dialog/Dialog.js +11 -26
- package/dist/Dialog/Dialog.module.css.js +2 -2
- package/dist/DialogV1/Dialog.d.ts +13 -11
- package/dist/DialogV1/Dialog.d.ts.map +1 -1
- package/dist/DialogV1/Dialog.js +71 -63
- package/dist/FormControl/FormControl.d.ts +6 -1
- package/dist/FormControl/FormControl.d.ts.map +1 -1
- package/dist/FormControl/FormControl.js +4 -1
- package/dist/FormControl/FormControlCaption.d.ts +2 -1
- package/dist/FormControl/FormControlCaption.d.ts.map +1 -1
- package/dist/FormControl/FormControlCaption.js +12 -9
- package/dist/FormControl/FormControlLabel.d.ts +1 -0
- package/dist/FormControl/FormControlLabel.d.ts.map +1 -1
- package/dist/FormControl/FormControlLeadingVisual.d.ts +3 -1
- package/dist/FormControl/FormControlLeadingVisual.d.ts.map +1 -1
- package/dist/FormControl/FormControlLeadingVisual.js +11 -8
- package/dist/FormControl/_FormControlValidation.d.ts +1 -0
- package/dist/FormControl/_FormControlValidation.d.ts.map +1 -1
- package/dist/FormControl/_FormControlValidation.js +11 -8
- package/dist/Heading/Heading.d.ts +4 -4
- package/dist/Heading/Heading.d.ts.map +1 -1
- package/dist/Heading/Heading.js +0 -11
- package/dist/KeybindingHint/components/Chord-81099645.css +2 -0
- package/dist/KeybindingHint/components/Chord-81099645.css.map +1 -0
- package/dist/KeybindingHint/components/Chord.d.ts.map +1 -1
- package/dist/KeybindingHint/components/Chord.js +44 -68
- package/dist/KeybindingHint/components/Chord.module.css.js +5 -0
- package/dist/Label/Label.d.ts +1 -3
- package/dist/Label/Label.d.ts.map +1 -1
- package/dist/Label/Label.js +37 -69
- package/dist/Label/index.d.ts +0 -1
- package/dist/Label/index.d.ts.map +1 -1
- package/dist/LabelGroup/LabelGroup-eda75c0f.css +2 -0
- package/dist/LabelGroup/LabelGroup-eda75c0f.css.map +1 -0
- package/dist/LabelGroup/LabelGroup.d.ts.map +1 -1
- package/dist/LabelGroup/LabelGroup.js +4 -10
- package/dist/LabelGroup/LabelGroup.module.css.js +5 -0
- package/dist/Link/Link-e01bdaee.css +2 -0
- package/dist/Link/Link-e01bdaee.css.map +1 -0
- package/dist/Link/Link.d.ts +11 -5
- package/dist/Link/Link.d.ts.map +1 -1
- package/dist/Link/Link.js +21 -29
- package/dist/Link/Link.module.css.js +1 -1
- package/dist/NavList/NavList-5dc067e3.css +2 -0
- package/dist/NavList/NavList-5dc067e3.css.map +1 -0
- package/dist/NavList/NavList.d.ts +4 -5
- package/dist/NavList/NavList.d.ts.map +1 -1
- package/dist/NavList/NavList.js +214 -420
- package/dist/NavList/NavList.module.css.js +5 -0
- package/dist/Overlay/Overlay.d.ts +1 -2
- package/dist/Overlay/Overlay.d.ts.map +1 -1
- package/dist/Overlay/Overlay.js +2 -3
- package/dist/Pagination/{Pagination-e98833e8.css → Pagination-1845feaa.css} +2 -2
- package/dist/Pagination/Pagination-1845feaa.css.map +1 -0
- package/dist/Pagination/Pagination.d.ts +1 -2
- package/dist/Pagination/Pagination.d.ts.map +1 -1
- package/dist/Pagination/Pagination.js +5 -13
- package/dist/Pagination/Pagination.module.css.js +1 -1
- package/dist/Placeholder.d.ts.map +1 -1
- package/dist/Popover/Popover.d.ts +0 -3
- package/dist/Popover/Popover.d.ts.map +1 -1
- package/dist/ScrollableRegion/ScrollableRegion-c1018dbe.css +2 -0
- package/dist/ScrollableRegion/ScrollableRegion-c1018dbe.css.map +1 -0
- package/dist/ScrollableRegion/ScrollableRegion.d.ts +1 -1
- package/dist/ScrollableRegion/ScrollableRegion.d.ts.map +1 -1
- package/dist/ScrollableRegion/ScrollableRegion.js +37 -31
- package/dist/ScrollableRegion/ScrollableRegion.module.css.js +5 -0
- package/dist/SelectPanel/SelectPanel.d.ts.map +1 -1
- package/dist/SelectPanel/SelectPanel.js +20 -1
- package/dist/Skeleton/SkeletonBox.js +2 -2
- package/dist/SkeletonAvatar/SkeletonAvatar.js +2 -2
- package/dist/StateLabel/{StateLabel-50420ff5.css → StateLabel-aaa1d148.css} +2 -2
- package/dist/StateLabel/{StateLabel-50420ff5.css.map → StateLabel-aaa1d148.css.map} +1 -1
- package/dist/StateLabel/StateLabel.module.css.js +1 -1
- package/dist/TabNav/TabNav.d.ts +4 -6
- package/dist/TabNav/TabNav.d.ts.map +1 -1
- package/dist/TabNav/TabNav.js +5 -7
- package/dist/Text/Text.d.ts +1 -2
- package/dist/Text/Text.d.ts.map +1 -1
- package/dist/Text/Text.js +1 -3
- package/dist/TextInput/TextInput.d.ts +1 -1
- package/dist/TextInputWithTokens/{TextInputWithTokens-fb9b5109.css → TextInputWithTokens-946ead3e.css} +2 -2
- package/dist/TextInputWithTokens/TextInputWithTokens-946ead3e.css.map +1 -0
- package/dist/TextInputWithTokens/TextInputWithTokens.d.ts.map +1 -1
- package/dist/TextInputWithTokens/TextInputWithTokens.js +6 -7
- package/dist/TextInputWithTokens/TextInputWithTokens.module.css.js +2 -2
- package/dist/ThemeProvider.js +3 -3
- package/dist/Token/Token.d.ts +1 -2
- package/dist/Token/Token.d.ts.map +1 -1
- package/dist/Token/TokenBase.d.ts +1 -2
- package/dist/Token/TokenBase.d.ts.map +1 -1
- package/dist/Token/TokenBase.js +64 -63
- package/dist/Token/_RemoveTokenButton.d.ts +1 -2
- package/dist/Token/_RemoveTokenButton.d.ts.map +1 -1
- package/dist/Token/_RemoveTokenButton.js +38 -104
- package/dist/Token/_TokenTextContainer.d.ts +1 -1
- package/dist/Token/_TokenTextContainer.d.ts.map +1 -1
- package/dist/Token/_TokenTextContainer.js +40 -20
- package/dist/Tooltip/Tooltip.d.ts +1 -2
- package/dist/Tooltip/Tooltip.d.ts.map +1 -1
- package/dist/Tooltip/Tooltip.js +1 -2
- package/dist/TooltipV2/Tooltip.d.ts +16 -3
- package/dist/TooltipV2/Tooltip.d.ts.map +1 -1
- package/dist/TooltipV2/Tooltip.js +15 -5
- package/dist/UnderlineNav/UnderlineNav.js +2 -2
- package/dist/_VisuallyHidden.d.ts +5 -5
- package/dist/_VisuallyHidden.d.ts.map +1 -1
- package/dist/_VisuallyHidden.js +30 -32
- package/dist/experimental/UnderlinePanels/UnderlinePanels.d.ts +1 -2
- package/dist/experimental/UnderlinePanels/UnderlinePanels.d.ts.map +1 -1
- package/dist/experimental/UnderlinePanels/UnderlinePanels.js +28 -13
- package/dist/hooks/useMnemonics.d.ts +1 -0
- package/dist/hooks/useMnemonics.d.ts.map +1 -1
- package/dist/hooks/useMnemonics.js +99 -57
- package/dist/index.d.ts +2 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupCaption.js +1 -3
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupLabel.d.ts +1 -2
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupLabel.d.ts.map +1 -1
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupLabel.js +1 -3
- package/dist/internal/components/ConditionalWrapper.d.ts +2 -3
- package/dist/internal/components/ConditionalWrapper.d.ts.map +1 -1
- package/dist/internal/components/ConditionalWrapper.js +21 -18
- package/dist/internal/components/{InputValidation-057236a4.css → InputValidation-dddeaafd.css} +2 -2
- package/dist/internal/components/{InputValidation-057236a4.css.map → InputValidation-dddeaafd.css.map} +1 -1
- package/dist/internal/components/InputValidation.d.ts +1 -0
- package/dist/internal/components/InputValidation.d.ts.map +1 -1
- package/dist/internal/components/InputValidation.js +4 -4
- package/dist/internal/components/InputValidation.module.css.js +1 -1
- package/dist/internal/components/TextInputInnerAction.d.ts +1 -1
- package/dist/internal/components/UnderlineTabbedInterface.d.ts +11 -12
- package/dist/internal/components/UnderlineTabbedInterface.d.ts.map +1 -1
- package/dist/internal/components/UnderlineTabbedInterface.js +68 -63
- package/dist/internal/components/ValidationAnimationContainer.d.ts.map +1 -1
- package/dist/internal/components/ValidationAnimationContainer.js +5 -4
- package/dist/live-region/Announce.d.ts +2 -2
- package/dist/live-region/Announce.d.ts.map +1 -1
- package/dist/live-region/AriaAlert.d.ts +3 -3
- package/dist/live-region/AriaAlert.d.ts.map +1 -1
- package/dist/live-region/AriaAlert.js +14 -33
- package/dist/live-region/AriaStatus.d.ts +3 -3
- package/dist/live-region/AriaStatus.d.ts.map +1 -1
- package/dist/live-region/AriaStatus.js +14 -33
- package/dist/utils/modern-polymorphic.d.ts +22 -0
- package/dist/utils/modern-polymorphic.d.ts.map +1 -0
- package/dist/utils/modern-polymorphic.js +26 -0
- package/generated/components.json +4 -98
- package/package.json +7 -7
- package/dist/DataTable/Table-87f4043f.css.map +0 -1
- package/dist/Dialog/Dialog-8a809d11.css.map +0 -1
- package/dist/Link/Link-948b910e.css +0 -2
- package/dist/Link/Link-948b910e.css.map +0 -1
- package/dist/Pagination/Pagination-e98833e8.css.map +0 -1
- package/dist/TextInputWithTokens/TextInputWithTokens-fb9b5109.css.map +0 -1
- package/dist/utils/polymorphic2.d.ts +0 -16
- package/dist/utils/polymorphic2.d.ts.map +0 -1
|
@@ -2,7 +2,6 @@ import type { ComponentPropsWithRef } from 'react';
|
|
|
2
2
|
import React from 'react';
|
|
3
3
|
import type { AriaRole, Merge } from '../utils/types';
|
|
4
4
|
import type { TouchOrMouseEvent } from '../hooks';
|
|
5
|
-
import type { SxProp } from '../sx';
|
|
6
5
|
import type { AnchorSide } from '@primer/behaviors';
|
|
7
6
|
import type { ForwardRefComponent as PolymorphicForwardRefComponent } from '../utils/polymorphic';
|
|
8
7
|
type StyledOverlayProps = {
|
|
@@ -13,7 +12,7 @@ type StyledOverlayProps = {
|
|
|
13
12
|
visibility?: 'visible' | 'hidden';
|
|
14
13
|
overflow?: 'auto' | 'hidden' | 'scroll' | 'visible';
|
|
15
14
|
style?: React.CSSProperties;
|
|
16
|
-
}
|
|
15
|
+
};
|
|
17
16
|
export declare const heightMap: {
|
|
18
17
|
xsmall: string;
|
|
19
18
|
small: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Overlay.d.ts","sourceRoot":"","sources":["../../src/Overlay/Overlay.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,qBAAqB,EAAe,MAAM,OAAO,CAAA;AAC9D,OAAO,KAA0B,MAAM,OAAO,CAAA;AAG9C,OAAO,KAAK,EAAC,QAAQ,EAAE,KAAK,EAAC,MAAM,gBAAgB,CAAA;AACnD,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,UAAU,CAAA;
|
|
1
|
+
{"version":3,"file":"Overlay.d.ts","sourceRoot":"","sources":["../../src/Overlay/Overlay.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,qBAAqB,EAAe,MAAM,OAAO,CAAA;AAC9D,OAAO,KAA0B,MAAM,OAAO,CAAA;AAG9C,OAAO,KAAK,EAAC,QAAQ,EAAE,KAAK,EAAC,MAAM,gBAAgB,CAAA;AACnD,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,UAAU,CAAA;AAI/C,OAAO,KAAK,EAAC,UAAU,EAAC,MAAM,mBAAmB,CAAA;AAEjD,OAAO,KAAK,EAAC,mBAAmB,IAAI,8BAA8B,EAAC,MAAM,sBAAsB,CAAA;AAK/F,KAAK,kBAAkB,GAAG;IACxB,KAAK,CAAC,EAAE,MAAM,OAAO,QAAQ,CAAA;IAC7B,MAAM,CAAC,EAAE,MAAM,OAAO,SAAS,CAAA;IAC/B,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC,OAAO,SAAS,EAAE,MAAM,GAAG,SAAS,CAAC,CAAA;IAC5D,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC,OAAO,QAAQ,EAAE,MAAM,CAAC,CAAA;IAC9C,UAAU,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAA;IACjC,QAAQ,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,QAAQ,GAAG,SAAS,CAAA;IACnD,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;CAC5B,CAAA;AAED,eAAO,MAAM,SAAS;;;;;;;;;CASrB,CAAA;AAGD,QAAA,MAAM,QAAQ;;;;;;;CAOb,CAAA;AAiBD,KAAK,gBAAgB,GAAG;IACtB,UAAU,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAA;IACjC,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,QAAQ,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,UAAU,CAAC,CAAA;IAC1C,GAAG,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,KAAK,CAAC,CAAA;IAChC,IAAI,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,MAAM,CAAC,CAAA;IAClC,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,OAAO,CAAC,CAAA;IACpC,MAAM,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAA;IACtC,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,iBAAiB,CAAC,EAAE,YAAY,CAAA;CACjC,CAAA;AAED,KAAK,eAAe,GAAG,KAAK,CAAC,kBAAkB,EAAE,gBAAgB,CAAC,CAAA;AAElE;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,WAAW,EA8CnB,8BAA8B,CAAC,KAAK,EAAE,eAAe,CAAC,CAAA;AAE3D,KAAK,cAAc,GAAG;IACpB,UAAU,CAAC,EAAE,UAAU,CAAA;IACvB,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,EAAE,CAAA;IAChD,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAA;IAC9C,cAAc,EAAE,CAAC,CAAC,EAAE,iBAAiB,KAAK,IAAI,CAAA;IAC9C,QAAQ,EAAE,CAAC,CAAC,EAAE,aAAa,KAAK,IAAI,CAAA;IACpC,mBAAmB,CAAC,EAAE,MAAM,CAAA;IAC5B,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,kBAAkB,CAAC,EAAE,OAAO,CAAA;IAC5B,cAAc,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAA;CAC7C,CAAA;AAED,KAAK,oBAAoB,GAAG,KAAK,CAAC,eAAe,EAAE,cAAc,CAAC,CAAA;AAElE;;;;;;;;;;;;;;;GAeG;AACH,QAAA,MAAM,OAAO,EAkFR,8BAA8B,CAAC,KAAK,EAAE,oBAAoB,CAAC,CAAA;AAEhE,MAAM,MAAM,YAAY,GAAG,qBAAqB,CAAC,OAAO,OAAO,CAAC,CAAA;AAEhE,eAAe,OAAO,CAAA"}
|
package/dist/Overlay/Overlay.js
CHANGED
|
@@ -7,7 +7,6 @@ import { useRefObjectAsForwardedRef } from '../hooks/useRefObjectAsForwardedRef.
|
|
|
7
7
|
import { useTheme } from '../ThemeProvider.js';
|
|
8
8
|
import classes from './Overlay.module.css.js';
|
|
9
9
|
import { clsx } from 'clsx';
|
|
10
|
-
import { BoxWithFallback } from '../internal/components/BoxWithFallback.js';
|
|
11
10
|
import { jsx } from 'react/jsx-runtime';
|
|
12
11
|
import { useOverlay } from '../hooks/useOverlay.js';
|
|
13
12
|
import { useFeatureFlag } from '../FeatureFlags/useFeatureFlag.js';
|
|
@@ -77,10 +76,10 @@ const BaseOverlay = /*#__PURE__*/React.forwardRef(({
|
|
|
77
76
|
className,
|
|
78
77
|
maxHeight,
|
|
79
78
|
maxWidth,
|
|
79
|
+
as: Component = 'div',
|
|
80
80
|
...rest
|
|
81
81
|
}, forwardedRef) => {
|
|
82
|
-
return /*#__PURE__*/jsx(
|
|
83
|
-
as: "div",
|
|
82
|
+
return /*#__PURE__*/jsx(Component, {
|
|
84
83
|
...rest,
|
|
85
84
|
ref: forwardedRef,
|
|
86
85
|
style: {
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
.prc-Pagination-Page-yoEQf{background-color:transparent;border-radius:var(--borderRadius-medium,.375rem);color:var(--fgColor-default,var(--color-fg-default));cursor:pointer;display:inline-block;font-style:normal;height:32px;line-height:1;margin-right:var(--base-size-4,.25rem);min-width:32px;padding:var(--base-size-8,.5rem) calc((var(--base-size-32,2rem) - var(--base-size-20,1.25rem))/2);text-align:center;-webkit-text-decoration:none;text-decoration:none;transition:background-color .2s cubic-bezier(.3,0,.5,1);-webkit-user-select:none;user-select:none;vertical-align:middle;white-space:nowrap}@supports (clip-path:polygon(50% 0,100% 50%,50% 100%)){.prc-Pagination-Page-yoEQf[rel=next]:after,.prc-Pagination-Page-yoEQf[rel=prev]:before{background-color:currentColor;content:"";display:inline-block;height:16px;vertical-align:text-bottom;width:16px}.prc-Pagination-Page-yoEQf[rel=prev]:before{clip-path:polygon(9.8px 12.8px,8.7px 12.8px,4.5px 8.5px,4.5px 7.5px,8.7px 3.2px,9.8px 4.3px,6.1px 8px,9.8px 11.7px,9.8px 12.8px);margin-right:var(--base-size-4,.25rem)}.prc-Pagination-Page-yoEQf[rel=next]:after{clip-path:polygon(6.2px 3.2px,7.3px 3.2px,11.5px 7.5px,11.5px 8.5px,7.3px 12.8px,6.2px 11.7px,9.9px 8px,6.2px 4.3px,6.2px 3.2px);margin-left:var(--base-size-4,.25rem)}}.prc-Pagination-Page-yoEQf:last-child{margin-right:0}.prc-Pagination-Page-yoEQf:focus,.prc-Pagination-Page-yoEQf:hover{background-color:var(--control-transparent-bgColor-hover,var(--color-action-list-item-default-hover-bg));outline:0;-webkit-text-decoration:none;text-decoration:none;transition-duration:.1s}.prc-Pagination-Page-yoEQf:focus-visible{outline:2px solid var(--bgColor-accent-emphasis,var(--color-accent-emphasis));outline-offset:-2px}.prc-Pagination-Page-yoEQf:active{border-color:var(--borderColor-muted,var(--color-border-muted))}.prc-Pagination-Page-yoEQf[rel=next],.prc-Pagination-Page-yoEQf[rel=prev]{color:var(--fgColor-accent,var(--color-accent-fg))}.prc-Pagination-Page-yoEQf[aria-current],.prc-Pagination-Page-yoEQf[aria-current]:hover{background-color:var(--bgColor-accent-emphasis,var(--color-accent-emphasis));border-color:transparent;color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-Pagination-Page-yoEQf[aria-current]:focus-visible{box-shadow:inset 0 0 0 3px var(--fgColor-onEmphasis,var(--color-fg-on-emphasis));outline:2px solid var(--bgColor-accent-emphasis,var(--color-accent-emphasis));outline-offset:-2px}.prc-Pagination-Page-yoEQf[aria-hidden],.prc-Pagination-Page-yoEQf[aria-hidden]:hover,.prc-Pagination-Page-yoEQf[role=presentation],.prc-Pagination-Page-yoEQf[role=presentation]:hover{background-color:transparent;color:var(--fgColor-disabled,var(--color-primer-fg-disabled));cursor:default}.prc-Pagination-PaginationContainer-yNDPO{margin-bottom:15px;margin-top:20px;text-align:center}@media screen and (max-width:calc(48rem - 0.02px)){.prc-Pagination-TablePaginationSteps-RRjtg[data-hidden-viewport-ranges*=narrow]>:not(:first-child):not(:last-child){display:none}.prc-Pagination-TablePaginationSteps-RRjtg[data-hidden-viewport-ranges*=narrow]>:first-child{margin-inline-end:0}.prc-Pagination-TablePaginationSteps-RRjtg[data-hidden-viewport-ranges*=narrow]>:last-child{margin-inline-start:0}}@media screen and (min-width:48rem){.prc-Pagination-TablePaginationSteps-RRjtg[data-hidden-viewport-ranges*=regular]>:not(:first-child):not(:last-child){display:none}.prc-Pagination-TablePaginationSteps-RRjtg[data-hidden-viewport-ranges*=regular]>:first-child{margin-inline-end:0}.prc-Pagination-TablePaginationSteps-RRjtg[data-hidden-viewport-ranges*=regular]>:last-child{margin-inline-start:0}}@media screen and (min-width:87.5rem){.prc-Pagination-TablePaginationSteps-RRjtg[data-hidden-viewport-ranges*=wide]>:not(:first-child):not(:last-child){display:none}.prc-Pagination-TablePaginationSteps-RRjtg[data-hidden-viewport-ranges*=wide]>:first-child{margin-inline-end:0}.prc-Pagination-TablePaginationSteps-RRjtg[data-hidden-viewport-ranges*=wide]>:last-child{margin-inline-start:0}}
|
|
2
|
-
/*# sourceMappingURL=Pagination-
|
|
1
|
+
.prc-Pagination-Page-yoEQf{background-color:transparent;border-radius:var(--borderRadius-medium,.375rem);color:var(--fgColor-default,var(--color-fg-default));cursor:pointer;display:inline-block;font-style:normal;height:32px;line-height:1;margin-right:var(--base-size-4,.25rem);min-width:32px;padding:var(--base-size-8,.5rem) calc((var(--base-size-32,2rem) - var(--base-size-20,1.25rem))/2);text-align:center;-webkit-text-decoration:none;text-decoration:none;transition:background-color .2s cubic-bezier(.3,0,.5,1);-webkit-user-select:none;user-select:none;vertical-align:middle;white-space:nowrap}@supports (clip-path:polygon(50% 0,100% 50%,50% 100%)){.prc-Pagination-Page-yoEQf[rel=next]:after,.prc-Pagination-Page-yoEQf[rel=prev]:before{background-color:currentColor;content:"";display:inline-block;height:16px;vertical-align:text-bottom;width:16px}.prc-Pagination-Page-yoEQf[rel=prev]:before{clip-path:polygon(9.8px 12.8px,8.7px 12.8px,4.5px 8.5px,4.5px 7.5px,8.7px 3.2px,9.8px 4.3px,6.1px 8px,9.8px 11.7px,9.8px 12.8px);margin-right:var(--base-size-4,.25rem)}.prc-Pagination-Page-yoEQf[rel=next]:after{clip-path:polygon(6.2px 3.2px,7.3px 3.2px,11.5px 7.5px,11.5px 8.5px,7.3px 12.8px,6.2px 11.7px,9.9px 8px,6.2px 4.3px,6.2px 3.2px);margin-left:var(--base-size-4,.25rem)}}.prc-Pagination-Page-yoEQf:last-child{margin-right:0}.prc-Pagination-Page-yoEQf:focus,.prc-Pagination-Page-yoEQf:hover{background-color:var(--control-transparent-bgColor-hover,var(--color-action-list-item-default-hover-bg));outline:0;-webkit-text-decoration:none;text-decoration:none;transition-duration:.1s}.prc-Pagination-Page-yoEQf:focus-visible{outline:2px solid var(--bgColor-accent-emphasis,var(--color-accent-emphasis));outline-offset:-2px}.prc-Pagination-Page-yoEQf:active{border-color:var(--borderColor-muted,var(--color-border-muted))}.prc-Pagination-Page-yoEQf[rel=next],.prc-Pagination-Page-yoEQf[rel=prev]{color:var(--fgColor-accent,var(--color-accent-fg))}.prc-Pagination-Page-yoEQf[aria-current],.prc-Pagination-Page-yoEQf[aria-current]:hover{background-color:var(--bgColor-accent-emphasis,var(--color-accent-emphasis));border-color:transparent;color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-Pagination-Page-yoEQf[aria-current]:focus-visible{box-shadow:inset 0 0 0 3px var(--fgColor-onEmphasis,var(--color-fg-on-emphasis));outline:2px solid var(--bgColor-accent-emphasis,var(--color-accent-emphasis));outline-offset:-2px}.prc-Pagination-Page-yoEQf[aria-hidden],.prc-Pagination-Page-yoEQf[aria-hidden]:hover,.prc-Pagination-Page-yoEQf[role=presentation],.prc-Pagination-Page-yoEQf[role=presentation]:hover{background-color:transparent;color:var(--fgColor-disabled,var(--color-primer-fg-disabled));cursor:default}.prc-Pagination-PaginationContainer-yNDPO{margin-bottom:15px;margin-top:20px;text-align:center}.prc-Pagination-TablePaginationSteps-RRjtg{display:inline-block}@media screen and (max-width:calc(48rem - 0.02px)){.prc-Pagination-TablePaginationSteps-RRjtg[data-hidden-viewport-ranges*=narrow]>:not(:first-child):not(:last-child){display:none}.prc-Pagination-TablePaginationSteps-RRjtg[data-hidden-viewport-ranges*=narrow]>:first-child{margin-inline-end:0}.prc-Pagination-TablePaginationSteps-RRjtg[data-hidden-viewport-ranges*=narrow]>:last-child{margin-inline-start:0}}@media screen and (min-width:48rem){.prc-Pagination-TablePaginationSteps-RRjtg[data-hidden-viewport-ranges*=regular]>:not(:first-child):not(:last-child){display:none}.prc-Pagination-TablePaginationSteps-RRjtg[data-hidden-viewport-ranges*=regular]>:first-child{margin-inline-end:0}.prc-Pagination-TablePaginationSteps-RRjtg[data-hidden-viewport-ranges*=regular]>:last-child{margin-inline-start:0}}@media screen and (min-width:87.5rem){.prc-Pagination-TablePaginationSteps-RRjtg[data-hidden-viewport-ranges*=wide]>:not(:first-child):not(:last-child){display:none}.prc-Pagination-TablePaginationSteps-RRjtg[data-hidden-viewport-ranges*=wide]>:first-child{margin-inline-end:0}.prc-Pagination-TablePaginationSteps-RRjtg[data-hidden-viewport-ranges*=wide]>:last-child{margin-inline-start:0}}
|
|
2
|
+
/*# sourceMappingURL=Pagination-1845feaa.css.map */
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/Pagination/Pagination.module.css"],"names":[],"mappings":"AAAA,2BAgBE,4BAA6B,CAC7B,gDAAyC,CARzC,oDAA6B,CAK7B,cAAe,CAbf,oBAAqB,CAKrB,iBAAkB,CAHlB,WAAY,CAKZ,aAAc,CAHd,sCAAgC,CAHhC,cAAe,CAEf,iGAAiF,CAMjF,iBAAkB,CAClB,4BAAqB,CAArB,oBAAqB,CAOrB,uDAA8D,CAH9D,wBAAiB,CAAjB,gBAAiB,CAFjB,qBAAsB,CADtB,kBAOF,CAEA,uDACE,uFAOE,6BAA8B,CAD9B,UAAW,CAJX,oBAAqB,CAErB,WAAY,CACZ,0BAA2B,CAF3B,UAKF,CAGA,4CAEE,gIAUC,CAXD,sCAYF,CAGA,2CAEE,gIAUC,CAXD,qCAYF,CACF,CAEA,sCACE,cACF,CAEA,kEAGE,wGAA0D,CAC1D,SAAU,CAFV,4BAAqB,CAArB,oBAAqB,CAGrB,uBACF,CAEA,yCACE,6EAAiD,CACjD,mBACF,CAEA,kCACE,+DACF,CAEA,0EAEE,kDACF,CAEA,wFAGE,4EAAgD,CAChD,wBAAyB,CAFzB,2DAGF,CAEA,uDAIE,gFAAqD,CAHrD,6EAAiD,CACjD,mBAGF,CAEA,wLAME,4BAA6B,CAF7B,6DAA8B,CAC9B,cAEF,CAEA,0CAIE,kBAAmB,CAFnB,eAAgB,CAGhB,iBACF,CAEA,2CACE,oBACF,CAEA,mDACE,oHACE,YACF,CAEA,6FACE,mBACF,CAEA,4FACE,qBACF,CACF,CAEA,oCACE,qHACE,YACF,CAEA,8FACE,mBACF,CAEA,6FACE,qBACF,CACF,CAEA,sCACE,kHACE,YACF,CAEA,2FACE,mBACF,CAEA,0FACE,qBACF,CACF","file":"Pagination-1845feaa.css","sourcesContent":[".Page {\n display: inline-block;\n min-width: 32px; /* primer.control.medium.size */\n height: 32px; /* primer.control.medium.size */\n padding: var(--base-size-8) calc((var(--base-size-32) - var(--base-size-20)) / 2); /* primer.control.medium.paddingInline.condensed primer.control.medium.paddingBlock */\n margin-right: var(--base-size-4);\n font-style: normal;\n /* stylelint-disable-next-line primer/typography */\n line-height: 1;\n color: var(--fgColor-default);\n text-align: center;\n text-decoration: none;\n white-space: nowrap;\n vertical-align: middle;\n cursor: pointer;\n user-select: none;\n background-color: transparent;\n border-radius: var(--borderRadius-medium);\n transition: background-color 0.2s cubic-bezier(0.3, 0, 0.5, 1);\n}\n\n@supports (clip-path: polygon(50% 0, 100% 50%, 50% 100%)) {\n .Page[rel='prev']::before,\n .Page[rel='next']::after {\n display: inline-block;\n width: 16px;\n height: 16px;\n vertical-align: text-bottom;\n content: '';\n background-color: currentColor;\n }\n\n /* chevron-left */\n .Page[rel='prev']::before {\n margin-right: var(--base-size-4);\n clip-path: polygon(\n 9.8px 12.8px,\n 8.7px 12.8px,\n 4.5px 8.5px,\n 4.5px 7.5px,\n 8.7px 3.2px,\n 9.8px 4.3px,\n 6.1px 8px,\n 9.8px 11.7px,\n 9.8px 12.8px\n );\n }\n\n /* chevron-right */\n .Page[rel='next']::after {\n margin-left: var(--base-size-4);\n clip-path: polygon(\n 6.2px 3.2px,\n 7.3px 3.2px,\n 11.5px 7.5px,\n 11.5px 8.5px,\n 7.3px 12.8px,\n 6.2px 11.7px,\n 9.9px 8px,\n 6.2px 4.3px,\n 6.2px 3.2px\n );\n }\n}\n\n.Page:last-child {\n margin-right: 0;\n}\n\n.Page:hover,\n.Page:focus {\n text-decoration: none;\n background-color: var(--control-transparent-bgColor-hover);\n outline: 0;\n transition-duration: 0.1s;\n}\n\n.Page:focus-visible {\n outline: 2px solid var(--bgColor-accent-emphasis);\n outline-offset: -2px;\n}\n\n.Page:active {\n border-color: var(--borderColor-muted);\n}\n\n.Page[rel='prev'],\n.Page[rel='next'] {\n color: var(--fgColor-accent);\n}\n\n.Page[aria-current],\n.Page[aria-current]:hover {\n color: var(--fgColor-onEmphasis);\n background-color: var(--bgColor-accent-emphasis);\n border-color: transparent;\n}\n\n.Page[aria-current]:focus-visible {\n outline: 2px solid var(--bgColor-accent-emphasis);\n outline-offset: -2px;\n /* stylelint-disable-next-line primer/box-shadow */\n box-shadow: inset 0 0 0 3px var(--fgColor-onEmphasis);\n}\n\n.Page[aria-hidden],\n.Page[aria-hidden]:hover,\n.Page[role='presentation'],\n.Page[role='presentation']:hover {\n color: var(--fgColor-disabled);\n cursor: default;\n background-color: transparent;\n}\n\n.PaginationContainer {\n /* stylelint-disable-next-line primer/spacing */\n margin-top: 20px;\n /* stylelint-disable-next-line primer/spacing */\n margin-bottom: 15px;\n text-align: center;\n}\n\n.TablePaginationSteps {\n display: inline-block;\n}\n\n@media screen and (--viewportRange-narrow) {\n .TablePaginationSteps[data-hidden-viewport-ranges*='narrow'] > *:not(:first-child):not(:last-child) {\n display: none;\n }\n\n .TablePaginationSteps[data-hidden-viewport-ranges*='narrow'] > *:first-child {\n margin-inline-end: 0;\n }\n\n .TablePaginationSteps[data-hidden-viewport-ranges*='narrow'] > *:last-child {\n margin-inline-start: 0;\n }\n}\n\n@media screen and (--viewportRange-regular) {\n .TablePaginationSteps[data-hidden-viewport-ranges*='regular'] > *:not(:first-child):not(:last-child) {\n display: none;\n }\n\n .TablePaginationSteps[data-hidden-viewport-ranges*='regular'] > *:first-child {\n margin-inline-end: 0;\n }\n\n .TablePaginationSteps[data-hidden-viewport-ranges*='regular'] > *:last-child {\n margin-inline-start: 0;\n }\n}\n\n@media screen and (--viewportRange-wide) {\n .TablePaginationSteps[data-hidden-viewport-ranges*='wide'] > *:not(:first-child):not(:last-child) {\n display: none;\n }\n\n .TablePaginationSteps[data-hidden-viewport-ranges*='wide'] > *:first-child {\n margin-inline-end: 0;\n }\n\n .TablePaginationSteps[data-hidden-viewport-ranges*='wide'] > *:last-child {\n margin-inline-start: 0;\n }\n}\n"]}
|
|
@@ -9,7 +9,6 @@ export type PageProps = {
|
|
|
9
9
|
} & Omit<PageDataProps['props'], 'as' | 'role'>;
|
|
10
10
|
export type PaginationProps = {
|
|
11
11
|
className?: string;
|
|
12
|
-
theme?: Record<string, unknown>;
|
|
13
12
|
pageCount: number;
|
|
14
13
|
currentPage: number;
|
|
15
14
|
onPageChange?: (e: React.MouseEvent, n: number) => void;
|
|
@@ -19,6 +18,6 @@ export type PaginationProps = {
|
|
|
19
18
|
surroundingPageCount?: number;
|
|
20
19
|
renderPage?: (props: PageProps) => React.ReactNode;
|
|
21
20
|
};
|
|
22
|
-
declare function Pagination({ className,
|
|
21
|
+
declare function Pagination({ className, pageCount, currentPage, onPageChange, hrefBuilder, marginPageCount, showPages, surroundingPageCount, renderPage, ...rest }: PaginationProps): React.JSX.Element;
|
|
23
22
|
export default Pagination;
|
|
24
23
|
//# sourceMappingURL=Pagination.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["../../src/Pagination/Pagination.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["../../src/Pagination/Pagination.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAA2C,KAAK,aAAa,EAAC,MAAM,SAAS,CAAA;AACpF,OAAO,KAAK,EAAC,eAAe,EAAC,MAAM,6BAA6B,CAAA;AAmBhE,MAAM,MAAM,SAAS,GAAG;IAEtB,GAAG,EAAE,MAAM,CAAA;IAEX,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IAEzB,MAAM,EAAE,MAAM,CAAA;IAEd,SAAS,EAAE,MAAM,CAAA;CAClB,GAAG,IAAI,CAAC,aAAa,CAAC,OAAO,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC,CAAA;AAiD/C,MAAM,MAAM,eAAe,GAAG;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,EAAE,MAAM,CAAA;IACjB,WAAW,EAAE,MAAM,CAAA;IACnB,YAAY,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,EAAE,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;IACvD,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,MAAM,CAAA;IACnC,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,SAAS,CAAC,EAAE,OAAO,GAAG,eAAe,CAAC,OAAO,CAAC,CAAA;IAC9C,oBAAoB,CAAC,EAAE,MAAM,CAAA;IAC7B,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,KAAK,CAAC,SAAS,CAAA;CACnD,CAAA;AAED,iBAAS,UAAU,CAAC,EAClB,SAAS,EACT,SAAS,EACT,WAAW,EACX,YAAmB,EACnB,WAAgC,EAChC,eAAmB,EACnB,SAAgB,EAChB,oBAAwB,EACxB,UAAU,EACV,GAAG,IAAI,EACR,EAAE,eAAe,qBAsBjB;AAQD,eAAe,UAAU,CAAA"}
|
|
@@ -3,9 +3,7 @@ import { buildPaginationModel, buildComponentData } from './model.js';
|
|
|
3
3
|
import { viewportRanges } from '../hooks/useResponsiveValue.js';
|
|
4
4
|
import { clsx } from 'clsx';
|
|
5
5
|
import classes from './Pagination.module.css.js';
|
|
6
|
-
import { BoxWithFallback } from '../internal/components/BoxWithFallback.js';
|
|
7
6
|
import { jsx } from 'react/jsx-runtime';
|
|
8
|
-
import Box from '../Box/Box.js';
|
|
9
7
|
|
|
10
8
|
const getViewportRangesToHidePages = showPages => {
|
|
11
9
|
if (showPages && typeof showPages !== 'boolean') {
|
|
@@ -18,7 +16,6 @@ const getViewportRangesToHidePages = showPages => {
|
|
|
18
16
|
}
|
|
19
17
|
};
|
|
20
18
|
function usePaginationPages({
|
|
21
|
-
theme,
|
|
22
19
|
pageCount,
|
|
23
20
|
currentPage,
|
|
24
21
|
onPageChange,
|
|
@@ -48,24 +45,22 @@ function usePaginationPages({
|
|
|
48
45
|
...props
|
|
49
46
|
});
|
|
50
47
|
}
|
|
48
|
+
const Component = props.as || 'a';
|
|
51
49
|
return (
|
|
52
50
|
/*#__PURE__*/
|
|
53
51
|
// @ts-ignore giving me grief about children and "as" props
|
|
54
|
-
jsx(
|
|
55
|
-
as: "a",
|
|
56
|
-
theme: theme,
|
|
52
|
+
jsx(Component, {
|
|
57
53
|
className: clsx(classes.Page),
|
|
58
54
|
...props,
|
|
59
55
|
children: content
|
|
60
56
|
}, key)
|
|
61
57
|
);
|
|
62
58
|
});
|
|
63
|
-
}, [model, hrefBuilder, pageChange, renderPage
|
|
59
|
+
}, [model, hrefBuilder, pageChange, renderPage]);
|
|
64
60
|
return children;
|
|
65
61
|
}
|
|
66
62
|
function Pagination({
|
|
67
63
|
className,
|
|
68
|
-
theme: _theme,
|
|
69
64
|
pageCount,
|
|
70
65
|
currentPage,
|
|
71
66
|
onPageChange = noop,
|
|
@@ -77,7 +72,6 @@ function Pagination({
|
|
|
77
72
|
...rest
|
|
78
73
|
}) {
|
|
79
74
|
const pageElements = usePaginationPages({
|
|
80
|
-
theme: _theme,
|
|
81
75
|
pageCount,
|
|
82
76
|
currentPage,
|
|
83
77
|
onPageChange,
|
|
@@ -87,13 +81,11 @@ function Pagination({
|
|
|
87
81
|
surroundingPageCount,
|
|
88
82
|
renderPage
|
|
89
83
|
});
|
|
90
|
-
return /*#__PURE__*/jsx(
|
|
91
|
-
as: "nav",
|
|
84
|
+
return /*#__PURE__*/jsx("nav", {
|
|
92
85
|
className: clsx(classes.PaginationContainer, className),
|
|
93
86
|
"aria-label": "Pagination",
|
|
94
87
|
...rest,
|
|
95
|
-
children: /*#__PURE__*/jsx(
|
|
96
|
-
display: "inline-block",
|
|
88
|
+
children: /*#__PURE__*/jsx("div", {
|
|
97
89
|
className: classes.TablePaginationSteps,
|
|
98
90
|
"data-hidden-viewport-ranges": getViewportRangesToHidePages(showPages).join(' '),
|
|
99
91
|
children: pageElements
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Placeholder.d.ts","sourceRoot":"","sources":["../src/Placeholder.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Placeholder.d.ts","sourceRoot":"","sources":["../src/Placeholder.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,6FAA6F;AAC7F,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAChC,KAAK,CAAC,iBAAiB,CAAC;IACtB,EAAE,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;IACvB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACvB,MAAM,EAAE,MAAM,GAAG,MAAM,CAAA;IACvB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAC,CAgBH,CAAA"}
|
|
@@ -2,9 +2,6 @@ import type { HTMLProps } from 'react';
|
|
|
2
2
|
import React from 'react';
|
|
3
3
|
type CaretPosition = 'top' | 'bottom' | 'left' | 'right' | 'bottom-left' | 'bottom-right' | 'top-left' | 'top-right' | 'left-bottom' | 'left-top' | 'right-bottom' | 'right-top';
|
|
4
4
|
type StyledPopoverProps = {
|
|
5
|
-
/**
|
|
6
|
-
* @deprecated `caret` is deprecated and will be removed in v38.
|
|
7
|
-
*/
|
|
8
5
|
caret?: CaretPosition;
|
|
9
6
|
relative?: boolean;
|
|
10
7
|
open?: boolean;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Popover.d.ts","sourceRoot":"","sources":["../../src/Popover/Popover.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAA;AACpC,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,KAAK,aAAa,GACd,KAAK,GACL,QAAQ,GACR,MAAM,GACN,OAAO,GACP,aAAa,GACb,cAAc,GACd,UAAU,GACV,WAAW,GACX,aAAa,GACb,UAAU,GACV,cAAc,GACd,WAAW,CAAA;AAEf,KAAK,kBAAkB,GAAG;IACxB
|
|
1
|
+
{"version":3,"file":"Popover.d.ts","sourceRoot":"","sources":["../../src/Popover/Popover.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAA;AACpC,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,KAAK,aAAa,GACd,KAAK,GACL,QAAQ,GACR,MAAM,GACN,OAAO,GACP,aAAa,GACb,cAAc,GACd,UAAU,GACV,WAAW,GACX,aAAa,GACb,UAAU,GACV,cAAc,GACd,WAAW,CAAA;AAEf,KAAK,kBAAkB,GAAG;IACxB,KAAK,CAAC,EAAE,aAAa,CAAA;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,IAAI,CAAC,EAAE,OAAO,CAAA;CACf,CAAA;AAED,MAAM,MAAM,YAAY,GAAG;IACzB,oCAAoC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,GAAG,kBAAkB,GACpB,SAAS,CAAC,cAAc,CAAC,CAAA;AAmB3B,MAAM,MAAM,mBAAmB,GAAG;IAChC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,GAAG,QAAQ,CAAA;IACnE,MAAM,CAAC,EAAE,OAAO,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,GAAG,QAAQ,GAAG,aAAa,CAAA;IACzE,QAAQ,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,QAAQ,GAAG,SAAS,CAAA;CACpD,GAAG,SAAS,CAAC,cAAc,CAAC,CAAA;;;;AAa7B,wBAAgE"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/ScrollableRegion/ScrollableRegion.module.css"],"names":[],"mappings":"AAAA,6CAME,aAAc,CADd,iBAEF","file":"ScrollableRegion-c1018dbe.css","sourcesContent":[".ScrollableRegion {\n /* When setting overflow, we also set `position: relative` to avoid\n * `position: absolute` items breaking out of the container and causing\n * scrollbars on the page. This can occur with common classes like `sr-only`\n * and can cause difficult to track down layout issues */\n position: relative;\n overflow: auto;\n}\n"]}
|
|
@@ -7,7 +7,7 @@ type Labelled = {
|
|
|
7
7
|
'aria-labelledby': string;
|
|
8
8
|
};
|
|
9
9
|
type ScrollableRegionProps = React.ComponentPropsWithoutRef<'div'> & Labelled;
|
|
10
|
-
declare function ScrollableRegion({ 'aria-label': label, 'aria-labelledby': labelledby, children, ...rest }: ScrollableRegionProps): React.JSX.Element;
|
|
10
|
+
declare function ScrollableRegion({ 'aria-label': label, 'aria-labelledby': labelledby, children, className, ...rest }: ScrollableRegionProps): React.JSX.Element;
|
|
11
11
|
export { ScrollableRegion };
|
|
12
12
|
export type { ScrollableRegionProps };
|
|
13
13
|
//# sourceMappingURL=ScrollableRegion.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ScrollableRegion.d.ts","sourceRoot":"","sources":["../../src/ScrollableRegion/ScrollableRegion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"ScrollableRegion.d.ts","sourceRoot":"","sources":["../../src/ScrollableRegion/ScrollableRegion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,KAAK,QAAQ,GACT;IACE,YAAY,EAAE,MAAM,CAAA;IACpB,iBAAiB,CAAC,EAAE,KAAK,CAAA;CAC1B,GACD;IACE,YAAY,CAAC,EAAE,KAAK,CAAA;IACpB,iBAAiB,EAAE,MAAM,CAAA;CAC1B,CAAA;AAEL,KAAK,qBAAqB,GAAG,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,GAAG,QAAQ,CAAA;AAE7E,iBAAS,gBAAgB,CAAC,EACxB,YAAY,EAAE,KAAK,EACnB,iBAAiB,EAAE,UAAU,EAC7B,QAAQ,EACR,SAAS,EACT,GAAG,IAAI,EACR,EAAE,qBAAqB,qBAiBvB;AAED,OAAO,EAAC,gBAAgB,EAAC,CAAA;AACzB,YAAY,EAAC,qBAAqB,EAAC,CAAA"}
|
|
@@ -1,20 +1,14 @@
|
|
|
1
1
|
import { c } from 'react-compiler-runtime';
|
|
2
2
|
import React from 'react';
|
|
3
|
+
import { clsx } from 'clsx';
|
|
3
4
|
import { useOverflow } from '../hooks/useOverflow.js';
|
|
5
|
+
import classes from './ScrollableRegion.module.css.js';
|
|
4
6
|
import { jsx } from 'react/jsx-runtime';
|
|
5
|
-
import Box from '../Box/Box.js';
|
|
6
7
|
|
|
7
|
-
const defaultStyles = {
|
|
8
|
-
// When setting overflow, we also set `position: relative` to avoid
|
|
9
|
-
// `position: absolute` items breaking out of the container and causing
|
|
10
|
-
// scrollbars on the page. This can occur with common classes like `sr-only`
|
|
11
|
-
// and can cause difficult to track down layout issues
|
|
12
|
-
position: 'relative',
|
|
13
|
-
overflow: 'auto'
|
|
14
|
-
};
|
|
15
8
|
function ScrollableRegion(t0) {
|
|
16
|
-
const $ = c(
|
|
9
|
+
const $ = c(17);
|
|
17
10
|
let children;
|
|
11
|
+
let className;
|
|
18
12
|
let label;
|
|
19
13
|
let labelledby;
|
|
20
14
|
let rest;
|
|
@@ -23,54 +17,66 @@ function ScrollableRegion(t0) {
|
|
|
23
17
|
"aria-label": label,
|
|
24
18
|
"aria-labelledby": labelledby,
|
|
25
19
|
children,
|
|
20
|
+
className,
|
|
26
21
|
...rest
|
|
27
22
|
} = t0);
|
|
28
23
|
$[0] = t0;
|
|
29
24
|
$[1] = children;
|
|
30
|
-
$[2] =
|
|
31
|
-
$[3] =
|
|
32
|
-
$[4] =
|
|
25
|
+
$[2] = className;
|
|
26
|
+
$[3] = label;
|
|
27
|
+
$[4] = labelledby;
|
|
28
|
+
$[5] = rest;
|
|
33
29
|
} else {
|
|
34
30
|
children = $[1];
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
31
|
+
className = $[2];
|
|
32
|
+
label = $[3];
|
|
33
|
+
labelledby = $[4];
|
|
34
|
+
rest = $[5];
|
|
38
35
|
}
|
|
39
36
|
const ref = React.useRef(null);
|
|
40
37
|
const hasOverflow = useOverflow(ref);
|
|
41
38
|
let t1;
|
|
42
|
-
if ($[
|
|
39
|
+
if ($[6] !== hasOverflow || $[7] !== label || $[8] !== labelledby) {
|
|
43
40
|
t1 = hasOverflow ? {
|
|
44
41
|
"aria-label": label,
|
|
45
42
|
"aria-labelledby": labelledby,
|
|
46
43
|
role: "region",
|
|
47
44
|
tabIndex: 0
|
|
48
45
|
} : {};
|
|
49
|
-
$[
|
|
50
|
-
$[
|
|
51
|
-
$[
|
|
52
|
-
$[
|
|
46
|
+
$[6] = hasOverflow;
|
|
47
|
+
$[7] = label;
|
|
48
|
+
$[8] = labelledby;
|
|
49
|
+
$[9] = t1;
|
|
53
50
|
} else {
|
|
54
|
-
t1 = $[
|
|
51
|
+
t1 = $[9];
|
|
55
52
|
}
|
|
56
53
|
const regionProps = t1;
|
|
57
54
|
let t2;
|
|
58
|
-
if ($[
|
|
59
|
-
t2 =
|
|
55
|
+
if ($[10] !== className) {
|
|
56
|
+
t2 = clsx(classes.ScrollableRegion, className);
|
|
57
|
+
$[10] = className;
|
|
58
|
+
$[11] = t2;
|
|
59
|
+
} else {
|
|
60
|
+
t2 = $[11];
|
|
61
|
+
}
|
|
62
|
+
let t3;
|
|
63
|
+
if ($[12] !== children || $[13] !== regionProps || $[14] !== rest || $[15] !== t2) {
|
|
64
|
+
t3 = /*#__PURE__*/jsx("div", {
|
|
60
65
|
...rest,
|
|
61
66
|
...regionProps,
|
|
62
67
|
ref: ref,
|
|
63
|
-
|
|
68
|
+
className: t2,
|
|
64
69
|
children: children
|
|
65
70
|
});
|
|
66
|
-
$[
|
|
67
|
-
$[
|
|
68
|
-
$[
|
|
69
|
-
$[
|
|
71
|
+
$[12] = children;
|
|
72
|
+
$[13] = regionProps;
|
|
73
|
+
$[14] = rest;
|
|
74
|
+
$[15] = t2;
|
|
75
|
+
$[16] = t3;
|
|
70
76
|
} else {
|
|
71
|
-
|
|
77
|
+
t3 = $[16];
|
|
72
78
|
}
|
|
73
|
-
return
|
|
79
|
+
return t3;
|
|
74
80
|
}
|
|
75
81
|
|
|
76
82
|
export { ScrollableRegion };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectPanel.d.ts","sourceRoot":"","sources":["../../src/SelectPanel/SelectPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAsC,KAAK,SAAS,EAAC,MAAM,wBAAwB,CAAA;AAC1F,OAAO,
|
|
1
|
+
{"version":3,"file":"SelectPanel.d.ts","sourceRoot":"","sources":["../../src/SelectPanel/SelectPanel.tsx"],"names":[],"mappings":"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"}
|
|
@@ -14,6 +14,7 @@ import { clsx } from 'clsx';
|
|
|
14
14
|
import { debounce } from '@github/mini-throttle';
|
|
15
15
|
import { useResponsiveValue } from '../hooks/useResponsiveValue.js';
|
|
16
16
|
import { Banner } from '../Banner/index.js';
|
|
17
|
+
import { isAlphabetKey } from '../hooks/useMnemonics.js';
|
|
17
18
|
import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
|
|
18
19
|
import { useFeatureFlag } from '../FeatureFlags/useFeatureFlag.js';
|
|
19
20
|
import { useProvidedRefOrCreate } from '../hooks/useProvidedRefOrCreate.js';
|
|
@@ -141,6 +142,7 @@ function Panel({
|
|
|
141
142
|
const featureFlagFullScreenOnNarrow = useFeatureFlag('primer_react_select_panel_fullscreen_on_narrow');
|
|
142
143
|
const usingFullScreenOnNarrow = disableFullscreenOnNarrow ? false : featureFlagFullScreenOnNarrow;
|
|
143
144
|
const shouldOrderSelectedFirst = useFeatureFlag('primer_react_select_panel_order_selected_at_top') && showSelectedOptionsFirst;
|
|
145
|
+
const usingRemoveActiveDescendant = useFeatureFlag('primer_react_select_panel_remove_active_descendant');
|
|
144
146
|
|
|
145
147
|
// Single select modals work differently, they have an intermediate state where the user has selected an item but
|
|
146
148
|
// has not yet confirmed the selection. This is the only time the user can cancel the selection.
|
|
@@ -549,6 +551,22 @@ function Panel({
|
|
|
549
551
|
regular: 'anchored',
|
|
550
552
|
narrow: 'fullscreen'
|
|
551
553
|
} : undefined, 'anchored');
|
|
554
|
+
const preventBubbling = customOnKeyDown => event => {
|
|
555
|
+
// skip if a TextInput has focus
|
|
556
|
+
customOnKeyDown === null || customOnKeyDown === void 0 ? void 0 : customOnKeyDown(event);
|
|
557
|
+
const activeElement = document.activeElement;
|
|
558
|
+
if (activeElement.tagName === 'INPUT' || activeElement.tagName === 'TEXTAREA') return;
|
|
559
|
+
|
|
560
|
+
// skip if used with modifier to preserve shortcuts like ⌘ + F
|
|
561
|
+
const hasModifier = event.ctrlKey || event.altKey || event.metaKey;
|
|
562
|
+
if (hasModifier) return;
|
|
563
|
+
|
|
564
|
+
// skip if it's not a alphabet key
|
|
565
|
+
if (!isAlphabetKey(event.nativeEvent)) return;
|
|
566
|
+
|
|
567
|
+
// if this is a typeahead event, don't propagate outside of menu
|
|
568
|
+
event.stopPropagation();
|
|
569
|
+
};
|
|
552
570
|
return /*#__PURE__*/jsxs(Fragment, {
|
|
553
571
|
children: [/*#__PURE__*/jsx(AnchoredOverlay, {
|
|
554
572
|
renderAnchor: renderMenuAnchor,
|
|
@@ -575,7 +593,8 @@ function Panel({
|
|
|
575
593
|
...(isKeyboardVisible ? {
|
|
576
594
|
maxHeight: availablePanelHeight !== undefined ? `${availablePanelHeight}px` : 'auto'
|
|
577
595
|
} : {})
|
|
578
|
-
}
|
|
596
|
+
},
|
|
597
|
+
onKeyDown: usingRemoveActiveDescendant ? preventBubbling(overlayProps === null || overlayProps === void 0 ? void 0 : overlayProps.onKeyDown) : overlayProps === null || overlayProps === void 0 ? void 0 : overlayProps.onKeyDown
|
|
579
598
|
},
|
|
580
599
|
focusTrapSettings: focusTrapSettings,
|
|
581
600
|
focusZoneSettings: focusZoneSettings,
|
|
@@ -3,7 +3,7 @@ import React from 'react';
|
|
|
3
3
|
import { clsx } from 'clsx';
|
|
4
4
|
import classes from './SkeletonBox.module.css.js';
|
|
5
5
|
import '@styled-system/css';
|
|
6
|
-
import
|
|
6
|
+
import deepmerge from 'deepmerge';
|
|
7
7
|
import { jsx } from 'react/jsx-runtime';
|
|
8
8
|
|
|
9
9
|
const SkeletonBox = /*#__PURE__*/React.forwardRef(function SkeletonBox(t0, ref) {
|
|
@@ -46,7 +46,7 @@ const SkeletonBox = /*#__PURE__*/React.forwardRef(function SkeletonBox(t0, ref)
|
|
|
46
46
|
const t3 = style;
|
|
47
47
|
let t4;
|
|
48
48
|
if ($[8] !== height || $[9] !== t3 || $[10] !== width) {
|
|
49
|
-
t4 =
|
|
49
|
+
t4 = deepmerge(t3, {
|
|
50
50
|
height,
|
|
51
51
|
width
|
|
52
52
|
});
|
|
@@ -5,7 +5,7 @@ import { SkeletonBox } from '../Skeleton/SkeletonBox.js';
|
|
|
5
5
|
import classes from './SkeletonAvatar.module.css.js';
|
|
6
6
|
import { clsx } from 'clsx';
|
|
7
7
|
import '@styled-system/css';
|
|
8
|
-
import
|
|
8
|
+
import deepmerge from 'deepmerge';
|
|
9
9
|
import { jsx } from 'react/jsx-runtime';
|
|
10
10
|
|
|
11
11
|
function SkeletonAvatar(t0) {
|
|
@@ -74,7 +74,7 @@ function SkeletonAvatar(t0) {
|
|
|
74
74
|
t5 = "SkeletonAvatar";
|
|
75
75
|
t6 = responsive ? "" : undefined;
|
|
76
76
|
t7 = square ? "" : undefined;
|
|
77
|
-
t8 =
|
|
77
|
+
t8 = deepmerge(style, cssSizeVars);
|
|
78
78
|
$[8] = className;
|
|
79
79
|
$[9] = responsive;
|
|
80
80
|
$[10] = rest;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
.prc-StateLabel-StateLabel-ukDwa{align-items:center;border-radius:var(--borderRadius-full,624.9375rem);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis));display:inline-flex;font-weight:var(--base-text-weight-semibold,600);line-height:16px;text-align:center}.prc-StateLabel-StateLabel-ukDwa:where([data-variant=small]){font-size:var(--text-body-size-small,.75rem);padding:var(--base-size-4,.25rem) var(--base-size-8,.5rem)}.prc-StateLabel-StateLabel-ukDwa:where([data-variant=normal]){font-size:var(--text-body-size-medium,.875rem);padding:var(--base-size-8,.5rem) var(--base-size-12,.75rem)}.prc-StateLabel-StateLabel-ukDwa:where([data-status=issueClosed]){background-color:var(--bgColor-done-emphasis,var(--color-done-emphasis));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-done-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=issueClosedNotPlanned]){background-color:var(--bgColor-neutral-emphasis,var(--color-fg-subtle));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-neutral-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=pullClosed]){background-color:var(--bgColor-closed-emphasis,var(--color-closed-emphasis));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-closed-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=pullMerged]){background-color:var(--bgColor-done-emphasis,var(--color-done-emphasis));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-done-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=pullQueued]){background-color:var(--bgColor-attention-emphasis,var(--color-attention-emphasis));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-attention-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=issueOpened]){background-color:var(--bgColor-open-emphasis,var(--color-open-emphasis));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-open-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=pullOpened]){background-color:var(--bgColor-open-emphasis,var(--color-open-emphasis));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-open-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=draft]){background-color:var(--bgColor-neutral-emphasis,var(--color-fg-subtle));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-neutral-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=issueDraft]){background-color:var(--bgColor-neutral-emphasis,var(--color-fg-subtle));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-neutral-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=unavailable]){background-color:var(--bgColor-neutral-emphasis,var(--color-fg-subtle));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-neutral-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=open]){background-color:var(--bgColor-open-emphasis,var(--color-open-emphasis));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-open-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=closed]){background-color:var(--bgColor-done-emphasis,var(--color-done-emphasis));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-done-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-Icon-NuDm4{margin-right:var(--base-size-4,.25rem)}
|
|
2
|
-
/*# sourceMappingURL=StateLabel-
|
|
1
|
+
.prc-StateLabel-StateLabel-ukDwa{align-items:center;border-radius:var(--borderRadius-full,624.9375rem);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis));display:inline-flex;font-weight:var(--base-text-weight-semibold,600);line-height:16px;text-align:center}.prc-StateLabel-StateLabel-ukDwa:where([data-variant=small]){font-size:var(--text-body-size-small,.75rem);padding:var(--base-size-4,.25rem) var(--base-size-8,.5rem)}.prc-StateLabel-StateLabel-ukDwa:where([data-variant=normal]){font-size:var(--text-body-size-medium,.875rem);padding:var(--base-size-8,.5rem) var(--base-size-12,.75rem)}.prc-StateLabel-StateLabel-ukDwa:where([data-status=issueClosed]){background-color:var(--bgColor-done-emphasis,var(--color-done-emphasis));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-done-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=issueClosedNotPlanned]){background-color:var(--bgColor-neutral-emphasis,var(--color-fg-subtle));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-neutral-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=pullClosed]){background-color:var(--bgColor-closed-emphasis,var(--color-closed-emphasis));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-closed-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=pullMerged]){background-color:var(--bgColor-done-emphasis,var(--color-done-emphasis));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-done-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=pullQueued]){background-color:var(--bgColor-attention-emphasis,var(--color-attention-emphasis));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-attention-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=issueOpened]){background-color:var(--bgColor-open-emphasis,var(--color-open-emphasis));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-open-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=pullOpened]){background-color:var(--bgColor-open-emphasis,var(--color-open-emphasis));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-open-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=draft]){background-color:var(--bgColor-draft-emphasis,var(--bgColor-neutral-emphasis,var(--color-fg-subtle)));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-draft-emphasis,var(--borderColor-neutral-emphasis,transparent));color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=issueDraft]){background-color:var(--bgColor-draft-emphasis,var(--bgColor-neutral-emphasis,var(--color-fg-subtle)));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-draft-emphasis,var(--borderColor-neutral-emphasis,transparent));color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=unavailable]){background-color:var(--bgColor-neutral-emphasis,var(--color-fg-subtle));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-neutral-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=open]){background-color:var(--bgColor-open-emphasis,var(--color-open-emphasis));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-open-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=closed]){background-color:var(--bgColor-done-emphasis,var(--color-done-emphasis));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-done-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-Icon-NuDm4{margin-right:var(--base-size-4,.25rem)}
|
|
2
|
+
/*# sourceMappingURL=StateLabel-aaa1d148.css.map */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/StateLabel/StateLabel.module.css"],"names":[],"mappings":"AAAA,iCAEE,kBAAmB,CAMnB,kDAAuC,CAFvC,2DAAgC,CALhC,mBAAoB,CAEpB,gDAA6C,CAE7C,gBAAiB,CAEjB,iBAEF,CAGA,6DAEE,4CAAsC,CADtC,0DAEF,CAEA,8DAEE,8CAAuC,CADvC,2DAEF,CAGA,kEACE,wEAA8C,CAE9C,6FAAgG,CADhG,2DAEF,CAEA,4EACE,uEAAiD,CAEjD,gGAAmG,CADnG,2DAEF,CAEA,iEACE,4EAAgD,CAEhD,+FAAkG,CADlG,2DAEF,CAEA,iEACE,wEAA8C,CAE9C,6FAAgG,CADhG,2DAEF,CAEA,iEACE,kFAAmD,CAEnD,kGAAqG,CADrG,2DAEF,CAEA,kEACE,wEAA8C,CAE9C,6FAAgG,CADhG,2DAEF,CAEA,iEACE,wEAA8C,CAE9C,6FAAgG,CADhG,2DAEF,CAEA,
|
|
1
|
+
{"version":3,"sources":["../src/StateLabel/StateLabel.module.css"],"names":[],"mappings":"AAAA,iCAEE,kBAAmB,CAMnB,kDAAuC,CAFvC,2DAAgC,CALhC,mBAAoB,CAEpB,gDAA6C,CAE7C,gBAAiB,CAEjB,iBAEF,CAGA,6DAEE,4CAAsC,CADtC,0DAEF,CAEA,8DAEE,8CAAuC,CADvC,2DAEF,CAGA,kEACE,wEAA8C,CAE9C,6FAAgG,CADhG,2DAEF,CAEA,4EACE,uEAAiD,CAEjD,gGAAmG,CADnG,2DAEF,CAEA,iEACE,4EAAgD,CAEhD,+FAAkG,CADlG,2DAEF,CAEA,iEACE,wEAA8C,CAE9C,6FAAgG,CADhG,2DAEF,CAEA,iEACE,kFAAmD,CAEnD,kGAAqG,CADrG,2DAEF,CAEA,kEACE,wEAA8C,CAE9C,6FAAgG,CADhG,2DAEF,CAEA,iEACE,wEAA8C,CAE9C,6FAAgG,CADhG,2DAEF,CAEA,4DAEE,qGAAgF,CAEhF,kIACqF,CAFrF,2DAGF,CAEA,iEAEE,qGAAgF,CAEhF,kIACqF,CAFrF,2DAGF,CAEA,kEACE,uEAAiD,CAEjD,gGAAmG,CADnG,2DAEF,CAEA,2DACE,wEAA8C,CAE9C,6FAAgG,CADhG,2DAEF,CAEA,6DACE,wEAA8C,CAE9C,6FAAgG,CADhG,2DAEF,CAEA,2BACE,sCACF","file":"StateLabel-aaa1d148.css","sourcesContent":[".StateLabel {\n display: inline-flex;\n align-items: center;\n font-weight: var(--base-text-weight-semibold);\n /* stylelint-disable-next-line primer/typography */\n line-height: 16px;\n color: var(--fgColor-onEmphasis);\n text-align: center;\n border-radius: var(--borderRadius-full);\n}\n\n/* Size variants */\n.StateLabel:where([data-variant='small']) {\n padding: var(--base-size-4) var(--base-size-8);\n font-size: var(--text-body-size-small);\n}\n\n.StateLabel:where([data-variant='normal']) {\n padding: var(--base-size-8) var(--base-size-12);\n font-size: var(--text-body-size-medium);\n}\n\n/* Status color variants */\n.StateLabel:where([data-status='issueClosed']) {\n background-color: var(--bgColor-done-emphasis);\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px) var(--borderColor-done-emphasis, transparent);\n}\n\n.StateLabel:where([data-status='issueClosedNotPlanned']) {\n background-color: var(--bgColor-neutral-emphasis);\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px) var(--borderColor-neutral-emphasis, transparent);\n}\n\n.StateLabel:where([data-status='pullClosed']) {\n background-color: var(--bgColor-closed-emphasis);\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px) var(--borderColor-closed-emphasis, transparent);\n}\n\n.StateLabel:where([data-status='pullMerged']) {\n background-color: var(--bgColor-done-emphasis);\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px) var(--borderColor-done-emphasis, transparent);\n}\n\n.StateLabel:where([data-status='pullQueued']) {\n background-color: var(--bgColor-attention-emphasis);\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px) var(--borderColor-attention-emphasis, transparent);\n}\n\n.StateLabel:where([data-status='issueOpened']) {\n background-color: var(--bgColor-open-emphasis);\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px) var(--borderColor-open-emphasis, transparent);\n}\n\n.StateLabel:where([data-status='pullOpened']) {\n background-color: var(--bgColor-open-emphasis);\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px) var(--borderColor-open-emphasis, transparent);\n}\n\n.StateLabel:where([data-status='draft']) {\n /* stylelint-disable-next-line primer/colors */\n background-color: var(--bgColor-draft-emphasis, var(--bgColor-neutral-emphasis));\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px)\n var(--borderColor-draft-emphasis, var(--borderColor-neutral-emphasis, transparent));\n}\n\n.StateLabel:where([data-status='issueDraft']) {\n /* stylelint-disable-next-line primer/colors */\n background-color: var(--bgColor-draft-emphasis, var(--bgColor-neutral-emphasis));\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px)\n var(--borderColor-draft-emphasis, var(--borderColor-neutral-emphasis, transparent));\n}\n\n.StateLabel:where([data-status='unavailable']) {\n background-color: var(--bgColor-neutral-emphasis);\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px) var(--borderColor-neutral-emphasis, transparent);\n}\n\n.StateLabel:where([data-status='open']) {\n background-color: var(--bgColor-open-emphasis);\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px) var(--borderColor-open-emphasis, transparent);\n}\n\n.StateLabel:where([data-status='closed']) {\n background-color: var(--bgColor-done-emphasis);\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px) var(--borderColor-done-emphasis, transparent);\n}\n\n.Icon {\n margin-right: var(--base-size-4);\n}\n"]}
|
package/dist/TabNav/TabNav.d.ts
CHANGED
|
@@ -1,12 +1,10 @@
|
|
|
1
1
|
import type { To } from 'history';
|
|
2
2
|
import React from 'react';
|
|
3
|
-
import type {
|
|
4
|
-
import type { ComponentProps } from '../utils/types';
|
|
5
|
-
import { BoxWithFallback } from '../internal/components/BoxWithFallback';
|
|
3
|
+
import type { ForwardRefComponent as PolymorphicForwardRefComponent } from '../utils/polymorphic';
|
|
6
4
|
/**
|
|
7
5
|
* @deprecated
|
|
8
6
|
*/
|
|
9
|
-
export type TabNavProps =
|
|
7
|
+
export type TabNavProps = React.HTMLProps<HTMLDivElement>;
|
|
10
8
|
/**
|
|
11
9
|
* @deprecated
|
|
12
10
|
*/
|
|
@@ -21,9 +19,9 @@ export type TabNavLinkProps = React.DetailedHTMLProps<React.HTMLAttributes<HTMLA
|
|
|
21
19
|
className?: string;
|
|
22
20
|
as?: React.ElementType | 'a' | 'button' | 'div';
|
|
23
21
|
disabled?: boolean;
|
|
24
|
-
}
|
|
22
|
+
};
|
|
25
23
|
declare const _default: typeof TabNav & {
|
|
26
|
-
Link:
|
|
24
|
+
Link: PolymorphicForwardRefComponent<"a", TabNavLinkProps>;
|
|
27
25
|
};
|
|
28
26
|
export default _default;
|
|
29
27
|
//# sourceMappingURL=TabNav.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabNav.d.ts","sourceRoot":"","sources":["../../src/TabNav/TabNav.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAC,EAAE,EAAC,MAAM,SAAS,CAAA;AAC/B,OAAO,KAAyB,MAAM,OAAO,CAAA;AAE7C,OAAO,KAAK,EAAC,
|
|
1
|
+
{"version":3,"file":"TabNav.d.ts","sourceRoot":"","sources":["../../src/TabNav/TabNav.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAC,EAAE,EAAC,MAAM,SAAS,CAAA;AAC/B,OAAO,KAAyB,MAAM,OAAO,CAAA;AAE7C,OAAO,KAAK,EAAC,mBAAmB,IAAI,8BAA8B,EAAC,MAAM,sBAAsB,CAAA;AAI/F;;GAEG;AACH,MAAM,MAAM,WAAW,GAAG,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAA;AAEzD;;GAEG;AACH,iBAAS,MAAM,CAAC,EAAC,QAAQ,EAAE,YAAY,EAAE,SAAS,EAAE,GAAG,IAAI,EAAC,EAAE,WAAW,qBA6CxE;AAED;;GAEG;AACH,MAAM,MAAM,eAAe,GAAG,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,cAAc,CAAC,iBAAiB,CAAC,EAAE,iBAAiB,CAAC,GAAG;IAClH,EAAE,CAAC,EAAE,EAAE,CAAA;IACP,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,GAAG,GAAG,GAAG,QAAQ,GAAG,KAAK,CAAA;IAC/C,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;;;;AAuBD,wBAAwD"}
|
package/dist/TabNav/TabNav.js
CHANGED
|
@@ -3,7 +3,6 @@ import { clsx } from 'clsx';
|
|
|
3
3
|
import React, { useRef, useState } from 'react';
|
|
4
4
|
import { useFocusZone } from '../hooks/useFocusZone.js';
|
|
5
5
|
import styles from './TabNav.module.css.js';
|
|
6
|
-
import { BoxWithFallback } from '../internal/components/BoxWithFallback.js';
|
|
7
6
|
import { jsx } from 'react/jsx-runtime';
|
|
8
7
|
import { FocusKeys } from '@primer/behaviors';
|
|
9
8
|
|
|
@@ -118,7 +117,7 @@ function TabNav(t0) {
|
|
|
118
117
|
}
|
|
119
118
|
let t10;
|
|
120
119
|
if ($[16] !== rest || $[17] !== t7 || $[18] !== t9) {
|
|
121
|
-
t10 = /*#__PURE__*/jsx(
|
|
120
|
+
t10 = /*#__PURE__*/jsx("div", {
|
|
122
121
|
...rest,
|
|
123
122
|
ref: t7,
|
|
124
123
|
children: t9
|
|
@@ -166,7 +165,7 @@ const TabNavLink = /*#__PURE__*/React.forwardRef(function TabNavLink(t0, ref) {
|
|
|
166
165
|
selected = $[3];
|
|
167
166
|
t1 = $[4];
|
|
168
167
|
}
|
|
169
|
-
const
|
|
168
|
+
const Component = t1 === undefined ? "a" : t1;
|
|
170
169
|
const t2 = selected ? true : undefined;
|
|
171
170
|
const t3 = selected && "selected";
|
|
172
171
|
const t4 = selected && styles.Selected;
|
|
@@ -181,9 +180,8 @@ const TabNavLink = /*#__PURE__*/React.forwardRef(function TabNavLink(t0, ref) {
|
|
|
181
180
|
t5 = $[8];
|
|
182
181
|
}
|
|
183
182
|
let t6;
|
|
184
|
-
if ($[9] !==
|
|
185
|
-
t6 = /*#__PURE__*/jsx(
|
|
186
|
-
as: as,
|
|
183
|
+
if ($[9] !== Component || $[10] !== ref || $[11] !== rest || $[12] !== t2 || $[13] !== t5) {
|
|
184
|
+
t6 = /*#__PURE__*/jsx(Component, {
|
|
187
185
|
ref: ref,
|
|
188
186
|
role: "tab",
|
|
189
187
|
tabIndex: -1,
|
|
@@ -191,7 +189,7 @@ const TabNavLink = /*#__PURE__*/React.forwardRef(function TabNavLink(t0, ref) {
|
|
|
191
189
|
className: t5,
|
|
192
190
|
...rest
|
|
193
191
|
});
|
|
194
|
-
$[9] =
|
|
192
|
+
$[9] = Component;
|
|
195
193
|
$[10] = ref;
|
|
196
194
|
$[11] = rest;
|
|
197
195
|
$[12] = t2;
|
package/dist/Text/Text.d.ts
CHANGED
|
@@ -1,12 +1,11 @@
|
|
|
1
1
|
import { type StyledComponent } from 'styled-components';
|
|
2
2
|
import React from 'react';
|
|
3
3
|
import type { SystemCommonProps, SystemTypographyProps } from '../constants';
|
|
4
|
-
import type { SxProp } from '../sx';
|
|
5
4
|
type StyledTextProps = {
|
|
6
5
|
as?: React.ComponentType<any> | keyof JSX.IntrinsicElements;
|
|
7
6
|
size?: 'large' | 'medium' | 'small';
|
|
8
7
|
weight?: 'light' | 'normal' | 'medium' | 'semibold';
|
|
9
|
-
} & SystemTypographyProps & SystemCommonProps &
|
|
8
|
+
} & SystemTypographyProps & SystemCommonProps & React.HTMLAttributes<HTMLSpanElement>;
|
|
10
9
|
declare const Text: StyledComponent<"span", any, StyledTextProps, never>;
|
|
11
10
|
export type TextProps = StyledTextProps;
|
|
12
11
|
export default Text;
|