🚀 New Feature​

Tokens​

• Updated Tag Component for AZ
  • color set to semantic.brand
  • layout set to 4px 8px
  • Font set to secondary and medium and 12px
• Update Asset-docs for CDN
• Dialog component updates MHDS-2488
  • Update DVN Input
  • divider: color.neutral.30 is used in the react component but it should be the semantic border token (or the divider token)
  • borderRadius: component specific token needed

web​

mobile​

chameleon-kotlin​

• Token names that had numbers in them got split wrong. For example plus26Logo got split into plus26_logo instead of plus_26_logo. This is now fixed.

chameleon-swift​

• Stabilize build by adding file with all version numbers of the dependencies back into the release repo.
• Stable version of swift-string 1.0.0. Which is more correct in transforming to camelCase or snake case than the previous version.
• Plugins that generate the token code should run less often as they now have an input file allowing the build engine to skip building them if nothing changed.
• Temporary fix for inconsistent token issue where tokens like token26xl were not dynamically available. This was due to an inconsistency in dependency swift-string which transformed it to token26Xl with Xl instead of xl. This is now fixed by using the camelCase function of the same dependency.

Note: A more elaborate change is comming making token lookup for swift/kotlin more consistent and beter usable with, follow MHDS-2493

🏠 Internal​

• Release procedure allows release from up to date branch, or prepare changelog before release
• Release of chameleon-swift not updating after version 4.3.1. Some versions where skipped inbetween 4.3.1 and 4.5.0 which was released on 24-11-2023 for chameleon-swift (later then other platforms)
• Release procedure should push the tag with the version number correctly triggering pipeline job to release it.
• Run scheduled build of the kotlin-tokens to ensure its quality daily.
• Updates to dependencies
  • @percy/cli: 1.26.0 -> 1.27.6-alpha.0
  • @percy/storybook: 4.3.6 -> 5.0.0

🚀 New Feature​

web​

• Added video-icon on TextOnImageTeaser when articleType is video !1305

kotlin-tokens​

• Figma, css and zephr backend tokens can differ in casing, separator used (_-.), and special characters. To make this more flexible we now convert the token name to snake case and remove special characters. To do so we introduced a feature that lets you describe tokens more safe using enums. These enums are especially usefull when building components so an implementer can pick an enum instead of any string value !1299.

• Centralize versions for chameleon && move to kotlin 1.9.20. Whit this move we now offer a file named versions.toml that can be used in the components package to align the versions of the token package. Thus removing lots of manual work to change version numbers in serveral places which could lead to inconsistant build results. !1311

• [unresolved] Open issue remains to align this token string to value mapping by using snake casing with swift-tokens. This issue is described in MHDS-2493

tokens​

• chameleon-theme-wl and chameleon-theme-dvn Modify borderRadius in dialog !1314
• chameleon-theme-dvn Modify borderRadius in input !1314

chores​

• Fix examples install issue with pnpm !1306
• Whole lot of docsite fixes !1321
• Add format option optionally to husky, this is an opt-in option that is set by setting the CHAMELEON_PRECOMMIT to true env !1308
• Update to fs-extra dependency !1320

🐛 Bug Fix​

web​

• Fix Logo imports that causes warnings in webpack 5 !1319

tokens​

• Fix text-decoration inside RelatedTeaser for AZ !1325

Key Updates: Adding missing tokens and some internal chores.

Notice: 4.4.1 is a failed release, so we skipped it.

🐛 Bug Fix​

• Adding missing tokens for HUB subthemes !1310
• Fixing incorrect title font for the ListTeaser for chameleon-theme-co, chameleon-theme-lt, chameleon-theme-lw and chameleon-theme-vl to match designs. !1297

🏠 Internal​

• Adding missing token imports in React Components, this could cause weird results in the Percy snapshots !1301
• • Adding correct scaling tokens to docsite !1284 and !1304

Key Updates: Mobile Improvements and a small fix for Teasers.

🚀 New Feature​

mobile​

Chameleon-Kotlin Updates:​

Introduced a new theme provider in our Kotlin-based applications for a more personalized user experience.

Chameleon-Swift Adjustments:​

Improved mathematical functionality to support direct number input.

chameleon-kotlin​

features​

Add theme provider for individual theme !1269

chores​

• format code after generating it
• update plugin com.android.library to v8.1.3
• update kotlin 1.9.10 with related compose dependencies
• codegen kotlin/pipeline test results missing !1282
• update gradle to 8.4 !1236

chameleon-swift​

fixes​

• math should allow numbers directly !1281

chores​

• fix factory dependency to 4.3.1 !1289

🏠 Internal​

• chore(release): automate release procedure
• fix(chameleon-native-publish): more generic to allow publish of components !1285

🐛 Bug Fix​

web​

• Raise Specificity of the Heading inside the Teaser, to prevent the underlying Header to overwrite it !1276

🐛 Bug Fix​

web​

• Stop unwanted shrinking of Icon if parent is flex and the content next to it takes up much space. !2478
• Fix a bug caused by a SVGO as a dependency of SVGR where viewport got removed from SVGs, leading to SVG's having a wrong size. !2478

🏠 Internal​

release​

• Run the CDN-upload on every release, if not we created an unstable Logo component.

🎨 Themes​

• Updated the value of semantic.foreground.accent.adaptive.default.fill (for teaser label) and semantic.foreground.base.adaptive.default.fill (general text color) to match the Figma designs for chameleon-theme-lw !1260

🚀 New Feature​

• New automated CDN using Focus. More info

web​

• <DefaultTeaser /> and <TextOnImageTeaser /> now support clamping of the introduction. This is done via the introductionOptions property (where clamp is set to an amount of lines). More info

mobile​

chameleon-kotlin​

• Add support for tokens with different features

  • boolean: a bool value to activate features in a component
  • composition: type used to describe padding
  • dimension: dimensions of a component
  • format: format strings describing (like date format)
  • gradient: data to form a gradient, no drawing code yet
  • number: various numbers to be used in designs
  • sizing: the size of breakpoints
  • textDecoration: underline/strikethrough/... text

• Add drawable assets for all themes

  • x icon to social-x
  • 💥 BREAKING: the naming of the drawables changed to theme-name-kind where kind is icon, illustration or logo

• Support for Typography in both compose and for legacy Typeface

  • increase and decrease the font size of a typography token to any desired value

chameleon-swift​

• increase and decrease the font size of a typography token to any desired value

🐛 Bug Fix​

web​

• Raise the specificity for the title inside the <DefaultTeaser /> component, so its color doesn't get overridden. !1254.

🎨 Themes​

• Onboarded Dagblad van het Noorden. Welcome chameleon-theme-dvn! !1161 !1205
• Added input.placeholder.fill for all themes. !1196
• Updated color.primary.60 for chameleon-theme-lw, resolving an a11y contrast issue. !1163
• Updated semantic.foreground.base.adaptive.soft.fill for chameleon-theme-ge, chameleon-theme-hd, chameleon-theme-nhd, chameleon-theme-yc and chameleon-theme-ld; resolving an a11y contrast issue. !1191
• Updated teaser.background.highlight.fill for chameleon-theme-az. !1193
• Updated branded-heading typography tokens for chameleon-theme-lw. !1220
• Updated tag.typography.font.size for chameleon-theme-co. !1220

🚀 New Feature​

general​

• Added the new X (formerly known as Twitter) icon as social-x. !1242 !1251

chameleon-react​

• A big update to our new teaser components: making sure they are fully SSR! Major kudos @wannes.debacker! 💫 !1186
• This release brings yet another new teaser component! Welcome to our component family, <RelatedTeaser />! !1187
• Another new addition to said component family, <Quote />! !1179
• You can now supply dateTimeOptions to all teaser components. (this replaces the dateTimeFormat prop, which is technically a breaking change! 💥) !1219
• The articleType prop on <DefaultTeaser /> received an extra option "podcast" . !1214

🐛 Bug Fix​

general​

• Backported the new Arnhem fonts for chameleon-theme-ds to legacy as well. !1247

web​

• Fixed an issue on iOS mobile safari making icons in <IconButton /> too small. !1190
• Fixed an issue with the <Stack /> component hindering you from setting inline styles. !1189

app​

• Fixed an issue with boxshadow and border tokens containing references. !1172
• Fixed an obscure issue in turkish locales where the percentage sign is placed differently. !1167

🏠 Internal​

• Added Renovate! We switched our dependency updater from Dependabot to Renovate for a smoother workflow. !1100
• Our token setup is never finished, we keep improving it. This time by more dogfooding in our own components. !1169
• Reworked our native install and publish scripts, moving away from chameleon-swift-scripts !1170
• Added a pre-release-ceremony script you should run before publishing chameleon packages. !1185
• Added JUnit style test reports to our CI setup. !1202 !1208
• Web typography tokens can now use italic font-styles !1221
• Moved to Swift 5.9 !1195
• Releases from CI! !1198
• style-dictionary for Swift output now also uses ts/resolveMath !1216
• Allow development against new macOS versions including the new Sonoma !1166
• Updates to dependencies
  • @docusaurus/core: 2.4.0 -> 2.4.3
  • @docusaurus/preset-classic: 2.4.0 -> 2.4.3
  • @docusaurus/theme-common: 2.4.0 -> 2.4.3
  • @easyops-cn/docusaurus-search-local: 0.35.0 -> 0.36.0
  • @mediahuis/scripts: 2.0.0 -> 2.1.0-next.2
  • @tokens-studio/sd-transforms: 0.10.1 -> 0.11.6
  • androidx.lifecycle:lifecycle-runtime-ktx: 2.6.1 -> 2.6.2
  • apple/swift-crypto: 1.0.0 -> 1.1.7
  • apple/swift-log: 1.4.4 -> 1.5.3
  • com.android.library: 8.1.1 -> 8.1.2
  • doozMen/swift-snapshot-testing-cli: 1.0.0 -> 1.0.1
  • hmlongco/Factory: 2.3.0 -> 2.3.2
  • Zollerboy1/SwiftCommand: 1.3.0 -> 1.4.0
  • org.jlleitschuh.gradle.ktlint: 11.5.0 -> 11.6.1

The Big Tease(r)!​

Our Chameleon 4.0.0 release is not even cold, and yet here we are with a 4.1.0 release! Not a major version, but nonetheless another major leap forward: this release brings you teasers and subtheming.

🎨 Themes​

• Subtheming! We're taking our first baby steps in harnessing the power our new token setup brought. The first themes getting this upgrade are:

  • chameleon-theme-az: sponsored-content
  • chameleon-theme-lw: sponsored-content and accent
  • chameleon-theme-lt: sponsored-content and accent
  • chameleon-theme-vl: sponsored-content and accent
  • chameleon-theme-co: sponsored-content and accent !1145

• The styling for BrandedHeading has been improved for chameleon-theme-lw, chameleon-theme-lt, chameleon-theme-vl and chameleon-theme-co. !1131

• Updates the placeholder illustration for chameleon-theme-indo. !1141

• Updates the complete icon set for chameleon-theme-az. This also adds puzzle and puzzle-fill icons for all brands. !1141

• A slew of token updates for chameleon-theme-ds, chameleon-theme-hmc, chameleon-theme-nb and chameleon-theme-hmc. !1151 !1157

• Added the XTR logo (brand-sponsored-content) for chameleon-theme-ds !1160

🚀 New Feature​

chameleon-react​

• Teasers! This release marks Chameleon's first adventure into larger component territory. In this version, we bring you <DefaultTeaser />, <TextOnImageTeaser /> and <ListTeaser />. !1073
• <Tag />, you’re it! A brand new, small, but necessary addition to our component library. !1108
• A new block prop has been added to <LinkText />. !1121
• The <AutoComplete /> component now marks your search query in the suggestions by default. !1139

🐛 Bug Fix​

web​

• We’ve added stylelint-value-no-unknown-custom-properties to our setup, which immediately brought some CSS oversights from our 4.0.0 release to light. !1135
• We’ve made some fixes to our <AutoComplete /> component in chameleon-react. Specifically:
  • the onInputChange handler nog longer fires when selecting a suggestion.
  • The loader now also shows when there are no suggestions yet. !1139
• Fixed an issue with cdn-logos.js import. !1143
• Fixed an issue with convertDateToTimeZone. !1148
• Fixed an issue with brand-square-icon-name-horizontal-white CDN logo config for chameleon-theme-az. !1154

app​

• Gave a bit more love to our lib-android export. !1138
• Fixes an issue with camelcasing in tokens. !1137

🏠 Internal​

• We’ve updated the minimum required react version to 16.14.0 !1142

✨🌈 Time to shed that old skin: welcome Chameleon 4.0.0!​

Remember our old design token setup? Our new major version is a complete overhaul of our design token setup, making the old one look like a chameleon in a black and white movie. #NewSkinWhoDis?

Be sure to check out our migration guide to help guide you through the process of upgrading.

🎨 Themes​

• 💥 BREAKING: We’ve completely overhauled our design token setup. Don't worry, we’ve also provided a way to keep using the legacy setup for now. Be sure to check out our migration guide. (In the process of doing so, there have been numerous little tweaks to a lot of themes.)

🚀 New Feature​

• <a> tags are able to look like buttons now when placed in <RichContent /> component. !1104
• Added a pickerFooter prop to our <DatePicker /> component. !1071
• Added a timeZone prop to our <DateTime /> component. !1014

🏠 Internal​

• Updates to dependencies
  • react-day-picker: 7.4.10 -> 8.7.1
  • storybook/*: 6.5.16 -> 7.0.9
• Our design tokens are now synced with Figma Tokens Studio.
• Total revamp of chameleon-scripts.
• Lots of performance updates to our CI setup and a lot more yet to come.
• Switched from yarn to pnpm package manager. !1098
• Switched from jest to vitest testing library. !1098
• Drastically improved our CI workflow for Percy snapshot testing !1074
• Started stylelinting our .css files. !1028
• Migrated to storybook v7 !949

🦦 Other​

• 💥 BREAKING: in the process of upgrading to our new setup, there have been numerous tweaks to all of our chameleon-react components. Be sure to check out our migration guide.
• 💥 BREAKING: regarding fonts, our web packages will only contain .woff2 files from now on.
• 💥 BREAKING: chameleon-react and chameleon-swift have had to make some changes, again, please check out our migration guide.

🎨 Themes​

• Updated brand, & brand-fil icons for chameleon-theme-lt. !986
• Updated the Arnhem font to include more glyphs and made some minor edits to the typography scale for chameleon-theme-ds. !1040
• Updated all logos, favicons and color foundations for chameleon-theme-indo. !1042 !1044 !1047

🏠 Internal​

• Updates to dependencies
  • @percy/cli: 1.21.0 -> 1.26.1
  • @percy/storybook: 4.3.5 -> 4.3.6
• Major updates to our CI pipeline including a dockerized node_modules approach. !862