import { watch, ref } from '../../../../../adapter-vue';
import { useButtonPanelStatus } from '../../../../hooks';
import { defaultUI, closedPanelUI } from '../../../config/button/index';

export const useBtnConfig = (type, state) => {
  const { status: panelStatus } = useButtonPanelStatus();
  const btnConfig = ref(defaultUI[type][state.value]);

  watch(
    [state, panelStatus],
    () => {
      let config = defaultUI;
      if (panelStatus.value === 'close') {
        // @ts-ignore
        config = closedPanelUI;
      }
      btnConfig.value = config?.[type]?.[state.value] || {};
    },
    { immediate: true },
  );
  return btnConfig;
};