@epam/uui 5.3.0 → 5.4.1

package/components/tables/columnsConfigurationModal/__tests__/__snapshots__/ColumnsConfigurationModal.test.tsx.snap

@@ -1,951 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`ColumnsConfigurationModal should be rendered correctly 1`] = `
-<div
-  className="container modalBlocker"
-  style={
-    Object {
-      "zIndex": 1,
-    }
-  }
->
-  <div
-    aria-label="Click to close a modal"
-    className="uui-modal-blocker"
-    onClick={[Function]}
-  />
-  <div
-    data-focus-guard={true}
-    style={
-      Object {
-        "height": "0px",
-        "left": "1px",
-        "overflow": "hidden",
-        "padding": 0,
-        "position": "fixed",
-        "top": "1px",
-        "width": "1px",
-      }
-    }
-    tabIndex={0}
-  />
-  <div
-    data-focus-lock-disabled={false}
-    onBlur={[Function]}
-    onFocus={[Function]}
-  >
-    <div
-      aria-modal={true}
-      className="uui-modal-window root modal container"
-      role="dialog"
-      style={
-        Object {
-          "height": "700px",
-          "width": "420px",
-        }
-      }
-    >
-      <div
-        className="uui-flex-row root size-36 padding-24 vPadding-12 spacing-12 root modalHeader container align-items-center"
-        style={
-          Object {
-            "columnGap": undefined,
-            "rowGap": undefined,
-          }
-        }
-      >
-        <div
-          className="root uui-text uui-color-primary uui-font-weight-600 uui-font-style-normal uui-typography line-height-24 font-size-18 v-padding-12 container"
-        >
-          Configure columns
-        </div>
-        <div
-          className="flexSpacer"
-        />
-        <div
-          className="flexCell"
-          style={
-            Object {
-              "alignSelf": undefined,
-              "flexBasis": "auto",
-              "flexGrow": undefined,
-              "flexShrink": 0,
-              "minWidth": 0,
-              "textAlign": undefined,
-            }
-          }
-        >
-          <button
-            aria-label="Close modal"
-            className="container uui-button-box uui-enabled -clickable uui-icon_button uui-color-neutral root"
-            onClick={[Function]}
-            tabIndex={0}
-            type="button"
-          >
-            <div
-              className="container uui-icon uui-enabled"
-              style={Object {}}
-            >
-              <svg
-                className=""
-              />
-            </div>
-          </button>
-        </div>
-      </div>
-      <div
-        className="uui-flex-row root size-36 padding-24 borderBottom spacing-12 searchArea container align-items-center"
-        style={
-          Object {
-            "columnGap": undefined,
-            "rowGap": undefined,
-          }
-        }
-      >
-        <div
-          className="container uui-input-box -clickable root size-30 mode-form"
-          onBlur={[Function]}
-          onFocus={[Function]}
-          tabIndex={-1}
-        >
-          <div
-            className="container uui-icon uui-enabled"
-            style={Object {}}
-          >
-            <svg
-              className=""
-            />
-          </div>
-          <input
-            className="uui-input"
-            inputMode="search"
-            onChange={[Function]}
-            onKeyDown={[Function]}
-            placeholder="Search by column name"
-            tabIndex={0}
-            type="search"
-            value=""
-          />
-        </div>
-        <button
-          aria-expanded={false}
-          aria-haspopup={false}
-          className="container uui-button-box uui-enabled -clickable root uui-button uui-fill-none uui-color-secondary uui-size-30"
-          onClick={[Function]}
-          tabIndex={0}
-          type="button"
-        >
-          <div
-            className="container uui-icon uui-enabled"
-            style={Object {}}
-          >
-            <svg
-              className=""
-            />
-          </div>
-        </button>
-      </div>
-      <div
-        className="uui-panel root uui-color-surface mainPanel container"
-      >
-        <div
-          className="root root uui-scroll-bars uui-shadow-top uui-shadow-bottom"
-          style={
-            Object {
-              "display": "flex",
-              "height": "100%",
-              "overflow": "hidden",
-              "position": "relative",
-              "width": "100%",
-            }
-          }
-        >
-          <div
-            style={
-              Object {
-                "WebkitOverflowScrolling": "touch",
-                "bottom": 0,
-                "flex": "1 1 auto",
-                "left": 0,
-                "marginBottom": 0,
-                "marginRight": 0,
-                "overflow": "scroll",
-                "position": "relative",
-                "right": 0,
-                "top": 0,
-              }
-            }
-          >
-            <div
-              className="uui-flex-row root size-24 padding-24 spacing-6 groupTitle container align-items-center"
-              style={
-                Object {
-                  "columnGap": undefined,
-                  "rowGap": undefined,
-                }
-              }
-            >
-              <div
-                className="root uui-text uui-color-primary uui-font-weight-600 uui-font-style-normal uui-typography line-height-24 font-size-14 v-padding-6 groupTitleText container"
-              >
-                Displayed in table
-              </div>
-              <button
-                className="container uui-button-box uui-enabled uui-badge root size-18 uui-fill-solid uui-color-neutral groupTitleBadge"
-                onClick={[Function]}
-                tabIndex={-1}
-                type="button"
-              >
-                <div
-                  className="uui-caption"
-                >
-                  2
-                </div>
-              </button>
-            </div>
-            <div
-              className="uui-flex-row root size-30 groupItems container align-items-center"
-              style={
-                Object {
-                  "columnGap": undefined,
-                  "rowGap": undefined,
-                }
-              }
-            >
-              <div
-                className="uui-flex-row root size-30 rowWrapper notPinned -draggable container align-items-center"
-                onPointerEnter={[Function]}
-                onPointerLeave={[Function]}
-                onPointerMove={[Function]}
-                onPointerUp={[Function]}
-                style={
-                  Object {
-                    "columnGap": undefined,
-                    "rowGap": undefined,
-                  }
-                }
-              >
-                <div
-                  className="dragHandle container uui-drag-handle"
-                  onPointerDown={[Function]}
-                  onTouchStart={[Function]}
-                />
-                <label
-                  className="container uui-checkbox-container root size-18 mode-form uui-color-primary checkbox uui-disabled"
-                  tabIndex={-1}
-                >
-                  <div
-                    className="uui-checkbox uui-checked"
-                  >
-                    <input
-                      aria-checked={true}
-                      aria-disabled={true}
-                      checked={true}
-                      disabled={true}
-                      onChange={[Function]}
-                      tabIndex={-1}
-                      type="checkbox"
-                    />
-                    <div
-                      className="container uui-icon uui-enabled"
-                      style={Object {}}
-                    >
-                      <svg
-                        className=""
-                      />
-                    </div>
-                  </div>
-                  <div
-                    className="uui-input-label"
-                  >
-                    ID
-                  </div>
-                </label>
-                <div
-                  className="uui-flex-row root size-30 pinIconButton container align-items-center"
-                  style={
-                    Object {
-                      "columnGap": undefined,
-                      "rowGap": undefined,
-                    }
-                  }
-                >
-                  <span
-                    onMouseOut={[Function]}
-                    onMouseOver={[Function]}
-                  >
-                    <button
-                      aria-disabled={false}
-                      className="container uui-button-box uui-enabled -clickable uui-icon_button uui-color-neutral root"
-                      onClick={[Function]}
-                      tabIndex={0}
-                      type="button"
-                    >
-                      <div
-                        className="container uui-icon uui-enabled"
-                        style={Object {}}
-                      >
-                        <svg
-                          className=""
-                        />
-                      </div>
-                    </button>
-                  </span>
-                </div>
-              </div>
-              <div
-                className="uui-flex-row root size-30 rowWrapper notPinned -draggable container align-items-center"
-                onPointerEnter={[Function]}
-                onPointerLeave={[Function]}
-                onPointerMove={[Function]}
-                onPointerUp={[Function]}
-                style={
-                  Object {
-                    "columnGap": undefined,
-                    "rowGap": undefined,
-                  }
-                }
-              >
-                <div
-                  className="dragHandle container uui-drag-handle"
-                  onPointerDown={[Function]}
-                  onTouchStart={[Function]}
-                />
-                <label
-                  className="container uui-checkbox-container root size-18 mode-form uui-color-primary checkbox uui-disabled"
-                  tabIndex={-1}
-                >
-                  <div
-                    className="uui-checkbox uui-checked"
-                  >
-                    <input
-                      aria-checked={true}
-                      aria-disabled={true}
-                      checked={true}
-                      disabled={true}
-                      onChange={[Function]}
-                      tabIndex={-1}
-                      type="checkbox"
-                    />
-                    <div
-                      className="container uui-icon uui-enabled"
-                      style={Object {}}
-                    >
-                      <svg
-                        className=""
-                      />
-                    </div>
-                  </div>
-                  <div
-                    className="uui-input-label"
-                  >
-                    Level
-                  </div>
-                </label>
-                <div
-                  className="uui-flex-row root size-30 pinIconButton container align-items-center"
-                  style={
-                    Object {
-                      "columnGap": undefined,
-                      "rowGap": undefined,
-                    }
-                  }
-                >
-                  <span
-                    onMouseOut={[Function]}
-                    onMouseOver={[Function]}
-                  >
-                    <button
-                      aria-disabled={false}
-                      className="container uui-button-box uui-enabled -clickable uui-icon_button uui-color-neutral root"
-                      onClick={[Function]}
-                      tabIndex={0}
-                      type="button"
-                    >
-                      <div
-                        className="container uui-icon uui-enabled"
-                        style={Object {}}
-                      >
-                        <svg
-                          className=""
-                        />
-                      </div>
-                    </button>
-                  </span>
-                </div>
-              </div>
-            </div>
-          </div>
-          <div
-            className="uui-track-horizontal"
-            style={
-              Object {
-                "display": "none",
-                "height": 6,
-                "position": "absolute",
-              }
-            }
-          >
-            <div
-              className="uui-thumb-horizontal"
-            />
-          </div>
-          <div
-            className="uui-track-vertical"
-            style={
-              Object {
-                "display": "none",
-                "position": "absolute",
-                "width": 6,
-              }
-            }
-          >
-            <div
-              className="uui-thumb-vertical"
-            />
-          </div>
-        </div>
-      </div>
-      <div
-        className="uui-flex-row root size-36 padding-24 vPadding-24 spacing-12 root modalFooter borderTop container align-items-center"
-        style={
-          Object {
-            "columnGap": undefined,
-            "rowGap": undefined,
-          }
-        }
-      >
-        <button
-          className="container uui-button-box uui-enabled -clickable uui-link_button root uui-size-36 uui-has-left-icon uui-no-right-icon uui-color-primary"
-          onClick={[Function]}
-          tabIndex={0}
-          type="button"
-        >
-          <div
-            className="container uui-icon uui-enabled"
-            style={Object {}}
-          >
-            <svg
-              className=""
-            />
-          </div>
-          <div
-            className="uui-caption"
-          >
-            Reset to Default
-          </div>
-        </button>
-        <div
-          className="flexSpacer"
-        />
-        <button
-          className="container uui-button-box uui-enabled -clickable root uui-button uui-fill-none uui-color-secondary uui-size-36"
-          onClick={[Function]}
-          tabIndex={0}
-          type="button"
-        >
-          <div
-            className="uui-caption"
-          >
-            Cancel
-          </div>
-        </button>
-        <button
-          aria-disabled={false}
-          className="container uui-button-box uui-enabled -clickable root uui-button uui-fill-solid uui-color-primary uui-size-36"
-          onClick={[Function]}
-          tabIndex={0}
-          type="button"
-        >
-          <div
-            className="uui-caption"
-          >
-            Apply
-          </div>
-        </button>
-      </div>
-    </div>
-  </div>
-  <div
-    data-focus-guard={true}
-    style={
-      Object {
-        "height": "0px",
-        "left": "1px",
-        "overflow": "hidden",
-        "padding": 0,
-        "position": "fixed",
-        "top": "1px",
-        "width": "1px",
-      }
-    }
-    tabIndex={0}
-  />
-</div>
-`;
-
-exports[`ColumnsConfigurationModal should disable Apply button if all columns are hidden 1`] = `
-<div
-  className="container modalBlocker"
-  style={
-    Object {
-      "zIndex": 1,
-    }
-  }
->
-  <div
-    aria-label="Click to close a modal"
-    className="uui-modal-blocker"
-    onClick={[Function]}
-  />
-  <div
-    data-focus-guard={true}
-    style={
-      Object {
-        "height": "0px",
-        "left": "1px",
-        "overflow": "hidden",
-        "padding": 0,
-        "position": "fixed",
-        "top": "1px",
-        "width": "1px",
-      }
-    }
-    tabIndex={0}
-  />
-  <div
-    data-focus-lock-disabled={false}
-    onBlur={[Function]}
-    onFocus={[Function]}
-  >
-    <div
-      aria-modal={true}
-      className="uui-modal-window root modal container"
-      role="dialog"
-      style={
-        Object {
-          "height": "700px",
-          "width": "420px",
-        }
-      }
-    >
-      <div
-        className="uui-flex-row root size-36 padding-24 vPadding-12 spacing-12 root modalHeader container align-items-center"
-        style={
-          Object {
-            "columnGap": undefined,
-            "rowGap": undefined,
-          }
-        }
-      >
-        <div
-          className="root uui-text uui-color-primary uui-font-weight-600 uui-font-style-normal uui-typography line-height-24 font-size-18 v-padding-12 container"
-        >
-          Configure columns
-        </div>
-        <div
-          className="flexSpacer"
-        />
-        <div
-          className="flexCell"
-          style={
-            Object {
-              "alignSelf": undefined,
-              "flexBasis": "auto",
-              "flexGrow": undefined,
-              "flexShrink": 0,
-              "minWidth": 0,
-              "textAlign": undefined,
-            }
-          }
-        >
-          <button
-            aria-label="Close modal"
-            className="container uui-button-box uui-enabled -clickable uui-icon_button uui-color-neutral root"
-            onClick={[Function]}
-            tabIndex={0}
-            type="button"
-          >
-            <div
-              className="container uui-icon uui-enabled"
-              style={Object {}}
-            >
-              <svg
-                className=""
-              />
-            </div>
-          </button>
-        </div>
-      </div>
-      <div
-        className="uui-flex-row root size-36 padding-24 borderBottom spacing-12 searchArea container align-items-center"
-        style={
-          Object {
-            "columnGap": undefined,
-            "rowGap": undefined,
-          }
-        }
-      >
-        <div
-          className="container uui-input-box -clickable root size-30 mode-form"
-          onBlur={[Function]}
-          onFocus={[Function]}
-          tabIndex={-1}
-        >
-          <div
-            className="container uui-icon uui-enabled"
-            style={Object {}}
-          >
-            <svg
-              className=""
-            />
-          </div>
-          <input
-            className="uui-input"
-            inputMode="search"
-            onChange={[Function]}
-            onKeyDown={[Function]}
-            placeholder="Search by column name"
-            tabIndex={0}
-            type="search"
-            value=""
-          />
-        </div>
-        <button
-          aria-expanded={false}
-          aria-haspopup={false}
-          className="container uui-button-box uui-enabled -clickable root uui-button uui-fill-none uui-color-secondary uui-size-30"
-          onClick={[Function]}
-          tabIndex={0}
-          type="button"
-        >
-          <div
-            className="container uui-icon uui-enabled"
-            style={Object {}}
-          >
-            <svg
-              className=""
-            />
-          </div>
-        </button>
-      </div>
-      <div
-        className="uui-panel root uui-color-surface mainPanel container"
-      >
-        <div
-          className="root root uui-scroll-bars uui-shadow-top uui-shadow-bottom"
-          style={
-            Object {
-              "display": "flex",
-              "height": "100%",
-              "overflow": "hidden",
-              "position": "relative",
-              "width": "100%",
-            }
-          }
-        >
-          <div
-            style={
-              Object {
-                "WebkitOverflowScrolling": "touch",
-                "bottom": 0,
-                "flex": "1 1 auto",
-                "left": 0,
-                "marginBottom": 0,
-                "marginRight": 0,
-                "overflow": "scroll",
-                "position": "relative",
-                "right": 0,
-                "top": 0,
-              }
-            }
-          >
-            <div
-              className="uui-flex-row root size-24 padding-24 spacing-6 groupTitle container align-items-center"
-              style={
-                Object {
-                  "columnGap": undefined,
-                  "rowGap": undefined,
-                }
-              }
-            >
-              <div
-                className="root uui-text uui-color-primary uui-font-weight-600 uui-font-style-normal uui-typography line-height-24 font-size-14 v-padding-6 groupTitleText container"
-              >
-                Hidden in table
-              </div>
-              <button
-                className="container uui-button-box uui-enabled uui-badge root size-18 uui-fill-solid uui-color-neutral groupTitleBadge"
-                onClick={[Function]}
-                tabIndex={-1}
-                type="button"
-              >
-                <div
-                  className="uui-caption"
-                >
-                  2
-                </div>
-              </button>
-            </div>
-            <div
-              className="uui-flex-row root size-30 groupItems container align-items-center"
-              style={
-                Object {
-                  "columnGap": undefined,
-                  "rowGap": undefined,
-                }
-              }
-            >
-              <div
-                className="uui-flex-row root size-30 rowWrapper notPinned -draggable container align-items-center"
-                onPointerEnter={[Function]}
-                onPointerLeave={[Function]}
-                onPointerMove={[Function]}
-                onPointerUp={[Function]}
-                style={
-                  Object {
-                    "columnGap": undefined,
-                    "rowGap": undefined,
-                  }
-                }
-              >
-                <div
-                  className="dragHandle container uui-drag-handle"
-                  onPointerDown={[Function]}
-                  onTouchStart={[Function]}
-                />
-                <label
-                  className="container uui-checkbox-container root size-18 mode-form uui-color-primary checkbox -clickable"
-                  tabIndex={-1}
-                >
-                  <div
-                    className="uui-checkbox"
-                  >
-                    <input
-                      aria-checked={false}
-                      checked={false}
-                      disabled={false}
-                      onChange={[Function]}
-                      tabIndex={0}
-                      type="checkbox"
-                    />
-                  </div>
-                  <div
-                    className="uui-input-label"
-                  >
-                    ID
-                  </div>
-                </label>
-                <div
-                  className="uui-flex-row root size-30 pinIconButton container align-items-center"
-                  style={
-                    Object {
-                      "columnGap": undefined,
-                      "rowGap": undefined,
-                    }
-                  }
-                >
-                  <span
-                    onMouseOut={[Function]}
-                    onMouseOver={[Function]}
-                  >
-                    <button
-                      aria-disabled={false}
-                      className="container uui-button-box uui-enabled -clickable uui-icon_button uui-color-neutral root"
-                      onClick={[Function]}
-                      tabIndex={0}
-                      type="button"
-                    >
-                      <div
-                        className="container uui-icon uui-enabled"
-                        style={Object {}}
-                      >
-                        <svg
-                          className=""
-                        />
-                      </div>
-                    </button>
-                  </span>
-                </div>
-              </div>
-              <div
-                className="uui-flex-row root size-30 rowWrapper notPinned -draggable container align-items-center"
-                onPointerEnter={[Function]}
-                onPointerLeave={[Function]}
-                onPointerMove={[Function]}
-                onPointerUp={[Function]}
-                style={
-                  Object {
-                    "columnGap": undefined,
-                    "rowGap": undefined,
-                  }
-                }
-              >
-                <div
-                  className="dragHandle container uui-drag-handle"
-                  onPointerDown={[Function]}
-                  onTouchStart={[Function]}
-                />
-                <label
-                  className="container uui-checkbox-container root size-18 mode-form uui-color-primary checkbox -clickable"
-                  tabIndex={-1}
-                >
-                  <div
-                    className="uui-checkbox"
-                  >
-                    <input
-                      aria-checked={false}
-                      checked={false}
-                      disabled={false}
-                      onChange={[Function]}
-                      tabIndex={0}
-                      type="checkbox"
-                    />
-                  </div>
-                  <div
-                    className="uui-input-label"
-                  >
-                    Level
-                  </div>
-                </label>
-                <div
-                  className="uui-flex-row root size-30 pinIconButton container align-items-center"
-                  style={
-                    Object {
-                      "columnGap": undefined,
-                      "rowGap": undefined,
-                    }
-                  }
-                >
-                  <span
-                    onMouseOut={[Function]}
-                    onMouseOver={[Function]}
-                  >
-                    <button
-                      aria-disabled={false}
-                      className="container uui-button-box uui-enabled -clickable uui-icon_button uui-color-neutral root"
-                      onClick={[Function]}
-                      tabIndex={0}
-                      type="button"
-                    >
-                      <div
-                        className="container uui-icon uui-enabled"
-                        style={Object {}}
-                      >
-                        <svg
-                          className=""
-                        />
-                      </div>
-                    </button>
-                  </span>
-                </div>
-              </div>
-            </div>
-          </div>
-          <div
-            className="uui-track-horizontal"
-            style={
-              Object {
-                "display": "none",
-                "height": 6,
-                "position": "absolute",
-              }
-            }
-          >
-            <div
-              className="uui-thumb-horizontal"
-            />
-          </div>
-          <div
-            className="uui-track-vertical"
-            style={
-              Object {
-                "display": "none",
-                "position": "absolute",
-                "width": 6,
-              }
-            }
-          >
-            <div
-              className="uui-thumb-vertical"
-            />
-          </div>
-        </div>
-      </div>
-      <div
-        className="uui-flex-row root size-36 padding-24 vPadding-24 spacing-12 root modalFooter borderTop container align-items-center"
-        style={
-          Object {
-            "columnGap": undefined,
-            "rowGap": undefined,
-          }
-        }
-      >
-        <button
-          className="container uui-button-box uui-enabled -clickable uui-link_button root uui-size-36 uui-has-left-icon uui-no-right-icon uui-color-primary"
-          onClick={[Function]}
-          tabIndex={0}
-          type="button"
-        >
-          <div
-            className="container uui-icon uui-enabled"
-            style={Object {}}
-          >
-            <svg
-              className=""
-            />
-          </div>
-          <div
-            className="uui-caption"
-          >
-            Reset to Default
-          </div>
-        </button>
-        <div
-          className="flexSpacer"
-        />
-        <button
-          className="container uui-button-box uui-enabled -clickable root uui-button uui-fill-none uui-color-secondary uui-size-36"
-          onClick={[Function]}
-          tabIndex={0}
-          type="button"
-        >
-          <div
-            className="uui-caption"
-          >
-            Cancel
-          </div>
-        </button>
-        <button
-          aria-disabled={true}
-          className="container uui-button-box uui-disabled -clickable root uui-button uui-fill-solid uui-color-primary uui-size-36"
-          onClick={[Function]}
-          tabIndex={-1}
-          type="button"
-        >
-          <div
-            className="uui-caption"
-          >
-            Apply
-          </div>
-        </button>
-      </div>
-    </div>
-  </div>
-  <div
-    data-focus-guard={true}
-    style={
-      Object {
-        "height": "0px",
-        "left": "1px",
-        "overflow": "hidden",
-        "padding": 0,
-        "position": "fixed",
-        "top": "1px",
-        "width": "1px",
-      }
-    }
-    tabIndex={0}
-  />
-</div>
-`;