@primer/styled-react 0.0.0-20251202220556 → 0.0.0-20251203021724

package/dist/components/Flash.js

@@ -0,0 +1,12 @@
+import { Flash as Flash$1 } from '@primer/react';
+import styled from 'styled-components';
+import sx from '../sx.js';
+
+const Flash = styled(Flash$1).withConfig({
+  shouldForwardProp: prop => prop !== 'sx'
+}).withConfig({
+  displayName: "Flash",
+  componentId: "sc-413izo-0"
+})(["", ""], sx);
+
+export { Flash };

package/dist/components/FormControl.js

@@ -0,0 +1,19 @@
+import { FormControl as FormControl$1 } from '@primer/react';
+import styled from 'styled-components';
+import sx from '../sx.js';
+
+const FormControlImpl = styled(FormControl$1).withConfig({
+  shouldForwardProp: prop => prop !== 'sx'
+}).withConfig({
+  displayName: "FormControl__FormControlImpl",
+  componentId: "sc-1642wfe-0"
+})(["", ""], sx);
+const FormControl = Object.assign(FormControlImpl, {
+  __SLOT__: FormControl$1.__SLOT__,
+  Caption: FormControl$1.Caption,
+  LeadingVisual: FormControl$1.LeadingVisual,
+  Validation: FormControl$1.Validation,
+  Label: FormControl$1.Label
+});
+
+export { FormControl };

package/dist/components/Header.js

@@ -0,0 +1,52 @@
+import { Header as Header$1 } from '@primer/react';
+import { forwardRef } from 'react';
+import Box from './Box.js';
+import { jsx } from 'react/jsx-runtime';
+
+const StyledHeader = /*#__PURE__*/forwardRef(function Header(props, ref) {
+  return /*#__PURE__*/jsx(Box, {
+    as: Header$1,
+    ref: ref,
+    ...props
+  });
+});
+const HeaderImpl = /*#__PURE__*/forwardRef(({
+  as,
+  ...props
+}, ref) => /*#__PURE__*/jsx(StyledHeader, {
+  ...props,
+  ...(as ? {
+    forwardedAs: as
+  } : {}),
+  ref: ref
+}));
+const HeaderItem = /*#__PURE__*/forwardRef(function HeaderItem(props, ref) {
+  return /*#__PURE__*/jsx(Box, {
+    as: Header$1.Item,
+    ref: ref,
+    ...props
+  });
+});
+const StyledHeaderLink = /*#__PURE__*/forwardRef(function HeaderLink(props, ref) {
+  return /*#__PURE__*/jsx(Box, {
+    as: Header$1.Link,
+    ref: ref,
+    ...props
+  });
+});
+const HeaderLink = /*#__PURE__*/forwardRef(({
+  as,
+  ...props
+}, ref) => /*#__PURE__*/jsx(StyledHeaderLink, {
+  ...props,
+  ...(as ? {
+    forwardedAs: as
+  } : {}),
+  ref: ref
+}));
+const Header = Object.assign(HeaderImpl, {
+  Item: HeaderItem,
+  Link: HeaderLink
+});
+
+export { Header };

package/dist/components/Heading.js

@@ -0,0 +1,12 @@
+import { Heading as Heading$1 } from '@primer/react';
+import sx from '../sx.js';
+import styled from 'styled-components';
+
+const Heading = styled(Heading$1).withConfig({
+  shouldForwardProp: prop => prop !== 'sx'
+}).withConfig({
+  displayName: "Heading",
+  componentId: "sc-1vc165i-0"
+})(["", ""], sx);
+
+export { Heading };

package/dist/components/IconButton.js

@@ -0,0 +1,40 @@
+import { IconButton as IconButton$1 } from '@primer/react';
+import { generateCustomSxProp } from './Button.js';
+import { forwardRef } from 'react';
+import styled from 'styled-components';
+import sx from '../sx.js';
+import { jsx } from 'react/jsx-runtime';
+
+const StyledIconButton = styled(IconButton$1).withConfig({
+  shouldForwardProp: prop => prop !== 'sx'
+}).withConfig({
+  displayName: "IconButton__StyledIconButton",
+  componentId: "sc-i53dt6-0"
+})(["", ""], sx);
+const IconButton = /*#__PURE__*/forwardRef(({
+  as,
+  sx,
+  ...props
+}, ref) => {
+  let sxStyles = sx;
+  // grap the button props that have associated data attributes in the styles
+  const {
+    size = 'medium'
+  } = props;
+  if (sx !== null && sx !== undefined && Object.keys(sx).length > 0) {
+    sxStyles = generateCustomSxProp({
+      size
+    }, sx);
+  }
+  return /*#__PURE__*/jsx(StyledIconButton, {
+    sx: sxStyles,
+    ...props,
+    ...(as ? {
+      forwardedAs: as
+    } : {}),
+    ref: ref
+  });
+});
+IconButton.__SLOT__ = IconButton$1.__SLOT__;
+
+export { IconButton };

package/dist/components/Label.js

@@ -0,0 +1,26 @@
+import { Label as Label$1 } from '@primer/react';
+import sx from '../sx.js';
+import { forwardRef } from 'react';
+import styled from 'styled-components';
+import { jsx } from 'react/jsx-runtime';
+
+const StyledLabel = styled(Label$1).withConfig({
+  shouldForwardProp: prop => prop !== 'sx'
+}).withConfig({
+  displayName: "Label__StyledLabel",
+  componentId: "sc-1cpass9-0"
+})(["", ""], sx);
+const Label = /*#__PURE__*/forwardRef(({
+  as,
+  ...props
+}, ref) => {
+  return /*#__PURE__*/jsx(StyledLabel, {
+    ...props,
+    ...(as ? {
+      forwardedAs: as
+    } : {}),
+    ref: ref
+  });
+});
+
+export { Label };

package/dist/components/Link.js

@@ -0,0 +1,26 @@
+import { Link as Link$1 } from '@primer/react';
+import styled from 'styled-components';
+import sx from '../sx.js';
+import { forwardRef } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+const StyledLink = styled(Link$1).withConfig({
+  shouldForwardProp: prop => prop !== 'sx'
+}).withConfig({
+  displayName: "Link__StyledLink",
+  componentId: "sc-1syctfj-0"
+})(["", ""], sx);
+const Link = /*#__PURE__*/forwardRef(({
+  as,
+  ...props
+}, ref) => {
+  return /*#__PURE__*/jsx(StyledLink, {
+    ...props,
+    ...(as ? {
+      forwardedAs: as
+    } : {}),
+    ref: ref
+  });
+});
+
+export { Link };

package/dist/components/LinkButton.js

@@ -0,0 +1,12 @@
+import { LinkButton as LinkButton$1 } from '@primer/react';
+import styled from 'styled-components';
+import sx from '../sx.js';
+
+const LinkButton = styled(LinkButton$1).withConfig({
+  shouldForwardProp: prop => prop !== 'sx'
+}).withConfig({
+  displayName: "LinkButton",
+  componentId: "sc-1v6zkmg-0"
+})(["", ""], sx);
+
+export { LinkButton };

package/dist/components/NavList.js

@@ -0,0 +1,74 @@
+import { NavList as NavList$1 } from '@primer/react';
+import { forwardRef } from 'react';
+import styled from 'styled-components';
+import sx from '../sx.js';
+import { jsx } from 'react/jsx-runtime';
+
+const StyledNavListImpl = styled(NavList$1).withConfig({
+  shouldForwardProp: prop => prop !== 'sx'
+}).withConfig({
+  displayName: "NavList__StyledNavListImpl",
+  componentId: "sc-86jrwg-0"
+})(["", ""], sx);
+const NavListImpl = /*#__PURE__*/forwardRef(function NavList({
+  as,
+  ...props
+}, ref) {
+  return /*#__PURE__*/jsx(StyledNavListImpl, {
+    ref: ref,
+    ...(as ? {
+      forwardedAs: as
+    } : {}),
+    ...props
+  });
+});
+const StyledNavListItem = styled(NavList$1.Item).withConfig({
+  shouldForwardProp: prop => prop !== 'sx'
+}).withConfig({
+  displayName: "NavList__StyledNavListItem",
+  componentId: "sc-86jrwg-1"
+})(["", ""], sx);
+const NavListItem = /*#__PURE__*/forwardRef(({
+  as,
+  ...props
+}, ref) => {
+  return /*#__PURE__*/jsx(StyledNavListItem, {
+    ...props,
+    ...(as ? {
+      forwardedAs: as
+    } : {}),
+    ref: ref
+  });
+});
+const StyledNavListLeadingVisual = styled(NavList$1.LeadingVisual).withConfig({
+  shouldForwardProp: prop => prop !== 'sx'
+}).withConfig({
+  displayName: "NavList__StyledNavListLeadingVisual",
+  componentId: "sc-86jrwg-2"
+})(["", ""], sx);
+const NavListLeadingVisual = /*#__PURE__*/forwardRef(({
+  as,
+  ...props
+}, ref) => {
+  return /*#__PURE__*/jsx(StyledNavListLeadingVisual, {
+    ...props,
+    ...(as ? {
+      forwardedAs: as
+    } : {}),
+    ref: ref
+  });
+});
+NavListLeadingVisual.__SLOT__ = NavList$1.LeadingVisual.__SLOT__;
+const NavList = Object.assign(NavListImpl, {
+  Item: NavListItem,
+  Group: NavList$1.Group,
+  GroupHeading: NavList$1.GroupHeading,
+  LeadingVisual: NavListLeadingVisual,
+  SubNav: NavList$1.SubNav,
+  Divider: NavList$1.Divider,
+  TrailingVisual: NavList$1.TrailingVisual,
+  TrailingAction: NavList$1.TrailingAction,
+  GroupExpand: NavList$1.GroupExpand
+});
+
+export { NavList };

package/dist/components/Overlay.js

@@ -0,0 +1,12 @@
+import { Overlay as Overlay$1 } from '@primer/react';
+import styled from 'styled-components';
+import sx from '../sx.js';
+
+const Overlay = styled(Overlay$1).withConfig({
+  shouldForwardProp: prop => prop !== 'sx'
+}).withConfig({
+  displayName: "Overlay",
+  componentId: "sc-tjbd74-0"
+})(["", ""], sx);
+
+export { Overlay };

package/dist/components/PageHeader.js

@@ -0,0 +1,109 @@
+import { PageHeader as PageHeader$1 } from '@primer/react';
+import styled from 'styled-components';
+import sx from '../sx.js';
+import Box from './Box.js';
+import React from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+const StyledPageHeader = styled(PageHeader$1).withConfig({
+  shouldForwardProp: prop => prop !== 'sx'
+}).withConfig({
+  displayName: "PageHeader__StyledPageHeader",
+  componentId: "sc-1g9symn-0"
+})(["", ""], sx);
+const PageHeaderImpl = /*#__PURE__*/React.forwardRef(({
+  as,
+  ...props
+}, ref) => /*#__PURE__*/jsx(StyledPageHeader, {
+  ...props,
+  ...(as ? {
+    forwardedAs: as
+  } : {}),
+  ref: ref
+}));
+function PageHeaderActions({
+  sx,
+  ...rest
+}) {
+  const style = {};
+  if (sx) {
+    // @ts-ignore sx has height attribute
+    const {
+      height
+    } = sx;
+    if (height) {
+      style['--custom-height'] = height;
+    }
+  }
+
+  // @ts-expect-error type mismatch between Box usage here and PrimerPageHeader.Actions
+  return /*#__PURE__*/jsx(Box, {
+    ...rest,
+    as: PageHeader$1.Actions,
+    style: style,
+    sx: sx
+  });
+}
+function StyledPageHeaderTitle({
+  sx,
+  ...rest
+}) {
+  const style = {};
+  if (sx) {
+    // @ts-ignore sx can have color attribute
+    const {
+      fontSize,
+      lineHeight,
+      fontWeight
+    } = sx;
+    if (fontSize) {
+      style['--custom-font-size'] = fontSize;
+    }
+    if (lineHeight) {
+      style['--custom-line-height'] = lineHeight;
+    }
+    if (fontWeight) {
+      style['--custom-font-weight'] = fontWeight;
+    }
+  }
+
+  // @ts-expect-error type mismatch between Box usage here and PrimerPageHeader.Title
+  return /*#__PURE__*/jsx(Box, {
+    ...rest,
+    as: PageHeader$1.Title,
+    style: style,
+    sx: sx
+  });
+}
+const PageHeaderTitle = ({
+  as,
+  ...props
+}) => /*#__PURE__*/jsx(StyledPageHeaderTitle, {
+  ...props,
+  ...(as ? {
+    forwardedAs: as
+  } : {})
+});
+const PageHeaderTitleArea = styled(PageHeader$1.TitleArea).withConfig({
+  shouldForwardProp: prop => prop !== 'sx'
+}).withConfig({
+  displayName: "PageHeader__PageHeaderTitleArea",
+  componentId: "sc-1g9symn-1"
+})(["", ""], sx);
+const PageHeader = Object.assign(PageHeaderImpl, {
+  Actions: PageHeaderActions,
+  ContextArea: PageHeader$1.ContextArea,
+  ParentLink: PageHeader$1.ParentLink,
+  ContextBar: PageHeader$1.ContextBar,
+  TitleArea: PageHeaderTitleArea,
+  ContextAreaActions: PageHeader$1.ContextAreaActions,
+  LeadingAction: PageHeader$1.LeadingAction,
+  Breadcrumbs: PageHeader$1.Breadcrumbs,
+  LeadingVisual: PageHeader$1.LeadingVisual,
+  Title: PageHeaderTitle,
+  TrailingVisual: PageHeader$1.TrailingVisual,
+  Description: PageHeader$1.Description,
+  TrailingAction: PageHeader$1.TrailingAction
+});
+
+export { PageHeader };

package/dist/components/RadioGroup.js

@@ -0,0 +1,43 @@
+import { RadioGroup as RadioGroup$1 } from '@primer/react';
+import 'react';
+import Box from './Box.js';
+import { jsx } from 'react/jsx-runtime';
+
+const RadioGroupImpl = props => {
+  return /*#__PURE__*/jsx(Box, {
+    as: RadioGroup$1,
+    ...props
+  });
+};
+
+// Define local types based on the internal component props
+
+const CheckboxOrRadioGroupLabel = props => {
+  return /*#__PURE__*/jsx(Box, {
+    as: RadioGroup$1.Label,
+    ...props
+  });
+};
+const CheckboxOrRadioGroupCaption = props => {
+  return /*#__PURE__*/jsx(Box, {
+    as: RadioGroup$1.Caption,
+    ...props
+  });
+};
+const CheckboxOrRadioGroupValidation = props => {
+  return /*#__PURE__*/jsx(Box, {
+    as: RadioGroup$1.Validation,
+    ...props
+  });
+};
+const RadioGroup = Object.assign(RadioGroupImpl, {
+  Label: CheckboxOrRadioGroupLabel,
+  Caption: CheckboxOrRadioGroupCaption,
+  Validation: CheckboxOrRadioGroupValidation
+});
+RadioGroupImpl.__SLOT__ = RadioGroup$1.__SLOT__;
+CheckboxOrRadioGroupLabel.__SLOT__ = RadioGroup$1.Label.__SLOT__;
+CheckboxOrRadioGroupCaption.__SLOT__ = RadioGroup$1.Caption.__SLOT__;
+CheckboxOrRadioGroupValidation.__SLOT__ = RadioGroup$1.Validation.__SLOT__;
+
+export { RadioGroup };

package/dist/components/RelativeTime.js

@@ -0,0 +1,14 @@
+import { RelativeTime as RelativeTime$1 } from '@primer/react';
+import 'react';
+import Box from './Box.js';
+import { jsx } from 'react/jsx-runtime';
+
+function RelativeTime(props) {
+  // @ts-expect-error the types for Box are not correctly inferred here
+  return /*#__PURE__*/jsx(Box, {
+    as: RelativeTime$1,
+    ...props
+  });
+}
+
+export { RelativeTime };

package/dist/components/SegmentedControl.js

@@ -0,0 +1,31 @@
+import { SegmentedControl as SegmentedControl$1 } from '@primer/react';
+import Box from './Box.js';
+import { jsx } from 'react/jsx-runtime';
+
+const SegmentedControlButton = props => {
+  return /*#__PURE__*/jsx(Box, {
+    as: SegmentedControl$1.Button,
+    ...props
+  });
+};
+const SegmentedControlIconButton = props => {
+  return /*#__PURE__*/jsx(Box, {
+    as: SegmentedControl$1.IconButton,
+    ...props
+  });
+};
+const SegmentedControlImpl = props => {
+  return /*#__PURE__*/jsx(Box, {
+    as: SegmentedControl$1,
+    ...props
+  });
+};
+const SegmentedControl = Object.assign(SegmentedControlImpl, {
+  __SLOT__: SegmentedControl$1.__SLOT__,
+  Button: SegmentedControlButton,
+  IconButton: SegmentedControlIconButton
+});
+SegmentedControlButton.__SLOT__ = SegmentedControl$1.Button.__SLOT__;
+SegmentedControlIconButton.__SLOT__ = SegmentedControl$1.IconButton.__SLOT__;
+
+export { SegmentedControl };

package/dist/components/Select.js

@@ -0,0 +1,24 @@
+import { Select as Select$1 } from '@primer/react';
+import sx from '../sx.js';
+import styled from 'styled-components';
+import { jsx } from 'react/jsx-runtime';
+
+const StyledSelect = styled(Select$1).withConfig({
+  shouldForwardProp: prop => prop !== 'sx'
+}).withConfig({
+  displayName: "Select__StyledSelect",
+  componentId: "sc-1pyiuc8-0"
+})(["", ""], sx);
+const Select = ({
+  as,
+  ...props
+}) => {
+  return /*#__PURE__*/jsx(StyledSelect, {
+    ...props,
+    ...(as ? {
+      forwardedAs: as
+    } : {})
+  });
+};
+
+export { Select };

package/dist/components/Spinner.js

@@ -0,0 +1,12 @@
+import { Spinner as Spinner$1 } from '@primer/react';
+import sx from '../sx.js';
+import styled from 'styled-components';
+
+const Spinner = styled(Spinner$1).withConfig({
+  shouldForwardProp: prop => prop !== 'sx'
+}).withConfig({
+  displayName: "Spinner",
+  componentId: "sc-jbw2a0-0"
+})(["", ""], sx);
+
+export { Spinner };

package/dist/components/StateLabel.js

@@ -0,0 +1,14 @@
+import { StateLabel as StateLabel$1 } from '@primer/react';
+import { forwardRef } from 'react';
+import Box from './Box.js';
+import { jsx } from 'react/jsx-runtime';
+
+const StateLabel = /*#__PURE__*/forwardRef(function StateLabel(props, ref) {
+  return /*#__PURE__*/jsx(Box, {
+    as: StateLabel$1,
+    ref: ref,
+    ...props
+  });
+});
+
+export { StateLabel };

package/dist/components/SubNav.js

@@ -0,0 +1,26 @@
+import { SubNav as SubNav$1 } from '@primer/react';
+import { forwardRef } from 'react';
+import Box from './Box.js';
+import { jsx } from 'react/jsx-runtime';
+
+const SubNavImpl = /*#__PURE__*/forwardRef(function SubNav(props, ref) {
+  return /*#__PURE__*/jsx(Box, {
+    as: SubNav$1,
+    ref: ref,
+    ...props
+  });
+});
+const SubNavLink = /*#__PURE__*/forwardRef(function SubNavLink(props, ref) {
+  return /*#__PURE__*/jsx(Box, {
+    as: SubNav$1.Link,
+    ref: ref,
+    ...props
+  });
+});
+const SubNav = Object.assign(SubNavImpl, {
+  __SLOT__: SubNav$1.__SLOT__,
+  Link: SubNavLink
+});
+SubNavLink.__SLOT__ = SubNav$1.Link.__SLOT__;
+
+export { SubNav };

package/dist/components/Text.js

@@ -0,0 +1,26 @@
+import { Text as Text$1 } from '@primer/react';
+import sx from '../sx.js';
+import styled from 'styled-components';
+import { forwardRef } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+const StyledText = styled(Text$1).withConfig({
+  shouldForwardProp: prop => prop !== 'sx'
+}).withConfig({
+  displayName: "Text__StyledText",
+  componentId: "sc-1klmep6-0"
+})(["", ""], sx);
+const Text = /*#__PURE__*/forwardRef(({
+  as,
+  ...props
+}, ref) => {
+  return /*#__PURE__*/jsx(StyledText, {
+    ...props,
+    ...(as ? {
+      forwardedAs: as
+    } : {}),
+    ref: ref
+  });
+});
+
+export { Text };

package/dist/components/TextInput.js

@@ -0,0 +1,38 @@
+import { TextInput as TextInput$1 } from '@primer/react';
+import { forwardRef } from 'react';
+import sx from '../sx.js';
+import styled from 'styled-components';
+import { jsx } from 'react/jsx-runtime';
+
+const StyledTextInput = styled(TextInput$1).withConfig({
+  shouldForwardProp: prop => prop !== 'sx'
+}).withConfig({
+  displayName: "TextInput__StyledTextInput",
+  componentId: "sc-ttxlvl-0"
+})(["", ""], sx);
+const TextInputImpl = /*#__PURE__*/forwardRef(({
+  as,
+  ...props
+}, ref) => {
+  return /*#__PURE__*/jsx(StyledTextInput, {
+    ref: ref,
+    ...props,
+    ...(as ? {
+      forwardedAs: as
+    } : {})
+  });
+});
+const TextInputAction = styled(TextInput$1.Action).withConfig({
+  shouldForwardProp: prop => prop !== 'sx'
+}).withConfig({
+  displayName: "TextInput__TextInputAction",
+  componentId: "sc-ttxlvl-1"
+})(["", ""], sx);
+const TextInput = Object.assign(TextInputImpl, {
+  __SLOT__: TextInput$1.__SLOT__,
+  Action: TextInputAction
+});
+TextInputAction.displayName = 'TextInputAction';
+TextInputImpl.displayName = 'TextInput';
+
+export { TextInput };

package/dist/components/Textarea.js

@@ -0,0 +1,26 @@
+import { Textarea as Textarea$1 } from '@primer/react';
+import styled from 'styled-components';
+import sx from '../sx.js';
+import { forwardRef } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+const StyledTextarea = styled(Textarea$1).withConfig({
+  shouldForwardProp: prop => prop !== 'sx'
+}).withConfig({
+  displayName: "Textarea__StyledTextarea",
+  componentId: "sc-40d1gp-0"
+})(["", ""], sx);
+const Textarea = /*#__PURE__*/forwardRef(({
+  as,
+  ...props
+}, ref) => {
+  return /*#__PURE__*/jsx(StyledTextarea, {
+    ...props,
+    ...(as ? {
+      forwardedAs: as
+    } : {}),
+    ref: ref
+  });
+});
+
+export { Textarea };