mealz-components 2.8.1 → 2.8.2

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.
@@ -1,4 +1,4 @@
1
- import{N as m,k as a}from"../assets/no-shadow-element-CXVMZH9n.js";import{n as d}from"../assets/property-BXpY_hgs.js";import{r as _}from"../assets/state-BjFDUoQX.js";import{e as u}from"../assets/query-BApjzB0v.js";import{a as h}from"../assets/mealz-sdk-CnvUgy3V.js";class f{get extId(){return this.attributes["ext-id"]}}var g=Object.defineProperty,b=Object.getOwnPropertyDescriptor,n=(c,t,e,s)=>{for(var i=s>1?void 0:s?b(t,e):t,o=c.length-1,l;o>=0;o--)(l=c[o])&&(i=(s?l(t,e,i):l(i))||i);return s&&i&&g(t,e,i),i};class r extends m{constructor(){var t,e,s,i,o,l;super(),this.selectedRadius=50,this.getByAddress=(e=(t=h)==null?void 0:t.pos)==null?void 0:e.getByAddress,this.getByCoordinates=(i=(s=h)==null?void 0:s.pos)==null?void 0:i.getByCoordinates,this.getAffiliateSuppliers=(l=(o=h)==null?void 0:o.supplier)==null?void 0:l.getAffiliateSuppliers,this._show=!1,this._posList=[],this._suppliers=[],this._markers=[],this._searchingPos=!1,this._searchSubmitted=!1,this._prevAddress="",this._selectedSuppliers=[],this._showPosList=!1,this._posSelected=!1,this.subscriptions=[],this.styleURL=new URL("/store-locator.css",import.meta.url)}get show(){return this._show}set show(t){this._show=t,this._show&&(this._posSelected=!1,this.initialSearch(),this._map&&this.ensureMapSize())}set geolocationCoordinates(t){var e,s;this._geolocationCoordinates=t,typeof((e=t==null?void 0:t.coords)==null?void 0:e.latitude)=="number"&&typeof((s=t==null?void 0:t.coords)==null?void 0:s.longitude)=="number"&&this.setGeolocation()}get geolocationCoordinates(){return this._geolocationCoordinates}getMapContainer(){var e;const t=this._mapElement??((e=this.querySelector)==null?void 0:e.call(this,"#mealz-store-locator__map"));return t instanceof HTMLElement?t:null}_nameOfStore(t){return`${t.supplier.attributes.name} - ${t.attributes.name}`}connectedCallback(){super.connectedCallback(),this.initLeaflet(),this.initEvents(),this.initResizeObserver()}disconnectedCallback(){var t,e,s;this.subscriptions.forEach(i=>i.unsubscribe()),this._resizeObserver&&this._resizeObserver.disconnect(),super.disconnectedCallback(),this._map&&(this._map.off(),this._map.remove(),this._map=void 0),(t=this._leafletCss)==null||t.remove(),(e=this._miamDs)==null||e.remove(),(s=this._leafletJs)==null||s.remove()}firstUpdated(){this._posSelected=!1,this.loadMap(),this.geolocationTimeout(),this.listenFormSubmit(),this._map&&this.ensureMapSize()}render(){return this.show?this.posSelectionTemplate():a``}posSelectionTemplate(){return a`
1
+ import{N as m,k as a}from"../assets/no-shadow-element-CXVMZH9n.js";import{n as d}from"../assets/property-BXpY_hgs.js";import{r as _}from"../assets/state-BjFDUoQX.js";import{e as u}from"../assets/query-BApjzB0v.js";import{a as h}from"../assets/mealz-sdk-CnvUgy3V.js";class f{get extId(){return this.attributes["ext-id"]}}var g=Object.defineProperty,b=Object.getOwnPropertyDescriptor,n=(c,t,e,s)=>{for(var i=s>1?void 0:s?b(t,e):t,o=c.length-1,l;o>=0;o--)(l=c[o])&&(i=(s?l(t,e,i):l(i))||i);return s&&i&&g(t,e,i),i};class r extends m{constructor(){var t,e,s,i,o,l;super(),this.selectedRadius=50,this.getByAddress=(e=(t=h)==null?void 0:t.pos)==null?void 0:e.getByAddress,this.getByCoordinates=(i=(s=h)==null?void 0:s.pos)==null?void 0:i.getByCoordinates,this.getAffiliateSuppliers=(l=(o=h)==null?void 0:o.supplier)==null?void 0:l.getAffiliateSuppliers,this._show=!1,this._posList=[],this._suppliers=[],this._markers=[],this._searchingPos=!1,this._searchSubmitted=!1,this._prevAddress="",this._selectedSuppliers=[],this._showPosList=!1,this._posSelected=!1,this.subscriptions=[],this.styleURL=new URL("./store-locator/store-locator.css",this.getBaseURL())}get show(){return this._show}set show(t){this._show=t,this._show&&(this._posSelected=!1,this.initialSearch(),this._map&&this.ensureMapSize())}set geolocationCoordinates(t){var e,s;this._geolocationCoordinates=t,typeof((e=t==null?void 0:t.coords)==null?void 0:e.latitude)=="number"&&typeof((s=t==null?void 0:t.coords)==null?void 0:s.longitude)=="number"&&this.setGeolocation()}get geolocationCoordinates(){return this._geolocationCoordinates}getMapContainer(){var e;const t=this._mapElement??((e=this.querySelector)==null?void 0:e.call(this,"#mealz-store-locator__map"));return t instanceof HTMLElement?t:null}_nameOfStore(t){return`${t.supplier.attributes.name} - ${t.attributes.name}`}connectedCallback(){super.connectedCallback(),this.initLeaflet(),this.initEvents(),this.initResizeObserver()}disconnectedCallback(){var t,e,s;this.subscriptions.forEach(i=>i.unsubscribe()),this._resizeObserver&&this._resizeObserver.disconnect(),super.disconnectedCallback(),this._map&&(this._map.off(),this._map.remove(),this._map=void 0),(t=this._leafletCss)==null||t.remove(),(e=this._miamDs)==null||e.remove(),(s=this._leafletJs)==null||s.remove()}firstUpdated(){this._posSelected=!1,this.loadMap(),this.geolocationTimeout(),this.listenFormSubmit(),this._map&&this.ensureMapSize()}render(){return this.show?this.posSelectionTemplate():a``}posSelectionTemplate(){return a`
2
2
  <div class="mealz-store-locator mealz-ds-body">
3
3
  <div class="mealz-store-locator__pos-selection">
4
4
  <button
@@ -1,4 +1,4 @@
1
- import{N as a,k as i}from"../assets/no-shadow-element-CXVMZH9n.js";import{w as n}from"../assets/mealz-sdk-CnvUgy3V.js";import{f as o}from"../assets/filter-aZV_N5pj.js";import"../assets/OperatorSubscriber-CvNNPrIM.js";class p extends a{constructor(){super(),this.onboardingSteps=[{title:"Choisissez une recette",image:"https://storage.googleapis.com/assets.miam.tech/generic/images/9.1/onboardingRecipe.png"},{title:"Sélectionnez votre magasin",image:"https://storage.googleapis.com/assets.miam.tech/generic/images/9.1/onboardingDrive.png"},{title:"Commandez vos ingrédients",image:"https://storage.googleapis.com/assets.miam.tech/generic/images/9.1/onboardingIngredients.png"}],this.subscriptions=[],this.supplierList=[],this.analyticsPath="/supplier-selector",this.styleURL=new URL("/supplier-selector.css",import.meta.url)}connectedCallback(){super.connectedCallback(),n().then(()=>this.loadAvailableSuppliers()).catch(e=>{console.warn("[MealzSupplierSelector] MealzInternal SDK not available, suppliers will not be loaded.",e)}),this.listenToDrawerViewSwapper(),this.listenToCloseEvent()}disconnectedCallback(){super.disconnectedCallback(),this.subscriptions.forEach(e=>e.unsubscribe())}loadAvailableSuppliers(){var r;const e=window.mealz,s=(r=e==null?void 0:e.supplier)==null?void 0:r.getAffiliateSuppliers;if(!s){console.warn("[MealzSupplierSelector] mealz.supplier.getAffiliateSuppliers is not available.");return}const t=s();if(!t||typeof t.subscribe!="function"){console.warn("[MealzSupplierSelector] getAffiliateSuppliers did not return a subscribable observable.");return}this.subscriptions.push(t.subscribe(l=>{this.supplierList=l,this.requestUpdate()}))}selectSupplier(e){localStorage.setItem("_miam/selectedSupplierId",e.id),this.sendSelectSupplierEvent(e);const s=this.closest("mealz-drawer-view-swapper"),t=document.querySelector("mealz-store-locator");s&&(s.displayStoreLocator$.next(!0),window.mealzInternal.noSupplier.displaySupplierSelector$.next(!1),t&&(t.show=!0))}listenToDrawerViewSwapper(){const e=document.querySelector("mealz-drawer-view-swapper");e&&this.subscriptions.push(e.displaySupplierSelector$.pipe(o(s=>s)).subscribe(()=>this.pageview()))}listenToCloseEvent(){const e=document.querySelector("mealz-drawer");e&&e.addEventListener("drawerClosed",()=>{this.sendCloseEvent()})}render(){return i`
1
+ import{N as a,k as i}from"../assets/no-shadow-element-CXVMZH9n.js";import{w as n}from"../assets/mealz-sdk-CnvUgy3V.js";import{f as o}from"../assets/filter-aZV_N5pj.js";import"../assets/OperatorSubscriber-CvNNPrIM.js";class p extends a{constructor(){super(),this.onboardingSteps=[{title:"Choisissez une recette",image:"https://storage.googleapis.com/assets.miam.tech/generic/images/9.1/onboardingRecipe.png"},{title:"Sélectionnez votre magasin",image:"https://storage.googleapis.com/assets.miam.tech/generic/images/9.1/onboardingDrive.png"},{title:"Commandez vos ingrédients",image:"https://storage.googleapis.com/assets.miam.tech/generic/images/9.1/onboardingIngredients.png"}],this.subscriptions=[],this.supplierList=[],this.analyticsPath="/supplier-selector",this.styleURL=new URL("./supplier-selector/supplier-selector.css",this.getBaseURL())}connectedCallback(){super.connectedCallback(),n().then(()=>this.loadAvailableSuppliers()).catch(e=>{console.warn("[MealzSupplierSelector] MealzInternal SDK not available, suppliers will not be loaded.",e)}),this.listenToDrawerViewSwapper(),this.listenToCloseEvent()}disconnectedCallback(){super.disconnectedCallback(),this.subscriptions.forEach(e=>e.unsubscribe())}loadAvailableSuppliers(){var l;const e=window.mealz,s=(l=e==null?void 0:e.supplier)==null?void 0:l.getAffiliateSuppliers;if(!s){console.warn("[MealzSupplierSelector] mealz.supplier.getAffiliateSuppliers is not available.");return}const t=s();if(!t||typeof t.subscribe!="function"){console.warn("[MealzSupplierSelector] getAffiliateSuppliers did not return a subscribable observable.");return}this.subscriptions.push(t.subscribe(r=>{this.supplierList=r,this.requestUpdate()}))}selectSupplier(e){localStorage.setItem("_miam/selectedSupplierId",e.id),this.sendSelectSupplierEvent(e);const s=this.closest("mealz-drawer-view-swapper"),t=document.querySelector("mealz-store-locator");s&&(s.displayStoreLocator$.next(!0),window.mealzInternal.noSupplier.displaySupplierSelector$.next(!1),t&&(t.show=!0))}listenToDrawerViewSwapper(){const e=document.querySelector("mealz-drawer-view-swapper");e&&this.subscriptions.push(e.displaySupplierSelector$.pipe(o(s=>s)).subscribe(()=>this.pageview()))}listenToCloseEvent(){const e=document.querySelector("mealz-drawer");e&&e.addEventListener("drawerClosed",()=>{this.sendCloseEvent()})}render(){return i`
2
2
  <div class="mealz-supplier-selector">
3
3
  ${this.renderOnboarding()}
4
4
  ${this.renderSuppliers()}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "mealz-components",
3
3
  "type": "module",
4
- "version": "2.8.1",
4
+ "version": "2.8.2",
5
5
  "main": "./dist/mealz-components.js",
6
6
  "module": "./dist/mealz-components.js",
7
7
  "scripts": {
@@ -1,290 +0,0 @@
1
- .mealz-store-locator {
2
- height: 100%;
3
- display: flex;
4
-
5
- .mealz-store-locator__pos-selection {
6
- display: flex;
7
- width: 320px;
8
- padding: 40px var(--spacing-padding-16-px, 16px);
9
- flex-direction: column;
10
- align-items: stretch;
11
- gap: var(--spacing-padding-16-px, 16px);
12
- flex-shrink: 0;
13
- background: var(--mealz-ds-color-neutral-white, #ffffff);
14
- box-shadow: 2px 0px 16px 0px rgba(0, 0, 0, 0.15);
15
- z-index: 1;
16
-
17
- .mealz-store-locator__title {
18
- color: var(--mealz-ds-color-neutral-black, #0f191f);
19
- font-size: 28px;
20
- font-weight: 700;
21
- line-height: 120%;
22
- }
23
-
24
- .mealz-store-locator__go-back-button {
25
- border-radius: 100%;
26
- height: 40px;
27
- width: 40px;
28
- display: flex;
29
- justify-content: center;
30
- align-items: center;
31
-
32
- img {
33
- width: 15px;
34
- height: 15px;
35
- }
36
- }
37
-
38
- #mealz-store-locator__store-locator-form {
39
- display: flex;
40
- flex-direction: column;
41
- gap: 8px;
42
-
43
- .mealz-store-locator__address-input-container {
44
- display: flex;
45
- gap: 8px;
46
- height: 40px;
47
- position: relative;
48
-
49
- .mealz-store-locator__locate-button {
50
- position: absolute;
51
- background: unset;
52
- border: unset;
53
- padding: 0;
54
- top: 8px;
55
- left: 8px;
56
- width: 24px;
57
- height: 24px;
58
-
59
- .mealz-store-locator__geolocation-icon {
60
- cursor: pointer;
61
- width: 24px;
62
- height: 24px;
63
- }
64
- }
65
-
66
- .mealz-store-locator__locate-button
67
- + .mealz-store-locator__address-input {
68
- padding-left: 40px;
69
- }
70
-
71
- .mealz-store-locator__address-input {
72
- padding-left: 8px;
73
- flex: 1;
74
- border: 1px solid var(--mealz-ds-color-neutral-200, #D9DDE1);
75
- border-radius: 4px;
76
- font-size: 14px;
77
- }
78
- }
79
-
80
- .mealz-store-locator__select-supplier {
81
- display: flex;
82
-
83
- .mealz-store-locator__select-supplier-select {
84
- flex: 1;
85
- padding: 10px;
86
- max-width: initial;
87
- }
88
- }
89
- }
90
-
91
- .mealz-store-locator__pos-loader {
92
- flex: 1;
93
- width: 100%;
94
- display: flex;
95
- justify-content: center;
96
- align-items: center;
97
- }
98
-
99
- .mealz-store-locator__pos-loader .mealz-ds-loader {
100
- margin: 16px;
101
- display: flex;
102
- width: 72px;
103
- height: 72px;
104
- background-position-x: 36px;
105
- background-size: 36px 36px;
106
- }
107
-
108
- #mealz-store-locator__pos-list {
109
- flex-direction: column;
110
- align-items: flex-start;
111
- gap: var(--spacing-padding-12-px, 12px);
112
- align-self: stretch;
113
- overflow: auto;
114
- }
115
-
116
- .mealz-store-locator__pos-list__visible,
117
- .mealz-store-locator__pos-list__hidden {
118
- display: flex;
119
- }
120
-
121
- .mealz-store-locator__no-pos-found {
122
- margin-bottom: 16px;
123
- width: 100%;
124
- flex: 1;
125
- display: flex;
126
- justify-content: center;
127
- align-items: center;
128
- flex-direction: column;
129
- }
130
- }
131
-
132
- #mealz-store-locator__view-swapper-button {
133
- display: none;
134
- }
135
-
136
- .mealz-store-locator__pos-item {
137
- display: flex;
138
- flex-direction: column;
139
- padding: 8px;
140
- align-items: flex-start;
141
- gap: 16px;
142
- align-self: stretch;
143
- border-radius: 8px;
144
- border: 1px solid var(--mealz-ds-color-neutral-200, #eff1f3);
145
-
146
- .mealz-store-locator__pos-data {
147
- display: flex;
148
- align-items: flex-start;
149
- gap: 8px;
150
- align-self: stretch;
151
-
152
- .mealz-store-locator__pos-picture {
153
- width: 40px;
154
- height: 40px;
155
- flex-shrink: 0;
156
- }
157
-
158
- .mealz-store-locator__pos-name {
159
- color: var(--mealz-ds-color-neutral-black, #0f191f);
160
- font-size: 14px;
161
- font-weight: 700;
162
- line-height: 150%;
163
- }
164
-
165
- .mealz-store-locator__pos-address {
166
- color: var(--mealz-ds-color-neutral-500, #8c96a2);
167
- font-size: 12px;
168
- font-weight: 600;
169
- line-height: 150%;
170
- }
171
- }
172
-
173
- .mealz-store-locator__pos-cta {
174
- display: flex;
175
- justify-content: flex-end;
176
- width: 100%;
177
-
178
- .mealz-select-pos-button {
179
- border-radius: 1000px;
180
- }
181
- }
182
- }
183
-
184
- #mealz-store-locator__map {
185
- z-index: 0;
186
- flex: 1 1 0;
187
- min-height: 400px;
188
- width: 100%;
189
-
190
- .mealz-store-locator__pos-item {
191
- border: none;
192
- padding: 0;
193
- }
194
-
195
- .leaflet-marker-pane .mealz-marker-icon {
196
- border-radius: 50%;
197
- overflow: hidden;
198
- object-fit: cover;
199
- border: 4px solid var(--mealz-ds-color-neutral-white, #FFFFFF);
200
- box-sizing: content-box;
201
- }
202
- }
203
- }
204
-
205
- @media (max-width: 768px) {
206
- .mealz-store-locator {
207
- position: absolute;
208
- flex-direction: column;
209
- inset: 0;
210
-
211
- .mealz-store-locator__pos-selection {
212
- width: 100%;
213
- padding: 0;
214
- gap: 0;
215
-
216
- .mealz-store-locator__go-back-button {
217
- position: absolute;
218
- z-index: 1;
219
- top: 12px;
220
- left: 8px;
221
- width: 32px;
222
- height: 32px;
223
- }
224
-
225
- .mealz-store-locator__title {
226
- position: relative;
227
- min-height: 56px;
228
- font-size: 16px;
229
- display: flex;
230
- align-items: center;
231
- justify-content: center;
232
- border-bottom: solid 1px var(--mealz-ds-color-neutral-200, #eff1f3);
233
- }
234
-
235
- #mealz-store-locator__store-locator-form {
236
- padding: 24px 16px;
237
-
238
- .mealz-store-locator__address-input-container {
239
- .mealz-store-locator__address-input {
240
- width: calc(100% - 44px);
241
- }
242
-
243
- .mealz-store-locator__search-address-button {
244
- width: 36px;
245
- }
246
- }
247
- }
248
-
249
- #mealz-store-locator__pos-list {
250
- padding: 0 16px 12px;
251
- align-items: center;
252
-
253
- &.mealz-store-locator__pos-list__visible {
254
- display: flex;
255
- }
256
-
257
- &.mealz-store-locator__pos-list__hidden {
258
- display: none;
259
- }
260
- }
261
-
262
- .mealz-store-locator__pos-loader {
263
- position: absolute;
264
- height: 100%;
265
- }
266
-
267
- &.mealz-store-locator__pos-selection__height {
268
- height: 100%;
269
- }
270
- }
271
-
272
- #mealz-store-locator__view-swapper-button {
273
- width: 100%;
274
- display: flex;
275
- justify-content: center;
276
- padding: 12px 0;
277
-
278
- &.mealz-store-locator__see-list-button {
279
- z-index: 1;
280
- bottom: 40px;
281
- position: absolute;
282
- }
283
-
284
- &.mealz-store-locator__see-map-button {
285
- box-shadow: -2px 0 18px 0 rgba(0, 0, 0, 0.15);
286
- margin-top: auto;
287
- }
288
- }
289
- }
290
- }
@@ -1,99 +0,0 @@
1
- .mealz-supplier-selector {
2
- .mealz-supplier-selector__onboarding-container {
3
- padding: 24px;
4
- background-color: var(--mealz-ds-color-primary-100, #e4eaec);
5
-
6
- .mealz-supplier-selector__onboarding-title {
7
- margin: 0 0 8px 0;
8
- }
9
-
10
- .mealz-supplier-selector__onboarding-steps {
11
- overflow-y: scroll;
12
- margin-top: 16px;
13
- display: flex;
14
-
15
- > *:not(:last-child) {
16
- margin-right: 16px;
17
- }
18
-
19
- .mealz-supplier-selector__card {
20
- background-color: var(--mealz-ds-color-neutral-white, #fff);
21
- display: flex;
22
- align-items: center;
23
- padding: 16px;
24
- border-radius: 12px;
25
-
26
- .mealz-supplier-selector__instructions {
27
- flex: 1 1 0;
28
- margin-right: 24px;
29
-
30
- .mealz-supplier-selector__step-counter {
31
- display: flex;
32
- justify-content: center;
33
- align-items: center;
34
- margin-bottom: 8px;
35
- height: 32px;
36
- width: 32px;
37
- border-radius: 50%;
38
- background-color: var(--mealz-ds-color-primary, #24748F);
39
- color: var(--mealz-ds-color-neutral-white, #fff);
40
- }
41
- }
42
-
43
- .mealz-supplier-selector__onboarding-step-image {
44
- flex: 1 1 0;
45
- }
46
- }
47
- }
48
- }
49
-
50
- .mealz-supplier-selector__suppliers-container {
51
- padding: 24px;
52
-
53
- .mealz-supplier-selector__supplier-list {
54
- display: grid;
55
- grid-template-columns: repeat(3, minmax(150px, 1fr));
56
- margin: 0 -6px -6px -6px;
57
-
58
- .mealz-supplier-selector__supplier-button-card {
59
- border-radius: 8px;
60
- background: none;
61
- border: none;
62
- padding: 0;
63
- margin: 6px;
64
- cursor: pointer;
65
- position: relative;
66
- overflow: hidden;
67
-
68
- .mealz-supplier-selector__supplier-logo {
69
- display: block;
70
- position: absolute;
71
- top: 50%;
72
- left: 50%;
73
- transform: translate(-50%, -50%);
74
- max-width: 65%;
75
- max-height: 100%;
76
- width: auto;
77
- height: auto;
78
- object-fit: contain;
79
- }
80
-
81
- .mealz-supplier-selector__supplier-bg {
82
- display: block;
83
- }
84
- }
85
- }
86
-
87
- @media (max-width: 575px) {
88
- .mealz-supplier-selector__supplier-list {
89
- grid-template-columns: repeat(2, minmax(150px, 1fr));
90
- }
91
- }
92
-
93
- @media (max-width: 375px) {
94
- .mealz-supplier-selector__supplier-list {
95
- grid-template-columns: repeat(1, minmax(150px, 1fr));
96
- }
97
- }
98
- }
99
- }