@factor_ec/ui 2.1.2 → 3.0.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@factor_ec/ui",
-  "version": "2.1.2",
+  "version": "3.0.0",
   "license": "CC-BY-NC-ND-4.0",
   "author": "Factor",
   "private": false,

package/public-api.d.ts

@@ -7,15 +7,13 @@ export * from './lib/io/message.service';
 export * from './lib/io/progress/progress.component';
 export * from './lib/io/progress.service';
 export * from './lib/io/observe-intersecting.directive';
-export * from './lib/io/io.module';
 export * from './lib/io/rating/rating.component';
 export * from './lib/io/timeline/timeline.component';
-export * from './lib/io/listview/listview.component';
 export * from './lib/io/expression-builder/expression-builder.component';
 export * from './lib/io/io.module';
+export * from './lib/layout/collapsible/collapsible.component';
+export * from './lib/layout/layout.module';
 export * from './lib/navigation/list/list.component';
-export * from './lib/navigation/navbar/navbar.component';
-export * from './lib/navigation/searchbox/searchbox.component';
 export * from './lib/navigation/toolbar/toolbar.component';
 export * from './lib/navigation/navigation.module';
 export * from './lib/ui.module';

package/scss/all.scss

@@ -1,5 +1,5 @@
-@use 'variables';
-@use 'reboot';
-@use 'layout';
-@use 'components';
-@use 'root';
+@import 'variables';
+@import 'mixins';
+@import 'reboot';
+@import 'components';
+@import 'root';

package/scss/components/collapsible.scss

@@ -0,0 +1,44 @@
+.ft-collapsible {
+    overflow: hidden;
+    transition: max-height 0.2s;
+    max-height: 100vh;
+    display: flex;
+    flex-direction: column;
+    &.ft-collapsible--show {
+        .ft-collapsible__header {
+            .ft-item__toggle {
+                transform: rotate(180deg);
+            }
+        }
+    }
+    &:not(.ft-collapsible--show) {
+        .ft-collapsible__content {
+            max-height: 0;
+        }
+    }
+    &__header {
+        &.ft-button {
+            font-weight: 600;
+            text-align: left;
+        }
+        .ft-item__label {
+            flex-grow: 1;
+        }
+        .ft-item__toggle {
+            transition: transform 0.2s;
+        }
+        &:focus {
+            box-shadow: 0 0 0;
+        }
+        &:not(:hover):not(:disabled) {
+            .ft-item__label {
+                color: var(--ft-text-muted-color);
+            }
+        }
+        .ft-item {
+            display: flex;
+            align-items: center;
+            flex-grow: 1;
+        }
+    }
+}

package/scss/components/dropdown.scss

@@ -0,0 +1,56 @@
+.ft-dropdown {
+    position: relative;
+    display: flex;
+    &--right {
+        .ft-dropdown__menu {
+            right: 0;
+        }
+    }
+    &:focus-within {
+        &::before {
+            display: block;
+            content: "";
+            position: fixed;
+            top: 0;
+            left: 0;
+            right: 0;
+            bottom: 0;
+            z-index: 1;
+        }
+        .ft-dropdown__menu {
+            display: block;
+        }
+    }
+    &__menu {
+        --ft-button-bg: #fff;
+        --ft-button-color: var(--ft-text-color);
+        --ft-button-border-radius: 0;
+        position: absolute;
+        display: none;
+        transition: display 0.2s linear 0.2s;
+        box-shadow: var(--ft-popup-box-shadow);
+        background-color: #fff;
+        border-radius: 0.25rem;
+        top: calc(100% + 0.125rem);
+        padding-top: 0.25rem;
+        padding-bottom: 0.25rem;
+        z-index: 2;
+        width: max-content;
+        max-width: 250px;
+        @include media-breakpoint-down(sm) {
+            position: fixed;
+            top: auto;
+            left: 0;
+            right: 0;
+            bottom: 0;
+            min-width: unset;
+            max-height: 60vh;
+            width: 100%;
+            max-width: 100vw;
+            border-bottom-left-radius: 0;
+            border-bottom-right-radius: 0;
+            transform: initial;
+            overflow-y: auto;
+        }
+    }
+}

package/scss/components/list.scss

@@ -1,36 +1,36 @@
 .ft-list {
     display: block;
     overflow: auto;
+    &--comfortable {
+        .ft-collapsible__header,
+        .ft-list__header {
+            padding: 0.75rem 0.75rem 0.75rem 1.5rem;
+        }
+        .ft-list__item {
+            padding: 0.75rem 1.5rem;
+        }
+    }
     &__header {
         text-transform: uppercase;
         font-weight: 700;
-        padding: 0.75rem 1.5rem 0.25rem;
+        padding: 0.5rem 0.75rem 0.25rem;
         font-size: 0.75rem;
         opacity: 0.3;
     }
     &__item {
-        border: 0;
-        box-sizing: border-box;
-        color: var(--ft-text-color);
-        background-color: var(--ft-background-color);
-        cursor: pointer;
-        display: flex;
-        outline: none;
-        transition: background-color 0.3s, color 0.3s;
         text-align: left;
-        padding: 0.75rem 1.5rem;
+        padding: 0.5rem 0.75rem;
         width: 100%;
-        &:hover {
-            text-decoration: none;
-            &:not(.active) {
-                --ft-background-color: var(--ft-background-color-hover);
-                --ft-text-color: var(--text-color-hover);
-            }
+        display: block;
+        text-decoration: none;
+        font-size: 0.875rem;
+        font-weight: 400;
+        justify-content: flex-start;
+        &:focus {
+            box-shadow: 0 0 0;
         }
-        &--active,
-        &:active {
-            --ft-background-color: var(--ft-background-color-active);
-            --ft-text-color: var(--ft-text-color-active);
+        &:not(:hover):not(:disabled) {
+            color: var(--ft-text-color);
         }
         .ft-item {
             max-width: 100%;
@@ -58,26 +58,4 @@
             }
         }
     }
-    &__collapsible {
-        overflow: hidden;
-        transition: max-height 0.2s;
-        max-height: 100vh;
-        &-header {
-            font-weight: 500;
-            > div {
-                display: flex;
-                align-items: center;
-                flex-grow: 1;
-            }
-            &--show {
-                .ft-item__toggle {
-                    transform: rotate(90deg);
-                }
-            }
-        }
-        &:not(.ft-show) {
-            max-height: 0;
-            background-color: transparent;
-        }
-    }
 }

package/scss/components/ph.scss

@@ -0,0 +1,27 @@
+.ft-ph {
+    overflow: hidden;
+    position: relative;
+    background-color: rgba(0, 0, 0, 0.03);
+
+    &::after {
+        content: "";
+        display: block;
+        background-color: rgba(0, 0, 0, 0.02);
+        position: absolute;
+        top: 0;
+        bottom: 0;
+        width: 100%;
+        height: 100%;
+        transform: translateX(0);
+        animation: 1.5s ft-ph-loading ease-in-out infinite;
+    }
+}
+@keyframes ft-ph-loading {
+    0% {
+        transform: translateX(-100%);
+    }
+
+    100% {
+        transform: translateX(100%);
+    }
+}

package/scss/components/popup.scss

@@ -0,0 +1,7 @@
+.ft-popup {
+    box-shadow: var(--ft-popup-box-shadow);
+    background-color: #fff;
+    border-radius: 0.25rem;
+    padding-top: 0.25rem;
+    padding-bottom: 0.25rem;
+}

package/scss/components.scss

@@ -1,5 +1,8 @@
-@use 'components/avatar';
-@use 'components/button';
-@use 'components/list';
-@use 'components/rating';
-@use 'components/icon';
+@import 'components/avatar';
+@import 'components/collapsible';
+@import 'components/dropdown';
+@import 'components/icon';
+@import 'components/list';
+@import 'components/ph';
+@import 'components/popup';
+@import 'components/rating';

package/scss/mixins/breakpoints.scss

@@ -0,0 +1,123 @@
+// Breakpoint viewport sizes and media queries.
+//
+// Breakpoints are defined as a map of (name: minimum width), order from small to large:
+//
+//    (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px)
+//
+// The map defined in the `$grid-breakpoints` global variable is used as the `$breakpoints` argument by default.
+
+// Name of the next breakpoint, or null for the last breakpoint.
+//
+//    >> breakpoint-next(sm)
+//    md
+//    >> breakpoint-next(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))
+//    md
+//    >> breakpoint-next(sm, $breakpoint-names: (xs sm md lg xl))
+//    md
+@function breakpoint-next($name, $breakpoints: $grid-breakpoints, $breakpoint-names: map-keys($breakpoints)) {
+    $n: index($breakpoint-names, $name);
+    @return if($n != null and $n < length($breakpoint-names), nth($breakpoint-names, $n + 1), null);
+}
+
+// Minimum breakpoint width. Null for the smallest (first) breakpoint.
+//
+//    >> breakpoint-min(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))
+//    576px
+@function breakpoint-min($name, $breakpoints: $grid-breakpoints) {
+    $min: map-get($breakpoints, $name);
+    @return if($min != 0, $min, null);
+}
+
+// Maximum breakpoint width. Null for the largest (last) breakpoint.
+// The maximum value is calculated as the minimum of the next one less 0.02px
+// to work around the limitations of `min-` and `max-` prefixes and viewports with fractional widths.
+// See https://www.w3.org/TR/mediaqueries-4/#mq-min-max
+// Uses 0.02px rather than 0.01px to work around a current rounding bug in Safari.
+// See https://bugs.webkit.org/show_bug.cgi?id=178261
+//
+//    >> breakpoint-max(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))
+//    767.98px
+@function breakpoint-max($name, $breakpoints: $grid-breakpoints) {
+    $next: breakpoint-next($name, $breakpoints);
+    @return if($next, breakpoint-min($next, $breakpoints) - 0.02, null);
+}
+
+// Returns a blank string if smallest breakpoint, otherwise returns the name with a dash in front.
+// Useful for making responsive utilities.
+//
+//    >> breakpoint-infix(xs, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))
+//    ""  (Returns a blank string)
+//    >> breakpoint-infix(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))
+//    "-sm"
+@function breakpoint-infix($name, $breakpoints: $grid-breakpoints) {
+    @return if(breakpoint-min($name, $breakpoints) == null, "", "-#{$name}");
+}
+
+// Media of at least the minimum breakpoint width. No query for the smallest breakpoint.
+// Makes the @content apply to the given breakpoint and wider.
+@mixin media-breakpoint-up($name, $breakpoints: $grid-breakpoints) {
+    $min: breakpoint-min($name, $breakpoints);
+    @if $min {
+        @media (min-width: $min) {
+            @content;
+        }
+    } @else {
+        @content;
+    }
+}
+
+// Media of at most the maximum breakpoint width. No query for the largest breakpoint.
+// Makes the @content apply to the given breakpoint and narrower.
+@mixin media-breakpoint-down($name, $breakpoints: $grid-breakpoints) {
+    $max: breakpoint-max($name, $breakpoints);
+    @if $max {
+        @media (max-width: $max) {
+            @content;
+        }
+    } @else {
+        @content;
+    }
+}
+
+// Media that spans multiple breakpoint widths.
+// Makes the @content apply between the min and max breakpoints
+@mixin media-breakpoint-between($lower, $upper, $breakpoints: $grid-breakpoints) {
+    $min: breakpoint-min($lower, $breakpoints);
+    $max: breakpoint-max($upper, $breakpoints);
+
+    @if $min != null and $max != null {
+        @media (min-width: $min) and (max-width: $max) {
+            @content;
+        }
+    } @else if $max == null {
+        @include media-breakpoint-up($lower, $breakpoints) {
+            @content;
+        }
+    } @else if $min == null {
+        @include media-breakpoint-down($upper, $breakpoints) {
+            @content;
+        }
+    }
+}
+
+// Media between the breakpoint's minimum and maximum widths.
+// No minimum for the smallest breakpoint, and no maximum for the largest one.
+// Makes the @content apply only to the given breakpoint, not viewports any wider or narrower.
+@mixin media-breakpoint-only($name, $breakpoints: $grid-breakpoints) {
+    $min: breakpoint-min($name, $breakpoints);
+    $max: breakpoint-max($name, $breakpoints);
+
+    @if $min != null and $max != null {
+        @media (min-width: $min) and (max-width: $max) {
+            @content;
+        }
+    } @else if $max == null {
+        @include media-breakpoint-up($name, $breakpoints) {
+            @content;
+        }
+    } @else if $min == null {
+        @include media-breakpoint-down($name, $breakpoints) {
+            @content;
+        }
+    }
+}

package/scss/mixins.scss

@@ -0,0 +1 @@
+@import 'mixins/breakpoints';

package/scss/reboot.scss

@@ -1,4 +1,4 @@
-@use "variables";
+@import "variables";
 
 // stylelint-disable declaration-no-important, selector-no-qualifying-type, property-no-vendor-prefix
 
@@ -47,11 +47,12 @@
 // scss-docs-start reboot-body-rules
 body {
     margin: 0; // 1
-    font-family: var(--ft-body-font-family);
+    font-family: var(--ft-text-font-family);
     // @include font-size(var(--ft-body-font-size));
-    font-weight: var(--ft-body-font-weight);
-    line-height: var(--ft-body-line-height);
-    color: var(--ft-body-color);
+    font-size: var(--ft-text-font-size);
+    font-weight: var(--ft-text-font-weight);
+    line-height: var(--ft-text-line-height);
+    color: var(--ft-text-color);
     // text-align: var(--ft-body-text-align);
     background-color: var(--ft-body-bg); // 2
     -webkit-text-size-adjust: 100%; // 3
@@ -64,11 +65,12 @@ body {
 // 1. Reset Firefox's gray color
 
 hr {
-    // margin: $hr-margin-y 0;
-    // color: $hr-color; // 1
+    margin: 1rem 0;
+    color: inherit;
     border: 0;
     border-top: 1px solid;
-    opacity: 0.25;
+    border-left: 1px solid;
+    border-color: var(--ft-border-color);
 }
 
 // Typography
@@ -231,12 +233,9 @@ sup { top: -.5em; }
 // Links
 
 a {
-    color: rgba(var(--ft-link-color-rgb), var(--ft-link-opacity, 1));
-    // text-decoration: $link-decoration;
-
+    color: rgba(var(--ft-text-link-color-rgb), var(--ft-text-link-opacity, 1));
     &:hover {
-        --ft-link-color-rgb: var(--ft-link-hover-color-rgb);
-        // text-decoration: $link-hover-decoration;
+        --ft-text-link-color-rgb: var(--ft-text-link-hover-color-rgb);
     }
 }
 
@@ -387,6 +386,7 @@ button {
 button:focus:not(:focus-visible) {
   outline: 0;
 }
+*/
 
 // 1. Remove the margin in Firefox and Safari
 
@@ -397,10 +397,9 @@ optgroup,
 textarea {
   margin: 0; // 1
   font-family: inherit;
-  @include font-size(inherit);
+  font-size: inherit;
   line-height: inherit;
 }
-*/
 
 // Remove the inheritance of text transform in Firefox
 button,
@@ -521,6 +520,12 @@ legend {
 [type="search"] {
     outline-offset: -2px; // 1
     -webkit-appearance: textfield; // 2
+    &::-webkit-search-decoration,
+    &::-webkit-search-cancel-button,
+    &::-webkit-search-results-button,
+    &::-webkit-search-results-decoration {
+        -webkit-appearance: none;
+    }
 }
 
 // Remove the inner padding in Chrome and Safari on macOS.

package/scss/root.scss

@@ -1,39 +1,52 @@
 :root {
-    --ft-body-font-family: sans-serif;
-    --ft-body-font-size: 14px;
-    --ft-body-font-size-sm: calc(var(--ft-body-font-size * 0.875));
-    --ft-body-font-size-lg: calc(var(--ft-body-font-size * 1.25));
-    --ft-body-font-weight: 300;
-    --ft-body-font-line-height: normal;
-
-    --ft-body-bg: #fff;
-    --ft-body-color: var(--ft-text-dark-color);
-
-    --ft-heading-color: var(--ft-text-dark-color);
-    --ft-heading-margin-bottom: calc(1rem * 0.5);
-    --ft-heading-font-family: var(--ft-body-font-family);
+    --ft-heading-font-family: var(--ft-text-font-family);
     --ft-heading-font-weight: 500;
     --ft-heading-line-height: 1.2;
+    --ft-heading-color: var(--ft-text-dark-color);
+    --ft-heading-margin-bottom: calc(1rem * 0.5);
 
+    --ft-text-font-family: sans-serif;
+    --ft-text-font-size: 1rem;
+    --ft-text-font-size-sm: calc(var(--ft-text-font-size) * 0.875);
+    --ft-text-font-size-lg: calc(var(--ft-text-font-size) * 1.25);
+    --ft-text-font-weight: 300;
+    --ft-text-line-height: normal;
     --ft-text-color: var(--ft-text-dark-color);
-
-    --ft-link-color: var(--ft-primary-color);
-    --ft-link-hover-color: rgb(var(--ft-primary-color-rgb), 0.9);
+    --ft-text-color-rgb: var(--ft-text-dark-color-rgb);
+    --ft-text-muted-color: rgba(var(--ft-text-color-rgb), 0.5);
+    --ft-text-light-color: #fff;
+    --ft-text-light-color-rgb: 255, 255, 255;
+    --ft-text-dark-color: #333;
+    --ft-text-dark-color-rgb: 51, 51, 51;
+    --ft-text-link-color: var(--ft-primary-color);
+    --ft-text-link-hover-color: rgb(var(--ft-primary-color-rgb), 0.9);
+    --ft-text-link-opacity: 1;
 
     --ft-danger-color: #dc3545;
+    --ft-danger-color-rgb: 220, 53, 69;
     --ft-warning-color: #ffc107;
+    --ft-warning-color-rgb: 255, 193, 7;
     --ft-success-color: #198754;
-    --ft-text-light-color: #fff;
-    --ft-text-dark-color: #333;
-
+    --ft-success-color-rgb: 25, 135, 84;
+    --ft-info-color: #0dcaf0;
+    --ft-info-color-rgb: 13, 202, 240;
+    
     --ft-avatar-size: 2.25rem;
     --ft-avatar-bg: #fff;
 
     --ft-button-bg: unset;
     --ft-button-bg-rgb: 0, 0, 0;
     --ft-button-border-color: unset;
-    --ft-button-border-radius: 0.5rem;
+    --ft-button-border-radius: 0.25rem;
     --ft-button-color: var(--ft-primary-color);
+    --ft-button-hover-bg: rgba(var(--ft-button-bg-rgb), 0.1);
+    --ft-button-focus-bg: rgba(var(--ft-button-bg-rgb), 0.1);
+    --ft-button-active-bg: rgba(var(--ft-button-bg-rgb), 0.2);
+
+    --ft-field-label-color: rgba(var(--ft-text-color-rgb), 0.7);
+    --ft-field-label-font-size: var(--ft-text-font-size-sm);
+    --ft-field-label-line-height: var(--ft-text-line-height);
 
-    --ft-popup-box-shadow: 0px 24px 38px rgba(0, 0, 0, 0.14), 0px 9px 46px rgba(0, 0, 0, 0.12), 0px 11px 15px rgba(0, 0, 0, 0.2);;
+    --ft-popup-box-shadow: 0px 24px 38px rgba(0, 0, 0, 0.14), 0px 9px 46px rgba(0, 0, 0, 0.12),
+        0px 11px 15px rgba(0, 0, 0, 0.2);
 }

package/scss/variables.scss

@@ -1,3 +1,5 @@
+$prefix: ft- !default;
+
 $white:    #fff !default;
 $gray-100: #f8f9fa !default;
 $gray-200: #e9ecef !default;
@@ -10,6 +12,43 @@ $gray-800: #343a40 !default;
 $gray-900: #212529 !default;
 $black:    #000 !default;
 
+// scss-docs-start color-variables
+$blue:    #0d6efd !default;
+$indigo:  #6610f2 !default;
+$purple:  #6f42c1 !default;
+$pink:    #d63384 !default;
+$red:     #dc3545 !default;
+$orange:  #fd7e14 !default;
+$yellow:  #ffc107 !default;
+$green:   #198754 !default;
+$teal:    #20c997 !default;
+$cyan:    #0dcaf0 !default;
+// scss-docs-end color-variables
+
+// scss-docs-start theme-color-variables
+$primary:       $blue !default;
+$secondary:     $gray-600 !default;
+$success:       $green !default;
+$info:          $cyan !default;
+$warning:       $yellow !default;
+$danger:        $red !default;
+$light:         $gray-100 !default;
+$dark:          $gray-900 !default;
+// scss-docs-end theme-color-variables
+
+// scss-docs-start theme-colors-map
+$theme-colors: (
+  "primary":    $primary,
+  "secondary":  $secondary,
+  "success":    $success,
+  "info":       $info,
+  "warning":    $warning,
+  "danger":     $danger,
+  "light":      $light,
+  "dark":       $dark
+) !default;
+// scss-docs-end theme-colors-map
+
 $spacer: 1rem !default;
 $spacers: (
   0: 0,
@@ -29,6 +68,12 @@ $grid-breakpoints: (
   xxl: 1400px
 ) !default;
 
+$grid-breakpoints-sm: 576px;
+$grid-breakpoints-md: 768px;
+$grid-breakpoints-lg: 992px;
+$grid-breakpoints-xl: 1200px;
+$grid-breakpoints-xxl: 1400px;
+
 $container-max-widths: (
   sm: 540px,
   md: 720px,
@@ -38,4 +83,34 @@ $container-max-widths: (
 ) !default;
 
 $headings-margin-bottom: $spacer * .5 !default;
-$paragraph-margin-bottom: 1rem !default;
+$paragraph-margin-bottom: 1rem !default;
+
+// scss-docs-start border-variables
+$border-width:                1px !default;
+$border-widths: (
+  1: 1px,
+  2: 2px,
+  3: 3px,
+  4: 4px,
+  5: 5px
+) !default;
+$border-style:                solid !default;
+$border-color:                $gray-300 !default;
+$border-color-translucent:    rgba($black, .175) !default;
+// scss-docs-end border-variables
+
+// scss-docs-start border-radius-variables
+$border-radius:               .375rem !default;
+$border-radius-sm:            .25rem !default;
+$border-radius-lg:            .5rem !default;
+$border-radius-xl:            1rem !default;
+$border-radius-2xl:           2rem !default;
+$border-radius-pill:          50rem !default;
+// scss-docs-end border-radius-variables
+
+// scss-docs-start box-shadow-variables
+$box-shadow:                  0 .5rem 1rem rgba(var(--#{$prefix}text-color-rgb), .15) !default;
+$box-shadow-sm:               0 .125rem .25rem rgba(var(--#{$prefix}text-color-rgb), .075) !default;
+$box-shadow-lg:               0 1rem 3rem rgba(var(--#{$prefix}text-color-rgb), .175) !default;
+$box-shadow-inset:            inset 0 1px 2px rgba(var(--#{$prefix}text-color-rgb), .075) !default;
+// scss-docs-end box-shadow-variables

package/esm2020/lib/io/listview/listview.component.mjs

@@ -1,11 +0,0 @@
-import { Component } from '@angular/core';
-import * as i0 from "@angular/core";
-export class ListviewComponent {
-}
-ListviewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.2", ngImport: i0, type: ListviewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ListviewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.2", type: ListviewComponent, selector: "ft-listview", ngImport: i0, template: "<p>listview works!</p>\n", styles: [""] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.2", ngImport: i0, type: ListviewComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ft-listview', template: "<p>listview works!</p>\n" }]
-        }] });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGlzdHZpZXcuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvdWkvc3JjL2xpYi9pby9saXN0dmlldy9saXN0dmlldy5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy91aS9zcmMvbGliL2lvL2xpc3R2aWV3L2xpc3R2aWV3LmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxlQUFlLENBQUM7O0FBTzFDLE1BQU0sT0FBTyxpQkFBaUI7OzhHQUFqQixpQkFBaUI7a0dBQWpCLGlCQUFpQixtRENQOUIsMEJBQ0E7MkZETWEsaUJBQWlCO2tCQUw3QixTQUFTOytCQUNFLGFBQWEiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnZnQtbGlzdHZpZXcnLFxuICB0ZW1wbGF0ZVVybDogJy4vbGlzdHZpZXcuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9saXN0dmlldy5jb21wb25lbnQuc2NzcyddXG59KVxuZXhwb3J0IGNsYXNzIExpc3R2aWV3Q29tcG9uZW50IHtcblxufVxuIiwiPHA+bGlzdHZpZXcgd29ya3MhPC9wPlxuIl19