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

[Emotion] Convert EuiCheckbox, EuiRadio, and EuiSwitch #7969

Merged
merged 23 commits into from
Aug 19, 2024

Commits on Aug 18, 2024

  1. Convert form style variables to its own utility function

    - doesn't need to live in the main form vars fn, these variables are very specific to these components
    
    - simplify `customControlDisabledIconColor` to just darkShade - it's close enough and doesn't require extra computation
    cee-chen committed Aug 18, 2024
    Configuration menu
    Copy the full SHA
    701ba82 View commit details
    Browse the repository at this point in the history
  2. Replace @mixin euiIconBackground inline CSS SVGs with <EuiIcon />

    - more future proof for icon changes and generally less CSS
    
    - extra DOM is worth it, IMO
    cee-chen committed Aug 18, 2024
    Configuration menu
    Copy the full SHA
    c4e6bc8 View commit details
    Browse the repository at this point in the history
  3. Convert custom control mixins/styles

    - remove old Emotion mixin, I'm makin' my own
    
    - note the different DOM rendering - now that we have `:has` CSS, we don't need to rely on flat `+` selectors
    
    - prefer flex for center alignment over absolute positioning
    cee-chen committed Aug 18, 2024
    Configuration menu
    Copy the full SHA
    e676ad9 View commit details
    Browse the repository at this point in the history
  4. Remove unnecessary euiCustomControl usage in EuiRange

    - literally just needs `border-radius: 50%` instead
    cee-chen committed Aug 18, 2024
    Configuration menu
    Copy the full SHA
    6ff66df View commit details
    Browse the repository at this point in the history
  5. [EuiRadio] Convert to use new form util

    + inline conditional label
    
    - remove `--noLabel` modifier (replaced with `:has` CSS)
    cee-chen committed Aug 18, 2024
    Configuration menu
    Copy the full SHA
    c716b95 View commit details
    Browse the repository at this point in the history
  6. [EuiCheckbox] Convert base styles

    - inline conditional label, remove need for useMemo
    
    - inline the border-radius, it's only used here and doesn't need to be a shared var (it technically already is one)
    cee-chen committed Aug 18, 2024
    Configuration menu
    Copy the full SHA
    7974fc0 View commit details
    Browse the repository at this point in the history
  7. [EuiCheckbox] Convert readOnly styles

    + misc cleanup while here - fragment syntax, test syntax
    cee-chen committed Aug 18, 2024
    Configuration menu
    Copy the full SHA
    a64bbf4 View commit details
    Browse the repository at this point in the history
  8. Update downstream snapshots

    cee-chen committed Aug 18, 2024
    Configuration menu
    Copy the full SHA
    7dd90d8 View commit details
    Browse the repository at this point in the history
  9. [EuiSwitch] Set up style variables + mini size

    - a lot of colors are being simplified and slightly tweaked here to reduce transparency as well as one-off tinting/shading
    
    - remove Sass vars
    cee-chen committed Aug 18, 2024
    Configuration menu
    Copy the full SHA
    f25d657 View commit details
    Browse the repository at this point in the history
  10. [EuiSwitch] Convert wrapper/label styles

    - remove unnecessary min-height
    cee-chen committed Aug 18, 2024
    Configuration menu
    Copy the full SHA
    75b586e View commit details
    Browse the repository at this point in the history
  11. Configuration menu
    Copy the full SHA
    02ce820 View commit details
    Browse the repository at this point in the history
  12. [opinionated] extra disabled light mode tweaking

    - not sure if this is worth it, may revert
    cee-chen committed Aug 18, 2024
    Configuration menu
    Copy the full SHA
    20ee48a View commit details
    Browse the repository at this point in the history
  13. [EuiSwitch] Convert thumb styles

    - move thumb to outside body since it has `overflow: hidden` and we want thumbs to be able to scale outside
    
    - use `aspect-ratio` CSS instead of static width/height that changes (instead inherits from the button which is already sized)
    
    - simplify `-1px` shenanigans by reducing transforms by default, store in thumbScales var
    + tweak hover/active states accordingly and DRY out a util for it
    cee-chen committed Aug 18, 2024
    Configuration menu
    Copy the full SHA
    eaea656 View commit details
    Browse the repository at this point in the history
  14. Configuration menu
    Copy the full SHA
    db328c0 View commit details
    Browse the repository at this point in the history
  15. [EuiSwitch] Convert check/cross icon styles

    - simplify DOM
    - rename `__track` to `__icons`, feels more accurate
    
    - prefer flex and padding to center/position icons instead of positioning
    
    - no need for border-radius, `__body` already has it set + overflow hidden
    cee-chen committed Aug 18, 2024
    Configuration menu
    Copy the full SHA
    2fb2811 View commit details
    Browse the repository at this point in the history
  16. [EuiSwitch] Update snapshots & screenshots

    + update VRT to be more useful for permutation testing
    cee-chen committed Aug 18, 2024
    Configuration menu
    Copy the full SHA
    1aa72ab View commit details
    Browse the repository at this point in the history

Commits on Aug 19, 2024

  1. [EuiSwitch] Update downstream snapshots/usages

    + fix broken EuiDataGrid drag/drop behavior - we can't use the scroll shadow transform Z workaround and drag/drop at the same time 🫠
    cee-chen committed Aug 19, 2024
    Configuration menu
    Copy the full SHA
    3df9000 View commit details
    Browse the repository at this point in the history
  2. Delete Sass files

    cee-chen committed Aug 19, 2024
    Configuration menu
    Copy the full SHA
    c48491f View commit details
    Browse the repository at this point in the history
  3. [TEMP] Comment out Sass var usage

    - will no longer be a thing once the EuiFormRow PR merges, drop this commit then
    cee-chen committed Aug 19, 2024
    Configuration menu
    Copy the full SHA
    3d407a7 View commit details
    Browse the repository at this point in the history
  4. changelog

    cee-chen committed Aug 19, 2024
    Configuration menu
    Copy the full SHA
    0795d3e View commit details
    Browse the repository at this point in the history
  5. [PR feedback] Fix focus outline for webkit browsers

    - Chrome/Edge's auto style defaults to currentColor which is the empty shade, so its invisible
    
    - Safari's is just godawful
    cee-chen committed Aug 19, 2024
    Configuration menu
    Copy the full SHA
    5abd42a View commit details
    Browse the repository at this point in the history
  6. Configuration menu
    Copy the full SHA
    7cbbbb1 View commit details
    Browse the repository at this point in the history
  7. Configuration menu
    Copy the full SHA
    cd8b659 View commit details
    Browse the repository at this point in the history