Skip to content

IBX-10191: Update various variables and names to match figma changes#7

Merged
GrabowskiM merged 1 commit intomainfrom
IBX-10191
Jun 26, 2025
Merged

IBX-10191: Update various variables and names to match figma changes#7
GrabowskiM merged 1 commit intomainfrom
IBX-10191

Conversation

@GrabowskiM
Copy link
Copy Markdown
Contributor

🎫 Issue IBX-10191

Description:

For QA:

Documentation:

Copy link
Copy Markdown

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull Request Overview

This pull request updates variable names and values to align with the latest Figma design changes. Key changes include:

  • Updates to component classes and default prop values across multiple UI components.
  • Renaming and value adjustments for icon sizes, button types, and SCSS variables to reflect the new design tokens.
  • Revision of SCSS mixins and variables to support updated typography and spacing requirements.

Reviewed Changes

Copilot reviewed 14 out of 14 changed files in this pull request and generated no comments.

Show a summary per file
File Description
packages/components/src/internal/partials/BaseInput/BaseInput.tsx Updated class name generation pattern with unconditional inclusion of type and size.
packages/components/src/Label/Label.tsx Updated class name generation for extraClasses with boolean conversion.
packages/components/src/Icon/Icon.types.ts Renamed and updated icon size values and made size prop optional.
packages/components/src/Icon/Icon.tsx Changed default size from undefined to 'small' and updated class name generation.
packages/components/src/Icon/Icon.stories.tsx Renamed story exports and updated icon size references.
packages/components/src/Expander/Expander.tsx Updated expander type value for design consistency.
packages/components/src/Button/Button.types.ts Adjusted button size and type values according to new design tokens.
packages/components/src/Button/Button.tsx Updated default prop values and class name generation for consistency with design updates.
packages/components/src/Button/Button.stories.tsx Updated button story names and prop values to match new design terminology.
packages/assets/src/scss/variables/_typography.scss Introduced a new alternative font family variable.
packages/assets/src/scss/mixins/_headers.scss Updated mixin font-family and font-size references to use new typography variables.
packages/assets/src/scss/_variables.scss Added a new border-radius variable.
packages/assets/src/scss/_icons.scss Revised icon size mappings and adjusted default icon dimensions.
packages/assets/src/scss/_buttons.scss Updated button type and size mappings to reflect the updated design tokens.
Comments suppressed due to low confidence (2)

packages/components/src/Icon/Icon.tsx:9

  • Since the default value for 'size' has changed from undefined to 'small', consider updating inline documentation or type comments to clearly indicate this new default behavior.
const Icon = ({ cssClass = '', name, customPath, size = 'small' }: IconProps) => {

packages/assets/src/scss/_icons.scss:17

  • Icon dimensions have been significantly reduced from calculateRem(32px) to calculateRem(16px). Please verify that this change is fully aligned with the new design specifications and layout requirements.
    width: calculateRem(16px);

'ids-btn': true,
[`ids-btn--${type}`]: !!type,
[`ids-btn--${size}`]: !!size,
[`ids-btn--${type}`]: true,
Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

as we use TypeScript both type and size accepts only specific string values, so both these conditions always be true

[`ids-btn--${size}`]: true,
'ids-btn--disabled': disabled,
[extraClasses]: true,
[extraClasses]: !!extraClasses,
Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

true probably was ok as '' won't be visible either way, but I prefer this check, it's more clear for me

import { IconProps } from './Icon.types';

const Icon = ({ cssClass = '', name, customPath, size = undefined }: IconProps) => {
const Icon = ({ cssClass = '', name, customPath, size = 'small' }: IconProps) => {
Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

adjust to other components that doesn't allow for undefined values, "default" (without size modifier) is same as "small" in css

@GrabowskiM GrabowskiM merged commit 723ad59 into main Jun 26, 2025
4 checks passed
@GrabowskiM GrabowskiM deleted the IBX-10191 branch June 26, 2025 07:43
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants