diff --git a/CHANGELOG.md b/CHANGELOG.md index 852adce..056e971 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -37,6 +37,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - Allow `Enter` for form submit in `RadioGroup`, `Switch` and `Combobox` improvements ([#1285](https://github.com/tailwindlabs/headlessui/pull/1285)) - add React 18 compatibility ([#1326](https://github.com/tailwindlabs/headlessui/pull/1326)) - Add explicit `multiple` prop ([#1355](https://github.com/tailwindlabs/headlessui/pull/1355)) +- Prefer incoming `open` prop over OpenClosed state ([#1360](https://github.com/tailwindlabs/headlessui/pull/1360)) ### Added @@ -78,6 +79,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - Allow `Enter` for form submit in `RadioGroup`, `Switch` and `Combobox` improvements ([#1285](https://github.com/tailwindlabs/headlessui/pull/1285)) - Add explicit `multiple` prop ([#1355](https://github.com/tailwindlabs/headlessui/pull/1355)) - fix `nullable` prop for Vue ([2b109548b1a94a30858cf58c8f525554a1c12cbb](https://github.com/tailwindlabs/headlessui/commit/2b109548b1a94a30858cf58c8f525554a1c12cbb)) +- Prefer incoming `open` prop over OpenClosed state ([#1360](https://github.com/tailwindlabs/headlessui/pull/1360)) ### Added diff --git a/packages/@headlessui-react/src/components/dialog/dialog.tsx b/packages/@headlessui-react/src/components/dialog/dialog.tsx index de5c079..f5d7424 100644 --- a/packages/@headlessui-react/src/components/dialog/dialog.tsx +++ b/packages/@headlessui-react/src/components/dialog/dialog.tsx @@ -173,13 +173,6 @@ let DialogRoot = forwardRefWithAs(function Dialog< } let dialogState = open ? DialogStates.Open : DialogStates.Closed - let visible = (() => { - if (usesOpenClosedState !== null) { - return usesOpenClosedState === State.Open - } - - return dialogState === DialogStates.Open - })() let [state, dispatch] = useReducer(stateReducer, { titleId: null, @@ -357,7 +350,7 @@ let DialogRoot = forwardRefWithAs(function Dialog< slot, defaultTag: DEFAULT_DIALOG_TAG, features: DialogRenderFeatures, - visible, + visible: dialogState === DialogStates.Open, name: 'Dialog', })} diff --git a/packages/@headlessui-vue/src/components/dialog/dialog.ts b/packages/@headlessui-vue/src/components/dialog/dialog.ts index 954e222..6394136 100644 --- a/packages/@headlessui-vue/src/components/dialog/dialog.ts +++ b/packages/@headlessui-vue/src/components/dialog/dialog.ts @@ -113,14 +113,6 @@ export let Dialog = defineComponent({ } let dialogState = computed(() => (open.value ? DialogStates.Open : DialogStates.Closed)) - let visible = computed(() => { - if (usesOpenClosedState !== null) { - return usesOpenClosedState.value === State.Open - } - - return dialogState.value === DialogStates.Open - }) - let enabled = computed(() => dialogState.value === DialogStates.Open) let hasNestedDialogs = computed(() => nestedDialogCount.value > 1) // 1 is the current dialog @@ -307,7 +299,7 @@ export let Dialog = defineComponent({ slot, attrs, slots, - visible: visible.value, + visible: dialogState.value === DialogStates.Open, features: Features.RenderStrategy | Features.Static, name: 'Dialog', })