Skip to content
Permalink
Browse files

fix(inputs): Update checkboxes and radios to have proper value attrib…

…ute (#3196)
  • Loading branch information...
Ayesha Mazumdar
Ayesha Mazumdar committed Apr 11, 2018
1 parent 306c5af commit cdf72cd3b223cdae6514150004b42b8679a74f1b
Showing with 54 additions and 37 deletions.
  1. +1 −1 ...y-timeline/__tests__/__snapshots__/Activity_Timeline_Expandable_renders_a_task_timeline_item.json
  2. +1 −1 ...napshots__/Activity_Timeline_Expandable_renders_a_timeline_item_trigger_with_a_task_checkbox.json
  3. +1 −1 ...line/__tests__/__snapshots__/Activity_Timeline_Expandable_renders_a_timeline_item_with_icons.json
  4. +1 −1 ..._tests__/__snapshots__/Activity_Timeline_Expandable_renders_the_deprecated_combined_timeline.json
  5. +1 −0 ui/components/checkbox-button-group/base/example.jsx
  6. +3 −2 ui/components/checkbox-button/__tests__/__snapshots__/renders_a_checked_checkbox_button.json
  7. +3 −2 ui/components/checkbox-button/__tests__/__snapshots__/renders_a_default_checkbox_button.json
  8. +3 −2 ui/components/checkbox-button/__tests__/__snapshots__/renders_a_disabled_checkbox_button.json
  9. +1 −0 ui/components/checkbox-button/base/example.jsx
  10. +1 −0 ui/components/checkbox-toggle/base/example.jsx
  11. +1 −1 ui/components/checkbox/__tests__/__snapshots__/renders_a_checkbox_group.json
  12. +1 −1 ui/components/checkbox/__tests__/__snapshots__/renders_a_checkbox_group_with_error.json
  13. +1 −1 ui/components/checkbox/__tests__/__snapshots__/renders_a_default_checkbox.json
  14. +1 −1 ui/components/checkbox/__tests__/__snapshots__/renders_a_disabled_checkbox.json
  15. +1 −1 ui/components/checkbox/__tests__/__snapshots__/renders_a_disabled_checkbox_group.json
  16. +1 −1 ui/components/checkbox/__tests__/__snapshots__/renders_a_required_checkbox.json
  17. +1 −1 ui/components/checkbox/__tests__/__snapshots__/renders_a_required_checkbox_group.json
  18. +1 −1 ui/components/checkbox/__tests__/__snapshots__/renders_a_stacked_checkbox.json
  19. +1 −1 ui/components/checkbox/__tests__/__snapshots__/renders_an_error_state_checkbox.json
  20. +1 −1 ui/components/checkbox/__tests__/__snapshots__/renders_an_indeterminate_checkbox.json
  21. +1 −0 ui/components/checkbox/base/example.jsx
  22. +1 −1 ...mponents/data-tables/__tests__/__snapshots__/renders_an_advanced_data_table_with_radio_group.json
  23. +1 −1 ...ents/form-layout/__tests__/__snapshots__/Form_Layout_renders_a_base_form_layout_horizontally.json
  24. +1 −0 ui/components/radio-button-group/base/example.jsx
  25. +1 −0 ui/components/radio-group/base/example.jsx
  26. +3 −2 ...l-navigation/__tests__/__snapshots__/Vertical_Nav_Radio_Group_renders_a_checked_radio_button.json
  27. +3 −2 ...tical-navigation/__tests__/__snapshots__/Vertical_Nav_Radio_Group_renders_a_compact_fieldset.json
  28. +3 −2 ...ents/vertical-navigation/__tests__/__snapshots__/Vertical_Nav_Radio_Group_renders_a_fieldset.json
  29. +3 −2 ...s/vertical-navigation/__tests__/__snapshots__/Vertical_Nav_Radio_Group_renders_a_focus_state.json
  30. +3 −2 ...s/vertical-navigation/__tests__/__snapshots__/Vertical_Nav_Radio_Group_renders_a_hover_state.json
  31. +3 −2 .../vertical-navigation/__tests__/__snapshots__/Vertical_Nav_Radio_Group_renders_a_radio_button.json
  32. +3 −2 ...rtical-navigation/__tests__/__snapshots__/Vertical_Nav_Radio_Group_renders_a_shaded_fieldset.json
  33. +1 −1 ui/components/vertical-navigation/radio-group/example.jsx
  34. +1 −0 ui/components/visual-picker/coverable-content/example.jsx

Large diffs are not rendered by default.

Oops, something went wrong.

Large diffs are not rendered by default.

Oops, something went wrong.

Large diffs are not rendered by default.

Oops, something went wrong.

Large diffs are not rendered by default.

Oops, something went wrong.
@@ -30,6 +30,7 @@ export let Checkbox = props => (
disabled={props.disabled}
defaultChecked={props.checked}
id={props.id}
value={props.id}
name="checkbox"
type="checkbox"
/>

Large diffs are not rendered by default.

Oops, something went wrong.

Large diffs are not rendered by default.

Oops, something went wrong.

Large diffs are not rendered by default.

Oops, something went wrong.
@@ -19,6 +19,7 @@ export let CheckboxAddButton = props => {
className="slds-assistive-text"
type="checkbox"
id={uniqueId}
value={uniqueId}
disabled={props.disabled}
defaultChecked={props.checked}
tabIndex={props.tabIndex}
@@ -48,6 +48,7 @@ export let FauxLabel = props => (
export let Checkbox = props => (
<input
name={props.uniqueId}
value={props.uniqueId}
type="checkbox"
disabled={props.disabled}
defaultChecked={props.checked}
@@ -1,7 +1,7 @@
{
"snapshot": {
"html":
"<fieldset class=\"slds-form-element\">\n <legend class=\"slds-form-element__legend slds-form-element__label\">Checkbox Group Label</legend>\n <div class=\"slds-form-element__control\">\n <span class=\"slds-checkbox\">\n <input type=\"checkbox\" name=\"options\" id=\"checkbox-6\" checked=\"\" />\n <label class=\"slds-checkbox__label\" for=\"checkbox-6\">\n <span class=\"slds-checkbox_faux\"></span>\n <span class=\"slds-form-element__label\">Checkbox Label</span>\n </label>\n </span>\n <span class=\"slds-checkbox\">\n <input type=\"checkbox\" name=\"options\" id=\"checkbox-7\" />\n <label class=\"slds-checkbox__label\" for=\"checkbox-7\">\n <span class=\"slds-checkbox_faux\"></span>\n <span class=\"slds-form-element__label\">Checkbox Label</span>\n </label>\n </span>\n </div>\n</fieldset>",
"<fieldset class=\"slds-form-element\">\n <legend class=\"slds-form-element__legend slds-form-element__label\">Checkbox Group Label</legend>\n <div class=\"slds-form-element__control\">\n <span class=\"slds-checkbox\">\n <input type=\"checkbox\" name=\"options\" id=\"checkbox-6\" value=\"checkbox-6\" checked=\"\" />\n <label class=\"slds-checkbox__label\" for=\"checkbox-6\">\n <span class=\"slds-checkbox_faux\"></span>\n <span class=\"slds-form-element__label\">Checkbox Label</span>\n </label>\n </span>\n <span class=\"slds-checkbox\">\n <input type=\"checkbox\" name=\"options\" id=\"checkbox-7\" value=\"checkbox-7\" />\n <label class=\"slds-checkbox__label\" for=\"checkbox-7\">\n <span class=\"slds-checkbox_faux\"></span>\n <span class=\"slds-form-element__label\">Checkbox Label</span>\n </label>\n </span>\n </div>\n</fieldset>",
"style": [
"animation-delay: 0s; animation-direction: normal; animation-duration: 0s; animation-fill-mode: none; animation-iteration-count: 1; animation-name: none; animation-play-state: running; animation-timing-function: ease; background-attachment: scroll; background-blend-mode: normal; background-clip: border-box; background-color: rgba(0, 0, 0, 0); background-image: none; background-origin: padding-box; background-position: 0% 0%; background-repeat: repeat; background-size: auto; border-bottom-color: rgb(62, 62, 60); border-bottom-left-radius: 0px; border-bottom-right-radius: 0px; border-bottom-style: none; border-bottom-width: 0px; border-collapse: separate; border-image-outset: 0px; border-image-repeat: stretch; border-image-slice: 100%; border-image-source: none; border-image-width: 1; border-left-color: rgb(62, 62, 60); border-left-style: none; border-left-width: 0px; border-right-color: rgb(62, 62, 60); border-right-style: none; border-right-width: 0px; border-top-color: rgb(62, 62, 60); border-top-left-radius: 0px; border-top-right-radius: 0px; border-top-style: none; border-top-width: 0px; bottom: 0px; box-shadow: none; box-sizing: border-box; break-after: auto; break-before: auto; break-inside: auto; caption-side: top; clear: none; clip: auto; color: rgb(62, 62, 60); content: ; cursor: auto; direction: ltr; display: block; empty-cells: show; float: none; font-family: \"Salesforce Sans\", Arial, sans-serif; font-kerning: auto; font-size: 13px; font-stretch: 100%; font-style: normal; font-variant: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-variant-numeric: normal; font-weight: 400; height: 56px; image-rendering: auto; isolation: auto; justify-items: normal; justify-self: auto; left: 0px; letter-spacing: normal; line-height: 19.5px; list-style-image: none; list-style-position: outside; list-style-type: disc; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; max-height: none; max-width: none; min-height: 0px; min-width: min-content; mix-blend-mode: normal; object-fit: fill; object-position: 50% 50%; offset-distance: 0px; offset-path: none; offset-rotate: auto 0deg; opacity: 1; orphans: 2; outline-color: rgb(62, 62, 60); outline-offset: 0px; outline-style: none; outline-width: 0px; overflow-anchor: auto; overflow-wrap: normal; overflow-x: visible; overflow-y: visible; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; pointer-events: auto; position: relative; resize: none; right: 0px; scroll-behavior: auto; speak: normal; table-layout: auto; tab-size: 8; text-align: start; text-align-last: auto; text-decoration: none solid rgb(62, 62, 60); text-decoration-line: none; text-decoration-style: solid; text-decoration-color: rgb(62, 62, 60); text-decoration-skip: objects; text-underline-position: auto; text-indent: 0px; text-rendering: auto; text-shadow: none; text-size-adjust: 100%; text-overflow: clip; text-transform: none; top: 0px; touch-action: auto; transition-delay: 0s; transition-duration: 0s; transition-property: all; transition-timing-function: ease; unicode-bidi: normal; vertical-align: baseline; visibility: visible; white-space: normal; widows: 2; width: 1280px; will-change: auto; word-break: normal; word-spacing: 0px; word-wrap: normal; z-index: auto; zoom: 1; -webkit-appearance: none; backface-visibility: visible; -webkit-background-clip: border-box; -webkit-background-origin: padding-box; -webkit-border-horizontal-spacing: 0px; -webkit-border-image: none; -webkit-border-vertical-spacing: 0px; -webkit-box-align: stretch; -webkit-box-decoration-break: slice; -webkit-box-direction: normal; -webkit-box-flex: 0; -webkit-box-flex-group: 1; -webkit-box-lines: single; -webkit-box-ordinal-group: 1; -webkit-box-orient: horizontal; -webkit-box-pack: start; -webkit-box-reflect: none; column-count: auto; column-gap: normal; column-rule-color: rgb(62, 62, 60); column-rule-style: none; column-rule-width: 0px; column-span: none; column-width: auto; align-content: normal; align-items: normal; align-self: auto; flex-basis: auto; flex-grow: 0; flex-shrink: 1; flex-direction: row; flex-wrap: nowrap; justify-content: normal; -webkit-font-smoothing: auto; grid-auto-columns: auto; grid-auto-flow: row; grid-auto-rows: auto; grid-column-end: auto; grid-column-start: auto; grid-template-areas: none; grid-template-columns: none; grid-template-rows: none; grid-row-end: auto; grid-row-start: auto; grid-column-gap: 0px; grid-row-gap: 0px; -webkit-highlight: none; hyphens: manual; -webkit-hyphenate-character: auto; -webkit-line-break: auto; -webkit-line-clamp: none; -webkit-locale: auto; -webkit-margin-before-collapse: collapse; -webkit-margin-after-collapse: collapse; -webkit-mask-box-image: none; -webkit-mask-box-image-outset: 0px; -webkit-mask-box-image-repeat: stretch; -webkit-mask-box-image-slice: 0 fill; -webkit-mask-box-image-source: none; -webkit-mask-box-image-width: auto; -webkit-mask-clip: border-box; -webkit-mask-composite: source-over; -webkit-mask-image: none; -webkit-mask-origin: border-box; -webkit-mask-position: 0% 0%; -webkit-mask-repeat: repeat; -webkit-mask-size: auto; order: 0; perspective: none; perspective-origin: 640px 28px; -webkit-print-color-adjust: economy; -webkit-rtl-ordering: logical; shape-outside: none; shape-image-threshold: 0; shape-margin: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-text-combine: none; -webkit-text-decorations-in-effect: none; -webkit-text-emphasis-color: rgb(62, 62, 60); -webkit-text-emphasis-position: over; -webkit-text-emphasis-style: none; -webkit-text-fill-color: rgb(62, 62, 60); -webkit-text-orientation: vertical-right; -webkit-text-security: none; -webkit-text-stroke-color: rgb(62, 62, 60); -webkit-text-stroke-width: 0px; transform: none; transform-origin: 640px 28px; transform-style: flat; -webkit-user-drag: auto; -webkit-user-modify: read-only; user-select: auto; -webkit-writing-mode: horizontal-tb; -webkit-app-region: no-drag; buffered-rendering: auto; clip-path: none; clip-rule: nonzero; mask: none; filter: none; flood-color: rgb(0, 0, 0); flood-opacity: 1; lighting-color: rgb(255, 255, 255); stop-color: rgb(0, 0, 0); stop-opacity: 1; color-interpolation: sRGB; color-interpolation-filters: linearRGB; color-rendering: auto; fill: rgb(0, 0, 0); fill-opacity: 1; fill-rule: nonzero; marker-end: none; marker-mid: none; marker-start: none; mask-type: luminance; shape-rendering: auto; stroke: none; stroke-dasharray: none; stroke-dashoffset: 0px; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 4; stroke-opacity: 1; stroke-width: 1px; alignment-baseline: auto; baseline-shift: 0px; dominant-baseline: auto; text-anchor: start; writing-mode: horizontal-tb; vector-effect: none; paint-order: fill stroke markers; d: none; cx: 0px; cy: 0px; x: 0px; y: 0px; r: 0px; rx: auto; ry: auto; caret-color: rgb(62, 62, 60); line-break: auto;",
"animation-delay: 0s; animation-direction: normal; animation-duration: 0s; animation-fill-mode: none; animation-iteration-count: 1; animation-name: none; animation-play-state: running; animation-timing-function: ease; background-attachment: scroll; background-blend-mode: normal; background-clip: border-box; background-color: rgba(0, 0, 0, 0); background-image: none; background-origin: padding-box; background-position: 0% 0%; background-repeat: repeat; background-size: auto; border-bottom-color: rgb(112, 110, 107); border-bottom-left-radius: 0px; border-bottom-right-radius: 0px; border-bottom-style: none; border-bottom-width: 0px; border-collapse: separate; border-image-outset: 0px; border-image-repeat: stretch; border-image-slice: 100%; border-image-source: none; border-image-width: 1; border-left-color: rgb(112, 110, 107); border-left-style: none; border-left-width: 0px; border-right-color: rgb(112, 110, 107); border-right-style: none; border-right-width: 0px; border-top-color: rgb(112, 110, 107); border-top-left-radius: 0px; border-top-right-radius: 0px; border-top-style: none; border-top-width: 0px; bottom: auto; box-shadow: none; box-sizing: border-box; break-after: auto; break-before: auto; break-inside: auto; caption-side: top; clear: none; clip: auto; color: rgb(112, 110, 107); content: ; cursor: auto; direction: ltr; display: block; empty-cells: show; float: none; font-family: \"Salesforce Sans\", Arial, sans-serif; font-kerning: auto; font-size: 12px; font-stretch: 100%; font-style: normal; font-variant: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-variant-numeric: normal; font-weight: 400; height: 18px; image-rendering: auto; isolation: auto; justify-items: normal; justify-self: auto; left: auto; letter-spacing: normal; line-height: 18px; list-style-image: none; list-style-position: outside; list-style-type: disc; margin-bottom: 2px; margin-left: 0px; margin-right: 12px; margin-top: 0px; max-height: none; max-width: none; min-height: 0px; min-width: 0px; mix-blend-mode: normal; object-fit: fill; object-position: 50% 50%; offset-distance: 0px; offset-path: none; offset-rotate: auto 0deg; opacity: 1; orphans: 2; outline-color: rgb(112, 110, 107); outline-offset: 0px; outline-style: none; outline-width: 0px; overflow-anchor: auto; overflow-wrap: normal; overflow-x: visible; overflow-y: visible; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; pointer-events: auto; position: static; resize: none; right: auto; scroll-behavior: auto; speak: normal; table-layout: auto; tab-size: 8; text-align: start; text-align-last: auto; text-decoration: none solid rgb(112, 110, 107); text-decoration-line: none; text-decoration-style: solid; text-decoration-color: rgb(112, 110, 107); text-decoration-skip: objects; text-underline-position: auto; text-indent: 0px; text-rendering: auto; text-shadow: none; text-size-adjust: 100%; text-overflow: clip; text-transform: none; top: auto; touch-action: auto; transition-delay: 0s; transition-duration: 0s; transition-property: all; transition-timing-function: ease; unicode-bidi: normal; vertical-align: baseline; visibility: visible; white-space: normal; widows: 2; width: 126.844px; will-change: auto; word-break: normal; word-spacing: 0px; word-wrap: normal; z-index: auto; zoom: 1; -webkit-appearance: none; backface-visibility: visible; -webkit-background-clip: border-box; -webkit-background-origin: padding-box; -webkit-border-horizontal-spacing: 0px; -webkit-border-image: none; -webkit-border-vertical-spacing: 0px; -webkit-box-align: stretch; -webkit-box-decoration-break: slice; -webkit-box-direction: normal; -webkit-box-flex: 0; -webkit-box-flex-group: 1; -webkit-box-lines: single; -webkit-box-ordinal-group: 1; -webkit-box-orient: horizontal; -webkit-box-pack: start; -webkit-box-reflect: none; column-count: auto; column-gap: normal; column-rule-color: rgb(112, 110, 107); column-rule-style: none; column-rule-width: 0px; column-span: none; column-width: auto; align-content: normal; align-items: normal; align-self: auto; flex-basis: auto; flex-grow: 0; flex-shrink: 1; flex-direction: row; flex-wrap: nowrap; justify-content: normal; -webkit-font-smoothing: auto; grid-auto-columns: auto; grid-auto-flow: row; grid-auto-rows: auto; grid-column-end: auto; grid-column-start: auto; grid-template-areas: none; grid-template-columns: none; grid-template-rows: none; grid-row-end: auto; grid-row-start: auto; grid-column-gap: 0px; grid-row-gap: 0px; -webkit-highlight: none; hyphens: manual; -webkit-hyphenate-character: auto; -webkit-line-break: auto; -webkit-line-clamp: none; -webkit-locale: auto; -webkit-margin-before-collapse: collapse; -webkit-margin-after-collapse: collapse; -webkit-mask-box-image: none; -webkit-mask-box-image-outset: 0px; -webkit-mask-box-image-repeat: stretch; -webkit-mask-box-image-slice: 0 fill; -webkit-mask-box-image-source: none; -webkit-mask-box-image-width: auto; -webkit-mask-clip: border-box; -webkit-mask-composite: source-over; -webkit-mask-image: none; -webkit-mask-origin: border-box; -webkit-mask-position: 0% 0%; -webkit-mask-repeat: repeat; -webkit-mask-size: auto; order: 0; perspective: none; perspective-origin: 63.4219px 9px; -webkit-print-color-adjust: economy; -webkit-rtl-ordering: logical; shape-outside: none; shape-image-threshold: 0; shape-margin: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-text-combine: none; -webkit-text-decorations-in-effect: none; -webkit-text-emphasis-color: rgb(112, 110, 107); -webkit-text-emphasis-position: over; -webkit-text-emphasis-style: none; -webkit-text-fill-color: rgb(112, 110, 107); -webkit-text-orientation: vertical-right; -webkit-text-security: none; -webkit-text-stroke-color: rgb(112, 110, 107); -webkit-text-stroke-width: 0px; transform: none; transform-origin: 63.4219px 9px; transform-style: flat; -webkit-user-drag: auto; -webkit-user-modify: read-only; user-select: auto; -webkit-writing-mode: horizontal-tb; -webkit-app-region: no-drag; buffered-rendering: auto; clip-path: none; clip-rule: nonzero; mask: none; filter: none; flood-color: rgb(0, 0, 0); flood-opacity: 1; lighting-color: rgb(255, 255, 255); stop-color: rgb(0, 0, 0); stop-opacity: 1; color-interpolation: sRGB; color-interpolation-filters: linearRGB; color-rendering: auto; fill: rgb(0, 0, 0); fill-opacity: 1; fill-rule: nonzero; marker-end: none; marker-mid: none; marker-start: none; mask-type: luminance; shape-rendering: auto; stroke: none; stroke-dasharray: none; stroke-dashoffset: 0px; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 4; stroke-opacity: 1; stroke-width: 1px; alignment-baseline: auto; baseline-shift: 0px; dominant-baseline: auto; text-anchor: start; writing-mode: horizontal-tb; vector-effect: none; paint-order: fill stroke markers; d: none; cx: 0px; cy: 0px; x: 0px; y: 0px; r: 0px; rx: auto; ry: auto; caret-color: rgb(112, 110, 107); line-break: auto;",
Oops, something went wrong.

0 comments on commit cdf72cd

Please sign in to comment.
You can’t perform that action at this time.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.