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

package/dist/components/Text.js

@@ -1,26 +0,0 @@
-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

@@ -1,38 +0,0 @@
-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

@@ -1,26 +0,0 @@
-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 };

package/dist/components/ThemeProvider.js

@@ -1,203 +0,0 @@
-import React from 'react';
-import ReactDOM from 'react-dom';
-import { ThemeProvider as ThemeProvider$1 } from 'styled-components';
-import { theme, useId, useSyncedState } from '@primer/react';
-import deepmerge from 'deepmerge';
-import { jsx, jsxs } from 'react/jsx-runtime';
-
-const defaultColorMode = 'day';
-const defaultDayScheme = 'light';
-const defaultNightScheme = 'dark';
-
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-
-const ThemeContext = /*#__PURE__*/React.createContext({
-  setColorMode: () => null,
-  setDayScheme: () => null,
-  setNightScheme: () => null
-});
-
-// inspired from __NEXT_DATA__, we use application/json to avoid CSRF policy with inline scripts
-const getServerHandoff = id => {
-  try {
-    const serverData = document.getElementById(`__PRIMER_DATA_${id}__`)?.textContent;
-    if (serverData) return JSON.parse(serverData);
-  } catch (_error) {
-    // if document/element does not exist or JSON is invalid, supress error
-  }
-  return {};
-};
-const ThemeProvider = ({
-  children,
-  ...props
-}) => {
-  // Get fallback values from parent ThemeProvider (if exists)
-  const {
-    theme: fallbackTheme,
-    colorMode: fallbackColorMode,
-    dayScheme: fallbackDayScheme,
-    nightScheme: fallbackNightScheme
-  } = useTheme();
-
-  // Initialize state
-  const theme$1 = props.theme ?? fallbackTheme ?? theme;
-  const uniqueDataId = useId();
-  const {
-    resolvedServerColorMode
-  } = getServerHandoff(uniqueDataId);
-  const resolvedColorModePassthrough = React.useRef(resolvedServerColorMode);
-  const [colorMode, setColorMode] = useSyncedState(props.colorMode ?? fallbackColorMode ?? defaultColorMode);
-  const [dayScheme, setDayScheme] = useSyncedState(props.dayScheme ?? fallbackDayScheme ?? defaultDayScheme);
-  const [nightScheme, setNightScheme] = useSyncedState(props.nightScheme ?? fallbackNightScheme ?? defaultNightScheme);
-  const systemColorMode = useSystemColorMode();
-  // eslint-disable-next-line react-hooks/refs
-  const resolvedColorMode = resolvedColorModePassthrough.current || resolveColorMode(colorMode, systemColorMode);
-  const colorScheme = chooseColorScheme(resolvedColorMode, dayScheme, nightScheme);
-  const {
-    resolvedTheme,
-    resolvedColorScheme
-  } = React.useMemo(() => applyColorScheme(theme$1, colorScheme), [theme$1, colorScheme]);
-
-  // this effect will only run on client
-  React.useEffect(function updateColorModeAfterServerPassthrough() {
-    const resolvedColorModeOnClient = resolveColorMode(colorMode, systemColorMode);
-    if (resolvedColorModePassthrough.current) {
-      // if the resolved color mode passed on from the server is not the resolved color mode on client, change it!
-      if (resolvedColorModePassthrough.current !== resolvedColorModeOnClient) {
-        window.setTimeout(() => {
-          // use ReactDOM.flushSync to prevent automatic batching of state updates since React 18
-          // ref: https://github.com/reactwg/react-18/discussions/21
-          ReactDOM.flushSync(() => {
-            // override colorMode to whatever is resolved on the client to get a re-render
-            setColorMode(resolvedColorModeOnClient);
-          });
-
-          // immediately after that, set the colorMode to what the user passed to respond to system color mode changes
-          setColorMode(colorMode);
-        });
-      }
-      resolvedColorModePassthrough.current = null;
-    }
-  }, [colorMode, systemColorMode, setColorMode]);
-  return /*#__PURE__*/jsx(ThemeContext.Provider, {
-    value: {
-      theme: resolvedTheme,
-      colorScheme,
-      colorMode,
-      resolvedColorMode,
-      resolvedColorScheme,
-      dayScheme,
-      nightScheme,
-      setColorMode,
-      setDayScheme,
-      setNightScheme
-    },
-    children: /*#__PURE__*/jsxs(ThemeProvider$1, {
-      theme: resolvedTheme,
-      children: [children, props.preventSSRMismatch ? /*#__PURE__*/jsx("script", {
-        type: "application/json",
-        id: `__PRIMER_DATA_${uniqueDataId}__`,
-        dangerouslySetInnerHTML: {
-          __html: JSON.stringify({
-            resolvedServerColorMode: resolvedColorMode
-          })
-        }
-      }) : null]
-    })
-  });
-};
-function useTheme() {
-  return React.useContext(ThemeContext);
-}
-function useColorSchemeVar(values, fallback) {
-  const {
-    colorScheme = ''
-  } = useTheme();
-  return values[colorScheme] ?? fallback;
-}
-function useSystemColorMode() {
-  const [systemColorMode, setSystemColorMode] = React.useState(getSystemColorMode);
-  React.useEffect(() => {
-    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
-    const media = window?.matchMedia?.('(prefers-color-scheme: dark)');
-    function matchesMediaToColorMode(matches) {
-      return matches ? 'night' : 'day';
-    }
-    function handleChange(event) {
-      const isNight = event.matches;
-      setSystemColorMode(matchesMediaToColorMode(isNight));
-    }
-
-    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
-    if (media) {
-      // just in case the preference changed before the event listener was attached
-      const isNight = media.matches;
-      setSystemColorMode(matchesMediaToColorMode(isNight));
-      // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
-      if (media.addEventListener !== undefined) {
-        media.addEventListener('change', handleChange);
-        return function cleanup() {
-          media.removeEventListener('change', handleChange);
-        };
-      }
-      // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
-      else if (media.addListener !== undefined) {
-        media.addListener(handleChange);
-        return function cleanup() {
-          media.removeListener(handleChange);
-        };
-      }
-    }
-  }, []);
-  return systemColorMode;
-}
-function getSystemColorMode() {
-  // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
-  if (typeof window !== 'undefined' && window.matchMedia?.('(prefers-color-scheme: dark)')?.matches) {
-    return 'night';
-  }
-  return 'day';
-}
-function resolveColorMode(colorMode, systemColorMode) {
-  switch (colorMode) {
-    case 'auto':
-      return systemColorMode;
-    default:
-      return colorMode;
-  }
-}
-function chooseColorScheme(colorMode, dayScheme, nightScheme) {
-  switch (colorMode) {
-    case 'day':
-    case 'light':
-      return dayScheme;
-    case 'dark':
-    case 'night':
-      return nightScheme;
-  }
-}
-function applyColorScheme(theme, colorScheme) {
-  if (!theme.colorSchemes) {
-    return {
-      resolvedTheme: theme,
-      resolvedColorScheme: undefined
-    };
-  }
-  if (!theme.colorSchemes[colorScheme]) {
-    // eslint-disable-next-line no-console
-    console.error(`\`${colorScheme}\` scheme not defined in \`theme.colorSchemes\``);
-
-    // Apply the first defined color scheme
-    const defaultColorScheme = Object.keys(theme.colorSchemes)[0];
-    return {
-      resolvedTheme: deepmerge(theme, theme.colorSchemes[defaultColorScheme]),
-      resolvedColorScheme: defaultColorScheme
-    };
-  }
-  return {
-    resolvedTheme: deepmerge(theme, theme.colorSchemes[colorScheme]),
-    resolvedColorScheme: colorScheme
-  };
-}
-
-export { ThemeProvider, ThemeProvider as default, defaultColorMode, useColorSchemeVar, useTheme };

package/dist/components/Timeline.js

@@ -1,47 +0,0 @@
-import { Timeline as Timeline$1 } from '@primer/react';
-import Box from './Box.js';
-import { forwardRef } from 'react';
-import { jsx } from 'react/jsx-runtime';
-
-const TimelineImpl = /*#__PURE__*/forwardRef(function Timeline(props, ref) {
-  return /*#__PURE__*/jsx(Box, {
-    as: Timeline$1,
-    ref: ref,
-    ...props
-  });
-});
-const TimelineItem = /*#__PURE__*/forwardRef(function TimelineItem(props, ref) {
-  return /*#__PURE__*/jsx(Box, {
-    as: Timeline$1.Item,
-    ref: ref,
-    ...props
-  });
-});
-function TimelineBadge(props) {
-  return /*#__PURE__*/jsx(Box, {
-    as: Timeline$1.Badge,
-    ...props
-  });
-}
-const TimelineBody = /*#__PURE__*/forwardRef(function TimelineBody(props, ref) {
-  return /*#__PURE__*/jsx(Box, {
-    as: Timeline$1.Body,
-    ref: ref,
-    ...props
-  });
-});
-const TimelineBreak = /*#__PURE__*/forwardRef(function TimelineBreak(props, ref) {
-  return /*#__PURE__*/jsx(Box, {
-    as: Timeline$1.Break,
-    ref: ref,
-    ...props
-  });
-});
-const Timeline = Object.assign(TimelineImpl, {
-  Item: TimelineItem,
-  Badge: TimelineBadge,
-  Body: TimelineBody,
-  Break: TimelineBreak
-});
-
-export { Timeline };

package/dist/components/ToggleSwitch.js

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

package/dist/components/Token.js

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

package/dist/components/Tooltip.js

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

package/dist/components/Truncate.js

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

package/dist/components/UnderlineNav.js

@@ -1,45 +0,0 @@
-import { UnderlineNav as UnderlineNav$1 } from '@primer/react';
-import Box from './Box.js';
-import { forwardRef } from 'react';
-import styled from 'styled-components';
-import sx from '../sx.js';
-import { jsx } from 'react/jsx-runtime';
-
-const StyledUnderlineNav = /*#__PURE__*/forwardRef(function UnderlineNav(props, ref) {
-  return /*#__PURE__*/jsx(Box, {
-    as: UnderlineNav$1,
-    ref: ref,
-    ...props
-  });
-});
-const UnderlineNavImpl = /*#__PURE__*/forwardRef(({
-  as,
-  ...props
-}, ref) => /*#__PURE__*/jsx(StyledUnderlineNav, {
-  ...props,
-  ...(as ? {
-    forwardedAs: as
-  } : {}),
-  ref: ref
-}));
-const StyledUnderlineNavItem = styled(UnderlineNav$1.Item).withConfig({
-  shouldForwardProp: prop => prop !== 'sx'
-}).withConfig({
-  displayName: "UnderlineNav__StyledUnderlineNavItem",
-  componentId: "sc-dx6br2-0"
-})(["", ""], sx);
-const UnderlineNavItem = /*#__PURE__*/forwardRef(({
-  as,
-  ...props
-}, ref) => /*#__PURE__*/jsx(StyledUnderlineNavItem, {
-  ...props,
-  ...(as ? {
-    forwardedAs: as
-  } : {}),
-  ref: ref
-}));
-const UnderlineNav = Object.assign(UnderlineNavImpl, {
-  Item: UnderlineNavItem
-});
-
-export { UnderlineNav, UnderlineNavImpl, UnderlineNavItem };

package/dist/components/UnderlinePanels.js

@@ -1,28 +0,0 @@
-import { UnderlinePanels as UnderlinePanels$1 } from '@primer/react/experimental';
-import styled from 'styled-components';
-import sx from '../sx.js';
-import { jsx } from 'react/jsx-runtime';
-
-const StyledUnderlinePanels = styled(UnderlinePanels$1).withConfig({
-  shouldForwardProp: prop => prop !== 'sx'
-}).withConfig({
-  displayName: "UnderlinePanels__StyledUnderlinePanels",
-  componentId: "sc-1w35i85-0"
-})(["", ""], sx);
-
-// @ts-ignore forwardedAs is valid here but I don't know how to fix the typescript error
-const UnderlinePanelsImpl = ({
-  as,
-  ...props
-}) => /*#__PURE__*/jsx(StyledUnderlinePanels, {
-  forwardedAs: as,
-  ...props
-});
-UnderlinePanelsImpl.displayName = 'UnderlinePanels';
-const UnderlinePanels = Object.assign(UnderlinePanelsImpl, {
-  Tab: UnderlinePanels$1.Tab,
-  Panel: UnderlinePanels$1.Panel
-});
-UnderlinePanelsImpl.__SLOT__ = UnderlinePanels$1.__SLOT__;
-
-export { UnderlinePanels };

package/dist/components/deprecated/ActionList.js

@@ -1,49 +0,0 @@
-import { forwardRef } from 'react';
-import { ActionList as ActionList$1 } from '@primer/react/deprecated';
-import sx from '../../sx.js';
-import Box from '../Box.js';
-import styled from 'styled-components';
-import { jsx } from 'react/jsx-runtime';
-
-const ActionListImpl = /*#__PURE__*/forwardRef(function ActionList(props, ref) {
-  return /*#__PURE__*/jsx(Box, {
-    as: ActionList$1,
-    ref: ref,
-    ...props
-  });
-});
-const StyledActionListItem = styled(ActionList$1.Item).withConfig({
-  shouldForwardProp: prop => prop !== 'sx'
-}).withConfig({
-  displayName: "ActionList__StyledActionListItem",
-  componentId: "sc-1ugfmds-0"
-})(["", ""], sx);
-const ActionListItem = /*#__PURE__*/forwardRef(({
-  as,
-  ...props
-}, ref) => /*#__PURE__*/jsx(StyledActionListItem, {
-  ...props,
-  ...(as ? {
-    forwardedAs: as
-  } : {}),
-  ref: ref
-}));
-function ActionListGroup(props) {
-  return /*#__PURE__*/jsx(Box, {
-    as: ActionList$1.Group,
-    ...props
-  });
-}
-function ActionListDivider(props) {
-  return /*#__PURE__*/jsx(Box, {
-    as: ActionList$1.Divider,
-    ...props
-  });
-}
-const ActionList = Object.assign(ActionListImpl, {
-  Item: ActionListItem,
-  Group: ActionListGroup,
-  Divider: ActionListDivider
-});
-
-export { ActionList };

package/dist/components/deprecated/DialogV1.js

@@ -1,44 +0,0 @@
-import { Dialog as Dialog$1 } from '@primer/react/deprecated';
-import Box from '../Box.js';
-import { forwardRef } from 'react';
-import { jsx } from 'react/jsx-runtime';
-
-const StyledDialog = /*#__PURE__*/forwardRef(function Dialog(props, ref) {
-  return /*#__PURE__*/jsx(Box, {
-    as: Dialog$1,
-    ref: ref,
-    ...props
-  });
-});
-const DialogImpl = /*#__PURE__*/forwardRef(({
-  as,
-  ...props
-}, ref) => /*#__PURE__*/jsx(StyledDialog, {
-  ...props,
-  ...(as ? {
-    forwardedAs: as
-  } : {}),
-  ref: ref
-}));
-const StyledDialogHeader = /*#__PURE__*/forwardRef(function DialogHeader(props, ref) {
-  return /*#__PURE__*/jsx(Box, {
-    as: Dialog$1.Header,
-    ref: ref,
-    ...props
-  });
-});
-const DialogHeader = /*#__PURE__*/forwardRef(({
-  as,
-  ...props
-}, ref) => /*#__PURE__*/jsx(StyledDialogHeader, {
-  ...props,
-  ...(as ? {
-    forwardedAs: as
-  } : {}),
-  ref: ref
-}));
-const Dialog = Object.assign(DialogImpl, {
-  Header: DialogHeader
-});
-
-export { Dialog };

package/dist/components/deprecated/Octicon.js

@@ -1,39 +0,0 @@
-import { Octicon as Octicon$1 } from '@primer/react/deprecated';
-import styled from 'styled-components';
-import sx from '../../sx.js';
-import { forwardRef } from 'react';
-import { jsx } from 'react/jsx-runtime';
-
-/**
- * @deprecated Use the icon component directly from `@primer/octicons-react` instead
- */
-const StyledOcticon = styled(Octicon$1).withConfig({
-  shouldForwardProp(prop) {
-    return prop !== 'sx';
-  }
-}).withConfig({
-  displayName: "Octicon__StyledOcticon",
-  componentId: "sc-jtj3m8-0"
-})(["", ""], ({
-  color,
-  sx: sxProp
-}) => sx({
-  sx: {
-    color,
-    ...sxProp
-  }
-}));
-const Octicon = /*#__PURE__*/forwardRef(({
-  as,
-  ...props
-}, ref) => {
-  return /*#__PURE__*/jsx(StyledOcticon, {
-    ...props,
-    ...(as ? {
-      forwardedAs: as
-    } : {}),
-    ref: ref
-  });
-});
-
-export { Octicon, Octicon as default };

package/dist/components/deprecated/TabNav.js

@@ -1,44 +0,0 @@
-import { TabNav as TabNav$1 } from '@primer/react/deprecated';
-import sx from '../../sx.js';
-import styled from 'styled-components';
-import { forwardRef } from 'react';
-import { jsx } from 'react/jsx-runtime';
-
-const StyledTabNav = styled(TabNav$1).withConfig({
-  shouldForwardProp: prop => prop !== 'sx'
-}).withConfig({
-  displayName: "TabNav__StyledTabNav",
-  componentId: "sc-13kad3t-0"
-})(["", ""], sx);
-const TabNavImpl = ({
-  as,
-  ...props
-}) => {
-  return /*#__PURE__*/jsx(StyledTabNav, {
-    ...props,
-    ...(as ? {
-      forwardedAs: as
-    } : {})
-  });
-};
-const StyledTabNavLink = styled(TabNav$1.Link).withConfig({
-  shouldForwardProp: prop => prop !== 'sx'
-}).withConfig({
-  displayName: "TabNav__StyledTabNavLink",
-  componentId: "sc-13kad3t-1"
-})(["", ""], sx);
-const TabNavLink = /*#__PURE__*/forwardRef(({
-  as,
-  ...props
-}, ref) => /*#__PURE__*/jsx(StyledTabNavLink, {
-  ...props,
-  ...(as ? {
-    forwardedAs: as
-  } : {}),
-  ref: ref
-}));
-const TabNav = Object.assign(TabNavImpl, {
-  Link: TabNavLink
-});
-
-export { TabNav };