🚀 New Feature​

• We’ve added new icons country and country-fill. !929

🎨 Themes​

• We’ve added new external-link icon design for chameleon-theme-nb, chameleon-theme-gva, chameleon-theme-hbvl and for chameleon-theme-wl. !929
• chameleon-theme-co, chameleon-theme-tc & chameleon-theme-lt now have monochrome instead of polychrome weather icons. !929, !932
• We’ve updated the brand and brand-fill icons for chameleon-theme-lt, chameleon-theme-co and chameleon-theme-tc. !929
• The locale used for chameleon-react datepicker is now de-de instead of fr-fr for chameleon-theme-tc. !923
• Due to the addition of the country and country-fill icons, the pin and pin-fill icons in chameleon-theme-lw and chameleon-theme-vl are now reverted to their original design (a location pin). !932

🏠 Internal​

• Updates to dependencies
  • vite-plugin-ssr: 0.4.99 -> 0.4.100
• Updated to swift 5.8 !920

🐛 Bug Fix​

• For chameleon-theme-co and chameleon-theme-lt the CDN was missing the brand-name-white logo. !880

🎨 Themes​

• Updated the dateTimeFormatDate token value for chameleon-theme-co !895
• Remove drop shadows plus logos in chameleon-theme-indo !900

🏠 Internal​

• Updates to dependencies
  • @percy/cli: 1.20.2 -> 1.21.0
  • inputmask: 5.0.8-beta.72 -> 5.0.8
  • vite: 4.1.4 -> 4.2.1
  • vite-plugin-ssr: 0.4.91 -> 0.4.99
• Updated to swift 5.7.3 & simplified swift pipeline !881

🐛 Bug Fix​

• For chameleon-theme-co and chameleon-theme-lt the CDN was missing the brand-name-white logo. !880

🎨 Themes​

• Updated the focus color for chameleon-theme-lt !859

🏠 Internal​

• Updates to dependencies
  • @easyops-cn/docusaurus-search-local: 0.34.0 -> 0.35.0
  • @percy/cli: 1.18.0 -> 1.20.2
  • jest-environment-jsdom: 29.4.3 -> 29.5.0
  • vite-plugin-ssr: 0.4.87 -> 0.4.91
• Updated our CI artifact expiry policy. !852
• Swift tests are now ran using native test parsing !854

🐛 Bug Fix​

• In chameleon-swift the system italic font is now actually italic, it was incorrectly shown as regular. !842

🎨 Themes​

• For chameleon-theme-indo, the brand-plus-main and brand-plus-main-white logos have been updated !848
• A new illustration named region has been added !847

🏠 Internal​

• Updates to dependencies
  • @babel/runtime: 7.20.13 --> 7.21.0
  • @easyops-cn/docusaurus-search-local: 0.33.6 -> 0.34.0
  • @percy/storybook: 4.3.4 -> 4.3.5
  • jest-environment-jsdom: 29.4.2 -> 29.4.3
  • vite-plugin-ssr: 0.4.77 -> 0.4.87
  • vite: 4.1.1 -> 4.1.4
  • yargs: 17.6.2 -> 17.7.1

🐛 Bug Fix​

• For chameleon-theme-lw, some text color tokens were wrongly mapped internally. In practice this doesn't really change any values, as coincidentally, the underlying values happened to be correct. !601
• Small improvement in <Stepper /> responsiveness. !684, !734
• Fixes a font issue with "Nuacht Serif Headline" in Windows environments for chameleon-theme-indo and chameleon-theme-beltel. !709
• Fixed the font-weights in chameleon-theme-ds. !713
• Fixed: <Accordion> children aren't allowed to be null or undefined when they're not the sole child. !748
• Fix logos for chameleon-theme-vl. !770
• Fix favicons for chameleon-theme-lt. !770

🚀 New Feature​

• 🚀 Welcome to the Chameleon family: chameleon-swift! Beginning with this release we also publish a Swift library for Chameleon via Swift Package Manager. Note, this is a 💥 BREAKING change as the lib/ios output folder in all NPM packages has been removed. !490
• We’ve added success states for some form components in chameleon-react: <Textarea> and <Select>. !671, !682
• We’ve added an error state for <Switch> in chameleon-react. !675
• Some new icons have been added: plate, plate-fill, plate-half, star-half (for ratings) and play-fill (for podcasts). !698, !757
• We updated the <Accordion /> component. Notably:
  • it now uses <details> > <summary> under the hood
  • an onChange callback prop has been added (called whenever another item inside gets expanded)
  • it now has a better focus style !631
• We’ve added <table> styling in <RichContent> for chameleon-react. !740
• There's a new component in town: <Dropdown>! A Dropdown is a contextual menu that you can anchor to a a component of your choosing (usually a Button). It uses a WideList component under the hood. 💥 BREAKING change: to accomodate this new component we’ve made 2 changes to WideList:
  • the clickable prop no longer adds a <ChevronForward /> icon by default to show that it is clickable.
  • the icon and iconColor props have been removed and 2 new props are added: iconLeft and iconRight. !740

🎨 Themes​

• <BrandedHeading /> actions are no longer hidden on smaller screens for chameleon-theme-lw, chameleon-theme-lt, chameleon-theme-co, chameleon-theme-tc and chameleon-theme-hub !648
• Welcome chameleon-theme-vl, our chameleon implementation for Virgule. !685
• Sending some extra love to chameleon-theme-ds:
  • Updated the illustrations to make them more branded
  • Tweaked design tokens !742, !725
• Updated the foundations for chameleon-theme-co and chameleon-theme-lt. !744
• Updated the external icon for chameleon-theme-hub, chameleon-theme-vl, chameleon-theme-lw, chameleon-theme-lt, chameleon-theme-co and chameleon-theme-tc !744, !791
• Updated some font-sizes/line-heights & the design of the <BrandedHeading> for chameleon-theme-indo and chameleon-theme-beltel. !754, !764
• Updated the fonts for chameleon-theme-gva-summer-2020. All fonts have been reexported from Monotype and we’ve now included a bold weight for the primary and secondary font. !765
• Update brand & brand-fill icon for chameleon-theme-ds !770, !788
• Update and add star ratings icons for chameleon-theme-nb, chameleon-theme-gva and chameleon-theme-hbvl !770
• Adds missing BrandNameWhite logos for chameleon-theme-co and chameleon-theme-lt !803
• Updated the alias.focusColor token for chameleon-theme-mh !785

🏠 Internal​

• Updates to dependencies
  • @babel/runtime: 7.19.0 -> 7.20.13
  • @mediahuis/scripts: 1.3.1 -> 2.0.0
  • @percy/cli: 1.12.0 -> 1.18.0
  • @storybook/builder-webpack5: 6.5.13 -> 6.5.16
  • @storybook/manager-webpack5: 6.5.13 -> 6.5.16
  • @storybook/react: 6.5.13 -> 6.5.16
  • chalk: 5.1.2 -> 5.2.0
  • dayjs: 1.11.5 -> 1.11.7
  • husky: 8.0.1 -> 8.0.3
  • inputmask: 5.0.8-beta.47 -> 5.0.8-beta.72
  • jest-environment-jsdom: 29.1.2 -> 29.4.2
  • tinycolor2: 1.4.2 -> 1.5.2
• Updated to Node v18 !628
• Rewrote our chameleon-cli package. !711
• We started using Gitlab's Merge Request Pipelines !812

🦦 Other​

• 💥 BREAKING: in <AutoComplete /> the deprecated onSuggestionSelected prop is now removed (use onSelect instead). !626

• 💥 BREAKING: in <Choice /> we’ve renamed the caption prop to message. Update your implementations from <Choice caption="..." /> to <Choice message="..." /> !662

• 💥 BREAKING: in <IconButton /> the deprecated name prop is now removed (use icon instead). !626

• 💥 BREAKING: the deprecated <Image /> component is now removed. !626

• We changed the look of <Choice type="radio" /> a little bit. It's now clearer that this has radio functionality. !634

• The calendar icon in <DatePicker /> moved to the right of the input field. !636

• We’ve made some improvements to the design of sortable tables which makes things more clear and accessible. !677

• 💥 BREAKING: Fixed the readOnly prop on <DatePicker> in chameleon-react and added a pickerInputOnly prop. !732

• 💥 BREAKING: we’ve renamed all our theme packages to be compliant with Mediahuis' Entity & Brand Codes. So starting with this version number, you may need to install a different package. A short summary:

  • chameleon-theme-gva-summer-2020 -> chameleon-theme-gva

  • chameleon-theme-hbvl-summer-2020 -> chameleon-theme-hbvl

  • chameleon-theme-hmc-ge -> chameleon-theme-ge

  • chameleon-theme-hmc-hd -> chameleon-theme-hd

  • chameleon-theme-hmc-ld -> chameleon-theme-ld

  • chameleon-theme-hmc-nhd -> chameleon-theme-nhd

  • chameleon-theme-hmc-yc -> chameleon-theme-yc

  • chameleon-theme-nb -> chameleon-theme-nb-legacy

  • chameleon-theme-nb-winter-2021 -> chameleon-theme-nb

  • chameleon-theme-swcom -> chameleon-theme-sw

  • chameleon-theme-wort-de -> chameleon-theme-lw

  • chameleon-theme-wort-en -> chameleon-theme-lt

  • chameleon-theme-wort-pt -> chameleon-theme-co

  • chameleon-theme-wort-tc -> chameleon-theme-tc

    !761

🐛 Bug Fix​

• For chameleon-theme-mh and chameleon-theme-az, icons were not properly processed, resulting in icons that didn't inherit the fill color. !601

🎨 Themes​

• We gave some extra love to chameleon-theme-mh by tweaking the design of some of its components. !597

🏠 Internal​

• Updates to dependencies
  • @babel/runtime: 7.19.0 -> 7.19.4
  • @percy/cli: 1.10.4 -> 1.12.0
  • @percy/storybook: 4.3.3 -> 4.3.4
  • dayjs: 1.11.5 -> 1.11.6
  • lerna: 5.5.2 -> 5.6.2
  • inputmask: 5.0.8-beta.25 -> 5.0.8-beta.47
• We switched our gitlab runners to EKS. !600

🐛 Bug Fix​

• Fixed the newly added Plus logos. !574

🏠 Internal​

• Updates to dependencies
  • @percy/cli: 1.10.2 -> 1.10.4
  • downshift: 6.1.9 -> 6.1.12
  • fast-glob: 3.2.11 -> 3.2.12
  • lerna: 5.5.1 -> 5.5.2
• Refactored implementation of @mediahuis/scripts. !579
• react is now an optional peerDependency for all our theme packages. !586

🚀 New Feature​

• We’ve added Plus logos. !558

🏠 Internal​

• Updates to dependencies
  • @babel/runtime: 7.18.9 -> 7.19.0
  • @percy/cli: 1.9.1 -> 1.10.2
  • lerna: 5.4.3 -> 5.5.1
  • classnames: 2.3.1 -> 2.3.2
  • jest-fail-on-console: 2.4.2 -> 2.5.0
• Improved our internal docker setup. !564

🚀 New Feature​

• We’ve added a showOnFocus prop to our <DatePicker /> component. This prop controls whether the calendar should show when the input receives focus. !520

import { DatePicker } from '@mediahuis/chameleon-react';

<DatePicker
  label="Datepicker with showOnFocus"
  value={new Date()}
  showOnFocus={true}
/>;

• Typescript baby steps: we’ve added a type definition file tokens.d.ts that contains type definitions for each theme's tokens.js file. !518
• We’ve updated the UX for <AutoComplete />: Hitting the TAB key when an item is highlighted, selects that item. !525

🏠 Internal​

• Updates to dependencies:
  • @babel/runtime: 7.18.6 -> 7.18.9
  • @percy/cli: 1.3.1 -> 1.9.1
  • @percy/storybook: 4.2.1 -> 4.3.3
  • @popperjs/core: 2.11.5 -> 2.11.6
  • @testing-library/jest-dom: 5.16.4 -> 5.16.5
  • dayjs: 1.11.3 -> 1.11.5
  • downshift: 6.1.7 -> 6.1.9
  • inputmask: 5.0.8-beta.17 -> 5.0.8-beta.25
  • lerna: 5.1.6 -> 5.4.3
• We introduced a solution to generate image placeholders on the fly with SVG in our Storybook stories. This way we no longer have to rely on an external service (such as placeholder.com) which results in our Percy snapshots being a little more robust. !533

🚀 New Feature​

• We’ve added size adjusted fallback fonts for each brand to try and reduce CLS. !472
• The <Placeholder /> component now accepts any value for the aspectRatio prop in the form of X:Y, so for example <Placeholder aspectRatio="4:5">, so you are no longer stuck with the predefined aspect ratios. !502

🎨 Themes​

• We welcome 3 new brands to Chameleon in this release!
  • Aachener Zeitung: chameleon-theme-az. !498
  • Telegraaf: chameleon-theme-tel. !484
  • Mediahuis Group: chameleon-theme-mh. !491
• chameleon-theme-ds received a well deserved rebranding with new fonts, colors, logos and more! !489

🐛 Bug Fix​

• We’ve fixed the fact that actions in <BrandedHeading /> in chameleon-theme-swcom were hidden since our CSS Custom Properties '2.0.0' release. !496
• We’ve fixed the Nuacht Serif Headline font not appearing for chameleon-theme-indo and chameleon-theme-beltel as well as slightly adapting their designs for the <BrandedHeading />. !508