search

pixiv / charcoal

Design system library by pixiv
https://charcoal-web.pixiv.design/
Apache License 2.0
319 stars 35 forks source link

Fix: Resolved unexpected button width issue when `as="a"`. #489

Closed toshusai closed 7 months ago

toshusai commented 7 months ago

やったこと

ex.

<Button fullWidth as="a">Link</Button>
github-actions[bot] commented 7 months ago

Size Change: -4.89 kB (-1%)

Total Size: 619 kB

Filename Size Change
./packages/react/dist/components/Button/index.d.ts 573 B +67 B (+13%) ⚠️
./packages/react/dist/components/Button/index.story.d.ts 1.24 kB +134 B (+12%) ⚠️
./packages/react/dist/components/Button/lib/variantToBackground.d.ts 0 B -209 B (removed) 🏆
./packages/react/dist/components/Button/lib/variantToFont.d.ts 0 B -154 B (removed) 🏆
./packages/react/dist/components/Button/StyledButton.d.ts 0 B -704 B (removed) 🏆
./packages/react/dist/index.cjs.js 92.8 kB -2.18 kB (-2%)
./packages/react/dist/index.esm.js 83.9 kB -2.05 kB (-2%)
./packages/react/dist/_lib/useClassNames.d.ts 203 B +203 B (new file) 🆕
ℹ️ 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.61 kB | | `./packages/icons/dist/index.cjs.js` | 9.47 kB | | `./packages/icons/dist/index.d.ts` | 478 B | | `./packages/icons/dist/index.esm.js` | 7.96 kB | | `./packages/icons/dist/loaders/CharcoalIconFilesLoader.d.ts` | 7.3 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.46 kB | | `./packages/icons/dist/PixivIcon.story.d.ts` | 973 B | | `./packages/icons/dist/PixivIcon.test.d.ts` | 55 B | | `./packages/icons/dist/ssr.d.ts` | 75 B | | `./packages/react-sandbox/dist/_lib/compat.d.ts` | 427 B | | `./packages/react-sandbox/dist/components/Carousel/index.d.ts` | 1.35 kB | | `./packages/react-sandbox/dist/components/Carousel/index.story.d.ts` | 188 B | | `./packages/react-sandbox/dist/components/CarouselButton/index.d.ts` | 619 B | | `./packages/react-sandbox/dist/components/CarouselButton/index.story.d.ts` | 323 B | | `./packages/react-sandbox/dist/components/Filter/index.d.ts` | 1.12 kB | | `./packages/react-sandbox/dist/components/Filter/index.story.d.ts` | 374 B | | `./packages/react-sandbox/dist/components/HintText/index.d.ts` | 298 B | | `./packages/react-sandbox/dist/components/HintText/index.story.d.ts` | 312 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/Layout/index.story.d.ts` | 402 B | | `./packages/react-sandbox/dist/components/LeftMenu/index.d.ts` | 382 B | | `./packages/react-sandbox/dist/components/MenuListItem/index.d.ts` | 1.79 kB | | `./packages/react-sandbox/dist/components/MenuListItem/index.story.d.ts` | 725 B | | `./packages/react-sandbox/dist/components/Pager/index.d.ts` | 529 B | | `./packages/react-sandbox/dist/components/Pager/index.story.d.ts` | 1.08 kB | | `./packages/react-sandbox/dist/components/SwitchCheckbox/index.d.ts` | 340 B | | `./packages/react-sandbox/dist/components/SwitchCheckbox/index.story.d.ts` | 429 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/TextEllipsis/index.story.d.ts` | 345 B | | `./packages/react-sandbox/dist/components/WithIcon/index.d.ts` | 1.07 kB | | `./packages/react-sandbox/dist/components/WithIcon/index.story.d.ts` | 609 B | | `./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` | 62.9 kB | | `./packages/react-sandbox/dist/index.d.ts` | 1.34 kB | | `./packages/react-sandbox/dist/index.esm.js` | 53.2 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.54 kB | | `./packages/react/dist/_lib/index.d.ts` | 1.02 kB | | `./packages/react/dist/_lib/useForwardedRef.d.ts` | 169 B | | `./packages/react/dist/components/a11y.test.d.ts` | 50 B | | `./packages/react/dist/components/Checkbox/index.d.ts` | 787 B | | `./packages/react/dist/components/Checkbox/index.story.d.ts` | 512 B | | `./packages/react/dist/components/Clickable/index.d.ts` | 747 B | | `./packages/react/dist/components/Clickable/index.story.d.ts` | 400 B | | `./packages/react/dist/components/DropdownSelector/Divider.d.ts` | 230 B | | `./packages/react/dist/components/DropdownSelector/DropdownMenuItem.d.ts` | 308 B | | `./packages/react/dist/components/DropdownSelector/DropdownPopover.d.ts` | 486 B | | `./packages/react/dist/components/DropdownSelector/index.d.ts` | 629 B | | `./packages/react/dist/components/DropdownSelector/index.story.d.ts` | 1.25 kB | | `./packages/react/dist/components/DropdownSelector/ListItem/index.d.ts` | 668 B | | `./packages/react/dist/components/DropdownSelector/ListItem/index.story.d.ts` | 437 B | | `./packages/react/dist/components/DropdownSelector/MenuItem/index.d.ts` | 511 B | | `./packages/react/dist/components/DropdownSelector/MenuItem/internals/handleFocusByKeyBoard.d.ts` | 373 B | | `./packages/react/dist/components/DropdownSelector/MenuItem/internals/useMenuItemHandleKeyDown.d.ts` | 483 B | | `./packages/react/dist/components/DropdownSelector/MenuItemGroup/index.d.ts` | 476 B | | `./packages/react/dist/components/DropdownSelector/MenuList/index.d.ts` | 699 B | | `./packages/react/dist/components/DropdownSelector/MenuList/index.story.d.ts` | 455 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` | 632 B | | `./packages/react/dist/components/DropdownSelector/Popover/index.story.d.ts` | 298 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` | 470 B | | `./packages/react/dist/components/Icon/index.d.ts` | 498 B | | `./packages/react/dist/components/Icon/index.story.d.ts` | 404 B | | `./packages/react/dist/components/IconButton/index.d.ts` | 605 B | | `./packages/react/dist/components/IconButton/index.story.d.ts` | 573 B | | `./packages/react/dist/components/LoadingSpinner/index.d.ts` | 656 B | | `./packages/react/dist/components/LoadingSpinner/index.story.d.ts` | 410 B | | `./packages/react/dist/components/LoadingSpinner/LoadingSpinnerIcon.story.d.ts` | 459 B | | `./packages/react/dist/components/Modal/__stories__/InternalScrollStory.d.ts` | 189 B | | `./packages/react/dist/components/Modal/Dialog/index.d.ts` | 1.6 kB | | `./packages/react/dist/components/Modal/index.d.ts` | 1.94 kB | | `./packages/react/dist/components/Modal/index.story.d.ts` | 1.13 kB | | `./packages/react/dist/components/Modal/ModalBackgroundContext.d.ts` | 231 B | | `./packages/react/dist/components/Modal/ModalPlumbing.d.ts` | 510 B | | `./packages/react/dist/components/Modal/useCustomModalOverlay.d.ts` | 632 B | | `./packages/react/dist/components/MultiSelect/context.d.ts` | 394 B | | `./packages/react/dist/components/MultiSelect/index.d.ts` | 1.2 kB | | `./packages/react/dist/components/MultiSelect/index.story.d.ts` | 2.11 kB | | `./packages/react/dist/components/MultiSelect/index.test.d.ts` | 51 B | | `./packages/react/dist/components/Radio/index.d.ts` | 1.03 kB | | `./packages/react/dist/components/Radio/index.story.d.ts` | 886 B | | `./packages/react/dist/components/Radio/index.test.d.ts` | 51 B | | `./packages/react/dist/components/SegmentedControl/index.d.ts` | 736 B | | `./packages/react/dist/components/SegmentedControl/index.story.d.ts` | 495 B | | `./packages/react/dist/components/SegmentedControl/RadioGroupContext.d.ts` | 362 B | | `./packages/react/dist/components/Switch/index.d.ts` | 512 B | | `./packages/react/dist/components/Switch/index.story.d.ts` | 553 B | | `./packages/react/dist/components/TagItem/index.d.ts` | 1.2 kB | | `./packages/react/dist/components/TagItem/index.story.d.ts` | 967 B | | `./packages/react/dist/components/TextArea/index.d.ts` | 1.09 kB | | `./packages/react/dist/components/TextArea/TextArea.story.d.ts` | 576 B | | `./packages/react/dist/components/TextField/index.d.ts` | 1.53 kB | | `./packages/react/dist/components/TextField/TextField.story.d.ts` | 805 B | | `./packages/react/dist/components/TextField/useFocusWithClick.d.ts` | 242 B | | `./packages/react/dist/core/CharcoalProvider.d.ts` | 656 B | | `./packages/react/dist/core/ComponentAbstraction.d.ts` | 933 B | | `./packages/react/dist/core/OverlayProvider.d.ts` | 101 B | | `./packages/react/dist/core/SSRProvider.d.ts` | 88 B | | `./packages/react/dist/index.d.ts` | 2.05 kB | | `./packages/react/dist/styled.d.ts` | 12.3 kB | | `./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.story.d.ts` | 294 B | | `./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` | 418 B | | `./packages/tailwind-config/dist/_lib/TailwindBuild.d.ts` | 750 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` | 394 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.5 kB | | `./packages/tailwind-config/dist/index.d.ts` | 373 B | | `./packages/tailwind-config/dist/index.esm.js` | 9.6 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` | 656 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` | 815 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/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/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

github-actions[bot] commented 7 months ago

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

https://pixiv-charcoal-web--pr489-toshusai-fix-button-ue7p6807.web.app

(expires Mon, 25 Mar 2024 02:09:46 GMT)

🔥 via Firebase Hosting GitHub Action 🌎

Sign: 314b26d3adca98a761c7e4d9922ebb206ff024a0