intergalactic 15.87.0-prerelease.3 → 15.88.0

package/libs/input-tags/lib/cjs/InputTags.js

@@ -0,0 +1,284 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _createForOfIteratorHelper2 = _interopRequireDefault(require("@babel/runtime/helpers/createForOfIteratorHelper"));
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _core = _interopRequireWildcard(require("@semcore/core"));
+var _react = _interopRequireDefault(require("react"));
+var _input = _interopRequireDefault(require("@semcore/input"));
+var _scrollArea = _interopRequireDefault(require("@semcore/scroll-area"));
+var _tag = _interopRequireDefault(require("@semcore/tag"));
+var _fire = _interopRequireDefault(require("@semcore/utils/lib/fire"));
+/*__reshadow-styles__:"./style/input-tag.shadow.css"*/
+var style = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".___SInputTags_a71dg_gg_{box-sizing:border-box;cursor:text;align-items:flex-start;overflow:visible;overflow:initial}.___SInputTags_a71dg_gg_ .___SContainer_a71dg_gg_:focus .___SOutline_a71dg_gg_{border-color:var(--intergalactic-border-info-active, #006dca);box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5))}.___SInputTags_a71dg_gg_ .___SContainer_a71dg_gg_:focus:has(.___SOutline_a71dg_gg_)::after{box-shadow:none}.___SContainer_a71dg_gg_{padding:1px 0;box-sizing:border-box;border-bottom:1px solid transparent;border-top:1px solid transparent}.___SInputTags_a71dg_gg_>div>div{display:flex;align-items:center;flex-flow:row wrap}.___SInputTags_a71dg_gg_>div[data-ui-name=\"ScrollArea.Bar\"]._orientation_vertical_a71dg_gg_{right:1px!important}.___SInputTags_a71dg_gg_._size_m_a71dg_gg_{min-height:var(--intergalactic-form-control-m, 28px);height:auto;padding:0 calc(var(--intergalactic-spacing-1x, 4px) + var(--intergalactic-spacing-05x, 2px))}.___SInputTags_a71dg_gg_._size_l_a71dg_gg_{min-height:var(--intergalactic-form-control-l, 40px);height:auto;padding:0 calc(var(--intergalactic-spacing-2x, 8px) + var(--intergalactic-spacing-05x, 2px))}.___STag_a71dg_gg_._size_m_a71dg_gg_{margin:var(--intergalactic-spacing-05x, 2px)}.___STag_a71dg_gg_._size_l_a71dg_gg_{margin:var(--intergalactic-spacing-1x, 4px) var(--intergalactic-spacing-05x, 2px)}.___STag_a71dg_gg_.__editable_a71dg_gg_{cursor:pointer}.___SInputTags_a71dg_gg_._size_m_a71dg_gg_ .___SValue_a71dg_gg_{height:calc(var(--intergalactic-form-control-m, 28px) - var(--intergalactic-spacing-1x, 4px))}.___SInputTags_a71dg_gg_._size_l_a71dg_gg_ .___SValue_a71dg_gg_{height:calc(var(--intergalactic-form-control-l, 40px) - var(--intergalactic-spacing-1x, 4px))}.___SValue_a71dg_gg_{padding:0!important;margin-left:var(--intergalactic-spacing-05x, 2px);margin-right:var(--intergalactic-spacing-05x, 2px)}.___SSpacer_a71dg_gg_{position:absolute;top:0;left:0;visibility:hidden;height:0;overflow:scroll;white-space:pre;font-family:inherit;font-size:inherit;font-weight:inherit;font-style:inherit;letter-spacing:inherit;text-transform:inherit}.___SListAriaWrapper_a71dg_gg_{display:contents}" /*__inner_css_end__*/, "a71dg_gg_") /*__reshadow_css_end__*/, {
+  "__SInputTags": "___SInputTags_a71dg_gg_",
+  "__SContainer": "___SContainer_a71dg_gg_",
+  "__SOutline": "___SOutline_a71dg_gg_",
+  "_orientation_vertical": "_orientation_vertical_a71dg_gg_",
+  "_size_m": "_size_m_a71dg_gg_",
+  "_size_l": "_size_l_a71dg_gg_",
+  "__STag": "___STag_a71dg_gg_",
+  "_editable": "__editable_a71dg_gg_",
+  "__SValue": "___SValue_a71dg_gg_",
+  "__SSpacer": "___SSpacer_a71dg_gg_",
+  "__SListAriaWrapper": "___SListAriaWrapper_a71dg_gg_"
+});
+/** @deprecated */
+var InputTags = /*#__PURE__*/function (_Component) {
+  (0, _inherits2["default"])(InputTags, _Component);
+  var _super = (0, _createSuper2["default"])(InputTags);
+  function InputTags() {
+    var _this;
+    (0, _classCallCheck2["default"])(this, InputTags);
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    _this = _super.call.apply(_super, [this].concat(args));
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "_input", /*#__PURE__*/_react["default"].createRef());
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "setFocusInput", function (event) {
+      var inputRef = _this._input.current;
+      if (inputRef && event.target !== inputRef) {
+        var caretPosition = inputRef.value.length;
+        event.preventDefault();
+        inputRef.focus();
+        inputRef.setSelectionRange(caretPosition, caretPosition);
+      }
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleKeyDown", function (event) {
+      var key = event.key,
+        currentTarget = event.currentTarget;
+      var delimiters = _this.asProps.delimiters;
+      var value = currentTarget.value;
+      var lastSymbol = value.slice(-1);
+      var trimmedValue = value.trim();
+      if ((delimiters !== null && delimiters !== void 0 && delimiters.includes(key) || lastSymbol === ' ' && key === ' ') && trimmedValue) {
+        var _this$_input$current;
+        event.preventDefault();
+        (0, _fire["default"])((0, _assertThisInitialized2["default"])(_this), 'onAdd', trimmedValue, event);
+        (0, _fire["default"])((0, _assertThisInitialized2["default"])(_this), 'onAppend', [trimmedValue], event);
+        if (typeof ((_this$_input$current = _this._input.current) === null || _this$_input$current === void 0 ? void 0 : _this$_input$current.scrollIntoView) === 'function') {
+          setTimeout(function () {
+            var _this$_input$current2;
+            if (typeof ((_this$_input$current2 = _this._input.current) === null || _this$_input$current2 === void 0 ? void 0 : _this$_input$current2.scrollIntoView) === 'function') {
+              _this._input.current.scrollIntoView({
+                block: 'nearest',
+                inline: 'nearest',
+                behavior: 'smooth'
+              });
+            }
+          }, 0);
+        }
+      }
+      if (key === 'Backspace' && !value) {
+        event.preventDefault();
+        (0, _fire["default"])((0, _assertThisInitialized2["default"])(_this), 'onRemove', event);
+      }
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handlePaste", function (event) {
+      var _this$_input$current3;
+      var value = event.clipboardData.getData('text/plain');
+      var _this$asProps = _this.asProps,
+        delimiters = _this$asProps.delimiters,
+        onAdd = _this$asProps.onAdd,
+        onAppend = _this$asProps.onAppend;
+      var reg = new RegExp(delimiters.filter(function (s) {
+        return !/\w+/.test(String(s));
+      }).map(function (s) {
+        return s.replace(/[\\^$*+?.()|[\]{}]/g, '\\$&');
+      }).join('|'));
+      var tagsToBeAdded = value.split(reg).filter(Boolean);
+      if (tagsToBeAdded.length > 0) {
+        event.preventDefault();
+        var _iterator = (0, _createForOfIteratorHelper2["default"])(tagsToBeAdded),
+          _step;
+        try {
+          for (_iterator.s(); !(_step = _iterator.n()).done;) {
+            var tag = _step.value;
+            onAdd === null || onAdd === void 0 ? void 0 : onAdd(tag, event);
+          }
+        } catch (err) {
+          _iterator.e(err);
+        } finally {
+          _iterator.f();
+        }
+        onAppend === null || onAppend === void 0 ? void 0 : onAppend(tagsToBeAdded, event);
+      }
+      if (typeof ((_this$_input$current3 = _this._input.current) === null || _this$_input$current3 === void 0 ? void 0 : _this$_input$current3.scrollIntoView) === 'function') {
+        setTimeout(function () {
+          var _this$_input$current4;
+          if (typeof ((_this$_input$current4 = _this._input.current) === null || _this$_input$current4 === void 0 ? void 0 : _this$_input$current4.scrollIntoView) === 'function') {
+            _this._input.current.scrollIntoView({
+              block: 'nearest',
+              inline: 'nearest',
+              behavior: 'smooth'
+            });
+          }
+        }, 0);
+      }
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "bindHandlerTagClick", function (editable) {
+      return function (event) {
+        if (!editable) return;
+        (0, _fire["default"])((0, _assertThisInitialized2["default"])(_this), 'onRemove', event);
+      };
+    });
+    return _this;
+  }
+  (0, _createClass2["default"])(InputTags, [{
+    key: "getValueProps",
+    value: function getValueProps() {
+      return {
+        ref: this._input,
+        onKeyDown: this.handleKeyDown,
+        onPaste: this.handlePaste
+      };
+    }
+  }, {
+    key: "getTagProps",
+    value: function getTagProps(_ref7) {
+      var editable = _ref7.editable;
+      return {
+        size: this.asProps.size,
+        onClick: this.bindHandlerTagClick(editable)
+      };
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _ref = this.asProps,
+        _ref4;
+      var SInputTags = _input["default"];
+      var _this$asProps2 = this.asProps,
+        Children = _this$asProps2.Children,
+        styles = _this$asProps2.styles;
+      var SListAriaWrapper = 'div';
+      return _ref4 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SInputTags, _ref4.cn("SInputTags", (0, _objectSpread2["default"])({}, (0, _core.assignProps)({
+        "tag": _scrollArea["default"],
+        "onMouseDown": this.setFocusInput
+      }, _ref))), /*#__PURE__*/_react["default"].createElement(SListAriaWrapper, _ref4.cn("SListAriaWrapper", {
+        "role": 'list'
+      }), /*#__PURE__*/_react["default"].createElement(Children, _ref4.cn("Children", {}))));
+    }
+  }]);
+  return InputTags;
+}(_core.Component);
+(0, _defineProperty2["default"])(InputTags, "displayName", 'InputTags');
+(0, _defineProperty2["default"])(InputTags, "style", style);
+(0, _defineProperty2["default"])(InputTags, "defaultProps", {
+  size: 'm',
+  delimiters: [',', ';', '|', 'Enter', 'Tab'],
+  defaultValue: ''
+});
+var Value = /*#__PURE__*/function (_Component2) {
+  (0, _inherits2["default"])(Value, _Component2);
+  var _super2 = (0, _createSuper2["default"])(Value);
+  function Value() {
+    var _this2;
+    (0, _classCallCheck2["default"])(this, Value);
+    for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+      args[_key2] = arguments[_key2];
+    }
+    _this2 = _super2.call.apply(_super2, [this].concat(args));
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this2), "_spacer", /*#__PURE__*/_react["default"].createRef());
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this2), "state", {
+      width: '10px'
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this2), "handleChange", function (value) {
+      _this2.updateInputStyles(value);
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this2), "updateInputStyles", function (value) {
+      var spacerNode = _this2._spacer.current;
+      if (!spacerNode) return;
+      var placeholder = _this2.props.placeholder;
+      /* for display cursor */
+      var magicOffset = 2;
+      if (placeholder && (value === undefined || value === '')) {
+        // @ts-ignore
+        spacerNode['innerText'] = placeholder;
+        /* for [placeholder] {
+            text-overflow: ellipsis;
+        }*/
+        magicOffset += 8;
+      } else {
+        spacerNode['innerText'] = value;
+      }
+      _this2.setState({
+        width: "".concat(Math.max(spacerNode['offsetWidth'], spacerNode['scrollWidth']) + magicOffset, "px")
+      });
+    });
+    return _this2;
+  }
+  (0, _createClass2["default"])(Value, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      this.updateInputStyles(this.asProps.value);
+    }
+  }, {
+    key: "componentDidUpdate",
+    value: function componentDidUpdate(prevProps) {
+      var _this$asProps3 = this.asProps,
+        value = _this$asProps3.value,
+        placeholder = _this$asProps3.placeholder;
+      if (value !== prevProps.value || placeholder !== prevProps.placeholder) {
+        this.updateInputStyles(value);
+      }
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _ref2 = this.asProps,
+        _ref5;
+      var SValue = _input["default"].Value;
+      var SSpacer = 'div';
+      return _ref5 = (0, _core.sstyled)(this.asProps.styles), /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(SValue, _ref5.cn("SValue", (0, _objectSpread2["default"])({}, (0, _core.assignProps)({
+        "style": {
+          width: this.state.width
+        },
+        "role": 'listitem'
+      }, _ref2)))), /*#__PURE__*/_react["default"].createElement(SSpacer, _ref5.cn("SSpacer", {
+        "ref": this._spacer,
+        "role": 'none'
+      })));
+    }
+  }]);
+  return Value;
+}(_core.Component);
+function InputTag(props) {
+  var _ref3 = arguments[0],
+    _ref6;
+  var STag = _tag["default"];
+  var onKeyDown = function onKeyDown(event) {
+    if (event.key === 'Enter') {
+      var _props$onClick;
+      (_props$onClick = props.onClick) === null || _props$onClick === void 0 ? void 0 : _props$onClick.call(props, event);
+      return false;
+    }
+  };
+  return _ref6 = (0, _core.sstyled)(props.styles), /*#__PURE__*/_react["default"].createElement(STag, _ref6.cn("STag", (0, _objectSpread2["default"])({}, (0, _core.assignProps)({
+    "data-value": props.value,
+    "role": 'listitem',
+    "onKeyDown": onKeyDown
+  }, _ref3))));
+}
+var _default = (0, _core["default"])(InputTags, {
+  Value: Value,
+  Tag: [InputTag, {
+    Text: _tag["default"].Text,
+    Close: _tag["default"].Close,
+    Addon: _tag["default"].Addon,
+    Circle: _tag["default"].Circle
+  }]
+});
+exports["default"] = _default;
+//# sourceMappingURL=InputTags.js.map

package/libs/input-tags/lib/cjs/InputTags.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputTags.js","names":["_core","_interopRequireWildcard","require","_react","_interopRequireDefault","_input","_scrollArea","_tag","_fire","style","sstyled","insert","InputTags","_Component","_inherits2","_super","_createSuper2","_this","_classCallCheck2","_len","arguments","length","args","Array","_key","call","apply","concat","_defineProperty2","_assertThisInitialized2","React","createRef","event","inputRef","current","target","caretPosition","value","preventDefault","focus","setSelectionRange","key","currentTarget","delimiters","asProps","lastSymbol","slice","trimmedValue","trim","includes","_this$_input$current","fire","scrollIntoView","setTimeout","_this$_input$current2","block","inline","behavior","_this$_input$current3","clipboardData","getData","_this$asProps","onAdd","onAppend","reg","RegExp","filter","s","test","String","map","replace","join","tagsToBeAdded","split","Boolean","_iterator","_createForOfIteratorHelper2","_step","n","done","tag","err","e","f","_this$_input$current4","editable","_createClass2","getValueProps","ref","onKeyDown","handleKeyDown","onPaste","handlePaste","getTagProps","_ref7","size","onClick","bindHandlerTagClick","render","_ref","_ref4","SInputTags","Input","_this$asProps2","Children","styles","SListAriaWrapper","createElement","cn","_objectSpread2","assignProps","ScrollArea","setFocusInput","Component","defaultValue","Value","_Component2","_super2","_this2","_len2","_key2","width","updateInputStyles","spacerNode","_spacer","placeholder","props","magicOffset","undefined","setState","Math","max","componentDidMount","componentDidUpdate","prevProps","_this$asProps3","_ref2","_ref5","SValue","SSpacer","Fragment","state","InputTag","_ref3","arguments[0]","_ref6","STag","Tag","_props$onClick","_default","createComponent","Text","Close","Addon","Circle","exports"],"sources":["../../src/InputTags.tsx"],"sourcesContent":["import React from 'react';\nimport createComponent, {\n  Component,\n  sstyled,\n  Root,\n  PropGetterFn,\n  UnknownProperties,\n  Intergalactic,\n} from '@semcore/core';\nimport Input, { InputProps, InputValueProps } from '@semcore/input';\nimport ScrollArea, { ScrollAreaProps } from '@semcore/scroll-area';\nimport Tag, { TagProps } from '@semcore/tag';\nimport fire from '@semcore/utils/lib/fire';\n\nimport style from './style/input-tag.shadow.css';\n\n/** @deprecated */\nexport interface IInputTagsValueProps extends InputTagsValueProps, UnknownProperties {}\nexport type InputTagsValueProps = InputValueProps & {};\n\nexport type InputTagsSize = 'l' | 'm';\n\n/** @deprecated */\nexport interface IInputTagsProps extends InputTagsProps, UnknownProperties {}\nexport type InputTagsProps = Omit<InputProps, 'size'> &\n  ScrollAreaProps & {\n    /**\n     * Component size\n     * @default m\n     */\n    size?: InputTagsSize;\n    /**\n     * Event is called when tag needs to be added\n     * @deprecated use `onAppend` instead\n     */\n    onAdd?: (value: string, event: React.KeyboardEvent | React.ClipboardEvent) => void;\n    /** Event is called when tags need to be added */\n    onAppend?: (values: string[], event: React.KeyboardEvent | React.ClipboardEvent) => void;\n    /** Event is called when tags need to be removed  */\n    onRemove?: (event: React.KeyboardEvent | React.MouseEvent) => void;\n    /** List delimiter of tags. Don't forget to add 'Enter' and 'Tab' to hande corresponding hotkeys.\n     * @default [',', ';', '|', 'Enter', 'Tab']\n     * */\n    delimiters?: string[];\n  };\n\n/** @deprecated */\nexport interface IInputTagsTagProps extends InputTagsTagProps, UnknownProperties {}\nexport type InputTagsTagProps = TagProps & {\n  /** Property enabling the ability to remove a tag on click */\n  editable?: boolean;\n};\n\n/** @deprecated */\nexport interface IInputTagsContext extends InputTagsContext, UnknownProperties {}\nexport type InputTagsContext = InputTagsProps & {\n  getValueProps: PropGetterFn;\n  getTagProps: PropGetterFn;\n};\n\nclass InputTags extends Component<IInputTagsProps> {\n  static displayName = 'InputTags';\n  static style = style;\n\n  static defaultProps = {\n    size: 'm',\n    delimiters: [',', ';', '|', 'Enter', 'Tab'],\n    defaultValue: '',\n  };\n\n  _input = React.createRef<HTMLInputElement>();\n\n  setFocusInput = (event: React.FocusEvent) => {\n    const inputRef = this._input.current;\n    if (inputRef && event.target !== inputRef) {\n      const caretPosition = inputRef.value.length;\n      event.preventDefault();\n      inputRef.focus();\n      inputRef.setSelectionRange(caretPosition, caretPosition);\n    }\n  };\n\n  handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n    const { key, currentTarget } = event;\n    const { delimiters } = this.asProps;\n    const { value } = currentTarget;\n    const lastSymbol = value.slice(-1);\n    const trimmedValue = value.trim();\n\n    if ((delimiters?.includes(key) || (lastSymbol === ' ' && key === ' ')) && trimmedValue) {\n      event.preventDefault();\n      fire(this, 'onAdd', trimmedValue, event);\n      fire(this, 'onAppend', [trimmedValue], event);\n      if (typeof this._input.current?.scrollIntoView === 'function') {\n        setTimeout(() => {\n          if (typeof this._input.current?.scrollIntoView === 'function') {\n            this._input.current.scrollIntoView({\n              block: 'nearest',\n              inline: 'nearest',\n              behavior: 'smooth',\n            });\n          }\n        }, 0);\n      }\n    }\n\n    if (key === 'Backspace' && !value) {\n      event.preventDefault();\n      fire(this, 'onRemove', event);\n    }\n  };\n\n  handlePaste = (event: React.ClipboardEvent) => {\n    const value = event.clipboardData.getData('text/plain');\n    const { delimiters, onAdd, onAppend } = this.asProps;\n    const reg = new RegExp(\n      delimiters!\n        .filter((s) => !/\\w+/.test(String(s)))\n        .map((s) => s.replace(/[\\\\^$*+?.()|[\\]{}]/g, '\\\\$&'))\n        .join('|'),\n    );\n    const tagsToBeAdded = value.split(reg).filter(Boolean);\n    if (tagsToBeAdded.length > 0) {\n      event.preventDefault();\n      for (const tag of tagsToBeAdded) {\n        onAdd?.(tag, event);\n      }\n      onAppend?.(tagsToBeAdded, event);\n    }\n    if (typeof this._input.current?.scrollIntoView === 'function') {\n      setTimeout(() => {\n        if (typeof this._input.current?.scrollIntoView === 'function') {\n          this._input.current.scrollIntoView({\n            block: 'nearest',\n            inline: 'nearest',\n            behavior: 'smooth',\n          });\n        }\n      }, 0);\n    }\n  };\n\n  bindHandlerTagClick = (editable: boolean) => (event: React.MouseEvent) => {\n    if (!editable) return;\n    fire(this, 'onRemove', event);\n  };\n\n  getValueProps() {\n    return {\n      ref: this._input,\n      onKeyDown: this.handleKeyDown,\n      onPaste: this.handlePaste,\n    };\n  }\n\n  getTagProps({ editable }: { editable: boolean }) {\n    return {\n      size: this.asProps.size,\n      onClick: this.bindHandlerTagClick(editable),\n    };\n  }\n\n  render() {\n    const SInputTags = Root;\n    const { Children, styles } = this.asProps;\n    const SListAriaWrapper = 'div';\n\n    return sstyled(styles)(\n      <SInputTags render={Input} tag={ScrollArea} onMouseDown={this.setFocusInput}>\n        <SListAriaWrapper role='list'>\n          <Children />\n        </SListAriaWrapper>\n      </SInputTags>,\n    );\n  }\n}\n\nclass Value extends Component<IInputTagsValueProps> {\n  private _spacer = React.createRef<HTMLDivElement>();\n\n  state = {\n    width: '10px',\n  };\n\n  componentDidMount() {\n    this.updateInputStyles(this.asProps.value!);\n  }\n\n  componentDidUpdate(prevProps: any) {\n    const { value, placeholder } = this.asProps;\n    if (value !== prevProps.value || placeholder !== prevProps.placeholder) {\n      this.updateInputStyles(value!);\n    }\n  }\n\n  handleChange = (value: string) => {\n    this.updateInputStyles(value);\n  };\n\n  updateInputStyles = (value: string) => {\n    const { current: spacerNode } = this._spacer;\n    if (!spacerNode) return;\n    const { placeholder } = this.props;\n    /* for display cursor */\n    let magicOffset = 2;\n    if (placeholder && (value === undefined || value === '')) {\n      // @ts-ignore\n      spacerNode['innerText'] = placeholder;\n      /* for [placeholder] {\n          text-overflow: ellipsis;\n      }*/\n      magicOffset += 8;\n    } else {\n      spacerNode['innerText'] = value;\n    }\n    this.setState({\n      width: `${Math.max(spacerNode['offsetWidth'], spacerNode['scrollWidth']) + magicOffset}px`,\n    });\n  };\n\n  render() {\n    const SValue = Root;\n    const SSpacer = 'div';\n\n    return sstyled(this.asProps.styles)(\n      <>\n        <SValue render={Input.Value} style={{ width: this.state.width }} role='listitem' />\n        <SSpacer ref={this._spacer} role='none' />\n      </>,\n    );\n  }\n}\n\nfunction InputTag(props: any) {\n  const STag = Root;\n\n  const onKeyDown = (event: React.KeyboardEvent) => {\n    if (event.key === 'Enter') {\n      props.onClick?.(event);\n\n      return false;\n    }\n  };\n\n  return sstyled(props.styles)(\n    <STag data-value={props.value} render={Tag} role='listitem' onKeyDown={onKeyDown} />,\n  );\n}\n\nexport default createComponent(InputTags, {\n  Value,\n  Tag: [\n    InputTag,\n    {\n      Text: Tag.Text,\n      Close: Tag.Close,\n      Addon: Tag.Addon,\n      Circle: Tag.Circle,\n    },\n  ],\n}) as any as Intergalactic.Component<'div', InputTagsProps, InputTagsContext> & {\n  Value: typeof Input.Value;\n  Tag: Intergalactic.Component<'div', InputTagsTagProps> & {\n    Text: typeof Tag.Text;\n    Close: typeof Tag.Close;\n    Addon: typeof Tag.Addon;\n    Circle: typeof Tag.Circle;\n  };\n};\n"],"mappings":"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"}

package/libs/input-tags/lib/cjs/index.js

@@ -0,0 +1,26 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {};
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function get() {
+    return _InputTags["default"];
+  }
+});
+var _InputTags = _interopRequireWildcard(require("./InputTags"));
+Object.keys(_InputTags).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _InputTags[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _InputTags[key];
+    }
+  });
+});
+//# sourceMappingURL=index.js.map

package/libs/input-tags/lib/cjs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["_InputTags","_interopRequireWildcard","require","Object","keys","forEach","key","prototype","hasOwnProperty","call","_exportNames","exports","defineProperty","enumerable","get"],"sources":["../../src/index.tsx"],"sourcesContent":["export { default } from './InputTags';\nexport * from './InputTags';\n"],"mappings":";;;;;;;;;;;;;AAAA,IAAAA,UAAA,GAAAC,uBAAA,CAAAC,OAAA;AACAC,MAAA,CAAAC,IAAA,CAAAJ,UAAA,EAAAK,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAC,YAAA,EAAAJ,GAAA;EAAA,IAAAA,GAAA,IAAAK,OAAA,IAAAA,OAAA,CAAAL,GAAA,MAAAN,UAAA,CAAAM,GAAA;EAAAH,MAAA,CAAAS,cAAA,CAAAD,OAAA,EAAAL,GAAA;IAAAO,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAd,UAAA,CAAAM,GAAA;IAAA;EAAA;AAAA"}

package/libs/input-tags/lib/es6/InputTags.js

@@ -0,0 +1,279 @@
+import _objectSpread from "@babel/runtime/helpers/objectSpread2";
+import _createForOfIteratorHelper from "@babel/runtime/helpers/createForOfIteratorHelper";
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
+import _inherits from "@babel/runtime/helpers/inherits";
+import _createSuper from "@babel/runtime/helpers/createSuper";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import { sstyled as _sstyled } from "@semcore/core";
+import { assignProps as _assignProps3 } from "@semcore/core";
+import { assignProps as _assignProps2 } from "@semcore/core";
+import { assignProps as _assignProps } from "@semcore/core";
+import React from 'react';
+import createComponent, { Component, sstyled, Root } from '@semcore/core';
+import Input from '@semcore/input';
+import ScrollArea from '@semcore/scroll-area';
+import Tag from '@semcore/tag';
+import fire from '@semcore/utils/lib/fire';
+/*__reshadow-styles__:"./style/input-tag.shadow.css"*/
+var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".___SInputTags_a71dg_gg_{box-sizing:border-box;cursor:text;align-items:flex-start;overflow:visible;overflow:initial}.___SInputTags_a71dg_gg_ .___SContainer_a71dg_gg_:focus .___SOutline_a71dg_gg_{border-color:var(--intergalactic-border-info-active, #006dca);box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5))}.___SInputTags_a71dg_gg_ .___SContainer_a71dg_gg_:focus:has(.___SOutline_a71dg_gg_)::after{box-shadow:none}.___SContainer_a71dg_gg_{padding:1px 0;box-sizing:border-box;border-bottom:1px solid transparent;border-top:1px solid transparent}.___SInputTags_a71dg_gg_>div>div{display:flex;align-items:center;flex-flow:row wrap}.___SInputTags_a71dg_gg_>div[data-ui-name=\"ScrollArea.Bar\"]._orientation_vertical_a71dg_gg_{right:1px!important}.___SInputTags_a71dg_gg_._size_m_a71dg_gg_{min-height:var(--intergalactic-form-control-m, 28px);height:auto;padding:0 calc(var(--intergalactic-spacing-1x, 4px) + var(--intergalactic-spacing-05x, 2px))}.___SInputTags_a71dg_gg_._size_l_a71dg_gg_{min-height:var(--intergalactic-form-control-l, 40px);height:auto;padding:0 calc(var(--intergalactic-spacing-2x, 8px) + var(--intergalactic-spacing-05x, 2px))}.___STag_a71dg_gg_._size_m_a71dg_gg_{margin:var(--intergalactic-spacing-05x, 2px)}.___STag_a71dg_gg_._size_l_a71dg_gg_{margin:var(--intergalactic-spacing-1x, 4px) var(--intergalactic-spacing-05x, 2px)}.___STag_a71dg_gg_.__editable_a71dg_gg_{cursor:pointer}.___SInputTags_a71dg_gg_._size_m_a71dg_gg_ .___SValue_a71dg_gg_{height:calc(var(--intergalactic-form-control-m, 28px) - var(--intergalactic-spacing-1x, 4px))}.___SInputTags_a71dg_gg_._size_l_a71dg_gg_ .___SValue_a71dg_gg_{height:calc(var(--intergalactic-form-control-l, 40px) - var(--intergalactic-spacing-1x, 4px))}.___SValue_a71dg_gg_{padding:0!important;margin-left:var(--intergalactic-spacing-05x, 2px);margin-right:var(--intergalactic-spacing-05x, 2px)}.___SSpacer_a71dg_gg_{position:absolute;top:0;left:0;visibility:hidden;height:0;overflow:scroll;white-space:pre;font-family:inherit;font-size:inherit;font-weight:inherit;font-style:inherit;letter-spacing:inherit;text-transform:inherit}.___SListAriaWrapper_a71dg_gg_{display:contents}" /*__inner_css_end__*/, "a71dg_gg_") /*__reshadow_css_end__*/, {
+  "__SInputTags": "___SInputTags_a71dg_gg_",
+  "__SContainer": "___SContainer_a71dg_gg_",
+  "__SOutline": "___SOutline_a71dg_gg_",
+  "_orientation_vertical": "_orientation_vertical_a71dg_gg_",
+  "_size_m": "_size_m_a71dg_gg_",
+  "_size_l": "_size_l_a71dg_gg_",
+  "__STag": "___STag_a71dg_gg_",
+  "_editable": "__editable_a71dg_gg_",
+  "__SValue": "___SValue_a71dg_gg_",
+  "__SSpacer": "___SSpacer_a71dg_gg_",
+  "__SListAriaWrapper": "___SListAriaWrapper_a71dg_gg_"
+});
+/** @deprecated */
+var InputTags = /*#__PURE__*/function (_Component) {
+  _inherits(InputTags, _Component);
+  var _super = _createSuper(InputTags);
+  function InputTags() {
+    var _this;
+    _classCallCheck(this, InputTags);
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    _this = _super.call.apply(_super, [this].concat(args));
+    _defineProperty(_assertThisInitialized(_this), "_input", /*#__PURE__*/React.createRef());
+    _defineProperty(_assertThisInitialized(_this), "setFocusInput", function (event) {
+      var inputRef = _this._input.current;
+      if (inputRef && event.target !== inputRef) {
+        var caretPosition = inputRef.value.length;
+        event.preventDefault();
+        inputRef.focus();
+        inputRef.setSelectionRange(caretPosition, caretPosition);
+      }
+    });
+    _defineProperty(_assertThisInitialized(_this), "handleKeyDown", function (event) {
+      var key = event.key,
+        currentTarget = event.currentTarget;
+      var delimiters = _this.asProps.delimiters;
+      var value = currentTarget.value;
+      var lastSymbol = value.slice(-1);
+      var trimmedValue = value.trim();
+      if ((delimiters !== null && delimiters !== void 0 && delimiters.includes(key) || lastSymbol === ' ' && key === ' ') && trimmedValue) {
+        var _this$_input$current;
+        event.preventDefault();
+        fire(_assertThisInitialized(_this), 'onAdd', trimmedValue, event);
+        fire(_assertThisInitialized(_this), 'onAppend', [trimmedValue], event);
+        if (typeof ((_this$_input$current = _this._input.current) === null || _this$_input$current === void 0 ? void 0 : _this$_input$current.scrollIntoView) === 'function') {
+          setTimeout(function () {
+            var _this$_input$current2;
+            if (typeof ((_this$_input$current2 = _this._input.current) === null || _this$_input$current2 === void 0 ? void 0 : _this$_input$current2.scrollIntoView) === 'function') {
+              _this._input.current.scrollIntoView({
+                block: 'nearest',
+                inline: 'nearest',
+                behavior: 'smooth'
+              });
+            }
+          }, 0);
+        }
+      }
+      if (key === 'Backspace' && !value) {
+        event.preventDefault();
+        fire(_assertThisInitialized(_this), 'onRemove', event);
+      }
+    });
+    _defineProperty(_assertThisInitialized(_this), "handlePaste", function (event) {
+      var _this$_input$current3;
+      var value = event.clipboardData.getData('text/plain');
+      var _this$asProps = _this.asProps,
+        delimiters = _this$asProps.delimiters,
+        onAdd = _this$asProps.onAdd,
+        onAppend = _this$asProps.onAppend;
+      var reg = new RegExp(delimiters.filter(function (s) {
+        return !/\w+/.test(String(s));
+      }).map(function (s) {
+        return s.replace(/[\\^$*+?.()|[\]{}]/g, '\\$&');
+      }).join('|'));
+      var tagsToBeAdded = value.split(reg).filter(Boolean);
+      if (tagsToBeAdded.length > 0) {
+        event.preventDefault();
+        var _iterator = _createForOfIteratorHelper(tagsToBeAdded),
+          _step;
+        try {
+          for (_iterator.s(); !(_step = _iterator.n()).done;) {
+            var tag = _step.value;
+            onAdd === null || onAdd === void 0 ? void 0 : onAdd(tag, event);
+          }
+        } catch (err) {
+          _iterator.e(err);
+        } finally {
+          _iterator.f();
+        }
+        onAppend === null || onAppend === void 0 ? void 0 : onAppend(tagsToBeAdded, event);
+      }
+      if (typeof ((_this$_input$current3 = _this._input.current) === null || _this$_input$current3 === void 0 ? void 0 : _this$_input$current3.scrollIntoView) === 'function') {
+        setTimeout(function () {
+          var _this$_input$current4;
+          if (typeof ((_this$_input$current4 = _this._input.current) === null || _this$_input$current4 === void 0 ? void 0 : _this$_input$current4.scrollIntoView) === 'function') {
+            _this._input.current.scrollIntoView({
+              block: 'nearest',
+              inline: 'nearest',
+              behavior: 'smooth'
+            });
+          }
+        }, 0);
+      }
+    });
+    _defineProperty(_assertThisInitialized(_this), "bindHandlerTagClick", function (editable) {
+      return function (event) {
+        if (!editable) return;
+        fire(_assertThisInitialized(_this), 'onRemove', event);
+      };
+    });
+    return _this;
+  }
+  _createClass(InputTags, [{
+    key: "getValueProps",
+    value: function getValueProps() {
+      return {
+        ref: this._input,
+        onKeyDown: this.handleKeyDown,
+        onPaste: this.handlePaste
+      };
+    }
+  }, {
+    key: "getTagProps",
+    value: function getTagProps(_ref7) {
+      var editable = _ref7.editable;
+      return {
+        size: this.asProps.size,
+        onClick: this.bindHandlerTagClick(editable)
+      };
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _ref = this.asProps,
+        _ref4;
+      var SInputTags = Input;
+      var _this$asProps2 = this.asProps,
+        Children = _this$asProps2.Children,
+        styles = _this$asProps2.styles;
+      var SListAriaWrapper = 'div';
+      return _ref4 = sstyled(styles), /*#__PURE__*/React.createElement(SInputTags, _ref4.cn("SInputTags", _objectSpread({}, _assignProps({
+        "tag": ScrollArea,
+        "onMouseDown": this.setFocusInput
+      }, _ref))), /*#__PURE__*/React.createElement(SListAriaWrapper, _ref4.cn("SListAriaWrapper", {
+        "role": 'list'
+      }), /*#__PURE__*/React.createElement(Children, _ref4.cn("Children", {}))));
+    }
+  }]);
+  return InputTags;
+}(Component);
+_defineProperty(InputTags, "displayName", 'InputTags');
+_defineProperty(InputTags, "style", style);
+_defineProperty(InputTags, "defaultProps", {
+  size: 'm',
+  delimiters: [',', ';', '|', 'Enter', 'Tab'],
+  defaultValue: ''
+});
+var Value = /*#__PURE__*/function (_Component2) {
+  _inherits(Value, _Component2);
+  var _super2 = _createSuper(Value);
+  function Value() {
+    var _this2;
+    _classCallCheck(this, Value);
+    for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+      args[_key2] = arguments[_key2];
+    }
+    _this2 = _super2.call.apply(_super2, [this].concat(args));
+    _defineProperty(_assertThisInitialized(_this2), "_spacer", /*#__PURE__*/React.createRef());
+    _defineProperty(_assertThisInitialized(_this2), "state", {
+      width: '10px'
+    });
+    _defineProperty(_assertThisInitialized(_this2), "handleChange", function (value) {
+      _this2.updateInputStyles(value);
+    });
+    _defineProperty(_assertThisInitialized(_this2), "updateInputStyles", function (value) {
+      var spacerNode = _this2._spacer.current;
+      if (!spacerNode) return;
+      var placeholder = _this2.props.placeholder;
+      /* for display cursor */
+      var magicOffset = 2;
+      if (placeholder && (value === undefined || value === '')) {
+        // @ts-ignore
+        spacerNode['innerText'] = placeholder;
+        /* for [placeholder] {
+            text-overflow: ellipsis;
+        }*/
+        magicOffset += 8;
+      } else {
+        spacerNode['innerText'] = value;
+      }
+      _this2.setState({
+        width: "".concat(Math.max(spacerNode['offsetWidth'], spacerNode['scrollWidth']) + magicOffset, "px")
+      });
+    });
+    return _this2;
+  }
+  _createClass(Value, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      this.updateInputStyles(this.asProps.value);
+    }
+  }, {
+    key: "componentDidUpdate",
+    value: function componentDidUpdate(prevProps) {
+      var _this$asProps3 = this.asProps,
+        value = _this$asProps3.value,
+        placeholder = _this$asProps3.placeholder;
+      if (value !== prevProps.value || placeholder !== prevProps.placeholder) {
+        this.updateInputStyles(value);
+      }
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _ref2 = this.asProps,
+        _ref5;
+      var SValue = Input.Value;
+      var SSpacer = 'div';
+      return _ref5 = sstyled(this.asProps.styles), /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SValue, _ref5.cn("SValue", _objectSpread({}, _assignProps2({
+        "style": {
+          width: this.state.width
+        },
+        "role": 'listitem'
+      }, _ref2)))), /*#__PURE__*/React.createElement(SSpacer, _ref5.cn("SSpacer", {
+        "ref": this._spacer,
+        "role": 'none'
+      })));
+    }
+  }]);
+  return Value;
+}(Component);
+function InputTag(props) {
+  var _ref3 = arguments[0],
+    _ref6;
+  var STag = Tag;
+  var onKeyDown = function onKeyDown(event) {
+    if (event.key === 'Enter') {
+      var _props$onClick;
+      (_props$onClick = props.onClick) === null || _props$onClick === void 0 ? void 0 : _props$onClick.call(props, event);
+      return false;
+    }
+  };
+  return _ref6 = sstyled(props.styles), /*#__PURE__*/React.createElement(STag, _ref6.cn("STag", _objectSpread({}, _assignProps3({
+    "data-value": props.value,
+    "role": 'listitem',
+    "onKeyDown": onKeyDown
+  }, _ref3))));
+}
+export default createComponent(InputTags, {
+  Value: Value,
+  Tag: [InputTag, {
+    Text: Tag.Text,
+    Close: Tag.Close,
+    Addon: Tag.Addon,
+    Circle: Tag.Circle
+  }]
+});
+//# sourceMappingURL=InputTags.js.map