Function List

  • Parameters

    • props: Omit<
          Omit<
              Omit<
                  DetailedHTMLProps<HTMLAttributes<HTMLUListElement>, HTMLUListElement>,
                  "ref",
              > & {
                  ref?:
                      | null
                      | (instance: null | HTMLUListElement) => void
                      | RefObject<HTMLUListElement>;
              },
              "inset"
              | "css",
          > & TransformProps<{ inset?: boolean | "true" }, {}> & {
              css?: CSS<
                  {},
                  {
                      colors: {
                          activeBg: "#e7e7e7";
                          background: "white";
                          blue1: "#038bf4";
                          blue2: "#b7d6f5";
                          blue3: "#dbe6ff";
                          blue4: "#33b4ff";
                          blue5: "#30a2e6";
                          border: "#d5d5d5";
                          buttonBorder: "#bababa";
                          choiceActiveBg: "#f3f3f3";
                          choiceActiveText: "#313131";
                          choiceBg: "#ffffff";
                          choiceBorder: "#cfcfcf";
                          choiceText: "#999999";
                          focusColor: "#dcaf00";
                          green1: "#3ec234";
                          green1Darker: "#38af2f";
                          grey1: "#737373";
                          headerBg: "#efeff0";
                          headerBorder: "#c8c8c9";
                          headerText: "#484848";
                          icon: "#636363";
                          inactiveBg: "#d3d3de";
                          inactiveDarkBg: "#999";
                          inputDisabledBg: "#f3f3f3";
                          inputDisabledText: "#959595";
                          mainColor: "#008ad2";
                          mainColorAlt: "#006AA9";
                          modalBg: "#f7f7f7";
                          modalButtonBg: "#f8f8f8";
                          modalButtonBorder: "#c2c2c2";
                          orange1: "#ff7200";
                          orange1Darker: "#cc5b00";
                          pink1: "#ff388f";
                          pinky1: "#f5c0b7";
                          pinky2: "#e07b67";
                          pinky3: "#ffe1db";
                          popText: "#666";
                          purple1: "#7357e8";
                          red1: "#ea2700";
                          scrollbarsBg: "transparent";
                          scrollbarsThumb: "#737373";
                          selectorActive: "#008ad2";
                          selectorText: "#606060";
                          sub: "#959595";
                          tableStripedBg: "#fafafa";
                          text: "#323232";
                          text2: "#181818";
                          text3: "#000000";
                          toggleBgDisabled: "#f0f0f0";
                          toggleHandleBg: "#e0e0e0";
                          toggleHandleBgDisabled: "#deae84";
                          toggleHandleBorder: "#cdcdcd";
                          toggleHandleBorderDisabled: "#c29f7d";
                          toolbarBg: "#f8f8f8";
                          toolbarBorder: "#ababab";
                          toolButtonText: "#666e80";
                          yellow1: "#ffde9d";
                          yellow2: "#e4a429";
                          yellow3: "#fff5db";
                      };
                  },
                  DefaultThemeMap,
                  {
                      mx: (
                          value: string | number,
                      ) => { marginLeft: string | number; marginRight: string | number };
                      my: (
                          value: string | number,
                      ) => { marginBottom: string | number; marginTop: string | number };
                      px: (
                          value: string | number,
                      ) => { paddingLeft: string | number; paddingRight: string | number };
                      py: (
                          value: string | number,
                      ) => { paddingBottom: string | number; paddingTop: string | number };
                      size: (
                          value: string | number,
                      ) => { height: string | number; width: string | number };
                  },
              >;
          },
          "ref",
      > & RefAttributes<HTMLUListElement>

    Returns ReactNode

Properties

$$typeof: symbol
defaultProps?: Partial<
    Omit<
        Omit<
            Omit<
                DetailedHTMLProps<HTMLAttributes<HTMLUListElement>, HTMLUListElement>,
                "ref",
            > & {
                ref?:
                    | null
                    | (instance: (...) | (...)) => void
                    | RefObject<HTMLUListElement>;
            },
            "inset"
            | "css",
        > & TransformProps<{ inset?: boolean | "true" }, {}> & {
            css?: CSS<
                {},
                {
                    colors: {
                        activeBg: "#e7e7e7";
                        background: "white";
                        blue1: "#038bf4";
                        blue2: "#b7d6f5";
                        blue3: "#dbe6ff";
                        blue4: "#33b4ff";
                        blue5: "#30a2e6";
                        border: "#d5d5d5";
                        buttonBorder: "#bababa";
                        choiceActiveBg: "#f3f3f3";
                        choiceActiveText: "#313131";
                        choiceBg: "#ffffff";
                        choiceBorder: "#cfcfcf";
                        choiceText: "#999999";
                        focusColor: "#dcaf00";
                        green1: "#3ec234";
                        green1Darker: "#38af2f";
                        grey1: "#737373";
                        headerBg: "#efeff0";
                        headerBorder: "#c8c8c9";
                        headerText: "#484848";
                        icon: "#636363";
                        inactiveBg: "#d3d3de";
                        inactiveDarkBg: "#999";
                        inputDisabledBg: "#f3f3f3";
                        inputDisabledText: "#959595";
                        mainColor: "#008ad2";
                        mainColorAlt: "#006AA9";
                        modalBg: "#f7f7f7";
                        modalButtonBg: "#f8f8f8";
                        modalButtonBorder: "#c2c2c2";
                        orange1: "#ff7200";
                        orange1Darker: "#cc5b00";
                        pink1: "#ff388f";
                        pinky1: "#f5c0b7";
                        pinky2: "#e07b67";
                        pinky3: "#ffe1db";
                        popText: "#666";
                        purple1: "#7357e8";
                        red1: "#ea2700";
                        scrollbarsBg: "transparent";
                        scrollbarsThumb: "#737373";
                        selectorActive: "#008ad2";
                        selectorText: "#606060";
                        sub: "#959595";
                        tableStripedBg: "#fafafa";
                        text: "#323232";
                        text2: "#181818";
                        text3: "#000000";
                        toggleBgDisabled: "#f0f0f0";
                        toggleHandleBg: "#e0e0e0";
                        toggleHandleBgDisabled: "#deae84";
                        toggleHandleBorder: "#cdcdcd";
                        toggleHandleBorderDisabled: "#c29f7d";
                        toolbarBg: "#f8f8f8";
                        toolbarBorder: "#ababab";
                        toolButtonText: "#666e80";
                        yellow1: "#ffde9d";
                        yellow2: "#e4a429";
                        yellow3: "#fff5db";
                    };
                },
                DefaultThemeMap,
                {
                    mx: (value: (...) | (...)) => { marginLeft: ...; marginRight: ... };
                    my: (value: (...) | (...)) => { marginBottom: ...; marginTop: ... };
                    px: (value: (...) | (...)) => { paddingLeft: ...; paddingRight: ... };
                    py: (value: (...) | (...)) => { paddingBottom: ...; paddingTop: ... };
                    size: (value: (...) | (...)) => { height: ...; width: ... };
                },
            >;
        },
        "ref",
    > & RefAttributes<HTMLUListElement>,
>
displayName?: string

Used in debugging messages. You might want to set it explicitly if you want to display a different name for debugging purposes.

Header: ForwardRefExoticComponent<
    Omit<
        Omit<
            Omit<
                Omit<
                    Omit<(...), (...)> & TransformProps<(...), (...)> & { css?: ... } & Props,
                    "ref",
                > & RefAttributes<HTMLLIElement>,
                "ref",
            > & {
                ref?:
                    | null
                    | (instance: null | HTMLLIElement) => void
                    | RefObject<HTMLLIElement>;
            },
            "inset"
            | "css",
        > & TransformProps<{ inset?: boolean | "true" }, {}> & {
            css?: CSS<
                {},
                {
                    colors: {
                        activeBg: "#e7e7e7";
                        background: "white";
                        blue1: "#038bf4";
                        blue2: "#b7d6f5";
                        blue3: "#dbe6ff";
                        blue4: "#33b4ff";
                        blue5: "#30a2e6";
                        border: "#d5d5d5";
                        buttonBorder: "#bababa";
                        choiceActiveBg: "#f3f3f3";
                        choiceActiveText: "#313131";
                        choiceBg: "#ffffff";
                        choiceBorder: "#cfcfcf";
                        choiceText: "#999999";
                        focusColor: "#dcaf00";
                        green1: "#3ec234";
                        green1Darker: "#38af2f";
                        grey1: "#737373";
                        headerBg: "#efeff0";
                        headerBorder: "#c8c8c9";
                        headerText: "#484848";
                        icon: "#636363";
                        inactiveBg: "#d3d3de";
                        inactiveDarkBg: "#999";
                        inputDisabledBg: "#f3f3f3";
                        inputDisabledText: "#959595";
                        mainColor: "#008ad2";
                        mainColorAlt: "#006AA9";
                        modalBg: "#f7f7f7";
                        modalButtonBg: "#f8f8f8";
                        modalButtonBorder: "#c2c2c2";
                        orange1: "#ff7200";
                        orange1Darker: "#cc5b00";
                        pink1: "#ff388f";
                        pinky1: "#f5c0b7";
                        pinky2: "#e07b67";
                        pinky3: "#ffe1db";
                        popText: "#666";
                        purple1: "#7357e8";
                        red1: "#ea2700";
                        scrollbarsBg: "transparent";
                        scrollbarsThumb: "#737373";
                        selectorActive: "#008ad2";
                        selectorText: "#606060";
                        sub: "#959595";
                        tableStripedBg: "#fafafa";
                        text: "#323232";
                        text2: "#181818";
                        text3: "#000000";
                        toggleBgDisabled: "#f0f0f0";
                        toggleHandleBg: "#e0e0e0";
                        toggleHandleBgDisabled: "#deae84";
                        toggleHandleBorder: "#cdcdcd";
                        toggleHandleBorderDisabled: "#c29f7d";
                        toolbarBg: "#f8f8f8";
                        toolbarBorder: "#ababab";
                        toolButtonText: "#666e80";
                        yellow1: "#ffde9d";
                        yellow2: "#e4a429";
                        yellow3: "#fff5db";
                    };
                },
                DefaultThemeMap,
                {
                    mx: (
                        value: string | number,
                    ) => { marginLeft: (...) | (...); marginRight: (...) | (...) };
                    my: (
                        value: string | number,
                    ) => { marginBottom: (...) | (...); marginTop: (...) | (...) };
                    px: (
                        value: string | number,
                    ) => { paddingLeft: (...) | (...); paddingRight: (...) | (...) };
                    py: (
                        value: string | number,
                    ) => { paddingBottom: (...) | (...); paddingTop: (...) | (...) };
                    size: (
                        value: string | number,
                    ) => { height: (...) | (...); width: (...) | (...) };
                },
            >;
        } & TransformProps<{ inset?: boolean | "true" }, {}> & { as?: string },
        "ref",
    > & RefAttributes<HTMLLIElement>,
>
Item: ForwardRefExoticComponent<
    Omit<
        Omit<
            Omit<
                DetailedHTMLProps<LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>,
                "ref",
            > & {
                ref?:
                    | null
                    | (instance: (...) | (...)) => void
                    | RefObject<HTMLLIElement>;
            },
            "inset"
            | "css"
            | "selected",
        > & TransformProps<
            { inset?: boolean
            | "true"; selected?: boolean | "true" },
            {},
        > & {
            css?: CSS<
                {},
                {
                    colors: {
                        activeBg: "#e7e7e7";
                        background: "white";
                        blue1: "#038bf4";
                        blue2: "#b7d6f5";
                        blue3: "#dbe6ff";
                        blue4: "#33b4ff";
                        blue5: "#30a2e6";
                        border: "#d5d5d5";
                        buttonBorder: "#bababa";
                        choiceActiveBg: "#f3f3f3";
                        choiceActiveText: "#313131";
                        choiceBg: "#ffffff";
                        choiceBorder: "#cfcfcf";
                        choiceText: "#999999";
                        focusColor: "#dcaf00";
                        green1: "#3ec234";
                        green1Darker: "#38af2f";
                        grey1: "#737373";
                        headerBg: "#efeff0";
                        headerBorder: "#c8c8c9";
                        headerText: "#484848";
                        icon: "#636363";
                        inactiveBg: "#d3d3de";
                        inactiveDarkBg: "#999";
                        inputDisabledBg: "#f3f3f3";
                        inputDisabledText: "#959595";
                        mainColor: "#008ad2";
                        mainColorAlt: "#006AA9";
                        modalBg: "#f7f7f7";
                        modalButtonBg: "#f8f8f8";
                        modalButtonBorder: "#c2c2c2";
                        orange1: "#ff7200";
                        orange1Darker: "#cc5b00";
                        pink1: "#ff388f";
                        pinky1: "#f5c0b7";
                        pinky2: "#e07b67";
                        pinky3: "#ffe1db";
                        popText: "#666";
                        purple1: "#7357e8";
                        red1: "#ea2700";
                        scrollbarsBg: "transparent";
                        scrollbarsThumb: "#737373";
                        selectorActive: "#008ad2";
                        selectorText: "#606060";
                        sub: "#959595";
                        tableStripedBg: "#fafafa";
                        text: "#323232";
                        text2: "#181818";
                        text3: "#000000";
                        toggleBgDisabled: "#f0f0f0";
                        toggleHandleBg: "#e0e0e0";
                        toggleHandleBgDisabled: "#deae84";
                        toggleHandleBorder: "#cdcdcd";
                        toggleHandleBorderDisabled: "#c29f7d";
                        toolbarBg: "#f8f8f8";
                        toolbarBorder: "#ababab";
                        toolButtonText: "#666e80";
                        yellow1: "#ffde9d";
                        yellow2: "#e4a429";
                        yellow3: "#fff5db";
                    };
                },
                DefaultThemeMap,
                {
                    mx: (value: (...) | (...)) => { marginLeft: ...; marginRight: ... };
                    my: (value: (...) | (...)) => { marginBottom: ...; marginTop: ... };
                    px: (value: (...) | (...)) => { paddingLeft: ...; paddingRight: ... };
                    py: (value: (...) | (...)) => { paddingBottom: ...; paddingTop: ... };
                    size: (value: (...) | (...)) => { height: ...; width: ... };
                },
            >;
        } & Props,
        "ref",
    > & RefAttributes<HTMLLIElement>,
> & {
    Label: FC<
        Omit<
            Omit<
                DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>,
                "ref",
            > & {
                ref?:
                    | null
                    | (instance: null | HTMLDivElement) => void
                    | RefObject<HTMLDivElement>;
            },
            "css",
        > & TransformProps<{}, {}> & {
            css?: CSS<
                {},
                {
                    colors: {
                        activeBg: "#e7e7e7";
                        background: "white";
                        blue1: "#038bf4";
                        blue2: "#b7d6f5";
                        blue3: "#dbe6ff";
                        blue4: "#33b4ff";
                        blue5: "#30a2e6";
                        border: "#d5d5d5";
                        buttonBorder: "#bababa";
                        choiceActiveBg: "#f3f3f3";
                        choiceActiveText: "#313131";
                        choiceBg: "#ffffff";
                        choiceBorder: "#cfcfcf";
                        choiceText: "#999999";
                        focusColor: "#dcaf00";
                        green1: "#3ec234";
                        green1Darker: "#38af2f";
                        grey1: "#737373";
                        headerBg: "#efeff0";
                        headerBorder: "#c8c8c9";
                        headerText: "#484848";
                        icon: "#636363";
                        inactiveBg: "#d3d3de";
                        inactiveDarkBg: "#999";
                        inputDisabledBg: "#f3f3f3";
                        inputDisabledText: "#959595";
                        mainColor: "#008ad2";
                        mainColorAlt: "#006AA9";
                        modalBg: "#f7f7f7";
                        modalButtonBg: "#f8f8f8";
                        modalButtonBorder: "#c2c2c2";
                        orange1: "#ff7200";
                        orange1Darker: "#cc5b00";
                        pink1: "#ff388f";
                        pinky1: "#f5c0b7";
                        pinky2: "#e07b67";
                        pinky3: "#ffe1db";
                        popText: "#666";
                        purple1: "#7357e8";
                        red1: "#ea2700";
                        scrollbarsBg: "transparent";
                        scrollbarsThumb: "#737373";
                        selectorActive: "#008ad2";
                        selectorText: "#606060";
                        sub: "#959595";
                        tableStripedBg: "#fafafa";
                        text: "#323232";
                        text2: "#181818";
                        text3: "#000000";
                        toggleBgDisabled: "#f0f0f0";
                        toggleHandleBg: "#e0e0e0";
                        toggleHandleBgDisabled: "#deae84";
                        toggleHandleBorder: "#cdcdcd";
                        toggleHandleBorderDisabled: "#c29f7d";
                        toolbarBg: "#f8f8f8";
                        toolbarBorder: "#ababab";
                        toolButtonText: "#666e80";
                        yellow1: "#ffde9d";
                        yellow2: "#e4a429";
                        yellow3: "#fff5db";
                    };
                },
                DefaultThemeMap,
                {
                    mx: (
                        value: string | number,
                    ) => { marginLeft: (...) | (...); marginRight: (...) | (...) };
                    my: (
                        value: string | number,
                    ) => { marginBottom: (...) | (...); marginTop: (...) | (...) };
                    px: (
                        value: string | number,
                    ) => { paddingLeft: (...) | (...); paddingRight: (...) | (...) };
                    py: (
                        value: string | number,
                    ) => { paddingBottom: (...) | (...); paddingTop: (...) | (...) };
                    size: (
                        value: string | number,
                    ) => { height: (...) | (...); width: (...) | (...) };
                },
            >;
        } & { sub?: ReactNode },
    >;
    Value: StyledComponent<
        "div",
        CSS<
            {},
            {
                colors: {
                    activeBg: "#e7e7e7";
                    background: "white";
                    blue1: "#038bf4";
                    blue2: "#b7d6f5";
                    blue3: "#dbe6ff";
                    blue4: "#33b4ff";
                    blue5: "#30a2e6";
                    border: "#d5d5d5";
                    buttonBorder: "#bababa";
                    choiceActiveBg: "#f3f3f3";
                    choiceActiveText: "#313131";
                    choiceBg: "#ffffff";
                    choiceBorder: "#cfcfcf";
                    choiceText: "#999999";
                    focusColor: "#dcaf00";
                    green1: "#3ec234";
                    green1Darker: "#38af2f";
                    grey1: "#737373";
                    headerBg: "#efeff0";
                    headerBorder: "#c8c8c9";
                    headerText: "#484848";
                    icon: "#636363";
                    inactiveBg: "#d3d3de";
                    inactiveDarkBg: "#999";
                    inputDisabledBg: "#f3f3f3";
                    inputDisabledText: "#959595";
                    mainColor: "#008ad2";
                    mainColorAlt: "#006AA9";
                    modalBg: "#f7f7f7";
                    modalButtonBg: "#f8f8f8";
                    modalButtonBorder: "#c2c2c2";
                    orange1: "#ff7200";
                    orange1Darker: "#cc5b00";
                    pink1: "#ff388f";
                    pinky1: "#f5c0b7";
                    pinky2: "#e07b67";
                    pinky3: "#ffe1db";
                    popText: "#666";
                    purple1: "#7357e8";
                    red1: "#ea2700";
                    scrollbarsBg: "transparent";
                    scrollbarsThumb: "#737373";
                    selectorActive: "#008ad2";
                    selectorText: "#606060";
                    sub: "#959595";
                    tableStripedBg: "#fafafa";
                    text: "#323232";
                    text2: "#181818";
                    text3: "#000000";
                    toggleBgDisabled: "#f0f0f0";
                    toggleHandleBg: "#e0e0e0";
                    toggleHandleBgDisabled: "#deae84";
                    toggleHandleBorder: "#cdcdcd";
                    toggleHandleBorderDisabled: "#c29f7d";
                    toolbarBg: "#f8f8f8";
                    toolbarBorder: "#ababab";
                    toolButtonText: "#666e80";
                    yellow1: "#ffde9d";
                    yellow2: "#e4a429";
                    yellow3: "#fff5db";
                };
            },
            DefaultThemeMap,
            {
                mx: (
                    value: string | number,
                ) => { marginLeft: string | number; marginRight: string | number };
                my: (
                    value: string | number,
                ) => { marginBottom: string | number; marginTop: string | number };
                px: (
                    value: string | number,
                ) => { paddingLeft: string | number; paddingRight: string | number };
                py: (
                    value: string | number,
                ) => { paddingBottom: string | number; paddingTop: string | number };
                size: (
                    value: string | number,
                ) => { height: string | number; width: string | number };
            },
        >,
    >;
}
propTypes?: WeakValidationMap<
    Omit<
        Omit<
            Omit<
                DetailedHTMLProps<HTMLAttributes<HTMLUListElement>, HTMLUListElement>,
                "ref",
            > & {
                ref?:
                    | null
                    | (instance: (...) | (...)) => void
                    | RefObject<HTMLUListElement>;
            },
            "inset"
            | "css",
        > & TransformProps<{ inset?: boolean | "true" }, {}> & {
            css?: CSS<
                {},
                {
                    colors: {
                        activeBg: "#e7e7e7";
                        background: "white";
                        blue1: "#038bf4";
                        blue2: "#b7d6f5";
                        blue3: "#dbe6ff";
                        blue4: "#33b4ff";
                        blue5: "#30a2e6";
                        border: "#d5d5d5";
                        buttonBorder: "#bababa";
                        choiceActiveBg: "#f3f3f3";
                        choiceActiveText: "#313131";
                        choiceBg: "#ffffff";
                        choiceBorder: "#cfcfcf";
                        choiceText: "#999999";
                        focusColor: "#dcaf00";
                        green1: "#3ec234";
                        green1Darker: "#38af2f";
                        grey1: "#737373";
                        headerBg: "#efeff0";
                        headerBorder: "#c8c8c9";
                        headerText: "#484848";
                        icon: "#636363";
                        inactiveBg: "#d3d3de";
                        inactiveDarkBg: "#999";
                        inputDisabledBg: "#f3f3f3";
                        inputDisabledText: "#959595";
                        mainColor: "#008ad2";
                        mainColorAlt: "#006AA9";
                        modalBg: "#f7f7f7";
                        modalButtonBg: "#f8f8f8";
                        modalButtonBorder: "#c2c2c2";
                        orange1: "#ff7200";
                        orange1Darker: "#cc5b00";
                        pink1: "#ff388f";
                        pinky1: "#f5c0b7";
                        pinky2: "#e07b67";
                        pinky3: "#ffe1db";
                        popText: "#666";
                        purple1: "#7357e8";
                        red1: "#ea2700";
                        scrollbarsBg: "transparent";
                        scrollbarsThumb: "#737373";
                        selectorActive: "#008ad2";
                        selectorText: "#606060";
                        sub: "#959595";
                        tableStripedBg: "#fafafa";
                        text: "#323232";
                        text2: "#181818";
                        text3: "#000000";
                        toggleBgDisabled: "#f0f0f0";
                        toggleHandleBg: "#e0e0e0";
                        toggleHandleBgDisabled: "#deae84";
                        toggleHandleBorder: "#cdcdcd";
                        toggleHandleBorderDisabled: "#c29f7d";
                        toolbarBg: "#f8f8f8";
                        toolbarBorder: "#ababab";
                        toolButtonText: "#666e80";
                        yellow1: "#ffde9d";
                        yellow2: "#e4a429";
                        yellow3: "#fff5db";
                    };
                },
                DefaultThemeMap,
                {
                    mx: (value: (...) | (...)) => { marginLeft: ...; marginRight: ... };
                    my: (value: (...) | (...)) => { marginBottom: ...; marginTop: ... };
                    px: (value: (...) | (...)) => { paddingLeft: ...; paddingRight: ... };
                    py: (value: (...) | (...)) => { paddingBottom: ...; paddingTop: ... };
                    size: (value: (...) | (...)) => { height: ...; width: ... };
                },
            >;
        },
        "ref",
    > & RefAttributes<HTMLUListElement>,
>