@zendeskgarden/react-typography 9.12.2 → 9.12.4

package/dist/esm/elements/Blockquote.js

@@ -21,16 +21,13 @@ import '../styled/StyledList.js';
 import '../styled/StyledListItem.js';
 import '../styled/StyledParagraph.js';
 
-const Blockquote = forwardRef((_ref, ref) => {
-  let {
-    size = 'medium',
-    ...props
-  } = _ref;
-  return React.createElement(StyledBlockquote, Object.assign({
-    ref: ref,
-    size: size
-  }, props));
-});
+const Blockquote = forwardRef(({
+  size = 'medium',
+  ...props
+}, ref) => React.createElement(StyledBlockquote, Object.assign({
+  ref: ref,
+  size: size
+}, props)));
 Blockquote.displayName = 'Blockquote';
 Blockquote.propTypes = {
   size: PropTypes.oneOf(SIZE)

package/dist/esm/elements/Code.js

@@ -6,7 +6,7 @@
 */
 import React, { forwardRef } from 'react';
 import PropTypes from 'prop-types';
-import { HUE, INHERIT_SIZE } from '../types/index.js';
+import { INHERIT_SIZE, HUE } from '../types/index.js';
 import '../styled/StyledBlockquote.js';
 import { StyledCode } from '../styled/StyledCode.js';
 import '../styled/StyledCodeBlock.js';
@@ -21,18 +21,15 @@ import '../styled/StyledList.js';
 import '../styled/StyledListItem.js';
 import '../styled/StyledParagraph.js';
 
-const Code = forwardRef((_ref, ref) => {
-  let {
-    hue = 'grey',
-    size = 'inherit',
-    ...other
-  } = _ref;
-  return React.createElement(StyledCode, Object.assign({
-    ref: ref,
-    $hue: hue,
-    $size: size
-  }, other));
-});
+const Code = forwardRef(({
+  hue = 'grey',
+  size = 'inherit',
+  ...other
+}, ref) => React.createElement(StyledCode, Object.assign({
+  ref: ref,
+  $hue: hue,
+  $size: size
+}, other)));
 Code.displayName = 'Code';
 Code.propTypes = {
   hue: PropTypes.oneOf(HUE),

package/dist/esm/elements/CodeBlock.js

@@ -23,17 +23,16 @@ import '../styled/StyledList.js';
 import '../styled/StyledListItem.js';
 import '../styled/StyledParagraph.js';
 
-const CodeBlock = React.forwardRef((_ref, ref) => {
-  let {
-    children,
-    containerProps,
-    highlightLines,
-    isLight,
-    isNumbered,
-    language = 'tsx',
-    size = 'medium',
-    ...other
-  } = _ref;
+const CodeBlock = React.forwardRef(({
+  children,
+  containerProps,
+  highlightLines,
+  isLight,
+  isNumbered,
+  language = 'tsx',
+  size = 'medium',
+  ...other
+}, ref) => {
   const containerRef = useRef(null);
   const code = Array.isArray(children) ? children[0] : children;
   const dependency = useMemo(() => [size, children], [size, children]);
@@ -66,42 +65,39 @@ const CodeBlock = React.forwardRef((_ref, ref) => {
     Prism: Prism,
     code: code ? code.trim() : '',
     language: LANGUAGES.includes(language) ? language : 'tsx'
-  }, _ref2 => {
-    let {
-      className,
-      tokens,
-      getLineProps,
-      getTokenProps
-    } = _ref2;
-    return React.createElement(ThemeProvider, {
-      theme: parentTheme => ({
-        ...parentTheme,
-        colors: {
-          ...parentTheme.colors,
-          base: isLight ? 'light' : 'dark'
-        }
-      })
-    }, React.createElement(StyledCodeBlock, Object.assign({
-      className: className,
-      ref: ref
-    }, other), tokens.map((line, index) =>
-    React.createElement(StyledCodeBlockLine, Object.assign({}, getLineProps({
-      line
-    }), {
-      key: index,
-      $language: language,
-      $isHighlighted: highlightLines?.includes(index + 1),
-      $isNumbered: isNumbered,
-      $diff: getDiff(line),
-      $size: size,
-      style: undefined
-    }), line.map((token, tokenKey) => React.createElement(StyledCodeBlockToken, Object.assign({}, getTokenProps({
-      token
-    }), {
-      key: tokenKey,
-      style: undefined
-    }), token.empty ? '\n' : token.content))))));
-  }));
+  }, ({
+    className,
+    tokens,
+    getLineProps,
+    getTokenProps
+  }) => React.createElement(ThemeProvider, {
+    theme: parentTheme => ({
+      ...parentTheme,
+      colors: {
+        ...parentTheme.colors,
+        base: isLight ? 'light' : 'dark'
+      }
+    })
+  }, React.createElement(StyledCodeBlock, Object.assign({
+    className: className,
+    ref: ref
+  }, other), tokens.map((line, index) =>
+  React.createElement(StyledCodeBlockLine, Object.assign({}, getLineProps({
+    line
+  }), {
+    key: index,
+    $language: language,
+    $isHighlighted: highlightLines?.includes(index + 1),
+    $isNumbered: isNumbered,
+    $diff: getDiff(line),
+    $size: size,
+    style: undefined
+  }), line.map((token, tokenKey) => React.createElement(StyledCodeBlockToken, Object.assign({}, getTokenProps({
+    token
+  }), {
+    key: tokenKey,
+    style: undefined
+  }), token.empty ? '\n' : token.content))))))));
 });
 CodeBlock.displayName = 'CodeBlock';
 

package/dist/esm/elements/Ellipsis.js

@@ -20,13 +20,12 @@ import '../styled/StyledList.js';
 import '../styled/StyledListItem.js';
 import '../styled/StyledParagraph.js';
 
-const Ellipsis = forwardRef((_ref, ref) => {
-  let {
-    children,
-    title,
-    tag = 'div',
-    ...other
-  } = _ref;
+const Ellipsis = forwardRef(({
+  children,
+  title,
+  tag = 'div',
+  ...other
+}, ref) => {
   let textContent = undefined;
   if (title !== undefined) {
     textContent = title;

package/dist/esm/elements/Kbd.js

@@ -21,17 +21,14 @@ import '../styled/StyledListItem.js';
 import '../styled/StyledParagraph.js';
 import { INHERIT_SIZE } from '../types/index.js';
 
-const Kbd = forwardRef((_ref, ref) => {
-  let {
-    size = 'inherit',
-    ...other
-  } = _ref;
-  return React.createElement(StyledKbd, Object.assign({
-    $size: size
-  }, other, {
-    ref: ref
-  }));
-});
+const Kbd = forwardRef(({
+  size = 'inherit',
+  ...other
+}, ref) => React.createElement(StyledKbd, Object.assign({
+  $size: size
+}, other, {
+  ref: ref
+})));
 Kbd.displayName = 'Kbd';
 Kbd.propTypes = {
   size: PropTypes.oneOf(INHERIT_SIZE)

package/dist/esm/elements/LG.js

@@ -20,21 +20,18 @@ import '../styled/StyledList.js';
 import '../styled/StyledListItem.js';
 import '../styled/StyledParagraph.js';
 
-const LG = forwardRef((_ref, ref) => {
-  let {
-    isBold,
-    isMonospace,
-    tag = 'div',
-    ...other
-  } = _ref;
-  return React.createElement(StyledFont, Object.assign({
-    $isBold: isBold,
-    $isMonospace: isMonospace,
-    $size: "large",
-    as: tag,
-    ref: ref
-  }, other));
-});
+const LG = forwardRef(({
+  isBold,
+  isMonospace,
+  tag = 'div',
+  ...other
+}, ref) => React.createElement(StyledFont, Object.assign({
+  $isBold: isBold,
+  $isMonospace: isMonospace,
+  $size: "large",
+  as: tag,
+  ref: ref
+}, other)));
 LG.displayName = 'LG';
 LG.propTypes = {
   tag: PropTypes.any,

package/dist/esm/elements/MD.js

@@ -20,21 +20,18 @@ import '../styled/StyledList.js';
 import '../styled/StyledListItem.js';
 import '../styled/StyledParagraph.js';
 
-const MD = forwardRef((_ref, ref) => {
-  let {
-    isBold,
-    isMonospace,
-    tag = 'div',
-    ...other
-  } = _ref;
-  return React.createElement(StyledFont, Object.assign({
-    $isBold: isBold,
-    $isMonospace: isMonospace,
-    $size: "medium",
-    as: tag,
-    ref: ref
-  }, other));
-});
+const MD = forwardRef(({
+  isBold,
+  isMonospace,
+  tag = 'div',
+  ...other
+}, ref) => React.createElement(StyledFont, Object.assign({
+  $isBold: isBold,
+  $isMonospace: isMonospace,
+  $size: "medium",
+  as: tag,
+  ref: ref
+}, other)));
 MD.displayName = 'MD';
 MD.propTypes = {
   tag: PropTypes.any,

package/dist/esm/elements/Paragraph.js

@@ -21,16 +21,13 @@ import '../styled/StyledList.js';
 import '../styled/StyledListItem.js';
 import { StyledParagraph } from '../styled/StyledParagraph.js';
 
-const Paragraph = forwardRef((_ref, ref) => {
-  let {
-    size = 'medium',
-    ...props
-  } = _ref;
-  return React.createElement(StyledParagraph, Object.assign({
-    ref: ref,
-    size: size
-  }, props));
-});
+const Paragraph = forwardRef(({
+  size = 'medium',
+  ...props
+}, ref) => React.createElement(StyledParagraph, Object.assign({
+  ref: ref,
+  size: size
+}, props)));
 Paragraph.displayName = 'Paragraph';
 Paragraph.propTypes = {
   size: PropTypes.oneOf(SIZE)

package/dist/esm/elements/SM.js

@@ -20,21 +20,18 @@ import '../styled/StyledList.js';
 import '../styled/StyledListItem.js';
 import '../styled/StyledParagraph.js';
 
-const SM = forwardRef((_ref, ref) => {
-  let {
-    isBold,
-    isMonospace,
-    tag = 'div',
-    ...other
-  } = _ref;
-  return React.createElement(StyledFont, Object.assign({
-    $isBold: isBold,
-    $isMonospace: isMonospace,
-    as: tag,
-    ref: ref,
-    $size: "small"
-  }, other));
-});
+const SM = forwardRef(({
+  isBold,
+  isMonospace,
+  tag = 'div',
+  ...other
+}, ref) => React.createElement(StyledFont, Object.assign({
+  $isBold: isBold,
+  $isMonospace: isMonospace,
+  as: tag,
+  ref: ref,
+  $size: "small"
+}, other)));
 SM.displayName = 'SM';
 SM.propTypes = {
   tag: PropTypes.any,

package/dist/esm/elements/XL.js

@@ -20,19 +20,16 @@ import '../styled/StyledList.js';
 import '../styled/StyledListItem.js';
 import '../styled/StyledParagraph.js';
 
-const XL = forwardRef((_ref, ref) => {
-  let {
-    isBold,
-    tag = 'div',
-    ...other
-  } = _ref;
-  return React.createElement(StyledFont, Object.assign({
-    $size: "extralarge",
-    $isBold: isBold,
-    ref: ref,
-    as: tag
-  }, other));
-});
+const XL = forwardRef(({
+  isBold,
+  tag = 'div',
+  ...other
+}, ref) => React.createElement(StyledFont, Object.assign({
+  $size: "extralarge",
+  $isBold: isBold,
+  ref: ref,
+  as: tag
+}, other)));
 XL.displayName = 'XL';
 XL.propTypes = {
   tag: PropTypes.any,

package/dist/esm/elements/XXL.js

@@ -20,19 +20,16 @@ import '../styled/StyledList.js';
 import '../styled/StyledListItem.js';
 import '../styled/StyledParagraph.js';
 
-const XXL = forwardRef((_ref, ref) => {
-  let {
-    isBold,
-    tag = 'div',
-    ...other
-  } = _ref;
-  return React.createElement(StyledFont, Object.assign({
-    $size: "2xlarge",
-    $isBold: isBold,
-    ref: ref,
-    as: tag
-  }, other));
-});
+const XXL = forwardRef(({
+  isBold,
+  tag = 'div',
+  ...other
+}, ref) => React.createElement(StyledFont, Object.assign({
+  $size: "2xlarge",
+  $isBold: isBold,
+  ref: ref,
+  as: tag
+}, other)));
 XXL.displayName = 'XXL';
 XXL.propTypes = {
   tag: PropTypes.any,

package/dist/esm/elements/XXXL.js

@@ -20,20 +20,17 @@ import '../styled/StyledList.js';
 import '../styled/StyledListItem.js';
 import '../styled/StyledParagraph.js';
 
-const XXXL = forwardRef((_ref, ref) => {
-  let {
-    isBold,
-    tag = 'div',
-    ...other
-  } = _ref;
-  return React.createElement(StyledFont, Object.assign({
-    $isBold: isBold,
-    $size: "3xlarge"
-  }, other, {
-    as: tag,
-    ref: ref
-  }));
-});
+const XXXL = forwardRef(({
+  isBold,
+  tag = 'div',
+  ...other
+}, ref) => React.createElement(StyledFont, Object.assign({
+  $isBold: isBold,
+  $size: "3xlarge"
+}, other, {
+  as: tag,
+  ref: ref
+})));
 XXXL.displayName = 'XXXL';
 XXXL.propTypes = {
   tag: PropTypes.any,

package/dist/esm/elements/lists/OrderedList.js

@@ -7,7 +7,7 @@
 import React, { useMemo } from 'react';
 import PropTypes from 'prop-types';
 import { Item } from './OrderedListItem.js';
-import { SIZE, TYPE_ORDERED_LIST } from '../../types/index.js';
+import { TYPE_ORDERED_LIST, SIZE } from '../../types/index.js';
 import { OrderedListContext } from '../../utils/useOrderedListContext.js';
 import '../../styled/StyledBlockquote.js';
 import '../../styled/StyledCode.js';
@@ -23,12 +23,11 @@ import { StyledOrderedList } from '../../styled/StyledList.js';
 import '../../styled/StyledListItem.js';
 import '../../styled/StyledParagraph.js';
 
-const OrderedListComponent = React.forwardRef((_ref, ref) => {
-  let {
-    size = 'medium',
-    type = 'decimal',
-    ...other
-  } = _ref;
+const OrderedListComponent = React.forwardRef(({
+  size = 'medium',
+  type = 'decimal',
+  ...other
+}, ref) => {
   const value = useMemo(() => ({
     size: size
   }), [size]);

package/dist/esm/elements/lists/OrderedListItem.js

@@ -30,6 +30,6 @@ const OrderedListItem = forwardRef((props, ref) => {
   }, props));
 });
 OrderedListItem.displayName = 'OrderedList.Item';
-const Item = OrderedListItem;
+const Item$1 = OrderedListItem;
 
-export { Item };
+export { Item$1 as Item };

package/dist/esm/elements/lists/UnorderedList.js

@@ -7,7 +7,7 @@
 import React, { forwardRef, useMemo } from 'react';
 import PropTypes from 'prop-types';
 import { Item } from './UnorderedListItem.js';
-import { SIZE, TYPE_UNORDERED_LIST } from '../../types/index.js';
+import { TYPE_UNORDERED_LIST, SIZE } from '../../types/index.js';
 import { UnorderedListContext } from '../../utils/useUnorderedListContext.js';
 import '../../styled/StyledBlockquote.js';
 import '../../styled/StyledCode.js';
@@ -23,12 +23,11 @@ import { StyledUnorderedList } from '../../styled/StyledList.js';
 import '../../styled/StyledListItem.js';
 import '../../styled/StyledParagraph.js';
 
-const UnorderedListComponent = forwardRef((_ref, ref) => {
-  let {
-    size = 'medium',
-    type = 'disc',
-    ...other
-  } = _ref;
+const UnorderedListComponent = forwardRef(({
+  size = 'medium',
+  type = 'disc',
+  ...other
+}, ref) => {
   const value = useMemo(() => ({
     size: size
   }), [size]);

package/dist/esm/elements/span/Span.js

@@ -22,23 +22,20 @@ import '../../styled/StyledParagraph.js';
 import { StartIcon } from './StartIcon.js';
 import { Icon } from './Icon.js';
 
-const SpanComponent = forwardRef((_ref, ref) => {
-  let {
-    hue,
-    isBold,
-    isMonospace,
-    tag = 'span',
-    ...other
-  } = _ref;
-  return React.createElement(StyledFont, Object.assign({
-    $hue: hue,
-    $isBold: isBold,
-    $isMonospace: isMonospace,
-    $size: "inherit",
-    as: tag,
-    ref: ref
-  }, other));
-});
+const SpanComponent = forwardRef(({
+  hue,
+  isBold,
+  isMonospace,
+  tag = 'span',
+  ...other
+}, ref) => React.createElement(StyledFont, Object.assign({
+  $hue: hue,
+  $isBold: isBold,
+  $isMonospace: isMonospace,
+  $size: "inherit",
+  as: tag,
+  ref: ref
+}, other)));
 SpanComponent.displayName = 'Span';
 SpanComponent.propTypes = {
   tag: PropTypes.any,

package/dist/esm/styled/StyledBlockquote.js

@@ -8,10 +8,10 @@ import styled from 'styled-components';
 import { getColor, componentStyles } from '@zendeskgarden/react-theming';
 import { THEME_SIZES } from './StyledFont.js';
 
-const COMPONENT_ID = 'typography.blockquote';
+const COMPONENT_ID$9 = 'typography.blockquote';
 const StyledBlockquote = styled.blockquote.attrs({
-  'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.12.2'
+  'data-garden-id': COMPONENT_ID$9,
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledBlockquote",
   componentId: "sc-1tt3ye0-0"

package/dist/esm/styled/StyledCode.js

@@ -8,12 +8,11 @@ import styled, { css } from 'styled-components';
 import { componentStyles, getColor } from '@zendeskgarden/react-theming';
 import { StyledFont } from './StyledFont.js';
 
-const COMPONENT_ID = 'typography.code';
-const colorStyles = _ref => {
-  let {
-    $hue,
-    theme
-  } = _ref;
+const COMPONENT_ID$8 = 'typography.code';
+const colorStyles$3 = ({
+  $hue,
+  theme
+}) => {
   const bgColorArgs = {
     theme,
     light: {
@@ -49,8 +48,8 @@ const colorStyles = _ref => {
   return css(["background-color:", ";color:", ";a &{color:inherit;}"], backgroundColor, foregroundColor);
 };
 const StyledCode = styled(StyledFont).attrs(props => ({
-  'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.12.2',
+  'data-garden-id': COMPONENT_ID$8,
+  'data-garden-version': '9.12.4',
   as: 'code',
   $isMonospace: true,
   $hue: props.$hue ?? 'grey',
@@ -58,6 +57,6 @@ const StyledCode = styled(StyledFont).attrs(props => ({
 })).withConfig({
   displayName: "StyledCode",
   componentId: "sc-l8yvmf-0"
-})(["border-radius:", ";padding:1.5px;", ";", ";"], props => props.theme.borderRadii.sm, props => colorStyles(props), componentStyles);
+})(["border-radius:", ";padding:1.5px;", ";", ";"], props => props.theme.borderRadii.sm, props => colorStyles$3(props), componentStyles);
 
 export { StyledCode };

package/dist/esm/styled/StyledCodeBlock.js

@@ -7,11 +7,10 @@
 import styled, { css } from 'styled-components';
 import { componentStyles, getColor } from '@zendeskgarden/react-theming';
 
-const COMPONENT_ID = 'typography.codeblock';
-const colorStyles = _ref => {
-  let {
-    theme
-  } = _ref;
+const COMPONENT_ID$7 = 'typography.codeblock';
+const colorStyles$2 = ({
+  theme
+}) => {
   const backgroundColor = getColor({
     theme,
     variable: 'background.recessed'
@@ -23,11 +22,11 @@ const colorStyles = _ref => {
   return css(["background-color:", ";color:", ";"], backgroundColor, foregroundColor);
 };
 const StyledCodeBlock = styled.pre.attrs({
-  'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.12.2'
+  'data-garden-id': COMPONENT_ID$7,
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledCodeBlock",
   componentId: "sc-5wky57-0"
-})(["display:table;margin:0;padding:", "px;box-sizing:border-box;width:100%;direction:ltr;white-space:pre;counter-reset:linenumber;", ";", ";"], props => props.theme.space.base * 3, colorStyles, componentStyles);
+})(["display:table;margin:0;padding:", "px;box-sizing:border-box;width:100%;direction:ltr;white-space:pre;counter-reset:linenumber;", ";", ";"], props => props.theme.space.base * 3, colorStyles$2, componentStyles);
 
 export { StyledCodeBlock };

package/dist/esm/styled/StyledCodeBlockContainer.js

@@ -7,10 +7,10 @@
 import styled from 'styled-components';
 import { focusStyles, componentStyles } from '@zendeskgarden/react-theming';
 
-const COMPONENT_ID = 'typography.codeblock_container';
+const COMPONENT_ID$6 = 'typography.codeblock_container';
 const StyledCodeBlockContainer = styled.div.attrs({
-  'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.12.2'
+  'data-garden-id': COMPONENT_ID$6,
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledCodeBlockContainer",
   componentId: "sc-14zgbfw-0"