chore: run yarn format

carbon-design-system · Oct 28, 2024 · 3920859 · 3920859
1 parent c0f94d8
commit 3920859
Show file tree

Hide file tree

Showing 79 changed files with 448 additions and 349 deletions.
diff --git a/docs/guides/icons.md b/docs/guides/icons.md
@@ -150,8 +150,7 @@ update PR:
    `--modifiers`. All icons with `--modifiers` are listed as variants of the
    same icon.
 3. make desired edits on the icon's `aliases` list.
-4. commit changes, preferably with a commit message "[icon name] metadata
-   update".
+4. commit changes, preferably with a commit message "[icon name] metadata update".
 5. create a new branch, suggested branch name is `yourname-metadata-iconName`
 6. create the PR from your branch, or click on `Propose file change` if you are
    in browser.

diff --git a/docs/guides/support.md b/docs/guides/support.md
@@ -40,8 +40,8 @@ started in case you get stuck.
 - “Could you share more about what you’ve already tried?”
 - “Can you share more about your usecase?”
 - “Can you add a repro (reproduction) using Stackblitz?”
-- “After searching through [FILL IN RESOURCE HERE], I was able to find this and
-  thought it might be helpful... Let me know if that works.”
+- “After searching through [FILL IN RESOURCE HERE], I was able to find this and thought
+  it might be helpful... Let me know if that works.”
 
 ### What does "ongoing support" mean regarding GitHub?
 

diff --git a/packages/grid/scss/_css-grid.scss b/packages/grid/scss/_css-grid.scss
@@ -144,8 +144,10 @@
   // Condensed
   .#{$prefix}--css-grid--condensed {
     --cds-grid-gutter: #{$grid-gutter-condensed};
-    --cds-grid-column-hang: #{math.div($grid-gutter, 2) -
-      math.div($grid-gutter-condensed, 2)};
+    --cds-grid-column-hang: #{math.div($grid-gutter, 2) - math.div(
+        $grid-gutter-condensed,
+        2
+      )};
   }
 
   // -----------------------------------------------------------------------------
@@ -193,8 +195,10 @@
   .#{$prefix}--subgrid--condensed {
     --cds-grid-gutter-start: #{math.div($grid-gutter-condensed, 2)};
     --cds-grid-gutter-end: #{math.div($grid-gutter-condensed, 2)};
-    --cds-grid-column-hang: #{math.div($grid-gutter, 2) -
-      math.div($grid-gutter-condensed, 2)};
+    --cds-grid-column-hang: #{math.div($grid-gutter, 2) - math.div(
+        $grid-gutter-condensed,
+        2
+      )};
   }
 
   // -----------------------------------------------------------------------------

diff --git a/packages/icon-build-helpers/src/builders/vanilla.js b/packages/icon-build-helpers/src/builders/vanilla.js
@@ -57,9 +57,8 @@ async function builder(metadata, { output }) {
   for (const m of modules) {
     files[m.filepath] = m.source;
     input[m.filepath] = m.filepath;
-    files[
-      'index.js'
-    ] += `\nexport { default as ${m.moduleName} } from '${m.filepath}';`;
+    files['index.js'] +=
+      `\nexport { default as ${m.moduleName} } from '${m.filepath}';`;
   }
 
   const bundle = await rollup({

diff --git a/packages/icon-build-helpers/src/builders/vue/builder.js b/packages/icon-build-helpers/src/builders/vue/builder.js
@@ -73,9 +73,8 @@ async function builder(metadata, { output }) {
   for (const m of modules) {
     files[m.filepath] = m.source;
     input[m.filepath] = m.filepath;
-    files[
-      'index.js'
-    ] += `\nexport { default as ${m.moduleName} } from '${m.filepath}';`;
+    files['index.js'] +=
+      `\nexport { default as ${m.moduleName} } from '${m.filepath}';`;
   }
 
   const bundle = await rollup({

diff --git a/packages/react/src/components/Button/ButtonBase.tsx b/packages/react/src/components/Button/ButtonBase.tsx
@@ -12,7 +12,7 @@ import { useId } from '../../internal/useId';
 import { ButtonBaseProps, ButtonProps } from './Button';
 
 const ButtonBase = React.forwardRef(function ButtonBase<
-  T extends React.ElementType
+  T extends React.ElementType,
 >(
   {
     as,

diff --git a/packages/react/src/components/ComboBox/ComboBox.tsx b/packages/react/src/components/ComboBox/ComboBox.tsx
@@ -527,12 +527,12 @@ const ComboBox = forwardRef(
         typeahead
           ? autocompleteCustomFilter({ item: itemToString(item), inputValue })
           : shouldFilterItem
-          ? shouldFilterItem({
-              item,
-              itemToString,
-              inputValue,
-            })
-          : defaultShouldFilterItem()
+            ? shouldFilterItem({
+                item,
+                itemToString,
+                inputValue,
+              })
+            : defaultShouldFilterItem()
       );
 
     useEffect(() => {

diff --git a/packages/react/src/components/Heading/index.tsx b/packages/react/src/components/Heading/index.tsx
@@ -23,7 +23,7 @@ type SectionProps<E extends ElementType> = PolymorphicProps<
 >;
 
 export const Section = React.forwardRef(function Section<
-  E extends ElementType = 'section'
+  E extends ElementType = 'section',
 >(
   {
     as: BaseComponent = 'section' as E,

diff --git a/packages/react/src/components/InlineCheckbox/InlineCheckbox.js b/packages/react/src/components/InlineCheckbox/InlineCheckbox.js
@@ -12,79 +12,78 @@ import { usePrefix } from '../../internal/usePrefix';
 import { useMergedRefs } from '../../internal/useMergedRefs';
 
 /** @type any */
-const InlineCheckbox = React.forwardRef(function InlineCheckbox(
-  props,
-  forwardRef
-) {
-  const {
-    ['aria-label']: ariaLabel,
-    ariaLabel: deprecatedAriaLabel,
-    checked = false,
-    disabled,
-    id,
-    indeterminate,
-    name,
-    onChange = () => {},
-    onClick,
-    onKeyDown,
-    title,
-  } = props;
-  const prefix = usePrefix();
-  const inputRef = useRef(null);
-  const ref = useMergedRefs([inputRef, forwardRef]);
-  const inputProps = {
-    checked,
-    className: `${prefix}--checkbox`,
-    disabled,
-    id,
-    name,
-    onClick: onClick ? onClickCheckBoxInput : onClick,
-    onChange: (evt) => {
-      onChange(evt.target.checked, id, evt);
-    },
-    onKeyDown,
-    ref,
-    type: 'checkbox',
-  };
-
-  if (indeterminate) {
-    inputProps.checked = false;
-  }
-
-  useEffect(() => {
-    if (inputRef?.current) {
-      inputRef.current.indeterminate = indeterminate;
-    }
-  }, [indeterminate]);
+const InlineCheckbox = React.forwardRef(
+  function InlineCheckbox(props, forwardRef) {
+    const {
+      ['aria-label']: ariaLabel,
+      ariaLabel: deprecatedAriaLabel,
+      checked = false,
+      disabled,
+      id,
+      indeterminate,
+      name,
+      onChange = () => {},
+      onClick,
+      onKeyDown,
+      title,
+    } = props;
+    const prefix = usePrefix();
+    const inputRef = useRef(null);
+    const ref = useMergedRefs([inputRef, forwardRef]);
+    const inputProps = {
+      checked,
+      className: `${prefix}--checkbox`,
+      disabled,
+      id,
+      name,
+      onClick: onClick ? onClickCheckBoxInput : onClick,
+      onChange: (evt) => {
+        onChange(evt.target.checked, id, evt);
+      },
+      onKeyDown,
+      ref,
+      type: 'checkbox',
+    };
 
-  function onClickCheckBoxInput(evt) {
-    // If the previous "indeterminate" is true, change "checked" to false. If it is not undefined, we're working on `TableSelectAll`
     if (indeterminate) {
-      evt.target.checked = false;
+      inputProps.checked = false;
     }
-    onClick(evt);
-  }
 
-  return (
-    <div className={`${prefix}--checkbox--inline`}>
-      <input {...inputProps} />
-      {
-        /* eslint-disable jsx-a11y/label-has-for,jsx-a11y/label-has-associated-control,jsx-a11y/click-events-have-key-events,jsx-a11y/no-noninteractive-element-interactions */
-        <label
-          htmlFor={id}
-          className={`${prefix}--checkbox-label`}
-          title={title}
-          onClick={(evt) => {
-            evt.stopPropagation();
-          }}>
-          <span className={`${prefix}--visually-hidden`}>
-            {deprecatedAriaLabel || ariaLabel}
-          </span>
-        </label>
+    useEffect(() => {
+      if (inputRef?.current) {
+        inputRef.current.indeterminate = indeterminate;
       }
-    </div>
-  );
-});
+    }, [indeterminate]);
+
+    function onClickCheckBoxInput(evt) {
+      // If the previous "indeterminate" is true, change "checked" to false. If it is not undefined, we're working on `TableSelectAll`
+      if (indeterminate) {
+        evt.target.checked = false;
+      }
+      onClick(evt);
+    }
+
+    return (
+      <div className={`${prefix}--checkbox--inline`}>
+        <input {...inputProps} />
+        {
+          /* eslint-disable jsx-a11y/label-has-for,jsx-a11y/label-has-associated-control,jsx-a11y/click-events-have-key-events,jsx-a11y/no-noninteractive-element-interactions */
+          <label
+            htmlFor={id}
+            className={`${prefix}--checkbox-label`}
+            title={title}
+            onClick={(evt) => {
+              evt.stopPropagation();
+            }}>
+            <span className={`${prefix}--visually-hidden`}>
+              {deprecatedAriaLabel || ariaLabel}
+            </span>
+          </label>
+        }
+      </div>
+    );
+  }
+);
 
 InlineCheckbox.propTypes = {
   /**

diff --git a/packages/react/src/components/Layer/index.tsx b/packages/react/src/components/Layer/index.tsx
@@ -56,7 +56,7 @@ export interface LayerComponent {
 }
 
 const LayerRenderFunction = React.forwardRef(function Layer<
-  T extends React.ElementType
+  T extends React.ElementType,
 >(
   {
     as = 'div' as T,

diff --git a/packages/react/src/components/MultiSelect/FilterableMultiSelect.tsx b/packages/react/src/components/MultiSelect/FilterableMultiSelect.tsx
@@ -312,7 +312,7 @@ export interface FilterableMultiSelectProps<ItemType>
 }
 
 const FilterableMultiSelect = React.forwardRef(function FilterableMultiSelect<
-  ItemType
+  ItemType,
 >(
   {
     autoAlign = false,

diff --git a/packages/react/src/components/Search/Search.tsx b/packages/react/src/components/Search/Search.tsx
@@ -240,8 +240,8 @@ const Search = React.forwardRef<HTMLInputElement, SearchProps>(function Search(
           onExpand && isExpanded
             ? true
             : onExpand && !isExpanded
-            ? false
-            : undefined
+              ? false
+              : undefined
         }
         aria-controls={onExpand ? uniqueId : undefined}>
         <CustomSearchIcon icon={renderIcon} />

diff --git a/packages/react/src/components/Slider/Slider.tsx b/packages/react/src/components/Slider/Slider.tsx
@@ -1606,8 +1606,8 @@ class Slider extends PureComponent<SliderProps> {
                       twoHandles
                         ? ariaLabelInputUpper
                         : ariaLabelInput
-                        ? ariaLabelInput
-                        : undefined
+                          ? ariaLabelInput
+                          : undefined
                     }
                     disabled={disabled}
                     required={required}

diff --git a/packages/react/src/components/Stack/Stack.tsx b/packages/react/src/components/Stack/Stack.tsx
@@ -71,36 +71,35 @@ export interface StackProps extends React.HTMLAttributes<HTMLElement> {
  * - https://paste.twilio.design/layout/stack/
  * - https://github.com/Workday/canvas-kit/blob/f2f599654876700f483a1d8c5de82a41315c76f1/modules/labs-react/layout/lib/Stack.tsx
  */
-const Stack = React.forwardRef<React.ReactNode, StackProps>(function Stack(
-  props,
-  ref
-) {
-  const {
-    as: BaseComponent = 'div',
-    children,
-    className: customClassName,
-    gap,
-    orientation = 'vertical',
-    ...rest
-  } = props;
-  const prefix = usePrefix();
-  const className = cx(customClassName, {
-    [`${prefix}--stack-${orientation}`]: true,
-    [`${prefix}--stack-scale-${gap}`]: typeof gap === 'number',
-  });
-  const style = {};
-
-  if (typeof gap === 'string') {
-    style[`--${prefix}-stack-gap`] = gap;
+const Stack = React.forwardRef<React.ReactNode, StackProps>(
+  function Stack(props, ref) {
+    const {
+      as: BaseComponent = 'div',
+      children,
+      className: customClassName,
+      gap,
+      orientation = 'vertical',
+      ...rest
+    } = props;
+    const prefix = usePrefix();
+    const className = cx(customClassName, {
+      [`${prefix}--stack-${orientation}`]: true,
+      [`${prefix}--stack-scale-${gap}`]: typeof gap === 'number',
+    });
+    const style = {};
+
+    if (typeof gap === 'string') {
+      style[`--${prefix}-stack-gap`] = gap;
+    }
+
+    return (
+      // eslint-disable-next-line react/forbid-component-props
+      <BaseComponent {...rest} ref={ref} className={className} style={style}>
+        {children}
+      </BaseComponent>
+    );
   }
-
-  return (
-    // eslint-disable-next-line react/forbid-component-props
-    <BaseComponent {...rest} ref={ref} className={className} style={style}>
-      {children}
-    </BaseComponent>
-  );
-});
+);
 
 Stack.propTypes = {
   /**

diff --git a/packages/react/src/components/Stack/VStack.tsx b/packages/react/src/components/Stack/VStack.tsx
@@ -9,11 +9,10 @@ import React from 'react';
 
 import { Stack, StackProps } from './Stack';
 
-const VStack = React.forwardRef<React.ReactNode, StackProps>(function VStack(
-  props,
-  ref
-) {
-  return <Stack {...props} ref={ref} orientation="vertical" />;
-});
+const VStack = React.forwardRef<React.ReactNode, StackProps>(
+  function VStack(props, ref) {
+    return <Stack {...props} ref={ref} orientation="vertical" />;
+  }
+);
 
 export { VStack };
diff --git a/packages/react/src/components/Toggletip/index.tsx b/packages/react/src/components/Toggletip/index.tsx
@@ -265,7 +265,7 @@ export type ToggleTipButtonProps<T extends React.ElementType> =
  * clicks and keyboard interactions.
  */
 export const ToggletipButton = React.forwardRef(function ToggletipButton<
-  T extends React.ElementType
+  T extends React.ElementType,
 >(
   {
     children,

diff --git a/packages/react/src/components/UIShell/SideNavLink.tsx b/packages/react/src/components/UIShell/SideNavLink.tsx
@@ -78,7 +78,7 @@ export interface SideNavLinkComponent {
 }
 
 const SideNavLink: SideNavLinkComponent = forwardRef(function SideNavLink<
-  E extends ElementType = 'a'
+  E extends ElementType = 'a',
 >(
   {
     children,