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鈥檒l occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix Form.Check.Label spacing #5983

Merged
merged 9 commits into from Nov 29, 2021

Commits on Oct 22, 2021

  1. Fix Form.Check.Label spacing

    Currently, when using a `Form.Check.Label` component to customize
    `Form.Check` rendering, there will be no space between the checkbox and
    the label. This is because `Form.Check` is currently relying on the
    presence of a `label` prop to apply the `form-check` class name to the
    wrapping `<div>`, because checkboxes without labels [don't need the
    wrapping element to have the `form-check` class name][1].
    
    This commit adds a utility to check whether an element has a child of a
    certain type. It then uses that utility to check if a `Form.Check`
    element has a `Form.Check.Label` child and takes that into account when
    determining whether the checkbox has a label.
    
    Adding a special property (currently called `typeName`, but that can
    certainly change) to components for this utility is necessary because
    React minifies the `displayName` property in production.
    
    [1]: react-bootstrap#5938 (comment)
    TyMick committed Oct 22, 2021
    Configuration menu
    Copy the full SHA
    156b16e View commit details
    Browse the repository at this point in the history
  2. Configuration menu
    Copy the full SHA
    4085009 View commit details
    Browse the repository at this point in the history
  3. Support mixing auto and custom child components

    Currently, `Form.Check` doesn't allow users to use a custom
    `Form.Check.Input` with a label generated by the `label` prop (and
    requires that a custom `Form.Check.Input` be used if a custom
    `Form.Check.Label` is also used) because the presence of _any_ children
    in `Form.Check` prevents automatic inputs and labels (and feedback) from
    generating. This approach allows mixing and matching by extracting any
    custom input, label, and feedback components from `Form.Check`'s
    `children` prop, then separately for each, using the custom component if
    provided or an automatic component otherwise.
    TyMick committed Oct 22, 2021
    Configuration menu
    Copy the full SHA
    3b7a225 View commit details
    Browse the repository at this point in the history

Commits on Oct 23, 2021

  1. Simply check child.type

    The `type` property of React elements have reference equality with
    matching imported component variables (`JSXElementConstructor` objects,
    to be precise)! For some reason I was not expecting that, but it makes
    sense to me now, since these constructor objects are being imported from
    a singular source, so there's no reason React would create multiple
    instances of them. So `child.type === type` all we need to check in
    `getChildOfType`; the `typeName` prop I added earlier is not at all
    needed.
    TyMick committed Oct 23, 2021
    Configuration menu
    Copy the full SHA
    c86d65d View commit details
    Browse the repository at this point in the history
  2. Add scripts for testing production build of docs

    Just as a convenience. I can revert this commit if these scripts aren't
    desired.
    TyMick committed Oct 23, 2021
    Configuration menu
    Copy the full SHA
    5343b0a View commit details
    Browse the repository at this point in the history

Commits on Nov 6, 2021

  1. Configuration menu
    Copy the full SHA
    0754b49 View commit details
    Browse the repository at this point in the history

Commits on Nov 9, 2021

  1. Use correct variable

    TyMick committed Nov 9, 2021
    Configuration menu
    Copy the full SHA
    f0d8e9f View commit details
    Browse the repository at this point in the history

Commits on Nov 29, 2021

  1. Revert empty .husky/pre-commit change

    No idea how that got into 0754b49.
    TyMick committed Nov 29, 2021
    Configuration menu
    Copy the full SHA
    101e286 View commit details
    Browse the repository at this point in the history
  2. Revert "Add scripts for testing production build of docs"

    This reverts commit 5343b0a.
    TyMick committed Nov 29, 2021
    Configuration menu
    Copy the full SHA
    1d85fb3 View commit details
    Browse the repository at this point in the history