@moises.ai/design-system 3.11.3 → 3.11.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@moises.ai/design-system",
3
- "version": "3.11.3",
3
+ "version": "3.11.5",
4
4
  "description": "Design System package based on @radix-ui/themes with custom defaults",
5
5
  "private": false,
6
6
  "type": "module",
@@ -120,25 +120,27 @@ export const TrackHeader = memo(
120
120
  )}
121
121
  </IconButton>
122
122
  {instrumentOptions && (
123
- <DropdownMenu
124
- showActiveTrigger={true}
125
- trigger={
126
- <IconButton
127
- variant="ghost"
128
- size="1"
129
- className={classNames(
130
- styles.instrumentIconButton,
131
- styles.menuOptionsTrigger,
132
- )}
133
- >
134
- {instrumentSelected.icon}
135
- </IconButton>
136
- }
137
- options={instrumentOptions}
138
- onValueChange={onInstrumentChange}
139
- side="bottom"
140
- align="start"
141
- />
123
+ <Box {...DND_PROTECTION}>
124
+ <DropdownMenu
125
+ showActiveTrigger={true}
126
+ trigger={
127
+ <IconButton
128
+ variant="ghost"
129
+ size="1"
130
+ className={classNames(
131
+ styles.instrumentIconButton,
132
+ styles.menuOptionsTrigger,
133
+ )}
134
+ >
135
+ {instrumentSelected.icon}
136
+ </IconButton>
137
+ }
138
+ options={instrumentOptions}
139
+ onValueChange={onInstrumentChange}
140
+ side="bottom"
141
+ align="start"
142
+ />
143
+ </Box>
142
144
  )}
143
145
 
144
146
  <Tooltip content={title}>
@@ -8,7 +8,7 @@ export const MusicIcon = ({ width = 16, height = 16, className, ...props }) => (
8
8
  className={className}
9
9
  {...props}
10
10
  >
11
- <g clipPath="url(#clip0_23974_2573)">
11
+ <g>
12
12
  <path
13
13
  d="M5.56027 10.1048V12.6086C5.56027 13.2138 5.15269 13.743 4.5676 13.8977L3.13494 14.2763C2.28917 14.4998 1.46094 13.862 1.46094 12.9872V12.2149C1.46094 11.6097 1.86851 11.0804 2.45361 10.9258L5.56027 10.1048ZM5.56027 10.1048V3.48019C5.56027 3.17846 5.76292 2.91435 6.05437 2.83624L13.3084 0.892231C13.7318 0.778757 14.1476 1.09781 14.1476 1.53617V7.79232M14.1476 7.79232V10.3072C14.1476 10.9124 13.74 11.4417 13.1549 11.5963L11.7216 11.975C10.8758 12.1985 10.0476 11.5607 10.0476 10.6859V9.91825C10.0476 9.3154 10.4521 8.78755 11.0342 8.63079L14.1476 7.79232Z"
14
14
  stroke="currentColor"
@@ -8,7 +8,7 @@ export const PianoIcon = ({ width = 16, height = 16, className, ...props }) => (
8
8
  className={className}
9
9
  {...props}
10
10
  >
11
- <g clipPath="url(#clip0_2034_833)">
11
+ <g>
12
12
  <path
13
13
  d="M3.6875 15.8182C3.6875 15.4385 3.3797 15.1307 3 15.1307C2.6203 15.1307 2.3125 15.4385 2.3125 15.8182H3.6875ZM6.8125 19.5C6.8125 19.8797 7.1203 20.1875 7.5 20.1875C7.8797 20.1875 8.1875 19.8797 8.1875 19.5H6.8125ZM11.3125 19.6364C11.3125 20.0161 11.6203 20.3239 12 20.3239C12.3797 20.3239 12.6875 20.0161 12.6875 19.6364H11.3125ZM15.8125 19.6364C15.8125 20.0161 16.1203 20.3239 16.5 20.3239C16.8797 20.3239 17.1875 20.0161 17.1875 19.6364H15.8125ZM23 15.8182V16.5057C23.3797 16.5057 23.6875 16.1979 23.6875 15.8182H23ZM1 15.8182H0.312501C0.312501 16.1979 0.620305 16.5057 1 16.5057L1 15.8182ZM14.2535 4.84091L14.8918 4.58551L14.2535 4.84091ZM2.3125 15.8182V21.5455H3.6875V15.8182H2.3125ZM4 23.1875H20.25V21.8125H4V23.1875ZM21.6875 21.5455V15.8182H20.3125V21.5455H21.6875ZM20.25 23.1875C20.7252 23.1875 21.1201 22.9735 21.373 22.6218C21.6066 22.297 21.6875 21.9028 21.6875 21.5455H20.3125C20.3125 21.7153 20.2715 21.7984 20.2567 21.819C20.2522 21.8253 20.2552 21.8193 20.2667 21.8134C20.2784 21.8074 20.2774 21.8125 20.25 21.8125V23.1875ZM2.3125 21.5455C2.3125 22.5017 3.1654 23.1875 4 23.1875V21.8125C3.93616 21.8125 3.8491 21.7824 3.77703 21.7158C3.70741 21.6514 3.6875 21.5875 3.6875 21.5455H2.3125ZM6.8125 15.8182V19.5H8.1875V15.8182H6.8125ZM11.3125 15.8182V19.6364H12.6875V15.8182H11.3125ZM15.8125 15.8182V19.6364H17.1875V15.8182H15.8125ZM22.3125 11.0455V15.8182H23.6875V11.0455H22.3125ZM1.6875 15.8182V6.27273H0.312501V15.8182H1.6875ZM5.58333 2.1875H9.44097V0.812501H5.58333V2.1875ZM17.691 7.91477H19.3333V6.53977H17.691V7.91477ZM9.44097 2.1875C11.2517 2.1875 12.9052 3.32202 13.6152 5.09631L14.8918 4.58551C13.9827 2.31361 11.8397 0.812501 9.44097 0.812501V2.1875ZM23.6875 11.0455C23.6875 8.58354 21.764 6.53977 19.3333 6.53977V7.91477C20.9527 7.91477 22.3125 9.28992 22.3125 11.0455H23.6875ZM13.6152 5.09631C14.2929 6.79018 15.8936 7.91477 17.691 7.91477V6.53977C16.4816 6.53977 15.3704 5.78177 14.8918 4.58551L13.6152 5.09631ZM1.6875 6.27273C1.6875 3.99002 3.4577 2.1875 5.58333 2.1875V0.812501C2.64636 0.812501 0.312501 3.28363 0.312501 6.27273H1.6875ZM23 15.1307H12V16.5057H23V15.1307ZM12 15.1307H1V16.5057H12V15.1307Z"
14
14
  fill="currentColor"
@@ -13,7 +13,7 @@ export const StringsIcon = ({
13
13
  className={className}
14
14
  {...props}
15
15
  >
16
- <g clipPath="url(#clip0_23974_1518)">
16
+ <g>
17
17
  <path
18
18
  d="M7.39153 4.17461C7.56357 5.40362 9.99918 5.73374 10.732 4.00041C11.3987 2.48864 10.132 0.33374 7.73596 0.709194C5.54171 1.02654 4.54794 3.50424 5.33203 5.33377C5.83203 6.50042 6.55153 7.386 7.36952 9.01859C8.02847 10.3338 8.02847 12.367 8.02847 12.367L8.50909 12.4824C9.81528 12.7962 10.8055 13.8634 11.0207 15.1894L11.0442 15.3337H14.9987C14.6654 11.6671 13.6654 9.66707 9.33203 6.50042C8.4067 5.82422 7.62246 5.00666 7.44544 4.41706C7.41961 4.33103 7.40196 4.25018 7.39153 4.17461ZM7.39153 4.17461C7.24806 3.13477 8.46886 3.06401 8.46886 3.3682M2.33203 6.50044C2.33203 6.77658 2.55589 7.00044 2.83203 7.00044C3.10817 7.00044 3.33203 6.77658 3.33203 6.50044C3.33203 6.22429 3.10817 6.00044 2.83203 6.00044C2.55589 6.00044 2.33203 6.22429 2.33203 6.50044ZM4.33203 10.5004C4.33203 10.7766 4.55589 11.0004 4.83203 11.0004C5.10817 11.0004 5.33203 10.7766 5.33203 10.5004C5.33203 10.2243 5.10817 10.0004 4.83203 10.0004C4.55589 10.0004 4.33203 10.2243 4.33203 10.5004Z"
19
19
  stroke="currentColor"
@@ -72,6 +72,7 @@ export const createRenderItem = (MenuPrimitives) => {
72
72
  },
73
73
  )}
74
74
  >
75
+ {opt.icon && <span className={styles.leftIcon}>{opt.icon}</span>}
75
76
  {opt.label}
76
77
  <div className={styles.rightSlot}>
77
78
  <ChevronRightIcon />