All notable changes to this project will be documented in this file. Releases without a changelog entry contain only minor changes that are irrelevant for users of this library.
We follow Semantic Versioning.
- Updates the
Checkbox
component to the newer style. Now wrapped in aFieldGroup
. - Adds a maximum width to the
Alert
component. - Exposes the
CheckboxGroup
Component.
- Fixes a bug where the checkbox and radio button components didn't have a focus style.
- Adds a DurationInput component, which can handle the input of a duration in hours, minutes, and seconds.
- Adds an ImageSelect component with an image preview or url preview.
- Adds an InsightCard component.
- Fixes a bug where a console error would appear when closing the Google Preview modal.
- Fixes a bug where the Select's onOptionFocus would not be called.
- Fixes a bug where the Edit variant of the NewButton had a misaligned icon.
- Fixes a bug where the new Button component could not be imported via the package index.
- Adds SingleSelect component, which is based on the MultiSelect implementation.
- Introduces the new table HTML and CSS setup.
- Includes table.css in monorepo.css.
- Fixes a bug where the new Button component could not be imported via the package index.
- Fixes a bug where the font size for the field group and the font weight for the table header would not be set correctly.
- Adds an id to the MultiSelect's input field.
- Adjusts the styling provided for the modal component to use it for the Gutenberg Modal component.
- Changes
TextInput
,TextArea
,LabeledRadioButton
,Select
, andMultiSelect
to controlled components, their value should be passed from a higher order component. - Changes the
MultiSelect
implementation to usereact-select
instead ofselect2
. - Introduces
icons.html
for examples on how to use the icons. - Adds chevron up and chevron down svg icons.
- Fixes a bug where removing the last item from the
MultiSelect
generated an error. - Fixes a bug where the
select2
dropdown would be hidden when used in a modal.
- Adds styling to the RadioButtons to remove any "before" elements.
- Adds a button with an edit icon.
- Adds a new active schema tab icon.
- Adds an optional buttonRef prop to the Button and ButtonStyledLink, which will be set as a ref on the html button and anchor element, respectively.
- Makes the FieldGroup component available by exporting it. The FieldGroup is a reusable wrapper with a title/label, an optional HelpIcon and an optional Description.
- Opens the 'ultimate guide to keyword research' link from the WordOccurrenceInsights component in a new tab.
- Adds an optional
onOptionFocus
prop to the Select component. When an input event is fired,onOptionFocus
is called with the select's name, and the current value.
- Makes the Select name property optional.
- Adds the means to put a button inline with a select2 element.
- Adds a small class for the buttons and a disabled status for the secondary button.
- Adds a box shadow and border to the toggle switch.
- Adds a disabled state for the toggle items.
- Adds a "small" prop (boolean) to the Button and ButtonStyledLink components for a variant with a lower profile.
- Yoast styled buttons are now available in preset variants, such as
primary
,secondary
,buy
, etc. - Yoast styled links (identically styled to the buttons) are now available in preset variants, such as
primary
,secondary
,buy
, etc. - Updates the input fields, text areas, dropdowns, buttons, title separator and toggle switches in the settings pages to the new styling.
- Fixes a bug where the insights would cause a horizontal scrollbar in the Yoast sidebar.
- Flips the order of the labels for inverse toggles. To make sure the active state is always on the right.
- Refactors the code to use another term than 'prominent words', 'keyword suggestions' or 'relevant words'.
- Removes the standard WordPress checkmark from our checkmarks.
- Removes internal linking feature flag from the feature branch. Previously hidden functionality will now be the default.
- Deprecates the WordList component. A console warning has been added to the component.
- Adds
type="button"
to all buttons to make sure the default submit behavior is prevented. - Adds focus styling to button, input, textarea, select and toggle switch components for accessibility.
- Adds the correct border colors for active, hover and focus to the IconLabeledButton.
- Adds
VariableEditorInputCotainer
to add caret styles since Draft.js (un)mounts on every focus change. - Changes all the css variables of the button component to use the Yoast namespacing correctly.
- Removes border-bottom and margin-top hack from the collapsible.
- Fixes the right-to-left styling for the .yoast-button--buy button.
- Refactors the code to use another term than 'prominent words', 'keyword suggestions' or 'relevant words'.
- Deprecates the WordList component. A console warning has been added to the component.
- Adds a new standardized Button class, which can render as a button or as an anchor tag.
- Adds a standardized Primary button and link.
- Adds a standardized Secondary button and link.
- Adds a standardized Upsell button and link.
- Adds a standardized Hide button and link.
- Adds a standardized Remove button and link.
- Adds a standardized Close button and link.
- Adds the HTML and CSS for the secondary, sales, hide and remove buttons.
- Adds documentation on how to add
@yoast/components
to your project.
- Fixes a bug where the close button wasn't placed correctly in the metabox modals.
- Fixes a bug where our global CSS variables could conflict with global CSS variables of themes.
- Adds a new DataModel component.
- Changes the Warning component colors to match the new Yoast notification styling.
- Changes the WordOccurrences component in a way that now requires CSS to be loaded. Make sure your JavaScript packager can load CSS.
- Changes the image upload component to be inline with the new Yoast styling.
- Updates HTML and CSS for unexported Toggle and FieldGroup components. ClassName of FieldGroup can now be controlled via props.
- Allows users to set wrapper class and title class on TextInput via wrapperClassName and titleClassName props.
- Fixes a bug where the Select's selected option text was too long for the container.
- Fixes a bug where our
select2
styling would overwrite theselect2
styling of other plugins.
- Makes the MultiSelect, Select, RadioButtonGroup, and TextInput available by exporting them from the root.
- Adds colors and icons used in various components.
- Adds HTML and CSS for new title separator component.
- Adds a separate
HelpIcon
. - Adds an interactive text color to the base colors.
- Adds the Toggle component.
- Adds a new CheckboxGroup component.
- Shows the HelpIcon next to a label only if a link (
linkTo
) is provided. - Updates the HTML of checkbox, input, radiobutton, select and toggle to make styling easier.
- Changes styling for select components.
- Makes select2 full width.
- Fixes a bug where loading the styles from the monorepo would not include styles for the
HelpIcon
. - Removes some global CSS rules.
- Adds CSS through JavaScript imports for button, checkbox, data-model, field-group, inputs, modal, radiobutton, select and toggle.
- Adds GenerateId, FieldGroup, TextArea and TextInput components.
- Adds CSS for the primary, secondary and buy buttons.
- Adds a CSS test stub.
- Updates the styling of the multiselect.
- Changes the HTML for the modal to improve the accessibility.
- Adds CSS through JavaScript imports for button, checkbox, data-model, field-group, inputs, modal, radiobutton, select and toggle.
- Adds GenerateId, FieldGroup, TextArea and TextInput components.
- Adds CSS and HTML used in the upcoming redesign of the components for borders, colors, icons, buttons, checkbox, data-model, inputs, modal, radio button, select and toggle.
- Adds
className
attribute to the Input component. - Adds
className
andoptionalAttributes
attributes to the Label component.
- Drops IE11 support through configuring Babel to use the preset environment with the own list of supported browsers specified.
- Removed the components related to the Help Center and the AlgoliaSearch package.
- Improves the
InputField
styling for consistency with the new WordPress 5.3 admin styles.
- Adds a className prop to the AlertContainer.
- Adds an
Alert
component. - Adds a
MultiStepProgress
component.
- No user-facing changes.
- Changes the following improved internal linking functionality (which is disabled by a feature flag by default):
- Adds the `WordOccurrences component, which is a new visualization for the prominent words.
- Uses feature-flag functionality to determine whether a single word or a multi-word combination should be returned in the
KeywordSuggestions
component. Multi-word remains the default.
- Changes
SynonymsInput
'sid
prop to be required.
- Fixes a bug where node-sass needed to be installed when adding dependencies that depend on
@yoast/style-guide
. - Improved handling of the
rel
attribute for links that open in a new browser's tab.
- Splits out
@yoast/components
from@yoast/yoast-components
. This package contains general components which are mainly used to build other, bigger components.