solid-pianoroll 0.0.25 → 0.0.27

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.
Files changed (10) hide show
  1. package/dist/dev.cjs +356 -44
  2. package/dist/dev.js +356 -44
  3. package/dist/dev.jsx +356 -44
  4. package/dist/index.cjs +356 -44
  5. package/dist/index.d.ts +1 -1
  6. package/dist/index.js +356 -44
  7. package/dist/index.jsx +356 -44
  8. package/package.json +3 -1
  9. package/dist/dev.css +0 -212
  10. package/dist/index.css +0 -212
package/dist/dev.css DELETED
@@ -1,212 +0,0 @@
1
- /* src/PianoRoll.module.css */
2
- .PianoRoll {
3
- box-sizing: border-box;
4
- display: flex;
5
- overflow: hidden;
6
- flex-direction: column;
7
- height: 100%;
8
- user-select: none;
9
- }
10
- .PianoRollContainer {
11
- overflow: hidden;
12
- height: 100%;
13
- display: flex;
14
- flex-direction: row;
15
- }
16
- .PianoRollLeftColumn {
17
- display: flex;
18
- overflow: hidden;
19
- flex-direction: column;
20
- max-width: 250px;
21
- margin-top: 30px;
22
- }
23
- .PianoRollLeftColumn.showTrackList {
24
- width: 30%;
25
- margin-top: 0;
26
- }
27
- .PianoRollRightColumn {
28
- display: flex;
29
- position: relative;
30
- flex-direction: column;
31
- flex: 1;
32
- height: 100%;
33
- }
34
-
35
- /* src/PianoRollKeys.module.css */
36
- .PianoRollKeys {
37
- position: relative;
38
- height: 100%;
39
- border-width: 0;
40
- border-color: #000;
41
- border-style: solid;
42
- border-right-width: 1px;
43
- border-left-width: 1px;
44
- background: white;
45
- cursor: pointer;
46
- background: black;
47
- }
48
- .Key {
49
- transition-property: background-color, box-shadow;
50
- transition-duration: 200ms;
51
- transition-timing-function: ease-out;
52
- border-width: 0px;
53
- position: absolute;
54
- box-sizing: border-box;
55
- width: 120%;
56
- left: -20%;
57
- border-color: #000;
58
- border-style: solid;
59
- transform: rotateX(0deg);
60
- perspective: 100px;
61
- }
62
- .black {
63
- background: black;
64
- border-top-right-radius: 12%;
65
- border-bottom-right-radius: 12%;
66
- margin-left: -20%;
67
- z-index: 1;
68
- border: 1px black outset;
69
- }
70
- .white {
71
- background: white;
72
- border-top-width: 0.5px;
73
- border-bottom-width: 0.5px;
74
- border-top-right-radius: 4%;
75
- border-bottom-right-radius: 4%;
76
- }
77
- .down {
78
- transition: none;
79
- background: red;
80
- transform: rotateX(0deg) rotateY(20deg);
81
- }
82
-
83
- /* src/viewport/ScrollZoomContainer.module.css */
84
- .ScrollZoomContainer {
85
- height: 100%;
86
- width: 100%;
87
- z-index: 4;
88
- }
89
-
90
- /* src/PianoRollNotes.module.css */
91
- .PianoRollNotes {
92
- position: absolute;
93
- flex: 1;
94
- top: 0;
95
- left: 0;
96
- width: 100%;
97
- height: 100%;
98
- z-index: 1;
99
- cursor: grab;
100
- }
101
- .Note {
102
- position: absolute;
103
- box-sizing: border-box;
104
- border-width: 0.5px;
105
- border-style: solid;
106
- border-color: #a00;
107
- cursor: move;
108
- }
109
- .Note.trimStart {
110
- cursor: w-resize;
111
- }
112
- .Note.trimEnd {
113
- cursor: e-resize;
114
- }
115
-
116
- /* src/PianoRollGrid.module.css */
117
- .PianoRollGrid {
118
- position: relative;
119
- width: 100%;
120
- height: 100%;
121
- }
122
- .PianoRollGrid-Row {
123
- position: absolute;
124
- border-style: solid;
125
- border-color: gray;
126
- width: 100%;
127
- border-width: 0;
128
- }
129
- .PianoRollGrid-Row.IsDark {
130
- background-color: rgba(0, 0, 0, 0.2);
131
- }
132
- .PianoRollGrid-Row.Key {
133
- border-width: 0px 1px 0px 0;
134
- }
135
- .PianoRollGrid-Row.IsBlackAndNextIsWhite {
136
- background-color: rgba(0, 0, 0, 0.2);
137
- border-width: 0.1px 1px 0.1px 0;
138
- }
139
- .PianoRollGrid-Time {
140
- position: absolute;
141
- box-sizing: border-box;
142
- top: 0px;
143
- height: 100%;
144
- border-left-style: solid;
145
- border-left-width: 0.5px;
146
- border-left-color: #bbb;
147
- background: #ccc;
148
- }
149
- .PianoRollGrid-Time.Highlighted {
150
- background: #ddd;
151
- }
152
- .PianoRollGrid-Time.HighlightedBorder {
153
- border-left-color: gray;
154
- }
155
-
156
- /* src/PianoRollTrackList.module.css */
157
- .PianoRollTrackList {
158
- position: relative;
159
- height: 100%;
160
- flex: 1;
161
- }
162
- .Track {
163
- border-width: 0px;
164
- position: absolute;
165
- box-sizing: border-box;
166
- width: 100%;
167
- border-color: #000;
168
- border-style: solid;
169
- border-right-width: 1px;
170
- border-bottom-width: 1px;
171
- padding: 2px;
172
- cursor: pointer;
173
- background: lightgrey;
174
- }
175
- Track.selected {
176
- background: gray;
177
- }
178
-
179
- /* src/PianoRollScale.module.css */
180
- .PianoRollScale {
181
- position: relative;
182
- width: 100%;
183
- height: 100%;
184
- }
185
- .PianoRollScale-Time {
186
- position: absolute;
187
- box-sizing: border-box;
188
- top: 0px;
189
- height: 100%;
190
- border-left-style: solid;
191
- border-left-width: 0.5px;
192
- border-left-color: x#666;
193
- border-bottom-color: #333;
194
- border-bottom-style: solid;
195
- border-bottom-width: 0.5px;
196
- background: #777;
197
- display: flex;
198
- align-items: center;
199
- }
200
- .PianoRollScale-Label {
201
- position: absolute;
202
- z-index: 1;
203
- color: #ccc;
204
- margin-left: 3px;
205
- font-size: 0.8em;
206
- }
207
- .PianoRollScale-Time.Highlighted {
208
- background: #666;
209
- }
210
- .PianoRollScale-Time.HighlightedBorder {
211
- border-left-color: #111;
212
- }
package/dist/index.css DELETED
@@ -1,212 +0,0 @@
1
- /* src/PianoRoll.module.css */
2
- .PianoRoll {
3
- box-sizing: border-box;
4
- display: flex;
5
- overflow: hidden;
6
- flex-direction: column;
7
- height: 100%;
8
- user-select: none;
9
- }
10
- .PianoRollContainer {
11
- overflow: hidden;
12
- height: 100%;
13
- display: flex;
14
- flex-direction: row;
15
- }
16
- .PianoRollLeftColumn {
17
- display: flex;
18
- overflow: hidden;
19
- flex-direction: column;
20
- max-width: 250px;
21
- margin-top: 30px;
22
- }
23
- .PianoRollLeftColumn.showTrackList {
24
- width: 30%;
25
- margin-top: 0;
26
- }
27
- .PianoRollRightColumn {
28
- display: flex;
29
- position: relative;
30
- flex-direction: column;
31
- flex: 1;
32
- height: 100%;
33
- }
34
-
35
- /* src/PianoRollKeys.module.css */
36
- .PianoRollKeys {
37
- position: relative;
38
- height: 100%;
39
- border-width: 0;
40
- border-color: #000;
41
- border-style: solid;
42
- border-right-width: 1px;
43
- border-left-width: 1px;
44
- background: white;
45
- cursor: pointer;
46
- background: black;
47
- }
48
- .Key {
49
- transition-property: background-color, box-shadow;
50
- transition-duration: 200ms;
51
- transition-timing-function: ease-out;
52
- border-width: 0px;
53
- position: absolute;
54
- box-sizing: border-box;
55
- width: 120%;
56
- left: -20%;
57
- border-color: #000;
58
- border-style: solid;
59
- transform: rotateX(0deg);
60
- perspective: 100px;
61
- }
62
- .black {
63
- background: black;
64
- border-top-right-radius: 12%;
65
- border-bottom-right-radius: 12%;
66
- margin-left: -20%;
67
- z-index: 1;
68
- border: 1px black outset;
69
- }
70
- .white {
71
- background: white;
72
- border-top-width: 0.5px;
73
- border-bottom-width: 0.5px;
74
- border-top-right-radius: 4%;
75
- border-bottom-right-radius: 4%;
76
- }
77
- .down {
78
- transition: none;
79
- background: red;
80
- transform: rotateX(0deg) rotateY(20deg);
81
- }
82
-
83
- /* src/viewport/ScrollZoomContainer.module.css */
84
- .ScrollZoomContainer {
85
- height: 100%;
86
- width: 100%;
87
- z-index: 4;
88
- }
89
-
90
- /* src/PianoRollNotes.module.css */
91
- .PianoRollNotes {
92
- position: absolute;
93
- flex: 1;
94
- top: 0;
95
- left: 0;
96
- width: 100%;
97
- height: 100%;
98
- z-index: 1;
99
- cursor: grab;
100
- }
101
- .Note {
102
- position: absolute;
103
- box-sizing: border-box;
104
- border-width: 0.5px;
105
- border-style: solid;
106
- border-color: #a00;
107
- cursor: move;
108
- }
109
- .Note.trimStart {
110
- cursor: w-resize;
111
- }
112
- .Note.trimEnd {
113
- cursor: e-resize;
114
- }
115
-
116
- /* src/PianoRollGrid.module.css */
117
- .PianoRollGrid {
118
- position: relative;
119
- width: 100%;
120
- height: 100%;
121
- }
122
- .PianoRollGrid-Row {
123
- position: absolute;
124
- border-style: solid;
125
- border-color: gray;
126
- width: 100%;
127
- border-width: 0;
128
- }
129
- .PianoRollGrid-Row.IsDark {
130
- background-color: rgba(0, 0, 0, 0.2);
131
- }
132
- .PianoRollGrid-Row.Key {
133
- border-width: 0px 1px 0px 0;
134
- }
135
- .PianoRollGrid-Row.IsBlackAndNextIsWhite {
136
- background-color: rgba(0, 0, 0, 0.2);
137
- border-width: 0.1px 1px 0.1px 0;
138
- }
139
- .PianoRollGrid-Time {
140
- position: absolute;
141
- box-sizing: border-box;
142
- top: 0px;
143
- height: 100%;
144
- border-left-style: solid;
145
- border-left-width: 0.5px;
146
- border-left-color: #bbb;
147
- background: #ccc;
148
- }
149
- .PianoRollGrid-Time.Highlighted {
150
- background: #ddd;
151
- }
152
- .PianoRollGrid-Time.HighlightedBorder {
153
- border-left-color: gray;
154
- }
155
-
156
- /* src/PianoRollTrackList.module.css */
157
- .PianoRollTrackList {
158
- position: relative;
159
- height: 100%;
160
- flex: 1;
161
- }
162
- .Track {
163
- border-width: 0px;
164
- position: absolute;
165
- box-sizing: border-box;
166
- width: 100%;
167
- border-color: #000;
168
- border-style: solid;
169
- border-right-width: 1px;
170
- border-bottom-width: 1px;
171
- padding: 2px;
172
- cursor: pointer;
173
- background: lightgrey;
174
- }
175
- Track.selected {
176
- background: gray;
177
- }
178
-
179
- /* src/PianoRollScale.module.css */
180
- .PianoRollScale {
181
- position: relative;
182
- width: 100%;
183
- height: 100%;
184
- }
185
- .PianoRollScale-Time {
186
- position: absolute;
187
- box-sizing: border-box;
188
- top: 0px;
189
- height: 100%;
190
- border-left-style: solid;
191
- border-left-width: 0.5px;
192
- border-left-color: x#666;
193
- border-bottom-color: #333;
194
- border-bottom-style: solid;
195
- border-bottom-width: 0.5px;
196
- background: #777;
197
- display: flex;
198
- align-items: center;
199
- }
200
- .PianoRollScale-Label {
201
- position: absolute;
202
- z-index: 1;
203
- color: #ccc;
204
- margin-left: 3px;
205
- font-size: 0.8em;
206
- }
207
- .PianoRollScale-Time.Highlighted {
208
- background: #666;
209
- }
210
- .PianoRollScale-Time.HighlightedBorder {
211
- border-left-color: #111;
212
- }