proto-autos-wc 0.1.117 → 0.1.118

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.
@@ -4,7 +4,7 @@ const NAMESPACE = 'proto-autos-wc';
4
4
  const BUILD = /* proto-autos-wc */ { hydratedSelectorName: "hydrated", lazyLoad: true, prop: true, propChangeCallback: false, updatable: true};
5
5
 
6
6
  /*
7
- Stencil Client Platform v4.38.3 | MIT Licensed | https://stenciljs.com
7
+ Stencil Client Platform v4.39.0 | MIT Licensed | https://stenciljs.com
8
8
  */
9
9
  var __defProp = Object.defineProperty;
10
10
  var __export = (target, all) => {
@@ -380,6 +380,9 @@ var attachStyles = (hostRef) => {
380
380
  };
381
381
  var getScopeId = (cmp, mode) => "sc-" + (cmp.$tagName$);
382
382
  var h = (nodeName, vnodeData, ...children) => {
383
+ if (typeof nodeName === "string") {
384
+ nodeName = transformTag(nodeName);
385
+ }
383
386
  let child = null;
384
387
  let key = null;
385
388
  let simple = false;
@@ -1365,7 +1368,7 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
1365
1368
  {
1366
1369
  cmpMeta.$members$ = compactMeta[2];
1367
1370
  }
1368
- const tagName = cmpMeta.$tagName$;
1371
+ const tagName = transformTag(cmpMeta.$tagName$);
1369
1372
  const HostElement = class extends HTMLElement {
1370
1373
  // StencilLazyHost
1371
1374
  constructor(self) {
@@ -1466,6 +1469,9 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
1466
1469
 
1467
1470
  // src/runtime/nonce.ts
1468
1471
  var setNonce = (nonce) => plt.$nonce$ = nonce;
1472
+ function transformTag(tag) {
1473
+ return tag;
1474
+ }
1469
1475
 
1470
1476
  exports.bootstrapLazy = bootstrapLazy;
1471
1477
  exports.forceUpdate = forceUpdate;
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var index = require('./index-Bb_80AHS.js');
3
+ var index = require('./index-DblfkAfB.js');
4
4
  var appGlobals = require('./app-globals-V2Kpy_OQ.js');
5
5
 
6
6
  const defineCustomElements = async (win, options) => {
@@ -1,11 +1,11 @@
1
1
  'use strict';
2
2
 
3
- var index = require('./index-Bb_80AHS.js');
3
+ var index = require('./index-DblfkAfB.js');
4
4
  var appGlobals = require('./app-globals-V2Kpy_OQ.js');
5
5
 
6
6
  var _documentCurrentScript = typeof document !== 'undefined' ? document.currentScript : null;
7
7
  /*
8
- Stencil Client Patch Browser v4.38.3 | MIT Licensed | https://stenciljs.com
8
+ Stencil Client Patch Browser v4.39.0 | MIT Licensed | https://stenciljs.com
9
9
  */
10
10
 
11
11
  var patchBrowser = () => {
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var index = require('./index-Bb_80AHS.js');
3
+ var index = require('./index-DblfkAfB.js');
4
4
 
5
5
  const KEY = 'proto-autos';
6
6
  const DATA = 'data';
@@ -903,7 +903,386 @@ const ToolBar = _props => {
903
903
  : 'bg-clrs-yellow text-clrs-navy'), onClick: () => actions.updatePick(indx), title: `${dealer.name} (${dealer.vehicles.length})` }, indx + 1))))));
904
904
  };
905
905
 
906
- const shadowCss = "/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */\n@layer properties;\n@layer theme, base, components, utilities;\n@layer theme {\n :root,\n :host {\n --font-sans:\n ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji',\n 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';\n --color-yellow-300: oklch(90.5% 0.182 98.111);\n --color-yellow-600: oklch(68.1% 0.162 75.834);\n --color-green-200: oklch(92.5% 0.084 155.995);\n --color-green-600: oklch(62.7% 0.194 149.214);\n --color-blue-200: oklch(88.2% 0.059 254.128);\n --color-blue-400: oklch(70.7% 0.165 254.624);\n --color-gray-300: oklch(87.2% 0.01 258.338);\n --color-gray-600: oklch(44.6% 0.03 256.802);\n --color-white: #fff;\n --spacing: 0.25rem;\n --text-xs: 0.75rem;\n --text-xs--line-height: calc(1 / 0.75);\n --text-sm: 0.875rem;\n --text-sm--line-height: calc(1.25 / 0.875);\n --text-lg: 1.125rem;\n --text-lg--line-height: calc(1.75 / 1.125);\n --text-xl: 1.25rem;\n --text-xl--line-height: calc(1.75 / 1.25);\n --text-6xl: 3.75rem;\n --text-6xl--line-height: 1;\n --font-weight-thin: 100;\n --font-weight-bold: 700;\n --radius-md: 0.375rem;\n --radius-lg: 0.5rem;\n --animate-spin: spin 1s linear infinite;\n }\n}\n@layer utilities {\n .absolute {\n position: absolute;\n }\n .relative {\n position: relative;\n }\n .top-0 {\n top: calc(var(--spacing) * 0);\n }\n .right-0 {\n right: calc(var(--spacing) * 0);\n }\n .m-6 {\n margin: calc(var(--spacing) * 6);\n }\n .mt-2 {\n margin-top: calc(var(--spacing) * 2);\n }\n .mt-4 {\n margin-top: calc(var(--spacing) * 4);\n }\n .mt-11 {\n margin-top: calc(var(--spacing) * 11);\n }\n .mr-0 {\n margin-right: calc(var(--spacing) * 0);\n }\n .mr-1\\.5 {\n margin-right: calc(var(--spacing) * 1.5);\n }\n .mr-2 {\n margin-right: calc(var(--spacing) * 2);\n }\n .mb-1 {\n margin-bottom: calc(var(--spacing) * 1);\n }\n .mb-2 {\n margin-bottom: calc(var(--spacing) * 2);\n }\n .mb-4 {\n margin-bottom: calc(var(--spacing) * 4);\n }\n .mb-11 {\n margin-bottom: calc(var(--spacing) * 11);\n }\n .ml-0 {\n margin-left: calc(var(--spacing) * 0);\n }\n .ml-auto {\n margin-left: auto;\n }\n .flex {\n display: flex;\n }\n .inline-flex {\n display: inline-flex;\n }\n .h-8 {\n height: calc(var(--spacing) * 8);\n }\n .w-8 {\n width: calc(var(--spacing) * 8);\n }\n .animate-spin {\n animation: var(--animate-spin);\n }\n .flex-col {\n flex-direction: column;\n }\n .flex-row {\n flex-direction: row;\n }\n .flex-wrap {\n flex-wrap: wrap;\n }\n .content-center {\n align-content: center;\n }\n .justify-end {\n justify-content: flex-end;\n }\n .self-center {\n align-self: center;\n }\n .rounded-lg {\n border-radius: var(--radius-lg);\n }\n .rounded-md {\n border-radius: var(--radius-md);\n }\n .rounded-none {\n border-radius: 0;\n }\n .rounded-tl-md {\n border-top-left-radius: var(--radius-md);\n }\n .rounded-tl-none {\n border-top-left-radius: 0;\n }\n .rounded-tr-md {\n border-top-right-radius: var(--radius-md);\n }\n .rounded-tr-none {\n border-top-right-radius: 0;\n }\n .rounded-br-md {\n border-bottom-right-radius: var(--radius-md);\n }\n .rounded-br-none {\n border-bottom-right-radius: 0;\n }\n .rounded-bl-md {\n border-bottom-left-radius: var(--radius-md);\n }\n .rounded-bl-none {\n border-bottom-left-radius: 0;\n }\n .border {\n border-style: var(--tw-border-style);\n border-width: 1px;\n }\n .border-r-0 {\n border-right-style: var(--tw-border-style);\n border-right-width: 0px;\n }\n .border-b-0 {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 0px;\n }\n .border-l-0 {\n border-left-style: var(--tw-border-style);\n border-left-width: 0px;\n }\n .border-none {\n --tw-border-style: none;\n border-style: none;\n }\n .border-solid {\n --tw-border-style: solid;\n border-style: solid;\n }\n .border-blue-400 {\n border-color: var(--color-blue-400);\n }\n .border-clrs-navy {\n border-color: var(--clrs-navy, #001f3f);\n }\n .border-gray-300 {\n border-color: var(--color-gray-300);\n }\n .border-gray-600 {\n border-color: var(--color-gray-600);\n }\n .border-green-600 {\n border-color: var(--color-green-600);\n }\n .border-yellow-600 {\n border-color: var(--color-yellow-600);\n }\n .bg-blue-200 {\n background-color: var(--color-blue-200);\n }\n .bg-clrs-navy {\n background-color: var(--clrs-navy, #001f3f);\n }\n .bg-clrs-red {\n background-color: var(--clrs-red, #ff4136);\n }\n .bg-clrs-yellow {\n background-color: var(--clrs-yellow, #ffdc00);\n }\n .bg-gray-300 {\n background-color: var(--color-gray-300);\n }\n .bg-green-200 {\n background-color: var(--color-green-200);\n }\n .bg-yellow-300 {\n background-color: var(--color-yellow-300);\n }\n .p-4 {\n padding: calc(var(--spacing) * 4);\n }\n .text-center {\n text-align: center;\n }\n .text-right {\n text-align: right;\n }\n .align-middle {\n vertical-align: middle;\n }\n .align-top {\n vertical-align: top;\n }\n .font-sans {\n font-family: var(--font-sans);\n }\n .text-6xl {\n font-size: var(--text-6xl);\n line-height: var(--tw-leading, var(--text-6xl--line-height));\n }\n .text-lg {\n font-size: var(--text-lg);\n line-height: var(--tw-leading, var(--text-lg--line-height));\n }\n .text-sm {\n font-size: var(--text-sm);\n line-height: var(--tw-leading, var(--text-sm--line-height));\n }\n .text-xl {\n font-size: var(--text-xl);\n line-height: var(--tw-leading, var(--text-xl--line-height));\n }\n .text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--line-height));\n }\n .font-bold {\n --tw-font-weight: var(--font-weight-bold);\n font-weight: var(--font-weight-bold);\n }\n .font-thin {\n --tw-font-weight: var(--font-weight-thin);\n font-weight: var(--font-weight-thin);\n }\n .text-clrs-gray {\n color: var(--clrs-gray, #aaaaaa);\n }\n .text-clrs-navy {\n color: var(--clrs-navy, #001f3f);\n }\n .text-clrs-red {\n color: var(--clrs-red, #ff4136);\n }\n .text-clrs-slate4 {\n color: var(--clrs-slate4, #4e5964);\n }\n .text-clrs-white {\n color: var(--clrs-white, #ffffff);\n }\n .text-white {\n color: var(--color-white);\n }\n .uppercase {\n text-transform: uppercase;\n }\n .italic {\n font-style: italic;\n }\n .opacity-25 {\n opacity: 25%;\n }\n .opacity-75 {\n opacity: 75%;\n }\n .shadow {\n --tw-shadow:\n 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)),\n 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow:\n var(--tw-inset-shadow), var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .hover\\:text-clrs-navy {\n &:hover {\n @media (hover: hover) {\n color: var(--clrs-navy, #001f3f);\n }\n }\n }\n .hover\\:text-clrs-red {\n &:hover {\n @media (hover: hover) {\n color: var(--clrs-red, #ff4136);\n }\n }\n }\n .md\\:w-auto {\n @media (width >= 48rem) {\n width: auto;\n }\n }\n}\n@layer components {\n .ds1-main {\n margin: calc(var(--spacing) * 6);\n display: flex;\n flex-direction: column;\n font-family: var(--font-sans);\n color: var(--clrs-navy, #001f3f);\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n }\n}\n.ikon {\n height: 96px;\n width: 96px;\n}\n@media (min-width: 500px) {\n .ikon {\n height: 144px;\n width: 144px;\n }\n}\n@media (min-width: 700px) {\n .ikon {\n height: 192px;\n width: 192px;\n }\n}\n@keyframes spin {\n to {\n transform: rotate(360deg);\n }\n}\n@layer properties {\n @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or\n ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {\n *,\n ::before,\n ::after,\n ::backdrop {\n --tw-border-style: solid;\n --tw-font-weight: initial;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-color: initial;\n --tw-shadow-alpha: 100%;\n --tw-inset-shadow: 0 0 #0000;\n --tw-inset-shadow-color: initial;\n --tw-inset-shadow-alpha: 100%;\n --tw-ring-color: initial;\n --tw-ring-shadow: 0 0 #0000;\n --tw-inset-ring-color: initial;\n --tw-inset-ring-shadow: 0 0 #0000;\n --tw-ring-inset: initial;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-offset-shadow: 0 0 #0000;\n }\n }\n}\n";
906
+ const shadowCss = () => `/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */
907
+ @layer properties;
908
+ @layer theme, base, components, utilities;
909
+ @layer theme {
910
+ :root,
911
+ :host {
912
+ --font-sans:
913
+ ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji',
914
+ 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
915
+ --color-yellow-300: oklch(90.5% 0.182 98.111);
916
+ --color-yellow-600: oklch(68.1% 0.162 75.834);
917
+ --color-green-200: oklch(92.5% 0.084 155.995);
918
+ --color-green-600: oklch(62.7% 0.194 149.214);
919
+ --color-blue-200: oklch(88.2% 0.059 254.128);
920
+ --color-blue-400: oklch(70.7% 0.165 254.624);
921
+ --color-gray-300: oklch(87.2% 0.01 258.338);
922
+ --color-gray-600: oklch(44.6% 0.03 256.802);
923
+ --color-white: #fff;
924
+ --spacing: 0.25rem;
925
+ --text-xs: 0.75rem;
926
+ --text-xs--line-height: calc(1 / 0.75);
927
+ --text-sm: 0.875rem;
928
+ --text-sm--line-height: calc(1.25 / 0.875);
929
+ --text-lg: 1.125rem;
930
+ --text-lg--line-height: calc(1.75 / 1.125);
931
+ --text-xl: 1.25rem;
932
+ --text-xl--line-height: calc(1.75 / 1.25);
933
+ --text-6xl: 3.75rem;
934
+ --text-6xl--line-height: 1;
935
+ --font-weight-thin: 100;
936
+ --font-weight-bold: 700;
937
+ --radius-md: 0.375rem;
938
+ --radius-lg: 0.5rem;
939
+ --animate-spin: spin 1s linear infinite;
940
+ }
941
+ }
942
+ @layer utilities {
943
+ .absolute {
944
+ position: absolute;
945
+ }
946
+ .relative {
947
+ position: relative;
948
+ }
949
+ .top-0 {
950
+ top: calc(var(--spacing) * 0);
951
+ }
952
+ .right-0 {
953
+ right: calc(var(--spacing) * 0);
954
+ }
955
+ .m-6 {
956
+ margin: calc(var(--spacing) * 6);
957
+ }
958
+ .mt-2 {
959
+ margin-top: calc(var(--spacing) * 2);
960
+ }
961
+ .mt-4 {
962
+ margin-top: calc(var(--spacing) * 4);
963
+ }
964
+ .mt-11 {
965
+ margin-top: calc(var(--spacing) * 11);
966
+ }
967
+ .mr-0 {
968
+ margin-right: calc(var(--spacing) * 0);
969
+ }
970
+ .mr-1\.5 {
971
+ margin-right: calc(var(--spacing) * 1.5);
972
+ }
973
+ .mr-2 {
974
+ margin-right: calc(var(--spacing) * 2);
975
+ }
976
+ .mb-1 {
977
+ margin-bottom: calc(var(--spacing) * 1);
978
+ }
979
+ .mb-2 {
980
+ margin-bottom: calc(var(--spacing) * 2);
981
+ }
982
+ .mb-4 {
983
+ margin-bottom: calc(var(--spacing) * 4);
984
+ }
985
+ .mb-11 {
986
+ margin-bottom: calc(var(--spacing) * 11);
987
+ }
988
+ .ml-0 {
989
+ margin-left: calc(var(--spacing) * 0);
990
+ }
991
+ .ml-auto {
992
+ margin-left: auto;
993
+ }
994
+ .flex {
995
+ display: flex;
996
+ }
997
+ .inline-flex {
998
+ display: inline-flex;
999
+ }
1000
+ .h-8 {
1001
+ height: calc(var(--spacing) * 8);
1002
+ }
1003
+ .w-8 {
1004
+ width: calc(var(--spacing) * 8);
1005
+ }
1006
+ .animate-spin {
1007
+ animation: var(--animate-spin);
1008
+ }
1009
+ .flex-col {
1010
+ flex-direction: column;
1011
+ }
1012
+ .flex-row {
1013
+ flex-direction: row;
1014
+ }
1015
+ .flex-wrap {
1016
+ flex-wrap: wrap;
1017
+ }
1018
+ .content-center {
1019
+ align-content: center;
1020
+ }
1021
+ .justify-end {
1022
+ justify-content: flex-end;
1023
+ }
1024
+ .self-center {
1025
+ align-self: center;
1026
+ }
1027
+ .rounded-lg {
1028
+ border-radius: var(--radius-lg);
1029
+ }
1030
+ .rounded-md {
1031
+ border-radius: var(--radius-md);
1032
+ }
1033
+ .rounded-none {
1034
+ border-radius: 0;
1035
+ }
1036
+ .rounded-tl-md {
1037
+ border-top-left-radius: var(--radius-md);
1038
+ }
1039
+ .rounded-tl-none {
1040
+ border-top-left-radius: 0;
1041
+ }
1042
+ .rounded-tr-md {
1043
+ border-top-right-radius: var(--radius-md);
1044
+ }
1045
+ .rounded-tr-none {
1046
+ border-top-right-radius: 0;
1047
+ }
1048
+ .rounded-br-md {
1049
+ border-bottom-right-radius: var(--radius-md);
1050
+ }
1051
+ .rounded-br-none {
1052
+ border-bottom-right-radius: 0;
1053
+ }
1054
+ .rounded-bl-md {
1055
+ border-bottom-left-radius: var(--radius-md);
1056
+ }
1057
+ .rounded-bl-none {
1058
+ border-bottom-left-radius: 0;
1059
+ }
1060
+ .border {
1061
+ border-style: var(--tw-border-style);
1062
+ border-width: 1px;
1063
+ }
1064
+ .border-r-0 {
1065
+ border-right-style: var(--tw-border-style);
1066
+ border-right-width: 0px;
1067
+ }
1068
+ .border-b-0 {
1069
+ border-bottom-style: var(--tw-border-style);
1070
+ border-bottom-width: 0px;
1071
+ }
1072
+ .border-l-0 {
1073
+ border-left-style: var(--tw-border-style);
1074
+ border-left-width: 0px;
1075
+ }
1076
+ .border-none {
1077
+ --tw-border-style: none;
1078
+ border-style: none;
1079
+ }
1080
+ .border-solid {
1081
+ --tw-border-style: solid;
1082
+ border-style: solid;
1083
+ }
1084
+ .border-blue-400 {
1085
+ border-color: var(--color-blue-400);
1086
+ }
1087
+ .border-clrs-navy {
1088
+ border-color: var(--clrs-navy, #001f3f);
1089
+ }
1090
+ .border-gray-300 {
1091
+ border-color: var(--color-gray-300);
1092
+ }
1093
+ .border-gray-600 {
1094
+ border-color: var(--color-gray-600);
1095
+ }
1096
+ .border-green-600 {
1097
+ border-color: var(--color-green-600);
1098
+ }
1099
+ .border-yellow-600 {
1100
+ border-color: var(--color-yellow-600);
1101
+ }
1102
+ .bg-blue-200 {
1103
+ background-color: var(--color-blue-200);
1104
+ }
1105
+ .bg-clrs-navy {
1106
+ background-color: var(--clrs-navy, #001f3f);
1107
+ }
1108
+ .bg-clrs-red {
1109
+ background-color: var(--clrs-red, #ff4136);
1110
+ }
1111
+ .bg-clrs-yellow {
1112
+ background-color: var(--clrs-yellow, #ffdc00);
1113
+ }
1114
+ .bg-gray-300 {
1115
+ background-color: var(--color-gray-300);
1116
+ }
1117
+ .bg-green-200 {
1118
+ background-color: var(--color-green-200);
1119
+ }
1120
+ .bg-yellow-300 {
1121
+ background-color: var(--color-yellow-300);
1122
+ }
1123
+ .p-4 {
1124
+ padding: calc(var(--spacing) * 4);
1125
+ }
1126
+ .text-center {
1127
+ text-align: center;
1128
+ }
1129
+ .text-right {
1130
+ text-align: right;
1131
+ }
1132
+ .align-middle {
1133
+ vertical-align: middle;
1134
+ }
1135
+ .align-top {
1136
+ vertical-align: top;
1137
+ }
1138
+ .font-sans {
1139
+ font-family: var(--font-sans);
1140
+ }
1141
+ .text-6xl {
1142
+ font-size: var(--text-6xl);
1143
+ line-height: var(--tw-leading, var(--text-6xl--line-height));
1144
+ }
1145
+ .text-lg {
1146
+ font-size: var(--text-lg);
1147
+ line-height: var(--tw-leading, var(--text-lg--line-height));
1148
+ }
1149
+ .text-sm {
1150
+ font-size: var(--text-sm);
1151
+ line-height: var(--tw-leading, var(--text-sm--line-height));
1152
+ }
1153
+ .text-xl {
1154
+ font-size: var(--text-xl);
1155
+ line-height: var(--tw-leading, var(--text-xl--line-height));
1156
+ }
1157
+ .text-xs {
1158
+ font-size: var(--text-xs);
1159
+ line-height: var(--tw-leading, var(--text-xs--line-height));
1160
+ }
1161
+ .font-bold {
1162
+ --tw-font-weight: var(--font-weight-bold);
1163
+ font-weight: var(--font-weight-bold);
1164
+ }
1165
+ .font-thin {
1166
+ --tw-font-weight: var(--font-weight-thin);
1167
+ font-weight: var(--font-weight-thin);
1168
+ }
1169
+ .text-clrs-gray {
1170
+ color: var(--clrs-gray, #aaaaaa);
1171
+ }
1172
+ .text-clrs-navy {
1173
+ color: var(--clrs-navy, #001f3f);
1174
+ }
1175
+ .text-clrs-red {
1176
+ color: var(--clrs-red, #ff4136);
1177
+ }
1178
+ .text-clrs-slate4 {
1179
+ color: var(--clrs-slate4, #4e5964);
1180
+ }
1181
+ .text-clrs-white {
1182
+ color: var(--clrs-white, #ffffff);
1183
+ }
1184
+ .text-white {
1185
+ color: var(--color-white);
1186
+ }
1187
+ .uppercase {
1188
+ text-transform: uppercase;
1189
+ }
1190
+ .italic {
1191
+ font-style: italic;
1192
+ }
1193
+ .opacity-25 {
1194
+ opacity: 25%;
1195
+ }
1196
+ .opacity-75 {
1197
+ opacity: 75%;
1198
+ }
1199
+ .shadow {
1200
+ --tw-shadow:
1201
+ 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)),
1202
+ 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
1203
+ box-shadow:
1204
+ var(--tw-inset-shadow), var(--tw-inset-ring-shadow),
1205
+ var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1206
+ }
1207
+ .hover\:text-clrs-navy {
1208
+ &:hover {
1209
+ @media (hover: hover) {
1210
+ color: var(--clrs-navy, #001f3f);
1211
+ }
1212
+ }
1213
+ }
1214
+ .hover\:text-clrs-red {
1215
+ &:hover {
1216
+ @media (hover: hover) {
1217
+ color: var(--clrs-red, #ff4136);
1218
+ }
1219
+ }
1220
+ }
1221
+ .md\:w-auto {
1222
+ @media (width >= 48rem) {
1223
+ width: auto;
1224
+ }
1225
+ }
1226
+ }
1227
+ @layer components {
1228
+ .ds1-main {
1229
+ margin: calc(var(--spacing) * 6);
1230
+ display: flex;
1231
+ flex-direction: column;
1232
+ font-family: var(--font-sans);
1233
+ color: var(--clrs-navy, #001f3f);
1234
+ -webkit-font-smoothing: antialiased;
1235
+ -moz-osx-font-smoothing: grayscale;
1236
+ }
1237
+ }
1238
+ .ikon {
1239
+ height: 96px;
1240
+ width: 96px;
1241
+ }
1242
+ @media (min-width: 500px) {
1243
+ .ikon {
1244
+ height: 144px;
1245
+ width: 144px;
1246
+ }
1247
+ }
1248
+ @media (min-width: 700px) {
1249
+ .ikon {
1250
+ height: 192px;
1251
+ width: 192px;
1252
+ }
1253
+ }
1254
+ @keyframes spin {
1255
+ to {
1256
+ transform: rotate(360deg);
1257
+ }
1258
+ }
1259
+ @layer properties {
1260
+ @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or
1261
+ ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
1262
+ *,
1263
+ ::before,
1264
+ ::after,
1265
+ ::backdrop {
1266
+ --tw-border-style: solid;
1267
+ --tw-font-weight: initial;
1268
+ --tw-shadow: 0 0 #0000;
1269
+ --tw-shadow-color: initial;
1270
+ --tw-shadow-alpha: 100%;
1271
+ --tw-inset-shadow: 0 0 #0000;
1272
+ --tw-inset-shadow-color: initial;
1273
+ --tw-inset-shadow-alpha: 100%;
1274
+ --tw-ring-color: initial;
1275
+ --tw-ring-shadow: 0 0 #0000;
1276
+ --tw-inset-ring-color: initial;
1277
+ --tw-inset-ring-shadow: 0 0 #0000;
1278
+ --tw-ring-inset: initial;
1279
+ --tw-ring-offset-width: 0px;
1280
+ --tw-ring-offset-color: #fff;
1281
+ --tw-ring-offset-shadow: 0 0 #0000;
1282
+ }
1283
+ }
1284
+ }
1285
+ `;
907
1286
 
908
1287
  const ProtoAutos = class {
909
1288
  constructor(hostRef) {
@@ -918,6 +1297,6 @@ const ProtoAutos = class {
918
1297
  return (index.h("main", { key: 'eb918bee95389cd4c78c6a7b3134ada507c5a042', id: "app", class: "ds1-main relative" }, index.h(Eswat2Io, { key: 'efa617ee04ddd6c58650d1cf4d00f899c3520efa' }), index.h(Header, { key: '6762516c1c9fc2d4490e9343d75f4f09f657fae6', label: "Auto Dealers" }), index.h(ToolBar, { key: 'ce1aeeb560729f66726b859d6f9d5a4a410703b1' }), loading ? (index.h(Spinner, null)) : (index.h("hr", { class: tw('mb-4 ml-0 mr-0 mt-4', 'border-solid border-gray-300', 'border-b-0 border-l-0 border-r-0') })), index.h(DealerView, { key: '63ef8ba16a60533a147c06e126442e9f2481f8fe', dealer: dealer }), index.h(Footer, { key: '00d32c34fcf933386a5e5f920e09f02f95dbfbf1' })));
919
1298
  }
920
1299
  };
921
- ProtoAutos.style = shadowCss;
1300
+ ProtoAutos.style = shadowCss();
922
1301
 
923
1302
  exports.proto_autos = ProtoAutos;
@@ -4,8 +4,8 @@
4
4
  ],
5
5
  "compiler": {
6
6
  "name": "@stencil/core",
7
- "version": "4.38.3",
8
- "typescriptVersion": "5.9.3"
7
+ "version": "4.39.0",
8
+ "typescriptVersion": "5.8.3"
9
9
  },
10
10
  "collections": [],
11
11
  "bundles": []
@@ -2,7 +2,7 @@ const NAMESPACE = 'proto-autos-wc';
2
2
  const BUILD = /* proto-autos-wc */ { hydratedSelectorName: "hydrated", lazyLoad: true, prop: true, propChangeCallback: false, updatable: true};
3
3
 
4
4
  /*
5
- Stencil Client Platform v4.38.3 | MIT Licensed | https://stenciljs.com
5
+ Stencil Client Platform v4.39.0 | MIT Licensed | https://stenciljs.com
6
6
  */
7
7
  var __defProp = Object.defineProperty;
8
8
  var __export = (target, all) => {
@@ -378,6 +378,9 @@ var attachStyles = (hostRef) => {
378
378
  };
379
379
  var getScopeId = (cmp, mode) => "sc-" + (cmp.$tagName$);
380
380
  var h = (nodeName, vnodeData, ...children) => {
381
+ if (typeof nodeName === "string") {
382
+ nodeName = transformTag(nodeName);
383
+ }
381
384
  let child = null;
382
385
  let key = null;
383
386
  let simple = false;
@@ -1363,7 +1366,7 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
1363
1366
  {
1364
1367
  cmpMeta.$members$ = compactMeta[2];
1365
1368
  }
1366
- const tagName = cmpMeta.$tagName$;
1369
+ const tagName = transformTag(cmpMeta.$tagName$);
1367
1370
  const HostElement = class extends HTMLElement {
1368
1371
  // StencilLazyHost
1369
1372
  constructor(self) {
@@ -1464,5 +1467,8 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
1464
1467
 
1465
1468
  // src/runtime/nonce.ts
1466
1469
  var setNonce = (nonce) => plt.$nonce$ = nonce;
1470
+ function transformTag(tag) {
1471
+ return tag;
1472
+ }
1467
1473
 
1468
1474
  export { bootstrapLazy as b, forceUpdate as f, getRenderingRef as g, h, promiseResolve as p, registerInstance as r, setNonce as s };
@@ -1,5 +1,5 @@
1
- import { b as bootstrapLazy } from './index-DWVetjJM.js';
2
- export { s as setNonce } from './index-DWVetjJM.js';
1
+ import { b as bootstrapLazy } from './index-B_Sspfrn.js';
2
+ export { s as setNonce } from './index-B_Sspfrn.js';
3
3
  import { g as globalScripts } from './app-globals-DQuL1Twl.js';
4
4
 
5
5
  const defineCustomElements = async (win, options) => {
@@ -1,9 +1,9 @@
1
- import { p as promiseResolve, b as bootstrapLazy } from './index-DWVetjJM.js';
2
- export { s as setNonce } from './index-DWVetjJM.js';
1
+ import { p as promiseResolve, b as bootstrapLazy } from './index-B_Sspfrn.js';
2
+ export { s as setNonce } from './index-B_Sspfrn.js';
3
3
  import { g as globalScripts } from './app-globals-DQuL1Twl.js';
4
4
 
5
5
  /*
6
- Stencil Client Patch Browser v4.38.3 | MIT Licensed | https://stenciljs.com
6
+ Stencil Client Patch Browser v4.39.0 | MIT Licensed | https://stenciljs.com
7
7
  */
8
8
 
9
9
  var patchBrowser = () => {
@@ -1,4 +1,4 @@
1
- import { g as getRenderingRef, f as forceUpdate, h, r as registerInstance } from './index-DWVetjJM.js';
1
+ import { g as getRenderingRef, f as forceUpdate, h, r as registerInstance } from './index-B_Sspfrn.js';
2
2
 
3
3
  const KEY = 'proto-autos';
4
4
  const DATA = 'data';
@@ -901,7 +901,386 @@ const ToolBar = _props => {
901
901
  : 'bg-clrs-yellow text-clrs-navy'), onClick: () => actions.updatePick(indx), title: `${dealer.name} (${dealer.vehicles.length})` }, indx + 1))))));
902
902
  };
903
903
 
904
- const shadowCss = "/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */\n@layer properties;\n@layer theme, base, components, utilities;\n@layer theme {\n :root,\n :host {\n --font-sans:\n ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji',\n 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';\n --color-yellow-300: oklch(90.5% 0.182 98.111);\n --color-yellow-600: oklch(68.1% 0.162 75.834);\n --color-green-200: oklch(92.5% 0.084 155.995);\n --color-green-600: oklch(62.7% 0.194 149.214);\n --color-blue-200: oklch(88.2% 0.059 254.128);\n --color-blue-400: oklch(70.7% 0.165 254.624);\n --color-gray-300: oklch(87.2% 0.01 258.338);\n --color-gray-600: oklch(44.6% 0.03 256.802);\n --color-white: #fff;\n --spacing: 0.25rem;\n --text-xs: 0.75rem;\n --text-xs--line-height: calc(1 / 0.75);\n --text-sm: 0.875rem;\n --text-sm--line-height: calc(1.25 / 0.875);\n --text-lg: 1.125rem;\n --text-lg--line-height: calc(1.75 / 1.125);\n --text-xl: 1.25rem;\n --text-xl--line-height: calc(1.75 / 1.25);\n --text-6xl: 3.75rem;\n --text-6xl--line-height: 1;\n --font-weight-thin: 100;\n --font-weight-bold: 700;\n --radius-md: 0.375rem;\n --radius-lg: 0.5rem;\n --animate-spin: spin 1s linear infinite;\n }\n}\n@layer utilities {\n .absolute {\n position: absolute;\n }\n .relative {\n position: relative;\n }\n .top-0 {\n top: calc(var(--spacing) * 0);\n }\n .right-0 {\n right: calc(var(--spacing) * 0);\n }\n .m-6 {\n margin: calc(var(--spacing) * 6);\n }\n .mt-2 {\n margin-top: calc(var(--spacing) * 2);\n }\n .mt-4 {\n margin-top: calc(var(--spacing) * 4);\n }\n .mt-11 {\n margin-top: calc(var(--spacing) * 11);\n }\n .mr-0 {\n margin-right: calc(var(--spacing) * 0);\n }\n .mr-1\\.5 {\n margin-right: calc(var(--spacing) * 1.5);\n }\n .mr-2 {\n margin-right: calc(var(--spacing) * 2);\n }\n .mb-1 {\n margin-bottom: calc(var(--spacing) * 1);\n }\n .mb-2 {\n margin-bottom: calc(var(--spacing) * 2);\n }\n .mb-4 {\n margin-bottom: calc(var(--spacing) * 4);\n }\n .mb-11 {\n margin-bottom: calc(var(--spacing) * 11);\n }\n .ml-0 {\n margin-left: calc(var(--spacing) * 0);\n }\n .ml-auto {\n margin-left: auto;\n }\n .flex {\n display: flex;\n }\n .inline-flex {\n display: inline-flex;\n }\n .h-8 {\n height: calc(var(--spacing) * 8);\n }\n .w-8 {\n width: calc(var(--spacing) * 8);\n }\n .animate-spin {\n animation: var(--animate-spin);\n }\n .flex-col {\n flex-direction: column;\n }\n .flex-row {\n flex-direction: row;\n }\n .flex-wrap {\n flex-wrap: wrap;\n }\n .content-center {\n align-content: center;\n }\n .justify-end {\n justify-content: flex-end;\n }\n .self-center {\n align-self: center;\n }\n .rounded-lg {\n border-radius: var(--radius-lg);\n }\n .rounded-md {\n border-radius: var(--radius-md);\n }\n .rounded-none {\n border-radius: 0;\n }\n .rounded-tl-md {\n border-top-left-radius: var(--radius-md);\n }\n .rounded-tl-none {\n border-top-left-radius: 0;\n }\n .rounded-tr-md {\n border-top-right-radius: var(--radius-md);\n }\n .rounded-tr-none {\n border-top-right-radius: 0;\n }\n .rounded-br-md {\n border-bottom-right-radius: var(--radius-md);\n }\n .rounded-br-none {\n border-bottom-right-radius: 0;\n }\n .rounded-bl-md {\n border-bottom-left-radius: var(--radius-md);\n }\n .rounded-bl-none {\n border-bottom-left-radius: 0;\n }\n .border {\n border-style: var(--tw-border-style);\n border-width: 1px;\n }\n .border-r-0 {\n border-right-style: var(--tw-border-style);\n border-right-width: 0px;\n }\n .border-b-0 {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 0px;\n }\n .border-l-0 {\n border-left-style: var(--tw-border-style);\n border-left-width: 0px;\n }\n .border-none {\n --tw-border-style: none;\n border-style: none;\n }\n .border-solid {\n --tw-border-style: solid;\n border-style: solid;\n }\n .border-blue-400 {\n border-color: var(--color-blue-400);\n }\n .border-clrs-navy {\n border-color: var(--clrs-navy, #001f3f);\n }\n .border-gray-300 {\n border-color: var(--color-gray-300);\n }\n .border-gray-600 {\n border-color: var(--color-gray-600);\n }\n .border-green-600 {\n border-color: var(--color-green-600);\n }\n .border-yellow-600 {\n border-color: var(--color-yellow-600);\n }\n .bg-blue-200 {\n background-color: var(--color-blue-200);\n }\n .bg-clrs-navy {\n background-color: var(--clrs-navy, #001f3f);\n }\n .bg-clrs-red {\n background-color: var(--clrs-red, #ff4136);\n }\n .bg-clrs-yellow {\n background-color: var(--clrs-yellow, #ffdc00);\n }\n .bg-gray-300 {\n background-color: var(--color-gray-300);\n }\n .bg-green-200 {\n background-color: var(--color-green-200);\n }\n .bg-yellow-300 {\n background-color: var(--color-yellow-300);\n }\n .p-4 {\n padding: calc(var(--spacing) * 4);\n }\n .text-center {\n text-align: center;\n }\n .text-right {\n text-align: right;\n }\n .align-middle {\n vertical-align: middle;\n }\n .align-top {\n vertical-align: top;\n }\n .font-sans {\n font-family: var(--font-sans);\n }\n .text-6xl {\n font-size: var(--text-6xl);\n line-height: var(--tw-leading, var(--text-6xl--line-height));\n }\n .text-lg {\n font-size: var(--text-lg);\n line-height: var(--tw-leading, var(--text-lg--line-height));\n }\n .text-sm {\n font-size: var(--text-sm);\n line-height: var(--tw-leading, var(--text-sm--line-height));\n }\n .text-xl {\n font-size: var(--text-xl);\n line-height: var(--tw-leading, var(--text-xl--line-height));\n }\n .text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--line-height));\n }\n .font-bold {\n --tw-font-weight: var(--font-weight-bold);\n font-weight: var(--font-weight-bold);\n }\n .font-thin {\n --tw-font-weight: var(--font-weight-thin);\n font-weight: var(--font-weight-thin);\n }\n .text-clrs-gray {\n color: var(--clrs-gray, #aaaaaa);\n }\n .text-clrs-navy {\n color: var(--clrs-navy, #001f3f);\n }\n .text-clrs-red {\n color: var(--clrs-red, #ff4136);\n }\n .text-clrs-slate4 {\n color: var(--clrs-slate4, #4e5964);\n }\n .text-clrs-white {\n color: var(--clrs-white, #ffffff);\n }\n .text-white {\n color: var(--color-white);\n }\n .uppercase {\n text-transform: uppercase;\n }\n .italic {\n font-style: italic;\n }\n .opacity-25 {\n opacity: 25%;\n }\n .opacity-75 {\n opacity: 75%;\n }\n .shadow {\n --tw-shadow:\n 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)),\n 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow:\n var(--tw-inset-shadow), var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .hover\\:text-clrs-navy {\n &:hover {\n @media (hover: hover) {\n color: var(--clrs-navy, #001f3f);\n }\n }\n }\n .hover\\:text-clrs-red {\n &:hover {\n @media (hover: hover) {\n color: var(--clrs-red, #ff4136);\n }\n }\n }\n .md\\:w-auto {\n @media (width >= 48rem) {\n width: auto;\n }\n }\n}\n@layer components {\n .ds1-main {\n margin: calc(var(--spacing) * 6);\n display: flex;\n flex-direction: column;\n font-family: var(--font-sans);\n color: var(--clrs-navy, #001f3f);\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n }\n}\n.ikon {\n height: 96px;\n width: 96px;\n}\n@media (min-width: 500px) {\n .ikon {\n height: 144px;\n width: 144px;\n }\n}\n@media (min-width: 700px) {\n .ikon {\n height: 192px;\n width: 192px;\n }\n}\n@keyframes spin {\n to {\n transform: rotate(360deg);\n }\n}\n@layer properties {\n @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or\n ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {\n *,\n ::before,\n ::after,\n ::backdrop {\n --tw-border-style: solid;\n --tw-font-weight: initial;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-color: initial;\n --tw-shadow-alpha: 100%;\n --tw-inset-shadow: 0 0 #0000;\n --tw-inset-shadow-color: initial;\n --tw-inset-shadow-alpha: 100%;\n --tw-ring-color: initial;\n --tw-ring-shadow: 0 0 #0000;\n --tw-inset-ring-color: initial;\n --tw-inset-ring-shadow: 0 0 #0000;\n --tw-ring-inset: initial;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-offset-shadow: 0 0 #0000;\n }\n }\n}\n";
904
+ const shadowCss = () => `/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */
905
+ @layer properties;
906
+ @layer theme, base, components, utilities;
907
+ @layer theme {
908
+ :root,
909
+ :host {
910
+ --font-sans:
911
+ ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji',
912
+ 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
913
+ --color-yellow-300: oklch(90.5% 0.182 98.111);
914
+ --color-yellow-600: oklch(68.1% 0.162 75.834);
915
+ --color-green-200: oklch(92.5% 0.084 155.995);
916
+ --color-green-600: oklch(62.7% 0.194 149.214);
917
+ --color-blue-200: oklch(88.2% 0.059 254.128);
918
+ --color-blue-400: oklch(70.7% 0.165 254.624);
919
+ --color-gray-300: oklch(87.2% 0.01 258.338);
920
+ --color-gray-600: oklch(44.6% 0.03 256.802);
921
+ --color-white: #fff;
922
+ --spacing: 0.25rem;
923
+ --text-xs: 0.75rem;
924
+ --text-xs--line-height: calc(1 / 0.75);
925
+ --text-sm: 0.875rem;
926
+ --text-sm--line-height: calc(1.25 / 0.875);
927
+ --text-lg: 1.125rem;
928
+ --text-lg--line-height: calc(1.75 / 1.125);
929
+ --text-xl: 1.25rem;
930
+ --text-xl--line-height: calc(1.75 / 1.25);
931
+ --text-6xl: 3.75rem;
932
+ --text-6xl--line-height: 1;
933
+ --font-weight-thin: 100;
934
+ --font-weight-bold: 700;
935
+ --radius-md: 0.375rem;
936
+ --radius-lg: 0.5rem;
937
+ --animate-spin: spin 1s linear infinite;
938
+ }
939
+ }
940
+ @layer utilities {
941
+ .absolute {
942
+ position: absolute;
943
+ }
944
+ .relative {
945
+ position: relative;
946
+ }
947
+ .top-0 {
948
+ top: calc(var(--spacing) * 0);
949
+ }
950
+ .right-0 {
951
+ right: calc(var(--spacing) * 0);
952
+ }
953
+ .m-6 {
954
+ margin: calc(var(--spacing) * 6);
955
+ }
956
+ .mt-2 {
957
+ margin-top: calc(var(--spacing) * 2);
958
+ }
959
+ .mt-4 {
960
+ margin-top: calc(var(--spacing) * 4);
961
+ }
962
+ .mt-11 {
963
+ margin-top: calc(var(--spacing) * 11);
964
+ }
965
+ .mr-0 {
966
+ margin-right: calc(var(--spacing) * 0);
967
+ }
968
+ .mr-1\.5 {
969
+ margin-right: calc(var(--spacing) * 1.5);
970
+ }
971
+ .mr-2 {
972
+ margin-right: calc(var(--spacing) * 2);
973
+ }
974
+ .mb-1 {
975
+ margin-bottom: calc(var(--spacing) * 1);
976
+ }
977
+ .mb-2 {
978
+ margin-bottom: calc(var(--spacing) * 2);
979
+ }
980
+ .mb-4 {
981
+ margin-bottom: calc(var(--spacing) * 4);
982
+ }
983
+ .mb-11 {
984
+ margin-bottom: calc(var(--spacing) * 11);
985
+ }
986
+ .ml-0 {
987
+ margin-left: calc(var(--spacing) * 0);
988
+ }
989
+ .ml-auto {
990
+ margin-left: auto;
991
+ }
992
+ .flex {
993
+ display: flex;
994
+ }
995
+ .inline-flex {
996
+ display: inline-flex;
997
+ }
998
+ .h-8 {
999
+ height: calc(var(--spacing) * 8);
1000
+ }
1001
+ .w-8 {
1002
+ width: calc(var(--spacing) * 8);
1003
+ }
1004
+ .animate-spin {
1005
+ animation: var(--animate-spin);
1006
+ }
1007
+ .flex-col {
1008
+ flex-direction: column;
1009
+ }
1010
+ .flex-row {
1011
+ flex-direction: row;
1012
+ }
1013
+ .flex-wrap {
1014
+ flex-wrap: wrap;
1015
+ }
1016
+ .content-center {
1017
+ align-content: center;
1018
+ }
1019
+ .justify-end {
1020
+ justify-content: flex-end;
1021
+ }
1022
+ .self-center {
1023
+ align-self: center;
1024
+ }
1025
+ .rounded-lg {
1026
+ border-radius: var(--radius-lg);
1027
+ }
1028
+ .rounded-md {
1029
+ border-radius: var(--radius-md);
1030
+ }
1031
+ .rounded-none {
1032
+ border-radius: 0;
1033
+ }
1034
+ .rounded-tl-md {
1035
+ border-top-left-radius: var(--radius-md);
1036
+ }
1037
+ .rounded-tl-none {
1038
+ border-top-left-radius: 0;
1039
+ }
1040
+ .rounded-tr-md {
1041
+ border-top-right-radius: var(--radius-md);
1042
+ }
1043
+ .rounded-tr-none {
1044
+ border-top-right-radius: 0;
1045
+ }
1046
+ .rounded-br-md {
1047
+ border-bottom-right-radius: var(--radius-md);
1048
+ }
1049
+ .rounded-br-none {
1050
+ border-bottom-right-radius: 0;
1051
+ }
1052
+ .rounded-bl-md {
1053
+ border-bottom-left-radius: var(--radius-md);
1054
+ }
1055
+ .rounded-bl-none {
1056
+ border-bottom-left-radius: 0;
1057
+ }
1058
+ .border {
1059
+ border-style: var(--tw-border-style);
1060
+ border-width: 1px;
1061
+ }
1062
+ .border-r-0 {
1063
+ border-right-style: var(--tw-border-style);
1064
+ border-right-width: 0px;
1065
+ }
1066
+ .border-b-0 {
1067
+ border-bottom-style: var(--tw-border-style);
1068
+ border-bottom-width: 0px;
1069
+ }
1070
+ .border-l-0 {
1071
+ border-left-style: var(--tw-border-style);
1072
+ border-left-width: 0px;
1073
+ }
1074
+ .border-none {
1075
+ --tw-border-style: none;
1076
+ border-style: none;
1077
+ }
1078
+ .border-solid {
1079
+ --tw-border-style: solid;
1080
+ border-style: solid;
1081
+ }
1082
+ .border-blue-400 {
1083
+ border-color: var(--color-blue-400);
1084
+ }
1085
+ .border-clrs-navy {
1086
+ border-color: var(--clrs-navy, #001f3f);
1087
+ }
1088
+ .border-gray-300 {
1089
+ border-color: var(--color-gray-300);
1090
+ }
1091
+ .border-gray-600 {
1092
+ border-color: var(--color-gray-600);
1093
+ }
1094
+ .border-green-600 {
1095
+ border-color: var(--color-green-600);
1096
+ }
1097
+ .border-yellow-600 {
1098
+ border-color: var(--color-yellow-600);
1099
+ }
1100
+ .bg-blue-200 {
1101
+ background-color: var(--color-blue-200);
1102
+ }
1103
+ .bg-clrs-navy {
1104
+ background-color: var(--clrs-navy, #001f3f);
1105
+ }
1106
+ .bg-clrs-red {
1107
+ background-color: var(--clrs-red, #ff4136);
1108
+ }
1109
+ .bg-clrs-yellow {
1110
+ background-color: var(--clrs-yellow, #ffdc00);
1111
+ }
1112
+ .bg-gray-300 {
1113
+ background-color: var(--color-gray-300);
1114
+ }
1115
+ .bg-green-200 {
1116
+ background-color: var(--color-green-200);
1117
+ }
1118
+ .bg-yellow-300 {
1119
+ background-color: var(--color-yellow-300);
1120
+ }
1121
+ .p-4 {
1122
+ padding: calc(var(--spacing) * 4);
1123
+ }
1124
+ .text-center {
1125
+ text-align: center;
1126
+ }
1127
+ .text-right {
1128
+ text-align: right;
1129
+ }
1130
+ .align-middle {
1131
+ vertical-align: middle;
1132
+ }
1133
+ .align-top {
1134
+ vertical-align: top;
1135
+ }
1136
+ .font-sans {
1137
+ font-family: var(--font-sans);
1138
+ }
1139
+ .text-6xl {
1140
+ font-size: var(--text-6xl);
1141
+ line-height: var(--tw-leading, var(--text-6xl--line-height));
1142
+ }
1143
+ .text-lg {
1144
+ font-size: var(--text-lg);
1145
+ line-height: var(--tw-leading, var(--text-lg--line-height));
1146
+ }
1147
+ .text-sm {
1148
+ font-size: var(--text-sm);
1149
+ line-height: var(--tw-leading, var(--text-sm--line-height));
1150
+ }
1151
+ .text-xl {
1152
+ font-size: var(--text-xl);
1153
+ line-height: var(--tw-leading, var(--text-xl--line-height));
1154
+ }
1155
+ .text-xs {
1156
+ font-size: var(--text-xs);
1157
+ line-height: var(--tw-leading, var(--text-xs--line-height));
1158
+ }
1159
+ .font-bold {
1160
+ --tw-font-weight: var(--font-weight-bold);
1161
+ font-weight: var(--font-weight-bold);
1162
+ }
1163
+ .font-thin {
1164
+ --tw-font-weight: var(--font-weight-thin);
1165
+ font-weight: var(--font-weight-thin);
1166
+ }
1167
+ .text-clrs-gray {
1168
+ color: var(--clrs-gray, #aaaaaa);
1169
+ }
1170
+ .text-clrs-navy {
1171
+ color: var(--clrs-navy, #001f3f);
1172
+ }
1173
+ .text-clrs-red {
1174
+ color: var(--clrs-red, #ff4136);
1175
+ }
1176
+ .text-clrs-slate4 {
1177
+ color: var(--clrs-slate4, #4e5964);
1178
+ }
1179
+ .text-clrs-white {
1180
+ color: var(--clrs-white, #ffffff);
1181
+ }
1182
+ .text-white {
1183
+ color: var(--color-white);
1184
+ }
1185
+ .uppercase {
1186
+ text-transform: uppercase;
1187
+ }
1188
+ .italic {
1189
+ font-style: italic;
1190
+ }
1191
+ .opacity-25 {
1192
+ opacity: 25%;
1193
+ }
1194
+ .opacity-75 {
1195
+ opacity: 75%;
1196
+ }
1197
+ .shadow {
1198
+ --tw-shadow:
1199
+ 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)),
1200
+ 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
1201
+ box-shadow:
1202
+ var(--tw-inset-shadow), var(--tw-inset-ring-shadow),
1203
+ var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1204
+ }
1205
+ .hover\:text-clrs-navy {
1206
+ &:hover {
1207
+ @media (hover: hover) {
1208
+ color: var(--clrs-navy, #001f3f);
1209
+ }
1210
+ }
1211
+ }
1212
+ .hover\:text-clrs-red {
1213
+ &:hover {
1214
+ @media (hover: hover) {
1215
+ color: var(--clrs-red, #ff4136);
1216
+ }
1217
+ }
1218
+ }
1219
+ .md\:w-auto {
1220
+ @media (width >= 48rem) {
1221
+ width: auto;
1222
+ }
1223
+ }
1224
+ }
1225
+ @layer components {
1226
+ .ds1-main {
1227
+ margin: calc(var(--spacing) * 6);
1228
+ display: flex;
1229
+ flex-direction: column;
1230
+ font-family: var(--font-sans);
1231
+ color: var(--clrs-navy, #001f3f);
1232
+ -webkit-font-smoothing: antialiased;
1233
+ -moz-osx-font-smoothing: grayscale;
1234
+ }
1235
+ }
1236
+ .ikon {
1237
+ height: 96px;
1238
+ width: 96px;
1239
+ }
1240
+ @media (min-width: 500px) {
1241
+ .ikon {
1242
+ height: 144px;
1243
+ width: 144px;
1244
+ }
1245
+ }
1246
+ @media (min-width: 700px) {
1247
+ .ikon {
1248
+ height: 192px;
1249
+ width: 192px;
1250
+ }
1251
+ }
1252
+ @keyframes spin {
1253
+ to {
1254
+ transform: rotate(360deg);
1255
+ }
1256
+ }
1257
+ @layer properties {
1258
+ @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or
1259
+ ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
1260
+ *,
1261
+ ::before,
1262
+ ::after,
1263
+ ::backdrop {
1264
+ --tw-border-style: solid;
1265
+ --tw-font-weight: initial;
1266
+ --tw-shadow: 0 0 #0000;
1267
+ --tw-shadow-color: initial;
1268
+ --tw-shadow-alpha: 100%;
1269
+ --tw-inset-shadow: 0 0 #0000;
1270
+ --tw-inset-shadow-color: initial;
1271
+ --tw-inset-shadow-alpha: 100%;
1272
+ --tw-ring-color: initial;
1273
+ --tw-ring-shadow: 0 0 #0000;
1274
+ --tw-inset-ring-color: initial;
1275
+ --tw-inset-ring-shadow: 0 0 #0000;
1276
+ --tw-ring-inset: initial;
1277
+ --tw-ring-offset-width: 0px;
1278
+ --tw-ring-offset-color: #fff;
1279
+ --tw-ring-offset-shadow: 0 0 #0000;
1280
+ }
1281
+ }
1282
+ }
1283
+ `;
905
1284
 
906
1285
  const ProtoAutos = class {
907
1286
  constructor(hostRef) {
@@ -916,6 +1295,6 @@ const ProtoAutos = class {
916
1295
  return (h("main", { key: 'eb918bee95389cd4c78c6a7b3134ada507c5a042', id: "app", class: "ds1-main relative" }, h(Eswat2Io, { key: 'efa617ee04ddd6c58650d1cf4d00f899c3520efa' }), h(Header, { key: '6762516c1c9fc2d4490e9343d75f4f09f657fae6', label: "Auto Dealers" }), h(ToolBar, { key: 'ce1aeeb560729f66726b859d6f9d5a4a410703b1' }), loading ? (h(Spinner, null)) : (h("hr", { class: tw('mb-4 ml-0 mr-0 mt-4', 'border-solid border-gray-300', 'border-b-0 border-l-0 border-r-0') })), h(DealerView, { key: '63ef8ba16a60533a147c06e126442e9f2481f8fe', dealer: dealer }), h(Footer, { key: '00d32c34fcf933386a5e5f920e09f02f95dbfbf1' })));
917
1296
  }
918
1297
  };
919
- ProtoAutos.style = shadowCss;
1298
+ ProtoAutos.style = shadowCss();
920
1299
 
921
1300
  export { ProtoAutos as proto_autos };
@@ -1 +1 @@
1
- import{g as n,f as e,h as r,r as t}from"./p-DWVetjJM.js";const o="proto-autos",a="data",i="pick",l=n=>{const e=localStorage.getItem(n?`${o}-${n}`:o);return e?JSON.parse(e):void 0},s=(n,e)=>{const r=n?`${o}-${n}`:o,t=JSON.stringify(e);localStorage.setItem(r,t)},c=n=>!("isConnected"in n)||n.isConnected,d=(()=>{let n;return(...e)=>{n&&clearTimeout(n),n=setTimeout((()=>{n=0,(n=>{for(let e of n.keys())n.set(e,n.get(e).filter(c))})(...e)}),2e3)}})(),u=n=>"function"==typeof n?n():n,f=(n,e)=>{const r=n.indexOf(e);r>=0&&(n[r]=n[n.length-1],n.length--)};var h=function(){function n(n,e){for(var r=0;r<e.length;r++){var t=e[r];t.enumerable=t.enumerable||!1,t.configurable=!0,"value"in t&&(t.writable=!0),Object.defineProperty(n,t.key,t)}}return function(e,r,t){return r&&n(e.prototype,r),t&&n(e,t),e}}();function g(n,e){if(!(n instanceof e))throw new TypeError("Cannot call a class as a function")}var b=function(){function n(){var e=this;g(this,n),this.interceptors=[],this.fetch=function(){for(var n=arguments.length,r=Array(n),t=0;t<n;t++)r[t]=arguments[t];return e.interceptorWrapper.apply(e,[fetch].concat(r))}}return h(n,[{key:"addInterceptors",value:function(n){var e=this,r=[];return Array.isArray(n)?n.map((function(n){return r.push(e.interceptors.length),e.interceptors.push(n)})):n instanceof Object&&(r.push(this.interceptors.length),this.interceptors.push(n)),this.updateInterceptors(),function(){return e.removeInterceptors(r)}}},{key:"removeInterceptors",value:function(n){var e=this;Array.isArray(n)&&(n.map((function(n){return e.interceptors.splice(n,1)})),this.updateInterceptors())}},{key:"updateInterceptors",value:function(){this.reversedInterceptors=this.interceptors.reduce((function(n,e){return[e].concat(n)}),[])}},{key:"clearInterceptors",value:function(){this.interceptors=[],this.updateInterceptors()}},{key:"interceptorWrapper",value:function(n){for(var e=arguments.length,r=Array(e>1?e-1:0),t=1;t<e;t++)r[t-1]=arguments[t];var o=Promise.resolve(r);return this.reversedInterceptors.forEach((function(n){var e=n.request,t=n.requestError;(e||t)&&(o=o.then((function(){return e.apply(void 0,r)}),t))})),o=o.then((function(){return n.apply(void 0,r)})),this.reversedInterceptors.forEach((function(n){var e=n.response,r=n.responseError;(e||r)&&(o=o.then(e,r))})),o}}]),n}(),v=function(){function n(e){var r=e.url,t=e.interceptors,o=e.headers,a=e.onStart,i=e.onEnd,l=e.omitEmptyVariables,s=void 0!==l&&l,c=e.requestOptions,d=void 0===c?{}:c;g(this,n);var u=function(n,e){if(!n)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?n:e}(this,(n.__proto__||Object.getPrototypeOf(n)).call(this));return u.requestObject=Object.assign({},{method:"POST",headers:Object.assign({},{Accept:"application/json","Content-Type":"application/json"},o),credentials:"same-origin"},d),u.url=r,u.omitEmptyVariables=s,u.requestQueueLength=0,u.EnumMap={},u.callbacks={onStart:a,onEnd:i},u.addInterceptors(t),u}return function(n,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);n.prototype=Object.create(e&&e.prototype,{constructor:{value:n,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(n,e):n.__proto__=e)}(n,b),h(n,[{key:"query",value:function(n){var e,r=this,t=n.operationName,o=n.query,a=n.variables,i=n.opts,l=void 0===i?{}:i,s=n.requestOptions,c=Object.assign({},this.requestObject,void 0===s?{}:s);return e=this.omitEmptyVariables||l.omitEmptyVariables?this.doOmitEmptyVariables(a):a,c.body=JSON.stringify({operationName:t,query:o,variables:e}),this.onStart(),this.fetch(this.url,c).then((function(n){return n.ok?n.json():{errors:[{message:n.statusText,stack:n}]}})).then((function(n){var e=n.data,t=n.errors;return new Promise((function(n,o){return r.onEnd(),e?Object.keys(e).every((function(n){return!e[n]}))?o(t):n({data:e,errors:t}):o(t||[{}])}))}))}},{key:"getUrl",value:function(){return this.url}},{key:"setUrl",value:function(n){this.url=n}},{key:"getEnumTypes",value:function(n){var e=this,r={},t=n.filter((function(n){return!e.EnumMap[n]||(r[n]=e.EnumMap[n],!1)}));if(!t.length)return new Promise((function(n){n({data:r})}));var o="\n query {\n "+t.map((function(n){return n+': __type(name: "'+n+'") {\n ...EnumFragment\n }'})).join("\n")+"\n }\n \n fragment EnumFragment on __Type {\n kind\n description\n enumValues {\n name\n description\n }\n }",a=Object.assign({},this.requestObject);return a.body=JSON.stringify({query:o}),this.onStart(),this.fetch(this.url,a).then((function(n){return n.ok?n.json():{errors:[{message:n.statusText,stack:n}]}})).then((function(n){var t=n.data,o=n.errors;return new Promise((function(n,a){if(e.onEnd(),!t)return a(o||[{message:"Do not get any data."}]);if(Object.keys(t).every((function(n){return!t[n]}))&&o&&o.length)return a(o);var i=Object.assign(r,t);return Object.keys(t).map((function(n){return e.EnumMap[n]=t[n],n})),n({data:i,errors:o})}))}))}},{key:"onStart",value:function(){this.requestQueueLength++,this.requestQueueLength>1||!this.callbacks.onStart||this.callbacks.onStart(this.requestQueueLength)}},{key:"onEnd",value:function(){this.requestQueueLength--,!this.requestQueueLength&&this.callbacks.onEnd&&this.callbacks.onEnd(this.requestQueueLength)}},{key:"doOmitEmptyVariables",value:function(n){var e=this,r={};return Object.keys(n).map((function(t){var o=n[t];return"string"==typeof o&&0===o.length||null==o||(r[t]=o instanceof Object?e.doOmitEmptyVariables(o):o),t})),r}}]),n}();const m={loading:!1,error:void 0,data:void 0,pick:0,dealer:void 0},{state:p}=(()=>{const r=((n,e=(n,e)=>n!==e)=>{const r=u(n);let t=new Map(Object.entries(r??{}));const o={dispose:[],get:[],set:[],reset:[]},a=new Map,i=()=>{t=new Map(Object.entries(u(n)??{})),o.reset.forEach((n=>n()))},l=n=>(o.get.forEach((e=>e(n))),t.get(n)),s=(n,r)=>{const a=t.get(n);e(r,a,n)&&(t.set(n,r),o.set.forEach((e=>e(n,r,a))))},c="undefined"==typeof Proxy?{}:new Proxy(r,{get:(n,e)=>l(e),ownKeys:()=>Array.from(t.keys()),getOwnPropertyDescriptor:()=>({enumerable:!0,configurable:!0}),has:(n,e)=>t.has(e),set:(n,e,r)=>(s(e,r),!0)}),d=(n,e)=>(o[n].push(e),()=>{f(o[n],e)});return{state:c,get:l,set:s,on:d,onChange:(e,r)=>{const t=(n,t)=>{n===e&&r(t)},o=()=>r(u(n)[e]),i=d("set",t),l=d("reset",o);return a.set(r,{setHandler:t,resetHandler:o,propName:e}),()=>{i(),l(),a.delete(r)}},use:(...n)=>{const e=n.reduce(((n,e)=>(e.set&&n.push(d("set",e.set)),e.get&&n.push(d("get",e.get)),e.reset&&n.push(d("reset",e.reset)),e.dispose&&n.push(d("dispose",e.dispose)),n)),[]);return()=>e.forEach((n=>n()))},dispose:()=>{o.dispose.forEach((n=>n())),i()},reset:i,forceUpdate:n=>{const e=t.get(n);o.set.forEach((r=>r(n,e,e)))},removeListener:(n,e)=>{const r=a.get(e);r&&r.propName===n&&(f(o.set,r.setHandler),f(o.reset,r.resetHandler),a.delete(e))}}})(m,void 0);return r.use((()=>{if("function"!=typeof n)return{};const r=new Map;return{dispose:()=>r.clear(),get:e=>{const t=n();t&&((n,e,r)=>{const t=n.get(e);t?t.includes(r)||t.push(r):n.set(e,[r])})(r,e,t)},set:n=>{const t=r.get(n);t&&r.set(n,t.filter(e)),d(r)},reset:()=>{r.forEach((n=>n.forEach(e))),d(r)}}})()),r})(),w=(n=!1)=>{p.loading=n,p.error=void 0,p.pick=0,p.data=void 0,p.dealer=void 0},y=n=>{if(n){const{pick:e}=p;p.dealer=null!=e?n.list[e]:void 0,p.data=n,p.loading=!1}else p.data=void 0,p.loading=!1},x=n=>{const{data:e}=p;e&&void 0!==n?(p.pick=n,p.dealer=e.list[n]):(p.pick=0,p.dealer=void 0)};var k=new v({url:"https://gt-forza.vercel.app/graphql"});const j=()=>{w(!0),s(i,0),k.query({operationName:"Uuid",query:"\n query Uuid($count: Int!) {\n uuid(count: $count)\n }\n",variables:{count:1}}).then((n=>{const e=n.data.uuid[0];k.query({operationName:"Solution",query:"\n query Solution($id: String!) {\n solution(id: $id) {\n id\n data {\n dealers {\n dealerId\n name\n vehicles {\n vin\n year\n make\n model\n color\n }\n }\n }\n }\n }\n",variables:{id:e}}).then((n=>{const r=JSON.parse(JSON.stringify(n.data.solution.data.dealers)),t={id:e,list:r};s(a,t),y(t)}))}))},O=()=>{w();const n=l(a),e=l(i);n?(y(n),e&&x(e)):j()},S=j,z=n=>{s(i,n),x(n)},E=(...n)=>n.filter(Boolean).join(" "),N=n=>{const{value:e}=n,{dealerId:t,name:o,vehicles:a}=e||{},i=a?a.length:0;return r("div",{class:E("flex flex-wrap content-center","mb-4 rounded-lg bg-blue-200 p-4","border border-solid border-blue-400")},r("label",{class:"text-xl font-bold"},o?`${o} `:"",r("sup",null,i||"")),r("label",{class:"ml-auto self-center text-right text-sm"},t||""))},$=/^\#[0-9]*/,C=n=>null!=n.match($),I=n=>2554===n,T=n=>n>2010,q=n=>{const{vin:e,make:t,model:o,year:a,color:i}=n.value||{};return r("div",{class:E("flex align-middle","mb-1 rounded-lg p-4","border border-solid",I(a)?"border-clrs-navy bg-clrs-navy text-clrs-white":C(o)?"border-yellow-600 bg-yellow-300":T(a)?"border-green-600 bg-green-200":"border-gray-600 bg-gray-300")},r("div",{class:"mr-1.5 flex flex-col"},r("label",{class:"mb-2 text-xs"},e||""),r("label",{class:"text-lg font-bold"},t||""),r("label",{class:"mb-2 text-sm italic"},o||""),r("label",null,a||"",", ",i||""),r("label",null,I(a)?"- exotic... [ Sierra 117 ]":C(o)?"- track only...":"")),r("proto-ikon-loader",{class:"ikon ml-auto self-center",name:t,label:t.toLowerCase()}))},A=n=>{const{list:e}=n,t=e.length;return 0===t?"":r("div",{class:"flex flex-col"},t?e.map((n=>r(q,{value:n}))):"")},M=n=>{const{dealer:e}=n,{vehicles:t}=e||{vehicles:[]},o=t;return e?r("div",{class:"flex flex-col"},r(N,{value:e}),r(A,{list:o})):""},P="eswat2",J=()=>r("a",{class:"absolute right-0 top-0 text-clrs-gray hover:text-clrs-navy",href:"https://eswat2.dev","aria-label":P,target:"blank",title:P},r("proto-ikon-loader",{name:"fingerprint",size:24,label:"eswat2"})),U=()=>r("div",{class:"mb-4 mr-2 mt-2 flex flex-row"},r("label",{class:"ml-auto align-top text-xs italic text-clrs-slate4"},"Tailwind ","4.1.17")),D=n=>{const{label:e}=n;return r("h1",{class:E("text-center uppercase text-clrs-red","mb-11 ml-0 mr-0 mt-11","text-6xl font-thin")},e)},_=n=>{const e=n.hex||"currentColor",t=n.label||"loading...",o=n.size||24;return r("svg",{class:E(n.class||"","animate-spin"),width:o,height:o,fill:"none",viewBox:"0 0 24 24",role:"img","aria-label":"title"},r("title",null,t),r("g",null,r("circle",{class:"opacity-25",cx:"12",cy:"12",r:"10",stroke:e,"stroke-width":"4"}),r("path",{class:"opacity-75",fill:e,d:"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"})),r("path",{d:"M0 0h24v24H0z",fill:"none"}))},H=()=>{const{loading:n,pick:e,data:t}=p||{},{list:o}=t||{list:[]},a=o.length-1;return n?"":r("div",{class:"flex"},r("div",{class:"refresh hover:text-clrs-red md:w-auto",onClick:()=>S()},r("proto-ikon-loader",{name:"refresh",size:24})),r("div",{class:E("ml-auto inline-flex justify-end","border border-solid border-gray-600","rounded-md")},o.map(((n,t)=>r("button",{class:E("h-8 w-8 border-none font-bold",0==t?"rounded-bl-md rounded-br-none rounded-tl-md rounded-tr-none":t==a?"rounded-bl-none rounded-br-md rounded-tl-none rounded-tr-md":"rounded-none",e==t?"bg-clrs-red text-white":"bg-clrs-yellow text-clrs-navy"),onClick:()=>z(t),title:`${n.name} (${n.vehicles.length})`},t+1)))))},V=class{constructor(n){t(this,n),this.tag="proto-autos"}componentDidLoad(){O()}render(){const{loading:n,dealer:e}=p;return r("main",{key:"eb918bee95389cd4c78c6a7b3134ada507c5a042",id:"app",class:"ds1-main relative"},r(J,{key:"efa617ee04ddd6c58650d1cf4d00f899c3520efa"}),r(D,{key:"6762516c1c9fc2d4490e9343d75f4f09f657fae6",label:"Auto Dealers"}),r(H,{key:"ce1aeeb560729f66726b859d6f9d5a4a410703b1"}),n?r(_,null):r("hr",{class:E("mb-4 ml-0 mr-0 mt-4","border-solid border-gray-300","border-b-0 border-l-0 border-r-0")}),r(M,{key:"63ef8ba16a60533a147c06e126442e9f2481f8fe",dealer:e}),r(U,{key:"00d32c34fcf933386a5e5f920e09f02f95dbfbf1"}))}};V.style="/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */\n@layer properties;\n@layer theme, base, components, utilities;\n@layer theme {\n :root,\n :host {\n --font-sans:\n ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji',\n 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';\n --color-yellow-300: oklch(90.5% 0.182 98.111);\n --color-yellow-600: oklch(68.1% 0.162 75.834);\n --color-green-200: oklch(92.5% 0.084 155.995);\n --color-green-600: oklch(62.7% 0.194 149.214);\n --color-blue-200: oklch(88.2% 0.059 254.128);\n --color-blue-400: oklch(70.7% 0.165 254.624);\n --color-gray-300: oklch(87.2% 0.01 258.338);\n --color-gray-600: oklch(44.6% 0.03 256.802);\n --color-white: #fff;\n --spacing: 0.25rem;\n --text-xs: 0.75rem;\n --text-xs--line-height: calc(1 / 0.75);\n --text-sm: 0.875rem;\n --text-sm--line-height: calc(1.25 / 0.875);\n --text-lg: 1.125rem;\n --text-lg--line-height: calc(1.75 / 1.125);\n --text-xl: 1.25rem;\n --text-xl--line-height: calc(1.75 / 1.25);\n --text-6xl: 3.75rem;\n --text-6xl--line-height: 1;\n --font-weight-thin: 100;\n --font-weight-bold: 700;\n --radius-md: 0.375rem;\n --radius-lg: 0.5rem;\n --animate-spin: spin 1s linear infinite;\n }\n}\n@layer utilities {\n .absolute {\n position: absolute;\n }\n .relative {\n position: relative;\n }\n .top-0 {\n top: calc(var(--spacing) * 0);\n }\n .right-0 {\n right: calc(var(--spacing) * 0);\n }\n .m-6 {\n margin: calc(var(--spacing) * 6);\n }\n .mt-2 {\n margin-top: calc(var(--spacing) * 2);\n }\n .mt-4 {\n margin-top: calc(var(--spacing) * 4);\n }\n .mt-11 {\n margin-top: calc(var(--spacing) * 11);\n }\n .mr-0 {\n margin-right: calc(var(--spacing) * 0);\n }\n .mr-1\\.5 {\n margin-right: calc(var(--spacing) * 1.5);\n }\n .mr-2 {\n margin-right: calc(var(--spacing) * 2);\n }\n .mb-1 {\n margin-bottom: calc(var(--spacing) * 1);\n }\n .mb-2 {\n margin-bottom: calc(var(--spacing) * 2);\n }\n .mb-4 {\n margin-bottom: calc(var(--spacing) * 4);\n }\n .mb-11 {\n margin-bottom: calc(var(--spacing) * 11);\n }\n .ml-0 {\n margin-left: calc(var(--spacing) * 0);\n }\n .ml-auto {\n margin-left: auto;\n }\n .flex {\n display: flex;\n }\n .inline-flex {\n display: inline-flex;\n }\n .h-8 {\n height: calc(var(--spacing) * 8);\n }\n .w-8 {\n width: calc(var(--spacing) * 8);\n }\n .animate-spin {\n animation: var(--animate-spin);\n }\n .flex-col {\n flex-direction: column;\n }\n .flex-row {\n flex-direction: row;\n }\n .flex-wrap {\n flex-wrap: wrap;\n }\n .content-center {\n align-content: center;\n }\n .justify-end {\n justify-content: flex-end;\n }\n .self-center {\n align-self: center;\n }\n .rounded-lg {\n border-radius: var(--radius-lg);\n }\n .rounded-md {\n border-radius: var(--radius-md);\n }\n .rounded-none {\n border-radius: 0;\n }\n .rounded-tl-md {\n border-top-left-radius: var(--radius-md);\n }\n .rounded-tl-none {\n border-top-left-radius: 0;\n }\n .rounded-tr-md {\n border-top-right-radius: var(--radius-md);\n }\n .rounded-tr-none {\n border-top-right-radius: 0;\n }\n .rounded-br-md {\n border-bottom-right-radius: var(--radius-md);\n }\n .rounded-br-none {\n border-bottom-right-radius: 0;\n }\n .rounded-bl-md {\n border-bottom-left-radius: var(--radius-md);\n }\n .rounded-bl-none {\n border-bottom-left-radius: 0;\n }\n .border {\n border-style: var(--tw-border-style);\n border-width: 1px;\n }\n .border-r-0 {\n border-right-style: var(--tw-border-style);\n border-right-width: 0px;\n }\n .border-b-0 {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 0px;\n }\n .border-l-0 {\n border-left-style: var(--tw-border-style);\n border-left-width: 0px;\n }\n .border-none {\n --tw-border-style: none;\n border-style: none;\n }\n .border-solid {\n --tw-border-style: solid;\n border-style: solid;\n }\n .border-blue-400 {\n border-color: var(--color-blue-400);\n }\n .border-clrs-navy {\n border-color: var(--clrs-navy, #001f3f);\n }\n .border-gray-300 {\n border-color: var(--color-gray-300);\n }\n .border-gray-600 {\n border-color: var(--color-gray-600);\n }\n .border-green-600 {\n border-color: var(--color-green-600);\n }\n .border-yellow-600 {\n border-color: var(--color-yellow-600);\n }\n .bg-blue-200 {\n background-color: var(--color-blue-200);\n }\n .bg-clrs-navy {\n background-color: var(--clrs-navy, #001f3f);\n }\n .bg-clrs-red {\n background-color: var(--clrs-red, #ff4136);\n }\n .bg-clrs-yellow {\n background-color: var(--clrs-yellow, #ffdc00);\n }\n .bg-gray-300 {\n background-color: var(--color-gray-300);\n }\n .bg-green-200 {\n background-color: var(--color-green-200);\n }\n .bg-yellow-300 {\n background-color: var(--color-yellow-300);\n }\n .p-4 {\n padding: calc(var(--spacing) * 4);\n }\n .text-center {\n text-align: center;\n }\n .text-right {\n text-align: right;\n }\n .align-middle {\n vertical-align: middle;\n }\n .align-top {\n vertical-align: top;\n }\n .font-sans {\n font-family: var(--font-sans);\n }\n .text-6xl {\n font-size: var(--text-6xl);\n line-height: var(--tw-leading, var(--text-6xl--line-height));\n }\n .text-lg {\n font-size: var(--text-lg);\n line-height: var(--tw-leading, var(--text-lg--line-height));\n }\n .text-sm {\n font-size: var(--text-sm);\n line-height: var(--tw-leading, var(--text-sm--line-height));\n }\n .text-xl {\n font-size: var(--text-xl);\n line-height: var(--tw-leading, var(--text-xl--line-height));\n }\n .text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--line-height));\n }\n .font-bold {\n --tw-font-weight: var(--font-weight-bold);\n font-weight: var(--font-weight-bold);\n }\n .font-thin {\n --tw-font-weight: var(--font-weight-thin);\n font-weight: var(--font-weight-thin);\n }\n .text-clrs-gray {\n color: var(--clrs-gray, #aaaaaa);\n }\n .text-clrs-navy {\n color: var(--clrs-navy, #001f3f);\n }\n .text-clrs-red {\n color: var(--clrs-red, #ff4136);\n }\n .text-clrs-slate4 {\n color: var(--clrs-slate4, #4e5964);\n }\n .text-clrs-white {\n color: var(--clrs-white, #ffffff);\n }\n .text-white {\n color: var(--color-white);\n }\n .uppercase {\n text-transform: uppercase;\n }\n .italic {\n font-style: italic;\n }\n .opacity-25 {\n opacity: 25%;\n }\n .opacity-75 {\n opacity: 75%;\n }\n .shadow {\n --tw-shadow:\n 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)),\n 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow:\n var(--tw-inset-shadow), var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .hover\\:text-clrs-navy {\n &:hover {\n @media (hover: hover) {\n color: var(--clrs-navy, #001f3f);\n }\n }\n }\n .hover\\:text-clrs-red {\n &:hover {\n @media (hover: hover) {\n color: var(--clrs-red, #ff4136);\n }\n }\n }\n .md\\:w-auto {\n @media (width >= 48rem) {\n width: auto;\n }\n }\n}\n@layer components {\n .ds1-main {\n margin: calc(var(--spacing) * 6);\n display: flex;\n flex-direction: column;\n font-family: var(--font-sans);\n color: var(--clrs-navy, #001f3f);\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n }\n}\n.ikon {\n height: 96px;\n width: 96px;\n}\n@media (min-width: 500px) {\n .ikon {\n height: 144px;\n width: 144px;\n }\n}\n@media (min-width: 700px) {\n .ikon {\n height: 192px;\n width: 192px;\n }\n}\n@keyframes spin {\n to {\n transform: rotate(360deg);\n }\n}\n@layer properties {\n @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or\n ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {\n *,\n ::before,\n ::after,\n ::backdrop {\n --tw-border-style: solid;\n --tw-font-weight: initial;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-color: initial;\n --tw-shadow-alpha: 100%;\n --tw-inset-shadow: 0 0 #0000;\n --tw-inset-shadow-color: initial;\n --tw-inset-shadow-alpha: 100%;\n --tw-ring-color: initial;\n --tw-ring-shadow: 0 0 #0000;\n --tw-inset-ring-color: initial;\n --tw-inset-ring-shadow: 0 0 #0000;\n --tw-ring-inset: initial;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-offset-shadow: 0 0 #0000;\n }\n }\n}\n";export{V as proto_autos}
1
+ import{g as n,f as e,h as r,r as t}from"./p-B_Sspfrn.js";const o="proto-autos",a="data",i="pick",l=n=>{const e=localStorage.getItem(n?`${o}-${n}`:o);return e?JSON.parse(e):void 0},s=(n,e)=>{const r=n?`${o}-${n}`:o,t=JSON.stringify(e);localStorage.setItem(r,t)},c=n=>!("isConnected"in n)||n.isConnected,d=(()=>{let n;return(...e)=>{n&&clearTimeout(n),n=setTimeout((()=>{n=0,(n=>{for(let e of n.keys())n.set(e,n.get(e).filter(c))})(...e)}),2e3)}})(),u=n=>"function"==typeof n?n():n,f=(n,e)=>{const r=n.indexOf(e);r>=0&&(n[r]=n[n.length-1],n.length--)};var h=function(){function n(n,e){for(var r=0;r<e.length;r++){var t=e[r];t.enumerable=t.enumerable||!1,t.configurable=!0,"value"in t&&(t.writable=!0),Object.defineProperty(n,t.key,t)}}return function(e,r,t){return r&&n(e.prototype,r),t&&n(e,t),e}}();function g(n,e){if(!(n instanceof e))throw new TypeError("Cannot call a class as a function")}var b=function(){function n(){var e=this;g(this,n),this.interceptors=[],this.fetch=function(){for(var n=arguments.length,r=Array(n),t=0;t<n;t++)r[t]=arguments[t];return e.interceptorWrapper.apply(e,[fetch].concat(r))}}return h(n,[{key:"addInterceptors",value:function(n){var e=this,r=[];return Array.isArray(n)?n.map((function(n){return r.push(e.interceptors.length),e.interceptors.push(n)})):n instanceof Object&&(r.push(this.interceptors.length),this.interceptors.push(n)),this.updateInterceptors(),function(){return e.removeInterceptors(r)}}},{key:"removeInterceptors",value:function(n){var e=this;Array.isArray(n)&&(n.map((function(n){return e.interceptors.splice(n,1)})),this.updateInterceptors())}},{key:"updateInterceptors",value:function(){this.reversedInterceptors=this.interceptors.reduce((function(n,e){return[e].concat(n)}),[])}},{key:"clearInterceptors",value:function(){this.interceptors=[],this.updateInterceptors()}},{key:"interceptorWrapper",value:function(n){for(var e=arguments.length,r=Array(e>1?e-1:0),t=1;t<e;t++)r[t-1]=arguments[t];var o=Promise.resolve(r);return this.reversedInterceptors.forEach((function(n){var e=n.request,t=n.requestError;(e||t)&&(o=o.then((function(){return e.apply(void 0,r)}),t))})),o=o.then((function(){return n.apply(void 0,r)})),this.reversedInterceptors.forEach((function(n){var e=n.response,r=n.responseError;(e||r)&&(o=o.then(e,r))})),o}}]),n}(),v=function(){function n(e){var r=e.url,t=e.interceptors,o=e.headers,a=e.onStart,i=e.onEnd,l=e.omitEmptyVariables,s=void 0!==l&&l,c=e.requestOptions,d=void 0===c?{}:c;g(this,n);var u=function(n,e){if(!n)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?n:e}(this,(n.__proto__||Object.getPrototypeOf(n)).call(this));return u.requestObject=Object.assign({},{method:"POST",headers:Object.assign({},{Accept:"application/json","Content-Type":"application/json"},o),credentials:"same-origin"},d),u.url=r,u.omitEmptyVariables=s,u.requestQueueLength=0,u.EnumMap={},u.callbacks={onStart:a,onEnd:i},u.addInterceptors(t),u}return function(n,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);n.prototype=Object.create(e&&e.prototype,{constructor:{value:n,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(n,e):n.__proto__=e)}(n,b),h(n,[{key:"query",value:function(n){var e,r=this,t=n.operationName,o=n.query,a=n.variables,i=n.opts,l=void 0===i?{}:i,s=n.requestOptions,c=Object.assign({},this.requestObject,void 0===s?{}:s);return e=this.omitEmptyVariables||l.omitEmptyVariables?this.doOmitEmptyVariables(a):a,c.body=JSON.stringify({operationName:t,query:o,variables:e}),this.onStart(),this.fetch(this.url,c).then((function(n){return n.ok?n.json():{errors:[{message:n.statusText,stack:n}]}})).then((function(n){var e=n.data,t=n.errors;return new Promise((function(n,o){return r.onEnd(),e?Object.keys(e).every((function(n){return!e[n]}))?o(t):n({data:e,errors:t}):o(t||[{}])}))}))}},{key:"getUrl",value:function(){return this.url}},{key:"setUrl",value:function(n){this.url=n}},{key:"getEnumTypes",value:function(n){var e=this,r={},t=n.filter((function(n){return!e.EnumMap[n]||(r[n]=e.EnumMap[n],!1)}));if(!t.length)return new Promise((function(n){n({data:r})}));var o="\n query {\n "+t.map((function(n){return n+': __type(name: "'+n+'") {\n ...EnumFragment\n }'})).join("\n")+"\n }\n \n fragment EnumFragment on __Type {\n kind\n description\n enumValues {\n name\n description\n }\n }",a=Object.assign({},this.requestObject);return a.body=JSON.stringify({query:o}),this.onStart(),this.fetch(this.url,a).then((function(n){return n.ok?n.json():{errors:[{message:n.statusText,stack:n}]}})).then((function(n){var t=n.data,o=n.errors;return new Promise((function(n,a){if(e.onEnd(),!t)return a(o||[{message:"Do not get any data."}]);if(Object.keys(t).every((function(n){return!t[n]}))&&o&&o.length)return a(o);var i=Object.assign(r,t);return Object.keys(t).map((function(n){return e.EnumMap[n]=t[n],n})),n({data:i,errors:o})}))}))}},{key:"onStart",value:function(){this.requestQueueLength++,this.requestQueueLength>1||!this.callbacks.onStart||this.callbacks.onStart(this.requestQueueLength)}},{key:"onEnd",value:function(){this.requestQueueLength--,!this.requestQueueLength&&this.callbacks.onEnd&&this.callbacks.onEnd(this.requestQueueLength)}},{key:"doOmitEmptyVariables",value:function(n){var e=this,r={};return Object.keys(n).map((function(t){var o=n[t];return"string"==typeof o&&0===o.length||null==o||(r[t]=o instanceof Object?e.doOmitEmptyVariables(o):o),t})),r}}]),n}();const m={loading:!1,error:void 0,data:void 0,pick:0,dealer:void 0},{state:p}=(()=>{const r=((n,e=(n,e)=>n!==e)=>{const r=u(n);let t=new Map(Object.entries(r??{}));const o={dispose:[],get:[],set:[],reset:[]},a=new Map,i=()=>{t=new Map(Object.entries(u(n)??{})),o.reset.forEach((n=>n()))},l=n=>(o.get.forEach((e=>e(n))),t.get(n)),s=(n,r)=>{const a=t.get(n);e(r,a,n)&&(t.set(n,r),o.set.forEach((e=>e(n,r,a))))},c="undefined"==typeof Proxy?{}:new Proxy(r,{get:(n,e)=>l(e),ownKeys:()=>Array.from(t.keys()),getOwnPropertyDescriptor:()=>({enumerable:!0,configurable:!0}),has:(n,e)=>t.has(e),set:(n,e,r)=>(s(e,r),!0)}),d=(n,e)=>(o[n].push(e),()=>{f(o[n],e)});return{state:c,get:l,set:s,on:d,onChange:(e,r)=>{const t=(n,t)=>{n===e&&r(t)},o=()=>r(u(n)[e]),i=d("set",t),l=d("reset",o);return a.set(r,{setHandler:t,resetHandler:o,propName:e}),()=>{i(),l(),a.delete(r)}},use:(...n)=>{const e=n.reduce(((n,e)=>(e.set&&n.push(d("set",e.set)),e.get&&n.push(d("get",e.get)),e.reset&&n.push(d("reset",e.reset)),e.dispose&&n.push(d("dispose",e.dispose)),n)),[]);return()=>e.forEach((n=>n()))},dispose:()=>{o.dispose.forEach((n=>n())),i()},reset:i,forceUpdate:n=>{const e=t.get(n);o.set.forEach((r=>r(n,e,e)))},removeListener:(n,e)=>{const r=a.get(e);r&&r.propName===n&&(f(o.set,r.setHandler),f(o.reset,r.resetHandler),a.delete(e))}}})(m,void 0);return r.use((()=>{if("function"!=typeof n)return{};const r=new Map;return{dispose:()=>r.clear(),get:e=>{const t=n();t&&((n,e,r)=>{const t=n.get(e);t?t.includes(r)||t.push(r):n.set(e,[r])})(r,e,t)},set:n=>{const t=r.get(n);t&&r.set(n,t.filter(e)),d(r)},reset:()=>{r.forEach((n=>n.forEach(e))),d(r)}}})()),r})(),w=(n=!1)=>{p.loading=n,p.error=void 0,p.pick=0,p.data=void 0,p.dealer=void 0},y=n=>{if(n){const{pick:e}=p;p.dealer=null!=e?n.list[e]:void 0,p.data=n,p.loading=!1}else p.data=void 0,p.loading=!1},x=n=>{const{data:e}=p;e&&void 0!==n?(p.pick=n,p.dealer=e.list[n]):(p.pick=0,p.dealer=void 0)};var k=new v({url:"https://gt-forza.vercel.app/graphql"});const j=()=>{w(!0),s(i,0),k.query({operationName:"Uuid",query:"\n query Uuid($count: Int!) {\n uuid(count: $count)\n }\n",variables:{count:1}}).then((n=>{const e=n.data.uuid[0];k.query({operationName:"Solution",query:"\n query Solution($id: String!) {\n solution(id: $id) {\n id\n data {\n dealers {\n dealerId\n name\n vehicles {\n vin\n year\n make\n model\n color\n }\n }\n }\n }\n }\n",variables:{id:e}}).then((n=>{const r=JSON.parse(JSON.stringify(n.data.solution.data.dealers)),t={id:e,list:r};s(a,t),y(t)}))}))},O=()=>{w();const n=l(a),e=l(i);n?(y(n),e&&x(e)):j()},S=j,z=n=>{s(i,n),x(n)},E=(...n)=>n.filter(Boolean).join(" "),N=n=>{const{value:e}=n,{dealerId:t,name:o,vehicles:a}=e||{},i=a?a.length:0;return r("div",{class:E("flex flex-wrap content-center","mb-4 rounded-lg bg-blue-200 p-4","border border-solid border-blue-400")},r("label",{class:"text-xl font-bold"},o?`${o} `:"",r("sup",null,i||"")),r("label",{class:"ml-auto self-center text-right text-sm"},t||""))},$=/^\#[0-9]*/,C=n=>null!=n.match($),I=n=>2554===n,T=n=>n>2010,q=n=>{const{vin:e,make:t,model:o,year:a,color:i}=n.value||{};return r("div",{class:E("flex align-middle","mb-1 rounded-lg p-4","border border-solid",I(a)?"border-clrs-navy bg-clrs-navy text-clrs-white":C(o)?"border-yellow-600 bg-yellow-300":T(a)?"border-green-600 bg-green-200":"border-gray-600 bg-gray-300")},r("div",{class:"mr-1.5 flex flex-col"},r("label",{class:"mb-2 text-xs"},e||""),r("label",{class:"text-lg font-bold"},t||""),r("label",{class:"mb-2 text-sm italic"},o||""),r("label",null,a||"",", ",i||""),r("label",null,I(a)?"- exotic... [ Sierra 117 ]":C(o)?"- track only...":"")),r("proto-ikon-loader",{class:"ikon ml-auto self-center",name:t,label:t.toLowerCase()}))},A=n=>{const{list:e}=n,t=e.length;return 0===t?"":r("div",{class:"flex flex-col"},t?e.map((n=>r(q,{value:n}))):"")},P=n=>{const{dealer:e}=n,{vehicles:t}=e||{vehicles:[]},o=t;return e?r("div",{class:"flex flex-col"},r(N,{value:e}),r(A,{list:o})):""},M="eswat2",U=()=>r("a",{class:"absolute right-0 top-0 text-clrs-gray hover:text-clrs-navy",href:"https://eswat2.dev","aria-label":M,target:"blank",title:M},r("proto-ikon-loader",{name:"fingerprint",size:24,label:"eswat2"})),J=()=>r("div",{class:"mb-4 mr-2 mt-2 flex flex-row"},r("label",{class:"ml-auto align-top text-xs italic text-clrs-slate4"},"Tailwind ","4.1.17")),_=n=>{const{label:e}=n;return r("h1",{class:E("text-center uppercase text-clrs-red","mb-11 ml-0 mr-0 mt-11","text-6xl font-thin")},e)},D=n=>{const e=n.hex||"currentColor",t=n.label||"loading...",o=n.size||24;return r("svg",{class:E(n.class||"","animate-spin"),width:o,height:o,fill:"none",viewBox:"0 0 24 24",role:"img","aria-label":"title"},r("title",null,t),r("g",null,r("circle",{class:"opacity-25",cx:"12",cy:"12",r:"10",stroke:e,"stroke-width":"4"}),r("path",{class:"opacity-75",fill:e,d:"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"})),r("path",{d:"M0 0h24v24H0z",fill:"none"}))},H=()=>{const{loading:n,pick:e,data:t}=p||{},{list:o}=t||{list:[]},a=o.length-1;return n?"":r("div",{class:"flex"},r("div",{class:"refresh hover:text-clrs-red md:w-auto",onClick:()=>S()},r("proto-ikon-loader",{name:"refresh",size:24})),r("div",{class:E("ml-auto inline-flex justify-end","border border-solid border-gray-600","rounded-md")},o.map(((n,t)=>r("button",{class:E("h-8 w-8 border-none font-bold",0==t?"rounded-bl-md rounded-br-none rounded-tl-md rounded-tr-none":t==a?"rounded-bl-none rounded-br-md rounded-tl-none rounded-tr-md":"rounded-none",e==t?"bg-clrs-red text-white":"bg-clrs-yellow text-clrs-navy"),onClick:()=>z(t),title:`${n.name} (${n.vehicles.length})`},t+1)))))},B=class{constructor(n){t(this,n),this.tag="proto-autos"}componentDidLoad(){O()}render(){const{loading:n,dealer:e}=p;return r("main",{key:"eb918bee95389cd4c78c6a7b3134ada507c5a042",id:"app",class:"ds1-main relative"},r(U,{key:"efa617ee04ddd6c58650d1cf4d00f899c3520efa"}),r(_,{key:"6762516c1c9fc2d4490e9343d75f4f09f657fae6",label:"Auto Dealers"}),r(H,{key:"ce1aeeb560729f66726b859d6f9d5a4a410703b1"}),n?r(D,null):r("hr",{class:E("mb-4 ml-0 mr-0 mt-4","border-solid border-gray-300","border-b-0 border-l-0 border-r-0")}),r(P,{key:"63ef8ba16a60533a147c06e126442e9f2481f8fe",dealer:e}),r(J,{key:"00d32c34fcf933386a5e5f920e09f02f95dbfbf1"}))}};B.style="/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */\n@layer properties;\n@layer theme, base, components, utilities;\n@layer theme {\n :root,\n :host {\n --font-sans:\n ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji',\n 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';\n --color-yellow-300: oklch(90.5% 0.182 98.111);\n --color-yellow-600: oklch(68.1% 0.162 75.834);\n --color-green-200: oklch(92.5% 0.084 155.995);\n --color-green-600: oklch(62.7% 0.194 149.214);\n --color-blue-200: oklch(88.2% 0.059 254.128);\n --color-blue-400: oklch(70.7% 0.165 254.624);\n --color-gray-300: oklch(87.2% 0.01 258.338);\n --color-gray-600: oklch(44.6% 0.03 256.802);\n --color-white: #fff;\n --spacing: 0.25rem;\n --text-xs: 0.75rem;\n --text-xs--line-height: calc(1 / 0.75);\n --text-sm: 0.875rem;\n --text-sm--line-height: calc(1.25 / 0.875);\n --text-lg: 1.125rem;\n --text-lg--line-height: calc(1.75 / 1.125);\n --text-xl: 1.25rem;\n --text-xl--line-height: calc(1.75 / 1.25);\n --text-6xl: 3.75rem;\n --text-6xl--line-height: 1;\n --font-weight-thin: 100;\n --font-weight-bold: 700;\n --radius-md: 0.375rem;\n --radius-lg: 0.5rem;\n --animate-spin: spin 1s linear infinite;\n }\n}\n@layer utilities {\n .absolute {\n position: absolute;\n }\n .relative {\n position: relative;\n }\n .top-0 {\n top: calc(var(--spacing) * 0);\n }\n .right-0 {\n right: calc(var(--spacing) * 0);\n }\n .m-6 {\n margin: calc(var(--spacing) * 6);\n }\n .mt-2 {\n margin-top: calc(var(--spacing) * 2);\n }\n .mt-4 {\n margin-top: calc(var(--spacing) * 4);\n }\n .mt-11 {\n margin-top: calc(var(--spacing) * 11);\n }\n .mr-0 {\n margin-right: calc(var(--spacing) * 0);\n }\n .mr-1.5 {\n margin-right: calc(var(--spacing) * 1.5);\n }\n .mr-2 {\n margin-right: calc(var(--spacing) * 2);\n }\n .mb-1 {\n margin-bottom: calc(var(--spacing) * 1);\n }\n .mb-2 {\n margin-bottom: calc(var(--spacing) * 2);\n }\n .mb-4 {\n margin-bottom: calc(var(--spacing) * 4);\n }\n .mb-11 {\n margin-bottom: calc(var(--spacing) * 11);\n }\n .ml-0 {\n margin-left: calc(var(--spacing) * 0);\n }\n .ml-auto {\n margin-left: auto;\n }\n .flex {\n display: flex;\n }\n .inline-flex {\n display: inline-flex;\n }\n .h-8 {\n height: calc(var(--spacing) * 8);\n }\n .w-8 {\n width: calc(var(--spacing) * 8);\n }\n .animate-spin {\n animation: var(--animate-spin);\n }\n .flex-col {\n flex-direction: column;\n }\n .flex-row {\n flex-direction: row;\n }\n .flex-wrap {\n flex-wrap: wrap;\n }\n .content-center {\n align-content: center;\n }\n .justify-end {\n justify-content: flex-end;\n }\n .self-center {\n align-self: center;\n }\n .rounded-lg {\n border-radius: var(--radius-lg);\n }\n .rounded-md {\n border-radius: var(--radius-md);\n }\n .rounded-none {\n border-radius: 0;\n }\n .rounded-tl-md {\n border-top-left-radius: var(--radius-md);\n }\n .rounded-tl-none {\n border-top-left-radius: 0;\n }\n .rounded-tr-md {\n border-top-right-radius: var(--radius-md);\n }\n .rounded-tr-none {\n border-top-right-radius: 0;\n }\n .rounded-br-md {\n border-bottom-right-radius: var(--radius-md);\n }\n .rounded-br-none {\n border-bottom-right-radius: 0;\n }\n .rounded-bl-md {\n border-bottom-left-radius: var(--radius-md);\n }\n .rounded-bl-none {\n border-bottom-left-radius: 0;\n }\n .border {\n border-style: var(--tw-border-style);\n border-width: 1px;\n }\n .border-r-0 {\n border-right-style: var(--tw-border-style);\n border-right-width: 0px;\n }\n .border-b-0 {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 0px;\n }\n .border-l-0 {\n border-left-style: var(--tw-border-style);\n border-left-width: 0px;\n }\n .border-none {\n --tw-border-style: none;\n border-style: none;\n }\n .border-solid {\n --tw-border-style: solid;\n border-style: solid;\n }\n .border-blue-400 {\n border-color: var(--color-blue-400);\n }\n .border-clrs-navy {\n border-color: var(--clrs-navy, #001f3f);\n }\n .border-gray-300 {\n border-color: var(--color-gray-300);\n }\n .border-gray-600 {\n border-color: var(--color-gray-600);\n }\n .border-green-600 {\n border-color: var(--color-green-600);\n }\n .border-yellow-600 {\n border-color: var(--color-yellow-600);\n }\n .bg-blue-200 {\n background-color: var(--color-blue-200);\n }\n .bg-clrs-navy {\n background-color: var(--clrs-navy, #001f3f);\n }\n .bg-clrs-red {\n background-color: var(--clrs-red, #ff4136);\n }\n .bg-clrs-yellow {\n background-color: var(--clrs-yellow, #ffdc00);\n }\n .bg-gray-300 {\n background-color: var(--color-gray-300);\n }\n .bg-green-200 {\n background-color: var(--color-green-200);\n }\n .bg-yellow-300 {\n background-color: var(--color-yellow-300);\n }\n .p-4 {\n padding: calc(var(--spacing) * 4);\n }\n .text-center {\n text-align: center;\n }\n .text-right {\n text-align: right;\n }\n .align-middle {\n vertical-align: middle;\n }\n .align-top {\n vertical-align: top;\n }\n .font-sans {\n font-family: var(--font-sans);\n }\n .text-6xl {\n font-size: var(--text-6xl);\n line-height: var(--tw-leading, var(--text-6xl--line-height));\n }\n .text-lg {\n font-size: var(--text-lg);\n line-height: var(--tw-leading, var(--text-lg--line-height));\n }\n .text-sm {\n font-size: var(--text-sm);\n line-height: var(--tw-leading, var(--text-sm--line-height));\n }\n .text-xl {\n font-size: var(--text-xl);\n line-height: var(--tw-leading, var(--text-xl--line-height));\n }\n .text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--line-height));\n }\n .font-bold {\n --tw-font-weight: var(--font-weight-bold);\n font-weight: var(--font-weight-bold);\n }\n .font-thin {\n --tw-font-weight: var(--font-weight-thin);\n font-weight: var(--font-weight-thin);\n }\n .text-clrs-gray {\n color: var(--clrs-gray, #aaaaaa);\n }\n .text-clrs-navy {\n color: var(--clrs-navy, #001f3f);\n }\n .text-clrs-red {\n color: var(--clrs-red, #ff4136);\n }\n .text-clrs-slate4 {\n color: var(--clrs-slate4, #4e5964);\n }\n .text-clrs-white {\n color: var(--clrs-white, #ffffff);\n }\n .text-white {\n color: var(--color-white);\n }\n .uppercase {\n text-transform: uppercase;\n }\n .italic {\n font-style: italic;\n }\n .opacity-25 {\n opacity: 25%;\n }\n .opacity-75 {\n opacity: 75%;\n }\n .shadow {\n --tw-shadow:\n 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)),\n 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow:\n var(--tw-inset-shadow), var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .hover:text-clrs-navy {\n &:hover {\n @media (hover: hover) {\n color: var(--clrs-navy, #001f3f);\n }\n }\n }\n .hover:text-clrs-red {\n &:hover {\n @media (hover: hover) {\n color: var(--clrs-red, #ff4136);\n }\n }\n }\n .md:w-auto {\n @media (width >= 48rem) {\n width: auto;\n }\n }\n}\n@layer components {\n .ds1-main {\n margin: calc(var(--spacing) * 6);\n display: flex;\n flex-direction: column;\n font-family: var(--font-sans);\n color: var(--clrs-navy, #001f3f);\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n }\n}\n.ikon {\n height: 96px;\n width: 96px;\n}\n@media (min-width: 500px) {\n .ikon {\n height: 144px;\n width: 144px;\n }\n}\n@media (min-width: 700px) {\n .ikon {\n height: 192px;\n width: 192px;\n }\n}\n@keyframes spin {\n to {\n transform: rotate(360deg);\n }\n}\n@layer properties {\n @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or\n ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {\n *,\n ::before,\n ::after,\n ::backdrop {\n --tw-border-style: solid;\n --tw-font-weight: initial;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-color: initial;\n --tw-shadow-alpha: 100%;\n --tw-inset-shadow: 0 0 #0000;\n --tw-inset-shadow-color: initial;\n --tw-inset-shadow-alpha: 100%;\n --tw-ring-color: initial;\n --tw-ring-shadow: 0 0 #0000;\n --tw-inset-ring-color: initial;\n --tw-inset-ring-shadow: 0 0 #0000;\n --tw-ring-inset: initial;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-offset-shadow: 0 0 #0000;\n }\n }\n}\n";export{B as proto_autos}
@@ -1 +1 @@
1
- import{p as t,b as o}from"./p-DWVetjJM.js";export{s as setNonce}from"./p-DWVetjJM.js";import{g as a}from"./p-DQuL1Twl.js";(()=>{const o=import.meta.url,s={};return""!==o&&(s.resourcesUrl=new URL(".",o).href),t(s)})().then((async t=>(await a(),o([["p-480d7794",[[257,"proto-autos",{tag:[1]}]]]],t))));
1
+ import{p as o,b as p}from"./p-B_Sspfrn.js";export{s as setNonce}from"./p-B_Sspfrn.js";import{g as r}from"./p-DQuL1Twl.js";(()=>{const s=import.meta.url,p={};return""!==s&&(p.resourcesUrl=new URL(".",s).href),o(p)})().then((async s=>(await r(),p([["p-51d95483",[[257,"proto-autos",{tag:[1]}]]]],s))));
@@ -125,6 +125,9 @@ export interface AttachInternalsDecorator {
125
125
  export interface ListenDecorator {
126
126
  (eventName: string, opts?: ListenOptions): CustomMethodDecorator<any>;
127
127
  }
128
+ export interface ResolveVarFunction {
129
+ <T>(variable: T): string;
130
+ }
128
131
  export interface ListenOptions {
129
132
  /**
130
133
  * Handlers can also be registered for an event other than the host itself.
@@ -208,6 +211,24 @@ export declare const AttachInternals: AttachInternalsDecorator;
208
211
  * https://stenciljs.com/docs/events#listen-decorator
209
212
  */
210
213
  export declare const Listen: ListenDecorator;
214
+ /**
215
+ * The `resolveVar()` function is a compile-time utility that resolves const variables
216
+ * and object properties to their string literal values. This allows variables to be
217
+ * used in `@Listen` and `@Event` decorators instead of hardcoded strings.
218
+ *
219
+ * @example
220
+ * ```ts
221
+ * const MY_EVENT = 'myEvent';
222
+ * @Listen(resolveVar(MY_EVENT))
223
+ * ```
224
+ *
225
+ * @example
226
+ * ```ts
227
+ * const EVENTS = { MY_EVENT: 'myEvent' } as const;
228
+ * @Event({ eventName: resolveVar(EVENTS.MY_EVENT) })
229
+ * ```
230
+ */
231
+ export declare const resolveVar: ResolveVarFunction;
211
232
  /**
212
233
  * The `@Method()` decorator is used to expose methods on the public API.
213
234
  * Class methods decorated with the @Method() decorator can be called directly
@@ -365,6 +386,27 @@ export declare function readTask(task: RafCallback): void;
365
386
  * Unhandled exception raised while rendering, during event handling, or lifecycles will trigger the custom event handler.
366
387
  */
367
388
  export declare const setErrorHandler: (handler: ErrorHandler) => void;
389
+ export type TagTransformer = (tag: string) => string;
390
+ /**
391
+ * Sets a tag transformer to be used when rendering your custom elements.
392
+ * ```ts
393
+ * setTagTransformer((tag) => {
394
+ * if (tag.startsWith('my-')) return `new-${tag}`
395
+ * return tag;
396
+ * });
397
+ * ```
398
+ * Will mean all your components that start with `my-` are defined instead with `new-my-` prefix.
399
+ *
400
+ * @param transformer the transformer function to use which must return a string.
401
+ */
402
+ export declare function setTagTransformer(transformer: TagTransformer): void;
403
+ /**
404
+ * Transforms a tag name using a transformer set via `setTagTransformer`
405
+ *
406
+ * @param tag - the tag to transform e.g. `my-tag`
407
+ * @returns the transformed tag e.g. `new-my-tag`
408
+ */
409
+ export declare function transformTag(tag: string): string;
368
410
  /**
369
411
  * @deprecated - Use `MixedInCtor` instead:
370
412
  * ```ts
@@ -1747,6 +1789,7 @@ export interface CustomElementsDefineOptions {
1747
1789
  exclude?: string[];
1748
1790
  resourcesUrl?: string;
1749
1791
  syncQueue?: boolean;
1792
+ /** @deprecated in-favour of `setTagTransformer` and `transformTag` */
1750
1793
  transformTagName?: (tagName: string) => string;
1751
1794
  jmp?: (c: Function) => any;
1752
1795
  raf?: (c: FrameRequestCallback) => number;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "proto-autos-wc",
3
- "version": "0.1.117",
3
+ "version": "0.1.118",
4
4
  "description": "prototype - a simple GraphQL demo rendered in Stencil and Tailwind",
5
5
  "main": "dist/index.cjs.js",
6
6
  "module": "dist/index.js",
@@ -27,7 +27,7 @@
27
27
  "format": "prettier --write src cSpell.json"
28
28
  },
29
29
  "dependencies": {
30
- "@stencil/core": "4.38.3",
30
+ "@stencil/core": "4.39.0",
31
31
  "@stencil/store": "2.2.1",
32
32
  "fetchql": "3.0.0"
33
33
  },