bento-design-system

What’s Changed

• DateField - allow the selection of specific weekdays and disable the other weekdays (#586) @federico-ercoles
• Support overflowing text in Typography components (#567) @federico-ercoles
• Bug: SelectField HTML value not set correctly (#565) @federico-ercoles

🔧 Dependency updates

• chore(deps): update react monorepo (#573) @renovate-bot
• Remove usage of react-use (#569) @gabro
• chore(deps): update dependency webpack to v5.76.3 (#560) @renovate-bot
• fix(deps): update dependency react-markdown to v8.0.6 (#561) @renovate-bot
• chore(deps): update dependency @vanilla-extract/babel-plugin to v1.2.0 (#564) @renovate-bot
• chore(deps): update dependency @types/react to v18.0.29 (#559) @renovate-bot

🧹 Chores

• improve turborepo config (#570) @veej

What’s Changed

• Add more form-related props to Button. Add onKeyDown and onKeyUp to TextField and TextArea. (#551) @bvkimball
• Generate .d.cts files alongside .d.ts files. (#555) @gabro
• Better SSR support (#548) @gabro
• Export default defaultMessages for the English language (#553) @gabro

🔧 Dependency updates

• chore(deps): update dependency style-loader to v3.3.2 (#556) @renovate-bot
• chore(deps): update dependency webpack to v5.76.2 (#557) @renovate-bot
• chore(deps): update dependency @testing-library/react to v13.4.0 (#546) @renovate-bot
• chore(deps): update dependency @testing-library/user-event to v14.4.3 (#547) @renovate-bot
• chore(deps): update dependency @testing-library/dom to v8.20.0 (#545) @renovate-bot
• chore(deps): update dependency webpack to v5.76.0 [security] (#550) @renovate-bot

📚 Documentation

• Add alternativeNames and relatedComponents to ComponentDoc (#554) @gabro

🐞 Bug fixes

• Downgrade sprinkles to v1.4.1 (to solve #540) (#542) @gabro

What’s Changed

💥 Breaking changes

• Add support for ESM (#529) @gabro

Migration guide

For users of ESM-aware bundlers, you will need to update the CSS imports as follows

-import "@buildo/bento-design-system/lib/index.css";
+import "@buildo/bento-design-system/index.css";

🔧 Dependency updates

• fix(deps): update dependency playroom to v0.29.0 (#525) @renovate-bot
• fix(deps): update dependency react-markdown to v8.0.5 (#538) @renovate-bot
• chore(deps): update dependency postcss to v8.4.21 (#528) @renovate-bot
• chore(deps): update actions/add-to-project action to v0.4.1 (#539) @renovate-bot

What’s Changed

• DateField - Limit year options (#531) @federico-ercoles
• Select field mode (#530) @federico-ercoles
• Add config to FileUploaderField to customise button and allow external control of loading status (#533) @federico-ercoles
• fix(docs): Fix typos in Quick Start > Project Structure section (#534) @arabello
• Expand ButtonLink and Menu (#520) @federico-ercoles

🔧 Dependency updates

• chore(deps): update react monorepo (#536) @renovate-bot
• chore(deps): update storybook monorepo to v6.5.16 (#537) @renovate-bot

What’s Changed

• Expand modal and chip config (#519) @federico-ercoles

What’s Changed

• Expand config and props of List/ListItem (#518) @federico-ercoles
• Fix hard-coded empty cell padding for Table (#515) @federico-ercoles

🔧 Dependency updates

• Update dependency husky to v8.0.3 (#517) @renovate-bot
• Update dependency @types/react to v18.0.27 (#516) @renovate-bot

What’s Changed

• Allow interactive rows on Table (#512) @gabro
• Allow separate config of paddingX and paddingY for IconButton (#511) @federico-ercoles
• Allow config of cells and headers padding for Table (#508) @federico-ercoles
• Allow configuring icon position in Button (#510) @gabro
• Allow configuring actions size in Modal (#509) @gabro

🐞 Bug fixes

• Fix arrow position when Tooltip is auto-positioned to the left (#514) @gabro

What’s Changed

• Allow config of background color for Table's even rows (#507) @federico-ercoles
• Allow customizing open indicator icon in SelectField (#505) @gabro
• Add 12 value for borderRadius (#504) @gabro
• Add spacing token 12 (#499) @federico-ercoles
• Input background (#501) @federico-ercoles
• Make checkbox border radius configurable (#498) @federico-ercoles
• Add missing outline to DatePicker (#489) @federico-ercoles

💥 Breaking changes

• Outline icon button (#503) @federico-ercoles
• Allow Body typography for Feedback's medium title (#500) @federico-ercoles
• Allow Body typography for Chip's label (#502) @federico-ercoles

Migration guide

#503 introduces new outline tokens to the theme. This is needed to allow setting the outline of an interactive element (like Button or IconButton) to something different than its content color, which was previously the default. The theme needs to be updated to add these token. A most reasonable default is to use the same values from ...TransparentEnabledForeground for their corresponding outline tokens (e.g. use the same value as primaryTransparentEnabledForeground for outlineInteractivePrimaryEnabled and so on)

#500 and #502 allow Feedback and Chip to configure their typography more flexibly. This is breaking because they now accept configurations object where they were accepting a single string previously. The update requires passing such object instead of the plain value.

🐞 Bug fixes

• Fix vertical Divider (#506) @federico-ercoles

🔧 Dependency updates

• Update dependency @floating-ui/core to v1.1.0 (#492) @renovate-bot
• Update dependency @types/react-table to v7.7.14 (#493) @renovate-bot
• Update dependency css-loader to v6.7.3 (#496) @renovate-bot
• Update dependency docusaurus-plugin-react-docgen-typescript to v1.0.2 (#497) @renovate-bot
• Update dependency @vanilla-extract/dynamic to v2.0.3 (#491) @renovate-bot
• Update dependency @types/react-dom to v18.0.10 (#490) @renovate-bot

What’s Changed

• Expose Chart resources to allow creating custom charts (#486) @federico-ercoles
• Make charts Tooltip follow Card style (#482) @federico-ercoles
• Add support for units of measurement on BarChart component (#476) @federico-ercoles

🐞 Bug fixes

• ButtonLink Avoid passing "icon" to the link component (#478) @gabro

🔧 Dependency updates

• Update dependency @types/react-dom to v18.0.9 (#481) @renovate-bot
• Update dependency @floating-ui/dom to v1.0.12 (#480) @renovate-bot

What’s Changed

• Add rightAccessory to NumberField and NumberInput (#475) @gabro

🐞 Bug fixes

• Show rightAccessory in ReadOnlyField (#474) @gabro
• Add missing padding in Table and column cells (#467) @gabro
• Downgrade @react-aria/focus to fix issue with React strict mode (#466) @gabro

🔧 Dependency updates

• Update dependency @floating-ui/core to v1.0.4 (#468) @renovate-bot
• Update dependency @floating-ui/dom to v1.0.9 (#469) @renovate-bot
• Update dependency @types/react to v18.0.26 (#465) @renovate-bot
• Update dependency @floating-ui/react-dom to v1.0.1 (#464) @renovate-bot

What’s Changed

• Basic charts (#442) @gabro

🐞 Bug fixes

• Remove IsMulti type parameter from SelectField (#462) @gabro

⚠️ This fixes a bug where SelectField required explicit type annotations to work. If you were doing that, the code won't compile anymore since we removed the second type parameter. The easiest fix is to remove the explicit type annotation.

• Allow passing Children to CheckboxField label (#461) @gabro
• Allow deselecting an option when clicking in SelectField (#460) @gabro

🔧 Dependency updates

• Upgrade sprinkles (#459) @gabro

What’s Changed

• Add onChangeEnd to SliderField (#454) @gabro
• Add FileUploaderField component (#453) @gabro
• Make FieldProp name and onBlur optional (#456) @gabro

🐞 Bug fixes

• Honor bento config for MultiValue message in SelectField (#455) @gabro

🔧 Dependency updates

• Update dependency @floating-ui/dom to v1.0.7 (#458) @renovate-bot
• Update dependency @floating-ui/core to v1.0.2 (#457) @renovate-bot

What’s Changed

• Add copy functionality to ReadOnlyField (#452) @gabro
• Add rightAccessory to TextField (also fixes #424) (#451) @gabro

What’s Changed

• Add several customizations for tableColumn types + allow customzing Feedback size of empty tables (#447) @gabro
• Force Tooltip position (#379) @federico-ercoles
• Add baseline option for alignY (#446) @gabro

What’s Changed

• Add brand colors to icon props (#444) @gabro

🐞 Bug fixes

• Remove stray textTransform: uppercase (#445) @gabro

What’s Changed

• Add Title as valid typography for Feedback title (#443) @gabro

💥 Breaking changes

• Improve underline configuration (#434) @marcopiii
• Uniform the color prop of typography components (#432) @marcopiii

Migration strategy

• #432 deprecates the "default" color value for typography components (except for Label). If you were using <Body color="default" /> it's now recommended to use <Body color="primary" /> instead (which preserves the same behavior). "default" is kept around for compatibility purposes but it will be removed in the future.
• #432 also introduces a breaking change for the typography "recipes" (bodyRecipe, titleRecipe, and so on). Specifically:
  • bodyRecipe does not accept "default" as value for color anymore (use "primary" instead)
  • displayRecipe, headlineRecipe and titleRecipe now require a color parameter (use "primary" to preserve the previous behavior)
• #434 reduces the set of valid colors for the Navigation underline configuration. This has no direct replacement since the colors we removed did not make sense semantically for an underline, so we don't expect anyone was using them. If this change breaks your configuration, please open a discussion.
• #434 also changes the configuration type for Tab's lineHeight configuration. If you were customizing this value you now have to use an object like { medium: 2, large: 2 } instead of a plain value.

🐞 Bug fixes

• Fix the alignment of labels in fill-parent Tabs (#433) @marcopiii

🔧 Dependency updates

• Update dependency tsup to v6 (#441) @renovate-bot
• Update pnpm to v7.15.0 (#440) @renovate-bot
• Update dependency css-loader to v6.7.2 (#438) @renovate-bot
• Update dependency husky to v8.0.2 (#439) @renovate-bot
• Update dependency @types/react-dom to v18.0.8 (#429) @renovate-bot
• Update dependency @types/react to v18.0.25 (#428) @renovate-bot
• Update dependency @floating-ui/dom to v1.0.4 (#418) @renovate-bot
• Update dependency @types/react to v18.0.24 (#419) @renovate-bot
• Update dependency @floating-ui/dom to v1.0.3 (#415) @renovate-bot
• Update storybook monorepo to v6.5.13 (#416) @renovate-bot
• Update dependency postcss to v8.4.18 (#413) @renovate-bot
• Update react-aria monorepo (#414) @renovate-bot

🧹 Chores

• Add detection of circular dependencies (#426) @gabro
• Avoid including react-dom in the bundle (#420) @gabro

📚 Documentation

• Add NumberField documentation (#412) @gabro

What’s Changed

• Deprecate IllustrationProps "style" in favor of "kind" (#411) @gabro
• Allow customizing Table column header background/foreground (#407) @gabro
• Make it easier to customize the default Navigation active element (#408) @gabro
• Add TimeField component (#391) @gabro
• Add 0 to radius allowed values (#399) @gabro

💥 Breaking changes

• Make sure Toast action Bleed matches the action button size (#406) @gabro
• Remove unused iconSize from InputConfig (#410) @gabro

⏩ Migration strategy

The breaking changes above remove two config options, specifically config.toast.smallButtonPaddingY and config.input.iconSize.

config.toast.smallButtonPaddingY isn't needed anymore since we're now able to infer it from the Button config automatically, you just need to remove it from your custom config, if you were using it.

config.input.iconSize was simply unused, so it wasn't already having any effect and it can be safely removed. If you need to customize the size of icons inside input fields, look for more specific options like passwordIconSize.

🐞 Bug fixes

• Make sure Toast action Bleed matches the action button size (#406) @gabro
• Add Outline/Container border to SelectField Menu (#404) @gabro
• Use sprinkles from context instead of bentoSprinkles (#396) @gabro

🔧 Dependency updates

• Update dependency postcss to v8.4.17 (#392) @renovate-bot
• Update dependency ts-jest to v28.0.8 (#393) @renovate-bot

📚 Documentation

• Fix DisclosureGroup GitHub link (#398) @gabro
• Add DisclosureGroup documentation (#390) @gabro
• Fix playroom deploy (#389) @gabro

What’s Changed

🐞 Bug fixes

• Make SelectField use its own List config (#387) @gabro
• Fix bug when nesting BentoConfigProvider (#386) @gabro
• Certain navigation components don't trigger their action (#383) @federico-ercoles

🔧 Dependency updates

• Update dependency @floating-ui/dom to v1.0.2 (#384) @renovate-bot
• Update dependency @types/react to v18.0.21 (#385) @renovate-bot

🧹 Chores

• Migrate storybook to new 0.13 API and cleanup formatMessage (#361) @gabro

📚 Documentation

• Improve documentation about tsup config setup (#388) @gabro

What’s Changed

🐞 Bug fixes

• Make @vanilla-extract/css a dependency (#382) @gabro