@truedat/qx 8.10.2 → 8.10.4

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 (61) hide show
  1. package/package.json +3 -3
  2. package/src/components/QxRoutes.js +8 -7
  3. package/src/components/__tests__/QxRoutes.spec.js +2 -1
  4. package/src/components/__tests__/__fixtures__/helper.js +13 -0
  5. package/src/components/__tests__/__snapshots__/QxRoutes.spec.js.snap +1 -1
  6. package/src/components/common/ClauseViewer.js +52 -8
  7. package/src/components/common/DescriptionInput.js +9 -34
  8. package/src/components/common/TypeSelector.js +20 -10
  9. package/src/components/common/__tests__/ClauseViewer.spec.js +150 -0
  10. package/src/components/common/__tests__/DescriptionInput.spec.js +2 -5
  11. package/src/components/common/__tests__/__snapshots__/DescriptionInput.spec.js.snap +7 -10
  12. package/src/components/common/expressions/Clauses.js +22 -17
  13. package/src/components/common/expressions/Condition.js +201 -102
  14. package/src/components/common/expressions/Expression.js +17 -23
  15. package/src/components/common/expressions/FunctionSelector.js +3 -3
  16. package/src/components/common/expressions/ShapeSelector.js +1 -1
  17. package/src/components/common/expressions/__tests__/Clauses.spec.js +1 -1
  18. package/src/components/common/expressions/__tests__/Condition.spec.js +83 -26
  19. package/src/components/common/expressions/__tests__/ParamSelector.spec.js +1 -1
  20. package/src/components/common/expressions/__tests__/__snapshots__/Clauses.spec.js.snap +18 -22
  21. package/src/components/common/expressions/__tests__/__snapshots__/Condition.spec.js.snap +215 -216
  22. package/src/components/common/expressions/__tests__/__snapshots__/ConstantSelector.spec.js.snap +6 -10
  23. package/src/components/common/expressions/__tests__/__snapshots__/Expression.spec.js.snap +630 -654
  24. package/src/components/common/expressions/__tests__/__snapshots__/FunctionArgs.spec.js.snap +193 -201
  25. package/src/components/common/expressions/__tests__/__snapshots__/FunctionSelector.spec.js.snap +450 -466
  26. package/src/components/common/expressions/__tests__/__snapshots__/ShapeSelector.spec.js.snap +34 -34
  27. package/src/components/common/expressions/constantInputs/AnySelector.js +1 -0
  28. package/src/components/common/expressions/constantInputs/__tests__/__snapshots__/AnySelector.spec.js.snap +15 -15
  29. package/src/components/dataViews/__tests__/__snapshots__/AdvancedDataViewEditor.spec.js.snap +378 -406
  30. package/src/components/dataViews/__tests__/__snapshots__/DataViewSummary.spec.js.snap +6 -6
  31. package/src/components/dataViews/__tests__/__snapshots__/Queryable.spec.js.snap +489 -577
  32. package/src/components/dataViews/__tests__/__snapshots__/Queryables.spec.js.snap +400 -476
  33. package/src/components/dataViews/advancedForm/Queryable.js +56 -64
  34. package/src/components/dataViews/advancedForm/Queryables.js +11 -2
  35. package/src/components/dataViews/queryableProperties/Join.js +16 -6
  36. package/src/components/dataViews/queryableProperties/__tests__/__snapshots__/Join.spec.js.snap +0 -28
  37. package/src/components/dataViews/queryableProperties/__tests__/__snapshots__/Select.spec.js.snap +270 -282
  38. package/src/components/dataViews/queryableProperties/__tests__/__snapshots__/SelectField.spec.js.snap +172 -180
  39. package/src/components/dataViews/simpleForm/DatasetForm.js +4 -0
  40. package/src/components/dataViews/simpleForm/FormQueryable.js +49 -53
  41. package/src/components/dataViews/summary/Where.js +3 -2
  42. package/src/components/functions/FunctionEdit.js +92 -0
  43. package/src/components/functions/FunctionEditor.js +32 -10
  44. package/src/components/functions/FunctionParams.js +54 -61
  45. package/src/components/functions/FunctionsList.js +213 -0
  46. package/src/components/functions/__tests__/FunctionEdit.spec.js +168 -0
  47. package/src/components/functions/__tests__/FunctionParams.spec.js +1 -8
  48. package/src/components/functions/__tests__/FunctionsList.spec.js +62 -0
  49. package/src/components/functions/__tests__/__snapshots__/FunctionEditor.spec.js.snap +553 -469
  50. package/src/components/functions/__tests__/__snapshots__/FunctionParams.spec.js.snap +139 -161
  51. package/src/components/functions/__tests__/__snapshots__/FunctionsList.spec.js.snap +588 -0
  52. package/src/components/qualityControls/__tests__/NewQualityControl.spec.js +4 -0
  53. package/src/components/qualityControls/__tests__/QualityControlEditor.spec.js +8 -1
  54. package/src/components/qualityControls/__tests__/__snapshots__/EditQualityControl.spec.js.snap +109 -118
  55. package/src/components/qualityControls/__tests__/__snapshots__/NewDraftQualityControl.spec.js.snap +109 -118
  56. package/src/components/qualityControls/__tests__/__snapshots__/QualityControlEditor.spec.js.snap +471 -468
  57. package/src/hooks/useFunctions.js +6 -0
  58. package/src/styles/Expression.less +39 -6
  59. package/src/components/functions/Functions.js +0 -143
  60. package/src/components/functions/__tests__/Functions.spec.js +0 -56
  61. package/src/components/functions/__tests__/__snapshots__/Functions.spec.js.snap +0 -85
@@ -179,17 +179,42 @@ exports[`<FunctionEditor /> matches snapshot without onDelete 1`] = `
179
179
  class="row"
180
180
  >
181
181
  <div
182
- class="ui horizontal link list"
183
- role="list"
182
+ class="field"
184
183
  >
185
- <a
186
- class="item"
187
- role="listitem"
188
- style="font-style: italic; font-size: 13px; padding: 9.5px 14px;"
189
- tabindex="0"
184
+ <label>
185
+ functions.form.label
186
+ </label>
187
+ <div
188
+ class="ui input"
190
189
  >
191
- Add description
192
- </a>
190
+ <input
191
+ autocomplete="off"
192
+ placeholder="functions.form.label"
193
+ type="text"
194
+ value=""
195
+ />
196
+ </div>
197
+ </div>
198
+ </div>
199
+ <div
200
+ class="row"
201
+ >
202
+ <div
203
+ class="field"
204
+ >
205
+ <label>
206
+ Description
207
+ </label>
208
+ <div
209
+ class="ui fluid input"
210
+ >
211
+ <input
212
+ name="description"
213
+ placeholder="Description"
214
+ type="text"
215
+ value=""
216
+ />
217
+ </div>
193
218
  </div>
194
219
  </div>
195
220
  </div>
@@ -220,172 +245,168 @@ exports[`<FunctionEditor /> matches snapshot without onDelete 1`] = `
220
245
  Expression
221
246
  </h5>
222
247
  <div
223
- class="ui grid"
248
+ class="expression-container"
224
249
  >
225
250
  <div
226
- class="sixteen wide column"
251
+ class="expression-content"
227
252
  >
228
253
  <div
229
- class="expression-container"
254
+ aria-expanded="false"
255
+ class="ui top left pointing dropdown"
256
+ role="listbox"
257
+ tabindex="0"
230
258
  >
231
259
  <div
232
- aria-expanded="false"
233
- class="ui top left pointing dropdown"
234
- role="listbox"
235
- tabindex="0"
260
+ class="shape-selector-trigger"
261
+ >
262
+ f(x)
263
+ </div>
264
+ <div
265
+ class="menu transition"
236
266
  >
237
267
  <div
238
- class="shape-selector-trigger"
239
- >
240
- f(x)
241
- </div>
242
- <div
243
- class="menu transition"
268
+ aria-checked="true"
269
+ aria-selected="true"
270
+ class="active selected item"
271
+ role="option"
272
+ style="pointer-events: all;"
244
273
  >
245
274
  <div
246
- aria-checked="false"
247
- aria-selected="false"
248
- class="item"
249
- role="option"
250
- style="pointer-events: all;"
275
+ class="text flex-center"
251
276
  >
252
- <div
253
- class="text flex-center"
277
+ <small
278
+ style="margin-right: 5px;"
254
279
  >
255
- <small
256
- style="margin-right: 5px;"
257
- >
258
- <b>
259
- <code>
260
- [π]
261
- </code>
262
- </b>
263
- </small>
264
- Constant
265
- </div>
280
+ <b>
281
+ <code>
282
+ f(x)
283
+ </code>
284
+ </b>
285
+ </small>
286
+ Function
266
287
  </div>
288
+ </div>
289
+ <div
290
+ aria-checked="false"
291
+ aria-selected="false"
292
+ class="item"
293
+ role="option"
294
+ style="pointer-events: all;"
295
+ >
267
296
  <div
268
- aria-checked="true"
269
- aria-selected="true"
270
- class="active selected item"
271
- role="option"
272
- style="pointer-events: all;"
297
+ class="text flex-center"
273
298
  >
274
- <div
275
- class="text flex-center"
299
+ <small
300
+ style="margin-right: 5px;"
276
301
  >
277
- <small
278
- style="margin-right: 5px;"
279
- >
280
- <b>
281
- <code>
282
- f(x)
283
- </code>
284
- </b>
285
- </small>
286
- Function
287
- </div>
302
+ <b>
303
+ <code>
304
+ [π]
305
+ </code>
306
+ </b>
307
+ </small>
308
+ Constant
288
309
  </div>
289
310
  </div>
290
311
  </div>
312
+ </div>
313
+ <div
314
+ class="accordion ui fluid no-margin"
315
+ >
291
316
  <div
292
- class="accordion ui fluid no-margin"
317
+ class="active title no-padding"
293
318
  >
294
319
  <div
295
- class="active title no-padding"
320
+ class="flex-center"
296
321
  >
322
+ <i
323
+ aria-hidden="true"
324
+ class="dropdown icon"
325
+ />
297
326
  <div
298
- class="flex-center"
327
+ class="sixteen wide field"
299
328
  >
300
- <i
301
- aria-hidden="true"
302
- class="dropdown icon"
303
- />
304
329
  <div
305
- class="sixteen wide field"
330
+ aria-expanded="false"
331
+ class="ui fluid search selection dropdown"
332
+ role="combobox"
306
333
  >
334
+ <input
335
+ aria-autocomplete="list"
336
+ autocomplete="off"
337
+ class="search"
338
+ tabindex="0"
339
+ type="text"
340
+ value=""
341
+ />
342
+ <div
343
+ aria-atomic="true"
344
+ aria-live="polite"
345
+ class="divider text"
346
+ role="alert"
347
+ >
348
+ Select a function of type boolean
349
+ </div>
350
+ <i
351
+ aria-hidden="true"
352
+ class="dropdown icon"
353
+ />
307
354
  <div
308
- aria-expanded="false"
309
- class="ui fluid search selection dropdown"
310
- role="combobox"
355
+ class="menu transition"
356
+ role="listbox"
311
357
  >
312
- <input
313
- aria-autocomplete="list"
314
- autocomplete="off"
315
- class="search"
316
- tabindex="0"
317
- type="text"
318
- value=""
319
- />
320
358
  <div
321
- aria-atomic="true"
322
- aria-live="polite"
323
- class="divider text"
324
- role="alert"
325
- >
326
- Select a function of type boolean
327
- </div>
328
- <i
329
- aria-hidden="true"
330
- class="dropdown icon"
331
- />
332
- <div
333
- class="menu transition"
334
- role="listbox"
359
+ aria-checked="false"
360
+ aria-selected="true"
361
+ class="selected item"
362
+ role="option"
363
+ style="pointer-events: all;"
335
364
  >
336
365
  <div
337
- aria-checked="false"
338
- aria-selected="true"
339
- class="selected item"
340
- role="option"
341
- style="pointer-events: all;"
366
+ class="ui header"
342
367
  >
343
368
  <div
344
- class="ui header"
369
+ class="flex-center"
345
370
  >
371
+ <div>
372
+ eq
373
+ </div>
346
374
  <div
347
- class="flex-center"
375
+ class="function-params-label"
348
376
  >
349
- <div>
350
- eq
377
+ <div
378
+ class="ui grey label"
379
+ >
380
+ <i
381
+ aria-hidden="true"
382
+ class="question circle outline icon"
383
+ />
384
+ arg1
351
385
  </div>
352
386
  <div
353
- class="function-params-label"
387
+ class="ui grey label"
354
388
  >
355
- <div
356
- class="ui grey label"
357
- >
358
- <i
359
- aria-hidden="true"
360
- class="question circle outline icon"
361
- />
362
- arg1
363
- </div>
364
- <div
365
- class="ui grey label"
366
- >
367
- <i
368
- aria-hidden="true"
369
- class="question circle outline icon"
370
- />
371
- arg2
372
- </div>
389
+ <i
390
+ aria-hidden="true"
391
+ class="question circle outline icon"
392
+ />
393
+ arg2
373
394
  </div>
374
395
  </div>
375
396
  </div>
376
- <div
377
- class="sub header"
378
- />
379
397
  </div>
398
+ <div
399
+ class="sub header"
400
+ />
380
401
  </div>
381
402
  </div>
382
403
  </div>
383
404
  </div>
384
405
  </div>
385
- <div
386
- class="content active no-padding"
387
- />
388
406
  </div>
407
+ <div
408
+ class="content active no-padding"
409
+ />
389
410
  </div>
390
411
  </div>
391
412
  </div>
@@ -593,17 +614,42 @@ exports[`<FunctionEditor /> matches the latest snapshot 1`] = `
593
614
  class="row"
594
615
  >
595
616
  <div
596
- class="ui horizontal link list"
597
- role="list"
617
+ class="field"
598
618
  >
599
- <a
600
- class="item"
601
- role="listitem"
602
- style="font-style: italic; font-size: 13px; padding: 9.5px 14px;"
603
- tabindex="0"
619
+ <label>
620
+ functions.form.label
621
+ </label>
622
+ <div
623
+ class="ui input"
604
624
  >
605
- Add description
606
- </a>
625
+ <input
626
+ autocomplete="off"
627
+ placeholder="functions.form.label"
628
+ type="text"
629
+ value=""
630
+ />
631
+ </div>
632
+ </div>
633
+ </div>
634
+ <div
635
+ class="row"
636
+ >
637
+ <div
638
+ class="field"
639
+ >
640
+ <label>
641
+ Description
642
+ </label>
643
+ <div
644
+ class="ui fluid input"
645
+ >
646
+ <input
647
+ name="description"
648
+ placeholder="Description"
649
+ type="text"
650
+ value=""
651
+ />
652
+ </div>
607
653
  </div>
608
654
  </div>
609
655
  </div>
@@ -634,172 +680,168 @@ exports[`<FunctionEditor /> matches the latest snapshot 1`] = `
634
680
  Expression
635
681
  </h5>
636
682
  <div
637
- class="ui grid"
683
+ class="expression-container"
638
684
  >
639
685
  <div
640
- class="sixteen wide column"
686
+ class="expression-content"
641
687
  >
642
688
  <div
643
- class="expression-container"
689
+ aria-expanded="false"
690
+ class="ui top left pointing dropdown"
691
+ role="listbox"
692
+ tabindex="0"
644
693
  >
645
694
  <div
646
- aria-expanded="false"
647
- class="ui top left pointing dropdown"
648
- role="listbox"
649
- tabindex="0"
695
+ class="shape-selector-trigger"
696
+ >
697
+ f(x)
698
+ </div>
699
+ <div
700
+ class="menu transition"
650
701
  >
651
702
  <div
652
- class="shape-selector-trigger"
653
- >
654
- f(x)
655
- </div>
656
- <div
657
- class="menu transition"
703
+ aria-checked="true"
704
+ aria-selected="true"
705
+ class="active selected item"
706
+ role="option"
707
+ style="pointer-events: all;"
658
708
  >
659
709
  <div
660
- aria-checked="false"
661
- aria-selected="false"
662
- class="item"
663
- role="option"
664
- style="pointer-events: all;"
710
+ class="text flex-center"
665
711
  >
666
- <div
667
- class="text flex-center"
712
+ <small
713
+ style="margin-right: 5px;"
668
714
  >
669
- <small
670
- style="margin-right: 5px;"
671
- >
672
- <b>
673
- <code>
674
- [π]
675
- </code>
676
- </b>
677
- </small>
678
- Constant
679
- </div>
715
+ <b>
716
+ <code>
717
+ f(x)
718
+ </code>
719
+ </b>
720
+ </small>
721
+ Function
680
722
  </div>
723
+ </div>
724
+ <div
725
+ aria-checked="false"
726
+ aria-selected="false"
727
+ class="item"
728
+ role="option"
729
+ style="pointer-events: all;"
730
+ >
681
731
  <div
682
- aria-checked="true"
683
- aria-selected="true"
684
- class="active selected item"
685
- role="option"
686
- style="pointer-events: all;"
732
+ class="text flex-center"
687
733
  >
688
- <div
689
- class="text flex-center"
734
+ <small
735
+ style="margin-right: 5px;"
690
736
  >
691
- <small
692
- style="margin-right: 5px;"
693
- >
694
- <b>
695
- <code>
696
- f(x)
697
- </code>
698
- </b>
699
- </small>
700
- Function
701
- </div>
737
+ <b>
738
+ <code>
739
+ [π]
740
+ </code>
741
+ </b>
742
+ </small>
743
+ Constant
702
744
  </div>
703
745
  </div>
704
746
  </div>
747
+ </div>
748
+ <div
749
+ class="accordion ui fluid no-margin"
750
+ >
705
751
  <div
706
- class="accordion ui fluid no-margin"
752
+ class="active title no-padding"
707
753
  >
708
754
  <div
709
- class="active title no-padding"
755
+ class="flex-center"
710
756
  >
757
+ <i
758
+ aria-hidden="true"
759
+ class="dropdown icon"
760
+ />
711
761
  <div
712
- class="flex-center"
762
+ class="sixteen wide field"
713
763
  >
714
- <i
715
- aria-hidden="true"
716
- class="dropdown icon"
717
- />
718
764
  <div
719
- class="sixteen wide field"
765
+ aria-expanded="false"
766
+ class="ui fluid search selection dropdown"
767
+ role="combobox"
720
768
  >
769
+ <input
770
+ aria-autocomplete="list"
771
+ autocomplete="off"
772
+ class="search"
773
+ tabindex="0"
774
+ type="text"
775
+ value=""
776
+ />
721
777
  <div
722
- aria-expanded="false"
723
- class="ui fluid search selection dropdown"
724
- role="combobox"
778
+ aria-atomic="true"
779
+ aria-live="polite"
780
+ class="divider text"
781
+ role="alert"
782
+ >
783
+ Select a function of type boolean
784
+ </div>
785
+ <i
786
+ aria-hidden="true"
787
+ class="dropdown icon"
788
+ />
789
+ <div
790
+ class="menu transition"
791
+ role="listbox"
725
792
  >
726
- <input
727
- aria-autocomplete="list"
728
- autocomplete="off"
729
- class="search"
730
- tabindex="0"
731
- type="text"
732
- value=""
733
- />
734
- <div
735
- aria-atomic="true"
736
- aria-live="polite"
737
- class="divider text"
738
- role="alert"
739
- >
740
- Select a function of type boolean
741
- </div>
742
- <i
743
- aria-hidden="true"
744
- class="dropdown icon"
745
- />
746
793
  <div
747
- class="menu transition"
748
- role="listbox"
794
+ aria-checked="false"
795
+ aria-selected="true"
796
+ class="selected item"
797
+ role="option"
798
+ style="pointer-events: all;"
749
799
  >
750
800
  <div
751
- aria-checked="false"
752
- aria-selected="true"
753
- class="selected item"
754
- role="option"
755
- style="pointer-events: all;"
801
+ class="ui header"
756
802
  >
757
803
  <div
758
- class="ui header"
804
+ class="flex-center"
759
805
  >
806
+ <div>
807
+ eq
808
+ </div>
760
809
  <div
761
- class="flex-center"
810
+ class="function-params-label"
762
811
  >
763
- <div>
764
- eq
812
+ <div
813
+ class="ui grey label"
814
+ >
815
+ <i
816
+ aria-hidden="true"
817
+ class="question circle outline icon"
818
+ />
819
+ arg1
765
820
  </div>
766
821
  <div
767
- class="function-params-label"
822
+ class="ui grey label"
768
823
  >
769
- <div
770
- class="ui grey label"
771
- >
772
- <i
773
- aria-hidden="true"
774
- class="question circle outline icon"
775
- />
776
- arg1
777
- </div>
778
- <div
779
- class="ui grey label"
780
- >
781
- <i
782
- aria-hidden="true"
783
- class="question circle outline icon"
784
- />
785
- arg2
786
- </div>
824
+ <i
825
+ aria-hidden="true"
826
+ class="question circle outline icon"
827
+ />
828
+ arg2
787
829
  </div>
788
830
  </div>
789
831
  </div>
790
- <div
791
- class="sub header"
792
- />
793
832
  </div>
833
+ <div
834
+ class="sub header"
835
+ />
794
836
  </div>
795
837
  </div>
796
838
  </div>
797
839
  </div>
798
840
  </div>
799
- <div
800
- class="content active no-padding"
801
- />
802
841
  </div>
842
+ <div
843
+ class="content active no-padding"
844
+ />
803
845
  </div>
804
846
  </div>
805
847
  </div>
@@ -1010,17 +1052,42 @@ exports[`<FunctionEditor /> test cancel button with confirm 1`] = `
1010
1052
  class="row"
1011
1053
  >
1012
1054
  <div
1013
- class="ui horizontal link list"
1014
- role="list"
1055
+ class="field"
1015
1056
  >
1016
- <a
1017
- class="item"
1018
- role="listitem"
1019
- style="font-style: italic; font-size: 13px; padding: 9.5px 14px;"
1020
- tabindex="0"
1057
+ <label>
1058
+ functions.form.label
1059
+ </label>
1060
+ <div
1061
+ class="ui input"
1021
1062
  >
1022
- description
1023
- </a>
1063
+ <input
1064
+ autocomplete="off"
1065
+ placeholder="functions.form.label"
1066
+ type="text"
1067
+ value="description"
1068
+ />
1069
+ </div>
1070
+ </div>
1071
+ </div>
1072
+ <div
1073
+ class="row"
1074
+ >
1075
+ <div
1076
+ class="field"
1077
+ >
1078
+ <label>
1079
+ Description
1080
+ </label>
1081
+ <div
1082
+ class="ui fluid input"
1083
+ >
1084
+ <input
1085
+ name="description"
1086
+ placeholder="Description"
1087
+ type="text"
1088
+ value=""
1089
+ />
1090
+ </div>
1024
1091
  </div>
1025
1092
  </div>
1026
1093
  </div>
@@ -1051,25 +1118,92 @@ exports[`<FunctionEditor /> test cancel button with confirm 1`] = `
1051
1118
  Expression
1052
1119
  </h5>
1053
1120
  <div
1054
- class="ui grid"
1121
+ class="expression-container"
1055
1122
  >
1056
1123
  <div
1057
- class="sixteen wide column"
1124
+ class="expression-content"
1058
1125
  >
1059
1126
  <div
1060
- class="expression-container"
1127
+ aria-expanded="false"
1128
+ class="ui top left pointing dropdown"
1129
+ role="listbox"
1130
+ tabindex="0"
1131
+ >
1132
+ <div
1133
+ class="shape-selector-trigger"
1134
+ >
1135
+ [π]
1136
+ </div>
1137
+ <div
1138
+ class="menu transition"
1139
+ >
1140
+ <div
1141
+ aria-checked="false"
1142
+ aria-selected="false"
1143
+ class="item"
1144
+ role="option"
1145
+ style="pointer-events: all;"
1146
+ >
1147
+ <div
1148
+ class="text flex-center"
1149
+ >
1150
+ <small
1151
+ style="margin-right: 5px;"
1152
+ >
1153
+ <b>
1154
+ <code>
1155
+ f(x)
1156
+ </code>
1157
+ </b>
1158
+ </small>
1159
+ Function
1160
+ </div>
1161
+ </div>
1162
+ <div
1163
+ aria-checked="true"
1164
+ aria-selected="true"
1165
+ class="active selected item"
1166
+ role="option"
1167
+ style="pointer-events: all;"
1168
+ >
1169
+ <div
1170
+ class="text flex-center"
1171
+ >
1172
+ <small
1173
+ style="margin-right: 5px;"
1174
+ >
1175
+ <b>
1176
+ <code>
1177
+ [π]
1178
+ </code>
1179
+ </b>
1180
+ </small>
1181
+ Constant
1182
+ </div>
1183
+ </div>
1184
+ </div>
1185
+ </div>
1186
+ <div
1187
+ class="field"
1061
1188
  >
1062
1189
  <div
1063
1190
  aria-expanded="false"
1064
- class="ui top left pointing dropdown"
1191
+ class="ui fluid selection dropdown"
1065
1192
  role="listbox"
1066
1193
  tabindex="0"
1067
1194
  >
1068
1195
  <div
1069
- class="shape-selector-trigger"
1196
+ aria-atomic="true"
1197
+ aria-live="polite"
1198
+ class="divider text"
1199
+ role="alert"
1070
1200
  >
1071
- [π]
1201
+ True
1072
1202
  </div>
1203
+ <i
1204
+ aria-hidden="true"
1205
+ class="dropdown icon"
1206
+ />
1073
1207
  <div
1074
1208
  class="menu transition"
1075
1209
  >
@@ -1080,20 +1214,11 @@ exports[`<FunctionEditor /> test cancel button with confirm 1`] = `
1080
1214
  role="option"
1081
1215
  style="pointer-events: all;"
1082
1216
  >
1083
- <div
1084
- class="text flex-center"
1217
+ <span
1218
+ class="text"
1085
1219
  >
1086
- <small
1087
- style="margin-right: 5px;"
1088
- >
1089
- <b>
1090
- <code>
1091
- [π]
1092
- </code>
1093
- </b>
1094
- </small>
1095
- Constant
1096
- </div>
1220
+ True
1221
+ </span>
1097
1222
  </div>
1098
1223
  <div
1099
1224
  aria-checked="false"
@@ -1102,73 +1227,11 @@ exports[`<FunctionEditor /> test cancel button with confirm 1`] = `
1102
1227
  role="option"
1103
1228
  style="pointer-events: all;"
1104
1229
  >
1105
- <div
1106
- class="text flex-center"
1107
- >
1108
- <small
1109
- style="margin-right: 5px;"
1110
- >
1111
- <b>
1112
- <code>
1113
- f(x)
1114
- </code>
1115
- </b>
1116
- </small>
1117
- Function
1118
- </div>
1119
- </div>
1120
- </div>
1121
- </div>
1122
- <div
1123
- class="field"
1124
- >
1125
- <div
1126
- aria-expanded="false"
1127
- class="ui fluid selection dropdown"
1128
- role="listbox"
1129
- tabindex="0"
1130
- >
1131
- <div
1132
- aria-atomic="true"
1133
- aria-live="polite"
1134
- class="divider text"
1135
- role="alert"
1136
- >
1137
- True
1138
- </div>
1139
- <i
1140
- aria-hidden="true"
1141
- class="dropdown icon"
1142
- />
1143
- <div
1144
- class="menu transition"
1145
- >
1146
- <div
1147
- aria-checked="true"
1148
- aria-selected="true"
1149
- class="active selected item"
1150
- role="option"
1151
- style="pointer-events: all;"
1152
- >
1153
- <span
1154
- class="text"
1155
- >
1156
- True
1157
- </span>
1158
- </div>
1159
- <div
1160
- aria-checked="false"
1161
- aria-selected="false"
1162
- class="item"
1163
- role="option"
1164
- style="pointer-events: all;"
1230
+ <span
1231
+ class="text"
1165
1232
  >
1166
- <span
1167
- class="text"
1168
- >
1169
- False
1170
- </span>
1171
- </div>
1233
+ False
1234
+ </span>
1172
1235
  </div>
1173
1236
  </div>
1174
1237
  </div>
@@ -1380,17 +1443,42 @@ exports[`<FunctionEditor /> test delete button 1`] = `
1380
1443
  class="row"
1381
1444
  >
1382
1445
  <div
1383
- class="ui horizontal link list"
1384
- role="list"
1446
+ class="field"
1385
1447
  >
1386
- <a
1387
- class="item"
1388
- role="listitem"
1389
- style="font-style: italic; font-size: 13px; padding: 9.5px 14px;"
1390
- tabindex="0"
1448
+ <label>
1449
+ functions.form.label
1450
+ </label>
1451
+ <div
1452
+ class="ui input"
1391
1453
  >
1392
- Add description
1393
- </a>
1454
+ <input
1455
+ autocomplete="off"
1456
+ placeholder="functions.form.label"
1457
+ type="text"
1458
+ value=""
1459
+ />
1460
+ </div>
1461
+ </div>
1462
+ </div>
1463
+ <div
1464
+ class="row"
1465
+ >
1466
+ <div
1467
+ class="field"
1468
+ >
1469
+ <label>
1470
+ Description
1471
+ </label>
1472
+ <div
1473
+ class="ui fluid input"
1474
+ >
1475
+ <input
1476
+ name="description"
1477
+ placeholder="Description"
1478
+ type="text"
1479
+ value=""
1480
+ />
1481
+ </div>
1394
1482
  </div>
1395
1483
  </div>
1396
1484
  </div>
@@ -1421,172 +1509,168 @@ exports[`<FunctionEditor /> test delete button 1`] = `
1421
1509
  Expression
1422
1510
  </h5>
1423
1511
  <div
1424
- class="ui grid"
1512
+ class="expression-container"
1425
1513
  >
1426
1514
  <div
1427
- class="sixteen wide column"
1515
+ class="expression-content"
1428
1516
  >
1429
1517
  <div
1430
- class="expression-container"
1518
+ aria-expanded="false"
1519
+ class="ui top left pointing dropdown"
1520
+ role="listbox"
1521
+ tabindex="0"
1431
1522
  >
1432
1523
  <div
1433
- aria-expanded="false"
1434
- class="ui top left pointing dropdown"
1435
- role="listbox"
1436
- tabindex="0"
1524
+ class="shape-selector-trigger"
1525
+ >
1526
+ f(x)
1527
+ </div>
1528
+ <div
1529
+ class="menu transition"
1437
1530
  >
1438
1531
  <div
1439
- class="shape-selector-trigger"
1440
- >
1441
- f(x)
1442
- </div>
1443
- <div
1444
- class="menu transition"
1532
+ aria-checked="true"
1533
+ aria-selected="true"
1534
+ class="active selected item"
1535
+ role="option"
1536
+ style="pointer-events: all;"
1445
1537
  >
1446
1538
  <div
1447
- aria-checked="false"
1448
- aria-selected="false"
1449
- class="item"
1450
- role="option"
1451
- style="pointer-events: all;"
1539
+ class="text flex-center"
1452
1540
  >
1453
- <div
1454
- class="text flex-center"
1541
+ <small
1542
+ style="margin-right: 5px;"
1455
1543
  >
1456
- <small
1457
- style="margin-right: 5px;"
1458
- >
1459
- <b>
1460
- <code>
1461
- [π]
1462
- </code>
1463
- </b>
1464
- </small>
1465
- Constant
1466
- </div>
1544
+ <b>
1545
+ <code>
1546
+ f(x)
1547
+ </code>
1548
+ </b>
1549
+ </small>
1550
+ Function
1467
1551
  </div>
1552
+ </div>
1553
+ <div
1554
+ aria-checked="false"
1555
+ aria-selected="false"
1556
+ class="item"
1557
+ role="option"
1558
+ style="pointer-events: all;"
1559
+ >
1468
1560
  <div
1469
- aria-checked="true"
1470
- aria-selected="true"
1471
- class="active selected item"
1472
- role="option"
1473
- style="pointer-events: all;"
1561
+ class="text flex-center"
1474
1562
  >
1475
- <div
1476
- class="text flex-center"
1563
+ <small
1564
+ style="margin-right: 5px;"
1477
1565
  >
1478
- <small
1479
- style="margin-right: 5px;"
1480
- >
1481
- <b>
1482
- <code>
1483
- f(x)
1484
- </code>
1485
- </b>
1486
- </small>
1487
- Function
1488
- </div>
1566
+ <b>
1567
+ <code>
1568
+ [π]
1569
+ </code>
1570
+ </b>
1571
+ </small>
1572
+ Constant
1489
1573
  </div>
1490
1574
  </div>
1491
1575
  </div>
1576
+ </div>
1577
+ <div
1578
+ class="accordion ui fluid no-margin"
1579
+ >
1492
1580
  <div
1493
- class="accordion ui fluid no-margin"
1581
+ class="active title no-padding"
1494
1582
  >
1495
1583
  <div
1496
- class="active title no-padding"
1584
+ class="flex-center"
1497
1585
  >
1586
+ <i
1587
+ aria-hidden="true"
1588
+ class="dropdown icon"
1589
+ />
1498
1590
  <div
1499
- class="flex-center"
1591
+ class="sixteen wide field"
1500
1592
  >
1501
- <i
1502
- aria-hidden="true"
1503
- class="dropdown icon"
1504
- />
1505
1593
  <div
1506
- class="sixteen wide field"
1594
+ aria-expanded="false"
1595
+ class="ui fluid search selection dropdown"
1596
+ role="combobox"
1507
1597
  >
1598
+ <input
1599
+ aria-autocomplete="list"
1600
+ autocomplete="off"
1601
+ class="search"
1602
+ tabindex="0"
1603
+ type="text"
1604
+ value=""
1605
+ />
1508
1606
  <div
1509
- aria-expanded="false"
1510
- class="ui fluid search selection dropdown"
1511
- role="combobox"
1607
+ aria-atomic="true"
1608
+ aria-live="polite"
1609
+ class="divider text"
1610
+ role="alert"
1611
+ >
1612
+ Select a function of type boolean
1613
+ </div>
1614
+ <i
1615
+ aria-hidden="true"
1616
+ class="dropdown icon"
1617
+ />
1618
+ <div
1619
+ class="menu transition"
1620
+ role="listbox"
1512
1621
  >
1513
- <input
1514
- aria-autocomplete="list"
1515
- autocomplete="off"
1516
- class="search"
1517
- tabindex="0"
1518
- type="text"
1519
- value=""
1520
- />
1521
- <div
1522
- aria-atomic="true"
1523
- aria-live="polite"
1524
- class="divider text"
1525
- role="alert"
1526
- >
1527
- Select a function of type boolean
1528
- </div>
1529
- <i
1530
- aria-hidden="true"
1531
- class="dropdown icon"
1532
- />
1533
1622
  <div
1534
- class="menu transition"
1535
- role="listbox"
1623
+ aria-checked="false"
1624
+ aria-selected="true"
1625
+ class="selected item"
1626
+ role="option"
1627
+ style="pointer-events: all;"
1536
1628
  >
1537
1629
  <div
1538
- aria-checked="false"
1539
- aria-selected="true"
1540
- class="selected item"
1541
- role="option"
1542
- style="pointer-events: all;"
1630
+ class="ui header"
1543
1631
  >
1544
1632
  <div
1545
- class="ui header"
1633
+ class="flex-center"
1546
1634
  >
1635
+ <div>
1636
+ eq
1637
+ </div>
1547
1638
  <div
1548
- class="flex-center"
1639
+ class="function-params-label"
1549
1640
  >
1550
- <div>
1551
- eq
1641
+ <div
1642
+ class="ui grey label"
1643
+ >
1644
+ <i
1645
+ aria-hidden="true"
1646
+ class="question circle outline icon"
1647
+ />
1648
+ arg1
1552
1649
  </div>
1553
1650
  <div
1554
- class="function-params-label"
1651
+ class="ui grey label"
1555
1652
  >
1556
- <div
1557
- class="ui grey label"
1558
- >
1559
- <i
1560
- aria-hidden="true"
1561
- class="question circle outline icon"
1562
- />
1563
- arg1
1564
- </div>
1565
- <div
1566
- class="ui grey label"
1567
- >
1568
- <i
1569
- aria-hidden="true"
1570
- class="question circle outline icon"
1571
- />
1572
- arg2
1573
- </div>
1653
+ <i
1654
+ aria-hidden="true"
1655
+ class="question circle outline icon"
1656
+ />
1657
+ arg2
1574
1658
  </div>
1575
1659
  </div>
1576
1660
  </div>
1577
- <div
1578
- class="sub header"
1579
- />
1580
1661
  </div>
1662
+ <div
1663
+ class="sub header"
1664
+ />
1581
1665
  </div>
1582
1666
  </div>
1583
1667
  </div>
1584
1668
  </div>
1585
1669
  </div>
1586
- <div
1587
- class="content active no-padding"
1588
- />
1589
1670
  </div>
1671
+ <div
1672
+ class="content active no-padding"
1673
+ />
1590
1674
  </div>
1591
1675
  </div>
1592
1676
  </div>