@primer/components 0.0.0-202192602912 → 0.0.0-2021926102453
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 +7 -1
- package/dist/browser.esm.js +22 -22
- package/dist/browser.esm.js.map +1 -1
- package/dist/browser.umd.js +3 -3
- package/dist/browser.umd.js.map +1 -1
- package/lib/ActionList/Item.d.ts +6 -0
- package/lib/ActionList/Item.js +5 -1
- package/lib/AnchoredOverlay/AnchoredOverlay.d.ts +2 -4
- package/lib/Autocomplete/Autocomplete.d.ts +2 -4
- package/lib/Autocomplete/AutocompleteInput.d.ts +2 -4
- package/lib/SelectMenu/SelectMenu.d.ts +2 -4
- package/lib/TextInputWithTokens.d.ts +2 -4
- package/lib/theme-preval.js +2 -2
- package/lib/utils/testing.d.ts +1 -1
- package/lib-esm/ActionList/Item.d.ts +6 -0
- package/lib-esm/ActionList/Item.js +5 -1
- package/lib-esm/AnchoredOverlay/AnchoredOverlay.d.ts +2 -4
- package/lib-esm/Autocomplete/Autocomplete.d.ts +2 -4
- package/lib-esm/Autocomplete/AutocompleteInput.d.ts +2 -4
- package/lib-esm/SelectMenu/SelectMenu.d.ts +2 -4
- package/lib-esm/TextInputWithTokens.d.ts +2 -4
- package/lib-esm/theme-preval.js +2 -2
- package/lib-esm/utils/testing.d.ts +1 -1
- package/package.json +8 -9
- package/lib/DatePicker/DatePicker.d.ts +0 -48
- package/lib/DatePicker/DatePicker.js +0 -92
- package/lib/DatePicker/DatePickerAnchor.d.ts +0 -5
- package/lib/DatePicker/DatePickerAnchor.js +0 -158
- package/lib/DatePicker/DatePickerOverlay.d.ts +0 -3
- package/lib/DatePicker/DatePickerOverlay.js +0 -39
- package/lib/DatePicker/DatePickerPanel.d.ts +0 -2
- package/lib/DatePicker/DatePickerPanel.js +0 -126
- package/lib/DatePicker/Day.d.ts +0 -14
- package/lib/DatePicker/Day.js +0 -174
- package/lib/DatePicker/Month.d.ts +0 -9
- package/lib/DatePicker/Month.js +0 -107
- package/lib/DatePicker/index.d.ts +0 -2
- package/lib/DatePicker/index.js +0 -13
- package/lib/DatePicker/useDatePicker.d.ts +0 -83
- package/lib/DatePicker/useDatePicker.js +0 -375
- package/lib/hooks/useDebounce.d.ts +0 -2
- package/lib/hooks/useDebounce.js +0 -24
- package/lib-esm/DatePicker/DatePicker.d.ts +0 -48
- package/lib-esm/DatePicker/DatePicker.js +0 -75
- package/lib-esm/DatePicker/DatePickerAnchor.d.ts +0 -5
- package/lib-esm/DatePicker/DatePickerAnchor.js +0 -132
- package/lib-esm/DatePicker/DatePickerOverlay.d.ts +0 -3
- package/lib-esm/DatePicker/DatePickerOverlay.js +0 -24
- package/lib-esm/DatePicker/DatePickerPanel.d.ts +0 -2
- package/lib-esm/DatePicker/DatePickerPanel.js +0 -100
- package/lib-esm/DatePicker/Day.d.ts +0 -14
- package/lib-esm/DatePicker/Day.js +0 -151
- package/lib-esm/DatePicker/Month.d.ts +0 -9
- package/lib-esm/DatePicker/Month.js +0 -83
- package/lib-esm/DatePicker/index.d.ts +0 -2
- package/lib-esm/DatePicker/index.js +0 -1
- package/lib-esm/DatePicker/useDatePicker.d.ts +0 -83
- package/lib-esm/DatePicker/useDatePicker.js +0 -347
- package/lib-esm/hooks/useDebounce.d.ts +0 -2
- package/lib-esm/hooks/useDebounce.js +0 -16
package/lib/ActionList/Item.d.ts
CHANGED
@@ -28,13 +28,19 @@ export interface ItemProps extends SxProp {
|
|
28
28
|
*/
|
29
29
|
leadingVisual?: React.FunctionComponent<IconProps>;
|
30
30
|
/**
|
31
|
+
* @deprecated Use `trailingVisual` instead
|
31
32
|
* Icon (or similar) positioned after `Item` text.
|
32
33
|
*/
|
33
34
|
trailingIcon?: React.FunctionComponent<IconProps>;
|
34
35
|
/**
|
36
|
+
* @deprecated Use `trailingVisual` instead
|
35
37
|
* Text positioned after `Item` text and optional trailing icon.
|
36
38
|
*/
|
37
39
|
trailingText?: string;
|
40
|
+
/**
|
41
|
+
* Icon or text positioned after `Item` text.
|
42
|
+
*/
|
43
|
+
trailingVisual?: React.ReactNode;
|
38
44
|
/**
|
39
45
|
* Style variations associated with various `Item` types.
|
40
46
|
*
|
package/lib/ActionList/Item.js
CHANGED
@@ -187,6 +187,7 @@ const Item = /*#__PURE__*/_react.default.forwardRef((itemProps, ref) => {
|
|
187
187
|
selectionVariant,
|
188
188
|
leadingVisual: LeadingVisual,
|
189
189
|
trailingIcon: TrailingIcon,
|
190
|
+
trailingVisual: TrailingVisual,
|
190
191
|
trailingText,
|
191
192
|
variant = 'default',
|
192
193
|
showDivider,
|
@@ -278,7 +279,10 @@ const Item = /*#__PURE__*/_react.default.forwardRef((itemProps, ref) => {
|
|
278
279
|
title: description,
|
279
280
|
inline: true,
|
280
281
|
maxWidth: "100%"
|
281
|
-
}, description)) : null),
|
282
|
+
}, description)) : null), TrailingVisual ? /*#__PURE__*/_react.default.createElement(TrailingContent, {
|
283
|
+
variant: variant,
|
284
|
+
disabled: disabled
|
285
|
+
}, typeof TrailingVisual === 'function' ? /*#__PURE__*/_react.default.createElement(TrailingVisual, null) : TrailingVisual) : TrailingIcon || trailingText ? /*#__PURE__*/_react.default.createElement(TrailingContent, {
|
282
286
|
variant: variant,
|
283
287
|
disabled: disabled
|
284
288
|
}, trailingText, TrailingIcon && /*#__PURE__*/_react.default.createElement(TrailingIcon, null)) : null));
|
@@ -26,8 +26,6 @@ interface AnchoredOverlayPropsWithoutAnchor {
|
|
26
26
|
*/
|
27
27
|
anchorRef: React.RefObject<HTMLElement>;
|
28
28
|
}
|
29
|
-
export declare type OverlayOpenGesture = 'anchor-click' | 'anchor-key-press';
|
30
|
-
export declare type OverlayCloseGesture = 'anchor-click' | 'click-outside' | 'escape';
|
31
29
|
export declare type AnchoredOverlayWrapperAnchorProps = Partial<AnchoredOverlayPropsWithAnchor> | AnchoredOverlayPropsWithoutAnchor;
|
32
30
|
interface AnchoredOverlayBaseProps extends Pick<OverlayProps, 'height' | 'width'> {
|
33
31
|
/**
|
@@ -37,11 +35,11 @@ interface AnchoredOverlayBaseProps extends Pick<OverlayProps, 'height' | 'width'
|
|
37
35
|
/**
|
38
36
|
* A callback which is called whenever the overlay is currently closed and an "open gesture" is detected.
|
39
37
|
*/
|
40
|
-
onOpen?: (gesture:
|
38
|
+
onOpen?: (gesture: 'anchor-click' | 'anchor-key-press') => unknown;
|
41
39
|
/**
|
42
40
|
* A callback which is called whenever the overlay is currently open and a "close gesture" is detected.
|
43
41
|
*/
|
44
|
-
onClose?: (gesture:
|
42
|
+
onClose?: (gesture: 'anchor-click' | 'click-outside' | 'escape') => unknown;
|
45
43
|
/**
|
46
44
|
* Props to be spread on the internal `Overlay` component.
|
47
45
|
*/
|
@@ -12,14 +12,12 @@ export type { AutocompleteOverlayProps } from './AutocompleteOverlay';
|
|
12
12
|
declare const _default: React.FC<{
|
13
13
|
id?: string | undefined;
|
14
14
|
}> & {
|
15
|
-
Input: import("@radix-ui/react-polymorphic").ForwardRefComponent<React.ForwardRefExoticComponent<Pick<Omit<Pick<
|
15
|
+
Input: import("@radix-ui/react-polymorphic").ForwardRefComponent<React.ForwardRefExoticComponent<Pick<Omit<Pick<{
|
16
16
|
[x: string]: any;
|
17
17
|
[x: number]: any;
|
18
18
|
} & {
|
19
19
|
theme?: any;
|
20
|
-
} &
|
21
|
-
children?: React.ReactNode;
|
22
|
-
})) & {
|
20
|
+
} & {
|
23
21
|
as?: string | React.ComponentType<any> | undefined;
|
24
22
|
forwardedAs?: string | React.ComponentType<any> | undefined;
|
25
23
|
}, string | number | symbol>, "maxWidth" | "minWidth" | "width" | "theme" | "className" | "block" | "icon" | "sx" | "disabled" | "variant" | "contrast"> & {
|
@@ -4,14 +4,12 @@ import { ComponentProps } from '../utils/types';
|
|
4
4
|
declare type InternalAutocompleteInputProps = {
|
5
5
|
as?: React.ComponentType<any>;
|
6
6
|
};
|
7
|
-
declare const AutocompleteInput: PolymorphicForwardRefComponent<React.ForwardRefExoticComponent<Pick<Omit<Pick<
|
7
|
+
declare const AutocompleteInput: PolymorphicForwardRefComponent<React.ForwardRefExoticComponent<Pick<Omit<Pick<{
|
8
8
|
[x: string]: any;
|
9
9
|
[x: number]: any;
|
10
10
|
} & {
|
11
11
|
theme?: any;
|
12
|
-
} &
|
13
|
-
children?: React.ReactNode;
|
14
|
-
})) & {
|
12
|
+
} & {
|
15
13
|
as?: string | React.ComponentType<any> | undefined;
|
16
14
|
forwardedAs?: string | React.ComponentType<any> | undefined;
|
17
15
|
}, string | number | symbol>, "maxWidth" | "minWidth" | "width" | "theme" | "className" | "block" | "icon" | "sx" | "disabled" | "variant" | "contrast"> & {
|
@@ -32,14 +32,12 @@ declare const _default: React.ForwardRefExoticComponent<Pick<SelectMenuInternalP
|
|
32
32
|
Divider: import("styled-components").StyledComponent<"div", any, SystemCommonProps & SxProp, never>;
|
33
33
|
Filter: React.ForwardRefExoticComponent<Pick<{
|
34
34
|
value?: string | undefined;
|
35
|
-
} & Pick<Omit<Pick<
|
35
|
+
} & Pick<Omit<Pick<{
|
36
36
|
[x: string]: any;
|
37
37
|
[x: number]: any;
|
38
38
|
} & {
|
39
39
|
theme?: any;
|
40
|
-
} &
|
41
|
-
children?: React.ReactNode;
|
42
|
-
})) & {
|
40
|
+
} & {
|
43
41
|
as?: string | React.ComponentType<any> | undefined;
|
44
42
|
forwardedAs?: string | React.ComponentType<any> | undefined;
|
45
43
|
}, string | number | symbol>, "maxWidth" | "minWidth" | "width" | "theme" | "className" | "block" | "icon" | "sx" | "disabled" | "variant" | "contrast"> & {
|
@@ -32,14 +32,12 @@ declare const TextInputWithTokens: React.ForwardRefExoticComponent<Pick<{
|
|
32
32
|
* Whether the remove buttons should be rendered in the tokens
|
33
33
|
*/
|
34
34
|
hideTokenRemoveButtons?: boolean | undefined;
|
35
|
-
} & Pick<Omit<Pick<
|
35
|
+
} & Pick<Omit<Pick<{
|
36
36
|
[x: string]: any;
|
37
37
|
[x: number]: any;
|
38
38
|
} & {
|
39
39
|
theme?: any;
|
40
|
-
} &
|
41
|
-
children?: React.ReactNode;
|
42
|
-
})) & {
|
40
|
+
} & {
|
43
41
|
as?: string | React.ComponentType<any> | undefined;
|
44
42
|
forwardedAs?: string | React.ComponentType<any> | undefined;
|
45
43
|
}, string | number | symbol>, "maxWidth" | "minWidth" | "width" | "theme" | "className" | "block" | "icon" | "sx" | "disabled" | "variant" | "contrast"> & {
|
package/lib/theme-preval.js
CHANGED
@@ -515,7 +515,7 @@ module.exports = {
|
|
515
515
|
}
|
516
516
|
}
|
517
517
|
},
|
518
|
-
"
|
518
|
+
"light_protanopia": {
|
519
519
|
"colors": {
|
520
520
|
"canvasDefaultTransparent": "rgba(255,255,255,0)",
|
521
521
|
"marketingIcon": {
|
@@ -2456,7 +2456,7 @@ module.exports = {
|
|
2456
2456
|
}
|
2457
2457
|
}
|
2458
2458
|
},
|
2459
|
-
"
|
2459
|
+
"dark_protanopia": {
|
2460
2460
|
"colors": {
|
2461
2461
|
"canvasDefaultTransparent": "rgba(13,17,23,0)",
|
2462
2462
|
"marketingIcon": {
|
package/lib/utils/testing.d.ts
CHANGED
@@ -53,7 +53,7 @@ export declare function render(component: React.ReactElement, theme?: {
|
|
53
53
|
xlarge: string;
|
54
54
|
};
|
55
55
|
space: string[];
|
56
|
-
colorSchemes: Record<"light" | "
|
56
|
+
colorSchemes: Record<"light" | "light_protanopia" | "dark" | "dark_dimmed" | "dark_high_contrast" | "dark_protanopia", Record<"colors" | "shadows", Partial<{
|
57
57
|
canvasDefaultTransparent: string;
|
58
58
|
marketingIcon: {
|
59
59
|
primary: string;
|
@@ -28,13 +28,19 @@ export interface ItemProps extends SxProp {
|
|
28
28
|
*/
|
29
29
|
leadingVisual?: React.FunctionComponent<IconProps>;
|
30
30
|
/**
|
31
|
+
* @deprecated Use `trailingVisual` instead
|
31
32
|
* Icon (or similar) positioned after `Item` text.
|
32
33
|
*/
|
33
34
|
trailingIcon?: React.FunctionComponent<IconProps>;
|
34
35
|
/**
|
36
|
+
* @deprecated Use `trailingVisual` instead
|
35
37
|
* Text positioned after `Item` text and optional trailing icon.
|
36
38
|
*/
|
37
39
|
trailingText?: string;
|
40
|
+
/**
|
41
|
+
* Icon or text positioned after `Item` text.
|
42
|
+
*/
|
43
|
+
trailingVisual?: React.ReactNode;
|
38
44
|
/**
|
39
45
|
* Style variations associated with various `Item` types.
|
40
46
|
*
|
@@ -154,6 +154,7 @@ export const Item = /*#__PURE__*/React.forwardRef((itemProps, ref) => {
|
|
154
154
|
selectionVariant,
|
155
155
|
leadingVisual: LeadingVisual,
|
156
156
|
trailingIcon: TrailingIcon,
|
157
|
+
trailingVisual: TrailingVisual,
|
157
158
|
trailingText,
|
158
159
|
variant = 'default',
|
159
160
|
showDivider,
|
@@ -245,7 +246,10 @@ export const Item = /*#__PURE__*/React.forwardRef((itemProps, ref) => {
|
|
245
246
|
title: description,
|
246
247
|
inline: true,
|
247
248
|
maxWidth: "100%"
|
248
|
-
}, description)) : null),
|
249
|
+
}, description)) : null), TrailingVisual ? /*#__PURE__*/React.createElement(TrailingContent, {
|
250
|
+
variant: variant,
|
251
|
+
disabled: disabled
|
252
|
+
}, typeof TrailingVisual === 'function' ? /*#__PURE__*/React.createElement(TrailingVisual, null) : TrailingVisual) : TrailingIcon || trailingText ? /*#__PURE__*/React.createElement(TrailingContent, {
|
249
253
|
variant: variant,
|
250
254
|
disabled: disabled
|
251
255
|
}, trailingText, TrailingIcon && /*#__PURE__*/React.createElement(TrailingIcon, null)) : null));
|
@@ -26,8 +26,6 @@ interface AnchoredOverlayPropsWithoutAnchor {
|
|
26
26
|
*/
|
27
27
|
anchorRef: React.RefObject<HTMLElement>;
|
28
28
|
}
|
29
|
-
export declare type OverlayOpenGesture = 'anchor-click' | 'anchor-key-press';
|
30
|
-
export declare type OverlayCloseGesture = 'anchor-click' | 'click-outside' | 'escape';
|
31
29
|
export declare type AnchoredOverlayWrapperAnchorProps = Partial<AnchoredOverlayPropsWithAnchor> | AnchoredOverlayPropsWithoutAnchor;
|
32
30
|
interface AnchoredOverlayBaseProps extends Pick<OverlayProps, 'height' | 'width'> {
|
33
31
|
/**
|
@@ -37,11 +35,11 @@ interface AnchoredOverlayBaseProps extends Pick<OverlayProps, 'height' | 'width'
|
|
37
35
|
/**
|
38
36
|
* A callback which is called whenever the overlay is currently closed and an "open gesture" is detected.
|
39
37
|
*/
|
40
|
-
onOpen?: (gesture:
|
38
|
+
onOpen?: (gesture: 'anchor-click' | 'anchor-key-press') => unknown;
|
41
39
|
/**
|
42
40
|
* A callback which is called whenever the overlay is currently open and a "close gesture" is detected.
|
43
41
|
*/
|
44
|
-
onClose?: (gesture:
|
42
|
+
onClose?: (gesture: 'anchor-click' | 'click-outside' | 'escape') => unknown;
|
45
43
|
/**
|
46
44
|
* Props to be spread on the internal `Overlay` component.
|
47
45
|
*/
|
@@ -12,14 +12,12 @@ export type { AutocompleteOverlayProps } from './AutocompleteOverlay';
|
|
12
12
|
declare const _default: React.FC<{
|
13
13
|
id?: string | undefined;
|
14
14
|
}> & {
|
15
|
-
Input: import("@radix-ui/react-polymorphic").ForwardRefComponent<React.ForwardRefExoticComponent<Pick<Omit<Pick<
|
15
|
+
Input: import("@radix-ui/react-polymorphic").ForwardRefComponent<React.ForwardRefExoticComponent<Pick<Omit<Pick<{
|
16
16
|
[x: string]: any;
|
17
17
|
[x: number]: any;
|
18
18
|
} & {
|
19
19
|
theme?: any;
|
20
|
-
} &
|
21
|
-
children?: React.ReactNode;
|
22
|
-
})) & {
|
20
|
+
} & {
|
23
21
|
as?: string | React.ComponentType<any> | undefined;
|
24
22
|
forwardedAs?: string | React.ComponentType<any> | undefined;
|
25
23
|
}, string | number | symbol>, "maxWidth" | "minWidth" | "width" | "theme" | "className" | "block" | "icon" | "sx" | "disabled" | "variant" | "contrast"> & {
|
@@ -4,14 +4,12 @@ import { ComponentProps } from '../utils/types';
|
|
4
4
|
declare type InternalAutocompleteInputProps = {
|
5
5
|
as?: React.ComponentType<any>;
|
6
6
|
};
|
7
|
-
declare const AutocompleteInput: PolymorphicForwardRefComponent<React.ForwardRefExoticComponent<Pick<Omit<Pick<
|
7
|
+
declare const AutocompleteInput: PolymorphicForwardRefComponent<React.ForwardRefExoticComponent<Pick<Omit<Pick<{
|
8
8
|
[x: string]: any;
|
9
9
|
[x: number]: any;
|
10
10
|
} & {
|
11
11
|
theme?: any;
|
12
|
-
} &
|
13
|
-
children?: React.ReactNode;
|
14
|
-
})) & {
|
12
|
+
} & {
|
15
13
|
as?: string | React.ComponentType<any> | undefined;
|
16
14
|
forwardedAs?: string | React.ComponentType<any> | undefined;
|
17
15
|
}, string | number | symbol>, "maxWidth" | "minWidth" | "width" | "theme" | "className" | "block" | "icon" | "sx" | "disabled" | "variant" | "contrast"> & {
|
@@ -32,14 +32,12 @@ declare const _default: React.ForwardRefExoticComponent<Pick<SelectMenuInternalP
|
|
32
32
|
Divider: import("styled-components").StyledComponent<"div", any, SystemCommonProps & SxProp, never>;
|
33
33
|
Filter: React.ForwardRefExoticComponent<Pick<{
|
34
34
|
value?: string | undefined;
|
35
|
-
} & Pick<Omit<Pick<
|
35
|
+
} & Pick<Omit<Pick<{
|
36
36
|
[x: string]: any;
|
37
37
|
[x: number]: any;
|
38
38
|
} & {
|
39
39
|
theme?: any;
|
40
|
-
} &
|
41
|
-
children?: React.ReactNode;
|
42
|
-
})) & {
|
40
|
+
} & {
|
43
41
|
as?: string | React.ComponentType<any> | undefined;
|
44
42
|
forwardedAs?: string | React.ComponentType<any> | undefined;
|
45
43
|
}, string | number | symbol>, "maxWidth" | "minWidth" | "width" | "theme" | "className" | "block" | "icon" | "sx" | "disabled" | "variant" | "contrast"> & {
|
@@ -32,14 +32,12 @@ declare const TextInputWithTokens: React.ForwardRefExoticComponent<Pick<{
|
|
32
32
|
* Whether the remove buttons should be rendered in the tokens
|
33
33
|
*/
|
34
34
|
hideTokenRemoveButtons?: boolean | undefined;
|
35
|
-
} & Pick<Omit<Pick<
|
35
|
+
} & Pick<Omit<Pick<{
|
36
36
|
[x: string]: any;
|
37
37
|
[x: number]: any;
|
38
38
|
} & {
|
39
39
|
theme?: any;
|
40
|
-
} &
|
41
|
-
children?: React.ReactNode;
|
42
|
-
})) & {
|
40
|
+
} & {
|
43
41
|
as?: string | React.ComponentType<any> | undefined;
|
44
42
|
forwardedAs?: string | React.ComponentType<any> | undefined;
|
45
43
|
}, string | number | symbol>, "maxWidth" | "minWidth" | "width" | "theme" | "className" | "block" | "icon" | "sx" | "disabled" | "variant" | "contrast"> & {
|
package/lib-esm/theme-preval.js
CHANGED
@@ -515,7 +515,7 @@ module.exports = {
|
|
515
515
|
}
|
516
516
|
}
|
517
517
|
},
|
518
|
-
"
|
518
|
+
"light_protanopia": {
|
519
519
|
"colors": {
|
520
520
|
"canvasDefaultTransparent": "rgba(255,255,255,0)",
|
521
521
|
"marketingIcon": {
|
@@ -2456,7 +2456,7 @@ module.exports = {
|
|
2456
2456
|
}
|
2457
2457
|
}
|
2458
2458
|
},
|
2459
|
-
"
|
2459
|
+
"dark_protanopia": {
|
2460
2460
|
"colors": {
|
2461
2461
|
"canvasDefaultTransparent": "rgba(13,17,23,0)",
|
2462
2462
|
"marketingIcon": {
|
@@ -53,7 +53,7 @@ export declare function render(component: React.ReactElement, theme?: {
|
|
53
53
|
xlarge: string;
|
54
54
|
};
|
55
55
|
space: string[];
|
56
|
-
colorSchemes: Record<"light" | "
|
56
|
+
colorSchemes: Record<"light" | "light_protanopia" | "dark" | "dark_dimmed" | "dark_high_contrast" | "dark_protanopia", Record<"colors" | "shadows", Partial<{
|
57
57
|
canvasDefaultTransparent: string;
|
58
58
|
marketingIcon: {
|
59
59
|
primary: string;
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@primer/components",
|
3
|
-
"version": "0.0.0-
|
3
|
+
"version": "0.0.0-2021926102453",
|
4
4
|
"description": "Primer react components",
|
5
5
|
"main": "lib/index.js",
|
6
6
|
"module": "lib-esm/index.js",
|
@@ -43,16 +43,20 @@
|
|
43
43
|
"author": "GitHub, Inc.",
|
44
44
|
"license": "MIT",
|
45
45
|
"dependencies": {
|
46
|
-
"@primer/octicons-react": "^
|
47
|
-
"@primer/primitives": "
|
46
|
+
"@primer/octicons-react": "^13.0.0",
|
47
|
+
"@primer/primitives": "5.1.0",
|
48
48
|
"@radix-ui/react-polymorphic": "0.0.14",
|
49
49
|
"@react-aria/ssr": "3.1.0",
|
50
50
|
"@styled-system/css": "5.1.5",
|
51
51
|
"@styled-system/props": "5.1.5",
|
52
52
|
"@styled-system/theme-get": "5.1.2",
|
53
|
+
"@types/history": "4.7.8",
|
54
|
+
"@types/styled-components": "5.1.11",
|
55
|
+
"@types/styled-system": "5.1.12",
|
56
|
+
"@types/styled-system__css": "5.0.16",
|
57
|
+
"@types/styled-system__theme-get": "5.0.1",
|
53
58
|
"classnames": "2.3.1",
|
54
59
|
"color2k": "1.2.4",
|
55
|
-
"date-fns": "2.25.0",
|
56
60
|
"deepmerge": "4.2.2",
|
57
61
|
"focus-visible": "5.2.0",
|
58
62
|
"styled-system": "5.1.5"
|
@@ -81,11 +85,6 @@
|
|
81
85
|
"@testing-library/react": "11.2.7",
|
82
86
|
"@testing-library/react-hooks": "7.0.2",
|
83
87
|
"@testing-library/user-event": "13.1.9",
|
84
|
-
"@types/history": "4.7.9",
|
85
|
-
"@types/styled-components": "5.1.15",
|
86
|
-
"@types/styled-system": "5.1.13",
|
87
|
-
"@types/styled-system__css": "5.0.16",
|
88
|
-
"@types/styled-system__theme-get": "5.0.1",
|
89
88
|
"@types/chroma-js": "2.1.3",
|
90
89
|
"@types/enzyme": "3.10.9",
|
91
90
|
"@types/jest": "26.0.23",
|
@@ -1,48 +0,0 @@
|
|
1
|
-
import React from 'react';
|
2
|
-
import { OverlayProps } from '../Overlay';
|
3
|
-
import { FocusTrapHookSettings } from '../hooks/useFocusTrap';
|
4
|
-
import { FocusZoneHookSettings } from '../hooks/useFocusZone';
|
5
|
-
import { DatePickerConfiguration, Selection } from './useDatePicker';
|
6
|
-
declare type OpenGesture = 'anchor-click' | 'anchor-key-press';
|
7
|
-
declare type CloseGesture = 'anchor-click' | 'click-outside' | 'escape';
|
8
|
-
export interface DatePickerProps extends DatePickerConfiguration {
|
9
|
-
/**
|
10
|
-
* An override to the internal ref that will be spread on to the renderAnchor
|
11
|
-
*/
|
12
|
-
anchorRef?: React.RefObject<HTMLElement>;
|
13
|
-
/**
|
14
|
-
* Settings to apply to the Focus Zone on the internal `Overlay` component.
|
15
|
-
*/
|
16
|
-
focusTrapSettings?: Partial<FocusTrapHookSettings>;
|
17
|
-
/**
|
18
|
-
* Settings to apply to the Focus Zone on the internal `Overlay` component.
|
19
|
-
*/
|
20
|
-
focusZoneSettings?: Partial<FocusZoneHookSettings>;
|
21
|
-
initialValue?: 'today' | Date | string | null;
|
22
|
-
iconOnly?: boolean;
|
23
|
-
placeholder?: string;
|
24
|
-
/**
|
25
|
-
* Determines whether the overlay portion of the component should be shown or not
|
26
|
-
*/
|
27
|
-
open?: boolean;
|
28
|
-
/**
|
29
|
-
* A callback which is called whenever the overlay is currently closed and an "open gesture" is detected.
|
30
|
-
*/
|
31
|
-
onOpen?: (gesture: OpenGesture) => unknown;
|
32
|
-
/**
|
33
|
-
* A callback which is called whenever the overlay is currently open and a "close gesture" is detected.
|
34
|
-
*/
|
35
|
-
onClose?: (gesture: CloseGesture) => unknown;
|
36
|
-
/**
|
37
|
-
* Props to be spread on the internal `Overlay` component.
|
38
|
-
*/
|
39
|
-
overlayProps?: Partial<OverlayProps>;
|
40
|
-
/**
|
41
|
-
* A custom function component used to render the anchor element.
|
42
|
-
* Will receive the selected text as `children` prop when an item is activated.
|
43
|
-
*/
|
44
|
-
renderAnchor: <T extends React.HTMLAttributes<HTMLElement>>(props: T) => JSX.Element;
|
45
|
-
value?: Selection;
|
46
|
-
}
|
47
|
-
export declare const DatePicker: React.FC<DatePickerProps>;
|
48
|
-
export {};
|
@@ -1,92 +0,0 @@
|
|
1
|
-
"use strict";
|
2
|
-
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
4
|
-
value: true
|
5
|
-
});
|
6
|
-
exports.DatePicker = void 0;
|
7
|
-
|
8
|
-
var _react = _interopRequireWildcard(require("react"));
|
9
|
-
|
10
|
-
var _DatePickerAnchor = require("./DatePickerAnchor");
|
11
|
-
|
12
|
-
var _useDatePicker = require("./useDatePicker");
|
13
|
-
|
14
|
-
var _DatePickerOverlay = require("./DatePickerOverlay");
|
15
|
-
|
16
|
-
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
17
|
-
|
18
|
-
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
19
|
-
|
20
|
-
const DatePicker = ({
|
21
|
-
anchorVariant,
|
22
|
-
anchorRef: externalAnchorRef,
|
23
|
-
confirmation,
|
24
|
-
dateFormat,
|
25
|
-
focusTrapSettings,
|
26
|
-
focusZoneSettings,
|
27
|
-
maxDate,
|
28
|
-
minDate,
|
29
|
-
onOpen: onOpenExternal,
|
30
|
-
onClose: onCloseExternal,
|
31
|
-
open,
|
32
|
-
overlayProps,
|
33
|
-
renderAnchor,
|
34
|
-
selection,
|
35
|
-
value,
|
36
|
-
view,
|
37
|
-
weekStartsOn
|
38
|
-
}) => {
|
39
|
-
const buttonRef = (0, _react.useRef)(null);
|
40
|
-
const [isOpen, setIsOpen] = (0, _react.useState)(false);
|
41
|
-
const datePickerConfiguration = {
|
42
|
-
anchorVariant,
|
43
|
-
confirmation,
|
44
|
-
dateFormat,
|
45
|
-
maxDate,
|
46
|
-
minDate,
|
47
|
-
selection,
|
48
|
-
view,
|
49
|
-
weekStartsOn
|
50
|
-
};
|
51
|
-
|
52
|
-
const onOpen = gesture => {
|
53
|
-
setIsOpen(true);
|
54
|
-
onOpenExternal === null || onOpenExternal === void 0 ? void 0 : onOpenExternal(gesture);
|
55
|
-
};
|
56
|
-
|
57
|
-
const onClose = gesture => {
|
58
|
-
setIsOpen(false);
|
59
|
-
onCloseExternal === null || onCloseExternal === void 0 ? void 0 : onCloseExternal(gesture);
|
60
|
-
};
|
61
|
-
|
62
|
-
const toggleIsOpen = () => {
|
63
|
-
if (isOpen) {
|
64
|
-
setIsOpen(false);
|
65
|
-
onCloseExternal === null || onCloseExternal === void 0 ? void 0 : onCloseExternal('anchor-click');
|
66
|
-
} else {
|
67
|
-
setIsOpen(true);
|
68
|
-
onCloseExternal === null || onCloseExternal === void 0 ? void 0 : onCloseExternal('anchor-click');
|
69
|
-
}
|
70
|
-
};
|
71
|
-
|
72
|
-
return /*#__PURE__*/_react.default.createElement(_useDatePicker.DatePickerProvider, {
|
73
|
-
configuration: datePickerConfiguration,
|
74
|
-
value: value,
|
75
|
-
closePicker: () => setIsOpen(false)
|
76
|
-
}, /*#__PURE__*/_react.default.createElement(_DatePickerAnchor.DatePickerAnchor, {
|
77
|
-
ref: buttonRef,
|
78
|
-
onAction: toggleIsOpen
|
79
|
-
}), /*#__PURE__*/_react.default.createElement(_DatePickerOverlay.DatePickerOverlay, {
|
80
|
-
anchorRef: externalAnchorRef !== null && externalAnchorRef !== void 0 ? externalAnchorRef : buttonRef,
|
81
|
-
renderAnchor: renderAnchor,
|
82
|
-
open: open !== null && open !== void 0 ? open : isOpen,
|
83
|
-
onOpen: onOpen,
|
84
|
-
onClose: onClose,
|
85
|
-
overlayProps: overlayProps,
|
86
|
-
focusTrapSettings: focusTrapSettings,
|
87
|
-
focusZoneSettings: focusZoneSettings
|
88
|
-
}));
|
89
|
-
};
|
90
|
-
|
91
|
-
exports.DatePicker = DatePicker;
|
92
|
-
DatePicker.displayName = "DatePicker";
|
@@ -1,5 +0,0 @@
|
|
1
|
-
import React from 'react';
|
2
|
-
export interface DatePickerAnchorProps {
|
3
|
-
onAction?: (event?: React.MouseEvent<HTMLDivElement> | React.KeyboardEvent<HTMLDivElement>) => void;
|
4
|
-
}
|
5
|
-
export declare const DatePickerAnchor: React.ForwardRefExoticComponent<DatePickerAnchorProps & React.RefAttributes<HTMLDivElement>>;
|