@truedat/df 7.5.7 → 7.5.10

package/src/components/widgets/__tests__/__snapshots__/ColorPickerField.spec.js.snap

@@ -1,40 +1,225 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`<ColorPickerField /> matches the latest snapshot 1`] = `
-<ColorPicker
-  color={
-    {
-      "a": 1,
-      "h": 250,
-      "l": 0.2,
-      "s": 0.5,
-    }
-  }
-  colors={
-    [
-      "#B80000",
-      "#DB3E00",
-      "#FCCB00",
-      "#008B02",
-      "#006B76",
-      "#1273DE",
-      "#004DCF",
-      "#5300EB",
-      "#EB9694",
-      "#FAD0C3",
-      "#FEF3BD",
-      "#C1E1C5",
-      "#BEDADC",
-      "#C4DEF6",
-      "#BED3F3",
-      "#D4C4FB",
-    ]
-  }
-  name="color_picker"
-  onChangeComplete={[Function]}
-  styles={{}}
-  triangle="top-left"
-  value="Foo"
-  width={200}
-/>
+<div>
+  <div
+    class="github-picker "
+    style="width: 200px; background: rgb(255, 255, 255); border: 1px solid rgba(0,0,0,0.2); box-shadow: 0 3px 12px rgba(0,0,0,0.15); border-radius: 4px; position: relative; padding: 5px; display: flex; flex-wrap: wrap;"
+  >
+    <div
+      style="position: absolute; border: 8px solid transparent; border-bottom-color: rgba(0,0,0,0.15); top: -16px; left: 9px;"
+    />
+    <div
+      style="position: absolute; border: 7px solid transparent; border-bottom-color: #fff; top: -14px; left: 10px;"
+    />
+    <span>
+      <div
+        style="width: 25px; height: 25px; font-size: 0px;"
+      >
+        <span>
+          <div
+            style="background: rgb(184, 0, 0); height: 100%; width: 100%; cursor: pointer; position: relative; outline: none;"
+            tabindex="0"
+            title="#B80000"
+          />
+        </span>
+      </div>
+    </span>
+    <span>
+      <div
+        style="width: 25px; height: 25px; font-size: 0px;"
+      >
+        <span>
+          <div
+            style="background: rgb(219, 62, 0); height: 100%; width: 100%; cursor: pointer; position: relative; outline: none;"
+            tabindex="0"
+            title="#DB3E00"
+          />
+        </span>
+      </div>
+    </span>
+    <span>
+      <div
+        style="width: 25px; height: 25px; font-size: 0px;"
+      >
+        <span>
+          <div
+            style="background: rgb(252, 203, 0); height: 100%; width: 100%; cursor: pointer; position: relative; outline: none;"
+            tabindex="0"
+            title="#FCCB00"
+          />
+        </span>
+      </div>
+    </span>
+    <span>
+      <div
+        style="width: 25px; height: 25px; font-size: 0px;"
+      >
+        <span>
+          <div
+            style="background: rgb(0, 139, 2); height: 100%; width: 100%; cursor: pointer; position: relative; outline: none;"
+            tabindex="0"
+            title="#008B02"
+          />
+        </span>
+      </div>
+    </span>
+    <span>
+      <div
+        style="width: 25px; height: 25px; font-size: 0px;"
+      >
+        <span>
+          <div
+            style="background: rgb(0, 107, 118); height: 100%; width: 100%; cursor: pointer; position: relative; outline: none;"
+            tabindex="0"
+            title="#006B76"
+          />
+        </span>
+      </div>
+    </span>
+    <span>
+      <div
+        style="width: 25px; height: 25px; font-size: 0px;"
+      >
+        <span>
+          <div
+            style="background: rgb(18, 115, 222); height: 100%; width: 100%; cursor: pointer; position: relative; outline: none;"
+            tabindex="0"
+            title="#1273DE"
+          />
+        </span>
+      </div>
+    </span>
+    <span>
+      <div
+        style="width: 25px; height: 25px; font-size: 0px;"
+      >
+        <span>
+          <div
+            style="background: rgb(0, 77, 207); height: 100%; width: 100%; cursor: pointer; position: relative; outline: none;"
+            tabindex="0"
+            title="#004DCF"
+          />
+        </span>
+      </div>
+    </span>
+    <span>
+      <div
+        style="width: 25px; height: 25px; font-size: 0px;"
+      >
+        <span>
+          <div
+            style="background: rgb(83, 0, 235); height: 100%; width: 100%; cursor: pointer; position: relative; outline: none;"
+            tabindex="0"
+            title="#5300EB"
+          />
+        </span>
+      </div>
+    </span>
+    <span>
+      <div
+        style="width: 25px; height: 25px; font-size: 0px;"
+      >
+        <span>
+          <div
+            style="background: rgb(235, 150, 148); height: 100%; width: 100%; cursor: pointer; position: relative; outline: none;"
+            tabindex="0"
+            title="#EB9694"
+          />
+        </span>
+      </div>
+    </span>
+    <span>
+      <div
+        style="width: 25px; height: 25px; font-size: 0px;"
+      >
+        <span>
+          <div
+            style="background: rgb(250, 208, 195); height: 100%; width: 100%; cursor: pointer; position: relative; outline: none;"
+            tabindex="0"
+            title="#FAD0C3"
+          />
+        </span>
+      </div>
+    </span>
+    <span>
+      <div
+        style="width: 25px; height: 25px; font-size: 0px;"
+      >
+        <span>
+          <div
+            style="background: rgb(254, 243, 189); height: 100%; width: 100%; cursor: pointer; position: relative; outline: none;"
+            tabindex="0"
+            title="#FEF3BD"
+          />
+        </span>
+      </div>
+    </span>
+    <span>
+      <div
+        style="width: 25px; height: 25px; font-size: 0px;"
+      >
+        <span>
+          <div
+            style="background: rgb(193, 225, 197); height: 100%; width: 100%; cursor: pointer; position: relative; outline: none;"
+            tabindex="0"
+            title="#C1E1C5"
+          />
+        </span>
+      </div>
+    </span>
+    <span>
+      <div
+        style="width: 25px; height: 25px; font-size: 0px;"
+      >
+        <span>
+          <div
+            style="background: rgb(190, 218, 220); height: 100%; width: 100%; cursor: pointer; position: relative; outline: none;"
+            tabindex="0"
+            title="#BEDADC"
+          />
+        </span>
+      </div>
+    </span>
+    <span>
+      <div
+        style="width: 25px; height: 25px; font-size: 0px;"
+      >
+        <span>
+          <div
+            style="background: rgb(196, 222, 246); height: 100%; width: 100%; cursor: pointer; position: relative; outline: none;"
+            tabindex="0"
+            title="#C4DEF6"
+          />
+        </span>
+      </div>
+    </span>
+    <span>
+      <div
+        style="width: 25px; height: 25px; font-size: 0px;"
+      >
+        <span>
+          <div
+            style="background: rgb(190, 211, 243); height: 100%; width: 100%; cursor: pointer; position: relative; outline: none;"
+            tabindex="0"
+            title="#BED3F3"
+          />
+        </span>
+      </div>
+    </span>
+    <span>
+      <div
+        style="width: 25px; height: 25px; font-size: 0px;"
+      >
+        <span>
+          <div
+            style="background: rgb(212, 196, 251); height: 100%; width: 100%; cursor: pointer; position: relative; outline: none;"
+            tabindex="0"
+            title="#D4C4FB"
+          />
+        </span>
+      </div>
+    </span>
+  </div>
+</div>
 `;

package/src/components/widgets/__tests__/__snapshots__/DateField.spec.js.snap

@@ -1,20 +1,25 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`<DateField /> matches the latest snapshot 1`] = `
-<DateInput
-  animation=""
-  closable={true}
-  dateFormat="YYYY-MM-DD"
-  duration={0}
-  icon="calendar"
-  iconPosition="left"
-  inline={false}
-  localization="en"
-  name="name"
-  onChange={[Function]}
-  placeholder="Date"
-  preserveViewMode={true}
-  startMode="day"
-  value="2020-05-11"
-/>
+<div>
+  <div
+    class="field"
+  >
+    <div
+      class="ui left icon input"
+    >
+      <i
+        aria-hidden="true"
+        class="calendar icon"
+      />
+      <input
+        name="name"
+        placeholder="Date"
+        tabindex="0"
+        type="text"
+        value="2020-05-11"
+      />
+    </div>
+  </div>
+</div>
 `;

package/src/components/widgets/__tests__/__snapshots__/DateTimeField.spec.js.snap

@@ -1,24 +1,25 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`<DateTimeField /> matches the latest snapshot 1`] = `
-<DateTimeInput
-  animation=""
-  closable={true}
-  dateFormat="DD-MM-YYYY"
-  dateTimeFormat="YYYY-MM-DD HH:mm"
-  disableMinute={false}
-  divider=" "
-  duration={0}
-  icon="calendar"
-  iconPosition="left"
-  inline={false}
-  localization="en"
-  name="name"
-  onChange={[Function]}
-  placeholder="Date Time"
-  preserveViewMode={true}
-  startMode="day"
-  timeFormat="24"
-  value="2020-05-11 22:00"
-/>
+<div>
+  <div
+    class="field"
+  >
+    <div
+      class="ui left icon input"
+    >
+      <i
+        aria-hidden="true"
+        class="calendar icon"
+      />
+      <input
+        name="name"
+        placeholder="Date Time"
+        tabindex="0"
+        type="text"
+        value="2020-05-11 22:00"
+      />
+    </div>
+  </div>
+</div>
 `;

package/src/components/widgets/__tests__/__snapshots__/DomainPreview.spec.js.snap

@@ -1,34 +1,39 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`<DomainPreview /> matches the latest snapshot when value is array 1`] = `
-[
-  <Label
-    key="1"
+<div>
+  <div
+    class="ui label"
   >
-    <Link
-      to="/domains/1"
+    <a
+      data-discover="true"
+      href="/domains/1"
     >
       name
-    </Link>
-  </Label>,
-  <Label
-    key="2"
+    </a>
+  </div>
+  <div
+    class="ui label"
   >
-    <Link
-      to="/domains/2"
+    <a
+      data-discover="true"
+      href="/domains/2"
     >
       name1
-    </Link>
-  </Label>,
-]
+    </a>
+  </div>
+</div>
 `;
 
 exports[`<DomainPreview /> matches the latest snapshot when value is object 1`] = `
-<Label
-  key="1"
->
-  <Link
-    to="/domains/1"
-  />
-</Label>
+<div>
+  <div
+    class="ui label"
+  >
+    <a
+      data-discover="true"
+      href="/domains/1"
+    />
+  </div>
+</div>
 `;

package/src/components/widgets/__tests__/__snapshots__/DropdownDataLoader.spec.js.snap

@@ -1,3 +1,3 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`<DropdownDataLoader /> matches the latest snapshot when type system 1`] = `<lazy />`;
+exports[`<DropdownDataLoader /> matches the latest snapshot when type system 1`] = `<div />`;

package/src/components/widgets/__tests__/__snapshots__/DropdownField.spec.js.snap

@@ -28,7 +28,7 @@ exports[`<DropdownField /> matches the latest snapshot 1`] = `
           class="divider text"
           role="alert"
         >
-          Select one...
+          fields.dropdown.placeholder
         </div>
         <i
           aria-hidden="true"
@@ -49,23 +49,12 @@ exports[`<DropdownField /> matches the latest snapshot 1`] = `
             <span
               class="text"
             >
-              No selection
+              selector.no.selection
             </span>
           </div>
         </div>
       </div>
     </div>
-    <div
-      class="ui inverted dimmer"
-    >
-      <div
-        class="content"
-      >
-        <div
-          class="ui loader"
-        />
-      </div>
-    </div>
   </div>
 </div>
 `;
@@ -76,29 +65,102 @@ exports[`<DropdownField /> matches the latest snapshot when type domain 1`] = `
     class="dimmable"
   >
     <div
-      class="field"
+      class="field fix-dropdown-selector "
     >
       <div
-        class="ui loading icon input"
+        aria-disabled="false"
+        aria-expanded="false"
+        aria-multiselectable="false"
+        class="ui floating dropdown"
+        role="listbox"
+        tabindex="0"
       >
-        <input
-          type="text"
-        />
+        <div
+          class="ui label"
+        >
+          <i
+            aria-hidden="true"
+            class="delete icon"
+          />
+        </div>
         <i
           aria-hidden="true"
-          class="spinner icon"
+          class="dropdown icon"
         />
-      </div>
-    </div>
-    <div
-      class="ui inverted dimmer"
-    >
-      <div
-        class="content"
-      >
         <div
-          class="ui loader"
-        />
+          class="menu transition"
+        >
+          <div
+            class="ui fluid left icon input search "
+          >
+            <input
+              type="text"
+            />
+            <i
+              aria-hidden="true"
+              class="search icon"
+            />
+          </div>
+          <div
+            class="scrolling menu transition"
+          >
+            <div
+              aria-selected="false"
+              class="item"
+              role="option"
+            >
+              <div
+                class="item-content"
+                style="margin-left: 0px; padding-left: 5px;"
+              >
+                <i
+                  aria-hidden="true"
+                  class="chevron right icon"
+                />
+                <span
+                  style="opacity: 1;"
+                  title="barDomain"
+                >
+                  barDomain
+                </span>
+              </div>
+            </div>
+            <div
+              aria-selected="false"
+              class="item"
+              role="option"
+            >
+              <div
+                class="item-content"
+                style="margin-left: 0px; padding-left: 25px;"
+              >
+                <span
+                  style="opacity: 1;"
+                  title="bazDomain"
+                >
+                  bazDomain
+                </span>
+              </div>
+            </div>
+            <div
+              aria-selected="false"
+              class="item"
+              role="option"
+            >
+              <div
+                class="item-content"
+                style="margin-left: 0px; padding-left: 25px;"
+              >
+                <span
+                  style="opacity: 1;"
+                  title="fooDomain"
+                >
+                  fooDomain
+                </span>
+              </div>
+            </div>
+          </div>
+        </div>
       </div>
     </div>
   </div>
@@ -109,7 +171,6 @@ exports[`<DropdownField /> renders loader when type system 1`] = `
 <div>
   <div
     class="dimmable"
-    style=""
   >
     <div
       class="field"
@@ -134,7 +195,7 @@ exports[`<DropdownField /> renders loader when type system 1`] = `
           class="divider default text"
           role="alert"
         >
-          Select one...
+          fields.dropdown.placeholder
         </div>
         <i
           aria-hidden="true"
@@ -155,23 +216,12 @@ exports[`<DropdownField /> renders loader when type system 1`] = `
             <span
               class="text"
             >
-              No selection
+              selector.no.selection
             </span>
           </div>
         </div>
       </div>
     </div>
-    <div
-      class="ui inverted dimmer"
-    >
-      <div
-        class="content"
-      >
-        <div
-          class="ui loader"
-        />
-      </div>
-    </div>
   </div>
 </div>
 `;

package/src/components/widgets/__tests__/__snapshots__/DynamicField.spec.js.snap

@@ -18,7 +18,6 @@ exports[`<DynamicField /> matches the latest snapshot (checkbox widget) 1`] = `
           readonly=""
           tabindex="0"
           type="checkbox"
-          value=""
         />
         <label />
       </div>
@@ -370,7 +369,7 @@ exports[`<DynamicField /> matches the latest snapshot (dropdown widget) 1`] = `
             class="divider default text"
             role="alert"
           >
-            Select one...
+            fields.dropdown.placeholder
           </div>
           <i
             aria-hidden="true"
@@ -391,23 +390,12 @@ exports[`<DynamicField /> matches the latest snapshot (dropdown widget) 1`] = `
               <span
                 class="text"
               >
-                No selection
+                selector.no.selection
               </span>
             </div>
           </div>
         </div>
       </div>
-      <div
-        class="ui inverted dimmer"
-      >
-        <div
-          class="content"
-        >
-          <div
-            class="ui loader"
-          />
-        </div>
-      </div>
     </div>
   </div>
 </div>