@mixd-id/web-scaffold 0.1.230406171 → 0.1.230406172

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 (11) hide show
  1. package/package.json +1 -1
  2. package/src/components/Block.vue +1 -3
  3. package/src/components/Image.vue +2 -1
  4. package/src/index.js +2 -1
  5. package/src/widgets/ArticleSetting.vue +0 -78
  6. package/src/widgets/ComponentSetting.vue +298 -7
  7. package/src/widgets/GridSetting.vue +104 -3
  8. package/src/widgets/IconList.vue +1 -1
  9. package/src/widgets/WebComponentSelector.vue +1 -1
  10. package/src/widgets/WebPageBuilder.vue +66 -17
  11. package/tailwind.config.js +307 -187
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@mixd-id/web-scaffold",
3
3
  "private": false,
4
- "version": "0.1.230406171",
4
+ "version": "0.1.230406172",
5
5
  "scripts": {
6
6
  "dev": "vite serve",
7
7
  "build": "vite build",
package/src/components/Block.vue CHANGED
@@ -15,9 +15,7 @@ export default{
15
15
  mixins: [ componentMixin ],
16
16
 
17
17
  props:{
18
- class: String,
19
- items: Array,
20
- type: String,
18
+ items: Array,
21
19
  }
22
20
 
23
21
  }
package/src/components/Image.vue CHANGED
@@ -247,7 +247,8 @@ export default{
247
247
 
248
248
  watch:{
249
249
 
250
- src(){
250
+ src(to, from){
251
+ console.log('src changed', to, from)
251
252
  this.loadSrc()
252
253
  },
253
254
 
package/src/index.js CHANGED
@@ -338,7 +338,8 @@ export default{
338
338
 
339
339
  app.config.globalProperties.$isDebugMode = () => {
340
340
  if(!('isDebugMode' in privateVars)){
341
- privateVars.isDebugMode = location.search.indexOf('debug-mode') >= 0 || import.meta.env.DEV
341
+ privateVars.isDebugMode = location.search.indexOf('debug-mode') >= 0 ||
342
+ import.meta.env.VITE_APP_DEBUG === 'true'
342
343
  }
343
344
  return privateVars.isDebugMode
344
345
  }
package/src/widgets/ArticleSetting.vue CHANGED
@@ -76,84 +76,6 @@
76
76
  </ColorPicker>
77
77
  </div>
78
78
 
79
- <div class="grid grid-cols-2 gap-4">
80
- <div>
81
- <label class="text-text-400">Font</label>
82
- <Dropdown v-for="(_, index) in viewTypes"
83
- v-show="_.value === viewType"
84
- v-model="fontFamily[index]"
85
- @change="$emit('change')">
86
- <option :value="`${viewType}font-sans`">Sans</option>
87
- <option :value="`${viewType}font-serif`">Serif</option>
88
- <option :value="`${viewType}font-mono`">Mono</option>
89
- <option value="">Not Set</option>
90
- </Dropdown>
91
- </div>
92
-
93
- <div>
94
- <label class="text-text-400">Size</label>
95
- <Dropdown v-for="(_, index) in viewTypes"
96
- v-show="_.value === viewType"
97
- v-model="fontSize[index]"
98
- @change="$emit('change')">
99
- <option :value="`${viewType}text-xs`">Extra Small</option>
100
- <option :value="`${viewType}text-sm`">Small</option>
101
- <option :value="`${viewType}text-base`">Normal</option>
102
- <option :value="`${viewType}text-lg`">Large</option>
103
- <option :value="`${viewType}text-xl`">Extra Large</option>
104
- <option :value="`${viewType}text-2xl`">Extra Large 2</option>
105
- <option :value="`${viewType}text-3xl`">Extra Large 3</option>
106
- <option :value="`${viewType}text-4xl`">Extra Large 4</option>
107
- <option :value="`${viewType}text-5xl`">Extra Large 5</option>
108
- <option :value="`${viewType}text-6xl`">Extra Large 6</option>
109
- <option value="">Not Set</option>
110
- </Dropdown>
111
- </div>
112
-
113
- <div>
114
- <label class="text-text-400">Weight</label>
115
- <Dropdown v-for="(_, index) in viewTypes"
116
- v-show="_.value === viewType"
117
- v-model="fontWeight[index]"
118
- @change="$emit('change')">
119
- <option :value="`${viewType}font-thin`">Thin</option>
120
- <option :value="`${viewType}font-extralight`">Extra Light</option>
121
- <option :value="`${viewType}font-light`">Light</option>
122
- <option :value="`${viewType}font-normal`">Normal</option>
123
- <option :value="`${viewType}font-medium`">Medium</option>
124
- <option :value="`${viewType}font-semibold`">Semi Bold</option>
125
- <option :value="`${viewType}font-bold`">Bold</option>
126
- <option :value="`${viewType}font-extrabold`">Extra Bold</option>
127
- <option :value="`${viewType}font-black`">Black</option>
128
- </Dropdown>
129
- </div>
130
-
131
- <div>
132
- <label class="text-text-400">Line Height</label>
133
- <Dropdown v-for="(_, index) in viewTypes"
134
- v-show="_.value === viewType"
135
- v-model="lineHeight[index]"
136
- class="mt-1"
137
- @change="$emit('change')">
138
- <option :value="`${viewType}leading-3`">Leading 3</option>
139
- <option :value="`${viewType}leading-4`">Leading 4</option>
140
- <option :value="`${viewType}leading-5`">Leading 5</option>
141
- <option :value="`${viewType}leading-6`">Leading 6</option>
142
- <option :value="`${viewType}leading-7`">Leading 7</option>
143
- <option :value="`${viewType}leading-8`">Leading 8</option>
144
- <option :value="`${viewType}leading-9`">Leading 9</option>
145
- <option :value="`${viewType}leading-10`">Leading 10</option>
146
- <option :value="`${viewType}leading-tight`">Tight</option>
147
- <option :value="`${viewType}leading-snug`">Snug</option>
148
- <option :value="`${viewType}leading-normal`">Normal</option>
149
- <option :value="`${viewType}leading-relaxed`">Relaxed</option>
150
- <option :value="`${viewType}leading-loose`">Loose</option>
151
- <option value="">Not Set</option>
152
- </Dropdown>
153
- </div>
154
-
155
- </div>
156
-
157
79
  <ContextMenu ref="headingContext">
158
80
  <div class="flex flex-col">
159
81
  <button class="p-3 text-4xl text-left hover:bg-primary-200" type="button" @click="format('formatBlock', 'h1')">
package/src/widgets/ComponentSetting.vue CHANGED
@@ -19,6 +19,10 @@
19
19
  <option :value="`${viewType}aspect-[8/3]`">8/3</option>
20
20
  <option :value="`${viewType}aspect-[8/5.6]`">8/5.6</option>
21
21
  <option :value="`${viewType}aspect-video`">Video (16:9)</option>
22
+ <option :value="`${viewType}aspect-[1/2]`">1/2</option>
23
+ <option :value="`${viewType}aspect-[2/3]`">2/3</option>
24
+ <option :value="`${viewType}aspect-[3/4]`">3/4</option>
25
+ <option :value="`${viewType}aspect-[8/9]`">8/9</option>
22
26
  </Dropdown>
23
27
  </div>
24
28
  </div>
@@ -80,6 +84,9 @@
80
84
  <Dropdown v-model="left[idx]" @change="apply">
81
85
  <option value="">Not Set</option>
82
86
  <option :value="`${viewType}left-0`">0</option>
87
+ <option :value="`${viewType}left-4`">4</option>
88
+ <option :value="`${viewType}left-6`">6</option>
89
+ <option :value="`${viewType}left-8`">8</option>
83
90
  <option :value="`${viewType}left-12`">12</option>
84
91
  <option :value="`${viewType}left-16`">16</option>
85
92
  <option :value="`${viewType}left-20`">20</option>
@@ -99,6 +106,9 @@
99
106
  <Dropdown v-model="top[idx]" @change="apply">
100
107
  <option value="">Not Set</option>
101
108
  <option :value="`${viewType}top-0`">0</option>
109
+ <option :value="`${viewType}top-4`">4</option>
110
+ <option :value="`${viewType}top-6`">6</option>
111
+ <option :value="`${viewType}top-8`">8</option>
102
112
  <option :value="`${viewType}top-12`">12</option>
103
113
  <option :value="`${viewType}top-16`">16</option>
104
114
  <option :value="`${viewType}top-20`">20</option>
@@ -118,6 +128,9 @@
118
128
  <Dropdown v-model="right[idx]" @change="apply">
119
129
  <option value="">Not Set</option>
120
130
  <option :value="`${viewType}right-0`">0</option>
131
+ <option :value="`${viewType}right-4`">4</option>
132
+ <option :value="`${viewType}right-6`">6</option>
133
+ <option :value="`${viewType}right-8`">8</option>
121
134
  <option :value="`${viewType}right-12`">12</option>
122
135
  <option :value="`${viewType}right-16`">16</option>
123
136
  <option :value="`${viewType}right-20`">20</option>
@@ -137,6 +150,9 @@
137
150
  <Dropdown v-model="bottom[idx]" @change="apply">
138
151
  <option value="">Not Set</option>
139
152
  <option :value="`${viewType}bottom-0`">0</option>
153
+ <option :value="`${viewType}bottom-4`">4</option>
154
+ <option :value="`${viewType}bottom-6`">6</option>
155
+ <option :value="`${viewType}bottom-8`">8</option>
140
156
  <option :value="`${viewType}bottom-12`">12</option>
141
157
  <option :value="`${viewType}bottom-16`">16</option>
142
158
  <option :value="`${viewType}bottom-20`">20</option>
@@ -164,6 +180,7 @@
164
180
  <option :value="`${viewType}overflow-scroll`">Scroll</option>
165
181
  <option :value="`${viewType}overflow-x-auto`">Auto</option>
166
182
  <option :value="`${viewType}overflow-x-hidden`">X Hidden</option>
183
+ <option :value="`${viewType}overflow-y-auto`">Y Auto</option>
167
184
  <option :value="`${viewType}overflow-y-hidden`">Y Hidden</option>
168
185
  <option :value="`${viewType}overflow-x-clip`">X Clip</option>
169
186
  <option :value="`${viewType}overflow-y-clip`">Y Clip</option>
@@ -230,6 +247,14 @@
230
247
  <option :value="`${viewType}w-screen`">Screen</option>
231
248
  <option :value="`${viewType}w-full`">Full</option>
232
249
  <option :value="`${viewType}flex-1`">Flex-1</option>
250
+ <option :value="`${viewType}w-[60px]`">60px</option>
251
+ <option :value="`${viewType}w-[120px]`">120px</option>
252
+ <option :value="`${viewType}w-[180px]`">180px</option>
253
+ <option :value="`${viewType}w-[240px]`">240px</option>
254
+ <option :value="`${viewType}w-[300px]`">300px</option>
255
+ <option :value="`${viewType}w-[360px]`">360px</option>
256
+ <option :value="`${viewType}w-[420px]`">420px</option>
257
+ <option :value="`${viewType}w-[480px]`">480px</option>
233
258
  <option :value="`${viewType}w-1/12`">1/12</option>
234
259
  <option :value="`${viewType}w-2/12`">2/12</option>
235
260
  <option :value="`${viewType}w-3/12`">3/12</option>
@@ -253,6 +278,10 @@
253
278
  @change="apply">
254
279
  <option value="">Not Set</option>
255
280
  <option :value="`${viewType}min-w-none`">None</option>
281
+ <option :value="`${viewType}min-w-full`">Full</option>
282
+ <option :value="`${viewType}min-w-min`">Min</option>
283
+ <option :value="`${viewType}min-w-max`">Max</option>
284
+ <option :value="`${viewType}min-w-fit`">Fit</option>
256
285
  </Dropdown>
257
286
  </div>
258
287
 
@@ -366,7 +395,125 @@
366
395
  </div>
367
396
 
368
397
  <div>
369
- <strong class="text-text-400">Grid</strong>
398
+ <strong class="text-text-400">Typography</strong>
399
+ <div class="h-[1px] bg-text-100 mt-2 mb-4"></div>
400
+
401
+ <div class="grid grid-cols-2 gap-4">
402
+
403
+ <div>
404
+ <label class="text-text-400">Font Family</label>
405
+ <Dropdown v-for="(_, index) in viewTypes"
406
+ v-show="_.value === viewType"
407
+ v-model="fontFamily[index]"
408
+ @change="$emit('change')">
409
+ <option :value="`${viewType}font-sans`">Sans</option>
410
+ <option :value="`${viewType}font-serif`">Serif</option>
411
+ <option :value="`${viewType}font-mono`">Mono</option>
412
+ <option value="">Not Set</option>
413
+ </Dropdown>
414
+ </div>
415
+
416
+ <div>
417
+ <label class="text-text-400">Font Size</label>
418
+ <Dropdown v-for="(_, index) in viewTypes"
419
+ v-show="_.value === viewType"
420
+ v-model="fontSize[index]"
421
+ @change="$emit('change')">
422
+ <option :value="`${viewType}text-xs`">Extra Small</option>
423
+ <option :value="`${viewType}text-sm`">Small</option>
424
+ <option :value="`${viewType}text-base`">Normal</option>
425
+ <option :value="`${viewType}text-lg`">Large</option>
426
+ <option :value="`${viewType}text-xl`">Extra Large</option>
427
+ <option :value="`${viewType}text-2xl`">Extra Large 2</option>
428
+ <option :value="`${viewType}text-3xl`">Extra Large 3</option>
429
+ <option :value="`${viewType}text-4xl`">Extra Large 4</option>
430
+ <option :value="`${viewType}text-5xl`">Extra Large 5</option>
431
+ <option :value="`${viewType}text-6xl`">Extra Large 6</option>
432
+ <option value="">Not Set</option>
433
+ </Dropdown>
434
+ </div>
435
+
436
+ <div>
437
+ <label class="text-text-400">Font Weight</label>
438
+ <Dropdown v-for="(_, index) in viewTypes"
439
+ v-show="_.value === viewType"
440
+ v-model="fontWeight[index]"
441
+ @change="$emit('change')">
442
+ <option :value="`${viewType}font-thin`">Thin</option>
443
+ <option :value="`${viewType}font-extralight`">Extra Light</option>
444
+ <option :value="`${viewType}font-light`">Light</option>
445
+ <option :value="`${viewType}font-normal`">Normal</option>
446
+ <option :value="`${viewType}font-medium`">Medium</option>
447
+ <option :value="`${viewType}font-semibold`">Semi Bold</option>
448
+ <option :value="`${viewType}font-bold`">Bold</option>
449
+ <option :value="`${viewType}font-extrabold`">Extra Bold</option>
450
+ <option :value="`${viewType}font-black`">Black</option>
451
+ </Dropdown>
452
+ </div>
453
+
454
+ <div>
455
+ <label class="text-text-400">Line Height</label>
456
+ <Dropdown v-for="(_, index) in viewTypes"
457
+ v-show="_.value === viewType"
458
+ v-model="lineHeight[index]"
459
+ class="mt-1"
460
+ @change="$emit('change')">
461
+ <option :value="`${viewType}leading-3`">Leading 3</option>
462
+ <option :value="`${viewType}leading-4`">Leading 4</option>
463
+ <option :value="`${viewType}leading-5`">Leading 5</option>
464
+ <option :value="`${viewType}leading-6`">Leading 6</option>
465
+ <option :value="`${viewType}leading-7`">Leading 7</option>
466
+ <option :value="`${viewType}leading-8`">Leading 8</option>
467
+ <option :value="`${viewType}leading-9`">Leading 9</option>
468
+ <option :value="`${viewType}leading-10`">Leading 10</option>
469
+ <option :value="`${viewType}leading-tight`">Tight</option>
470
+ <option :value="`${viewType}leading-snug`">Snug</option>
471
+ <option :value="`${viewType}leading-normal`">Normal</option>
472
+ <option :value="`${viewType}leading-relaxed`">Relaxed</option>
473
+ <option :value="`${viewType}leading-loose`">Loose</option>
474
+ <option value="">Not Set</option>
475
+ </Dropdown>
476
+ </div>
477
+
478
+ <div>
479
+ <label class="text-text-400">Letter Spacing</label>
480
+ <Dropdown v-for="(_, index) in viewTypes"
481
+ v-show="_.value === viewType"
482
+ v-model="lineHeight[index]"
483
+ class="mt-1"
484
+ @change="$emit('change')">
485
+ <option value="">Not Set</option>
486
+ <option :value="`${viewType}tracking-tighter`">Tighter</option>
487
+ <option :value="`${viewType}tracking-tight`">Tight</option>
488
+ <option :value="`${viewType}tracking-normal`">Normal</option>
489
+ <option :value="`${viewType}tracking-wide`">Wide</option>
490
+ <option :value="`${viewType}tracking-wider`">Wider</option>
491
+ <option :value="`${viewType}tracking-widest`">Widest</option>
492
+ </Dropdown>
493
+ </div>
494
+
495
+ <div>
496
+ <label class="text-text-400">Whitespace</label>
497
+ <Dropdown v-for="(_, index) in viewTypes"
498
+ v-show="_.value === viewType"
499
+ v-model="whitespace[index]"
500
+ class="mt-1"
501
+ @change="$emit('change')">
502
+ <option value="">Not Set</option>
503
+ <option :value="`${viewType}whitespace-normal`">Normal</option>
504
+ <option :value="`${viewType}whitespace-nowrap`">No wrap</option>
505
+ <option :value="`${viewType}whitespace-pre`">Pre</option>
506
+ <option :value="`${viewType}whitespace-pre-line`">Pre line</option>
507
+ <option :value="`${viewType}whitespace-pre-wrap`">Pre wrap</option>
508
+ <option :value="`${viewType}whitespace-break-spaces`">Break spaces</option>
509
+ </Dropdown>
510
+ </div>
511
+
512
+ </div>
513
+ </div>
514
+
515
+ <div>
516
+ <strong class="text-text-400">Grid Column</strong>
370
517
  <div class="h-[1px] bg-text-100 mt-2 mb-4"></div>
371
518
  <div class="grid grid-cols-2 gap-4">
372
519
  <div>
@@ -374,8 +521,8 @@
374
521
  <Dropdown v-for="(_viewType, index) in viewTypes"
375
522
  v-show="_viewType.value === viewType"
376
523
  v-model="colSpan[index]"
377
-
378
524
  @change="apply">
525
+ <option value="">Not Set</option>
379
526
  <option :value="`${viewType}col-span-1`">1</option>
380
527
  <option :value="`${viewType}col-span-2`">2</option>
381
528
  <option :value="`${viewType}col-span-3`">3</option>
@@ -390,6 +537,28 @@
390
537
  <option :value="`${viewType}col-span-12`">12</option>
391
538
  </Dropdown>
392
539
  </div>
540
+
541
+ <div>
542
+ <label class="flex-1 text-text-400">Row Span</label>
543
+ <Dropdown v-for="(_viewType, index) in viewTypes"
544
+ v-show="_viewType.value === viewType"
545
+ v-model="rowSpan[index]"
546
+ @change="apply">
547
+ <option value="">Not Set</option>
548
+ <option :value="`${viewType}row-span-1`">1</option>
549
+ <option :value="`${viewType}row-span-2`">2</option>
550
+ <option :value="`${viewType}row-span-3`">3</option>
551
+ <option :value="`${viewType}row-span-4`">4</option>
552
+ <option :value="`${viewType}row-span-5`">5</option>
553
+ <option :value="`${viewType}row-span-6`">6</option>
554
+ <option :value="`${viewType}row-span-7`">7</option>
555
+ <option :value="`${viewType}row-span-8`">8</option>
556
+ <option :value="`${viewType}row-span-9`">9</option>
557
+ <option :value="`${viewType}row-span-10`">10</option>
558
+ <option :value="`${viewType}row-span-11`">11</option>
559
+ <option :value="`${viewType}row-span-12`">12</option>
560
+ </Dropdown>
561
+ </div>
393
562
  </div>
394
563
  </div>
395
564
 
@@ -527,11 +696,13 @@
527
696
  @change="apply">
528
697
  <option value="">Not Set</option>
529
698
  <option :value="`${viewType}rounded-none`">None</option>
530
- <option :value="`${viewType}rounded-sm`">1</option>
531
- <option :value="`${viewType}rounded`">2</option>
532
- <option :value="`${viewType}rounded-md`">3</option>
533
- <option :value="`${viewType}rounded-lg`">4</option>
534
- <option :value="`${viewType}rounded-2xl`">5</option>
699
+ <option :value="`${viewType}rounded-sm`">Sm</option>
700
+ <option :value="`${viewType}rounded`">Normal</option>
701
+ <option :value="`${viewType}rounded-md`">Md</option>
702
+ <option :value="`${viewType}rounded-lg`">Lg</option>
703
+ <option :value="`${viewType}rounded-xl`">xl</option>
704
+ <option :value="`${viewType}rounded-2xl`">2xl</option>
705
+ <option :value="`${viewType}rounded-3xl`">3xl</option>
535
706
  <option :value="`${viewType}rounded-full`">Rounded</option>
536
707
  </Dropdown>
537
708
  </div>
@@ -603,6 +774,63 @@
603
774
  </div>
604
775
  </div>
605
776
 
777
+ <div>
778
+ <strong class="flex-1 text-text-400">Transition & Animation</strong>
779
+ <div class="h-[1px] bg-text-100 mt-2 mb-4"></div>
780
+ <div class="grid grid-cols-2 gap-4">
781
+
782
+ <div>
783
+ <label :class="$style.label">Animation</label>
784
+ <Dropdown v-for="(_, index) in viewTypes"
785
+ v-show="viewType === _.value"
786
+ v-model="animate[index]"
787
+ @change="apply">
788
+ <option value="">Not Set</option>
789
+ <option :value="`${viewType}animate-spin`">Spin</option>
790
+ <option :value="`${viewType}animate-ping`">Ping</option>
791
+ <option :value="`${viewType}animate-pulse`">Pulse</option>
792
+ <option :value="`${viewType}animate-bounce`">Bounce</option>
793
+ </Dropdown>
794
+ </div>
795
+
796
+ </div>
797
+ </div>
798
+
799
+ <div>
800
+ <strong class="flex-1 text-text-400">Filters</strong>
801
+ <div class="h-[1px] bg-text-100 mt-2 mb-4"></div>
802
+ <div class="grid grid-cols-2 gap-4">
803
+
804
+ <div>
805
+ <label :class="$style.label">Blur</label>
806
+ <Dropdown v-for="(_, index) in viewTypes"
807
+ v-show="viewType === _.value"
808
+ v-model="blur[index]"
809
+ @change="apply">
810
+ <option value="">Not Set</option>
811
+ <option :value="`${viewType}blur-sm`">sm</option>
812
+ <option :value="`${viewType}blur-md`">md</option>
813
+ <option :value="`${viewType}blur-lg`">lg</option>
814
+ <option :value="`${viewType}blur-xl`">xl</option>
815
+ <option :value="`${viewType}blur-2xl`">2xl</option>
816
+ </Dropdown>
817
+ </div>
818
+
819
+ <div>
820
+ <label :class="$style.label">Grayscale</label>
821
+ <Dropdown v-for="(_, index) in viewTypes"
822
+ v-show="viewType === _.value"
823
+ v-model="grayscale[index]"
824
+ @change="apply">
825
+ <option value="">Not Set</option>
826
+ <option :value="`${viewType}grayscale`">Grayscale</option>
827
+ <option :value="`${viewType}grayscale-0`">Grayscale 0</option>
828
+ </Dropdown>
829
+ </div>
830
+
831
+ </div>
832
+ </div>
833
+
606
834
  <div class="my-4"></div>
607
835
 
608
836
  </div>
@@ -639,6 +867,13 @@ export default{
639
867
 
640
868
  computed: {
641
869
 
870
+ animate(){
871
+ if(!Array.isArray(this.item.props.animate))
872
+ this.item.props.animate = []
873
+
874
+ return this.item.props.animate
875
+ },
876
+
642
877
  bdColor(){
643
878
  if(!Array.isArray(this.item.props.bdColor))
644
879
  this.item.props.bdColor = []
@@ -702,6 +937,13 @@ export default{
702
937
  return this.item.props.bgSize
703
938
  },
704
939
 
940
+ blur(){
941
+ if(!Array.isArray(this.item.props.blur))
942
+ this.item.props.blur = []
943
+
944
+ return this.item.props.blur
945
+ },
946
+
705
947
  bottom(){
706
948
  if(!Array.isArray(this.item.props.bottom))
707
949
  this.item.props.bottom = []
@@ -723,6 +965,48 @@ export default{
723
965
  return this.item.props.colSpan
724
966
  },
725
967
 
968
+ fontFamily(){
969
+ if(!Array.isArray(this.item.props.fontFamily))
970
+ this.item.props.fontFamily = []
971
+
972
+ return this.item.props.fontFamily
973
+ },
974
+
975
+ fontSize(){
976
+ if(!Array.isArray(this.item.props.fontSize))
977
+ this.item.props.fontSize = []
978
+
979
+ return this.item.props.fontSize
980
+ },
981
+
982
+ fontWeight(){
983
+ if(!Array.isArray(this.item.props.fontWeight))
984
+ this.item.props.fontWeight = []
985
+
986
+ return this.item.props.fontWeight
987
+ },
988
+
989
+ grayscale(){
990
+ if(!Array.isArray(this.item.props.grayscale))
991
+ this.item.props.grayscale = []
992
+
993
+ return this.item.props.grayscale
994
+ },
995
+
996
+ lineHeight(){
997
+ if(!Array.isArray(this.item.props.lineHeight))
998
+ this.item.props.lineHeight = []
999
+
1000
+ return this.item.props.lineHeight
1001
+ },
1002
+
1003
+ rowSpan(){
1004
+ if(!Array.isArray(this.item.props.rowSpan))
1005
+ this.item.props.rowSpan = []
1006
+
1007
+ return this.item.props.rowSpan
1008
+ },
1009
+
726
1010
  display(){
727
1011
  if(!Array.isArray(this.item.props.display))
728
1012
  this.item.props.display = []
@@ -827,6 +1111,13 @@ export default{
827
1111
  return this.item.props.top
828
1112
  },
829
1113
 
1114
+ whitespace(){
1115
+ if(!Array.isArray(this.item.props.whitespace))
1116
+ this.item.props.whitespace = []
1117
+
1118
+ return this.item.props.whitespace
1119
+ },
1120
+
830
1121
  width(){
831
1122
  if(!Array.isArray(this.item.props.width))
832
1123
  this.item.props.width = []