Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update Design Tokens, Add CSS Variables Tests, and Introduce Custom CSS Variables for @charcoal-ui/react #604

Merged
merged 40 commits into from
Nov 20, 2024

Conversation

naporin0624
Copy link
Member

@naporin0624 naporin0624 commented Jul 17, 2024

やったこと

  • Updated design tokens for consistency and adherence to the latest design specifications.
  • Added test cases to verify the correctness and presence of CSS variables.
  • Introduced custom CSS variables specific to @charcoal-ui/react.

動作確認環境

チェックリスト

不要なチェック項目は消して構いません

  • 破壊的変更がある場合には、対象のパッケージのメジャーバージョンが上がっていることを確認した
  • 追加したコンポーネントが index.ts から再 export されている
  • README やドキュメントに影響があることを確認した

@naporin0624 naporin0624 self-assigned this Jul 17, 2024
@naporin0624 naporin0624 changed the base branch from main to v4.0.0 July 17, 2024 08:57
@naporin0624 naporin0624 marked this pull request as ready for review July 17, 2024 08:58
@naporin0624 naporin0624 marked this pull request as draft July 17, 2024 08:58
@naporin0624 naporin0624 force-pushed the naporitan/replace-token1 branch from e868021 to 3a1cc80 Compare July 17, 2024 08:59
Copy link

github-actions bot commented Jul 17, 2024

Visit the preview URL for this PR (updated for commit ce5294c):

https://pixiv-charcoal-web--pr604-naporitan-replace-to-znc9u8yt.web.app

(expires Wed, 27 Nov 2024 06:52:43 GMT)

🔥 via Firebase Hosting GitHub Action 🌎

Sign: 314b26d3adca98a761c7e4d9922ebb206ff024a0

Copy link

github-actions bot commented Jul 17, 2024

Size Change: +426 B (+0.08%)

Total Size: 540 kB

Filename Size Change
./packages/react/dist/index.cjs.js 52.7 kB +106 B (+0.2%)
./packages/react/dist/index.d.ts 2.05 kB +214 B (+11.64%) ⚠️
./packages/react/dist/index.esm.js 47.3 kB +106 B (+0.22%)
ℹ️ View Unchanged
Filename Size
./packages/foundation/dist/border-radius.d.ts 692 B
./packages/foundation/dist/breakpoint.d.ts 225 B
./packages/foundation/dist/color.d.ts 171 B
./packages/foundation/dist/effect.d.ts 1.08 kB
./packages/foundation/dist/grid.d.ts 396 B
./packages/foundation/dist/index.cjs.js 2.82 kB
./packages/foundation/dist/index.d.ts 230 B
./packages/foundation/dist/index.esm.js 1.44 kB
./packages/foundation/dist/spacing.d.ts 305 B
./packages/foundation/dist/typography.d.ts 790 B
./packages/icons-cli/dist/index.js 20.3 kB
./packages/icons/dist/charcoalIconFiles.d.ts 4.74 kB
./packages/icons/dist/index.cjs.js 9.38 kB
./packages/icons/dist/index.d.ts 478 B
./packages/icons/dist/index.esm.js 7.93 kB
./packages/icons/dist/loaders/CharcoalIconFilesLoader.d.ts 7.49 kB
./packages/icons/dist/loaders/CustomIconLoader.d.ts 417 B
./packages/icons/dist/loaders/index.d.ts 181 B
./packages/icons/dist/loaders/Loadable.d.ts 98 B
./packages/icons/dist/loaders/PixivIconLoadError.d.ts 153 B
./packages/icons/dist/PixivIcon.d.ts 1.55 kB
./packages/icons/dist/PixivIcon.story.d.ts 428 B
./packages/icons/dist/PixivIcon.test.d.ts 55 B
./packages/icons/dist/ssr.d.ts 75 B
./packages/pullrequest-cli/dist/index.js 6.9 kB
./packages/react-sandbox/dist/_lib/compat.d.ts 427 B
./packages/react-sandbox/dist/_lib/ComponentAbstraction.d.ts 933 B
./packages/react-sandbox/dist/components/Carousel/index.d.ts 1.35 kB
./packages/react-sandbox/dist/components/CarouselButton/index.d.ts 619 B
./packages/react-sandbox/dist/components/Filter/index.d.ts 1.12 kB
./packages/react-sandbox/dist/components/HintText/index.d.ts 298 B
./packages/react-sandbox/dist/components/icons/Base.d.ts 706 B
./packages/react-sandbox/dist/components/icons/DotsIcon.d.ts 282 B
./packages/react-sandbox/dist/components/icons/InfoIcon.d.ts 87 B
./packages/react-sandbox/dist/components/icons/NextIcon.d.ts 281 B
./packages/react-sandbox/dist/components/icons/WedgeIcon.d.ts 462 B
./packages/react-sandbox/dist/components/Layout/index.d.ts 2.07 kB
./packages/react-sandbox/dist/components/LeftMenu/index.d.ts 382 B
./packages/react-sandbox/dist/components/MenuListItem/index.d.ts 1.8 kB
./packages/react-sandbox/dist/components/Pager/index.d.ts 529 B
./packages/react-sandbox/dist/components/SwitchCheckbox/index.d.ts 340 B
./packages/react-sandbox/dist/components/TextEllipsis/helper.d.ts 235 B
./packages/react-sandbox/dist/components/TextEllipsis/index.d.ts 381 B
./packages/react-sandbox/dist/components/WithIcon/index.d.ts 1.07 kB
./packages/react-sandbox/dist/foundation/constants.d.ts 208 B
./packages/react-sandbox/dist/foundation/hooks.d.ts 1.04 kB
./packages/react-sandbox/dist/foundation/support.d.ts 131 B
./packages/react-sandbox/dist/foundation/utils.d.ts 613 B
./packages/react-sandbox/dist/hooks/index.d.ts 148 B
./packages/react-sandbox/dist/index.cjs.js 63.4 kB
./packages/react-sandbox/dist/index.d.ts 1.38 kB
./packages/react-sandbox/dist/index.esm.js 53.6 kB
./packages/react-sandbox/dist/misc/storybook-helper.d.ts 343 B
./packages/react-sandbox/dist/styled.d.ts 12.3 kB
./packages/react/dist/_lib/compat.d.ts 1.19 kB
./packages/react/dist/_lib/createDivComponent.d.ts 565 B
./packages/react/dist/_lib/index.d.ts 1.02 kB
./packages/react/dist/_lib/useClassNames.d.ts 192 B
./packages/react/dist/_lib/useForwardedRef.d.ts 169 B
./packages/react/dist/components/Button/index.d.ts 692 B
./packages/react/dist/components/Checkbox/CheckboxInput/index.d.ts 628 B
./packages/react/dist/components/Checkbox/CheckboxWithLabel.d.ts 307 B
./packages/react/dist/components/Checkbox/index.d.ts 668 B
./packages/react/dist/components/Clickable/index.d.ts 516 B
./packages/react/dist/components/DropdownSelector/Divider/index.d.ts 105 B
./packages/react/dist/components/DropdownSelector/DropdownMenuItem/index.d.ts 313 B
./packages/react/dist/components/DropdownSelector/DropdownPopover.d.ts 486 B
./packages/react/dist/components/DropdownSelector/index.d.ts 703 B
./packages/react/dist/components/DropdownSelector/ListItem/index.d.ts 490 B
./packages/react/dist/components/DropdownSelector/MenuItem/index.d.ts 771 B
./packages/react/dist/components/DropdownSelector/MenuItem/internals/handleFocusByKeyBoard.d.ts 373 B
./packages/react/dist/components/DropdownSelector/MenuItem/internals/useMenuItemHandleKeyDown.d.ts 480 B
./packages/react/dist/components/DropdownSelector/MenuItemGroup/index.d.ts 414 B
./packages/react/dist/components/DropdownSelector/MenuList/index.d.ts 540 B
./packages/react/dist/components/DropdownSelector/MenuList/internals/getValuesRecursive.d.ts 412 B
./packages/react/dist/components/DropdownSelector/MenuList/MenuListContext.d.ts 405 B
./packages/react/dist/components/DropdownSelector/Popover/index.d.ts 630 B
./packages/react/dist/components/DropdownSelector/Popover/usePreventScroll.d.ts 140 B
./packages/react/dist/components/DropdownSelector/utils/findPreviewRecursive.d.ts 411 B
./packages/react/dist/components/FieldLabel/index.d.ts 492 B
./packages/react/dist/components/Icon/index.d.ts 498 B
./packages/react/dist/components/IconButton/index.d.ts 630 B
./packages/react/dist/components/LoadingSpinner/index.d.ts 678 B
./packages/react/dist/components/Modal/Dialog/index.d.ts 418 B
./packages/react/dist/components/Modal/index.d.ts 2.09 kB
./packages/react/dist/components/Modal/ModalBackgroundContext.d.ts 231 B
./packages/react/dist/components/Modal/ModalPlumbing.d.ts 1.57 kB
./packages/react/dist/components/Modal/useCustomModalOverlay.d.ts 689 B
./packages/react/dist/components/Radio/index.d.ts 494 B
./packages/react/dist/components/Radio/RadioGroup/index.d.ts 699 B
./packages/react/dist/components/Radio/RadioGroupContext.d.ts 339 B
./packages/react/dist/components/Radio/RadioInput/index.d.ts 584 B
./packages/react/dist/components/SegmentedControl/index.d.ts 758 B
./packages/react/dist/components/SegmentedControl/RadioGroupContext.d.ts 362 B
./packages/react/dist/components/Switch/index.d.ts 452 B
./packages/react/dist/components/Switch/SwitchInput/index.d.ts 482 B
./packages/react/dist/components/Switch/SwitchWithLabel.d.ts 308 B
./packages/react/dist/components/TagItem/index.d.ts 730 B
./packages/react/dist/components/TextArea/index.d.ts 1.32 kB
./packages/react/dist/components/TextField/AssistiveText/index.d.ts 543 B
./packages/react/dist/components/TextField/index.d.ts 1.44 kB
./packages/react/dist/components/TextField/useFocusWithClick.d.ts 242 B
./packages/react/dist/core/CharcoalProvider.d.ts 242 B
./packages/react/dist/core/OverlayProvider.d.ts 101 B
./packages/react/dist/core/SSRProvider.d.ts 242 B
./packages/styled/dist/addThemeUtils.story.d.ts 302 B
./packages/styled/dist/builders/border.d.ts 685 B
./packages/styled/dist/builders/borderRadius.d.ts 440 B
./packages/styled/dist/builders/colors.d.ts 1.3 kB
./packages/styled/dist/builders/elementEffect.d.ts 533 B
./packages/styled/dist/builders/o.d.ts 5.91 kB
./packages/styled/dist/builders/outline.d.ts 638 B
./packages/styled/dist/builders/size.d.ts 1.19 kB
./packages/styled/dist/builders/spacing.d.ts 1.17 kB
./packages/styled/dist/builders/transition.d.ts 287 B
./packages/styled/dist/builders/typography.d.ts 624 B
./packages/styled/dist/defineThemeVariables.test.d.ts 66 B
./packages/styled/dist/factories/lib.d.ts 3.96 kB
./packages/styled/dist/helper.d.ts 2.01 kB
./packages/styled/dist/index.cjs.js 30.9 kB
./packages/styled/dist/index.d.ts 6.82 kB
./packages/styled/dist/index.esm.js 27.6 kB
./packages/styled/dist/index.test.d.ts 204 B
./packages/styled/dist/internals/index.d.ts 1.6 kB
./packages/styled/dist/SetThemeScript.d.ts 905 B
./packages/styled/dist/storyHelper.d.ts 386 B
./packages/styled/dist/styles/assertiveRingCss.d.ts 141 B
./packages/styled/dist/styles/disabledCss.d.ts 131 B
./packages/styled/dist/styles/focusVisibleFocusRingCss.d.ts 318 B
./packages/styled/dist/TokenInjector.d.ts 505 B
./packages/styled/dist/util.d.ts 4.24 kB
./packages/styled/dist/utils/addThemeUtils.d.ts 383 B
./packages/styled/dist/utils/CharcoalStyledTheme.d.ts 1.43 kB
./packages/styled/dist/utils/gap.d.ts 473 B
./packages/styled/dist/utils/helpers/pxIfNum.d.ts 99 B
./packages/styled/dist/utils/helpers/SpacingType.d.ts 137 B
./packages/styled/dist/utils/margin.d.ts 905 B
./packages/styled/dist/utils/padding.d.ts 935 B
./packages/styled/dist/utils/typographyCss.d.ts 207 B
./packages/tailwind-config/dist/_lib/compat.d.ts 423 B
./packages/tailwind-config/dist/_lib/TailwindBuild.d.ts 755 B
./packages/tailwind-config/dist/colors/plugin.d.ts 443 B
./packages/tailwind-config/dist/colors/plugin.test.d.ts 52 B
./packages/tailwind-config/dist/colors/toTailwindConfig.d.ts 399 B
./packages/tailwind-config/dist/colors/toTailwindConfig.test.d.ts 62 B
./packages/tailwind-config/dist/colors/utils.d.ts 347 B
./packages/tailwind-config/dist/docs/borderRadius/BorderRadius.d.ts 119 B
./packages/tailwind-config/dist/docs/borderRadius/index.d.ts 175 B
./packages/tailwind-config/dist/docs/colors/Colors.d.ts 107 B
./packages/tailwind-config/dist/docs/colors/index.d.ts 201 B
./packages/tailwind-config/dist/docs/colors/TextBgColor.d.ts 175 B
./packages/tailwind-config/dist/docs/colors/TextBgColor.story.d.ts 298 B
./packages/tailwind-config/dist/docs/colors/TextColors.d.ts 115 B
./packages/tailwind-config/dist/docs/gradient/Gradients.d.ts 113 B
./packages/tailwind-config/dist/docs/gradient/index.d.ts 433 B
./packages/tailwind-config/dist/docs/gradient/utils.d.ts 120 B
./packages/tailwind-config/dist/docs/index.d.ts 360 B
./packages/tailwind-config/dist/docs/screens/index.d.ts 160 B
./packages/tailwind-config/dist/docs/screens/Screens.d.ts 109 B
./packages/tailwind-config/dist/docs/spacing/index.d.ts 160 B
./packages/tailwind-config/dist/docs/spacing/Spacing.d.ts 109 B
./packages/tailwind-config/dist/docs/typography/HalfLeading.d.ts 117 B
./packages/tailwind-config/dist/docs/typography/index.d.ts 346 B
./packages/tailwind-config/dist/docs/typography/Sizes.d.ts 105 B
./packages/tailwind-config/dist/foundation.d.ts 360 B
./packages/tailwind-config/dist/gradient/plugin.d.ts 816 B
./packages/tailwind-config/dist/gradient/plugin.test.d.ts 52 B
./packages/tailwind-config/dist/index.cjs.js 11.4 kB
./packages/tailwind-config/dist/index.d.ts 378 B
./packages/tailwind-config/dist/index.esm.js 9.56 kB
./packages/tailwind-config/dist/index.test.d.ts 51 B
./packages/tailwind-config/dist/types.d.ts 855 B
./packages/tailwind-config/dist/typography/plugin.d.ts 146 B
./packages/tailwind-config/dist/util.d.ts 661 B
./packages/tailwind-diff/dist/commands/check.d.ts 296 B
./packages/tailwind-diff/dist/commands/check.js 4.37 kB
./packages/tailwind-diff/dist/commands/dump.d.ts 185 B
./packages/tailwind-diff/dist/commands/dump.js 1.26 kB
./packages/tailwind-diff/dist/defer.d.ts 164 B
./packages/tailwind-diff/dist/defer.js 792 B
./packages/tailwind-diff/dist/index.d.ts 46 B
./packages/tailwind-diff/dist/index.js 1.84 kB
./packages/tailwind-diff/dist/packageManager.d.ts 323 B
./packages/tailwind-diff/dist/packageManager.js 1.85 kB
./packages/tailwind-diff/dist/style.d.ts 436 B
./packages/tailwind-diff/dist/style.js 2.68 kB
./packages/tailwind-diff/dist/withPackages.d.ts 464 B
./packages/tailwind-diff/dist/withPackages.js 3.24 kB
./packages/theme/dist/abstract-theme.d.ts 1.19 kB
./packages/theme/dist/css/_variables_dark.css.d.ts 26 B
./packages/theme/dist/css/_variables_light.css.d.ts 26 B
./packages/theme/dist/default.d.ts 163 B
./packages/theme/dist/index.cjs.js 5.49 kB
./packages/theme/dist/index.d.ts 121 B
./packages/theme/dist/index.esm.js 3.49 kB
./packages/theme/dist/theme.d.ts 2.87 kB
./packages/theme/dist/token-object/helpers/changecase-keys.d.ts 554 B
./packages/theme/dist/token-object/helpers/changecase-keys.test-d.d.ts 63 B
./packages/theme/dist/token-object/helpers/changecase-keys.test.d.ts 61 B
./packages/theme/dist/token-object/helpers/is-empty-array.d.ts 119 B
./packages/theme/dist/token-object/helpers/nest-object.d.ts 397 B
./packages/theme/dist/token-object/helpers/nest-object.test.d.ts 57 B
./packages/theme/dist/token-object/index.cjs.js 4.9 kB
./packages/theme/dist/token-object/index.d.ts 2.15 kB
./packages/theme/dist/token-object/index.esm.js 3.3 kB
./packages/theme/dist/token-object/reference-token.d.ts 299 B
./packages/theme/dist/token-object/reference-token.test.d.ts 61 B
./packages/theme/dist/token-object/to-token-object.d.ts 828 B
./packages/theme/dist/token-object/token-object.bench.d.ts 59 B
./packages/theme/dist/token-object/token-object.test.d.ts 58 B
./packages/theme/dist/token-object/types.d.ts 614 B
./packages/token-cli/dist/index.js 6.78 kB
./packages/utils/dist/index.cjs.js 6.81 kB
./packages/utils/dist/index.d.ts 3.17 kB
./packages/utils/dist/index.esm.js 4.67 kB

compressed-size-action

@naporin0624 naporin0624 removed the image snapshots update Pull requests that update image snapshots label Oct 23, 2024
Copy link
Contributor

@yue4u yue4u left a comment

Choose a reason for hiding this comment

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

#652 で殆どの問題が修正されたので一旦v4にマージすると良さそうです
TODO:

  • Modal背景
  • SegmentedControlのデザイン更新

@naporin0624 naporin0624 added the image snapshots update Pull requests that update image snapshots label Nov 20, 2024
@naporin0624 naporin0624 merged commit cd29d33 into v4.0.0 Nov 20, 2024
14 of 15 checks passed
@naporin0624 naporin0624 deleted the naporitan/replace-token1 branch November 20, 2024 07:39
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
image snapshots update Pull requests that update image snapshots major
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants