@primer/styled-react 0.0.0-20251010231629 → 0.0.0-20251011004249
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/dist/components/Button.d.ts +13 -0
- package/dist/components/Button.d.ts.map +1 -0
- package/dist/components/Button.js +110 -0
- package/dist/components/IconButton.d.ts +9 -0
- package/dist/components/IconButton.d.ts.map +1 -0
- package/dist/components/IconButton.js +38 -0
- package/dist/components/PageHeader.d.ts.map +1 -1
- package/dist/components/TextInput.d.ts +20 -0
- package/dist/components/TextInput.d.ts.map +1 -0
- package/dist/components/TextInput.js +37 -0
- package/dist/components.json +3 -0
- package/dist/index.d.ts +3 -4
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +4 -1
- package/dist/sx.d.ts +3 -0
- package/dist/sx.d.ts.map +1 -1
- package/package.json +3 -3
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { type ButtonProps as PrimerButtonProps } from '@primer/react';
|
|
2
|
+
import type { SxProp } from '../sx';
|
|
3
|
+
import type { BetterSystemStyleObject } from '../styled-props';
|
|
4
|
+
import type { ForwardRefComponent } from '../polymorphic';
|
|
5
|
+
type ButtonComponentProps = PrimerButtonProps & SxProp & {
|
|
6
|
+
as?: React.ElementType;
|
|
7
|
+
};
|
|
8
|
+
declare const ButtonComponent: ForwardRefComponent<"button", ButtonComponentProps>;
|
|
9
|
+
export declare function generateCustomSxProp(props: Partial<Pick<PrimerButtonProps, 'size' | 'block' | 'leadingVisual' | 'trailingVisual' | 'trailingAction'>>, providedSx: BetterSystemStyleObject): {
|
|
10
|
+
[key: string]: BetterSystemStyleObject;
|
|
11
|
+
};
|
|
12
|
+
export { ButtonComponent, type ButtonComponentProps };
|
|
13
|
+
//# sourceMappingURL=Button.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/components/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAyB,KAAK,WAAW,IAAI,iBAAiB,EAAC,MAAM,eAAe,CAAA;AAC3F,OAAO,KAAK,EAAC,MAAM,EAAsB,MAAM,OAAO,CAAA;AACtD,OAAO,KAAK,EAAC,uBAAuB,EAAC,MAAM,iBAAiB,CAAA;AAE5D,OAAO,KAAK,EAAC,mBAAmB,EAAC,MAAM,gBAAgB,CAAA;AAIvD,KAAK,oBAAoB,GAAG,iBAAiB,GAAG,MAAM,GAAG;IAAC,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,CAAA;CAAC,CAAA;AAQjF,QAAA,MAAM,eAAe,EAgBf,mBAAmB,CAAC,QAAQ,EAAE,oBAAoB,CAAC,CAAA;AA0CzD,wBAAgB,oBAAoB,CAClC,KAAK,EAAE,OAAO,CAAC,IAAI,CAAC,iBAAiB,EAAE,MAAM,GAAG,OAAO,GAAG,eAAe,GAAG,gBAAgB,GAAG,gBAAgB,CAAC,CAAC,EACjH,UAAU,EAAE,uBAAuB;;EAmBpC;AAID,OAAO,EAAC,eAAe,EAAE,KAAK,oBAAoB,EAAC,CAAA"}
|
|
@@ -0,0 +1,110 @@
|
|
|
1
|
+
import { Button, sx } from '@primer/react';
|
|
2
|
+
import { forwardRef } from 'react';
|
|
3
|
+
import styled from 'styled-components';
|
|
4
|
+
import { jsx } from 'react/jsx-runtime';
|
|
5
|
+
|
|
6
|
+
const StyledButtonComponent = styled(Button).withConfig({
|
|
7
|
+
shouldForwardProp: prop => prop !== 'sx'
|
|
8
|
+
}).withConfig({
|
|
9
|
+
displayName: "Button__StyledButtonComponent",
|
|
10
|
+
componentId: "sc-vqy3e4-0"
|
|
11
|
+
})(["", ""], sx);
|
|
12
|
+
const ButtonComponent = /*#__PURE__*/forwardRef(({
|
|
13
|
+
as,
|
|
14
|
+
sx,
|
|
15
|
+
style: propStyle,
|
|
16
|
+
...props
|
|
17
|
+
}, ref) => {
|
|
18
|
+
const {
|
|
19
|
+
block,
|
|
20
|
+
size = 'medium',
|
|
21
|
+
leadingVisual,
|
|
22
|
+
trailingVisual,
|
|
23
|
+
trailingAction
|
|
24
|
+
} = props;
|
|
25
|
+
let sxStyles = {};
|
|
26
|
+
const style = {
|
|
27
|
+
...(propStyle || {})
|
|
28
|
+
};
|
|
29
|
+
if (sx !== null && Object.keys(sx || {}).length > 0) {
|
|
30
|
+
sxStyles = generateCustomSxProp({
|
|
31
|
+
block,
|
|
32
|
+
size,
|
|
33
|
+
leadingVisual,
|
|
34
|
+
trailingVisual,
|
|
35
|
+
trailingAction
|
|
36
|
+
}, sx);
|
|
37
|
+
const {
|
|
38
|
+
color
|
|
39
|
+
} = sx;
|
|
40
|
+
if (color) style['--button-color'] = color;
|
|
41
|
+
}
|
|
42
|
+
return /*#__PURE__*/jsx(StyledButtonComponent, {
|
|
43
|
+
style: style,
|
|
44
|
+
sx: sxStyles,
|
|
45
|
+
ref: ref,
|
|
46
|
+
...props,
|
|
47
|
+
...(as ? {
|
|
48
|
+
forwardedAs: as
|
|
49
|
+
} : {})
|
|
50
|
+
});
|
|
51
|
+
});
|
|
52
|
+
|
|
53
|
+
// This function is used to generate a custom cssSelector for the sxProp
|
|
54
|
+
|
|
55
|
+
// The usual sx prop can like this:
|
|
56
|
+
// sx={{
|
|
57
|
+
// [`@media (max-width: 768px)`]: {
|
|
58
|
+
// '& > ul': {
|
|
59
|
+
// backgroundColor: 'deeppink',
|
|
60
|
+
// },
|
|
61
|
+
// '&:hover': {
|
|
62
|
+
// backgroundColor: 'yellow',
|
|
63
|
+
// },
|
|
64
|
+
// },
|
|
65
|
+
// '&:hover': {
|
|
66
|
+
// backgroundColor: 'yellow',
|
|
67
|
+
// },
|
|
68
|
+
// '&': {
|
|
69
|
+
// width : 320px
|
|
70
|
+
// }
|
|
71
|
+
// }}
|
|
72
|
+
//*
|
|
73
|
+
/* What we want for Button styles is this:
|
|
74
|
+
sx={{
|
|
75
|
+
// [`@media (max-width: 768px)`]: {
|
|
76
|
+
// '&[data-attribute="something"] > ul': {
|
|
77
|
+
// backgroundColor: 'deeppink',
|
|
78
|
+
// },
|
|
79
|
+
// '&[data-attribute="something"]:hover': {
|
|
80
|
+
// backgroundColor: 'yellow',
|
|
81
|
+
// },
|
|
82
|
+
// },
|
|
83
|
+
// '&[data-attribute="something"]:hover': {
|
|
84
|
+
// backgroundColor: 'yellow',
|
|
85
|
+
// },
|
|
86
|
+
// '&[data-attribute="something"]': {
|
|
87
|
+
// width : 320px
|
|
88
|
+
// }
|
|
89
|
+
// }}
|
|
90
|
+
|
|
91
|
+
// We need to make sure we append the customCSSSelector to the original class selector. i.e & - > &[data-attribute="Icon"][data-size="small"]
|
|
92
|
+
*/
|
|
93
|
+
function generateCustomSxProp(props, providedSx) {
|
|
94
|
+
// Possible data attributes: data-size, data-block, data-no-visuals
|
|
95
|
+
const size = `[data-size="${props.size}"]`;
|
|
96
|
+
const block = props.block ? `[data-block="block"]` : '';
|
|
97
|
+
const noVisuals = props.leadingVisual || props.trailingVisual || props.trailingAction ? '' : '[data-no-visuals]';
|
|
98
|
+
|
|
99
|
+
// this is a custom selector. We need to make sure we add the data attributes to the base css class (& -> &[data-attributename="value"]])
|
|
100
|
+
const cssSelector = `&${size}${block}${noVisuals}`; // &[data-size="small"][data-block="block"][data-no-visuals]
|
|
101
|
+
|
|
102
|
+
const customSxProp = {};
|
|
103
|
+
if (!providedSx) return customSxProp;else {
|
|
104
|
+
customSxProp[cssSelector] = providedSx;
|
|
105
|
+
return customSxProp;
|
|
106
|
+
}
|
|
107
|
+
}
|
|
108
|
+
ButtonComponent.displayName = 'Button';
|
|
109
|
+
|
|
110
|
+
export { ButtonComponent, generateCustomSxProp };
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { type IconButtonProps as PrimerIconButtonProps, type SxProp } from '@primer/react';
|
|
2
|
+
import { type ForwardRefComponent } from '../polymorphic';
|
|
3
|
+
type IconButtonProps = PrimerIconButtonProps & SxProp & {
|
|
4
|
+
as?: React.ElementType;
|
|
5
|
+
};
|
|
6
|
+
declare const IconButton: ForwardRefComponent<"a" | "button", IconButtonProps>;
|
|
7
|
+
export { IconButton };
|
|
8
|
+
export type { IconButtonProps };
|
|
9
|
+
//# sourceMappingURL=IconButton.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../src/components/IconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiC,KAAK,eAAe,IAAI,qBAAqB,EAAE,KAAK,MAAM,EAAC,MAAM,eAAe,CAAA;AACxH,OAAO,EAAC,KAAK,mBAAmB,EAAC,MAAM,gBAAgB,CAAA;AAMvD,KAAK,eAAe,GAAG,qBAAqB,GAAG,MAAM,GAAG;IAAC,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,CAAA;CAAC,CAAA;AAQhF,QAAA,MAAM,UAAU,EAUV,mBAAmB,CAAC,GAAG,GAAG,QAAQ,EAAE,eAAe,CAAC,CAAA;AAE1D,OAAO,EAAC,UAAU,EAAC,CAAA;AACnB,YAAY,EAAC,eAAe,EAAC,CAAA"}
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import { IconButton as IconButton$1, sx } from '@primer/react';
|
|
2
|
+
import { generateCustomSxProp } from './Button.js';
|
|
3
|
+
import { forwardRef } from 'react';
|
|
4
|
+
import styled from 'styled-components';
|
|
5
|
+
import { jsx } from 'react/jsx-runtime';
|
|
6
|
+
|
|
7
|
+
const StyledIconButton = styled(IconButton$1).withConfig({
|
|
8
|
+
shouldForwardProp: prop => prop !== 'sx'
|
|
9
|
+
}).withConfig({
|
|
10
|
+
displayName: "IconButton__StyledIconButton",
|
|
11
|
+
componentId: "sc-i53dt6-0"
|
|
12
|
+
})(["", ""], sx);
|
|
13
|
+
const IconButton = /*#__PURE__*/forwardRef(({
|
|
14
|
+
as,
|
|
15
|
+
sx,
|
|
16
|
+
...props
|
|
17
|
+
}, ref) => {
|
|
18
|
+
let sxStyles = sx;
|
|
19
|
+
// grap the button props that have associated data attributes in the styles
|
|
20
|
+
const {
|
|
21
|
+
size = 'medium'
|
|
22
|
+
} = props;
|
|
23
|
+
if (sx !== null && sx !== undefined && Object.keys(sx).length > 0) {
|
|
24
|
+
sxStyles = generateCustomSxProp({
|
|
25
|
+
size
|
|
26
|
+
}, sx);
|
|
27
|
+
}
|
|
28
|
+
return /*#__PURE__*/jsx(StyledIconButton, {
|
|
29
|
+
sx: sxStyles,
|
|
30
|
+
...props,
|
|
31
|
+
...(as ? {
|
|
32
|
+
forwardedAs: as
|
|
33
|
+
} : {}),
|
|
34
|
+
ref: ref
|
|
35
|
+
});
|
|
36
|
+
});
|
|
37
|
+
|
|
38
|
+
export { IconButton };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PageHeader.d.ts","sourceRoot":"","sources":["../../src/components/PageHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,UAAU,IAAI,gBAAgB,EAC9B,KAAK,eAAe,IAAI,qBAAqB,EAC7C,KAAK,oBAAoB,IAAI,0BAA0B,EACvD,KAAK,sBAAsB,IAAI,4BAA4B,EAC3D,KAAK,wBAAwB,IAAI,8BAA8B,EAChE,MAAM,eAAe,CAAA;AAEtB,OAAO,EAAK,KAAK,MAAM,
|
|
1
|
+
{"version":3,"file":"PageHeader.d.ts","sourceRoot":"","sources":["../../src/components/PageHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,UAAU,IAAI,gBAAgB,EAC9B,KAAK,eAAe,IAAI,qBAAqB,EAC7C,KAAK,oBAAoB,IAAI,0BAA0B,EACvD,KAAK,sBAAsB,IAAI,4BAA4B,EAC3D,KAAK,wBAAwB,IAAI,8BAA8B,EAChE,MAAM,eAAe,CAAA;AAEtB,OAAO,EAAK,KAAK,MAAM,EAA2B,MAAM,OAAO,CAAA;AAC/D,OAAO,KAAK,EAAC,mBAAmB,EAAC,MAAM,gBAAgB,CAAA;AAEvD,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,OAAO,CAAA;AAC5C,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,KAAK,eAAe,GAAG,qBAAqB,GAAG,MAAM,CAAA;AAcrD,KAAK,sBAAsB,GAAG,4BAA4B,GAAG,MAAM,CAAA;AAEnE,iBAAS,iBAAiB,CAAC,EAAC,EAAE,EAAE,GAAG,IAAI,EAAC,EAAE,sBAAsB,qBAY/D;AAED,KAAK,oBAAoB,GAAG,iBAAiB,CAAC,0BAA0B,CAAC,GAAG,MAAM,CAAA;AAwBlF,QAAA,MAAM,eAAe,GAAI,kBAAgB,oBAAoB,sBAE5D,CAAA;AAED,KAAK,wBAAwB,GAAG,iBAAiB,CAAC,8BAA8B,CAAC,GAAG,MAAM,CAAA;AAE1F,QAAA,MAAM,mBAAmB,EAAE,mBAAmB,CAAC,KAAK,EAAE,wBAAwB,CAM7E,CAAA;AAED,KAAK,uBAAuB,GAAG,mBAAmB,CAAC,KAAK,EAAE,eAAe,CAAC,GAAG;IAC3E,OAAO,EAAE,OAAO,iBAAiB,CAAA;IACjC,WAAW,EAAE,OAAO,gBAAgB,CAAC,WAAW,CAAA;IAChD,UAAU,EAAE,OAAO,gBAAgB,CAAC,UAAU,CAAA;IAC9C,UAAU,EAAE,OAAO,gBAAgB,CAAC,UAAU,CAAA;IAC9C,SAAS,EAAE,OAAO,mBAAmB,CAAA;IACrC,kBAAkB,EAAE,OAAO,gBAAgB,CAAC,kBAAkB,CAAA;IAC9D,aAAa,EAAE,OAAO,gBAAgB,CAAC,aAAa,CAAA;IACpD,WAAW,EAAE,OAAO,gBAAgB,CAAC,WAAW,CAAA;IAChD,aAAa,EAAE,OAAO,gBAAgB,CAAC,aAAa,CAAA;IACpD,KAAK,EAAE,OAAO,eAAe,CAAA;IAC7B,cAAc,EAAE,OAAO,gBAAgB,CAAC,cAAc,CAAA;IACtD,WAAW,EAAE,OAAO,gBAAgB,CAAC,WAAW,CAAA;IAChD,cAAc,EAAE,OAAO,gBAAgB,CAAC,cAAc,CAAA;CACvD,CAAA;AAED,QAAA,MAAM,UAAU,EAAE,uBAchB,CAAA;AAEF,OAAO,EAAC,UAAU,EAAC,CAAA;AACnB,YAAY,EAAC,eAAe,EAAE,sBAAsB,EAAE,oBAAoB,EAAC,CAAA"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { type TextInputProps as PrimerTextInputProps, type TextInputActionProps as PrimerTextInputActionProps } from '@primer/react';
|
|
2
|
+
import type { SxProp } from '../sx';
|
|
3
|
+
import type { ForwardRefExoticComponent, RefAttributes } from 'react';
|
|
4
|
+
export type TextInputProps = PrimerTextInputProps & SxProp & {
|
|
5
|
+
as?: React.ElementType;
|
|
6
|
+
};
|
|
7
|
+
export type TextInputActionProps = PrimerTextInputActionProps & SxProp;
|
|
8
|
+
declare const TextInputAction: ForwardRefExoticComponent<Omit<import("react").ButtonHTMLAttributes<HTMLButtonElement>, "size" | "aria-label" | "tooltipDirection"> & {
|
|
9
|
+
children?: React.ReactNode;
|
|
10
|
+
"aria-label"?: string;
|
|
11
|
+
tooltipDirection?: "n" | "ne" | "e" | "se" | "s" | "sw" | "w" | "nw";
|
|
12
|
+
icon?: React.FunctionComponent<React.PropsWithChildren<import("@primer/octicons-react").IconProps>>;
|
|
13
|
+
variant?: import("@primer/react").ButtonProps["variant"];
|
|
14
|
+
} & SxProp & RefAttributes<HTMLButtonElement>>;
|
|
15
|
+
type TextInputComposite = ForwardRefExoticComponent<TextInputProps & RefAttributes<HTMLInputElement>> & {
|
|
16
|
+
Action: typeof TextInputAction;
|
|
17
|
+
};
|
|
18
|
+
export declare const TextInput: TextInputComposite;
|
|
19
|
+
export {};
|
|
20
|
+
//# sourceMappingURL=TextInput.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TextInput.d.ts","sourceRoot":"","sources":["../../src/components/TextInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,cAAc,IAAI,oBAAoB,EAC3C,KAAK,oBAAoB,IAAI,0BAA0B,EACxD,MAAM,eAAe,CAAA;AAGtB,OAAO,KAAK,EAAC,MAAM,EAAC,MAAM,OAAO,CAAA;AACjC,OAAO,KAAK,EAAC,yBAAyB,EAAE,aAAa,EAAC,MAAM,OAAO,CAAA;AAEnE,MAAM,MAAM,cAAc,GAAG,oBAAoB,GAAG,MAAM,GAAG;IAAC,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,CAAA;CAAC,CAAA;AACrF,MAAM,MAAM,oBAAoB,GAAG,0BAA0B,GAAG,MAAM,CAAA;AAUtE,QAAA,MAAM,eAAe;;;;;;8CAEnB,CAAA;AAEF,KAAK,kBAAkB,GAAG,yBAAyB,CAAC,cAAc,GAAG,aAAa,CAAC,gBAAgB,CAAC,CAAC,GAAG;IACtG,MAAM,EAAE,OAAO,eAAe,CAAA;CAC/B,CAAA;AAED,eAAO,MAAM,SAAS,EAAE,kBAEtB,CAAA"}
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import { Box, TextInput as TextInput$1 } from '@primer/react';
|
|
2
|
+
import { forwardRef } from 'react';
|
|
3
|
+
import { jsx } from 'react/jsx-runtime';
|
|
4
|
+
|
|
5
|
+
const StyledTextInput = /*#__PURE__*/forwardRef((props, ref) => {
|
|
6
|
+
return /*#__PURE__*/jsx(Box, {
|
|
7
|
+
as: TextInput$1,
|
|
8
|
+
ref: ref,
|
|
9
|
+
...props
|
|
10
|
+
});
|
|
11
|
+
});
|
|
12
|
+
const TextInputImpl = /*#__PURE__*/forwardRef(({
|
|
13
|
+
as,
|
|
14
|
+
...props
|
|
15
|
+
}, ref) => {
|
|
16
|
+
return /*#__PURE__*/jsx(StyledTextInput, {
|
|
17
|
+
ref: ref,
|
|
18
|
+
...props,
|
|
19
|
+
...(as ? {
|
|
20
|
+
forwardedAs: as
|
|
21
|
+
} : {})
|
|
22
|
+
});
|
|
23
|
+
});
|
|
24
|
+
const TextInputAction = /*#__PURE__*/forwardRef((props, ref) => {
|
|
25
|
+
return /*#__PURE__*/jsx(Box, {
|
|
26
|
+
as: TextInput$1.Action,
|
|
27
|
+
ref: ref,
|
|
28
|
+
...props
|
|
29
|
+
});
|
|
30
|
+
});
|
|
31
|
+
const TextInput = Object.assign(TextInputImpl, {
|
|
32
|
+
Action: TextInputAction
|
|
33
|
+
});
|
|
34
|
+
TextInputAction.displayName = 'TextInputAction';
|
|
35
|
+
TextInputImpl.displayName = 'TextInput';
|
|
36
|
+
|
|
37
|
+
export { TextInput };
|
package/dist/components.json
CHANGED
|
@@ -65,6 +65,7 @@
|
|
|
65
65
|
"BoxProps",
|
|
66
66
|
"BreadcrumbsItemProps",
|
|
67
67
|
"BreadcrumbsProps",
|
|
68
|
+
"ButtonProps",
|
|
68
69
|
"CheckboxGroupProps",
|
|
69
70
|
"CheckboxProps",
|
|
70
71
|
"CounterLabelProps",
|
|
@@ -72,6 +73,7 @@
|
|
|
72
73
|
"DialogHeaderProps",
|
|
73
74
|
"DialogProps",
|
|
74
75
|
"HeaderProps",
|
|
76
|
+
"IconButtonProps",
|
|
75
77
|
"LabelProps",
|
|
76
78
|
"LinkButtonProps",
|
|
77
79
|
"LinkProps",
|
|
@@ -102,6 +104,7 @@
|
|
|
102
104
|
"TableTitleProps",
|
|
103
105
|
"TabNavLinkProps",
|
|
104
106
|
"TabNavProps",
|
|
107
|
+
"TextInputActionProps",
|
|
105
108
|
"TextInputProps",
|
|
106
109
|
"TextProps",
|
|
107
110
|
"TimelineBadgeProps",
|
package/dist/index.d.ts
CHANGED
|
@@ -1,13 +1,9 @@
|
|
|
1
1
|
export { Box, type BoxProps } from './components/Box';
|
|
2
|
-
export { Button } from '@primer/react';
|
|
3
2
|
export { Details } from '@primer/react';
|
|
4
3
|
export { FormControl } from '@primer/react';
|
|
5
|
-
export { IconButton } from '@primer/react';
|
|
6
4
|
export { ProgressBar } from '@primer/react';
|
|
7
5
|
export { Select } from '@primer/react';
|
|
8
6
|
export { Textarea } from '@primer/react';
|
|
9
|
-
export { TextInput } from '@primer/react';
|
|
10
|
-
export { type TextInputProps } from '@primer/react';
|
|
11
7
|
export { ThemeProvider, useTheme, useColorSchemeVar, BaseStyles } from './components/FeatureFlaggedTheming';
|
|
12
8
|
export { merge } from '@primer/react';
|
|
13
9
|
export { theme } from '@primer/react';
|
|
@@ -17,6 +13,7 @@ export { ActionMenu } from './components/ActionMenu';
|
|
|
17
13
|
export { Autocomplete, type AutocompleteOverlayProps } from './components/Autocomplete';
|
|
18
14
|
export { Avatar, type AvatarProps } from './components/Avatar';
|
|
19
15
|
export { Breadcrumbs, Breadcrumb, type BreadcrumbsProps, type BreadcrumbsItemProps } from './components/Breadcrumbs';
|
|
16
|
+
export { ButtonComponent as Button, type ButtonComponentProps as ButtonProps } from './components/Button';
|
|
20
17
|
export { Checkbox, type CheckboxProps } from './components/Checkbox';
|
|
21
18
|
export { CheckboxGroup, type CheckboxGroupProps } from './components/CheckboxGroup';
|
|
22
19
|
export { CircleBadge } from './components/CircleBadge';
|
|
@@ -25,6 +22,7 @@ export { Dialog, type DialogProps } from './components/Dialog';
|
|
|
25
22
|
export { Flash } from './components/Flash';
|
|
26
23
|
export { Header, type HeaderProps } from './components/Header';
|
|
27
24
|
export { Heading } from './components/Heading';
|
|
25
|
+
export { IconButton, type IconButtonProps } from './components/IconButton';
|
|
28
26
|
export { Label, type LabelProps } from './components/Label';
|
|
29
27
|
export { Link, type LinkProps } from './components/Link';
|
|
30
28
|
export { LinkButton, type LinkButtonProps } from './components/LinkButton';
|
|
@@ -39,6 +37,7 @@ export { Spinner, type SpinnerProps } from './components/Spinner';
|
|
|
39
37
|
export { StateLabel, type StateLabelProps } from './components/StateLabel';
|
|
40
38
|
export { SubNav, type SubNavProps, type SubNavLinkProps } from './components/SubNav';
|
|
41
39
|
export { Text, type TextProps } from './components/Text';
|
|
40
|
+
export { TextInput, type TextInputProps, type TextInputActionProps } from './components/TextInput';
|
|
42
41
|
export { Timeline, type TimelineProps, type TimelineItemProps, type TimelineBadgeProps, type TimelineBodyProps, type TimelineBreakProps, } from './components/Timeline';
|
|
43
42
|
export { ToggleSwitch, type ToggleSwitchProps } from './components/ToggleSwitch';
|
|
44
43
|
export { Tooltip, type TooltipProps } from './components/Tooltip';
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAC,GAAG,EAAE,KAAK,QAAQ,EAAC,MAAM,kBAAkB,CAAA;AACnD,OAAO,EAAC,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAC,GAAG,EAAE,KAAK,QAAQ,EAAC,MAAM,kBAAkB,CAAA;AACnD,OAAO,EAAC,OAAO,EAAC,MAAM,eAAe,CAAA;AACrC,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAA;AACzC,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAA;AACzC,OAAO,EAAC,MAAM,EAAC,MAAM,eAAe,CAAA;AACpC,OAAO,EAAC,QAAQ,EAAC,MAAM,eAAe,CAAA;AAGtC,OAAO,EAAC,aAAa,EAAE,QAAQ,EAAE,iBAAiB,EAAE,UAAU,EAAC,MAAM,oCAAoC,CAAA;AACzG,OAAO,EAAC,KAAK,EAAC,MAAM,eAAe,CAAA;AACnC,OAAO,EAAC,KAAK,EAAC,MAAM,eAAe,CAAA;AACnC,OAAO,EAAC,QAAQ,EAAC,MAAM,eAAe,CAAA;AAEtC,OAAO,EACL,UAAU,EACV,KAAK,eAAe,EACpB,KAAK,mBAAmB,EACxB,KAAK,uBAAuB,EAC5B,KAAK,oBAAoB,EACzB,KAAK,sBAAsB,EAC3B,KAAK,4BAA4B,EACjC,KAAK,6BAA6B,EAClC,KAAK,6BAA6B,GACnC,MAAM,yBAAyB,CAAA;AAChC,OAAO,EAAC,UAAU,EAAC,MAAM,yBAAyB,CAAA;AAClD,OAAO,EAAC,YAAY,EAAE,KAAK,wBAAwB,EAAC,MAAM,2BAA2B,CAAA;AACrF,OAAO,EAAC,MAAM,EAAE,KAAK,WAAW,EAAC,MAAM,qBAAqB,CAAA;AAC5D,OAAO,EAAC,WAAW,EAAE,UAAU,EAAE,KAAK,gBAAgB,EAAE,KAAK,oBAAoB,EAAC,MAAM,0BAA0B,CAAA;AAClH,OAAO,EAAC,eAAe,IAAI,MAAM,EAAE,KAAK,oBAAoB,IAAI,WAAW,EAAC,MAAM,qBAAqB,CAAA;AACvG,OAAO,EAAC,QAAQ,EAAE,KAAK,aAAa,EAAC,MAAM,uBAAuB,CAAA;AAClE,OAAO,EAAC,aAAa,EAAE,KAAK,kBAAkB,EAAC,MAAM,4BAA4B,CAAA;AACjF,OAAO,EAAC,WAAW,EAAC,MAAM,0BAA0B,CAAA;AACpD,OAAO,EAAC,YAAY,EAAE,KAAK,iBAAiB,EAAC,MAAM,2BAA2B,CAAA;AAC9E,OAAO,EAAC,MAAM,EAAE,KAAK,WAAW,EAAC,MAAM,qBAAqB,CAAA;AAC5D,OAAO,EAAC,KAAK,EAAC,MAAM,oBAAoB,CAAA;AACxC,OAAO,EAAC,MAAM,EAAE,KAAK,WAAW,EAAC,MAAM,qBAAqB,CAAA;AAC5D,OAAO,EAAC,OAAO,EAAC,MAAM,sBAAsB,CAAA;AAC5C,OAAO,EAAC,UAAU,EAAE,KAAK,eAAe,EAAC,MAAM,yBAAyB,CAAA;AACxE,OAAO,EAAC,KAAK,EAAE,KAAK,UAAU,EAAC,MAAM,oBAAoB,CAAA;AACzD,OAAO,EAAC,IAAI,EAAE,KAAK,SAAS,EAAC,MAAM,mBAAmB,CAAA;AACtD,OAAO,EAAC,UAAU,EAAE,KAAK,eAAe,EAAC,MAAM,yBAAyB,CAAA;AACxE,OAAO,EAAC,OAAO,EAAE,KAAK,YAAY,EAAC,MAAM,sBAAsB,CAAA;AAC/D,OAAO,EAAC,OAAO,EAAC,MAAM,sBAAsB,CAAA;AAC5C,OAAO,EAAC,UAAU,EAAE,KAAK,eAAe,EAAC,MAAM,yBAAyB,CAAA;AACxE,OAAO,EACL,UAAU,EACV,KAAK,eAAe,EACpB,KAAK,sBAAsB,EAC3B,KAAK,oBAAoB,GAC1B,MAAM,yBAAyB,CAAA;AAChC,OAAO,EAAC,UAAU,EAAE,KAAK,eAAe,EAAC,MAAM,yBAAyB,CAAA;AACxE,OAAO,EAAC,YAAY,EAAE,KAAK,iBAAiB,EAAC,MAAM,2BAA2B,CAAA;AAC9E,OAAO,EACL,gBAAgB,EAChB,KAAK,qBAAqB,EAC1B,KAAK,2BAA2B,EAChC,KAAK,+BAA+B,GACrC,MAAM,+BAA+B,CAAA;AACtC,OAAO,EAAC,OAAO,EAAE,KAAK,YAAY,EAAC,MAAM,sBAAsB,CAAA;AAC/D,OAAO,EAAC,UAAU,EAAE,KAAK,eAAe,EAAC,MAAM,yBAAyB,CAAA;AACxE,OAAO,EAAC,MAAM,EAAE,KAAK,WAAW,EAAE,KAAK,eAAe,EAAC,MAAM,qBAAqB,CAAA;AAClF,OAAO,EAAC,IAAI,EAAE,KAAK,SAAS,EAAC,MAAM,mBAAmB,CAAA;AACtD,OAAO,EAAC,SAAS,EAAE,KAAK,cAAc,EAAE,KAAK,oBAAoB,EAAC,MAAM,wBAAwB,CAAA;AAChG,OAAO,EACL,QAAQ,EACR,KAAK,aAAa,EAClB,KAAK,iBAAiB,EACtB,KAAK,kBAAkB,EACvB,KAAK,iBAAiB,EACtB,KAAK,kBAAkB,GACxB,MAAM,uBAAuB,CAAA;AAC9B,OAAO,EAAC,YAAY,EAAE,KAAK,iBAAiB,EAAC,MAAM,2BAA2B,CAAA;AAC9E,OAAO,EAAC,OAAO,EAAE,KAAK,YAAY,EAAC,MAAM,sBAAsB,CAAA;AAC/D,OAAO,EAAC,KAAK,EAAE,KAAK,UAAU,EAAC,MAAM,oBAAoB,CAAA;AACzD,OAAO,EAAC,QAAQ,EAAE,KAAK,aAAa,EAAC,MAAM,uBAAuB,CAAA;AAClE,OAAO,EAAC,YAAY,EAAE,KAAK,iBAAiB,EAAE,KAAK,qBAAqB,EAAC,MAAM,2BAA2B,CAAA;AAE1G,OAAO,EAAC,EAAE,EAAE,KAAK,MAAM,EAAC,MAAM,MAAM,CAAA;AAEpC,YAAY,EAAC,uBAAuB,EAAC,MAAM,gBAAgB,CAAA"}
|
package/dist/index.js
CHANGED
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
export { Box,
|
|
2
|
+
export { Box, Details, FormControl, ProgressBar, Select, Textarea, merge, sx, theme, themeGet } from '@primer/react';
|
|
3
3
|
export { BaseStyles, ThemeProvider, useColorSchemeVar, useTheme } from './components/FeatureFlaggedTheming.js';
|
|
4
4
|
export { ActionList } from './components/ActionList.js';
|
|
5
5
|
export { ActionMenu } from './components/ActionMenu.js';
|
|
6
6
|
export { Autocomplete } from './components/Autocomplete.js';
|
|
7
7
|
export { Avatar } from './components/Avatar.js';
|
|
8
8
|
export { Breadcrumb, Breadcrumbs } from './components/Breadcrumbs.js';
|
|
9
|
+
export { ButtonComponent as Button } from './components/Button.js';
|
|
9
10
|
export { Checkbox } from './components/Checkbox.js';
|
|
10
11
|
export { CheckboxGroup } from './components/CheckboxGroup.js';
|
|
11
12
|
export { CircleBadge } from './components/CircleBadge.js';
|
|
@@ -14,6 +15,7 @@ export { Dialog } from './components/Dialog.js';
|
|
|
14
15
|
export { Flash } from './components/Flash.js';
|
|
15
16
|
export { Header } from './components/Header.js';
|
|
16
17
|
export { Heading } from './components/Heading.js';
|
|
18
|
+
export { IconButton } from './components/IconButton.js';
|
|
17
19
|
export { Label } from './components/Label.js';
|
|
18
20
|
export { Link } from './components/Link.js';
|
|
19
21
|
export { LinkButton } from './components/LinkButton.js';
|
|
@@ -28,6 +30,7 @@ export { Spinner } from './components/Spinner.js';
|
|
|
28
30
|
export { StateLabel } from './components/StateLabel.js';
|
|
29
31
|
export { SubNav } from './components/SubNav.js';
|
|
30
32
|
export { Text } from './components/Text.js';
|
|
33
|
+
export { TextInput } from './components/TextInput.js';
|
|
31
34
|
export { Timeline } from './components/Timeline.js';
|
|
32
35
|
export { ToggleSwitch } from './components/ToggleSwitch.js';
|
|
33
36
|
export { Tooltip } from './components/Tooltip.js';
|
package/dist/sx.d.ts
CHANGED
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,EAAC,EAAE,EAAE,KAAK,MAAM,EAAC,MAAM,eAAe,CAAA"}
|
|
1
|
+
{"version":3,"file":"sx.d.ts","sourceRoot":"","sources":["../src/sx.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,EAAE,EAAE,KAAK,MAAM,EAAC,MAAM,eAAe,CAAA;AAC7C,MAAM,MAAM,mBAAmB,GAAG;IAChC,CAAC,GAAG,EAAE,KAAK,MAAM,EAAE,GAAG,MAAM,GAAG,MAAM,CAAA;CACtC,CAAA"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@primer/styled-react",
|
|
3
|
-
"version": "0.0.0-
|
|
3
|
+
"version": "0.0.0-20251011004249",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"exports": {
|
|
6
6
|
".": {
|
|
@@ -30,7 +30,7 @@
|
|
|
30
30
|
"devDependencies": {
|
|
31
31
|
"@babel/preset-react": "^7.27.1",
|
|
32
32
|
"@babel/preset-typescript": "^7.27.1",
|
|
33
|
-
"@primer/react": "0.0.0-
|
|
33
|
+
"@primer/react": "0.0.0-20251011004249",
|
|
34
34
|
"@rollup/plugin-babel": "^6.0.4",
|
|
35
35
|
"@types/react": "18.3.11",
|
|
36
36
|
"@types/react-dom": "18.3.1",
|
|
@@ -46,7 +46,7 @@
|
|
|
46
46
|
"typescript": "^5.9.2"
|
|
47
47
|
},
|
|
48
48
|
"peerDependencies": {
|
|
49
|
-
"@primer/react": "0.0.0-
|
|
49
|
+
"@primer/react": "0.0.0-20251011004249",
|
|
50
50
|
"@types/react": "18.x || 19.x",
|
|
51
51
|
"@types/react-dom": "18.x || 19.x",
|
|
52
52
|
"@types/react-is": "18.x || 19.x",
|