@primer/styled-react 0.0.0-20251205165836 → 0.0.0-20251210204724
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/ActionList.js +89 -145
- package/dist/components/ActionMenu.js +15 -15
- package/dist/components/Autocomplete.js +18 -20
- package/dist/components/Avatar.js +13 -11
- package/dist/components/BaseStyles.js +28 -47
- package/dist/components/Box.js +18 -10
- package/dist/components/Breadcrumbs.js +22 -32
- package/dist/components/Button.js +41 -105
- package/dist/components/Checkbox.js +14 -12
- package/dist/components/CheckboxGroup.js +34 -36
- package/dist/components/CircleBadge.js +10 -10
- package/dist/components/CounterLabel.js +13 -11
- package/dist/components/DataTable.js +19 -27
- package/dist/components/Dialog.js +53 -79
- package/dist/components/Flash.js +9 -9
- package/dist/components/FormControl.js +15 -15
- package/dist/components/Header.js +36 -44
- package/dist/components/Heading.js +9 -9
- package/dist/components/IconButton.js +23 -36
- package/dist/components/Label.js +17 -22
- package/dist/components/Link.js +17 -22
- package/dist/components/LinkButton.js +9 -9
- package/dist/components/NavList.js +46 -65
- package/dist/components/Overlay.js +9 -9
- package/dist/components/PageHeader.js +62 -100
- package/dist/components/RadioGroup.js +34 -36
- package/dist/components/RelativeTime.js +11 -11
- package/dist/components/SegmentedControl.js +27 -25
- package/dist/components/Select.js +15 -20
- package/dist/components/Spinner.js +9 -9
- package/dist/components/StateLabel.js +13 -11
- package/dist/components/SubNav.js +23 -21
- package/dist/components/Text.js +17 -22
- package/dist/components/TextInput.js +25 -32
- package/dist/components/Textarea.js +17 -22
- package/dist/components/ThemeProvider.js +132 -185
- package/dist/components/Timeline.js +40 -38
- package/dist/components/ToggleSwitch.js +13 -11
- package/dist/components/Token.js +17 -22
- package/dist/components/Tooltip.js +14 -12
- package/dist/components/Truncate.js +9 -9
- package/dist/components/UnderlineNav.js +27 -39
- package/dist/components/UnderlinePanels.js +18 -23
- package/dist/components/deprecated/ActionList.js +34 -39
- package/dist/components/deprecated/DialogV1.js +28 -38
- package/dist/components/deprecated/Octicon.js +28 -35
- package/dist/components/deprecated/TabNav.js +24 -38
- package/dist/components/deprecated/Tooltip.js +20 -28
- package/dist/deprecated.d.ts +75 -5
- package/dist/deprecated.d.ts.map +1 -1
- package/dist/deprecated.js +7 -5
- package/dist/experimental.d.ts +120 -5
- package/dist/experimental.d.ts.map +1 -1
- package/dist/experimental.js +7 -5
- package/dist/index.d.ts +582 -47
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +48 -46
- package/dist/sx.js +7 -6
- package/dist/theme-get.js +8 -8
- package/package.json +7 -4
|
@@ -1,43 +1,41 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import { jsx } from 'react/jsx-runtime';
|
|
1
|
+
import Box_default from "./Box.js";
|
|
2
|
+
import { RadioGroup } from "@primer/react";
|
|
3
|
+
import { jsx } from "react/jsx-runtime";
|
|
5
4
|
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
5
|
+
//#region src/components/RadioGroup.tsx
|
|
6
|
+
const RadioGroupImpl = (props) => {
|
|
7
|
+
return /* @__PURE__ */ jsx(Box_default, {
|
|
8
|
+
as: RadioGroup,
|
|
9
|
+
...props
|
|
10
|
+
});
|
|
11
11
|
};
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
as: RadioGroup$1.Label,
|
|
18
|
-
...props
|
|
19
|
-
});
|
|
12
|
+
const CheckboxOrRadioGroupLabel = (props) => {
|
|
13
|
+
return /* @__PURE__ */ jsx(Box_default, {
|
|
14
|
+
as: RadioGroup.Label,
|
|
15
|
+
...props
|
|
16
|
+
});
|
|
20
17
|
};
|
|
21
|
-
const CheckboxOrRadioGroupCaption = props => {
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
18
|
+
const CheckboxOrRadioGroupCaption = (props) => {
|
|
19
|
+
return /* @__PURE__ */ jsx(Box_default, {
|
|
20
|
+
as: RadioGroup.Caption,
|
|
21
|
+
...props
|
|
22
|
+
});
|
|
26
23
|
};
|
|
27
|
-
const CheckboxOrRadioGroupValidation = props => {
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
24
|
+
const CheckboxOrRadioGroupValidation = (props) => {
|
|
25
|
+
return /* @__PURE__ */ jsx(Box_default, {
|
|
26
|
+
as: RadioGroup.Validation,
|
|
27
|
+
...props
|
|
28
|
+
});
|
|
32
29
|
};
|
|
33
|
-
const RadioGroup = Object.assign(RadioGroupImpl, {
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
30
|
+
const RadioGroup$1 = Object.assign(RadioGroupImpl, {
|
|
31
|
+
Label: CheckboxOrRadioGroupLabel,
|
|
32
|
+
Caption: CheckboxOrRadioGroupCaption,
|
|
33
|
+
Validation: CheckboxOrRadioGroupValidation
|
|
37
34
|
});
|
|
38
|
-
RadioGroupImpl.__SLOT__ = RadioGroup
|
|
39
|
-
CheckboxOrRadioGroupLabel.__SLOT__ = RadioGroup
|
|
40
|
-
CheckboxOrRadioGroupCaption.__SLOT__ = RadioGroup
|
|
41
|
-
CheckboxOrRadioGroupValidation.__SLOT__ = RadioGroup
|
|
35
|
+
RadioGroupImpl.__SLOT__ = RadioGroup.__SLOT__;
|
|
36
|
+
CheckboxOrRadioGroupLabel.__SLOT__ = RadioGroup.Label.__SLOT__;
|
|
37
|
+
CheckboxOrRadioGroupCaption.__SLOT__ = RadioGroup.Caption.__SLOT__;
|
|
38
|
+
CheckboxOrRadioGroupValidation.__SLOT__ = RadioGroup.Validation.__SLOT__;
|
|
42
39
|
|
|
43
|
-
|
|
40
|
+
//#endregion
|
|
41
|
+
export { RadioGroup$1 as RadioGroup };
|
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import { jsx } from 'react/jsx-runtime';
|
|
1
|
+
import Box_default from "./Box.js";
|
|
2
|
+
import { RelativeTime } from "@primer/react";
|
|
3
|
+
import { jsx } from "react/jsx-runtime";
|
|
5
4
|
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
5
|
+
//#region src/components/RelativeTime.tsx
|
|
6
|
+
function RelativeTime$1(props) {
|
|
7
|
+
return /* @__PURE__ */ jsx(Box_default, {
|
|
8
|
+
as: RelativeTime,
|
|
9
|
+
...props
|
|
10
|
+
});
|
|
12
11
|
}
|
|
13
12
|
|
|
14
|
-
|
|
13
|
+
//#endregion
|
|
14
|
+
export { RelativeTime$1 as RelativeTime };
|
|
@@ -1,31 +1,33 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import
|
|
3
|
-
import { jsx } from
|
|
1
|
+
import { Box } from "./Box.js";
|
|
2
|
+
import { SegmentedControl } from "@primer/react";
|
|
3
|
+
import { jsx } from "react/jsx-runtime";
|
|
4
4
|
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
5
|
+
//#region src/components/SegmentedControl.tsx
|
|
6
|
+
const SegmentedControlButton = (props) => {
|
|
7
|
+
return /* @__PURE__ */ jsx(Box, {
|
|
8
|
+
as: SegmentedControl.Button,
|
|
9
|
+
...props
|
|
10
|
+
});
|
|
10
11
|
};
|
|
11
|
-
const SegmentedControlIconButton = props => {
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
12
|
+
const SegmentedControlIconButton = (props) => {
|
|
13
|
+
return /* @__PURE__ */ jsx(Box, {
|
|
14
|
+
as: SegmentedControl.IconButton,
|
|
15
|
+
...props
|
|
16
|
+
});
|
|
16
17
|
};
|
|
17
|
-
const SegmentedControlImpl = props => {
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
18
|
+
const SegmentedControlImpl = (props) => {
|
|
19
|
+
return /* @__PURE__ */ jsx(Box, {
|
|
20
|
+
as: SegmentedControl,
|
|
21
|
+
...props
|
|
22
|
+
});
|
|
22
23
|
};
|
|
23
|
-
const SegmentedControl = Object.assign(SegmentedControlImpl, {
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
24
|
+
const SegmentedControl$1 = Object.assign(SegmentedControlImpl, {
|
|
25
|
+
__SLOT__: SegmentedControl.__SLOT__,
|
|
26
|
+
Button: SegmentedControlButton,
|
|
27
|
+
IconButton: SegmentedControlIconButton
|
|
27
28
|
});
|
|
28
|
-
SegmentedControlButton.__SLOT__ = SegmentedControl
|
|
29
|
-
SegmentedControlIconButton.__SLOT__ = SegmentedControl
|
|
29
|
+
SegmentedControlButton.__SLOT__ = SegmentedControl.Button.__SLOT__;
|
|
30
|
+
SegmentedControlIconButton.__SLOT__ = SegmentedControl.IconButton.__SLOT__;
|
|
30
31
|
|
|
31
|
-
|
|
32
|
+
//#endregion
|
|
33
|
+
export { SegmentedControl$1 as SegmentedControl };
|
|
@@ -1,24 +1,19 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import { jsx } from
|
|
1
|
+
import { sx } from "../sx.js";
|
|
2
|
+
import styled from "styled-components";
|
|
3
|
+
import { Select } from "@primer/react";
|
|
4
|
+
import { jsx } from "react/jsx-runtime";
|
|
5
5
|
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
componentId: "sc-1pyiuc8-0"
|
|
6
|
+
//#region src/components/Select.tsx
|
|
7
|
+
const StyledSelect = styled(Select).withConfig({ shouldForwardProp: (prop) => prop !== "sx" }).withConfig({
|
|
8
|
+
displayName: "Select__StyledSelect",
|
|
9
|
+
componentId: "sc-1pyiuc8-0"
|
|
11
10
|
})(["", ""], sx);
|
|
12
|
-
const Select = ({
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
...props,
|
|
18
|
-
...(as ? {
|
|
19
|
-
forwardedAs: as
|
|
20
|
-
} : {})
|
|
21
|
-
});
|
|
11
|
+
const Select$1 = ({ as, ...props }) => {
|
|
12
|
+
return /* @__PURE__ */ jsx(StyledSelect, {
|
|
13
|
+
...props,
|
|
14
|
+
...as ? { forwardedAs: as } : {}
|
|
15
|
+
});
|
|
22
16
|
};
|
|
23
17
|
|
|
24
|
-
|
|
18
|
+
//#endregion
|
|
19
|
+
export { Select$1 as Select };
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import
|
|
3
|
-
import
|
|
1
|
+
import { sx } from "../sx.js";
|
|
2
|
+
import styled from "styled-components";
|
|
3
|
+
import { Spinner } from "@primer/react";
|
|
4
4
|
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
componentId: "sc-jbw2a0-0"
|
|
5
|
+
//#region src/components/Spinner.tsx
|
|
6
|
+
const Spinner$1 = styled(Spinner).withConfig({ shouldForwardProp: (prop) => prop !== "sx" }).withConfig({
|
|
7
|
+
displayName: "Spinner",
|
|
8
|
+
componentId: "sc-jbw2a0-0"
|
|
10
9
|
})(["", ""], sx);
|
|
11
10
|
|
|
12
|
-
|
|
11
|
+
//#endregion
|
|
12
|
+
export { Spinner$1 as Spinner };
|
|
@@ -1,14 +1,16 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
import
|
|
4
|
-
import { jsx } from
|
|
1
|
+
import { Box } from "./Box.js";
|
|
2
|
+
import { StateLabel } from "@primer/react";
|
|
3
|
+
import { forwardRef } from "react";
|
|
4
|
+
import { jsx } from "react/jsx-runtime";
|
|
5
5
|
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
6
|
+
//#region src/components/StateLabel.tsx
|
|
7
|
+
const StateLabel$1 = /* @__PURE__ */ forwardRef(function StateLabel$2(props, ref) {
|
|
8
|
+
return /* @__PURE__ */ jsx(Box, {
|
|
9
|
+
as: StateLabel,
|
|
10
|
+
ref,
|
|
11
|
+
...props
|
|
12
|
+
});
|
|
12
13
|
});
|
|
13
14
|
|
|
14
|
-
|
|
15
|
+
//#endregion
|
|
16
|
+
export { StateLabel$1 as StateLabel };
|
|
@@ -1,26 +1,28 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
import
|
|
4
|
-
import { jsx } from
|
|
1
|
+
import { Box } from "./Box.js";
|
|
2
|
+
import { SubNav } from "@primer/react";
|
|
3
|
+
import { forwardRef } from "react";
|
|
4
|
+
import { jsx } from "react/jsx-runtime";
|
|
5
5
|
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
6
|
+
//#region src/components/SubNav.tsx
|
|
7
|
+
const SubNavImpl = /* @__PURE__ */ forwardRef(function SubNav$2(props, ref) {
|
|
8
|
+
return /* @__PURE__ */ jsx(Box, {
|
|
9
|
+
as: SubNav,
|
|
10
|
+
ref,
|
|
11
|
+
...props
|
|
12
|
+
});
|
|
12
13
|
});
|
|
13
|
-
const SubNavLink =
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
14
|
+
const SubNavLink = /* @__PURE__ */ forwardRef(function SubNavLink$1(props, ref) {
|
|
15
|
+
return /* @__PURE__ */ jsx(Box, {
|
|
16
|
+
as: SubNav.Link,
|
|
17
|
+
ref,
|
|
18
|
+
...props
|
|
19
|
+
});
|
|
19
20
|
});
|
|
20
|
-
const SubNav = Object.assign(SubNavImpl, {
|
|
21
|
-
|
|
22
|
-
|
|
21
|
+
const SubNav$1 = Object.assign(SubNavImpl, {
|
|
22
|
+
__SLOT__: SubNav.__SLOT__,
|
|
23
|
+
Link: SubNavLink
|
|
23
24
|
});
|
|
24
|
-
SubNavLink.__SLOT__ = SubNav
|
|
25
|
+
SubNavLink.__SLOT__ = SubNav.Link.__SLOT__;
|
|
25
26
|
|
|
26
|
-
|
|
27
|
+
//#endregion
|
|
28
|
+
export { SubNav$1 as SubNav };
|
package/dist/components/Text.js
CHANGED
|
@@ -1,26 +1,21 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import { forwardRef } from
|
|
5
|
-
import { jsx } from
|
|
1
|
+
import { sx } from "../sx.js";
|
|
2
|
+
import styled from "styled-components";
|
|
3
|
+
import { Text } from "@primer/react";
|
|
4
|
+
import { forwardRef } from "react";
|
|
5
|
+
import { jsx } from "react/jsx-runtime";
|
|
6
6
|
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
componentId: "sc-1klmep6-0"
|
|
7
|
+
//#region src/components/Text.tsx
|
|
8
|
+
const StyledText = styled(Text).withConfig({ shouldForwardProp: (prop) => prop !== "sx" }).withConfig({
|
|
9
|
+
displayName: "Text__StyledText",
|
|
10
|
+
componentId: "sc-1klmep6-0"
|
|
12
11
|
})(["", ""], sx);
|
|
13
|
-
const Text =
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
...(as ? {
|
|
20
|
-
forwardedAs: as
|
|
21
|
-
} : {}),
|
|
22
|
-
ref: ref
|
|
23
|
-
});
|
|
12
|
+
const Text$1 = /* @__PURE__ */ forwardRef(({ as, ...props }, ref) => {
|
|
13
|
+
return /* @__PURE__ */ jsx(StyledText, {
|
|
14
|
+
...props,
|
|
15
|
+
...as ? { forwardedAs: as } : {},
|
|
16
|
+
ref
|
|
17
|
+
});
|
|
24
18
|
});
|
|
25
19
|
|
|
26
|
-
|
|
20
|
+
//#endregion
|
|
21
|
+
export { Text$1 as Text };
|
|
@@ -1,38 +1,31 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import { jsx } from
|
|
1
|
+
import { sx } from "../sx.js";
|
|
2
|
+
import styled from "styled-components";
|
|
3
|
+
import { TextInput } from "@primer/react";
|
|
4
|
+
import { forwardRef } from "react";
|
|
5
|
+
import { jsx } from "react/jsx-runtime";
|
|
6
6
|
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
componentId: "sc-ttxlvl-0"
|
|
7
|
+
//#region src/components/TextInput.tsx
|
|
8
|
+
const StyledTextInput = styled(TextInput).withConfig({ shouldForwardProp: (prop) => prop !== "sx" }).withConfig({
|
|
9
|
+
displayName: "TextInput__StyledTextInput",
|
|
10
|
+
componentId: "sc-ttxlvl-0"
|
|
12
11
|
})(["", ""], sx);
|
|
13
|
-
const TextInputImpl =
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
...props,
|
|
20
|
-
...(as ? {
|
|
21
|
-
forwardedAs: as
|
|
22
|
-
} : {})
|
|
23
|
-
});
|
|
12
|
+
const TextInputImpl = /* @__PURE__ */ forwardRef(({ as, ...props }, ref) => {
|
|
13
|
+
return /* @__PURE__ */ jsx(StyledTextInput, {
|
|
14
|
+
ref,
|
|
15
|
+
...props,
|
|
16
|
+
...as ? { forwardedAs: as } : {}
|
|
17
|
+
});
|
|
24
18
|
});
|
|
25
|
-
const TextInputAction = styled(TextInput
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
displayName: "TextInput__TextInputAction",
|
|
29
|
-
componentId: "sc-ttxlvl-1"
|
|
19
|
+
const TextInputAction = styled(TextInput.Action).withConfig({ shouldForwardProp: (prop) => prop !== "sx" }).withConfig({
|
|
20
|
+
displayName: "TextInput__TextInputAction",
|
|
21
|
+
componentId: "sc-ttxlvl-1"
|
|
30
22
|
})(["", ""], sx);
|
|
31
|
-
const TextInput = Object.assign(TextInputImpl, {
|
|
32
|
-
|
|
33
|
-
|
|
23
|
+
const TextInput$1 = Object.assign(TextInputImpl, {
|
|
24
|
+
__SLOT__: TextInput.__SLOT__,
|
|
25
|
+
Action: TextInputAction
|
|
34
26
|
});
|
|
35
|
-
TextInputAction.displayName =
|
|
36
|
-
TextInputImpl.displayName =
|
|
27
|
+
TextInputAction.displayName = "TextInputAction";
|
|
28
|
+
TextInputImpl.displayName = "TextInput";
|
|
37
29
|
|
|
38
|
-
|
|
30
|
+
//#endregion
|
|
31
|
+
export { TextInput$1 as TextInput };
|
|
@@ -1,26 +1,21 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import styled from
|
|
3
|
-
import
|
|
4
|
-
import { forwardRef } from
|
|
5
|
-
import { jsx } from
|
|
1
|
+
import { sx } from "../sx.js";
|
|
2
|
+
import styled from "styled-components";
|
|
3
|
+
import { Textarea } from "@primer/react";
|
|
4
|
+
import { forwardRef } from "react";
|
|
5
|
+
import { jsx } from "react/jsx-runtime";
|
|
6
6
|
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
componentId: "sc-40d1gp-0"
|
|
7
|
+
//#region src/components/Textarea.tsx
|
|
8
|
+
const StyledTextarea = styled(Textarea).withConfig({ shouldForwardProp: (prop) => prop !== "sx" }).withConfig({
|
|
9
|
+
displayName: "Textarea__StyledTextarea",
|
|
10
|
+
componentId: "sc-40d1gp-0"
|
|
12
11
|
})(["", ""], sx);
|
|
13
|
-
const Textarea =
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
...(as ? {
|
|
20
|
-
forwardedAs: as
|
|
21
|
-
} : {}),
|
|
22
|
-
ref: ref
|
|
23
|
-
});
|
|
12
|
+
const Textarea$1 = /* @__PURE__ */ forwardRef(({ as, ...props }, ref) => {
|
|
13
|
+
return /* @__PURE__ */ jsx(StyledTextarea, {
|
|
14
|
+
...props,
|
|
15
|
+
...as ? { forwardedAs: as } : {},
|
|
16
|
+
ref
|
|
17
|
+
});
|
|
24
18
|
});
|
|
25
19
|
|
|
26
|
-
|
|
20
|
+
//#endregion
|
|
21
|
+
export { Textarea$1 as Textarea };
|