@brightspace-ui-labs/facet-filter-sort 5.4.0 → 5.5.0

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/README.md CHANGED
@@ -16,9 +16,7 @@
16
16
  > - [x] Demo page
17
17
  > - [ ] README documentation
18
18
 
19
- For further information on this and other components, refer to [The Brightspace UI Guide](https://github.com/BrightspaceUI/guide/wiki).
20
-
21
- Collection of (search) facet, filter, and sort components
19
+ Collection of old filter and sort components. Use the `d2l-filter` in [BrightspaceUI/core](https://github.com/BrightspaceUI/core/tree/main/components/filter). A sort dropdown component will be coming to `core` eventually.
22
20
 
23
21
  ## Installation
24
22
 
@@ -28,26 +26,8 @@ npm install @brightspace-ui-labs/facet-filter-sort
28
26
 
29
27
  ## Components
30
28
 
31
- - [d2l-labs-search-facets](#d2l-labs-search-facets)
32
- - [d2l-labs-search-results-count](#d2l-labs-search-results-count)
33
29
  - [d2l-labs-sort-by-dropdown](#d2l-labs-sort-by-dropdown)
34
30
 
35
- ### d2l-labs-search-facets
36
-
37
- <img src="/images/d2l-labs-search-facets.png?raw=true" width="450">
38
-
39
- #### Usage
40
-
41
- To Do
42
-
43
- ### d2l-labs-search-results-count
44
-
45
- <img src="/images/d2l-labs-search-results-count.png?raw=true" width="450">
46
-
47
- #### Usage
48
-
49
- To Do
50
-
51
31
  ### d2l-labs-sort-by-dropdown
52
32
 
53
33
  <img src="/images/d2l-labs-sort-by-dropdown.png?raw=true" width="450">
@@ -446,292 +446,6 @@
446
446
  }
447
447
  ]
448
448
  },
449
- {
450
- "name": "d2l-labs-search-facets-grouping",
451
- "path": "./components/search-facets/search-facets-grouping.js",
452
- "description": "A grouping of search facet options that keeps tracks of selected options",
453
- "attributes": [
454
- {
455
- "name": "has-more",
456
- "description": "Indicates whether this grouping has more options to be added later. Controls\nthe visibility of the 'More' button",
457
- "type": "boolean",
458
- "default": "false"
459
- },
460
- {
461
- "name": "text",
462
- "description": "The name of the grouping",
463
- "type": "string",
464
- "default": "\"\""
465
- },
466
- {
467
- "name": "value",
468
- "description": "The value of the grouping name",
469
- "type": "string",
470
- "default": "\"\""
471
- }
472
- ],
473
- "properties": [
474
- {
475
- "name": "hasMore",
476
- "attribute": "has-more",
477
- "description": "Indicates whether this grouping has more options to be added later. Controls\nthe visibility of the 'More' button",
478
- "type": "boolean",
479
- "default": "false"
480
- },
481
- {
482
- "name": "text",
483
- "attribute": "text",
484
- "description": "The name of the grouping",
485
- "type": "string",
486
- "default": "\"\""
487
- },
488
- {
489
- "name": "value",
490
- "attribute": "value",
491
- "description": "The value of the grouping name",
492
- "type": "string",
493
- "default": "\"\""
494
- },
495
- {
496
- "name": "rootPath",
497
- "type": "string"
498
- },
499
- {
500
- "name": "importPath",
501
- "type": "string"
502
- },
503
- {
504
- "name": "root",
505
- "type": "HTMLElement | StampedTemplate | ShadowRoot | null"
506
- },
507
- {
508
- "name": "$",
509
- "type": "{ [key: string]: Element; }"
510
- },
511
- {
512
- "name": "PROPERTY_EFFECT_TYPES"
513
- }
514
- ],
515
- "events": [
516
- {
517
- "name": "d2l-labs-search-facets-grouping-change",
518
- "description": "Dispatched when the search group changes"
519
- },
520
- {
521
- "name": "d2l-labs-search-facets-grouping-has-more",
522
- "description": "Dispatched when the more button is clicked"
523
- }
524
- ],
525
- "slots": [
526
- {
527
- "name": "",
528
- "description": "Contains the search facets in the group"
529
- }
530
- ]
531
- },
532
- {
533
- "name": "d2l-labs-search-facets-option",
534
- "path": "./components/search-facets/search-facets-option.js",
535
- "description": "Search facet option, with a count to display the number of results",
536
- "attributes": [
537
- {
538
- "name": "checked",
539
- "description": "Whether the option is selected or not. This property matches the value of\nthe d2l-input-checkbox",
540
- "type": "boolean"
541
- },
542
- {
543
- "name": "count",
544
- "description": "The number of search results for this option",
545
- "type": "number"
546
- },
547
- {
548
- "name": "disabled",
549
- "description": "Whether this option should be disabled",
550
- "type": "boolean",
551
- "default": "false"
552
- },
553
- {
554
- "name": "text",
555
- "description": "The text for this option",
556
- "type": "string",
557
- "default": "\"\""
558
- },
559
- {
560
- "name": "value",
561
- "description": "The value of this option",
562
- "type": "string",
563
- "default": "\"\""
564
- }
565
- ],
566
- "properties": [
567
- {
568
- "name": "checked",
569
- "attribute": "checked",
570
- "description": "Whether the option is selected or not. This property matches the value of\nthe d2l-input-checkbox",
571
- "type": "boolean"
572
- },
573
- {
574
- "name": "count",
575
- "attribute": "count",
576
- "description": "The number of search results for this option",
577
- "type": "number"
578
- },
579
- {
580
- "name": "disabled",
581
- "attribute": "disabled",
582
- "description": "Whether this option should be disabled",
583
- "type": "boolean",
584
- "default": "false"
585
- },
586
- {
587
- "name": "text",
588
- "attribute": "text",
589
- "description": "The text for this option",
590
- "type": "string",
591
- "default": "\"\""
592
- },
593
- {
594
- "name": "value",
595
- "attribute": "value",
596
- "description": "The value of this option",
597
- "type": "string",
598
- "default": "\"\""
599
- },
600
- {
601
- "name": "rootPath",
602
- "type": "string"
603
- },
604
- {
605
- "name": "importPath",
606
- "type": "string"
607
- },
608
- {
609
- "name": "root",
610
- "type": "HTMLElement | StampedTemplate | ShadowRoot | null"
611
- },
612
- {
613
- "name": "$",
614
- "type": "{ [key: string]: Element; }"
615
- },
616
- {
617
- "name": "PROPERTY_EFFECT_TYPES"
618
- }
619
- ],
620
- "events": [
621
- {
622
- "name": "d2l-labs-search-facets-option-change",
623
- "description": "Dispatched when the checked value of an option changes"
624
- }
625
- ]
626
- },
627
- {
628
- "name": "d2l-labs-search-facets",
629
- "path": "./components/search-facets/search-facets.js",
630
- "description": "Polymer-based web component for D2L search facets.",
631
- "properties": [
632
- {
633
- "name": "rootPath",
634
- "type": "string"
635
- },
636
- {
637
- "name": "importPath",
638
- "type": "string"
639
- },
640
- {
641
- "name": "root",
642
- "type": "HTMLElement | StampedTemplate | ShadowRoot | null"
643
- },
644
- {
645
- "name": "$",
646
- "type": "{ [key: string]: Element; }"
647
- },
648
- {
649
- "name": "PROPERTY_EFFECT_TYPES"
650
- }
651
- ],
652
- "events": [
653
- {
654
- "name": "d2l-labs-search-facets-change",
655
- "description": "Dispatched when the search facets group changes"
656
- }
657
- ]
658
- },
659
- {
660
- "name": "d2l-labs-search-results-count",
661
- "path": "./components/search-results-count/search-results-count.js",
662
- "description": "`<d2l-labs-search-results-count>`\nPolymer-based web component for D2L search result",
663
- "attributes": [
664
- {
665
- "name": "range-start",
666
- "description": "Range start",
667
- "type": "number"
668
- },
669
- {
670
- "name": "range-end",
671
- "description": "Range end",
672
- "type": "number"
673
- },
674
- {
675
- "name": "total-count",
676
- "description": "Total count",
677
- "type": "number",
678
- "default": "0"
679
- },
680
- {
681
- "name": "query",
682
- "description": "Search query",
683
- "type": "string",
684
- "default": "\"\""
685
- }
686
- ],
687
- "properties": [
688
- {
689
- "name": "rangeStart",
690
- "attribute": "range-start",
691
- "description": "Range start",
692
- "type": "number"
693
- },
694
- {
695
- "name": "rangeEnd",
696
- "attribute": "range-end",
697
- "description": "Range end",
698
- "type": "number"
699
- },
700
- {
701
- "name": "totalCount",
702
- "attribute": "total-count",
703
- "description": "Total count",
704
- "type": "number",
705
- "default": "0"
706
- },
707
- {
708
- "name": "query",
709
- "attribute": "query",
710
- "description": "Search query",
711
- "type": "string",
712
- "default": "\"\""
713
- },
714
- {
715
- "name": "rootPath",
716
- "type": "string"
717
- },
718
- {
719
- "name": "importPath",
720
- "type": "string"
721
- },
722
- {
723
- "name": "root",
724
- "type": "HTMLElement | StampedTemplate | ShadowRoot | null"
725
- },
726
- {
727
- "name": "$",
728
- "type": "{ [key: string]: Element; }"
729
- },
730
- {
731
- "name": "PROPERTY_EFFECT_TYPES"
732
- }
733
- ]
734
- },
735
449
  {
736
450
  "name": "d2l-labs-sort-by-dropdown-option",
737
451
  "path": "./components/sort-by-dropdown/sort-by-dropdown-option.js",
package/lang/ar.js CHANGED
@@ -13,11 +13,6 @@ export default {
13
13
  "filterBy": "تصفية حسب",
14
14
  "filterMultiple": "عامل التصفية: {numOptions} من عوامل التصفية",
15
15
  "filterSingle": "عامل التصفية: عامل تصفية واحد",
16
- "more": "المزيد",
17
- "searchPagedResults": "{rangeStart} - {rangeEnd} من أصل {totalCount} من النتائج",
18
- "searchPagedResultsForQuery": "{rangeStart} - {rangeEnd} من أصل {totalCount} من نتائج \"{query}\"",
19
- "searchResults": "{totalCount} من النتائج",
20
- "searchResultsForQuery": "{totalCount} من النتائج لـ \"{query}\"",
21
16
  "sort": "فرز",
22
17
  "sortWithOption": "فرز: {option}"
23
18
  };
package/lang/cy.js CHANGED
@@ -13,11 +13,6 @@ export default {
13
13
  "filterBy": "Hidlo yn ôl",
14
14
  "filterMultiple": "Hidlo: {numOptions} Hidlydd",
15
15
  "filterSingle": "Hidlo: 1 Hidlydd",
16
- "more": "Mwy",
17
- "searchPagedResults": "{rangeStart} - {rangeEnd} o {totalCount} o ganlyniadau",
18
- "searchPagedResultsForQuery": "{rangeStart} - {rangeEnd} o {totalCount} o ganlyniadau ar gyfer \"{query}\"",
19
- "searchResults": "{totalCount} o ganlyniadau",
20
- "searchResultsForQuery": "{totalCount} o ganlyniadau ar gyfer \"{query}\"",
21
16
  "sort": "Trefnu",
22
17
  "sortWithOption": "Trefnu: {option}"
23
18
  };
package/lang/da.js CHANGED
@@ -13,11 +13,6 @@ export default {
13
13
  "filterBy": "Filtrer efter",
14
14
  "filterMultiple": "Filter: {numOptions} filtre",
15
15
  "filterSingle": "Filtrer: 1 filter",
16
- "more": "Flere",
17
- "searchPagedResults": "{rangeStart} - {rangeEnd} af {totalCount} resultater",
18
- "searchPagedResultsForQuery": "{rangeStart} - {rangeEnd} af {totalCount} resultater for \"{query}\"",
19
- "searchResults": "{totalCount} resultater",
20
- "searchResultsForQuery": "{totalCount} resultater for \"{query}\"",
21
16
  "sort": "Sortér",
22
17
  "sortWithOption": "Sortér: {option}"
23
18
  };
package/lang/de.js CHANGED
@@ -13,11 +13,6 @@ export default {
13
13
  "filterBy": "Filtern nach",
14
14
  "filterMultiple": "Filter: {numOptions} Filter",
15
15
  "filterSingle": "Filter: 1 Filter",
16
- "more": "Mehr",
17
- "searchPagedResults": "{rangeStart} - {rangeEnd} von {totalCount} Ergebnissen",
18
- "searchPagedResultsForQuery": "{rangeStart} - {rangeEnd} von {totalCount} Ergebnissen für \"{query}\"",
19
- "searchResults": "{totalCount} Ergebnisse",
20
- "searchResultsForQuery": "{totalCount} Ergebnisse für \"{query}\"",
21
16
  "sort": "Sortieren",
22
17
  "sortWithOption": "Sortieren: {option}"
23
18
  };
package/lang/en.js CHANGED
@@ -13,11 +13,6 @@ export default {
13
13
  "filterBy": "Filter By",
14
14
  "filterMultiple": "Filter: {numOptions} Filters",
15
15
  "filterSingle": "Filter: 1 Filter",
16
- "more": "More",
17
- "searchPagedResults": "{rangeStart} - {rangeEnd} of {totalCount} results",
18
- "searchPagedResultsForQuery": "{rangeStart} - {rangeEnd} of {totalCount} results for \"{query}\"",
19
- "searchResults": "{totalCount} results",
20
- "searchResultsForQuery": "{totalCount} results for \"{query}\"",
21
16
  "sort": "Sort",
22
17
  "sortWithOption": "Sort: {option}"
23
18
  };
package/lang/es-es.js CHANGED
@@ -13,11 +13,6 @@ export default {
13
13
  "filterBy": "Filtrar por",
14
14
  "filterMultiple": "Filtro: {numOptions} filtros",
15
15
  "filterSingle": "Filtro: 1 filtro",
16
- "more": "Más",
17
- "searchPagedResults": "{rangeStart} - {rangeEnd} de {totalCount} resultados",
18
- "searchPagedResultsForQuery": "{rangeStart} - {rangeEnd} de {totalCount} resultados para \"{query}\"",
19
- "searchResults": "{totalCount} resultados",
20
- "searchResultsForQuery": "{totalCount} resultados para \"{query}\"",
21
16
  "sort": "Ordenar",
22
17
  "sortWithOption": "Ordenar: {option}"
23
18
  };
package/lang/es.js CHANGED
@@ -13,11 +13,6 @@ export default {
13
13
  "filterBy": "Filtrar por",
14
14
  "filterMultiple": "Filtro: {numOptions} filtros",
15
15
  "filterSingle": "Filtro: 1 filtro",
16
- "more": "Más",
17
- "searchPagedResults": "{rangeStart} - {rangeEnd} de {totalCount} resultados",
18
- "searchPagedResultsForQuery": "{rangeStart} - {rangeEnd} de {totalCount} resultados para \"{query}\"",
19
- "searchResults": "{totalCount} resultados",
20
- "searchResultsForQuery": "{totalCount} resultados para \"{query}\"",
21
16
  "sort": "Ordenar",
22
17
  "sortWithOption": "Ordenar: {option}"
23
18
  };
package/lang/fr-fr.js CHANGED
@@ -13,11 +13,6 @@ export default {
13
13
  "filterBy": "Filtrer par",
14
14
  "filterMultiple": "Filtre : {numOptions} filtres",
15
15
  "filterSingle": "Filtre : 1 filtre",
16
- "more": "Plus",
17
- "searchPagedResults": "{rangeStart} - {rangeEnd} résultats sur {totalCount}",
18
- "searchPagedResultsForQuery": "{rangeStart} - {rangeEnd} résultats sur {totalCount} pour « {query} »",
19
- "searchResults": "{totalCount} résultats",
20
- "searchResultsForQuery": "{totalCount} résultats pour « {query} »",
21
16
  "sort": "Trier",
22
17
  "sortWithOption": "Trier : {option}"
23
18
  };
package/lang/fr.js CHANGED
@@ -13,11 +13,6 @@ export default {
13
13
  "filterBy": "Filtrer à l’aide de",
14
14
  "filterMultiple": "Filtre : Filtres {numOptions}",
15
15
  "filterSingle": "Filtre : 1 filtre",
16
- "more": "Plus",
17
- "searchPagedResults": "{rangeStart} - {rangeEnd} de {totalCount} résultats",
18
- "searchPagedResultsForQuery": "{rangeStart} - {rangeEnd} de {totalCount} résultats pour « {query} »",
19
- "searchResults": "{totalCount} résultats",
20
- "searchResultsForQuery": "{totalCount} résultats pour « {query} »",
21
16
  "sort": "Trier",
22
17
  "sortWithOption": "Trier : {option}"
23
18
  };
package/lang/hi.js CHANGED
@@ -13,11 +13,6 @@ export default {
13
13
  "filterBy": "इसके अनुसार फ़िल्टर करें",
14
14
  "filterMultiple": "फ़िल्टर करें: {numOptions} फ़िल्टर",
15
15
  "filterSingle": "फ़िल्टर: 1 फ़िल्टर",
16
- "more": "अधिक",
17
- "searchPagedResults": "{rangeStart} - {totalCount} में से {rangeEnd} परिणाम",
18
- "searchPagedResultsForQuery": "{rangeStart} - \"{query}\" के लिए {totalCount} में से {rangeEnd} परिणाम",
19
- "searchResults": "{totalCount} परिणाम",
20
- "searchResultsForQuery": "\"{query}\" के लिए {totalCount} परिणाम",
21
16
  "sort": "सॉर्ट करें",
22
17
  "sortWithOption": "सॉर्ट करें: {option}"
23
18
  };
package/lang/ja.js CHANGED
@@ -13,11 +13,6 @@ export default {
13
13
  "filterBy": "フィルタの条件",
14
14
  "filterMultiple": "フィルタ数: {numOptions}",
15
15
  "filterSingle": "フィルタ数: 1",
16
- "more": "その他",
17
- "searchPagedResults": "結果 {totalCount} 件中の {rangeStart}~{rangeEnd}",
18
- "searchPagedResultsForQuery": "「{query}」の結果 {totalCount} 件中の {rangeStart}~{rangeEnd}",
19
- "searchResults": "結果 {totalCount} 件",
20
- "searchResultsForQuery": "「{query}」の結果 {totalCount} 件",
21
16
  "sort": "並べ替え",
22
17
  "sortWithOption": "並べ替え: {option}"
23
18
  };
package/lang/ko.js CHANGED
@@ -13,11 +13,6 @@ export default {
13
13
  "filterBy": "필터링 기준",
14
14
  "filterMultiple": "필터: {numOptions}개 필터",
15
15
  "filterSingle": "필터: 1개 필터",
16
- "more": "더 보기",
17
- "searchPagedResults": "{rangeStart} - {rangeEnd}/{totalCount}개 결과",
18
- "searchPagedResultsForQuery": "\"{query}\"에 대한 {rangeStart} - {rangeEnd}/{totalCount}개 결과",
19
- "searchResults": "{totalCount}개 결과",
20
- "searchResultsForQuery": "\"{query}\"에 대한 {totalCount}개 결과",
21
16
  "sort": "정렬",
22
17
  "sortWithOption": "정렬: {option}"
23
18
  };
package/lang/nl.js CHANGED
@@ -13,11 +13,6 @@ export default {
13
13
  "filterBy": "Filteren op",
14
14
  "filterMultiple": "Filter: {numOptions} filters",
15
15
  "filterSingle": "Filter: 1 filter",
16
- "more": "Meer",
17
- "searchPagedResults": "{rangeStart} - {rangeEnd} van {totalCount} resultaten",
18
- "searchPagedResultsForQuery": "{rangeStart} - {rangeEnd} van {totalCount} resultaten voor \"{query}\"",
19
- "searchResults": "{totalCount} resultaten",
20
- "searchResultsForQuery": "{totalCount} resultaten voor \"{query}\"",
21
16
  "sort": "Sorteren",
22
17
  "sortWithOption": "Sorteren: {option}"
23
18
  };
package/lang/pt.js CHANGED
@@ -13,11 +13,6 @@ export default {
13
13
  "filterBy": "Filtrar por",
14
14
  "filterMultiple": "Filtro: {numOptions} filtros",
15
15
  "filterSingle": "Filtros: 1",
16
- "more": "Mais",
17
- "searchPagedResults": "{rangeStart} – {rangeEnd} de {totalCount} resultados",
18
- "searchPagedResultsForQuery": "{rangeStart} – {rangeEnd} de {totalCount} resultados para \"{query}\"",
19
- "searchResults": "{totalCount} resultados",
20
- "searchResultsForQuery": "{totalCount} resultados para \"{query}\"",
21
16
  "sort": "Classificar",
22
17
  "sortWithOption": "Classificação: {option}"
23
18
  };
package/lang/sv.js CHANGED
@@ -13,11 +13,6 @@ export default {
13
13
  "filterBy": "Filtrera efter",
14
14
  "filterMultiple": "Filter: {numOptions} filter",
15
15
  "filterSingle": "Filter: 1 filter",
16
- "more": "Mer",
17
- "searchPagedResults": "{rangeStart}–{rangeEnd} av {totalCount} resultat",
18
- "searchPagedResultsForQuery": "{rangeStart}–{rangeEnd} av {totalCount} resultat för \"{query}\"",
19
- "searchResults": "{totalCount} resultat",
20
- "searchResultsForQuery": "{totalCount} resultat för \"{query}\"",
21
16
  "sort": "Sortera",
22
17
  "sortWithOption": "Sortera: {option}"
23
18
  };
package/lang/tr.js CHANGED
@@ -13,11 +13,6 @@ export default {
13
13
  "filterBy": "Filtreleme Ölçütü",
14
14
  "filterMultiple": "Filtre: {numOptions} Filtre",
15
15
  "filterSingle": "Filtre: 1 Filtre",
16
- "more": "Daha Fazla",
17
- "searchPagedResults": "{rangeStart} - {rangeEnd} / {totalCount} sonuç",
18
- "searchPagedResultsForQuery": "\"{query}\" için {rangeStart} - {rangeEnd} / {totalCount} sonuç",
19
- "searchResults": "{totalCount} sonuç",
20
- "searchResultsForQuery": "\"{query}\" için {totalCount} sonuç",
21
16
  "sort": "Sırala",
22
17
  "sortWithOption": "Sırala: {option}"
23
18
  };
package/lang/zh-cn.js CHANGED
@@ -13,11 +13,6 @@ export default {
13
13
  "filterBy": "筛选条件",
14
14
  "filterMultiple": "筛选:{numOptions} 个筛选条件",
15
15
  "filterSingle": "筛选:1 个筛选条件",
16
- "more": "更多内容",
17
- "searchPagedResults": "{rangeStart} - {rangeEnd} 个结果,共 {totalCount} 个",
18
- "searchPagedResultsForQuery": "\"{query}\" 的 {rangeStart} - {rangeEnd} 个结果,共 {totalCount} 个",
19
- "searchResults": "{totalCount} 个结果",
20
- "searchResultsForQuery": "\"{query}\" 的 {totalCount} 个结果",
21
16
  "sort": "排序",
22
17
  "sortWithOption": "排序:{option}"
23
18
  };
package/lang/zh-tw.js CHANGED
@@ -13,11 +13,6 @@ export default {
13
13
  "filterBy": "篩選依據",
14
14
  "filterMultiple": "篩選器:{numOptions} 個篩選器",
15
15
  "filterSingle": "篩選器:1 個篩選器",
16
- "more": "較多",
17
- "searchPagedResults": "{rangeStart} - {rangeEnd},總共 {totalCount} 個結果",
18
- "searchPagedResultsForQuery": "{rangeStart} - {rangeEnd},「{query}」共有 {totalCount} 個結果",
19
- "searchResults": "{totalCount} 個結果",
20
- "searchResultsForQuery": "「{query}」共有 {totalCount} 個結果",
21
16
  "sort": "排序",
22
17
  "sortWithOption": "排序:{option}"
23
18
  };
package/package.json CHANGED
@@ -44,11 +44,10 @@
44
44
  "sinon": "^13",
45
45
  "stylelint": "^14"
46
46
  },
47
- "version": "5.4.0",
47
+ "version": "5.5.0",
48
48
  "dependencies": {
49
49
  "@brightspace-ui/core": "^2",
50
50
  "@brightspace-ui/localize-behavior": "^2",
51
- "@brightspace-ui/typography": "^8",
52
51
  "@brightspace-ui-labs/multi-select": "^6",
53
52
  "lit-element": "^3",
54
53
  "lit-html": "^2",
@@ -1,143 +0,0 @@
1
- import '@brightspace-ui/core/components/colors/colors.js';
2
- import '@brightspace-ui/core/components/inputs/input-checkbox-spacer.js';
3
- import '@brightspace-ui/typography/d2l-typography-shared-styles.js';
4
- import { html, PolymerElement } from '@polymer/polymer/polymer-element.js';
5
- import { afterNextRender } from '@polymer/polymer/lib/utils/render-status.js';
6
- import { LocalizeBehavior } from '../localize-behavior.js';
7
- import { mixinBehaviors } from '@polymer/polymer/lib/legacy/class.js';
8
-
9
- /**
10
- * A grouping of search facet options that keeps tracks of selected options
11
- * @slot - Contains the search facets in the group
12
- * @fires d2l-labs-search-facets-grouping-change - Dispatched when the search group changes
13
- * @fires d2l-labs-search-facets-grouping-has-more - Dispatched when the more button is clicked
14
- */
15
- class LabsSearchFacetsGrouping extends mixinBehaviors(
16
- [
17
- LocalizeBehavior
18
- ],
19
- PolymerElement
20
- ) {
21
- static get properties() {
22
- return {
23
- /**
24
- * Reference to bound listener functions to be removed in disconnectedCallback
25
- */
26
- _boundListeners: {
27
- type: Object,
28
- value: function() {
29
- return {
30
- _onFacetOptionChange: null
31
- };
32
- }
33
- },
34
- /**
35
- * Indicates whether this grouping has more options to be added later. Controls
36
- * the visibility of the 'More' button
37
- */
38
- hasMore: {
39
- type: Boolean,
40
- value: false
41
- },
42
- /**
43
- * The name of the grouping
44
- */
45
- text: {
46
- type: String,
47
- value: ''
48
- },
49
- /**
50
- * The value of the grouping name
51
- */
52
- value: {
53
- type: String,
54
- value: ''
55
- },
56
- };
57
- }
58
-
59
- static get is() { return 'd2l-labs-search-facets-grouping'; }
60
-
61
- static get template() {
62
- return html`
63
- <style>
64
- :host {
65
- display: block;
66
- }
67
-
68
- .d2l-labs-search-facets-grouping-fieldset {
69
- border: none;
70
- margin: 0;
71
- padding: 0;
72
- }
73
-
74
- .d2l-labs-search-facets-grouping-legend {
75
- @apply --d2l-body-compact-text;
76
- font-weight: bold;
77
- margin-bottom: 0.4rem;
78
- padding: 0;
79
- }
80
-
81
- .d2l-labs-search-facets-grouping-show-more > button {
82
- @apply --d2l-body-compact-text;
83
- border: none;
84
- color: var(--d2l-color-celestine);
85
- font-family: inherit;
86
- outline: none;
87
- padding: 0;
88
- }
89
-
90
- .d2l-labs-search-facets-grouping-show-more > button:hover,
91
- .d2l-labs-search-facets-grouping-show-more > button:focus {
92
- cursor: pointer;
93
- font-weight: bold;
94
- }
95
-
96
- </style>
97
- <fieldset class="d2l-labs-search-facets-grouping-fieldset">
98
- <legend class="d2l-labs-search-facets-grouping-legend">[[text]]</legend>
99
- <slot></slot>
100
- <template is="dom-if" if="[[hasMore]]">
101
- <d2l-input-checkbox-spacer class="d2l-labs-search-facets-grouping-show-more">
102
- <button on-click="_onMoreClicked">[[localize('more')]]</button>
103
- </d2l-input-checkbox-spacer>
104
- </template>
105
- </fieldset>
106
- `;
107
- }
108
-
109
- connectedCallback() {
110
- super.connectedCallback();
111
-
112
- afterNextRender(this, () => {
113
- this._boundListeners._onFacetOptionChange = this._onFacetOptionChange.bind(this);
114
-
115
- this.addEventListener('d2l-labs-search-facets-option-change',
116
- this._boundListeners._onFacetOptionChange);
117
- });
118
- }
119
-
120
- disconnectedCallback() {
121
- super.disconnectedCallback();
122
- this.removeEventListener('d2l-labs-search-facets-option-change',
123
- this._boundListeners._onFacetOptionChange);
124
- }
125
-
126
- _onFacetOptionChange(e) {
127
- this.dispatchEvent(new CustomEvent('d2l-labs-search-facets-grouping-change', {
128
- bubbles: true,
129
- composed: true,
130
- detail: Object.assign({}, e.detail, { grouping: this.value })
131
- }));
132
- }
133
-
134
- _onMoreClicked() {
135
- this.dispatchEvent(new CustomEvent('d2l-labs-search-facets-grouping-has-more', {
136
- bubbles: true,
137
- composed: true,
138
- detail: { grouping: this.value }
139
- }));
140
- }
141
- }
142
-
143
- customElements.define(LabsSearchFacetsGrouping.is, LabsSearchFacetsGrouping);
@@ -1,96 +0,0 @@
1
- import '@brightspace-ui/core/components/inputs/input-checkbox.js';
2
- import '@brightspace-ui/localize-behavior/d2l-localize-behavior.js';
3
- import { html, PolymerElement } from '@polymer/polymer/polymer-element.js';
4
- import { mixinBehaviors } from '@polymer/polymer/lib/legacy/class.js';
5
-
6
- /**
7
- * Search facet option, with a count to display the number of results
8
- * @fires d2l-labs-search-facets-option-change - Dispatched when the checked value of an option changes
9
- */
10
- class LabsSearchFacetsOption extends mixinBehaviors(
11
- [
12
- D2L.PolymerBehaviors.LocalizeBehavior
13
- ],
14
- PolymerElement
15
- ) {
16
- static get properties() {
17
- return {
18
- /**
19
- * The text displayed for this option. Adds the count next to the text if present
20
- */
21
- _facetText: {
22
- type: String,
23
- value: '',
24
- computed: '_getFacetText(text, count)'
25
- },
26
- /**
27
- * Whether the option is selected or not. This property matches the value of
28
- * the d2l-input-checkbox
29
- */
30
- checked: {
31
- type: Boolean,
32
- reflectToAttribute: true
33
- },
34
- /**
35
- * The number of search results for this option
36
- */
37
- count: {
38
- type: Number
39
- },
40
- /**
41
- * Whether this option should be disabled
42
- */
43
- disabled: {
44
- type: Boolean,
45
- reflectToAttribute: true,
46
- value: false
47
- },
48
- /**
49
- * The text for this option
50
- */
51
- text: {
52
- type: String,
53
- value: ''
54
- },
55
- /**
56
- * The value of this option
57
- */
58
- value: {
59
- type: String,
60
- value: ''
61
- },
62
- };
63
- }
64
-
65
- static get is() { return 'd2l-labs-search-facets-option'; }
66
-
67
- static get template() {
68
- return html`
69
- <style>
70
- :host {
71
- display: block;
72
- }
73
- </style>
74
- <d2l-input-checkbox checked="[[checked]]" disabled="[[disabled]]" name="[[text]]" on-change="_handleChange" class="d2l-labs-search-facets-option-checkbox">[[_facetText]]</d2l-input-checkbox>
75
- `;
76
- }
77
-
78
- _getFacetText(text, count) {
79
- if (count) {
80
- return document.dir === 'rtl'
81
- ? `(${this.formatNumber(count)}) ${text}`
82
- : `${text} (${this.formatNumber(count)})`;
83
- }
84
- return text;
85
- }
86
-
87
- _handleChange(e) {
88
- this.dispatchEvent(new CustomEvent('d2l-labs-search-facets-option-change', {
89
- bubbles: true,
90
- composed: true,
91
- detail: { checked: e.target.checked, option: this.value }
92
- }));
93
- }
94
-
95
- }
96
- customElements.define(LabsSearchFacetsOption.is, LabsSearchFacetsOption);
@@ -1,62 +0,0 @@
1
- import { html, PolymerElement } from '@polymer/polymer/polymer-element.js';
2
- import { afterNextRender } from '@polymer/polymer/lib/utils/render-status.js';
3
-
4
- /**
5
- * Polymer-based web component for D2L search facets.
6
- * @fires d2l-labs-search-facets-change - Dispatched when the search facets group changes
7
- */
8
- class LabsSearchFacets extends PolymerElement {
9
- static get properties() {
10
- return {
11
- /**
12
- * Reference to bound listener functions to be removed in disconnectedCallback
13
- */
14
- _boundListeners: {
15
- type: Object,
16
- value: function() {
17
- return {
18
- _onFacetGroupingChange: null
19
- };
20
- }
21
- },
22
- };
23
- }
24
-
25
- static get is() { return 'd2l-labs-search-facets'; }
26
-
27
- static get template() {
28
- return html`
29
- <style>
30
- :host {
31
- display: block;
32
- }
33
- </style>
34
- <slot></slot>
35
- `;
36
- }
37
-
38
- connectedCallback() {
39
- super.connectedCallback();
40
-
41
- afterNextRender(this, () => {
42
- this._boundListeners._onFacetGroupingChange = this._onFacetGroupingChange.bind(this);
43
- this.addEventListener('d2l-labs-search-facets-grouping-change',
44
- this._boundListeners._onFacetGroupingChange);
45
- });
46
- }
47
-
48
- disconnectedCallback() {
49
- super.disconnectedCallback();
50
-
51
- this.removeEventListener('d2l-labs-search-facets-grouping-change',
52
- this._boundListeners._onFacetGroupingChange);
53
- }
54
-
55
- _onFacetGroupingChange(e) {
56
- this.dispatchEvent(new CustomEvent('d2l-labs-search-facets-change', {
57
- bubbles: true, composed: true, detail: e.detail
58
- }));
59
- }
60
- }
61
-
62
- customElements.define(LabsSearchFacets.is, LabsSearchFacets);
@@ -1,76 +0,0 @@
1
- import { html, PolymerElement } from '@polymer/polymer/polymer-element.js';
2
- import { LocalizeBehavior } from '../localize-behavior.js';
3
- import { mixinBehaviors } from '@polymer/polymer/lib/legacy/class.js';
4
-
5
- /**
6
- * `<d2l-labs-search-results-count>`
7
- * Polymer-based web component for D2L search result
8
- */
9
- class LabsSearchResultsCount extends mixinBehaviors(
10
- [
11
- LocalizeBehavior
12
- ],
13
- PolymerElement
14
- ) {
15
- static get properties() {
16
- return {
17
- /**
18
- * Displayed text
19
- */
20
- _text: {
21
- type: String,
22
- value: ''
23
- },
24
- /**
25
- * Range start
26
- */
27
- rangeStart: {
28
- type: Number
29
- },
30
- /**
31
- * Range end
32
- */
33
- rangeEnd: {
34
- type: Number
35
- },
36
- /**
37
- * Total count
38
- */
39
- totalCount: {
40
- type: Number,
41
- value: 0
42
- },
43
- /**
44
- * Search query
45
- */
46
- query: {
47
- type: String,
48
- value: ''
49
- }
50
- };
51
- }
52
-
53
- static get is() { return 'd2l-labs-search-results-count'; }
54
-
55
- static get template() {
56
- return html`
57
- [[_text]]
58
- `;
59
- }
60
-
61
- connectedCallback() {
62
- super.connectedCallback();
63
- if (this.rangeStart && this.rangeEnd) {
64
- this._text = this.query
65
- ? this.localize('searchPagedResultsForQuery',
66
- 'rangeStart', this.rangeStart, 'rangeEnd', this.rangeEnd, 'totalCount', this.totalCount, 'query', this.query)
67
- : this.localize('searchPagedResults',
68
- 'rangeStart', this.rangeStart, 'rangeEnd', this.rangeEnd, 'totalCount', this.totalCount);
69
- } else {
70
- this._text = this.query
71
- ? this.localize('searchResultsForQuery', 'totalCount', this.totalCount, 'query', this.query)
72
- : this.localize('searchResults', 'totalCount', this.totalCount);
73
- }
74
- }
75
- }
76
- customElements.define(LabsSearchResultsCount.is, LabsSearchResultsCount);