sposchedule

1
export default {
2
  root: ({ context }) => ({
3
    class: [
4
      // Position and Shadows
5
      'absolute',
6
      'shadow-md',
7
      'p-fadein',
8
      // Spacing
9
      {
10
        'py-0 px-1':
11
          context?.right ||
12
          context?.left ||
13
          (!context?.right &&
14
            !context?.left &&
15
            !context?.top &&
16
            !context?.bottom),
17
        'py-1 px-0': context?.top || context?.bottom,
18
      },
19
    ],
20
  }),
21
  arrow: ({ context }) => ({
22
    class: [
23
      // Position
24

25
      'absolute',
26

27
      // Size
28
      'w-0',
29
      'h-0',
30

31
      // Shape
32
      'border-transparent',
33
      'border-solid',
34
      {
35
        'border-y-[10px] border-r-[10px] border-l-0 border-r-surface-700':
36
          context?.right ||
37
          (!context?.right &&
38
            !context?.left &&
39
            !context?.top &&
40
            !context?.bottom),
41
        'border-y-[10px] border-l-[10px] border-r-0 border-l-surface-700':
42
          context?.left,
43
        'border-x-[10px] border-t-[10px] border-b-0 border-t-surface-700':
44
          context?.top,
45
        'border-x-[10px] border-b-[10px] border-t-0 border-b-surface-700':
46
          context?.bottom,
47
      },
48

49
      // Spacing
50
      {
51
        '-mt-[10px] top-1/2':
52
          context?.right ||
53
          context?.left ||
54
          (!context?.right &&
55
            !context?.left &&
56
            !context?.top &&
57
            !context?.bottom),
58
        '-ml-[10px] left-1/2': context?.top || context?.bottom,
59
      },
60
    ],
61
  }),
62
  text: {
63
    class: [
64
      'p-3',
65
      'bg-surface-700',
66
      'text-white',
67
      'leading-none',
68
      'rounded-md',
69
      'whitespace-pre-line',
70
      'break-words',
71
    ],
72
  },
73
};
74