Upgrade Guides

1. 이름과 최상위 구조 먼저 변경

SwipeableMenuSheet를 MenuSheet로 변경

수정 대상: SwipeableMenuSheet, SwipeableMenuSheetCloseReason, swipeable-menu-sheet

import {
  SwipeableMenuSheet, 
  type SwipeableMenuSheetCloseReason, 
  MenuSheet, 
  type MenuSheetOpenChangeReason, 
} from "@seed-design/lynx-react";

<SwipeableMenuSheet.Root>{children}</SwipeableMenuSheet.Root>
<MenuSheet.Root>{children}</MenuSheet.Root>

모든 prefixed part와 Props 타입도 MenuSheet*로 바꾸세요. CSS recipe 이름 menuSheet과 seed-menu-sheet-*는 그대로입니다.

변경하지 않으면: 1.0에는 옛 export가 없습니다.

작업 후 확인: 옛 이름과 옛 snippet import가 남지 않았는지 검색하세요.

InputButton을 FieldButton으로 변경

수정 대상: InputButton, InputButtonRoot, inputButtonRef, @seed-design/lynx-css/recipes/input-button, inputButton, seed-input-button__

import { InputButton } from "@seed-design/lynx-react"; 
import { FieldButton } from "@seed-design/lynx-react"; 

<InputButton.Root>{children}</InputButton.Root>
<FieldButton.Root>{children}</FieldButton.Root>

Registry ui:field-button wrapper의 ref prop도 바꿉니다.

import { FieldButton } from "@/components/ui/field-button";

<FieldButton inputButtonRef={rootRef} />
<FieldButton controlRef={rootRef} />

Recipe와 class 이름도 field-button으로 바뀌었습니다. @seed-design/lynx-css/recipes/input-button을 직접 import하거나 .seed-input-button__* selector로 스타일을 덮어썼다면 함께 바꾸세요. FieldButton 컴포넌트만 쓴다면 바꿀 것이 없으며, 스타일 값은 그대로입니다.

import { inputButton, type InputButtonVariantProps } from "@seed-design/lynx-css/recipes/input-button"; 
import { fieldButton, type FieldButtonVariantProps } from "@seed-design/lynx-css/recipes/field-button"; 

const classes = inputButton({ size: "medium" }); 
const classes = fieldButton({ size: "medium" }); 

inputButtonVariantMap은 fieldButtonVariantMap으로, .seed-input-button__root 같은 selector는 .seed-field-button__root로 바꾸세요.

변경하지 않으면: 1.0에는 InputButton* export와 @seed-design/lynx-css/recipes/input-button이 없고, .seed-input-button__* selector는 더 이상 어떤 요소에도 적용되지 않습니다.

작업 후 확인: ClearButton을 values와 onValuesChange로 제어한다면, 옛 bindtap에서도 같은 상태를 두 번 바꾸지 않는지 확인하세요.

KeyboardAvoidingScrollView를 Root와 Content로 분리

수정 대상: KeyboardAvoidingScrollViewProps, <KeyboardAvoidingScrollView, 해당 컴포넌트의 ref, scroll prop과 event

import type { KeyboardAvoidingScrollViewProps } from "@seed-design/lynx-react"; 
import type { 
  KeyboardAvoidingScrollViewRootProps, 
  KeyboardAvoidingScrollViewContentProps, 
} from "@seed-design/lynx-react"; 

<KeyboardAvoidingScrollView
  ref={scrollRef} 
  keyboardGap={24} 
  style={{ height: "100%", padding: "20px" }} 
  scroll-bar-enable={false} 
  bindscroll={handleScroll} 
>
  {fields}
</KeyboardAvoidingScrollView>
<KeyboardAvoidingScrollView.Root keyboardGap={24} style={{ height: "100%" }}>
  <KeyboardAvoidingScrollView.Content
    ref={scrollRef} 
    style={{ padding: "20px" }} 
    scroll-bar-enable={false} 
    bindscroll={handleScroll} 
  >
    {fields}
  </KeyboardAvoidingScrollView.Content>
</KeyboardAvoidingScrollView.Root>

Root에는 keyboardGap, scrollBehavior, 바깥 높이를 둡니다. Content에는 padding, scroll ref, scroll prop과 event를 둡니다. 키보드 위에 고정할 버튼은 새 KeyboardAvoidingScrollView.Footer에 놓을 수 있습니다.

변경하지 않으면: 옛 단일 컴포넌트와 KeyboardAvoidingScrollViewProps export가 없습니다. scroll ref나 event를 Root에 두면 실제 scroll host를 가리키지 않습니다.

작업 후 확인: 입력 focus 시 Content가 스크롤되고 Footer를 쓴 화면에서는 Footer가 키보드 위에 놓이는지 확인하세요.

Chip.Root를 Chip.Button으로 변경

수정 대상: Chip.Root, ChipRoot, Chip.RootProps, ChipRootProps

import { ChipRoot, type ChipRootProps } from "@seed-design/lynx-react"; 
import { ChipButton, type ChipButtonProps } from "@seed-design/lynx-react"; 

<Chip.Root bindtap={handleTap}>라벨</Chip.Root>
<Chip.Button bindtap={handleTap}>라벨</Chip.Button>

변경하지 않으면: 옛 export와 namespace member가 없습니다.

작업 후 확인: 모든 일반 Chip이 Chip.Button을 쓰는지 확인하세요.

2. 상태 소유권과 component anatomy 변경

RadioGroup 상태를 RadioGroupField.Root로 이동

수정 대상: RadioGroup.Root, RadioGroupRoot, root의 value, onValueChange, disabled, weight, size, tone, RadioSelectBoxRoot

<RadioGroup.Root value={value} onValueChange={setValue} size="large" tone="neutral">
  <RadioGroup.Item value="a">A</RadioGroup.Item>
</RadioGroup.Root>
<RadioGroupField.Root value={value} onValueChange={setValue}>
  <RadioGroup.Root>
    <RadioGroup.Item value="a" size="large" tone="neutral">A</RadioGroup.Item>
  </RadioGroup.Root>
</RadioGroupField.Root>

표시용 RadioGroup.Root는 layout만 담당합니다. Field UI가 필요 없다면 @seed-design/lynx-react-radio-group의 headless Root를 상태 owner로 사용할 수 있습니다. List radio row와 RadioSelectBox도 stateful ancestor 아래에 두세요.

변경하지 않으면: 표시용 Root가 selection과 disabled 상태를 제공하지 않습니다.

작업 후 확인: 선택 변경, disabled, validation message와 Item별 size/tone을 확인하세요.

Switchmark를 Switch.Root 안으로 이동

수정 대상: registry의 Switchmark, SwitchmarkProps, Switchmark에 전달한 checked, defaultChecked, onCheckedChange, disabled

<Switchmark checked={checked} onCheckedChange={setChecked} />
<Switch.Root checked={checked} onCheckedChange={setChecked}>
  <Switchmark />
</Switch.Root>

변경하지 않으면: 1.0 Switchmark는 Control과 Thumb만 렌더하며 Root의 context가 필요합니다.

작업 후 확인: 탭, controlled/uncontrolled 상태, disabled 상태를 확인하세요.

BottomSheet와 MenuSheet의 controlled state 갱신

수정 대상: BottomSheet.Root와 MenuSheet.Root의 onOpenChange, .current?.open(, .current?.close(, callback의 reason 처리

<BottomSheet.Root ref={sheetRef} open={open} onOpenChange={setOpen}>
  {children}
</BottomSheet.Root>
sheetRef.current?.close(); 

<BottomSheet.Root
  open={open} 
  onOpenChange={(next, details) => { 
    setOpen(next); 
    reportUserReason(details.reason); 
  }} 
>
  {children}
</BottomSheet.Root>
setOpen(false); 

Root ref를 호출해도 onOpenChange가 실행되지 않습니다. ref-driven analytics와 cleanup도 앱 코드에서 직접 실행하세요. Controlled Trigger, Backdrop, CloseButton은 callback으로 변경을 요청한 뒤 부모가 open을 갱신할 때까지 기다립니다.

변경하지 않으면: ref 호출에 callback side effect를 의존한 controlled state가 동기화되지 않습니다.

작업 후 확인: trigger, close button, outside tap, drag의 reason과 imperative open/close를 각각 확인하세요.

ProgressCircle.Track 추가

수정 대상: ProgressCircle.Root, ProgressCircle.Range, seed-progress-circle__root--tone_

<ProgressCircle.Root value={25}>
  <ProgressCircle.Range />
</ProgressCircle.Root>
<ProgressCircle.Root value={25}>
  <ProgressCircle.Track />
  <ProgressCircle.Range />
</ProgressCircle.Root>

숫자 value만 있어도 기본 범위 0에서 100의 determinate 상태가 됩니다. 기존에 value를 넘기면서 indeterminate 회전을 기대했다면 value를 빼세요. Root tone CSS를 직접 선택했다면 Track tone class로 옮깁니다.

변경하지 않으면: 배경 track이 보이지 않고, value-only 사용처의 의미가 달라집니다.

작업 후 확인: determinate, indeterminate, loading 상태의 track과 range를 확인하세요.

Menu와 Select의 layer 구조 변경

수정 대상: Menu.Content, Select.Content, MenuContent, SelectContent, seed-menu__backdrop, seed-select__backdrop, reason === "dismiss"

<Menu.Content>{items}</Menu.Content>
<Menu.Positioner container="window">
  <Menu.Content><Menu.ScrollArea>{items}</Menu.ScrollArea></Menu.Content>
</Menu.Positioner>

<Select.Content>{items}</Select.Content>
<Select.Positioner container="window">
  <Select.Content><Select.ScrollArea>{items}</Select.ScrollArea></Select.Content>
</Select.Positioner>

1.0은 기본적으로 Lynx view 안의 fixed layer를 사용합니다. 기존처럼 host 전체를 덮고 Android Back에서 닫히며 dismiss reason을 받아야 하면 실제 native container 이름을 지정하세요. Registry의 MenuContent와 SelectContent는 재설치 후 이 구조를 내부에서 조합합니다. Select recipe를 직접 조합했다면 Trigger와 Item의 간격은 새 scaleContent slot에 적용하세요. 이 slot이 만든 안쪽 view 때문에 직접 자식 selector나 layout 가정도 한 단계 달라집니다.

변경하지 않으면: primitive Content만으로는 layer와 scroll viewport를 만들지 않습니다. 옛 backdrop recipe slot도 없습니다.

작업 후 확인: outside tap, 스크롤, native container를 쓴 경우 Android Back과 dismiss reason을 확인하세요.

ScrollFog 안에 scroll host 배치

수정 대상: ScrollFog, hideScrollBar, verticalScroll, horizontalScroll, 혼합된 placement

<ScrollFog hideScrollBar style={{ height: "100%" }}>
  <VStack>{items}</VStack>
</ScrollFog>
<ScrollFog placement={["top", "bottom"]} style={{ height: "100%" }}>
  <scroll-view
    scroll-orientation="vertical"
    scroll-bar-enable={false} 
    style={{ height: "100%" }} 
  >
    <VStack>{items}</VStack>
  </scroll-view>
</ScrollFog>

1.0의 ScrollFog는 mask만 제공합니다. 한 축의 placement만 고르세요. ChipTabsList처럼 자식이 이미 스크롤을 소유하면 scroll-view를 추가하지 않습니다.

변경하지 않으면: 일반 content는 더 이상 ScrollFog 안에서 스크롤되지 않습니다.

작업 후 확인: 실제 scroll host의 ref, event, scrollbar와 fog 방향을 확인하세요.

Dialog와 Sheet의 스크롤 영역을 컴포넌트가 소유

수정 대상: BottomSheet.Body 안의 scroll-view, BottomSheet.Body의 flex: "none", BottomSheet.Body와 AlertDialog.Content의 className·style로 바꾼 자식 배치, MenuSheet.List와 seed-menu-sheet__list의 flex·gap, BottomSheet.Body 안 ScrollFog의 height: "100%"

<BottomSheet.Body style={{ flex: "none" }}>
  <scroll-view scroll-y style={{ height: "300px", maxHeight: "300px", flex: "none" }}>
    {items}
  </scroll-view>
</BottomSheet.Body>
<BottomSheet.Body style={{ maxHeight: "300px" }}>{items}</BottomSheet.Body>

BottomSheet.Body, AlertDialog.Content, MenuSheet.List가 자식을 세로 scroll-view 안에 렌더해 내용이 넘치면 그 영역만 스크롤합니다. Body와 AlertDialog.Content의 className·style은 scroll-view를 감싼 바깥 view에, MenuSheet.List의 className·style·ref는 scroll-view에 적용됩니다. 자식 배치는 새 scrollContent(BottomSheet), listContent(MenuSheet) slot이 맡으므로, 자식 사이 간격이나 방향을 바꿨다면 이 slot을 덮어쓰거나 자식을 직접 감싼 view로 옮기세요. AlertDialog는 Footer도 같은 scroll-view 안에 있어 내용이 길면 스크롤 끝에서 Action이 보입니다. Body나 List가 스크롤된 상태에서 시작한 drag는 그 영역만 움직이고, 맨 위에서 아래로 끌어야 시트가 움직입니다. Body 안에 ScrollFog를 둔다면 height: "100%"가 기준으로 삼을 높이가 없으므로 고정 높이를 주세요. 이 ScrollFog 안의 스크롤은 시트 drag와 조정되지 않습니다.

변경하지 않으면: Body 안에 직접 둔 scroll-view가 컴포넌트의 scroll-view와 겹쳐 스크롤과 시트 drag가 함께 움직이고, flex: "none"이 남은 Body는 높이 상한에서 줄어들지 않습니다. 바깥 view에 준 flex·gap은 자식에 적용되지 않습니다.

작업 후 확인: 긴 내용에서 Body와 List만 스크롤되는지, 스크롤한 상태의 drag가 시트를 움직이지 않는지, AlertDialog의 Action까지 스크롤되는지 확인하세요.

3. 제거되거나 이동한 prop과 타입 변경

ActionButton 아이콘을 children으로 이동

수정 대상: ActionButton의 icon=, prefixIcon=, suffixIcon=

<ActionButton layout="iconOnly" icon={<IconPlus />} accessibility-label="추가" />
<ActionButton layout="iconOnly" accessibility-label="추가">
  <Icon icon={<IconPlus />} />
</ActionButton>

<ActionButton prefixIcon={<IconPlus />}>추가</ActionButton>
<ActionButton><PrefixIcon icon={<IconPlus />} />추가</ActionButton>

변경하지 않으면: 제거된 prop으로 넘긴 아이콘은 렌더링되지 않습니다.

작업 후 확인: icon-only control에 accessibility-label이 있는지 확인하세요.

PrefixIcon과 SuffixIcon의 size, color 제거

수정 대상: PrefixIcon, SuffixIcon, Chip.PrefixIcon, Chip.SuffixIcon에 전달한 size, color

<PrefixIcon icon={<ErrorIcon />} size="x4" color="fg.critical" />
<PrefixIcon icon={<ErrorIcon />} />

slot의 recipe 스타일을 따르는 것이 기본입니다. 의도적인 override라면 style을 쓰고, 독립 아이콘이면 Icon의 size와 color를 쓰세요.

변경하지 않으면: 1.0의 공개 PrefixIcon/SuffixIcon prop 계약에 맞지 않습니다.

작업 후 확인: TextField와 AttachmentInput의 장식 아이콘은 기본적으로 접근성 트리에서 숨겨집니다. 의미가 있는 아이콘만 명시적으로 노출하세요.

Select formatter와 SelectBox 타입 변경

수정 대상: formatValue 안의 prefixIcon, SelectBoxGroupProps, SelectBoxFooterProps

formatValue={(items) => ({ label: items[0]?.label, icon: items[0]?.prefixIcon })} 
formatValue={(items) => ({ label: items[0]?.label, icon: items[0]?.icon })} 

SelectItem을 만들 때 쓰는 prefixIcon prop은 그대로입니다. 제거된 공통 SelectBox 타입은 실제 variant 타입으로 바꾸세요.

import type { SelectBoxGroupProps } from "@seed-design/lynx-react"; 
import type { CheckSelectBox } from "@seed-design/lynx-react"; 
type GroupProps = CheckSelectBox.GroupProps; 

변경하지 않으면: formatter에서 선택된 icon을 읽지 못하고, 공통 타입 export는 사용할 수 없습니다.

작업 후 확인: 선택값의 prefix icon과 Check/Radio SelectBox wrapper 타입을 확인하세요.

List 선택 row의 mark 스타일 이동

수정 대상: List.CheckboxItem의 pressed, size, weight, variant, tone, List.SwitchItem의 size, tone, interactionRoot, seed-list-item__interactionRoot

<List.CheckboxItem checked={checked} size="small" tone="neutral">
  <List.Suffix><Checkbox.Control /></List.Suffix>
</List.CheckboxItem>
<List.CheckboxItem checked={checked}>
  <List.Suffix><Checkbox.Control size="small" tone="neutral" /></List.Suffix>
</List.CheckboxItem>

Checkbox의 size, variant, tone은 Checkbox.Control로, Switch의 size, tone은 Switch.Control로 옮깁니다. pressed는 interaction이 소유하므로 제거합니다. Checkbox row의 weight는 Control prop이 아니므로 옮기지 말고, 글자 굵기를 의도했다면 label Text에 직접 적용하세요. Radio의 모양은 RadioGroup.ItemControl에 둡니다. Radio row의 weight, size, tone은 0.x에서도 row prop이 아니었습니다. recipe를 직접 조합했다면 interactionRoot wrapper를 제거하고 실제 row root에 handler와 ref를 연결하세요.

변경하지 않으면: row에서 mark 모양을 제어하지 못하고 옛 slot class는 생성되지 않습니다.

작업 후 확인: row 전체 탭, mark 정렬, disabled와 접근성 값을 확인하세요.

AttachmentDisplay picker callback을 Trigger로 이동

수정 대상: package primitive AttachmentDisplay.Root.onTriggerTap, useAttachmentDisplay({ onTriggerTap })

<AttachmentDisplay.Root onTriggerTap={({ addEntries }) => pick().then(addEntries)}>
  <AttachmentDisplay.Trigger />
</AttachmentDisplay.Root>
<AttachmentDisplay.Root>
  <AttachmentDisplay.Context>
    {({ addEntries }) => (
      <AttachmentDisplay.Trigger bindtap={() => pick().then(addEntries)} /> 
    )}
  </AttachmentDisplay.Context>
</AttachmentDisplay.Root>

Registry ui:attachment-display-field의 AttachmentDisplay.onTriggerTap은 그대로입니다. import 출처를 구분하세요.

변경하지 않으면: primitive Root의 옛 callback은 picker를 열지 않습니다.

작업 후 확인: 추가 가능 수량, picker 취소, 업로드 상태 갱신을 확인하세요.

AttachmentInput context 반환 타입 변경

수정 대상: useAttachmentInputItemContext, removeButtonProps, imageProps.alt, AttachmentInputContextValue.acceptType

const { removeButtonProps, imageProps } = useAttachmentInputItemContext();
<AttachmentInput.ItemRemoveButton {...removeButtonProps} />
<AttachmentInput.ItemImage {...imageProps} />

removeButtonProps는 1.0에서 필수 bindtap만 제공하는 객체입니다. 옛 main-thread:bindtap 존재 여부에 의존하지 마세요. imageProps가 있으면 alt는 항상 문자열입니다. AttachmentInputContextValue.acceptType은 항상 존재하는 property이며 값은 "image" 또는 undefined입니다. in 연산자로 property 존재 여부를 상태처럼 사용했다면 값 자체를 검사하세요.

변경하지 않으면: hook 반환 객체의 옛 optional member 모양을 가정한 분기와 wrapper 타입이 1.0 계약과 맞지 않습니다.

작업 후 확인: remove button, image 대체 설명, accept type이 없는 상태를 확인하세요.

삭제된 attachment-sortable helper 교체

수정 대상: attachment-sortable, HorizontalReorderList, HorizontalReorderItem

import { HorizontalReorderList, HorizontalReorderItem } from "../lib/attachment-sortable"; 
import { Sortable } from "@seed-design/lynx-react-sortable"; 

const ReorderRoot = HorizontalReorderList; 
const ReorderItem = HorizontalReorderItem; 
const ReorderRoot = Sortable.Root; 
const ReorderItem = Sortable.Item; 

Root에는 items, getItemKey, onReorder, 앱의 reduced motion 값을 전달합니다. Item에는 이동 action label을 제공합니다. 옛 helper를 직접 쓰지 않았다면 reorderable attachment snippet 재설치만으로 충분합니다.

변경하지 않으면: 옛 로컬 helper는 registry에서 더 이상 설치하거나 갱신할 수 없습니다.

작업 후 확인: drag reorder, scroll edge 이동, reduced motion, 화면 읽기 도구의 앞·뒤 이동과 remove/retry action을 확인하세요.

Field.Label을 Field.Root 안에 배치

수정 대상: Field.Label, FieldLabel이 Field.Root 밖에 있는 사용처

<Field.Label>이름</Field.Label>
<Field.Root><Field.Label>이름</Field.Label></Field.Root>

변경하지 않으면: Label이 필요한 Field context를 찾지 못합니다.

작업 후 확인: Label, required, disabled, error message가 같은 Field 상태를 읽는지 확인하세요.

4. 직접 사용하는 recipe와 저수준 API 변경

Slider index와 위치 변수 변경

수정 대상: Slider.Thumb, ValueIndicatorRoot, ValueIndicatorLabel의 index, 누락된 index, --slider-*-offset, --slider-marker-color

<Slider.Thumb index={1} />
<Slider.ValueIndicatorRoot index={1}>
  <Slider.ValueIndicatorLabel />
</Slider.ValueIndicatorRoot>
<Slider.Thumb thumbIndex={1} />
<Slider.ValueIndicatorRoot thumbIndex={1}>
  <Slider.ValueIndicatorLabel thumbIndex={1} />
</Slider.ValueIndicatorRoot>

첫 thumb도 thumbIndex={0}을 명시하세요. 픽셀 offset 변수는 --slider-thumb-offset-ratio, --slider-tick-offset-ratio, --slider-marker-offset-ratio로 바꾸고, marker 색은 직접 style로 지정합니다. Track 너비를 Root보다 좁게 만든 layout은 좌표가 Root 기준으로 바뀐 점을 확인하세요.

변경하지 않으면: old index나 누락된 index로는 해당 thumb 값을 찾지 못해 part가 렌더링되지 않을 수 있습니다.

작업 후 확인: 모든 thumb와 value indicator, drag 범위, marker 위치를 확인하세요.

Checkbox와 pressed recipe 정리

수정 대상: Checkbox.Root pressed, RadioGroup.Root pressed, checkmark({ pressed }), badge({ pressed }), reactionButton({ pressed }), segmentedControl({ pressed }), 각 VariantMap.pressed, removed pressed class

const badgeClasses = badge({ size: "medium", pressed }); 
const badgeClasses = badge({ size: "medium" }); 

const reactionClasses = reactionButton({ selected, pressed }); 
const reactionClasses = reactionButton({ selected }); 

Checkbox.Root와 RadioGroup.Root의 controlled pressed는 제거하세요. Checkbox의 custom ghost mark에는 selectedBackground를 추가하고 Root의 :active 스타일을 사용합니다. 직접 조합한 Segmented Control에는 itemSelectedBackground overlay를 추가합니다. Badge의 custom recipe 조합은 필요한 scale feedback을 따로 구현하세요. ReactionButton 컴포넌트의 toggle 상태 prop인 pressed는 제거 대상이 아닙니다.

변경하지 않으면: 제거된 recipe variant와 class로는 눌림 스타일이 만들어지지 않습니다.

작업 후 확인: selected/unselected, press/release, reduced motion 상태를 확인하세요.

AppBar z-index override 변경

수정 대상: --z-index-app-bar, seed-app-bar__root

.custom-app-bar {
  --z-index-app-bar: 10; 
  z-index: 10; 
}

AppBar.Root는 scroll container 안에서 side slot과 배경이 함께 움직이도록 자체 stacking context를 만듭니다. 옛 CSS 변수는 더 이상 root의 stacking order를 바꾸지 않습니다.

변경하지 않으면: custom AppBar의 stacking override가 적용되지 않습니다.

작업 후 확인: scroll 안의 AppBar 배경, side button, 인접 overlay의 쌓임 순서를 확인하세요.

Dialog와 AlertDialog nested native prop 정리

수정 대상: dialogContentProps, dialogBackdropProps 안의 bindanimationstart, bindanimationend, bindanimationcancel, bindtransitionstart, bindtransitionend, Backdrop의 nested bindtap

<Dialog.Content dialogContentProps={{ bindanimationend: onEnd, bindtap: onTap }} />
<Dialog.Content dialogContentProps={{ bindtap: onTap }} />

<Dialog.Backdrop dialogBackdropProps={{ bindtap: onBackdropTap }} />
<Dialog.Backdrop onClick={onBackdropTap} />

AlertDialog도 같은 reserved callback을 제거합니다. AlertDialog Backdrop의 onClick은 clickToClose로 실제로 닫히는 탭에서만 호출됩니다. analytics만 유지하려고 dismissal 동작을 바꾸지 마세요. Content의 bindtap은 1.0부터 실제 content로 전달되므로, 실행되면 안 되는 handler였다면 제거하세요.

변경하지 않으면: reserved callback은 계속 실행되지 않습니다. Content의 기존 bindtap은 이전과 달리 실행됩니다.

작업 후 확인: backdrop dismissal, content tap, disabled/loading Action이 dialog를 닫지 않는지 확인하세요.

Toggle context API 변경

수정 대상: @seed-design/lynx-react-toggle의 ToggleContext, useToggleContext("...")

import { ToggleContext, useToggleContext } from "@seed-design/lynx-react-toggle"; 
import { ToggleProvider, useToggleContext } from "@seed-design/lynx-react-toggle"; 

<ToggleContext.Provider value={api}>{children}</ToggleContext.Provider>
<ToggleProvider value={api}>{children}</ToggleProvider>

const state = useToggleContext("MyControl"); 
const state = useToggleContext(); 

Provider 밖의 optional 사용은 useToggleContext({ strict: false })의 nullable 결과를 처리하세요.

변경하지 않으면: ToggleContext export가 없습니다. 옛 문자열 인자는 새 strict option 계약이 아닙니다.

작업 후 확인: provider 안과 optional provider 밖의 consumer를 모두 확인하세요.