@incodetech/web 2.0.0-alpha.11 → 2.0.0-alpha.12

package/dist/selfie/styles.css

@@ -45,6 +45,10 @@
 @layer incode-theme;
 
 @layer incode-utilities {
+  .visible {
+    visibility: visible;
+  }
+
   .absolute {
     position: absolute;
   }
@@ -149,6 +153,16 @@
 
 @layer incode-base, incode-components;
 
+@keyframes slideUp {
+  from {
+    transform: translateY(100%);
+  }
+
+  to {
+    transform: translateY(0);
+  }
+}
+
 .IncodeCameraButton {
   justify-content: center;
   align-items: center;
@@ -246,6 +260,18 @@
   fill: var(--color-spinner-surface-secondary, var(--spinner-surface-secondary));
 }
 
+@keyframes fadeInScale {
+  from {
+    opacity: 0;
+    transform: scale(.95);
+  }
+
+  to {
+    opacity: 1;
+    transform: scale(1);
+  }
+}
+
 .IncodeCaptureSuccessPage .IncodeCaptureSuccessContainer {
   flex-direction: column;
   flex: 1;
@@ -327,6 +353,11 @@
 
 .IncodeErrorModalContent .IncodeErrorModalContentAttemptsText {
   text-align: center;
+  font-family: var(--primitive-typography-family-dm-sans);
+  font-size: var(--typography-body-lg-size);
+  font-weight: var(--typography-body-lg-weight);
+  line-height: var(--typography-body-lg-line-height);
+  letter-spacing: var(--typography-body-lg-letter-spacing);
   font-size: var(--text-lg, 1.125rem);
   line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
   --tw-leading: 114%;
@@ -397,6 +428,18 @@
   color: var(--color-text-body-primary, var(--text-body-primary));
 }
 
+.IncodeSelfieTutorial {
+  --brand-color: var(--surface-brand-500);
+}
+
+.IncodeSelfieTutorial .IncodeBaseTutorialAnimation svg linearGradient#__lottie_element_29 stop {
+  stop-color: var(--brand-color);
+}
+
+.IncodeSelfieTutorial .IncodeBaseTutorialAnimation svg > g > g > g:first-child > g:first-child > g > g > g:nth-child(2) > g:nth-child(3) > g > path, .IncodeSelfieTutorial .IncodeBaseTutorialAnimation svg > g > g > g:first-child > g:first-child > g > g > g:nth-child(2) > g:first-child > g > path {
+  fill: var(--brand-color);
+}
+
 @property --tw-rotate-x {
   syntax: "*";
   inherits: false

package/dist/selfieTutorial-Dm_p0ke9.js

@@ -0,0 +1,29 @@
+const i = "5.7.5", x = 100, o = 0, r = 398, y = 296, p = 296, a = "Comp 1", e = 0, t = {}, s = /* @__PURE__ */ JSON.parse('[{"id":"0","layers":[{"ddd":0,"refId":"1","w":297,"h":296,"ind":1,"ty":0,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":2}},"ao":0,"ip":0,"op":399,"st":0},{"ddd":0,"refId":"2","w":296,"h":296,"ind":2,"ty":0,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":2}},"ao":0,"ip":0,"op":399,"st":0}]},{"id":"3","layers":[{"ddd":0,"refId":"4","w":296,"h":296,"ind":3,"ty":0,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":2}},"ao":0,"ip":0,"op":399,"st":0},{"ddd":0,"ind":4,"ty":4,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":2}},"ao":0,"shapes":[{"ty":"rc","d":1,"s":{"a":0,"k":[297,296],"ix":2},"p":{"a":0,"k":[148.5,148],"ix":2},"r":{"a":0,"k":0,"ix":2}},{"ty":"fl","c":{"a":0,"k":[0,0,0],"ix":2},"o":{"a":0,"k":0,"ix":2},"r":1,"bm":0}],"ip":0,"op":399,"st":0}]},{"id":"1","layers":[{"ddd":0,"refId":"5","w":296,"h":296,"ind":5,"ty":0,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":2}},"ao":0,"ip":0,"op":399,"st":0,"td":1},{"ddd":0,"refId":"3","w":297,"h":296,"ind":1,"ty":0,"sr":1,"ks":{"p":{"a":0,"k":[148.5,148],"ix":2},"a":{"a":0,"k":[148.5,148],"ix":2},"o":{"a":0,"k":100,"ix":2}},"ao":0,"ip":0,"op":399,"st":0,"tt":1}]},{"id":"4","layers":[{"ddd":0,"ind":6,"ty":4,"nm":"gradient-layer","sr":1,"ks":{"o":{"a":0,"k":100,"ix":2}},"ao":0,"shapes":[{"ty":"gr","nm":"gradient-group","it":[{"ty":"gr","it":[{"ty":"gr","it":[{"ty":"sh","d":1,"ks":{"a":0,"k":{"c":true,"v":[[148,287],[148,287],[148,287],[9,148],[148,9],[287,148],[148,287]],"i":[[0,0],[0,0],[0,0],[0,76.768],[-76.768,0],[0,-76.768],[76.768,0]],"o":[[0,0],[0,0],[-76.768,0],[0,-76.768],[76.768,0],[0,76.768],[0,0]]}}},{"ty":"tr","o":{"a":0,"k":100,"ix":2}}]},{"ty":"gr","it":[{"ty":"sh","d":1,"ks":{"a":0,"k":{"c":true,"v":[[148,296],[296,148],[148,0],[0,148],[148,296],[148,296],[148,296]],"i":[[0,0],[0,81.738],[81.738,0],[0,-81.738],[-81.738,0],[0,0],[0,0]],"o":[[81.738,0],[0,-81.738],[-81.738,0],[0,81.738],[0,0],[0,0],[0,0]]}}},{"ty":"tr","o":{"a":0,"k":100,"ix":2}}]},{"ty":"gf","nm":"brand-gradient","o":{"a":0,"k":100,"ix":2},"r":1,"bm":0,"g":{"p":2,"k":{"a":0,"k":[0,0,0.48,1,1,0,0.48,1,0,1,1,0],"ix":2}},"s":{"a":0,"k":[24.52,30.76],"ix":2},"e":{"a":0,"k":[217.54,256.77],"ix":2},"t":1},{"ty":"tr","o":{"a":0,"k":100,"ix":2}}]},{"ty":"tr","p":{"a":0,"k":[148,148],"ix":2},"a":{"a":0,"k":[148,148],"ix":2},"r":{"a":1,"k":[{"t":0,"s":[0],"i":{"x":[0.75],"y":[0.75]},"o":{"x":[0.25],"y":[0.25]}},{"t":200,"s":[360],"i":{"x":[0.75],"y":[0.75]},"o":{"x":[0.25],"y":[0.25]}},{"t":400,"s":[720]}],"ix":2},"o":{"a":0,"k":100,"ix":2}}]}],"ip":0,"op":399,"st":0}]},{"id":"5","layers":[{"ddd":0,"ind":7,"ty":4,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":2}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"sh","d":1,"ks":{"a":0,"k":{"c":true,"v":[[0.01,0],[295.99,0],[296,0.01],[296,295.99],[295.99,296],[0.01,296],[0,295.99],[0,0.01],[0.01,0],[0.01,0],[0.01,0]],"i":[[0,0],[0,0],[0,-0.005],[0,0],[0.005,0],[0,0],[0,0.005],[0,0],[-0.005,0],[0,0],[0,0]],"o":[[0,0],[0.006,0],[0,0],[0,0.006],[0,0],[-0.006,0],[0,0],[0,-0.006],[0,0],[0,0],[0,0]]}}},{"ty":"fl","c":{"a":0,"k":[0,1,0],"ix":2},"o":{"a":0,"k":100,"ix":2},"r":1,"bm":0},{"ty":"tr","p":{"a":0,"k":[148,148],"ix":2},"a":{"a":0,"k":[148,148],"ix":2},"o":{"a":0,"k":100,"ix":2}}]}],"ip":0,"op":399,"st":0}]},{"id":"2","layers":[{"ddd":0,"ind":8,"ty":3,"sr":1,"ks":{"p":{"a":0,"k":[25,148],"ix":2},"a":{"a":0,"k":[1,124],"ix":2},"o":{"a":0,"k":100,"ix":2}},"ao":0,"ip":0,"op":399,"st":0},{"ddd":0,"ind":9,"ty":3,"sr":1,"ks":{"p":{"a":1,"k":[{"t":67,"s":[1,124],"i":{"x":[0.15],"y":[1]},"o":{"x":[0.5],"y":[0.35]}},{"t":157,"s":[244,124],"i":{"x":[0.15],"y":[1]},"o":{"x":[0.5],"y":[0.35]}},{"t":241,"s":[1,124]}],"ix":2},"a":{"a":0,"k":[20,20],"ix":2},"s":{"a":1,"k":[{"t":67,"s":[150,288],"i":{"x":[0.15],"y":[1]},"o":{"x":[0.5],"y":[0.35]}},{"t":96,"s":[150,622],"i":{"x":[0.15],"y":[1]},"o":{"x":[0.5],"y":[0.35]}},{"t":157,"s":[150,232],"i":{"x":[0.15],"y":[1]},"o":{"x":[0.5],"y":[0.35]}},{"t":184,"s":[150,666],"i":{"x":[0.15],"y":[1]},"o":{"x":[0.5],"y":[0.35]}},{"t":241,"s":[150,288]}],"ix":2},"o":{"a":0,"k":100,"ix":2}},"ao":0,"ip":0,"op":399,"st":0,"parent":8},{"ddd":0,"ind":10,"ty":3,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":2}},"ao":0,"ip":0,"op":399,"st":0,"parent":9},{"ddd":0,"ind":11,"ty":4,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":2}},"td":1,"ao":0,"parent":10,"shapes":[{"ty":"gr","it":[{"ty":"sh","d":1,"ks":{"a":0,"k":{"c":true,"v":[[40,20],[20,40],[0,20],[20,0],[40,20],[40,20],[40,20]],"i":[[0,0],[11.046,0],[0,11.046],[-11.046,0],[0,-11.046],[0,0],[0,0]],"o":[[0,11.046],[-11.046,0],[0,-11.046],[11.046,0],[0,0],[0,0],[0,0]]}}},{"ty":"fl","c":{"a":0,"k":[0,0,0],"ix":2},"o":{"a":0,"k":100,"ix":2},"r":1,"bm":0},{"ty":"tr","o":{"a":1,"k":[{"t":67,"s":[0],"i":{"x":[0.15],"y":[1]},"o":{"x":[0.5],"y":[0.35]}},{"t":96,"s":[100],"i":{"x":[0.15],"y":[1]},"o":{"x":[0.5],"y":[0.35]}},{"t":157,"s":[0],"i":{"x":[0.15],"y":[1]},"o":{"x":[0.5],"y":[0.35]}},{"t":184,"s":[100],"i":{"x":[0.15],"y":[1]},"o":{"x":[0.5],"y":[0.35]}},{"t":241,"s":[0]}],"ix":2}}]}],"ip":0,"op":399,"st":0},{"ddd":0,"refId":"6","w":41,"h":40,"ind":12,"ty":0,"sr":1,"ks":{"p":{"a":0,"k":[0,0],"ix":2},"o":{"a":0,"k":100,"ix":2}},"ao":0,"ip":0,"op":399,"st":0,"parent":10,"tt":1},{"ddd":0,"refId":"7","w":297,"h":296,"ind":13,"ty":0,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":2}},"ao":0,"ip":0,"op":399,"st":0}]},{"id":"6","layers":[{"ddd":0,"ind":14,"ty":3,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":2}},"ao":0,"ip":0,"op":399,"st":0},{"ddd":0,"ind":15,"ty":4,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":2}},"ao":0,"parent":14,"shapes":[{"ty":"gr","it":[{"ty":"gr","it":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[81.6,81.6],"ix":2},"p":{"a":0,"k":[20,19.21],"ix":2},"r":{"a":0,"k":0,"ix":2}},{"ty":"tr","o":{"a":0,"k":100,"ix":2}}]},{"ty":"gf","o":{"a":0,"k":100,"ix":2},"r":1,"bm":0,"g":{"p":6,"k":{"a":0,"k":[0,1,1,1,0.115,1,1,1,0.2094,1,1,1,0.7074,1,1,1,0.8664,1,1,1,1,1,1,1,0,1,0.115,1,0.2094,0.88,0.708,0.23,0.8664,0.08,1,0],"ix":2}},"s":{"a":0,"k":[20,19.21],"ix":2},"e":{"a":0,"k":[20,0.88],"ix":2},"t":2},{"ty":"tr","p":{"a":0,"k":[20,19.21],"ix":2},"a":{"a":0,"k":[20,19.21],"ix":2},"o":{"a":0,"k":100,"ix":2}}]},{"ty":"tr","o":{"a":1,"k":[{"t":67,"s":[0],"i":{"x":[0.15],"y":[1]},"o":{"x":[0.5],"y":[0.35]}},{"t":96,"s":[100],"i":{"x":[0.15],"y":[1]},"o":{"x":[0.5],"y":[0.35]}},{"t":157,"s":[0],"i":{"x":[0.15],"y":[1]},"o":{"x":[0.5],"y":[0.35]}},{"t":184,"s":[100],"i":{"x":[0.15],"y":[1]},"o":{"x":[0.5],"y":[0.35]}},{"t":241,"s":[0]}],"ix":2}}]}],"ip":0,"op":399,"st":0},{"ddd":0,"ind":16,"ty":4,"sr":1,"ks":{"o":{"a":1,"k":[{"t":67,"s":[0],"i":{"x":[0.15],"y":[1]},"o":{"x":[0.5],"y":[0.35]}},{"t":96,"s":[100],"i":{"x":[0.15],"y":[1]},"o":{"x":[0.5],"y":[0.35]}},{"t":157,"s":[0],"i":{"x":[0.15],"y":[1]},"o":{"x":[0.5],"y":[0.35]}},{"t":184,"s":[100],"i":{"x":[0.15],"y":[1]},"o":{"x":[0.5],"y":[0.35]}},{"t":241,"s":[0]}],"ix":2}},"ao":0,"parent":14,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[41,40],"ix":2},"p":{"a":0,"k":[20.5,20],"ix":2},"r":{"a":0,"k":0,"ix":2}},{"ty":"gf","o":{"a":0,"k":100,"ix":2},"r":1,"bm":0,"g":{"p":1,"k":{"a":0,"k":[0,1,1,1,0,0],"ix":2}},"s":{"a":0,"k":[0,0],"ix":2},"e":{"a":0,"k":[0,0],"ix":2},"t":2},{"ty":"tr","o":{"a":0,"k":0,"ix":2}}]}],"ip":0,"op":399,"st":0}]},{"id":"8","layers":[{"ddd":0,"refId":"9","w":296,"h":296,"ind":17,"ty":0,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":2}},"ao":0,"ip":0,"op":399,"st":0},{"ddd":0,"ind":18,"ty":4,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":2}},"ao":0,"shapes":[{"ty":"rc","d":1,"s":{"a":0,"k":[297,296],"ix":2},"p":{"a":0,"k":[148.5,148],"ix":2},"r":{"a":0,"k":0,"ix":2}},{"ty":"fl","c":{"a":0,"k":[0,0,0],"ix":2},"o":{"a":0,"k":0,"ix":2},"r":1,"bm":0}],"ip":0,"op":399,"st":0}]},{"id":"7","layers":[{"ddd":0,"refId":"a","w":296,"h":296,"ind":19,"ty":0,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":2}},"ao":0,"ip":0,"op":399,"st":0,"td":1},{"ddd":0,"refId":"8","w":297,"h":296,"ind":13,"ty":0,"sr":1,"ks":{"p":{"a":0,"k":[148.5,148],"ix":2},"a":{"a":0,"k":[148.5,148],"ix":2},"o":{"a":0,"k":100,"ix":2}},"ao":0,"ip":0,"op":399,"st":0,"tt":1}]},{"id":"9","layers":[{"ddd":0,"ind":20,"ty":4,"nm":"path-layer-1","sr":1,"ks":{"o":{"a":0,"k":100,"ix":2}},"ao":0,"shapes":[{"ty":"gr","nm":"path-group-1","it":[{"ty":"sh","d":1,"ks":{"a":0,"k":{"c":true,"v":[[107.26,76.68],[53.63,152.01],[0,76.68],[53.63,0],[107.26,76.68],[107.26,76.68],[107.26,76.68]],"i":[[0,0],[23.508,0],[0,41.605],[-50.67,0],[0,-37.926],[0,0],[0,0]],"o":[[0,41.605],[-25.712,0],[0,-37.069],[50.67,0],[0,0],[0,0],[0,0]]}}},{"ty":"gf","o":{"a":0,"k":100,"ix":2},"r":1,"bm":0,"g":{"p":2,"k":{"a":0,"k":[0,0.88,0.88,0.88,1,1,1,1,0,1,1,1],"ix":2}},"s":{"a":0,"k":[6.59,75.3],"ix":2},"e":{"a":0,"k":[82.34,75.58],"ix":2},"t":1},{"ty":"tr","p":{"a":0,"k":[148.76,127.48],"ix":2},"a":{"a":0,"k":[53.63,76.01],"ix":2},"o":{"a":0,"k":100,"ix":2}}]}],"ip":0,"op":399,"st":0},{"ddd":0,"ind":21,"ty":4,"nm":"path-layer-2","sr":1,"ks":{"o":{"a":0,"k":100,"ix":2}},"ao":0,"shapes":[{"ty":"gr","nm":"path-group-2","it":[{"ty":"sh","d":1,"ks":{"a":0,"k":{"c":true,"v":[[3.84,2.75],[14.35,5.1],[14.35,33.99],[8.44,37.86],[0.88,19.15],[3.84,2.75],[3.84,2.75],[3.84,2.75]],"i":[[0,0],[-1.643,-3.254],[0,0],[3.943,0],[0.657,5.076],[-5.587,7.419],[0,0],[0,0]],"o":[[4.469,-5.935],[0,0],[-0.329,2.473],[-4.929,0],[-0.657,-5.076],[0,0],[0,0],[0,0]]}}},{"ty":"gf","o":{"a":0,"k":100,"ix":2},"r":1,"bm":0,"g":{"p":3,"k":{"a":0,"k":[0.0417,0.71,0.71,0.71,0.3625,0.89,0.89,0.89,1,1,1,1,0.0417,1,0.363,1,1,1],"ix":2}},"s":{"a":0,"k":[12.9,18.51],"ix":2},"e":{"a":0,"k":[3.47,19.47],"ix":2},"t":1},{"ty":"tr","p":{"a":0,"k":[205.77,140.44],"ix":2},"a":{"a":0,"k":[7.18,18.93],"ix":2},"s":{"a":0,"k":[99.62,-100.33],"ix":2},"r":{"a":0,"k":174.07,"ix":2},"o":{"a":0,"k":100,"ix":2},"sk":{"a":0,"k":-1.809999861760291,"ix":2},"sa":{"a":0,"k":0,"ix":2}}]}],"ip":0,"op":399,"st":0},{"ddd":0,"ind":22,"ty":4,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":2}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"sh","d":1,"ks":{"a":0,"k":{"c":true,"v":[[3.84,2.75],[14.35,5.1],[14.35,33.99],[8.44,37.86],[0.88,19.15],[3.84,2.75],[3.84,2.75],[3.84,2.75]],"i":[[0,0],[-1.643,-3.254],[0,0],[3.943,0],[0.657,5.076],[-5.587,7.419],[0,0],[0,0]],"o":[[4.469,-5.935],[0,0],[-0.329,2.473],[-4.929,0],[-0.657,-5.076],[0,0],[0,0],[0,0]]}}},{"ty":"gf","o":{"a":0,"k":100,"ix":2},"r":1,"bm":0,"g":{"p":3,"k":{"a":0,"k":[0.1719,0.742,0.742,0.742,0.6406,0.883,0.883,0.883,1,0.87,0.87,0.87,0.1719,1,0.641,1,1,1],"ix":2}},"s":{"a":0,"k":[12.9,18.51],"ix":2},"e":{"a":0,"k":[3.47,19.47],"ix":2},"t":1},{"ty":"tr","p":{"a":0,"k":[93.38,137.48],"ix":2},"a":{"a":0,"k":[7.18,18.93],"ix":2},"s":{"a":0,"k":[99.65,100.3],"ix":2},"r":{"a":0,"k":-5.38,"ix":2},"o":{"a":0,"k":100,"ix":2},"sk":{"a":0,"k":1.809999894378744,"ix":2},"sa":{"a":0,"k":0,"ix":2}}]}],"ip":0,"op":399,"st":0},{"ddd":0,"ind":23,"ty":4,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":2}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"sh","d":1,"ks":{"a":0,"k":{"c":true,"v":[[176.96,14.26],[88.3,51.56],[0,14.61],[42.84,0.01],[86.68,22.29],[134.95,0],[176.96,14.26],[176.96,14.26],[176.96,14.26]],"i":[[0,0],[34.738,0],[22.487,22.808],[0,0],[-18.981,-0.465],[-6.567,12.387],[-21.056,-8.556],[0,0],[0,0]],"o":[[-22.512,23.016],[-34.56,0],[21.33,-8.748],[6.317,11.412],[20.597,0.505],[0,0],[0,0],[0,0],[0,0]]}}},{"ty":"fl","c":{"a":0,"k":[0,0.48,1],"ix":2},"o":{"a":0,"k":100,"ix":2},"r":1,"bm":0},{"ty":"tr","p":{"a":0,"k":[148.17,246.22],"ix":2},"a":{"a":0,"k":[88.48,25.78],"ix":2},"o":{"a":0,"k":100,"ix":2}}]}],"ip":0,"op":399,"st":0},{"ddd":0,"ind":24,"ty":4,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":2}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"sh","d":1,"ks":{"a":0,"k":{"c":true,"v":[[24.93,73.49],[24.93,73.95],[0,96.22],[59.61,122.2],[119.22,96.22],[94.3,73.92],[94.33,29.86],[94.33,29.62],[94.49,16.54],[24.82,30.92],[24.93,73.49],[24.93,73.49],[24.93,73.49]],"i":[[0,0],[0,0],[16.491,-4.974],[-19.87,0],[-19.87,14.434],[0.241,9.888],[-0.017,3.753],[1.084,0.301],[-0.074,16.894],[-1.039,-46.389],[-0.066,-5.357],[0,0],[0,0]],"o":[[0,0],[-0.129,9.871],[19.87,14.434],[19.87,0],[-16.379,-4.98],[0,-3.753],[1.185,0.167],[0.033,-12.362],[0.074,-16.894],[0.014,4.73],[0,0],[0,0],[0,0]]}}},{"ty":"gf","o":{"a":0,"k":100,"ix":2},"r":1,"bm":0,"g":{"p":2,"k":{"a":0,"k":[0,0.695,0.695,0.695,1,1,1,1,0,1,1,1],"ix":2}},"s":{"a":0,"k":[54.33,33.74],"ix":2},"e":{"a":0,"k":[54.33,91.15],"ix":2},"t":1},{"ty":"tr","p":{"a":0,"k":[148.61,191.41],"ix":2},"a":{"a":0,"k":[59.61,61.1],"ix":2},"o":{"a":0,"k":100,"ix":2}}]}],"ip":0,"op":399,"st":0},{"ddd":0,"ind":25,"ty":4,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":2}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"sh","d":1,"ks":{"a":0,"k":{"c":true,"v":[[124,248],[248,124],[124,0],[0,124],[124,248],[124,248],[124,248]],"i":[[0,0],[0,68.483],[68.483,0],[0,-68.483],[-68.483,0],[0,0],[0,0]],"o":[[68.483,0],[0,-68.483],[-68.483,0],[0,68.483],[0,0],[0,0],[0,0]]}}},{"ty":"fl","c":{"a":0,"k":[0,0.48,1],"ix":2},"o":{"a":0,"k":7,"ix":2},"r":1,"bm":0},{"ty":"tr","p":{"a":0,"k":[148,148],"ix":2},"a":{"a":0,"k":[124,124],"ix":2},"o":{"a":0,"k":100,"ix":2}}]}],"ip":0,"op":399,"st":0}]},{"id":"a","layers":[{"ddd":0,"refId":"b","w":297,"h":296,"ind":26,"ty":0,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":2}},"ao":0,"ip":0,"op":399,"st":0}]},{"id":"c","layers":[{"ddd":0,"ind":27,"ty":4,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":2}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"sh","d":1,"ks":{"a":0,"k":{"c":true,"v":[[0.01,0],[324.58,0],[324.59,0.01],[324.59,324.58],[324.58,324.59],[0.01,324.59],[0,324.58],[0,0.01],[0.01,0],[0.01,0],[0.01,0]],"i":[[0,0],[0,0],[0,-0.005],[0,0],[0.005,0],[0,0],[0,0.005],[0,0],[-0.005,0],[0,0],[0,0]],"o":[[0,0],[0.006,0],[0,0],[0,0.006],[0,0],[-0.006,0],[0,0],[0,-0.006],[0,0],[0,0],[0,0]]}}},{"ty":"fl","c":{"a":0,"k":[0,1,0],"ix":2},"o":{"a":0,"k":100,"ix":2},"r":1,"bm":0},{"ty":"tr","p":{"a":0,"k":[148.61,161.61],"ix":2},"a":{"a":0,"k":[162.29,162.29],"ix":2},"o":{"a":0,"k":100,"ix":2}}]}],"ip":0,"op":399,"st":0},{"ddd":0,"ind":28,"ty":4,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":2}},"ao":0,"shapes":[{"ty":"rc","d":1,"s":{"a":0,"k":[297,296],"ix":2},"p":{"a":0,"k":[148.5,148],"ix":2},"r":{"a":0,"k":0,"ix":2}},{"ty":"fl","c":{"a":0,"k":[0,0,0],"ix":2},"o":{"a":0,"k":0,"ix":2},"r":1,"bm":0}],"ip":0,"op":399,"st":0}]},{"id":"b","layers":[{"ddd":0,"refId":"d","w":296,"h":296,"ind":29,"ty":0,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":2}},"ao":0,"ip":0,"op":399,"st":0,"td":1},{"ddd":0,"refId":"c","w":297,"h":296,"ind":26,"ty":0,"sr":1,"ks":{"p":{"a":0,"k":[148.5,148],"ix":2},"a":{"a":0,"k":[148.5,148],"ix":2},"o":{"a":0,"k":100,"ix":2}},"ao":0,"ip":0,"op":399,"st":0,"tt":1}]},{"id":"d","layers":[{"ddd":0,"refId":"e","w":297,"h":296,"ind":30,"ty":0,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":2}},"ao":0,"ip":0,"op":399,"st":0}]},{"id":"f","layers":[{"ddd":0,"ind":31,"ty":4,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":2}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"sh","d":1,"ks":{"a":0,"k":{"c":true,"v":[[0.01,0],[295.99,0],[296,0.01],[296,295.99],[295.99,296],[0.01,296],[0,295.99],[0,0.01],[0.01,0],[0.01,0],[0.01,0]],"i":[[0,0],[0,0],[0,-0.005],[0,0],[0.005,0],[0,0],[0,0.005],[0,0],[-0.005,0],[0,0],[0,0]],"o":[[0,0],[0.006,0],[0,0],[0,0.006],[0,0],[-0.006,0],[0,0],[0,-0.006],[0,0],[0,0],[0,0]]}}},{"ty":"fl","c":{"a":0,"k":[0,1,0],"ix":2},"o":{"a":0,"k":100,"ix":2},"r":1,"bm":0},{"ty":"tr","p":{"a":0,"k":[148,148],"ix":2},"a":{"a":0,"k":[148,148],"ix":2},"o":{"a":0,"k":100,"ix":2}}]}],"ip":0,"op":399,"st":0},{"ddd":0,"ind":32,"ty":4,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":2}},"ao":0,"shapes":[{"ty":"rc","d":1,"s":{"a":0,"k":[297,296],"ix":2},"p":{"a":0,"k":[148.5,148],"ix":2},"r":{"a":0,"k":0,"ix":2}},{"ty":"fl","c":{"a":0,"k":[0,0,0],"ix":2},"o":{"a":0,"k":0,"ix":2},"r":1,"bm":0}],"ip":0,"op":399,"st":0}]},{"id":"e","layers":[{"ddd":0,"refId":"g","w":296,"h":296,"ind":33,"ty":0,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":2}},"ao":0,"ip":0,"op":399,"st":0,"td":1},{"ddd":0,"refId":"f","w":297,"h":296,"ind":30,"ty":0,"sr":1,"ks":{"p":{"a":0,"k":[148.5,148],"ix":2},"a":{"a":0,"k":[148.5,148],"ix":2},"o":{"a":0,"k":100,"ix":2}},"ao":0,"ip":0,"op":399,"st":0,"tt":1}]},{"id":"g","layers":[{"ddd":0,"ind":34,"ty":4,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":2}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"sh","d":1,"ks":{"a":0,"k":{"c":true,"v":[[0.01,0],[295.99,0],[296,0.01],[296,295.99],[295.99,296],[0.01,296],[0,295.99],[0,0.01],[0.01,0],[0.01,0],[0.01,0]],"i":[[0,0],[0,0],[0,-0.005],[0,0],[0.005,0],[0,0],[0,0.005],[0,0],[-0.005,0],[0,0],[0,0]],"o":[[0,0],[0.006,0],[0,0],[0,0.006],[0,0],[-0.006,0],[0,0],[0,-0.006],[0,0],[0,0],[0,0]]}}},{"ty":"fl","c":{"a":0,"k":[0,1,0],"ix":2},"o":{"a":0,"k":100,"ix":2},"r":1,"bm":0},{"ty":"tr","p":{"a":0,"k":[148,148],"ix":2},"a":{"a":0,"k":[148,148],"ix":2},"o":{"a":0,"k":100,"ix":2}}]}],"ip":0,"op":399,"st":0}]}]'), k = [{ ddd: 0, refId: "0", w: 296, h: 296, ind: 35, ty: 0, sr: 1, ks: { o: { a: 0, k: 100, ix: 2 } }, ao: 0, ip: 0, op: 399, st: 0 }], d = [], n = {
+  v: i,
+  fr: 100,
+  ip: 0,
+  op: 398,
+  w: 296,
+  h: 296,
+  nm: a,
+  ddd: 0,
+  metadata: t,
+  assets: s,
+  layers: k,
+  markers: d
+};
+export {
+  s as assets,
+  e as ddd,
+  n as default,
+  x as fr,
+  p as h,
+  o as ip,
+  k as layers,
+  d as markers,
+  t as metadata,
+  a as nm,
+  r as op,
+  i as v,
+  y as w
+};

package/dist/{setup-wNL83jmW.js → setup-BhetRn4n.js}

@@ -1,7 +1,7 @@
 import { setup as p } from "@incodetech/core";
 import { c, s as m } from "./instance-B-q0ZREN.js";
-import "./vendor-preact-CK0WeTOR.js";
-import { s as f } from "./uiConfig-CQ1W9cUD.js";
+import "./vendor-preact-CjD4WiuC.js";
+import { s as f } from "./uiConfig-DEqynrWx.js";
 async function y({
   apiURL: t,
   token: a,

package/dist/spinner-CQtj_FFo.js

@@ -0,0 +1,65 @@
+import { d as r, y as p, k as t } from "./vendor-preact-CjD4WiuC.js";
+import { g as u } from "./instance-B-q0ZREN.js";
+import { u as e, c as g, L as h, S as l } from "./incodeModule-DR92HDjR.js";
+function T() {
+  const n = u(), [, a] = r(0), [s, o] = r(n.isInitialized);
+  return p(() => {
+    const i = () => {
+      a((d) => d + 1);
+    }, c = () => {
+      o(!0), a((d) => d + 1);
+    };
+    return n.on("languageChanged", i), n.on("initialized", c), n.on("loaded", i), () => {
+      n.off("languageChanged", i), n.off("initialized", c), n.off("loaded", i);
+    };
+  }, [n]), {
+    t: n.t.bind(n),
+    ready: s,
+    i18n: n
+  };
+}
+const I = ({ children: n, className: a }) => /* @__PURE__ */ e("h2", { class: `IncodeTitle ${a ?? ""}`, children: n }), S = {
+  small: 24,
+  medium: 48,
+  large: 64
+}, C = ({
+  title: n,
+  subtitle: a,
+  size: s = "medium",
+  fullScreen: o = !0,
+  className: i
+}) => {
+  const c = S[s], d = g(
+    "IncodeSpinner",
+    o && "IncodeSpinnerFullScreen",
+    i
+  );
+  return /* @__PURE__ */ e(
+    "div",
+    {
+      class: d,
+      "data-testid": "spinner",
+      "data-title": n,
+      "data-subtitle": a,
+      "data-size": s,
+      children: /* @__PURE__ */ e("div", { class: "IncodeSpinnerContent", children: [
+        /* @__PURE__ */ e(h, { size: c }),
+        (n || a) && /* @__PURE__ */ e(t, { children: [
+          /* @__PURE__ */ e(l, { size: 16 }),
+          /* @__PURE__ */ e("div", { class: "IncodeSpinnerText", children: [
+            n && /* @__PURE__ */ e(I, { className: "IncodeSpinnerTitle", children: n }),
+            a && /* @__PURE__ */ e(t, { children: [
+              n && /* @__PURE__ */ e(l, { size: 12 }),
+              /* @__PURE__ */ e("p", { class: "IncodeSpinnerSubtitle", children: a })
+            ] })
+          ] })
+        ] })
+      ] })
+    }
+  );
+};
+export {
+  C as S,
+  I as T,
+  T as u
+};

package/dist/themes/dark.css

@@ -84,6 +84,13 @@
   --primitive-typography-letter-spacing-minus-1: -1px;
   --primitive-typography-letter-spacing-minus-1-5: -1.5px;
 
+  /* Typography / Line Height */
+
+  --primitive-typography-line-height-110: 1.1;
+  --primitive-typography-line-height-114: 1.14;
+  --primitive-typography-line-height-115: 1.15;
+  --primitive-typography-line-height-120: 1.2;
+
   /* Border / Width */
 
   --primitive-border-width-0: 0px;
@@ -112,6 +119,7 @@
   --primitive-scale-16: 16px;
   --primitive-scale-20: 20px;
   --primitive-scale-24: 24px;
+  --primitive-scale-28: 28px;
   --primitive-scale-32: 32px;
   --primitive-scale-40: 40px;
   --primitive-scale-48: 48px;
@@ -156,6 +164,7 @@
   --spacing-16: var(--primitive-scale-16);
   --spacing-20: var(--primitive-scale-20);
   --spacing-24: var(--primitive-scale-24);
+  --spacing-28: var(--primitive-scale-28);
   --spacing-32: var(--primitive-scale-32);
   --spacing-40: var(--primitive-scale-40);
   --spacing-48: var(--primitive-scale-48);
@@ -177,6 +186,128 @@
   --icon-size-x-large: var(--primitive-scale-48);
   --icon-size-xx-large: var(--primitive-scale-64);
   --icon-size-xxx-large: var(--primitive-scale-80);
+
+  /* Typography */
+
+  --typography-display-d1-size: var(--primitive-typography-size-80);
+  --typography-display-d1-weight: var(--primitive-typography-weight-extrabold);
+  --typography-display-d1-line-height: var(
+    --primitive-typography-line-height-110
+  );
+  --typography-display-d1-letter-spacing: var(
+    --primitive-typography-letter-spacing-minus-1-5
+  );
+
+  --typography-display-d2-size: var(--primitive-typography-size-48);
+  --typography-display-d2-weight: var(--primitive-typography-weight-extrabold);
+  --typography-display-d2-line-height: var(
+    --primitive-typography-line-height-110
+  );
+  --typography-display-d2-letter-spacing: var(
+    --primitive-typography-letter-spacing-minus-1-5
+  );
+
+  --typography-headline-h1-size: var(--primitive-typography-size-32);
+  --typography-headline-h1-weight: var(--primitive-typography-weight-bold);
+  --typography-headline-h1-line-height: var(
+    --primitive-typography-line-height-115
+  );
+  --typography-headline-h1-letter-spacing: var(
+    --primitive-typography-letter-spacing-minus-1
+  );
+
+  --typography-headline-h2-size: var(--primitive-typography-size-24);
+  --typography-headline-h2-weight: var(--primitive-typography-weight-bold);
+  --typography-headline-h2-line-height: var(
+    --primitive-typography-line-height-115
+  );
+  --typography-headline-h2-letter-spacing: var(
+    --primitive-typography-letter-spacing-minus-1
+  );
+
+  --typography-headline-h3-size: var(--primitive-typography-size-20);
+  --typography-headline-h3-weight: var(--primitive-typography-weight-semibold);
+  --typography-headline-h3-line-height: var(
+    --primitive-typography-line-height-115
+  );
+  --typography-headline-h3-letter-spacing: var(
+    --primitive-typography-letter-spacing-minus-0-5
+  );
+
+  --typography-headline-h4-size: var(--primitive-typography-size-18);
+  --typography-headline-h4-weight: var(--primitive-typography-weight-medium);
+  --typography-headline-h4-line-height: var(
+    --primitive-typography-line-height-115
+  );
+  --typography-headline-h4-letter-spacing: var(
+    --primitive-typography-letter-spacing-minus-0-5
+  );
+
+  --typography-headline-h5-size: var(--primitive-typography-size-16);
+  --typography-headline-h5-weight: var(--primitive-typography-weight-medium);
+  --typography-headline-h5-line-height: var(
+    --primitive-typography-line-height-115
+  );
+  --typography-headline-h5-letter-spacing: var(
+    --primitive-typography-letter-spacing-minus-0-5
+  );
+
+  --typography-body-sm-size: var(--primitive-typography-size-12);
+  --typography-body-sm-weight: var(--primitive-typography-weight-regular);
+  --typography-body-sm-line-height: var(--primitive-typography-line-height-120);
+  --typography-body-sm-letter-spacing: var(
+    --primitive-typography-letter-spacing-0
+  );
+
+  --typography-body-regular-size: var(--primitive-typography-size-14);
+  --typography-body-regular-weight: var(--primitive-typography-weight-regular);
+  --typography-body-regular-line-height: var(
+    --primitive-typography-line-height-120
+  );
+  --typography-body-regular-letter-spacing: var(
+    --primitive-typography-letter-spacing-0
+  );
+
+  --typography-body-lg-size: var(--primitive-typography-size-16);
+  --typography-body-lg-weight: var(--primitive-typography-weight-regular);
+  --typography-body-lg-line-height: var(--primitive-typography-line-height-120);
+  --typography-body-lg-letter-spacing: var(
+    --primitive-typography-letter-spacing-0
+  );
+
+  --typography-body-sm-medium-size: var(--primitive-typography-size-12);
+  --typography-body-sm-medium-weight: var(--primitive-typography-weight-medium);
+  --typography-body-sm-medium-line-height: var(
+    --primitive-typography-line-height-120
+  );
+  --typography-body-sm-medium-letter-spacing: var(
+    --primitive-typography-letter-spacing-0
+  );
+
+  --typography-body-medium-size: var(--primitive-typography-size-14);
+  --typography-body-medium-weight: var(--primitive-typography-weight-medium);
+  --typography-body-medium-line-height: var(
+    --primitive-typography-line-height-120
+  );
+  --typography-body-medium-letter-spacing: var(
+    --primitive-typography-letter-spacing-0
+  );
+
+  --typography-body-lg-medium-size: var(--primitive-typography-size-16);
+  --typography-body-lg-medium-weight: var(--primitive-typography-weight-medium);
+  --typography-body-lg-medium-line-height: var(
+    --primitive-typography-line-height-120
+  );
+  --typography-body-lg-medium-letter-spacing: var(
+    --primitive-typography-letter-spacing-0
+  );
+
+  --typography-tooltip-size: var(--primitive-typography-size-16);
+  --typography-tooltip-weight: var(--primitive-typography-weight-medium);
+  --typography-tooltip-line-height: var(--primitive-typography-line-height-114);
+  --typography-tooltip-letter-spacing: var(
+    --primitive-typography-letter-spacing-minus-0-5
+  );
 }
 :root,
 :host {
@@ -195,6 +326,7 @@
   --surface-neutral-900-80: var(--primitive-color-gray-900-80);
   --surface-neutral-900-static: var(--primitive-color-gray-900);
   --surface-neutral-1000: var(--primitive-color-gray-1000);
+  --surface-neutral-dark: rgba(0, 0, 0, 0.9);
 
   /* Surface / Brand */
 
@@ -209,12 +341,15 @@
   /* Surface / Status */
 
   --surface-status-negative-50: var(--primitive-color-negative-50);
+  --surface-status-negative-500: var(--primitive-color-negative-600);
   --surface-status-negative-600: var(--primitive-color-negative-600);
+  --surface-error-500: var(--primitive-color-negative-600);
 
   --surface-status-warning-50: var(--primitive-color-warning-50);
   --surface-status-warning-500: var(--primitive-color-warning-500);
 
   --surface-status-positive-50: var(--primitive-color-positive-50);
+  --surface-status-positive-500: var(--primitive-color-positive-600);
   --surface-status-positive-600: var(--primitive-color-positive-600);
   --surface-status-positive-600-static: var(--primitive-color-positive-600);
 
@@ -244,6 +379,7 @@
 
   /* Border / Neutral */
 
+  --border-neutral-0: var(--primitive-color-gray-0);
   --border-neutral-100: var(--primitive-color-gray-100);
   --border-neutral-300: var(--primitive-color-gray-300);
   --border-neutral-500: var(--primitive-color-gray-500);
@@ -260,6 +396,7 @@
   --border-status-warning: var(--primitive-color-warning-500);
   --border-status-positive: var(--primitive-color-positive-600);
   --border-status-positive-static: var(--primitive-color-positive-600);
+  --border-status-focus: var(--primitive-color-brand-500);
 
   /* Text / Body */
 
@@ -293,6 +430,10 @@
   --text-status-warning: var(--primitive-color-warning-500);
   --text-status-positive: var(--primitive-color-positive-600);
   --text-status-positive-static: var(--primitive-color-positive-600);
+
+  /* Text / Tooltip */
+
+  --text-tooltip-neutral: var(--text-body-0-static);
 }
 [data-incode-theme='dark'] {
   /* Surface / Neutral */
@@ -309,6 +450,7 @@
   --surface-neutral-900: var(--primitive-color-gray-0);
   --surface-neutral-900-80: var(--primitive-color-gray-0-80);
   --surface-neutral-1000: var(--primitive-color-gray-0);
+  --surface-neutral-dark: rgba(0, 0, 0, 0.9);
 
   /* Surface / Brand */
 
@@ -317,12 +459,15 @@
   /* Surface / Status */
 
   --surface-status-negative-50: var(--primitive-color-negative-950);
+  --surface-status-negative-500: var(--primitive-color-negative-500);
   --surface-status-negative-600: var(--primitive-color-negative-500);
+  --surface-error-500: var(--primitive-color-negative-500);
 
   --surface-status-warning-50: var(--primitive-color-warning-950);
   --surface-status-warning-500: var(--primitive-color-warning-400);
 
   --surface-status-positive-50: var(--primitive-color-positive-800);
+  --surface-status-positive-500: var(--primitive-color-positive-600);
 
   /* Icon / Neutral */