@wix/design-system 1.0.0

package/dist/cjs/ColorInput/ColorInput.js

@@ -0,0 +1,245 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.default = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _Input = _interopRequireDefault(require("../Input"));
+var _Hash = require("./components/Hash");
+var _ColorViewer = require("./components/ColorViewer");
+var _hexHelpers = require("./hex-helpers");
+var _Box = _interopRequireDefault(require("../Box"));
+var _excluded = ["placeholder", "size"];
+var _jsxFileName = "/home/builduser/work/31dad9578a4e06bb/packages/wix-design-system/dist/cjs/ColorInput/ColorInput.js";
+class ColorInput extends _react.default.Component {
+  constructor(props) {
+    super(props);
+    this._renderPrefix = () => {
+      var {
+        disabled,
+        size
+      } = this.props;
+      var {
+        active,
+        value
+      } = this.state;
+      var hash = /*#__PURE__*/_react.default.createElement(_Input.default.Affix, {
+        __self: this,
+        __source: {
+          fileName: _jsxFileName,
+          lineNumber: 75,
+          columnNumber: 7
+        }
+      }, /*#__PURE__*/_react.default.createElement(_Hash.Hash, {
+        disabled: disabled,
+        size: size,
+        __self: this,
+        __source: {
+          fileName: _jsxFileName,
+          lineNumber: 76,
+          columnNumber: 9
+        }
+      }));
+      return active || value ? hash : undefined;
+    };
+    this._renderSuffix = () => {
+      var {
+        value,
+        active
+      } = this.state;
+      var {
+        size,
+        popoverPlacement,
+        popoverAppendTo,
+        disabled,
+        colorPickerChildren,
+        onAddColor,
+        addTooltipContent,
+        placeholder,
+        popoverProps
+      } = this.props;
+      return /*#__PURE__*/_react.default.createElement(_Box.default, {
+        verticalAlign: "middle",
+        __self: this,
+        __source: {
+          fileName: _jsxFileName,
+          lineNumber: 96,
+          columnNumber: 7
+        }
+      }, /*#__PURE__*/_react.default.createElement(_ColorViewer.ColorViewer, {
+        value: value,
+        active: active,
+        disabled: disabled,
+        size: size,
+        placement: popoverPlacement,
+        appendTo: popoverAppendTo,
+        onClick: this.click,
+        onChange: this._onPickerChange,
+        onCancel: this.cancel,
+        onConfirm: this.confirm,
+        onClickOutside: this.confirm,
+        children: colorPickerChildren,
+        onAddColor: onAddColor,
+        addTooltipContent: addTooltipContent,
+        placeholder: placeholder,
+        popoverProps: popoverProps,
+        __self: this,
+        __source: {
+          fileName: _jsxFileName,
+          lineNumber: 97,
+          columnNumber: 9
+        }
+      }));
+    };
+    this._onChange = evt => {
+      var {
+        onChange
+      } = this.props;
+      var value = (0, _hexHelpers.normalizeHexInput)(evt.target.value);
+      this.setState({
+        value
+      }, () => onChange(value));
+    };
+    this._onPickerChange = value => {
+      var {
+        onChange
+      } = this.props;
+      this.setState({
+        active: true,
+        value
+      }, () => onChange(value));
+    };
+    this._onFocus = () => this.setState({
+      active: true
+    });
+    this._keyDown = e => {
+      e.stopPropagation();
+      e.key === 'Enter' && this.confirm();
+      e.key === 'Escape' && this.cancel();
+    };
+    this.click = () => {
+      this.input.focus();
+      this.setState({
+        active: true
+      });
+    };
+    this.confirm = () => {
+      var {
+        onConfirm,
+        onChange
+      } = this.props;
+      var value = (0, _hexHelpers.validateHex)(this.state.value);
+      this.setState({
+        active: false,
+        value,
+        previous: value
+      }, () => {
+        onConfirm(value);
+        onChange(value);
+      });
+    };
+    this.cancel = () => {
+      var {
+        onCancel,
+        onChange
+      } = this.props;
+      var {
+        previous
+      } = this.state;
+      this.setState({
+        active: false,
+        value: previous
+      }, () => {
+        onCancel(previous);
+        onChange(previous);
+      });
+    };
+    this.state = {
+      active: false,
+      previous: props.value,
+      value: ''
+    };
+  }
+  static getDerivedStateFromProps(props, state) {
+    if (!state.active && props.value !== state.value) {
+      return {
+        value: (0, _hexHelpers.normalizeHexInput)(props.value)
+      };
+    }
+    return {};
+  }
+  render() {
+    var _this$props = this.props,
+      {
+        placeholder,
+        size
+      } = _this$props,
+      rest = (0, _objectWithoutProperties2.default)(_this$props, _excluded);
+    var {
+      active,
+      value
+    } = this.state;
+    return /*#__PURE__*/_react.default.createElement(_Input.default, (0, _extends2.default)({}, rest, {
+      ref: input => this.input = input,
+      placeholder: active ? '' : placeholder,
+      size: size,
+      onKeyDown: this._keyDown,
+      onChange: this._onChange,
+      onFocus: this._onFocus,
+      onInputClicked: this.click,
+      value: value.replace('#', ''),
+      prefix: this._renderPrefix(),
+      suffix: this._renderSuffix(),
+      __self: this,
+      __source: {
+        fileName: _jsxFileName,
+        lineNumber: 176,
+        columnNumber: 7
+      }
+    }));
+  }
+}
+ColorInput.displayName = 'ColorInput';
+ColorInput.propTypes = {
+  /** Defines placeholder text to display on an empty input */
+  placeholder: _propTypes.default.string,
+  /** Specifies whether the input should be disabled */
+  disabled: _propTypes.default.bool,
+  /** Specifies the status of a field */
+  status: _propTypes.default.oneOf(['error', 'warning', 'loading']),
+  /** Defines the message to display on status icon hover. If not given or empty, there will be no tooltip. */
+  statusMessage: _propTypes.default.node,
+  /** Controls input size */
+  size: _propTypes.default.oneOf(['small', 'medium', 'large']),
+  /** Defines input value */
+  value: _propTypes.default.string.isRequired,
+  /** Returns confirmed value */
+  onConfirm: _propTypes.default.func,
+  /** Returns last confirmed value from `value` prop */
+  onCancel: _propTypes.default.func,
+  /** Returns changed value of input or color picker */
+  onChange: _propTypes.default.func,
+  /** Defines child items to render inside of a component. Accepts any kind of content. It receives the `changeColor` function to control <ColorInput/> value. */
+  colorPickerChildren: _propTypes.default.oneOfType([_propTypes.default.node, _propTypes.default.func]),
+  /** Defines a callback handler with color HEX string. Handler is called whenever the `Add Color` button is pressed. */
+  onAddColor: _propTypes.default.func,
+  /** Defines content to show in add button tooltip. Does not appear if `onAdd` is not passed. */
+  addTooltipContent: _propTypes.default.node,
+  /** Allows to pass popover props. See <Popover/> API for a full list. */
+  popoverProps: _propTypes.default.object
+};
+ColorInput.defaultProps = {
+  placeholder: '',
+  size: 'medium',
+  onChange: () => {},
+  onConfirm: () => {},
+  onCancel: () => {},
+  popoverProps: {},
+  value: ''
+};
+var _default = ColorInput;
+exports.default = _default;
+//# sourceMappingURL=ColorInput.js.map

package/dist/cjs/ColorInput/ColorInput.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["ColorInput","React","Component","constructor","props","_renderPrefix","disabled","size","active","value","state","hash","undefined","_renderSuffix","popoverPlacement","popoverAppendTo","colorPickerChildren","onAddColor","addTooltipContent","placeholder","popoverProps","click","_onPickerChange","cancel","confirm","_onChange","evt","onChange","normalizeHexInput","target","setState","_onFocus","_keyDown","e","stopPropagation","key","input","focus","onConfirm","validateHex","previous","onCancel","getDerivedStateFromProps","render","rest","replace","displayName","propTypes","PropTypes","string","bool","status","oneOf","statusMessage","node","isRequired","func","oneOfType","object","defaultProps"],"sources":["../../../src/ColorInput/ColorInput.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport Input from '../Input';\nimport { Hash } from './components/Hash';\nimport { ColorViewer } from './components/ColorViewer';\n\nimport { validateHex, normalizeHexInput } from './hex-helpers';\nimport Box from '../Box';\n\nclass ColorInput extends React.Component {\n  static displayName = 'ColorInput';\n\n  static propTypes = {\n    /** Defines placeholder text to display on an empty input */\n    placeholder: PropTypes.string,\n    /** Specifies whether the input should be disabled */\n    disabled: PropTypes.bool,\n    /** Specifies the status of a field */\n    status: PropTypes.oneOf(['error', 'warning', 'loading']),\n    /** Defines the message to display on status icon hover. If not given or empty, there will be no tooltip. */\n    statusMessage: PropTypes.node,\n    /** Controls input size */\n    size: PropTypes.oneOf(['small', 'medium', 'large']),\n    /** Defines input value */\n    value: PropTypes.string.isRequired,\n    /** Returns confirmed value */\n    onConfirm: PropTypes.func,\n    /** Returns last confirmed value from `value` prop */\n    onCancel: PropTypes.func,\n    /** Returns changed value of input or color picker */\n    onChange: PropTypes.func,\n    /** Defines child items to render inside of a component. Accepts any kind of content. It receives the `changeColor` function to control <ColorInput/> value. */\n    colorPickerChildren: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),\n    /** Defines a callback handler with color HEX string. Handler is called whenever the `Add Color` button is pressed. */\n    onAddColor: PropTypes.func,\n    /** Defines content to show in add button tooltip. Does not appear if `onAdd` is not passed. */\n    addTooltipContent: PropTypes.node,\n    /** Allows to pass popover props. See <Popover/> API for a full list. */\n    popoverProps: PropTypes.object,\n  };\n\n  static defaultProps = {\n    placeholder: '',\n    size: 'medium',\n    onChange: () => {},\n    onConfirm: () => {},\n    onCancel: () => {},\n    popoverProps: {},\n    value: '',\n  };\n\n  constructor(props) {\n    super(props);\n    this.state = {\n      active: false,\n      previous: props.value,\n      value: '',\n    };\n  }\n\n  static getDerivedStateFromProps(props, state) {\n    if (!state.active && props.value !== state.value) {\n      return {\n        value: normalizeHexInput(props.value),\n      };\n    }\n    return {};\n  }\n\n  _renderPrefix = () => {\n    const { disabled, size } = this.props;\n    const { active, value } = this.state;\n    const hash = (\n      <Input.Affix>\n        <Hash disabled={disabled} size={size} />\n      </Input.Affix>\n    );\n    return active || value ? hash : undefined;\n  };\n\n  _renderSuffix = () => {\n    const { value, active } = this.state;\n    const {\n      size,\n      popoverPlacement,\n      popoverAppendTo,\n      disabled,\n      colorPickerChildren,\n      onAddColor,\n      addTooltipContent,\n      placeholder,\n      popoverProps,\n    } = this.props;\n    return (\n      <Box verticalAlign=\"middle\">\n        <ColorViewer\n          value={value}\n          active={active}\n          disabled={disabled}\n          size={size}\n          placement={popoverPlacement}\n          appendTo={popoverAppendTo}\n          onClick={this.click}\n          onChange={this._onPickerChange}\n          onCancel={this.cancel}\n          onConfirm={this.confirm}\n          onClickOutside={this.confirm}\n          children={colorPickerChildren}\n          onAddColor={onAddColor}\n          addTooltipContent={addTooltipContent}\n          placeholder={placeholder}\n          popoverProps={popoverProps}\n        />\n      </Box>\n    );\n  };\n\n  _onChange = evt => {\n    const { onChange } = this.props;\n    const value = normalizeHexInput(evt.target.value);\n    this.setState({ value }, () => onChange(value));\n  };\n\n  _onPickerChange = value => {\n    const { onChange } = this.props;\n    this.setState({ active: true, value }, () => onChange(value));\n  };\n\n  _onFocus = () => this.setState({ active: true });\n\n  _keyDown = e => {\n    e.stopPropagation();\n    e.key === 'Enter' && this.confirm();\n    e.key === 'Escape' && this.cancel();\n  };\n  /**\n   * clicks the input element\n   * @returns {Void}\n   */\n  click = () => {\n    this.input.focus();\n    this.setState({ active: true });\n  };\n  /**\n   * sets the picked color\n   * @returns {Void}\n   */\n  confirm = () => {\n    const { onConfirm, onChange } = this.props;\n    const value = validateHex(this.state.value);\n    this.setState({ active: false, value, previous: value }, () => {\n      onConfirm(value);\n      onChange(value);\n    });\n  };\n  /**\n   * sets the previous color\n   * @returns {Void}\n   */\n\n  cancel = () => {\n    const { onCancel, onChange } = this.props;\n    const { previous } = this.state;\n\n    this.setState({ active: false, value: previous }, () => {\n      onCancel(previous);\n      onChange(previous);\n    });\n  };\n\n  render() {\n    const { placeholder, size, ...rest } = this.props;\n    const { active, value } = this.state;\n    return (\n      <Input\n        {...rest}\n        ref={input => (this.input = input)}\n        placeholder={active ? '' : placeholder}\n        size={size}\n        onKeyDown={this._keyDown}\n        onChange={this._onChange}\n        onFocus={this._onFocus}\n        onInputClicked={this.click}\n        value={value.replace('#', '')}\n        prefix={this._renderPrefix()}\n        suffix={this._renderSuffix()}\n      />\n    );\n  }\n}\n\nexport default ColorInput;\n"],"mappings":"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"}

package/dist/cjs/ColorInput/ColorInput.meta.js

@@ -0,0 +1,26 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.testkitTests = exports.ssrTests = exports.requiredProps = exports.a11yTests = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+// This object should contain a mock value for each required prop of this component
+var requiredProps = {
+  value: '#FFFFFF'
+};
+
+// This array should contain an object only for tests you wish to run on all compliance tests
+exports.requiredProps = requiredProps;
+var sharedTests = [{
+  title: 'render',
+  props: _objectSpread({}, requiredProps)
+}];
+var testkitTests = [...sharedTests];
+exports.testkitTests = testkitTests;
+var ssrTests = [...sharedTests];
+exports.ssrTests = ssrTests;
+var a11yTests = [...sharedTests];
+exports.a11yTests = a11yTests;
+//# sourceMappingURL=ColorInput.meta.js.map

package/dist/cjs/ColorInput/ColorInput.meta.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["requiredProps","value","sharedTests","title","props","testkitTests","ssrTests","a11yTests"],"sources":["../../../src/ColorInput/ColorInput.meta.tsx"],"sourcesContent":["import { ColorInputProps } from '.';\n\n// This object should contain a mock value for each required prop of this component\nexport const requiredProps: ColorInputProps = {\n  value: '#FFFFFF',\n};\n\n// This array should contain an object only for tests you wish to run on all compliance tests\nconst sharedTests = [\n  {\n    title: 'render',\n    props: {\n      ...requiredProps,\n    } as ColorInputProps,\n  },\n];\n\nexport const testkitTests = [...sharedTests];\n\nexport const ssrTests = [...sharedTests];\n\nexport const a11yTests = [...sharedTests];\n"],"mappings":";;;;;;;;AAEA;AACO,IAAMA,aAA8B,GAAG;EAC5CC,KAAK,EAAE;AACT,CAAC;;AAED;AAAA;AACA,IAAMC,WAAW,GAAG,CAClB;EACEC,KAAK,EAAE,QAAQ;EACfC,KAAK,oBACAJ,aAAa;AAEpB,CAAC,CACF;AAEM,IAAMK,YAAY,GAAG,CAAC,GAAGH,WAAW,CAAC;AAAC;AAEtC,IAAMI,QAAQ,GAAG,CAAC,GAAGJ,WAAW,CAAC;AAAC;AAElC,IAAMK,SAAS,GAAG,CAAC,GAAGL,WAAW,CAAC;AAAC"}

package/dist/cjs/ColorInput/ColorInput.private.uni.driver.js

@@ -0,0 +1,102 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.default = exports.colorInputPrivateDriverFactory = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+var _ColorInputUni = require("./ColorInput.uni.driver");
+var _SwatchesPrivateUni = require("../Swatches/test/Swatches.private.uni.driver");
+var _DataHooks = _interopRequireDefault(require("./DataHooks"));
+var _InputUni = _interopRequireDefault(require("../Input/Input.uni.driver"));
+var _PopoverUni = require("../Popover/Popover.uni.driver");
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var colorInputPrivateDriverFactory = (base, body) => {
+  var swatchesHook = "[data-hook=\"".concat(_DataHooks.default.COLOR_PICKER_SWATCHES, "\"]");
+  var swatchesDriver = (0, _SwatchesPrivateUni.swatchesPrivateDriverFactory)(base.$(swatchesHook));
+  var colorViewerPopoverHook = "[data-hook=\"".concat(_DataHooks.default.COLOR_INPUT_POPOVER, "\"]");
+  var colorViewerPopoverTestkit = (0, _PopoverUni.popoverUniDriverFactory)(base.$(colorViewerPopoverHook), body);
+  var isHashDisabled = /*#__PURE__*/function () {
+    var _ref = (0, _asyncToGenerator2.default)(function* () {
+      return (yield base.$("[data-hook=\"".concat(_DataHooks.default.COLOR_INPUT_HASH, "\"]")).attr('data-disabled')) === 'true';
+    });
+    return function isHashDisabled() {
+      return _ref.apply(this, arguments);
+    };
+  }();
+  var getViewerSize = () => base.$("[data-hook=\"".concat(_DataHooks.default.COLOR_INPUT_VIEWER, "\"]")).attr('data-size');
+  var inputTestkit = (0, _InputUni.default)(base);
+  return _objectSpread(_objectSpread({}, (0, _ColorInputUni.colorInputDriverFactory)(base, body)), {}, {
+    isHashDisabled,
+    isViewerNull: function () {
+      var _isViewerNull = (0, _asyncToGenerator2.default)(function* () {
+        return yield base.$("[data-hook=\"".concat(_DataHooks.default.COLOR_INPUT_VIEWER_LINE, "\"]")).exists();
+      });
+      function isViewerNull() {
+        return _isViewerNull.apply(this, arguments);
+      }
+      return isViewerNull;
+    }(),
+    getViewerSize,
+    getSwatch: function () {
+      var _getSwatch = (0, _asyncToGenerator2.default)(function* (index) {
+        return swatchesDriver.getSwatch(index);
+      });
+      function getSwatch(_x) {
+        return _getSwatch.apply(this, arguments);
+      }
+      return getSwatch;
+    }(),
+    getSwatchCount: function () {
+      var _getSwatchCount = (0, _asyncToGenerator2.default)(function* () {
+        return swatchesDriver.getSwatchCount();
+      });
+      function getSwatchCount() {
+        return _getSwatchCount.apply(this, arguments);
+      }
+      return getSwatchCount;
+    }(),
+    /** Private Swatches driver function to test if swatch is transparent at given index */
+    isSwatchTransparentAt: function () {
+      var _isSwatchTransparentAt = (0, _asyncToGenerator2.default)(function* (index) {
+        return swatchesDriver.isSwatchTransparentAt(index);
+      });
+      function isSwatchTransparentAt(_x2) {
+        return _isSwatchTransparentAt.apply(this, arguments);
+      }
+      return isSwatchTransparentAt;
+    }(),
+    keyDown: function () {
+      var _keyDown = (0, _asyncToGenerator2.default)(function* (event) {
+        if (typeof event === 'string') {
+          yield inputTestkit.keyDown({
+            key: event
+          });
+        } else {
+          yield inputTestkit.keyDown(event);
+        }
+      });
+      function keyDown(_x3) {
+        return _keyDown.apply(this, arguments);
+      }
+      return keyDown;
+    }(),
+    blur: inputTestkit.blur,
+    focus: inputTestkit.focus,
+    clickOutside: function () {
+      var _clickOutside = (0, _asyncToGenerator2.default)(function* () {
+        return colorViewerPopoverTestkit.clickOutside();
+      });
+      function clickOutside() {
+        return _clickOutside.apply(this, arguments);
+      }
+      return clickOutside;
+    }(),
+    hasPrefix: inputTestkit.hasPrefix
+  });
+};
+exports.colorInputPrivateDriverFactory = colorInputPrivateDriverFactory;
+var _default = colorInputPrivateDriverFactory;
+exports.default = _default;
+//# sourceMappingURL=ColorInput.private.uni.driver.js.map

package/dist/cjs/ColorInput/ColorInput.private.uni.driver.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["colorInputPrivateDriverFactory","base","body","swatchesHook","DATA_HOOKS","COLOR_PICKER_SWATCHES","swatchesDriver","swatchesPrivateDriverFactory","$","colorViewerPopoverHook","COLOR_INPUT_POPOVER","colorViewerPopoverTestkit","popoverUniDriverFactory","isHashDisabled","COLOR_INPUT_HASH","attr","getViewerSize","COLOR_INPUT_VIEWER","inputTestkit","inputUniDriverFactory","publicDriverFactory","isViewerNull","COLOR_INPUT_VIEWER_LINE","exists","getSwatch","index","getSwatchCount","isSwatchTransparentAt","keyDown","event","key","blur","focus","clickOutside","hasPrefix"],"sources":["../../../src/ColorInput/ColorInput.private.uni.driver.js"],"sourcesContent":["import { colorInputDriverFactory as publicDriverFactory } from './ColorInput.uni.driver';\nimport { swatchesPrivateDriverFactory } from '../Swatches/test/Swatches.private.uni.driver';\nimport DATA_HOOKS from './DataHooks';\nimport inputUniDriverFactory from '../Input/Input.uni.driver';\nimport { popoverUniDriverFactory } from '../Popover/Popover.uni.driver';\n\nexport const colorInputPrivateDriverFactory = (base, body) => {\n  const swatchesHook = `[data-hook=\"${DATA_HOOKS.COLOR_PICKER_SWATCHES}\"]`;\n  const swatchesDriver = swatchesPrivateDriverFactory(base.$(swatchesHook));\n  const colorViewerPopoverHook = `[data-hook=\"${DATA_HOOKS.COLOR_INPUT_POPOVER}\"]`;\n  const colorViewerPopoverTestkit = popoverUniDriverFactory(\n    base.$(colorViewerPopoverHook),\n    body,\n  );\n\n  const isHashDisabled = async () =>\n    (await base\n      .$(`[data-hook=\"${DATA_HOOKS.COLOR_INPUT_HASH}\"]`)\n      .attr('data-disabled')) === 'true';\n\n  const getViewerSize = () =>\n    base.$(`[data-hook=\"${DATA_HOOKS.COLOR_INPUT_VIEWER}\"]`).attr('data-size');\n\n  const inputTestkit = inputUniDriverFactory(base);\n\n  return {\n    ...publicDriverFactory(base, body),\n    isHashDisabled,\n    isViewerNull: async () =>\n      await base\n        .$(`[data-hook=\"${DATA_HOOKS.COLOR_INPUT_VIEWER_LINE}\"]`)\n        .exists(),\n    getViewerSize,\n    getSwatch: async index => swatchesDriver.getSwatch(index),\n    getSwatchCount: async () => swatchesDriver.getSwatchCount(),\n    /** Private Swatches driver function to test if swatch is transparent at given index */\n    isSwatchTransparentAt: async index =>\n      swatchesDriver.isSwatchTransparentAt(index),\n    keyDown: async event => {\n      if (typeof event === 'string') {\n        await inputTestkit.keyDown({ key: event });\n      } else {\n        await inputTestkit.keyDown(event);\n      }\n    },\n    blur: inputTestkit.blur,\n    focus: inputTestkit.focus,\n    clickOutside: async () => colorViewerPopoverTestkit.clickOutside(),\n    hasPrefix: inputTestkit.hasPrefix,\n  };\n};\n\nexport default colorInputPrivateDriverFactory;\n"],"mappings":";;;;;;;AAAA;AACA;AACA;AACA;AACA;AAAwE;AAAA;AAEjE,IAAMA,8BAA8B,GAAG,CAACC,IAAI,EAAEC,IAAI,KAAK;EAC5D,IAAMC,YAAY,0BAAkBC,kBAAU,CAACC,qBAAqB,QAAI;EACxE,IAAMC,cAAc,GAAG,IAAAC,gDAA4B,EAACN,IAAI,CAACO,CAAC,CAACL,YAAY,CAAC,CAAC;EACzE,IAAMM,sBAAsB,0BAAkBL,kBAAU,CAACM,mBAAmB,QAAI;EAChF,IAAMC,yBAAyB,GAAG,IAAAC,mCAAuB,EACvDX,IAAI,CAACO,CAAC,CAACC,sBAAsB,CAAC,EAC9BP,IAAI,CACL;EAED,IAAMW,cAAc;IAAA,2CAAG;MAAA,OACrB,OAAOZ,IAAI,CACRO,CAAC,wBAAgBJ,kBAAU,CAACU,gBAAgB,SAAK,CACjDC,IAAI,CAAC,eAAe,CAAC,MAAM,MAAM;IAAA;IAAA,gBAHhCF,cAAc;MAAA;IAAA;EAAA,GAGkB;EAEtC,IAAMG,aAAa,GAAG,MACpBf,IAAI,CAACO,CAAC,wBAAgBJ,kBAAU,CAACa,kBAAkB,SAAK,CAACF,IAAI,CAAC,WAAW,CAAC;EAE5E,IAAMG,YAAY,GAAG,IAAAC,iBAAqB,EAAClB,IAAI,CAAC;EAEhD,uCACK,IAAAmB,sCAAmB,EAACnB,IAAI,EAAEC,IAAI,CAAC;IAClCW,cAAc;IACdQ,YAAY;MAAA,oDAAE;QAAA,aACNpB,IAAI,CACPO,CAAC,wBAAgBJ,kBAAU,CAACkB,uBAAuB,SAAK,CACxDC,MAAM,EAAE;MAAA;MAAA;QAAA;MAAA;MAAA;IAAA;IACbP,aAAa;IACbQ,SAAS;MAAA,iDAAE,WAAMC,KAAK;QAAA,OAAInB,cAAc,CAACkB,SAAS,CAACC,KAAK,CAAC;MAAA;MAAA;QAAA;MAAA;MAAA;IAAA;IACzDC,cAAc;MAAA,sDAAE;QAAA,OAAYpB,cAAc,CAACoB,cAAc,EAAE;MAAA;MAAA;QAAA;MAAA;MAAA;IAAA;IAC3D;IACAC,qBAAqB;MAAA,6DAAE,WAAMF,KAAK;QAAA,OAChCnB,cAAc,CAACqB,qBAAqB,CAACF,KAAK,CAAC;MAAA;MAAA;QAAA;MAAA;MAAA;IAAA;IAC7CG,OAAO;MAAA,+CAAE,WAAMC,KAAK,EAAI;QACtB,IAAI,OAAOA,KAAK,KAAK,QAAQ,EAAE;UAC7B,MAAMX,YAAY,CAACU,OAAO,CAAC;YAAEE,GAAG,EAAED;UAAM,CAAC,CAAC;QAC5C,CAAC,MAAM;UACL,MAAMX,YAAY,CAACU,OAAO,CAACC,KAAK,CAAC;QACnC;MACF,CAAC;MAAA;QAAA;MAAA;MAAA;IAAA;IACDE,IAAI,EAAEb,YAAY,CAACa,IAAI;IACvBC,KAAK,EAAEd,YAAY,CAACc,KAAK;IACzBC,YAAY;MAAA,oDAAE;QAAA,OAAYtB,yBAAyB,CAACsB,YAAY,EAAE;MAAA;MAAA;QAAA;MAAA;MAAA;IAAA;IAClEC,SAAS,EAAEhB,YAAY,CAACgB;EAAS;AAErC,CAAC;AAAC;AAAA,eAEalC,8BAA8B;AAAA"}

package/dist/cjs/ColorInput/ColorInput.uni.driver.d.js

@@ -0,0 +1,4 @@
+"use strict";
+
+exports.__esModule = true;
+//# sourceMappingURL=ColorInput.uni.driver.d.js.map

package/dist/cjs/ColorInput/ColorInput.uni.driver.d.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["../../../src/ColorInput/ColorInput.uni.driver.d.ts"],"sourcesContent":["import { BaseUniDriver } from 'wix-ui-test-utils/base-driver';\nimport { InputSize } from '../Input';\nimport { StatusIndications } from '../common';\n\nexport interface ColorInputUniDriver extends BaseUniDriver {\n  cancel(): Promise<void>;\n  confirm(): Promise<void>;\n  clickColorViewer(): Promise<void>;\n  enterText: (text: string) => Promise<void>;\n  getValue(): Promise<string>;\n  getPlaceholder(): Promise<string | null>;\n  getSize(): Promise<InputSize | null>;\n  isDisabled(): Promise<boolean>;\n  colorPickerVisible(): Promise<boolean>;\n\n  // Status\n  hasStatus: (status: StatusIndications) => Promise<boolean>;\n  getStatusMessage: () => Promise<string | null>;\n}\n"],"mappings":""}

package/dist/cjs/ColorInput/ColorInput.uni.driver.js

@@ -0,0 +1,100 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.default = exports.colorInputDriverFactory = void 0;
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _unidriver = require("../test-utils/utils/unidriver");
+var _InputUniDriver = _interopRequireDefault(require("../Input/Input.uni.driver.js"));
+var _ColorPickerUniDriver = require("../ColorPicker/ColorPicker.uni.driver.js");
+var _DataHooks = _interopRequireDefault(require("./DataHooks"));
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var colorInputDriverFactory = (base, body) => {
+  var inputTestkit = (0, _InputUniDriver.default)(base, body);
+  var colorPickerTestkit = (0, _ColorPickerUniDriver.colorPickerUniDriverFactory)(base.$("[data-hook=\"".concat(_DataHooks.default.COLOR_INPUT_COLOR_PICKER, "\"]")));
+  return _objectSpread(_objectSpread({}, (0, _unidriver.baseUniDriverFactory)(base)), {}, {
+    /**
+     * Cancels color selection
+     * @returns {Promise<Void>}
+     * */
+    cancel: () => colorPickerTestkit.cancel(),
+    /**
+     * Confirms color selection
+     * @returns {Promise<Void>}
+     * */
+    confirm: () => colorPickerTestkit.confirm(),
+    /**
+     * Clicks on color viewer box
+     * @returns {Promise<Void>}
+     */
+    clickColorViewer: function () {
+      var _clickColorViewer = (0, _asyncToGenerator2.default)(function* () {
+        return base.$("[data-hook=\"".concat(_DataHooks.default.COLOR_INPUT_VIEWER, "\"]")).click();
+      });
+      function clickColorViewer() {
+        return _clickColorViewer.apply(this, arguments);
+      }
+      return clickColorViewer;
+    }(),
+    /**
+     * Enters text to color input
+     * @returns {Promise<Void>}
+     * */
+    enterText: function () {
+      var _enterText = (0, _asyncToGenerator2.default)(function* (text) {
+        yield inputTestkit.click();
+        yield inputTestkit.enterText(text);
+      });
+      function enterText(_x) {
+        return _enterText.apply(this, arguments);
+      }
+      return enterText;
+    }(),
+    /**
+     * Gets the input value
+     * @returns {Promise<string>}
+     * */
+    getValue: () => inputTestkit.getValue(),
+    /**
+     * Gets the placeholder of the input
+     * @returns {Promise<string | null>}
+     * */
+    getPlaceholder: () => inputTestkit.getPlaceholder(),
+    /**
+     * Gets the input size
+     * @returns {Promise<string>}
+     * */
+    getSize: () => inputTestkit.getSize(),
+    /**
+     * Checks whether the input is disabled
+     * @returns {Promise<boolean>}
+     * */
+    isDisabled: () => inputTestkit.isDisabled(),
+    /**
+     * Checks whether the color picker is visible
+     * @returns {Promise<boolean>}
+     * */
+    colorPickerVisible: () => colorPickerTestkit.exists(),
+    /**
+     * Clicks on input
+     * @returns {Promise<Void>}
+     * */
+    click: () => inputTestkit.click(),
+    /**
+     * Checks whether the given status is displayed
+     * @returns {Promise<boolean>}
+     * */
+    hasStatus: inputTestkit.hasStatus,
+    /**
+     * Gets the status message
+     * @returns {Promise<(string|null)>}
+     * */
+    getStatusMessage: inputTestkit.getStatusMessage
+  });
+};
+exports.colorInputDriverFactory = colorInputDriverFactory;
+var _default = colorInputDriverFactory;
+exports.default = _default;
+//# sourceMappingURL=ColorInput.uni.driver.js.map

package/dist/cjs/ColorInput/ColorInput.uni.driver.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["colorInputDriverFactory","base","body","inputTestkit","inputUniDriverFactory","colorPickerTestkit","colorPickerUniDriverFactory","$","DATA_HOOKS","COLOR_INPUT_COLOR_PICKER","baseUniDriverFactory","cancel","confirm","clickColorViewer","COLOR_INPUT_VIEWER","click","enterText","text","getValue","getPlaceholder","getSize","isDisabled","colorPickerVisible","exists","hasStatus","getStatusMessage"],"sources":["../../../src/ColorInput/ColorInput.uni.driver.js"],"sourcesContent":["import { baseUniDriverFactory } from '../test-utils/utils/unidriver';\nimport inputUniDriverFactory from '../Input/Input.uni.driver.js';\nimport { colorPickerUniDriverFactory } from '../ColorPicker/ColorPicker.uni.driver.js';\nimport DATA_HOOKS from './DataHooks';\n\nexport const colorInputDriverFactory = (base, body) => {\n  const inputTestkit = inputUniDriverFactory(base, body);\n  const colorPickerTestkit = colorPickerUniDriverFactory(\n    base.$(`[data-hook=\"${DATA_HOOKS.COLOR_INPUT_COLOR_PICKER}\"]`),\n  );\n\n  return {\n    ...baseUniDriverFactory(base),\n    /**\n     * Cancels color selection\n     * @returns {Promise<Void>}\n     * */\n    cancel: () => colorPickerTestkit.cancel(),\n    /**\n     * Confirms color selection\n     * @returns {Promise<Void>}\n     * */\n    confirm: () => colorPickerTestkit.confirm(),\n    /**\n     * Clicks on color viewer box\n     * @returns {Promise<Void>}\n     */\n    clickColorViewer: async () =>\n      base.$(`[data-hook=\"${DATA_HOOKS.COLOR_INPUT_VIEWER}\"]`).click(),\n    /**\n     * Enters text to color input\n     * @returns {Promise<Void>}\n     * */\n    enterText: async text => {\n      await inputTestkit.click();\n      await inputTestkit.enterText(text);\n    },\n    /**\n     * Gets the input value\n     * @returns {Promise<string>}\n     * */\n    getValue: () => inputTestkit.getValue(),\n\n    /**\n     * Gets the placeholder of the input\n     * @returns {Promise<string | null>}\n     * */\n    getPlaceholder: () => inputTestkit.getPlaceholder(),\n\n    /**\n     * Gets the input size\n     * @returns {Promise<string>}\n     * */\n    getSize: () => inputTestkit.getSize(),\n\n    /**\n     * Checks whether the input is disabled\n     * @returns {Promise<boolean>}\n     * */\n    isDisabled: () => inputTestkit.isDisabled(),\n\n    /**\n     * Checks whether the color picker is visible\n     * @returns {Promise<boolean>}\n     * */\n    colorPickerVisible: () => colorPickerTestkit.exists(),\n    /**\n     * Clicks on input\n     * @returns {Promise<Void>}\n     * */\n    click: () => inputTestkit.click(),\n    /**\n     * Checks whether the given status is displayed\n     * @returns {Promise<boolean>}\n     * */\n    hasStatus: inputTestkit.hasStatus,\n    /**\n     * Gets the status message\n     * @returns {Promise<(string|null)>}\n     * */\n    getStatusMessage: inputTestkit.getStatusMessage,\n  };\n};\n\nexport default colorInputDriverFactory;\n"],"mappings":";;;;;;;AAAA;AACA;AACA;AACA;AAAqC;AAAA;AAE9B,IAAMA,uBAAuB,GAAG,CAACC,IAAI,EAAEC,IAAI,KAAK;EACrD,IAAMC,YAAY,GAAG,IAAAC,uBAAqB,EAACH,IAAI,EAAEC,IAAI,CAAC;EACtD,IAAMG,kBAAkB,GAAG,IAAAC,iDAA2B,EACpDL,IAAI,CAACM,CAAC,wBAAgBC,kBAAU,CAACC,wBAAwB,SAAK,CAC/D;EAED,uCACK,IAAAC,+BAAoB,EAACT,IAAI,CAAC;IAC7B;AACJ;AACA;AACA;IACIU,MAAM,EAAE,MAAMN,kBAAkB,CAACM,MAAM,EAAE;IACzC;AACJ;AACA;AACA;IACIC,OAAO,EAAE,MAAMP,kBAAkB,CAACO,OAAO,EAAE;IAC3C;AACJ;AACA;AACA;IACIC,gBAAgB;MAAA,wDAAE;QAAA,OAChBZ,IAAI,CAACM,CAAC,wBAAgBC,kBAAU,CAACM,kBAAkB,SAAK,CAACC,KAAK,EAAE;MAAA;MAAA;QAAA;MAAA;MAAA;IAAA;IAClE;AACJ;AACA;AACA;IACIC,SAAS;MAAA,iDAAE,WAAMC,IAAI,EAAI;QACvB,MAAMd,YAAY,CAACY,KAAK,EAAE;QAC1B,MAAMZ,YAAY,CAACa,SAAS,CAACC,IAAI,CAAC;MACpC,CAAC;MAAA;QAAA;MAAA;MAAA;IAAA;IACD;AACJ;AACA;AACA;IACIC,QAAQ,EAAE,MAAMf,YAAY,CAACe,QAAQ,EAAE;IAEvC;AACJ;AACA;AACA;IACIC,cAAc,EAAE,MAAMhB,YAAY,CAACgB,cAAc,EAAE;IAEnD;AACJ;AACA;AACA;IACIC,OAAO,EAAE,MAAMjB,YAAY,CAACiB,OAAO,EAAE;IAErC;AACJ;AACA;AACA;IACIC,UAAU,EAAE,MAAMlB,YAAY,CAACkB,UAAU,EAAE;IAE3C;AACJ;AACA;AACA;IACIC,kBAAkB,EAAE,MAAMjB,kBAAkB,CAACkB,MAAM,EAAE;IACrD;AACJ;AACA;AACA;IACIR,KAAK,EAAE,MAAMZ,YAAY,CAACY,KAAK,EAAE;IACjC;AACJ;AACA;AACA;IACIS,SAAS,EAAErB,YAAY,CAACqB,SAAS;IACjC;AACJ;AACA;AACA;IACIC,gBAAgB,EAAEtB,YAAY,CAACsB;EAAgB;AAEnD,CAAC;AAAC;AAAA,eAEazB,uBAAuB;AAAA"}

package/dist/cjs/ColorInput/DataHooks.js

@@ -0,0 +1,14 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+var _default = {
+  COLOR_INPUT_COLOR_PICKER: 'colorinput-colorpicker',
+  COLOR_INPUT_VIEWER: 'colorinput-viewer',
+  COLOR_INPUT_HASH: 'colorinput-hash',
+  COLOR_PICKER_SWATCHES: 'color-picker-swatches',
+  COLOR_INPUT_VIEWER_LINE: 'colorinput-viewer-line',
+  COLOR_INPUT_POPOVER: 'colorinput-popover'
+};
+exports.default = _default;
+//# sourceMappingURL=DataHooks.js.map

package/dist/cjs/ColorInput/DataHooks.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["COLOR_INPUT_COLOR_PICKER","COLOR_INPUT_VIEWER","COLOR_INPUT_HASH","COLOR_PICKER_SWATCHES","COLOR_INPUT_VIEWER_LINE","COLOR_INPUT_POPOVER"],"sources":["../../../src/ColorInput/DataHooks.js"],"sourcesContent":["export default {\n  COLOR_INPUT_COLOR_PICKER: 'colorinput-colorpicker',\n  COLOR_INPUT_VIEWER: 'colorinput-viewer',\n  COLOR_INPUT_HASH: 'colorinput-hash',\n  COLOR_PICKER_SWATCHES: 'color-picker-swatches',\n  COLOR_INPUT_VIEWER_LINE: 'colorinput-viewer-line',\n  COLOR_INPUT_POPOVER: 'colorinput-popover',\n};\n"],"mappings":";;;;eAAe;EACbA,wBAAwB,EAAE,wBAAwB;EAClDC,kBAAkB,EAAE,mBAAmB;EACvCC,gBAAgB,EAAE,iBAAiB;EACnCC,qBAAqB,EAAE,uBAAuB;EAC9CC,uBAAuB,EAAE,wBAAwB;EACjDC,mBAAmB,EAAE;AACvB,CAAC;AAAA"}