@supersoniks/concorde 2.0.2 → 2.0.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 (106) hide show
  1. package/README.md +1 -0
  2. package/concorde-core.bundle.js +748 -690
  3. package/concorde-core.es.js +3903 -3123
  4. package/core/_types/types.d.ts +2 -4
  5. package/core/components/functional/date/date.d.ts +4 -2
  6. package/core/components/functional/date/date.js +28 -13
  7. package/core/components/functional/fetch/fetch.d.ts +9 -10
  8. package/core/components/functional/fetch/fetch.js +21 -5
  9. package/core/components/functional/list/list.d.ts +7 -10
  10. package/core/components/functional/list/list.js +19 -4
  11. package/core/components/functional/queue/queue.d.ts +3 -2
  12. package/core/components/functional/queue/queue.js +71 -61
  13. package/core/components/functional/router/router.d.ts +1 -0
  14. package/core/components/functional/router/router.js +14 -3
  15. package/core/components/functional/sdui/sdui.d.ts +2 -7
  16. package/core/components/functional/submit/submit.js +11 -4
  17. package/core/components/ui/_css/scroll.js +13 -11
  18. package/core/components/ui/_css/size.js +1 -1
  19. package/core/components/ui/alert/alert.d.ts +14 -3
  20. package/core/components/ui/alert/alert.js +34 -4
  21. package/core/components/ui/badge/badge.js +10 -3
  22. package/core/components/ui/button/button.d.ts +19 -10
  23. package/core/components/ui/button/button.js +77 -22
  24. package/core/components/ui/captcha/captcha.d.ts +5 -4
  25. package/core/components/ui/captcha/captcha.js +33 -9
  26. package/core/components/ui/divider/divider.d.ts +2 -0
  27. package/core/components/ui/divider/divider.js +17 -2
  28. package/core/components/ui/form/checkbox/checkbox.d.ts +24 -9
  29. package/core/components/ui/form/checkbox/checkbox.js +4 -6
  30. package/core/components/ui/form/css/form-control.js +40 -7
  31. package/core/components/ui/form/fieldset/fieldset.d.ts +1 -0
  32. package/core/components/ui/form/fieldset/fieldset.js +14 -1
  33. package/core/components/ui/form/fieldset/legend-description.js +3 -3
  34. package/core/components/ui/form/fieldset/legend.js +2 -8
  35. package/core/components/ui/form/input/input.d.ts +4 -5
  36. package/core/components/ui/form/input/input.js +17 -13
  37. package/core/components/ui/form/input-autocomplete/input-autocomplete.d.ts +3 -5
  38. package/core/components/ui/form/input-autocomplete/input-autocomplete.js +9 -9
  39. package/core/components/ui/form/select/select.d.ts +4 -1
  40. package/core/components/ui/form/select/select.js +25 -18
  41. package/core/components/ui/form/textarea/textarea.d.ts +4 -5
  42. package/core/components/ui/form/textarea/textarea.js +19 -10
  43. package/core/components/ui/group/group.js +3 -3
  44. package/core/components/ui/icon/icon.js +2 -1
  45. package/core/components/ui/icon/icons.d.ts +0 -4
  46. package/core/components/ui/icon/icons.js +3 -16
  47. package/core/components/ui/link/link.d.ts +5 -2
  48. package/core/components/ui/link/link.js +31 -2
  49. package/core/components/ui/loader/loader.d.ts +4 -1
  50. package/core/components/ui/loader/loader.js +11 -3
  51. package/core/components/ui/loader/styles/inline.js +14 -16
  52. package/core/components/ui/menu/menu-item.js +2 -1
  53. package/core/components/ui/menu/menu.js +6 -22
  54. package/core/components/ui/modal/modal-close.js +2 -1
  55. package/core/components/ui/modal/modal.d.ts +13 -1
  56. package/core/components/ui/modal/modal.js +70 -10
  57. package/core/components/ui/pop/pop.d.ts +9 -3
  58. package/core/components/ui/pop/pop.js +46 -23
  59. package/core/components/ui/table/table-tr.d.ts +10 -2
  60. package/core/components/ui/table/table-tr.js +30 -2
  61. package/core/components/ui/table/table.d.ts +1 -0
  62. package/core/components/ui/table/table.js +7 -1
  63. package/core/components/ui/theme/theme-collection/core-variables.js +8 -19
  64. package/core/components/ui/theme/theme.d.ts +6 -0
  65. package/core/components/ui/theme/theme.js +11 -13
  66. package/core/components/ui/toast/message-subscriber.d.ts +0 -8
  67. package/core/components/ui/toast/message-subscriber.js +0 -46
  68. package/core/components/ui/toast/toast-item.js +31 -40
  69. package/core/components/ui/toast/toast.d.ts +5 -1
  70. package/core/components/ui/toast/toast.js +80 -13
  71. package/core/components/ui/tooltip/tooltip.d.ts +3 -1
  72. package/core/components/ui/tooltip/tooltip.js +22 -0
  73. package/core/core.d.ts +1 -0
  74. package/core/core.js +1 -0
  75. package/core/decorators/Subscriber.d.ts +3 -3
  76. package/core/decorators/Subscriber.js +66 -23
  77. package/core/directives/DataProvider.d.ts +12 -7
  78. package/core/directives/DataProvider.js +23 -8
  79. package/core/directives/Wording.d.ts +42 -0
  80. package/core/directives/Wording.js +202 -0
  81. package/core/mixins/Fetcher.d.ts +8 -11
  82. package/core/mixins/Fetcher.js +38 -22
  83. package/core/mixins/FormCheckable.d.ts +1 -4
  84. package/core/mixins/FormElement.d.ts +1 -0
  85. package/core/mixins/FormElement.js +3 -6
  86. package/core/mixins/FormInput.d.ts +3 -5
  87. package/core/mixins/FormInput.js +4 -0
  88. package/core/mixins/Subscriber.d.ts +0 -4
  89. package/core/mixins/Subscriber.js +13 -89
  90. package/core/mixins/TemplatesContainer.js +9 -0
  91. package/core/utils/Format.d.ts +1 -0
  92. package/core/utils/Format.js +16 -0
  93. package/core/utils/HTML.d.ts +13 -0
  94. package/core/utils/HTML.js +42 -3
  95. package/core/utils/Objects.d.ts +1 -0
  96. package/core/utils/Objects.js +5 -0
  97. package/core/utils/PublisherProxy.d.ts +16 -10
  98. package/core/utils/PublisherProxy.js +112 -74
  99. package/core/utils/Utils.d.ts +1 -0
  100. package/core/utils/Utils.js +5 -0
  101. package/core/utils/api.d.ts +26 -0
  102. package/core/utils/api.js +135 -3
  103. package/core/utils/url-pattern.d.ts +2 -0
  104. package/core/utils/url-pattern.js +2 -0
  105. package/mixins.d.ts +6 -16
  106. package/package.json +9 -2
@@ -21,10 +21,8 @@ export type MixinArgsType = any;
21
21
  export type PrimitiveType = string | number | boolean | bigint | undefined | null | symbol;
22
22
  export type PublisherInterface<T = PublisherContentType> = Publisher<T> & any;
23
23
  export type CoreJSType = string | number | boolean | null | {
24
- [property: string]: CoreJSType;
24
+ [property: string | number | symbol]: CoreJSType;
25
25
  } | CoreJSType[];
26
26
  export type TypeAndRecordOfType<U> = U & Record<string | number, U>;
27
- export type PublisherContentType = CoreJSType & {
28
- __value?: CoreJSType;
29
- };
27
+ export type PublisherContentType = unknown;
30
28
  export type HTMLFormControl = HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement;
@@ -1,4 +1,4 @@
1
- import { LitElement, nothing } from "lit";
1
+ import { LitElement } from "lit";
2
2
  type DateTimeFormatPartExtended = {
3
3
  hidden?: boolean;
4
4
  source?: string;
@@ -19,6 +19,7 @@ export declare class SonicDate extends SonicDate_base {
19
19
  start_date_string: string | null;
20
20
  end_date_string: string | null;
21
21
  start_date: number;
22
+ hide_hours: boolean;
22
23
  end_date: number;
23
24
  era: "narrow" | "short" | "long" | "";
24
25
  year: "numeric" | "2-digit";
@@ -26,6 +27,7 @@ export declare class SonicDate extends SonicDate_base {
26
27
  day: "numeric" | "2-digit";
27
28
  weekday: "narrow" | "short" | "long" | "hidden";
28
29
  hour: "numeric" | "2-digit" | "hidden";
30
+ hour12: boolean;
29
31
  minute: "numeric" | "2-digit" | "hidden";
30
32
  language: string;
31
33
  renderIf: boolean;
@@ -38,6 +40,6 @@ export declare class SonicDate extends SonicDate_base {
38
40
  */
39
41
  getDatesParts(start_date: number, end_date: number, options: Intl.DateTimeFormatOptions): DateTimeFormatPartExtended[];
40
42
  dateStringToSeconds(dateString: string): number;
41
- render(): import("lit-html").TemplateResult<1> | typeof nothing;
43
+ render(): import("lit-html/directive").DirectiveResult<typeof import("lit-html/directives/unsafe-html").UnsafeHTMLDirective>;
42
44
  }
43
45
  export {};
@@ -8,8 +8,9 @@ import Subscriber from "@supersoniks/concorde/core/mixins/Subscriber";
8
8
  import TemplatesContainer from "@supersoniks/concorde/core/mixins/TemplatesContainer";
9
9
  import Format from "@supersoniks/concorde/core/utils/Format";
10
10
  import HTML from "@supersoniks/concorde/core/utils/HTML";
11
- import { html, LitElement, nothing } from "lit";
11
+ import { LitElement, nothing } from "lit";
12
12
  import { customElement, property } from "lit/decorators.js";
13
+ import { unsafeHTML } from "lit/directives/unsafe-html.js";
13
14
  const tagName = "sonic-date";
14
15
  let SonicDate = class SonicDate extends Subscriber(TemplatesContainer(LitElement)) {
15
16
  constructor() {
@@ -24,6 +25,7 @@ let SonicDate = class SonicDate extends Subscriber(TemplatesContainer(LitElement
24
25
  this.start_date_string = null;
25
26
  this.end_date_string = null;
26
27
  this.start_date = 0;
28
+ this.hide_hours = false;
27
29
  this.end_date = 0;
28
30
  this.era = "";
29
31
  this.year = "numeric";
@@ -31,6 +33,7 @@ let SonicDate = class SonicDate extends Subscriber(TemplatesContainer(LitElement
31
33
  this.day = "2-digit";
32
34
  this.weekday = "short";
33
35
  this.hour = "2-digit";
36
+ this.hour12 = false;
34
37
  this.minute = "2-digit";
35
38
  this.language = "";
36
39
  this.renderIf = true;
@@ -44,10 +47,10 @@ let SonicDate = class SonicDate extends Subscriber(TemplatesContainer(LitElement
44
47
  return this._wording_billet_periode_validite;
45
48
  }
46
49
  set wording_billet_periode_validite(value) {
50
+ if (!value)
51
+ value = "Du %s au %s";
47
52
  this._wording_billet_periode_validite = value;
48
- this.duAu = this.wording_billet_periode_validite
49
- .split("%s")
50
- .map((str) => str.trim());
53
+ this.duAu = this.wording_billet_periode_validite?.split("%s").map((str) => str.trim());
51
54
  this.duAu.pop();
52
55
  this.requestUpdate();
53
56
  }
@@ -70,7 +73,7 @@ let SonicDate = class SonicDate extends Subscriber(TemplatesContainer(LitElement
70
73
  //
71
74
  //on affiche pas l'heure si les dates sont les mêmes
72
75
  const isSameDay = start.toDateString() == end.toDateString();
73
- if (!isSameDay) {
76
+ if (!isSameDay || this.hide_hours) {
74
77
  delete options.hour;
75
78
  delete options.minute;
76
79
  }
@@ -78,9 +81,7 @@ let SonicDate = class SonicDate extends Subscriber(TemplatesContainer(LitElement
78
81
  parts = format.formatRangeToParts(start, end);
79
82
  //on affiche du au uniquement si on a deux dates différentes
80
83
  if (!isSameDay) {
81
- const to = parts.find((part) => part.type == "literal" &&
82
- part.source == "shared" &&
83
- part.value.trim().length > 0);
84
+ const to = parts.find((part) => part.type == "literal" && part.source == "shared" && part.value.trim().length > 0);
84
85
  if (to) {
85
86
  to.value = " " + this.duAu[1] + " ";
86
87
  to.type = "to";
@@ -99,7 +100,9 @@ let SonicDate = class SonicDate extends Subscriber(TemplatesContainer(LitElement
99
100
  }
100
101
  //En mode design on cache les ","
101
102
  if (this.designMode) {
102
- parts.forEach((part) => (part.hidden = part.value.trim() == ","));
103
+ // parts.forEach((part) => (part.hidden = part.value.trim() == ","));
104
+ // replace all "," by " "
105
+ parts.forEach((part) => (part.value = part.value.replace(/,/g, " ")));
103
106
  }
104
107
  parts[0].value = Format.ucFirst(parts[0].value);
105
108
  return parts.filter((p) => p.hidden !== true);
@@ -137,6 +140,7 @@ let SonicDate = class SonicDate extends Subscriber(TemplatesContainer(LitElement
137
140
  year: this.year,
138
141
  month: this.month,
139
142
  day: this.day,
143
+ hour12: this.hour12,
140
144
  };
141
145
  if (this.weekday !== "hidden")
142
146
  options.weekday = this.weekday;
@@ -152,17 +156,22 @@ let SonicDate = class SonicDate extends Subscriber(TemplatesContainer(LitElement
152
156
  * On récupère les différentes partie affichées en vu de l'injection dans le template
153
157
  */
154
158
  const parts = this.getDatesParts(this.start_date, this.end_date, options);
155
- return html `${parts.map((part) => {
159
+ return unsafeHTML(`${parts
160
+ .map((part) => {
156
161
  const template = this.templateParts[part.type];
157
162
  if (template) {
158
163
  const clone = document.importNode(template.content, true);
159
164
  const child = clone.children[0];
160
165
  if (child.innerText.trim() == "")
161
166
  child.innerText = part.value;
162
- return clone;
167
+ return child.outerHTML;
163
168
  }
164
- return html `<span class="${part.type}">${part.value}</span>`;
165
- })}`;
169
+ const span = document.createElement("span");
170
+ span.innerText = part.value;
171
+ span.className = part.type;
172
+ return `<span class="${part.type}">${part.value}</span>`;
173
+ })
174
+ .join("")}`);
166
175
  }
167
176
  };
168
177
  __decorate([
@@ -189,6 +198,9 @@ __decorate([
189
198
  __decorate([
190
199
  property({ type: Number })
191
200
  ], SonicDate.prototype, "start_date", void 0);
201
+ __decorate([
202
+ property({ type: Boolean })
203
+ ], SonicDate.prototype, "hide_hours", void 0);
192
204
  __decorate([
193
205
  property({ type: Number })
194
206
  ], SonicDate.prototype, "end_date", void 0);
@@ -210,6 +222,9 @@ __decorate([
210
222
  __decorate([
211
223
  property({ type: String })
212
224
  ], SonicDate.prototype, "hour", void 0);
225
+ __decorate([
226
+ property({ type: Boolean })
227
+ ], SonicDate.prototype, "hour12", void 0);
213
228
  __decorate([
214
229
  property({ type: String })
215
230
  ], SonicDate.prototype, "minute", void 0);
@@ -1,5 +1,7 @@
1
1
  /// <reference types="node" />
2
- import { LitElement } from "lit";
2
+ import { LitElement, nothing } from "lit";
3
+ import { LoaderMode } from "../../ui/loader/loader";
4
+ import { DirectiveResult } from "lit/async-directive";
3
5
  declare const Fetch_base: {
4
6
  new (...args: any[]): {
5
7
  api: import("../../../utils/api").default | null;
@@ -7,12 +9,11 @@ declare const Fetch_base: {
7
9
  isFirstLoad: boolean;
8
10
  isLoading: boolean;
9
11
  lazyLoad?: boolean | undefined;
10
- noLoader?: boolean | undefined;
11
12
  iObserver: IntersectionObserver | null;
12
- isDefaultLoaderEnabled: boolean;
13
13
  isFetchEnabled: boolean;
14
+ fetchedData: any;
14
15
  _endPoint: string;
15
- props: (import("../../../_types/types").PublisherContentType & import("../../../utils/api").ResultTypeInterface) | null;
16
+ props: import("../../../utils/api").ResultTypeInterface | null;
16
17
  endPoint: string;
17
18
  requestId: number;
18
19
  refetchEveryMs: number;
@@ -49,12 +50,8 @@ declare const Fetch_base: {
49
50
  getAttribute(name: string): string;
50
51
  hasAttribute(attributeName: string): boolean;
51
52
  getBoundingClientRect(): DOMRect;
52
- onConnected(callback: (component: any) => void): void;
53
- offConnected(callback: (component: any) => void): void;
54
- onDisconnected(callback: (component: any) => void): void;
55
- offDisconnected(callback: (component: any) => void): void;
56
53
  };
57
- } & (new (...args: any[]) => import("@supersoniks/concorde/core/mixins/Subscriber").SubscriberInterface<import("../../../_types/types").CoreJSType>) & typeof LitElement;
54
+ } & (new (...args: any[]) => import("@supersoniks/concorde/core/mixins/Subscriber").SubscriberInterface<import("../../../_types/types").CoreJSType>) & (new (...args: any[]) => import("../../../mixins/TemplatesContainer").TemplatesContainerInterface) & typeof LitElement;
58
55
  /**
59
56
  * ###Fetch charge un contenu via un appel d'api web.
60
57
  * Extends mixins : Fetcher, [Subscriber](./?path=/docs/miscallenous-🔔-subscriber--page)
@@ -83,12 +80,14 @@ declare const Fetch_base: {
83
80
  * | token | Fetcher ou un de ses parents | A fournir à la place des autres attributs si on le possède | q<d34gb | null |
84
81
 
85
82
  #### Autres choses utiles
86
- * * L'attribut *noLoader* du composant permet de désactiver l'affichage du loader par défaut.
87
83
  * * On peut appeler la methode invalidate() sur le publisher associé au composant pour declencher le rechargement des données.
88
84
  * * endPoint est une propriété réctive, par conséquent, sa modification, manuelle via template ou data binbding provoque la mise à jour du contenu.
89
85
  */
90
86
  export declare class Fetch extends Fetch_base {
91
87
  static styles: import("lit").CSSResult[];
88
+ loader?: LoaderMode | true | "";
89
+ renderLoader(): import("lit-html").TemplateResult<1> | typeof nothing;
90
+ renderSkeleton(): DirectiveResult<import("lit-html/directive").DirectiveClass>;
92
91
  render(): import("lit-html").TemplateResult<1>;
93
92
  }
94
93
  export {};
@@ -4,10 +4,12 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
4
4
  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
5
5
  return c > 3 && r && Object.defineProperty(target, key, r), r;
6
6
  };
7
- import { css, html, LitElement } from "lit";
8
- import { customElement } from "lit/decorators.js";
7
+ import { css, html, LitElement, nothing } from "lit";
8
+ import { customElement, property } from "lit/decorators.js";
9
9
  import Subscriber from "@supersoniks/concorde/core/mixins/Subscriber";
10
10
  import Fetcher from "@supersoniks/concorde/core/mixins/Fetcher";
11
+ import { TemplatesContainer } from "@supersoniks/concorde/mixins";
12
+ import { templateContent } from "lit/directives/template-content.js";
11
13
  const tagName = "sonic-fetch"; // For Astro.build
12
14
  /**
13
15
  * ###Fetch charge un contenu via un appel d'api web.
@@ -37,13 +39,24 @@ const tagName = "sonic-fetch"; // For Astro.build
37
39
  * | token | Fetcher ou un de ses parents | A fournir à la place des autres attributs si on le possède | q<d34gb | null |
38
40
 
39
41
  #### Autres choses utiles
40
- * * L'attribut *noLoader* du composant permet de désactiver l'affichage du loader par défaut.
41
42
  * * On peut appeler la methode invalidate() sur le publisher associé au composant pour declencher le rechargement des données.
42
43
  * * endPoint est une propriété réctive, par conséquent, sa modification, manuelle via template ou data binbding provoque la mise à jour du contenu.
43
44
  */
44
- let Fetch = class Fetch extends Fetcher(Subscriber(LitElement)) {
45
+ let Fetch = class Fetch extends Fetcher(Subscriber(TemplatesContainer(LitElement))) {
46
+ renderLoader() {
47
+ if (!(this.isLoading && this.loader !== undefined))
48
+ return nothing;
49
+ const loader = this.loader === true || this.loader === "" ? "fixed" : this.loader;
50
+ return html `<sonic-loader mode=${loader}></sonic-loader>`;
51
+ }
52
+ renderSkeleton() {
53
+ const template = this.templateParts["skeleton"];
54
+ if (!(this.isLoading && template))
55
+ return nothing;
56
+ return templateContent(template);
57
+ }
45
58
  render() {
46
- return html `<slot></slot>`;
59
+ return html ` ${this.renderSkeleton()} ${this.renderLoader()} ${!this.isLoading ? html `<slot></slot>` : nothing} `;
47
60
  }
48
61
  };
49
62
  Fetch.styles = [
@@ -53,6 +66,9 @@ Fetch.styles = [
53
66
  }
54
67
  `,
55
68
  ];
69
+ __decorate([
70
+ property()
71
+ ], Fetch.prototype, "loader", void 0);
56
72
  Fetch = __decorate([
57
73
  customElement(tagName)
58
74
  ], Fetch);
@@ -1,10 +1,11 @@
1
1
  /// <reference types="node" />
2
- import { LitElement } from "lit";
2
+ import { LitElement, nothing } from "lit";
3
3
  import "@supersoniks/concorde/core/components/ui/loader/loader";
4
4
  import "@supersoniks/concorde/core/components/functional/subscriber/subscriber";
5
5
  import { DirectiveResult } from "lit/directive";
6
6
  import { TemplateContentDirective } from "lit/directives/template-content.js";
7
7
  import { TemplateResult } from "lit";
8
+ import { LoaderMode } from "@supersoniks/concorde/core/components/ui/loader/loader";
8
9
  /**
9
10
  * ### List boucle sur sa propriété "props" et crée des éléments a partir des données en bouclant également sur ses templates.
10
11
  *
@@ -44,12 +45,11 @@ declare const List_base: {
44
45
  isFirstLoad: boolean;
45
46
  isLoading: boolean;
46
47
  lazyLoad?: boolean | undefined;
47
- noLoader?: boolean | undefined;
48
48
  iObserver: IntersectionObserver | null;
49
- isDefaultLoaderEnabled: boolean;
50
49
  isFetchEnabled: boolean;
50
+ fetchedData: any;
51
51
  _endPoint: string;
52
- props: (import("../../../_types/types").PublisherContentType & import("../../../utils/api").ResultTypeInterface) | null;
52
+ props: import("../../../utils/api").ResultTypeInterface | null;
53
53
  endPoint: string;
54
54
  requestId: number;
55
55
  refetchEveryMs: number;
@@ -86,10 +86,6 @@ declare const List_base: {
86
86
  getAttribute(name: string): string;
87
87
  hasAttribute(attributeName: string): boolean;
88
88
  getBoundingClientRect(): DOMRect;
89
- onConnected(callback: (component: any) => void): void;
90
- offConnected(callback: (component: any) => void): void;
91
- onDisconnected(callback: (component: any) => void): void;
92
- offDisconnected(callback: (component: any) => void): void;
93
89
  };
94
90
  } & (new (...args: any[]) => import("@supersoniks/concorde/core/mixins/Subscriber").SubscriberInterface<import("../../../_types/types").CoreJSType>) & (new (...args: any[]) => import("@supersoniks/concorde/core/mixins/TemplatesContainer").TemplatesContainerInterface) & typeof LitElement;
95
91
  export declare class List extends List_base {
@@ -103,15 +99,16 @@ export declare class List extends List_base {
103
99
  * La propriété idKey est utilisé repérer les lignes de manière unique si pour les item de la liste item[this.idKey] n'existe pas, alors l'index est utilisé
104
100
  */
105
101
  idKey: string;
102
+ loader?: LoaderMode | true | "";
106
103
  limit: number;
107
104
  offset: number;
108
105
  connectedCallback(): void;
109
106
  disconnectedCallback(): void;
107
+ renderLoader(): TemplateResult<1> | typeof nothing;
108
+ renderSkeleton(): DirectiveResult<import("lit-html/directive").DirectiveClass>;
110
109
  renderLoadingState(): DirectiveResult<typeof TemplateContentDirective> | TemplateResult;
111
110
  renderNoResultState(): TemplateResult<1>;
112
111
  formatProps(): (import("../../../_types/types").CoreJSType[] & {
113
- __value?: import("../../../_types/types").CoreJSType | undefined;
114
- } & {
115
112
  _sonic_http_response_?: Response | undefined;
116
113
  text?: string | undefined;
117
114
  }) | null;
@@ -32,7 +32,6 @@ let List = class List extends Fetcher(Subscriber(TemplatesContainer(LitElement))
32
32
  connectedCallback() {
33
33
  this.noShadowDom = "";
34
34
  this.defferedDebug = this.hasAttribute("debug") || null;
35
- this.isDefaultLoaderEnabled = false;
36
35
  this.isFetchEnabled = this.hasAttribute("fetch");
37
36
  if (this.isFetchEnabled)
38
37
  this.isLoading = true;
@@ -41,10 +40,23 @@ let List = class List extends Fetcher(Subscriber(TemplatesContainer(LitElement))
41
40
  disconnectedCallback() {
42
41
  super.disconnectedCallback();
43
42
  }
43
+ renderLoader() {
44
+ if (!(this.isLoading && this.loader !== undefined))
45
+ return nothing;
46
+ const template = this.templateParts["skeleton"];
47
+ if (template)
48
+ return nothing;
49
+ const loader = this.loader === true || this.loader === "" ? "fixed" : this.loader;
50
+ return html `<sonic-loader mode=${loader}></sonic-loader>`;
51
+ }
52
+ renderSkeleton() {
53
+ const template = this.templateParts["skeleton"];
54
+ if (!(this.isLoading && template))
55
+ return nothing;
56
+ return templateContent(template);
57
+ }
44
58
  renderLoadingState() {
45
- return this.templateParts["skeleton"]
46
- ? templateContent(this.templateParts["skeleton"])
47
- : html `<sonic-loader mode="inline"></sonic-loader>`;
59
+ return html `${this.renderSkeleton()} ${this.renderLoader()}`;
48
60
  }
49
61
  renderNoResultState() {
50
62
  return html ` <div
@@ -187,6 +199,9 @@ __decorate([
187
199
  __decorate([
188
200
  property({ type: String })
189
201
  ], List.prototype, "idKey", void 0);
202
+ __decorate([
203
+ property()
204
+ ], List.prototype, "loader", void 0);
190
205
  __decorate([
191
206
  property()
192
207
  ], List.prototype, "limit", void 0);
@@ -10,6 +10,7 @@ type QueueItem = {
10
10
  };
11
11
  type QueueProps = QueueItem[] & {
12
12
  resultCount?: number;
13
+ lastFetchedData?: unknown;
13
14
  };
14
15
  declare const Queue_base: (new (...args: any[]) => import("@supersoniks/concorde/core/mixins/Subscriber").SubscriberInterface<QueueProps>) & typeof LitElement;
15
16
  /**
@@ -44,10 +45,11 @@ export default class Queue extends Queue_base {
44
45
  filterPublisher: PublisherProxy | null;
45
46
  configFilter(): void;
46
47
  filterTimeoutId?: ReturnType<typeof setTimeout>;
48
+ filterTimeoutMs: number;
47
49
  searchHash: string;
48
50
  requestId: number;
49
51
  isFirstRequest: boolean;
50
- updateFilteredContent(): void;
52
+ updateFilteredContent: () => void;
51
53
  /**
52
54
  * Cette expression est utilisée comme modèle par le composant Queue pour renseigngner le dataProvider de la [liste](./?path=/docs/core-components-functional-list-list--basic) créée.
53
55
  * * l'expression *$offset* est alors remplacée par le numéro de l'élément à partir duquel démarrer
@@ -56,7 +58,6 @@ export default class Queue extends Queue_base {
56
58
  */
57
59
  dataProviderExpression: string;
58
60
  idKey: string;
59
- currentScrollPosition: number | undefined;
60
61
  resetDuration(): void;
61
62
  listDataProviders: string[];
62
63
  nextHadEvent: boolean;
@@ -46,9 +46,52 @@ let Queue = Queue_1 = class Queue extends Subscriber(LitElement, {}) {
46
46
  this.instanceId = 0;
47
47
  this.localStorage = "disabled";
48
48
  this.filterPublisher = null;
49
+ this.filterTimeoutMs = 400;
49
50
  this.searchHash = "";
50
51
  this.requestId = 0;
51
52
  this.isFirstRequest = true;
53
+ this.updateFilteredContent = () => {
54
+ /**
55
+ * On ne lance la recherche que si le hash de recherche est différent
56
+ */
57
+ const dataProvider = this.dataProviderExpression;
58
+ const split = dataProvider.split("?");
59
+ split.shift();
60
+ const searchParams = new URLSearchParams(split.join("?"));
61
+ const filterData = this.filterPublisher?.get();
62
+ const filteredFieldsArray = this.filteredFields.split(" ");
63
+ for (const f in filterData) {
64
+ let value = filterData[f];
65
+ if (Array.isArray(value))
66
+ value = value.filter((v) => v !== null);
67
+ if ((this.filteredFields && !filteredFieldsArray.includes(f)) || value == null || value.toString() === "")
68
+ continue;
69
+ searchParams.set(f, filterData[f].toString());
70
+ }
71
+ const searchHash = searchParams.toString();
72
+ if (searchHash == this.searchHash && !this.isFirstRequest)
73
+ return;
74
+ this.searchHash = searchHash;
75
+ /**
76
+ * on reset les données avant de lancer la requète
77
+ */
78
+ for (const dataProvider of this.listDataProviders) {
79
+ PublisherManager.delete(dataProvider);
80
+ // this.publisher.lastFetchedData = {};
81
+ }
82
+ this.listDataProviders = [];
83
+ clearTimeout(this.filterTimeoutId);
84
+ this.filterTimeoutId = setTimeout(async () => {
85
+ const count = this.resultCount;
86
+ this.props = null;
87
+ //On garde le décompte au cas ou il n'y aurait pas rechargement
88
+ this.requestId++;
89
+ this.resultCount = count;
90
+ await PublisherManager.getInstance().isLocalStrorageReady;
91
+ window.requestAnimationFrame(() => this.next());
92
+ }, this.isFirstRequest ? 0 : this.filterTimeoutMs);
93
+ this.isFirstRequest = false;
94
+ };
52
95
  /**
53
96
  * Cette expression est utilisée comme modèle par le composant Queue pour renseigngner le dataProvider de la [liste](./?path=/docs/core-components-functional-list-list--basic) créée.
54
97
  * * l'expression *$offset* est alors remplacée par le numéro de l'élément à partir duquel démarrer
@@ -57,20 +100,33 @@ let Queue = Queue_1 = class Queue extends Subscriber(LitElement, {}) {
57
100
  */
58
101
  this.dataProviderExpression = "";
59
102
  this.idKey = "id";
60
- this.currentScrollPosition = undefined;
61
103
  this.listDataProviders = [];
62
104
  this.nextHadEvent = false;
63
105
  }
64
106
  disconnectedCallback() {
65
107
  for (const dataProvider of this.listDataProviders) {
66
108
  PublisherManager.delete(dataProvider);
109
+ this.listDataProviders = [];
67
110
  }
111
+ this.filterPublisher?.offInternalMutation(this.updateFilteredContent);
112
+ // reset internal state
113
+ this.props = null;
114
+ this.limit = 5;
115
+ this.offset = 0;
116
+ this.resultCount = 0;
117
+ this.searchHash = "";
118
+ this.requestId = 0;
119
+ this.isFirstRequest = true;
120
+ this.nextHadEvent = false;
121
+ this.publisher.set({});
68
122
  super.disconnectedCallback();
69
123
  return;
70
124
  }
71
125
  async connectedCallback() {
72
126
  this.instanceId = Queue_1.instanceCounter++;
73
127
  this.localStorage = this.getAttribute("localStorage") || this.localStorage;
128
+ this.filterTimeoutMs = parseInt(this.getAttribute("filterTimeoutMs") || "400");
129
+ //On supprime l'attribut car une queue ne doi pas être en localstorage, ce sont ses sous composants list qui doivent l'être
74
130
  this.removeAttribute("localStorage");
75
131
  this.noShadowDom = "";
76
132
  this.defferedDebug = this.hasAttribute("debug") || null;
@@ -81,11 +137,12 @@ let Queue = Queue_1 = class Queue extends Subscriber(LitElement, {}) {
81
137
  this.dataProviderExpression = HTML.getAncestorAttributeValue(this.parentElement, "dataProvider") || "";
82
138
  }
83
139
  super.connectedCallback();
140
+ this.publisher.set({});
84
141
  this.key = this.getAttribute("key");
142
+ await PublisherManager.getInstance().isLocalStrorageReady;
85
143
  if (!this.templates)
86
144
  this.templates = Array.from(this.querySelectorAll("template"));
87
145
  this.lastRequestTime = new Date().getTime();
88
- await PublisherManager.getInstance().isLocalStrorageReady;
89
146
  this.configFilter();
90
147
  }
91
148
  configFilter() {
@@ -95,50 +152,7 @@ let Queue = Queue_1 = class Queue extends Subscriber(LitElement, {}) {
95
152
  return;
96
153
  }
97
154
  this.filterPublisher = PublisherManager.getInstance().get(dataFilterProvider);
98
- this.filterPublisher?.onInternalMutation(() => {
99
- this.updateFilteredContent();
100
- });
101
- }
102
- updateFilteredContent() {
103
- /**
104
- * On ne lance la recherche que si le hash de recherche est différent
105
- */
106
- const dataProvider = this.dataProviderExpression;
107
- const split = dataProvider.split("?");
108
- split.shift();
109
- const searchParams = new URLSearchParams(split.join("?"));
110
- const filterData = this.filterPublisher?.get();
111
- const filteredFieldsArray = this.filteredFields.split(" ");
112
- for (const f in filterData) {
113
- let value = filterData[f];
114
- if (Array.isArray(value))
115
- value = value.filter((v) => v !== null);
116
- if ((this.filteredFields && !filteredFieldsArray.includes(f)) || value == null || value.toString() === "")
117
- continue;
118
- searchParams.set(f, filterData[f].toString());
119
- }
120
- const searchHash = searchParams.toString();
121
- if (searchHash == this.searchHash && !this.isFirstRequest)
122
- return;
123
- this.searchHash = searchHash;
124
- /**
125
- * on reset les données avant de lancer la requète
126
- */
127
- for (const dataProvider of this.listDataProviders) {
128
- PublisherManager.delete(dataProvider);
129
- }
130
- this.listDataProviders = [];
131
- clearTimeout(this.filterTimeoutId);
132
- this.filterTimeoutId = setTimeout(async () => {
133
- const count = this.resultCount;
134
- this.props = null;
135
- //On garde le décompte au cas ou il n'y aurait pas rechargement
136
- this.requestId++;
137
- this.resultCount = count;
138
- await PublisherManager.getInstance().isLocalStrorageReady;
139
- window.requestAnimationFrame(() => this.next());
140
- }, this.isFirstRequest ? 0 : 400);
141
- this.isFirstRequest = false;
155
+ this.filterPublisher?.onInternalMutation(this.updateFilteredContent);
142
156
  }
143
157
  resetDuration() {
144
158
  this.lastRequestTime = new Date().getTime();
@@ -153,21 +167,25 @@ let Queue = Queue_1 = class Queue extends Subscriber(LitElement, {}) {
153
167
  * */
154
168
  if (!this.nextHadEvent && e) {
155
169
  this.publisher.resultCount = 0;
170
+ // this.publisher.lastFetchedData = {};
156
171
  this.resultCount = 0;
157
172
  }
158
173
  this.nextHadEvent = !!e;
159
174
  if (e) {
175
+ this.publisher.lastFetchedData = e.detail.fetchedData;
160
176
  if (e.detail.requestId < this.requestId)
161
177
  return;
162
178
  this.resultCount += e.detail.props.length;
163
179
  if (!e.detail.isFirstLoad || !e.detail.props.length || this.dataProviderExpression.indexOf("$offset") == -1) {
164
180
  this.publisher.resultCount = this.resultCount;
181
+ // this.publisher.lastFetchedData = {};
165
182
  return;
166
183
  }
167
184
  }
168
185
  if (!Array.isArray(this.props)) {
169
186
  const newProps = [];
170
187
  newProps.resultCount = this.resultCount;
188
+ newProps.lastFetchedData = e?.detail.fetchedData || {};
171
189
  this.props = newProps;
172
190
  }
173
191
  else {
@@ -184,7 +202,7 @@ let Queue = Queue_1 = class Queue extends Subscriber(LitElement, {}) {
184
202
  this.limit = 15;
185
203
  let dataProvider = this.dataProviderExpression.replace("$offset", offset + "").replace("$limit", this.limit + "");
186
204
  const split = dataProvider.split("?");
187
- const endpoint = split.shift();
205
+ let endpoint = split.shift();
188
206
  const searchParams = new URLSearchParams(split.join("?"));
189
207
  const filterData = this.filterPublisher?.get();
190
208
  const filteredFieldsArray = this.filteredFields.split(" ");
@@ -195,34 +213,25 @@ let Queue = Queue_1 = class Queue extends Subscriber(LitElement, {}) {
195
213
  }
196
214
  if (!this.searchHash)
197
215
  this.searchHash = searchParams.toString();
198
- dataProvider = endpoint + "?" + searchParams.toString();
216
+ endpoint = endpoint + "?" + searchParams.toString();
217
+ dataProvider = dataProvider + "_item_from_queue_" + this.instanceId;
199
218
  this.listDataProviders.push(dataProvider);
200
- // this.currentScrollPosition = document.scrollingElement?.scrollTop;
201
219
  const newProps = [
202
220
  ...this.props,
203
221
  {
204
222
  id: searchParams.toString() + "/" + this.props.length,
205
- dataProvider: dataProvider + "_item_from_queue_" + this.instanceId,
206
- endPoint: dataProvider,
223
+ dataProvider: dataProvider,
224
+ endPoint: endpoint,
207
225
  offset: offset,
208
226
  limit: this.limit,
209
227
  },
210
228
  ];
211
229
  newProps.resultCount = this.resultCount;
230
+ newProps.lastFetchedData = e?.detail.fetchedData || {};
212
231
  this.props = newProps;
213
232
  this.lastRequestTime = new Date().getTime();
214
233
  }
215
234
  render() {
216
- /**
217
- * supression du retablisment de la scroll pos.
218
- **/
219
- // if (this.currentScrollPosition) {
220
- // window.requestAnimationFrame(() => {
221
- // if (document.scrollingElement && this.currentScrollPosition != undefined)
222
- // document.scrollingElement.scrollTop = this.currentScrollPosition;
223
- // this.currentScrollPosition = undefined;
224
- // });
225
- // }
226
235
  if (!Array.isArray(this.props))
227
236
  return nothing;
228
237
  let lazyload = !this.noLazyload;
@@ -235,6 +244,7 @@ let Queue = Queue_1 = class Queue extends Subscriber(LitElement, {}) {
235
244
  return html `
236
245
  <sonic-list
237
246
  fetch
247
+ loader="inline"
238
248
  cache=${this.cache}
239
249
  displayContents
240
250
  lazyBoundsRatio=${this.lazyBoundsRatio}
@@ -16,6 +16,7 @@ declare const SonicRouter_base: (new (...args: any[]) => import("@supersoniks/co
16
16
  */
17
17
  export declare class SonicRouter extends SonicRouter_base {
18
18
  templateValueAttribute: string;
19
+ fallBackRoute?: string;
19
20
  connectedCallback(): void;
20
21
  disconnectedCallback(): void;
21
22
  private _location;