@primer/react 38.0.0-rc.2 → 38.0.0-rc.3

package/lib/Textarea/Textarea.d.ts

@@ -1,89 +0,0 @@
-import type { TextareaHTMLAttributes } from 'react';
-import React from 'react';
-import type { FormValidationStatus } from '../utils/types/FormValidationStatus';
-import type { SxProp } from '../sx';
-export declare const DEFAULT_TEXTAREA_ROWS = 7;
-export declare const DEFAULT_TEXTAREA_COLS = 30;
-export declare const DEFAULT_TEXTAREA_RESIZE = "both";
-export type TextareaProps = {
-    /**
-     * Apply inactive visual appearance to the Textarea
-     */
-    disabled?: boolean;
-    /**
-     * Indicates whether the Textarea validation state
-     */
-    validationStatus?: FormValidationStatus;
-    /**
-     * Block
-     */
-    block?: boolean;
-    /**
-     * Allows resizing of the textarea
-     */
-    resize?: 'none' | 'both' | 'horizontal' | 'vertical';
-    /**
-     * apply a high contrast color to background
-     */
-    contrast?: boolean;
-    /**
-     * The className to apply to the wrapper element
-     */
-    className?: string;
-    /**
-     * The minimum height of the Textarea
-     */
-    minHeight?: number;
-    /**
-     * The maximum height of the Textarea
-     */
-    maxHeight?: number;
-    /**
-     * CSS styles to apply to the Textarea
-     */
-    style?: React.CSSProperties;
-} & TextareaHTMLAttributes<HTMLTextAreaElement> & SxProp;
-/**
- * An accessible, native textarea component that supports validation states.
- * This component accepts all native HTML <textarea> attributes as props.
- */
-declare const Textarea: React.ForwardRefExoticComponent<{
-    /**
-     * Apply inactive visual appearance to the Textarea
-     */
-    disabled?: boolean;
-    /**
-     * Indicates whether the Textarea validation state
-     */
-    validationStatus?: FormValidationStatus;
-    /**
-     * Block
-     */
-    block?: boolean;
-    /**
-     * Allows resizing of the textarea
-     */
-    resize?: "none" | "both" | "horizontal" | "vertical";
-    /**
-     * apply a high contrast color to background
-     */
-    contrast?: boolean;
-    /**
-     * The className to apply to the wrapper element
-     */
-    className?: string;
-    /**
-     * The minimum height of the Textarea
-     */
-    minHeight?: number;
-    /**
-     * The maximum height of the Textarea
-     */
-    maxHeight?: number;
-    /**
-     * CSS styles to apply to the Textarea
-     */
-    style?: React.CSSProperties;
-} & TextareaHTMLAttributes<HTMLTextAreaElement> & SxProp & React.RefAttributes<HTMLTextAreaElement>>;
-export default Textarea;
-//# sourceMappingURL=Textarea.d.ts.map

package/lib/Textarea/Textarea.js

@@ -1,166 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var reactCompilerRuntime = require('react-compiler-runtime');
-var React = require('react');
-var TextInputWrapper = require('../internal/components/TextInputWrapper.js');
-var TextArea_module = require('./TextArea.module.css.js');
-var jsxRuntime = require('react/jsx-runtime');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var React__default = /*#__PURE__*/_interopDefault(React);
-
-const DEFAULT_TEXTAREA_ROWS = 7;
-const DEFAULT_TEXTAREA_COLS = 30;
-const DEFAULT_TEXTAREA_RESIZE = 'both';
-/**
- * An accessible, native textarea component that supports validation states.
- * This component accepts all native HTML <textarea> attributes as props.
- */
-const Textarea = /*#__PURE__*/React__default.default.forwardRef((t0, ref) => {
-  const $ = reactCompilerRuntime.c(39);
-  let block;
-  let className;
-  let contrast;
-  let disabled;
-  let maxHeight;
-  let minHeight;
-  let required;
-  let rest;
-  let style;
-  let sxProp;
-  let t1;
-  let t2;
-  let t3;
-  let validationStatus;
-  let value;
-  if ($[0] !== t0) {
-    ({
-      value,
-      disabled,
-      sx: sxProp,
-      required,
-      validationStatus,
-      rows: t1,
-      cols: t2,
-      resize: t3,
-      block,
-      contrast,
-      className,
-      minHeight,
-      maxHeight,
-      style,
-      ...rest
-    } = t0);
-    $[0] = t0;
-    $[1] = block;
-    $[2] = className;
-    $[3] = contrast;
-    $[4] = disabled;
-    $[5] = maxHeight;
-    $[6] = minHeight;
-    $[7] = required;
-    $[8] = rest;
-    $[9] = style;
-    $[10] = sxProp;
-    $[11] = t1;
-    $[12] = t2;
-    $[13] = t3;
-    $[14] = validationStatus;
-    $[15] = value;
-  } else {
-    block = $[1];
-    className = $[2];
-    contrast = $[3];
-    disabled = $[4];
-    maxHeight = $[5];
-    minHeight = $[6];
-    required = $[7];
-    rest = $[8];
-    style = $[9];
-    sxProp = $[10];
-    t1 = $[11];
-    t2 = $[12];
-    t3 = $[13];
-    validationStatus = $[14];
-    value = $[15];
-  }
-  const rows = t1 === undefined ? DEFAULT_TEXTAREA_ROWS : t1;
-  const cols = t2 === undefined ? DEFAULT_TEXTAREA_COLS : t2;
-  const resize = t3 === undefined ? DEFAULT_TEXTAREA_RESIZE : t3;
-  const t4 = validationStatus === "error" ? "true" : "false";
-  let t5;
-  if ($[16] !== maxHeight || $[17] !== minHeight || $[18] !== style) {
-    t5 = {
-      minHeight,
-      maxHeight,
-      ...style
-    };
-    $[16] = maxHeight;
-    $[17] = minHeight;
-    $[18] = style;
-    $[19] = t5;
-  } else {
-    t5 = $[19];
-  }
-  let t6;
-  if ($[20] !== cols || $[21] !== disabled || $[22] !== ref || $[23] !== required || $[24] !== resize || $[25] !== rest || $[26] !== rows || $[27] !== t4 || $[28] !== t5 || $[29] !== value) {
-    t6 = /*#__PURE__*/jsxRuntime.jsx("textarea", {
-      value: value,
-      "data-resize": resize,
-      "aria-required": required,
-      "aria-invalid": t4,
-      ref: ref,
-      disabled: disabled,
-      rows: rows,
-      cols: cols,
-      className: TextArea_module.TextArea,
-      style: t5,
-      ...rest
-    });
-    $[20] = cols;
-    $[21] = disabled;
-    $[22] = ref;
-    $[23] = required;
-    $[24] = resize;
-    $[25] = rest;
-    $[26] = rows;
-    $[27] = t4;
-    $[28] = t5;
-    $[29] = value;
-    $[30] = t6;
-  } else {
-    t6 = $[30];
-  }
-  let t7;
-  if ($[31] !== block || $[32] !== className || $[33] !== contrast || $[34] !== disabled || $[35] !== sxProp || $[36] !== t6 || $[37] !== validationStatus) {
-    t7 = /*#__PURE__*/jsxRuntime.jsx(TextInputWrapper.TextInputBaseWrapper, {
-      sx: sxProp,
-      validationStatus: validationStatus,
-      disabled: disabled,
-      block: block,
-      contrast: contrast,
-      className: className,
-      children: t6
-    });
-    $[31] = block;
-    $[32] = className;
-    $[33] = contrast;
-    $[34] = disabled;
-    $[35] = sxProp;
-    $[36] = t6;
-    $[37] = validationStatus;
-    $[38] = t7;
-  } else {
-    t7 = $[38];
-  }
-  return t7;
-});
-Textarea.displayName = 'Textarea';
-
-exports.DEFAULT_TEXTAREA_COLS = DEFAULT_TEXTAREA_COLS;
-exports.DEFAULT_TEXTAREA_RESIZE = DEFAULT_TEXTAREA_RESIZE;
-exports.DEFAULT_TEXTAREA_ROWS = DEFAULT_TEXTAREA_ROWS;
-exports.default = Textarea;

package/lib/Textarea/index.d.ts

@@ -1,3 +0,0 @@
-export { default, DEFAULT_TEXTAREA_COLS, DEFAULT_TEXTAREA_RESIZE, DEFAULT_TEXTAREA_ROWS } from './Textarea';
-export type { TextareaProps } from './Textarea';
-//# sourceMappingURL=index.d.ts.map

package/lib/ThemeProvider.d.ts

@@ -1,30 +0,0 @@
-import React from 'react';
-export declare const defaultColorMode = "day";
-export type Theme = {
-    [key: string]: any;
-};
-type ColorMode = 'day' | 'night' | 'light' | 'dark';
-export type ColorModeWithAuto = ColorMode | 'auto';
-export type ThemeProviderProps = {
-    theme?: Theme;
-    colorMode?: ColorModeWithAuto;
-    dayScheme?: string;
-    nightScheme?: string;
-    preventSSRMismatch?: boolean;
-};
-export declare const ThemeProvider: React.FC<React.PropsWithChildren<ThemeProviderProps>>;
-export declare function useTheme(): {
-    theme?: Theme;
-    colorScheme?: string;
-    colorMode?: ColorModeWithAuto;
-    resolvedColorMode?: ColorMode;
-    resolvedColorScheme?: string;
-    dayScheme?: string;
-    nightScheme?: string;
-    setColorMode: React.Dispatch<React.SetStateAction<ColorModeWithAuto>>;
-    setDayScheme: React.Dispatch<React.SetStateAction<string>>;
-    setNightScheme: React.Dispatch<React.SetStateAction<string>>;
-};
-export declare function useColorSchemeVar(values: Partial<Record<string, string>>, fallback: string): string;
-export default ThemeProvider;
-//# sourceMappingURL=ThemeProvider.d.ts.map

package/lib/ThemeProvider.js

@@ -1,233 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var reactCompilerRuntime = require('react-compiler-runtime');
-var React = require('react');
-var ReactDOM = require('react-dom');
-var styled = require('styled-components');
-var theme = require('./theme.js');
-var merge = require('deepmerge');
-var useSyncedState = require('./hooks/useSyncedState.js');
-var jsxRuntime = require('react/jsx-runtime');
-var useId = require('./hooks/useId.js');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var React__default = /*#__PURE__*/_interopDefault(React);
-var ReactDOM__default = /*#__PURE__*/_interopDefault(ReactDOM);
-var merge__default = /*#__PURE__*/_interopDefault(merge);
-
-const defaultColorMode = 'day';
-const defaultDayScheme = 'light';
-const defaultNightScheme = 'dark';
-
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-
-const ThemeContext = /*#__PURE__*/React__default.default.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 {
-    var _document$getElementB;
-    const serverData = (_document$getElementB = document.getElementById(`__PRIMER_DATA_${id}__`)) === null || _document$getElementB === void 0 ? void 0 : _document$getElementB.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
-}) => {
-  var _ref, _props$theme, _ref2, _props$colorMode, _ref3, _props$dayScheme, _ref4, _props$nightScheme;
-  // Get fallback values from parent ThemeProvider (if exists)
-  const {
-    theme: fallbackTheme,
-    colorMode: fallbackColorMode,
-    dayScheme: fallbackDayScheme,
-    nightScheme: fallbackNightScheme
-  } = useTheme();
-
-  // Initialize state
-  const theme$1 = (_ref = (_props$theme = props.theme) !== null && _props$theme !== void 0 ? _props$theme : fallbackTheme) !== null && _ref !== void 0 ? _ref : theme;
-  const uniqueDataId = useId.useId();
-  const {
-    resolvedServerColorMode
-  } = getServerHandoff(uniqueDataId);
-  const resolvedColorModePassthrough = React__default.default.useRef(resolvedServerColorMode);
-  const [colorMode, setColorMode] = useSyncedState.useSyncedState((_ref2 = (_props$colorMode = props.colorMode) !== null && _props$colorMode !== void 0 ? _props$colorMode : fallbackColorMode) !== null && _ref2 !== void 0 ? _ref2 : defaultColorMode);
-  const [dayScheme, setDayScheme] = useSyncedState.useSyncedState((_ref3 = (_props$dayScheme = props.dayScheme) !== null && _props$dayScheme !== void 0 ? _props$dayScheme : fallbackDayScheme) !== null && _ref3 !== void 0 ? _ref3 : defaultDayScheme);
-  const [nightScheme, setNightScheme] = useSyncedState.useSyncedState((_ref4 = (_props$nightScheme = props.nightScheme) !== null && _props$nightScheme !== void 0 ? _props$nightScheme : fallbackNightScheme) !== null && _ref4 !== void 0 ? _ref4 : defaultNightScheme);
-  const systemColorMode = useSystemColorMode();
-  const resolvedColorMode = resolvedColorModePassthrough.current || resolveColorMode(colorMode, systemColorMode);
-  const colorScheme = chooseColorScheme(resolvedColorMode, dayScheme, nightScheme);
-  const {
-    resolvedTheme,
-    resolvedColorScheme
-  } = React__default.default.useMemo(() => applyColorScheme(theme$1, colorScheme), [theme$1, colorScheme]);
-
-  // this effect will only run on client
-  React__default.default.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__default.default.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__*/jsxRuntime.jsx(ThemeContext.Provider, {
-    value: {
-      theme: resolvedTheme,
-      colorScheme,
-      colorMode,
-      resolvedColorMode,
-      resolvedColorScheme,
-      dayScheme,
-      nightScheme,
-      setColorMode,
-      setDayScheme,
-      setNightScheme
-    },
-    children: /*#__PURE__*/jsxRuntime.jsxs(styled.ThemeProvider, {
-      theme: resolvedTheme,
-      children: [children, props.preventSSRMismatch ? /*#__PURE__*/jsxRuntime.jsx("script", {
-        type: "application/json",
-        id: `__PRIMER_DATA_${uniqueDataId}__`,
-        dangerouslySetInnerHTML: {
-          __html: JSON.stringify({
-            resolvedServerColorMode: resolvedColorMode
-          })
-        }
-      }) : null]
-    })
-  });
-};
-ThemeProvider.displayName = "ThemeProvider";
-function useTheme() {
-  return React__default.default.useContext(ThemeContext);
-}
-function useColorSchemeVar(values, fallback) {
-  var _values$colorScheme;
-  const {
-    colorScheme: t0
-  } = useTheme();
-  const colorScheme = t0 === undefined ? "" : t0;
-  return (_values$colorScheme = values[colorScheme]) !== null && _values$colorScheme !== void 0 ? _values$colorScheme : fallback;
-}
-function useSystemColorMode() {
-  const $ = reactCompilerRuntime.c(2);
-  const [systemColorMode, setSystemColorMode] = React__default.default.useState(getSystemColorMode);
-  let t0;
-  let t1;
-  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-    t0 = () => {
-      var _window, _window$matchMedia;
-      const media = (_window = window) === null || _window === void 0 ? void 0 : (_window$matchMedia = _window.matchMedia) === null || _window$matchMedia === void 0 ? void 0 : _window$matchMedia.call(_window, "(prefers-color-scheme: dark)");
-      const matchesMediaToColorMode = function matchesMediaToColorMode(matches) {
-        return matches ? "night" : "day";
-      };
-      const handleChange = function handleChange(event) {
-        const isNight = event.matches;
-        setSystemColorMode(matchesMediaToColorMode(isNight));
-      };
-      if (media) {
-        const isNight_0 = media.matches;
-        setSystemColorMode(matchesMediaToColorMode(isNight_0));
-        if (media.addEventListener !== undefined) {
-          media.addEventListener("change", handleChange);
-          return function cleanup() {
-            media.removeEventListener("change", handleChange);
-          };
-        } else {
-          if (media.addListener !== undefined) {
-            media.addListener(handleChange);
-            return function cleanup() {
-              media.removeListener(handleChange);
-            };
-          }
-        }
-      }
-    };
-    t1 = [];
-    $[0] = t0;
-    $[1] = t1;
-  } else {
-    t0 = $[0];
-    t1 = $[1];
-  }
-  React__default.default.useEffect(t0, t1);
-  return systemColorMode;
-}
-function getSystemColorMode() {
-  var _window$matchMedia2, _window2, _window$matchMedia2$c;
-  // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
-  if (typeof window !== 'undefined' && (_window$matchMedia2 = (_window2 = window).matchMedia) !== null && _window$matchMedia2 !== void 0 && (_window$matchMedia2$c = _window$matchMedia2.call(_window2, '(prefers-color-scheme: dark)')) !== null && _window$matchMedia2$c !== void 0 && _window$matchMedia2$c.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: merge__default.default(theme, theme.colorSchemes[defaultColorScheme]),
-      resolvedColorScheme: defaultColorScheme
-    };
-  }
-  return {
-    resolvedTheme: merge__default.default(theme, theme.colorSchemes[colorScheme]),
-    resolvedColorScheme: colorScheme
-  };
-}
-
-exports.ThemeProvider = ThemeProvider;
-exports.default = ThemeProvider;
-exports.defaultColorMode = defaultColorMode;
-exports.useColorSchemeVar = useColorSchemeVar;
-exports.useTheme = useTheme;

package/lib/Timeline/Timeline-e8e88a13.css

@@ -1,2 +0,0 @@
-.prc-Timeline-Timeline-iQjcc{display:flex;flex-direction:column}.prc-Timeline-Timeline-iQjcc:where([data-clip-sidebar]) .prc-Timeline-TimelineItem-Sd-t-:first-child{padding-top:0}.prc-Timeline-Timeline-iQjcc:where([data-clip-sidebar]) .prc-Timeline-TimelineItem-Sd-t-:last-child{padding-bottom:0}.prc-Timeline-TimelineItem-Sd-t-{display:flex;margin-left:var(--base-size-16,1rem);padding:var(--base-size-16,1rem) 0;position:relative}.prc-Timeline-TimelineItem-Sd-t-:before{background-color:var(--borderColor-muted,var(--color-border-muted));bottom:0;content:"";display:block;left:0;position:absolute;top:0;width:2px}.prc-Timeline-TimelineItem-Sd-t-:where([data-condensed]){padding-bottom:0;padding-top:var(--base-size-4,.25rem)}.prc-Timeline-TimelineItem-Sd-t-:where([data-condensed]):last-child{padding-bottom:var(--base-size-16,1rem)}.prc-Timeline-TimelineItem-Sd-t-:where([data-condensed]) .prc-Timeline-TimelineBadge-BqMiN{background-color:var(--bgColor-default,var(--color-canvas-default));border:0;color:var(--fgColor-muted,var(--color-fg-muted));height:16px;margin-bottom:var(--base-size-8,.5rem);margin-top:var(--base-size-8,.5rem)}.prc-Timeline-TimelineBadgeWrapper-75vYD{position:relative;z-index:1}.prc-Timeline-TimelineBadge-BqMiN{align-items:center;background-color:var(--timelineBadge-bgColor,var(--color-timeline-badge-bg));border-color:var(--bgColor-default,var(--color-canvas-default));border-radius:50%;border-style:solid;border-width:var(--borderWidth-thick,.125rem);display:flex;flex-shrink:0;height:32px;justify-content:center;margin-left:-15px;margin-right:var(--base-size-8,.5rem);overflow:hidden;width:32px}.prc-Timeline-TimelineBadge-BqMiN,.prc-Timeline-TimelineBody-WWZY0{color:var(--fgColor-muted,var(--color-fg-muted))}.prc-Timeline-TimelineBody-WWZY0{flex:auto;font-size:var(--text-body-size-medium,.875rem);margin-top:var(--base-size-4,.25rem);max-width:100%;min-width:0}.prc-Timeline-TimelineBreak-dPnDJ{background-color:var(--bgColor-default,var(--color-canvas-default));border:0;border-top:var(--borderWidth-thicker,.25rem) solid var(--borderColor-default,var(--color-border-default));height:var(--base-size-24,1.5rem);margin:0;margin-bottom:calc(var(--base-size-16,1rem)*-1);margin-left:0;position:relative;z-index:1}
-/*# sourceMappingURL=Timeline-e8e88a13.css.map */

package/lib/Timeline/Timeline-e8e88a13.css.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/Timeline/Timeline.module.css"],"names":[],"mappings":"AAAA,6BACE,YAAa,CACb,qBAWF,CARI,qGACE,aACF,CAEA,oGACE,gBACF,CAIJ,iCAEE,YAAa,CAEb,oCAAgC,CADhC,kCAA8B,CAF9B,iBAkCF,CA7BE,wCASE,mEAA0C,CAN1C,QAAS,CAIT,UAAW,CAFX,aAAc,CADd,MAAO,CAHP,iBAAkB,CAClB,KAAM,CAIN,SAIF,CAEA,yDAEE,gBAAiB,CADjB,qCAeF,CAZE,oEACE,uCACF,CAEA,2FAKE,mEAAwC,CACxC,QAAS,CAFT,gDAA2B,CAH3B,WAAY,CAEZ,sCAAiC,CADjC,mCAKF,CAIJ,yCACE,iBAAkB,CAClB,SACF,CAEA,kCAkBE,kBAAmB,CANnB,4EAA8C,CAE9C,+DAAoC,CAGpC,iBAAkB,CAFlB,kBAAmB,CACnB,6CAAsC,CAftC,YAAa,CAMb,aAAc,CAJd,WAAY,CAgBZ,sBAAuB,CAbvB,iBAAkB,CAFlB,qCAAgC,CAIhC,eAAgB,CANhB,UAkBF,CAEA,mEAbE,gDAoBF,CAPA,iCAME,SAAU,CAFV,8CAAuC,CADvC,oCAA8B,CAD9B,cAAe,CADf,WAMF,CAEA,kCAOE,mEAAwC,CACxC,QAAS,CACT,yGAAuE,CANvE,iCAA2B,CAC3B,QAAS,CACT,+CAA6C,CAC7C,aAAc,CALd,iBAAkB,CAClB,SAQF","file":"Timeline-e8e88a13.css","sourcesContent":[".Timeline {\n  display: flex;\n  flex-direction: column;\n\n  &:where([data-clip-sidebar]) {\n    .TimelineItem:first-child {\n      padding-top: 0;\n    }\n\n    .TimelineItem:last-child {\n      padding-bottom: 0;\n    }\n  }\n}\n\n.TimelineItem {\n  position: relative;\n  display: flex;\n  padding: var(--base-size-16) 0;\n  margin-left: var(--base-size-16);\n\n  &::before {\n    position: absolute;\n    top: 0;\n    bottom: 0;\n    left: 0;\n    display: block;\n    width: 2px;\n    content: '';\n    /* stylelint-disable-next-line primer/colors */\n    background-color: var(--borderColor-muted);\n  }\n\n  &:where([data-condensed]) {\n    padding-top: var(--base-size-4);\n    padding-bottom: 0;\n\n    &:last-child {\n      padding-bottom: var(--base-size-16);\n    }\n\n    .TimelineBadge {\n      height: 16px;\n      margin-top: var(--base-size-8);\n      margin-bottom: var(--base-size-8);\n      color: var(--fgColor-muted);\n      background-color: var(--bgColor-default);\n      border: 0;\n    }\n  }\n}\n\n.TimelineBadgeWrapper {\n  position: relative;\n  z-index: 1;\n}\n\n.TimelineBadge {\n  display: flex;\n  width: 32px;\n  height: 32px;\n  margin-right: var(--base-size-8);\n  /* stylelint-disable-next-line primer/spacing */\n  margin-left: -15px;\n  flex-shrink: 0;\n  overflow: hidden;\n  color: var(--fgColor-muted);\n\n  /* TODOl not quite sure if this is the correct migration for this line */\n  background-color: var(--timelineBadge-bgColor);\n  /* stylelint-disable-next-line primer/colors */\n  border-color: var(--bgColor-default);\n  border-style: solid;\n  border-width: var(--borderWidth-thick);\n  border-radius: 50%;\n  align-items: center;\n  justify-content: center;\n}\n\n.TimelineBody {\n  min-width: 0;\n  max-width: 100%;\n  margin-top: var(--base-size-4);\n  font-size: var(--text-body-size-medium);\n  color: var(--fgColor-muted);\n  flex: auto;\n}\n\n.TimelineBreak {\n  position: relative;\n  z-index: 1;\n  height: var(--base-size-24);\n  margin: 0;\n  margin-bottom: calc(-1 * var(--base-size-16));\n  margin-left: 0;\n  background-color: var(--bgColor-default);\n  border: 0;\n  border-top: var(--borderWidth-thicker) solid var(--borderColor-default);\n}\n"]}

package/lib/Timeline/Timeline.d.ts

@@ -1,51 +0,0 @@
-import React from 'react';
-import type { SxProp } from '../sx';
-type StyledTimelineProps = {
-    clipSidebar?: boolean;
-    className?: string;
-} & SxProp;
-export type TimelineProps = StyledTimelineProps & React.ComponentPropsWithoutRef<'div'>;
-type StyledTimelineItemProps = {
-    condensed?: boolean;
-    className?: string;
-} & SxProp;
-/**
- * @deprecated Use the `TimelineItemProps` type instead
- */
-export type TimelineItemsProps = StyledTimelineItemProps & SxProp & React.ComponentPropsWithoutRef<'div'>;
-export type TimelineItemProps = StyledTimelineItemProps & SxProp & React.ComponentPropsWithoutRef<'div'>;
-export type TimelineBadgeProps = {
-    children?: React.ReactNode;
-    className?: string;
-} & SxProp & React.ComponentPropsWithoutRef<'div'>;
-export type TimelineBodyProps = {
-    /** Class name for custom styling */
-    className?: string;
-} & SxProp & React.ComponentPropsWithoutRef<'div'>;
-export type TimelineBreakProps = {
-    /** Class name for custom styling */
-    className?: string;
-} & SxProp & React.ComponentPropsWithoutRef<'div'>;
-declare const _default: React.ForwardRefExoticComponent<{
-    clipSidebar?: boolean;
-    className?: string;
-} & SxProp & Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>> & {
-    Item: React.ForwardRefExoticComponent<{
-        condensed?: boolean;
-        className?: string;
-    } & SxProp & Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-    Badge: {
-        ({ className, ...props }: TimelineBadgeProps): React.JSX.Element;
-        displayName: string;
-    };
-    Body: React.ForwardRefExoticComponent<{
-        /** Class name for custom styling */
-        className?: string;
-    } & SxProp & Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-    Break: React.ForwardRefExoticComponent<{
-        /** Class name for custom styling */
-        className?: string;
-    } & SxProp & Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-};
-export default _default;
-//# sourceMappingURL=Timeline.d.ts.map