@eric-emg/symphiq-components 1.2.0 → 1.2.1

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/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sources":["../../projects/symphiq-components/src/lib/services/funnel-order.service.ts","../../projects/symphiq-components/src/lib/services/modal.service.ts","../../projects/symphiq-components/src/lib/components/symphiq-funnel-analysis-dashboard.component.ts","../../projects/symphiq-components/src/lib/components/modal.component.ts","../../projects/symphiq-components/src/lib/components/metric-card.component.ts","../../projects/symphiq-components/src/lib/components/insight-card.component.ts","../../projects/symphiq-components/src/lib/components/breakdown-section.component.ts","../../projects/symphiq-components/src/lib/components/overall-assessment.component.ts","../../projects/symphiq-components/src/lib/data/funnel-data.ts"],"sourcesContent":[null,null,null,null,null,null,null,null,null],"names":[],"mappings":";;;;;;;;;;;;AAQC;AAED;AAIE;AA4BA;AASA;AAIA;AAKA;AAIA;AAKA;;;;AA6BD;;;AC7FC;AACA;AACD;AAED;;AAKS;;;;;;AAaR;;ACfD;AAgIc;AAzBZ;;;;;;AAWA;;;;AAUE;AACF;AACA;AAEoB;AAEpB;AAIA;;;;AAoB4E;;AAyB5E;AAIA;;;AAOD;;ACrMD;AA8Jc;AANZ;AACA;AACA;AACA;AACA;AAEoB;;;;AAkCpB;AAIA;AAmBA;AAUA;AAgBA;AAIA;AAQA;;;AAWD;;ACvQD;AAmFI;AACA;;;AAJF;AAGU;;AAQV;AAQA;;AAWA;AAIA;AAgBA;AAQA;AAOA;AAcA;AAIA;AAOA;;;AASD;;ACpLD;AAyDc;;;AAAQ;AAEpB;;AAWA;;;AAcD;;ACrFD;;;;;AAKC;AAED;;AA2EE;;;;AA+BA;AAOA;AAKA;AAaA;AAIA;AAcA;;;AAGD;;AChKD;;;AA4HE;AAIA;AAIA;AAeA;AAeA;AAIA;;;AAgBD;;ACvLD;;;"}
1
+ {"version":3,"file":"index.d.ts","sources":["../../projects/symphiq-components/src/lib/services/funnel-order.service.ts","../../projects/symphiq-components/src/lib/services/modal.service.ts","../../projects/symphiq-components/src/lib/components/symphiq-funnel-analysis-dashboard.component.ts","../../projects/symphiq-components/src/lib/components/modal.component.ts","../../projects/symphiq-components/src/lib/components/metric-card.component.ts","../../projects/symphiq-components/src/lib/components/insight-card.component.ts","../../projects/symphiq-components/src/lib/components/breakdown-section.component.ts","../../projects/symphiq-components/src/lib/components/overall-assessment.component.ts","../../projects/symphiq-components/src/lib/data/funnel-data.ts"],"sourcesContent":[null,null,null,null,null,null,null,null,null],"names":[],"mappings":";;;;;;;;;;;;AAQC;AAED;AAIE;AA4BA;AASA;AAIA;AAKA;AAIA;AAKA;;;;AA6BD;;;AC7FC;AACA;AACD;AAED;;AAKS;;;;;;AAaR;;AChBD;AA6Ic;AAzBZ;;;;;;AAWA;;;;AAUE;AACF;AACA;AAEoB;AAEpB;AAIA;;;;AAoB4E;;AAyB5E;AAIA;;;AAOD;;AClND;AA2Kc;AANZ;AACA;AACA;AACA;AACA;AAEoB;;;;AAkCpB;AAIA;AAmBA;AAUA;AAgBA;AAIA;AAQA;;;AAWD;;ACpRD;AA4FI;AACA;;;AAJF;AAGU;;AAQV;AAQA;;AAWA;AAIA;AAgBA;AAQA;AAOA;AAcA;AAIA;AAOA;;;AASD;;AC7LD;AA8Dc;;;AAAQ;AAEpB;;AAWA;;;AAcD;;AC1FD;;;;;AAKC;AAED;;AAiFE;;;;AA+BA;AAOA;AAKA;AAaA;AAIA;AAcA;;;AAGD;;ACrKD;;;AA4HE;AAIA;AAIA;AAeA;AAeA;AAIA;;;AAgBD;;ACvLD;;;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@eric-emg/symphiq-components",
3
- "version": "1.2.0",
3
+ "version": "1.2.1",
4
4
  "description": "A comprehensive Angular library for component dashboards with performance visualization and metrics analysis",
5
5
  "author": "Your Organization",
6
6
  "license": "MIT",
package/styles.css CHANGED
@@ -221,6 +221,9 @@
221
221
  .fixed {
222
222
  position: fixed;
223
223
  }
224
+ .relative {
225
+ position: relative;
226
+ }
224
227
  .sticky {
225
228
  position: sticky;
226
229
  }
@@ -230,6 +233,9 @@
230
233
  .top-0 {
231
234
  top: calc(var(--spacing) * 0);
232
235
  }
236
+ .z-40 {
237
+ z-index: 40;
238
+ }
233
239
  .z-50 {
234
240
  z-index: 50;
235
241
  }
@@ -254,8 +260,8 @@
254
260
  .mt-6 {
255
261
  margin-top: calc(var(--spacing) * 6);
256
262
  }
257
- .mt-12 {
258
- margin-top: calc(var(--spacing) * 12);
263
+ .mt-8 {
264
+ margin-top: calc(var(--spacing) * 8);
259
265
  }
260
266
  .mb-1 {
261
267
  margin-bottom: calc(var(--spacing) * 1);
@@ -305,18 +311,12 @@
305
311
  .h-6 {
306
312
  height: calc(var(--spacing) * 6);
307
313
  }
308
- .h-7 {
309
- height: calc(var(--spacing) * 7);
310
- }
311
314
  .h-8 {
312
315
  height: calc(var(--spacing) * 8);
313
316
  }
314
317
  .h-10 {
315
318
  height: calc(var(--spacing) * 10);
316
319
  }
317
- .h-12 {
318
- height: calc(var(--spacing) * 12);
319
- }
320
320
  .h-full {
321
321
  height: 100%;
322
322
  }
@@ -335,18 +335,12 @@
335
335
  .w-6 {
336
336
  width: calc(var(--spacing) * 6);
337
337
  }
338
- .w-7 {
339
- width: calc(var(--spacing) * 7);
340
- }
341
338
  .w-8 {
342
339
  width: calc(var(--spacing) * 8);
343
340
  }
344
341
  .w-10 {
345
342
  width: calc(var(--spacing) * 10);
346
343
  }
347
- .w-12 {
348
- width: calc(var(--spacing) * 12);
349
- }
350
344
  .w-full {
351
345
  width: 100%;
352
346
  }
@@ -356,6 +350,9 @@
356
350
  .max-w-7xl {
357
351
  max-width: var(--container-7xl);
358
352
  }
353
+ .min-w-0 {
354
+ min-width: calc(var(--spacing) * 0);
355
+ }
359
356
  .flex-1 {
360
357
  flex: 1;
361
358
  }
@@ -416,9 +413,6 @@
416
413
  .gap-4 {
417
414
  gap: calc(var(--spacing) * 4);
418
415
  }
419
- .gap-6 {
420
- gap: calc(var(--spacing) * 6);
421
- }
422
416
  .space-y-2 {
423
417
  :where(& > :not(:last-child)) {
424
418
  --tw-space-y-reverse: 0;
@@ -454,6 +448,11 @@
454
448
  margin-block-end: calc(calc(var(--spacing) * 8) * calc(1 - var(--tw-space-y-reverse)));
455
449
  }
456
450
  }
451
+ .truncate {
452
+ overflow: hidden;
453
+ text-overflow: ellipsis;
454
+ white-space: nowrap;
455
+ }
457
456
  .overflow-hidden {
458
457
  overflow: hidden;
459
458
  }
@@ -680,6 +679,9 @@
680
679
  background-color: color-mix(in oklab, var(--color-slate-950) 80%, transparent);
681
680
  }
682
681
  }
682
+ .bg-transparent {
683
+ background-color: transparent;
684
+ }
683
685
  .bg-gradient-to-br {
684
686
  --tw-gradient-position: to bottom right in oklab;
685
687
  background-image: linear-gradient(var(--tw-gradient-stops));
@@ -718,15 +720,6 @@
718
720
  --tw-gradient-from: var(--color-slate-800);
719
721
  --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
720
722
  }
721
- .from-slate-950 {
722
- --tw-gradient-from: var(--color-slate-950);
723
- --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
724
- }
725
- .via-slate-900 {
726
- --tw-gradient-via: var(--color-slate-900);
727
- --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
728
- --tw-gradient-stops: var(--tw-gradient-via-stops);
729
- }
730
723
  .to-amber-400 {
731
724
  --tw-gradient-to: var(--color-amber-400);
732
725
  --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
@@ -754,10 +747,6 @@
754
747
  --tw-gradient-to: var(--color-slate-900);
755
748
  --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
756
749
  }
757
- .to-slate-950 {
758
- --tw-gradient-to: var(--color-slate-950);
759
- --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
760
- }
761
750
  .p-1 {
762
751
  padding: calc(var(--spacing) * 1);
763
752
  }
@@ -770,9 +759,6 @@
770
759
  .p-6 {
771
760
  padding: calc(var(--spacing) * 6);
772
761
  }
773
- .p-8 {
774
- padding: calc(var(--spacing) * 8);
775
- }
776
762
  .px-2 {
777
763
  padding-inline: calc(var(--spacing) * 2);
778
764
  }
@@ -809,9 +795,6 @@
809
795
  .py-6 {
810
796
  padding-block: calc(var(--spacing) * 6);
811
797
  }
812
- .py-8 {
813
- padding-block: calc(var(--spacing) * 8);
814
- }
815
798
  .pt-0 {
816
799
  padding-top: calc(var(--spacing) * 0);
817
800
  }
@@ -1107,6 +1090,21 @@
1107
1090
  margin-block: calc(var(--spacing) * 8);
1108
1091
  }
1109
1092
  }
1093
+ .sm\:mt-8 {
1094
+ @media (width >= 40rem) {
1095
+ margin-top: calc(var(--spacing) * 8);
1096
+ }
1097
+ }
1098
+ .sm\:mt-12 {
1099
+ @media (width >= 40rem) {
1100
+ margin-top: calc(var(--spacing) * 12);
1101
+ }
1102
+ }
1103
+ .sm\:mb-6 {
1104
+ @media (width >= 40rem) {
1105
+ margin-bottom: calc(var(--spacing) * 6);
1106
+ }
1107
+ }
1110
1108
  .sm\:block {
1111
1109
  @media (width >= 40rem) {
1112
1110
  display: block;
@@ -1122,11 +1120,66 @@
1122
1120
  display: inline-block;
1123
1121
  }
1124
1122
  }
1123
+ .sm\:h-5 {
1124
+ @media (width >= 40rem) {
1125
+ height: calc(var(--spacing) * 5);
1126
+ }
1127
+ }
1128
+ .sm\:h-6 {
1129
+ @media (width >= 40rem) {
1130
+ height: calc(var(--spacing) * 6);
1131
+ }
1132
+ }
1133
+ .sm\:h-7 {
1134
+ @media (width >= 40rem) {
1135
+ height: calc(var(--spacing) * 7);
1136
+ }
1137
+ }
1138
+ .sm\:h-10 {
1139
+ @media (width >= 40rem) {
1140
+ height: calc(var(--spacing) * 10);
1141
+ }
1142
+ }
1143
+ .sm\:h-12 {
1144
+ @media (width >= 40rem) {
1145
+ height: calc(var(--spacing) * 12);
1146
+ }
1147
+ }
1125
1148
  .sm\:h-screen {
1126
1149
  @media (width >= 40rem) {
1127
1150
  height: 100vh;
1128
1151
  }
1129
1152
  }
1153
+ .sm\:w-5 {
1154
+ @media (width >= 40rem) {
1155
+ width: calc(var(--spacing) * 5);
1156
+ }
1157
+ }
1158
+ .sm\:w-6 {
1159
+ @media (width >= 40rem) {
1160
+ width: calc(var(--spacing) * 6);
1161
+ }
1162
+ }
1163
+ .sm\:w-7 {
1164
+ @media (width >= 40rem) {
1165
+ width: calc(var(--spacing) * 7);
1166
+ }
1167
+ }
1168
+ .sm\:w-10 {
1169
+ @media (width >= 40rem) {
1170
+ width: calc(var(--spacing) * 10);
1171
+ }
1172
+ }
1173
+ .sm\:w-12 {
1174
+ @media (width >= 40rem) {
1175
+ width: calc(var(--spacing) * 12);
1176
+ }
1177
+ }
1178
+ .sm\:w-auto {
1179
+ @media (width >= 40rem) {
1180
+ width: auto;
1181
+ }
1182
+ }
1130
1183
  .sm\:w-full {
1131
1184
  @media (width >= 40rem) {
1132
1185
  width: 100%;
@@ -1137,21 +1190,175 @@
1137
1190
  max-width: var(--container-3xl);
1138
1191
  }
1139
1192
  }
1193
+ .sm\:flex-initial {
1194
+ @media (width >= 40rem) {
1195
+ flex: 0 auto;
1196
+ }
1197
+ }
1198
+ .sm\:flex-row {
1199
+ @media (width >= 40rem) {
1200
+ flex-direction: row;
1201
+ }
1202
+ }
1203
+ .sm\:items-center {
1204
+ @media (width >= 40rem) {
1205
+ align-items: center;
1206
+ }
1207
+ }
1208
+ .sm\:gap-0 {
1209
+ @media (width >= 40rem) {
1210
+ gap: calc(var(--spacing) * 0);
1211
+ }
1212
+ }
1213
+ .sm\:gap-3 {
1214
+ @media (width >= 40rem) {
1215
+ gap: calc(var(--spacing) * 3);
1216
+ }
1217
+ }
1218
+ .sm\:gap-4 {
1219
+ @media (width >= 40rem) {
1220
+ gap: calc(var(--spacing) * 4);
1221
+ }
1222
+ }
1223
+ .sm\:gap-6 {
1224
+ @media (width >= 40rem) {
1225
+ gap: calc(var(--spacing) * 6);
1226
+ }
1227
+ }
1228
+ .sm\:space-y-6 {
1229
+ @media (width >= 40rem) {
1230
+ :where(& > :not(:last-child)) {
1231
+ --tw-space-y-reverse: 0;
1232
+ margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));
1233
+ margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));
1234
+ }
1235
+ }
1236
+ }
1237
+ .sm\:space-y-8 {
1238
+ @media (width >= 40rem) {
1239
+ :where(& > :not(:last-child)) {
1240
+ --tw-space-y-reverse: 0;
1241
+ margin-block-start: calc(calc(var(--spacing) * 8) * var(--tw-space-y-reverse));
1242
+ margin-block-end: calc(calc(var(--spacing) * 8) * calc(1 - var(--tw-space-y-reverse)));
1243
+ }
1244
+ }
1245
+ }
1140
1246
  .sm\:p-0 {
1141
1247
  @media (width >= 40rem) {
1142
1248
  padding: calc(var(--spacing) * 0);
1143
1249
  }
1144
1250
  }
1251
+ .sm\:p-6 {
1252
+ @media (width >= 40rem) {
1253
+ padding: calc(var(--spacing) * 6);
1254
+ }
1255
+ }
1256
+ .sm\:px-4 {
1257
+ @media (width >= 40rem) {
1258
+ padding-inline: calc(var(--spacing) * 4);
1259
+ }
1260
+ }
1261
+ .sm\:px-6 {
1262
+ @media (width >= 40rem) {
1263
+ padding-inline: calc(var(--spacing) * 6);
1264
+ }
1265
+ }
1266
+ .sm\:py-2 {
1267
+ @media (width >= 40rem) {
1268
+ padding-block: calc(var(--spacing) * 2);
1269
+ }
1270
+ }
1271
+ .sm\:py-6 {
1272
+ @media (width >= 40rem) {
1273
+ padding-block: calc(var(--spacing) * 6);
1274
+ }
1275
+ }
1276
+ .sm\:py-8 {
1277
+ @media (width >= 40rem) {
1278
+ padding-block: calc(var(--spacing) * 8);
1279
+ }
1280
+ }
1281
+ .sm\:text-right {
1282
+ @media (width >= 40rem) {
1283
+ text-align: right;
1284
+ }
1285
+ }
1145
1286
  .sm\:align-middle {
1146
1287
  @media (width >= 40rem) {
1147
1288
  vertical-align: middle;
1148
1289
  }
1149
1290
  }
1291
+ .sm\:text-2xl {
1292
+ @media (width >= 40rem) {
1293
+ font-size: var(--text-2xl);
1294
+ line-height: var(--tw-leading, var(--text-2xl--line-height));
1295
+ }
1296
+ }
1297
+ .sm\:text-3xl {
1298
+ @media (width >= 40rem) {
1299
+ font-size: var(--text-3xl);
1300
+ line-height: var(--tw-leading, var(--text-3xl--line-height));
1301
+ }
1302
+ }
1303
+ .sm\:text-4xl {
1304
+ @media (width >= 40rem) {
1305
+ font-size: var(--text-4xl);
1306
+ line-height: var(--tw-leading, var(--text-4xl--line-height));
1307
+ }
1308
+ }
1309
+ .sm\:text-base {
1310
+ @media (width >= 40rem) {
1311
+ font-size: var(--text-base);
1312
+ line-height: var(--tw-leading, var(--text-base--line-height));
1313
+ }
1314
+ }
1315
+ .sm\:text-lg {
1316
+ @media (width >= 40rem) {
1317
+ font-size: var(--text-lg);
1318
+ line-height: var(--tw-leading, var(--text-lg--line-height));
1319
+ }
1320
+ }
1321
+ .sm\:text-sm {
1322
+ @media (width >= 40rem) {
1323
+ font-size: var(--text-sm);
1324
+ line-height: var(--tw-leading, var(--text-sm--line-height));
1325
+ }
1326
+ }
1327
+ .md\:ml-4 {
1328
+ @media (width >= 48rem) {
1329
+ margin-left: calc(var(--spacing) * 4);
1330
+ }
1331
+ }
1332
+ .md\:w-auto {
1333
+ @media (width >= 48rem) {
1334
+ width: auto;
1335
+ }
1336
+ }
1150
1337
  .md\:grid-cols-2 {
1151
1338
  @media (width >= 48rem) {
1152
1339
  grid-template-columns: repeat(2, minmax(0, 1fr));
1153
1340
  }
1154
1341
  }
1342
+ .md\:flex-row {
1343
+ @media (width >= 48rem) {
1344
+ flex-direction: row;
1345
+ }
1346
+ }
1347
+ .md\:items-center {
1348
+ @media (width >= 48rem) {
1349
+ align-items: center;
1350
+ }
1351
+ }
1352
+ .md\:gap-0 {
1353
+ @media (width >= 48rem) {
1354
+ gap: calc(var(--spacing) * 0);
1355
+ }
1356
+ }
1357
+ .md\:text-right {
1358
+ @media (width >= 48rem) {
1359
+ text-align: right;
1360
+ }
1361
+ }
1155
1362
  .lg\:grid-cols-2 {
1156
1363
  @media (width >= 64rem) {
1157
1364
  grid-template-columns: repeat(2, minmax(0, 1fr));
@@ -1162,6 +1369,17 @@
1162
1369
  grid-template-columns: repeat(3, minmax(0, 1fr));
1163
1370
  }
1164
1371
  }
1372
+ .lg\:p-8 {
1373
+ @media (width >= 64rem) {
1374
+ padding: calc(var(--spacing) * 8);
1375
+ }
1376
+ }
1377
+ .lg\:text-4xl {
1378
+ @media (width >= 64rem) {
1379
+ font-size: var(--text-4xl);
1380
+ line-height: var(--tw-leading, var(--text-4xl--line-height));
1381
+ }
1382
+ }
1165
1383
  }
1166
1384
  @property --tw-rotate-x {
1167
1385
  syntax: "*";