# All files / src/form nativeSelectStyles.ts

0% Statements 0/56
0% Branches 0/1
0% Functions 0/1
0% Lines 0/56

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
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57

     import { cnb } from "cnbuilder";
    import { bem } from "../utils/bem.js";

    const styles = bem("rmd-native-select");
    const containerStyles = bem("rmd-native-select-container");

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

      /**
       * Set to `true` if using a custom icon instead of the default `<select>`
       * appearance.
       *
       * @defaultValue `false`
       */
      icon?: boolean;
    }

    /** @remarks \@since 6.0.0 */
    export function nativeSelect(
      options: NativeSelectClassNameOptions = {}
    ): string {
      const { className, icon = false } = options;

      return cnb(styles({ icon }), className);
    }

    /**
     * @remarks \@since 6.0.0
     */
    export interface NativeSelectContainerClassNameOptions {
      className?: string;
      label?: boolean;
      multiple?: boolean;
      underlined?: boolean;
    }

    /**
     * @remarks \@since 6.0.0
     */
    export function nativeSelectContainer(
      options: NativeSelectContainerClassNameOptions = {}
    ): string {
      const { className, label, multiple, underlined } = options;

      return cnb(
        containerStyles({
          multi: multiple,
          padded: label && multiple && !underlined,
          underline: multiple && underlined,
          "underline-padded": label && multiple && underlined,
        }),
        className
      );
    }