Function Label

  • Label(
        props: Partial<
            Pick<
                Omit<
                    Omit<
                        DetailedHTMLProps<
                            LabelHTMLAttributes<HTMLLabelElement>,
                            HTMLLabelElement,
                        >,
                        "ref",
                    > & {
                        ref?:
                            | null
                            | (instance: null | HTMLLabelElement) => void
                            | RefObject<HTMLLabelElement>;
                    },
                    "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: (...) | (...) };
                        },
                    >;
                },
                "className"
                | "css",
            >,
        > & { children: ReactNode; label?: ReactNode; variant?: "big" } & RefAttributes<
            HTMLLabelElement,
        >,
    ): ReactNode

  • Parameters

    • props: Partial<
          Pick<
              Omit<
                  Omit<
                      DetailedHTMLProps<
                          LabelHTMLAttributes<HTMLLabelElement>,
                          HTMLLabelElement,
                      >,
                      "ref",
                  > & {
                      ref?:
                          | null
                          | (instance: null | HTMLLabelElement) => void
                          | RefObject<HTMLLabelElement>;
                  },
                  "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: (...) | (...) };
                      },
                  >;
              },
              "className"
              | "css",
          >,
      > & { children: ReactNode; label?: ReactNode; variant?: "big" } & RefAttributes<
          HTMLLabelElement,
      >

    Returns ReactNode

Properties

$$typeof defaultProps? displayName? propTypes?

Properties

Readonly$$typeof

$$typeof: symbol

OptionaldefaultProps

defaultProps?: Partial<
    Partial<
        Pick<
            Omit<
                Omit<
                    DetailedHTMLProps<LabelHTMLAttributes<(...)>, HTMLLabelElement>,
                    "ref",
                > & { ref?: null | (instance: ...) => ... | RefObject<(...)> },
                "css",
            > & TransformProps<{}, {}> & {
                css?: CSS<
                    {},
                    {
                        colors: {
                            activeBg: ...;
                            background: ...;
                            blue1: ...;
                            blue2: ...;
                            blue3: ...;
                            blue4: ...;
                            blue5: ...;
                            border: ...;
                            buttonBorder: ...;
                            choiceActiveBg: ...;
                            choiceActiveText: ...;
                            choiceBg: ...;
                            choiceBorder: ...;
                            choiceText: ...;
                            focusColor: ...;
                            green1: ...;
                            green1Darker: ...;
                            grey1: ...;
                            headerBg: ...;
                            headerBorder: ...;
                            headerText: ...;
                            icon: ...;
                            inactiveBg: ...;
                            inactiveDarkBg: ...;
                            inputDisabledBg: ...;
                            inputDisabledText: ...;
                            mainColor: ...;
                            mainColorAlt: ...;
                            modalBg: ...;
                            modalButtonBg: ...;
                            modalButtonBorder: ...;
                            orange1: ...;
                            orange1Darker: ...;
                            pink1: ...;
                            pinky1: ...;
                            pinky2: ...;
                            pinky3: ...;
                            popText: ...;
                            purple1: ...;
                            red1: ...;
                            scrollbarsBg: ...;
                            scrollbarsThumb: ...;
                            selectorActive: ...;
                            selectorText: ...;
                            sub: ...;
                            tableStripedBg: ...;
                            text: ...;
                            text2: ...;
                            text3: ...;
                            toggleBgDisabled: ...;
                            toggleHandleBg: ...;
                            toggleHandleBgDisabled: ...;
                            toggleHandleBorder: ...;
                            toggleHandleBorderDisabled: ...;
                            toolbarBg: ...;
                            toolbarBorder: ...;
                            toolButtonText: ...;
                            yellow1: ...;
                            yellow2: ...;
                            yellow3: ...;
                        };
                    },
                    DefaultThemeMap,
                    {
                        mx: (value: ...) => ...;
                        my: (value: ...) => ...;
                        px: (value: ...) => ...;
                        py: (value: ...) => ...;
                        size: (value: ...) => ...;
                    },
                >;
            },
            "className"
            | "css",
        >,
    > & { children: ReactNode; label?: ReactNode; variant?: "big" } & RefAttributes<
        HTMLLabelElement,
    >,
>

Deprecated

Use values for destructuring assignments instead.

OptionaldisplayName

displayName?: string

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

See

Legacy React Docs

OptionalpropTypes

propTypes?: WeakValidationMap<
    Partial<
        Pick<
            Omit<
                Omit<
                    DetailedHTMLProps<LabelHTMLAttributes<(...)>, HTMLLabelElement>,
                    "ref",
                > & { ref?: null | (instance: ...) => ... | RefObject<(...)> },
                "css",
            > & TransformProps<{}, {}> & {
                css?: CSS<
                    {},
                    {
                        colors: {
                            activeBg: ...;
                            background: ...;
                            blue1: ...;
                            blue2: ...;
                            blue3: ...;
                            blue4: ...;
                            blue5: ...;
                            border: ...;
                            buttonBorder: ...;
                            choiceActiveBg: ...;
                            choiceActiveText: ...;
                            choiceBg: ...;
                            choiceBorder: ...;
                            choiceText: ...;
                            focusColor: ...;
                            green1: ...;
                            green1Darker: ...;
                            grey1: ...;
                            headerBg: ...;
                            headerBorder: ...;
                            headerText: ...;
                            icon: ...;
                            inactiveBg: ...;
                            inactiveDarkBg: ...;
                            inputDisabledBg: ...;
                            inputDisabledText: ...;
                            mainColor: ...;
                            mainColorAlt: ...;
                            modalBg: ...;
                            modalButtonBg: ...;
                            modalButtonBorder: ...;
                            orange1: ...;
                            orange1Darker: ...;
                            pink1: ...;
                            pinky1: ...;
                            pinky2: ...;
                            pinky3: ...;
                            popText: ...;
                            purple1: ...;
                            red1: ...;
                            scrollbarsBg: ...;
                            scrollbarsThumb: ...;
                            selectorActive: ...;
                            selectorText: ...;
                            sub: ...;
                            tableStripedBg: ...;
                            text: ...;
                            text2: ...;
                            text3: ...;
                            toggleBgDisabled: ...;
                            toggleHandleBg: ...;
                            toggleHandleBgDisabled: ...;
                            toggleHandleBorder: ...;
                            toggleHandleBorderDisabled: ...;
                            toolbarBg: ...;
                            toolbarBorder: ...;
                            toolButtonText: ...;
                            yellow1: ...;
                            yellow2: ...;
                            yellow3: ...;
                        };
                    },
                    DefaultThemeMap,
                    {
                        mx: (value: ...) => ...;
                        my: (value: ...) => ...;
                        px: (value: ...) => ...;
                        py: (value: ...) => ...;
                        size: (value: ...) => ...;
                    },
                >;
            },
            "className"
            | "css",
        >,
    > & { children: ReactNode; label?: ReactNode; variant?: "big" } & RefAttributes<
        HTMLLabelElement,
    >,
>

Settings

Member Visibility

On This Page

Properties