# All files / src/segmented-button segmentedButtonStyles.ts

100% Statements 40/40
100% Branches 2/2
100% Functions 1/1
100% Lines 40/40

Press n or j to go to the next uncovered block, b, p or k for the previous block.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    411x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    7x
    7x
    7x
    7x
    7x
    7x
    7x
    7x
    7x
    7x
    7x
    7x
     import { cnb } from "cnbuilder";
    import { cssUtils } from "../cssUtils.js";
    import { bem } from "../utils/bem.js";

    const styles = bem("rmd-segmented-button");

    /**
     * @remarks \@since 6.0.0
     */
    export interface SegmentedButtonClassNameOptions {
      className?: string;

      /** @defaultValue `false` */
      selected?: boolean;

      /**
       * An optional className to apply when {@link selected} is `true`
       */
      selectedClassName?: string;

      /** @internal */
      pressedClassName?: string;
    }

    /**
     * @remarks \@since 6.0.0
     */
    export function segmentedButton(
      options: SegmentedButtonClassNameOptions = {}
    ): string {
      const { className, selected, selectedClassName, pressedClassName } = options;

      return cnb(
        styles({ selected }),
        selected && selectedClassName,
        pressedClassName,
        cssUtils({ surface: true }),
        className
      );
    }