Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Form.Label prop typings is missing xs, sm, md, lg, xl properties #3481

Closed
codeandcats opened this issue Feb 18, 2019 · 7 comments
Labels

Comments

@codeandcats
Copy link

@codeandcats codeandcats commented Feb 18, 2019

One cannot specify xs, sm, md, lg, or xl properties on Form.Label like in this example.

  <Form.Group as={Row} controlId="formPlaintextEmail">
    <Form.Label column sm="2">
      Email
    </Form.Label>
    <Col sm="10">
      <Form.Control plaintext readOnly defaultValue="email@example.com" />
    </Col>
  </Form.Group>

This is because they are missing from the typings in FormLabel.d.ts, which was clearly copied from Feedback.d.ts.

import * as React from 'react';

import { BsPrefixComponent } from './helpers';

interface FeedbackProps {
  htmlFor?: string;
  column?: boolean;
  innerRef?: React.LegacyRef<this>;
  srOnly?: boolean;
}

declare class Feedback extends BsPrefixComponent<'label', FeedbackProps> {}

export default Feedback;
@jquense

This comment has been minimized.

Copy link
Member

@jquense jquense commented Feb 18, 2019

Happy to take a PR for this!

@codeandcats

This comment has been minimized.

Copy link
Author

@codeandcats codeandcats commented Feb 18, 2019

@jquense Thanks. I need this soon so will gladly review it. Also happy to take it on myself if you cannot dedicate time to it immediately.

@jquense

This comment has been minimized.

Copy link
Member

@jquense jquense commented Feb 18, 2019

. Also happy to take it on myself i

Ya that's what i was suggesting :) I don't know when i'd get to it

@codeandcats

This comment has been minimized.

Copy link
Author

@codeandcats codeandcats commented Feb 18, 2019

Oh sorry I misread your comment. 🤗

Actually I realised I can probably use
<Col sm={2} as={Form.Label>...</Col>.

I’m not sure yet as I’m upgrading a 2 yr old project and working my way through all the breaking changes.

Seems like there might be 2 ways to make a label behave like a column. Should we remove one?

@moyuanhuang

This comment has been minimized.

Copy link

@moyuanhuang moyuanhuang commented Feb 25, 2019

@codeandcats Thanks that works! I noticed that you'd also have to explicitly add the className="col-form-label" prop, otherwise the label wouldn't have nice paddings.

@codeandcats

This comment has been minimized.

Copy link
Author

@codeandcats codeandcats commented Feb 25, 2019

@moyuanhuang thanks good catch re col-form-label

dalevfenton added a commit to dalevfenton/react-bootstrap that referenced this issue May 1, 2019
@dalevfenton

This comment has been minimized.

Copy link
Contributor

@dalevfenton dalevfenton commented May 1, 2019

@jquense I'm not sure how you guys prefer to maintain the typings, but I submitted a PR that pulls in the Column size props to the types for Form.Label

@jquense jquense closed this in cdb7b6b May 21, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
5 participants
You can’t perform that action at this time.