@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.
Files changed (60) hide show
  1. package/dist/components/ActionList.js +89 -145
  2. package/dist/components/ActionMenu.js +15 -15
  3. package/dist/components/Autocomplete.js +18 -20
  4. package/dist/components/Avatar.js +13 -11
  5. package/dist/components/BaseStyles.js +28 -47
  6. package/dist/components/Box.js +18 -10
  7. package/dist/components/Breadcrumbs.js +22 -32
  8. package/dist/components/Button.js +41 -105
  9. package/dist/components/Checkbox.js +14 -12
  10. package/dist/components/CheckboxGroup.js +34 -36
  11. package/dist/components/CircleBadge.js +10 -10
  12. package/dist/components/CounterLabel.js +13 -11
  13. package/dist/components/DataTable.js +19 -27
  14. package/dist/components/Dialog.js +53 -79
  15. package/dist/components/Flash.js +9 -9
  16. package/dist/components/FormControl.js +15 -15
  17. package/dist/components/Header.js +36 -44
  18. package/dist/components/Heading.js +9 -9
  19. package/dist/components/IconButton.js +23 -36
  20. package/dist/components/Label.js +17 -22
  21. package/dist/components/Link.js +17 -22
  22. package/dist/components/LinkButton.js +9 -9
  23. package/dist/components/NavList.js +46 -65
  24. package/dist/components/Overlay.js +9 -9
  25. package/dist/components/PageHeader.js +62 -100
  26. package/dist/components/RadioGroup.js +34 -36
  27. package/dist/components/RelativeTime.js +11 -11
  28. package/dist/components/SegmentedControl.js +27 -25
  29. package/dist/components/Select.js +15 -20
  30. package/dist/components/Spinner.js +9 -9
  31. package/dist/components/StateLabel.js +13 -11
  32. package/dist/components/SubNav.js +23 -21
  33. package/dist/components/Text.js +17 -22
  34. package/dist/components/TextInput.js +25 -32
  35. package/dist/components/Textarea.js +17 -22
  36. package/dist/components/ThemeProvider.js +132 -185
  37. package/dist/components/Timeline.js +40 -38
  38. package/dist/components/ToggleSwitch.js +13 -11
  39. package/dist/components/Token.js +17 -22
  40. package/dist/components/Tooltip.js +14 -12
  41. package/dist/components/Truncate.js +9 -9
  42. package/dist/components/UnderlineNav.js +27 -39
  43. package/dist/components/UnderlinePanels.js +18 -23
  44. package/dist/components/deprecated/ActionList.js +34 -39
  45. package/dist/components/deprecated/DialogV1.js +28 -38
  46. package/dist/components/deprecated/Octicon.js +28 -35
  47. package/dist/components/deprecated/TabNav.js +24 -38
  48. package/dist/components/deprecated/Tooltip.js +20 -28
  49. package/dist/deprecated.d.ts +75 -5
  50. package/dist/deprecated.d.ts.map +1 -1
  51. package/dist/deprecated.js +7 -5
  52. package/dist/experimental.d.ts +120 -5
  53. package/dist/experimental.d.ts.map +1 -1
  54. package/dist/experimental.js +7 -5
  55. package/dist/index.d.ts +582 -47
  56. package/dist/index.d.ts.map +1 -1
  57. package/dist/index.js +48 -46
  58. package/dist/sx.js +7 -6
  59. package/dist/theme-get.js +8 -8
  60. package/package.json +7 -4
@@ -1,43 +1,41 @@
1
- import { RadioGroup as RadioGroup$1 } from '@primer/react';
2
- import 'react';
3
- import Box from './Box.js';
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
- const RadioGroupImpl = props => {
7
- return /*#__PURE__*/jsx(Box, {
8
- as: RadioGroup$1,
9
- ...props
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
- // Define local types based on the internal component props
14
-
15
- const CheckboxOrRadioGroupLabel = props => {
16
- return /*#__PURE__*/jsx(Box, {
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
- return /*#__PURE__*/jsx(Box, {
23
- as: RadioGroup$1.Caption,
24
- ...props
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
- return /*#__PURE__*/jsx(Box, {
29
- as: RadioGroup$1.Validation,
30
- ...props
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
- Label: CheckboxOrRadioGroupLabel,
35
- Caption: CheckboxOrRadioGroupCaption,
36
- Validation: CheckboxOrRadioGroupValidation
30
+ const RadioGroup$1 = Object.assign(RadioGroupImpl, {
31
+ Label: CheckboxOrRadioGroupLabel,
32
+ Caption: CheckboxOrRadioGroupCaption,
33
+ Validation: CheckboxOrRadioGroupValidation
37
34
  });
38
- RadioGroupImpl.__SLOT__ = RadioGroup$1.__SLOT__;
39
- CheckboxOrRadioGroupLabel.__SLOT__ = RadioGroup$1.Label.__SLOT__;
40
- CheckboxOrRadioGroupCaption.__SLOT__ = RadioGroup$1.Caption.__SLOT__;
41
- CheckboxOrRadioGroupValidation.__SLOT__ = RadioGroup$1.Validation.__SLOT__;
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
- export { RadioGroup };
40
+ //#endregion
41
+ export { RadioGroup$1 as RadioGroup };
@@ -1,14 +1,14 @@
1
- import { RelativeTime as RelativeTime$1 } from '@primer/react';
2
- import 'react';
3
- import Box from './Box.js';
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
- function RelativeTime(props) {
7
- // @ts-expect-error the types for Box are not correctly inferred here
8
- return /*#__PURE__*/jsx(Box, {
9
- as: RelativeTime$1,
10
- ...props
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
- export { RelativeTime };
13
+ //#endregion
14
+ export { RelativeTime$1 as RelativeTime };
@@ -1,31 +1,33 @@
1
- import { SegmentedControl as SegmentedControl$1 } from '@primer/react';
2
- import Box from './Box.js';
3
- import { jsx } from 'react/jsx-runtime';
1
+ import { Box } from "./Box.js";
2
+ import { SegmentedControl } from "@primer/react";
3
+ import { jsx } from "react/jsx-runtime";
4
4
 
5
- const SegmentedControlButton = props => {
6
- return /*#__PURE__*/jsx(Box, {
7
- as: SegmentedControl$1.Button,
8
- ...props
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
- return /*#__PURE__*/jsx(Box, {
13
- as: SegmentedControl$1.IconButton,
14
- ...props
15
- });
12
+ const SegmentedControlIconButton = (props) => {
13
+ return /* @__PURE__ */ jsx(Box, {
14
+ as: SegmentedControl.IconButton,
15
+ ...props
16
+ });
16
17
  };
17
- const SegmentedControlImpl = props => {
18
- return /*#__PURE__*/jsx(Box, {
19
- as: SegmentedControl$1,
20
- ...props
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
- __SLOT__: SegmentedControl$1.__SLOT__,
25
- Button: SegmentedControlButton,
26
- IconButton: SegmentedControlIconButton
24
+ const SegmentedControl$1 = Object.assign(SegmentedControlImpl, {
25
+ __SLOT__: SegmentedControl.__SLOT__,
26
+ Button: SegmentedControlButton,
27
+ IconButton: SegmentedControlIconButton
27
28
  });
28
- SegmentedControlButton.__SLOT__ = SegmentedControl$1.Button.__SLOT__;
29
- SegmentedControlIconButton.__SLOT__ = SegmentedControl$1.IconButton.__SLOT__;
29
+ SegmentedControlButton.__SLOT__ = SegmentedControl.Button.__SLOT__;
30
+ SegmentedControlIconButton.__SLOT__ = SegmentedControl.IconButton.__SLOT__;
30
31
 
31
- export { SegmentedControl };
32
+ //#endregion
33
+ export { SegmentedControl$1 as SegmentedControl };
@@ -1,24 +1,19 @@
1
- import { Select as Select$1 } from '@primer/react';
2
- import sx from '../sx.js';
3
- import styled from 'styled-components';
4
- import { jsx } from 'react/jsx-runtime';
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
- const StyledSelect = styled(Select$1).withConfig({
7
- shouldForwardProp: prop => prop !== 'sx'
8
- }).withConfig({
9
- displayName: "Select__StyledSelect",
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
- as,
14
- ...props
15
- }) => {
16
- return /*#__PURE__*/jsx(StyledSelect, {
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
- export { Select };
18
+ //#endregion
19
+ export { Select$1 as Select };
@@ -1,12 +1,12 @@
1
- import { Spinner as Spinner$1 } from '@primer/react';
2
- import sx from '../sx.js';
3
- import styled from 'styled-components';
1
+ import { sx } from "../sx.js";
2
+ import styled from "styled-components";
3
+ import { Spinner } from "@primer/react";
4
4
 
5
- const Spinner = styled(Spinner$1).withConfig({
6
- shouldForwardProp: prop => prop !== 'sx'
7
- }).withConfig({
8
- displayName: "Spinner",
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
- export { Spinner };
11
+ //#endregion
12
+ export { Spinner$1 as Spinner };
@@ -1,14 +1,16 @@
1
- import { StateLabel as StateLabel$1 } from '@primer/react';
2
- import { forwardRef } from 'react';
3
- import Box from './Box.js';
4
- import { jsx } from 'react/jsx-runtime';
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
- const StateLabel = /*#__PURE__*/forwardRef(function StateLabel(props, ref) {
7
- return /*#__PURE__*/jsx(Box, {
8
- as: StateLabel$1,
9
- ref: ref,
10
- ...props
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
- export { StateLabel };
15
+ //#endregion
16
+ export { StateLabel$1 as StateLabel };
@@ -1,26 +1,28 @@
1
- import { SubNav as SubNav$1 } from '@primer/react';
2
- import { forwardRef } from 'react';
3
- import Box from './Box.js';
4
- import { jsx } from 'react/jsx-runtime';
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
- const SubNavImpl = /*#__PURE__*/forwardRef(function SubNav(props, ref) {
7
- return /*#__PURE__*/jsx(Box, {
8
- as: SubNav$1,
9
- ref: ref,
10
- ...props
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 = /*#__PURE__*/forwardRef(function SubNavLink(props, ref) {
14
- return /*#__PURE__*/jsx(Box, {
15
- as: SubNav$1.Link,
16
- ref: ref,
17
- ...props
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
- __SLOT__: SubNav$1.__SLOT__,
22
- Link: SubNavLink
21
+ const SubNav$1 = Object.assign(SubNavImpl, {
22
+ __SLOT__: SubNav.__SLOT__,
23
+ Link: SubNavLink
23
24
  });
24
- SubNavLink.__SLOT__ = SubNav$1.Link.__SLOT__;
25
+ SubNavLink.__SLOT__ = SubNav.Link.__SLOT__;
25
26
 
26
- export { SubNav };
27
+ //#endregion
28
+ export { SubNav$1 as SubNav };
@@ -1,26 +1,21 @@
1
- import { Text as Text$1 } from '@primer/react';
2
- import sx from '../sx.js';
3
- import styled from 'styled-components';
4
- import { forwardRef } from 'react';
5
- import { jsx } from 'react/jsx-runtime';
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
- const StyledText = styled(Text$1).withConfig({
8
- shouldForwardProp: prop => prop !== 'sx'
9
- }).withConfig({
10
- displayName: "Text__StyledText",
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 = /*#__PURE__*/forwardRef(({
14
- as,
15
- ...props
16
- }, ref) => {
17
- return /*#__PURE__*/jsx(StyledText, {
18
- ...props,
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
- export { Text };
20
+ //#endregion
21
+ export { Text$1 as Text };
@@ -1,38 +1,31 @@
1
- import { TextInput as TextInput$1 } from '@primer/react';
2
- import { forwardRef } from 'react';
3
- import sx from '../sx.js';
4
- import styled from 'styled-components';
5
- import { jsx } from 'react/jsx-runtime';
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
- const StyledTextInput = styled(TextInput$1).withConfig({
8
- shouldForwardProp: prop => prop !== 'sx'
9
- }).withConfig({
10
- displayName: "TextInput__StyledTextInput",
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 = /*#__PURE__*/forwardRef(({
14
- as,
15
- ...props
16
- }, ref) => {
17
- return /*#__PURE__*/jsx(StyledTextInput, {
18
- ref: ref,
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$1.Action).withConfig({
26
- shouldForwardProp: prop => prop !== 'sx'
27
- }).withConfig({
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
- __SLOT__: TextInput$1.__SLOT__,
33
- Action: TextInputAction
23
+ const TextInput$1 = Object.assign(TextInputImpl, {
24
+ __SLOT__: TextInput.__SLOT__,
25
+ Action: TextInputAction
34
26
  });
35
- TextInputAction.displayName = 'TextInputAction';
36
- TextInputImpl.displayName = 'TextInput';
27
+ TextInputAction.displayName = "TextInputAction";
28
+ TextInputImpl.displayName = "TextInput";
37
29
 
38
- export { TextInput };
30
+ //#endregion
31
+ export { TextInput$1 as TextInput };
@@ -1,26 +1,21 @@
1
- import { Textarea as Textarea$1 } from '@primer/react';
2
- import styled from 'styled-components';
3
- import sx from '../sx.js';
4
- import { forwardRef } from 'react';
5
- import { jsx } from 'react/jsx-runtime';
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
- const StyledTextarea = styled(Textarea$1).withConfig({
8
- shouldForwardProp: prop => prop !== 'sx'
9
- }).withConfig({
10
- displayName: "Textarea__StyledTextarea",
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 = /*#__PURE__*/forwardRef(({
14
- as,
15
- ...props
16
- }, ref) => {
17
- return /*#__PURE__*/jsx(StyledTextarea, {
18
- ...props,
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
- export { Textarea };
20
+ //#endregion
21
+ export { Textarea$1 as Textarea };