foundation.ts 2.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859
  1. import BaseFoundation, { DefaultAdapter } from '../base/foundation';
  2. import warning from '../utils/warning';
  3. export interface SwitchAdapter<P = Record<string, any>, S = Record<string, any>> extends DefaultAdapter<P, S> {
  4. setNativeControlChecked: (nativeControlChecked: boolean | undefined) => void;
  5. setNativeControlDisabled: (nativeControlDisabled: boolean | undefined) => void;
  6. setFocusVisible: (focusVisible: boolean) => void;
  7. notifyChange: (checked: boolean, e: any) => void;
  8. }
  9. export default class SwitchFoundation<P = Record<string, any>, S = Record<string, any>> extends BaseFoundation<SwitchAdapter<P, S>, P, S> {
  10. constructor(adapter: SwitchAdapter<P, S>) {
  11. super({ ...adapter });
  12. }
  13. init(): void {
  14. const { defaultChecked, checked, disabled } = this.getProps();
  15. this.setChecked(defaultChecked || checked);
  16. this.setDisabled(disabled);
  17. }
  18. setChecked(checked: boolean | undefined): void {
  19. this._adapter.setNativeControlChecked(checked);
  20. }
  21. setDisabled(disabled: boolean | undefined): void {
  22. this._adapter.setNativeControlDisabled(disabled);
  23. }
  24. handleChange(checked: boolean, e: any): void {
  25. const propChecked = this.getProps().checked;
  26. const isControlledComponent = typeof propChecked !== 'undefined';
  27. if (isControlledComponent) {
  28. this._adapter.notifyChange(checked, e);
  29. } else {
  30. this._adapter.setNativeControlChecked(checked);
  31. this._adapter.notifyChange(checked, e);
  32. }
  33. }
  34. handleFocusVisible = (event: any) => {
  35. const { target } = event;
  36. try {
  37. if (target.matches(':focus-visible')) {
  38. this._adapter.setFocusVisible(true);
  39. }
  40. } catch (error){
  41. warning(true, 'Warning: [Semi Switch] The current browser does not support the focus-visible');
  42. }
  43. }
  44. handleBlur = () => {
  45. this._adapter.setFocusVisible(false);
  46. }
  47. // eslint-disable-next-line @typescript-eslint/no-empty-function
  48. destroy(): void {}
  49. }