[Feature] 액션시트 컴포넌트 구현 #165

hamo-o · 2024-09-16T19:42:30Z

🎉 변경 사항

액션시트 컴포넌트를 구현합니다.

🚩 관련 이슈

[Feature] ActionSheet 컴포넌트 구현 #97

🙏 여기는 꼭 봐주세요!

1-1. 문제상황

export interface ActionSheetProps {
  children:
    | [
        ReactElement<typeof ActionSheetHeader>,
        ReactElement<typeof ActionSheetFooter>,
      ]
    | [
        ReactElement<typeof ActionSheetHeader>,
        ReactElement<typeof ActionSheetBody>,
        ReactElement<typeof ActionSheetFooter>,
      ];
  isOpen: boolean;
  onClose: () => void;
  style?: CSSProperties;
  className?: string;
}

ReactElement 타입이면서, 원하는 컴포넌트의 타입을 제네릭으로 받으면 prop 타입을 제한할 수 있으니 children 의 형식과 타입을 제한할 수 있다고 생각했습니다.
즉 ReactElement 중에서도 ActionSheetHeader 에서 정의한 prop 을 받아야 만족하는 것으로 예상했습니다.
그러나 그냥 ReactElement 로 children 개수만 맞추면 타입체킹에서 걸리지 않았습니다…

1-2. 해결방법으로 알아봤던 것들

-> 결국 안된다는 것 같은데, 혹시 다른 아이디어가 있으시면 리뷰 부탁드립니다..

2-1. 패키지 버전업 & 탭 컴포넌트

자꾸 접근성에서 걸려서 봤더니 스토리북 관련 패키지 버전 문제라 버전업했어요!
탭 컴포넌트에서 뜬금 테스트 실패해서 임시 가드처리 해두었습니다 47c7dcc

changeset-bot · 2025-02-03T16:28:03Z

⚠️ No Changeset found

Latest commit: 2025364

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

github-actions · 2025-02-03T16:31:16Z

🚀 storybook: https://663657b8272769a8d18a5e3f-mnawpxlwfk.chromatic.com/

GDSChongik · 2025-02-03T16:47:36Z

Size Change: +21.4 kB (+3.15%)

Total Size: 702 kB

Filename	Size	Change
`./packages/wow-ui/dist/styles.css`	50.6 kB	+1.36 kB (+2.77%)
`./packages/wow-ui/dist/ActionSheet.cjs`	1.74 kB	+1.74 kB (new file)	🆕
`./packages/wow-ui/dist/ActionSheet.js`	1.86 kB	+1.86 kB (new file)	🆕
`./packages/wow-ui/dist/ActionSheetBody.cjs`	487 B	+487 B (new file)	🆕
`./packages/wow-ui/dist/ActionSheetBody.js`	722 B	+722 B (new file)	🆕
`./packages/wow-ui/dist/ActionSheetFooter.cjs`	470 B	+470 B (new file)	🆕
`./packages/wow-ui/dist/ActionSheetFooter.js`	705 B	+705 B (new file)	🆕
`./packages/wow-ui/dist/ActionSheetHeader-fUeqUQjT.js`	844 B	+844 B (new file)	🆕
`./packages/wow-ui/dist/ActionSheetHeader.cjs`	355 B	+355 B (new file)	🆕
`./packages/wow-ui/dist/ActionSheetHeader.js`	1.11 kB	+1.11 kB (new file)	🆕
`./packages/wow-ui/dist/components/ActionSheet`	4.1 kB	+4.1 kB (new file)	🆕
`./packages/wow-ui/dist/components/ActionSheet/ActionSheetBody.d.ts`	578 B	+578 B (new file)	🆕
`./packages/wow-ui/dist/components/ActionSheet/ActionSheetBody.d.ts.map`	390 B	+390 B (new file)	🆕
`./packages/wow-ui/dist/components/ActionSheet/ActionSheetContext.d.ts`	323 B	+323 B (new file)	🆕
`./packages/wow-ui/dist/components/ActionSheet/ActionSheetContext.d.ts.map`	286 B	+286 B (new file)	🆕
`./packages/wow-ui/dist/components/ActionSheet/ActionSheetContext.js`	183 B	+183 B (new file)	🆕
`./packages/wow-ui/dist/components/ActionSheet/ActionSheetFooter.d.ts`	808 B	+808 B (new file)	🆕
`./packages/wow-ui/dist/components/ActionSheet/ActionSheetFooter.d.ts.map`	560 B	+560 B (new file)	🆕
`./packages/wow-ui/dist/components/ActionSheet/ActionSheetHeader.d.ts`	826 B	+826 B (new file)	🆕
`./packages/wow-ui/dist/components/ActionSheet/ActionSheetHeader.d.ts.map`	431 B	+431 B (new file)	🆕
`./packages/wow-ui/dist/components/ActionSheet/ActionSheetOverlay.d.ts`	164 B	+164 B (new file)	🆕
`./packages/wow-ui/dist/components/ActionSheet/ActionSheetOverlay.d.ts.map`	215 B	+215 B (new file)	🆕
`./packages/wow-ui/dist/components/ActionSheet/ActionSheetOverlay.js`	469 B	+469 B (new file)	🆕
`./packages/wow-ui/dist/components/ActionSheet/index.d.ts`	1.71 kB	+1.71 kB (new file)	🆕
`./packages/wow-ui/dist/components/ActionSheet/index.d.ts.map`	732 B	+732 B (new file)	🆕

ℹ️ View Unchanged

Filename	Size
`./packages/wow-ui/dist/assets`	4.1 kB
`./packages/wow-ui/dist/assets/lotties`	4.1 kB
`./packages/wow-ui/dist/assets/lotties/blueSpinner.json.js`	4.99 kB
`./packages/wow-ui/dist/assets/lotties/rainbowSpinner.json.js`	5 kB
`./packages/wow-ui/dist/Avatar.cjs`	1.44 kB
`./packages/wow-ui/dist/Avatar.js`	1.73 kB
`./packages/wow-ui/dist/BlueSpinner.cjs`	5.17 kB
`./packages/wow-ui/dist/BlueSpinner.js`	554 B
`./packages/wow-ui/dist/Box.cjs`	2.86 kB
`./packages/wow-ui/dist/Box.js`	2.44 kB
`./packages/wow-ui/dist/Button.cjs`	2.18 kB
`./packages/wow-ui/dist/Button.js`	2.5 kB
`./packages/wow-ui/dist/Checkbox.cjs`	2.71 kB
`./packages/wow-ui/dist/Checkbox.js`	2.88 kB
`./packages/wow-ui/dist/Chip.cjs`	2.17 kB
`./packages/wow-ui/dist/Chip.js`	2.43 kB
`./packages/wow-ui/dist/clsx-E3yX_9sL.js`	384 B
`./packages/wow-ui/dist/CollectionContext-CABmbcnC.js`	320 B
`./packages/wow-ui/dist/CollectionContext-U7d0_GgH.js`	477 B
`./packages/wow-ui/dist/components`	4.1 kB
`./packages/wow-ui/dist/components/Avatar`	4.1 kB
`./packages/wow-ui/dist/components/Avatar/index.d.ts`	1.61 kB
`./packages/wow-ui/dist/components/Avatar/index.d.ts.map`	889 B
`./packages/wow-ui/dist/components/Box`	4.1 kB
`./packages/wow-ui/dist/components/Box/index.d.ts`	2.47 kB
`./packages/wow-ui/dist/components/Box/index.d.ts.map`	872 B
`./packages/wow-ui/dist/components/Button`	4.1 kB
`./packages/wow-ui/dist/components/Button/index.d.ts`	1.61 kB
`./packages/wow-ui/dist/components/Button/index.d.ts.map`	887 B
`./packages/wow-ui/dist/components/Checkbox`	4.1 kB
`./packages/wow-ui/dist/components/Checkbox/index.d.ts`	2.42 kB
`./packages/wow-ui/dist/components/Checkbox/index.d.ts.map`	792 B
`./packages/wow-ui/dist/components/Chip`	4.1 kB
`./packages/wow-ui/dist/components/Chip/index.d.ts`	1.54 kB
`./packages/wow-ui/dist/components/Chip/index.d.ts.map`	750 B
`./packages/wow-ui/dist/components/Divider`	4.1 kB
`./packages/wow-ui/dist/components/Divider/index.d.ts`	821 B
`./packages/wow-ui/dist/components/Divider/index.d.ts.map`	384 B
`./packages/wow-ui/dist/components/DropDown`	4.1 kB
`./packages/wow-ui/dist/components/DropDown/context`	4.1 kB
`./packages/wow-ui/dist/components/DropDown/context/CollectionContext.d.ts`	506 B
`./packages/wow-ui/dist/components/DropDown/context/CollectionContext.d.ts.map`	530 B
`./packages/wow-ui/dist/components/DropDown/context/CollectionContext.js`	411 B
`./packages/wow-ui/dist/components/DropDown/context/DropDownContext.d.ts`	956 B
`./packages/wow-ui/dist/components/DropDown/context/DropDownContext.d.ts.map`	263 B
`./packages/wow-ui/dist/components/DropDown/context/DropDownContext.js`	180 B
`./packages/wow-ui/dist/components/DropDown/DropDownOption.d.ts`	914 B
`./packages/wow-ui/dist/components/DropDown/DropDownOption.d.ts.map`	452 B
`./packages/wow-ui/dist/components/DropDown/DropDownOptionList.d.ts`	358 B
`./packages/wow-ui/dist/components/DropDown/DropDownOptionList.d.ts.map`	343 B
`./packages/wow-ui/dist/components/DropDown/DropDownOptionList.js`	1.95 kB
`./packages/wow-ui/dist/components/DropDown/DropDownTrigger.d.ts`	432 B
`./packages/wow-ui/dist/components/DropDown/DropDownTrigger.d.ts.map`	426 B
`./packages/wow-ui/dist/components/DropDown/DropDownTrigger.js`	2.61 kB
`./packages/wow-ui/dist/components/DropDown/DropDownWrapper.d.ts`	501 B
`./packages/wow-ui/dist/components/DropDown/DropDownWrapper.d.ts.map`	474 B
`./packages/wow-ui/dist/components/DropDown/DropDownWrapper.js`	1.07 kB
`./packages/wow-ui/dist/components/DropDown/index.d.ts`	2.88 kB
`./packages/wow-ui/dist/components/DropDown/index.d.ts.map`	957 B
`./packages/wow-ui/dist/components/Header`	4.1 kB
`./packages/wow-ui/dist/components/Header/index.d.ts`	1.1 kB
`./packages/wow-ui/dist/components/Header/index.d.ts.map`	482 B
`./packages/wow-ui/dist/components/MultiGroup`	4.1 kB
`./packages/wow-ui/dist/components/MultiGroup/index.d.ts`	2.12 kB
`./packages/wow-ui/dist/components/MultiGroup/index.d.ts.map`	825 B
`./packages/wow-ui/dist/components/MultiGroup/MultiGroupContext.d.ts`	953 B
`./packages/wow-ui/dist/components/MultiGroup/MultiGroupContext.d.ts.map`	419 B
`./packages/wow-ui/dist/components/MultiGroup/MultiGroupContext.js`	136 B
`./packages/wow-ui/dist/components/Pagination`	4.1 kB
`./packages/wow-ui/dist/components/Pagination/index.d.ts`	1.44 kB
`./packages/wow-ui/dist/components/Pagination/index.d.ts.map`	561 B
`./packages/wow-ui/dist/components/Picker`	4.1 kB
`./packages/wow-ui/dist/components/Picker/DateDropDown.d.ts`	677 B
`./packages/wow-ui/dist/components/Picker/DateDropDown.d.ts.map`	612 B
`./packages/wow-ui/dist/components/Picker/pickerButtonStyle.css.d.ts`	1.05 kB
`./packages/wow-ui/dist/components/Picker/pickerButtonStyle.css.d.ts.map`	230 B
`./packages/wow-ui/dist/components/Picker/pickerButtonStyle.css.js`	1.11 kB
`./packages/wow-ui/dist/components/Picker/pickerClassNames.d.ts`	196 B
`./packages/wow-ui/dist/components/Picker/pickerClassNames.d.ts.map`	283 B
`./packages/wow-ui/dist/components/Picker/pickerClassNames.js`	894 B
`./packages/wow-ui/dist/components/Picker/pickerComponents.d.ts`	196 B
`./packages/wow-ui/dist/components/Picker/pickerComponents.d.ts.map`	278 B
`./packages/wow-ui/dist/components/Picker/pickerComponents.js`	1.12 kB
`./packages/wow-ui/dist/components/Picker/PickerContext.d.ts`	553 B
`./packages/wow-ui/dist/components/Picker/PickerContext.d.ts.map`	562 B
`./packages/wow-ui/dist/components/Picker/PickerContext.js`	139 B
`./packages/wow-ui/dist/components/Picker/PickerGroup.d.ts`	447 B
`./packages/wow-ui/dist/components/Picker/PickerGroup.d.ts.map`	400 B
`./packages/wow-ui/dist/components/Picker/RangeDatePicker.d.ts`	488 B
`./packages/wow-ui/dist/components/Picker/RangeDatePicker.d.ts.map`	434 B
`./packages/wow-ui/dist/components/Picker/SingleDatePicker.d.ts`	508 B
`./packages/wow-ui/dist/components/Picker/SingleDatePicker.d.ts.map`	445 B
`./packages/wow-ui/dist/components/Picker/TimePicker.d.ts`	466 B
`./packages/wow-ui/dist/components/Picker/TimePicker.d.ts.map`	387 B
`./packages/wow-ui/dist/components/RadioGroup`	4.1 kB
`./packages/wow-ui/dist/components/RadioGroup/RadioButton.d.ts`	1.3 kB
`./packages/wow-ui/dist/components/RadioGroup/RadioButton.d.ts.map`	513 B
`./packages/wow-ui/dist/components/RadioGroup/RadioContext.d.ts`	848 B
`./packages/wow-ui/dist/components/RadioGroup/RadioContext.d.ts.map`	451 B
`./packages/wow-ui/dist/components/RadioGroup/RadioContext.js`	134 B
`./packages/wow-ui/dist/components/RadioGroup/RadioGroup.d.ts`	710 B
`./packages/wow-ui/dist/components/RadioGroup/RadioGroup.d.ts.map`	407 B
`./packages/wow-ui/dist/components/SearchBar`	4.1 kB
`./packages/wow-ui/dist/components/SearchBar/index.d.ts`	1.83 kB
`./packages/wow-ui/dist/components/SearchBar/index.d.ts.map`	687 B
`./packages/wow-ui/dist/components/Spinner`	4.1 kB
`./packages/wow-ui/dist/components/Spinner/BlueSpinner.d.ts`	654 B
`./packages/wow-ui/dist/components/Spinner/BlueSpinner.d.ts.map`	470 B
`./packages/wow-ui/dist/components/Spinner/RainbowSpinner.d.ts`	744 B
`./packages/wow-ui/dist/components/Spinner/RainbowSpinner.d.ts.map`	477 B
`./packages/wow-ui/dist/components/Stepper`	4.1 kB
`./packages/wow-ui/dist/components/Stepper/index.d.ts`	741 B
`./packages/wow-ui/dist/components/Stepper/index.d.ts.map`	490 B
`./packages/wow-ui/dist/components/Switch`	4.1 kB
`./packages/wow-ui/dist/components/Switch/index.d.ts`	2.17 kB
`./packages/wow-ui/dist/components/Switch/index.d.ts.map`	748 B
`./packages/wow-ui/dist/components/Table`	4.1 kB
`./packages/wow-ui/dist/components/Table/Table.d.ts`	1.47 kB
`./packages/wow-ui/dist/components/Table/Table.d.ts.map`	610 B
`./packages/wow-ui/dist/components/Table/TableContext.d.ts`	945 B
`./packages/wow-ui/dist/components/Table/TableContext.d.ts.map`	342 B
`./packages/wow-ui/dist/components/Table/TableContext.js`	343 B
`./packages/wow-ui/dist/components/Table/Tbody.d.ts`	370 B
`./packages/wow-ui/dist/components/Table/Tbody.d.ts.map`	363 B
`./packages/wow-ui/dist/components/Table/Td.d.ts`	351 B
`./packages/wow-ui/dist/components/Table/Td.d.ts.map`	327 B
`./packages/wow-ui/dist/components/Table/Th.d.ts`	355 B
`./packages/wow-ui/dist/components/Table/Th.d.ts.map`	328 B
`./packages/wow-ui/dist/components/Table/Thead.d.ts`	355 B
`./packages/wow-ui/dist/components/Table/Thead.d.ts.map`	332 B
`./packages/wow-ui/dist/components/Table/Tr.d.ts`	380 B
`./packages/wow-ui/dist/components/Table/Tr.d.ts.map`	356 B
`./packages/wow-ui/dist/components/Tabs`	4.1 kB
`./packages/wow-ui/dist/components/Tabs/contexts`	4.1 kB
`./packages/wow-ui/dist/components/Tabs/contexts/CollectionContext.d.ts`	360 B
`./packages/wow-ui/dist/components/Tabs/contexts/CollectionContext.d.ts.map`	356 B
`./packages/wow-ui/dist/components/Tabs/contexts/CollectionContext.js`	328 B
`./packages/wow-ui/dist/components/Tabs/contexts/TabsContext.d.ts`	373 B
`./packages/wow-ui/dist/components/Tabs/contexts/TabsContext.d.ts.map`	372 B
`./packages/wow-ui/dist/components/Tabs/contexts/TabsContext.js`	186 B
`./packages/wow-ui/dist/components/Tabs/index.d.ts`	1.15 kB
`./packages/wow-ui/dist/components/Tabs/index.d.ts.map`	498 B
`./packages/wow-ui/dist/components/Tabs/TabsContent.d.ts`	1.02 kB
`./packages/wow-ui/dist/components/Tabs/TabsContent.d.ts.map`	374 B
`./packages/wow-ui/dist/components/Tabs/TabsItem.d.ts`	1.11 kB
`./packages/wow-ui/dist/components/Tabs/TabsItem.d.ts.map`	408 B
`./packages/wow-ui/dist/components/Tabs/TabsList.d.ts`	307 B
`./packages/wow-ui/dist/components/Tabs/TabsList.d.ts.map`	258 B
`./packages/wow-ui/dist/components/Tag`	4.1 kB
`./packages/wow-ui/dist/components/Tag/index.d.ts`	710 B
`./packages/wow-ui/dist/components/Tag/index.d.ts.map`	660 B
`./packages/wow-ui/dist/components/TextButton`	4.1 kB
`./packages/wow-ui/dist/components/TextButton/index.d.ts`	1.35 kB
`./packages/wow-ui/dist/components/TextButton/index.d.ts.map`	774 B
`./packages/wow-ui/dist/components/TextField`	4.1 kB
`./packages/wow-ui/dist/components/TextField/index.d.ts`	2.2 kB
`./packages/wow-ui/dist/components/TextField/index.d.ts.map`	787 B
`./packages/wow-ui/dist/components/Toast`	4.1 kB
`./packages/wow-ui/dist/components/Toast/index.d.ts`	1.49 kB
`./packages/wow-ui/dist/components/Toast/index.d.ts.map`	661 B
`./packages/wow-ui/dist/components/Toast/ToastContext.d.ts`	462 B
`./packages/wow-ui/dist/components/Toast/ToastContext.d.ts.map`	482 B
`./packages/wow-ui/dist/components/Toast/ToastContext.js`	173 B
`./packages/wow-ui/dist/components/Toast/ToastProvider.d.ts`	314 B
`./packages/wow-ui/dist/components/Toast/ToastProvider.d.ts.map`	336 B
`./packages/wow-ui/dist/components/Toast/useToast.d.ts`	247 B
`./packages/wow-ui/dist/components/Toast/useToast.d.ts.map`	184 B
`./packages/wow-ui/dist/css-BqMMr_RH.js`	13.2 kB
`./packages/wow-ui/dist/cva-D61kDybU.js`	1.17 kB
`./packages/wow-ui/dist/DateDropDown.cjs`	1.23 kB
`./packages/wow-ui/dist/DateDropDown.js`	1.47 kB
`./packages/wow-ui/dist/Divider.cjs`	581 B
`./packages/wow-ui/dist/Divider.js`	909 B
`./packages/wow-ui/dist/DropDown.cjs`	5.56 kB
`./packages/wow-ui/dist/DropDown.js`	1.28 kB
`./packages/wow-ui/dist/DropDownOption.cjs`	1.25 kB
`./packages/wow-ui/dist/DropDownOption.js`	1.71 kB
`./packages/wow-ui/dist/factory-uSp5JCfA.js`	15.2 kB
`./packages/wow-ui/dist/flex-C0Ry8qkr.js`	600 B
`./packages/wow-ui/dist/formatToString-CNM3Nmks.js`	1.41 kB
`./packages/wow-ui/dist/Header.cjs`	1.61 kB
`./packages/wow-ui/dist/Header.js`	1.63 kB
`./packages/wow-ui/dist/hooks`	4.1 kB
`./packages/wow-ui/dist/hooks/useCheckedState.d.ts`	746 B
`./packages/wow-ui/dist/hooks/useCheckedState.d.ts.map`	522 B
`./packages/wow-ui/dist/hooks/useCheckedState.js`	788 B
`./packages/wow-ui/dist/hooks/useClickOutside.d.ts`	174 B
`./packages/wow-ui/dist/hooks/useClickOutside.d.ts.map`	230 B
`./packages/wow-ui/dist/hooks/useClickOutside.js`	316 B
`./packages/wow-ui/dist/hooks/useDropDownState.d.ts`	730 B
`./packages/wow-ui/dist/hooks/useDropDownState.d.ts.map`	471 B
`./packages/wow-ui/dist/hooks/useDropDownState.js`	565 B
`./packages/wow-ui/dist/hooks/useFormControl.d.ts`	932 B
`./packages/wow-ui/dist/hooks/useFormControl.d.ts.map`	763 B
`./packages/wow-ui/dist/hooks/useFormControl.js`	816 B
`./packages/wow-ui/dist/hooks/useGroupCheckedState.d.ts`	781 B
`./packages/wow-ui/dist/hooks/useGroupCheckedState.d.ts.map`	546 B
`./packages/wow-ui/dist/hooks/useGroupCheckedState.js`	1.02 kB
`./packages/wow-ui/dist/hooks/useMergeRefs.d.ts`	178 B
`./packages/wow-ui/dist/hooks/useMergeRefs.d.ts.map`	302 B
`./packages/wow-ui/dist/hooks/useMergeRefs.js`	228 B
`./packages/wow-ui/dist/hooks/usePagination.d.ts`	525 B
`./packages/wow-ui/dist/hooks/usePagination.d.ts.map`	255 B
`./packages/wow-ui/dist/hooks/usePagination.js`	963 B
`./packages/wow-ui/dist/hooks/useSafeContext.d.ts`	296 B
`./packages/wow-ui/dist/hooks/useSafeContext.d.ts.map`	355 B
`./packages/wow-ui/dist/hooks/useSafeContext.js`	183 B
`./packages/wow-ui/dist/hooks/useTableCheckState.d.ts`	369 B
`./packages/wow-ui/dist/hooks/useTableCheckState.d.ts.map`	270 B
`./packages/wow-ui/dist/hooks/useTableCheckState.js`	604 B
`./packages/wow-ui/dist/hooks/useTextareaAutosize.d.ts`	178 B
`./packages/wow-ui/dist/hooks/useTextareaAutosize.d.ts.map`	242 B
`./packages/wow-ui/dist/hooks/useTextareaAutosize.js`	526 B
`./packages/wow-ui/dist/hooks/useTimeState.d.ts`	528 B
`./packages/wow-ui/dist/hooks/useTimeState.d.ts.map`	435 B
`./packages/wow-ui/dist/hooks/useTimeState.js`	509 B
`./packages/wow-ui/dist/index-CptAlOmg.js`	28.9 kB
`./packages/wow-ui/dist/MultiGroup.cjs`	1.22 kB
`./packages/wow-ui/dist/MultiGroup.js`	1.59 kB
`./packages/wow-ui/dist/MultiGroupContext-NdW4myYx.js`	151 B
`./packages/wow-ui/dist/node_modules`	4.1 kB
`./packages/wow-ui/dist/objectWithoutProperties-CV19oto2.js`	1.68 kB
`./packages/wow-ui/dist/packages`	4.1 kB
`./packages/wow-ui/dist/packages/wow-icons`	4.1 kB
`./packages/wow-ui/dist/packages/wow-icons/dist`	4.1 kB
`./packages/wow-ui/dist/packages/wow-icons/dist/index.js`	28.2 kB
`./packages/wow-ui/dist/packages/wow-ui`	4.1 kB
`./packages/wow-ui/dist/packages/wow-ui/styled-system`	4.1 kB
`./packages/wow-ui/dist/packages/wow-ui/styled-system/css`	4.1 kB
`./packages/wow-ui/dist/packages/wow-ui/styled-system/css/conditions.js`	1.48 kB
`./packages/wow-ui/dist/packages/wow-ui/styled-system/css/css.js`	8.18 kB
`./packages/wow-ui/dist/packages/wow-ui/styled-system/css/cva.js`	1.21 kB
`./packages/wow-ui/dist/packages/wow-ui/styled-system/css/cx.js`	138 B
`./packages/wow-ui/dist/packages/wow-ui/styled-system/helpers.js`	4.05 kB
`./packages/wow-ui/dist/packages/wow-ui/styled-system/jsx`	4.1 kB
`./packages/wow-ui/dist/packages/wow-ui/styled-system/jsx/factory-helper.js`	581 B
`./packages/wow-ui/dist/packages/wow-ui/styled-system/jsx/factory.js`	1.32 kB
`./packages/wow-ui/dist/packages/wow-ui/styled-system/jsx/flex.js`	353 B
`./packages/wow-ui/dist/packages/wow-ui/styled-system/jsx/is-valid-prop.js`	13.6 kB
`./packages/wow-ui/dist/packages/wow-ui/styled-system/patterns`	4.1 kB
`./packages/wow-ui/dist/packages/wow-ui/styled-system/patterns/flex.js`	385 B
`./packages/wow-ui/dist/packages/wow-ui/styled-system/tokens`	4.1 kB
`./packages/wow-ui/dist/packages/wow-ui/styled-system/tokens/index.js`	11.7 kB
`./packages/wow-ui/dist/Pagination.cjs`	15.8 kB
`./packages/wow-ui/dist/Pagination.js`	3.34 kB
`./packages/wow-ui/dist/pickerComponents-BfFxIxwA.js`	45.8 kB
`./packages/wow-ui/dist/PickerContext-rVhmCdD0.js`	140 B
`./packages/wow-ui/dist/PickerGroup.cjs`	1 kB
`./packages/wow-ui/dist/PickerGroup.js`	1.25 kB
`./packages/wow-ui/dist/RadioButton.cjs`	2.54 kB
`./packages/wow-ui/dist/RadioButton.js`	2.88 kB
`./packages/wow-ui/dist/RadioContext-Coyj362_.js`	140 B
`./packages/wow-ui/dist/RadioGroup.cjs`	737 B
`./packages/wow-ui/dist/RadioGroup.js`	921 B
`./packages/wow-ui/dist/RainbowSpinner.cjs`	5.18 kB
`./packages/wow-ui/dist/RainbowSpinner.js`	557 B
`./packages/wow-ui/dist/RangeDatePicker.cjs`	1.52 kB
`./packages/wow-ui/dist/RangeDatePicker.js`	2.14 kB
`./packages/wow-ui/dist/SearchBar.cjs`	2.96 kB
`./packages/wow-ui/dist/SearchBar.js`	2.68 kB
`./packages/wow-ui/dist/SingleDatePicker.cjs`	1.56 kB
`./packages/wow-ui/dist/SingleDatePicker.js`	2.28 kB
`./packages/wow-ui/dist/slicedToArray-DKR3SRAT.js`	1.12 kB
`./packages/wow-ui/dist/Stepper.cjs`	2.52 kB
`./packages/wow-ui/dist/Stepper.js`	2.67 kB
`./packages/wow-ui/dist/Switch.cjs`	3.14 kB
`./packages/wow-ui/dist/Switch.js`	3.29 kB
`./packages/wow-ui/dist/Table.cjs`	2.46 kB
`./packages/wow-ui/dist/Table.js`	2.38 kB
`./packages/wow-ui/dist/TableContext-P6kcrXxv.js`	363 B
`./packages/wow-ui/dist/Tabs.cjs`	808 B
`./packages/wow-ui/dist/Tabs.js`	1.01 kB
`./packages/wow-ui/dist/TabsContent.cjs`	445 B
`./packages/wow-ui/dist/TabsContent.js`	437 B
`./packages/wow-ui/dist/TabsContext-BGerq0sP.js`	187 B
`./packages/wow-ui/dist/TabsItem.cjs`	1.4 kB
`./packages/wow-ui/dist/TabsItem.js`	1.71 kB
`./packages/wow-ui/dist/TabsList.cjs`	1.24 kB
`./packages/wow-ui/dist/TabsList.js`	1.35 kB
`./packages/wow-ui/dist/Tag.cjs`	1.49 kB
`./packages/wow-ui/dist/Tag.js`	1.87 kB
`./packages/wow-ui/dist/Tbody.cjs`	461 B
`./packages/wow-ui/dist/Tbody.js`	723 B
`./packages/wow-ui/dist/Td.cjs`	999 B
`./packages/wow-ui/dist/Td.js`	1.42 kB
`./packages/wow-ui/dist/TextButton.cjs`	962 B
`./packages/wow-ui/dist/TextButton.js`	1.24 kB
`./packages/wow-ui/dist/TextField.cjs`	4 kB
`./packages/wow-ui/dist/TextField.js`	3.93 kB
`./packages/wow-ui/dist/Th.cjs`	636 B
`./packages/wow-ui/dist/Th.js`	852 B
`./packages/wow-ui/dist/Thead.cjs`	1.06 kB
`./packages/wow-ui/dist/Thead.js`	1.18 kB
`./packages/wow-ui/dist/TimePicker.cjs`	2.58 kB
`./packages/wow-ui/dist/TimePicker.js`	2.2 kB
`./packages/wow-ui/dist/Toast.cjs`	1.99 kB
`./packages/wow-ui/dist/Toast.js`	2.29 kB
`./packages/wow-ui/dist/ToastProvider.cjs`	1.99 kB
`./packages/wow-ui/dist/ToastProvider.js`	1.47 kB
`./packages/wow-ui/dist/toConsumableArray-Dil0zJR3.js`	494 B
`./packages/wow-ui/dist/Tr.cjs`	1.39 kB
`./packages/wow-ui/dist/Tr.js`	1.51 kB
`./packages/wow-ui/dist/types`	4.1 kB
`./packages/wow-ui/dist/types/button.d.ts`	2.01 kB
`./packages/wow-ui/dist/types/button.d.ts.map`	946 B
`./packages/wow-ui/dist/types/DefaultProps.d.ts`	450 B
`./packages/wow-ui/dist/types/DefaultProps.d.ts.map`	273 B
`./packages/wow-ui/dist/types/index.d.ts`	262 B
`./packages/wow-ui/dist/types/index.d.ts.map`	260 B
`./packages/wow-ui/dist/types/polymorphic.d.ts`	607 B
`./packages/wow-ui/dist/types/polymorphic.d.ts.map`	656 B
`./packages/wow-ui/dist/types/table.d.ts`	627 B
`./packages/wow-ui/dist/types/table.d.ts.map`	642 B
`./packages/wow-ui/dist/useClickOutside-BEvht8kZ.js`	339 B
`./packages/wow-ui/dist/useGroupCheckedState-TNY-ZYk2.js`	1 kB
`./packages/wow-ui/dist/useMergeRefs-HMD0SwbP.js`	235 B
`./packages/wow-ui/dist/useSafeContext-8koacWEq.js`	191 B
`./packages/wow-ui/dist/useToast-B-Hxe0Qj.js`	234 B
`./packages/wow-ui/dist/useToast.cjs`	137 B
`./packages/wow-ui/dist/useToast.js`	170 B
`./packages/wow-ui/dist/utils`	4.1 kB
`./packages/wow-ui/dist/utils/calcPercent.d.ts`	120 B
`./packages/wow-ui/dist/utils/calcPercent.d.ts.map`	175 B
`./packages/wow-ui/dist/utils/calcPercent.js`	66 B
`./packages/wow-ui/dist/utils/formatToString.d.ts`	348 B
`./packages/wow-ui/dist/utils/formatToString.d.ts.map`	309 B
`./packages/wow-ui/dist/utils/formatToString.js`	444 B
`./packages/wow-ui/dist/utils/index.d.ts`	85 B
`./packages/wow-ui/dist/utils/index.d.ts.map`	162 B
`./packages/wow-ui/dist/utils/isMobile.d.ts`	102 B
`./packages/wow-ui/dist/utils/isMobile.d.ts.map`	168 B
`./packages/wow-ui/dist/utils/isMobile.js`	100 B

_{compressed-size-action}

SeieunYoo

수고하셨어요~~

저도 children 의 타입을 강제할 수 있는 방법은 없나,, 찾아봤는데 언급 주신 이슈 처럼 아직 해결되진 않은 거 같더라구요.

대안책으로는..
컴파일 타임에서 children 타입을 지정하는 건 어려울 거 같지만 런타임에서는 children 을 순회하면서 특정 타입의 컴포넌트 인지 아닌 지 판단할 수 있지 않을까...🤔 라는 생각이 드네요.

 Children.forEach(children, (child) => {
    if (typeof child === 'Element' && child?.type === 'ActionSheetHeader') {
      ...
    }

packages/wow-ui/src/components/ActionSheet/index.tsx

packages/wow-ui/src/components/ActionSheet/ActionSheetHeader.tsx

packages/wow-ui/src/components/ActionSheet/ActionSheet.stories.tsx

packages/wow-ui/src/components/ActionSheet/index.tsx

packages/wow-ui/src/components/ActionSheet/ActionSheetOverlay.tsx

packages/wow-ui/src/components/ActionSheet/index.tsx

github-actions · 2025-03-03T12:46:38Z

🚀 storybook: https://663657b8272769a8d18a5e3f-ddbqvyqswa.chromatic.com/

github-actions · 2025-03-03T13:29:38Z

🚀 storybook: https://663657b8272769a8d18a5e3f-fsmnrgbuju.chromatic.com/

github-actions · 2025-03-03T13:39:57Z

🚀 storybook: https://663657b8272769a8d18a5e3f-hiwwezmjhy.chromatic.com/

github-actions · 2025-03-03T13:42:44Z

🚀 storybook: https://663657b8272769a8d18a5e3f-xqqisvliye.chromatic.com/

github-actions · 2025-03-03T13:54:23Z

🚀 storybook: https://663657b8272769a8d18a5e3f-zjuxkfevny.chromatic.com/

github-actions bot assigned hamo-o Sep 16, 2024

hamo-o force-pushed the feature/action-sheet-component branch from ab9e60c to d45ec4a Compare February 3, 2025 16:28

hamo-o added the 👩‍💻 리뷰 남겨주세요! label Feb 3, 2025

hamo-o linked an issue Feb 3, 2025 that may be closed by this pull request

[Feature] ActionSheet 컴포넌트 구현 #97

Open

2 tasks

hamo-o marked this pull request as ready for review February 3, 2025 16:45

hamo-o requested review from eugene028, SeieunYoo and soulchicken as code owners February 3, 2025 16:45

hamo-o changed the title ~~[Feature] 액션시트 컴포넌트~~ [Feature] 액션시트 컴포넌트 구현 Feb 3, 2025

SeieunYoo reviewed Feb 6, 2025

View reviewed changes

hamo-o added 15 commits March 3, 2025 22:36

feat: ActionSheet Context

dbecc9a

feat: ActionSheet Header

e1ec123

feat: ActionSheet Body, Footer

158f37f

feat: ActionSheet Background

4068d00

feat: ActionSheet 컴포넌트

8db975b

feat: 애니메이션 구현

82bb37c

feat: 액션시트 스토리북

b91b3d2

feat: Overlay 이름 변경 및 빌드

6909f1a

feat: rest prop 추가 및 스토리북 추가

0bcfefe

feat: children 순서 및 형태 제한

5cd3bd7

fix: body, footer Flex extends

be2a6a8

refactor: 액션시트 닫는 함수 리팩터링

2c66e7f

chore: 스토리북 Default 잘 보이도록 수정

a3b5811

fix: 모바일 뷰에서는 너비 100% 적용

d624ab6

fix: 외부 주입 className 명시적으로 병합

f6a60a1

hamo-o added 9 commits March 3, 2025 22:36

fix: 헤더부분 ReactNode로 받을 수 있도록, sub 옵셔널 변환

940557f

feat: overlay 토큰 조정, actionSheet 토큰 추가

354fd47

fix: 하드코딩 토큰값 변경

a15f000

fix: 매직넘버 삭제

829ad31

feat: ref 주입할 수 있도록

e3f806d

docs: 스토리북 구체적으로 적기

9df54f0

chore: axe-playwright 버전업

298fcf6

fix: undefined 가드처리

47c7dcc

fix: 토큰 추가

647819c

hamo-o force-pushed the feature/action-sheet-component branch from 1798202 to 647819c Compare March 3, 2025 13:37

chore: 스토리북 test-runner 버전업

2025364

hamo-o requested a review from SeieunYoo March 4, 2025 14:16

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Feature] 액션시트 컴포넌트 구현 #165

[Feature] 액션시트 컴포넌트 구현 #165

hamo-o commented Sep 16, 2024 •

edited

Loading

changeset-bot bot commented Feb 3, 2025 •

edited

Loading

github-actions bot commented Feb 3, 2025

GDSChongik commented Feb 3, 2025

SeieunYoo left a comment

github-actions bot commented Mar 3, 2025

github-actions bot commented Mar 3, 2025

github-actions bot commented Mar 3, 2025

github-actions bot commented Mar 3, 2025

github-actions bot commented Mar 3, 2025

[Feature] 액션시트 컴포넌트 구현 #165

Are you sure you want to change the base?

[Feature] 액션시트 컴포넌트 구현 #165

Conversation

hamo-o commented Sep 16, 2024 • edited Loading

🎉 변경 사항

🚩 관련 이슈

🙏 여기는 꼭 봐주세요!

1-1. 문제상황

1-2. 해결방법으로 알아봤던 것들

2-1. 패키지 버전업 & 탭 컴포넌트

changeset-bot bot commented Feb 3, 2025 • edited Loading

⚠️ No Changeset found

github-actions bot commented Feb 3, 2025

GDSChongik commented Feb 3, 2025

SeieunYoo left a comment

Choose a reason for hiding this comment

github-actions bot commented Mar 3, 2025

github-actions bot commented Mar 3, 2025

github-actions bot commented Mar 3, 2025

github-actions bot commented Mar 3, 2025

github-actions bot commented Mar 3, 2025

hamo-o commented Sep 16, 2024 •

edited

Loading

changeset-bot bot commented Feb 3, 2025 •

edited

Loading